:root{color:#283e39;font-synthesis:none;-webkit-font-smoothing:antialiased;background:#faf8f1;font-family:Hiragino Maru Gothic ProN,Hiragino Sans,ui-rounded,system-ui,sans-serif;font-weight:500}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline-offset:5px;outline:3px solid #4f8f72}button:disabled{cursor:wait;opacity:.55}#root,.app-shell{min-height:100dvh}.screen{max-width:1100px;min-height:100dvh;margin:auto;padding:32px}.home-screen{padding-top:25px;padding-bottom:25px}.home-nav{justify-content:space-between;align-items:center;gap:12px;display:flex}.brand{letter-spacing:.08em;align-items:center;gap:10px;font-size:15px;font-weight:800;display:flex}.brand-mark{color:#e87c53;font-size:30px;transform:rotate(-12deg)}.parent-button{color:#53645e;background:0 0;border:1px solid #d9dfd4;border-radius:99px;min-height:44px;padding:10px 17px;font-size:12px}.parent-button span{margin-left:12px}.home-heading{margin:44px 0 30px}.eyebrow{color:#9b6247;letter-spacing:.15em;margin:0 0 12px;font-size:12px;font-weight:700}.home-heading h1{letter-spacing:.025em;margin:0;font-size:clamp(30px,4vw,46px);font-weight:800;line-height:1.45}.home-instruction{color:#6d7972;margin:14px 0 0;font-size:14px}.mobile-break{display:none}.genre-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.genre-card{text-align:left;color:#283e39;background:var(--card-color);border:0;border-radius:20px;flex-direction:column;padding:18px 22px 20px;transition:transform .15s,box-shadow .15s;display:flex;box-shadow:0 2px #283e390a}.genre-card:hover{transform:translateY(-3px);box-shadow:0 9px 18px #283e3910}.genre-card:active{transform:translateY(1px)}.genre-fruits{--card-color:#f8dfd4}.genre-animals{--card-color:#e5ecd9}.genre-kanji{--card-color:#f5e9ba}.genre-vegetables{--card-color:#dcebe5}.genre-clothing{--card-color:#e4e4f1}.genre-dots{--card-color:#f0dfd5}.card-topline{letter-spacing:.08em;color:#586658;justify-content:space-between;font-size:10px;display:flex}.card-topline>span:first-child{font-size:12px;font-weight:800}.art-stage{place-items:center;min-height:133px;display:grid}.genre-artwork{width:155px;height:125px;overflow:visible}.card-caption{letter-spacing:.02em;justify-content:space-between;align-items:center;gap:8px;font-size:19px;font-weight:800;display:flex}.play-symbol{background:#fffcf5b8;border-radius:50%;flex-shrink:0;place-items:center;width:34px;height:34px;padding-left:2px;font-size:12px;display:grid}.home-footer{color:#7d877d;letter-spacing:.03em;justify-content:space-between;gap:10px;margin-top:27px;font-size:11px;display:flex}.page-header{align-items:center;gap:20px;margin-bottom:28px;display:flex}.page-header h1{font-size:26px}.ghost-button,.chip{color:#344e43;background:#fffdf7;border:1px solid #d5ddd3;border-radius:14px;min-height:48px;padding:10px 18px}.panel{background:#fffdf8;border:1px solid #e6e8df;border-radius:20px;margin-bottom:18px;padding:24px}.panel h2{margin:0 0 18px;font-size:17px}.option-row{gap:10px;display:flex}.wrap{flex-wrap:wrap}.chip-on{color:#fff;background:#4f8f72;border-color:#4f8f72}.settings-note{color:#718074;font-size:13px;line-height:1.8}.play-screen{max-width:none;height:100dvh;padding:16px max(16px,env(safe-area-inset-right));background:#fff;flex-direction:column;gap:12px;display:flex}.play-stage{flex:1;place-items:center;min-height:0;display:grid}.card-art{object-fit:contain;width:100%;height:100%;max-height:calc(100dvh - 95px)}.kanji-face,.label-face{color:#151a18;font-size:min(50vw,55vh);font-weight:700}.asset-placeholder{color:#778078}.play-bar{align-items:center;gap:12px;display:flex}.play-count{color:#778078;flex:1;font-size:13px}.play-end{justify-content:center;align-items:center;gap:24px}.end-label{font-size:36px;font-weight:800}.primary-button{color:#fff;background:#4f8f72;border:0;border-radius:16px;min-height:56px;padding:14px 36px;font-weight:700}@media (width<=600px){.screen{padding:20px}.brand{gap:5px;font-size:12px}.brand-mark{font-size:25px}.parent-button{padding:8px 12px;font-size:11px}.home-heading{margin:28px 0 24px}.mobile-break{display:block}.home-heading h1{font-size:31px;line-height:1.4}.eyebrow{font-size:11px}.home-instruction{font-size:12px}.genre-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.genre-card{border-radius:16px;padding:12px 13px 13px}.art-stage{min-height:100px}.genre-artwork{width:116px;height:92px}.card-caption{letter-spacing:-.03em;font-size:15px}.genre-clothing .card-caption{font-size:12px}.play-symbol{width:26px;height:26px;font-size:9px}.home-footer{margin-top:22px;font-size:9px}.option-row{flex-wrap:wrap}.panel{padding:20px}.play-screen{padding:12px}.play-bar{gap:8px}.play-bar .chip{padding:10px 14px;font-size:13px}}@media (prefers-reduced-motion:reduce){.genre-card{transition:none}}.genre-artwork{object-fit:contain;width:164px;height:164px;display:block}.art-stage{min-height:174px}@media (width<=600px){.genre-artwork{width:120px;height:120px}.art-stage{min-height:128px}}.card-caption{font-size:22px}.home-nav{justify-content:flex-end;margin-bottom:20px}@media (width<=600px){.home-screen{padding:16px}.home-screen .home-nav{margin-bottom:16px}}.genre-card .card-caption{text-align:center;justify-content:center;align-items:baseline;gap:0;width:100%;min-height:33px;line-height:1.5}.genre-card .card-caption:before{content:"​";flex:none;width:0}.start-dialog{color:#283e39;text-align:center;background:#fffdf8;border:1px solid #e2e4df;border-radius:28px;width:min(420px,100vw - 32px);max-height:calc(100dvh - 32px);padding:28px;overflow:auto;box-shadow:0 20px 70px #203c3026}.start-dialog::backdrop{background:#24392e66}.start-dialog-art{place-items:center;margin:0 0 16px;display:grid}.start-dialog-art .genre-artwork{width:112px;height:112px}.start-dialog h2{overflow-wrap:anywhere;margin:0 0 28px;font-size:24px;line-height:1.5}.start-actions{gap:12px;display:flex}.start-actions button{border-radius:999px;min-height:56px;padding:12px;font-size:16px;font-weight:700}.start-cancel{color:#46564e;background:#fffdf8;border:1px solid #d1d6d2;flex:1}.start-confirm{color:#fff;background:#427d62;border:1px solid #0000;flex:1.5}.start-confirm:active{background:#376b53}.settings-screen{color:#283e39}.settings-screen .panel{background:#fffdf8;border-color:#dedede;border-radius:28px}.settings-screen .ghost-button,.settings-screen .chip{color:#344e43;background:#fffdf7;border-color:#cecece;border-radius:999px}.settings-screen .chip-on{color:#fff;background:#427d62;border-color:#cecece}.settings-screen .chip:hover:not(.chip-on),.settings-screen .ghost-button:hover{background:#edf4ea}.settings-screen .settings-note{color:#56665e}.settings-screen button:focus-visible{outline-color:#4f8f72}.image-error-dialog .play-toggle-button{width:100%}.countdown-screen{background:#fffdf8}.play-screen{padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}.playback-controls{flex-shrink:0;gap:16px;width:100%;max-width:800px;margin-inline:auto}.play-home-button{color:#46564e;background:#fff;border:1px solid #d8dcd9;border-radius:999px;flex-shrink:0;min-height:52px;padding:12px 16px;font-size:16px;font-weight:600}.play-toggle-button{color:#fff;background:#427d62;border:0;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;gap:8px;min-width:140px;min-height:56px;padding:14px 18px;font-size:16px;font-weight:700;display:flex}.play-toggle-button:active{background:#376b53}.play-status{text-align:center;flex:1;min-width:0}.play-status .play-count{color:#65716b;margin:2px 0 0;font-size:13px}.pause-status{color:#46564e;min-height:18px;margin:0;font-size:12px;font-weight:700;line-height:18px}@media (width<=360px){.playback-controls{gap:8px}.play-home-button{padding-inline:12px}.play-toggle-button{min-width:124px;padding-inline:12px}}.countdown-dial{aspect-ratio:1;color:#4f8f72;place-items:center;width:clamp(200px,48vmin,360px);display:grid;position:relative}.countdown-ring{width:100%;height:100%;position:absolute;inset:0;transform:rotate(-90deg)}.countdown-ring circle{fill:none;stroke:currentColor;stroke-width:5px;stroke-linecap:round;stroke-dasharray:100 100;animation:1s linear forwards countdown-ring-empty}.countdown-number{color:#4f8f72;margin:0;font-size:clamp(100px,26vmin,200px);font-weight:800;line-height:1;animation:.8s ease-out both countdown-pop}.countdown-wait{color:#4f8f72;font-size:22px;font-weight:700}.countdown-bar{justify-content:flex-end}@keyframes countdown-pop{0%{opacity:0;transform:scale(.8)}40%{opacity:1;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes countdown-ring-empty{0%{stroke-dashoffset:0}to{stroke-dashoffset:-100px}}@media (prefers-reduced-motion:reduce){.countdown-number,.countdown-ring circle{animation:none}}@media (width<=600px){.card-caption{font-size:19px}.genre-clothing .card-caption{font-size:16px;line-height:1.5}.card-caption>span:first-child{overflow-wrap:anywhere;min-width:0}.genre-card .card-caption{gap:0;min-height:29px;font-size:19px}.genre-clothing .card-caption>span{font-size:16px}}