/* nowgoal.eu.cc : operations-room charcoal, single amber accent. Radius: panels 10, controls 8, chips 6. */
:root{
  --bg:#101215; --surface:#171a1f; --surface-2:#1e2228; --line:#2a2f37; --ink:#e9ebee; --muted:#9aa2ad;
  --accent:#e8a33d; --accent-ink:#17110a; --r:10px; --r-s:8px; --r-c:6px; --wrap:1380px;
  --font-body:"Manrope",system-ui,sans-serif; --font-display:"Chakra Petch","Manrope",system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
[hidden]{display:none!important}
body{font-size:15px;line-height:1.55}
h1,h2,h3,h4{letter-spacing:-.01em;font-weight:600}
.ic{vertical-align:-.125em}

/* base overrides: squarer technical system */
.tag{border-radius:var(--r-c);background:color-mix(in oklab,var(--accent) 14%,transparent);color:var(--accent);font-family:var(--font-display);font-weight:600;letter-spacing:.03em;text-transform:uppercase;font-size:.68rem}
.btn{border-radius:var(--r-s)}
.chip{border-radius:var(--r-c)}
.art{border-radius:var(--r-s)}
.acard{border-radius:var(--r)}
.acard:hover{transform:translateY(-2px)}
.form i{border-radius:4px;background:var(--surface-2);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}
.form .w{background:var(--accent);color:var(--accent-ink);box-shadow:none}
.form .l{background:transparent;color:var(--muted)}
.mrow__t.is-live{color:var(--accent)}
.mrow__s,.lb__score b{font-family:var(--font-display);font-weight:600}
.standings thead th{font-family:var(--font-display)}
.fl--goal .fl__ic{background:var(--accent);color:var(--accent-ink)}
.pg__h h1,.article__h h1{font-family:var(--font-display);font-weight:600}
.lg,.tbl-wrap,.lb__score{border-radius:var(--r)}
.gl{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;max-width:1000px}
.gl>div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.gl dt{font-family:var(--font-display);font-weight:600;font-size:1.05rem;color:var(--accent);margin-bottom:4px}
.gl dd{color:var(--muted);font-size:.94rem}
.gl__more{margin-top:24px;color:var(--muted)}.gl__more a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}

/* live ring: transform + opacity only */
.ring{position:relative;display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);flex:none}
.ring::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--accent);animation:ring 2s ease-out infinite}
@keyframes ring{0%{transform:scale(1);opacity:.6}80%,100%{transform:scale(3);opacity:0}}

