:root{--ink:#183a38;--muted:#72827c;--paper:#fcf8f0;--teal:#225b50;--line:#e5e8dc;--orange:#ed835b}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,'Malgun Gothic',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;background:none;color:inherit;border-radius:10px;padding:10px 14px}button:focus-visible,a:focus-visible{outline:3px solid #ea754c;outline-offset:3px}button:disabled{opacity:.4;cursor:default}header{max-width:1180px;margin:auto;padding:28px 32px;display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:3px;font-size:23px;font-weight:900;color:var(--ink);text-decoration:none;letter-spacing:-1px}.logo>span:first-child{background:var(--teal);color:#fff;padding:5px 9px;border-radius:10px;margin-right:8px;letter-spacing:0}.logo .light{font-weight:400}.top-actions{display:flex;gap:5px}.top-actions button{background:#f0f0e5;font-size:12px;font-weight:bold}main{max-width:1120px;margin:auto;padding:0 24px}.intro{text-align:center;margin:22px 0 26px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--teal)}h1{font-size:clamp(28px,4.5vw,45px);letter-spacing:-2px;margin:12px 0} .intro p{font-size:15px;color:var(--muted)}.modebar{display:flex;align-items:center;gap:8px;margin:0 0 18px}.modebar button{font-size:13px}.modebar .active{background:var(--teal);color:#fff}.modebar #levels{margin-left:auto;text-decoration:underline;text-underline-offset:4px}.game{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px}.loading-area{background:#edf0e5;border:1px solid #e4e7da;border-radius:24px;padding:26px 28px 20px;min-width:0}.level-line{display:flex;align-items:center;justify-content:space-between}.level-line h2{font-size:21px;margin:7px 0}.counter{text-align:right}.counter span{font-size:23px;font-weight:bold}.counter small{display:block;font-size:11px;color:var(--muted);margin-top:3px}.truck{position:relative;margin:22px 0 38px;padding-left:70px;filter:drop-shadow(0 12px 8px #20382a12)}.cargo{padding:12px;background:#3e6c5d;border:4px solid #294d43;border-radius:10px 12px 7px 7px;position:relative;z-index:1}.board{display:grid;gap:3px;background:#264b40;padding:4px;border-radius:5px;touch-action:manipulation}.cell{padding:0;aspect-ratio:1;border-radius:4px;background:#cfdbc5;min-width:0;position:relative;transition:background .12s,transform .12s;border:1px solid #bdccb2;font-size:clamp(11px,1.4vw,17px);font-weight:bold}.cell.occupied{background:var(--piece);border:2px solid #fff5;box-shadow:inset 0 -3px 0 #00000013;color:#263c39}.cell.ghost{background:#fff6b0;outline:2px dashed #e4b92b;outline-offset:-3px}.cell.preview{background:#e5f3b3}.cab{position:absolute;left:0;bottom:0;width:82px;height:115px;background:#ed9768;border:4px solid #bd6c43;border-radius:30px 2px 5px 12px;z-index:2}.cab-window{display:block;width:45px;height:38px;background:#b6d3d0;border:4px solid #315c55;border-radius:16px 3px 3px 3px;position:absolute;top:10px;left:9px}.cab-logo{position:absolute;bottom:18px;left:14px;font-size:17px;font-weight:900;color:#76452e}.headlight{width:9px;height:15px;background:#ffe7a1;position:absolute;left:-4px;bottom:10px;border-radius:3px}.wheel{position:absolute;bottom:-18px;width:36px;height:36px;border:8px solid #243e37;background:#a8b3a3;border-radius:50%;z-index:3}.wheel.one{left:22px}.wheel.two{right:35px}.instruction{font-size:14px;min-height:42px;line-height:1.6;margin:0 0 14px}.tools{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}.tools button{background:#fff9;font-size:12px;border:1px solid #d9dfd0}.stats{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#667767;border-top:1px solid #d7dfcf;margin-top:20px;padding-top:14px}.parcel-area{border:1px solid #e5e7dc;border-radius:24px;background:#fffdf9;padding:22px;display:flex;flex-direction:column}.parcel-heading{display:flex;justify-content:space-between;align-items:center}.parcel-heading h2{font-size:18px;margin:0}.parcel-heading span{color:var(--muted);font-size:12px}.parcel-area>p{font-size:12px;color:#738277;line-height:1.7}.tray{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:6px 0 18px;align-content:start;flex:1}.parcel{position:relative;min-height:84px;border:1px solid #e6e7df;border-radius:12px;padding:14px 8px 8px;background:#f9f8f2;display:flex;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s}.parcel.selected{outline:2px solid var(--teal);background:#edf3e9;transform:translateY(-2px);box-shadow:0 5px 0 #245d5015}.parcel .tag{position:absolute;left:7px;top:5px;font-size:10px;font-weight:bold;color:#667467}.parcel svg{height:53px;max-width:100%;width:auto;overflow:visible}.parcel.done{opacity:.3;background:#eff1ea}.rotate{background:var(--teal);color:white;font-size:13px;width:100%;padding:13px 8px}kbd{font-size:10px;border:1px solid #fff7;border-radius:4px;padding:2px 4px;margin-left:6px}.selection{font-size:12px;text-align:center;color:var(--muted);margin-top:12px}.tip{padding-top:10px;border-top:1px dashed var(--line)}.bottom-note{display:flex;justify-content:space-between;align-items:center;margin:18px 0;color:var(--muted);font-size:12px}.bottom-note button{font-size:12px;color:var(--teal)}footer{max-width:1120px;margin:20px auto;padding:20px 24px;display:flex;justify-content:space-between;font-size:11px;color:#79857d;border-top:1px solid var(--line)}footer button{font-size:11px;padding:0}dialog{border:0;border-radius:25px;background:var(--paper);color:var(--ink);padding:38px;max-width:480px;width:calc(100% - 32px);box-shadow:0 24px 100px #173c3844}dialog::backdrop{background:#133b3655;backdrop-filter:blur(4px)}dialog h2{font-size:28px;margin:10px 0 16px}dialog p{line-height:1.8;font-size:14px}dialog .close{position:absolute;right:12px;top:8px;font-size:24px}.primary{display:block;background:var(--teal);color:#fff;width:100%;margin-top:18px;padding:14px}.win-icon{font-size:44px}.level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.level-grid button{background:#e6ecdf;padding:18px 8px}.level-grid .cleared{background:#d9e8c2}.result-stats{background:#edf0e5;padding:15px;border-radius:12px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#193f37;color:#fff;padding:12px 20px;border-radius:12px;max-width:90vw;font-size:13px;z-index:5;opacity:0;pointer-events:none;transition:opacity .2}#toast.show{opacity:1}.error{color:#ad482f}.pulse{animation:pulse .3s}@keyframes pulse{50%{transform:scale(.97)}}@media(max-width:740px){header{padding:18px 20px}main{padding:0 14px}.intro{margin:12px 0 20px}.game{grid-template-columns:1fr;gap:12px}.loading-area{padding:18px 16px}.parcel-area{padding:17px}.tray{grid-template-columns:repeat(4,1fr);margin-bottom:12px}.parcel{min-height:72px}.parcel svg{height:44px}.parcel-area .tip{display:none}.truck{max-width:470px;margin:18px auto 35px;padding-left:58px}.cab{width:69px;height:100px}.cab-window{width:40px;left:6px}.wheel.one{left:16px}.stats{margin-top:14px}.bottom-note{align-items:flex-start}.bottom-note span{max-width:55%;line-height:1.7}.intro p{font-size:13px}dialog{padding:30px 24px}}@media(min-width:741px) and (max-height:650px){header{padding:12px 24px}.intro{margin:0 0 12px}.intro h1{font-size:26px;margin:6px}.intro p{margin:6px}.game{grid-template-columns:minmax(0,1fr) 280px;max-width:850px;margin:auto}.loading-area{padding:12px 20px}.truck{max-width:330px;margin:10px auto 28px}.level-line h2{font-size:16px}.instruction{min-height:20px;margin:0}.stats{margin-top:10px;padding-top:8px}.parcel{min-height:65px}.parcel svg{height:40px}.parcel-area{padding:14px}.bottom-note,footer{margin:7px auto}.modebar{margin-bottom:10px}.cab{height:90px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

@media(max-width:740px){header{padding:12px 16px}.intro{margin:6px 0 12px}.intro h1{font-size:28px;margin:7px 0}.intro p{font-size:12px;margin:7px 0}.eyebrow{font-size:9px}.modebar{margin-bottom:10px;gap:3px}.modebar button{font-size:12px;padding:9px}.loading-area{padding:12px}.level-line h2{font-size:17px}.truck{max-width:340px;padding-left:44px;margin:12px auto 28px}.cargo{padding:6px;border-width:3px}.cab{width:52px;height:77px;border-width:3px;border-radius:20px 2px 3px 7px}.cab-window{width:29px;height:26px;left:6px;top:7px;border-width:3px}.cab-logo{font-size:12px;left:9px;bottom:13px}.wheel{width:27px;height:27px;border-width:6px;bottom:-13px}.wheel.one{left:13px}.instruction{font-size:12px;min-height:20px;margin-bottom:7px}.stats{margin-top:9px;padding-top:8px}.parcel-area{padding:10px;position:sticky;bottom:6px;z-index:4;box-shadow:0 4px 24px #183a3818}.parcel-heading h2{font-size:14px}.parcel-area>p,.selection{display:none}.tray{grid-template-columns:repeat(6,1fr);gap:5px;margin:7px 0}.parcel{min-height:50px;padding:10px 4px 4px}.parcel svg{height:32px}.rotate{padding:9px}.bottom-note{font-size:10px}.game{gap:8px}}

@media(max-width:740px){.intro .eyebrow,.intro p{display:none}.intro{margin:4px 0 10px}.intro h1{font-size:24px}.top-actions button{padding:8px;white-space:nowrap}.truck{max-width:290px}.counter span{font-size:19px}.level-line .eyebrow{font-size:9px}.stats{font-size:10px}}

@media(min-width:741px){header{padding-top:16px;padding-bottom:16px}.intro{margin:8px 0 16px}.intro h1{font-size:34px;margin:8px 0}.intro p{margin:6px 0}.truck{max-width:410px;margin:15px auto 32px}.loading-area{padding:18px 24px}.tray{flex:0}.parcel-area{justify-content:flex-start}.parcel-area .rotate{margin-top:auto}}

@media(min-width:741px) and (max-height:850px){header{padding:8px 24px}.intro{margin:3px 0 9px}.intro h1{font-size:27px;margin:5px 0}.intro p,.intro .eyebrow{display:none}.modebar{margin-bottom:10px}.loading-area{padding:13px 20px}.truck{max-width:320px;margin:12px auto 27px}.cargo{padding:8px}.instruction{min-height:20px;margin-bottom:7px;font-size:12px}.stats{margin-top:10px;padding-top:8px}.parcel{min-height:62px;padding:11px 6px 5px}.parcel svg{height:42px}.parcel-area{padding:16px}.bottom-note{margin:10px 0}.level-line h2{font-size:18px}}

/* Keep the full puzzle and controls visible in short portal frames. */
@media(min-width:560px) and (max-height:500px){
header{padding:5px 18px}.logo{font-size:17px}.logo>span:first-child{padding:2px 6px}.top-actions button{padding:5px 9px}main{padding:0 12px}.intro{display:none}.modebar{margin:0 0 5px}.modebar button{padding:5px 9px;font-size:11px}.game{grid-template-columns:minmax(0,1fr) 240px;gap:10px;max-width:820px;margin:auto}.loading-area{padding:8px 12px}.level-line h2{font-size:14px;margin:2px 0}.level-line .eyebrow{display:none}.counter span{font-size:16px}.counter small{display:none}.truck{max-width:min(250px,calc(100vh - 180px));padding-left:32px;margin:5px auto 16px}.cargo{padding:4px;border-width:2px}.cab{width:40px;height:58px;border-width:2px;border-radius:13px 2px 3px 5px}.cab-window{width:22px;height:20px;left:5px;top:5px;border-width:2px}.cab-logo{font-size:9px;left:7px;bottom:9px}.wheel{width:20px;height:20px;border-width:4px;bottom:-9px}.wheel.one{left:9px}.instruction{font-size:11px;line-height:1.3;min-height:15px;margin:0 0 4px}.tools button{padding:6px 8px;font-size:11px}.stats{margin-top:5px;padding-top:5px;font-size:10px}.parcel-area{padding:9px;position:static;box-shadow:none;gap:0}.parcel-heading h2{font-size:13px}.parcel-area>p,.selection,.tip{display:none}.tray{grid-template-columns:repeat(3,1fr);gap:5px;margin:7px 0;flex:1}.parcel{min-height:48px;padding:10px 4px 4px}.parcel svg{height:32px}.rotate{padding:7px;font-size:11px}.bottom-note{margin:4px 0;font-size:10px}.bottom-note button{padding:4px;font-size:10px}footer{display:none}}