:root{--bg:#090b0d;--panel:#13171b;--line:#293038;--muted:#7d8792;--text:#eef1f4;--acid:#d9ff43;--cell:clamp(34px,4.2vw,58px);font-family:Inter,system-ui,sans-serif;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -20%,#293027,transparent 40%),var(--bg);color:var(--text)}button{font:inherit}.shell{width:min(1500px,calc(100% - 36px));margin:auto;padding:20px 0}
.topbar,.brand,.mission-bar,.mission-stats,.bay-head,.manifest-head,.selection-bar,.tool-buttons,.rule,.legend span,.result-top,.result-score{display:flex;align-items:center}.topbar{height:48px;justify-content:space-between;border-bottom:1px solid var(--line);margin-bottom:14px}.brand{gap:10px}.brand-mark{display:grid;place-items:center;width:31px;height:31px;background:var(--acid);color:#111;font-weight:1000}.brand b{display:block;letter-spacing:.08em;font-size:13px}.brand small{display:block;color:var(--muted);font-size:9px}.run-id span,.kicker{font:800 9px monospace;letter-spacing:.14em;color:#737d87}.run-id b{font:800 16px monospace;color:var(--acid);margin-left:8px}
.mission-bar{justify-content:space-between;align-items:end;padding:17px 20px;background:#14181c;border:1px solid var(--line);border-left:3px solid var(--acid);margin-bottom:12px}.mission-bar h1{font-size:21px;margin:5px 0 0}.mission-stats div{min-width:112px;border-left:1px solid var(--line);padding-left:18px}.mission-stats span{display:block;color:var(--muted);font:700 8px monospace}.mission-stats b{font:800 21px monospace}
.game-layout{display:grid;grid-template-columns:225px minmax(610px,1fr) 300px;gap:12px}.panel{background:linear-gradient(145deg,#14181c,#0f1215);border:1px solid var(--line);min-width:0}.brief-panel,.manifest-panel,.bay-panel{padding:18px}.section-title h2,.manifest-head h2,.bay-head h2{font-size:15px;margin:5px 0 0}
.rules{display:grid;gap:9px;margin-top:18px}.rule{gap:10px;padding:10px 8px;border-bottom:1px solid #242a30}.rule-icon{width:28px;height:28px;border:1px solid;display:grid;place-items:center;font-style:normal;font-weight:900}.heavy{color:#f1b84b}.express{color:#ff7b67}.fragile{color:#6ed4df}.rule b{display:block;font-size:11px}.rule span{display:block;color:var(--muted);font-size:9px;margin-top:3px}.tip{margin-top:18px;background:#191f18;border:1px solid #303b27;padding:12px}.tip span{font:800 8px monospace;color:var(--acid)}.tip p{font-size:10px;line-height:1.55;color:#a3aca5;margin:7px 0 0}.legend{display:flex;flex-direction:column;gap:8px;color:#707984;font-size:9px;margin-top:18px}.legend span{gap:7px}.legend i{width:15px;height:10px}.door-swatch{background:#262316;border:1px dashed #8b7a36}.floor-swatch{background:#202a19;border-bottom:2px solid var(--acid)}
.bay-head,.manifest-head{justify-content:space-between;margin-bottom:14px}.live{font:700 8px monospace;color:#89938f}.live i{display:inline-block;width:6px;height:6px;background:var(--acid);border-radius:50%;box-shadow:0 0 8px var(--acid);margin-right:6px}.truck-frame{position:relative;padding:17px 28px 17px 16px;background:#090b0d;border:1px solid #343a41;border-left:7px solid #454c53;overflow:auto}.door-label{position:absolute;right:6px;top:50%;writing-mode:vertical-rl;transform:translateY(-50%);font:800 8px monospace;color:#8b7a36}
.board{touch-action:none;overscroll-behavior:contain;display:grid;grid-template-columns:repeat(10,var(--cell));grid-template-rows:repeat(8,var(--cell));width:max-content;margin:auto;border:1px solid #4a5158}.cell{position:relative;border-right:1px solid #2b3137;border-bottom:1px solid #2b3137;background:#151a1f}.cell:after{content:"";position:absolute;inset:4px;border:1px solid transparent}.cell.door-zone:not(.filled){background:#191811}.cell.door-zone:not(.filled):after{border-color:#6a5e2e;border-style:dashed}.cell.floor-zone:not(.filled){box-shadow:inset 0 -3px var(--acid)}.cell.filled{background:var(--piece);border-color:#13171b;cursor:grab;animation:land .16s}.cell.filled:after{border-color:#ffffff35;background:linear-gradient(145deg,#fff2,transparent 55%)}.cell.type-heavy:before,.cell.type-express:before,.cell.type-fragile:before{position:absolute;z-index:2;left:5px;top:3px;color:#111a;font-size:9px;font-weight:1000}.cell.type-heavy:before{content:"▼"}.cell.type-express:before{content:"→"}.cell.type-fragile:before{content:"◇"}.cell.selected{filter:brightness(1.18);box-shadow:inset 0 0 0 2px #fff;z-index:4}.cell.preview-valid{background:#5d7c2c!important;box-shadow:inset 0 0 0 2px var(--acid);z-index:6}.cell.preview-invalid{background:#843f37!important;box-shadow:inset 0 0 0 2px #ff7868;z-index:6}
.selection-bar{justify-content:space-between;gap:12px;margin-top:13px;padding-top:13px;border-top:1px solid var(--line)}#selectedInfo span{display:block;font:700 8px monospace;color:var(--muted)}#selectedInfo b{font-size:12px}#selectedInfo em{font:700 8px monospace;color:var(--acid);font-style:normal}#selectedInfo small{display:none}.tool-buttons{gap:6px}.tool-buttons button{border:1px solid #333a42;background:#191e23;color:#bcc4cb;padding:8px 10px;font-size:9px;font-weight:700;cursor:pointer}.tool-buttons button:hover:not(:disabled){border-color:var(--acid);color:var(--acid)}.tool-buttons button:disabled{opacity:.3}.tool-buttons kbd{font-size:7px;background:#2d343b;padding:2px 4px}
.manifest-head>b{display:grid;place-items:center;width:27px;height:27px;border:1px solid #3c444c;color:var(--acid);font:800 12px monospace}.pieces{display:flex;flex-direction:column;gap:7px}.piece-card{height:62px;display:flex;align-items:center;justify-content:space-between;position:relative;padding:8px 9px;border:1px solid #292f35;background:#0d1013;cursor:grab;user-select:none;touch-action:none;overflow:hidden}.piece-card:hover,.piece-card.selected{border-color:var(--piece);background:#171b1f}.piece-card.placed{opacity:.4}.piece-copy{display:flex;flex-direction:column;gap:2px}.piece-copy>span{font:700 7px monospace;color:#626c75}.piece-copy>b{font-size:10px}.tag{font:800 6px monospace;font-style:normal}.tag.standard{color:#7d8792}.piece-shape{position:relative;margin-right:6px}.piece-shape i{position:absolute;width:16px;height:16px;background:var(--piece);border:1px solid #ffffff44}.loaded-mark{position:absolute;right:4px;top:2px;color:var(--acid)}.dispatch{width:100%;margin-top:14px;border:0;background:var(--acid);color:#111;padding:12px;text-align:left;cursor:pointer}.dispatch span{display:block;font:800 7px monospace}.dispatch b{font-size:11px}
.drag-ghost{position:fixed;z-index:100;pointer-events:none;filter:drop-shadow(0 8px 9px #000b);opacity:.86}.drag-ghost[hidden]{display:none}.drag-ghost i{position:absolute;width:30px;height:30px;background:var(--piece);border:1px solid #fff5}.toast{position:fixed;z-index:120;bottom:24px;left:50%;transform:translate(-50%,15px);opacity:0;background:#202720;border:1px solid #586548;color:#e9f5ca;padding:10px 14px;font-size:10px;transition:.18s;pointer-events:none;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.bad{background:#2b1716;border-color:#743e39;color:#ffc5be}
.result-dialog{width:min(480px,calc(100% - 28px));border:1px solid #3b434b;background:#12161a;color:var(--text);padding:22px}.result-dialog::backdrop{background:#050607dc}.result-top,.result-score{justify-content:space-between}.result-top button{border:0;background:none;color:#79838c;font-size:20px}.grade{width:80px;height:80px;display:grid;place-items:center;margin:14px auto 10px;border:2px solid var(--acid);color:var(--acid);font:900 44px monospace}.grade-D,.grade-C{color:#ff7868;border-color:#ff7868}.grade-B{color:#f1b84b;border-color:#f1b84b}.result-dialog h2,.result-dialog>p{text-align:center}.result-dialog>p{color:var(--muted);font-size:11px}.result-rows{border-top:1px solid var(--line)}.result-rows div{display:flex;justify-content:space-between;padding:6px;font-size:11px}.result-rows p,.warn{color:#ff9185;font-size:9px}.result-score{background:#1b211b;padding:12px}.result-score b{font:900 23px monospace;color:var(--acid)}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.result-actions button{border:1px solid #3a424a;background:#1a1f24;color:#dce1e5;padding:10px;font-size:10px}.result-actions button:last-child{background:var(--acid);color:#111}
@keyframes land{from{transform:scale(.88);filter:brightness(1.5)}}@media(max-width:1120px) and (min-width:761px){.game-layout{grid-template-columns:210px 1fr}.manifest-panel{grid-column:1/-1}.pieces{display:grid;grid-template-columns:repeat(4,1fr)}}
@media(max-width:760px){:root{--cell:calc((100vw - 38px)/10)}body{background:#090b0d}.shell{width:100%;padding:6px 0 20px}.topbar{height:42px;margin:0 10px 8px}.brand small,.run-id{display:none}.mission-bar{margin:0 8px 8px;padding:10px 11px;align-items:center}.mission-bar .kicker{display:none}.mission-bar h1{font-size:13px;margin:0;max-width:130px}.mission-stats div{min-width:52px;padding-left:7px}.mission-stats span{font-size:5px}.mission-stats b{font-size:14px}.game-layout{display:flex;flex-direction:column;gap:8px}.brief-panel{display:none}.bay-panel{order:0;margin:0 8px;padding:8px}.bay-head{margin-bottom:8px}.bay-head h2{font-size:13px}.live{font-size:6px}.truck-frame{padding:4px 12px 4px 2px;border-left-width:3px}.door-label{right:2px;font-size:6px}.cell:after{inset:2px}.selection-bar{flex-direction:column;align-items:stretch;gap:8px;margin-top:8px;padding-top:8px}#selectedInfo{min-height:34px}#selectedInfo b{font-size:13px}#selectedInfo small{display:block;color:var(--acid);font-size:9px;margin-top:3px}.tool-buttons{width:100%;gap:5px}.tool-buttons button{flex:1;min-height:42px;padding:7px 3px;font-size:9px}.tool-buttons kbd{display:none}.manifest-panel{order:1;border:0;background:transparent;padding:10px 8px}.manifest-head{margin-bottom:9px}.manifest-head h2{font-size:13px}.pieces{display:flex;flex-direction:row;overflow-x:auto;gap:8px;padding:1px 1px 8px;scroll-snap-type:x mandatory}.piece-card{min-width:152px;height:72px;scroll-snap-align:start}.piece-card.placed{opacity:.55}.dispatch{position:sticky;bottom:8px;z-index:20;min-height:52px;margin-top:7px;box-shadow:0 8px 30px #000}.result-dialog{max-height:calc(100dvh - 24px);overflow:auto}.result-actions{grid-template-columns:1fr}}
@media(max-width:760px){.pieces,.piece-card{touch-action:pan-x}.pieces{-webkit-overflow-scrolling:touch}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}