/* NGS house style: shared design tokens and components.
   Source of truth is the NGS Stats clone (nflpro-clone/static/index.html). */
:root{--bg:#0b0d12;--panel:#141821;--panel2:#1a1f2b;--line:#262d3b;--txt:#e7eaf0;--mut:#8b94a7;--gold:#c8a85a;--gold2:#e2c97e;--hi:#1d2230;--sel:#2a2416;--bad:#d4675a;--good:#5fb37c;--warn:#d9a441;color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--txt);font:14px/1.4 -apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:inherit;text-decoration:none}
p a,td a{color:var(--gold2)}
p a:hover,td a:hover{text-decoration:underline}

/* top bar */
header.top{display:flex;align-items:center;gap:24px;padding:0 20px;height:52px;background:#07080c;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.brand{font-weight:800;letter-spacing:.08em;color:var(--gold);font-size:15px;white-space:nowrap}
.brand small{color:var(--mut);font-weight:500;letter-spacing:.04em;margin-left:8px}
header.top nav{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
header.top nav::-webkit-scrollbar{display:none}
header.top nav a{padding:16px 14px;color:var(--mut);font-weight:600;font-size:13px;letter-spacing:.04em;text-transform:uppercase;border-bottom:3px solid transparent;white-space:nowrap}
header.top nav a:hover{color:var(--txt)}
header.top nav a.active{color:var(--txt);border-color:var(--gold)}
header.top nav a.ext{color:var(--gold)}
nav.sub{display:flex;gap:4px;overflow-x:auto;padding:0 20px;background:#0b0d13;border-bottom:1px solid var(--line)}
nav.sub a{padding:10px 14px;color:var(--mut);font-weight:600;font-size:12px;letter-spacing:.04em;text-transform:uppercase;border-bottom:2px solid transparent;white-space:nowrap}
nav.sub a:hover{color:var(--txt)}
nav.sub a.active{color:var(--txt);border-color:var(--gold)}

main{max-width:1500px;margin:0 auto;padding:20px 20px 48px}
.pagehead h1{font-size:22px;margin:0 0 4px;letter-spacing:.02em}
.pagehead .sub{color:var(--mut);margin-bottom:16px;font-size:13px}
h2{margin:22px 0 10px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.card h2{margin-top:0;font-size:16px;letter-spacing:.01em;text-transform:none;color:var(--txt)}
.card h2 .muted{font-size:13px;font-weight:500}

/* cards and notices */
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin-bottom:12px}
.banner{background:var(--sel);border:1px solid var(--gold);border-radius:8px;padding:12px 14px;margin-bottom:16px;color:var(--gold2)}
.banner ul{margin:6px 0 0;padding-left:18px}
.muted{color:var(--mut)}
.reason{margin:8px 0 0;line-height:1.5;color:#c5cad6}
.method{font-size:12px;color:var(--mut);line-height:1.6}
.games{margin:6px 0 0;font-size:12px;color:var(--mut)}
code{background:var(--panel2);border:1px solid var(--line);border-radius:4px;padding:0 5px}

/* tables */
table{border-collapse:separate;border-spacing:0;width:100%;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th.sortable{cursor:pointer;user-select:none}th.sortable:hover{color:var(--txt)}th[aria-sort=ascending]::after{content:' ▲';font-size:9px}th[aria-sort=descending]::after{content:' ▼';font-size:9px}
th{background:#10141c;color:var(--mut);font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;white-space:nowrap}
tbody tr:hover td{background:var(--hi)}
.card>table,.sheet>table{margin:0}
.card[style*="padding: 0"],.card[style*="padding:0"],.card.sheet{overflow:hidden}
.sheet{overflow-x:auto;border-radius:8px}
.sheet>table{min-width:860px}
.sheet.card{padding:0}
.points{font-variant-numeric:tabular-nums;font-weight:700;font-size:1.05rem;color:var(--gold2)}
.sheet .points{font-size:1rem}
.sheet tfoot td{font-weight:700;border-top:2px solid var(--gold);background:#10141c}
.why{background:#10141c}
.why summary{cursor:pointer;color:var(--mut)}
.why summary:hover{color:var(--txt)}
details[open] summary{color:var(--gold2)}
.upgrade{color:var(--good);font-weight:700}
.miss-up{color:var(--good);font-weight:700}
.miss-down{color:var(--bad);font-weight:700}

/* status chips (same classes the app has always emitted) */
.label,.call{display:inline-block;padding:1px 7px;border-radius:4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;border:1px solid var(--line);background:var(--panel2);color:var(--mut)}
.ELITE,.START,.Stingy,.closer-ours{background:rgba(95,179,124,.14);color:#7fd09b;border-color:rgba(95,179,124,.4)}
.GOOD,.Questionable,.Soft{background:rgba(217,164,65,.14);color:#e6bd6a;border-color:rgba(217,164,65,.4)}
.LOCKED,.PLAYED,.closer-espn{background:rgba(110,140,220,.14);color:#9db4ee;border-color:rgba(110,140,220,.4)}
.AVERAGE,.SIT,.BYE,.BENCH,.Average,.closer-tie{background:var(--panel2);color:var(--mut);border-color:var(--line)}
.DANGER,.IR,.MISSING,.OUT,.Out,.Generous{background:rgba(212,103,90,.14);color:#e68a7f;border-color:rgba(212,103,90,.4)}
.Doubtful{background:rgba(217,130,65,.14);color:#e69a62;border-color:rgba(217,130,65,.4)}

/* sub-navigation pills (weeks, teams, report picker) */
.week-pick{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 16px}
.week-pick a{padding:6px 12px;border-radius:6px;background:var(--panel2);color:var(--mut);border:1px solid var(--line);font-weight:600;font-size:13px}
.week-pick a:hover{border-color:var(--gold);color:var(--txt)}
.week-pick a.active{background:var(--gold);color:#16120a;border-color:var(--gold)}
nav.week-pick{overflow:visible}

/* forms */
button,select,input{font:inherit;color:var(--txt);background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:7px 10px}
button{cursor:pointer}
button:hover{border-color:var(--gold)}
form.lookup{display:flex;gap:8px;margin:8px 0 16px}
form.lookup input{flex:1}
form.lookup button{background:var(--gold);color:#16120a;border-color:var(--gold);font-weight:700}

form.settings .fields{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px}
form.settings .fields.three{grid-template-columns:repeat(2,1fr)}
form.settings label{display:flex;flex-direction:column;gap:4px;color:var(--mut);font-size:12px;letter-spacing:.04em;text-transform:uppercase}
form.settings input,form.settings textarea{text-transform:none;letter-spacing:0;font-size:14px}
textarea{font:inherit;color:var(--txt);background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:8px 10px;resize:vertical}
button.primary{background:var(--gold);color:#16120a;border-color:var(--gold);font-weight:700}
button[disabled]{opacity:.5;cursor:default}
pre.log{background:#07080c;border:1px solid var(--line);border-radius:6px;padding:10px;overflow:auto;font-size:12px;color:var(--mut);max-height:320px}

/* landing page doors */
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
.door{display:flex;flex-direction:column;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:22px 22px 18px;min-height:190px}
.door:hover{border-color:var(--gold);background:var(--hi)}
.door-title{font-size:20px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
.door p{margin:0;color:#c5cad6;line-height:1.5;flex:1}
.door-go{color:var(--gold2);font-weight:700;font-size:13px}

/* account chip in the header */
.acct{display:flex;align-items:center;gap:10px;margin-left:auto;font-size:13px;white-space:nowrap}
.acct form{display:inline;margin:0}
.acct button{padding:4px 10px;font-size:12px}

/* log in / sign up */
.authcard{max-width:420px}
.authcard form.settings{display:flex;flex-direction:column;gap:12px}
.err{background:rgba(212,103,90,.12);border:1px solid rgba(212,103,90,.45);color:#e68a7f;border-radius:6px;padding:10px 14px;margin:0 0 14px}

/* tracker */
.label.src-analyst{background:rgba(200,168,90,.14);color:var(--gold2);border-color:rgba(200,168,90,.45)}
.label.src-dl{background:rgba(95,179,124,.14);color:#7fd09b;border-color:rgba(95,179,124,.4)}
.label.src-espn{background:rgba(110,140,220,.14);color:#9db4ee;border-color:rgba(110,140,220,.4)}
.label.cl-analyst{background:rgba(200,168,90,.14);color:var(--gold2);border-color:rgba(200,168,90,.45)}
.label.cl-dl{background:rgba(95,179,124,.14);color:#7fd09b;border-color:rgba(95,179,124,.4)}
.label.cl-espn{background:rgba(110,140,220,.14);color:#9db4ee;border-color:rgba(110,140,220,.4)}
.label.cl-tie{background:var(--panel2);color:var(--mut);border-color:var(--line)}
.label.STARTER{background:rgba(95,179,124,.14);color:#7fd09b;border-color:rgba(95,179,124,.4)}
tfoot td{border-top:1px solid var(--line)}

/* team chat */
.chat-log{display:flex;flex-direction:column;gap:8px;max-height:380px;overflow-y:auto;margin:10px 0}
.chat-log:empty{display:none}
.chat-msg{max-width:85%;padding:8px 12px;border-radius:8px;line-height:1.45;white-space:pre-wrap;word-wrap:break-word}
.chat-msg.user{align-self:flex-end;background:var(--sel);border:1px solid rgba(200,168,90,.35)}
.chat-msg.assistant{align-self:flex-start;background:var(--panel2);border:1px solid var(--line)}
.chat-msg.wait{color:var(--mut);font-style:italic}
.chat-msg.err{border-color:rgba(212,103,90,.45);color:#e68a7f}
.chat-form{display:flex;gap:8px;align-items:flex-end}
.chat-form textarea{flex:1}
.chat-proposal{background:var(--hi);border:1px solid var(--gold);border-radius:8px;padding:10px 14px;margin:10px 0}
.chat-proposal h3{margin:0 0 6px;font-size:14px;color:var(--gold2)}
.chat-proposal p{margin:6px 0}

@media (max-width:720px){
  .doors{grid-template-columns:1fr}
  header.top{flex-wrap:wrap;height:auto;padding-top:8px;padding-bottom:8px}
  .acct{margin-left:0}
  .chat-form{flex-direction:column;align-items:stretch}
  .chat-msg{max-width:95%}
  form.settings .fields,form.settings .fields.three{grid-template-columns:1fr}
  header.top{gap:12px;padding:0 12px}
  .brand small{display:none}
  main{padding:14px 12px 40px}
}