:root{
  --bg:#f5f7f6; --surface:#ffffff; --surface-2:#eef2f0; --border:#dde4e1;
  --text:#16201c; --muted:#5d6b66; --accent:#0e7c66; --accent-ink:#ffffff;
  --up:#0f8a4b; --down:#c62f2f; --warn:#b26a00;
  --buy-bg:#dff5e9; --buy:#0d6b3a; --watch-bg:#e5effc; --watch:#1f5aa6;
  --hold-bg:#eceff1; --hold:#4a5560; --sell-bg:#fde6e4; --sell:#a6271f;
  --avoid-bg:#f3e3f7; --avoid:#7a2a8c;
  --shadow:0 1px 2px rgba(16,32,28,.06),0 2px 8px rgba(16,32,28,.05);
  --radius:12px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0f1513; --surface:#161e1b; --surface-2:#1d2723; --border:#2a3632;
    --text:#e6ede9; --muted:#93a39c; --accent:#2bb594; --accent-ink:#06231c;
    --up:#3fcf86; --down:#ff6b63; --warn:#e8a33d;
    --buy-bg:#123826; --buy:#6fe0a5; --watch-bg:#16294a; --watch:#8fb8ff;
    --hold-bg:#242c30; --hold:#b3bec4; --sell-bg:#3d1a18; --sell:#ff9a92;
    --avoid-bg:#33203a; --avoid:#e2a4f0;
    --shadow:none;
  }
}
:root[data-theme="dark"]{
  --bg:#0f1513; --surface:#161e1b; --surface-2:#1d2723; --border:#2a3632;
  --text:#e6ede9; --muted:#93a39c; --accent:#2bb594; --accent-ink:#06231c;
  --up:#3fcf86; --down:#ff6b63; --warn:#e8a33d;
  --buy-bg:#123826; --buy:#6fe0a5; --watch-bg:#16294a; --watch:#8fb8ff;
  --hold-bg:#242c30; --hold:#b3bec4; --sell-bg:#3d1a18; --sell:#ff9a92;
  --avoid-bg:#33203a; --avoid:#e2a4f0;
  --shadow:none;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0}
body{background:var(--bg);color:var(--text);font-family:"Hind Siliguri",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
code{background:var(--surface-2);padding:1px 6px;border-radius:5px;font-size:.9em}
h3{margin:0 0 10px;font-size:1.05rem}
.muted{color:var(--muted)} .small{font-size:.85rem}
.up{color:var(--up)} .down{color:var(--down)} .warn{color:var(--warn)}
.r{text-align:right}

.topbar{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}
.brand{display:flex;gap:10px;align-items:center}
.brand-name{font-weight:700;font-size:1.05rem;line-height:1.2}
.brand-sub{font-size:.8rem;color:var(--muted)}
.top-actions{display:flex;gap:8px}

.tabs{display:flex;gap:4px;padding:0 20px;background:var(--surface);border-bottom:1px solid var(--border);overflow-x:auto;position:sticky;top:57px;z-index:19}
.tabs a{padding:10px 14px;color:var(--muted);text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap;font-weight:500}
.tabs a.active{color:var(--accent);border-color:var(--accent)}

main{max-width:1240px;margin:0 auto;padding:18px 20px 30px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:14px;box-shadow:var(--shadow)}
.notice{border-left:4px solid var(--warn)}

.btn{background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent);border-radius:8px;padding:8px 14px;font:inherit;font-weight:600;cursor:pointer}
.btn.ghost{background:transparent;color:var(--text);border-color:var(--border)}
.btn.sm{padding:5px 10px;font-size:.85rem}
.btn.danger{background:transparent;color:var(--down);border-color:var(--border)}
.btn:hover{filter:brightness(1.06)}
.icon-btn{background:none;border:none;cursor:pointer;font-size:1.1rem;color:var(--muted);padding:2px 6px}
.icon-btn.on{color:#e3a400}

input,select{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:7px 10px;min-width:0}
input:focus,select:focus{outline:2px solid color-mix(in srgb,var(--accent) 40%,transparent);border-color:var(--accent)}
.inline-num{width:70px;padding:2px 6px}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;cursor:default;box-shadow:var(--shadow)}
.stat.click{cursor:pointer}
.stat .k{font-size:.8rem;color:var(--muted)}
.stat .v{font-size:1.45rem;font-weight:700;font-variant-numeric:tabular-nums}

