:root{font-family:ui-rounded,'Avenir Next',Avenir,system-ui,sans-serif;color:#5A473C;background:#FFF6E9;font-synthesis:none;--ink:#5A473C;--green:#526B44;--cream:#FFF9EF}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none}body{background:radial-gradient(ellipse at 20% 10%,#FFF6E9,transparent 65%),#EDF1DE}button,input{font:inherit}button{cursor:pointer;border:0;color:inherit;background:none;min-height:44px;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.45;cursor:default}button:focus-visible,canvas:focus-visible,input:focus-visible{outline:3px solid #B87A45;outline-offset:3px}#app{height:100svh;width:min(100%,480px);margin:auto;padding:calc(8px + env(safe-area-inset-top)) 12px calc(6px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:3px}header{flex:none;display:flex;align-items:center;justify-content:space-between;height:51px}.brand{display:flex;align-items:center;gap:9px}.brand-mark{font-size:32px;color:#7D9C6C}.brand h1{font-size:26px;letter-spacing:-1px;margin:0;font-weight:750}.brand p{margin:3px 0 0;font-size:7px;letter-spacing:1.7px;font-weight:700;color:#7A856A}.icon-button{width:44px;border-radius:50%;background:#FFFFFF70;border:1px solid #B7C7A455;font-size:20px}#hud{height:60px;flex:none;display:flex;gap:15px;align-items:center;padding:0 6px}#hud>div{display:flex;flex-direction:column}#hud span{font-size:8px;letter-spacing:1.3px;font-weight:700;color:#7A856A}#hud strong{font-size:27px;font-weight:650;font-variant-numeric:tabular-nums}#hud .best{margin-left:auto}#hud .best strong{font-size:21px;color:#6F845F;margin-top:3px}#hud .next{flex-direction:row;align-items:center;gap:4px;border-left:1px solid #B5C2A440;padding-left:10px}#next{width:45px;height:45px}#pond-wrap{flex:1;min-height:0;display:flex;justify-content:center;align-items:center;position:relative}#pond{display:block;aspect-ratio:384/640;border-radius:25px;touch-action:none;outline-offset:-4px}#warning{position:absolute;left:50%;top:23%;transform:translateX(-50%);background:#FFF1DEED;color:#955E42;padding:7px 12px;font-size:12px;white-space:nowrap;border-radius:16px;font-weight:700}#combo{position:absolute;top:42%;width:100%;text-align:center;font:25px Georgia,serif;color:#617C51;text-shadow:0 1px #FFF9E9;pointer-events:none}#tools{flex:none;height:57px;display:flex;align-items:center;gap:8px}#orange{display:flex;gap:6px;align-items:center;text-align:left;background:#FFF9EF;border:1px solid #DCC8A570;padding:6px 9px;border-radius:16px;font-size:11px;min-height:49px;white-space:nowrap}#orange-icon{width:30px;height:30px}#orange-count{display:block;font-size:8px;color:#788267;margin-top:3px}#orange[aria-pressed=true]{background:#FFE2B8;border-color:#D89B5A}.tip{flex:1;text-align:center;font-size:10px;line-height:1.4;color:#718269}footer{flex:none;height:44px;display:flex;justify-content:space-between}footer button{font-size:10px;color:#6A805A}dialog{width:min(92vw,420px);max-height:90svh;border:1px solid #DBDCC3;border-radius:28px;background:var(--cream);color:var(--ink);padding:29px 25px 20px;text-align:center;box-shadow:0 25px 90px #59654530;overflow-y:auto}dialog::backdrop{background:#53634855;backdrop-filter:blur(6px)}dialog h2{font:normal 34px/1.15 Georgia,serif;margin:12px 0 15px;letter-spacing:-1px}dialog h2.logo{font:800 38px ui-rounded,'Avenir Next',system-ui,sans-serif;letter-spacing:-2px;color:#526B44}.eyebrow{font-size:8px;letter-spacing:1.9px;color:#7B8C6C;font-weight:700}dialog p{font-size:12px;line-height:1.6;color:#79806B;margin:10px 0 19px}.tagline{margin-top:-6px!important}.hero-frame{position:relative;min-height:125px;display:flex;align-items:center;justify-content:center}#hero{display:block;width:100%;height:auto;max-height:180px;object-fit:contain}#loading{position:absolute;font-size:10px;color:#8B946F}.primary{display:block;width:100%;min-height:48px;background:#526B44;color:#FFF9EE;border-radius:15px;font-size:14px;font-weight:650;padding:14px}.quiet{display:block;margin:4px auto 0;font-size:12px;color:#6C805F}.menu-links{display:flex;justify-content:center;gap:16px;margin:4px 0 10px}.menu-links button{font-size:11px}.version{font-size:6px;letter-spacing:1px;color:#8F997F}.close{position:absolute;right:10px;top:10px;width:44px;height:44px;font-size:26px;border-radius:50%;color:#899778}.note{font-size:10px!important;line-height:1.6!important}ol{text-align:left;font-size:12px;line-height:1.6;color:#748365;padding-left:20px}li{padding:0 0 12px 4px}li strong{color:#566849}#family{display:grid;grid-template-columns:repeat(3,1fr);gap:13px 6px}#family figure{margin:0}#family canvas{width:75px;height:75px}#family figcaption{font-size:10px}#family small{font-size:8px;color:#8C997B}.result-score{font-size:48px;letter-spacing:-2px;color:#586F47;font-variant-numeric:tabular-nums}#result-art{width:125px;height:90px;margin-bottom:-18px}.details{display:grid;grid-template-columns:1fr auto;text-align:left;font-size:12px;line-height:1.6;gap:7px 12px;margin:16px 0 22px}.details dt{color:#7D856F}.details dd{margin:0;font-weight:650}#settings-dialog label{display:flex;align-items:center;justify-content:space-between;font-size:12px;min-height:51px;border-bottom:1px solid #DDDCC9}input[type=checkbox]{accent-color:#617E50;width:23px;height:23px}#toast{position:fixed;bottom:calc(17px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);padding:12px 18px;border-radius:16px;font-size:12px;line-height:1.4;background:#526B44;color:#FFF6E9;z-index:10;max-width:90vw}#tutorial-pond{display:block;width:auto;height:min(41svh,315px);aspect-ratio:384/640;margin:0 auto 9px;touch-action:none;border-radius:16px}#tutorial-dialog h2{font-size:27px}#tutorial-dialog p{font-size:11px;margin:7px 0 11px}.phone-outline{font-size:65px;width:90px;height:130px;border:4px solid #9FBB91;border-radius:23px;margin:23px auto;display:grid;place-items:center;color:#DAA37F}#rotate-dialog{background:#FFF6E9}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}[hidden]{display:none!important}@media(min-width:700px){body{background:radial-gradient(ellipse at center,#FFF6E9,#DAE5CE)}#app{padding-top:calc(18px + env(safe-area-inset-top));padding-bottom:calc(12px + env(safe-area-inset-bottom))}header{height:60px}#hud{height:70px}}@media(max-height:650px){header{height:43px}.brand h1{font-size:22px}#hud{height:49px}#hud strong{font-size:23px}#tools{height:51px}footer{height:44px}.hero-frame{min-height:95px}dialog{padding:23px 20px 16px}dialog h2{font-size:29px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

@keyframes plush-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}#hero{animation:plush-float 5s ease-in-out infinite}@media(prefers-reduced-motion:reduce){#hero{animation:none}}

#hud .zilla-count{font-size:10px;line-height:1.25;color:#765244;margin-top:2px;white-space:nowrap}#hud .zilla-count b{font-size:12px;font-variant-numeric:tabular-nums;margin-left:4px}

#celebration{position:absolute;top:27%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;width:min(88%,285px);padding:6px 12px 6px 3px;border:1px solid #DDB879;border-radius:20px;background:#FFF9EFF5;box-shadow:0 8px 25px #B5816725;pointer-events:none;z-index:2;text-align:left}#celebration-art{width:72px;height:90px;flex:none}#celebration strong{display:block;font:700 17px ui-rounded,system-ui,sans-serif;color:#7B543C}#celebration span{display:block;font-size:11px;line-height:1.5;color:#7B8568;margin:5px 0}.celebration-progress{height:3px;border-radius:3px;background:#EBDDC5;overflow:hidden}.celebration-progress i{display:block;height:100%;background:#DCAA62;transform-origin:left}

#app-version{align-self:center;font-size:11px;color:#6A805A;font-variant-numeric:tabular-nums;white-space:nowrap}