:root{color-scheme:light;--ink:#243e50;--paper:#fffaf2}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Hannotate TC",system-ui,sans-serif}main{max-width:620px;margin:auto;padding:max(24px,env(safe-area-inset-top)) 20px max(30px,env(safe-area-inset-bottom))}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}header img{width:76px;height:76px;object-fit:contain}h1{font-size:30px;margin:0 0 5px}header p{margin:0;color:#716958;font-size:15px}.games{display:grid;gap:16px}.game{display:grid;grid-template-columns:112px 1fr;min-height:138px;align-items:center;gap:18px;border:1px solid #d8cabb;border-radius:22px;background:#fffefd;padding:14px;text-decoration:none;color:inherit;box-shadow:0 5px 0 #e9dfd0;transition:transform .15s;touch-action:manipulation}.game:active{transform:translateY(3px)}.art{width:112px;height:110px;background:#e7edf0;border-radius:15px;overflow:hidden;display:grid;place-items:center}.art img{width:100%;height:100%;object-fit:contain}.game.yarn .art{background:#7ea6ba}.game.yarn .art img{width:86%;height:86%}h2{font-size:20px;margin:5px 0 8px}.game p{font-size:14px;line-height:1.6;margin:0;color:#706855}.tag{font-size:12px;color:#346473;font-weight:700}.play-label{display:inline-block;font-size:14px;margin-top:9px;font-weight:700;color:#315c71}a:focus-visible,button:focus-visible{outline:3px solid #ce803c;outline-offset:4px}.install-panel{display:grid;grid-template-columns:62px 1fr;gap:12px 14px;align-items:center;margin-top:24px;padding:16px;border:1px solid #aac1c9;border-radius:22px;background:#edf4f5;box-shadow:0 5px 0 #d5e2e4}.install-panel img{width:62px;height:62px;border-radius:14px;box-shadow:0 2px 7px #1f455033}.install-panel h2{margin:0 0 4px;font-size:17px}.install-panel p{margin:0;color:#5e6f75;font-size:14px;line-height:1.45}.install-panel button{grid-column:1/-1;min-height:48px;border:0;border-radius:14px;background:#315f73;color:white;font:700 16px system-ui,sans-serif;cursor:pointer;touch-action:manipulation}.install-panel button:disabled{background:#879da6}.guide-card{position:relative}.game-transition{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;padding:24px;background:rgba(255,250,242,.97);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s ease,visibility 0s linear .12s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.game-transition.visible{opacity:1;visibility:visible;transition:opacity .12s ease}.game-transition-card{width:min(280px,82vw);text-align:center;color:#3f5260;font:600 16px/1.5 system-ui,sans-serif}.game-transition-paw{display:block;margin:0 auto 14px;font-size:38px;line-height:1;animation:game-paw .72s ease-in-out infinite alternate}.game-transition-track{height:7px;margin-top:15px;overflow:hidden;border-radius:99px;background:#dce7eb}.game-transition-bar{display:block;width:42%;height:100%;border-radius:inherit;background:#658b9d;animation:game-progress .85s ease-in-out infinite}dialog{width:min(410px,calc(100% - 28px));max-height:calc(100dvh - 36px);overflow:auto;border:0;border-radius:24px;background:#fffaf2;color:var(--ink);padding:0;box-shadow:0 18px 70px #162c3b55}dialog::backdrop{background:#1a2c3999;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}dialog .guide-card{padding:24px 22px 22px;text-align:center}dialog img{width:78px;height:78px;border-radius:18px;box-shadow:0 3px 12px #18394733}dialog h2{font-size:22px;margin:13px 36px 16px}dialog ol{text-align:left;margin:0;padding-left:24px;font:16px/1.55 system-ui,sans-serif}dialog li+li{margin-top:10px}.guide-note{text-align:left;margin:17px 0;padding:12px 14px;border-radius:12px;background:#e8f0f2;color:#415c68;font:14px/1.5 system-ui,sans-serif}.guide-close{position:absolute;right:13px;top:12px;width:42px;height:42px;border:0;border-radius:50%;background:#e6ded2;color:#493e33;font-size:28px;line-height:1;cursor:pointer}.guide-done{width:100%;min-height:48px;border:0;border-radius:14px;background:#315f73;color:#fff;font:700 16px system-ui,sans-serif;cursor:pointer}@keyframes game-paw{to{transform:translateY(-5px) rotate(7deg)}}@keyframes game-progress{0%{transform:translateX(-110%)}100%{transform:translateX(350%)}}@media(min-width:580px){main{padding-top:45px}.game{min-height:155px;grid-template-columns:135px 1fr}.art{width:135px;height:125px}}@media(max-width:350px){main{padding:18px 12px}.game{gap:12px;grid-template-columns:90px 1fr}.art{width:90px;height:100px}h2{font-size:18px}}@media(prefers-reduced-motion:reduce){.game-transition,.game-transition.visible{transition:none}.game-transition-paw{animation:none}.game-transition-bar{width:100%;animation:game-fade 1s ease-in-out infinite alternate}@keyframes game-fade{to{opacity:.45}}}