:root{--bg:#07111f;--panel:#101d2e;--text:#f4f7fb;--muted:#a9b7c9;--teal:#35e0d0;--line:#26384d;--gold:#ffca68;--red:#ff7777;--green:#4be39a;--secondary:#23364c;--secondary-border:#40556d;--hover:#14253a;--user-msg:#1c3a52;--assistant-msg:#14253a}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,var(--bg),var(--panel) 60%,var(--bg));color:var(--text);font-family:Tahoma,Arial,sans-serif;min-height:100vh;padding-bottom:env(safe-area-inset-bottom)}
.wrap{max-width:960px;margin:auto;padding-inline:14px}
header{background:var(--header,#0a1524);border-bottom:1px solid var(--line);padding:14px 0;padding-top:max(14px,env(safe-area-inset-top))}
.bar{display:flex;justify-content:space-between;align-items:center;gap:10px}
.brand{display:flex;align-items:center;gap:12px}.logo{width:42px;height:42px;border-radius:13px;background:var(--teal);color:#07111f;display:grid;place-items:center;font-weight:900;font-size:23px}
.brand h1{font-size:22px;margin:0}.brand p{margin:3px 0 0;color:var(--muted);font-size:12px}
.bar-actions{display:flex;gap:8px}
.tabs{display:flex;gap:6px;overflow-x:auto;padding-block:12px;position:sticky;top:0;z-index:5;background:color-mix(in srgb, var(--header,#07111f) 94%, transparent);backdrop-filter:blur(6px)}
.tabs button{flex:0 0 auto;width:auto;margin:0;background:var(--tab,#16283d);color:var(--muted);border:1px solid var(--line);padding:9px 15px;border-radius:20px}
.tabs button.active{background:var(--teal);color:#06202a;border-color:var(--teal)}
main{padding-bottom:30px}
.tab{display:none}.tab.active{display:block}
.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:16px;margin-bottom:14px}
.card h2{font-size:17px;margin:0 0 12px}
.notice{padding:11px 14px;border:1px solid #38506a;border-radius:13px;background:var(--panel);color:var(--text);font-size:13px;line-height:1.8;margin-bottom:14px}
.notice:empty{display:none}.notice b{color:var(--gold)}
input,select,button,textarea{font:inherit;border-radius:11px;padding:11px;border:1px solid #354960;background:var(--input,#0a1727);color:var(--text);width:100%}
input::placeholder,textarea::placeholder{color:#8294aa}
button{background:var(--teal);color:#06202a;font-weight:700;border:0;cursor:pointer;margin-top:10px}
button.secondary,button.ghost{background:var(--secondary);color:var(--text);border:1px solid var(--secondary-border)}
button.ghost{margin:0;padding:8px 12px;width:auto;font-size:13px}
button.danger{background:#4a2330;color:#ffb3bd;border:1px solid #7a3446}
.row2{display:grid;grid-template-columns:1fr auto;gap:10px}.row2 button{margin-top:0;width:auto;padding-inline:20px}
.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:560px){.row3{grid-template-columns:1fr}}
label{display:block;margin-top:10px}
.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:right;padding:11px 7px;border-bottom:1px solid var(--line);white-space:nowrap}th{color:var(--muted);font-weight:600}
tr.clickable{cursor:pointer}tr.clickable:hover,tr.sel{background:var(--hover)}
.up{color:var(--green)}.down{color:var(--red)}.muted{color:var(--muted)}
.small{font-size:12px;line-height:1.8;color:var(--muted)}
.hidden{display:none!important}
td button{width:auto;margin:0;padding:5px 9px;font-size:12px;background:var(--secondary);color:var(--text);border:1px solid var(--secondary-border)}
.sym{font-weight:700}.name{font-size:11px;color:var(--muted);display:block}
canvas{width:100%;display:block}
.chart-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.seg{display:flex;gap:4px}.seg button{margin:0;width:auto;padding:6px 10px;font-size:12px;background:var(--tab,#16283d);color:var(--muted);border:1px solid var(--line)}.seg button.active{background:var(--teal);color:#06202a}
.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:11px;color:var(--muted);margin:8px 0}
.lg:before{content:"";display:inline-block;width:14px;height:3px;border-radius:2px;margin-left:5px;vertical-align:middle}
.l1:before{background:#35e0d0}.l2:before{background:#ffca68}.l3:before{background:#b48cff}.l4:before{background:#ff7777}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-top:12px}
.stat{background:var(--input,#0a1727);border:1px solid var(--line);border-radius:12px;padding:10px;font-size:13px}.stat b{display:block;font-size:12px;color:var(--muted);font-weight:600;margin-bottom:3px}
.summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin-bottom:12px}
.result{font-size:21px;font-weight:800;color:var(--teal);margin-top:12px}
.chat{max-height:50vh;overflow:auto;display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.msg{padding:10px 12px;border-radius:14px;font-size:14px;line-height:1.8;white-space:pre-wrap;max-width:92%}
.msg.u{background:var(--user-msg);align-self:flex-start}.msg.a{background:var(--assistant-msg);border:1px solid var(--line);align-self:flex-end}
.alert-item{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.alert-item button{width:auto;margin:0;padding:5px 9px;font-size:12px}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--panel);border:1px solid var(--teal);padding:12px 18px;border-radius:14px;font-size:14px;opacity:0;transition:.3s;z-index:20;max-width:90vw}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
footer{text-align:center;color:var(--muted);font-size:12px;padding:0 16px 25px}
textarea{resize:vertical}

.acts{display:flex;gap:4px;justify-content:flex-end}.acts button{min-width:34px;padding:6px 8px!important;font-size:14px!important}
@media(max-width:560px){th,td{padding:10px 5px;font-size:13px}}
@media(max-width:560px){td:first-child{white-space:normal;max-width:130px}.name{white-space:normal}}
.blist{max-height:320px;overflow:auto;margin-top:10px;border:1px solid var(--line);border-radius:12px}.brow{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid var(--line);font-size:14px}.brow:last-child{border:0}.brow .sym{min-width:58px}.brow .bn{flex:1;color:var(--muted);font-size:12px;text-align:right}.brow button{width:auto;margin:0;padding:5px 12px;font-size:13px}.brow button.on{background:#23364c;color:var(--muted)}
.l5:before{background:#4be39a}.advice{margin-top:14px;background:var(--input,#0a1727);border:1px solid var(--line);border-radius:14px;padding:12px 14px}.advice:empty{display:none}.advice h3{margin:0 0 8px;font-size:15px}.advice ul{margin:0 0 8px;padding-right:20px;line-height:1.9;font-size:14px}.advice button{margin-top:6px}

/* Appearance controls and theme-aware details */
.appearance-colors{margin:8px 0}
.appearance-colors input[type="color"]{height:46px;padding:4px;cursor:pointer}
.logo{color:var(--logo-text,#07111f)}
button{color:var(--logo-text,#06202a)}
.tabs button.active,.seg button.active{color:var(--logo-text,#06202a)}
.notice{border-color:var(--line)}


/* Subscription page */
.subscription-hero{max-width:680px;margin-inline:auto;text-align:center;padding:clamp(18px,4vw,32px)}
.eyebrow{font-size:11px;letter-spacing:2px;color:var(--teal);font-weight:800;margin:0 0 8px}
.subscription-hero h2{font-size:24px!important;margin-bottom:14px!important}
.sub-price{font-size:clamp(23px,5vw,34px);font-weight:900;color:var(--teal);margin:10px 0 16px}
.sub-features{display:grid;gap:8px;text-align:right;margin:18px 0;padding:14px;background:var(--input);border:1px solid var(--line);border-radius:12px;line-height:1.8}
#subInstructions{white-space:pre-wrap;text-align:right;line-height:1.9;margin-top:14px}
#subStatusNote{margin-top:12px}


/* Subscription workflow additions */
.sub-form,.sub-activate{display:grid;gap:9px;text-align:right;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.sub-form label,.sub-activate label{font-size:13px;color:var(--muted)}
.sub-form input,.sub-form textarea,.sub-activate input{width:100%;box-sizing:border-box}
.sub-activate h3{margin:0 0 4px;font-size:17px}
.sub-admin-list{display:grid;gap:10px;margin-top:14px}
.sub-admin-item{border:1px solid var(--line);border-radius:12px;padding:12px;text-align:right;overflow-wrap:anywhere}
.sub-admin-item h3{margin:0 0 8px;font-size:16px}
.sub-admin-item p{margin:5px 0;font-size:13px;color:var(--muted)}
.sub-admin-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.sub-admin-actions button{flex:1;min-width:105px}
.sub-code-result{padding:12px;border:1px dashed var(--teal);border-radius:10px;margin-top:10px;overflow-wrap:anywhere}

/* v5.5 compact home dashboard and thumb-friendly navigation */
.dashboard-welcome{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px}
.dashboard-welcome h2{font-size:22px;margin:0 0 4px}
.dashboard-welcome .small{margin:0}
.dashboard-welcome button{width:auto;flex:0 0 auto;margin:0}
.dashboard-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:14px}
.dash-stat{margin:0!important;text-align:right;min-width:0;padding:13px!important;border:1px solid var(--line)!important;border-radius:15px!important;background:var(--panel)!important;color:var(--text)!important;display:flex;flex-direction:column;gap:5px}
.dash-stat span,.dash-stat small{font-size:12px;color:var(--muted)}
.dash-stat strong{font-size:clamp(18px,4vw,25px);line-height:1.35;overflow-wrap:anywhere;color:var(--teal)}
.dash-stat small{font-weight:400}
.dash-stat .positive{color:var(--green)}.dash-stat .negative{color:var(--red)}
.dashboard-section{padding:14px}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.section-head h2{margin:0!important}
.section-head button{width:auto;margin:0;padding:7px 11px;font-size:12px}
.dashboard-watch{display:grid;gap:0}
.dash-watch-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;text-align:right;margin:0!important;padding:11px 2px!important;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;background:transparent!important;color:var(--text)!important}
.dash-watch-row:last-child{border-bottom:0!important}
.dash-watch-row span{display:grid;gap:3px;min-width:0}.dash-watch-row b{font-size:14px}.dash-watch-row small{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-watch-row strong{font-size:14px}.dash-watch-row em{font-style:normal;font-size:12px;direction:ltr;white-space:nowrap}
.dashboard-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:14px}
.dashboard-shortcuts button{display:flex;flex-direction:column;align-items:flex-start;text-align:right;gap:5px;margin:0;padding:14px!important;background:var(--panel)!important;border:1px solid var(--line)!important;color:var(--text)!important;border-radius:15px!important}
.dashboard-shortcuts button span{font-size:21px;color:var(--teal)}.dashboard-shortcuts button b{font-size:14px}.dashboard-shortcuts button small{font-size:11px;color:var(--muted);font-weight:400}
@media(max-width:560px){
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .wrap{padding-inline:11px}
  header{padding-bottom:10px}
  .brand h1{font-size:19px}.logo{width:38px;height:38px}
  .tabs{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;max-width:none;margin:0;padding:8px 7px calc(8px + env(safe-area-inset-bottom));gap:5px;overflow-x:auto;white-space:nowrap;border-top:1px solid var(--line);border-bottom:0;box-shadow:0 -8px 24px #0002;background:var(--header,#0a1524);backdrop-filter:blur(12px);scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{padding:10px 12px;font-size:12px;border-radius:13px;min-height:40px}
  .dashboard-welcome{align-items:flex-start;padding:14px;flex-direction:column}
  .dashboard-welcome button{width:100%}
  .dashboard-stats{gap:8px}.dash-stat{padding:11px!important}
  .dashboard-section{padding:12px}
  .dash-watch-row{gap:7px;grid-template-columns:minmax(0,1fr) auto auto}
  .dashboard-shortcuts{gap:8px}
}
@media(min-width:561px){.dashboard-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.dashboard-shortcuts{grid-template-columns:repeat(4,minmax(0,1fr))}}

canvas{touch-action:pan-y}
#dashMovers h3{margin:8px 0 4px}

/* ===== v6.0 visual refresh ===== */
:root{--r:20px;--shadow:0 10px 30px -14px rgba(0,0,0,.55);--glow:color-mix(in srgb,var(--teal) 22%,transparent)}
html{-webkit-tap-highlight-color:transparent;scroll-behavior:smooth}
body{background:radial-gradient(900px 420px at 85% -80px,var(--glow),transparent 70%),linear-gradient(180deg,var(--bg),var(--bg));line-height:1.6}
/* numbers keep sign/percent on the correct side in RTL */
.stat span,.summary .stat,td.up,td.down,.result,.dash-stat strong,.dash-stat .positive,.dash-stat .negative{unicode-bidi:plaintext}
td:nth-child(2),td:nth-child(3){unicode-bidi:plaintext}
/* header */
header{background:linear-gradient(180deg,color-mix(in srgb,var(--header,#0a1524) 92%,var(--teal)),var(--header,#0a1524));border-bottom:1px solid var(--line);position:sticky;top:0;z-index:6;backdrop-filter:blur(10px);padding-block:12px}
.logo{border-radius:14px;box-shadow:0 6px 18px -4px var(--teal);background:linear-gradient(135deg,var(--teal),color-mix(in srgb,var(--teal) 60%,#fff))}
.brand h1{letter-spacing:.2px}
button.ghost{border-radius:12px;font-weight:700}
/* cards */
.card{border-radius:var(--r);box-shadow:var(--shadow);background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 100%,#fff 3%),var(--panel))}
.card h2{display:flex;align-items:center;gap:8px;font-size:17px}
.card h2:before{content:"";width:4px;height:18px;border-radius:3px;background:var(--teal);flex:0 0 auto}
.dashboard-welcome h2:before,.subscription-hero h2:before,.section-head h2:before{display:none}
.section-head h2:before{display:block}
.dashboard-welcome{background:linear-gradient(135deg,color-mix(in srgb,var(--teal) 24%,var(--panel)),var(--panel) 65%);border-color:color-mix(in srgb,var(--teal) 35%,var(--line))}
/* controls */
input,select,textarea{border-radius:13px;border-color:var(--line);transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--glow)}
button{border-radius:13px;transition:transform .12s,filter .15s,opacity .15s}
button:active{transform:scale(.97)}button:hover{filter:brightness(1.07)}
button:disabled{opacity:.55}
/* dashboard tiles */
.dash-stat{border-radius:18px!important;position:relative;overflow:hidden;box-shadow:var(--shadow)}
.dash-stat:before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--teal),transparent)}
.dash-stat strong{font-size:clamp(20px,5.2vw,27px)}
.dashboard-shortcuts button{border-radius:18px!important;box-shadow:var(--shadow)}
.dashboard-shortcuts button span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--glow)}
.dash-watch-row{transition:background .15s}.dash-watch-row:active{background:var(--hover)!important}
.dash-watch-row em{padding:3px 8px;border-radius:9px;background:color-mix(in srgb,currentColor 14%,transparent);font-weight:700}
.dash-watch-row em.muted{background:transparent}
#dashMovers h3{color:var(--muted);font-weight:700;margin:12px 0 2px}
/* tables */
th{font-size:12px;text-transform:none;letter-spacing:.3px}
tr.clickable{transition:background .15s}
tr.sel{box-shadow:inset 3px 0 0 var(--teal)}
td.up,td.down{font-weight:700}
.stat{border-radius:14px;background:color-mix(in srgb,var(--input,#0a1727) 85%,var(--panel))}
.stat span{font-weight:700;font-size:15px}
.advice{border-radius:16px}
.msg{border-radius:16px}
.alert-item{border-radius:12px}
/* tab navigation */
.tabs button{transition:background .15s,color .15s,transform .12s;font-weight:700}
.tabs button.active{box-shadow:0 6px 16px -6px var(--teal)}
@media(max-width:560px){
  .tabs{left:10px;right:10px;width:auto;bottom:calc(10px + env(safe-area-inset-bottom));padding:7px;border:1px solid var(--line);border-radius:22px;box-shadow:0 14px 34px -10px rgba(0,0,0,.7);background:color-mix(in srgb,var(--header,#0a1524) 90%,transparent)}
  .tabs button{border:0;background:transparent;border-radius:16px}
  .tabs button.active{background:var(--teal)}
  body{padding-bottom:calc(92px + env(safe-area-inset-bottom))}
  .toast{bottom:calc(92px + env(safe-area-inset-bottom))}
  header{position:static}
}
/* motion */
.tab.active{animation:tabin .25s ease both}
@keyframes tabin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
footer{padding-bottom:30px}
html{background:var(--bg)}

/* markets overview, lists, news */
.idx-strip{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;margin-top:6px}
.idx-strip::-webkit-scrollbar{display:none}
.idx{flex:1 0 96px;padding:6px 12px;text-align:center;border-inline-start:1px dashed var(--line);display:grid;gap:6px}
.idx:first-child{border-inline-start:0}
.idx b{font-size:14px}.idx strong{font-size:15px;color:var(--muted);font-weight:600;unicode-bidi:plaintext}
.idx em{font-style:normal;font-weight:800;font-size:15px;direction:ltr;unicode-bidi:isolate}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{width:auto;margin:0;padding:8px 14px;border-radius:999px;background:var(--tab,#16283d);color:var(--muted);border:1px solid var(--line);font-weight:700}
.chip small{opacity:.7;margin-inline-start:4px}
.chip.on{background:var(--teal);color:var(--logo-text,#06202a);border-color:var(--teal)}
.chip.add{background:transparent;border-style:dashed}
.list-rows{display:grid}
.list-row{display:flex;align-items:center;gap:14px;text-align:right;margin:0!important;padding:12px 2px!important;background:transparent!important;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;color:var(--text)!important}
.list-row:last-child{border-bottom:0!important}
.list-row .li{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--hover,#14253a);color:var(--gold);font-size:20px;flex:0 0 auto}
.list-row.add .li{color:var(--muted);font-size:24px}
.list-row b{display:block;font-size:15px}.list-row small{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:2px}
.news-list{display:grid}
.news-item{display:grid;gap:5px;padding:12px 2px;border-bottom:1px solid var(--line);color:var(--text);text-decoration:none}
.news-item:last-child{border-bottom:0}
.news-item b{font-size:14px;line-height:1.7;font-weight:700}
.news-item small{color:var(--muted);font-size:11px}
.news-item:active{background:var(--hover)}