:root{
  --bg-primary:#030a14; --bg-secondary:#050d1a;
  --bg-card:rgba(255,255,255,0.035); --bg-card-hover:rgba(255,255,255,0.06);
  --accent:#3b82f6; --accent-bright:#60a5fa;
  --text-primary:#f5f5f5; --text-secondary:#a3a3a3; --text-muted:#7a7a7a;
  --border:rgba(255,255,255,0.07); --border-hover:rgba(255,255,255,0.14);
  --topbar-h:64px; --sidebar-w:230px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;color:var(--text-secondary);line-height:1.55;-webkit-font-smoothing:antialiased;
  background:radial-gradient(ellipse 1200px 600px at 20% -10%,rgba(59,130,246,0.06),transparent),
    linear-gradient(rgba(59,130,246,0.02) 1px,transparent 1px),linear-gradient(90deg,rgba(59,130,246,0.02) 1px,transparent 1px),var(--bg-primary);
  background-size:auto,48px 48px,48px 48px,auto;background-attachment:fixed}
a{color:inherit;text-decoration:none}

.term-topbar{position:fixed;top:0;left:0;right:0;height:var(--topbar-h);z-index:100;display:flex;align-items:center;gap:1.25rem;padding:0 1.25rem;
  background:rgba(5,13,26,0.92);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}
.term-brand{display:flex;align-items:center;gap:.6rem;flex-shrink:0}
.term-brand img{width:30px;height:30px;object-fit:contain}
.term-brand .wm{font-weight:800;font-size:1.1rem;letter-spacing:-.02em;color:var(--text-primary)}
.vswitch{display:flex;gap:.2rem;background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:10px;padding:.22rem}
.vswitch a{padding:.38rem .7rem;border-radius:7px;font-size:.8rem;font-weight:700;color:var(--text-muted)}
.vswitch a:hover{color:var(--text-primary);background:rgba(255,255,255,.05)}
.vswitch a.on{color:#eaf1ff;background:rgba(59,130,246,.22)}
.term-actions{margin-left:auto;display:flex;align-items:center;gap:.8rem}
.term-login-btn{display:inline-flex;align-items:center;padding:.42rem 1rem;border-radius:8px;border:1px solid rgba(96,165,250,.5);color:var(--accent-bright);font-size:.8rem;font-weight:700;white-space:nowrap}
.term-login-btn:hover{background:rgba(96,165,250,.1)}
.term-sidebar{position:fixed;top:var(--topbar-h);left:0;bottom:0;width:var(--sidebar-w);z-index:90;background:rgba(5,13,26,.6);border-right:1px solid var(--border);padding:.85rem .7rem;display:flex;flex-direction:column;gap:2px}
.term-sidebar .grp{font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);padding:.9rem .75rem .35rem}
.term-sidebar a{display:block;padding:.55rem .75rem;border-radius:8px;font-size:.82rem;font-weight:500;color:var(--text-secondary)}
.term-sidebar a:hover{background:var(--bg-card);color:var(--text-primary)}
.term-sidebar a.on{background:rgba(59,130,246,.12);color:var(--accent-bright);font-weight:600}
.term-main{margin-left:var(--sidebar-w);margin-top:var(--topbar-h);padding:1.4rem 1.5rem 5rem;max-width:calc(1180px + var(--sidebar-w))}

.sf-kicker{font-size:.66rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-bright)}
.sf-title{font-size:1.65rem;font-weight:800;letter-spacing:-.02em;color:var(--text-primary);line-height:1.2;margin-top:.2rem}
.sf-title .sf-date{color:var(--text-secondary);font-weight:700}
.sf-dateline{margin:.35rem 0 0;font-size:1.05rem;font-weight:700;color:var(--text-primary);letter-spacing:-.005em}
.sf-meta{display:flex;flex-wrap:wrap;gap:.35rem 1.4rem;margin-top:.55rem;font-size:.82rem;color:var(--text-secondary);font-variant-numeric:tabular-nums}
.sf-meta span{display:inline-flex;align-items:center;gap:.45rem}
.sf-meta span + span::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--text-muted);margin-right:.95rem;margin-left:-.95rem}
.sf-order{margin-top:.8rem;font-size:.86rem;color:var(--text-primary)}
.sf-explain{margin-top:.3rem;font-size:.8rem;color:var(--text-muted);max-width:46rem}
.sf-slot{margin-top:.3rem;font-size:.8rem;color:var(--text-muted)}
#sfHead{margin-bottom:1.1rem}

.panel{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:1.1rem 1.2rem}
.panel + .panel,#sfSample + #sfBody{margin-top:1rem}

