/* ════════ SETTINGS — CONTROL CENTER (stw-*) — 100% redesign ════════
   Institutional two-column control center: sticky section nav + rich sections. Restyles the
   existing real controls (.setsec/.setrow/.swt/.seg/.setinp/.piav) under #v-settings only.
   Dark default + full light variant. */
/* immersive chrome — house pattern */
body[data-view=settings] .topbar .hdrL,
body[data-view=settings] .topbar .hdr-status,
body[data-view=settings] #btnSearch,
body[data-view=settings] #btnBell,
body[data-view=settings] #btnMail,
body[data-view=settings] #btnMore{display:none}
html:not(.wco-on) body[data-view=settings] .ticker{display:none}
html:not(.wco-on) body[data-view=settings] .app{padding-top:0}
html:not(.wco-on) body[data-view=settings] .side{top:0}
html:not(.wco-on) body[data-view=settings] .topbar{top:0}
html:not(.wco-on) body[data-view=settings] .sidetog{top:19px}
@media (min-width:901px){
  html:not(.wco-on) body[data-view=settings] .topbar{display:none}
  html:not(.wco-on) body[data-view=settings] .sidetog{top:10px}
}

#v-settings .stwwrap{
  --sbg:#07090f; --sl:rgba(255,255,255,.09); --stx:#f2f5fa; --smut:#8b95a7;
  --sac:#e23b3b; --sgold:#e8b93c; --sup:#00d084; --sdn:#ff4d4d;
  display:flex;flex-direction:column;gap:12px;color:var(--stx);
  background:radial-gradient(900px 300px at 50% -70px, rgba(226,59,59,.05), transparent 60%),var(--sbg);
  border-radius:14px;padding:14px;font-variant-numeric:tabular-nums;
}
#v-settings .stw-head{display:flex;align-items:center;gap:12px}
#v-settings .stw-ttl{font-size:20px;font-weight:900;letter-spacing:1px}
#v-settings .stw-sub{font-size:11.5px;font-weight:600;color:var(--smut);margin-top:3px}
#v-settings .stw-hbtns{margin-inline-start:auto;display:flex;gap:6px}
#v-settings .stw-hbtn{appearance:none;height:30px;min-width:30px;border-radius:9px;border:1px solid var(--sl);background:rgba(255,255,255,.02);color:var(--smut);cursor:pointer;font-size:13px}
#v-settings .stw-hbtn:hover{color:var(--stx)}
#v-settings .stw-body{display:grid;grid-template-columns:210px minmax(0,1fr);gap:12px;align-items:start}
#v-settings .stw-nav{position:sticky;top:12px;display:flex;flex-direction:column;gap:4px;
  border:1px solid var(--sl);border-radius:14px;padding:8px;background:linear-gradient(180deg,rgba(12,17,27,.94),rgba(6,9,15,.97))}
#v-settings .stw-nbtn{appearance:none;display:flex;align-items:center;gap:9px;border:0;background:transparent;color:var(--smut);
  font:inherit;font-size:12px;font-weight:800;border-radius:9px;padding:9px 11px;cursor:pointer;text-align:start;transition:all .15s}
#v-settings .stw-nbtn span{width:20px;text-align:center;flex:none}
#v-settings .stw-nbtn:hover{color:var(--stx);background:rgba(255,255,255,.04)}
#v-settings .stw-main{display:flex;flex-direction:column;gap:12px;min-width:0}
/* profile cross-link band */
#v-settings .stw-pro{display:flex;align-items:center;gap:14px;cursor:pointer;padding:13px 16px!important;
  border:1px solid rgba(232,185,60,.4)!important;background:linear-gradient(135deg,rgba(232,185,60,.1),rgba(232,185,60,.02))!important;transition:border-color .15s}
