/* Sun Deck: cream enamel, warm timber, lagoon water, coral service accents. */
:root{color-scheme:light;--ink:#173f49;--muted:#587579;--lagoon:#087e88;--coral:#d94f38;--paper:#fffcf3;--edge:#dae7e2;--shadow:0 12px 32px #16424b16}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse at 10% 0,#cfeeed,transparent 55%),#f1f7f3;color:var(--ink);font-family:ui-rounded,'Aptos','Segoe UI',system-ui,sans-serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
button,a,input{touch-action:manipulation}
button{font:inherit;cursor:pointer;color:inherit;min-height:48px;border:0}
button:disabled{cursor:default;opacity:.6}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #075eff;outline-offset:4px}
button:active:not(:disabled){transform:translateY(2px)}
a{color:var(--lagoon)}
h1,h2,h3,p{margin:0}
.game-shell{max-width:620px;margin:0 auto;padding:0 20px max(20px,env(safe-area-inset-bottom))}
.masthead{display:flex;align-items:center;justify-content:space-between;padding:20px 0 18px}
.wordmark{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-size:18px;font-weight:900;letter-spacing:.025em;line-height:1.1}
.wordmark small{display:block;font-size:8px;letter-spacing:.2em;margin-top:6px;color:var(--muted)}
.brand-sun{color:#e8a03d;font-size:34px;line-height:1}
.icon-button{background:#ffffffb3;border:1px solid var(--edge);border-radius:16px;min-width:48px;font-size:24px;line-height:1}
.icon-button span{display:block;font-size:8px;font-weight:800;letter-spacing:.1em;margin-top:3px}
.eyebrow{font-size:10px;letter-spacing:.18em;font-weight:900;text-transform:uppercase;color:var(--lagoon)}
.primary,.secondary{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;border-radius:16px;padding:15px 18px;font-weight:800;font-size:16px;min-height:54px}
.primary{background:linear-gradient(#f07951,#df593a);color:#fff;box-shadow:0 4px 0 #b7412a,0 9px 18px #cb60302a;text-shadow:0 1px 1px #92311940}
.secondary{background:#edf6f2;border:1px solid #cfdfd8;color:#245b60;box-shadow:0 2px 0 #cbded7}
.text-button{background:transparent;text-decoration:underline;text-underline-offset:4px;font-size:13px;font-weight:700;padding:8px 12px}
.hero-card{position:relative;overflow:hidden;border-radius:28px;background:#d9ece7;box-shadow:var(--shadow);border:1px solid #fff}
.hero-art{display:block;width:100%;aspect-ratio:1.5;object-fit:cover}
.hero-ribbon{position:absolute;top:17px;left:17px;background:#fffcf0eb;border:1px solid #fff9;border-radius:999px;padding:8px 12px;font-size:9px;font-weight:900;letter-spacing:.12em;box-shadow:0 3px 8px #17434a1a}
.hero-copy{position:relative;background:var(--paper);padding:23px 25px 25px;text-align:center}
.hero-copy h1{font-size:clamp(31px,6vw,44px);line-height:1.02;letter-spacing:-.045em;font-weight:900;margin:7px 0 12px}
.hero-copy h1 em{color:var(--lagoon);font-style:normal}
.hero-copy p{color:var(--muted);font-size:14px;line-height:1.55;max-width:350px;margin:0 auto 20px}
.play-meta{display:flex;justify-content:center;gap:15px;font-size:11px;color:var(--muted);margin-top:16px}
.home-links{display:flex;justify-content:center;margin:10px 0 5px}
.how-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:15px 0 22px}
.how-strip>div{background:#ffffffad;border:1px solid #fff;border-radius:18px;padding:15px 8px;text-align:center;font-size:11px;color:var(--muted);line-height:1.45}
.how-strip b{display:block;font-size:13px;margin-bottom:4px;color:var(--ink)}
.how-strip .number{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;margin:0 auto 8px;background:#d6ece5;color:#18716b;font-weight:900}
.publisher{text-align:center;font-size:11px;line-height:1.7;color:#42666b;margin:20px 0 10px}
.publisher span{font-size:9px;letter-spacing:.04em;color:#648083}
.notice{padding:12px 15px;border-radius:14px;background:#fff4d7;color:#6d531a;font-size:13px;line-height:1.5;margin:10px 0}
.resume-card{padding:17px;border-radius:20px;background:var(--paper);border:1px solid var(--edge);margin-bottom:16px}
.resume-card p{font-size:13px;color:var(--muted);margin:6px 0 12px}
.round-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.round-heading h1{font-size:22px;letter-spacing:-.04em;margin-top:3px}
.round-heading .icon-button{font-size:18px}
.hud{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:10px}
.hud>div{background:#fffdf6;border:1px solid #fff;border-radius:17px;padding:9px 12px;text-align:center;box-shadow:0 3px 12px #17434a06}
.hud small{display:block;font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;margin-bottom:2px}
.hud strong{font-variant-numeric:tabular-nums;font-size:23px;letter-spacing:-.03em}
.hud .time-warning{color:#bf422e}
.round-progress{height:5px;border-radius:6px;background:#c7ded7;margin:0 5px 13px;overflow:hidden}
.round-progress>span{display:block;height:100%;background:#229b98;border-radius:6px;transition:width .2s linear}
.deck-scene{position:relative;isolation:isolate;overflow:hidden;border-radius:23px;border:5px solid #fff9;background:#e9c99c;box-shadow:0 5px 0 #bdd6cf,var(--shadow)}
.pool{height:63px;position:relative;overflow:hidden;background:linear-gradient(160deg,#6be5e4,#24b2c7);border:7px solid #e5f1e9;border-top:0;border-bottom:9px solid #fff9;border-radius:0 0 30px 30px;margin:0 12px;box-shadow:inset 0 5px 8px #08758938,0 4px 3px #9b6f4620}
.pool:before,.pool:after{content:'';position:absolute;inset:-40px;background:repeating-radial-gradient(ellipse at 35% 50%,transparent 0 16px,#ffffff25 18px 20px,transparent 23px 43px);transform:rotate(-12deg);animation:water 12s ease-in-out infinite alternate}
.pool:after{transform:rotate(30deg);opacity:.5;animation-delay:-5s}
.pool-ring{position:absolute;top:14px;right:22%;width:30px;height:30px;border:9px solid #ff9676;border-radius:50%;box-shadow:2px 4px 2px #087b8640;transform:rotateX(30deg);z-index:1}
.pool-label{position:absolute;left:17px;top:19px;color:#086c7e;font-size:9px;font-weight:900;letter-spacing:.19em;z-index:1}
.deck-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px 2px;padding:16px 7px 14px;background:repeating-linear-gradient(0deg,#bc925730 0 1px,transparent 1px 26px),linear-gradient(100deg,#f2d7b2,#e8bd8c)}
.chair{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:0;padding:4px 0 5px;border-radius:16px;background:transparent;transition:background .18s,box-shadow .18s}
.chair .sprite{width:100%;aspect-ratio:1;filter:drop-shadow(1px 5px 2px #61462d25)}
.chair-content{display:block;width:100%}
.practice-board>.sprite{width:150px;height:150px}
.sprite{display:block;background-image:url('../art/resort/atlas.webp');background-size:400% 200%;background-repeat:no-repeat;flex-shrink:0}
.s-open{background-position:0 0}.s-towel{background-position:33.333333% 0}.s-occupied{background-position:66.666667% 0}.s-hog{background-position:100% 0}
.s-guest{background-position:0 100%}.s-vip{background-position:33.333333% 100%}.s-steve{background-position:66.666667% 100%}.s-attendant{background-position:100% 100%}
.s-sunburn-steve,.s-the-rotator,.s-family-fleet,.s-speed-hog{background-image:url('../art/resort/hogs.webp')}
.s-sunburn-steve{background-position:0 0}.s-the-rotator{background-position:33.333333% 0}.s-family-fleet{background-position:66.666667% 0}.s-speed-hog{background-position:100% 0}
.cast{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:10px 0 20px}.cast .sprite{width:100%;aspect-ratio:1;background-position-y:100%}.cast>div{text-align:center;min-width:0}.cast b{font-size:9px;display:block;margin:7px 0 4px}.cast small{font-size:9px;color:var(--muted);line-height:1.3;display:block}.cast-title{text-align:center;margin-top:20px}
.chair-status{position:relative;margin-top:0;border-radius:8px;padding:4px 6px;min-width:54px;font-size:10px;line-height:1.1;font-weight:850;white-space:nowrap;color:#31574e;background:#fffbedd9;box-shadow:0 2px 3px #8e61361a}
.chair.towel .chair-status{background:#fff1dc;color:#925022}
.chair.tagged .chair-status{background:#e7f4ff;color:#145681}
.chair.expired .chair-status{background:#147565;color:#fff}
.chair.hog .chair-status{background:#c7513e;color:#fff}
.chair.occupied .chair-status{background:#d9ebd8;color:#345b38}
.chair.expired{background:#ffffff60;box-shadow:inset 0 0 0 2px #398c71;animation:ready 2s ease-in-out infinite}
.chair.eligible{background:#f9fff4a8;box-shadow:inset 0 0 0 2px #278379}
.chair.preferred{box-shadow:inset 0 0 0 3px #278379,0 0 10px #fff9}
.shade-mark{position:absolute;left:2px;top:0;font-size:9px;font-weight:800;background:#346c61;color:white;border-radius:6px;padding:3px 5px;z-index:1}
.timer-badge{position:absolute;right:0;top:4px;width:29px;height:29px;display:grid;place-items:center;border:3px solid #fff;border-radius:50%;background:#237fa2;color:white;font-size:12px;font-weight:850;z-index:2;box-shadow:0 2px 5px #16424b25}
.hog-mark{position:absolute;right:2px;top:1px;border-radius:50%;width:24px;height:24px;background:#c7513e;color:#fff;font-weight:900;display:grid;place-items:center}
.deck-caption{display:flex;justify-content:space-between;align-items:center;padding:7px 13px;background:#f8e5c7;color:#85663d;font-size:8px;letter-spacing:.11em;font-weight:800}
.feed{min-height:40px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:12px;line-height:1.35;padding:9px 4px;color:#35676b}
.feed.urgent{color:#a13827;font-weight:700}
.queue-panel{background:#fffcf3;border:1px solid #fff;border-radius:22px;padding:12px;box-shadow:var(--shadow)}
.queue-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.queue-title h2{font-size:14px}.queue-title span{font-size:10px;color:var(--muted)}
.queue{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;min-height:94px}
.guest{border-radius:14px;background:#f0f3e8;border:2px solid transparent;min-width:0;position:relative;padding:4px;display:flex;align-items:center;flex-direction:column}
.guest .sprite{width:55px;max-width:100%;aspect-ratio:1}
.guest-name{font-size:9px;font-weight:800;white-space:nowrap;line-height:1.5}
.patience{display:block;height:4px;width:100%;border-radius:3px;background:#d1ddd3;overflow:hidden;margin-top:4px}
.patience i{display:block;height:100%;background:#398f73;border-radius:3px;transition:width .2s linear}
.guest.low .patience i{background:#c3523d}.guest.low{background:#fbe5d7}
.guest.selected{border-color:#167d79;background:#d9eee4;box-shadow:0 3px 0 #bdd6cc}
.guest.paused:after{content:'COOLING';position:absolute;top:0;left:0;right:0;background:#d9f0ef;color:#1f6e7e;font-size:7px;font-weight:900;border-radius:10px 10px 0 0;padding:3px}
.queue-empty{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:12px;color:#657c70;font-size:12px}
.queue-empty .sprite{width:68px;height:68px;opacity:.8}
.tools{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:11px}
.tool{display:flex;align-items:center;justify-content:space-between;gap:6px;background:#edf6f2;border:1px solid #ccddd7;border-radius:13px;padding:9px 12px;min-height:49px}
.tool b{font-size:12px}.tool small{display:block;font-size:9px;color:#4f6f6b;margin-top:3px}.tool>strong{font-size:21px;color:var(--lagoon)}
.tool.passive{cursor:default}
.event{padding:10px 15px;border-radius:14px;background:#fff0c9;color:#705315;font-size:12px;font-weight:700;margin:0 0 10px;border:1px solid #eedb9a}
.event:empty{display:none}
.float-reward{position:absolute;left:50%;top:20%;z-index:4;pointer-events:none;color:#fff;font-size:24px;font-weight:900;text-shadow:0 2px 3px #0c6758;animation:reward .9s ease-out forwards}
.chair.just-tagged .sprite{animation:stamp .3s ease-out}.chair.just-cleared .sprite{animation:clear .45s ease-out}.chair.just-seated .sprite{animation:seat .4s ease-out}
.recap{background:var(--paper);border:1px solid #fff;border-radius:26px;overflow:hidden;box-shadow:var(--shadow);text-align:center}
.recap-top{padding:22px 22px 18px;background:radial-gradient(ellipse at 50% 100%,#c8e9d8,#eaf6e8 75%);position:relative}
.recap-top .sprite{width:115px;height:115px;margin:auto}
.recap h1{font-size:31px;letter-spacing:-.04em;margin:8px 0}
.recap-score{font-size:66px;line-height:1;font-weight:900;letter-spacing:-.06em;margin:8px 0 5px;color:#127875}
.recap-top small{font-size:10px;letter-spacing:.18em;font-weight:800;color:#487969}
.best{font-size:12px;font-weight:800;color:#82551a;margin-top:13px}
.recap-body{padding:19px 22px 23px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
.stats b{display:block;font-size:24px;margin-bottom:4px}.stats span{font-size:10px;color:var(--muted)}
.recap-tip{font-size:13px;color:var(--muted);line-height:1.55;margin:15px 0 20px}
.recap .secondary{margin-top:13px}.save-note{font-size:11px;line-height:1.5;color:var(--muted);margin:14px 0 0}
.platform{margin:18px 0;background:var(--paper);border:1px solid var(--edge);border-radius:18px;padding:16px;font-size:13px}.platform summary{cursor:pointer;font-weight:800;min-height:30px}.platform button{margin:6px 0}.platform p{margin:10px 0;line-height:1.5}
.platform{--fg-page-bg:#fffcf3;--fg-page-text:#173f49;--fg-surface-bg:#fffcf3;--fg-surface-text:#173f49;--fg-control-bg:#edf6f2;--fg-control-text:#173f49;--fg-link-text:#087e88}
.cast{background:#fffcf3;border-radius:20px;padding:12px}.cast-title{color:#18786e}
.practice{background:var(--paper);padding:24px;border-radius:26px;text-align:center;box-shadow:var(--shadow)}
.practice h1{font-size:27px;letter-spacing:-.035em;margin:10px 0}.practice p{font-size:14px;color:var(--muted);line-height:1.55;min-height:45px}
.practice-board{display:flex;justify-content:center;align-items:center;gap:25px;background:linear-gradient(#f3ddbc,#e8c493);border-radius:20px;margin:20px 0;padding:20px;min-height:210px}
.practice-board .chair{width:130px}.practice-board .guest{width:85px;min-height:98px}.practice-board .guest .sprite{width:65px}
.practice-steps{display:flex;gap:5px;justify-content:center;margin:15px 0}.practice-steps span{width:25px;height:5px;background:#d9e4dc;border-radius:4px}.practice-steps .done{background:#268b7b}
dialog{border:1px solid #fff;border-radius:26px;background:var(--paper);color:var(--ink);max-width:360px;width:calc(100% - 36px);padding:28px;box-shadow:0 25px 90px #073e4855;text-align:center}
dialog::backdrop{background:#143d48a1;backdrop-filter:blur(5px)}
dialog h2{font-size:28px;letter-spacing:-.04em;margin:10px 0}dialog p{font-size:14px;color:var(--muted);line-height:1.55;margin:12px 0 22px}dialog .sprite{height:100px;width:100px;margin:auto}dialog .secondary{margin-top:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.loading{text-align:center;padding:80px 20px}.loading p{margin-top:15px}
@keyframes water{to{translate:18px 8px}}
@keyframes ready{50%{background:#ffffff95}}
@keyframes stamp{50%{transform:scale(.9) rotate(-3deg)}}
@keyframes seat{50%{transform:translateY(-5px)}}
@keyframes clear{from{transform:translateY(-10px);opacity:.4}to{transform:none;opacity:1}}
@keyframes reward{to{transform:translate(-50%,-45px);opacity:0}}
@media(min-width:650px){.game-shell{padding-top:12px}.deck-grid{gap:10px 6px;padding:18px 15px}.chair .sprite{max-width:125px}.chair-status{font-size:11px}.queue{min-height:110px}.guest .sprite{width:70px}.hero-art{max-height:300px}.hero-copy{padding:25px 40px 30px}}
@media(max-width:400px){.game-shell{padding-left:12px;padding-right:12px}.masthead{padding:13px 0}.wordmark{font-size:16px}.hero-copy{padding:19px}.hero-copy h1{font-size:31px}.hero-copy p{font-size:13px;margin-bottom:15px}.deck-grid{padding:12px 4px 10px}.chair-status{font-size:9px;min-width:47px;padding:4px}.shade-mark{font-size:7px;padding:3px}.queue-panel{padding:10px}.queue{gap:5px}.guest-name{font-size:8px}.round-heading{margin-bottom:9px}.hud strong{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.float-reward{opacity:1}}
@media(max-width:600px) and (max-height:780px){.masthead{padding:8px 0}.round-heading{margin-bottom:6px}.round-heading h1{font-size:20px}.hud>div{padding:6px 9px}.pool{height:40px}.pool-label{top:11px}.pool-ring{top:7px;width:24px;height:24px;border-width:7px}.deck-grid{padding-top:9px;padding-bottom:8px;row-gap:4px}.feed{min-height:32px;padding:6px 2px;font-size:11px}.queue{min-height:82px}.queue-title{margin-bottom:6px}.guest .sprite{width:48px}.tools{margin-top:8px}.queue-panel{padding:9px}}
@media(prefers-color-scheme:dark){body:not(.embed){background:radial-gradient(ellipse at 20% 0,#214e54,transparent 60%),#153238}body:not(.embed) .wordmark,body:not(.embed) .round-heading,body:not(.embed) .publisher{color:#e1eee7}body:not(.embed) .wordmark small,body:not(.embed) .publisher span{color:#b6ceca}body:not(.embed) .feed{color:#d2e7dd}body:not(.embed) .feed.urgent{color:#ffb8a2}body:not(.embed) .round-heading .eyebrow{color:#8dd8ca}}
body[data-theme="dark"]{background:#153238}body[data-theme="dark"] .wordmark,body[data-theme="dark"] .round-heading,body[data-theme="dark"] .publisher,body[data-theme="dark"] .feed{color:#e1eee7}body[data-theme="dark"] .wordmark small,body[data-theme="dark"] .publisher span,body[data-theme="dark"] .round-heading .eyebrow{color:#a7d8cd}
body[data-theme="dark"] .home-links .text-button,body[data-theme="dark"] .cast-title{color:#a7d8cd}
@media(prefers-color-scheme:dark){body:not(.embed) .home-links .text-button,body:not(.embed) .cast-title{color:#a7d8cd}}
.embed .masthead{padding-top:12px}.embed .publisher{display:none}
.audio-settings{display:grid;gap:10px;margin:0 0 18px;text-align:left}.audio-channel{display:grid;gap:4px;font-size:13px;font-weight:700;color:var(--muted)}.audio-channel input{width:100%;min-height:32px;accent-color:currentColor}.audio-note{font-weight:400;font-size:12px}