/* 观象 lab sample · layout on dashboard_kit tokens. Do not rewrite token values. */
html,body{margin:0;padding:0;background:var(--bg);color:var(--text-1);font-family:var(--font-ui);font-size:var(--fs-body);line-height:1.5;-webkit-font-smoothing:antialiased;}
*{box-sizing:border-box;}
button,input{font-family:inherit;font-size:inherit;}
a{color:var(--accent);text-decoration:none;}
a:hover{text-decoration:underline;}
code,.mono,.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums slashed-zero;}
.num{text-align:right;}

.shell{min-height:100vh;display:flex;flex-direction:column;}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 22px 10px;background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20;}
.brand{display:flex;align-items:baseline;gap:12px;min-width:0;}
.mark{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid var(--border-strong);border-radius:2px;color:var(--accent);font-weight:650;letter-spacing:.06em;font-size:11px;background:var(--panel);}
.brand h1{margin:0;font-size:18px;font-weight:650;letter-spacing:.2em;color:var(--text-1);}
.brand .sub{color:var(--text-3);font-size:12px;letter-spacing:.04em;}
.top-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;}

.badge{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border:1px solid var(--border);border-radius:2px;background:var(--elevated);color:var(--text-2);font-size:11px;letter-spacing:.02em;line-height:1.6;white-space:nowrap;}
.badge.warn{border-color:var(--warn);color:var(--warn);background:var(--tint-warn);}
.badge.info{border-color:var(--accent);color:var(--info);background:var(--tint-info);}
.badge.sim{border-color:var(--bid);color:var(--bid);}
.badge.ofr{border-color:var(--ofr);color:var(--ofr);}

.btn{appearance:none;border:1px solid var(--border);background:var(--elevated);color:var(--text-1);padding:7px 14px;border-radius:var(--radius);cursor:pointer;}
.btn:hover{background:var(--hover);border-color:var(--border-strong);}
.btn.primary{border-color:var(--accent);color:#fff;background:var(--accent);}
.btn.primary:hover{filter:brightness(1.08);}
.btn.ghost{background:transparent;}

.content{flex:1;padding:28px 22px 48px;max-width:1120px;width:100%;margin:0 auto;}
.content.wide{max-width:1280px;}
.foot{padding:16px 22px 24px;border-top:1px solid var(--border);color:var(--text-3);font-size:12px;max-width:1120px;width:100%;margin:0 auto;}
.foot p{margin:0 0 6px;}

.hero{margin:28px 0 32px;}
.hero .kicker{color:var(--text-3);letter-spacing:.18em;font-size:11px;margin:0 0 10px;}
.hero h2{margin:0 0 10px;font-size:36px;letter-spacing:.28em;font-weight:650;}
.hero p{margin:0;color:var(--text-2);max-width:40em;font-size:14px;}
.hero-actions{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap;}

.grid{display:grid;gap:14px;}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:860px){.grid-3{grid-template-columns:1fr;}.brand .sub{display:none;}.hero h2{font-size:28px;}}

.card{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:16px 18px;box-shadow:var(--shadow);}
.card h3{margin:0 0 8px;font-size:14px;font-weight:600;letter-spacing:.06em;}
.card p{margin:0;color:var(--text-2);}
.card.click{cursor:pointer;transition:border-color .12s;}
.card.click:hover{border-color:var(--accent);}
.card.click.active{border-color:var(--bid);background:var(--panel);}

.disclaimer{border:1px solid var(--warn);background:var(--tint-warn);padding:12px 14px;border-radius:4px;color:var(--text-1);margin:0 0 20px;}
.disclaimer strong{color:var(--warn);letter-spacing:.08em;font-size:12px;}

.up{color:var(--up);} .down{color:var(--down);} .flat{color:var(--flat);}
.muted{color:var(--text-3);}
.tiny{font-size:11px;color:var(--text-3);}

/* login */
.auth-wrap{min-height:calc(100vh - 120px);display:flex;align-items:center;justify-content:center;padding:24px 16px;}
.auth{width:100%;max-width:420px;}
.auth h2{margin:0 0 6px;font-size:22px;letter-spacing:.16em;}
.auth .lead{margin:0 0 18px;color:var(--text-2);}
label{display:block;margin:0 0 12px;color:var(--text-2);font-size:12px;letter-spacing:.06em;}
input[type=email],input[type=text],input[type=password]{width:100%;margin-top:5px;background:var(--elevated);border:1px solid var(--border);color:var(--text-1);padding:8px 10px;border-radius:var(--radius);}
input:focus{outline:none;border-color:var(--accent);}
.flash{margin-top:14px;padding:10px 12px;border:1px dashed var(--border-strong);border-radius:4px;background:var(--panel);color:var(--text-1);display:none;}
.flash.on{display:block;}

/* app tabs + table + drawer */
.tabs{display:flex;gap:0;border-bottom:1px solid var(--border);margin:0 0 16px;}
.tabs button{background:transparent;border:0;border-bottom:2px solid transparent;color:var(--text-2);padding:8px 16px;cursor:pointer;letter-spacing:.08em;}
.tabs button:hover{color:var(--text-1);}
.tabs button.active{color:var(--text-1);border-bottom-color:var(--accent);}

.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:0 0 16px;}
.kpi{padding:10px 12px;background:var(--panel);border:1px solid var(--border-subtle);border-radius:4px;}
.kpi .k{display:block;color:var(--text-3);font-size:11px;letter-spacing:.08em;margin-bottom:4px;}
.kpi .v{display:block;font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:18px;color:var(--text-1);line-height:1.2;}

.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:4px;}
table.data{width:100%;border-collapse:collapse;font-size:12px;}
table.data th,table.data td{padding:8px 10px;border-bottom:1px solid var(--border-subtle);white-space:nowrap;}
table.data th{text-align:left;color:var(--text-3);font-weight:600;letter-spacing:.04em;background:var(--panel);}
table.data th.num,table.data td.num{text-align:right;}
table.data tbody tr{cursor:pointer;}
table.data tbody tr:hover{background:var(--hover);}
table.data tbody tr.sel{background:var(--selected);}

.work{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:16px;align-items:start;}
@media (max-width:980px){.work{grid-template-columns:1fr;}}
.drawer{position:sticky;top:72px;}
.drawer .chart{height:220px;width:100%;}
.hold{margin:10px 0 0;padding:0;list-style:none;}
.hold li{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px solid var(--border-subtle);font-size:12px;}
.empty{padding:18px;border:1px dashed var(--border-strong);border-radius:4px;color:var(--text-3);background:var(--panel);}
.row-between{display:flex;justify-content:space-between;gap:10px;align-items:baseline;}