.remnote{
  margin: 2px calc(6*var(--u)) 0;
  font-size: calc(11.5*var(--u));
  line-height: 1.45;
  color: var(--m);
}.remnote[hidden]{
  display: none;
}#setd[open]{
  display: flex;
  flex-direction: column;
}#setd::backdrop{
  background: #030814cc;
}#setd [hidden]{
  display: none;
}.shead{
  flex: none;
  display: flex;
  align-items: center;
  gap: calc(12*var(--u));
  padding: calc(18*var(--u)) calc(20*var(--u)) calc(12*var(--u));
  border-bottom: 1px solid var(--sbd);
}#setd .shead h3{
  margin: 0;
  font-size: calc(20*var(--u));
  font-weight: 800;
  line-height: 1.1;
  color: var(--st);
}.ssub{
  font-size: calc(11*var(--u));
  font-weight: 600;
  color: var(--sbr);
}.sbody{
  flex: 1;
  overflow-y: auto;
  padding: calc(16*var(--u)) calc(20*var(--u)) calc(32*var(--u));
  display: flex;
  flex-direction: column;
  gap: calc(20*var(--u));
  -webkit-overflow-scrolling: touch;
}.sbrand{
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: calc(16*var(--u));
  padding: calc(16*var(--u));
  border-radius: calc(20*var(--u));
  color: #fff;
  flex: none;
  background: var(--grad-blue);
  box-shadow: 0 10px 30px rgba(var(--acc-rgb),.35);
  animation: sglow 4s ease-in-out infinite;
}.sbrand::after{
  content: "";
  position: absolute;
  right: calc(-24*var(--u));
  bottom: calc(-24*var(--u));
  width: calc(112*var(--u));
  height: calc(112*var(--u));
  border-radius: 50%;
  background: #ffffff1a;
  filter: blur(12px);
  pointer-events: none;
}.sbl{
  width: calc(56*var(--u));
  height: calc(56*var(--u));
  flex: none;
}.sbl img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}.sbt{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  z-index: 1;
}.sbt b{
  font-size: calc(18*var(--u));
  font-weight: 800;
}.sbt small{
  font-size: calc(12*var(--u));
  color: color-mix(in srgb, var(--p) 16%, #fff);
}.sbv{
  align-self: flex-start;
  margin-top: calc(6*var(--u));
  padding: 2px calc(10*var(--u));
  border-radius: calc(999*var(--u));
  background: #ffffff33;
  font-size: calc(10.5*var(--u));
  font-weight: 700;
}
@keyframes sglow {
  0%,100% {
    box-shadow: 0 8px 24px rgba(var(--acc-rgb),.28);
  }
  50% {
    box-shadow: 0 10px 34px rgba(var(--acc-rgb),.5);
  }
}
@keyframes spulse {
  0%,100% {
    opacity: 1;
  }
  50% {
    opacity: .35;
  }
}.ssearch{
  position: relative;
  flex: none;
}.ssearch input:focus{
  outline: 0;
  border-color: var(--acc);
}.ssec{
  display: flex;
  flex-direction: column;
  gap: calc(8*var(--u));
  flex: none;
}#setd .ssec > h4{
  margin: 0 calc(4*var(--u));
  font-size: calc(11*var(--u));
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sbr);
}.srow{
  display: flex;
  align-items: center;
  gap: calc(12*var(--u));
  width: 100%;
  padding: calc(14*var(--u));
  background: none;
  border: 0;
  border-bottom: 1px solid var(--sd);
  border-radius: 0;
  color: var(--st);
  font: inherit;
  text-align: start;
  cursor: pointer;
}.srow:last-child{
  border-bottom: 0;
}div.srow{
  cursor: default;
}button.srow:active{
  background: color-mix(in srgb,var(--sbr) 10%,transparent);
}.sic svg{
  width: calc(18*var(--u));
  height: calc(18*var(--u));
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}.stx{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}.stx b{
  font-size: calc(14*var(--u));
  font-weight: 600;
  color: inherit;
}.stx small{
  font-size: calc(11.5*var(--u));
  line-height: 1.3;
  color: var(--sm);
}.strail{
  display: flex;
  align-items: center;
  gap: calc(6*var(--u));
  flex: none;
  color: var(--sbr);
  font-size: calc(12.5*var(--u));
  font-weight: 600;
}.schev{
  width: calc(14*var(--u));
  height: calc(14*var(--u));
  fill: none;
  stroke: var(--sm);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: none;
}#setd .srow select.mi, #setd .srow .dd.mi, #setd .srow input.mi{
  width: auto;
  max-width: calc(140*var(--u));
  flex: none;
  padding: calc(7*var(--u)) calc(10*var(--u));
  border-radius: calc(12*var(--u));
  box-shadow: none;
  background: color-mix(in srgb,var(--sm) 14%,transparent);
  border: 1px solid var(--sbd);
  color: var(--st);
  font-size: calc(12.5*var(--u));
  font-weight: 600;
}#setd #otx, #setd .dd[data-for=otx]{
  color: var(--sbr);
}#setd .srow .sw::after{
  content: "";
  position: absolute;
  top: calc(3*var(--u));
  inset-inline-start: calc(3*var(--u));
  width: calc(20*var(--u));
  height: calc(20*var(--u));
  border-radius: 50%;
  background: #fff;
  transition: inset-inline-start .2s;
}#setd .srow[aria-checked=true] .sw{
  background: var(--p);
}#setd .srow[aria-checked=true] .sw::after{
  inset-inline-start: calc(21*var(--u));
}#setd .remnote{
  margin: 2px calc(6*var(--u)) 0;
  font-size: calc(11.5*var(--u));
  line-height: 1.5;
  color: var(--sm);
}.spromo{
  flex: none;
  display: flex;
  align-items: center;
  gap: calc(12*var(--u));
  width: 100%;
  padding: calc(16*var(--u));
  border: 0;
  border-radius: calc(20*var(--u));
  color: #fff;
  font: inherit;
  text-align: start;
  cursor: pointer;
  background: var(--grad-blue);
  box-shadow: 0 8px 20px rgba(var(--acc-rgb),.3);
}.spromo:active{
  transform: scale(.99);
}.spromo .stx b{
  font-size: calc(14*var(--u));
  font-weight: 700;
}.spromo .stx small{
  color: color-mix(in srgb, var(--p) 16%, #fff);
}.spgo{
  width: calc(32*var(--u));
  height: calc(32*var(--u));
  border-radius: 50%;
  background: #fff;
  display: grid;
  place-items: center;
  flex: none;
}.spgo .schev{
  stroke: var(--p);
}.srow.danger .sic{
  background: #f43f5e26;
  color: #fb7185;
}.srow.danger .stx b{
  color: #fb7185;
}.srow.danger .stx small{
  color: #fda4afa0;
}:root[data-theme=light] .srow.danger .sic, :root[data-theme=light] .srow.danger .stx b{
  color: #e11d48;
}:root[data-theme=light] .srow.danger .stx small{
  color: #e11d48aa;
}.qfon{
  margin-inline-start: auto;
  padding: 2px calc(8*var(--u));
  border-radius: calc(999*var(--u));
  background: var(--p);
  color: #fff;
  font-size: calc(10.5*var(--u));
  font-weight: 800;
  font-style: normal;
  margin: 0;
}#setd .ver{
  justify-content: center;
  flex: none;
  display: flex;
  align-items: center;
  gap: calc(8*var(--u));
  width: fit-content;
  margin: 0 auto;
  padding: calc(5*var(--u)) calc(14*var(--u));
  border-radius: calc(999*var(--u));
  background: var(--sc);
  border: 1px solid var(--sbd);
  font-size: calc(11.5*var(--u));
  font-weight: 600;
  color: var(--sm);
  cursor: pointer;
}#setd .ver::before{
  content: "";
  width: calc(8*var(--u));
  height: calc(8*var(--u));
  border-radius: 50%;
  background: #10b981;
  animation: spulse 2s ease-in-out infinite;
}#setd .ver .vn{
  color: var(--sbr);
  font-weight: 700;
}#setd .dev{
  flex: none;
  margin: calc(-10*var(--u)) 0 0;
  text-align: center;
  font-size: calc(12*var(--u));
  color: var(--sm);
}#setd .dev b{
  color: var(--sbr);
  font-weight: 700;
  letter-spacing: .03em;
}#setd .dev .heart{
  color: #f43f5e;
  font-size: calc(11*var(--u));
}#setd .sempty{
  text-align: center;
  font-size: calc(13*var(--u));
  color: var(--sm);
  margin: calc(8*var(--u)) 0;
}#setd #appshr svg{
  background: none;
  color: #fff;
}#setd #appshr .spgo svg{
  color: var(--p);
}#setd #inst{
  border-color: transparent;
  background: none;
  border: 0;
  border-bottom: 0;
  box-shadow: none;
  color: var(--st);
}#setd #inst svg{
  background: none;
  color: inherit;
}.fa{
  width: 1em;
  height: 1em;
  fill: currentColor;
  stroke: none;
  flex: none;
}.sic{
  border-radius: calc(12*var(--u));
  display: grid;
  place-items: center;
  flex: none;
  background: color-mix(in srgb,var(--acc) 16%,transparent);
  color: var(--sbr);
  width: calc(36*var(--u));
  height: calc(36*var(--u));
}#setd .sic svg, .spromo .sic svg{
  width: calc(15*var(--u));
  height: calc(15*var(--u));
  fill: currentColor;
  stroke: none;
}.spromo .sic{
  background: #ffffff33;
  color: #fff;
  width: calc(40*var(--u));
  height: calc(40*var(--u));
}.spromo .sic svg{
  width: calc(17*var(--u));
  height: calc(17*var(--u));
}.ssearch svg{
  position: absolute;
  inset-inline-start: calc(14*var(--u));
  top: 50%;
  transform: translateY(-50%);
  stroke-width: 2.2;
  stroke-linecap: round;
  width: calc(12*var(--u));
  height: calc(12*var(--u));
  fill: var(--sm);
  stroke: none;
}.ssearch input{
  width: 100%;
  padding: 0 calc(14*var(--u));
  padding-inline-start: calc(38*var(--u));
  border: 1px solid var(--sbd);
  background: var(--sc);
  color: var(--st);
  font: inherit;
  height: calc(42*var(--u));
  font-size: calc(12*var(--u));
  border-radius: calc(12*var(--u));
}.schev, .schev.fa{
  width: calc(10*var(--u));
  height: calc(10*var(--u));
  fill: var(--sm);
  stroke: none;
}.spgo svg{
  width: calc(12*var(--u));
  height: calc(12*var(--u));
  fill: var(--p);
  stroke: none;
}.srow.danger .sdng{
  width: calc(13*var(--u));
  height: calc(13*var(--u));
  fill: #fb7185;
}:root[data-theme=light] .srow.danger .sdng{
  fill: #e11d48;
}.sbrow{
  display: flex;
  align-items: center;
  gap: calc(8*var(--u));
  margin-top: calc(6*var(--u));
}.sbrow .sbv{
  margin-top: 0;
}.sbs{
  font-size: calc(11*var(--u));
  color: #bfdbfe;
}#woffv{
  font-size: calc(12*var(--u));
  font-weight: 500;
  color: var(--sbr);
}#setd .qfon{
  display: none;
}#setd .srow .sw[aria-checked=true]{
  background: var(--p);
}#setd .srow .sw[aria-checked=true]::after{
  inset-inline-start: calc(21*var(--u));
}#setd .srow .sw{
  display: block;
  position: relative;
  flex: none;
  width: calc(44*var(--u));
  height: calc(26*var(--u));
  border-radius: calc(26*var(--u));
  background: #475569;
  transition: background .2s;
  cursor: pointer;
}#setd #otx{
  font-weight: 600;
  color: var(--sbr);
}.schip{
  flex: none;
  padding: calc(5*var(--u)) calc(10*var(--u));
  border-radius: calc(10*var(--u));
  font-weight: 600;
  color: var(--sm);
  background: color-mix(in srgb,var(--sm) 14%,transparent);
  border: 1px solid var(--sbd);
  font-size: calc(10*var(--u));
}#fxb svg.spin{
  animation: sspin .8s linear infinite;
}
@keyframes sspin {
  to {
    transform: rotate(360deg);
  }
}#setd #appshr{
  border-color: transparent;
  border: 0;
  box-shadow: 0 8px 20px rgba(var(--acc-rgb),.3);
  color: #fff;
  background: var(--grad-blue);
}#setd .srow:not(.danger):not(.spromo) .sic, #setd .srow:not(.danger):not(.spromo) .sic svg{
  color: var(--sbr);
}#setd #inst .sic{
  color: var(--sbr);
  background: color-mix(in srgb,var(--acc) 16%,transparent);
}#setd .srow.danger .sic, #setd .srow.danger .sic svg{
  color: #fb7185;
}:root[data-theme=light] #setd .srow.danger .sic, :root[data-theme=light] #setd .srow.danger .sic svg{
  color: #e11d48;
}.tiles{
  flex-basis: 100%;
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: calc(8*var(--u));
}.tb{
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 calc(4*var(--u));
  border: 0;
  color: #fff;
  font: inherit;
  cursor: pointer;
  background: var(--grad-blue);
  box-shadow: 0 6px 16px rgba(var(--acc-rgb),.32),inset 0 1px 0 #ffffff33;
  transition: transform .15s,box-shadow .15s;
  height: calc(54*var(--u));
  gap: calc(4*var(--u));
  border-radius: calc(15*var(--u));
}.tb:active{
  transform: scale(.96);
  box-shadow: 0 3px 8px rgba(var(--acc-rgb),.3),inset 0 1px 0 #ffffff33;
}.tb .fa{
  fill: #fff;
  z-index: 1;
  width: calc(18*var(--u));
  height: calc(18*var(--u));
}.tbl{
  font-weight: 700;
  letter-spacing: .01em;
  z-index: 1;
  white-space: nowrap;
  font-size: calc(10.5*var(--u));
}.tb.tdel{
  background: linear-gradient(135deg,#16254a,#0d1731);
  box-shadow: inset 0 0 0 1px #fb718566,0 6px 16px rgba(0,0,0,.25);
  color: #fb7185;
}.tb.tdel .fa{
  fill: #fb7185;
}:root[data-theme=light] .tb.tdel{
  background: linear-gradient(135deg,#fff,#fff1f4);
  box-shadow: inset 0 0 0 1px #e11d4855,0 4px 12px rgba(225,29,72,.12);
  color: #e11d48;
}:root[data-theme=light] .tb.tdel .fa{
  fill: #e11d48;
}#setd{
  --sc: var(--s);
  --sbd: var(--b);
  --sd: var(--emp);
  --st: var(--t);
  --sm: var(--m);
  --sbr: color-mix(in srgb, var(--p) 55%, var(--t));
  width: min(100vw,calc(520*var(--u)));
  max-width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--st);
  overflow: hidden;
  background: var(--grad);
  background-color: var(--bg);
}.tb.tdel, :root[data-theme=light] .tb.tdel{
  background: var(--grad-blue);
  box-shadow: 0 6px 16px rgba(var(--acc-rgb),.32),inset 0 1px 0 #ffffff33;
  color: #fff;
}.tb.tdel .fa, :root[data-theme=light] .tb.tdel .fa{
  fill: #fff;
}
/* Hidden native <select> (the visible control is the .dd button). width, padding and border keep !important:
   #setd .srow select.mi and #qfd .qf-f .mi are more specific and would otherwise show the select again. */
select.dd-src{
  position: absolute;
  width: 1px !important;
  height: 1px;
  padding: 0 !important;
  margin: 0;
  border: 0 !important;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
}.dd{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(8*var(--u));
  text-align: start;
  cursor: pointer;
  color: inherit;
  font: inherit;
  font-size: inherit;
  border-radius: calc(14*var(--u));
  min-height: calc(44*var(--u));
  font-weight: 600;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}.dd .ddl{
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}.dd::after{
  content: "";
  flex: none;
  width: calc(14*var(--u));
  height: calc(14*var(--u));
  opacity: .75;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
  transition: transform .15s;
}.dd[aria-expanded=true]::after{
  transform: rotate(180deg);
}.sheetrow .dd::after{
  display: none;
}.rate-select.dd{
  gap: calc(4*var(--u));
}