:root{color-scheme:dark;--bg:#0b1121;--panel:#17223a;--edge:#334463;--cyan:#51eadf;--orange:#ffad52;--white:#f5f8ff;--muted:#9badc6;--pink:#ff648a;--radius:15px}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:var(--white)}button{font:inherit;cursor:pointer;color:inherit;border:0;touch-action:manipulation}button:focus-visible{outline:3px solid #fff;outline-offset:1px}button:disabled{opacity:.5;cursor:default}h1,h2,p{margin:0}strong,b{font-weight:900}.app{height:100dvh;min-height:0;max-width:1500px;margin:auto;display:flex;flex-direction:column;background:radial-gradient(ellipse at 40% -18%,#25395d 0%,#0a1122 58%)}.top{display:flex;justify-content:space-between;align-items:center;height:47px;min-height:47px;padding:5px 15px;border-bottom:1px solid #334865;background:#0b1428}.brand{display:flex;align-items:center;gap:7px;font-size:13px;letter-spacing:1.1px;font-weight:900;white-space:nowrap}.brand b{color:var(--cyan)}.logomark{display:grid;place-items:center;width:27px;height:27px;border:2px solid var(--cyan);border-radius:7px;color:var(--cyan);font-size:20px;line-height:1}.topright{display:flex;gap:12px;align-items:center;font-size:11px;color:var(--muted);font-weight:800}main{flex:1;min-height:0;position:relative}footer{height:22px;min-height:22px;display:flex;align-items:center;justify-content:center;border-top:1px solid #23314a;color:#7f91b1;letter-spacing:1.2px;font-weight:800;font-size:9px}button.primary{background:linear-gradient(125deg,#ffb957,#ff7a53);color:#1c172a;box-shadow:0 5px 0 #8b4a3b;font-weight:1000}button.primary:hover{filter:brightness(1.08)}button.secondary{background:#254b67;color:#dff8ff;border:1px solid #47768d;font-weight:900}button.subtle{background:#2b344b;color:#c4d2e5;border:1px solid #46546a;font-weight:800}.small,.tiny{padding:5px 10px;border-radius:8px;background:#253452;border:1px solid #405777;font-size:12px;font-weight:900}.tiny{font-size:10px;padding:5px}.primary,.secondary,.subtle{border-radius:10px;padding:10px 14px;min-height:38px;white-space:normal}.hidden{display:none!important}.scene{height:100%;min-height:0}.menu{display:grid;grid-template-columns:1fr 1fr;gap:2%;padding:clamp(12px,3vh,30px) clamp(14px,3vw,42px);overflow:auto;align-items:center}.menutext{max-width:670px;position:relative;z-index:2}.eyebrow{color:var(--cyan);font-size:12px;letter-spacing:2px;font-weight:900;margin-bottom:13px}h1{font-size:clamp(34px,4.9vw,79px);line-height:.99;letter-spacing:-2px;font-weight:1000;text-shadow:0 5px 0 #25314a}h1 em{font-style:normal;color:var(--orange)}.pitch{font-size:clamp(13px,1.3vw,20px);line-height:1.35;max-width:525px;color:#d0e0ee;margin:19px 0}.rules{display:grid;gap:9px;font-size:clamp(11px,1vw,15px);font-weight:750;color:#c1d3ec}.rules span{display:flex;gap:9px;align-items:center}.rules b{color:var(--orange);background:#263858;border-radius:6px;padding:4px 6px;font-size:11px}.menubuttons{display:flex;gap:9px;flex-wrap:wrap;margin-top:25px}.menubuttons .big{font-size:17px;letter-spacing:.4px;min-height:50px}.menubuttons .big span{margin-left:12px}.menulinks{display:flex;gap:15px;margin:16px 0 9px;flex-wrap:wrap}.linkbutton{background:transparent;color:var(--cyan);text-decoration:underline;font-size:13px;font-weight:800;padding:0}.mini{color:#b7c8e1;font-size:12px}.hero{position:relative;border-radius:22px;min-width:0;align-self:stretch;min-height:230px;overflow:hidden;border:1px solid #3c617d;box-shadow:0 15px 50px #0008;background:#0a1e33}.hero img{width:100%;height:100%;object-fit:cover;object-position:69% 50%}.hero-sticker{position:absolute;top:15px;right:14px;transform:rotate(5deg);font-size:clamp(12px,2vw,25px);font-weight:1000;padding:8px 13px;background:var(--pink);color:white;box-shadow:5px 5px 0 #13263d;line-height:1.1}.game{padding:7px 10px;display:flex;flex-direction:column;gap:7px;overflow:hidden}.status{flex:0 0 auto;display:flex;gap:7px;align-items:stretch;max-height:49px}.status-cell{flex:1;min-width:0;background:#182843;border:1px solid #334f73;border-radius:11px;display:flex;flex-direction:column;justify-content:center;padding:4px 8px}.status-cell small{color:#a0b7cc;letter-spacing:.8px;font-size:10px;font-weight:900}.status-cell strong{font-size:clamp(13px,2vw,21px);line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pause{font-size:21px;padding:4px 12px}.game-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(185px,24%) minmax(0,1fr) minmax(190px,23%);gap:8px}.panel{min-width:0;min-height:0;border:1px solid #385473;border-radius:14px;background:linear-gradient(150deg,#192d48,#111d34 70%);padding:10px;overflow:hidden}.panehead{display:flex;justify-content:space-between;gap:5px;align-items:center;color:#cef9fd;font-size:12px;letter-spacing:.8px;font-weight:1000;margin-bottom:8px;white-space:nowrap}.panehead span:last-child{color:#9ab8d1;font-size:11px;letter-spacing:0}.incoming{display:flex;flex-direction:column;gap:7px}.parcel-preview{background:linear-gradient(130deg,#273550,#1e2943);border:1px dashed #5b7690;border-radius:12px;flex:1;min-height:80px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:8px;padding:7px;color:#f6f9ff}.parcel-preview strong{font-size:clamp(16px,2.3vw,28px);line-height:1}.parcel-preview .pr-icon{font-size:clamp(30px,4.5vw,56px)}.parcel-preview small{font-weight:800;color:#afbed3}.incoming-hint,.queue-hint{color:#acbed6;line-height:1.3;font-size:clamp(10px,1vw,13px);text-align:center}.in-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.in-actions button{padding:7px 3px;font-size:11px}.eventBox{margin-top:auto;background:#18394d;border-left:4px solid var(--cyan);color:#bce6e5;border-radius:4px;padding:9px;font-size:11px;line-height:1.3}.shelf{display:flex;flex-direction:column}.shelf-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(var(--rows,4),minmax(0,1fr));gap:5px;padding:8px;border-radius:10px;background:repeating-linear-gradient(0deg,#14263d 0px,#14263d 12px,#1d3148 13px,#1d3148 15px);border:3px solid #38516e;box-shadow:inset 0 -7px 0 #0b192c}.slot{background:#203e53;border:1px dashed #557b86;border-radius:6px;position:relative;min-width:0;min-height:0;padding:0}.slot:hover,.slot:focus-visible{background:#2b6173}.slot:after{content:'+';position:absolute;inset:0;display:grid;place-items:center;color:#80adb5;opacity:.45;font-size:clamp(11px,1.5vw,24px);font-weight:500}.stored{position:relative;min-width:0;min-height:0;border-radius:8px;border:2px solid #ffdb93;background:linear-gradient(135deg,#ffbe69,#cf7e44);display:flex;align-items:center;justify-content:center;flex-direction:column;box-shadow:0 3px 0 #8b4d36;z-index:2;overflow:hidden;color:#271d31;line-height:1.1;padding:2px}.stored[data-cat="1"]{background:linear-gradient(135deg,#f987a1,#b94c91);border-color:#ffa4c4}.stored[data-cat="2"]{background:linear-gradient(135deg,#81f8ed,#3e91ac);border-color:#a1fff0}.stored[data-cat="3"]{background:linear-gradient(135deg,#cfbdff,#7e80ce);border-color:#ece0ff}.stored strong{font-size:clamp(12px,2.1vw,28px);font-weight:1000}.stored small{font-size:clamp(7px,.9vw,12px);font-weight:900}.stored.match{animation:pulseMatch 1.5s infinite;box-shadow:0 0 0 3px #71ffbb,0 0 15px #71ffbbaa}@keyframes pulseMatch{50%{filter:brightness(1.22)}}.shelf-footer{display:flex;justify-content:space-between;gap:6px;align-items:center;margin-top:7px;color:#9fbbd0;font-size:11px;min-height:28px}.shelf-footer .tiny{white-space:nowrap}.shelf-footer .active{background:#bd6473}.queue{display:flex;flex-direction:column;gap:8px}.customer{background:radial-gradient(circle at 50% 0%,#3d4b75,#203453 68%);border-radius:12px;border:1px solid #4a658c;padding:13px 9px;display:flex;flex-direction:column;align-items:center;gap:8px;min-height:0;flex:1;justify-content:center}.customer-caption{font-size:11px;font-weight:1000;color:#b5c4df;letter-spacing:1px}.customer-id{font-size:clamp(32px,5vw,64px);font-weight:1000;color:var(--orange);letter-spacing:2px;line-height:1}.customer-desc{color:#c4d3ed;font-size:11px;font-weight:800}.patience{width:100%;max-width:200px;height:9px;background:#111d36;border-radius:20px;overflow:hidden}.patience>div{width:100%;height:100%;background:linear-gradient(90deg,#ff648a,#ffbf61,#64d9ab);transition:width .15s}.queue-stats{display:flex;justify-content:space-between;color:#c0d6e5;gap:7px;font-size:12px;font-weight:800}.queue-stats b{color:#ffe19c}.reward{background:linear-gradient(110deg,#594382,#544064);border:1px solid #8b6cae;border-radius:10px;padding:8px;font-size:12px;font-weight:950}.endearly{min-height:33px;padding:7px}.game-foot{flex:0 0 auto;display:flex;justify-content:space-between;gap:15px;align-items:center;color:#b1d0e1;min-height:29px;font-size:11px;background:#17263b;border:1px solid #2b445d;border-radius:8px;padding:4px 9px}.game-foot #toast{color:#f4dba9;flex:1}.overlay{position:absolute;inset:0;z-index:8;background:#081323ef;display:grid;place-items:center;padding:12px;overflow:auto}.modal{width:min(95%,540px);max-height:100%;overflow:auto;padding:clamp(12px,2.5vw,28px);border:2px solid #4f6e8b;border-radius:20px;background:linear-gradient(135deg,#253b58,#121e34);box-shadow:0 18px 40px #0009}.modal.wider{width:min(96%,760px)}.modal .eyebrow{margin-bottom:7px}.modal h2{font-size:clamp(21px,3.2vw,42px);color:#ffb76a;line-height:1.08;margin-bottom:12px}.modal p{font-size:13px;line-height:1.4;color:#c4d7e7;margin-bottom:14px}.modalactions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:14px}.modalactions button{font-size:12px}.resultstats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.resultstats span{display:grid;gap:4px;background:#17243c;padding:11px;border-radius:10px;text-align:center;font-size:12px}.resultstats b{font-size:21px;color:#88f5e3}.shop-grid,.achgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;overflow:auto}.shopitem,.achitem{background:#182943;border:1px solid #42617c;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px}.shopitem strong{font-size:14px}.shopitem span,.achitem span{font-size:12px;color:#afc6da}.shopitem button{margin-top:auto}.achitem.done{border-color:#7dbd8d}.helpcontent p{margin-bottom:10px}.helpcontent b{color:var(--orange)}
@media(max-width:820px){.brand{font-size:11px}.topright{font-size:10px}.menu{grid-template-columns:1fr 1fr;padding:15px}.game-body{grid-template-columns:minmax(138px,24%) 1fr minmax(145px,24%);gap:5px}.panel{padding:6px}.panehead{font-size:10px}.game{padding:5px}.parcel-preview .pr-icon{font-size:32px}.customer-id{font-size:36px}.eventBox{font-size:10px}.game-foot{font-size:9px}}
@media(max-width:660px){.top{height:36px;min-height:36px;padding:3px 8px}.brand{font-size:10px}.logomark{width:22px;height:22px;font-size:17px}.topright{gap:5px;font-size:9px}.topright .small{padding:3px 6px}.menu{display:block;overflow:auto;padding:13px}.menutext{max-width:none}.menu h1{font-size:clamp(26px,7.6vw,49px);letter-spacing:-1px}.eyebrow{font-size:10px;margin-bottom:6px}.pitch{font-size:12px;margin:9px 0}.rules{gap:4px;font-size:11px}.rules b{font-size:9px;padding:3px}.menubuttons{margin-top:10px;gap:6px}.menubuttons .big{min-height:38px;font-size:13px}.menulinks{margin:10px 0 5px;gap:13px}.linkbutton,.mini{font-size:10px}.hero{display:none}.game{gap:3px;padding:3px 5px}.status{height:37px;max-height:37px;gap:3px}.status-cell{padding:2px 4px;border-radius:6px}.status-cell small{font-size:7px;letter-spacing:0}.status-cell strong{font-size:12px}.pause{font-size:17px;padding:0 5px}.game-body{grid-template-columns:1fr;grid-template-rows:minmax(68px,19%) minmax(120px,1fr) minmax(105px,28%);gap:4px}.panel{padding:5px;border-radius:8px}.panehead{margin-bottom:3px;font-size:10px;line-height:1}.panehead span:last-child{font-size:9px}.incoming{display:grid;grid-template-columns:minmax(0,1fr) minmax(100px,40%);grid-template-rows:14px 1fr;gap:2px 6px}.incoming .panehead{grid-column:1/-1}.parcel-preview{grid-column:1;grid-row:2;flex-direction:row;gap:6px;min-height:0;padding:2px;border-radius:6px}.parcel-preview .pr-icon{font-size:23px}.parcel-preview strong{font-size:18px}.parcel-preview small{font-size:9px}.incoming-hint,.eventBox{display:none}.in-actions{grid-column:2;grid-row:2;grid-template-columns:1fr 1fr;align-items:stretch;gap:3px}.in-actions button{min-height:0;padding:2px;font-size:9px;line-height:1.1}.shelf-grid{gap:3px;padding:3px;border-width:2px}.stored{border-width:1px;border-radius:5px;box-shadow:none}.stored strong{font-size:clamp(12px,4.4vw,20px)}.stored small{font-size:8px}.shelf-footer{margin-top:2px;min-height:18px;font-size:9px}.shelf-footer button{font-size:9px;padding:2px 4px}.queue{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:14px 1fr auto;gap:3px 6px}.queue .panehead{grid-column:1/-1}.customer{grid-column:1;grid-row:2/4;padding:4px;gap:2px;border-radius:6px}.customer-caption{font-size:9px}.customer-id{font-size:clamp(24px,7vw,38px)}.customer-desc,.queue-hint{font-size:9px}.patience{height:5px}.queue-stats{grid-column:2;grid-row:2;font-size:10px;display:grid;gap:2px;align-content:center}.queue .reward{grid-column:2;grid-row:3;min-height:25px;padding:3px;font-size:9px}.queue .endearly{grid-column:2;grid-row:3;min-height:25px;padding:3px;font-size:9px}.queue .endearly:not(.hidden)+.reward{display:none}.game-foot{padding:3px 5px;min-height:21px;font-size:9px;line-height:1.15}.game-foot>span:last-child{display:none}footer{font-size:7px;height:15px;min-height:15px;letter-spacing:0}.overlay{padding:5px}.modal{border-radius:11px;padding:9px;max-height:100%}.modal h2{font-size:20px;margin-bottom:5px}.modal p{font-size:11px;margin-bottom:6px}.modalactions{gap:5px;margin-top:7px}.modalactions button{font-size:10px;padding:6px;min-height:29px}.shop-grid,.achgrid{gap:5px}.shopitem,.achitem{padding:6px;border-radius:7px;gap:4px}.shopitem strong{font-size:11px}.shopitem span,.achitem span{font-size:10px}.shopitem button{padding:4px;font-size:10px;min-height:25px}}
@media(max-height:510px) and (min-width:661px){.top{height:30px;min-height:30px}.logomark{width:20px;height:20px}.menu{padding:8px 20px;align-items:start}.menu h1{font-size:clamp(24px,4vw,49px)}.pitch{margin:5px 0;font-size:11px}.rules{gap:4px;font-size:10px}.rules b{padding:2px}.menubuttons{margin-top:7px}.menubuttons .big{min-height:35px;font-size:12px}.menulinks{margin:6px 0}.hero{min-height:100px}.game{padding:4px}.status{max-height:32px}.status-cell small{font-size:8px}.status-cell strong{font-size:14px}.panel{padding:5px}.panehead{margin-bottom:4px;font-size:10px}.incoming .incoming-hint,.incoming .eventBox,.queue .queue-hint{display:none}.parcel-preview{gap:2px;min-height:0}.parcel-preview .pr-icon{font-size:24px}.parcel-preview strong{font-size:17px}.in-actions button{font-size:10px;padding:4px}.customer{padding:4px;gap:5px}.customer-id{font-size:31px}.game-foot{min-height:23px;font-size:9px}footer{min-height:15px;height:15px;font-size:7px}.shelf-grid{gap:3px;padding:3px}.shelf-footer{margin-top:3px;min-height:20px}.shop-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.modal{padding:9px}.modal h2{font-size:19px;margin-bottom:5px}.modal p{font-size:11px;margin-bottom:6px}.shopitem{gap:4px;padding:7px}.shopitem strong{font-size:11px}.shopitem span{font-size:10px}.shopitem button{font-size:10px;padding:3px;min-height:25px}.modalactions{margin-top:5px}.modalactions button{font-size:10px;min-height:28px;padding:4px}}
@media(max-height:510px) and (max-width:660px){.top{height:28px;min-height:28px}.game-body{grid-template-columns:1fr;grid-template-rows:minmax(52px,19%) minmax(80px,1fr) minmax(80px,28%)}.status{height:31px;max-height:31px}.incoming .panehead,.queue .panehead{font-size:8px}.customer-id{font-size:23px}.customer-desc,.queue-hint{display:none}.shelf-footer{font-size:8px}.shelf-footer .tiny{font-size:8px}footer{display:none}.menubuttons .big{padding:6px}.menu .pitch{margin:5px 0}}

.panehead span:first-child{flex-shrink:0}.panehead span:last-child{overflow:hidden;text-overflow:ellipsis;max-width:52%;white-space:nowrap}
@media(max-width:660px){.topright #headerProgress{display:none}.menu{position:relative}.menu:before{content:'';position:absolute;bottom:0;left:0;width:100%;height:45%;pointer-events:none;background:linear-gradient(0deg,rgba(11,17,33,.43),#0b1121 95%),url('./cover-art.webp') center 30%/cover no-repeat;opacity:.22}}
@media(max-width:660px) and (max-height:510px){.menu .pitch{display:none}.menu .eyebrow{font-size:9px;margin-bottom:4px}.menu h1{font-size:26px}.menu .rules{gap:2px;font-size:10px}.menu .menubuttons{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:6px}.menu .menubuttons .big{grid-column:1/-1;min-height:30px;padding:3px 8px;font-size:11px}.menu .menubuttons .secondary{min-height:26px;padding:3px;font-size:9px}.menu .menulinks{margin:7px 0 4px;gap:9px}.menu .linkbutton,.menu .mini{font-size:9px}.menu .rules b{padding:2px}.menu .rules span{gap:5px}}
/* Keep close/continue controls visible in iframe even when shop has many items. */
.modal.wider{display:flex;flex-direction:column;overflow:hidden;max-height:100%;}
.modal.wider .shop-grid,.modal.wider .achgrid,.modal.wider .helpcontent{flex:1;min-height:0;overflow-y:auto;align-content:start}
.modal.wider .modalactions{flex:0 0 auto;position:relative;z-index:2}
@media(min-width:801px){.modal.wider .shop-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