/* header */
.hd{position:sticky;top:0;z-index:40;background:color-mix(in oklab,var(--bg) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hd__in{display:flex;align-items:center;gap:28px;height:56px}
.brand{display:flex;align-items:center;gap:10px;flex:none}
.brand__mk{display:grid;place-items:center;width:30px;height:30px;border-radius:var(--r-s);background:var(--accent);color:var(--accent-ink);font:700 .86rem/1 var(--font-display);letter-spacing:.02em}
.brand__n{font:600 1.18rem/1 var(--font-display);letter-spacing:.01em}
.nav{display:flex;gap:2px;flex:1;min-width:0}
.nav a{padding:17px 12px 15px;font-size:.88rem;font-weight:600;color:var(--muted);border-bottom:2px solid transparent;transition:color .2s,border-color .2s;white-space:nowrap}
.nav a:hover{color:var(--ink)}
.nav a[aria-current=page]{color:var(--ink);border-color:var(--accent)}
.nav .nav__go{color:var(--accent)}
.nav .nav__go:hover{color:var(--accent);border-color:var(--accent)}
.hd__live{display:flex;align-items:center;gap:10px;flex:none;padding:6px 12px;border:1px solid var(--line);border-radius:var(--r-s);font-size:.82rem;font-weight:600;background:var(--surface);white-space:nowrap}

/* ops bar */
.ops{border-bottom:1px solid var(--line);background:var(--surface)}
.ops__in{display:flex;align-items:center;gap:24px;min-height:64px;padding-block:10px;flex-wrap:wrap}
.ops__t{flex:1;min-width:260px}
.ops__t h1{font-size:1.15rem;line-height:1.25}
.ops__t p{color:var(--muted);font-size:.82rem}
.ops__lead{max-width:72ch;margin-top:4px;line-height:1.5}
.days{display:flex;padding:3px;gap:2px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-s)}
.days__b{border:0;background:none;padding:7px 16px;border-radius:6px;font-weight:600;font-size:.85rem;color:var(--muted);cursor:pointer;white-space:nowrap;transition:background .2s,color .2s}
.days__b:hover{color:var(--ink)}
.days__b[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}
.strip{display:flex;gap:0;border:1px solid var(--line);border-radius:var(--r-s);background:var(--bg)}
.strip>div{display:flex;align-items:baseline;gap:8px;padding:7px 16px}
.strip>div+div{border-left:1px solid var(--line)}
.strip dt{font-size:.74rem;color:var(--muted);font-weight:600}
.strip dd{font:600 1.15rem/1 var(--font-display);font-variant-numeric:tabular-nums;color:var(--ink)}
.strip>div:nth-child(2) dd{color:var(--accent)}

/* columns */
.cols{display:grid;gap:16px;grid-template-columns:minmax(0,1fr);align-items:start;padding-block:16px 40px}
.pn{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.pn__h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.pn__h h2{font-size:1.02rem}
.pn__s{display:inline-flex;align-items:center;gap:8px;font-size:.76rem;color:var(--muted);font-weight:600}
.more{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:.84rem;font-weight:700;color:var(--accent)}
.more:hover{text-decoration:underline;text-underline-offset:3px}
.lbp__links{display:flex;flex-wrap:wrap;gap:0 20px}
.lbp{order:1}.tl{order:2}.rt{order:3}
.rt{display:grid;gap:16px}

/* timeline */
.tl__scroll{max-height:460px;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--line) transparent;margin-right:-6px;padding-right:6px}
.tl__list{position:relative;display:grid;gap:6px;padding-left:20px}
.tl__list::before{content:"";position:absolute;left:5px;top:10px;bottom:10px;width:1px;background:var(--line)}
.tn{position:relative;border:1px solid var(--line);border-radius:var(--r-s);background:var(--bg);transition:border-color .25s,background .25s}
.tn::before{content:"";position:absolute;left:-19px;top:15px;width:9px;height:9px;border-radius:50%;background:var(--surface);box-shadow:0 0 0 2px var(--line);transition:background .25s,box-shadow .25s}
.tn[data-status=live]::before{background:var(--accent);box-shadow:0 0 0 2px color-mix(in oklab,var(--accent) 40%,transparent)}
.tn[data-status=ft]::before{background:var(--muted);box-shadow:0 0 0 2px var(--line)}
.tn.is-active{border-color:color-mix(in oklab,var(--accent) 65%,var(--line));background:color-mix(in oklab,var(--accent) 6%,var(--bg))}
.tn.is-active::before{box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 55%,transparent)}
.tn summary{list-style:none;display:grid;gap:4px;padding:9px 12px;cursor:pointer;position:relative;border-radius:var(--r-s)}
.tn summary::-webkit-details-marker{display:none}
.tn summary::after{content:"";position:absolute;right:12px;top:13px;width:6px;height:6px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(45deg);transition:transform .25s var(--ease)}
.tn details[open] summary::after{transform:rotate(-135deg)}
.tn__row{display:flex;align-items:center;gap:10px;padding-right:20px}
.tn__t{font:600 .86rem/1 var(--font-display);font-variant-numeric:tabular-nums}
.tn__st{font-size:.68rem;font-weight:700;letter-spacing:.04em;color:var(--muted);text-transform:uppercase}
.tn[data-status=live] .tn__st{color:var(--accent)}
.tn__tm{display:flex;align-items:center;gap:8px;min-width:0}
.tn__n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;font-size:.88rem}
.tn__tm b{font:600 .95rem/1 var(--font-display);font-variant-numeric:tabular-nums;min-width:1ch;text-align:right}
.tn__d{padding:8px 12px 12px;border-top:1px solid var(--line);display:grid;gap:6px;font-size:.8rem}
.tn__d dt{color:var(--muted);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.tn__d dd{color:var(--ink)}
.tl__empty{padding:14px;border:1px dashed var(--line);border-radius:var(--r-s);color:var(--muted);font-size:.88rem}
.tl__empty a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}

