* { box-sizing:border-box }
html { min-width:320px; scroll-behavior:smooth }
[hidden] { display:none!important }
html[data-ui-theme] body.refined {
  --accent:var(--orange-dark); --surface:#fffefa; --soft:color-mix(in srgb,var(--orange) 7%,#fffefa);
  --border:color-mix(in srgb,var(--ink) 11%,#fffefa);
  margin:0; min-height:100dvh; background:#f8f7f3; color:var(--ink);
  font-family:"Malgun Gothic","Apple SD Gothic Neo",system-ui,sans-serif;
  font-size:15px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
html[data-ui-theme="white-cat"] body.refined { --accent:#a64c72 }
html[data-ui-theme="cheese-cat"] body.refined { --accent:#ae512e }
body.refined::before,body.refined::after { display:none }
button,input,select { font:inherit }
button { cursor:pointer; -webkit-tap-highlight-color:transparent }
button:disabled { cursor:default; opacity:.46 }
button:focus-visible,[role="checkbox"]:focus-visible,a:focus-visible,summary:focus-visible { outline:3px solid var(--accent); outline-offset:4px }
h1,h2,h3,p { margin:0 }
h1,h2,h3 { line-height:1.3; letter-spacing:-.055em }
h2 { font-size:clamp(27px,3.1vw,38px); font-weight:800 }
h3 { font-size:20px; font-weight:750 }
.muted { color:var(--muted) }
.topbar { width:min(1080px,calc(100% - 64px)); margin:0 auto; padding:30px 0 23px; display:flex; justify-content:space-between; align-items:center; gap:16px; border-bottom:1px solid var(--border) }
.brand { display:flex; align-items:center; gap:13px }
.brand-mark { display:grid; place-items:center; width:48px; height:48px; border-radius:16px; background:var(--soft); font-size:24px; transform:rotate(-8deg) }
.brand h1 { font-family:"Insung Cutely",sans-serif; font-size:25px; letter-spacing:-.04em }
.brand-dot { color:var(--accent) }
.brand p { font-size:12px; color:var(--muted); margin-top:3px }
.settings-button { border:1px solid var(--border); border-radius:12px; padding:10px 14px; min-height:44px; color:var(--muted); background:transparent; font-size:13px; white-space:nowrap }
.settings-button span { margin-left:8px }
html body.refined #app { width:min(1080px,calc(100% - 64px)); max-width:1080px; margin:0 auto; padding:24px 0 46px }
.mode-nav { display:flex; gap:28px; border-bottom:1px solid var(--border); margin-bottom:18px }
.mode-tab { position:relative; padding:0 2px 17px; min-height:48px; border:0; background:none; color:var(--muted); font-weight:700; font-size:17px }
.mode-tab>span { margin-right:6px; font-size:21px }
.mode-tab.active { color:var(--ink) }
.mode-tab.active::after { content:""; position:absolute; left:0; bottom:-1px; width:100%; height:3px; border-radius:3px; background:var(--accent) }
html body.refined .stepper { display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; width:100%; background:transparent }
html body.refined .step { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:42px; padding:7px 13px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--muted); font-size:13px; font-weight:600; box-shadow:none }
html body.refined .step.active { color:var(--accent); border-color:var(--border); background:var(--surface) }
.step-number { display:grid; place-items:center; width:21px; height:21px; border-radius:50%; background:color-mix(in srgb,var(--ink) 7%,transparent); font-size:11px }
.step.active .step-number { background:var(--accent); color:white }
.page-heading,.hero { margin:28px 0 25px; padding:0; text-align:left }
.section-label { display:block; margin-bottom:7px; color:var(--accent); font-size:12px; font-weight:700; letter-spacing:.025em }
.page-heading p,.hero p { margin-top:11px; color:var(--muted); font-size:14px; line-height:1.8 }
.picker-layout { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:22px; align-items:start }
.surface,.panel,.winner-card,.current-location-card,.restaurant-card { background:var(--surface); border:1px solid var(--border); border-radius:24px; box-shadow:0 6px 22px #30291f04 }
.choices-panel { padding:27px }
.section-heading { display:flex; justify-content:space-between; align-items:center; gap:16px }
.choices-panel>summary { cursor:pointer; list-style:none }
.choices-panel>summary::-webkit-details-marker { display:none }
.disclosure-arrow { display:inline-block; margin-left:8px; font-size:15px; transition:transform .15s }
.choices-panel[open] .disclosure-arrow { transform:rotate(180deg) }
.section-heading .section-label { font-size:11px }
.count-badge { flex:none; border-radius:9px; background:var(--soft); padding:5px 10px; color:var(--accent); font-size:12px; font-weight:700; font-variant-numeric:tabular-nums }
.choice-help { margin:10px 0 21px; font-size:13px; color:var(--muted) }
.paw-viewport { overflow:visible }
.paw-track { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px }
.skin-card { display:flex; align-items:center; gap:9px; position:relative; min-width:0; width:100%; min-height:58px; margin:0; padding:13px 12px; background:white; border:1px solid var(--border); border-radius:13px; color:var(--ink); text-align:left; font-size:14px; font-weight:650; transition:background .15s,border-color .15s,transform .15s }
.skin-card:hover { border-color:var(--accent); background:var(--soft); transform:translateY(-1px) }
.choice-icon { font-size:20px; line-height:1; flex:none }
.choice-icon:empty { display:none }
.choice-label { flex:1; min-width:0; word-break:keep-all; overflow-wrap:anywhere }
.choice-check { display:grid; flex:none; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--soft); color:var(--accent); font-size:11px }
.skin-card.excluded { border-style:dashed; background:#f5f4f1; color:#89847b }
.skin-card.excluded .choice-label { text-decoration:line-through }
.skin-card.excluded .choice-icon { filter:grayscale(1); opacity:.5 }
.skin-card.excluded .choice-check { background:#e9e7e1; color:#756e63 }
.selection-note { display:flex; align-items:center; gap:11px; padding-top:22px; margin-top:24px; border-top:1px solid var(--border) }
.selection-note>span { font-size:21px; opacity:.55 }
.selection-note p { color:var(--muted); font-size:12px; line-height:1.8 }
.wheel-panel { padding:24px 28px 26px; min-width:0; overflow:hidden; background:linear-gradient(155deg,var(--soft),var(--surface) 52%) }
.wheel-heading { display:flex; justify-content:space-between; gap:12px; align-items:center }
.wheel-heading .section-label { margin:0 }
.theme-label { color:var(--muted); font-size:11px }
.picker-wheel-art { padding:13px 12px 0; max-width:450px; margin:0 auto }
.roulette-stage { position:relative; width:100%; aspect-ratio:1; margin:0 auto; padding:25px 27px 19px; isolation:isolate }
.roulette-stage::before { content:""; position:absolute; z-index:-1; inset:12px; border-radius:50%; border:1px solid color-mix(in srgb,var(--accent) 12%,transparent); background:color-mix(in srgb,var(--accent) 3%,white) }
.roulette-stage::after { content:"✧"; position:absolute; right:5%; top:12%; font-size:29px; color:color-mix(in srgb,var(--accent) 35%,white) }
.wheel-wrap { position:relative; z-index:1; width:100%; height:100%; aspect-ratio:1; padding:5px; border:5px solid #fff; border-radius:50%; background:white; box-shadow:0 6px 20px color-mix(in srgb,var(--ink) 12%,transparent); transform-origin:50% 50% }
.wheel-wrap>canvas { display:block; width:100%; height:100%; border-radius:50% }
.pointer { position:absolute; z-index:4; left:50%; top:-8px; transform:translateX(-50%); width:0; height:0; border-left:10px solid transparent; border-right:10px solid transparent; border-top:19px solid var(--ink); filter:drop-shadow(0 2px 1px #ffffff90) }
.cat-meme { position:absolute; z-index:5; isolation:isolate; width:42%; aspect-ratio:var(--cat-aspect,1); left:-2%; bottom:0; pointer-events:none; filter:drop-shadow(0 5px 3px #3d2b1910) }
.cat-layer { position:absolute; inset:0 }
.cat-frames,.cat-fallback { display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:contain }
.cat-atlas-source,.cat-caption,.cat-contact-shadow { display:none!important }
.cat-meme.frames-ready .cat-fallback { display:none }
.wheel-wrap.paw-hit { animation:wheel-paw-recoil 145ms ease-out }
@keyframes wheel-paw-recoil { 38% { transform:translate(calc(-3px * var(--hit-strength,1)),2px) rotate(-.5deg) } }
.picker-result { display:grid; justify-items:center; gap:4px; min-height:76px; padding:10px 0 18px; text-align:center }
.picker-result>span { color:var(--muted); font-size:12px }
.picker-result>strong { font-size:20px; font-family:"Insung Cutely",sans-serif; font-weight:700; color:var(--muted) }
.picker-result.has-result>strong { color:var(--accent); font-size:28px }
.picker-actions { display:grid; gap:9px }
.button { display:inline-flex; justify-content:center; align-items:center; gap:8px; min-height:48px; padding:12px 19px; border:1px solid var(--border); border-radius:13px; background:white; color:var(--ink); font-weight:700; font-size:14px; line-height:1.5; text-decoration:none; transition:background .15s,transform .15s }
.button:hover:not(:disabled) { transform:translateY(-1px) }
body.refined .button.primary { background:var(--accent); color:white; border-color:var(--accent); box-shadow:0 3px 7px color-mix(in srgb,var(--accent) 12%,transparent) }
.button.primary:hover:not(:disabled) { background:color-mix(in srgb,var(--accent) 88%,black) }
body.refined .button.secondary,.button.ghost { background:white; color:var(--ink); border-color:var(--border) }
.button.secondary:disabled { background:#f2f1ec; color:#8f8980; opacity:.7 }
.button.danger { color:#a43e3e }
.button.wide { width:100% }
.empty-hint { text-align:center; color:var(--muted); font-size:13px; margin-top:12px }
#app.is-spinning { pointer-events:none }
.workspace { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:22px; align-items:start }
.panel { min-width:0; padding:26px }
.panel h3 { margin-bottom:20px }
.selection-pill { display:inline-flex; padding:7px 12px; margin-top:15px; border-radius:9px; background:var(--soft); color:var(--accent); font-size:13px; font-weight:700 }
.filter-grid,.manual-location { display:grid; grid-template-columns:1fr 1fr; gap:12px }
.field { display:grid; gap:7px; font-size:13px; color:var(--muted) }
.field input,.field select { width:100%; min-width:0; min-height:48px; border:1px solid var(--border); border-radius:11px; background:white; color:var(--ink); padding:10px 12px; font-size:14px }
.field input:focus,.field select:focus { outline:2px solid var(--accent); outline-offset:2px }
.manual-location { display:none; margin-top:14px }.manual-location.show { display:grid }
.search-details { border-top:1px solid var(--border); margin-top:23px; padding-top:16px; color:var(--muted); font-size:12px }
.search-details summary { cursor:pointer; min-height:28px }.search-details p { padding-top:10px; line-height:1.8 }
.button-row { display:flex; flex-wrap:wrap; gap:9px; margin-top:20px }.button-row .primary { flex:1 }
.notice,.loading { padding:14px; border:1px solid var(--border); border-radius:12px; background:var(--soft); color:var(--muted); font-size:12px; line-height:1.8 }
.notice.error { background:#fff3f1; border-color:#ebc5bd; color:#953f34 }
.loading { display:flex; gap:10px; align-items:center; margin-top:14px }.spinner { width:18px; height:18px; flex:none; border:2px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:spinner .8s linear infinite }@keyframes spinner { to { transform:rotate(360deg) } }
.search-empty { display:grid; place-items:center; text-align:center; padding:46px 12px; gap:12px }.search-empty>span { display:grid; place-items:center; width:72px; height:72px; margin-bottom:8px; border-radius:50%; background:var(--soft); color:var(--accent); font-size:39px }.search-empty h3 { font-size:18px; margin:0 }.search-empty p { font-size:13px }
.cards { display:grid; gap:12px }.restaurant-card { position:relative; padding:17px; border-radius:14px; cursor:pointer }.restaurant-card.excluded { opacity:.55; background:#f0efeb }.check-line { display:flex; align-items:center; gap:9px }.restaurant-card .name { font-size:15px; font-weight:700 }.restaurant-card .meta { margin-top:8px; font-size:12px; color:var(--muted); line-height:1.8 }
.search-query { margin-bottom:16px }
.preview-banner { width:min(1080px,calc(100% - 36px)); margin:18px auto 0; padding:13px 16px; border:1px solid #e0bb76; border-radius:12px; background:#fff4d9; color:#795522; font-size:13px; line-height:1.7 }
.restaurant-facts { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:13px; font-size:12px }
.rating-badge { font-weight:750; color:#8b6024 }.rating-badge small { font-weight:400; font-size:11px; color:var(--muted) }
.business-badge { padding:3px 8px; border-radius:6px; font-size:11px; font-weight:700 }
.business-badge.is-open { color:#286445; background:#eaf4ed }.business-badge.is-closed { color:#8a4d3e; background:#f8ece6 }.business-badge.is-unknown { color:#6c685f; background:#efeee9 }
.distance-badge { color:var(--muted); margin-left:auto; font-size:11px }
.provider-line { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:9px; color:var(--muted); font-size:10px }
.google-attribution { color:#5e5e5e; font:400 12px Arial,sans-serif; font-style:normal; letter-spacing:normal; white-space:nowrap }
.opening-hours { margin-top:13px; padding-top:11px; border-top:1px solid var(--border); font-size:12px; color:var(--muted) }.opening-hours summary { cursor:pointer; padding:4px 0 }.opening-hours ul { list-style:none; margin:9px 0 0; padding:0; display:grid; gap:4px }
.hours-missing { margin-top:10px; color:var(--muted); font-size:11px }.place-attributions { font-size:11px; margin-top:8px }.place-attributions a { color:var(--muted) }
.restaurant-source-link,.settings-guide { display:inline-block; color:var(--accent); font-size:12px; margin-top:12px; text-underline-offset:3px }
.result .restaurant-facts { justify-content:center }.result .distance-badge { margin-left:0 }.result .opening-hours { text-align:left; width:100% }
.restaurant-exclude { accent-color:var(--accent) }.restaurant-card.excluded .name { text-decoration:line-through }.subsection { margin-top:25px; padding-top:22px; border-top:1px solid var(--border) }.store-wheel { max-width:420px; margin:0 auto 15px }.attribution { margin-top:12px; color:var(--muted); font:12px Arial,sans-serif }
.result { margin-top:18px; padding:24px; display:grid; justify-items:center; gap:12px; text-align:center }.winner-kicker { color:var(--accent); font-size:13px }.result>strong { font-size:26px }.result p { color:var(--muted); font-size:13px }.winner-icon { font-size:30px }.search-summary { margin:18px 0 12px; font-size:14px }.current-location-card { padding:17px; margin-top:17px; border-radius:14px }.current-location-heading { display:flex; gap:8px; flex-wrap:wrap; justify-content:space-between; font-size:13px }.current-location-heading>span,.current-coordinates { font-size:11px; color:var(--muted) }.current-address { margin:12px 0 3px; font-size:13px }.current-map { display:block; position:relative; margin:14px 0 }.current-map img { max-width:100%; display:block; border-radius:12px }.current-map-marker { display:none }.current-map-legend { display:grid; gap:5px; margin:13px 0; font-size:12px; color:var(--muted) }.current-map-link { margin-top:12px; font-size:12px }
body.refined .party-page { padding:0; margin:28px 0 0; max-width:none }
body.refined .party-page-title { border:0; background:none; box-shadow:none; padding:0; margin-bottom:25px; gap:13px; align-items:center }
body.refined .party-page-title>span { width:50px; border-radius:15px; background:var(--soft); font-size:25px }
body.refined .party-page-title h2 { font-size:clamp(24px,3vw,34px) }
body.refined .party-page-title p { display:block; font-size:14px; margin-top:8px; line-height:1.8 }
body.refined .themed-panel { background:var(--surface); border:1px solid var(--border); border-radius:24px; box-shadow:0 6px 22px #30291f04 }
body.refined .themed-panel::before,body.refined .themed-panel::after { display:none }
body.refined .party-layout { grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr); gap:22px }
body.refined .party-roster,body.refined .party-game-card { padding:25px }
body.refined .party-game-heading { justify-content:space-between; text-align:left; flex-wrap:wrap; gap:12px }
body.refined .party-game-heading h3,body.refined .party-panel-heading h3 { font-size:18px }
body.refined .party-kicker { display:none }
body.refined .party-status { position:static; max-width:none; background:var(--soft); color:var(--accent); font-size:11px; font-weight:600 }
body.refined .party-count { font-size:12px }.party-count select { min-height:44px }
body.refined .party-name-grid { gap:10px }body.refined .party-name-grid label { border-color:var(--border); border-radius:11px; background:white; min-height:48px }
body.refined .party-name-grid label>span { background:var(--soft); color:var(--accent) }body.refined .party-name-grid input { font-size:14px; font-weight:500; min-height:48px }
body.refined .party-roster-help,body.refined .party-inline-notice,body.refined .wake-instruction { font-size:12px; line-height:1.8 }body.refined .party-inline-notice { background:var(--soft); border:0; margin-top:12px; padding:10px; border-radius:10px }
body.refined .party-main-button { min-height:50px; margin-top:18px }
body.refined .party-winner { background:var(--soft); border:1px solid var(--border); padding:20px; box-shadow:none; border-radius:16px }
body.refined .wake-layout { display:block }body.refined .wake-game-card { width:min(100%,760px) }
body.refined .sleep-scene { box-shadow:none; border:1px solid var(--border); border-radius:20px }.sleep-hotspot { min-width:44px; min-height:44px }
body.refined .casino-table { border-radius:18px; box-shadow:none }
body.refined .casino-cat-sprite { left:-3%; top:-2%; width:40% }
body.refined .party-roster-help { display:block }
body.refined .credit-card-bottom b { font-size:clamp(10px,1.2vw,13px) }
body.refined .card-draw-stage { min-height:435px }
body.refined footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:9px; width:min(1080px,calc(100% - 64px)); margin:0 auto; padding:22px 0 30px; border-top:1px solid var(--border); color:var(--muted); font-size:11px }
dialog { width:min(540px,calc(100% - 28px)); max-height:calc(100dvh - 30px); overflow:auto; padding:0; border:0; border-radius:22px; background:var(--surface); color:var(--ink); box-shadow:0 24px 80px #30291f30 }
dialog::backdrop { background:#29231c55; backdrop-filter:blur(3px) }.dialog-body { display:grid; gap:15px; padding:26px }.dialog-body h2 { font-size:24px }.dialog-body p { font-size:13px; line-height:1.8 }.dialog-actions { display:flex; gap:9px; justify-content:flex-end; flex-wrap:wrap }.eyebrow { color:var(--accent); font-size:11px; margin-bottom:7px }.warning { color:#963d3d }
@media(max-width:760px) {
  .topbar { width:calc(100% - 36px); padding:20px 0 }
  .brand { gap:9px }.brand-mark { width:40px; height:40px; border-radius:13px; font-size:20px }.brand h1 { font-size:22px }.brand p { font-size:10px }.settings-button { padding:8px 10px; font-size:12px }.settings-button span { margin-left:3px }
  html body.refined #app { width:calc(100% - 36px); padding:20px 0 32px }
  .mode-nav { gap:25px; margin-bottom:14px }.mode-tab { font-size:16px; padding-bottom:13px }
  html body.refined .step { padding:7px 10px; font-size:12px; min-height:42px }
  .page-heading,.hero { margin:23px 0 21px }.page-heading p,.hero p { font-size:13px }.section-label { font-size:11px }
  .picker-layout,.workspace { grid-template-columns:1fr; gap:16px }
  .choices-panel { padding:20px }.section-heading h3 { font-size:18px }.choice-help { margin:9px 0 16px; font-size:12px }
  .paw-track { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px }.skin-card { min-height:52px; font-size:13px; padding:12px 10px }.choice-icon { font-size:18px }.selection-note { display:none }
  .wheel-panel { padding:20px }.picker-wheel-art { padding:10px 9px 0; max-width:370px }.theme-label { font-size:10px }.picker-result { padding-top:4px; min-height:70px }
  .button { min-height:50px; font-size:14px }.panel { padding:20px }.filter-grid { grid-template-columns:1fr 1fr }.field { font-size:12px }
  body.refined .party-layout { grid-template-columns:1fr; gap:16px }body.refined .party-roster,body.refined .party-game-card { padding:20px }body.refined .party-name-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px }
  body.refined .party-page-title { gap:10px }.party-page-title>span { flex:none }body.refined .party-page-title h2 { font-size:23px }body.refined .party-page-title p { font-size:12px }
  body.refined .card-draw-stage { min-height:365px }
  body.refined footer { width:calc(100% - 36px); font-size:10px }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto }*,*::before,*::after { transition:none!important; animation-duration:.01ms!important; animation-iteration-count:1!important } }