/* SpinBite app styles. Base + tokens from design kit _src/styles.css; screen rules from the kit's build_screens.py. */
@font-face{font-family:"Fredoka";src:url("/fonts/fredoka-latin.woff2") format("woff2");font-weight:500 700;font-display:swap}
@font-face{font-family:"Nunito";src:url("/fonts/nunito-latin.woff2") format("woff2");font-weight:600 900;font-display:swap}
:root{
  --ketchup:#FF4B3E;--ketchup-dark:#D7261A;--tangerine:#FF9F1C;--mustard:#FFC93C;--pickle:#2EC27E;
  --blueberry:#3D8BFF;--grape:#8B5CF6;--bubblegum:#FF6FB5;
  --ink:#2B1B3F;--ink-2:#5E5470;--bun:#FFF6E9;--crust:#FFE7C7;--white:#fff;--night:#1E1430;
  --spruce:#1A4433;
  --display:"Fredoka",ui-rounded,system-ui,sans-serif;--ui:"Nunito",ui-rounded,system-ui,sans-serif;
  --radius:22px;--shadow:0 5px 0 var(--ink);
}
*{box-sizing:border-box;margin:0;padding:0}
html{height:100%;background:var(--bun)}
body{min-height:100%;font-family:var(--ui);color:var(--ink);background:var(--bun);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
button,select,input{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
a{color:inherit}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:8px;top:-60px;z-index:200;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px;font-weight:800}
.skip:focus{top:8px}
:focus-visible{outline:3px solid var(--blueberry);outline-offset:3px}
[hidden]{display:none!important}

/* Screen frame: phone-first column, centered on wider screens */
.screen{position:relative;min-height:100vh;min-height:100dvh;max-width:480px;margin:0 auto;display:flex;flex-direction:column;background:var(--bun);overflow:hidden;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
h1,h2,h3,.display{font-family:var(--display);font-weight:600;letter-spacing:-.01em;line-height:1.05}
.btn{display:flex;align-items:center;justify-content:center;gap:10px;border:3px solid var(--ink);border-radius:999px;
  font:700 21px var(--display);padding:16px 22px;background:var(--white);color:var(--ink);box-shadow:var(--shadow);text-decoration:none;white-space:nowrap;cursor:pointer;transition:transform .08s,box-shadow .08s;width:100%}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--ink)}
