#gridlock-story-ui[data-story-screen="counter"] .story-main{padding:0;overflow:hidden;min-height:0}
:is(#gridlock-story-ui,.standalone-arcade) .story-counter{position:relative;isolation:isolate;width:100%;height:100%;overflow:hidden;background:#141513;color:#fff1d1;font-family:"Avenir Next",Avenir,sans-serif;outline:none}
.story-counter::before{content:"";position:absolute;inset:-25px;background:linear-gradient(#101515a0,#101515dd),url('/story/counter-diner.webp') center/cover;filter:blur(18px);z-index:-1}
.counter-scene{position:absolute;top:calc(50% - 24px);left:50%;transform:translate(-50%,-50%);container-type:inline-size}
.counter-art{display:block;width:100%;height:100%}
:is(#gridlock-story-ui,.standalone-arcade) .story-counter button{cursor:pointer;font:650 13px/1.35 "Avenir Next",Avenir,sans-serif;text-transform:none;letter-spacing:0;box-shadow:none;min-height:0;transition:none}
:is(#gridlock-story-ui,.standalone-arcade) .story-counter button:focus-visible{outline:2px solid #ffdc86;outline-offset:4px}
.counter-heading{position:absolute;inset:2.4% 3% auto;display:flex;align-items:start;justify-content:space-between;pointer-events:none;text-shadow:0 2px 5px #000}
.counter-heading>div:first-child{padding:.7cqw 1.3cqw;background:#1d221bcc;border-left:3px solid #ebbc70;border-radius:2px}
.counter-heading span{font-size:.7cqw;letter-spacing:.2em;color:#f0d0a4}.counter-heading h2{font:italic bold 2.7cqw/1.2 Georgia,serif!important;letter-spacing:-.05em;margin:0!important;color:#ffebc1!important}.counter-heading small{font-size:.6cqw;letter-spacing:.12em;color:#e3cdab}
.counter-clock{display:flex;flex-direction:column;align-items:center;padding:.8cqw 1.8cqw;background:linear-gradient(120deg,#28291f,#111b16);border:.25cqw solid #a17c44;border-radius:1cqw;box-shadow:0 .3cqw .5cqw #0008}.counter-clock b{font:600 2.8cqw/1.1 monospace;color:#ffd788;text-shadow:0 0 12px #f1ab4e66}
:is(#gridlock-story-ui,.standalone-arcade) .counter-guest{position:absolute;top:15%;height:44%;width:23%;transform:translateX(-50%);padding:0;border:0;background:transparent;opacity:1;cursor:pointer;color:#3b3829}
.counter-ticket{position:absolute;top:0;left:50%;transform:translateX(-50%) rotate(-1deg);width:76%;min-height:5cqw;padding:.6cqw .7cqw;background:linear-gradient(110deg,#fff4d4,#e6d5ae);border-top:.3cqw double #914e37;box-shadow:0 .25cqw .6cqw #0007;pointer-events:none}
.counter-guest:nth-child(2) .counter-ticket{transform:translateX(-50%) rotate(1.5deg)}
.counter-ticket[hidden],.counter-reaction[hidden]{display:none}.counter-ticket small{display:flex;align-items:center;justify-content:space-between;font:.55cqw/1.5 monospace;letter-spacing:.08em;color:#614b35}
.story-counter kbd{font:inherit;border:1px solid currentColor;border-radius:2px;padding:0 .3em;opacity:.8}.counter-order{display:flex;justify-content:center;gap:.15cqw;height:3.4cqw;margin:.2cqw 0}.counter-food{display:block;background-image:url('/story/counter-food.webp');background-size:200% 200%;aspect-ratio:1;width:100%;pointer-events:none}
.counter-food-coffee{background-position:0 0}.counter-food-pie{background-position:100% 0}.counter-food-burger{background-position:0 100%}.counter-food-fries{background-position:100% 100%}.counter-order .counter-food{height:100%;width:auto}
.counter-food-pancakes,.counter-food-milkshake,.counter-food-hotdog,.counter-food-salad{background-image:url('/story/counter-food-extra-a.webp')}
.counter-food-toastie,.counter-food-breakfast,.counter-food-rings,.counter-food-cake{background-image:url('/story/counter-food-extra-b.webp')}
.counter-food-pancakes,.counter-food-toastie{background-position:0 0}.counter-food-milkshake,.counter-food-breakfast{background-position:100% 0}.counter-food-hotdog,.counter-food-rings{background-position:0 100%}.counter-food-salad,.counter-food-cake{background-position:100% 100%}
/* Fit each transparent food to the same visual scale in the pass, tickets and tray. */
.counter-food-coffee{background-size:220.8302% 220.8302%;background-position:8.6196% 4.3098%}
.counter-food-pie{background-size:200.0000% 200.0000%;background-position:100.0000% 0.0000%}
.counter-food-burger{background-size:200.0000% 200.0000%;background-position:0.0000% 100.0000%}
.counter-food-fries{background-size:200.0000% 200.0000%;background-position:100.0000% 100.0000%}
.counter-food-pancakes{background-size:282.4021% 282.4021%;background-position:13.0225% 18.3315%}
.counter-food-milkshake{background-size:255.6699% 255.6699%;background-position:92.4348% 11.1014%}
.counter-food-hotdog{background-size:292.6000% 292.6000%;background-position:14.8667% 89.4341%}
.counter-food-salad{background-size:290.1818% 290.1818%;background-position:89.4837% 89.7271%}
.counter-food-toastie{background-size:248.4340% 248.4340%;background-position:9.6924% 11.1605%}
.counter-food-breakfast{background-size:250.8000% 250.8000%;background-position:92.8382% 12.7984%}
.counter-food-rings{background-size:271.4845% 271.4845%;background-position:12.1258% 90.2729%}
.counter-food-cake{background-size:261.3797% 261.3797%;background-position:91.5247% 91.3955%}
.counter-patience{display:block;height:.18cqw;background:#534a3733;margin-top:.2cqw}.counter-patience i{display:block;width:calc(var(--patience,1)*100%);height:100%;background:#59704c}.counter-impatient .counter-patience i{background:#a24935}
.counter-selected .counter-ticket{box-shadow:0 .25cqw .6cqw #0007,0 0 0 1px #eebf62}.counter-reaction{position:absolute;bottom:3%;left:0;width:100%;padding:.5cqw;border-radius:.5cqw;background:#fff3d8;color:#354535;font:italic .9cqw/1.3 Georgia,serif}
.counter-prep{position:absolute;left:3.5%;top:61%;width:48%;height:31%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:.25cqw .35cqw;padding:1.8cqw .7cqw .65cqw;background:linear-gradient(155deg,#342d23d9,#16281fd9);border:.12cqw solid #e8d8b36b;border-radius:1cqw;box-shadow:inset 0 1px 7px #fcf0ce33,0 .4cqw .6cqw #21120e70;box-sizing:border-box}
.counter-prep-label{position:absolute;top:.5cqw;left:1cqw;font:bold .68cqw/1.4 monospace;letter-spacing:.12em;color:#fff0cc;text-shadow:0 1px 4px #000}.counter-prep-label small{font:italic .7cqw Georgia,serif;letter-spacing:0;margin-left:1cqw}
:is(#gridlock-story-ui,.standalone-arcade) .counter-station{position:relative;min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:center;padding:0 .3cqw .2cqw;background:none;border:none;opacity:1;color:#342c20;border-radius:.5cqw}
.counter-station .counter-food{height:3.25cqw;width:3.25cqw;margin:0 auto;flex:none;filter:drop-shadow(0 .12cqw .1cqw #24160c50)}
.counter-station>span{display:block;background:#f6e9cbe8;padding:.18cqw .15cqw;font-size:.75cqw;line-height:1.3;box-shadow:0 2px 4px #0003;border-radius:2px;white-space:nowrap}.counter-refill{position:absolute;bottom:.1cqw;left:5%;height:.18cqw;width:calc(var(--refill,1)*90%);background:#819663}.counter-cooking .counter-food{opacity:.45}.counter-cooking>span{color:#695d46}.counter-station:not(:disabled):hover{background:#fff0cb25}
.counter-tray{position:absolute;left:54%;top:64%;width:34%;height:28%;background:url('/story/counter-tray.webp') center/100% 150% no-repeat;box-sizing:border-box;text-align:center;filter:drop-shadow(0 .4cqw .3cqw #311d1555)}
.counter-tray-items{height:75%;display:flex;align-items:center;justify-content:center;padding:0 .7cqw}.counter-tray-items .counter-food{width:8cqw;height:8cqw;filter:drop-shadow(0 .2cqw .15cqw #1a130a55)}
.counter-tray>span{position:absolute;bottom:.8cqw;left:0;right:0;font:bold .65cqw/1.4 monospace;letter-spacing:.12em;color:#ffe8c4;text-shadow:0 1px 3px #3d1307}.counter-tray>span small{display:block;font:italic .65cqw Georgia,serif;letter-spacing:0}
:is(#gridlock-story-ui,.standalone-arcade) .counter-tray button{position:absolute;right:-27%;bottom:5%;max-width:25%;padding:.5cqw;background:#efe2bee8;color:#494132;border:1px solid #887a5e;border-radius:.3cqw;font-size:.68cqw}
.counter-status{position:absolute;left:3.5%;right:3.5%;bottom:1.7%;display:flex;gap:2cqw;align-items:center;padding:.4cqw 1cqw;color:#ede1bd;background:#12271edb;border-block:1px solid #d5b97866;font:.9cqw/1.5 "Avenir Next",sans-serif}.counter-status b{font-size:1.25cqw;color:#ffe1a1}
.counter-toast{position:absolute;bottom:37%;left:30%;right:30%;margin:0!important;text-align:center;background:#123127e6;color:#fff0ca!important;box-shadow:0 .2cqw .6cqw #0005;border-radius:.5cqw;font:italic .95cqw/1.4 Georgia,serif!important;padding:.5cqw}.counter-toast:empty{display:none}
.counter-footer{position:absolute;inset:auto 0 0;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 18px;box-sizing:border-box;background:#101d17;color:#c8cfb5;font-size:11px}.counter-footer>div{display:flex;gap:8px}
:is(#gridlock-story-ui,.standalone-arcade) .counter-footer button{padding:7px 12px;border:1px solid #83977a60;border-radius:3px;color:#f6e9c7;background:#294132}
.counter-overlay{position:absolute;inset:0;z-index:5;display:grid;place-items:center;background:#111b1599;backdrop-filter:blur(4px)}.counter-overlay[hidden]{display:none}
.counter-note{position:relative;width:min(460px,80%);padding:30px 36px;background:linear-gradient(110deg,#fff3d2,#e6d4ad);border:1px solid #d8c69d;box-shadow:0 20px 70px #0009;transform:rotate(-.5deg);color:#39412d}
.counter-note::before{content:"";position:absolute;left:35%;right:35%;top:-8px;height:18px;background:#bcb079a6;transform:rotate(2deg)}.counter-note-eyebrow{font:bold 10px/1.5 monospace;letter-spacing:.2em;color:#977247}
:is(#gridlock-story-ui,.standalone-arcade) .counter-note h2{font:italic bold 38px/1.05 Georgia,serif;margin:14px 0;color:#3d5439;letter-spacing:-.04em}
:is(#gridlock-story-ui,.standalone-arcade) .counter-note p{font:17px/1.6 Georgia,serif;color:#4c4b38;margin:16px 0}.counter-note-stats{font:12px/1.7 "Avenir Next",sans-serif;color:#695b41;border-top:1px solid #8e82605c;padding-top:12px}.counter-note-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
:is(#gridlock-story-ui,.standalone-arcade) .counter-note button{border:1px solid #506748;background:#3d593d;color:#fff0ca;padding:10px 16px;border-radius:3px;font-size:14px}
:is(#gridlock-story-ui,.standalone-arcade) .story-counter button:disabled{cursor:default}.counter-footer button:disabled{opacity:.45}
@media(max-width:700px){.counter-footer{font-size:9px;padding:6px 9px}.counter-footer>span{max-width:55%}.counter-note{padding:22px;width:75%}.counter-note p{font-size:14px!important}.counter-note h2{font-size:28px!important}}
