@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Big+Shoulders+Display:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap");
:root { --bg:#181918; --bar:#111211; --card:#1F2220; --btn:#2E322E; --fg:#F2F3F0; --dim:#A8ACA6; --line:#353835; --lime:#CDF15F; --red:#C24342; --amber:#F0B429; --go:#42AF61; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:#000; color:var(--fg); font:14px/1.35 Archivo, system-ui, sans-serif; }
a { color:inherit; }
button { font:inherit; color:var(--fg); cursor:pointer; border:0; border-radius:2px; background:var(--btn); }
:is(a, button):focus-visible { outline:2px solid var(--lime); outline-offset:1px; }
.h { font-family:"Big Shoulders Display", "Arial Narrow", sans-serif; font-weight:800; text-transform:uppercase; letter-spacing:.03em; line-height:1; }
.m { font-family:"JetBrains Mono", ui-monospace, monospace; font-variant-numeric:tabular-nums; }
.lb { font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); }

header { display:flex; flex-wrap:wrap; align-items:center; gap:4px 28px; min-height:56px; padding:0 18px; background:var(--bg); }
.brand { font-size:22px; }
nav { display:flex; flex-wrap:wrap; gap:22px; }
nav a { min-height:48px; display:inline-flex; align-items:center; color:var(--dim); font-weight:600; text-decoration:none; border-bottom:3px solid transparent; }
nav a.on { color:var(--fg); border-bottom-color:var(--lime); }
.right { margin-left:auto; display:flex; flex-wrap:wrap; align-items:center; gap:16px; color:var(--dim); }
.right button { min-height:40px; padding:0 12px; }

.desk { display:flex; flex-wrap:wrap; gap:2px; align-items:stretch; min-height:calc(100vh - 56px); }
#wall { flex:999 1 640px; min-width:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(min(290px, 100%), 1fr)); grid-auto-rows:214px; grid-auto-flow:dense; gap:2px; align-content:start; }
.tile { display:flex; flex-direction:column; min-width:0; background:var(--bar); text-decoration:none; }
.tile[data-status="needs"] { grid-column:span 2; grid-row:span 2; }
.pic { display:block; position:relative; flex:1; min-height:0; overflow:hidden; }
.pic img { display:block; width:100%; height:100%; object-fit:cover; }
.pic img:not([src]) { visibility:hidden; }
.tile[data-status="soon"] img, .tile[data-status="ended"] img { opacity:.45; }
.issue { display:none; grid-template-columns:minmax(0, 1fr) auto; gap:12px; align-items:center; padding:10px 12px; background:#3C2524; color:#F5E3E1; font-weight:600; }
.tile[data-status="needs"] .issue { display:grid; }
.pick { display:flex; gap:6px; }
.btn.keep { background:var(--lime); color:#181918; }
.flag { position:absolute; left:0; top:0; font-size:15px; }
.flag:not(:empty) { padding:5px 9px; background:var(--btn); }
.tile[data-status="needs"] .flag { background:var(--red); color:#fff; font-size:17px; }
.umd { display:grid; grid-template-columns:10px minmax(0, 1fr) auto; align-items:center; gap:8px; height:34px; padding:0 10px; }
.tly { width:10px; height:10px; background:#6E736D; }
.tile[data-status="running"] .tly { background:var(--go); }
.tile[data-status="needs"] .tly { background:var(--red); }
.name { font-size:13px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.air { font-size:12px; color:var(--lime); white-space:nowrap; white-space-collapse:preserve; }

aside { flex:1 1 320px; max-width:100%; background:var(--bg); }
.qhead { display:flex; align-items:baseline; justify-content:space-between; padding:16px; color:var(--dim); }
.qhead h1 { margin:0; font-size:26px; color:var(--fg); }
.qrow { display:grid; grid-template-columns:48px minmax(0, 1fr); gap:10px; padding:14px 16px; border-top:1px solid #2A2D2A; }
.qrow p { margin:2px 0 0; color:#C8CCC6; }
.wait { color:#FFB4AE; font-weight:700; }
.acts { display:flex; gap:6px; margin-top:8px; }
.btn { display:inline-flex; align-items:center; height:44px; padding:0 14px; background:var(--btn); font-size:17px; text-decoration:none; }
.empty { margin:0; padding:14px 16px; border-top:1px solid #2A2D2A; color:var(--dim); }
.done { padding:16px; border-top:1px solid #2A2D2A; }
.done > .h { margin-bottom:10px; font-size:18px; color:var(--dim); }
.log { display:grid; grid-template-columns:44px minmax(0, 1fr); gap:10px; padding:4px 0; color:#C8CCC6; }

.page { background:var(--bg); min-height:calc(100vh - 56px); }
.game { display:flex; flex-wrap:wrap; align-items:flex-start; }
.board { flex:3 1 520px; min-width:0; }
.stage { position:relative; background:#000; line-height:0; }
.stage img { display:block; width:100%; height:auto; }
.stage i { position:absolute; border:2px solid var(--lime); }
.airbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 20px; padding:12px 18px; background:#000; }
.airbar b { font-size:32px; color:var(--lime); font-variant-numeric:tabular-nums; white-space-collapse:preserve; }
.fields { flex:2 1 400px; min-width:0; align-self:stretch; background:var(--card); padding:6px 18px 18px; }
.f { display:grid; grid-template-columns:minmax(0, 1fr) auto; align-items:center; min-height:60px; border-top:1px solid var(--line); }
.f b { font-size:30px; font-variant-numeric:tabular-nums; }
.pad { padding:14px 18px; }
table { width:100%; min-width:760px; border-collapse:collapse; }
th { font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); text-align:left; padding:12px 14px; }
td { padding:14px; border-top:1px solid var(--line); }
td:first-child { font-size:24px; color:var(--lime); }
.scroll { overflow-x:auto; background:var(--card); }
.scorebug { position:relative; aspect-ratio:4 / 1; overflow:hidden; background:#000; }
.scorebug iframe { position:absolute; left:0; bottom:0; width:1920px; height:1080px; border:0; transform-origin:0 100%; }
.f { grid-template-columns:minmax(0, 1fr) auto auto auto; gap:10px; }
.f .fast { width:64px; color:var(--dim); text-align:right; }
.f b { min-width:92px; text-align:right; }
.f.held { background:#3C2524; }
.f .do { display:flex; gap:4px; min-width:190px; justify-content:flex-end; align-items:center; }
.f button, .f input { height:44px; min-width:44px; padding:0 10px; }
.f input { width:84px; background:#111211; color:var(--fg); border:2px solid var(--line); border-radius:2px; font:inherit; }
.f .lk { background:var(--amber); color:#181918; font-weight:700; }
.tools { margin-left:auto; display:flex; flex-wrap:wrap; gap:6px; }
.tools a, .tools button { min-height:44px; display:inline-flex; align-items:center; padding:0 14px; background:var(--btn); font-weight:600; text-decoration:none; }
.embed .site { display:none !important; }
.embed body, .embed .page { min-height:0; }