.btn.primary{background:var(--ketchup);color:#fff}
.btn.primary:active{background:var(--ketchup-dark)}
.btn.yellow{background:var(--mustard);color:var(--ink)}
.btn.big{font-size:26px;padding:19px 26px}
.btn.sm{font-size:16px;padding:10px 16px;box-shadow:0 3px 0 var(--ink)}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.btn img,.btn svg{width:26px;height:26px;flex:none}
.btn.sm svg{width:18px;height:18px}
.topbar{display:flex;align-items:center;gap:10px;padding:12px 18px 6px}
.iconbtn{width:44px;height:44px;flex:none;border:3px solid var(--ink);border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 3px 0 var(--ink);color:var(--ink)}
.iconbtn svg{width:22px;height:22px}
.iconbtn[aria-pressed="true"] .snd-off,.iconbtn[aria-pressed="false"] .snd-on{display:none}
.chip{display:inline-flex;align-items:center;gap:6px;border:2.5px solid var(--ink);border-radius:999px;padding:7px 13px;font:800 14px var(--ui);background:#fff;white-space:nowrap;color:var(--ink)}
.chip.on,.chip[aria-pressed="true"]{background:var(--ink);color:#fff}
.chip svg{width:18px;height:18px}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 10px;font:800 12px var(--ui);letter-spacing:.02em}
.pill.live{background:var(--pickle);color:var(--ink)}
.pill.soon{background:#EDE3D3;color:var(--ink-2)}
.pill.warn{background:var(--mustard);color:var(--ink)}
.pill.allday{background:var(--pickle);color:var(--ink)}
.credit{display:flex;align-items:center;justify-content:center;gap:6px;font:700 12px var(--ui);color:var(--spruce);padding:10px 0 18px;flex-wrap:wrap}
.credit img{width:16px;height:16px}
.credit a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.credit .sep{opacity:.5}
.sample{position:absolute;left:50%;transform:translateX(-50%);top:calc(6px + env(safe-area-inset-top));font:800 9.5px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);background:rgba(255,255,255,.75);border-radius:6px;padding:3px 6px;z-index:50;white-space:nowrap}
.card{background:#fff;border:3px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow)}
.muted{color:var(--ink-2)}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translateX(-50%);background:var(--ink);color:#fff;font:800 15px/1.35 var(--ui);padding:12px 18px;border-radius:16px;z-index:300;max-width:min(92vw,420px);text-align:center;box-shadow:0 4px 0 rgba(0,0,0,.25)}

/* Ad slots: reserved fixed-size boxes so nothing shifts when an ad loads (or doesn't) */
.adwrap{display:flex;flex-direction:column;align-items:center;gap:3px;flex:none}
.adlabel{font:800 9.5px var(--ui);letter-spacing:.12em;text-transform:uppercase;color:#6F6780}
.ad{display:block;overflow:hidden;background:repeating-linear-gradient(135deg,#F1ECE6 0 10px,#EAE4DC 10px 20px);border:1.5px dashed #B9B1C2;border-radius:6px}
.ad.filled{background:transparent;border:0}
.ad-320x50{width:320px;height:50px}.ad-320x100{width:320px;height:100px}.ad-300x250{width:300px;height:250px}.ad-728x90{width:728px;height:90px}
.ad ins.adsbygoogle{display:block;width:100%;height:100%}

/* 1 INTRO */
#s-intro{background:radial-gradient(circle at 50% 36%,#FFE3A8 0,var(--bun) 62%)}
#s-intro .fl{position:absolute;opacity:.95;filter:drop-shadow(0 3px 0 rgba(43,27,63,.15));pointer-events:none}
#s-intro .fl img{display:block}
.f1{left:7%;top:11%;transform:rotate(-14deg)}.f2{right:6%;top:13%;transform:rotate(12deg)}.f3{right:5%;top:31%;transform:rotate(-8deg)}
.f4{left:7%;top:32%;transform:rotate(10deg)}.f5{left:7%;top:71%;transform:rotate(-12deg)}.f6{right:6%;top:70.5%;transform:rotate(14deg)}
.f7{left:44%;top:8%}.f8{left:4%;top:46%;transform:rotate(8deg)}.f9{right:4%;top:46%;transform:rotate(-16deg)}
#s-intro .hero{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px 30px 0;position:relative;z-index:2}
#s-intro .mark{width:210px;height:auto}
#s-intro .wm{margin-top:4px;width:200px;height:auto}
#s-intro .tag{font:600 27px/1.15 var(--display);margin-top:18px}#s-intro .tag b{color:var(--ketchup-dark);font-weight:700}
#s-intro .sub{font:700 16px/1.4 var(--ui);color:var(--ink-2);margin-top:10px}
#s-intro .cta{padding:18px 26px 0;position:relative;z-index:2}
#s-intro .live{margin-top:16px;text-align:center;font:700 14px var(--ui);color:var(--ink-2);display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap}
#s-intro .live .pill.live{color:var(--ink)}

/* 2 LOCATION */
#s-location .body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 32px}
.pinwrap{position:relative;width:200px;height:200px;display:grid;place-items:center;margin-bottom:18px}
.ring{position:absolute;border-radius:50%;border:4px solid var(--blueberry)}.r1{inset:30px;background:#DCEBFF}.pinwrap img{position:relative;z-index:2}.r2{inset:0;opacity:.35;border-style:dashed}
#s-location h1{font-size:36px}#s-location p{font:700 17px/1.45 var(--ui);color:var(--ink-2);margin-top:12px}
.priv{margin-top:22px;display:flex;gap:10px;align-items:center;padding:12px 14px;text-align:left;font:800 14px/1.35 var(--ui);box-shadow:0 3px 0 var(--ink);border-width:2.5px}
.priv svg{width:26px;height:26px;flex:none}
#s-location .cta{padding:18px 26px 6px;display:flex;flex-direction:column;gap:14px}

/* 3 US MAP */
.hd{padding:6px 24px 14px}#s-map h1{font-size:36px}.hd p{font:700 16px var(--ui);color:var(--ink-2);margin-top:6px}
.mapcard{margin:0 10px;padding:16px 0 12px;background:#fff}.mapwrap{position:relative}
.usmap{display:block;width:100%;height:auto}
.usmap path{fill:#F1DDBF;stroke:#fff;stroke-width:1.8;cursor:pointer;outline:none;transition:fill .15s}
.usmap path:hover,.usmap path:focus-visible{fill:#E9C99A}
.usmap path:focus-visible{stroke:var(--blueberry);stroke-width:4}
.usmap path.live{fill:var(--ketchup);stroke:var(--ink);stroke-width:3;stroke-linejoin:round}
.usmap path.live:hover,.usmap path.live:focus-visible{fill:var(--ketchup-dark)}
.callout{white-space:nowrap;position:absolute;left:39%;top:34%;background:#fff;border:2.5px solid var(--ink);border-radius:14px;padding:5px 9px;display:flex;gap:6px;align-items:center;font:600 15px var(--display);box-shadow:0 3px 0 var(--ink);pointer-events:none}
.callout:before{content:"";position:absolute;left:50%;bottom:-9px;margin-left:-6px;width:12px;height:12px;background:#fff;border-right:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);transform:rotate(45deg)}
.legend{display:flex;gap:18px;justify-content:center;margin-top:12px;font:800 13px var(--ui);color:var(--ink-2)}.legend span{display:flex;gap:6px;align-items:center}.legend i{width:14px;height:14px;border-radius:4px;display:inline-block}
.legend .lv{background:var(--ketchup)}.legend .sn{background:#F3E3CB;border:2px solid #E0CBAA}
.btn.row{margin:22px 16px 0;justify-content:flex-start;padding:12px 18px;border-radius:20px;width:auto}.btn.row .t{flex:1;display:flex;flex-direction:column;text-align:left}.btn.row small{font:700 14px var(--ui);color:var(--ink-2)}
.btn.row .chev{transform:rotate(180deg);width:24px;height:24px}
.soonnote{font:700 14px/1.45 var(--ui);color:var(--ink-2);text-align:center;padding:16px 34px 0}
.grow{flex:1}

/* 4 STATE / CITY LIST */
.crumb{font:800 14px var(--ui);color:var(--ink-2)}#s-state .hd{padding:4px 22px 10px}#s-state h1{font-size:40px}
.search{margin:0 18px;height:52px;border:3px solid var(--ink);border-radius:999px;background:#fff;display:flex;align-items:center;gap:10px;padding:0 16px}
.search svg{width:22px;height:22px;flex:none;color:var(--ink-2)}
.search input{flex:1;border:0;outline:0;background:transparent;font:700 17px var(--ui);color:var(--ink);min-width:0;height:100%}
.search input::placeholder{color:var(--ink-2)}
.search:focus-within{outline:3px solid var(--blueberry);outline-offset:3px}
.livecard{margin:16px 18px 6px;padding:14px;display:flex;align-items:center;gap:14px;background:#E6F8EE;text-decoration:none;color:var(--ink)}
.livecard .em{width:58px;height:58px;border-radius:50%;background:#fff;border:2.5px solid var(--ink);display:grid;place-items:center;flex:none}
.livecard .t{flex:1;display:flex;flex-direction:column;gap:3px;align-items:flex-start}.livecard b{font:600 25px var(--display)}.livecard small{font:800 14px var(--ui);color:var(--ink-2)}
.go{width:46px;height:46px;border-radius:50%;background:var(--ketchup);border:3px solid var(--ink);display:grid;place-items:center;flex:none;color:#fff}
.go svg{transform:rotate(180deg);width:22px;height:22px}
.lbl{font:800 13px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);padding:16px 24px 6px}
.citylist{list-style:none;padding:0 18px 24px}.citylist li{display:flex;justify-content:space-between;align-items:center;padding:13px 6px;border-bottom:2px dashed #E7D6BD;font:700 17px var(--ui);color:var(--ink-2)}
.emptynote{padding:10px 24px;font:700 16px/1.45 var(--ui);color:var(--ink-2)}

/* 5 WHEEL */
.loc{flex:1;text-align:center;display:flex;flex-direction:column;min-width:0}.loc b{font:600 19px var(--display);display:flex;gap:4px;align-items:center;justify-content:center}.loc b svg{width:18px;height:18px;color:var(--ketchup)}.loc small{font:800 13px var(--ui);color:var(--ink-2)}
.chips{display:flex;gap:8px;padding:8px 16px 4px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scroll-padding-inline:16px}
/* "there's more" fade on the right edge; JS toggles .more while the row can still scroll right */
.chips.more{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 36px),transparent)}
.chips::after{content:"";flex:0 0 8px}
@media (prefers-reduced-motion:no-preference){.chips{scroll-behavior:smooth}}
.chips::-webkit-scrollbar{display:none}
.chipsel{appearance:none;-webkit-appearance:none;border:2.5px solid var(--ink);border-radius:999px;padding:7px 30px 7px 13px;font:800 14px var(--ui);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B1B3F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 9px center/14px;color:var(--ink);cursor:pointer;flex:none;max-width:60vw}
.chipsel.on{background-color:var(--ink);color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E")}
.wheelzone{flex:1;display:flex;align-items:center;justify-content:center;position:relative;min-height:0;padding:4px 0}
.wheelbox{position:relative;width:min(96vw,376px,calc(100dvh - 400px));aspect-ratio:1;min-width:260px;touch-action:none;user-select:none;-webkit-user-select:none}
.wheel{display:block;width:100%;height:100%;filter:drop-shadow(0 8px 0 rgba(43,27,63,.18));overflow:visible}
.wheel .rot{transform-origin:0 0;will-change:transform}
.wheel .ptr{transform-origin:0 -1px;transform-box:view-box}
.wheel .bulb{transition:fill .1s}
.wheel.landed .slice:not(.win){opacity:.6}
.wheel .slice{transition:opacity .25s}
.wheel text{font-family:var(--display);font-weight:600;pointer-events:none}
.wheel text.allday-t{font-family:var(--ui);font-weight:800;letter-spacing:.04em}
.wheel .bulbs.chase .bulb.a{animation:chaseA .24s steps(1) infinite}.wheel .bulbs.chase .bulb.b{animation:chaseB .24s steps(1) infinite}
.wheel .bulbs.flash .bulb{animation:flash .18s steps(1) 5}
@keyframes chaseA{0%{fill:var(--mustard)}50%{fill:var(--bun)}}@keyframes chaseB{0%{fill:var(--bun)}50%{fill:var(--mustard)}}
@keyframes flash{0%{fill:#fff}50%{fill:var(--mustard)}}
.hint{text-align:center;font:800 13px var(--ui);color:var(--ink-2);margin:-2px 0 10px}
.under{display:flex;justify-content:center;gap:10px;margin-top:-4px;min-height:38px}
#s-wheel .cta{padding:12px 22px 0}.btn.spin{font-size:30px;padding:18px 26px;letter-spacing:.04em}
.credit.c5{padding:12px 0 8px}.adwrap.mob{padding-bottom:12px}
.nomatch{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px;font:700 17px/1.4 var(--ui);color:var(--ink-2)}
.nomatch b{font:600 26px var(--display);color:var(--ink)}
.nomatch .btn{width:auto}
/* room for the SAMPLE DATA pill above the top bar */
.screen:has(>.sample:not([hidden]))>.topbar{padding-top:calc(24px + env(safe-area-inset-top))}
.planbar{margin:2px 16px 0;padding:8px 12px;border-radius:14px;background:var(--night);color:var(--bun);font:800 13px/1.3 var(--ui);text-align:center}
.dsk{display:none}

/* 6 RESULT SHEET */
.dim{position:fixed;inset:0;background:rgba(30,20,48,.45);z-index:60}
.sheetwrap{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100vw - 24px),456px);z-index:70}
.sheetwrap.pop{animation:popup .55s cubic-bezier(.34,1.56,.64,1)}
@keyframes popup{from{transform:translate(-50%,110%)}to{transform:translate(-50%,0)}}
.sheet{position:relative;padding:44px 20px 10px;text-align:center;border-radius:30px;max-height:calc(100dvh - 80px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
.badge{position:absolute;left:50%;top:-44px;transform:translateX(-50%);width:84px;height:84px;border-radius:50%;background:var(--tangerine);border:3.5px solid var(--ink);display:grid;place-items:center;box-shadow:0 5px 0 var(--ink);z-index:2}
.kicker{font:800 14px var(--ui);color:var(--ink-2);letter-spacing:.06em;text-transform:uppercase}
.sheet h2{font-size:36px;margin-top:2px;overflow-wrap:anywhere}.meta{font:800 16px var(--ui);color:var(--ink-2);margin-top:6px}.rt{display:inline-flex;align-items:center;gap:2px;color:var(--ink)}.rt svg{width:16px;height:16px}
.hrs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin-top:12px;font:800 14px var(--ui)}.hrs>span:first-child{display:flex;gap:5px;align-items:center}.hrs svg{width:18px;height:18px}
.samplenote{margin-top:8px;font:800 12px var(--ui);color:var(--ketchup-dark)}
.sheet .more{margin-top:4px;font:800 13px var(--ui);color:var(--ink-2)}
.hnote{margin-top:6px;font:700 13px var(--ui);color:var(--ink-2)}
.sheet .loc .ln{font:700 12px var(--ui);color:var(--ink-2);margin:0;text-align:left}
#r-src-h{white-space:nowrap}
.srcnote{margin-top:8px;font:700 12px var(--ui);color:var(--ink-2)}.srcnote a{color:inherit}
#s-closed .unl{margin-top:12px;font:700 13px/1.4 var(--ui);color:#C9BFDB;text-align:center}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-weight:800;color:var(--mustard);text-decoration:underline;cursor:pointer}
.sheet .btn.primary{margin-top:12px;font-size:24px}
.three{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px;margin-top:12px}.three .btn{padding:10px 6px;font-size:16px;gap:6px}
.sheet .btn.yellow{margin-top:12px}
.cardad{margin:10px -20px 0;padding-top:8px;border-top:2px dashed #E6DED2;display:flex;justify-content:center}
.fix{margin-top:10px;font:700 12.5px var(--ui);color:var(--ink-2);display:flex;gap:5px;justify-content:center;align-items:center}.fix svg{width:13px;height:13px}
.closebtn{position:absolute;right:12px;top:12px;width:36px;height:36px;border-radius:50%;border:2.5px solid var(--ink);display:grid;place-items:center;background:#fff}
.closebtn svg{width:16px;height:16px}
.confetti-c{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:68}

/* 7 NOTHING OPEN */
#s-closed{background:radial-gradient(circle at 50% 20%,#34245A 0,var(--night) 60%);color:var(--bun)}
.iconbtn.dk{background:transparent;border-color:var(--bun);box-shadow:none;color:var(--bun)}
#s-closed .loc small{color:#C9BFDB}
#s-closed .body{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:4px 22px 0}
.art{position:relative;width:180px;height:160px;display:grid;place-items:center;margin-top:20px}.art .sleepy{transform:rotate(-14deg);opacity:.92;width:150px;height:150px}
.moon{position:absolute;right:-6px;top:-4px}.z{position:absolute;font:700 22px var(--display);color:var(--mustard)}.z1{left:22px;top:18px;font-size:18px}.z2{left:6px;top:-2px;font-size:24px}.z3{left:-14px;top:-26px;font-size:32px}
#s-closed h1{font-size:38px;margin-top:6px;color:#fff}#s-closed .sub{font:700 17px/1.4 var(--ui);color:#DCD3EA;margin-top:8px}#s-closed .sub b{color:var(--mustard)}
.next{width:100%;margin-top:18px;background:rgba(255,255,255,.07);border:2.5px solid rgba(255,246,233,.25);border-radius:22px;padding:12px 14px 4px;text-align:left}
.next .nl{font:800 12px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:#C9BFDB;padding:0 4px 4px}
.next ul{list-style:none}.next li{display:flex;align-items:center;gap:12px;padding:10px 4px;border-top:2px dashed rgba(255,246,233,.15)}.next li:first-child{border-top:0}
.next .e{width:46px;height:46px;border-radius:50%;background:var(--bun);display:grid;place-items:center;flex:none}.next .t{flex:1;display:flex;flex-direction:column;min-width:0}.next .t b{font:600 18px var(--display)}.next .t small{font:700 13px var(--ui);color:#C9BFDB}
.next .tm{text-align:right;font:700 12px/1.2 var(--ui);color:#C9BFDB}.next .tm b{font:600 17px var(--display);color:var(--mustard)}
#s-closed .cta{padding:12px 22px 0;display:flex;flex-direction:column;gap:12px}.btn.ghost{background:transparent;color:var(--bun);border-color:var(--bun);box-shadow:none}
#s-closed .credit{color:#C9D8BE}
#s-closed .sample{background:rgba(0,0,0,.35);color:#C9BFDB}

/* Credits */
#s-credits .body{padding:4px 24px 24px;font:700 15px/1.55 var(--ui);color:var(--ink-2)}
#s-credits h1{font-size:36px;color:var(--ink);margin-bottom:12px}
#s-credits h2{font-size:20px;color:var(--ink);margin:18px 0 4px}
#s-credits a{color:var(--ketchup-dark);font-weight:800}

/* DESKTOP (>=1024px): wheel page per mockup 08; other screens stay a centered column */
@media (min-width:1024px){
  body.on-wheel{background:radial-gradient(circle at 72% 52%,#FFE3A8 0,var(--bun) 48%) fixed}
  #s-wheel{max-width:1440px;min-height:100vh;background:transparent;display:grid;grid-template-columns:minmax(440px,560px) 1fr;grid-template-rows:auto 1fr auto;padding:0 40px 0 90px;column-gap:24px}
  #s-wheel .mob{display:none!important}
  #s-wheel .dsk{display:revert}
  #s-wheel .dhead{grid-column:1/-1;display:flex;align-items:center;gap:22px;padding:18px 0 0 0;margin-left:-50px}
  #s-wheel .dlogo{display:flex;align-items:center;gap:8px;flex:1;text-decoration:none}
  #s-wheel .dlogo .m{width:58px;height:58px}#s-wheel .dlogo .w{height:43px;width:auto}
  #s-wheel .where{display:flex;align-items:center;gap:8px;border:3px solid var(--ink);border-radius:999px;padding:10px 18px;background:#fff;font:600 19px var(--display);box-shadow:0 3px 0 var(--ink)}
  #s-wheel .where svg{width:22px;height:22px;color:var(--ketchup)}
  #s-wheel .where a{font:800 14px var(--ui);color:var(--ketchup-dark);text-decoration:underline;margin-left:6px}
  #s-wheel .left{align-self:center}
  #s-wheel .left h1{font-size:54px;line-height:1}
  #s-wheel .lead{font:700 18px/1.5 var(--ui);color:var(--ink-2);margin:16px 0 18px}
  #s-wheel .grp{margin-top:16px}
  #s-wheel .glbl{font:800 13px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin-bottom:8px}
  #s-wheel .chipwrap{display:flex;flex-wrap:wrap;gap:8px}
  #s-wheel .chipwrap .chip{cursor:pointer}
  #s-wheel .seg{display:inline-flex;border:3px solid var(--ink);border-radius:999px;overflow:hidden;background:#fff}
  #s-wheel .seg button{padding:9px 18px;font:800 15px var(--ui);border-left:2.5px solid var(--ink);color:var(--ink)}
  #s-wheel .seg button:first-child{border-left:0}
  #s-wheel .seg button[aria-pressed="true"]{background:var(--ink);color:#fff}
  #s-wheel .seg button:focus-visible{outline-offset:-5px}
  #s-wheel .drow{display:flex;gap:14px;margin-top:30px}
  #s-wheel .drow .btn{width:auto}
  #s-wheel .drow .btn.spin{font-size:30px;padding:18px 70px}
  #s-wheel .dhint{font:700 14px var(--ui);color:var(--ink-2);margin-top:14px}
  #s-wheel kbd{font:800 12px var(--ui);border:2px solid var(--ink-2);border-radius:6px;padding:1px 6px}
  #s-wheel .wheelzone{grid-column:2;grid-row:2;padding:0}
  #s-wheel .wheelbox{width:min(650px,calc(100vh - 250px),100%);min-width:420px}
  #s-wheel .dfoot{grid-column:1/-1;display:flex;justify-content:center;padding:6px 0 16px;position:relative}
  #s-wheel .dfoot .credit{position:absolute;left:-50px;bottom:6px;padding:0}
  #s-wheel .sample{top:12px}
  #s-wheel .planbar{margin:0 0 8px;display:inline-block}
}
@media (max-width:359px){.ad-320x50,.ad-320x100{transform:scale(.9)}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.sheetwrap.pop{animation:none}}
/* 404 */
.hero.nf{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:30px}
.hero.nf h1{font-size:32px}.hero.nf .btn{width:auto}
[tabindex="-1"]:focus{outline:none}
.sheet .linkbtn{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.sheet .locs{margin-top:16px;text-align:left}
.sheet .locs h3{font:800 16px var(--ui);color:var(--ink);margin:0 0 8px}
.sheet .locs ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sheet .loc{border:2px solid #EDE3D3;border-radius:14px;padding:10px 12px;display:grid;gap:6px}
.sheet .loc.picked{border-color:var(--ink)}
.sheet .loc.closed{opacity:.8}
.sheet .loc .lt{display:flex;justify-content:space-between;gap:8px;font:700 14px var(--ui)}
.sheet .loc .lm{color:var(--ink-2);white-space:nowrap;font-weight:800;font-size:13px}
.sheet .loc .ls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:700 13px var(--ui);color:var(--ink-2)}
.sheet .loc .la{display:flex;gap:8px;padding-bottom:3px}
.sheet .btn.xs{width:auto;flex:1 1 0;min-height:44px;padding:0 12px;font-size:15px;border-width:2px;box-shadow:0 3px 0 var(--ink)}
.sheet .locs{scroll-margin-top:72px}
.sheet .locs h3{scroll-margin-top:72px}
.credit a.spruce{font-weight:800}
.credit a:hover{text-decoration-thickness:2px}
.credit a:focus-visible{outline:2px solid currentColor;outline-offset:2px;border-radius:4px}

/* v1.4 full restaurant list */
.listcta{padding:20px 22px 0;display:flex;justify-content:center}
.btn.listbtn{width:100%;background:#fff}
.btn.listbtn.d{margin-top:16px}
.listwrap{top:calc(14px + env(safe-area-inset-top))}
.listsheet{padding:44px 16px 14px;text-align:left;max-height:calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom));display:flex;flex-direction:column}
.listsheet h2{font-size:32px;padding-right:40px}
.listsheet .meta{font-size:14px;margin-top:4px}
.listsheet .lsearch{margin:12px 0 10px;height:48px;flex:none}
.plist{list-style:none;margin:0;padding:0 2px 4px;display:grid;gap:8px}
.plist button{width:100%;display:flex;align-items:center;gap:12px;text-align:left;background:#fff;border:2px solid #EDE3D3;border-radius:14px;padding:10px 12px;color:var(--ink);cursor:pointer;font:inherit;min-height:56px}
.plist button:hover{border-color:var(--ink)}
.plist .em{width:40px;height:40px;border-radius:50%;background:var(--bun);border:2px solid var(--ink);display:grid;place-items:center;flex:none}
.plist .em img{width:24px;height:24px}
.plist .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.plist .t b{font:600 18px/1.15 var(--display);overflow-wrap:anywhere}
.plist .t small{font:700 13px var(--ui);color:var(--ink-2)}
.plist .s{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex:none}
.plist .s small{font:800 12px var(--ui);color:var(--ink-2);white-space:nowrap}
.plist .closed button{opacity:.8}
.plist .grp{font:800 12px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);padding:8px 4px 0}

/* v1.4.5: release marker read by /js/boot-check.js */
:root{--sb-release:"1.4.5"}
.btn.listbtn.d{width:auto}
