:root{font-family:ui-rounded,SF Pro Rounded,Avenir Next,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--ink);background:var(--page);color-scheme:light;--page: #f4ead8;--page-deep: #d8bfa0;--surface: #fffaf0;--surface-glass: rgb(255 250 240 / 92%);--ink: #3e3028;--muted: #7e685a;--outline: #5c4638;--scene-wall: #f5d9b8;--scene-wall-shadow: #d8b28c;--wood: #bc8060;--wood-dark: #704638;--cream: #fff6df;--coral: #d96c5f;--sage: #728d70;--sky: #87b6c5;--gold: #edb94f;--night: #4c5364;--ring: #fffaf0;--ring-shadow: #d94d47;--shadow: rgb(77 47 31 / 18%)}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-width:320px;min-height:100vh;min-height:100svh;overflow-x:hidden;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button{font:inherit}.app-shell{position:relative;min-height:100vh;min-height:100svh;display:flex;justify-content:center;align-items:flex-start;padding:max(54px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(22px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));overflow:hidden;isolation:isolate;background:radial-gradient(circle at 16% 8%,var(--surface) 0 8%,transparent 24%),linear-gradient(155deg,var(--page),var(--page-deep))}.app-shell:before,.app-shell:after{content:"";position:absolute;z-index:-1;width:180px;height:180px;border:1px solid var(--surface-glass);border-radius:50%}.app-shell:before{top:-92px;left:-84px}.app-shell:after{right:-118px;bottom:8%}.palette-1{--coral: #b6675e;--sage: #68856e;--sky: #7aabbc;--gold: #e7ad4c}.palette-2{--coral: #cf735a;--sage: #789071;--sky: #78adba;--gold: #e8b657}.scene-stack{width:min(100%,370px);display:grid;grid-template-rows:auto 48px auto;align-items:center;gap:8px}.scene-card{width:100%;overflow:hidden;border:1px solid var(--outline);border-radius:22px;background:var(--scene-wall);box-shadow:0 10px 24px var(--shadow)}.cozy-scene{display:block;width:100%;height:auto;touch-action:manipulation;-webkit-user-select:none;user-select:none}.difference-hit{cursor:pointer;outline:none}.hit-feedback{fill:var(--ring);opacity:0;transition:opacity 90ms ease-out}.difference-hit:active .hit-feedback,.difference-hit:focus-visible .hit-feedback{opacity:.18}.found-ring{fill:none;stroke:var(--ring);stroke-width:5;paint-order:stroke;filter:drop-shadow(0 1px 0 var(--ring-shadow)) drop-shadow(0 0 3px var(--ring-shadow));pointer-events:none;transform-box:fill-box;transform-origin:center;animation:ring-pop .48s cubic-bezier(.18,.88,.24,1.2) both}.hint-ring{fill:var(--ring);fill-opacity:.08;stroke:var(--ring);stroke-width:5;stroke-dasharray:7 7;filter:drop-shadow(0 1px 0 var(--ring-shadow));pointer-events:none;transform-box:fill-box;transform-origin:center;animation:hint-pulse .72s ease-in-out infinite alternate}.wrong-marker{pointer-events:none;transform-box:fill-box;transform-origin:center;animation:wrong-shake .36s ease-out both}.wrong-marker circle{fill:var(--cream);fill-opacity:.34;stroke:var(--outline);stroke-width:2.5}.wrong-marker path{fill:none;stroke:var(--outline);stroke-width:2.5;stroke-linecap:round}.progress-rail{justify-self:center;width:132px;min-height:48px;display:flex;align-items:center;justify-content:center;gap:10px;margin:0;padding:0 16px;border:1px solid var(--outline);border-radius:999px;color:var(--ink);background:var(--surface-glass);box-shadow:0 5px 14px var(--shadow);cursor:pointer;touch-action:manipulation;transition:transform .12s ease,background-color .12s ease}.progress-rail:active{transform:scale(.97);background:var(--surface)}.progress-rail:focus-visible,.share-button:focus-visible{outline:3px solid var(--ring-shadow);outline-offset:2px}.progress-dot{width:12px;height:12px;flex:0 0 12px;border:1px solid var(--outline);border-radius:50%;background:transparent;transition:transform .22s cubic-bezier(.18,.88,.24,1.25),background-color .16s ease}.progress-dot.is-found{background:var(--coral);transform:scale(1.12)}.result-layer{position:fixed;z-index:10;inset:0;display:grid;place-items:end center;padding:24px max(18px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:#3e302842;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:result-fade .28s ease-out both}.result-card{width:min(100%,356px);display:grid;justify-items:center;padding:28px 24px 22px;border:1px solid var(--outline);border-radius:28px;color:var(--ink);background:var(--surface);box-shadow:0 20px 52px #3e302847;animation:card-rise .36s cubic-bezier(.18,.88,.24,1.08) both}.result-searches{display:grid;grid-template-columns:repeat(5,34px);gap:5px;font-size:24px;line-height:32px}.result-score{margin:14px 0 0;font-size:30px;font-weight:800;line-height:38px;letter-spacing:.02em}.result-streak{margin:2px 0 18px;color:var(--muted);font-size:18px;font-weight:700;line-height:26px}.share-button{min-width:160px;min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 20px;border:1px solid var(--outline);border-radius:16px;color:var(--surface);background:var(--coral);box-shadow:0 6px 0 var(--wood-dark);cursor:pointer;transition:transform .11s ease,box-shadow .11s ease}.share-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.share-button span{font-size:17px;font-weight:800;line-height:24px}.share-button:active{transform:translateY(4px);box-shadow:0 2px 0 var(--wood-dark)}@keyframes ring-pop{0%{opacity:0;transform:scale(.55)}58%{opacity:1;transform:scale(1.12)}to{opacity:1;transform:scale(1)}}@keyframes hint-pulse{0%{opacity:.35;transform:scale(.92)}to{opacity:1;transform:scale(1.12)}}@keyframes wrong-shake{0%,to{opacity:0;transform:translate(0)}18%,80%{opacity:.82}28%{transform:translate(-5px)}48%{transform:translate(4px)}66%{transform:translate(-2px)}}@keyframes result-fade{0%{opacity:0}to{opacity:1}}@keyframes card-rise{0%{opacity:0;transform:translateY(28px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes ring-fade{0%{opacity:0}to{opacity:1}}@keyframes hint-fade{0%{opacity:0}to{opacity:.8}}@keyframes wrong-fade{0%,to{opacity:0}50%{opacity:.78}}@media(max-height:700px){.app-shell{padding-top:max(50px,env(safe-area-inset-top))}.scene-stack{width:min(100%,302px);grid-template-rows:auto 44px auto;gap:5px}.progress-rail{min-height:44px}}@media(min-width:700px)and (min-aspect-ratio:5 / 4)and (max-aspect-ratio:23 / 9){.app-shell{align-items:center;padding:22px}.scene-stack{width:min(100%,820px);grid-template-columns:1fr 52px 1fr;grid-template-rows:auto}.progress-rail{width:48px;min-height:132px;flex-direction:column;padding:16px 0}}@media(prefers-color-scheme:dark){:root{color-scheme:dark;--page: #2e2827;--page-deep: #171719;--surface: #f2dfc6;--surface-glass: rgb(242 223 198 / 94%);--ink: #3b2e27;--muted: #765f54;--outline: #49372f;--scene-wall: #d8b98f;--scene-wall-shadow: #b18c68;--wood: #9b684e;--wood-dark: #56392f;--cream: #f2dfbd;--coral: #c8665c;--sage: #6d8469;--sky: #739fae;--gold: #d9a94c;--night: #414754;--ring: #fff5df;--ring-shadow: #b9413c;--shadow: rgb(0 0 0 / 30%)}}@media(prefers-reduced-motion:reduce){.found-ring{animation:ring-fade .12s ease-out both}.hint-ring{animation:hint-fade .18s ease-out both}.wrong-marker{animation:wrong-fade .12s ease-out both}.progress-dot,.progress-rail,.share-button{transition-duration:.01ms}.progress-dot.is-found,.progress-rail:active,.share-button:active{transform:none}.result-layer,.result-card{animation:ring-fade .12s ease-out both}}