.sf-notice{display:flex;align-items:center;gap:.6rem;margin-bottom:1rem;padding:.7rem .95rem;border:1px solid rgba(96,165,250,.22);
  background:rgba(59,130,246,.06);border-radius:10px;font-size:.84rem;color:#dbe8ff}
.sf-notice svg{flex:none;color:var(--accent-bright)}

.sf-filter{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.9rem}
.sf-chip{padding:.34rem .8rem;border-radius:100px;font:inherit;font-size:.74rem;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--bg-card);color:var(--text-secondary)}
.sf-chip:hover{border-color:var(--border-hover);color:var(--text-primary)}
.sf-chip[aria-pressed="true"]{background:rgba(59,130,246,.14);color:var(--accent-bright);border-color:rgba(59,130,246,.35)}

.sf-list{list-style:none}
.sf-row{display:grid;grid-template-columns:8.2rem minmax(12rem,1.1fr) minmax(14rem,1.3fr) minmax(14rem,1.4fr);gap:.4rem 1.2rem;
  padding:.9rem .2rem;border-top:1px solid var(--border);align-items:start}
.sf-row:first-child{border-top:none}
.sf-row[hidden]{display:none}
.sf-rating{font-size:.8rem;color:var(--text-secondary);white-space:nowrap;font-variant-numeric:tabular-nums}
.sf-rating b{font-size:1.25rem;font-weight:800;color:var(--text-primary);margin:0 .12rem}
.sf-match{font-weight:700;color:var(--text-primary);font-size:.9rem}
.sf-sub{display:flex;flex-wrap:wrap;gap:.2rem .7rem;margin-top:.15rem;font-size:.74rem;color:var(--text-muted);font-variant-numeric:tabular-nums}
.sf-ctx{margin-top:.5rem;font-size:.74rem;color:var(--text-muted)}
.sf-ctx-tbl{border-collapse:collapse;font-variant-numeric:tabular-nums}
.sf-ctx-tbl th,.sf-ctx-tbl td{padding:.12rem .9rem .12rem 0;text-align:left;font-weight:400}
.sf-ctx-k{font-size:.62rem;font-weight:700 !important;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.sf-ctx-v{color:var(--text-primary);font-weight:600 !important;min-width:3.2em}
.sf-ctx-src{display:flex;flex-wrap:wrap;gap:.1rem .5rem;margin-top:.2rem;color:var(--text-secondary)}
.sf-pub-reason{margin-top:.3rem;font-size:.78rem;color:var(--text-secondary);line-height:1.4}
.sf-prep{grid-column:1 / -1;margin-top:.3rem;border:1px solid var(--border);border-radius:10px;background:var(--bg-card)}
.sf-prep-sum{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:.15rem .7rem;padding:.6rem .9rem}
.sf-prep-sum::-webkit-details-marker{display:none}
.sf-prep-sum::before{content:'';width:.42rem;height:.42rem;border-right:1.5px solid var(--text-muted);border-bottom:1.5px solid var(--text-muted);transform:rotate(-45deg);margin-right:.2rem;align-self:center;transition:transform .15s}
.sf-prep[open] .sf-prep-sum::before{transform:rotate(45deg)}
.sf-prep-sum:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:10px}
.sf-prep-t{font-weight:700;font-size:.82rem;color:var(--text-primary)}
.sf-prep-n{font-size:.74rem;color:var(--text-muted)}
.sf-prep-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.9rem 1.4rem;padding:.2rem .9rem .9rem;border-top:1px solid var(--border)}
.sf-gp-block{padding-top:.7rem;min-width:0}
.sf-gp-h{font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.35rem}
.sf-gp-item{display:flex;flex-wrap:wrap;gap:.1rem .5rem;font-size:.8rem;line-height:1.5}
.sf-gp-k{color:var(--text-secondary)}
.sf-gp-v{color:var(--text-primary);font-variant-numeric:tabular-nums}
.sf-gp-src{font-size:.68rem;color:var(--text-muted);margin:.15rem 0 .35rem}
.sf-gp-team{margin-bottom:.4rem}
.sf-gp-tn{font-size:.78rem;font-weight:600;color:var(--text-secondary);margin-bottom:.15rem}
.sf-gp-ul{list-style:none;display:flex;flex-direction:column;gap:.15rem;margin:0;padding:0}
.sf-gp-li{display:flex;flex-wrap:wrap;gap:.1rem .6rem;font-size:.78rem}
.sf-gp-nm{color:var(--text-primary)}
.sf-gp-dt{color:var(--text-muted);font-variant-numeric:tabular-nums}
.sf-market{font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.15rem}
.sf-src{font-size:.86rem;color:var(--text-primary);font-variant-numeric:tabular-nums}
.sf-notes ul{list-style:none;display:flex;flex-direction:column;gap:.25rem}
.sf-notes li{font-size:.82rem;color:var(--text-secondary);padding-left:.8rem;position:relative}
.sf-notes li::before{content:"";position:absolute;left:0;top:.62em;width:4px;height:4px;border-radius:50%;background:var(--text-muted)}
.sf-none{font-size:.82rem;color:var(--text-muted)}
.sf-row.is-unrated .sf-match{font-weight:600;color:var(--text-secondary)}
.sf-row.is-unrated .sf-line{display:none}
.sf-row.is-unrated .sf-notes{grid-column:3 / span 2}

