/* ===== FuturesPro Replay — dark professional theme ===== */
:root{
  --bg:#0a0e17;
  --bg-2:#0f1521;
  --panel:#121a28;
  --panel-2:#162033;
  --line:#1e2a3d;
  --line-2:#27374f;
  --txt:#e6edf6;
  --txt-2:#9fb0c6;
  --muted:#67788f;
  --accent:#5d3eaa;
  --accent-2:#6b46c1;
  --long:#16c784;
  --long-dim:#0e7d56;
  --short:#f6465d;
  --short-dim:#9c2b3a;
  --gold:#f5b942;
  --bg-grad:#15233b;
  --radius:12px;
  --radius-sm:8px;
  --shadow:0 8px 30px rgba(0,0,0,.35);
  --mono:'SF Mono',ui-monospace,'Roboto Mono',Menlo,Consolas,monospace;
  --sans:'Manrope','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --display:'Unbounded','Manrope',sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:radial-gradient(1200px 600px at 80% -10%,var(--bg-grad) 0%,var(--bg) 55%) fixed;
  color:var(--txt);
  font-family:var(--sans);
  font-size:14px;
  -webkit-font-smoothing:antialiased;
}
#app{max-width:1480px;margin:0 auto;padding:14px 20px 18px;display:flex;flex-direction:column;gap:14px}
.muted{color:var(--muted)}
.hidden{display:none !important}
b{font-weight:600}
code{font-family:var(--mono);background:var(--panel-2);padding:2px 6px;border-radius:6px;color:var(--txt-2)}

