.cargo-page{--cargo-yellow:#edbd56;--cargo-petrol:#284f53;max-width:1160px;margin:auto}.cargo-intro{display:flex;justify-content:space-between;gap:24px;align-items:center;margin:22px 0 30px}.cargo-intro .back-link{display:block;margin-bottom:20px}.cargo-intro .eyebrow{display:block}.cargo-intro h1{font-size:clamp(38px,5vw,64px);margin:8px 0;letter-spacing:-.06em}.cargo-intro h1 span{color:var(--accent-ink);margin-left:.13em}.cargo-intro p{color:var(--muted);margin:0}.cargo-stamp{border:2px solid var(--ink);border-radius:50%;width:150px;height:150px;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:12px;line-height:1.5;transform:rotate(9deg);flex:none}.cargo-stamp b{font-size:18px}.cargo-stamp span{font-size:10px;margin-top:8px}.cargo-workspace{display:grid;grid-template-columns:minmax(170px,1fr) minmax(250px,430px) minmax(180px,1fr);gap:clamp(18px,3vw,38px);align-items:start;background:var(--surface);border:1px solid var(--line);padding:26px;border-radius:18px}.cargo-dashboard,.cargo-next{padding-top:12px;min-width:0}.cargo-dashboard .eyebrow,.cargo-next .eyebrow{font-size:10px}.cargo-score{margin-top:25px}.cargo-score>span,.cargo-meters span,.cargo-record>span{display:block;color:var(--muted);font-size:12px}.cargo-score strong{font:650 clamp(30px,3.6vw,46px)/1.2 var(--display);letter-spacing:-.04em;display:block;font-variant-numeric:tabular-nums}.cargo-meters{display:flex;gap:36px;margin:22px 0}.cargo-meters b{font:650 26px var(--display)}.cargo-progress{font-size:11px;border-top:1px solid var(--line);padding-top:20px}.cargo-progress>span{display:flex;justify-content:space-between;gap:8px;color:var(--muted);flex-wrap:wrap}.cargo-progress b{color:var(--ink);font-weight:500}.cargo-progress progress{display:block;width:100%;height:6px;margin-top:8px;appearance:none;border:0;border-radius:10px;overflow:hidden;background:var(--surface-alt)}.cargo-progress progress::-webkit-progress-bar{background:var(--surface-alt)}.cargo-progress progress::-webkit-progress-value{background:var(--cargo-yellow)}.cargo-record{padding:20px 0;border-bottom:1px solid var(--line)}.cargo-record strong{display:block;font:650 26px var(--display)}.cargo-record small{color:var(--muted);font-size:10px}.cargo-mode{font-size:12px;color:var(--muted);margin:20px 0}.cargo-buttons{display:grid;gap:8px}.cargo-buttons button,.cargo-touch button,.cargo-overlay>button:not(.cargo-start){border:1px solid var(--line);background:var(--surface-alt);color:var(--ink);border-radius:7px;padding:10px 12px;font:inherit;cursor:pointer}.cargo-buttons button{display:flex;justify-content:space-between;font-size:12px;min-height:42px}.cargo-buttons button:disabled{opacity:.45;cursor:default}.cargo-page kbd{font:11px var(--body);background:var(--surface-alt);border:1px solid var(--line);padding:2px 5px;border-radius:4px}.cargo-parking{display:flex;align-items:center;justify-content:space-between;padding:0 8px 12px;color:var(--muted);font-size:10px;letter-spacing:.15em}.cargo-parking>span{color:#fff;background:#3c7484;border:2px solid #fff;border-radius:3px;font:700 17px var(--body);width:26px;height:26px;text-align:center;box-shadow:0 0 0 1px #c3c9bd}.cargo-parking i{height:18px;width:32px;border-top:2px dashed var(--line);transform:rotate(-35deg)}.cargo-car{background:#537b7c;border-radius:55px 55px 25px 25px;padding:9px 15px 0;border:2px solid #35585b;box-shadow:inset 0 0 0 4px #89a4a099,0 8px 0 #172f3322}.cargo-hatch{position:relative;height:28px;display:flex;justify-content:space-between;align-items:center;padding:0 13px}.cargo-hatch>span{height:9px;width:35%;background:#2c4348;border-radius:8px;border-top:2px solid #a2beba}.cargo-hatch i{height:22px;width:3px;background:#c0d1c9;transform:rotate(-30deg)}.cargo-hatch i:last-child{transform:rotate(30deg)}.cargo-trunk{position:relative;overflow:hidden;border:6px solid #203a3d;border-radius:21px 21px 8px 8px;background:#253c40;outline-offset:5px}.cargo-trunk canvas{width:100%;height:auto;display:block;aspect-ratio:2/3;touch-action:none}.cargo-bumper{height:35px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 5px;font-size:8px;letter-spacing:.12em;color:#d8e6d9}.cargo-bumper i{width:25px;height:10px;background:#e78069;border-radius:2px}.cargo-overlay{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:25px;background:#183639ed;color:#fcf4dd;gap:12px}.cargo-overlay[hidden]{display:none}.cargo-overlay .eyebrow{color:#e8c67c;font-size:9px}.cargo-overlay h2{font-size:clamp(25px,3vw,42px);margin:0;color:#fcf4dd}.cargo-overlay p{font-size:13px;line-height:1.65;margin:0;max-width:250px;color:#d1ded3}.cargo-start{border:0;background:var(--cargo-yellow);color:#293a36;font:650 15px var(--display);padding:13px 25px;border-radius:7px;cursor:pointer;margin-top:8px}.cargo-start:disabled{opacity:.6;cursor:wait}.cargo-overlay>a{font-size:12px;color:#e8dcc0}.cargo-overlay #cargo-final{font-size:13px;line-height:1.8;color:#e8dcc0}.cargo-overlay #cargo-final strong{font:650 34px var(--display);color:#f4c763;display:block}.cargo-combo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:calc(100% - 24px);white-space:nowrap;text-align:center;color:#fff4bf;font:650 12px/1.2 var(--body);pointer-events:none;opacity:0;transition:opacity .12s}.cargo-combo.show{opacity:1}.cargo-combo.show+span{opacity:0}.cargo-touch{display:flex;gap:6px;margin-top:17px;justify-content:center}.cargo-touch button{min-height:43px;min-width:42px;font-size:18px;touch-action:none;user-select:none}.cargo-touch button:last-child{font-size:12px;flex:1;max-width:120px}.cargo-next h2{font-size:22px;line-height:1.2;margin:8px 0 20px}.cargo-next ol{list-style:none;margin:0;padding:0;display:grid;gap:10px}.cargo-next li{display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--line);padding-bottom:10px;font-size:12px;min-height:66px}.cargo-next li>span{color:var(--muted);font-size:10px}.cargo-next canvas{width:64px;height:58px;flex:none}.cargo-tip{margin-top:26px;font-size:12px}.cargo-tip p{color:var(--muted);line-height:1.6;margin:8px 0}.cargo-zone-sketch{display:flex;flex-direction:column;gap:3px;margin:15px 0 22px;width:100%}.cargo-zone-sketch i{display:block;height:7px;background:var(--cargo-yellow);opacity:.65;border-radius:2px}.cargo-keys{border-top:1px solid var(--line);padding-top:14px;font-size:11px;color:var(--muted);display:grid;gap:8px;margin-bottom:0}.cargo-keys>div{display:flex;justify-content:space-between;align-items:center}.cargo-keys dd{margin:0}.cargo-status{font-size:12px;text-align:center;color:var(--muted);margin:18px 0 35px;min-height:20px}.cargo-results{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin:45px 0}.cargo-results h2{font-size:30px;margin:10px 0}.cargo-results p{font-size:13px;color:var(--muted)}.cargo-history{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:20px}.cargo-history-row{display:flex;justify-content:space-between;gap:10px;font-size:12px;border-bottom:1px solid var(--line);padding:9px 0}.cargo-history-row span{color:var(--muted)}.cargo-library-art{height:180px;border-radius:9px;position:relative;overflow:hidden;background:#d4ded2;border:12px solid #63898a;margin-bottom:25px}.cargo-library-art>span{position:absolute;top:12px;left:12px;font:650 11px var(--display);letter-spacing:.12em;color:#37595a}.cargo-mini-case{position:absolute;bottom:15px;left:22px;width:72px;height:91px;border-radius:10px;background:#eabb58;box-shadow:inset 0 0 0 3px #ad853a;transform:rotate(-10deg)}.cargo-mini-case:before{content:"";position:absolute;top:-9px;left:25px;border:4px solid #ad853a;width:20px;height:8px;border-bottom:0;border-radius:4px 4px 0 0}.cargo-mini-case i,.cargo-mini-case b{position:absolute;top:3px;bottom:3px;width:7px;background:#ad853a88;left:15px}.cargo-mini-case b{left:auto;right:15px}.cargo-mini-box{position:absolute;right:24px;bottom:17px;background:#c9986f;border:2px solid #9d7653;width:68px;height:64px;display:grid;place-items:center;font-size:26px;color:#725943;transform:rotate(7deg)}.cargo-mini-box:after{content:"";position:absolute;left:27px;top:0;bottom:0;width:9px;background:#eccea055}.cargo-mini-roll{position:absolute;right:33px;top:35px;width:95px;height:28px;background:#8ba876;border:2px solid #54764e;border-radius:15px;transform:rotate(8deg)}.cargo-mini-roll:before,.cargo-mini-roll:after{content:"";position:absolute;top:0;bottom:0;width:5px;background:#54764e;left:20px}.cargo-mini-roll:after{left:65px}
@media(min-width:900px) and (max-height:950px){.cargo-stage{max-width:350px;margin:auto;width:100%}.cargo-workspace{grid-template-columns:minmax(170px,1fr) minmax(250px,350px) minmax(180px,1fr)}.cargo-intro{margin-top:0}.cargo-intro h1{font-size:48px}.cargo-stamp{width:110px;height:110px}.cargo-stamp b{font-size:14px}}
@media(max-width:850px){.cargo-workspace{grid-template-columns:145px minmax(240px,1fr);gap:20px;padding:20px}.cargo-next{grid-column:1/-1;display:grid;grid-template-columns:145px 1fr;gap:0 20px;padding-top:0}.cargo-next>.eyebrow{grid-column:1}.cargo-next h2{grid-column:1;font-size:18px}.cargo-next ol{grid-column:2;grid-row:1/4;grid-template-columns:repeat(3,1fr);gap:8px}.cargo-next li{flex-direction:column;text-align:center;border:0;gap:2px;font-size:11px}.cargo-tip{grid-column:1/-1;display:none}.cargo-keys{grid-column:1/-1;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}.cargo-keys>div{gap:8px}.cargo-meters{gap:25px}.cargo-stamp{width:100px;height:100px;font-size:10px}.cargo-stamp b{font-size:12px}}
@media(max-width:550px){.cargo-intro{margin:0 0 18px}.cargo-intro .back-link{font-size:12px;margin-bottom:12px}.cargo-intro h1{font-size:35px}.cargo-intro p{font-size:13px}.cargo-stamp{display:none}.cargo-workspace{padding:12px;grid-template-columns:1fr;gap:12px;border-radius:12px}.cargo-dashboard{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px;padding:0}.cargo-dashboard>.eyebrow,.cargo-progress,.cargo-record,.cargo-mode{display:none}.cargo-score{margin:0}.cargo-score strong{font-size:26px}.cargo-score>span{font-size:10px}.cargo-meters{margin:0;justify-content:flex-end;gap:20px}.cargo-meters b{font-size:22px}.cargo-meters span{font-size:10px}.cargo-buttons{grid-column:1/-1;grid-template-columns:1fr 1fr}.cargo-buttons button{min-height:32px;padding:5px 10px}.cargo-stage{width:100%;max-width:min(330px,calc((100svh - 255px)*.6667));min-width:190px;margin:auto}.cargo-parking{display:none}.cargo-car{padding:4px 9px 0;border-radius:35px 35px 20px 20px}.cargo-hatch{height:18px}.cargo-hatch i{height:14px}.cargo-trunk{border-width:4px;border-radius:15px 15px 6px 6px}.cargo-bumper{height:25px;font-size:6px}.cargo-touch{margin-top:9px;gap:4px}.cargo-touch button{min-height:40px;min-width:34px;padding:5px 8px}.cargo-next{grid-template-columns:1fr;display:block}.cargo-next>.eyebrow{display:none}.cargo-next h2{font-size:14px;margin:0 0 5px}.cargo-next ol{display:flex;justify-content:space-between}.cargo-next li{flex:1;min-height:0;font-size:10px}.cargo-next canvas{width:45px;height:40px}.cargo-next li>span,.cargo-keys{display:none}.cargo-overlay{padding:13px;gap:7px}.cargo-overlay p{font-size:11px}.cargo-overlay h2{font-size:26px}.cargo-start{font-size:13px;padding:10px 16px}.cargo-overlay #cargo-final{font-size:11px}.cargo-overlay #cargo-final strong{font-size:26px}.cargo-status{margin:12px 0 22px;font-size:11px}.cargo-results{grid-template-columns:1fr;gap:15px;margin:25px 0}.cargo-results h2{font-size:26px}}
@media(prefers-reduced-motion:reduce){.cargo-combo{transition:none}}
@media(max-width:550px){.cargo-stage{max-width:min(330px,calc((100svh - 400px)*.6667))}.cargo-intro .eyebrow{display:none}.cargo-intro h1{font-size:32px;margin:3px 0}.cargo-intro .back-link{margin-bottom:6px}.cargo-intro p{font-size:12px}}
@media(max-width:550px) and (max-height:700px){.cargo-intro h1,.cargo-intro p{display:none}.cargo-intro{margin-bottom:8px}.cargo-intro .back-link{margin:0}}
@media(min-width:551px) and (max-width:850px){.cargo-stage{max-width:min(350px,calc((100svh - 390px)*.6667));width:100%;margin:auto}}
.cargo-overlay #cargo-final small{display:block;margin-top:5px}
@media(max-width:550px){.cargo-overlay.cargo-over .eyebrow,.cargo-overlay.cargo-over #cargo-overlay-copy{display:none}}
.cargo-help-dialog{width:min(820px,calc(100vw - 32px));max-width:none;max-height:90dvh;padding:0;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--ink);box-shadow:0 20px 80px #14282b55;overflow:hidden}
.cargo-help-dialog[open]{display:flex;flex-direction:column}
.cargo-help-dialog::backdrop{background:#10272bb8}
.cargo-help-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px;border-bottom:1px solid var(--line);flex:none}
.cargo-help-heading h2{font-size:clamp(20px,3vw,28px);line-height:1.2;margin:6px 0 0;letter-spacing:-.04em}
.cargo-help-heading .eyebrow{font-size:10px}
.cargo-help-heading form{margin:0;flex:none}
.cargo-help-heading button{min-height:42px;padding:8px 12px;border:1px solid var(--line);border-radius:7px;background:var(--surface-alt);color:var(--ink);font:inherit;font-size:12px;cursor:pointer;white-space:nowrap}
.cargo-help-heading button span{font-size:18px;margin-left:8px}
.cargo-help-content{padding:20px 24px 24px;overflow-y:auto;overscroll-behavior:contain;min-height:0}
.cargo-help-content>p{font-size:13px;line-height:1.6;margin:0 0 12px;color:var(--muted)}
.cargo-help-content .cargo-help-note{padding:12px 14px;background:var(--surface-alt);border-left:3px solid var(--cargo-yellow);border-radius:4px;margin-bottom:22px}
.cargo-help-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cargo-help-item{display:flex;gap:14px;align-items:center;padding:16px 12px;border:1px solid var(--line);border-radius:10px;min-width:0}
.cargo-help-item>div:last-child{min-width:0}
.cargo-help-figure{display:grid;place-items:center;width:84px;height:84px;flex:none;border-radius:9px;background:var(--surface-alt)}
.cargo-help-figure canvas{width:80px;height:auto;display:block}
.cargo-help-meta{font-size:10px;color:var(--muted)}
.cargo-help-item h3{font-size:15px;margin:5px 0 6px;line-height:1.2}
.cargo-help-item p{font-size:12px;color:var(--muted);line-height:1.5;margin:0}
@media(max-width:550px){.cargo-buttons{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.cargo-buttons button{padding:5px 8px;align-items:center}.cargo-help-heading{padding:16px;gap:12px}.cargo-help-heading h2{font-size:20px}.cargo-help-heading .eyebrow{display:none}.cargo-help-heading button{padding:8px}.cargo-help-content{padding:16px}.cargo-help-items{grid-template-columns:1fr}.cargo-help-item{gap:12px}}

/* Compact play layout. */

.cargo-workspace{padding:16px;gap:24px;grid-template-columns:minmax(170px,1fr) minmax(220px,calc((100svh - 310px)*.6667)) minmax(170px,1fr);justify-content:center}.cargo-stage{max-width:390px;width:100%;margin:auto}.cargo-dashboard,.cargo-next{padding-top:4px}.cargo-score{margin-top:12px}.cargo-meters{margin:14px 0}.cargo-mode{font-size:11px;margin:12px 0}.cargo-keys{font-size:11px}.cargo-results{margin:12px 0;padding:16px}.cargo-status{margin:8px 0}
@media(min-width:551px) and (max-width:850px){.cargo-workspace{grid-template-columns:145px minmax(220px,1fr);gap:16px}.cargo-stage{max-width:min(350px,calc((100svh - 300px)*.6667))}}
@media(max-width:550px){.cargo-workspace{grid-template-columns:1fr;padding:10px;gap:8px}.cargo-stage{max-width:min(330px,calc((100svh - 330px)*.6667))}.cargo-score,.cargo-meters{margin:0}.cargo-buttons{grid-template-columns:1fr 1fr}.cargo-next h2{font-size:12px}.cargo-next ol{margin:4px 0}.cargo-next canvas{height:32px}.cargo-next li{gap:2px}.cargo-game-foot{font-size:10px}}
.cargo-mode-tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin:0 0 20px;padding-bottom:12px}.cargo-mode-tabs a{padding:9px 16px;text-decoration:none;color:var(--muted);font-size:13px;border-radius:6px}.cargo-mode-tabs a[aria-current]{background:var(--ink);color:var(--surface)}.cargo-mode-tabs span{font-size:10px;opacity:.7;margin-left:8px}.cargo-trunk canvas{aspect-ratio:3/5}.cargo-versus-room{display:flex;align-items:center;justify-content:space-between;gap:14px 30px;flex-wrap:wrap;margin-bottom:22px;padding:18px 0;border-bottom:1px solid var(--line)}.cargo-versus-room p{font-size:13px;margin:8px 0 0}.cargo-versus-room .eyebrow{font-size:10px}.cargo-versus-actions{display:flex;gap:8px;flex-wrap:wrap}.cargo-versus-actions .button{font-size:12px}.cargo-versus-invitation{display:flex;align-items:center;gap:10px;flex-basis:100%;font-size:12px}.cargo-versus-invitation input{flex:1;min-width:180px;background:var(--surface);border:1px solid var(--line);border-radius:5px;padding:9px;color:var(--ink);font:12px var(--body)}.cargo-versus-arena{display:grid;grid-template-columns:180px minmax(300px,390px) 180px;justify-content:center;gap:36px;padding:25px 32px;background:var(--surface);border:1px solid var(--line);border-radius:18px;align-items:start}.cargo-versus .cargo-versus-own{width:100%;max-width:390px;margin:0 auto}.cargo-versus-rail{min-width:0}.cargo-versus-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.cargo-versus-heading .eyebrow,.cargo-versus-score .eyebrow{font-size:10px}.cargo-versus-heading>b{font-size:11px;color:var(--muted)}.cargo-versus-opponents{display:grid;gap:18px}.cargo-versus-opponent{width:100%;min-width:0}.cargo-versus-opponent>strong{font-size:12px;display:block;overflow-wrap:anywhere;margin-bottom:7px}.cargo-versus-opponent canvas{display:block;width:132px;height:220px;margin:0 auto;border:5px solid #35585b;border-radius:8px;box-sizing:content-box}.cargo-versus-opponent p{font-size:11px;color:var(--muted);margin:6px 0}.cargo-versus-opponent[data-alive=false] canvas{filter:saturate(.3);opacity:.65}.cargo-versus-opponent[data-connected=false]>strong:after{content:' · offline';color:var(--muted)}.cargo-versus-rule{font-size:11px;color:var(--muted);line-height:1.7;border-top:1px solid var(--line);padding-top:16px;margin:20px 0}.cargo-versus-rule b{display:block;color:var(--ink);font-size:12px}.cargo-versus-score{padding:0 0 18px;margin-bottom:18px;border-bottom:1px solid var(--line)}.cargo-versus-score>strong{display:block;font:650 38px var(--display);letter-spacing:-.04em;margin:7px 0 12px;font-variant-numeric:tabular-nums}.cargo-versus-score>div:not(.cargo-versus-next){display:flex;gap:24px;font-size:11px;color:var(--muted)}.cargo-versus-score b{font-size:18px;display:block;color:var(--ink)}.cargo-versus-score p{font-size:11px;line-height:1.65;color:var(--muted);margin:10px 0}.cargo-versus-score .cargo-incoming{color:var(--accent-ink);font-weight:700}.cargo-versus-next{display:flex;align-items:center;gap:8px;margin-top:12px}.cargo-versus-next canvas{width:64px;height:58px}.cargo-versus-next .eyebrow{font-size:9px}.cargo-versus-controls{font-size:11px;color:var(--muted);line-height:2;text-align:center;margin:12px 0 0}.cargo-versus-own .cargo-hatch b{font:9px var(--body);color:#f2e6c6;letter-spacing:.08em}.cargo-versus #cargo-online-error{color:var(--danger,#b74c3e)}.cargo-versus [hidden]{display:none!important}@media(min-width:900px) and (max-height:850px){.cargo-versus .cargo-versus-own{max-width:330px}.cargo-versus-arena{grid-template-columns:166px minmax(300px,330px) 166px;padding:20px;gap:30px}.cargo-versus-opponent canvas{width:114px;height:190px}.cargo-versus-room{margin-bottom:14px;padding-top:4px}.cargo-versus-score>strong{font-size:30px}.cargo-versus-controls{font-size:10px}}
/* Keep the complete field above the shared chat on ordinary desktop heights. */
.cargo-versus .game-toolbar{margin-bottom:10px}.cargo-versus .cargo-mode-tabs{margin-bottom:6px;padding-bottom:8px}.cargo-versus-room{padding:10px 0;margin-bottom:12px}.cargo-versus-arena{padding:18px 26px;grid-template-columns:160px minmax(240px,390px) 160px;gap:30px}.cargo-versus .cargo-versus-own{max-width:clamp(240px,calc((100dvh - 440px)*.6 + 44px),390px)}.cargo-versus-opponent canvas{width:clamp(86px,calc((100dvh - 440px)*.24),132px);height:auto;aspect-ratio:3/5}.cargo-versus-heading{margin-bottom:8px}.cargo-versus-opponents{gap:12px}.cargo-versus-score>strong{font-size:30px;margin:4px 0 8px}.cargo-versus-score{padding-bottom:10px;margin-bottom:12px}.cargo-versus-score p{margin:7px 0}.cargo-versus-rule{margin-top:12px;padding-top:10px}
.cargo-versus{position:relative}.cargo-versus>.cargo-mode-tabs{position:absolute;top:23px;left:50%;transform:translateX(-50%);border:0;margin:0;padding:0}.cargo-versus-opponent canvas{width:var(--cargo-opponent-width,110px)}