.sf-sample h3{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.4rem}

.sf-empty{text-align:center;padding:2.8rem 1.2rem}
.sf-empty-ic{width:44px;height:44px;margin:0 auto .9rem;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:rgba(59,130,246,.08);border:1px solid rgba(96,165,250,.2);color:var(--accent-bright)}
.sf-empty-t{font-size:1rem;font-weight:600;color:var(--text-primary);max-width:30rem;margin:0 auto}
.sf-state{text-align:center;padding:2.4rem 1.2rem}
.sf-state h2{font-size:1.15rem;font-weight:800;color:var(--text-primary);margin-bottom:.45rem}
.sf-state p{font-size:.9rem;color:var(--text-secondary);max-width:32rem;margin:0 auto}
.btns{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-top:1.2rem}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.62rem 1.15rem;border-radius:9px;font-size:.86rem;font-weight:700;border:1px solid transparent}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:#2f6fe0}
.btn-ghost{border-color:var(--border-hover);color:var(--text-primary)}
.btn-ghost:hover{background:var(--bg-card-hover)}
.sf-skel{height:14px;border-radius:6px;background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,255,255,.08),rgba(255,255,255,.04));background-size:200% 100%;animation:sk 1.4s infinite}
.sk-a{width:24rem;max-width:100%}.sk-b{width:16rem;max-width:100%;margin-top:.7rem}
@keyframes sk{0%{background-position:200% 0}100%{background-position:-200% 0}}

@media (max-width:980px){
  .sf-row{grid-template-columns:7.4rem 1fr 1fr}
  .sf-notes,.sf-row.is-unrated .sf-notes{grid-column:2 / span 2}
}
@media (max-width:820px){
  :root{--sidebar-w:0px}
  .term-sidebar,.vswitch{display:none}
  .term-main{padding:1.1rem 1rem 4rem}
  .sf-title{font-size:1.35rem}
  .panel{padding:.9rem 1rem}
  .sf-row{grid-template-columns:1fr auto;gap:.35rem .8rem;padding:.9rem 0}
  .sf-game{grid-column:1;grid-row:1}
  .sf-rating{grid-column:2;grid-row:1;text-align:right}
  .sf-rating:empty{display:none}
  .sf-line{grid-column:1 / span 2}
  .sf-line:empty{display:none}
  .sf-notes,.sf-row.is-unrated .sf-notes{grid-column:1 / span 2}
}

/* v3: labels, pick lines, the analysis rating's time, the public row and started games. */
.sf-label{display:inline-block;font-size:.64rem;font-weight:700;letter-spacing:.02em;line-height:1.2;padding:3px 8px;border-radius:6px;white-space:nowrap;margin-bottom:.35rem}
.sf-label-pick{color:#04150f;background:#34D399;border:1px solid #34D399}
.sf-label-analysis{color:var(--text-secondary);background:transparent;border:1px solid rgba(255,255,255,.22)}
.sf-label-scheduled{color:var(--text-muted);background:transparent;border:1px dashed rgba(255,255,255,.16);font-weight:600}
.sf-row-pick{box-shadow:inset 2px 0 0 #34D399}
.sf-asof{display:block;font-size:.66rem;color:var(--text-muted);margin-top:.15rem;white-space:normal}
.sf-pline + .sf-pline{margin-top:.55rem;padding-top:.55rem;border-top:1px dashed var(--border)}
.sf-ptext{font-size:.88rem;font-weight:700;color:var(--text-primary)}
.sf-pb{font-size:.78rem;color:var(--text-secondary);font-variant-numeric:tabular-nums;margin-top:.1rem}
.sf-row.is-public{grid-template-columns:minmax(12rem,1fr)}
.sf-row.is-public .sf-rating,.sf-row.is-public .sf-line,.sf-row.is-public .sf-notes{display:none}
.sf-started{margin-top:1rem}
.sf-started-h{cursor:pointer;font-size:.8rem;font-weight:600;color:var(--text-muted)}
.sf-started-h:focus-visible{outline:2px solid var(--accent-bright);outline-offset:2px}
.sf-srow{display:grid;grid-template-columns:minmax(12rem,1.1fr) minmax(10rem,.8fr) 1.4fr;gap:.3rem 1.2rem;padding:.7rem 0;border-top:1px solid var(--border);opacity:.8}
@media (max-width:820px){.sf-srow{grid-template-columns:1fr}.sf-row.is-public{grid-template-columns:1fr}}
.sf-row{grid-template-columns:9.6rem minmax(12rem,1.1fr) minmax(14rem,1.3fr) minmax(14rem,1.4fr)}
.sf-rating{white-space:normal;line-height:1.35}
@media (max-width:980px){.sf-row{grid-template-columns:8.6rem 1fr 1fr}}
@media (max-width:820px){.sf-row{grid-template-columns:1fr auto}}