/* ===== Top bar ===== */
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  background:linear-gradient(180deg,var(--panel) 0%,var(--bg-2) 100%);
  border:1px solid var(--line);border-radius:var(--radius);
  padding:12px 16px;box-shadow:var(--shadow);
}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{
  width:42px;height:42px;border-radius:11px;display:grid;place-items:center;
  font-weight:800;letter-spacing:.5px;color:#fff;
  background:linear-gradient(135deg,var(--accent) 0%,#4f3293 100%);
  box-shadow:0 6px 18px rgba(93,62,170,.35);
}
.brand-text{display:flex;flex-direction:column;line-height:1.15}
.brand-name{font-size:16px;font-weight:600}
.brand-name b{color:var(--accent);font-weight:800}
.brand-sub{font-size:11.5px;color:var(--muted)}

.controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.seg{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:3px;gap:2px}
.seg-btn{
  border:0;background:transparent;color:var(--txt-2);font-weight:600;font-size:13px;
  padding:7px 12px;border-radius:7px;cursor:pointer;transition:.15s;font-family:var(--mono)
}
.seg-btn:hover{color:var(--txt)}
.seg-btn.active{background:var(--accent);color:#fff;box-shadow:0 2px 8px rgba(93,62,170,.4)}

.btn{
  border:1px solid var(--line-2);background:var(--panel-2);color:var(--txt);
  padding:9px 16px;border-radius:9px;font-weight:600;font-size:13px;cursor:pointer;transition:.15s;
  display:inline-flex;align-items:center;gap:7px
}
.btn:hover{border-color:var(--accent);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-primary{background:linear-gradient(180deg,var(--accent) 0%,var(--accent-2) 100%);border-color:transparent;color:#fff}
.btn-primary:hover{box-shadow:0 6px 18px rgba(93,62,170,.4)}
.btn-ghost{background:transparent}
.dot{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold)}

/* ===== Workspace ===== */
.workspace{display:grid;grid-template-columns:1fr 340px;gap:16px;align-items:start}

.chart-card,.panel,.journal-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)
}
.chart-card{overflow:hidden}
.chart-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap;gap:8px}
.chart-id{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.chip{font-family:var(--mono);font-size:12px;font-weight:600;padding:5px 10px;border-radius:7px;background:var(--accent);color:#fff}
.chip.ghost{background:var(--bg);color:var(--txt-2);border:1px solid var(--line)}
.chart-meta{font-size:12px;display:flex;gap:8px;align-items:center}
.sep{color:var(--line-2)}

.chart{width:100%;height:clamp(440px, calc(100vh - 280px), 820px);position:relative}

.chart-foot{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-top:1px solid var(--line);gap:12px;flex-wrap:wrap}
.hint{font-size:13px;color:var(--txt-2)}
.reveal-controls{display:flex;gap:8px}

/* ===== Side panel ===== */
.side{display:flex;flex-direction:column;gap:16px}
.panel{padding:16px}
.panel-title{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;margin-bottom:12px}

.dir-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.dir{
  border:1.5px solid var(--line-2);background:var(--bg);border-radius:10px;padding:12px;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:2px;transition:.15s;color:var(--txt-2)
}
.dir-label{font-weight:800;font-size:16px;letter-spacing:.5px;font-family:var(--mono)}
.dir-sub{font-size:11px}
.dir.long:hover,.dir.long.active{border-color:var(--long);background:rgba(22,199,132,.12);color:var(--long)}
.dir.short:hover,.dir.short.active{border-color:var(--short);background:rgba(246,70,93,.12);color:var(--short)}

.field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.field label{font-size:12px;color:var(--txt-2);font-weight:500}
.field input{
  background:var(--bg);border:1px solid var(--line-2);border-radius:8px;color:var(--txt);
  padding:10px 12px;font-size:14px;font-family:var(--mono);font-weight:600;outline:none;transition:.15s;width:100%
}
.field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(93,62,170,.15)}
.readout{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-family:var(--mono);font-weight:700;font-size:15px}
.readout.small{font-size:14px;text-align:center}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.risk-row{display:flex;justify-content:space-between;font-size:13px;margin:6px 0 14px;font-family:var(--mono)}

.btn-submit{
  width:100%;justify-content:center;padding:13px;font-size:14px;border:0;cursor:pointer;
  background:linear-gradient(180deg,#2a3850,#1d2738);color:var(--muted);border-radius:10px;font-weight:700
}
.btn-submit.ready{background:linear-gradient(180deg,var(--accent),var(--accent-2));color:#fff;cursor:pointer}
.btn-submit.ready:hover{box-shadow:0 6px 18px rgba(93,62,170,.4)}
.btn-submit:disabled{cursor:not-allowed}
.ticket-note{font-size:11px;margin-top:10px;text-align:center}

/* Result */
.result-badge{font-size:22px;font-weight:800;text-align:center;padding:14px;border-radius:10px;margin-bottom:14px;font-family:var(--mono)}
.result-badge.win{background:rgba(22,199,132,.14);color:var(--long);border:1px solid var(--long-dim)}
.result-badge.loss{background:rgba(246,70,93,.14);color:var(--short);border:1px solid var(--short-dim)}
.result-badge.flat{background:var(--panel-2);color:var(--txt-2);border:1px solid var(--line-2)}
.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.result-grid>div{display:flex;flex-direction:column;gap:3px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px}
.result-grid b{font-family:var(--mono);font-size:16px}
.wide{width:100%;justify-content:center}

/* Stats */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}
.stat{display:flex;flex-direction:column;align-items:center;gap:3px;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:11px 6px}
.stat-val{font-family:var(--mono);font-weight:700;font-size:16px}
.stat-key{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.link-btn{background:none;border:0;color:var(--muted);font-size:12px;cursor:pointer;text-decoration:underline;padding:2px}
.link-btn:hover{color:var(--short)}

/* ===== Journal ===== */
.journal-card{padding:16px}
.journal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.journal-wrap{overflow-x:auto}
.journal{width:100%;border-collapse:collapse;font-size:13px}
.journal th{text-align:right;color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.04em;padding:8px 12px;border-bottom:1px solid var(--line)}
.journal th:nth-child(-n+4){text-align:left}
.journal td{padding:9px 12px;border-bottom:1px solid var(--line);font-family:var(--mono);text-align:right}
.journal td:nth-child(-n+4){text-align:left}
.journal tr:hover td{background:var(--panel-2)}
.journal .empty td{text-align:center;color:var(--muted);font-family:var(--sans);padding:18px}
.tag{padding:2px 8px;border-radius:6px;font-size:11px;font-weight:700}
.tag.long{background:rgba(22,199,132,.14);color:var(--long)}
.tag.short{background:rgba(246,70,93,.14);color:var(--short)}
.pos{color:var(--long)}
.neg{color:var(--short)}

/* ===== Footer / overlay ===== */
.footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--txt-2);padding:4px 4px 0}
.overlay{position:fixed;inset:0;background:rgba(5,8,13,.78);backdrop-filter:blur(4px);display:grid;place-items:center;z-index:50}
.overlay-box{background:var(--panel);border:1px solid var(--line-2);border-radius:14px;padding:28px;max-width:440px;text-align:center;box-shadow:var(--shadow)}
.overlay-box h3{margin-bottom:10px}
.overlay-box p{line-height:1.5}

/* ===== Responsive ===== */
@media (max-width:1040px){
  .workspace{grid-template-columns:1fr}
  .chart{height:420px}
}
@media (max-width:560px){
  #app{padding:10px 10px 30px}
  .controls{width:100%;justify-content:flex-start}
  .chart{height:340px}
  .stat-grid{grid-template-columns:repeat(2,1fr)}
}


/* ---- entry mode + reveal player (v2) ---- */
.entry-mode{display:flex;width:100%;margin-bottom:14px}
.entry-mode .seg-btn{flex:1;text-align:center}
.entry-hint{font-size:11.5px;margin-top:7px;line-height:1.35}
.chart-foot .reveal-controls{align-items:center}
.reveal-progress{font-family:var(--mono);font-size:12px;color:var(--txt-2);margin-right:auto;padding-left:2px;letter-spacing:.02em}
.dir.active{box-shadow:0 0 0 3px rgba(255,255,255,.04)}


/* ---- reveal player (v2) ---- */
.player{display:flex;flex-direction:column;gap:10px;width:100%}
.player-track{height:6px;background:var(--bg);border:1px solid var(--line);border-radius:99px;overflow:hidden}
.player-fill{height:100%;width:0;background:linear-gradient(90deg,var(--accent),#4f3293);transition:width .15s ease}
.player-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pbtn{border:1px solid var(--line-2);background:var(--panel-2);color:var(--txt);padding:8px 14px;border-radius:9px;font-weight:600;font-size:13px;cursor:pointer;transition:.15s;font-family:var(--mono)}
.pbtn:hover{border-color:var(--accent);transform:translateY(-1px)}
.pbtn.play{min-width:104px;text-align:center}
.pbtn.primary{background:linear-gradient(180deg,var(--accent),var(--accent-2));border-color:transparent;color:#fff}
.player .reveal-progress{margin-left:4px}
.seg.speed{margin-left:auto}
.seg.speed .seg-btn{padding:6px 10px;font-size:12px}


/* ---- start / home screen ---- */
.start-screen{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px;overflow:auto;
  background:radial-gradient(1000px 520px at 50% -8%,#16263f 0%,#06090f 62%)}
.start-card{width:100%;max-width:720px;background:var(--panel);border:1px solid var(--line-2);border-radius:18px;box-shadow:var(--shadow);padding:30px}
.start-brand{display:flex;gap:16px;align-items:center;margin-bottom:24px}
.brand-mark.big{width:58px;height:58px;border-radius:15px;font-size:21px}
.start-title{font-size:24px;font-weight:700;line-height:1.1}
.start-title b{color:var(--accent);font-weight:800}
.start-tag{font-size:13px;color:var(--txt-2);margin-top:5px;max-width:540px;line-height:1.45}
.start-section{margin-bottom:18px}
.start-label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;margin-bottom:10px}
.inst-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.inst-card{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:1.5px solid var(--line-2);background:var(--bg);border-radius:12px;padding:13px 16px;cursor:pointer;transition:.15s;color:var(--txt)}
.inst-card:hover{border-color:var(--accent);transform:translateY(-1px)}
.inst-card.active{border-color:var(--accent);background:rgba(93,62,170,.1)}
.ic-sym{font-family:var(--mono);font-weight:800;font-size:18px;letter-spacing:.5px}
.ic-name{font-size:13px;color:var(--txt-2)}
.ic-meta{font-size:11.5px;color:var(--muted);font-family:var(--mono);margin-top:2px}
.start-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.start-seg{width:100%;display:flex}
.start-seg .seg-btn{flex:1;text-align:center}
.start-go{width:100%;justify-content:center;padding:14px;font-size:15px;margin-top:8px}
.brand-mark#brandMark{cursor:pointer}
@media (max-width:560px){.inst-grid{grid-template-columns:1fr}.start-row{grid-template-columns:1fr}}


/* ---- settings modal + light theme ---- */
.modal{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:20px;background:rgba(4,8,14,.6);backdrop-filter:blur(3px)}
.modal-card{width:100%;max-width:420px;background:var(--panel);border:1px solid var(--line-2);border-radius:16px;box-shadow:var(--shadow);padding:22px}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.modal-head .panel-title{margin-bottom:0}
.modal-close{background:none;border:0;color:var(--muted);font-size:16px;cursor:pointer;line-height:1}
.modal-close:hover{color:var(--short)}
.set-section{margin-bottom:16px}
.set-label{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;margin-bottom:8px}
.set-seg{display:flex;width:100%}
.set-seg .seg-btn{flex:1;text-align:center}
#settingsBtn{font-size:15px;padding:9px 13px}

body.light{--bg:#eef2f7;--bg-2:#e6ebf2;--panel:#ffffff;--panel-2:#f1f4f9;--line:#e2e8f1;--line-2:#cdd6e2;--txt:#0e1726;--txt-2:#46566b;--muted:#7b899e;--shadow:0 8px 30px rgba(20,40,80,.10)}
body.light{background:radial-gradient(1200px 600px at 80% -10%,#dbe7f7 0%,#eef2f7 55%) fixed}
body.light .seg-btn.active{color:#fff}
body.light .chip.ghost{background:#eef2f7}


/* ---- instrument chip as menu trigger ---- */
.chip-btn{cursor:pointer}
.chip-btn::after{content:" \25BE";opacity:.75}
.chip-btn:hover{filter:brightness(1.12)}


/* ---- chart drawing tools ---- */
.chart-tools{display:flex;gap:6px;align-items:center}
.tool-btn{border:1px solid var(--line-2);background:var(--panel-2);color:var(--txt-2);padding:6px 11px;border-radius:8px;font-size:12.5px;font-weight:600;cursor:pointer;transition:.15s;font-family:var(--mono)}
.tool-btn:hover{border-color:var(--accent);color:var(--txt)}
.tool-btn.active{background:var(--accent);color:#fff;border-color:transparent}


/* ---- fullscreen chart ---- */
.chart-card:fullscreen{width:100vw;height:100vh;background:var(--bg);display:flex;flex-direction:column;border-radius:0}
.chart-card:fullscreen .chart{height:auto;flex:1 1 auto}


/* ---- manual close button ---- */
.pbtn.close{border-color:var(--gold);color:var(--gold)}
.pbtn.close:hover{background:rgba(245,185,66,.12);border-color:var(--gold)}


/* ---- drawing toolbar (v2) ---- */
.draw-toolbar-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:8px 14px;border-bottom:1px solid var(--line);background:var(--bg-2)}
.draw-bar{display:flex;gap:4px;flex-wrap:wrap}
.dtool{min-width:32px;height:30px;border:1px solid var(--line-2);background:var(--panel-2);color:var(--txt-2);border-radius:7px;font-size:13px;font-weight:700;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);padding:0 8px}
.dtool:hover{border-color:var(--accent);color:var(--txt)}
.dtool.active{background:var(--accent);color:#fff;border-color:transparent}
.dtool.danger{color:var(--short)}
.dtool.danger:hover{border-color:var(--short);color:var(--short)}
.draw-style{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ds-sw{width:18px;height:18px;border-radius:50%;cursor:pointer;border:2px solid transparent;box-shadow:0 0 0 1px var(--line-2);display:inline-block}
.ds-sw.active{border-color:var(--txt)}
.ds-sep{width:1px;height:18px;background:var(--line-2);margin:0 3px}
.ds-w,.ds-d{height:26px;border:1px solid var(--line-2);background:var(--panel-2);color:var(--txt-2);border-radius:6px;cursor:pointer;font-size:11px;font-family:var(--mono);padding:0 8px}
.ds-w.active,.ds-d.active{background:var(--accent);color:#fff;border-color:transparent}
.fpdraw-svg{overflow:visible}


/* ---- expanded settings ---- */
.modal-card{max-height:88vh;overflow:auto}
.set-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.set-color{width:46px;height:30px;border:1px solid var(--line-2);border-radius:7px;background:var(--bg);cursor:pointer;padding:2px}
.set-cc{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--txt-2)}
.set-hint{font-size:11.5px;color:var(--muted)}


/* ---- themes + hotkeys ---- */
.theme-seg{flex-wrap:wrap;gap:4px}
.hk-list{display:flex;flex-direction:column;gap:8px}
.hk{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:13px}
.hk b{font-family:var(--mono);background:var(--bg);border:1px solid var(--line-2);border-radius:6px;padding:3px 8px;color:var(--txt);font-weight:700}
.hk span{color:var(--txt-2);text-align:right}
#hotkeysBtn{font-size:15px;padding:9px 12px}

.ds-color{width:28px;height:22px;border:1px solid var(--line-2);border-radius:6px;background:var(--bg);cursor:pointer;padding:1px;vertical-align:middle}


/* ===== lighter & simpler pass (2026-06-18) ===== */
:root{ --shadow:0 4px 16px rgba(0,0,0,.18); }
.topbar,.chart-card,.panel,.journal-card{ box-shadow:0 2px 10px rgba(0,0,0,.13); }
.topbar{ background:var(--panel); }
.btn:hover{ transform:none; }
.btn-primary:hover{ transform:none; }
.seg-btn.active{ box-shadow:none; }
.btn-primary{ box-shadow:none; }

/* clean player toolbar */
.player{ display:flex; flex-direction:row; align-items:center; gap:10px; flex-wrap:wrap; width:100%; }
.player.hidden{ display:none !important; }
.player .reveal-progress{ margin-left:0; }
.pbtn.icon{ display:inline-flex; width:38px; min-width:38px; padding:8px 0; align-items:center; justify-content:center; font-size:13px; }
.scrub{ -webkit-appearance:none; appearance:none; flex:1 1 160px; min-width:120px; height:6px; padding:0; border:none; border-radius:6px; background:var(--line-2); outline:none; cursor:pointer; align-self:center; }
.scrub::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:15px; height:15px; border-radius:50%; background:var(--accent); border:2px solid var(--panel); cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,.3); }
.scrub::-moz-range-thumb{ width:14px; height:14px; border:2px solid var(--panel); border-radius:50%; background:var(--accent); cursor:pointer; }
.reveal-progress{ font-family:var(--mono); font-size:12px; color:var(--txt-2); min-width:52px; text-align:center; }

/* drawing tools toggle */
#toolsToggle.active{ background:var(--accent); color:#fff; border-color:transparent; }
.draw-toolbar-row{ animation:fpfade .16s ease; }
@keyframes fpfade{ from{opacity:0; transform:translateY(-2px);} to{opacity:1; transform:none;} }


/* ===== clean line icons ===== */
.ic{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none; display:inline-block; vertical-align:middle; }
.ic-fill{ fill:currentColor; stroke:none; }
.btn, .pbtn, .tool-btn{ display:inline-flex; align-items:center; justify-content:center; gap:7px; }
.icon-btn{ padding:9px 11px; }
.pbtn.icon{ gap:0; }
.pbtn.icon .ic{ width:15px; height:15px; }
.tool-btn .ic, .btn-ghost .ic{ width:17px; height:17px; }
.start-go .ic{ width:18px; height:18px; }
.result-badge{ display:flex; align-items:center; justify-content:center; gap:9px; }
.result-badge .ic{ width:22px; height:22px; }


/* ===== language select (pretty) ===== */
.set-select{ width:100%; -webkit-appearance:none; appearance:none;
  background-color:var(--bg);
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%239fb0c6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>');
  background-repeat:no-repeat; background-position:right 12px center;
  border:1px solid var(--line-2); border-radius:9px; color:var(--txt);
  font-family:var(--sans); font-size:14px; font-weight:600;
  padding:10px 38px 10px 12px; cursor:pointer; transition:.15s; }
.set-select:hover{ border-color:var(--accent); }
.set-select:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(93,62,170,.15); }
.set-select option{ background:var(--panel); color:var(--txt); font-weight:600; }


/* ===== session selector + synthetic ===== */
.topbar-select{ -webkit-appearance:none; appearance:none; background-color:var(--bg);
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="%239fb0c6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>');
  background-repeat:no-repeat; background-position:right 9px center;
  border:1px solid var(--line); border-radius:10px; color:var(--txt-2);
  font-family:var(--sans); font-size:13px; font-weight:600; padding:8px 28px 8px 11px; cursor:pointer; transition:.15s; }
.topbar-select:hover{ color:var(--txt); border-color:var(--line-2); }
.topbar-select:focus{ outline:none; border-color:var(--accent); }
.topbar-select option{ background:var(--panel); color:var(--txt); font-weight:600; }
.inst-card.syn .ic-sym{ color:var(--accent); }
#chipSession{ background:rgba(93,62,170,.14); color:var(--accent); }


/* ===== equity curve ===== */
.equity{ margin:2px 0 12px; }
.eq-svg{ width:100%; height:54px; display:block; }
.eq-zero{ stroke:var(--line-2); stroke-width:1; stroke-dasharray:3 3; }


/* ===== draw-tool icons ===== */
.dtool{ display:inline-flex; align-items:center; justify-content:center; }
.dtool .ic{ width:16px; height:16px; }


/* ===== leaderboard ===== */
.lb-me{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px; }
.lb-prof{ display:flex; align-items:center; gap:8px; flex:1; min-width:0; }
.lb-dot{ width:14px; height:14px; border-radius:50%; flex:none; }
.lb-name-input{ flex:1; min-width:0; background:var(--bg); border:1px solid var(--line-2); border-radius:8px; color:var(--txt); font-family:var(--sans); font-weight:600; font-size:14px; padding:7px 10px; outline:none; transition:.15s; }
.lb-name-input:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(93,62,170,.15); }
.lb-rankbox{ text-align:right; flex:none; }
.lb-rank-label{ display:block; font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; }
.lb-rank{ font-family:var(--mono); font-weight:700; font-size:16px; }
.lb-date{ font-size:12px; margin-bottom:8px; }
.lb-list{ display:flex; flex-direction:column; gap:3px; max-height:46vh; overflow:auto; }
.lb-row{ display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px; background:var(--bg); font-size:13px; }
.lb-row.me{ background:rgba(93,62,170,.14); outline:1px solid var(--accent); }
.lb-pos{ width:26px; font-family:var(--mono); color:var(--muted); font-weight:700; text-align:center; flex:none; }
.lb-nm{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.lb-ai{ font-size:9.5px; color:var(--muted); border:1px solid var(--line-2); border-radius:4px; padding:1px 4px; vertical-align:middle; }
.lb-ins{ font-family:var(--mono); font-size:11.5px; color:var(--txt-2); flex:none; }
.lb-r{ font-family:var(--mono); font-weight:700; min-width:58px; text-align:right; flex:none; }
.lb-empty{ text-align:center; color:var(--muted); padding:18px; }
.lb-note{ font-size:11.5px; margin-top:10px; text-align:center; }


/* ===== leaderboard medals ===== */
.lb-pos-1{ color:#f5b942; }
.lb-pos-2{ color:#cbd5e1; }
.lb-pos-3{ color:#d08b5b; }
.lb-row:nth-child(1){ background:rgba(245,185,66,.07); }


/* ===== daily challenge rank reveal ===== */
.daily-rank{ display:flex; align-items:center; justify-content:space-between; gap:10px; background:rgba(93,62,170,.1); border:1px solid var(--accent); border-radius:10px; padding:10px 12px; margin-bottom:12px; }
.dr-info{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.dr-label{ font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; }
.dr-val{ font-family:var(--mono); font-weight:800; font-size:18px; color:var(--accent); }
.dr-btn{ background:var(--accent); color:#fff; border:0; border-radius:8px; padding:8px 13px; font-weight:700; font-size:12px; cursor:pointer; flex:none; transition:.15s; }
.dr-btn:hover{ filter:brightness(1.08); }
.daily-rank.reveal{ animation:drPop .42s cubic-bezier(.2,.8,.2,1); }
@keyframes drPop{ 0%{transform:scale(.85);opacity:0} 60%{transform:scale(1.04)} 100%{transform:scale(1);opacity:1} }


/* ===== ranks & gamification ===== */
.rank-chip{ display:inline-flex; align-items:center; gap:6px; padding:7px 11px; }
.rank-chip .rk-nm{ font-size:13px; font-weight:700; }
.rank-chip .rk-dv{ font-family:var(--mono); font-size:11px; color:var(--muted); font-weight:700; }
.rk-emb{ filter:drop-shadow(0 1px 2px rgba(0,0,0,.4)); flex:none; vertical-align:middle; }
.rank-card{ display:flex; align-items:center; gap:12px; background:var(--bg); border:1px solid var(--line-2); border-radius:12px; padding:12px; margin-bottom:12px; }
.rc-emb{ position:relative; flex:none; display:grid; place-items:center; }
.rc-dv{ position:absolute; font-family:var(--mono); font-weight:800; font-size:13px; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.7); }
.rc-main{ flex:1; min-width:0; }
.rc-name{ font-weight:800; font-size:15px; margin-bottom:7px; }
.rc-bar{ height:8px; background:var(--panel-2); border-radius:99px; overflow:hidden; }
.rc-fill{ height:100%; border-radius:99px; transition:width .6s cubic-bezier(.2,.8,.2,1); }
.rc-sub{ font-size:11.5px; color:var(--muted); margin-top:6px; }
.rating-pop{ position:fixed; left:50%; top:36%; transform:translate(-50%,0); font-family:var(--mono); font-weight:800; font-size:30px; pointer-events:none; opacity:0; z-index:120; text-shadow:0 2px 12px rgba(0,0,0,.5); }
.rating-pop.pos{ color:var(--long); } .rating-pop.neg{ color:var(--short); }
.rating-pop.show{ animation:fpRatingFloat 1.15s ease forwards; }
@keyframes fpRatingFloat{ 0%{opacity:0;transform:translate(-50%,12px) scale(.8)} 22%{opacity:1;transform:translate(-50%,-4px) scale(1.12)} 100%{opacity:0;transform:translate(-50%,-64px) scale(1)} }
.rank-toast{ position:fixed; left:50%; top:80px; transform:translateX(-50%); display:flex; align-items:center; gap:12px; background:var(--panel); border:1px solid var(--line-2); border-radius:14px; padding:12px 18px; box-shadow:0 14px 44px rgba(0,0,0,.5); opacity:0; pointer-events:none; z-index:120; }
.rank-toast.up{ border-color:var(--long); } .rank-toast.down{ border-color:var(--short); }
.rank-toast .rt-h{ font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); }
.rank-toast .rt-n{ font-weight:800; font-size:16px; }
.rank-toast.show{ animation:fpRankToast 2.6s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes fpRankToast{ 0%{opacity:0;transform:translateX(-50%) translateY(-16px) scale(.92)} 8%{opacity:1;transform:translateX(-50%) translateY(0) scale(1)} 88%{opacity:1;transform:translateX(-50%) translateY(0)} 100%{opacity:0;transform:translateX(-50%) translateY(-10px)} }


/* ===== interface glow-up: entrance + micro ===== */
.topbar{ animation:fpFadeUp .40s ease both; }
.workspace > .chart-card{ animation:fpFadeUp .46s .04s ease both; }
.workspace > .side{ animation:fpFadeUp .52s .10s ease both; }
.journal-card{ animation:fpFadeUp .58s .16s ease both; }
.start-card{ animation:fpModal .42s cubic-bezier(.2,.8,.2,1); }
.inst-grid .inst-card{ animation:fpFadeUp .42s both; }
.inst-grid .inst-card:nth-child(1){animation-delay:.04s}
.inst-grid .inst-card:nth-child(2){animation-delay:.09s}
.inst-grid .inst-card:nth-child(3){animation-delay:.14s}
.inst-grid .inst-card:nth-child(4){animation-delay:.19s}
.inst-grid .inst-card:nth-child(5){animation-delay:.24s}
.inst-grid .inst-card:nth-child(6){animation-delay:.29s}

/* pulsing daily-challenge dot */
.dot{ animation:fpPulse 2.1s ease-in-out infinite; }
@keyframes fpPulse{ 0%,100%{box-shadow:0 0 0 0 rgba(245,185,66,.45)} 50%{box-shadow:0 0 0 6px rgba(245,185,66,0)} }

/* rank chip subtle depth */
.rank-chip{ background:linear-gradient(180deg, var(--panel-2), var(--bg)); }

/* sleek scrollbars */
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-track{ background:transparent; }
*::-webkit-scrollbar-thumb{ background:var(--line-2); border-radius:99px; border:2px solid transparent; background-clip:padding-box; }
*::-webkit-scrollbar-thumb:hover{ background:var(--muted); background-clip:padding-box; }

/* unified soft micro-transitions */
.btn,.pbtn,.tool-btn,.seg-btn,.dir,.inst-card,.stat,.dtool,.ds-sw,.chip-btn{ transition:transform .14s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease, color .15s ease; }
.chip-btn:hover{ filter:brightness(1.08); }


/* ===== leaderboard tabs + world rows ===== */
.lb-tabs{ display:flex; gap:6px; margin-bottom:10px; }
.lb-tab{ flex:1; background:var(--bg); border:1px solid var(--line); color:var(--txt-2); border-radius:9px; padding:8px 6px; font-weight:700; font-size:12.5px; cursor:pointer; transition:.15s; font-family:var(--sans); }
.lb-tab:hover{ color:var(--txt); }
.lb-tab.active{ background:var(--accent); color:#fff; border-color:transparent; }
.lb-rkmini{ display:inline-flex; align-items:center; gap:4px; font-size:11px; color:var(--txt-2); flex:none; }


/* ===== account / auth ===== */
.auth-hint{ font-size:12.5px; color:var(--txt-2); margin-bottom:14px; line-height:1.45; }
.auth-l{ display:block; font-size:12px; color:var(--txt-2); font-weight:600; margin:10px 0 5px; }
.auth-in{ width:100%; background:var(--bg); border:1px solid var(--line-2); border-radius:9px; color:var(--txt); font-size:14px; padding:10px 12px; outline:none; transition:.15s; font-family:var(--sans); }
.auth-in:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(93,62,170,.15); }
.auth-msg{ font-size:12px; color:var(--gold); min-height:16px; margin:10px 0 4px; }
.auth-btns{ display:flex; gap:8px; margin-top:6px; }
.auth-btns .btn{ flex:1; justify-content:center; }
.auth-acc{ font-size:14px; margin-bottom:14px; }
#authBtn.active{ color:var(--accent); border-color:var(--accent); }


/* ===== profile/career tab ===== */
.pf-stats{ display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-bottom:10px; }
.pf-stat{ display:flex; flex-direction:column; gap:2px; background:var(--bg); border:1px solid var(--line); border-radius:9px; padding:10px 12px; }
.pf-v{ font-family:var(--mono); font-weight:700; font-size:17px; }
.pf-k{ font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; }
.pf-eq{ margin:4px 0 8px; }
.pf-world{ font-size:12.5px; text-align:center; }


/* ===== start-screen profile + grouping ===== */
.start-profile{ display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--bg); border:1px solid var(--line); border-radius:12px; padding:10px 14px; margin:14px 0 2px; }
.sp-left{ display:flex; align-items:center; gap:10px; min-width:0; }
.sp-emb{ flex:none; display:inline-flex; }
.sp-info{ min-width:0; }
.sp-name{ font-weight:800; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sp-sub{ font-size:11.5px; }
.sp-acc{ flex:none; font-size:12.5px; padding:8px 14px; }
.inst-div{ grid-column:1 / -1; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:700; margin:8px 0 -2px; padding-left:2px; }
.inst-card.syn{ border-color:rgba(93,62,170,.28); }
.inst-card.syn:hover{ border-color:var(--accent); }


/* ===== hub tabs: stable height, 4 tabs ===== */
.lb-list{ min-height:248px; }
.lb-date{ min-height:15px; }
.lb-tab{ padding:8px 4px; font-size:12px; }


/* ===== hub: fixed list height (no jump) ===== */
.lb-list{ height:320px; max-height:56vh; min-height:0; }


/* ===== unavailable timeframes (same moment not in data) ===== */
.seg-btn.tf-off{ opacity:.3; cursor:not-allowed; }
.seg-btn.tf-off:hover{ color:var(--txt-2); background:transparent; }


/* disabled selects (e.g. session locked in daily challenge) */
.topbar-select:disabled{ opacity:.4; cursor:not-allowed; }


/* ===== professional minimal polish (2026-06-19) ===== */
:root{ --shadow:0 1px 3px rgba(0,0,0,.16); }
.topbar,.chart-card,.panel,.journal-card{ box-shadow:0 1px 2px rgba(0,0,0,.13); border:1px solid var(--line); }
.topbar{ background:var(--panel); padding:10px 16px; }
.controls{ gap:8px; align-items:center; }
.btn{ min-height:38px; border-radius:10px; }
.btn:hover{ transform:none; }
.btn-ghost{ background:transparent; border:1px solid var(--line); color:var(--txt-2); }
.btn-ghost:hover{ background:var(--panel-2); border-color:var(--line-2); color:var(--txt); }
.icon-btn{ width:38px; height:38px; min-height:38px; padding:0; }
.icon-btn .ic{ width:18px; height:18px; }
.rank-chip{ min-height:38px; }
.topbar-select{ min-height:38px; }
.seg{ background:var(--bg); border:1px solid var(--line); border-radius:10px; }
.btn-primary{ box-shadow:0 2px 12px rgba(93,62,170,.22); }
.btn-primary:hover{ transform:none; filter:brightness(1.05); }
.panel{ padding:16px; }
.panel-title{ letter-spacing:.09em; margin-bottom:12px; }
.field label{ font-size:11.5px; }
.ticket-note{ opacity:.7; font-size:10.5px; }
.footer{ opacity:.8; }
.chip.ghost{ background:var(--bg); border:1px solid var(--line); }


/* ===== minimal polish v3: hierarchy & declutter (2026-06-23) ===== */
/* Quiet utility icons — borderless, reveal background only on hover */
.icon-btn{ background:transparent; border-color:transparent; color:var(--txt-2); }
.icon-btn:hover{ background:var(--panel-2); border-color:transparent; color:var(--txt); }
/* Separate the account/utility cluster from the action buttons */
#authBtn{ margin-left:6px; }
/* Rank chip: quiet card, present but not loud */
.rank-chip{ border:1px solid var(--line); }
/* Daily button calmer until hover */
#dailyBtn{ color:var(--txt-2); }
#dailyBtn:hover{ color:var(--txt); }
/* Logo: lighter shadow to match the flatter surfaces */
.brand-mark{ box-shadow:0 2px 10px rgba(93,62,170,.28); }
/* Chart-head tool buttons: same quiet treatment as topbar icons */
.tool-btn{ background:transparent; border-color:transparent; color:var(--txt-2); }
.tool-btn:hover{ background:var(--panel-2); border-color:transparent; color:var(--txt); }
.tool-btn.active{ background:var(--accent); color:#fff; }

/* ===== Trade analysis "Твои утечки" ===== */
.an-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}
.an-chip{display:flex;flex-direction:column;align-items:center;gap:3px;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:10px 6px}
.an-v{font-family:var(--mono);font-weight:700;font-size:15px}
.an-k{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;text-align:center}
.an-head{font-size:13px;font-weight:600;color:var(--txt);background:var(--panel-2);border:1px solid var(--line);border-radius:9px;padding:11px 12px;margin-bottom:10px}
.an-list{display:flex;flex-direction:column;gap:8px}
.an-item{display:flex;gap:10px;align-items:flex-start;background:var(--bg);border:1px solid var(--line);border-left-width:3px;border-radius:9px;padding:10px 12px}
.an-item.leak{border-left-color:var(--short)}
.an-item.warn{border-left-color:var(--gold)}
.an-item.good{border-left-color:var(--long)}
.an-ic{flex:0 0 18px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;color:#fff;margin-top:1px;line-height:1}
.an-item.leak .an-ic{background:var(--short)}
.an-item.warn .an-ic{background:var(--gold);color:#1a1206}
.an-item.good .an-ic{background:var(--long)}
.an-tx{font-size:12.5px;line-height:1.45;color:var(--txt-2)}

/* ===== AI review ===== */
.an-ai-btn{width:100%;margin-top:12px;padding:11px;border:0;background:linear-gradient(180deg,#8b5cf6,#6d28d9);color:#fff;border-radius:10px;font-weight:700;font-size:13px;cursor:pointer;transition:.15s}
.an-ai-btn:hover{filter:brightness(1.08)}
.an-ai-btn:disabled{opacity:.6;cursor:not-allowed}
.an-ai-out{margin-top:10px}
.an-ai-think{font-size:12.5px;color:var(--txt-2);text-align:center;padding:10px}
.an-ai-card{background:var(--bg);border:1px solid var(--line);border-left:3px solid #6b46c1;border-radius:9px;padding:12px}
.an-ai-h{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#6b46c1;font-weight:800;margin-bottom:8px}
.an-ai-tx{font-size:12.5px;line-height:1.55;color:var(--txt)}
.an-ai-note{font-size:12px;color:var(--muted);text-align:center;padding:10px;background:var(--bg);border:1px solid var(--line);border-radius:9px}

/* ===== per-trade review ===== */
.best-exit{display:flex;justify-content:space-between;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:9px 12px;margin-bottom:10px;font-size:12px}
.bx-l{color:var(--muted)}
.bx-v{font-family:var(--mono);font-weight:700;color:var(--long)}

/* ===== welcome / onboarding ===== */
.wel-card{max-width:440px}
.wel-title{font-size:18px;font-weight:800;margin-bottom:14px}
.wel-steps{display:flex;flex-direction:column;gap:12px;margin-bottom:18px}
.wel-step{display:flex;gap:12px;align-items:flex-start}
.wel-n{flex:0 0 26px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px;color:#fff;background:linear-gradient(135deg,var(--accent),#4f3293)}
.wel-t{font-size:13.5px;line-height:1.5;color:var(--txt-2);padding-top:3px}

#welcomeModal{z-index:200}

/* ===== design-eng polish (Emil Kowalski + frontend-design principles) ===== */
:root{ --ease-out: cubic-bezier(0.23, 1, 0.32, 1); }
/* snappy press feedback — the UI feels like it's listening */
.btn,.seg-btn,.pbtn,.tool-btn,.dtool,.dir,.an-ai-btn,.lb-tab,.modal-close,.chip-btn,.link-btn,.sp-acc,.dr-btn,.ds-sw,.btn-submit{ transition: transform .14s var(--ease-out), border-color .15s ease, background .15s ease, box-shadow .15s ease, color .15s ease, filter .15s ease; }
.btn:active,.seg-btn:active,.pbtn:active,.tool-btn:active,.dtool:active,.an-ai-btn:active,.lb-tab:active,.modal-close:active,.chip-btn:active,.dr-btn:active,.sp-acc:active,.btn-submit:active{ transform: scale(0.97); }
.inst-card:active{ transform: scale(0.985); }
/* keyboard focus visible (a11y) — not shown on mouse click */
:focus-visible{ outline: 2px solid var(--accent); outline-offset: 2px; }
button:focus:not(:focus-visible), select:focus:not(:focus-visible){ outline: none; }
/* touch devices: no sticky hover transforms on tap */
@media (hover: none){
  .btn:hover,.inst-card:hover,.seg-btn:hover,.tool-btn:hover,.pbtn:hover,.dir:hover,.lb-tab:hover{ transform: none; }
}
/* respect reduced motion */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto !important; }
}
/* mobile refinements */
@media (max-width: 560px){
  .player{ flex-wrap: wrap; gap: 6px; }
  .scrub{ order: 5; flex: 1 1 100%; }
  .brand-sub{ display: none; }
}

/* ===== battles 1v1 ===== */
.bt-card{max-width:380px}
#battleBody .btn{margin-bottom:8px}
.bt-intro{font-size:13px;color:var(--txt-2);line-height:1.5;margin-bottom:14px}
.bt-or{text-align:center;color:var(--muted);font-size:12px;margin:10px 0}
.bt-join{display:flex;gap:8px}
.bt-input{flex:1;min-width:0;background:var(--bg);border:1px solid var(--line-2);border-radius:9px;color:var(--txt);padding:10px 12px;font-family:var(--mono);font-weight:700;letter-spacing:4px;text-transform:uppercase;text-align:center;outline:none}
.bt-input:focus{border-color:var(--accent)}
.bt-msg{font-size:12px;color:var(--muted);text-align:center;margin-top:10px;min-height:16px}
.bt-code{font-family:var(--mono);font-weight:800;font-size:34px;letter-spacing:8px;text-align:center;color:var(--accent);background:var(--bg);border:1px dashed var(--line-2);border-radius:12px;padding:18px 10px;margin-bottom:12px}
.bt-result{margin-bottom:12px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px}
.bt-res-h{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;margin-bottom:8px}
.bt-res-row{display:flex;justify-content:space-between;font-size:13px;font-family:var(--mono);margin-bottom:8px;gap:8px}
.bt-verdict{text-align:center;font-weight:800;font-size:15px;padding:8px;border-radius:8px}
.bt-verdict.win{background:rgba(22,199,132,.14);color:var(--long)}
.bt-verdict.loss{background:rgba(246,70,93,.14);color:var(--short)}
.bt-verdict.tie{background:var(--panel-2);color:var(--txt-2)}

/* ===== critique cycle 1: declutter, spinners, session, account ===== */
#battleBtn,#lbBtn{display:none !important}              /* #16 hide battles · #11 drop duplicate leaderboard btn (rank chip is the entry) */
input[type=number]{-moz-appearance:textfield;appearance:textfield}   /* #13 kill spinner arrows */
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.topbar-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;padding-right:30px;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a93a6' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}   /* #14 session select fits theme */
.auth-in{transition:border-color .15s,box-shadow .15s}
.auth-in:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(93,62,170,.15);outline:none}
.auth-msg:not(:empty){margin:6px 0 2px;padding:8px 10px;border-radius:8px;background:rgba(246,70,93,.12);color:var(--short);font-size:12.5px;line-height:1.4}
.auth-msg.ok:not(:empty){background:rgba(22,199,132,.12);color:var(--long)}
.auth-skip{display:block;width:100%;margin-top:12px;background:none;border:none;color:var(--muted);font-size:12.5px;cursor:pointer;padding:6px;transition:color .15s}
.auth-skip:hover{color:var(--txt-2)}
.btn:disabled{opacity:.6;cursor:default}

/* ===== #6 full-screen trade review ===== */
.rv-card{max-width:720px;width:92%;max-height:90vh;overflow-y:auto}
.rv-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.rv-verdict .rv-big{font-size:30px;font-weight:800;letter-spacing:-.01em;line-height:1.1}
.rv-verdict .rv-sub{color:var(--muted);font-size:13px;margin-top:4px;font-family:var(--mono)}
.rv-verdict.win .rv-big{color:var(--long)}
.rv-verdict.loss .rv-big{color:var(--short)}
.rv-verdict.flat .rv-big{color:var(--txt)}
.rv-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0}
.rv-stat{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px}
.rv-stat .rv-k{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.rv-stat .rv-v{font-size:19px;font-weight:800;font-family:var(--mono);margin-top:5px}
.rv-stat .rv-v.pos{color:var(--long)}
.rv-stat .rv-v.neg{color:var(--short)}
.rv-insight{background:var(--panel-2);border-left:3px solid var(--accent);border-radius:8px;padding:12px 14px;font-size:14px;line-height:1.55;color:var(--txt-2)}
.rv-insight b{color:var(--txt)}
.rv-ai{margin-top:14px;min-height:18px}
.rv-foot{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:18px;flex-wrap:wrap}
.rv-toggle{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);cursor:pointer;user-select:none}
.rv-toggle input{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}
.rv-actions{display:flex;gap:8px;margin-left:auto}
@media(max-width:560px){.rv-stats{grid-template-columns:repeat(2,1fr)}.rv-card{padding:16px}.rv-verdict .rv-big{font-size:24px}}

/* ===== #9/#17 profile: account banner + bigger stats ===== */
.pf-acc{display:flex;align-items:center;gap:12px;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.pf-acc.ok{border-color:rgba(22,199,132,.38)}
.pf-acc-ic{width:30px;height:30px;flex:none;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:15px;background:var(--panel-2);color:var(--muted)}
.pf-acc.ok .pf-acc-ic{background:rgba(22,199,132,.16);color:var(--long)}
.pf-acc-t{font-weight:700;font-size:13.5px}
.pf-acc-s{font-size:12px;color:var(--muted);margin-top:1px;word-break:break-all}
.pf-acc-btn{margin-left:auto;flex:none}
.pf-stats{gap:12px!important}
.pf-stat{padding:16px 14px!important}
.pf-stat .pf-v{font-size:23px!important}

/* ===== profile header + analysis polish (Anton critique 2) ===== */
.rank-card{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:12px}
.lb-me{align-items:center;gap:12px;margin-bottom:14px}
.lb-name-input{background:var(--bg);border:1px solid var(--line-2);border-radius:9px;color:var(--txt);padding:9px 12px 9px 34px;font-size:14px;font-weight:700;outline:none;transition:border-color .15s;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238a93a6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:11px center}
.lb-name-input:focus{border-color:var(--accent)}
.lb-name-input::placeholder{color:var(--muted);font-weight:500}
.lb-rankbox{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.lb-rank-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.lb-rank{font-family:var(--mono);font-weight:800;font-size:15px;color:var(--txt)}
.an-metrics{gap:10px}
.an-chip{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px 10px}
.an-chip .an-v{font-size:19px;font-weight:800;font-family:var(--mono)}
.an-head{background:var(--panel-2);border-left:3px solid var(--accent);border-radius:9px;padding:11px 13px;font-weight:700;font-size:13.5px;margin:14px 0 10px}
.an-item{border-radius:9px}

/* ===== #2 welcome splash ===== */
.start-splash{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 38%, rgba(93,62,170,.12), transparent 60%), var(--bg);transition:opacity .42s ease, visibility .42s}
.start-splash.hidden{opacity:0;visibility:hidden;pointer-events:none}
.ss-inner{text-align:center;max-width:460px;padding:24px;animation:ssIn .6s cubic-bezier(0.23,1,0.32,1) both}
.ss-logo{width:84px;height:84px;margin:0 auto 22px;border-radius:22px;display:grid;place-items:center;font-size:33px;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--accent),#6b46c1);box-shadow:0 14px 44px rgba(93,62,170,.42)}
.ss-title{font-size:34px;font-weight:800;letter-spacing:-.02em;margin-bottom:12px}
.ss-title b{color:var(--accent)}
.ss-tag{font-size:15px;line-height:1.55;color:var(--txt-2);margin-bottom:28px}
.ss-go{font-size:16px;padding:14px 30px;display:inline-flex;align-items:center;gap:10px}
.ss-go .ic{width:18px;height:18px}
@keyframes ssIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(max-width:560px){.ss-title{font-size:27px}.ss-logo{width:72px;height:72px;font-size:28px}}

/* ===== #3 topbar: tagline slides out on hover ===== */
.brand{cursor:default}
.brand-sub{max-height:0;opacity:0;overflow:hidden;transform:translateY(-3px);transition:max-height .3s cubic-bezier(0.23,1,0.32,1), opacity .22s ease, transform .3s cubic-bezier(0.23,1,0.32,1)}
.brand:hover .brand-sub,.brand:focus-within .brand-sub{max-height:24px;opacity:.62;transform:translateY(0)}

/* ===== splash animations (Anton: "появилось без анимаций") ===== */
.ss-inner{animation:none}
.ss-logo{animation:ssLogoIn .7s cubic-bezier(.34,1.56,.64,1) both, ssGlow 3s ease-in-out 1.1s infinite}
.ss-title{animation:ssUp .6s cubic-bezier(.23,1,.32,1) .18s both}
.ss-tag{animation:ssUp .55s cubic-bezier(.23,1,.32,1) .3s both}
.ss-go{animation:ssUp .55s cubic-bezier(.23,1,.32,1) .44s both}
@keyframes ssLogoIn{0%{opacity:0;transform:scale(.55) translateY(12px)}60%{opacity:1}100%{opacity:1;transform:scale(1) translateY(0)}}
@keyframes ssUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes ssGlow{0%,100%{box-shadow:0 14px 44px rgba(93,62,170,.42)}50%{box-shadow:0 16px 64px rgba(93,62,170,.72)}}
/* reduced-motion killer removed — Anton wants animations */

/* ===== profile/analysis breathing room (Anton: "в кучу всё") ===== */
#lbModal .modal-card{max-width:480px}
.rank-card{margin-bottom:14px}
.lb-me{padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:16px}
.lb-tabs{margin-bottom:16px}
.an-metrics{margin-bottom:4px}
.an-list{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.an-ai-tx{line-height:1.6}
.an-ai-card{padding:14px;margin-top:4px}

/* ============ CINEMATIC ONBOARDING ============ */
.intro{position:fixed;inset:0;z-index:300;overflow:hidden;background:#08080f;display:flex;align-items:center;justify-content:center;transition:opacity .6s ease, visibility .6s}
.intro.hidden{display:flex !important;opacity:0;visibility:hidden;pointer-events:none}
.intro-bg{position:absolute;inset:0;overflow:hidden}
.intro-bg i{position:absolute;border-radius:50%;filter:blur(72px);opacity:.5;mix-blend-mode:screen}
.intro-bg i:nth-child(1){width:540px;height:540px;background:#5d3eaa;left:-8%;top:-14%;animation:blobA 17s ease-in-out infinite}
.intro-bg i:nth-child(2){width:460px;height:460px;background:#5d3eaa;right:-6%;top:6%;animation:blobB 21s ease-in-out infinite}
.intro-bg i:nth-child(3){width:520px;height:520px;background:#7e44ad;left:32%;bottom:-20%;animation:blobC 24s ease-in-out infinite}
@keyframes blobA{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(70px,46px) scale(1.16)}}
@keyframes blobB{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-54px,64px) scale(1.1)}}
@keyframes blobC{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(44px,-54px) scale(1.22)}}
.intro-line{position:absolute;left:0;right:0;bottom:0;width:100%;height:44%;opacity:.15;pointer-events:none}
.intro-line polyline{fill:none;stroke:#a78bfa;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:3600;stroke-dashoffset:3600;animation:introDraw 3.2s ease-out .5s forwards}
@keyframes introDraw{to{stroke-dashoffset:0}}
.intro-stage{position:relative;z-index:2;width:100%;max-width:540px;padding:28px;text-align:center}
.scene{display:none}
.scene.active{display:block}
.intro-logo{position:relative;width:122px;height:122px;margin:0 auto 30px;border-radius:30px;display:grid;place-items:center;background:linear-gradient(135deg,#5d3eaa,#7e44ad);box-shadow:0 22px 72px rgba(93,62,170,.55);animation:logoPop 1s cubic-bezier(.34,1.56,.64,1) both, logoFloat 5s ease-in-out 1.1s infinite}
.intro-logo span{font-size:47px;font-weight:800;color:#fff;letter-spacing:1px}
.intro-logo::before{content:"";position:absolute;inset:-16px;border-radius:46px;background:radial-gradient(circle at 50% 50%,rgba(167,139,250,.30),transparent 68%);z-index:-1;filter:blur(10px)}
@keyframes logoPop{0%{opacity:0;transform:scale(.4) rotate(-14deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes logoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
@keyframes introSpin{to{transform:rotate(360deg)}}
.intro-title{font-size:43px;font-weight:800;letter-spacing:-.02em;margin:0 0 10px;background:linear-gradient(90deg,#ffffff,#c4b5fd);-webkit-background-clip:text;background-clip:text;color:transparent;animation:introUp .7s cubic-bezier(.23,1,.32,1) .28s both}
.intro-title b{background:linear-gradient(90deg,#6b46c1,#7e44ad);-webkit-background-clip:text;background-clip:text;color:transparent}
.intro-sub{font-size:16px;color:#b6bcca;margin:0 0 32px;animation:introUp .7s cubic-bezier(.23,1,.32,1) .44s both}
.scene-ic{width:66px;height:66px;margin:0 auto 22px;border-radius:18px;display:grid;place-items:center;background:rgba(93,62,170,.15);color:#a78bfa;animation:introPop .6s cubic-bezier(.34,1.56,.64,1) both}
.scene-ic svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.scene-h{font-size:29px;font-weight:800;margin:0 0 12px;color:#f3f4f8;animation:introUp .6s cubic-bezier(.23,1,.32,1) .1s both}
.scene-p{font-size:15.5px;line-height:1.62;color:#aab0bf;margin:0 auto 28px;max-width:430px;animation:introUp .6s cubic-bezier(.23,1,.32,1) .2s both}
@keyframes introUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes introPop{0%{opacity:0;transform:scale(.5)}100%{opacity:1;transform:scale(1)}}
.intro-cta{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(135deg,#5d3eaa,#6b46c1);color:#fff;border:none;border-radius:14px;padding:15px 36px;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 10px 30px rgba(93,62,170,.45);transition:transform .18s cubic-bezier(.34,1.56,.64,1),box-shadow .18s;animation:introUp .6s cubic-bezier(.23,1,.32,1) .52s both}
.intro-cta small{font-size:11px;font-weight:600;opacity:.82;margin-left:2px}
.intro-cta svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.intro-cta:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 16px 42px rgba(93,62,170,.62)}
.intro-cta:active{transform:translateY(-1px) scale(.99)}
.scene[data-scene="hero"] .intro-cta{animation:introUp .6s cubic-bezier(.23,1,.32,1) .52s both, ctaPulse 2.6s ease-in-out 1.6s infinite}
@keyframes ctaPulse{0%,100%{box-shadow:0 10px 30px rgba(93,62,170,.45)}50%{box-shadow:0 10px 46px rgba(93,62,170,.78)}}
.intro-ghost{display:block;margin:16px auto 0;background:none;border:none;color:#8a93a6;font-size:13px;cursor:pointer;transition:color .15s;animation:introUp .6s ease .62s both}
.intro-ghost:hover{color:#c4cad6}
.scene-actions{display:flex;flex-direction:column;align-items:center}
.intro-input{display:block;width:100%;max-width:340px;margin:0 auto 12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:14px 16px;color:#fff;font-size:15px;outline:none;text-align:center;transition:border-color .15s,background .15s;animation:introUp .6s ease .26s both}
.intro-input:focus{border-color:#6b46c1;background:rgba(255,255,255,.07)}
.intro-input::placeholder{color:#6b7180}
.intro-msg{min-height:18px;font-size:12.5px;color:#f6465d;margin-bottom:10px}
.intro-msg.ok{color:#16c784}
.tour-num{width:44px;height:44px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:18px;color:#fff;background:linear-gradient(135deg,#5d3eaa,#7e44ad);box-shadow:0 8px 24px rgba(93,62,170,.5);animation:introPop .5s cubic-bezier(.34,1.56,.64,1) both}
.tour-dots{display:flex;justify-content:center;gap:8px;margin:22px 0 22px}
.tour-dots i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.2);transition:all .35s cubic-bezier(.23,1,.32,1)}
.tour-dots i.on{width:26px;border-radius:4px;background:linear-gradient(90deg,#6b46c1,#7e44ad)}
@media(max-width:560px){.intro-title{font-size:32px}.intro-logo{width:98px;height:98px}.intro-logo span{font-size:38px}.scene-h{font-size:23px}}
/* reduced-motion killer removed — Anton wants animations */

/* ===== onboarding round 2: depth, parallax, 3D, live chart (refs: wearebrand/hyliox) ===== */
.intro{--px:0;--py:0}
.intro-bg{transform:translate(calc(var(--px)*-26px),calc(var(--py)*-16px));transition:transform .25s ease-out;will-change:transform}
.intro-line{transform:translate(calc(var(--px)*22px),calc(var(--py)*13px));transition:transform .25s ease-out;will-change:transform}
.intro-line path{fill:none;stroke:url(#introGrad);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:3600;stroke-dashoffset:3600;animation:introDraw 3.4s ease-out .6s forwards;filter:drop-shadow(0 0 7px rgba(167,139,250,.55))}
.intro-dot{fill:#fff;filter:drop-shadow(0 0 9px rgba(126,68,173,.95))}
.intro-logo-wrap{display:inline-block;transform:perspective(820px) rotateY(calc(var(--px)*20deg)) rotateX(calc(var(--py)*-20deg));transition:transform .18s ease-out;transform-style:preserve-3d;will-change:transform}
.intro-specs span{position:absolute;font-family:var(--mono);font-size:11px;letter-spacing:.13em;color:rgba(167,139,250,.45);opacity:0;animation:specIn .9s ease forwards;pointer-events:none;white-space:nowrap}
.intro-specs .s1{top:13%;left:7%;animation-delay:1.1s}
.intro-specs .s2{top:22%;right:8%;animation-delay:1.4s}
.intro-specs .s3{bottom:18%;left:10%;animation-delay:1.7s}
@keyframes specIn{from{opacity:0;transform:translateY(10px)}to{opacity:.45;transform:none}}
@media(max-width:680px){.intro-specs span{display:none}}
/* reduced-motion killer removed — Anton wants animations */

/* ===== onboarding round 3: live particle depth field ===== */
.intro-bg{z-index:0}
.intro-fx{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.intro-line{z-index:1}
.intro-stage{z-index:3}
.intro-specs{z-index:3}

/* ===== onboarding round 4: real WebGL 3D (Three.js, lazy) ===== */
.intro-gl{position:absolute;inset:0;z-index:1;pointer-events:none}
.intro-gl canvas{width:100%!important;height:100%!important;display:block}
.intro-fx{transition:opacity .9s ease}

/* ============ PREMIUM DESIGN LAYER — whole-app glow-up ============ */
body{ background:
  radial-gradient(1100px 760px at 12% -8%, rgba(93,62,170,.10), transparent 55%),
  radial-gradient(1000px 700px at 112% 6%, rgba(93,62,170,.07), transparent 55%),
  var(--bg); }
.topbar{ background:linear-gradient(180deg, rgba(146,109,255,.06), rgba(255,255,255,.012)); border-bottom:1px solid rgba(255,255,255,.07); -webkit-backdrop-filter:blur(12px) saturate(1.15); backdrop-filter:blur(12px) saturate(1.15); }
.chart-card,.start-card,.panel,.modal-card,.rank-card,.rv-card,.bt-card{ border:1px solid rgba(255,255,255,.07); box-shadow:0 14px 44px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.045); }
.modal-card{ -webkit-backdrop-filter:blur(20px) saturate(1.2); backdrop-filter:blur(20px) saturate(1.2); }
.start-card{ background:linear-gradient(180deg, rgba(146,109,255,.05), rgba(255,255,255,.012)), var(--panel); }
.inst-card{ transition:transform .18s cubic-bezier(.34,1.56,.64,1), border-color .18s, box-shadow .18s; }
.inst-card:hover{ transform:translateY(-3px); border-color:rgba(107,70,193,.5); box-shadow:0 16px 36px rgba(93,62,170,.22); }
.chip-btn{ transition:transform .15s, border-color .15s, box-shadow .15s; }
.chip-btn:hover{ border-color:rgba(107,70,193,.5); box-shadow:0 4px 14px rgba(93,62,170,.25); }
.btn{ transition:transform .16s cubic-bezier(.34,1.56,.64,1), box-shadow .18s, filter .18s, border-color .18s, background .18s; }
.btn-primary{ background:linear-gradient(135deg, #5d3eaa, #6b46c1); border:none; box-shadow:0 8px 24px rgba(93,62,170,.4); }
.btn-primary:hover{ transform:translateY(-1px); box-shadow:0 14px 34px rgba(93,62,170,.6); filter:brightness(1.06); }
.btn-primary:active{ transform:translateY(0) scale(.99); }
.btn-ghost:hover{ border-color:rgba(107,70,193,.45); }
.seg-btn.active{ box-shadow:0 4px 16px rgba(93,62,170,.42); }
.lb-tab.active{ box-shadow:0 4px 16px rgba(93,62,170,.45); }
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-thumb{ background:rgba(107,70,193,.4); border-radius:8px; }
*::-webkit-scrollbar-thumb:hover{ background:rgba(107,70,193,.65); }
*::-webkit-scrollbar-track{ background:transparent; }

/* disclaimer line in welcome scene */
.scene-note{font-size:11.5px;line-height:1.45;color:var(--muted);opacity:.72;margin:-14px auto 22px;max-width:380px}
.footer-disc{color:#8a8f9c}

/* title shimmer (kinetic premium) */
.intro-title{background:linear-gradient(110deg,#b9a6f0 0%,#ffffff 48%,#b9a6f0 100%);background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:introUp .7s cubic-bezier(.23,1,.32,1) .28s both, titleShine 5.5s ease-in-out 1.8s infinite}
@keyframes titleShine{0%{background-position:0% center}50%{background-position:130% center}100%{background-position:0% center}}

/* ============ PREMIUM WORKSPACE — whole-site level-up (#66) ============ */
/* stat boxes */
.stat{ background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.008)); border:1px solid rgba(255,255,255,.06); border-radius:12px; transition:transform .16s cubic-bezier(.34,1.56,.64,1), border-color .16s, box-shadow .16s; }
.stat:hover{ transform:translateY(-2px); border-color:rgba(107,70,193,.32); box-shadow:0 8px 22px rgba(93,62,170,.16); }
.stat-val{ font-weight:800; }
/* LONG / SHORT direction buttons */
.dir{ transition:transform .15s cubic-bezier(.34,1.56,.64,1), box-shadow .18s, border-color .18s, background .18s; }
.dir.long:hover{ border-color:rgba(22,199,132,.6); box-shadow:0 8px 24px rgba(22,199,132,.2); transform:translateY(-1px); }
.dir.short:hover{ border-color:rgba(246,70,93,.6); box-shadow:0 8px 24px rgba(246,70,93,.2); transform:translateY(-1px); }
.dir.long.active{ background:linear-gradient(180deg, rgba(22,199,132,.2), rgba(22,199,132,.06)); border-color:rgba(22,199,132,.7); box-shadow:0 6px 20px rgba(22,199,132,.3); }
.dir.short.active{ background:linear-gradient(180deg, rgba(246,70,93,.2), rgba(246,70,93,.06)); border-color:rgba(246,70,93,.7); box-shadow:0 6px 20px rgba(246,70,93,.3); }
/* inputs & readout */
.field input, .readout{ transition:border-color .15s, box-shadow .15s, background .15s; }
.field input:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(93,62,170,.16); outline:none; }
.readout{ font-weight:700; }
/* result badge richer glass */
.result-badge{ border-radius:12px; }
.result-badge.win{ background:linear-gradient(135deg, rgba(22,199,132,.22), rgba(22,199,132,.07)); box-shadow:0 8px 26px rgba(22,199,132,.2), inset 0 1px 0 rgba(255,255,255,.06); }
.result-badge.loss{ background:linear-gradient(135deg, rgba(246,70,93,.22), rgba(246,70,93,.07)); box-shadow:0 8px 26px rgba(246,70,93,.2), inset 0 1px 0 rgba(255,255,255,.06); }
/* leaderboard rows + modal close hover */
.lb-list .lb-row{ transition:background .15s, transform .15s; }
.lb-list .lb-row:hover{ background:rgba(107,70,193,.07); }
.modal-close{ transition:color .15s, background .15s, transform .15s; border-radius:8px; }
.modal-close:hover{ color:var(--txt); background:rgba(255,255,255,.06); transform:rotate(90deg); }
/* chips press feedback */
.chip-btn:active{ transform:scale(.97); }
/* segmented active subtle inner highlight */
.seg-btn.active{ position:relative; }
.panel-title{ letter-spacing:.02em; }

/* ===== intro: readable text scrim + cinematic scene transitions ===== */
.intro-stage::before{ content:""; position:absolute; inset:-30px -12%; z-index:-1; pointer-events:none; background:radial-gradient(ellipse 56% 62% at 50% 52%, rgba(8,8,15,.88) 0%, rgba(8,8,15,.58) 42%, rgba(8,8,15,0) 76%); }
.scene.active{ animation: sceneFadeIn .55s ease both; }
@keyframes sceneFadeIn{ from{ opacity:0 } to{ opacity:1 } }
.scene.leaving{ pointer-events:none; animation: sceneLeave .38s cubic-bezier(.5,0,.75,0) forwards; }
@keyframes sceneLeave{ from{ opacity:1; transform:none; filter:blur(0) } to{ opacity:0; transform:translateY(-20px) scale(.965); filter:blur(5px) } }

/* ============ WILD INTRO ANIMATIONS (agency-level) ============ */
/* kinetic per-word title reveal */
.intro-title{ font-size:43px; font-weight:800; letter-spacing:-.02em; margin:0 0 12px; background:none; -webkit-text-fill-color:initial; animation:none; }
.intro-title .tw{ display:inline-block; overflow:hidden; vertical-align:bottom; line-height:1.08; padding-bottom:.1em; }
.intro-title .tw > i{ display:inline-block; font-style:normal; font-weight:800; transform:translateY(120%); animation: twUp .95s cubic-bezier(.16,1.05,.3,1) both; background:linear-gradient(180deg,#ffffff,#cdb9ff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.intro-title .tw:nth-child(1) > i{ animation-delay:.3s }
.intro-title .tw:nth-child(2) > i{ animation-delay:.5s }
.intro-title .tw-g{ background:linear-gradient(180deg,#c879ff,#e64bd0)!important; -webkit-background-clip:text!important; background-clip:text!important; color:transparent!important }
@keyframes twUp{ from{ transform:translateY(120%) } to{ transform:translateY(0) } }
@media(max-width:560px){ .intro-title{ font-size:31px } }

/* dramatic scene transitions (override) */
.scene.active{ animation: sceneFadeIn .72s cubic-bezier(.16,1.05,.3,1) both; }
.scene.leaving{ pointer-events:none; animation: sceneLeave .42s cubic-bezier(.55,0,.85,.25) forwards; }
@keyframes sceneFadeIn{ 0%{opacity:0; transform:scale(.9) translateY(28px); filter:blur(10px)} 55%{opacity:1} 100%{opacity:1; transform:none; filter:blur(0)} }
@keyframes sceneLeave{ from{opacity:1; transform:scale(1); filter:blur(0)} to{opacity:0; transform:scale(1.2); filter:blur(16px)} }

/* logo entrance burst ring */
.intro-logo::after{ content:""; position:absolute; inset:0; border-radius:30px; border:2px solid rgba(206,128,255,.85); animation: logoBurst 1.2s cubic-bezier(.2,.8,.2,1) .15s both; pointer-events:none; }
@keyframes logoBurst{ 0%{ transform:scale(1); opacity:.85 } 100%{ transform:scale(2.6); opacity:0 } }
.intro-logo{ animation: logoPop 1.05s cubic-bezier(.2,1.6,.35,1) both, logoFloat 5s ease-in-out 1.2s infinite; }
@keyframes logoPop{ 0%{ opacity:0; transform:scale(.3) rotate(-18deg) } 70%{ opacity:1 } 100%{ opacity:1; transform:scale(1) rotate(0) } }

/* bold staggered entrances */
.intro-sub{ animation: introUpBig .85s cubic-bezier(.16,1.05,.3,1) .62s both; }
.scene[data-scene="hero"] .intro-cta{ animation: introUpBig .85s cubic-bezier(.16,1.05,.3,1) .78s both, ctaPulse 2.6s ease-in-out 1.9s infinite; }
.scene-ic{ animation: introPopBig .8s cubic-bezier(.2,1.5,.35,1) both; }
.scene-h{ animation: introUpBig .7s cubic-bezier(.16,1.05,.3,1) .12s both; }
.scene-p{ animation: introUpBig .7s cubic-bezier(.16,1.05,.3,1) .24s both; }
@keyframes introUpBig{ from{ opacity:0; transform:translateY(36px) scale(.92) } to{ opacity:1; transform:none } }
@keyframes introPopBig{ 0%{ opacity:0; transform:scale(.4) } 100%{ opacity:1; transform:scale(1) } }

/* spec labels to viewport corners (off the logo) */
.intro-specs span{ position:absolute; z-index:6; }
.intro-specs .s1{ top:7%; left:5%; right:auto; bottom:auto; }
.intro-specs .s2{ top:7%; right:5%; left:auto; bottom:auto; }
.intro-specs .s3{ bottom:9%; left:5%; top:auto; right:auto; }
.intro-specs{ transition:opacity .45s ease; }
.intro:not([data-scene="hero"]) .intro-specs{ opacity:0; pointer-events:none; }

/* ============ PREMIUM HUB (под уровень hero) ============ */
.start-screen{ background:radial-gradient(1100px 560px at 50% -10%, #1a2742 0%, #06090f 64%); }
.start-screen::before,.start-screen::after{ content:""; position:fixed; border-radius:50%; filter:blur(95px); pointer-events:none; z-index:0; mix-blend-mode:screen; }
.start-screen::before{ width:660px; height:660px; left:-150px; top:-130px; background:radial-gradient(circle, rgba(93,62,170,.50), transparent 70%); animation:hubAuroraA 20s ease-in-out infinite; }
.start-screen::after{ width:600px; height:600px; right:-150px; bottom:-150px; background:radial-gradient(circle, rgba(126,68,173,.40), transparent 70%); animation:hubAuroraB 24s ease-in-out infinite; }
@keyframes hubAuroraA{ 0%,100%{ transform:translate(0,0) scale(1); opacity:.55 } 50%{ transform:translate(70px,55px) scale(1.16); opacity:.8 } }
@keyframes hubAuroraB{ 0%,100%{ transform:translate(0,0) scale(1); opacity:.45 } 50%{ transform:translate(-65px,-45px) scale(1.13); opacity:.72 } }

.start-card{ position:relative; z-index:1; background:linear-gradient(180deg, rgba(93,62,170,.07), rgba(255,255,255,.012)), linear-gradient(180deg,var(--panel) 0%,var(--bg-2) 100%); border:1px solid rgba(255,255,255,.09); box-shadow:0 34px 90px rgba(7,5,20,.62), inset 0 1px 0 rgba(255,255,255,.06); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.start-card::before{ content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; background:linear-gradient(135deg, rgba(93,62,170,.55), transparent 42%, transparent 58%, rgba(126,68,173,.45)); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; opacity:.7; }
.start-card > *{ position:relative; }

.brand-mark.big{ background:linear-gradient(135deg,#5d3eaa,#7e44ad); box-shadow:0 12px 32px rgba(93,62,170,.5), inset 0 1px 0 rgba(255,255,255,.28); }
.start-title b{ background:linear-gradient(120deg,#b388ff,#f0abfc); -webkit-background-clip:text; background-clip:text; color:transparent; }

.start-profile{ background:linear-gradient(180deg, rgba(93,62,170,.09), rgba(255,255,255,.01)); border:1px solid rgba(93,62,170,.20); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
.start-profile:hover{ border-color:rgba(93,62,170,.34); }
.sp-emb{ filter:drop-shadow(0 4px 12px rgba(93,62,170,.45)); }
.sp-acc:hover{ border-color:rgba(107,70,193,.6); box-shadow:0 0 0 3px rgba(93,62,170,.12); }

.inst-card{ background:linear-gradient(180deg, rgba(255,255,255,.028), rgba(255,255,255,.006)); border:1.5px solid rgba(255,255,255,.08); }
.inst-card .ic-sym{ background:linear-gradient(120deg,#c4b5fd,#f0abfc); -webkit-background-clip:text; background-clip:text; color:transparent; }
.inst-card.active{ border-color:transparent; background:linear-gradient(180deg, rgba(93,62,170,.20), rgba(126,68,173,.08)); box-shadow:0 12px 32px rgba(93,62,170,.30), inset 0 0 0 1.5px rgba(107,70,193,.65); }
.inst-card.active .ic-name{ color:#e7dcff; }
.inst-card.syn .ic-sym{ background:linear-gradient(120deg,#7dd3fc,#a5b4fc); -webkit-background-clip:text; background-clip:text; color:transparent; }

.start-seg{ background:rgba(93,62,170,.07); border-color:rgba(93,62,170,.18); }
.start-seg .seg-btn.active{ background:linear-gradient(135deg,#5d3eaa,#6b46c1); color:#fff; box-shadow:0 6px 18px rgba(93,62,170,.5); }

.start-go{ position:relative; overflow:hidden; background:linear-gradient(135deg,#5d3eaa,#6b46c1 55%,#7e44ad); border:none; color:#fff; box-shadow:0 16px 40px rgba(93,62,170,.5); }
.start-go:hover{ box-shadow:0 20px 52px rgba(93,62,170,.64); transform:translateY(-2px); }
.start-go::after{ content:""; position:absolute; top:0; left:-60%; width:45%; height:100%; background:linear-gradient(100deg, transparent, rgba(255,255,255,.38), transparent); transform:skewX(-18deg); animation:goShimmer 5s ease-in-out infinite; pointer-events:none; }
@keyframes goShimmer{ 0%,16%{ left:-60% } 36%,100%{ left:135% } }

.start-brand{ animation:fpFadeUp .55s both .04s; }
.start-profile{ animation:fpFadeUp .55s both .10s; }
.start-section{ animation:fpFadeUp .55s both .16s; }
.start-go{ animation:fpFadeUp .55s both .24s; }

/* ============ PREMIUM WORKSPACE (под уровень hero, сдержанно) ============ */
/* мягкий двутоновый задний фон, статичный — не отвлекает от графика */
body{ background:radial-gradient(1100px 620px at 82% -12%, #1a2440 0%, transparent 55%), radial-gradient(900px 520px at 8% 112%, rgba(93,62,170,.10), transparent 60%), var(--bg) fixed; }

/* топбар — стекло */
.topbar{ background:linear-gradient(180deg, rgba(93,62,170,.07), rgba(18,26,40,.82)); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid rgba(93,62,170,.14); }

/* стеклянные панели + карта графика */
.chart-card,.panel{ background:linear-gradient(180deg, rgba(93,62,170,.045), rgba(255,255,255,.008)), linear-gradient(180deg,var(--panel) 0%,var(--bg-2) 100%); border:1px solid rgba(255,255,255,.085); box-shadow:0 18px 50px rgba(7,5,20,.42), inset 0 1px 0 rgba(255,255,255,.05); }
.chart-head{ border-bottom:1px solid rgba(93,62,170,.12); }

/* акцентная риска у заголовков панелей */
.panel-title{ display:flex; align-items:center; gap:8px; }
.panel-title::before{ content:""; width:14px; height:2px; border-radius:2px; background:linear-gradient(90deg,#5d3eaa,#7e44ad); flex:none; }

/* кнопки плеера и инструментов — фиолетовый акцент */
.pbtn:hover{ border-color:rgba(107,70,193,.6); box-shadow:0 6px 18px rgba(93,62,170,.22); transform:translateY(-1px); }
.pbtn.primary{ background:linear-gradient(135deg,#5d3eaa,#6b46c1 60%,#7e44ad); border-color:transparent; box-shadow:0 10px 26px rgba(93,62,170,.45); }
.pbtn.primary:hover{ box-shadow:0 14px 34px rgba(93,62,170,.58); }
.pbtn.play{ border-color:rgba(93,62,170,.35); }
.tool-btn:hover{ border-color:rgba(107,70,193,.55); color:var(--txt); }
.tool-btn.active{ background:linear-gradient(135deg,#5d3eaa,#6b46c1); border-color:transparent; color:#fff; box-shadow:0 6px 16px rgba(93,62,170,.4); }

/* карточки статистики */
.stat{ background:linear-gradient(180deg, rgba(93,62,170,.06), rgba(255,255,255,.006)); border:1px solid rgba(93,62,170,.14); }
.stat:hover{ transform:translateY(-2px); border-color:rgba(107,70,193,.4); box-shadow:0 10px 24px rgba(93,62,170,.2); }

/* идл-состояние LONG/SHORT — лёгкое стекло (цвета остаются торговыми) */
.dir{ background:linear-gradient(180deg, rgba(255,255,255,.022), rgba(255,255,255,.004)); }

/* появление боковой колонки */
.workspace > .side{ animation:fpFadeUp .5s .12s ease both; }

/* ============ PREMIUM MODALS + RESULT (под уровень hero) ============ */
.modal{ background:radial-gradient(130% 130% at 50% 0%, rgba(26,16,48,.5), rgba(4,6,12,.74)); backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px); animation:mIn .26s ease both; }
@keyframes mIn{ from{ opacity:0 } to{ opacity:1 } }

.modal-card{ position:relative; background:linear-gradient(180deg, rgba(93,62,170,.07), rgba(255,255,255,.01)), linear-gradient(180deg,var(--panel) 0%,var(--bg-2) 100%); border:1px solid rgba(255,255,255,.09); box-shadow:0 42px 100px rgba(5,4,16,.7), inset 0 1px 0 rgba(255,255,255,.06); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); animation:fpModal .42s cubic-bezier(.2,.8,.2,1); }
.modal-card::before{ content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; background:linear-gradient(135deg, rgba(93,62,170,.5), transparent 42%, transparent 58%, rgba(126,68,173,.4)); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; opacity:.6; }
.modal-card > *{ position:relative; }
.rv-card,.bt-card{ background:linear-gradient(180deg, rgba(93,62,170,.06), rgba(255,255,255,.008)), linear-gradient(180deg,var(--panel) 0%,var(--bg-2) 100%); border:1px solid rgba(255,255,255,.09); box-shadow:0 42px 100px rgba(5,4,16,.7), inset 0 1px 0 rgba(255,255,255,.06); }

.modal-close{ width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px; }
.modal-close:hover{ color:#fff; background:rgba(126,68,173,.16); transform:rotate(90deg); }

.lb-tab.active{ background:linear-gradient(135deg,#5d3eaa,#6b46c1); color:#fff; border-color:transparent; box-shadow:0 6px 16px rgba(93,62,170,.42); }

.rank-card{ background:linear-gradient(180deg, rgba(93,62,170,.11), rgba(255,255,255,.008)); border:1px solid rgba(93,62,170,.22); }
.an-chip{ background:linear-gradient(180deg, rgba(93,62,170,.06), rgba(255,255,255,.006)); border:1px solid rgba(93,62,170,.14); }

.dr-btn{ background:linear-gradient(135deg,#5d3eaa,#6b46c1); box-shadow:0 8px 20px rgba(93,62,170,.4); }
.dr-btn:hover{ filter:brightness(1.06); box-shadow:0 12px 26px rgba(93,62,170,.52); }

.result-badge.win{ box-shadow:0 10px 30px rgba(22,199,132,.25); }
.result-badge.loss{ box-shadow:0 10px 30px rgba(246,70,93,.22); }

/* ============ FIX BATCH (критика Anton) ============ */
/* #3 модалки выше стартового экрана (Войти открывалось ПОД хабом) */
.modal{ z-index:250; }

/* #2 премиум-панель рисования (была плоско-«старой») */
.draw-toolbar-row{ background:linear-gradient(180deg, rgba(93,62,170,.05), rgba(18,26,40,.55)); border-bottom:1px solid rgba(93,62,170,.12); }
.dtool{ background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.008)); border:1px solid rgba(255,255,255,.10); }
.dtool:hover{ border-color:rgba(107,70,193,.55); color:var(--txt); }
.dtool.active{ background:linear-gradient(135deg,#5d3eaa,#6b46c1); border-color:transparent; color:#fff; box-shadow:0 5px 14px rgba(93,62,170,.42); }
.dtool.danger:hover{ border-color:rgba(246,70,93,.6); color:var(--short); }
.ds-w,.ds-d{ background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.008)); border:1px solid rgba(255,255,255,.10); }
.ds-w:hover,.ds-d:hover{ border-color:rgba(107,70,193,.5); color:var(--txt); }
.ds-w.active,.ds-d.active{ background:linear-gradient(135deg,#5d3eaa,#6b46c1); border-color:transparent; color:#fff; box-shadow:0 5px 14px rgba(93,62,170,.4); }
.ds-sw{ box-shadow:0 0 0 1px rgba(255,255,255,.16); }
.ds-sw.active{ border-color:#fff; box-shadow:0 0 0 2px rgba(93,62,170,.7); }

/* #12 единая премиум-карточка ИИ-коуча (везде один вид) */
.an-ai-card{ background:linear-gradient(180deg, rgba(93,62,170,.08), rgba(255,255,255,.01)); border:1px solid rgba(93,62,170,.20); border-left:3px solid #6b46c1; border-radius:12px; padding:14px 16px; }
.an-ai-h{ color:#c4b5fd; }
.an-ai-btn{ background:linear-gradient(135deg,#5d3eaa,#6b46c1); box-shadow:0 8px 20px rgba(93,62,170,.4); }
.an-ai-btn:hover{ box-shadow:0 12px 26px rgba(93,62,170,.52); }
.rv-ai{ margin-top:10px; }

/* #7 плашка профиля на хабе кликабельна */
.start-profile{ cursor:pointer; }

/* #1 инлайн-меню смены инструмента (по чипу на графике) */
.inst-menu{ position:fixed; z-index:260; min-width:236px; background:linear-gradient(180deg, rgba(93,62,170,.12), var(--panel)); border:1px solid rgba(93,62,170,.26); border-radius:13px; box-shadow:0 26px 64px rgba(5,4,16,.62); padding:6px; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); animation:fpFadeUp .16s ease both; }
.im-item{ display:flex; align-items:center; gap:11px; width:100%; text-align:left; background:transparent; border:0; border-radius:9px; padding:9px 11px; cursor:pointer; color:var(--txt); transition:background .14s ease; }
.im-item:hover{ background:rgba(93,62,170,.16); }
.im-item.active{ background:linear-gradient(135deg, rgba(93,62,170,.32), rgba(126,68,173,.14)); }
.im-sym{ font-family:var(--mono); font-weight:800; font-size:14px; min-width:40px; background:linear-gradient(120deg,#c4b5fd,#f0abfc); -webkit-background-clip:text; background-clip:text; color:transparent; }
.im-item.syn .im-sym{ background:linear-gradient(120deg,#7dd3fc,#a5b4fc); -webkit-background-clip:text; background-clip:text; color:transparent; }
.im-name{ font-size:12.5px; color:var(--txt-2); }
.im-div{ font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:700; padding:9px 11px 4px; }

/* #4 тело отдельной модалки разбора */
.an-body{ max-height:72vh; overflow:auto; }

/* ============ ИИ-СКОРКАРД РАЗБОРА (фиксированные темы) ============ */
.rv-vhead{ display:flex; align-items:center; gap:12px; }
.rv-grade{ font-family:var(--mono); font-weight:800; font-size:18px; width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; flex:none; box-shadow:0 6px 16px rgba(0,0,0,.3); }
.rv-grade.gA{ background:linear-gradient(135deg,#16c784,#0e9f6e); color:#fff; }
.rv-grade.gB{ background:linear-gradient(135deg,#5d3eaa,#6b46c1); color:#fff; }
.rv-grade.gC{ background:linear-gradient(135deg,#f59e0b,#d97706); color:#fff; }
.rv-grade.gD{ background:linear-gradient(135deg,#f6465d,#b3263a); color:#fff; }
.rv-score{ display:flex; flex-direction:column; gap:8px; margin:14px 0; }
.rv-row{ display:flex; align-items:flex-start; gap:11px; background:linear-gradient(180deg, rgba(255,255,255,.022), rgba(255,255,255,.004)); border:1px solid rgba(255,255,255,.07); border-radius:11px; padding:11px 13px; }
.rv-dot{ width:9px; height:9px; border-radius:50%; margin-top:5px; flex:none; }
.rv-row.good .rv-dot{ background:#16c784; box-shadow:0 0 10px rgba(22,199,132,.6); }
.rv-row.warn .rv-dot{ background:#f59e0b; box-shadow:0 0 10px rgba(245,158,11,.55); }
.rv-row.bad .rv-dot{ background:#f6465d; box-shadow:0 0 10px rgba(246,70,93,.55); }
.rv-row.good{ border-color:rgba(22,199,132,.20); }
.rv-row.warn{ border-color:rgba(245,158,11,.20); }
.rv-row.bad{ border-color:rgba(246,70,93,.22); }
.rv-rc{ min-width:0; }
.rv-area{ font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:800; }
.rv-note{ font-size:13px; line-height:1.45; color:var(--txt); margin-top:2px; }
.rv-focus{ display:flex; gap:10px; align-items:baseline; background:linear-gradient(135deg, rgba(93,62,170,.16), rgba(126,68,173,.06)); border:1px solid rgba(93,62,170,.28); border-radius:11px; padding:12px 14px; }
.rv-focus-l{ font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:#c4b5fd; font-weight:800; flex:none; }
.rv-focus-t{ font-size:13px; line-height:1.45; color:var(--txt); }

/* настройка-текст (уровни Фибо) */
.set-text{ width:100%; background:var(--bg); border:1px solid var(--line-2); border-radius:9px; padding:9px 12px; color:var(--txt); font-family:var(--mono); font-size:13px; }
.set-text:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(93,62,170,.15); }

/* строка «Структура (SMC)» в скоркарде — инфо-стиль */
.rv-row.info{ border-color:rgba(93,62,170,.28); background:linear-gradient(180deg, rgba(93,62,170,.08), rgba(255,255,255,.004)); }
.rv-row.info .rv-dot{ background:#6b46c1; box-shadow:0 0 10px rgba(107,70,193,.6); }
.rv-row.info .rv-area{ color:#c4b5fd; }

/* анти-абуз рейтинга: причина под попапом RP */
.rating-pop.zero{ color:#9fb0c6; }
.rating-pop .rp-note{ display:block; font-size:10px; font-weight:600; opacity:.85; margin-top:3px; text-transform:none; letter-spacing:0; max-width:200px; }

/* топбар — одна компактная строка (убрать пустоту сверху), вместо переноса контролов под бренд */
#app{ padding-top:8px; }
.topbar{ flex-wrap:nowrap; padding:8px 16px; gap:12px; }
.topbar .brand{ flex:none; }
.topbar #tfSeg .seg-btn{ padding:6px 9px; font-size:12.5px; }
.topbar .controls{ gap:8px; flex-wrap:wrap; justify-content:flex-end; }
@media (max-width:820px){ .topbar{ flex-wrap:wrap; } .topbar .controls{ justify-content:flex-start; } }

/* ссылки в подвале (юр-страницы) */
.footer-links{ display:block; margin-top:4px; }
.footer-links a{ color:var(--txt-2); text-decoration:none; }
.footer-links a:hover{ color:var(--accent); text-decoration:underline; }

/* #7 кастомный селектор сессий (вместо нативного select) */
.sess-sel{ display:inline-flex; align-items:center; cursor:pointer; white-space:nowrap; }
.sess-sel:hover{ border-color:rgba(107,70,193,.5); }
.sess-menu{ padding:5px; }
.sess-menu .im-item{ padding:8px 12px; }
.sess-menu .im-name{ font-size:13px; color:var(--txt); }

/* #1 кинематографичный переход hero → хаб (зум + блюр на уходе) */
.intro{ transition:opacity .82s ease, visibility .82s, transform .88s cubic-bezier(.62,0,.3,1), filter .72s ease; }
.intro.hidden{ transform:scale(1.9); filter:blur(18px); }

/* #8 челлендж дня пройден — приглушить */
.btn.daily-done{ opacity:.5; cursor:default; }
.seg-btn.daily-done{ opacity:.45; }

/* #6 объяснение рангов в профиле */
.ranks-help{ margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.rh-title{ font-size:13px; font-weight:800; color:var(--txt); margin-bottom:6px; }
.rh-text{ font-size:12.5px; color:var(--txt-2); line-height:1.5; margin-bottom:10px; }
.rh-list{ display:flex; flex-direction:column; gap:5px; }
.rh-row{ display:flex; align-items:center; gap:9px; padding:6px 9px; border-radius:8px; background:linear-gradient(180deg, rgba(93,62,170,.05), rgba(255,255,255,.004)); border:1px solid rgba(93,62,170,.1); }
.rh-emb{ flex:none; display:inline-flex; }
.rh-name{ flex:1; font-size:12.5px; font-weight:600; color:var(--txt); }
.rh-rp{ font-family:var(--mono); font-size:11.5px; color:var(--muted); }
.rh-note{ font-size:11.5px; color:var(--muted); line-height:1.5; margin-top:10px; padding:9px 11px; border-radius:9px; background:rgba(93,62,170,.07); border:1px solid rgba(93,62,170,.16); }

/* режим наблюдения — кнопка «Ждать свечу» */
.btn-observe{ width:100%; justify-content:center; gap:8px; margin-bottom:8px; background:linear-gradient(180deg, rgba(93,62,170,.14), rgba(93,62,170,.05)); border:1px solid rgba(93,62,170,.3); color:#c4b5fd; font-weight:700; }
.btn-observe:hover{ border-color:rgba(107,70,193,.6); color:#e6dcff; box-shadow:0 6px 18px rgba(93,62,170,.22); }
.btn-observe:disabled{ opacity:.4; cursor:not-allowed; }
.btn-observe .ic{ width:16px; height:16px; }

/* ===== Live market data (crypto / metals / FX) ===== */
.chart-card{ position:relative; }
.live-load{ position:absolute; inset:0; z-index:40; display:flex; align-items:center; justify-content:center; background:radial-gradient(420px 280px at 50% 42%, rgba(93,62,170,.16), rgba(10,8,22,.74) 70%); backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px); animation:fpFade .2s ease both; }
.live-load.hidden{ display:none; }
.ll-box{ display:flex; flex-direction:column; align-items:center; gap:16px; padding:26px 32px; border-radius:18px; background:linear-gradient(180deg, rgba(93,62,170,.12), rgba(255,255,255,.02)), var(--panel); border:1px solid rgba(93,62,170,.28); box-shadow:0 26px 70px rgba(5,4,16,.6), inset 0 1px 0 rgba(255,255,255,.06); }
.ll-spin{ width:42px; height:42px; border-radius:50%; border:3px solid rgba(93,62,170,.22); border-top-color:#6b46c1; border-right-color:#7e44ad; animation:llspin .8s linear infinite; }
.ll-txt{ font-size:13.5px; font-weight:600; color:var(--txt2); letter-spacing:.01em; }
@keyframes llspin{ to{ transform:rotate(360deg); } }
.im-item.live .im-sym{ background:linear-gradient(120deg,#fbbf24,#f0abfc 60%,#7dd3fc); -webkit-background-clip:text; background-clip:text; color:transparent; }


/* ===== Account ladder (prop-firm) ===== */
.acct-badge{ display:inline-flex; flex-direction:column; align-items:flex-start; gap:1px; line-height:1.05; padding:5px 11px; border-radius:11px; cursor:pointer; background:linear-gradient(180deg, rgba(93,62,170,.16), rgba(255,255,255,.02)); border:1px solid rgba(93,62,170,.3); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); transition:transform .14s ease, box-shadow .14s ease; }
.acct-badge:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(93,62,170,.28); }
.ab-tier{ font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; background:linear-gradient(120deg,#c4b5fd,#f0abfc); -webkit-background-clip:text; background-clip:text; color:transparent; }
.ab-bal{ font-family:var(--mono); font-size:12.5px; font-weight:700; color:var(--txt); }
@media (max-width:900px){ .acct-badge{ display:none; } }

.acct-card{ margin-top:14px; border-radius:16px; padding:16px 16px 14px; background:linear-gradient(180deg, rgba(93,62,170,.1), rgba(255,255,255,.015)), var(--panel); border:1px solid rgba(93,62,170,.22); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
.ac-top{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:13px; }
.ac-tier{ font-size:12px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; background:linear-gradient(120deg,#c4b5fd,#f0abfc); -webkit-background-clip:text; background-clip:text; color:transparent; }
.ac-bal{ font-family:var(--mono); font-size:26px; font-weight:800; color:var(--txt); margin-top:2px; }
.ac-risk{ font-size:11px; font-weight:700; color:var(--txt2); background:rgba(255,255,255,.05); border:1px solid var(--line); border-radius:9px; padding:6px 10px; white-space:nowrap; }
.ac-prog{ margin-bottom:14px; }
.ac-bar{ height:9px; border-radius:6px; background:rgba(255,255,255,.06); overflow:hidden; border:1px solid var(--line); }
.ac-bar span{ display:block; height:100%; border-radius:6px; background:linear-gradient(90deg,#34d399,#22d3ee); box-shadow:0 0 12px rgba(52,211,153,.5); transition:width .5s cubic-bezier(.2,.8,.2,1); }
.ac-lbl{ display:flex; justify-content:space-between; gap:10px; margin-top:7px; font-size:11.5px; font-weight:600; }
.ac-lbl .pos{ color:#34d399; } .ac-lbl .neg{ color:#f87171; }
.ac-world{ text-align:center; font-size:13px; font-weight:800; color:#fbbf24; background:linear-gradient(180deg, rgba(251,191,36,.12), rgba(255,255,255,.01)); border:1px solid rgba(251,191,36,.32); border-radius:12px; padding:11px; margin-bottom:14px; }
.al-list{ display:flex; flex-direction:column; gap:2px; padding-top:4px; border-top:1px solid var(--line); }
.al-row{ display:flex; align-items:center; gap:10px; padding:7px 4px; font-size:13px; }
.al-dot{ width:9px; height:9px; border-radius:50%; flex:none; background:var(--line); box-shadow:0 0 0 3px rgba(255,255,255,.02); }
.al-row.done .al-dot{ background:#34d399; } .al-row.done .al-nm{ color:var(--txt2); }
.al-row.cur .al-dot{ background:#6b46c1; box-shadow:0 0 0 4px rgba(107,70,193,.2); } .al-row.cur{ background:rgba(93,62,170,.08); border-radius:9px; }
.al-row.cur .al-nm{ color:var(--txt); font-weight:700; }
.al-row.lock{ opacity:.5; } .al-row.lock .al-nm{ color:var(--muted); }
.al-nm{ flex:1; } .al-sz{ font-family:var(--mono); font-size:12px; color:var(--txt2); }
.ac-rule{ margin-top:12px; font-size:11.5px; line-height:1.55; color:var(--muted); }

.acct-toast{ position:fixed; left:50%; top:18px; translate:-50% -26px; z-index:400; min-width:240px; text-align:center; padding:13px 22px; border-radius:15px; opacity:0; pointer-events:none; transition:opacity .3s ease, translate .35s cubic-bezier(.2,.8,.2,1); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.acct-toast.show{ opacity:1; translate:-50% 0; }
.acct-toast.up{ background:linear-gradient(180deg, rgba(52,211,153,.22), rgba(93,62,170,.16)), var(--panel); border:1px solid rgba(52,211,153,.4); box-shadow:0 18px 50px rgba(16,120,80,.4); }
.acct-toast.blow{ background:linear-gradient(180deg, rgba(248,113,113,.2), rgba(20,12,18,.5)), var(--panel); border:1px solid rgba(248,113,113,.42); box-shadow:0 18px 50px rgba(120,20,20,.4); }
.at-h{ font-size:13px; font-weight:800; color:var(--txt); letter-spacing:.01em; }
.at-n{ font-family:var(--mono); font-size:12px; color:var(--txt2); margin-top:3px; }

/* ===== Round 2026-06-29 fixes ===== */
/* TF segment relocated into the chart toolbar (de-crowd topbar #2) */
.chart-head{ justify-content:flex-start; row-gap:8px; }
.chart-head .chart-tools{ margin-left:auto; }
.tf-seg{ padding:2px; }
.tf-seg .seg-btn{ padding:6px 9px; font-size:12px; }
.controls{ gap:8px; }
@media (max-width:1200px){ .brand-sub{ display:none; } }

/* intro -> hub entrance (#1) */
@keyframes hubIn { 0%{ opacity:0; transform:scale(.82) translateY(30px); filter:blur(8px); } 55%{ opacity:1; filter:blur(0); } 100%{ opacity:1; transform:none; filter:blur(0); } }
.start-card.hub-in{ animation:hubIn .82s cubic-bezier(.2,.9,.28,1) .14s both; }

/* live instruments on the hub (#3) */
.inst-card.live .ic-sym{ background:linear-gradient(120deg,#fbbf24,#f0abfc 60%,#34d399); -webkit-background-clip:text; background-clip:text; color:transparent; }
.inst-card.live .ic-meta{ display:flex; }
.live-tag{ font-family:var(--mono); font-size:9px; font-weight:800; letter-spacing:.1em; color:#06210f; background:linear-gradient(120deg,#34d399,#22d3ee); padding:2px 7px; border-radius:6px; }

/* contract-cap indicator at the Contracts field (#4) */
.qty-max{ display:inline-block; margin-top:7px; font-size:10.5px; font-weight:600; color:var(--muted); background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:7px; padding:3px 9px; letter-spacing:.02em; }
.qty-max.at-cap{ color:var(--txt-2); border-color:rgba(93,62,170,.28); }
.qty-max.flash{ animation:qtyFlash .5s ease; }
@keyframes qtyFlash{ 0%{ border-color:var(--accent); color:var(--accent); transform:scale(1.06); } 100%{ transform:none; } }

/* clickable rank header -> ranks modal (#7) */
#rankCard{ cursor:pointer; transition:transform .14s ease, box-shadow .14s ease; }
#rankCard:hover{ transform:translateY(-1px); box-shadow:0 8px 22px rgba(93,62,170,.22); }
.ranks-modal-card{ max-width:460px; width:92%; max-height:none; overflow:visible; padding:14px 16px 16px; }
.ranks-modal-head{ display:flex; justify-content:flex-end; margin-bottom:2px; }
.ranks-modal-head .modal-close{ position:static; font-size:18px; }
.ranks-modal-body{ max-height:72vh; overflow:auto; padding-right:6px; }
.ranks-modal-card .ranks-help{ margin-top:0; }

/* tool settings popup (Fibonacci levels etc.) — #4 settings 2026-06-29 */
.tool-pop{ position:fixed; z-index:300; min-width:240px; background:linear-gradient(180deg, rgba(93,62,170,.1), var(--panel)); border:1px solid rgba(93,62,170,.28); border-radius:13px; box-shadow:0 24px 60px rgba(5,4,16,.6); padding:13px 14px; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); animation:fpFadeUp .16s ease both; }
.tp-title{ font-size:12px; font-weight:700; color:var(--txt); margin-bottom:8px; letter-spacing:.01em; }
.tp-input{ width:100%; background:var(--bg); border:1px solid var(--line-2); border-radius:9px; padding:9px 11px; color:var(--txt); font-family:var(--mono); font-size:13px; }
.tp-input:focus{ outline:none; border-color:var(--accent); }
.tp-hint{ font-size:10.5px; color:var(--muted); margin-top:7px; }

/* observe row: Back + Wait side by side */
.observe-row{ display:flex; gap:8px; margin-bottom:8px; }
.observe-row .btn-observe{ margin-bottom:0; flex:1; }
.btn-observe-back{ justify-content:center; gap:6px; background:var(--panel-2); border:1px solid var(--line-2); color:var(--txt-2); font-weight:700; padding:9px 14px; }
.btn-observe-back:hover{ border-color:var(--accent); color:var(--txt); }
.btn-observe-back .ic{ width:15px; height:15px; }
.btn-observe-back.hidden{ display:none; }

.pf-acc.ok{ cursor:pointer; }
.pf-acc.ok:hover{ border-color:rgba(93,62,170,.4); }

/* session-time config (2026-06-30) */
.sess-edit-row{ font-size:11.5px; font-weight:600; color:var(--txt-2); padding:9px 11px 6px; cursor:pointer; border-top:1px solid var(--line); margin-top:4px; }
.sess-edit-row:hover{ color:var(--accent); }
.sess-times-pop{ min-width:264px; }
.st-row{ display:flex; align-items:center; gap:8px; margin-bottom:7px; }
.st-nm{ width:62px; font-weight:700; font-size:12.5px; color:var(--txt); }
.st-in{ width:64px; background:var(--bg); border:1px solid var(--line-2); border-radius:8px; padding:6px 8px; color:var(--txt); font-family:var(--mono); font-size:12.5px; text-align:center; }
.st-in:focus{ outline:none; border-color:var(--accent); }
.st-in.bad{ border-color:var(--short); }
.st-dash{ color:var(--muted); }
.st-reset{ margin-top:6px; width:100%; background:var(--panel-2); border:1px solid var(--line-2); color:var(--txt-2); border-radius:8px; padding:7px; font-weight:600; font-size:12px; cursor:pointer; }
.st-reset:hover{ border-color:var(--accent); color:var(--txt); }

#hideOrderBtn.active{ color:var(--accent); border-color:var(--accent); background:rgba(93,62,170,.12); }

/* intro -> hub cinematic flash */
.intro-flash{ position:fixed; inset:0; z-index:305; pointer-events:none; opacity:0; background:radial-gradient(circle at 50% 46%, rgba(180,130,255,.6), rgba(124,77,255,.22) 42%, transparent 72%); }
.intro-flash.go{ animation:introFlash .62s ease-out forwards; }
@keyframes introFlash{ 0%{ opacity:0; } 28%{ opacity:.9; } 100%{ opacity:0; } }

/* account level-up celebration */
.lvlup-ov{ position:fixed; inset:0; z-index:420; display:flex; align-items:center; justify-content:center; background:radial-gradient(700px 480px at 50% 42%, rgba(124,77,255,.28), rgba(6,5,16,.82) 68%); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); opacity:0; transition:opacity .35s ease; }
.lvlup-ov.show{ opacity:1; }
.lvlup-conf{ position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.lvlup-conf i{ position:absolute; top:-24px; width:9px; height:15px; border-radius:2px; opacity:.95; animation-name:confFall; animation-timing-function:cubic-bezier(.35,.15,.7,1); animation-iteration-count:1; animation-fill-mode:forwards; }
@keyframes confFall{ 0%{ transform:translateY(-12vh) rotate(0); opacity:1; } 100%{ transform:translateY(112vh) rotate(560deg); opacity:.12; } }
.lvlup-card{ position:relative; text-align:center; padding:34px 40px 30px; border-radius:24px; background:linear-gradient(180deg, rgba(124,77,255,.16), rgba(255,255,255,.02)), var(--panel); border:1px solid rgba(124,77,255,.34); box-shadow:0 40px 110px rgba(5,4,16,.7), inset 0 1px 0 rgba(255,255,255,.07); transform:scale(.7) translateY(14px); opacity:0; transition:transform .5s cubic-bezier(.2,1.3,.35,1), opacity .4s ease; }
.lvlup-ov.show .lvlup-card{ transform:none; opacity:1; }
.lvlup-badge{ width:74px; height:74px; margin:0 auto 16px; border-radius:50%; display:grid; place-items:center; background:radial-gradient(circle at 50% 35%, rgba(251,191,36,.3), rgba(124,77,255,.12)); border:1px solid rgba(251,191,36,.4); animation:lvlPulse 1.8s ease-in-out infinite; }
.lvlup-tr{ width:38px; height:38px; fill:none; stroke:#fbbf24; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
@keyframes lvlPulse{ 0%,100%{ box-shadow:0 0 30px rgba(251,191,36,.35); } 50%{ box-shadow:0 0 54px rgba(251,191,36,.62); } }
.lvlup-kicker{ font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#fbbf24; margin-bottom:8px; }
.lvlup-tier{ font-size:34px; font-weight:800; letter-spacing:-.01em; background:linear-gradient(120deg,#fff,#c4b5fd); -webkit-background-clip:text; background-clip:text; color:transparent; }
.lvlup-bal{ font-family:var(--mono); font-size:20px; font-weight:700; color:var(--txt-2); margin-top:4px; }
.lvlup-btn{ margin-top:22px; background:linear-gradient(135deg,#5d3eaa,#7e44ad); border:none; color:#fff; font-weight:700; font-size:15px; padding:13px 34px; border-radius:13px; cursor:pointer; box-shadow:0 12px 32px rgba(93,62,170,.5); transition:transform .15s ease, box-shadow .15s ease; }
.lvlup-btn:hover{ transform:translateY(-2px); box-shadow:0 18px 42px rgba(93,62,170,.62); }

/* hub -> workspace cinematic zoom (2026-06-30) */
.start-screen{ transition:opacity .72s ease, visibility .72s, transform .82s cubic-bezier(.6,0,.3,1), filter .68s ease; }
.start-screen.hidden{ display:grid !important; opacity:0; visibility:hidden; pointer-events:none; transform:scale(1.55); filter:blur(13px); }
@keyframes wsIn { 0%{ opacity:0; transform:scale(.92) translateY(18px); filter:blur(7px); } 60%{ opacity:1; filter:blur(0); } 100%{ opacity:1; transform:none; } }
.workspace.ws-in{ animation:wsIn .78s cubic-bezier(.2,.9,.28,1) .1s both; }
.lvlup-badge.rank-badge{ background:radial-gradient(circle at 50% 35%, rgba(124,77,255,.24), rgba(255,255,255,.03)); border-color:rgba(124,77,255,.42); animation:none; box-shadow:0 0 40px rgba(124,77,255,.42); }


/* ============================================================
   PREMIUM POLISH — July 2026 (glassmorphic command deck pass)
   ============================================================ */

/* --- global texture & selection --- */
::selection{background:rgba(124,77,255,.35);color:#fff}
body{
  background-image:
    radial-gradient(1100px 520px at 12% -8%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 60%),
    radial-gradient(900px 480px at 108% 12%, rgba(34,211,238,.07), transparent 55%),
    radial-gradient(1200px 800px at 50% 115%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 60%);
  background-attachment:fixed;
}
body.light{background-image:none}

/* --- refined scrollbars --- */
*{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:8px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:var(--muted);border:2px solid transparent;background-clip:content-box}

/* --- focus rings (a11y + premium) --- */
button:focus-visible,input:focus-visible,select:focus-visible,[role="group"] :focus-visible{
  outline:2px solid color-mix(in srgb, var(--accent) 80%, #fff 20%);outline-offset:2px;border-radius:8px
}

/* --- buttons: depth + micro-motion --- */
.btn,.pbtn,.tool-btn,.seg-btn,.intro-cta{will-change:transform}
.btn:hover,.tool-btn:hover{transform:translateY(-1px)}
.btn:active,.tool-btn:active,.pbtn:active,.seg-btn:active{transform:translateY(0) scale(.985)}
.btn-primary{
  background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 88%, #fff 12%) 0%, var(--accent) 42%, var(--accent-2) 100%);
  box-shadow:0 1px 0 rgba(255,255,255,.14) inset, 0 -10px 18px rgba(0,0,0,.16) inset, 0 8px 22px -8px color-mix(in srgb, var(--accent) 65%, transparent);
}
.btn-primary:hover{box-shadow:0 1px 0 rgba(255,255,255,.18) inset, 0 -10px 18px rgba(0,0,0,.14) inset, 0 12px 30px -8px color-mix(in srgb, var(--accent) 80%, transparent)}
.btn-submit.ready{box-shadow:0 1px 0 rgba(255,255,255,.15) inset, 0 10px 30px -8px color-mix(in srgb, var(--accent) 75%, transparent)}

/* --- panels & cards: layered depth --- */
.panel,.start-card,.modal-card{
  box-shadow:0 1px 0 rgba(255,255,255,.035) inset, 0 24px 60px -28px rgba(0,0,0,.65);
}
.start-card{
  border:1px solid color-mix(in srgb, var(--accent) 26%, var(--line-2));
  background:
    linear-gradient(var(--panel), var(--panel)) padding-box,
    linear-gradient(160deg, color-mix(in srgb, var(--accent) 55%, transparent), transparent 38%, transparent 62%, rgba(34,211,238,.25)) border-box;
}

/* --- modals: glass --- */
.modal{backdrop-filter:blur(10px) saturate(1.15);-webkit-backdrop-filter:blur(10px) saturate(1.15)}
.modal-card{background:color-mix(in srgb, var(--panel) 92%, transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

/* --- topbar: floating glass --- */
.topbar{
  background:color-mix(in srgb, var(--panel) 78%, transparent);
  backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);
  border-bottom:1px solid color-mix(in srgb, var(--accent) 14%, var(--line));
}

/* --- display typography --- */
.intro-title,.start-title,.lvlup-tier{font-family:var(--display);letter-spacing:.5px}
.intro-title{font-weight:900}
.start-title{font-weight:700}
.lvlup-tier{font-weight:900}
.brand-mark,.intro-logo{font-family:var(--display);font-weight:900;letter-spacing:0}

/* --- instrument cards: hover lift + accent edge --- */
.inst-card{position:relative;overflow:hidden}
.inst-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb, var(--accent) 55%, var(--line-2));box-shadow:0 14px 30px -16px color-mix(in srgb, var(--accent) 45%, transparent)}
.inst-card.active{box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 70%, transparent) inset, 0 14px 34px -16px color-mix(in srgb, var(--accent) 55%, transparent)}
.inst-card::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,.05) 50%, transparent 70%);translate:-120% 0;transition:translate .5s ease}
.inst-card:hover::after{translate:120% 0}

/* --- intro CTA: shimmer sweep --- */
.intro-cta{position:relative;overflow:hidden}
.intro-cta::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg, transparent 32%, rgba(255,255,255,.18) 50%, transparent 68%);translate:-130% 0;animation:ctaSweep 3.6s ease-in-out infinite}
@keyframes ctaSweep{0%,55%{translate:-130% 0}85%,100%{translate:130% 0}}

/* --- result badge: glow by outcome --- */
.result-badge.win{box-shadow:0 0 0 1px rgba(22,199,132,.35) inset, 0 10px 34px -12px rgba(22,199,132,.5)}
.result-badge.loss{box-shadow:0 0 0 1px rgba(246,70,93,.35) inset, 0 10px 34px -12px rgba(246,70,93,.45)}

/* --- level-up celebration card --- */
.lvlup-card{
  background:color-mix(in srgb, var(--panel) 88%, transparent);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border:1px solid color-mix(in srgb, var(--accent) 40%, var(--line-2));
  box-shadow:0 30px 90px -20px rgba(0,0,0,.7), 0 0 60px -18px color-mix(in srgb, var(--accent) 60%, transparent);
}

/* --- chips --- */
.chip{box-shadow:0 6px 16px -8px color-mix(in srgb, var(--accent) 60%, transparent)}

/* --- leaderboard rows hover --- */
.lb-row{transition:background .15s ease, transform .15s ease}
.lb-row:hover{background:color-mix(in srgb, var(--accent) 8%, transparent)}

/* --- reduced motion --- */
@media (prefers-reduced-motion: reduce){
  .intro-cta::before{animation:none}
  .inst-card::after{display:none}
  .btn:hover,.tool-btn:hover,.inst-card:hover{transform:none}
}

/* close-now button */
.pbtn.danger{border-color:rgba(246,70,93,.5);color:#f6465d;font-weight:700}
.pbtn.danger:hover:not(:disabled){background:rgba(246,70,93,.14);border-color:#f6465d;transform:translateY(-1px)}
.pbtn.danger:disabled{opacity:.38;cursor:default}


/* ==================================================================
   DIMENSION LAYER — pre-dawn glassmorphic command deck (Jul 2026)
   Adapted from the Dimension reference: hairlines, glass, pills,
   whisper-weight display, indigo-as-atmosphere. Green/red stay sacred.
   ================================================================== */

:root{
  --hairline: rgba(229,231,238,.08);
  --hairline-2: rgba(229,231,238,.15);
  --indigo: #6b62f2;
}

/* ---------- atmosphere ---------- */
body:not(.light){
  background-image:
    radial-gradient(52% 44% at 50% 30%, rgba(107,98,242,.14), transparent 70%),
    radial-gradient(900px 480px at 108% 8%, rgba(34,211,238,.05), transparent 55%);
  background-attachment:fixed;
}
body:not(.light) .start-screen{
  background:
    linear-gradient(180deg, rgba(10,10,16,.42) 0%, rgba(10,10,16,.62) 55%, rgba(10,10,16,.86) 100%),
    url("../predawn.webp") center/cover no-repeat fixed;
}
body:not(.light) #intro{
  background:
    radial-gradient(46% 42% at 50% 34%, rgba(107,98,242,.14), transparent 70%),
    linear-gradient(180deg, rgba(9,10,18,.18) 0%, rgba(9,10,18,.34) 60%, rgba(9,10,18,.72) 100%);
}

/* ---------- hairline discipline: borders whisper, not shout ---------- */
body:not(.light) .panel,
body:not(.light) .chart-card,
body:not(.light) .journal-card,
body:not(.light) .start-card,
body:not(.light) .modal-card,
body:not(.light) .start-profile,
body:not(.light) .stat,
body:not(.light) .readout,
body:not(.light) .inst-card,
body:not(.light) .acct-card,
body:not(.light) .hk b{ border-color:var(--hairline); }

/* ---------- radius language: pills for actions, 24px for cards ---------- */
.btn,.pbtn,.tool-btn,.seg,.seg-btn,.topbar-select,.chip,.acct-badge,.rank-chip,.an-ai-btn,.intro-cta,.intro-ghost,.lvlup-btn,.auth-skip{ border-radius:999px !important; }
.seg{ overflow:hidden; }
.panel,.chart-card,.journal-card,.modal-card,.acct-card{ border-radius:24px; }
.start-card{ border-radius:28px; }
.inst-card{ border-radius:18px; }
.readout,.ticket-input,.intro-input,.bt-input,.lb-name-input,.tp-input,select,input[type="number"],input[type="text"],input[type="email"],input[type="password"]{ border-radius:12px !important; }
.stat{ border-radius:14px; }
.dir{ border-radius:16px; }
.hk b{ border-radius:8px; }

/* ---------- glass surfaces ---------- */
body:not(.light) .panel,
body:not(.light) .journal-card{
  background:color-mix(in srgb, var(--panel) 86%, transparent);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
body:not(.light) .chart-card{
  background:color-mix(in srgb, var(--panel) 90%, transparent);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 24px 48px rgba(0,0,0,.35);
}
body:not(.light) .start-card{
  background:color-mix(in srgb, var(--panel) 78%, transparent);
  backdrop-filter:blur(26px) saturate(1.15); -webkit-backdrop-filter:blur(26px) saturate(1.15);
  border:1px solid var(--hairline);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 24px 48px rgba(0,0,0,.35);
}
body:not(.light) .modal-card{
  background:color-mix(in srgb, var(--panel) 84%, transparent);
  backdrop-filter:blur(24px) saturate(1.1); -webkit-backdrop-filter:blur(24px) saturate(1.1);
  border:1px solid var(--hairline);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 24px 48px rgba(0,0,0,.4);
}

/* ---------- floating glass topbar ---------- */
body:not(.light) .topbar{
  margin:12px 14px 2px; border-radius:20px;
  border:1px solid var(--hairline);
  background:color-mix(in srgb, var(--panel) 72%, transparent);
  backdrop-filter:blur(20px) saturate(1.2); -webkit-backdrop-filter:blur(20px) saturate(1.2);
  box-shadow:0 8px 32px rgba(0,0,0,.4);
}

/* ---------- buttons: quiet glass, motion on hover ---------- */
body:not(.light) .btn,
body:not(.light) .pbtn,
body:not(.light) .tool-btn,
body:not(.light) .topbar-select{
  background:rgba(255,255,255,.03);
  border-color:var(--hairline);
}
body:not(.light) .btn:hover,
body:not(.light) .pbtn:hover:not(:disabled),
body:not(.light) .tool-btn:hover,
body:not(.light) .topbar-select:hover{
  background:rgba(255,255,255,.06);
  border-color:var(--hairline-2);
}
body:not(.light) .seg-btn{ background:transparent; }
body:not(.light) .seg-btn.active{ background:rgba(255,255,255,.08); }
.btn-primary,.pbtn.primary,.intro-cta,.btn-submit.ready,.lvlup-btn{
  background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 92%, #fff 8%), var(--accent) 45%, var(--accent-2)) !important;
  border-color:transparent !important; color:#fff !important;
}

/* ---------- micro-caps labels ---------- */
.panel-title,.start-label{
  font-size:11px; letter-spacing:.14em; font-weight:600; color:var(--muted);
}

/* ---------- hub ---------- */
.start-title{ font-family:var(--display); font-weight:500; letter-spacing:.02em; font-size:26px; }
body:not(.light) .inst-card{ background:rgba(255,255,255,.025); border-width:1px; }
body:not(.light) .inst-card:hover{ background:rgba(255,255,255,.05); border-color:rgba(107,98,242,.45); box-shadow:0 14px 30px -16px rgba(107,98,242,.4); }
body:not(.light) .inst-card.active{ background:rgba(107,98,242,.10); border-color:rgba(107,98,242,.65); box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 14px 34px -16px rgba(107,98,242,.5); }
body:not(.light) .start-profile{ background:rgba(255,255,255,.03); border-radius:18px; }
.start-go{ height:52px; font-size:15.5px; letter-spacing:.02em; }

/* ---------- intro: whisper display ---------- */
.intro-title{ font-weight:500; letter-spacing:0; }
.intro-title .tw-g{ background:linear-gradient(92deg,#8b7bff,#c9b8ff); -webkit-background-clip:text; background-clip:text; }
.intro-sub{ color:var(--txt-2); }
.spec{ border:1px solid var(--hairline); border-radius:999px; padding:5px 12px; background:rgba(20,21,29,.5); backdrop-filter:blur(8px); }
.intro-ghost{ border:1px solid var(--hairline) !important; }

/* ---------- ticket: LONG / SHORT presence ---------- */
.dir{ min-height:56px; }
body:not(.light) .dir{ background:rgba(255,255,255,.025); border-color:var(--hairline); }
body:not(.light) .dir.long:hover, body:not(.light) .dir.long.active{ background:rgba(22,199,132,.12); border-color:rgba(22,199,132,.6); box-shadow:0 10px 30px -12px rgba(22,199,132,.45); }
body:not(.light) .dir.short:hover, body:not(.light) .dir.short.active{ background:rgba(246,70,93,.12); border-color:rgba(246,70,93,.6); box-shadow:0 10px 30px -12px rgba(246,70,93,.45); }
body:not(.light) .readout,
body:not(.light) .stat{ background:rgba(255,255,255,.025); }

/* ---------- player: floating dock ---------- */
body:not(.light) .player{
  background:color-mix(in srgb, var(--panel) 74%, transparent);
  border:1px solid var(--hairline); border-radius:999px;
  padding:8px 12px;
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  box-shadow:0 8px 32px rgba(0,0,0,.35);
}
.player-track{ border-radius:999px; }
.player-fill{ background:linear-gradient(90deg, var(--indigo), #9a7bff); }

/* ---------- hairline dividers in modals/lists ---------- */
body:not(.light) .lb-row{ border-bottom:1px solid rgba(229,231,238,.06); }
body:not(.light) .rh-row{ border-color:rgba(229,231,238,.06); }
body:not(.light) .al-row{ border-color:rgba(229,231,238,.06); }

/* ---------- celebration: glass over the dawn ---------- */
body:not(.light) .lvlup-ov{ backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2); }
.lvlup-tier{ font-weight:700; letter-spacing:.04em; }

/* ---------- calm the old shimmer (Dimension: no chrome noise) ---------- */
.intro-cta::before{ animation-duration:6s; opacity:.6; }
.inst-card::after{ display:none; }
.chip{ box-shadow:none; }

/* ---------- workspace grid air ---------- */
@media (min-width: 1100px){
  .workspace{ gap:18px; padding:0 14px 18px; }
}


/* ===== LIVING WORLD LAYER (Active-Theory pass) ===== */
.start-screen > .intro-gl{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.start-screen > .intro-gl canvas{ width:100% !important; height:100% !important; display:block; }
/* intro keeps its original fixed positioning */
.intro-bg{ display:none; }
.start-card{ position:relative; z-index:2; }
body:not(.light) .start-card{ background:color-mix(in srgb, var(--panel) 64%, transparent); }


/* during the intro the hub stays out of frame */
.start-screen.intro-live .start-card{ visibility:hidden !important; opacity:0; pointer-events:none; transform:scale(.985); }
.start-card{ transition:opacity .5s ease .15s, transform .6s cubic-bezier(.23,1,.32,1) .15s; }


/* ==================================================================
   MOTION CHOREOGRAPHY — everything arrives, nothing just appears
   ================================================================== */

/* старый 2D-эффект убран насовсем */
#introFx{ display:none !important; }

/* opening: герой проявляется ПОСЛЕ сборки логотипа из частиц */
#intro .scene[data-scene="hero"] > *{ opacity:0; transform:translateY(16px); transition:opacity .7s ease, transform .9s cubic-bezier(.23,1,.32,1); }
#intro.world-ready .scene[data-scene="hero"] > *{ opacity:1; transform:none; }
#intro.world-ready .scene[data-scene="hero"] > *:nth-child(1){ transition-delay:.05s; }
#intro.world-ready .scene[data-scene="hero"] > *:nth-child(2){ transition-delay:.20s; }
#intro.world-ready .scene[data-scene="hero"] > *:nth-child(3){ transition-delay:.34s; }
#intro.world-ready .scene[data-scene="hero"] > *:nth-child(4){ transition-delay:.48s; }

/* во время имплозии сферы герой красиво уходит */
#intro.intro-leaving .scene[data-scene="hero"] > *{ opacity:0 !important; transform:translateY(-14px) scale(.97) !important; transition:opacity .45s ease, transform .5s ease; }

/* хаб прибывает каскадом после вспышки */
.start-card.hub-in > *{ opacity:0; animation:hubChild .65s cubic-bezier(.23,1,.32,1) forwards; }
.start-card.hub-in > *:nth-child(1){ animation-delay:.03s; }
.start-card.hub-in > *:nth-child(2){ animation-delay:.11s; }
.start-card.hub-in > *:nth-child(3){ animation-delay:.19s; }
.start-card.hub-in > *:nth-child(4){ animation-delay:.27s; }
.start-card.hub-in > *:nth-child(5){ animation-delay:.35s; }
.start-card.hub-in > *:nth-child(6){ animation-delay:.43s; }
@keyframes hubChild{ from{ opacity:0; transform:translateY(18px) scale(.985); } to{ opacity:1; transform:none; } }

/* рабочий стол: график и панели заезжают со сдвигом */
.workspace.ws-in .chart-card{ animation:wsArrive .6s cubic-bezier(.23,1,.32,1) both; }
.workspace.ws-in .panel{ animation:wsArrive .6s cubic-bezier(.23,1,.32,1) .10s both; }
.workspace.ws-in .journal-card{ animation:wsArrive .6s cubic-bezier(.23,1,.32,1) .18s both; }
@keyframes wsArrive{ from{ opacity:0; transform:translateY(22px) scale(.992); } }

/* модалки: мягкий пружинный вход */
.modal:not(.hidden) .modal-card{ animation:modalIn .45s cubic-bezier(.22,1.15,.36,1) both; }
@keyframes modalIn{ from{ opacity:0; transform:translateY(16px) scale(.965); } }

/* выпадающие меню */
.inst-menu{ animation:menuIn .26s cubic-bezier(.23,1,.32,1) both; transform-origin:top center; }
@keyframes menuIn{ from{ opacity:0; transform:translateY(-6px) scale(.97); } }

/* результат сделки прибывает */
#resultPanel:not(.hidden){ animation:wsArrive .5s cubic-bezier(.23,1,.32,1) both; }

@media (prefers-reduced-motion: reduce){
  #intro .scene[data-scene="hero"] > *{ opacity:1; transform:none; transition:none; }
  .start-card.hub-in > *{ animation:none; opacity:1; }
  .workspace.ws-in .chart-card,.workspace.ws-in .panel,.workspace.ws-in .journal-card{ animation:none; }
  .modal:not(.hidden) .modal-card{ animation:none; }
  .inst-menu{ animation:none; }
  #resultPanel:not(.hidden){ animation:none; }
}


/* ==================================================================
   FINAL POLISH — переходы без изъянов + общий тюнинг
   ================================================================== */

/* хаб уходит в глубину при старте практики */
.start-card.hub-out{ animation:hubOut .34s cubic-bezier(.4,0,.7,.2) forwards !important; }
.start-card.hub-out > *{ opacity:1 !important; animation:none !important; }
@keyframes hubOut{ to{ opacity:0; transform:translateY(-18px) scale(.972); } }

/* плавный скролл + аккуратный оверскролл */
html{ scroll-behavior:smooth; }
body{ overscroll-behavior-y:none; }

/* нажатия ощущаются */
.seg-btn:active,.dtool:active,.dir:active{ transform:scale(.985); }

/* поля ввода: кольцо при фокусе */
body:not(.light) input:focus,body:not(.light) select:focus{
  border-color:color-mix(in srgb, var(--accent) 70%, transparent) !important;
  box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}

/* журнал и лидерборд: строки отзываются */
.journal-card tbody tr{ transition:background .15s ease; }
.journal-card tbody tr:hover{ background:rgba(255,255,255,.03); }

/* тосты прибывают снизу с пружиной */
.acct-toast,.rank-toast{ transition:transform .45s cubic-bezier(.22,1.15,.36,1), opacity .35s ease; }

/* заставка: лёгкое дыхание логотипа уже после сборки */
#intro.world-ready .intro-logo{ animation:logoFloat 5s ease-in-out 1.2s infinite; }

@media (prefers-reduced-motion: reduce){
  .start-card.hub-out{ animation:none !important; opacity:0; }
  html{ scroll-behavior:auto; }
}


/* ==================================================================
   JOURNEY — сфера-мозг: скролл ведёт через мир
   ================================================================== */
.start-screen{ display:block !important; padding:0 !important; scroll-behavior:smooth; }
.journey{ position:relative; z-index:2; }
.jsec{ min-height:100vh; display:grid; place-items:center; align-content:center; justify-items:center; padding:48px 20px; position:relative; }
.start-screen.intro-live .journey{ visibility:hidden; }

.j-logo{ width:104px; height:104px; border-radius:26px; display:grid; place-items:center; background:linear-gradient(135deg,#6b62f2,#8b5cf6); box-shadow:0 22px 72px rgba(107,98,242,.5); margin-bottom:26px; }
.j-logo span{ font-family:var(--display); font-weight:900; font-size:40px; color:#fff; }
.j-title{ font-family:var(--display); font-weight:500; font-size:clamp(42px,7vw,74px); line-height:1.04; text-align:center; margin:0 0 14px; }
.j-title b{ font-weight:500; background:linear-gradient(92deg,#8b7bff,#d8b4fe); -webkit-background-clip:text; background-clip:text; color:transparent; }
.j-sub{ color:var(--txt-2); font-size:17px; margin:0; }
.j-hero > *{ opacity:0; transform:translateY(16px); transition:opacity .8s ease, transform .9s cubic-bezier(.23,1,.32,1); }
.jsec.in > *{ opacity:1; transform:none; }
.j-hero > *:nth-child(2){ transition-delay:.12s; } .j-hero > *:nth-child(3){ transition-delay:.24s; } .j-hero > *:nth-child(4){ transition-delay:.4s; }

.j-scroll-hint{ position:absolute; bottom:30px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:9px; cursor:pointer; opacity:.75; transition:opacity .3s; }
.j-scroll-hint:hover{ opacity:1; }
.j-scroll-hint i{ width:24px; height:38px; border:2px solid var(--hairline-2); border-radius:14px; position:relative; }
.j-scroll-hint i::before{ content:""; position:absolute; left:50%; top:7px; width:3px; height:7px; margin-left:-1.5px; border-radius:3px; background:var(--txt-2); animation:wheelDrop 1.6s ease-in-out infinite; }
@keyframes wheelDrop{ 0%{ opacity:0; transform:translateY(0);} 30%{opacity:1;} 100%{ opacity:0; transform:translateY(12px);} }
.j-scroll-hint span{ font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }

.j-phrases{ gap:9vh; }
.j-phrase{ font-size:clamp(22px,3.2vw,34px); font-weight:600; color:var(--txt); text-align:center; max-width:760px; margin:0; opacity:.16; transform:translateY(20px) scale(.985); transition:opacity .7s ease, transform .8s cubic-bezier(.23,1,.32,1); }
.j-phrase.in{ opacity:1; transform:none; }

.j-hub{ padding:64px 20px; }

/* портал в терминал */
.portal{ width:min(880px,88vw); aspect-ratio:16/9; cursor:pointer; position:relative; opacity:0; transform:translateY(26px) scale(.97); transition:opacity .8s ease, transform .9s cubic-bezier(.23,1,.32,1); }
.portal.in{ opacity:1; transform:none; }
.portal-frame{ position:absolute; inset:0; border-radius:28px; overflow:hidden; border:1px solid var(--hairline-2); background:linear-gradient(180deg, rgba(21,22,31,.92), rgba(13,14,22,.96)); box-shadow:0 50px 140px -40px rgba(0,0,0,.85), 0 0 90px -25px rgba(107,98,242,.55), inset 0 1px 0 rgba(255,255,255,.07); transition:transform .45s cubic-bezier(.23,1,.32,1), box-shadow .45s; }
.portal:hover .portal-frame{ transform:scale(1.018); box-shadow:0 60px 160px -40px rgba(0,0,0,.9), 0 0 130px -25px rgba(107,98,242,.8), inset 0 1px 0 rgba(255,255,255,.09); }
.portal-chart{ position:absolute; left:0; right:0; bottom:0; width:100%; height:58%; opacity:.5; }
.portal-glow{ position:absolute; inset:0; background:radial-gradient(58% 70% at 50% 42%, rgba(107,98,242,.16), transparent 70%); pointer-events:none; }
.portal-label{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
.portal-label span{ font-family:var(--display); font-weight:500; font-size:clamp(26px,3.6vw,40px); color:var(--txt); }
.portal-label small{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.portal.zooming .portal-frame{ transform:scale(7); opacity:0; transition:transform .62s cubic-bezier(.7,0,.85,.4), opacity .5s .12s; }
.portal.zooming .portal-label{ opacity:0; transition:opacity .25s; }

/* ==================================================================
   КАЛЕНДАРЬ P&L (профиль)
   ================================================================== */
.pf-cal{ margin-top:16px; }
.cal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.cal-title{ font-weight:700; font-size:14px; text-transform:capitalize; }
.cal-nav{ width:30px; height:30px; border-radius:999px; border:1px solid var(--hairline); background:rgba(255,255,255,.03); color:var(--txt-2); font-size:16px; cursor:pointer; transition:.15s; }
.cal-nav:hover{ background:rgba(255,255,255,.07); color:var(--txt); }
.cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:5px; }
.cal-wd{ font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); text-align:center; padding:4px 0; }
.cal-cell{ min-height:52px; border-radius:10px; border:1px solid rgba(229,231,238,.05); background:rgba(255,255,255,.02); padding:5px 6px; display:flex; flex-direction:column; gap:2px; }
.cal-cell.empty{ border-color:transparent; background:transparent; }
.cal-cell.today{ border-color:rgba(107,98,242,.6); }
.cal-cell.win{ background:rgba(22,199,132,.14); border-color:rgba(22,199,132,.35); }
.cal-cell.loss{ background:rgba(246,70,93,.12); border-color:rgba(246,70,93,.32); }
.cal-d{ font-size:10.5px; color:var(--muted); }
.cal-pnl{ font-family:var(--mono); font-size:11px; font-weight:700; }
.cal-cell.win .cal-pnl{ color:var(--long); }
.cal-cell.loss .cal-pnl{ color:var(--short); }
.cal-n{ font-size:9.5px; color:var(--muted); }

@media (prefers-reduced-motion: reduce){
  .j-hero > *,.j-phrase,.portal{ opacity:1 !important; transform:none !important; transition:none !important; }
  .portal.zooming .portal-frame{ transition:none; }
}


/* ==================================================================
   ABSOLUTE VOID — по токенам Active Theory: чёрный войд, хром-шёпот,
   цвет несёт только мир. Движение — opacity, неторопливое.
   ================================================================== */
body:not(.light){ background:#000 !important; background-image:none !important; }
body:not(.light) .start-screen{ background:#000 !important; }
body:not(.light) .start-screen::after{ content:""; position:fixed; inset:0; pointer-events:none; z-index:0; background:radial-gradient(50% 38% at 50% 24%, rgba(107,98,242,.10), transparent 70%); }
body:not(.light) #intro{ background:rgba(0,0,0,.62) !important; backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px); }

/* герой: TP из частиц — сверху, текст — внизу, только opacity */
.j-hero{ align-content:end; padding-bottom:14vh; }
.j-title{ font-size:clamp(36px,5.4vw,56px); margin:0 0 10px; }
.j-sub{ color:#c6c6c6; opacity:.75; font-size:15px; }
.j-hero > *{ transform:none !important; transition:opacity 1.15s ease .1s; }
#journey:not(.world-ready) .j-hero > *{ opacity:0 !important; }
#journey.world-ready .j-hero.in > *{ opacity:1; }
#journey.world-ready .j-hero.in > *:nth-child(2){ transition-delay:.4s; }
#journey.world-ready .j-hero.in > *:nth-child(3){ transition-delay:.7s; }

/* фразы: из тьмы к белому */
.j-phrase{ font-weight:500; color:#fff; opacity:.10; }
.j-phrase.in{ opacity:1; }

/* хаб-карта — призрачное стекло над войдом */
body:not(.light) .start-card{ background:rgba(8,8,13,.55) !important; border-color:rgba(255,255,255,.08) !important; }

/* портал — люминесцентное окно */
body:not(.light) .portal-frame{ background:rgba(0,0,0,.5); border-color:rgba(255,255,255,.13); }
.portal-frame::before{ content:""; position:absolute; inset:14px; border:1px solid rgba(255,255,255,.07); border-radius:18px; pointer-events:none; }
.portal-glow{ animation:portalDrift 8s ease-in-out infinite; }
@keyframes portalDrift{ 0%,100%{ transform:translate3d(-2%,0,0); } 50%{ transform:translate3d(2%,1.5%,0); } }
.portal-chart{ opacity:.34; filter:saturate(.8); }
.portal-label small{ color:#999999; letter-spacing:.22em; font-size:10.5px; }
.portal{ transition:opacity 1s ease, transform .3s ease; }

@media (prefers-reduced-motion: reduce){
  #journey:not(.world-ready) .j-hero > *{ opacity:1 !important; }
  .portal-glow{ animation:none; }
}


/* ==================================================================
   MADNESS PACK — мир прибит к экрану, прелоадер, моно-нав, курсор
   ================================================================== */

/* КРИТИЧНО: вселенная не скроллится — она живёт за страницей */
.start-screen > .intro-gl{ position:fixed !important; inset:0 !important; }

/* прелоадер */
#preloader{ position:fixed; inset:0; z-index:10000; background:#000; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; transition:opacity .7s ease; }
#preloader.done{ opacity:0; pointer-events:none; }
.pl-mark{ font-family:var(--display); font-weight:900; font-size:34px; color:#fff; letter-spacing:.06em; }
.pl-num{ font-family:var(--mono); font-size:13px; color:#999; letter-spacing:.3em; }
.pl-num::after{ content:"%"; opacity:.6; }
.pl-bar{ width:min(320px,60vw); height:1px; background:rgba(255,255,255,.12); overflow:hidden; }
.pl-bar i{ display:block; height:100%; width:0; background:#fff; transition:width .2s ease; }

/* боковая моно-навигация (AT /work) */
.j-nav{ position:fixed; left:34px; top:50%; transform:translateY(-50%); z-index:5; display:flex; flex-direction:column; gap:13px; font-family:var(--mono); }
.jn-t{ font-size:9.5px; letter-spacing:.3em; color:#666; margin-bottom:6px; }
.j-nav a{ font-size:11px; letter-spacing:.14em; color:#888; cursor:pointer; transition:color .25s ease, transform .25s ease; text-transform:uppercase; }
.j-nav a:hover{ color:#fff; }
.j-nav a.act{ color:#fff; transform:translateX(6px); }
@media (max-width:1080px){ .j-nav{ display:none; } }
.start-screen.intro-live .j-nav{ visibility:hidden; }

/* кастомный курсор */
#cursorDot,#cursorRing{ position:fixed; left:0; top:0; pointer-events:none; z-index:10001; opacity:0; transition:opacity .3s ease; }
#cursorDot{ width:7px; height:7px; margin:-3.5px 0 0 -3.5px; border-radius:50%; background:#cabaff; box-shadow:0 0 9px rgba(150,120,255,.9); }
#cursorRing{ width:34px; height:34px; margin:-17px 0 0 -17px; border-radius:50%; border:1px solid rgba(186,166,255,.55); transition:opacity .3s ease, width .25s ease, height .25s ease, margin .25s ease, border-color .25s ease; }
#cursorRing.big{ width:52px; height:52px; margin:-26px 0 0 -26px; border-color:#b9a3ff; }

/* фразы: blur-проявление (adidas-стиль) */
.j-phrase{ filter:blur(9px); transition:opacity .8s ease, filter .9s ease, transform .9s ease; }
.j-phrase.in{ filter:blur(0); }

/* подпись портала — моно-терминальность */
.portal-label small{ font-family:var(--mono); }

@media (prefers-reduced-motion: reduce){
  .j-phrase{ filter:none; }
  #cursorDot,#cursorRing{ display:none; }
}


/* читаемость фраз над миром + блок «Как вошёл бы ИИ» */
.j-phrase{ text-shadow:0 2px 26px rgba(0,0,0,.95), 0 0 3px rgba(0,0,0,.9); }
.j-title,.j-sub{ text-shadow:0 2px 22px rgba(0,0,0,.9); }
.rv-ae{ display:flex; flex-direction:column; gap:4px; margin:10px 0 2px; padding:11px 14px; border:1px solid rgba(245,185,66,.35); border-left:3px solid #f5b942; border-radius:12px; background:rgba(245,185,66,.06); }
.rv-ae-t{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#f5b942; font-weight:700; }
.rv-ae-x{ font-size:13px; color:var(--txt-2); line-height:1.5; }


/* ===== AT-EXPEDITION UPLIFT ===== */
/* гигантские рубленые заголовки-фразы (как CREATIVE DIGITAL EXPERIENCES) */
.j-phrase{ font-family:var(--display); font-weight:700; font-size:clamp(30px,5vw,58px); line-height:1.14; letter-spacing:.005em; max-width:900px; }

/* кольцо-якорь, путешествующее сквозь сайт */
.j-emblem{ position:fixed; top:26px; left:50%; width:46px; height:46px; margin-left:-23px; z-index:5; opacity:0; transition:opacity .7s ease; pointer-events:none; }
.j-emblem.on{ opacity:.92; }
.je-ring{ transform-origin:32px 32px; animation:jeSpin 14s linear infinite; }
@keyframes jeSpin{ to{ transform:rotate(360deg); } }
.start-screen.intro-live .j-emblem{ visibility:hidden; }
@media (prefers-reduced-motion: reduce){ .je-ring{ animation:none; } }


/* глитч-хроматика на титуле портала при наведении (AT work-cards) */
.portal:hover .portal-label span{ text-shadow:2px 0 rgba(246,70,93,.5), -2px 0 rgba(34,211,238,.5), 0 2px 24px rgba(0,0,0,.9); }
.pl-num{ color:#7db3c9; }

/* wave2: light segment sweeping the TP anchor-ring */
#jEmblem .je-arc{transform-origin:32px 32px;filter:drop-shadow(0 0 3px rgba(160,130,255,.95)) drop-shadow(0 0 7px rgba(120,90,255,.5));animation:jeArcSweep 3.6s linear infinite;opacity:.92}
@keyframes jeArcSweep{to{stroke-dashoffset:-164}}
@media (prefers-reduced-motion:reduce){#jEmblem .je-arc{animation:none}}

/* wave2: Mont-Fort useful scroll-chapters */
#jPhrases.j-phrases{display:block;padding:0;max-width:none}
.j-chapter{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:18px;max-width:1120px;margin:0 auto;padding:12vh 7vw;position:relative;box-sizing:border-box}
.j-chapter::before{content:"";position:absolute;left:calc(7vw - 24px);top:16vh;bottom:16vh;width:1px;background:linear-gradient(180deg,transparent,rgba(139,123,255,.28),transparent);opacity:0;transition:opacity 1.1s ease}
.j-chapter.in::before{opacity:1}
.j-chap-mark{font-family:ui-monospace,"SF Mono",monospace;font-size:12px;letter-spacing:.3em;color:var(--accent,#8b7bff);text-transform:uppercase;opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
.j-chap-h{font-size:clamp(36px,6.2vw,86px);line-height:1.03;font-weight:800;letter-spacing:-.022em;margin:0;color:#f4f3ff;max-width:15ch;opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1) .05s,transform .9s cubic-bezier(.2,.7,.2,1) .05s}
.j-chap-h b{color:var(--accent,#8b7bff);font-weight:800}
.j-chap-sub{font-size:clamp(15px,1.45vw,20px);line-height:1.5;color:rgba(226,224,255,.6);max-width:46ch;margin:0;opacity:0;transform:translateY(18px);transition:opacity .9s ease .15s,transform .9s ease .15s}
.j-chapter.in .j-chap-mark,.j-chapter.in .j-chap-h,.j-chapter.in .j-chap-sub{opacity:1;transform:none}
@media(max-width:760px){.j-chapter{padding:14vh 9vw}.j-chapter::before{left:14px}.j-chap-h{font-size:clamp(30px,8.6vw,52px)}}

.portal{position:relative}
.j-hub{position:relative}
/* wave2: loop back to the anchor */
.j-loop{min-height:42vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;cursor:pointer;opacity:.5;transition:opacity .4s ease}
.j-loop:hover{opacity:.95}
.jl-ring{font-size:26px;line-height:1;color:var(--accent,#8b7bff);filter:drop-shadow(0 0 8px rgba(139,123,255,.5));animation:jlSpin 9s linear infinite}
.jl-t{font-family:ui-monospace,"SF Mono",monospace;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:rgba(226,224,255,.5)}
@keyframes jlSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.jl-ring{animation:none}}

/* wave2 rework: simplicity — free scroll, native cursor, calm legible chapters */
.j-chapter{background:radial-gradient(125% 95% at 24% 50%,rgba(6,7,14,.74) 0%,rgba(6,7,14,.5) 32%,rgba(6,7,14,0) 60%)}
.j-chap-h{text-shadow:0 2px 22px rgba(6,7,15,.85)}
.j-chap-sub{text-shadow:0 1px 12px rgba(6,7,15,.9)}

/* climb logic: Entry -> HigherHigh ascent gauge (right edge) */
.climb-gauge{position:fixed;right:30px;top:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:6;pointer-events:none;font-family:ui-monospace,"SF Mono",monospace}
.cg-cap{writing-mode:vertical-rl;text-orientation:mixed;font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:rgba(226,224,255,.45)}
.cg-cap.cg-top{color:var(--accent,#8b7bff)}
.cg-track{position:relative;width:2px;height:min(44vh,400px);background:linear-gradient(180deg,rgba(139,123,255,.22),rgba(230,230,255,.06));border-radius:2px}
.cg-fill{position:absolute;left:0;bottom:0;width:100%;height:0%;background:linear-gradient(180deg,var(--accent,#8b7bff),rgba(139,123,255,.3));border-radius:2px;box-shadow:0 0 8px rgba(139,123,255,.55)}
.cg-dot{position:absolute;left:50%;bottom:0%;width:8px;height:8px;margin:0 0 -4px -4px;border-radius:50%;background:#cabaff;box-shadow:0 0 11px rgba(150,120,255,.95)}
@media(max-width:900px){.climb-gauge{display:none}}

/* climb gauge: HigherHigh reached (at Terminal) glow */
.climb-gauge .cg-dot{transition:box-shadow .3s ease}
.climb-gauge.reached .cg-top{color:#dccfff;text-shadow:0 0 10px rgba(160,130,255,.85)}
.climb-gauge.reached .cg-dot{box-shadow:0 0 16px rgba(185,155,255,1)}

/* climb spine: live price line you ascend to HigherHigh */
.price-line{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;opacity:.5}
.price-line #plPath{fill:none;stroke:url(#plGrad);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 3px rgba(139,123,255,.5))}
.price-line .pl-tp{stroke:rgba(185,163,255,.26);stroke-width:1;stroke-dasharray:5 7;transition:stroke .5s ease}
.price-line #plDot{fill:#e9e1ff;filter:drop-shadow(0 0 7px rgba(160,130,255,.95))}
.price-line.tp-hit .pl-tp{stroke:rgba(205,185,255,.72)}
@media(max-width:760px){.price-line{opacity:.4}}

/* climb altitude: pre-dawn at entry -> violet dawn crown at the summit */
.sky-altitude{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(135% 72% at 50% -8%, rgba(150,130,255,var(--sky,.02)) 0%, rgba(150,130,255,0) 58%)}

/* ===== Contract size selector (micro/full) ===== */
.unit-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin:2px 0 12px; }
.unit-row > .muted{ font-size:12px; }
.unit-seg .seg-btn{ padding:5px 13px; font-size:11.5px; font-weight:700; letter-spacing:.08em; }
.unit-seg .seg-btn:disabled{ opacity:.35; cursor:not-allowed; }
/* ===== Liquidation overlay ===== */
.lvlup-ov.liq{ background:radial-gradient(700px 480px at 50% 42%, rgba(246,70,93,.26), rgba(16,4,8,.84) 68%); }
.lvlup-ov.liq .lvlup-card{ background:linear-gradient(180deg, rgba(246,70,93,.14), rgba(255,255,255,.02)), var(--panel); border-color:rgba(246,70,93,.38); }
.lvlup-ov.liq .lvlup-badge{ background:radial-gradient(circle at 50% 35%, rgba(246,70,93,.28), rgba(124,77,255,.08)); border-color:rgba(246,70,93,.45); }
.lvlup-ov.liq .lvlup-tr{ stroke:#f6465d; }
.lvlup-ov.liq .lvlup-kicker{ color:#f6465d; }
.lvlup-ov.liq .lvlup-tier{ font-size:22px; background:none; color:var(--txt); -webkit-background-clip:unset; background-clip:unset; }

/* ===== Review modal: tabs + AI-trade chart ===== */
.rv-tabs{ display:flex; gap:6px; margin:2px 0 14px; }
.rv-tab{ flex:0 0 auto; background:var(--bg); border:1px solid var(--line); color:var(--txt-2); font-weight:700; font-size:12.5px; padding:7px 16px; border-radius:999px; cursor:pointer; transition:color .15s ease, border-color .15s ease, background .15s ease; }
.rv-tab:hover{ color:var(--txt); }
.rv-tab.active{ background:var(--accent); border-color:transparent; color:#fff; }
.rv-tab:disabled{ opacity:.4; cursor:not-allowed; }
.rv-card.wide{ max-width:min(920px, 94vw); width:min(920px, 94vw); }
.rv-ai-chart{ position:relative; height:min(46vh, 400px); min-height:260px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:rgba(10,10,20,.35); }
.rv-ai-legend{ display:flex; flex-wrap:wrap; gap:12px; margin:10px 2px 0; font-size:11.5px; color:var(--txt-2); }
.rv-ai-legend .rvl{ display:inline-flex; align-items:center; gap:6px; }
.rv-ai-legend .rvl i{ display:inline-block; width:12px; height:8px; border-radius:2px; }
.rv-ai-legend .rvl .rvl-line{ width:16px; height:0; border-top:2px dashed #16c784; border-radius:0; }
.rv-ai-note{ margin:10px 2px 2px; font-size:12.5px; line-height:1.55; color:var(--txt-2); }
.rv-ae{ transition:border-color .15s ease, background .15s ease; }
.rv-ae:hover{ border-color:rgba(245,185,66,.55); }

/* ===== Instrument locks until $10k ===== */
.inst-card.locked{ opacity:.38; filter:grayscale(.5); cursor:not-allowed; position:relative; }
.inst-card.locked::after{ content:"🔒 $10K"; position:absolute; right:8px; top:8px; font-size:10px; letter-spacing:.06em; color:rgba(226,224,255,.75); background:rgba(10,10,22,.72); border:1px solid rgba(160,164,190,.25); border-radius:999px; padding:2px 8px; }
.inst-card.locked:hover{ transform:none; }
.im-item.lk{ opacity:.42; cursor:not-allowed; }

/* ===== THE ASCENT: hero slogan ===== */
.j-slogan{ margin:14px 0 0; font-family:ui-monospace,"SF Mono",monospace; font-size:11.5px; letter-spacing:.34em; text-transform:uppercase; color:rgba(197,184,255,.66); text-shadow:0 1px 14px rgba(6,7,15,.9); }