/* live blog */
.bd{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px 12px}
.bd__meta{display:flex;justify-content:space-between;gap:12px;font-size:.78rem;color:var(--muted);font-weight:600}
.bd__st{font-family:var(--font-display);color:var(--accent);letter-spacing:.04em}
.bd[data-status=ft] .bd__st,.bd[data-status=ns] .bd__st{color:var(--muted)}
.bd__main{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding-block:14px 10px}
.bd__t{display:grid;justify-items:center;gap:8px;text-align:center;font-family:var(--font-display);font-size:1.02rem;min-width:0}
.bd__t b{font-weight:600}
.bd__s{font:700 clamp(2.2rem,5vw,3.2rem)/1 var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:.02em;white-space:nowrap}
.bd__v{text-align:center;font-size:.78rem;color:var(--muted)}
.fchips{display:flex;gap:6px;flex-wrap:wrap;margin-block:14px 6px}
.fchip{border:1px solid var(--line);background:var(--bg);padding:6px 14px;border-radius:var(--r-c);font-weight:600;font-size:.82rem;color:var(--muted);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.fchip:hover{color:var(--ink);border-color:var(--muted)}
.fchip[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.feed .fl{grid-template-columns:44px 30px 1fr;padding:12px 0;gap:10px}
.feed .fl__min{font-family:var(--font-display);color:var(--ink)}
.feed .fl__ic{width:28px;height:28px;border-radius:var(--r-c);font-size:.95rem;font-weight:700}
.feed .fl p{color:var(--ink)}
.feed .fl--goal p{font-weight:600}
.feed .fl--note{display:grid;grid-template-columns:30px 1fr;margin:6px 0 10px;padding:12px 14px;border:1px solid color-mix(in oklab,var(--accent) 28%,var(--line));border-radius:var(--r);background:color-mix(in oklab,var(--accent) 7%,var(--surface));gap:12px}
.feed .fl--note .fl__ic{background:var(--accent);color:var(--accent-ink);width:28px;height:28px}
.fl__who{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-bottom:3px;font-size:.78rem}
.fl__who strong{font-family:var(--font-display);color:var(--accent);font-size:.84rem;letter-spacing:.02em}
.fl__who span{color:var(--muted);font-weight:600}
.fl__t{font-size:.92rem;color:var(--ink)}
.feed__empty{padding:16px;border:1px dashed var(--line);border-radius:var(--r-s);color:var(--muted);font-size:.9rem}

/* right column */
.tr li+li{border-top:1px solid var(--line)}
.tr a{display:grid;grid-template-columns:28px 1fr;gap:10px;padding:10px 0;align-items:start}
.tr__n{font:700 1.15rem/1.2 var(--font-display);color:var(--accent);font-variant-numeric:tabular-nums}
.tr__b strong{display:block;font-size:.9rem;line-height:1.35;font-weight:600;transition:color .2s}
.tr a:hover strong{color:var(--accent)}
.tr__b small{color:var(--muted);font-size:.74rem}
.rt .tbl-wrap{border:0;background:none;border-radius:0}
.rt .standings{min-width:0;font-size:.85rem}
.rt .standings th,.rt .standings td{padding:8px 4px}
.rt .standings :is(th,td):nth-child(n+3):nth-child(-n+8),.rt .standings :is(th,td):nth-child(11){display:none}
.rt .standings thead th{background:none;border-bottom:1px solid var(--line)}
.rt .standings td.c-pts{font-family:var(--font-display)}
.sk li{display:grid;grid-template-columns:24px 1fr auto;gap:10px;align-items:center;padding:9px 0;border-top:1px solid var(--line)}
.sk li:first-child{border-top:0}
.sk small{display:block;color:var(--muted);font-size:.74rem}
.sk b{font:600 1.1rem/1 var(--font-display);font-variant-numeric:tabular-nums}

/* guide */
.gd{padding-block:16px 40px}
.gd h2{font-size:1.5rem}
.gd__lead{color:var(--muted);margin:4px 0 20px}
.gd__grid{display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}
.gc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:border-color .25s}
.gc:hover{border-color:color-mix(in oklab,var(--accent) 55%,var(--line))}
.gc a{display:grid;height:100%}
.gc .art{border-radius:0;aspect-ratio:16/8}
.gc__b{display:grid;gap:10px;align-content:start;justify-items:start;padding:20px 22px 24px}
.gc h3{font-size:1.45rem;line-height:1.2;max-width:26ch}
.gc p{color:var(--muted);max-width:56ch}
.gc__go{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.88rem;color:var(--accent);margin-top:4px}

/* FAQ */
.faq{max-width:none;margin-block:8px 48px}
.faq h2{font-size:1.5rem;margin-bottom:16px}
.faq details{border:1px solid var(--line);border-radius:var(--r-s);background:var(--surface);margin-bottom:8px}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{padding:14px 16px;font-size:.96rem}
.faq__a{padding:0 16px 16px;font-size:.92rem}

/* footer */
.ft{border-top:1px solid var(--line);background:var(--surface);margin-top:8px}
.ft__in{display:grid;gap:28px;grid-template-columns:repeat(2,minmax(0,1fr));padding-block:36px 28px}
.ft__brand{grid-column:1/-1}
.ft__brand p{margin-top:12px;color:var(--muted);font-size:.88rem;max-width:44ch}
.ft nav{display:grid;gap:8px;align-content:start}
.ft h2{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:4px}
.ft nav a{font-size:.88rem;color:var(--ink);opacity:.85;transition:color .2s,opacity .2s}
.ft nav a:hover{color:var(--accent);opacity:1}
.ft__bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-block:16px 24px;border-top:1px solid var(--line);color:var(--muted)}

