@import "https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700;9..144,800&family=Inter:wght@400;500;600;700&display=swap";:root{--bg-page:#f6f1e8;--bg-surface:#fbf7ee;--bg-surface-hover:#f1ead9;--bg-canvas:#fcf9f1;--color-text-primary:#1b1714;--color-text-body:#3f3933;--color-text-secondary:#6e665c;--color-text-muted:#a29a8e;--color-accent:#b14a2b;--color-accent-hover:#983e22;--color-accent-soft:#e0b59e;--color-accent-rgb:177, 74, 43;--color-shape:#1b1714;--color-draw:#b14a2b;--color-danger:#b14a2b;--color-success:#4f6b4a;--color-border:#e4dcc9;--color-border-light:#d6cbb3;--color-rule:#1b1714;--bg-streak:transparent;--color-streak-text:#6e665c;--bg-percentile:transparent;--color-percentile:#4f6b4a;--color-backdrop:#1b171466;--shadow-card:0 1px 0 #1b17140a, 0 6px 16px -8px #1b17141a;--shadow-button:none;--shadow-button-hover:0 4px 14px -4px rgba(var(--color-accent-rgb), .35);--radius-sm:4px;--radius-md:6px;--radius-lg:10px;--radius-full:9999px;--font-serif:"Fraunces", "Iowan Old Style", "Georgia", serif;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark]{--bg-page:#14110e;--bg-surface:#1c1814;--bg-surface-hover:#25201b;--bg-canvas:#1c1814;--color-text-primary:#f2eade;--color-text-body:#c9c0b2;--color-text-secondary:#948b7e;--color-text-muted:#635c53;--color-accent:#d86a47;--color-accent-hover:#e58361;--color-accent-soft:#5c3322;--color-accent-rgb:216, 106, 71;--color-shape:#f2eade;--color-draw:#d86a47;--color-danger:#d86a47;--color-success:#8aa98a;--color-border:#2d2823;--color-border-light:#3d3730;--color-rule:#f2eade;--bg-streak:transparent;--color-streak-text:#948b7e;--bg-percentile:transparent;--color-percentile:#8aa98a;--color-backdrop:#000000a6;--shadow-card:0 1px 0 #0000004d, 0 8px 20px -10px #00000080;--shadow-button:none;--shadow-button-hover:0 4px 14px -4px rgba(var(--color-accent-rgb), .45);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--bg-page);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}.app{min-height:100vh;padding:28px 20px 40px;padding-top:max(28px, env(safe-area-inset-top));padding-bottom:max(40px, env(safe-area-inset-bottom));flex-direction:column;align-items:center;display:flex}.header{border-bottom:1px solid var(--color-border);width:100%;max-width:540px;margin-bottom:36px;padding-bottom:18px}.header-row{grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;display:grid}.header-left{justify-self:start;gap:6px;display:flex}.header-right{justify-self:end;align-items:center;gap:12px;display:flex}.title{font-family:var(--font-serif);letter-spacing:-.02em;color:var(--color-text-primary);font-variation-settings:"opsz" 144, "SOFT" 50;font-size:38px;font-style:italic;font-weight:600;line-height:1}.subtitle{text-align:center;color:var(--color-text-secondary);letter-spacing:.18em;text-transform:uppercase;margin-top:6px;font-size:11px}.btn-icon{border-radius:var(--radius-full);border:1px solid var(--color-border);width:32px;height:32px;color:var(--color-text-secondary);cursor:pointer;transition:background .2s var(--ease-out), color .2s var(--ease-out), border-color .2s var(--ease-out);background:0 0;justify-content:center;align-items:center;font-size:13px;font-weight:600;display:inline-flex}.btn-icon:hover{background:var(--bg-surface-hover);color:var(--color-text-primary);border-color:var(--color-text-muted)}.streak-badge{font-family:var(--font-serif);color:var(--color-text-secondary);align-items:baseline;gap:4px;font-size:15px;font-style:italic;font-weight:600;display:inline-flex}.streak-badge-num{color:var(--color-accent);font-weight:700}.streak-badge-label{font-family:var(--font-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--color-text-muted);font-size:10px;font-style:normal;font-weight:600}.game-container{flex-direction:column;align-items:center;width:100%;max-width:540px;display:flex;position:relative}.phase-content{width:100%;animation:phaseEnter .45s var(--ease-out) both;flex-direction:column;align-items:center;gap:24px;display:flex}@keyframes phaseEnter{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.splash{text-align:center;padding:8px 0 4px}.splash-eyebrow{letter-spacing:.22em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:14px;font-size:11px}.splash-day{font-family:var(--font-serif);letter-spacing:-.04em;color:var(--color-text-primary);font-variation-settings:"opsz" 144;font-size:84px;font-weight:600;line-height:.92}.splash-day-hash{color:var(--color-text-muted);margin-right:.04em;font-weight:400}.splash-date{font-family:var(--font-serif);color:var(--color-text-secondary);margin-top:14px;font-size:17px;font-style:italic;font-weight:400}.splash-rule{background:var(--color-border-light);border:none;width:64px;height:1px;margin:28px auto 24px}.instruction{font-family:var(--font-serif);text-align:center;color:var(--color-text-body);max-width:380px;margin:0 auto;font-size:19px;font-style:italic;font-weight:400;line-height:1.45}.btn-primary{font-family:var(--font-sans);letter-spacing:.28em;text-transform:uppercase;border:1px solid var(--color-text-primary);border-radius:var(--radius-full);background:var(--color-text-primary);color:var(--bg-page);cursor:pointer;box-shadow:var(--shadow-button);transition:background .2s var(--ease-out), color .2s var(--ease-out), border-color .2s var(--ease-out), transform .15s var(--ease-out);padding:14px 44px;font-size:13px;font-weight:600}.btn-primary:hover{background:var(--color-accent);border-color:var(--color-accent)}.btn-primary:active{transform:scale(.985)}.btn-primary:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}.splash-stats{justify-content:center;gap:28px;margin-top:4px;display:flex}.stat-item{flex-direction:column;align-items:center;display:flex}.stat-value{font-family:var(--font-serif);color:var(--color-text-primary);font-variant-numeric:tabular-nums;font-size:26px;font-weight:600;line-height:1}.stat-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.18em;margin-top:6px;font-size:10px}.countdown-text{font-family:var(--font-serif);color:var(--color-text-secondary);font-size:19px;font-style:italic;font-weight:400}.countdown-number{font-family:var(--font-serif);color:var(--color-text-primary);font-variant-numeric:tabular-nums;font-variation-settings:"opsz" 144;animation:countdownTick 1s var(--ease-out);font-size:128px;font-weight:600;line-height:1}@keyframes countdownTick{0%{opacity:0;transform:scale(.96)}20%{opacity:1;transform:scale(1)}to{opacity:.92;transform:scale(1)}}.transition-text{font-family:var(--font-serif);color:var(--color-accent);animation:fadeInUp .45s var(--ease-out);letter-spacing:-.01em;font-size:32px;font-style:italic;font-weight:600}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.scoring-text{font-family:var(--font-serif);color:var(--color-text-secondary);font-size:18px;font-style:italic;font-weight:400;animation:1.6s ease-in-out infinite breathe}@keyframes breathe{0%,to{opacity:.5}50%{opacity:1}}.game-canvas{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--bg-canvas);box-shadow:var(--shadow-card)}.drawing-canvas{touch-action:none;cursor:crosshair;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.drawing-wrapper{flex-direction:column;align-items:center;gap:16px;display:flex}.drawing-controls{gap:10px;display:flex}.btn-clear,.btn-done{font-family:var(--font-sans);letter-spacing:.16em;text-transform:uppercase;border-radius:var(--radius-full);cursor:pointer;transition:background .2s var(--ease-out), color .2s var(--ease-out), border-color .2s var(--ease-out);padding:9px 22px;font-size:12px;font-weight:600}.btn-clear{border:1px solid var(--color-border-light);color:var(--color-text-secondary);background:0 0}.btn-clear:hover{border-color:var(--color-text-muted);color:var(--color-text-primary)}.btn-done{border:1px solid var(--color-text-primary);background:var(--color-text-primary);color:var(--bg-page)}.btn-done:hover{background:var(--color-accent);border-color:var(--color-accent)}.timer-bar{width:100%;max-width:500px}.timer-label{letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted);text-align:center;margin-bottom:8px;font-size:10px;font-weight:600}.timer-track{background:var(--color-border);border-radius:2px;width:100%;height:2px;overflow:hidden}.timer-fill{background:var(--color-text-primary);height:100%;transition:width .1s linear, background .4s var(--ease-out);border-radius:2px}.timer-fill--low{background:var(--color-accent)}.timer-seconds{font-family:var(--font-serif);text-align:center;font-variant-numeric:tabular-nums;color:var(--color-text-primary);letter-spacing:-.01em;margin-top:8px;font-size:22px;font-weight:600}.score-reveal{text-align:center;padding:8px 0;position:relative}.score-reveal-number{font-family:var(--font-serif);color:var(--color-text-primary);font-variant-numeric:tabular-nums;letter-spacing:-.04em;font-variation-settings:"opsz" 144;font-size:108px;font-weight:600;line-height:.95}.score-reveal-denom{font-family:var(--font-serif);color:var(--color-text-muted);margin-left:4px;font-size:32px;font-style:italic;font-weight:400}.score-reveal-label{letter-spacing:.22em;text-transform:uppercase;color:var(--color-text-muted);margin-top:14px;font-size:10px;font-weight:600}.score-reveal-stars{letter-spacing:8px;color:var(--color-accent);margin-top:18px;font-size:22px}.score-star{opacity:.18;transition:opacity .4s var(--ease-out), transform .5s var(--ease-out);display:inline-block}.score-star-filled{opacity:1;animation:starFade .5s var(--ease-out)}@keyframes starFade{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.score-reveal-message{font-family:var(--font-serif);color:var(--color-text-primary);animation:fadeInUp .4s var(--ease-out);margin-top:18px;font-size:22px;font-style:italic;font-weight:500}.results-screen{position:relative}.results-info{flex-wrap:wrap;justify-content:center;align-items:center;gap:18px;margin-top:4px;display:flex}.difficulty-badge,.shape-type-badge{letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-secondary);background:0 0;padding:0;font-size:10px;font-weight:600}.difficulty-badge strong,.shape-type-badge strong{color:var(--color-text-primary);margin-left:4px;font-weight:700}.results-info-divider{background:var(--color-text-muted);border-radius:50%;width:2px;height:2px}.percentile-badge{font-family:var(--font-serif);color:var(--color-text-body);animation:fadeInUp .4s var(--ease-out);background:0 0;padding:0;font-size:16px;font-style:italic;font-weight:500}.percentile-badge strong{color:var(--color-accent);font-style:normal;font-weight:700;font-family:var(--font-sans)}.player-count{color:var(--color-text-muted);font-size:12px;font-style:normal;font-family:var(--font-sans);letter-spacing:.04em;margin-left:6px;font-weight:500}.mode-banner{border:1px solid var(--color-border);border-radius:var(--radius-full);animation:fadeInUp .35s var(--ease-out);background:0 0;align-items:baseline;gap:10px;margin-bottom:-4px;padding:6px 14px;display:inline-flex}.mode-banner-tag{letter-spacing:.22em;text-transform:uppercase;color:var(--color-accent);font-size:10px;font-weight:700}.mode-banner-note{font-family:var(--font-serif);color:var(--color-text-secondary);font-size:13px;font-style:italic}.results-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:4px;display:flex}.results-actions-sep{background:var(--color-text-muted);border-radius:50%;width:2px;height:2px;display:inline-block}.btn-ghost{font-family:var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--color-text-secondary);cursor:pointer;transition:color .2s var(--ease-out), border-color .2s var(--ease-out);background:0 0;border:none;border-bottom:1px solid #0000;padding:4px 2px;font-size:11px;font-weight:600}.btn-ghost:hover{color:var(--color-accent);border-bottom-color:var(--color-accent)}.btn-ghost:focus-visible{color:var(--color-accent);border-bottom-color:var(--color-accent);outline:none}.heatmap-legend{letter-spacing:.18em;text-transform:uppercase;color:var(--color-text-muted);align-items:center;gap:10px;margin-top:-4px;font-size:10px;font-weight:600;display:flex}.heatmap-legend-bar{background:linear-gradient(to right, var(--color-shape) 0%, var(--color-draw) 100%);border-radius:2px;width:88px;height:3px;display:block}.scorecard{border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);flex-direction:column;gap:10px;width:100%;max-width:360px;padding:18px 4px 16px;display:flex}.scorecard-row{letter-spacing:.16em;text-transform:uppercase;color:var(--color-text-secondary);align-items:baseline;gap:10px;font-size:11px;font-weight:600;display:flex}.scorecard-label{white-space:nowrap}.scorecard-dots{border-bottom:1px dotted var(--color-border-light);flex:1;min-width:16px;transform:translateY(-3px)}.scorecard-value{font-family:var(--font-serif);letter-spacing:-.01em;text-transform:none;color:var(--color-text-primary);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:22px;font-style:italic;font-weight:600;line-height:1}.scorecard-unit{font-family:var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-muted);margin-left:4px;font-size:10px;font-style:normal;font-weight:600}.scorecard-note{font-family:var(--font-serif);color:var(--color-text-secondary);text-align:center;border-top:1px dotted var(--color-border-light);margin-top:4px;padding-top:10px;font-size:13px;line-height:1.5}.btn-share{letter-spacing:.24em;padding:12px 42px;font-size:12px}.next-shape-timer{letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted);font-variant-numeric:tabular-nums;font-size:11px;font-weight:600}.next-shape-timer strong{color:var(--color-text-secondary);margin-left:6px;font-weight:700}.confetti-canvas{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.modal-backdrop{background:var(--color-backdrop);z-index:100;animation:fadeIn .2s var(--ease-out);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--bg-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border);width:calc(100% - 32px);max-width:420px;box-shadow:var(--shadow-card);animation:modalSlideUp .3s var(--ease-out);padding:36px 36px 32px;position:relative}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.modal-close{color:var(--color-text-muted);cursor:pointer;transition:color .2s var(--ease-out);background:0 0;border:none;font-size:24px;line-height:1;position:absolute;top:14px;right:16px}.modal-close:hover{color:var(--color-text-primary)}.modal-title{font-family:var(--font-serif);color:var(--color-text-primary);letter-spacing:-.01em;margin-bottom:24px;font-size:26px;font-style:italic;font-weight:600}.modal-body{flex-direction:column;gap:18px;display:flex}.how-to-step{align-items:flex-start;gap:14px;display:flex}.how-to-number{width:24px;height:24px;font-family:var(--font-serif);color:var(--color-accent);flex-shrink:0;justify-content:center;align-items:center;margin-top:-1px;font-size:16px;font-style:italic;font-weight:600;display:flex}.how-to-step p{color:var(--color-text-body);margin-top:2px;font-size:14px;line-height:1.55}.how-to-step p strong{color:var(--color-text-primary);font-weight:600}.how-to-divider{background:var(--color-border);height:1px;margin:4px 0}.how-to-note{font-family:var(--font-serif);color:var(--color-text-secondary);text-align:center;font-size:14px;font-style:italic;line-height:1.55}@media (width<=480px){.app{padding:20px 16px 32px}.title{font-size:30px}.header{margin-bottom:24px;padding-bottom:14px}.splash-day{font-size:68px}.btn-primary{padding:13px 36px;font-size:12px}.countdown-number{font-size:96px}.score-reveal-number{font-size:84px}.score-reveal-denom{font-size:26px}.modal{padding:28px 24px 24px}}@media (height<=700px){.header{margin-bottom:18px}.phase-content{gap:18px}.splash-day{font-size:64px}.splash-rule{margin:20px auto 16px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}