.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.filters input[type=search]{flex:1 1 200px}
.chk{display:flex;gap:6px;align-items:center;font-size:.9rem;color:var(--muted)}
.range{display:flex;flex-direction:column;font-size:.82rem;color:var(--muted);flex:1 1 240px}

.table-card{padding:0;overflow:hidden}
.table-card h3{padding:14px 16px 0}
.table-wrap{overflow-x:auto}
table.grid{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.grid th{position:sticky;top:0;background:var(--surface-2);font-size:.8rem;color:var(--muted);font-weight:600;text-align:left;padding:9px 10px;white-space:nowrap;cursor:pointer;user-select:none}
.grid th.sorted::after{content:" ▾"} .grid th.sorted.asc::after{content:" ▴"}
.grid td{padding:9px 10px;border-top:1px solid var(--border);white-space:nowrap}
.grid tbody tr{cursor:pointer}
.grid tbody tr:hover{background:var(--surface-2)}
.sym{font-weight:700}
.sym small{display:block;font-weight:400;color:var(--muted);font-size:.75rem;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.table-foot{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;font-size:.85rem;color:var(--muted);border-top:1px solid var(--border)}
.empty{padding:28px;text-align:center;color:var(--muted)}

.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.78rem;font-weight:700;letter-spacing:.2px}
.b-BUY{background:var(--buy-bg);color:var(--buy)} .b-WATCH{background:var(--watch-bg);color:var(--watch)}
.b-HOLD{background:var(--hold-bg);color:var(--hold)} .b-SELL{background:var(--sell-bg);color:var(--sell)}
.b-AVOID{background:var(--avoid-bg);color:var(--avoid)}
.scorebar{display:inline-flex;align-items:center;gap:6px}
.scorebar i{display:inline-block;width:46px;height:6px;border-radius:3px;background:var(--surface-2);overflow:hidden;position:relative}
.scorebar i::after{content:"";position:absolute;inset:0;width:var(--w);background:var(--c,var(--accent));border-radius:3px}

/* drawer */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:40}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(860px,100%);background:var(--bg);z-index:41;overflow-y:auto;padding:20px;box-shadow:-6px 0 24px rgba(0,0,0,.18)}
.drawer .close{position:sticky;top:0;float:right;background:var(--surface);border:1px solid var(--border);border-radius:8px;width:34px;height:34px;cursor:pointer;color:var(--text);z-index:2}
.d-head{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin-bottom:12px}
.d-head h2{margin:0;font-size:1.5rem}
.d-price{font-size:1.6rem;font-weight:700;font-variant-numeric:tabular-nums}
.levels{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.level{background:var(--surface-2);border-radius:10px;padding:10px}
.level .k{font-size:.78rem;color:var(--muted)} .level .v{font-weight:700;font-size:1.1rem;font-variant-numeric:tabular-nums}
.reasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.reasons ul{margin:0;padding-left:18px} .reasons li{margin:3px 0}
.reasons h4{margin:0 0 6px;font-size:.95rem}
.ind-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.ind{border:1px solid var(--border);border-radius:10px;padding:8px 10px}
.ind .k{font-size:.75rem;color:var(--muted)} .ind .v{font-weight:600;font-variant-numeric:tabular-nums}
.chart{width:100%;height:340px} .chart.sm{height:130px}
.chart-legend{font-size:.78rem;color:var(--muted);display:flex;gap:14px;flex-wrap:wrap;margin:4px 0 8px}
.chart-legend span::before{content:"";display:inline-block;width:12px;height:3px;margin-right:5px;vertical-align:middle;background:var(--c)}
.fund-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.fund-grid label{font-size:.8rem;color:var(--muted);display:flex;flex-direction:column;gap:3px}
.d-actions{display:flex;gap:8px;flex-wrap:wrap}

.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;align-items:end}
.form-grid label,.modal-card label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--muted)}
.form-actions{display:flex;gap:8px;flex-wrap:wrap}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:50;display:flex;align-items:center;justify-content:center;padding:16px}
.modal-card{width:min(400px,100%);display:flex;flex-direction:column;gap:10px;margin:0}
.msg{font-size:.85rem;color:var(--down);min-height:1em}

.advice{display:flex;flex-direction:column;align-items:flex-start;gap:2px;white-space:normal;min-width:180px;font-size:.85rem}
.advice b{font-size:.85rem}
.tag{display:inline-block;padding:1px 8px;border-radius:6px;font-size:.78rem;font-weight:600}
.tag.sell{background:var(--sell-bg);color:var(--sell)} .tag.ok{background:var(--buy-bg);color:var(--buy)}
.tag.warn{background:color-mix(in srgb,var(--warn) 18%,transparent);color:var(--warn)}

