:root{color-scheme:dark;--page-bg: #08111f;--panel: rgba(7, 14, 27, .74);--panel-strong: rgba(7, 14, 27, .88);--panel-border: rgba(255, 221, 170, .28);--text: #f8ecd4;--text-soft: rgba(248, 236, 212, .74);--gold: #f7c873;--gold-strong: #ffdc95;--rose: #ff7e9e;--rose-soft: rgba(255, 126, 158, .18);--navy: #122340;--success: #b6f584;--danger: #ff7f75;--shadow: 0 24px 70px rgba(0, 0, 0, .45);--radius-xl: 28px;--radius-lg: 18px;--radius-md: 14px;--font-display: "Georgia", "Times New Roman", serif;--font-body: "Trebuchet MS", "Gill Sans", sans-serif;--df-safe-top: env(safe-area-inset-top, 0px);--df-safe-right: env(safe-area-inset-right, 0px);--df-safe-bottom: env(safe-area-inset-bottom, 0px);--df-safe-left: env(safe-area-inset-left, 0px)}*{box-sizing:border-box}html,body,#root{min-height:100%;height:100%}body{margin:0;background:radial-gradient(circle at top,rgba(247,200,115,.14),transparent 32%),linear-gradient(180deg,#12203b,#08111f 58%,#050a14);color:var(--text);font-family:var(--font-body);overflow-x:hidden}button,input{font:inherit;-webkit-tap-highlight-color:transparent}.df-shell{--df-shell-height: 100dvh;--df-shell-width: 100vw;display:flex;align-items:center;justify-content:center;min-height:100%;min-height:100dvh;padding:calc(16px + var(--df-safe-top)) calc(16px + var(--df-safe-right)) calc(16px + var(--df-safe-bottom)) calc(16px + var(--df-safe-left));background:radial-gradient(circle at top,rgba(247,200,115,.08),transparent 34%),linear-gradient(180deg,#040912d6,#0409127a);isolation:isolate;overscroll-behavior:contain}.df-frame{position:relative;width:min(100%,1280px);margin:0 auto;border:1px solid rgba(255,221,170,.12);border-radius:34px;overflow:hidden;background:linear-gradient(180deg,#040912eb,#040912b8);box-shadow:var(--shadow)}.df-canvas-wrap{position:relative;block-size:clamp(560px,calc(var(--df-shell-height) - 36px - var(--df-safe-top) - var(--df-safe-bottom)),860px);min-height:520px;background:#040913}.df-canvas{display:block;width:100%;height:100%;touch-action:none;-webkit-user-select:none;user-select:none}.df-overlay{position:absolute;inset:0;pointer-events:none}.df-topbar{position:absolute;top:18px;left:18px;right:18px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;pointer-events:none}.df-hud{display:flex;flex-wrap:wrap;gap:12px}.df-card,.df-feedback,.df-bottom-note,.df-modal,.df-landing,.df-results{border:1px solid var(--panel-border);background:var(--panel);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.df-hud{width:100%;justify-content:center}.df-topbar-round .df-hud{gap:8px}.df-card{min-width:96px;padding:8px 12px;border-radius:var(--radius-md);text-align:left}.df-card-label{display:block;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-soft)}.df-card-value{display:block;margin-top:3px;font-size:1.18rem;font-weight:700;color:#fff;line-height:1.05}.df-card-sub{display:block;margin-top:2px;font-size:.7rem;color:var(--gold)}.df-card-value-compact{font-size:.94rem}.df-card-party{min-width:122px}.df-card-timer{min-width:82px}.df-feedback{position:absolute;top:94px;left:50%;transform:translate(-50%);padding:8px 14px;border-radius:999px;font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;pointer-events:none}.df-feedback-perfect{color:var(--gold-strong)}.df-feedback-good{color:var(--success)}.df-feedback-miss{color:var(--danger)}.df-feedback-hint{color:var(--gold-strong)}.df-bottom-note{position:absolute;left:18px;right:18px;bottom:12px;display:flex;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:var(--radius-md);font-size:.78rem;line-height:1.2;color:var(--text-soft)}.df-bottom-note-tip,.df-bottom-note-track{display:block}.df-bottom-note-track{text-align:right}.df-center{position:absolute;inset:0;display:grid;place-items:center;padding:20px}.df-landing,.df-results,.df-modal{pointer-events:auto;border-radius:var(--radius-xl);box-shadow:var(--shadow)}.df-landing,.df-results{width:min(416px,100%);max-height:calc(100% - 8px);padding:20px 20px 18px;overflow:auto}.df-eyebrow{display:inline-block;margin-bottom:12px;color:var(--gold-strong);letter-spacing:.14em;text-transform:uppercase;font-size:.78rem}.df-heading{margin:0;font-family:var(--font-display);font-size:clamp(2.2rem,4vw,3.6rem);line-height:.95}.df-select-heading{margin:0;font-family:var(--font-display);font-size:clamp(2rem,3.6vw,2.7rem);line-height:.98}.df-copy{margin:12px 0 0;color:var(--text-soft);line-height:1.45}.df-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}.df-button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;padding:14px 22px;cursor:pointer;font:inherit;text-align:center;text-decoration:none;transition:transform .12s ease,opacity .12s ease}.df-button:hover{transform:translateY(-1px)}.df-button-primary{background:linear-gradient(135deg,#ff7b8d,#f7c873);color:#190d16;font-weight:800}.df-button-secondary{background:#ffffff14;color:var(--text)}.df-meta{margin-top:16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.df-meta-item{padding:10px 12px;background:#ffffff0a;border-radius:var(--radius-md)}.df-meta-item-wide{grid-column:1 / -1}.df-meta-item strong{display:block;font-size:1.05rem;color:#fff}.df-meta-item span{display:block;margin-top:4px;font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-soft)}.df-select-panel{width:min(470px,100%)}.df-choice-grid{display:grid;gap:12px;margin-top:18px}.df-choice-grid-compact{grid-template-columns:repeat(2,minmax(0,1fr))}.df-choice-card{border:1px solid var(--panel-border);border-radius:22px;padding:16px 16px 15px;background:#ffffff0b;color:var(--text);text-align:left;cursor:pointer;transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease,background .12s ease}.df-choice-card:hover{transform:translateY(-1px)}.df-choice-card strong,.df-choice-card span{display:block}.df-choice-card strong{font-size:1.14rem;color:#fff}.df-choice-card span:last-child{margin-top:6px;font-size:.88rem;line-height:1.35;color:var(--text-soft)}.df-choice-eyebrow{margin-bottom:8px;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-strong)}.df-choice-card-robert{background:linear-gradient(180deg,#26395a80,#0a1220b8)}.df-choice-card-robert:hover{border-color:#95c9ff73;box-shadow:0 16px 32px #10214247}.df-choice-card-natalie{background:linear-gradient(180deg,#5c214485,#1a0c1abd)}.df-choice-card-natalie:hover{border-color:#ffa5c673;box-shadow:0 16px 32px #47122c47}.df-choice-card-quick:hover,.df-choice-card-extended:hover{border-color:#ffddaa7a}.df-choice-card-extended{background:linear-gradient(180deg,#4532128a,#120c07b8)}.df-team-chip{display:inline-flex;align-items:center;justify-content:center;margin-top:14px;padding:8px 14px;border-radius:999px;background:#ffffff12;color:var(--gold-strong);font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.df-modal-backdrop{position:absolute;inset:0;display:grid;place-items:center;padding:32px;background:#03081299;pointer-events:auto}.df-modal{width:min(480px,100%);padding:28px}.df-modal-leaderboard{width:min(560px,100%);max-height:calc(100% - 16px);overflow:auto}.df-modal h2,.df-results h2{margin:0;font-family:var(--font-display);font-size:2rem}.df-leaderboard-panel{display:grid;gap:18px}.df-leaderboard-header{display:grid;gap:8px}.df-leaderboard-header h2{margin:0}.df-leaderboard-header p,.df-leaderboard-empty{margin:0;color:var(--text-soft);line-height:1.45}.df-leaderboard-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}.df-leaderboard-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--radius-md);background:#ffffff0d}.df-leaderboard-rank{color:var(--gold-strong);font-weight:800;font-size:.9rem}.df-leaderboard-copy{display:grid;gap:3px;min-width:0}.df-leaderboard-copy strong,.df-leaderboard-copy span{overflow-wrap:anywhere}.df-leaderboard-copy strong{color:#fff}.df-leaderboard-copy span{color:var(--text-soft);font-size:.8rem}.df-leaderboard-score{color:var(--gold-strong);font-weight:800;font-variant-numeric:tabular-nums}.df-list{margin:18px 0 0;padding:0;list-style:none;display:grid;gap:12px}.df-list li{padding:12px 14px;border-radius:var(--radius-md);background:#ffffff0a;color:var(--text-soft)}.df-countdown{text-align:center;pointer-events:none}.df-countdown strong{display:block;font-size:clamp(4rem,12vw,7rem);line-height:1;color:#fff}.df-countdown span{display:block;margin-top:10px;color:var(--gold-strong);letter-spacing:.12em;text-transform:uppercase}.df-results-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}.df-results-setup{display:flex;flex-wrap:wrap;gap:8px;margin:-2px 0 12px}.df-results-setup span{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;background:#ffffff0f;color:var(--gold-strong);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}.df-results-stat{padding:12px 14px;border-radius:var(--radius-md);background:#ffffff0a}.df-results-stat span{display:block;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-soft)}.df-results-stat strong{display:block;margin-top:4px;font-size:1.05rem;color:#fff}.df-results .df-actions{margin-top:18px}.df-score-save{margin-top:18px;padding:14px;border-radius:var(--radius-md);background:#ffffff0a}.df-score-save h3{margin:0;font-size:1rem;color:#fff}.df-score-field{display:grid;gap:8px;margin-top:14px}.df-score-field span{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-soft)}.df-score-field input{width:100%;border:1px solid rgba(255,221,170,.2);border-radius:14px;padding:12px 14px;background:#060c18cc;color:#fff}.df-score-field input::placeholder{color:#f8ecd466}.df-score-save-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.df-score-save-meta span{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;background:#ffffff0f;color:var(--gold-strong);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase}.df-score-status{margin:12px 0 0;font-size:.84rem;color:var(--text-soft)}.df-score-status-success{color:var(--success)}.df-score-status-error{color:var(--danger)}.df-results .df-button{flex:1 1 calc(50% - 12px);min-width:0;padding:12px 16px;text-align:center}.df-touch-lanes{position:absolute;left:24px;right:24px;bottom:82px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;pointer-events:auto}.df-touch-button{border:1px solid rgba(255,221,170,.32);border-radius:18px;min-height:60px;background:linear-gradient(180deg,#0c1526e0,#0a111db8);color:var(--text);box-shadow:0 12px 28px #00000038;touch-action:manipulation;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease,background .12s ease}.df-touch-button:active{transform:translateY(1px) scale(.99)}.df-touch-button span{display:block;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.df-touch-button-good{border-color:#b6f584e6;background:linear-gradient(180deg,#294d24f5,#132f18e0);box-shadow:0 0 0 1px #b6f58429,0 12px 28px #1a4c1f57;color:#f5ffe8;transform:translateY(-1px)}.df-touch-button-perfect{border-color:#ffddaafa;background:linear-gradient(180deg,#7a581afa,#57390eeb);box-shadow:0 0 0 1px #ffddaa2e,0 16px 34px #7a581a66;color:#fff7df;transform:translateY(-1px) scale(1.01);animation:df-touch-celebrate .22s ease}.df-touch-button-miss{border-color:#ff7f75eb;background:linear-gradient(180deg,#681f21f2,#3e1115e6);box-shadow:0 0 0 1px #ff7f7529,0 12px 28px #53181b57;color:#ffefec;animation:df-touch-warning .22s ease}@keyframes df-touch-celebrate{0%{transform:translateY(0) scale(.98)}60%{transform:translateY(-2px) scale(1.03)}to{transform:translateY(-1px) scale(1.01)}}@keyframes df-touch-warning{0%{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}to{transform:translate(0)}}.df-pause-modal{width:min(460px,100%)}.df-keyboard-hint{position:absolute;top:100px;right:24px;display:grid;gap:4px;width:min(220px,calc(100% - 48px));padding:12px 14px;border:1px solid rgba(255,221,170,.24);border-radius:var(--radius-md);background:#070e1bb3;color:var(--text-soft);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:none}.df-keyboard-hint span{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}.df-keyboard-hint strong{color:#fff;font-size:.96rem}.df-shell-compact .df-canvas-wrap{block-size:clamp(620px,calc(var(--df-shell-height) - 28px - var(--df-safe-top) - var(--df-safe-bottom)),940px)}.df-shell-short .df-canvas-wrap{block-size:clamp(460px,calc(var(--df-shell-height) - 20px - var(--df-safe-top) - var(--df-safe-bottom)),760px)}.df-shell-landscape.df-shell-short .df-canvas-wrap{block-size:clamp(400px,calc(var(--df-shell-height) - 16px - var(--df-safe-top) - var(--df-safe-bottom)),620px)}.df-shell-short .df-topbar,.df-shell-compact .df-topbar,.df-shell-landscape .df-topbar{top:14px;left:14px;right:14px}.df-shell-compact .df-center,.df-shell-short .df-center,.df-shell-landscape .df-center{padding:14px}.df-shell-short .df-feedback,.df-shell-landscape .df-feedback{top:92px}.df-shell-short .df-card,.df-shell-landscape .df-card{padding:8px 12px}.df-shell-short .df-card-value,.df-shell-landscape .df-card-value{font-size:1.2rem}.df-shell-short .df-touch-lanes,.df-shell-landscape .df-touch-lanes{left:14px;right:14px;bottom:74px}.df-shell-short .df-touch-button,.df-shell-landscape .df-touch-button{min-height:54px}.df-shell-short .df-bottom-note,.df-shell-landscape .df-bottom-note{left:14px;right:14px;bottom:10px;padding:8px 10px;font-size:.74rem}.df-shell-narrow .df-bottom-note{flex-direction:column;align-items:flex-start}.df-shell-narrow .df-bottom-note-track{text-align:left}.df-shell-compact .df-results,.df-shell-short .df-results,.df-shell-landscape .df-results{width:min(392px,100%);max-height:calc(100% - 8px);padding:18px;overflow:auto}.df-shell-compact .df-results h2,.df-shell-short .df-results h2,.df-shell-landscape .df-results h2{font-size:1.55rem}.df-shell-compact .df-results-grid,.df-shell-short .df-results-grid,.df-shell-landscape .df-results-grid{gap:10px}.df-shell-compact .df-results-stat,.df-shell-short .df-results-stat,.df-shell-landscape .df-results-stat{padding:10px 12px}.df-shell-wide .df-canvas-wrap{block-size:clamp(640px,calc(var(--df-shell-height) - 36px - var(--df-safe-top) - var(--df-safe-bottom)),860px)}.df-shell-wide .df-landing{width:min(720px,100%)}.df-shell-wide .df-select-panel{width:min(760px,100%)}.df-shell-wide .df-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.df-shell-wide .df-results{width:min(760px,100%);padding:24px}.df-shell-wide .df-results-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.df-shell-wide .df-score-save{max-width:520px}.df-shell-wide .df-touch-lanes{left:50%;right:auto;bottom:66px;width:min(560px,calc(100% - 48px));transform:translate(-50%);gap:8px}.df-shell-wide .df-touch-button{min-height:44px;border-radius:14px;font-size:.78rem}.df-shell-wide .df-bottom-note{left:50%;right:auto;width:min(620px,calc(100% - 48px));transform:translate(-50%)}@media(max-width:860px){.df-shell{padding:calc(12px + var(--df-safe-top)) calc(12px + var(--df-safe-right)) calc(12px + var(--df-safe-bottom)) calc(12px + var(--df-safe-left))}.df-frame{border-radius:24px}.df-canvas-wrap{block-size:clamp(620px,calc(var(--df-shell-height) - 24px - var(--df-safe-top) - var(--df-safe-bottom)),940px)}.df-topbar{top:12px;left:12px;right:12px}.df-card{min-width:0;flex:1 1 calc(25% - 12px)}.df-landing .df-button-primary{flex-basis:100%}.df-landing .df-button-secondary{flex:1 1 calc(50% - 12px)}.df-modal-backdrop{padding:14px}.df-modal-leaderboard{padding:20px}.df-leaderboard-item{grid-template-columns:auto minmax(0,1fr)}.df-leaderboard-score{grid-column:2;justify-self:start}.df-bottom-note{flex-direction:column;align-items:flex-start;bottom:12px}.df-bottom-note-track{text-align:left}.df-results-grid,.df-meta{grid-template-columns:repeat(2,minmax(0,1fr))}.df-choice-grid-compact{grid-template-columns:1fr}.df-touch-lanes{left:18px;right:18px;bottom:88px;gap:8px}.df-touch-button{min-height:64px}.df-results{width:min(392px,100%);max-height:calc(100% - 8px);padding:18px;overflow:auto}}@media(max-height:760px){.df-canvas-wrap{block-size:clamp(440px,calc(var(--df-shell-height) - 16px - var(--df-safe-top) - var(--df-safe-bottom)),700px)}.df-topbar{top:12px;left:12px;right:12px}.df-results{max-height:calc(100% - 8px);padding:18px}}
