/* Portrait rules from states.html, scoped to new runtime screens. */
#device{--step4:polygon(0 4px,4px 4px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px));
  --step6:polygon(0 6px,6px 6px,6px 0,calc(100% - 6px) 0,calc(100% - 6px) 6px,100% 6px,100% calc(100% - 6px),calc(100% - 6px) calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,6px calc(100% - 6px),0 calc(100% - 6px));
  --step8:polygon(0 8px,8px 8px,8px 0,calc(100% - 8px) 0,calc(100% - 8px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 8px) calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,8px calc(100% - 8px),0 calc(100% - 8px));
  --ice:#a4e8ff;--blue2:#2f86d8;--blue3:#1f63a8;--pxshadow:2px 0 0 var(--ink),-2px 0 0 var(--ink),0 2px 0 var(--ink),0 -2px 0 var(--ink),0 4px 0 var(--ink)}
.runtime-state .pb-back{position:absolute;top:calc(18px + var(--safe-top));left:calc(14px + var(--safe-left));z-index:6;border:0;padding:0;background:none;cursor:pointer}
.runtime-state .pb-back b{display:block;font:700 10px/1 var(--f-pixel);color:#fff;background:var(--ink);padding:9px 10px}
.runtime-state .pcard{position:relative;background:#fff;clip-path:var(--step8);padding:18px 16px 16px;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.runtime-state .pcard .ch{font:22px/1.05 var(--f-display);color:var(--ink);margin:0}
.runtime-state .pcard .ch.red{color:var(--ketchup)}
.runtime-state .pcard .cp{font:700 9px/1.6 var(--f-pixel);color:var(--muted);margin:0}
.runtime-state .btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:50px;border:0;cursor:pointer;font:18px/1 var(--f-display);color:var(--ink);background:var(--gold);box-shadow:inset 0 -6px 0 var(--gold-dark),inset 0 4px 0 var(--gold-light);clip-path:var(--step6);padding:6px 10px 8px;transition:translate .06s steps(1)}
.runtime-state .btn:hover{background:#ffdc5c}
.runtime-state .btn:active{translate:0 3px;box-shadow:inset 0 -2px 0 var(--gold-dark),inset 0 4px 0 var(--gold-light)}
.runtime-state .btn.white{background:var(--blue2);box-shadow:inset 0 -6px 0 var(--blue3),inset 0 4px 0 var(--sky);color:#fff}
.runtime-state .btn.white:hover{background:#348cde}
.runtime-state .btn.white:active{box-shadow:inset 0 -2px var(--blue3),inset 0 3px var(--sky)}
.runtime-state .btn.navy{background:var(--ink);box-shadow:inset 0 -6px 0 #061430;color:#fff;font-size:15px}
.runtime-state .btn.off{background:var(--blue2);box-shadow:inset 0 4px 0 var(--blue3);color:#d4ecff;cursor:default;font-size:15px}
.runtime-state .btn.off:active{translate:none}
.runtime-state .btn .cn{width:14px;height:14px;margin:0}
.runtime-state .btnwrap{width:100%;filter:drop-shadow(3px 0 0 var(--ink)) drop-shadow(-3px 0 0 var(--ink)) drop-shadow(0 3px 0 var(--ink)) drop-shadow(0 -3px 0 var(--ink)) drop-shadow(0 4px 0 var(--ink))}
.runtime-state .pxt{font:700 11px/1 var(--f-pixel);color:#fff;text-shadow:var(--pxshadow)}
.runtime-state .dim{position:absolute;inset:0;z-index:2;background:rgba(11,31,63,.55);pointer-events:none}
.runtime-state.phone .hw{margin:0}
.runtime-state.inhud .hstrip{top:var(--safe-top)}
.runtime-state.inhud .htimer{top:calc(36px + var(--safe-top))!important;left:calc(12px + var(--safe-left))!important}
.runtime-state.inhud .hleft{top:calc(36px + var(--safe-top))!important;right:calc(12px + var(--safe-right))!important}
.runtime-state.set,.runtime-state.load,.runtime-state.lvl,.runtime-state.wait,.runtime-state.buy{--g:16%!important}
.runtime-state.set .dirt,.runtime-state.load .dirt,.runtime-state.lvl .dirt,.runtime-state.wait .dirt,.runtime-state.buy .dirt{height:7%}
.runtime-state.set .stands{width:130%}
.runtime-state.set .hw.st-title{position:absolute;left:0;right:0;top:calc(52px + var(--safe-top));z-index:5;rotate:none}
.runtime-state.set .st-title .hw-px{width:200px!important;filter:none!important;animation:none!important}
.runtime-state.set .rows{position:absolute;top:calc(212px + var(--safe-top));left:calc(14px + var(--safe-left));right:calc(14px + var(--safe-right));z-index:5;display:flex;flex-direction:column;gap:6px}
.runtime-state .row{display:flex;align-items:center;gap:10px;min-height:48px;padding:5px 10px 9px 12px;background:#fff;box-shadow:inset 0 -5px 0 var(--ice);clip-path:var(--step6)}
.runtime-state .row .rl{font:15px/1 var(--f-display);color:var(--ink)}
.runtime-state .row .rs{display:block;margin-top:4px;font:700 9px/1 var(--f-pixel);color:var(--muted)}
.runtime-state .row .rt{display:flex;flex-direction:column;min-width:0}
.runtime-state .row .rr{margin-left:auto;display:flex;align-items:center;gap:8px}
.runtime-state .tog{position:relative;width:62px;height:34px;border:0;cursor:pointer;background:var(--blue2);box-shadow:inset 0 4px 0 var(--blue3);clip-path:var(--step4);font:700 9px/1 var(--f-pixel);color:#fff;text-align:right;padding:0 7px 0 0}
.runtime-state .tog:before{content:"";position:absolute;top:5px;left:5px;width:24px;height:24px;background:#fff;box-shadow:inset 0 -4px 0 var(--ice);clip-path:var(--step4);transition:left .08s steps(2)}
.runtime-state .tog[aria-checked=true]{background:var(--gold);box-shadow:inset 0 -4px 0 var(--gold-dark),inset 0 3px 0 var(--gold-light);color:var(--ink);text-align:left;padding:0 0 0 8px}
.runtime-state .tog[aria-checked=true]:before{left:33px}
.runtime-state .vol{display:flex;gap:3px;align-items:flex-end;filter:drop-shadow(2px 0 0 var(--ink)) drop-shadow(-2px 0 0 var(--ink)) drop-shadow(0 2px 0 var(--ink)) drop-shadow(0 -2px 0 var(--ink))}
.runtime-state .vol button{width:13px;border:0;padding:0;cursor:pointer;background:var(--blue2);box-shadow:inset 0 3px 0 var(--blue3)}
.runtime-state .vol button:nth-child(1){height:14px}
.runtime-state .vol button:nth-child(2){height:18px}
.runtime-state .vol button:nth-child(3){height:22px}
.runtime-state .vol button:nth-child(4){height:26px}
.runtime-state .vol button:nth-child(5){height:30px}
.runtime-state .vol button.on{background:var(--gold);box-shadow:inset 0 -3px 0 var(--gold-dark)}
.runtime-state .row.muted .vol button.on{background:#c9d6e6;box-shadow:inset 0 -3px 0 #9fb3cc}
.runtime-state .seg{display:flex;filter:drop-shadow(2px 0 0 var(--ink)) drop-shadow(-2px 0 0 var(--ink)) drop-shadow(0 2px 0 var(--ink)) drop-shadow(0 -2px 0 var(--ink))}
.runtime-state .seg button{min-width:54px;height:34px;border:0;cursor:pointer;font:700 10px/1 var(--f-pixel);color:#fff;background:var(--blue2);box-shadow:inset 0 4px 0 var(--blue3);padding:0 8px}
.runtime-state .seg button:first-child{clip-path:polygon(0 4px,4px 4px,4px 0,100% 0,100% 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px))}
.runtime-state .seg button:last-child{clip-path:polygon(0 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,0 100%)}
.runtime-state .seg button[aria-pressed=true]{background:var(--gold);box-shadow:inset 0 -4px 0 var(--gold-dark),inset 0 3px 0 var(--gold-light);color:var(--ink)}
.runtime-state .rows[hidden]{display:none}
.runtime-state.set .tabs{position:absolute;top:calc(156px + var(--safe-top));left:calc(14px + var(--safe-left));right:calc(14px + var(--safe-right));z-index:5;display:flex;filter:drop-shadow(3px 0 0 var(--ink)) drop-shadow(-3px 0 0 var(--ink)) drop-shadow(0 3px 0 var(--ink)) drop-shadow(0 -3px 0 var(--ink)) drop-shadow(0 4px 0 var(--ink))}
.runtime-state.set .tab{flex:1;height:40px;border:0;cursor:pointer;font:700 9px/1 var(--f-pixel);color:#fff;background:var(--blue2);box-shadow:inset 0 4px 0 var(--blue3)}
.runtime-state.set .tab:first-child{clip-path:polygon(0 4px,4px 4px,4px 0,100% 0,100% 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px))}
.runtime-state.set .tab:last-child{clip-path:polygon(0 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,0 100%)}
.runtime-state.set .tab[aria-selected=true]{background:var(--gold);box-shadow:inset 0 -4px 0 var(--gold-dark),inset 0 3px 0 var(--gold-light);color:var(--ink)}
.runtime-state.set .play-wrap{left:22%;right:22%;bottom:calc(5% + var(--safe-bottom))}
.runtime-state.set .play{font-size:22px;padding:14px 0 17px}
.runtime-state.set .play:after{display:none}
.runtime-state.load .logo{margin-top:calc(66px + var(--safe-top));width:88%}
.runtime-state.load .squad{bottom:calc(var(--g) - 14px)}
.runtime-state.load .walker{flex:none}
.runtime-state.load .w-burger{width:58%}
.runtime-state.load .w-donut,.runtime-state.load .w-sushi{width:38%;margin-bottom:-1%}
.runtime-state.load .w-donut{margin-right:-17%}
.runtime-state.load .w-sushi{margin-left:-17%}
.runtime-state.load.fail:not(.fa) .w-donut,.runtime-state.load.fail:not(.fa) .w-sushi{display:none}
.runtime-state.load .prog{position:absolute;left:17%;right:17%;bottom:calc(4% + var(--safe-bottom));z-index:5;display:flex;flex-direction:column;align-items:center;gap:8px}
.runtime-state.load .lstep{order:-1;font:700 11px/1 var(--f-pixel);color:#fff;text-shadow:var(--pxshadow);display:flex;justify-content:space-between;width:100%}
.runtime-state .lbar{width:100%;height:30px;background:var(--ink);padding:5px;clip-path:var(--step6)}
.runtime-state .lbar i{display:block;height:100%;width:0;background:var(--gold) repeating-linear-gradient(90deg,transparent 0 13px,rgba(11,31,63,.28) 13px 16px);box-shadow:inset 0 -4px 0 var(--gold-dark);transition:width .25s steps(3,end)}
.runtime-state.load .lfail{display:none}
.runtime-state.load.fail .lfail{display:block}
.runtime-state.load.fail .prog{display:none}
.runtime-state.load.fail .walker{animation:none;background-position:0 0}
.runtime-state.load .ko-lie{bottom:calc(var(--g) + 2px);width:52%;left:24%}
.runtime-state.load .ko-lie .walker{width:100%;margin:0;flex:none}
.runtime-state.load .ko-lie .walker{filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff)}
.runtime-state.load .lfail .ftext{position:absolute;left:8%;right:8%;top:calc(296px + var(--safe-top));z-index:5;text-align:center;font:700 11px/1.7 var(--f-pixel);color:#fff;text-shadow:var(--pxshadow)}
.runtime-state.load .lfail .ftext b{display:block;font:24px/1.1 var(--f-display);color:#fff;letter-spacing:1px;margin-bottom:4px;text-shadow:3px 0 0 var(--ink),-3px 0 0 var(--ink),0 3px 0 var(--ink),0 -3px 0 var(--ink),0 6px 0 var(--ink)}
.runtime-state.load .lfail .play-wrap{left:17%;right:17%;bottom:calc(5% + var(--safe-bottom));animation:none}
.runtime-state.load.fa .walker{animation:none;background-position:0 0}
.runtime-state.load.fa .squad .dizzy{display:block;left:40%;top:16%;width:20%;z-index:4}
.runtime-state.load.fa .w-burger{width:52%}
.runtime-state.load.fa .w-donut,.runtime-state.load.fa .w-sushi{width:36%}
.runtime-state.load.fa .nosig{position:absolute;left:10%;right:10%;top:calc(268px + var(--safe-top));z-index:6;border:0;background:none;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:0}
.runtime-state.load.fa .nosig .hw{rotate:none;margin:0}
.runtime-state.load.fa .nosig .hw-px{width:236px!important;filter:drop-shadow(0 0 6px rgba(200,24,16,.8)) drop-shadow(0 0 14px rgba(180,20,12,.5))!important;animation:none!important}
.runtime-state.load.fa .nosig .pxt{margin-top:-16px;animation:blink 1s steps(1,end) infinite}
.runtime-state.lvl{--g:16%}
.runtime-state.lvl .stands{width:130%}
.runtime-state.lvl .dim{display:none}
.runtime-state.lvl .stars{z-index:3;inset:0 0 30%}
.runtime-state.lvl .hw.lu-title{position:absolute;left:0;right:0;top:calc(22px + var(--safe-top));z-index:5;rotate:none}
.runtime-state.lvl .lu-title .hw-px{width:300px!important}
.runtime-state.lvl .lubadge{position:absolute;left:50%;top:calc(222px + var(--safe-top));translate:-50% 0;z-index:5;display:flex;flex-direction:column;align-items:center;filter:drop-shadow(3px 0 0 var(--ink)) drop-shadow(-3px 0 0 var(--ink)) drop-shadow(0 3px 0 var(--ink)) drop-shadow(0 -3px 0 var(--ink)) drop-shadow(0 6px 0 var(--ink));animation:pop .5s steps(4,end) both}
.runtime-state.lvl .lubadge b{display:flex;align-items:center;gap:12px;background:#fff;box-shadow:inset 0 -8px 0 var(--ice);clip-path:var(--step8);padding:14px 22px 20px}
.runtime-state.lvl .lubadge i{width:30px;height:30px;background:var(--ketchup);box-shadow:inset 0 -6px 0 #a71c16;clip-path:polygon(25% 0,75% 0,75% 15%,100% 15%,100% 85%,75% 85%,75% 100%,25% 100%,25% 85%,0 85%,0 15%,25% 15%)}
.runtime-state.lvl .lubadge strong{font:56px/1 var(--f-display);color:var(--ink);white-space:nowrap}
.runtime-state.lvl .lu-sub{position:absolute;left:0;right:0;top:calc(374px + var(--safe-top));z-index:5;text-align:center;font:700 10px/1.6 var(--f-pixel);color:#fff;text-shadow:0 2px 0 var(--ink)}
.runtime-state.lvl .squad{bottom:calc(var(--g) + 2px);z-index:4}
.runtime-state.lvl .w-burger{width:60%;animation:march .56s steps(1,end) infinite,hop .7s steps(2,end) infinite,lvglow 1.2s steps(1,end) infinite}
@keyframes lvglow{0%,100%{filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(0 0 6px rgba(255,255,255,.9)) drop-shadow(0 0 16px rgba(255,236,120,.7))}50%{filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(0 0 9px rgba(255,255,255,1)) drop-shadow(0 0 26px rgba(255,236,120,.9))}}
@keyframes hop{50%{translate:0 -14px}}
.runtime-state.lvl .play-wrap{left:17%;right:17%;bottom:calc(4% + var(--safe-bottom));z-index:6}
.runtime-state.lvl .play{font-size:26px;padding:16px 0 19px}
.runtime-state.lvl .tap{position:absolute;left:0;right:0;bottom:calc(3.5% + var(--safe-bottom));z-index:6;text-align:center;font:700 9px/1 var(--f-pixel);color:#fff;text-shadow:0 2px 0 var(--ink);animation:blink 1s steps(1,end) infinite}
.runtime-state.buy .dim{z-index:7;background:rgba(11,31,63,.62)}
.runtime-state.buy .bcard{position:absolute;left:14px;right:14px;top:50%;translate:0 -50%;z-index:8;filter:drop-shadow(3px 0 0 var(--ink)) drop-shadow(-3px 0 0 var(--ink)) drop-shadow(0 3px 0 var(--ink)) drop-shadow(0 -3px 0 var(--ink)) drop-shadow(0 6px 0 var(--ink))}
.runtime-state.buy .bcard .pcard{padding:96px 14px 14px;gap:8px}
.runtime-state.buy .bhero{position:absolute;left:21%;top:-78px;z-index:2;width:58%;animation:bs-idle .8s steps(1,end) infinite;aspect-ratio:1;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(4px 5px 0 rgba(11,31,63,.9))}
.runtime-state.buy .buyname{rotate:-3deg;font:700 24px/1.05 var(--f-pixel);color:#fff;background:var(--gold);padding:10px 16px 13px;clip-path:var(--step6);box-shadow:inset 0 -6px 0 var(--gold-dark),inset 0 5px 0 var(--gold-light);
  text-shadow:2px 0 0 var(--ink),-2px 0 0 var(--ink),0 2px 0 var(--ink),0 -2px 0 var(--ink),2px 2px 0 var(--ink),-2px 2px 0 var(--ink),2px -2px 0 var(--ink),-2px -2px 0 var(--ink),3px 4px 0 var(--ink),2px 5px 0 var(--ink),0 5px 0 var(--ink);
  filter:drop-shadow(3px 0 0 var(--ink)) drop-shadow(-3px 0 0 var(--ink)) drop-shadow(0 3px 0 var(--ink)) drop-shadow(0 -3px 0 var(--ink)) drop-shadow(5px 6px 0 var(--ink))}
.runtime-state.buy .btn.go{font-size:22px;min-height:56px}
.runtime-state.buy .bpow{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:2px}
.runtime-state.buy .bpow b{font:700 10px/1 var(--f-pixel);color:#fff;background:var(--ketchup);box-shadow:inset 0 -3px 0 #a71c16;padding:6px 8px 7px;letter-spacing:1px}
.runtime-state.buy .bpow span{font:700 9px/1.6 var(--f-pixel);color:var(--muted)}
.runtime-state.buy .ledger{width:100%;display:flex;flex-direction:column;gap:0;margin-top:4px}
.runtime-state.buy .ledger div{display:flex;justify-content:space-between;align-items:center;padding:8px 2px;font:700 10px/1 var(--f-pixel);color:var(--muted);box-shadow:0 2px 0 #e3eef9}
.runtime-state.buy .ledger div:last-child{box-shadow:none}
.runtime-state.buy .ledger b{display:flex;align-items:center;gap:5px;font:18px/1 var(--f-display);color:var(--ink)}
.runtime-state.buy .ledger .cn{width:13px;height:13px;margin:0}
.runtime-state.buy .cn,.runtime-state .btn .cn{outline:none;background:var(--gold);box-shadow:inset 0 -3px 0 var(--gold-dark);filter:drop-shadow(2px 0 0 var(--ink)) drop-shadow(-2px 0 0 var(--ink)) drop-shadow(0 2px 0 var(--ink)) drop-shadow(0 -2px 0 var(--ink))}
.runtime-state.buy .ledger .after b{color:#1f63a8}
.runtime-state.buy .bbtns{width:100%;display:flex;flex-direction:column;gap:8px;margin-top:4px}
.runtime-state.buy .short{display:none;width:100%;font:700 10px/1.4 var(--f-pixel);color:#fff;background:var(--ketchup);box-shadow:inset 0 -4px 0 #a71c16;padding:9px 8px 10px;clip-path:var(--step4)}
.runtime-state.buy .earn{display:none;font:700 9px/1.6 var(--f-pixel);color:var(--muted);margin:0}
.runtime-state.buy.poor .ledger .have b{color:var(--ketchup)}
.runtime-state.buy.poor .ledger .after{display:none}
.runtime-state.buy.poor .short,.runtime-state.buy.poor .earn{display:block}
.runtime-state.buy.poor .btn.go{display:none}
.runtime-state.buy.poor .btn.off{display:flex}
.runtime-state.buy .btn.off{display:none}
.runtime-state.buy .cgrid{overflow:hidden}
.runtime-state.net .dim{z-index:7;background:rgba(11,31,63,.6)}
.runtime-state.net .ncard{position:absolute;left:14px;right:14px;top:50%;translate:0 -50%;z-index:8;filter:drop-shadow(3px 0 0 var(--ink)) drop-shadow(-3px 0 0 var(--ink)) drop-shadow(0 3px 0 var(--ink)) drop-shadow(0 -3px 0 var(--ink)) drop-shadow(0 6px 0 var(--ink))}
.runtime-state.net .ncard .pcard{gap:10px;padding:14px 14px 14px}
.runtime-state.net .hw.nt{position:relative;margin:-6px 0 -4px}
.runtime-state.net .nt .hw-px{width:250px!important;filter:none!important;animation:none!important}
.runtime-state.net .clock{display:flex;flex-direction:column;align-items:center;gap:4px;font:700 9px/1 var(--f-pixel);color:#fff;background:var(--ink);padding:8px 16px 9px;clip-path:var(--step4)}
.runtime-state.net .clock b{font:28px/1 var(--f-display);color:#fff}
.runtime-state.net .nbtns{width:100%;display:flex;flex-direction:column;gap:8px}
.runtime-state.net .inhud .hc,.runtime-state.net.inhud .hc{opacity:.9}
.runtime-state.net .plug{position:relative;width:70px;height:60px;margin:2px auto -2px}
.runtime-state.net .plug .walker{width:100%;height:100%;filter:none}
.runtime-state.recon .ch{display:flex;align-items:baseline;gap:4px}
.runtime-state .dots{display:inline-flex;gap:4px;margin-left:2px}
.runtime-state .dots i{width:8px;height:8px;background:var(--ink);animation:blink .9s steps(1,end) infinite}
.runtime-state .dots i:nth-child(2){animation-delay:.3s}
.runtime-state .dots i:nth-child(3){animation-delay:.6s}
.runtime-state.recon .try{font:700 10px/1 var(--f-pixel);color:var(--muted)}
.runtime-state.recon .try b{color:var(--ink)}
.runtime-state.recon .rbar{width:100%;height:14px;background:var(--ink);padding:3px;clip-path:var(--step4)}
.runtime-state.recon .rbar i{display:block;height:100%;width:40%;background:var(--sky);animation:scan 1.6s steps(8,end) infinite}
@keyframes scan{to{translate:150% 0}}
.runtime-state.wait .q-head{margin-top:calc(22px + var(--safe-top));gap:16px}
.runtime-state.wait .logo-type .t1{font-size:34px}
.runtime-state.wait .logo-type .t2{font-size:40px}
.runtime-state.wait .q-tag b{background:#fff;box-shadow:inset 0 -3px 0 var(--ice)}
.runtime-state.wait .seats{width:70%;margin-top:18px;gap:10px 10px}
.runtime-state.wait .q-count{margin-top:16px}
.runtime-state.wait .q-count span{font-size:30px}
.runtime-state.wait .bots{position:relative;z-index:2;margin-top:10px;display:flex;align-items:center;gap:8px;font:700 10px/1 var(--f-pixel);color:var(--ink);background:var(--gold);box-shadow:inset 0 -3px 0 var(--gold-dark);padding:7px 10px 8px;rotate:-1.5deg;clip-path:var(--step4)}
.runtime-state.wait .bots b{font:16px/1 var(--f-display);color:var(--ink);background:#fff;padding:3px 5px;box-shadow:inset 0 -2px 0 var(--ice)}
.runtime-state.wait .squad{bottom:calc(var(--g) + 8px)}
.runtime-state.wait .w-burger{width:52%}
.runtime-state.wait .play-wrap{left:18%;right:18%;bottom:calc(7% + var(--safe-bottom))}
.runtime-state.wait .play{font-size:20px;padding:13px 0 15px;background:var(--gold);box-shadow:inset 0 -8px 0 var(--gold-dark),inset 0 5px 0 var(--gold-light)}
.runtime-state.wait .play:after{background:var(--gold-light);box-shadow:14px 0 0 -4px var(--gold-light)}
.runtime-state.wait .play:hover{background:#ffdc5c}
.runtime-state.wait .home{position:absolute;left:50%;translate:-50% 0;bottom:calc(1.6% + var(--safe-bottom));z-index:3;font:700 11px/1 var(--f-pixel);color:#fff;background:var(--ink);border:0;padding:9px 12px;cursor:pointer}
.runtime-state.spec .specbar{position:absolute;left:0;right:0;top:0;z-index:7;display:flex;align-items:center;gap:8px;padding:calc(8px + var(--safe-top)) calc(10px + var(--safe-right)) 9px calc(10px + var(--safe-left));background:var(--ink)}
.runtime-state.spec .sout{flex:none;font:700 7px/1 var(--f-pixel);color:#fff;background:var(--ketchup);box-shadow:inset 0 -3px 0 #a71c16;padding:6px 6px 7px;letter-spacing:.5px}
.runtime-state.spec .sface{flex:none;width:36px;height:36px;object-fit:contain;image-rendering:pixelated;background:#fff;box-shadow:inset 0 -3px 0 var(--ice);clip-path:var(--step4);padding:3px}
.runtime-state.spec .swho{display:flex;flex-direction:column;min-width:0;gap:3px}
.runtime-state.spec .swho small{font:700 8px/1 var(--f-pixel);color:var(--ice)}
.runtime-state.spec .swho b{font:13px/1 var(--f-display);color:#fff}
.runtime-state.spec .sleft{margin-left:auto;flex:none;height:26px;width:auto;image-rendering:auto}
.runtime-state.spec .spot{position:absolute;left:50%;top:calc(50% - 86px);translate:-50% 0;z-index:5;display:flex;flex-direction:column;align-items:center;gap:2px;animation:bob .5s steps(1,end) infinite;filter:drop-shadow(2px 0 0 var(--ink)) drop-shadow(-2px 0 0 var(--ink)) drop-shadow(0 2px 0 var(--ink)) drop-shadow(0 -2px 0 var(--ink))}
.runtime-state.spec .spot i{width:22px;height:16px;background:var(--gold);clip-path:polygon(0 0,100% 0,100% 30%,80% 30%,80% 60%,60% 60%,60% 100%,40% 100%,40% 60%,20% 60%,20% 30%,0 30%)}
.runtime-state.spec .swap{position:absolute;top:50%;translate:0 -50%;z-index:7;width:50px;height:56px;border:0;cursor:pointer;background:rgba(11,31,63,.82);clip-path:var(--step4);padding:0}
.runtime-state.spec .swap:before{content:"";position:absolute;left:50%;top:50%;translate:-50% -50%;width:14px;height:20px;background:#fff}
.runtime-state.spec .swap.l{left:calc(10px + var(--safe-left))}
.runtime-state.spec .swap.l:before{clip-path:polygon(0 0,40% 0,40% 20%,70% 20%,70% 40%,100% 40%,100% 60%,70% 60%,70% 80%,40% 80%,40% 100%,0 100%)}
.runtime-state.spec .swap.r{right:calc(10px + var(--safe-right))}
.runtime-state.spec .swap.r:before{clip-path:polygon(100% 0,60% 0,60% 20%,30% 20%,30% 40%,0 40%,0 60%,30% 60%,30% 80%,60% 80%,60% 100%,100% 100%)}
.runtime-state.spec .swap:active{translate:0 calc(-50% + 2px)}
.runtime-state.spec .sfoot{position:absolute;left:0;right:0;bottom:calc(18% + var(--safe-bottom));z-index:7;display:flex;flex-direction:column;align-items:center;gap:6px}
.runtime-state.spec .sfoot small{font:700 9px/1 var(--f-pixel);color:#fff;text-shadow:var(--pxshadow)}
.runtime-state.spec .srow{display:flex;gap:8px;filter:drop-shadow(3px 0 0 var(--ink)) drop-shadow(-3px 0 0 var(--ink)) drop-shadow(0 3px 0 var(--ink)) drop-shadow(0 -3px 0 var(--ink)) drop-shadow(0 4px 0 var(--ink))}
.runtime-state.spec .srow button{width:46px;height:46px;border:0;padding:4px;cursor:pointer;background:var(--blue2);box-shadow:inset 0 -4px 0 var(--blue3);clip-path:var(--step4)}
.runtime-state.spec .srow button img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}
.runtime-state.spec .srow button[aria-pressed=true]{background:var(--gold);box-shadow:inset 0 -4px 0 var(--gold-dark)}
.runtime-state.spec .play-wrap{left:14%;right:14%;bottom:calc(5% + var(--safe-bottom));z-index:7}
.runtime-state.spec .play{font-size:20px;padding:13px 0 15px;background:#fff;box-shadow:inset 0 -8px 0 var(--ice),inset 0 5px 0 #fff}
.runtime-state.spec .play:after{display:none}
.runtime-state.spec .hme .walker{filter:none}
.runtime-state.spec .hf,.runtime-state.spec .hme{z-index:3}
.runtime-state.spec .over{display:none;position:absolute;inset:0;z-index:9}
.runtime-state.spec.over .over{display:block}
.runtime-state.spec.over .hf,.runtime-state.spec.over .hme,.runtime-state.spec.over .spot{display:none}
.runtime-state.spec.over .swap,.runtime-state.spec.over .sfoot,.runtime-state.spec.over .play-wrap{display:none}
.runtime-state.spec .over .dim{z-index:1;background:rgba(11,31,63,.6)}
.runtime-state.spec.over.oa .over{pointer-events:auto}
.runtime-state.spec.over.oa .over .hw{position:absolute;left:0;right:0;top:50%;translate:0 -50%;z-index:3;rotate:none;animation:fo-flash 4s steps(1,end) 1 forwards}
.runtime-state.spec.over.oa .over .hw-px{width:300px!important}
.runtime-state.spec.over.oa .over .dim{animation:fo-cut 4s steps(1,end) 1 forwards}
@keyframes fo-flash{0%{opacity:0}3%{opacity:1;scale:1.3}5%{scale:1.1}7%{scale:1}11%{opacity:0}15%{opacity:1}19%{opacity:0}23%{opacity:1}88%{opacity:1}92%,100%{opacity:0}}
@keyframes fo-cut{0%{background:rgba(11,31,63,.6)}92%,100%{background:var(--ink)}}
/* Keep the cut and automatic advance when the user disables animation. */
@media(prefers-reduced-motion:reduce){
 .runtime-state.spec.over.oa .over .hw{animation:fo-still 4s steps(1,end) 1 forwards!important}
 .runtime-state.spec.over.oa .over .dim{animation:fo-cut 4s steps(1,end) 1 forwards!important}
}
@keyframes fo-still{0%,88%{opacity:1}92%,100%{opacity:0}}
.runtime-state.spec .hleft{display:none}