#v-settings .stw-pro:hover{border-color:rgba(232,185,60,.7)!important}
#v-settings .stw-pro-ic{font-size:24px}
#v-settings .stw-pro-b{flex:1;min-width:0}
#v-settings .stw-pro-b b{display:block;font-size:14px;font-weight:900;color:var(--sgold)}
#v-settings .stw-pro-b span{display:block;font-size:11px;font-weight:600;color:var(--smut);margin-top:3px;line-height:1.5}
#v-settings .stw-pro-go{font-size:18px;font-weight:900;color:var(--sgold)}
/* sections — restyle of the existing real markup */
#v-settings .setsec{background:linear-gradient(180deg,rgba(12,17,27,.94),rgba(6,9,15,.97));border:1px solid var(--sl);border-radius:15px;padding:14px 16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 14px 40px rgba(0,0,0,.3);scroll-margin-top:14px}
#v-settings .setsec-h{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:900;letter-spacing:1.4px;color:var(--sac);text-transform:uppercase;margin-bottom:10px}
#v-settings .setsec-ic{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;background:rgba(226,59,59,.1);border:1px solid rgba(226,59,59,.3)}
#v-settings .setrow{display:flex;align-items:center;gap:12px;padding:11px 2px;border-bottom:1px solid rgba(255,255,255,.05)}
#v-settings .setrow:last-child{border-bottom:none}
#v-settings .setrow-l{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
#v-settings .setrow-ic{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:14px;background:rgba(255,255,255,.03);border:1px solid var(--sl);flex:none}
#v-settings .setrow-t{font-size:13px;font-weight:800}
#v-settings .setrow-s{font-size:10.5px;font-weight:600;color:var(--smut);margin-top:2px;line-height:1.5}
#v-settings .setrow-c{flex:none;display:flex;align-items:center;gap:8px}
/* toggle switch */
#v-settings .swt{appearance:none;width:44px;height:24px;border-radius:999px;border:1px solid var(--sl);background:rgba(255,255,255,.06);cursor:pointer;position:relative;transition:all .2s;padding:0}
#v-settings .swt i{position:absolute;top:2px;inset-inline-start:2px;width:18px;height:18px;border-radius:50%;background:var(--smut);transition:all .2s}
#v-settings .swt.on{background:linear-gradient(135deg,var(--sac),#b81e26);border-color:rgba(226,59,59,.6);box-shadow:0 0 12px rgba(226,59,59,.3)}
#v-settings .swt.on i{inset-inline-start:22px;background:#fff}
/* segmented */
#v-settings .seg{display:inline-flex;gap:3px;border:1px solid var(--sl);border-radius:10px;padding:3px;background:rgba(255,255,255,.02)}
#v-settings .seg button{appearance:none;border:0;background:transparent;color:var(--smut);font:inherit;font-size:11px;font-weight:800;border-radius:7px;padding:6px 12px;cursor:pointer}
#v-settings .seg button.on{color:#fff;background:linear-gradient(135deg,var(--sac),#b81e26)}
/* inputs + buttons + badges */
#v-settings .setinp,#v-settings .setsel{background:rgba(255,255,255,.04);border:1px solid var(--sl);color:var(--stx);border-radius:9px;padding:9px 11px;font:inherit;font-size:12.5px}
#v-settings .setinp:focus,#v-settings .setsel:focus{outline:none;border-color:rgba(226,59,59,.5)}
#v-settings .btn{appearance:none;border:0;border-radius:9px;padding:9px 15px;font:inherit;font-size:12px;font-weight:900;cursor:pointer;color:#fff;background:linear-gradient(135deg,var(--sac),#b81e26)}
#v-settings .btn.ghost{color:var(--stx);background:rgba(255,255,255,.04);border:1px solid var(--sl)}
#v-settings .btn.ghost:hover{border-color:rgba(255,255,255,.25)}
#v-settings .btn.ghost.dgr,#v-settings .btn.danger{color:#ff8a94;border:1px solid rgba(226,59,59,.4);background:rgba(226,59,59,.07)}
#v-settings .btn.danger{font-weight:900}
#v-settings .setbadge{display:inline-flex;font-size:10px;font-weight:900;border-radius:999px;padding:4px 11px;border:1px solid var(--sl);color:var(--smut)}
#v-settings .setbadge.ok{color:var(--sup);border-color:rgba(0,208,132,.4);background:rgba(0,208,132,.07)}
#v-settings .setbadge.no{color:var(--sdn);border-color:rgba(255,77,77,.4);background:rgba(255,77,77,.07)}
/* account card */
#v-settings .setacc{display:flex;align-items:center;gap:13px}
#v-settings .setacc-av{position:relative;width:54px;height:54px;border-radius:50%;overflow:hidden;flex:none;display:flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:900;color:#0a0c12;background:radial-gradient(circle at 32% 28%,#ffe9a8,var(--sgold) 60%,#8a6206);border:2px solid rgba(232,185,60,.5)}
#v-settings .setacc-av img{width:100%;height:100%;object-fit:cover}
#v-settings .setacc-n{font-size:15px;font-weight:900}
#v-settings .setacc-i{flex:1;min-width:0}
/* personal info */
#v-settings .piav-row{display:flex;align-items:center;gap:14px;margin-bottom:12px}
#v-settings .piav{width:72px;height:72px;border-radius:50%;border:2px dashed rgba(232,185,60,.45);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;flex:none}
#v-settings .piav.has{border-style:solid}
#v-settings .piav-g{font-size:26px;opacity:.5}
#v-settings .piav.has .piav-g{display:none}
#v-settings .piav-btns{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
#v-settings .pihint{font-size:10px;font-weight:600;color:var(--smut)}
#v-settings .pifield{margin-bottom:10px}
#v-settings .pifield label{display:block;font-size:11px;font-weight:800;color:var(--smut);margin-bottom:5px}
#v-settings .pifield .setinp{width:100%}
#v-settings .pi3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
/* @username (Telegram-style handle) field + live availability status */
#v-settings .piuname{display:flex;align-items:center;gap:0}
#v-settings .piuname-at{display:flex;align-items:center;justify-content:center;min-width:30px;height:100%;align-self:stretch;padding:0 4px;font-weight:800;color:var(--smut);background:rgba(255,255,255,.03);border:1px solid var(--sline,rgba(255,255,255,.09));border-inline-end:0;border-radius:9px 0 0 9px}
html[dir=rtl] #v-settings .piuname-at{border-radius:0 9px 9px 0}
#v-settings .piuname .setinp{border-radius:0 9px 9px 0;flex:1;min-width:0}
html[dir=rtl] #v-settings .piuname .setinp{border-radius:9px 0 0 9px}
#v-settings .pihint.ok{color:var(--sup)}
#v-settings .pihint.no{color:var(--sdn)}
#v-settings .piuid{opacity:.85;letter-spacing:.3px;margin-top:3px}
#v-settings .pisave{display:flex;align-items:center;gap:10px;margin-top:4px}
#v-settings .pimsg{font-size:11.5px;font-weight:800}
#v-settings .pimsg.ok{color:var(--sup)}#v-settings .pimsg.no{color:var(--sdn)}
/* risk note + version */
#v-settings .setrisk{margin-top:12px;border:1px dashed rgba(226,59,59,.35);border-radius:11px;padding:11px 13px}
#v-settings .setrisk-t{font-size:11.5px;font-weight:900;color:var(--sac);margin-bottom:4px}
#v-settings .setrisk-b{font-size:11px;font-weight:600;color:var(--smut);line-height:1.65}
#v-settings .setver{font-size:11px;font-weight:800;color:var(--smut)}
#v-settings .setbtns{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
/* responsive */
@media (max-width:900px){
  #v-settings .stw-body{grid-template-columns:1fr}
  #v-settings .stw-nav{position:static;flex-direction:row;overflow-x:auto;scrollbar-width:none}
  #v-settings .stw-nbtn{white-space:nowrap}
  #v-settings .pi3{grid-template-columns:1fr}
}
/* light theme */
html[data-theme="light"] #v-settings .stwwrap{
  --sbg:#f5f6f9; --sl:rgba(16,24,40,.12); --stx:#1c2333; --smut:#5c6675;
  --sgold:#a87708; --sup:#0f9d63; --sdn:#d92d3a;
  background:radial-gradient(900px 300px at 50% -70px, rgba(226,59,59,.04), transparent 60%),#f5f6f9;
}
html[data-theme="light"] #v-settings .stw-nav,
html[data-theme="light"] #v-settings .setsec{background:linear-gradient(180deg,#ffffff,#f7f8fb);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 8px 24px rgba(16,24,40,.06)}
html[data-theme="light"] #v-settings .setrow{border-bottom-color:rgba(16,24,40,.07)}
html[data-theme="light"] #v-settings .setinp,html[data-theme="light"] #v-settings .setsel,
html[data-theme="light"] #v-settings .btn.ghost,html[data-theme="light"] #v-settings .seg,
html[data-theme="light"] #v-settings .setrow-ic{background:rgba(16,24,40,.02)}
html[data-theme="light"] #v-settings .swt{background:rgba(16,24,40,.08)}

