:root{--ink: #3d2c22;--paper: #f6eedf;--panel: #fffaf0;--panel-2: #f8efdd;--leaf: #7fae5a;--leaf-dark: #6a9a48;--gold: #e3b23c;--red: #d4644b;--muted: #8a7363;--shadow: 0 3px 0 rgba(61,44,34,0.22);--font: "Zen Maru Gothic","Hiragino Maru Gothic ProN","Quicksand",system-ui,sans-serif}*{box-sizing: border-box;-webkit-tap-highlight-color: transparent}html,body{margin: 0;height: 100%;background: var(--paper);color: var(--ink);font-family: var(--font);overscroll-behavior: none}body{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 .24 0 0 0 0 .17 0 0 0 0 .13 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}button{font: inherit;color: inherit;cursor: pointer;touch-action: manipulation}.defs{position: absolute;width: 0;height: 0;overflow: hidden}.hidden{display: none !important}#app{height: 100vh;height: 100dvh;max-width: 540px;margin: 0 auto;display: flex;flex-direction: column;position: relative;overflow: hidden;overflow: clip;user-select: none;-webkit-user-select: none;-webkit-touch-callout: none;touch-action: manipulation}.topbar{display: flex;align-items: center;gap: 8px;padding: calc(env(safe-area-inset-top) + 10px) 12px 8px}.title{flex: 1;font-weight: 900;font-size: 17px;letter-spacing: 0.01em;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.wallet{display: flex;gap: 6px}.pill{display: inline-flex;align-items: center;gap: 4px;background: var(--panel);border: 2px solid var(--ink);border-radius: 999px;padding: 2px 10px 2px 5px;font-size: 15px;box-shadow: var(--shadow)}.pill b{font-weight: 900;min-width: 1ch}.pill-ico svg,.price svg{width: 20px;height: 20px;display: block}.pill.bump{animation: bump 0.45s ease}.icon-btn{position: relative;width: 34px;height: 34px;flex: none;border-radius: 50%;border: 2px solid var(--ink);background: var(--panel);font-weight: 900;box-shadow: var(--shadow)}.icon-btn.has-dot::after{content: "";position: absolute;top: -3px;right: -3px;width: 11px;height: 11px;border-radius: 50%;background: var(--red);border: 2px solid var(--ink)}.install-card{display: flex;align-items: center;gap: 10px;margin: 0 0 14px;padding: 8px 10px 8px 8px;background: #eaf3d9;border: 2px solid var(--ink);border-radius: 16px;font-size: 14px;line-height: 1.4}.install-card img{width: 48px;height: 48px;flex: none;border-radius: 12px;border: 2px solid var(--ink)}.install-card .grow{flex: 1;min-width: 0}.install-card .muted{font-size: 13px}.share-ico{width: 16px;height: 16px;vertical-align: -3px}main{flex: 1;position: relative;min-height: 0}.view{position: absolute;inset: 0;display: none}.view.active{display: block}.view.scroll{overflow-y: auto;-webkit-overflow-scrolling: touch;padding-bottom: 12px}.scene-wrap{position: absolute;inset: 0;padding: 2px 8px 4px;container-type: size;display: flex;align-items: center;justify-content: center}.scene{position: relative;width: min(100cqw,calc(100cqh * 9 / 16));aspect-ratio: 9 / 16;border: 2.5px solid var(--ink);border-radius: 20px;overflow: hidden;background: #ddb784;box-shadow: 0 4px 0 rgba(61,44,34,0.18);isolation: isolate;--sky1: #a9d4ec;--sky2: #eef6ee;--hill1: #b9cb9b;--hill2: #8fae74;--sun: #fff3c4;--sun-o: 1;--moon-o: 0;--star-o: 0;--tint: transparent;--tint-o: 0;--glow-o: 0;--lantern: #5a4a3e;--petal: #e9824a}.scene.tod-morning{--sky1: #f6cba4;--sky2: #fcefdc;--hill1: #c9caa1;--hill2: #9fae7c;--sun: #ffe3a3}.scene.tod-evening{--sky1: #ec9473;--sky2: #f8d3a0;--hill1: #b99c8a;--hill2: #8c7a6c;--sun: #ffcf8a;--tint: #f08a4a;--tint-o: 0.12;--glow-o: 0.55;--lantern: #ffcf6e}.scene.tod-night{--sky1: #1f2747;--sky2: #3f4a72;--hill1: #3b4466;--hill2: #2c3452;--sun-o: 0;--moon-o: 1;--star-o: 1;--tint: #283368;--tint-o: 0.36;--glow-o: 1;--lantern: #ffd27a}.bg,.bg svg{position: absolute;inset: 0;width: 100%;height: 100%;display: block}.sky1{stop-color: var(--sky1);transition: stop-color 2s}.sky2{stop-color: var(--sky2);transition: stop-color 2s}.hill1{fill: var(--hill1)}.hill2{fill: var(--hill2)}.sun{fill: var(--sun);opacity: var(--sun-o)}.moon{opacity: var(--moon-o)}.stars{opacity: var(--star-o)}.clouds{opacity: calc(1 - var(--star-o) * 0.6)}.lantern-window{fill: var(--lantern)}.furin{transform-box: view-box;transform-origin: 230px 60px;animation: sway 4.5s ease-in-out infinite}.chochin{transform-box: view-box;transform-origin: 690px 60px;animation: sway 6s ease-in-out infinite reverse}.tint{position: absolute;inset: 0;background: var(--tint);opacity: var(--tint-o);mix-blend-mode: multiply;pointer-events: none;z-index: 1500;transition: opacity 2s}.glows{position: absolute;inset: 0;pointer-events: none;z-index: 1600;opacity: var(--glow-o);transition: opacity 2s}.glow-spot{position: absolute;width: 34%;aspect-ratio: 1;transform: translate(-50%,-50%);background: radial-gradient(circle,rgba(255,210,122,0.55) 0%,rgba(255,210,122,0) 65%);mix-blend-mode: screen;animation: flicker 3s ease-in-out infinite alternate}.petals{position: absolute;inset: 0 0 52% 0;overflow: hidden;pointer-events: none;z-index: 300}.petal{position: absolute;top: -6%;width: 11px;height: 7px;background: var(--petal);border: 1.5px solid rgba(61,44,34,0.55);border-radius: 70% 0 70% 0;animation: fall linear infinite}.season-winter .petal{width: 7px;height: 7px;border-radius: 50%;background: #fff}.spots{position: absolute;inset: 0}.spot{position: absolute;transform: translate(-50%,-100%);pointer-events: none}.spot svg{display: block;width: 100%;height: auto;overflow: visible}.spot .hit,.spot .tk,.spot g[filter]{pointer-events: visiblePainted;cursor: pointer}.spot .empty-ring{opacity: 0.32;transition: opacity 0.2s}.spot .empty-ring.on{opacity: 0.95;animation: pulse 1.1s ease-in-out infinite;transform-box: fill-box;transform-origin: center}.place-ring{animation: pulse 1.1s ease-in-out infinite;transform-box: fill-box;transform-origin: center}.tk-eyes{transform-box: fill-box;transform-origin: center;animation: blink 5.5s infinite}.tk-tail{transform-box: fill-box;transform-origin: 8% 92%;animation: tail 3.4s ease-in-out infinite}.tk-breathe{transform-box: fill-box;transform-origin: 50% 100%;animation: breathe 3.8s ease-in-out infinite}.zzz text{animation: zzz 3.2s ease-out infinite;opacity: 0}.zzz text:nth-child(2){animation-delay: 1.6s}.steam>g{animation: steam 2.8s ease-in-out infinite;opacity: 0}.steam>g:nth-child(2){animation-delay: 1.4s}.glow{animation: flicker 1.8s ease-in-out infinite alternate}.tk-in{transform-box: fill-box;transform-origin: 50% 100%;animation: pop 0.6s cubic-bezier(0.3,1.5,0.5,1) both}.hearth{position: absolute;left: 50%;top: 96.5%;width: 21%;transform: translate(-50%,-100%);background: none;border: 0;padding: 0;z-index: 960}.hearth-art svg{display: block;width: 100%;height: auto;overflow: visible}.pot-meter{position: absolute;left: 50%;bottom: 96%;transform: translateX(-50%);white-space: nowrap;background: var(--panel);border: 2px solid var(--ink);border-radius: 999px;padding: 2px 9px;font-size: 11.5px;font-weight: 700;box-shadow: var(--shadow);display: flex;align-items: center;gap: 5px}.pot-meter .cups{display: inline-flex;gap: 2px}.pot-meter .cups i{width: 6px;height: 6px;border-radius: 50%;border: 1.3px solid var(--ink);background: var(--c,#c99a5b)}.pot-meter .cups i.off{background: transparent;opacity: 0.4}.pot-meter.empty{background: #ffe9d9;color: #a5402a;animation: nudge 1.6s ease-in-out infinite}.bubble{position: absolute;z-index: 2000;transform: translate(-50%,-100%) scale(0.6);opacity: 0;pointer-events: none;transition: opacity 0.18s,transform 0.18s;background: var(--panel);border: 2px solid var(--ink);border-radius: 14px;padding: 4px 10px;font-size: 13px;font-weight: 700;white-space: nowrap;box-shadow: var(--shadow)}.bubble.show{opacity: 1;transform: translate(-50%,-100%) scale(1);pointer-events: auto}.bubble::after{content: "";position: absolute;left: 50%;bottom: -6px;width: 9px;height: 9px;background: var(--panel);border-right: 2px solid var(--ink);border-bottom: 2px solid var(--ink);transform: translateX(-50%) rotate(45deg)}.bubble small{color: var(--muted);font-weight: 500;margin-left: 4px}.hearts{color: var(--red);letter-spacing: 1px}.hearts .off{color: #d8c8b8}.banner{position: absolute;left: 50%;top: 12px;transform: translateX(-50%);z-index: 2100;display: flex;align-items: center;gap: 8px;width: max-content;max-width: 92%;background: var(--panel);border: 2px solid var(--ink);border-radius: 999px;padding: 5px 6px 5px 14px;font-size: 13.5px;font-weight: 700;box-shadow: var(--shadow)}.banner button{border: 2px solid var(--ink);background: var(--panel-2);border-radius: 999px;padding: 2px 10px;font-weight: 700;font-size: 12.5px}.poof{position: absolute;z-index: 1900;width: 12px;height: 8px;background: #8fc061;border: 1.5px solid var(--ink);border-radius: 70% 0 70% 0;pointer-events: none;animation: poof 0.85s ease-out forwards}.puff{position: absolute;z-index: 1890;width: 15%;aspect-ratio: 1;border-radius: 50%;background: radial-gradient(circle,#fffdf6 40%,rgba(255,253,246,0) 70%);pointer-events: none;animation: puff 0.7s ease-out forwards}.panel-head{padding: 6px 18px 4px}.panel-head h2{margin: 4px 0 0;font-size: 24px;font-weight: 900}.panel-head .sub{margin: 2px 0 10px;color: var(--muted);font-size: 14px}.tabs{display: flex;gap: 6px;margin: 0 14px 12px;padding: 4px;background: var(--panel-2);border: 2px solid var(--ink);border-radius: 999px}.tabs button{flex: 1;border: 0;background: none;border-radius: 999px;padding: 7px 4px;font-weight: 700;font-size: 14px;color: var(--muted)}.tabs button.on{background: var(--panel);color: var(--ink);box-shadow: 0 0 0 2px var(--ink)}.grid{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 12px;padding: 0 14px 16px}.card{background: var(--panel);border: 2.5px solid var(--ink);border-radius: 20px 16px 22px 14px;padding: 10px 10px 12px;display: flex;flex-direction: column;align-items: center;text-align: center;gap: 3px;box-shadow: var(--shadow)}.card:nth-child(2n){border-radius: 16px 22px 14px 20px}.card-art{width: 86px;height: 86px}.card-art svg{width: 100%;height: 100%;display: block;overflow: visible}.card-name{font-weight: 900;font-size: 15px;line-height: 1.2}.card-desc{font-size: 12px;color: var(--muted);line-height: 1.35;flex: 1}.meta{font-size: 11.5px;font-weight: 700;color: var(--leaf-dark)}.price{display: inline-flex;align-items: center;gap: 3px;font-weight: 900}.buy{margin-top: 6px;border: 2.5px solid var(--ink);background: #fff1c9;border-radius: 999px;padding: 4px 14px 4px 8px;box-shadow: 0 3px 0 var(--ink)}.buy:active{transform: translateY(2px);box-shadow: 0 1px 0 var(--ink)}.buy.cant{background: var(--panel-2);opacity: 0.6}.owned{margin-top: 8px;font-size: 13px;font-weight: 700;color: var(--leaf-dark)}.card.is-owned{background: var(--panel-2)}.book-section{margin: 4px 14px 6px;font-size: 14px;font-weight: 900;color: var(--muted);text-transform: uppercase;letter-spacing: 0.06em}.book-grid{display: grid;grid-template-columns: repeat(3,minmax(0,1fr));gap: 10px;padding: 0 14px 16px}.book-card{background: var(--panel);border: 2.5px solid var(--ink);border-radius: 18px 14px 20px 12px;padding: 6px 4px 8px;text-align: center;box-shadow: var(--shadow)}.book-card:nth-child(3n+2){border-radius: 14px 20px 12px 18px}.book-card svg{width: 100%;height: auto;display: block}.book-card .nm{font-weight: 900;font-size: 13px}.book-card .hearts{font-size: 11px}.book-card.unseen{background: var(--panel-2)}.book-card.unseen .nm{color: var(--muted)}.book-card.special:not(.unseen){background: #fff4d6}.silhouette{filter: brightness(0);opacity: 0.16}.book-card .tk-eyes,.book-card .tk-tail,.gb-row .tk-eyes,.gb-row .tk-tail,.pick .steam>g,.card .steam>g{animation: none}.card .steam>g,.pick .steam>g{opacity: 0.85}.tabbar{display: flex;gap: 4px;padding: 6px 8px calc(env(safe-area-inset-bottom) + 8px)}.tab{flex: 1;position: relative;display: flex;flex-direction: column;align-items: center;gap: 1px;border: 0;background: none;border-radius: 16px;padding: 6px 0 5px;font-size: 12px;font-weight: 700;color: var(--muted)}.tab svg{width: 26px;height: 26px;display: block}.tab.on{color: var(--ink);background: var(--panel);box-shadow: 0 0 0 2px var(--ink),var(--shadow)}.badge{position: absolute;top: 0;left: calc(50% + 6px);min-width: 20px;height: 20px;padding: 0 5px;border-radius: 10px;background: var(--red);color: #fff;border: 2px solid var(--ink);font-size: 11px;font-weight: 900;display: grid;place-items: center;animation: bump 0.4s ease}.sheet-backdrop{position: absolute;inset: 0;z-index: 50;display: flex;align-items: flex-end;background: rgba(40,28,20,0.38);overflow: hidden;opacity: 0;pointer-events: none;transition: opacity 0.2s}.sheet-backdrop.show{opacity: 1;pointer-events: auto}.sheet{width: 100%;max-height: 86%;overflow-y: auto;background: var(--panel);border: 2.5px solid var(--ink);border-bottom: 0;border-radius: 26px 26px 0 0;padding: 20px 18px calc(env(safe-area-inset-bottom) + 18px);transform: translateY(40px);transition: transform 0.25s cubic-bezier(0.3,1.3,0.5,1)}.sheet-backdrop.show .sheet{transform: none}.sheet h3{margin: 0 0 4px;font-size: 21px;font-weight: 900}.sheet p{margin: 6px 0;line-height: 1.5;font-size: 15px}.sheet .muted{color: var(--muted)}.sheet .center{text-align: center}.sheet-art{width: 120px;margin: 0 auto 4px}.sheet-art svg{width: 100%;height: auto;display: block;overflow: visible}.sheet-art.big{width: 170px}.row{display: flex;gap: 10px;margin-top: 14px}.row>*{flex: 1}.story{background: var(--panel-2);border: 2px dashed rgba(61,44,34,0.35);border-radius: 16px;padding: 10px 14px;margin: 10px 0}.story li{margin: 4px 0}.story ul{margin: 0;padding-left: 18px}.btn{border: 2.5px solid var(--ink);background: var(--leaf);color: #fff;font-weight: 900;font-size: 16px;border-radius: 16px;padding: 11px 16px;box-shadow: 0 3px 0 var(--ink);text-shadow: 0 1px 0 rgba(61,44,34,0.35)}.btn:active{transform: translateY(2px);box-shadow: 0 1px 0 var(--ink)}.btn.ghost{background: var(--panel);color: var(--ink);text-shadow: none}.btn.warn{background: var(--red)}.btn.small{font-size: 14px;padding: 7px 12px}.btn.full{width: 100%;margin-top: 14px}.pick-grid{display: grid;grid-template-columns: repeat(3,minmax(0,1fr));gap: 10px;margin-top: 12px}.pick{border: 2.5px solid var(--ink);background: var(--panel-2);border-radius: 16px;padding: 6px 4px 8px;display: flex;flex-direction: column;align-items: center;gap: 2px;font-size: 12px;font-weight: 700;line-height: 1.2}.pick svg{width: 64px;height: 64px;display: block}.pick.on{background: #eaf3d9;box-shadow: 0 0 0 2px var(--leaf-dark) inset}.pick.locked{opacity: 0.5}.tea-list{display: flex;flex-direction: column;gap: 8px;margin-top: 12px}.tea-row{display: flex;align-items: center;gap: 10px;border: 2.5px solid var(--ink);background: var(--panel-2);border-radius: 16px;padding: 6px 10px 6px 6px;text-align: left}.tea-row>svg{width: 48px;height: 48px;flex: none}.tea-row .tn{font-weight: 900;font-size: 15px}.tea-row .td{font-size: 12px;color: var(--muted)}.tea-row .grow{flex: 1}.tea-row.on{background: #eaf3d9}.tea-row.locked{opacity: 0.55}.tea-row .go{font-weight: 900;font-size: 13px;color: var(--leaf-dark)}.stats{display: grid;grid-template-columns: 1fr 1fr;gap: 8px;margin: 12px 0 4px}.stat{background: var(--panel-2);border: 2px solid var(--ink);border-radius: 14px;padding: 7px 10px}.stat .k{font-size: 11px;color: var(--muted);font-weight: 700;text-transform: uppercase;letter-spacing: 0.05em}.stat .v{font-weight: 900;font-size: 14px;display: flex;align-items: center;gap: 6px}.stat .v svg{width: 26px;height: 26px}.tag{display: inline-block;font-size: 11px;font-weight: 900;text-transform: uppercase;letter-spacing: 0.06em;padding: 2px 8px;border-radius: 999px;border: 2px solid var(--ink);background: var(--panel-2);vertical-align: middle}.tag.special{background: #ffe39a}.tag.rare{background: #e7d5f2}.tag.uncommon{background: #d9ecf6}.hint{background: #fff4d6;border: 2px dashed rgba(61,44,34,0.35);border-radius: 14px;padding: 8px 12px;font-style: italic}.gb-list{display: flex;flex-direction: column;gap: 6px;margin-top: 10px}.gb-row{display: flex;align-items: center;gap: 10px;background: var(--panel-2);border: 2px solid var(--ink);border-radius: 14px;padding: 4px 10px 4px 4px}.gb-row svg.head{width: 46px;height: 44px;flex: none}.gb-row .who{flex: 1;min-width: 0}.gb-row .who b{font-size: 14px}.gb-row .msg{font-size: 12.5px;color: var(--muted);white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.gb-row .gift{display: flex;flex-direction: column;align-items: flex-end;gap: 1px;font-size: 13px}#toasts{position: absolute;left: 0;right: 0;top: calc(env(safe-area-inset-top) + 58px);z-index: 60;display: flex;flex-direction: column;align-items: center;gap: 6px;pointer-events: none}.toast{display: flex;align-items: center;gap: 6px;background: var(--panel);border: 2px solid var(--ink);border-radius: 999px;padding: 5px 14px;font-weight: 700;font-size: 14px;box-shadow: var(--shadow);animation: toastIn 0.3s ease,toastOut 0.35s ease 2.6s forwards}.toast svg{width: 18px;height: 18px}.toast.big{background: #fff4d6;font-size: 15px}@keyframes blink{0%,93%,100%{transform: scaleY(1)}96%{transform: scaleY(0.1)}}@keyframes tail{0%,100%{transform: rotate(0deg)}50%{transform: rotate(-9deg)}}@keyframes breathe{0%,100%{transform: scale(1,1)}50%{transform: scale(1.015,1.045)}}@keyframes zzz{0%{opacity: 0;transform: translate(0,0)}30%{opacity: 1}100%{opacity: 0;transform: translate(6px,-14px)}}@keyframes steam{0%{opacity: 0;transform: translateY(5px)}35%{opacity: 1}100%{opacity: 0;transform: translateY(-8px)}}@keyframes flicker{from{opacity: 0.75}to{opacity: 1}}@keyframes pop{0%{transform: scale(0.3);opacity: 0}60%{transform: scale(1.08);opacity: 1}100%{transform: scale(1)}}@keyframes sway{0%,100%{transform: rotate(-4deg)}50%{transform: rotate(4deg)}}@keyframes pulse{0%,100%{transform: scale(1)}50%{transform: scale(1.08)}}@keyframes bump{0%{transform: scale(1)}40%{transform: scale(1.18)}100%{transform: scale(1)}}@keyframes nudge{0%,100%{transform: translateX(-50%) translateY(0)}50%{transform: translateX(-50%) translateY(-3px)}}@keyframes fall{from{top: -6%;transform: translateX(0) rotate(0deg)}to{top: 104%;transform: translateX(var(--dx,40px)) rotate(560deg)}}@keyframes poof{0%{transform: translate(-50%,-50%) scale(0.4);opacity: 1}100%{transform: translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(var(--r)) scale(1);opacity: 0}}@keyframes puff{0%{transform: translate(-50%,-50%) scale(0.3);opacity: 1}100%{transform: translate(-50%,-50%) scale(1.4);opacity: 0}}@keyframes toastIn{from{transform: translateY(-10px);opacity: 0}to{transform: none;opacity: 1}}@keyframes toastOut{to{transform: translateY(-8px);opacity: 0}}@media (prefers-reduced-motion: reduce){.petal,.furin,.chochin,.tk-tail,.tk-breathe,.glow,.glow-spot{animation: none}}