/* ShipUniverse Fun Zone · Container Blast V1 — shipping yard arcade */
#sufz-app .sufz-blast {--blast-ink:#e8f8ff;--blast-muted:#9dc7dc;--blast-teal:#5dedc9;--blast-yellow:#ffdb83; color:var(--blast-ink);font-size:15px;max-width:100%;}
#sufz-app .sufz-blast *,#sufz-app .sufz-blast *:before,#sufz-app .sufz-blast *:after{box-sizing:border-box}
#sufz-app .sufz-blast button{cursor:pointer;font:inherit}
#sufz-app .sufz-blast button:focus-visible{outline:3px solid #ffe28d;outline-offset:3px}
#sufz-app .sufz-blast-scorebar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 12px}
#sufz-app .sufz-blast-score-item{background:linear-gradient(145deg,rgba(21,69,103,.94),rgba(7,37,65,.94));padding:11px 13px;border-radius:11px;min-width:0;display:flex;flex-direction:column;gap:3px;border:1px solid rgba(133,199,235,.16)}
#sufz-app .sufz-blast-score-item small{color:#9bc6db;font-weight:850;font-size:10px;letter-spacing:.09em;white-space:nowrap}
#sufz-app .sufz-blast-score-item strong{font-size:clamp(20px,2.2vw,28px);line-height:1.12;color:#fff;letter-spacing:-.045em;font-weight:950;font-variant-numeric:tabular-nums}
#sufz-app .sufz-blast-score-item:first-child strong{color:#ffdc82}
#sufz-app .sufz-blast-score-item:nth-child(2) strong{color:#6bf1d2}
#sufz-app .sufz-blast-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,.78fr);gap:14px;align-items:start}
#sufz-app .sufz-blast-yard{background:linear-gradient(160deg,#124d68,#073452 62%,#082644);padding:12px;border-radius:14px;border:1px solid rgba(119,194,217,.19);min-width:0}
#sufz-app .sufz-blast-yard-head{display:flex;justify-content:space-between;align-items:center;gap:7px;letter-spacing:.065em;font-size:10px;font-weight:850;color:#b9eaff;margin-bottom:10px}
#sufz-app .sufz-blast-occupancy{color:#ffe49c;font-size:10px;font-variant-numeric:tabular-nums}
#sufz-app .sufz-blast-live{display:inline-block;width:7px;height:7px;background:#4ff1bc;box-shadow:0 0 10px #41f1c7;border-radius:50%;margin-right:5px}
#sufz-app .sufz-blast-grid-shell{position:relative;width:min(100%,540px);margin:0 auto;padding:6px;background:linear-gradient(160deg,#0a2845,#071a35);border-radius:11px;box-shadow:0 6px 26px #00142b70;border:1px solid rgba(140,221,247,.24)}
#sufz-app .sufz-blast-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;width:100%;aspect-ratio:1/1;touch-action:pan-y;user-select:none}
#sufz-app .sufz-blast-cell{position:relative;min-width:0;aspect-ratio:1;background:linear-gradient(135deg,rgba(27,77,103,.75),rgba(19,57,82,.95));border:1px solid rgba(141,221,245,.11);border-radius:5px;overflow:hidden;transition:background .1s,filter .1s}
#sufz-app .sufz-blast-cell:after{content:'';position:absolute;inset:6px 4px;border-top:1px solid rgba(146,223,246,.09);border-bottom:1px solid rgba(146,223,246,.08)}
#sufz-app .sufz-blast-cell.is-full{border-color:rgba(255,255,255,.27);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 2px 4px #00122d65;background:linear-gradient(140deg,var(--box-light),var(--box-color) 52%,var(--box-dark));}
#sufz-app .sufz-blast-cell.is-full:before{content:'';position:absolute;inset:14% 10%;background:repeating-linear-gradient(90deg,transparent 0 7%,rgba(7,27,50,.25) 8% 11%,transparent 12% 17%);border-left:2px solid rgba(6,24,48,.25);border-right:2px solid rgba(6,24,48,.25);border-radius:1px;}
#sufz-app .sufz-blast-cell.is-full:after{inset:auto 13% 8%;height:12%;border:0;background:rgba(0,23,40,.2);border-radius:1px}
#sufz-app .sufz-blast-cell.is-valid{background:#246a70;box-shadow:inset 0 0 0 2px #8afbe0;filter:brightness(1.24)}
#sufz-app .sufz-blast-cell.is-invalid{background:#893d56;box-shadow:inset 0 0 0 2px #ff9ab6}
#sufz-app .sufz-blast-cell.is-clear{animation:sufz-blast-flash .25s ease-in-out forwards}
@keyframes sufz-blast-flash{0%{filter:brightness(1)}50%{filter:brightness(2.6);background:#fbe6a1}100%{filter:brightness(1.15)}}
#sufz-app .sufz-blast-underboard{display:flex;justify-content:space-between;gap:9px;align-items:center;margin:9px 3px 0;color:#add9e5;font-size:11px;line-height:1.35}
#sufz-app .sufz-blast-underboard>span:first-child{color:#63e5c7;white-space:nowrap;font-weight:850;font-size:10px;letter-spacing:.07em}
#sufz-app .sufz-blast-ops{min-width:0;display:flex;flex-direction:column;gap:12px}
#sufz-app .sufz-blast-voyage{border-radius:13px;background:linear-gradient(140deg,#10294b,#113956);padding:17px;border:1px solid rgba(165,226,247,.16);box-shadow:inset 0 1px rgba(255,255,255,.05)}
#sufz-app .sufz-blast-section-kicker{color:#8bdfe9;font-size:10px;font-weight:900;letter-spacing:.12em}
#sufz-app .sufz-blast-voyage .sufz-blast-section-kicker{display:flex;justify-content:space-between;align-items:center;gap:5px}
#sufz-app .sufz-blast-sailing{font-size:9px;letter-spacing:.045em;padding:3px 7px;border-radius:20px;background:#24beac24;color:#87efdb;border:1px solid #42e6c049}
#sufz-app .sufz-blast-sailing.is-sailing{background:#ffd76325;color:#ffdf8f;border-color:#ffe6a255}
#sufz-app .sufz-blast-vessel{display:flex;align-items:center;gap:11px;margin:13px 0 19px}
#sufz-app .sufz-blast-ship-icon{font-size:38px;filter:drop-shadow(0 3px 3px #0005);transform-origin:center;display:inline-block}
#sufz-app .sufz-blast-ship-icon.is-sailing{animation:sufz-blast-ship .7s ease-in forwards}
@keyframes sufz-blast-ship{0%{transform:translateX(0)}100%{transform:translateX(105px);opacity:0}}
#sufz-app .sufz-blast-vessel strong{font-size:clamp(16px,1.5vw,20px);color:#fff;letter-spacing:-.025em;line-height:1.18;display:block}
#sufz-app .sufz-blast-vessel small{display:block;font-size:10px;color:#99c9e4;font-weight:800;margin-top:5px;letter-spacing:.06em}
#sufz-app .sufz-blast-manifest{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:10px;font-weight:850;color:#add1e5;margin-bottom:8px}
#sufz-app .sufz-blast-manifest strong{font-size:13px;color:#ffdd83;font-variant-numeric:tabular-nums}
#sufz-app .sufz-blast-progress-track{height:10px;border-radius:12px;background:#08223d;overflow:hidden;border:1px solid #34647c}
#sufz-app .sufz-blast-progress-fill{height:100%;width:0%;border-radius:11px;background:linear-gradient(90deg,#43cabb,#a9f17b);transition:width .23s}
#sufz-app .sufz-blast-voyage-foot{display:flex;justify-content:space-between;gap:8px;margin-top:8px;color:#90b9ce;font-size:10px;font-weight:700}
#sufz-app .sufz-blast-tray{padding:15px 13px;border-radius:13px;background:linear-gradient(145deg,#092d4b,#09213e);border:1px solid rgba(140,214,248,.15)}
#sufz-app .sufz-blast-tray-title{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px}
#sufz-app .sufz-blast-tray h3{margin:3px 0 0;font-size:19px;line-height:1.1;color:#fff;letter-spacing:-.03em}
#sufz-app .sufz-blast-rotate{background:#1a4965;color:#d6f6ff;padding:8px 10px;border:1px solid #4c93a1;border-radius:8px;font-size:11px;font-weight:850;white-space:nowrap}
#sufz-app .sufz-blast-rotate:hover:not(:disabled){background:#266783}
#sufz-app .sufz-blast-rotate:disabled{opacity:.36;cursor:not-allowed}
#sufz-app .sufz-blast-pieces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;min-height:121px}
#sufz-app .sufz-blast-piece{position:relative;min-width:0;min-height:118px;padding:7px 4px 7px;background:linear-gradient(145deg,#164866,#092c49);border:1px solid #4a76907a;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:5px;touch-action:none;user-select:none;-webkit-user-select:none}
#sufz-app .sufz-blast-piece.is-selected{background:linear-gradient(145deg,#175b73,#0d405c);border-color:#b3f7d5;box-shadow:0 0 0 2px #6eedc977,0 0 20px #6eedc917}
#sufz-app .sufz-blast-piece.is-spent{opacity:.25;cursor:default;border-style:dashed}
#sufz-app .sufz-blast-piece.is-dragging{opacity:.7}
#sufz-app .sufz-blast-piece strong{font-size:10px;font-weight:900;color:#daf7ff;letter-spacing:.05em}
#sufz-app .sufz-blast-piece small{font-size:9px;color:#a3c5da;font-weight:750}
#sufz-app .sufz-blast-mini-grid{display:grid;grid-template-columns:repeat(var(--mini-cols),minmax(0,1fr));grid-template-rows:repeat(var(--mini-rows),minmax(0,1fr));gap:2px;width:100%;max-width:76px;aspect-ratio:var(--mini-cols) / var(--mini-rows);max-height:65px;align-self:center;pointer-events:none}
#sufz-app .sufz-blast-mini-cell{border-radius:2px;min-width:0;min-height:0}
#sufz-app .sufz-blast-mini-cell.on{border:1px solid #ffffff62;background:linear-gradient(135deg,var(--box-light),var(--box-color));box-shadow:inset 0 1px #fff5}
#sufz-app .sufz-blast-mini-cell.off{background:transparent}
#sufz-app .sufz-blast-tray-help{font-size:11px;color:#a6cada;margin:10px 0 0;line-height:1.45}
#sufz-app .sufz-blast-ops-foot{padding:0 3px}
#sufz-app .sufz-blast-cargo-legend{display:flex;flex-wrap:wrap;gap:6px 11px;font-size:10px;font-weight:750;color:#add2e7;margin-bottom:11px}
#sufz-app .sufz-blast-cargo-legend span{white-space:nowrap}
#sufz-app .sufz-blast-cargo-legend i{display:inline-block;background:var(--cargo);width:8px;height:8px;border-radius:2px;margin-right:4px}
#sufz-app .sufz-blast-actions{display:flex;gap:7px;flex-wrap:wrap}
#sufz-app .sufz-blast-actions button{padding:9px 12px;border:1px solid #5b8fb185;border-radius:8px;background:#163c5a;font-size:11px;font-weight:800;color:#d9f4ff}
#sufz-app .sufz-blast-actions button:hover{background:#245b79}
#sufz-app .sufz-blast-bottom{display:flex;align-items:center;justify-content:space-between;gap:9px;margin:11px 2px 0;min-height:28px}
#sufz-app .sufz-blast-message{font-size:12px;color:#aee9d9;font-weight:750;line-height:1.4}
#sufz-app .sufz-blast-time{white-space:nowrap;color:#92bed0;font-weight:850;font-variant-numeric:tabular-nums;font-size:10px;letter-spacing:.08em}
#sufz-app .sufz-blast-gate{position:absolute;z-index:4;inset:6px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:12px;padding:22px 17px;background:radial-gradient(ellipse at 55% 28%,rgba(22,93,116,.97),rgba(4,24,52,.98) 75%);border-radius:9px}
#sufz-app .sufz-blast-gate[hidden]{display:none!important}
#sufz-app .sufz-blast-gate-kicker{font-size:12px;font-weight:900;color:#90eddc;letter-spacing:.22em}
#sufz-app .sufz-blast-gate h2{font-size:clamp(26px,4.2vw,49px);margin:0;line-height:1;color:#fff;letter-spacing:-.075em;font-weight:1000;text-shadow:0 5px 10px #00112266}
#sufz-app .sufz-blast-gate h2 em{font-style:normal;color:#ffdb73}
#sufz-app .sufz-blast-gate p{color:#d7eafa;max-width:350px;font-size:14px;line-height:1.55;margin:0}
#sufz-app .sufz-blast-gate-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:7px}
#sufz-app .sufz-blast-gate-pills span{font-size:9px;font-weight:850;letter-spacing:.035em;border:1px solid #ffffff36;border-radius:30px;background:#ffffff10;padding:7px 10px;color:#baf4eb}
#sufz-app .sufz-blast-start{background:linear-gradient(115deg,#ffe38e,#ffaf61);border:0;border-radius:10px;padding:13px 28px;color:#092f45;font-weight:1000;font-size:14px;letter-spacing:.07em;box-shadow:0 6px 0 #b97338,0 12px 25px #0006}
#sufz-app .sufz-blast-start:hover{filter:brightness(1.06)}
#sufz-app .sufz-blast-start span{padding-left:6px;font-size:20px}
#sufz-app .sufz-blast-gate small{color:#afd8e6;font-size:11px}
#sufz-app .sufz-blast-drag-ghost{position:fixed;z-index:999999;display:grid;grid-template-columns:repeat(var(--mini-cols),var(--ghost-cell));grid-template-rows:repeat(var(--mini-rows),var(--ghost-cell));gap:3px;pointer-events:none;filter:drop-shadow(0 8px 12px #00182be0);opacity:.92}
#sufz-app .sufz-blast-drag-ghost .sufz-blast-mini-cell{min-width:0;min-height:0}
#sufz-app .sufz-blast-burst{animation:sufz-blast-win .5s ease-out}
@keyframes sufz-blast-win{0%{filter:brightness(1)}30%{filter:brightness(1.7)}100%{filter:brightness(1)}}
#sufz-app .sufz-blast.is-ended .sufz-blast-grid{filter:saturate(.65)}
@media(max-width:1140px){#sufz-app .sufz-blast-layout{grid-template-columns:minmax(0,1fr) minmax(220px,.75fr);gap:10px}#sufz-app .sufz-blast-tray{padding:12px 9px}#sufz-app .sufz-blast-voyage{padding:13px}}
@media(max-width:940px){#sufz-app .sufz-blast-layout{grid-template-columns:1fr}#sufz-app .sufz-blast-yard{max-width:600px;width:100%;margin:auto}#sufz-app .sufz-blast-ops{display:grid;grid-template-columns:1fr 1fr;align-items:start}#sufz-app .sufz-blast-ops-foot{grid-column:1/-1}}
@media(max-width:600px){
 #sufz-app .sufz-blast{font-size:13px}
 #sufz-app .sufz-blast-scorebar{gap:5px;margin-bottom:9px}
 #sufz-app .sufz-blast-score-item{padding:9px 5px 8px;border-radius:7px}
 #sufz-app .sufz-blast-score-item small{font-size:8px;letter-spacing:.025em}
 #sufz-app .sufz-blast-score-item strong{font-size:19px}
 #sufz-app .sufz-blast-yard{padding:7px}
 #sufz-app .sufz-blast-grid{gap:2px}
 #sufz-app .sufz-blast-grid-shell{padding:3px}
 #sufz-app .sufz-blast-cell{border-radius:3px}
 #sufz-app .sufz-blast-ops{grid-template-columns:1fr;gap:9px}
 #sufz-app .sufz-blast-tray{order:-1}
 #sufz-app .sufz-blast-tray h3{font-size:17px}
 #sufz-app .sufz-blast-pieces{min-height:93px}
 #sufz-app .sufz-blast-piece{min-height:90px}
 #sufz-app .sufz-blast-mini-grid{max-height:44px;max-width:52px}
 #sufz-app .sufz-blast-tray-help{font-size:10px}
 #sufz-app .sufz-blast-voyage{padding:12px}
 #sufz-app .sufz-blast-vessel{margin:8px 0 12px}
 #sufz-app .sufz-blast-underboard{font-size:10px}
 #sufz-app .sufz-blast-gate{gap:8px;padding:8px}
 #sufz-app .sufz-blast-gate-kicker{font-size:10px}
 #sufz-app .sufz-blast-gate h2{font-size:clamp(21px,7vw,33px)}
 #sufz-app .sufz-blast-gate p{font-size:11px;line-height:1.3}
 #sufz-app .sufz-blast-gate-pills span{font-size:8px;padding:4px}
 #sufz-app .sufz-blast-start{padding:9px 14px;font-size:12px}
 #sufz-app .sufz-blast-gate small{font-size:9px}
}
/* On phones, incoming cargo sits directly above the yard to avoid scrolling back and forth. */
@media(max-width:600px){
  #sufz-app .sufz-blast-ops{display:contents}
  #sufz-app .sufz-blast-tray{order:-1}
  #sufz-app .sufz-blast-yard{order:0}
  #sufz-app .sufz-blast-voyage{order:1}
  #sufz-app .sufz-blast-ops-foot{order:2}
}
