:root{--bg: #f8fafc;--bg-secondary: #f1f5f9;--surface: #ffffff;--surface-2: #e2e8f0;--border: #cbd5e1;--text: #0f172a;--text-muted: #64748b;--accent: #4f46e5;--accent-hover: #4338ca;--danger: #ef4444;--success: #22c55e;--warning: #f59e0b;--whatif: #f97316;--cell-size: clamp(36px, 7vmin, 60px);--cell-gap: 2px;--border-thick: 3px;--radius: 8px;--radius-lg: 14px;--shadow: 0 2px 8px rgba(0,0,0,.08);--shadow-lg: 0 8px 32px rgba(0,0,0,.12);--transition: .15s ease;color-scheme:light dark;--region-0: hsl(215, 90%, 60%);--region-1: hsl(142, 72%, 50%);--region-2: hsl(38, 95%, 58%);--region-3: hsl(280, 70%, 65%);--region-4: hsl(4, 86%, 62%);--region-5: hsl(172, 66%, 50%);--region-6: hsl(60, 90%, 55%);--region-7: hsl(330, 80%, 65%);--region-8: hsl(200, 80%, 55%);--region-9: hsl(100, 65%, 52%);--region-10: hsl(21, 85%, 62%);--region-11: hsl(247, 68%, 65%);--region-12: hsl(305, 72%, 62%);--region-13: hsl(80, 78%, 48%);--region-14: hsl(163, 62%, 52%)}[data-palette=candy]{--region-0: #FF6B6B;--region-1: #6BCB77;--region-2: #FF9F1C;--region-3: #A855F7;--region-4: #FF85C2;--region-5: #2EC4B6;--region-6: #FFD93D;--region-7: #4D96FF;--region-8: #FF6633;--region-9: #00CC88;--region-10: #FF8C42;--region-11: #7B68EE;--region-12: #FF4DA6;--region-13: #84D832;--region-14: #20C3A0}[data-palette=jewel]{--region-0: #A8C8E8;--region-1: #A0E5C5;--region-2: #FAD5A8;--region-3: #C8A8E0;--region-4: #F5A8A8;--region-5: #A0DDD5;--region-6: #FBF0A0;--region-7: #F5A8D5;--region-8: #B0D4F5;--region-9: #F5C5A8;--region-10: #F5C8A8;--region-11: #B8A8E5;--region-12: #F0A8D5;--region-13: #C8E8A0;--region-14: #A0DCC0}[data-palette=neon]{--region-0: #7B8BFF;--region-1: #45E5B4;--region-2: #FF9F45;--region-3: #D45AFF;--region-4: #FF6B6B;--region-5: #45C5FF;--region-6: #FFE45A;--region-7: #FF6B9D;--region-8: #00E5CC;--region-9: #AAFF45;--region-10: #FF8A45;--region-11: #8A7BFF;--region-12: #FF45B8;--region-13: #AAFF1A;--region-14: #1AFFCC}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg: #0f172a;--bg-secondary: #1e293b;--surface: #1e293b;--surface-2: #334155;--border: #475569;--text: #f1f5f9;--text-muted: #94a3b8;--shadow: 0 2px 8px rgba(0,0,0,.4);--shadow-lg: 0 8px 32px rgba(0,0,0,.5)}}[data-theme=dark]{--bg: #0f172a;--bg-secondary: #1e293b;--surface: #1e293b;--surface-2: #334155;--border: #475569;--text: #f1f5f9;--text-muted: #94a3b8;--shadow: 0 2px 8px rgba(0,0,0,.4);--shadow-lg: 0 8px 32px rgba(0,0,0,.5)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);min-height:100dvh;display:flex;flex-direction:column;transition:background var(--transition),color var(--transition)}#root{display:flex;flex-direction:column;align-items:center;min-height:100dvh;padding:env(safe-area-inset-top,0px) calc(1rem + env(safe-area-inset-right,0px)) calc(2rem + env(safe-area-inset-bottom,0px)) calc(1rem + env(safe-area-inset-left,0px))}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.btn{display:inline-flex;align-items:center;gap:.4em;padding:.45em 1em;border:1.5px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-size:.875rem;font-weight:500;cursor:pointer;transition:background var(--transition),border-color var(--transition),opacity var(--transition);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:hover:not(:disabled){background:var(--surface-2)}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn--primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.btn--danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn--whatif{background:var(--whatif);border-color:var(--whatif);color:#fff}.btn--active{background:var(--accent);border-color:var(--accent);color:#fff}.btn--pill{border-radius:99px;border-color:transparent;background:var(--surface-2)}.btn--pill:hover:not(:disabled){background:var(--border)}.btn--pill.btn--primary{background:var(--accent);color:#fff;border-color:transparent}.btn--pill.btn--primary:hover:not(:disabled){background:var(--accent-hover)}.btn--pill.btn--active{background:var(--accent);color:#fff;border-color:var(--accent)}.btn--pill.btn--active:hover:not(:disabled){background:var(--accent-hover)}.btn--pill.btn--whatif{background:var(--whatif);color:#fff;border-color:transparent}.header{width:100%;max-width:600px;padding:.75rem 0 .25rem}.header--stacked{display:flex;flex-direction:column;gap:.4rem}.header__top{display:flex;align-items:center;justify-content:center}.header__title{display:flex;align-items:baseline;gap:.3em;font-size:1rem;font-weight:500;letter-spacing:-.01em;white-space:nowrap}.header__title-dog{font-size:1.5rem;line-height:1}.header__title-name{font-size:1.5rem;font-weight:500;letter-spacing:-.02em;color:var(--text)}.header__title-sub{font-size:.8rem;font-style:italic;color:var(--text-muted);letter-spacing:0}.header__stat-pill{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--surface-2);border-radius:99px;padding:4px 10px;min-width:0}.header__stat-icons{display:flex;gap:2px;align-items:center}.header__stat-label{font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);line-height:1}.header__life-icon{font-size:1.15rem;line-height:1}.header__dog-counter{font-size:.9rem;font-weight:700;letter-spacing:-.02em;color:var(--text);line-height:1}.header__bone-icon{font-size:.95rem;line-height:1;transition:opacity .3s,filter .3s}.header__meta{display:flex;align-items:center;justify-content:center;gap:.4rem;font-size:.875rem;color:var(--text-muted);flex-wrap:nowrap}.header__meta-sep{width:1px;height:20px;background:var(--border);flex-shrink:0;margin:0 .1rem}.header__level-num{font-size:1rem;font-weight:600;color:var(--text-primary);line-height:1}.header__level-total{font-size:.75rem;font-weight:400;opacity:.55}.diff-label--short{display:none}.diff-label--full{display:inline}.header__diff-btn{border-radius:99px;padding:.25em .7em;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;border:none;cursor:pointer;white-space:nowrap;transition:filter var(--transition)}.header__diff-btn:hover{filter:brightness(.92)}.header__meta-btn{font-size:.8rem;font-weight:700;padding:.35em .7em;line-height:1;min-width:2.4rem;text-align:center}.difficulty--easy{background:#dcfce7;color:#166534}.difficulty--medium{background:#fef9c3;color:#854d0e}.difficulty--hard{background:#fee2e2;color:#991b1b}.difficulty--expert{background:#ede9fe;color:#5b21b6}.difficulty--master{background:#e0f2fe;color:#0c4a6e}.header__diff-wrap{display:inline-flex;align-items:center;border-radius:99px;padding:0 .1rem;font-size:.78rem;font-weight:600;transition:background var(--transition),color var(--transition)}.header__diff-select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;border:none;outline:none;font:inherit;font-size:.78rem;font-weight:600;color:inherit;cursor:pointer;padding:.28rem 1.3rem .28rem .45rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='currentColor'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .45rem center;background-size:8px 5px}.header__diff-select:disabled{cursor:default;opacity:.75}.header__diff-select option{background:var(--surface);color:var(--text);font-weight:600}[data-theme=dark] .difficulty--easy{background:#14532d;color:#86efac}[data-theme=dark] .difficulty--medium{background:#713f12;color:#fde68a}[data-theme=dark] .difficulty--hard{background:#7f1d1d;color:#fca5a5}[data-theme=dark] .difficulty--expert{background:#3b0764;color:#c4b5fd}[data-theme=dark] .difficulty--master{background:#0c1a3a;color:#7dd3fc}@media (prefers-color-scheme: dark){:root:not([data-theme=light]) .difficulty--easy{background:#14532d;color:#86efac}:root:not([data-theme=light]) .difficulty--medium{background:#713f12;color:#fde68a}:root:not([data-theme=light]) .difficulty--hard{background:#7f1d1d;color:#fca5a5}:root:not([data-theme=light]) .difficulty--expert{background:#3b0764;color:#c4b5fd}:root:not([data-theme=light]) .difficulty--master{background:#0c1a3a;color:#7dd3fc}}.board-wrapper{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:600px}.board{display:grid;gap:var(--cell-gap);border:var(--border-thick) solid var(--border);border-radius:var(--radius);background:var(--border);box-shadow:var(--shadow-lg);overflow:hidden;outline:none}.cell{width:var(--cell-size);height:var(--cell-size);position:relative;cursor:pointer;transition:filter var(--transition);display:flex;align-items:center;justify-content:center;font-size:calc(var(--cell-size) * .55);-webkit-user-select:none;user-select:none;touch-action:manipulation;border:2px solid transparent}.cell:hover{filter:brightness(.92)}.cell:active{filter:brightness(.8)}.cell--focused{outline:3px solid var(--accent);outline-offset:-3px;z-index:1}.cell--conflict{outline:3px solid var(--danger);outline-offset:-3px;z-index:1;animation:shake .3s ease}.cell--border-top{border-top-color:var(--text)!important}.cell--border-right{border-right-color:var(--text)!important}.cell--border-bottom{border-bottom-color:var(--text)!important}.cell--border-left{border-left-color:var(--text)!important}.cell__dog{line-height:1;pointer-events:none}.cell--whatif .cell__dog{opacity:.7;filter:sepia(1) saturate(3) hue-rotate(-20deg)}.cell__mark{font-size:calc(var(--cell-size) * .62);font-weight:900;color:#000;pointer-events:none;line-height:1}[data-theme=dark] .cell__mark{color:#fff}@media (prefers-color-scheme: dark){:root:not([data-theme=light]) .cell__mark{color:#fff}}.cell--whatif .cell__mark{color:#b91c1c!important;font-weight:900}.controls{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;width:100%;max-width:600px;padding:.4rem 0}.controls--top{padding-bottom:.25rem;flex-wrap:nowrap}.controls--top .btn--pill{font-size:.8rem;padding:.35em .7em;white-space:nowrap}.controls--bottom{padding-top:.25rem}.generating-banner{width:100%;max-width:600px;padding:.4rem 1rem;background:color-mix(in srgb,var(--accent) 12%,transparent);border:1.5px solid var(--accent);border-radius:var(--radius);color:var(--accent);font-weight:600;font-size:.8rem;text-align:center;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.whatif-banner{width:100%;max-width:600px;padding:.5rem 1rem;background:color-mix(in srgb,var(--whatif) 15%,transparent);border:1.5px solid var(--whatif);border-radius:var(--radius);color:var(--whatif);font-weight:600;font-size:.875rem;text-align:center}.confetti{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:99}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:100;padding:1rem;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:2rem 1.75rem;max-width:380px;width:100%;text-align:center;animation:slideUp .25s ease;max-height:90dvh;overflow-y:auto}@keyframes slideUp{0%{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}.modal__title{font-size:1.5rem;font-weight:700;margin-bottom:.5rem}.modal__subtitle{color:var(--text-muted);font-size:.95rem;margin-bottom:.75rem}.modal__time{font-size:2rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--accent);margin:.75rem 0}.modal__actions{display:flex;flex-direction:column;gap:.6rem;margin-top:1.25rem}.modal__actions .btn{width:100%;justify-content:center;font-size:.95rem;padding:.65em 1.2em}.modal__level-badge{display:inline-block;background:var(--accent);color:#fff;border-radius:99px;padding:.2em .9em;font-size:.8rem;font-weight:700;letter-spacing:.04em;margin-bottom:.75rem}.modal__quote{font-size:.9rem;color:var(--text-muted);font-style:italic;margin:.5rem 0 .25rem;line-height:1.5}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.btn--campaign-active{background:var(--accent);color:#fff;border-color:var(--accent)}.btn--campaign-active:hover{filter:brightness(.9)}.btn--countdown-active{background:color-mix(in srgb,#ef4444 15%,transparent);color:#ef4444;border-color:#ef4444;font-weight:700}.btn--countdown-active:hover{filter:brightness(.92)}.btn--music-active{background:color-mix(in srgb,#8b5cf6 15%,transparent);color:#8b5cf6;border-color:#8b5cf6;font-weight:700}.btn--music-active:hover{filter:brightness(.92)}.header__countdown{display:flex;align-items:center;gap:.3em;background:color-mix(in srgb,#22c55e 12%,transparent);border:1.5px solid #22c55e;border-radius:99px;padding:.2em .75em;font-size:.8rem;font-weight:700;color:#16a34a;letter-spacing:.03em;white-space:nowrap;transition:background .3s,border-color .3s,color .3s}.header__countdown--urgent{background:color-mix(in srgb,#f59e0b 12%,transparent);border-color:#f59e0b;color:#b45309}.header__countdown--warning{background:color-mix(in srgb,#ef4444 12%,transparent);border-color:#ef4444;color:#dc2626}.header__countdown--critical{background:color-mix(in srgb,#ef4444 18%,transparent);border-color:#ef4444;color:#ef4444;animation:countdown-pulse .7s ease-in-out infinite}.header__countdown-icon{font-size:.9em}.header__countdown-time{font-variant-numeric:tabular-nums}@keyframes countdown-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.75;transform:scale(1.04)}}.header__level-timer-sep{font-size:.7rem;color:var(--border);margin:0 .2em;line-height:1}.header__level-time{font-size:.85rem;font-weight:700;font-variant-numeric:tabular-nums;color:#16a34a;line-height:1;transition:color .3s}.header__level-time--urgent{color:#b45309}.header__level-time--warning{color:#c2410c}.header__level-time--critical{color:#ef4444;animation:countdown-pulse .7s ease-in-out infinite}.header__progress-bar{width:100%;height:3px;background:var(--surface-2);overflow:hidden}.header__progress-fill{height:100%;background:#22c55e;transition:width .8s linear,background .4s;border-radius:0 2px 2px 0}.header__progress-fill--urgent{background:#f59e0b}.header__progress-fill--warning{background:#f97316}.header__progress-fill--critical{background:#ef4444;animation:countdown-pulse .7s ease-in-out infinite}@media (max-width: 520px){:root{--cell-size: clamp(24px, 8vw, 48px);--cell-gap: 1px;--border-thick: 2px}#root{padding-left:calc(.5rem + env(safe-area-inset-left,0px));padding-right:calc(.5rem + env(safe-area-inset-right,0px));padding-bottom:calc(1rem + env(safe-area-inset-bottom,0px));padding-top:calc(.25rem + env(safe-area-inset-top,0px))}.header__title-dog,.header__title-name{font-size:1.2rem}.header__title-sub{font-size:.7rem}.header{padding:.4rem 0 .2rem}.header__meta{flex-wrap:wrap;gap:.25rem;justify-content:center}.header__stat-pill{padding:3px 6px}.header__life-icon{font-size:1rem}.header__bone-icon{font-size:.85rem}.header__stat-label{font-size:.58rem}.header__level-time{font-size:.75rem}.diff-label--full{display:none}.diff-label--short{display:inline}.header__meta-btn{font-size:.75rem;padding:.3em .55em;min-width:2rem}.header__diff-btn{font-size:.7rem;padding:.2em .55em}.btn__label{display:none}.btn__icon{font-size:1.15em;line-height:1}.controls--top{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;justify-content:center;gap:.3rem;padding:.3rem .25rem}.controls--top::-webkit-scrollbar{display:none}.controls--bottom{flex-wrap:nowrap;gap:.3rem}.controls--top .btn--pill,.controls--bottom .btn--pill{padding:.45em .6em;min-width:2.2rem;min-height:2.2rem;justify-content:center;flex-shrink:0}.btn{min-height:38px}.board-wrapper{gap:.45rem}.whatif-banner,.generating-banner{font-size:.8rem;padding:.35rem .75rem}.modal{padding:1.25rem 1rem}.modal__title{font-size:1.25rem}}@media (max-width: 375px){.header__stat-pill{padding:2px 5px}.header__life-icon{font-size:.9rem}.header__bone-icon{font-size:.75rem}.header__title-dog,.header__title-name{font-size:1rem}.controls--top .btn--pill,.controls--bottom .btn--pill{padding:.4em .5em;min-width:2rem;min-height:2rem;font-size:.8rem}}@media (max-height: 500px) and (orientation: landscape){.header--stacked{gap:.15rem}.header__top{display:none}#root{padding-top:.15rem;padding-bottom:.5rem}.board-wrapper{gap:.3rem}.controls--top,.controls--bottom{padding:.15rem 0}}.level-select-modal{max-width:min(580px,96vw);padding:1.25rem 1rem;text-align:center;overflow-y:visible}.level-select-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:.3rem;max-height:min(70vh,480px);overflow-y:auto;overscroll-behavior:contain;padding:.15rem .1rem}.level-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.3rem .15rem;border:2px solid transparent;border-radius:var(--radius);cursor:pointer;transition:transform var(--transition),filter var(--transition);gap:2px;min-height:0;background:var(--surface-2)}.level-card:hover{transform:scale(1.07);filter:brightness(.95)}.level-card:active{transform:scale(.96)}.level-card--current{border-color:var(--accent)!important;outline:2px solid var(--accent);outline-offset:1px}.level-card__dot{position:absolute;top:3px;left:3px;width:6px;height:6px;border-radius:50%}.level-card__num{font-size:.95rem;font-weight:700;line-height:1}.level-select-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem .9rem;margin-top:.6rem;font-size:.73rem;color:var(--text-muted)}.level-select-legend__item{display:flex;align-items:center;gap:.28rem}.level-select-legend__dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}@media (max-width: 600px){.level-select-modal{max-width:98vw;padding:.85rem .5rem}.level-select-grid{grid-template-columns:repeat(5,1fr);gap:.2rem}.level-card{padding:.2rem .1rem}.level-card__num{font-size:.8rem}}