/* ═══════════════════════════════════════════════════════════════════════════════
   PLATFORM SPECIFICATION (owner 2026-07-23) — the "what is this project" page a
   customer opens from About & Support. It renders inside the house #modal, so it
   inherits the overlay, the close button and the scroll behaviour; only its own
   internals are styled here. Tri-lingual: the wrapper carries dir=rtl for ar/ku,
   so lists, bullets and the footer buttons flip with the language.
   ═══════════════════════════════════════════════════════════════════════════ */
.apwrap{max-width:100%}
.aphead{text-align:center;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:14px}
.aptitle{font-size:26px;font-weight:900;letter-spacing:.04em;color:var(--gold)}
.apsub{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.6}
.apver{display:inline-block;margin-top:9px;font-size:10px;font-weight:800;letter-spacing:.09em;
  color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:3px 10px}
.apchips{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}
.apchip{background:var(--card2);border:1px solid var(--line);border-radius:11px;padding:10px 8px;text-align:center}
.apchip b{display:block;font-size:19px;font-weight:900;color:var(--txt);font-variant-numeric:tabular-nums}
.apchip span{display:block;font-size:9.5px;color:var(--muted);margin-top:2px;line-height:1.4}
.apsec{margin-bottom:15px}
.apsec-h{font-size:12.5px;font-weight:900;letter-spacing:.05em;color:var(--txt);margin-bottom:8px}
.apsec-b{font-size:12.5px;line-height:1.75;color:var(--txt2)}
.aplist{margin:0;padding-inline-start:18px}
.aplist li{margin-bottom:9px}
.aplist li b{color:var(--txt)}
.apnote{background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.25);border-radius:11px;
  padding:11px 13px;font-size:11.5px;line-height:1.7;color:var(--txt2);margin-bottom:14px}
.apfoot{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
@media(max-width:560px){
  .apchips{grid-template-columns:repeat(2,1fr)}
  .aptitle{font-size:22px}
}