@media (min-width:1100px){
  .cols{grid-template-columns:296px minmax(0,1fr) 328px}
  .lbp,.tl,.rt{order:0}
  .tl{position:sticky;top:72px;max-height:calc(100dvh - 88px);display:flex;flex-direction:column}
  .tl__scroll{max-height:none;flex:1;min-height:0}
  .gd__grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
  .faq{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;align-items:start}
  .faq h2{grid-column:1/-1}
  .ft__in{grid-template-columns:1.5fr 1fr 1.3fr 1fr}
  .ft__brand{grid-column:auto}
}
@media (max-width:1099px){
  .tl__scroll{max-height:420px}
}
@media (max-width:760px){
  .hd__in{flex-wrap:wrap;height:auto;gap:0 12px;padding-block:10px 0}
  .nav{order:3;flex:1 0 100%;overflow-x:auto;scrollbar-width:none;margin-inline:-4px}
  .nav::-webkit-scrollbar{display:none}
  .nav a{padding:12px 12px 10px}
  .hd__live{margin-left:auto}
  .ops__in{gap:12px}
  .ops__t{flex:1 0 100%;min-width:0}
  .strip{flex:1}
  .strip>div{flex:1;padding-inline:10px;justify-content:center}
  .days__b{padding-inline:12px}
  .feed .fl{grid-template-columns:38px 28px 1fr}
  .feed .fl.fl--note{grid-template-columns:30px 1fr}
  .gc h3{font-size:1.25rem}
}
@media (prefers-reduced-motion:reduce){.ring::after{display:none}}

/* brand logo (brand/nowgoal.svg) */
.brand__img{display:block;height:28px;width:auto}
.brand{line-height:0}
