:root {
  --bg: #080b0d; --panel: #101517; --panel-2: #141b1d; --line: #273033;
  --text: #edf3f0; --muted: #85918d; --green: #48e0a4; --green-dark: #163f32;
  --red: #ff6c73; --amber: #f3bb61; --blue: #83a7ff;
}
* { box-sizing: border-box; }
html { background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 82% 0%, rgba(72,224,164,.09), transparent 28%), var(--bg); }
button, input { font: inherit; }
.topbar { height: 68px; padding: 0 clamp(20px,4vw,64px); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; background: rgba(8,11,13,.86); backdrop-filter: blur(18px); position: sticky; top: 0; z-index: 10; }
.brand { display: flex; align-items: center; gap: 12px; font-size: 12px; letter-spacing: .18em; font-weight: 750; }
.brand-mark { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #52605c; color: var(--green); }
.top-actions { display: flex; align-items: center; gap: 14px; }
.top-actions form { margin: 0; }
.connection { color: var(--muted); font-size: 12px; display: flex; align-items: center; gap: 8px; }
.connection i { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.connection.online i { background: var(--green); box-shadow: 0 0 10px var(--green); }
.connection.warning i { background: var(--amber); }.connection.error i { background: var(--red); }
.ghost-button, .logout { border: 1px solid var(--line); background: transparent; color: var(--text); padding: 9px 14px; cursor: pointer; }
.ghost-button:hover, .logout:hover { border-color: #53615d; }.logout { color: var(--muted); }.ghost-button:disabled { opacity: .5; }
.dashboard { width: min(1320px, calc(100% - 40px)); margin: 0 auto; padding: 62px 0 80px; }
.hero { display: flex; justify-content: space-between; gap: 40px; align-items: end; padding-bottom: 46px; }
.eyebrow { color: var(--green); font-size: 11px; font-weight: 800; letter-spacing: .2em; margin: 0 0 14px; }
h1 { margin: 0; font-size: clamp(38px,5vw,72px); line-height: .98; letter-spacing: -.055em; font-weight: 650; }
h1 em { font-style: normal; color: var(--muted); font-weight: 400; }
.hero-meta { border-left: 1px solid var(--line); padding-left: 24px; min-width: 255px; display: flex; flex-direction: column; gap: 5px; }
.hero-meta span, .hero-meta small { color: var(--muted); font-size: 12px; }.hero-meta strong { font-size: 19px; }
.summary-grid { display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid var(--line); }
.metric { min-height: 146px; padding: 25px; display: flex; flex-direction: column; border-right: 1px solid var(--line); background: rgba(16,21,23,.72); }
.metric:last-child { border: 0; }.metric span,.metric small { color: var(--muted); font-size: 12px; }.metric strong { font-size: clamp(23px,2.3vw,34px); margin: auto 0 5px; letter-spacing: -.035em; }
.positive { color: var(--green)!important; }.negative { color: var(--red)!important; }.neutral { color: var(--text); }
.section-block { margin-top: 76px; }.section-heading { display: flex; justify-content: space-between; align-items: end; margin-bottom: 20px; }
.section-heading h2 { margin: 0; font-size: 28px; letter-spacing: -.035em; }.section-heading > p { color: var(--muted); font-size: 13px; margin: 0; }
.recommendation-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.rec-card { min-height: 350px; background: var(--panel); border: 1px solid var(--line); padding: 24px; position: relative; overflow: hidden; }
.rec-card.long:after { content:""; position:absolute; width:150px; height:150px; right:-75px; top:-75px; background:var(--green); filter:blur(70px); opacity:.12; }
.rec-top { display:flex; justify-content:space-between; align-items:center; }.coin { font-weight: 800; letter-spacing: .07em; }
.signal-dot { font-size:11px; color:var(--green); display:flex; align-items:center; gap:7px; }.signal-dot i { width:6px;height:6px;border-radius:50%;background:currentColor; }
.cash .signal-dot { color:var(--amber); }.recommendation-action { margin: 45px 0 30px; display:flex;flex-direction:column;gap:6px; }
.recommendation-action span { font-size:10px;letter-spacing:.15em;color:var(--muted); }.recommendation-action strong { font-size:36px;letter-spacing:-.04em; }
.levels { border-top:1px solid var(--line); }.levels > div { min-height:46px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;font-size:12px; }
.levels span { color:var(--muted); }.levels small { min-width:62px;text-align:right; }.rec-reason { color:var(--muted);font-size:12px;line-height:1.5;margin:18px 0 0; }
.positions-list { display:flex;flex-direction:column;gap:14px; }.position-card { border:1px solid var(--line); background:var(--panel); }
.position-main { padding:24px; display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line); }
.asset { display:flex;align-items:center;gap:15px; }.asset-icon { width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:var(--green-dark);color:var(--green);font-weight:800; }
.asset h3 { margin:0 0 5px;font-size:18px; }.asset h3 small { color:var(--muted);font-weight:400;font-size:12px; }.asset p { color:var(--green);font-size:11px;margin:0;letter-spacing:.08em; }
.partial-badge { display:inline-block;margin-left:10px;padding:4px 7px;border:1px solid rgba(72,224,164,.35);color:var(--green);font-size:8px;letter-spacing:.1em;vertical-align:middle; }
.position-pnl { text-align:right;display:flex;flex-direction:column; }.position-pnl span,.position-pnl small { color:var(--muted);font-size:11px; }.position-pnl strong { font-size:25px;margin:3px 0; }
.position-data { display:grid;grid-template-columns:repeat(6,1fr);padding:22px 24px;gap:20px; }.position-data div { display:flex;flex-direction:column;gap:6px; }.position-data span { font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em; }.position-data strong { font-size:14px; }.position-data small { font-size:10px; }
.risk-row { margin:0 24px 24px;padding:15px 17px;background:#0b100f;border-left:2px solid var(--green);display:grid;grid-template-columns:180px 1fr auto;align-items:center;gap:20px; }
.risk-row > div:first-child { display:flex;flex-direction:column;gap:4px; }.risk-row span { font-size:9px;letter-spacing:.13em;color:var(--muted); }.risk-row strong { font-size:14px; }.risk-row p { margin:0;color:var(--muted);font-size:11px; }
.risk-track { height:3px;background:#27322e; }.risk-track i { display:block;height:100%;background:var(--green); }.risk-row.missing { border-color:var(--amber);grid-template-columns:180px 1fr; }
.notice { margin-top:28px;padding:18px 20px;border:1px solid var(--line);display:flex;gap:14px;color:var(--muted);font-size:12px;line-height:1.55; }.notice span { flex:0 0 22px;width:22px;height:22px;border:1px solid #53615d;border-radius:50%;display:grid;place-items:center;color:var(--text); }.notice p { margin:0; }.notice strong { color:var(--text); }
.skeleton { min-height:140px;background:linear-gradient(100deg,var(--panel) 30%,#172022 50%,var(--panel) 70%);background-size:400%;animation:pulse 1.5s infinite; }
@keyframes pulse { from{background-position:100%}to{background-position:0} }

.login-body { display:grid;place-items:center;padding:30px; }.login-shell { width:min(1050px,100%);min-height:650px;border:1px solid var(--line);display:grid;grid-template-columns:1.2fr .8fr;background:rgba(10,14,15,.76); }
.login-copy { padding:58px;display:flex;flex-direction:column;justify-content:flex-end;background:radial-gradient(circle at 20% 15%,rgba(72,224,164,.12),transparent 40%); }.login-copy .brand { position:absolute;top:60px; }.login-copy h1 { font-size:clamp(46px,6vw,76px); }.login-lead { max-width:520px;color:var(--muted);line-height:1.6;margin:28px 0 0; }
.login-card { border-left:1px solid var(--line);padding:58px 42px;display:flex;flex-direction:column;justify-content:center; }.login-card h2 { margin:0;font-size:32px; }.muted { color:var(--muted);font-size:13px; }.login-card form { margin-top:30px;display:flex;flex-direction:column;gap:18px; }.login-card label { display:flex;flex-direction:column;gap:8px;color:var(--muted);font-size:11px;letter-spacing:.07em;text-transform:uppercase; }
.login-card input { width:100%;background:#0a0e0f;border:1px solid var(--line);color:var(--text);padding:14px;outline:none; }.login-card input:focus { border-color:var(--green);box-shadow:0 0 0 3px rgba(72,224,164,.08); }
.login-card button { margin-top:8px;padding:15px 18px;border:0;background:var(--green);color:#07110d;font-weight:800;display:flex;justify-content:space-between;cursor:pointer; }.security-note { margin-top:24px;color:#5e6a66;font-size:10px;text-align:center; }.form-error { color:var(--red);font-size:12px;background:rgba(255,108,115,.08);padding:12px;border-left:2px solid var(--red); }
@media (max-width: 900px) { .summary-grid{grid-template-columns:repeat(2,1fr)}.metric:nth-child(2){border-right:0}.metric{border-bottom:1px solid var(--line)}.recommendation-grid{grid-template-columns:1fr}.position-data{grid-template-columns:repeat(3,1fr)}.risk-row{grid-template-columns:150px 1fr}.risk-row p{grid-column:1/-1}.login-shell{grid-template-columns:1fr}.login-copy{min-height:350px;padding:38px}.login-copy .brand{top:50px}.login-card{border-left:0;border-top:1px solid var(--line)} }
@media (max-width: 620px) { .topbar{padding:0 16px}.brand{font-size:10px}.connection,.logout{display:none}.dashboard{width:calc(100% - 28px);padding-top:38px}.hero{display:block}.hero-meta{margin-top:30px}.summary-grid{grid-template-columns:1fr}.metric{border-right:0}.section-heading{display:block}.section-heading>p{margin-top:8px}.position-main{align-items:flex-start}.position-data{grid-template-columns:repeat(2,1fr)}.risk-row,.risk-row.missing{grid-template-columns:1fr}.login-body{padding:0}.login-shell{border:0;min-height:100vh}.login-copy{min-height:310px}.login-card{padding:42px 28px} }