.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--text);color:var(--bg);padding:10px 18px;border-radius:10px;z-index:60;font-size:.9rem}

.guide{max-width:900px}
.guide h2{margin:6px 0 12px}
.guide .card h3{color:var(--accent)}
.guide table{width:100%;border-collapse:collapse;font-size:.9rem;margin:6px 0}
.guide td,.guide th{border:1px solid var(--border);padding:7px 9px;text-align:left;vertical-align:top}
.guide th{background:var(--surface-2)}
.guide li{margin:4px 0}

.footer{text-align:center;padding:18px 16px 26px;color:var(--muted);font-size:.85rem;border-top:1px solid var(--border);margin-top:10px}
.footer .disclaimer{max-width:760px;margin:0 auto 8px}

@media (max-width:720px){
  .topbar{padding:10px 16px} .tabs{padding:0 10px;top:53px} main{padding:14px 16px 24px}
  .hide-sm{display:none}
  .grid .badge .bn{display:none}
  .grid td,.grid th{padding:8px 7px}
  .brand-name{font-size:.95rem}
  .drawer{padding:14px}
  .chart{height:280px}
}

/* ---------- v2: today / backtest ---------- */
.mood{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;border-left:5px solid var(--hold)}
.mood-ok{border-left-color:var(--up)} .mood-warn{border-left-color:var(--warn)} .mood-sell{border-left-color:var(--down)}
.mood-main{flex:1 1 320px} .mood-main .k{font-size:.8rem;color:var(--muted)}
.mood-title{font-size:1.3rem;font-weight:700;margin:2px 0}
.mood-ok .mood-title{color:var(--up)} .mood-warn .mood-title{color:var(--warn)} .mood-sell .mood-title{color:var(--down)}
.mood-stats{display:flex;gap:18px;flex-wrap:wrap}
.mood-stats div{display:flex;flex-direction:column} .mood-stats .k{font-size:.75rem;color:var(--muted)} .mood-stats b{font-size:1.15rem;font-variant-numeric:tabular-nums}

.hold-list{display:flex;flex-direction:column;gap:8px}
.hold-item{display:grid;grid-template-columns:130px 150px 1fr 90px;gap:12px;align-items:center;padding:10px 12px;border-radius:10px;border:1px solid var(--border);cursor:pointer;background:var(--surface)}
.hold-item:hover{background:var(--surface-2)}
.hold-sell{border-left:4px solid var(--down);background:color-mix(in srgb,var(--sell-bg) 55%,var(--surface))}
.hold-warn{border-left:4px solid var(--warn)} .hold-ok{border-left:4px solid var(--up)}
.hold-act{font-weight:700;font-size:.9rem} .hold-txt{font-size:.88rem}

.pick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.pick{border:1px solid var(--border);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:9px;background:var(--surface);cursor:pointer}
.pick.buy{border-top:4px solid var(--up)} .pick.watch{border-top:4px solid var(--watch)}
.pick:hover{border-color:var(--accent)}
.pick-head{display:flex;justify-content:space-between;gap:8px}
.pick-sym{font-size:1.2rem;font-weight:700} .pick-price{font-size:1.15rem;font-weight:700;font-variant-numeric:tabular-nums}
.pick-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pick-levels{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pick-levels div{background:var(--surface-2);border-radius:8px;padding:6px 8px;display:flex;flex-direction:column;font-variant-numeric:tabular-nums}
.pick-levels .k{font-size:.72rem;color:var(--muted)} .pick-levels small{font-size:.72rem;color:var(--muted)}
.pick-size{font-size:.85rem;background:color-mix(in srgb,var(--accent) 10%,transparent);border-radius:8px;padding:7px 9px}
.pick-why{margin:0;padding-left:18px;font-size:.85rem} .pick-why li{margin:2px 0}
.settings summary{cursor:pointer;font-weight:600}
#btTable tr.sel{background:color-mix(in srgb,var(--accent) 12%,transparent)}
@media (max-width:720px){
  .hold-item{grid-template-columns:1fr auto;gap:4px 10px}
  .hold-act{grid-column:1/-1} .hold-txt{grid-column:1/-1;order:3} .hold-pl{grid-row:2;grid-column:2}
  .mood-stats{gap:14px}
}
