:root{--ink:#241c2c;--paper:#f3e7cf;--accent:#e5533f}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);-webkit-tap-highlight-color:transparent;background:#04050d;margin:0;font-family:-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Noto Sans KR,system-ui,sans-serif;overflow:hidden}#stage{max-width:480px;margin:0 auto;position:fixed;inset:0;overflow:hidden}#sky{position:absolute;inset:0}canvas{touch-action:none;display:block;position:absolute;inset:0}.btn{font:inherit;border:2px solid var(--ink);background:var(--paper);color:var(--ink);cursor:pointer;white-space:nowrap;padding:7px 10px;font-size:13px;font-weight:800;box-shadow:2px 2px #000}.btn:active{transform:translate(2px,2px);box-shadow:0 0 #000}.btn:disabled{opacity:.6;cursor:default}.decobar{background:linear-gradient(#04050d00,#04050d99);gap:8px;padding:10px 12px 14px;display:flex;position:absolute;bottom:0;left:0;right:0}.decobar .btn{flex:1;min-width:0;padding:9px 4px;font-size:14px}.sheet{left:0;right:0;bottom:var(--kb,0px);max-height:calc(100% - var(--kb,0px) - 8px);box-sizing:border-box;z-index:5;background:var(--paper);border-top:2px solid var(--ink);visibility:hidden;padding:10px 12px 16px;transition:transform .25s ease-out,bottom .15s ease-out,visibility 0s .25s;position:absolute;overflow-y:auto;transform:translateY(105%);box-shadow:0 -4px #00000059}.sheet.show{visibility:visible;transition:transform .25s ease-out,bottom .15s ease-out;transform:none}.sheet .head{align-items:center;gap:6px;margin-bottom:10px;display:flex}.sheet .title{flex:1;margin:0;font-size:15px}.sheet .field{width:100%;font:inherit;border:2px solid var(--ink);background:#fffaf0;border-radius:0;margin-bottom:10px;padding:9px;font-size:16px}.sheet .chips{grid-template-columns:1fr 1fr;gap:6px;display:grid}.sheet .chips .btn{padding:9px 4px;font-size:13px}.sheet .tabs{scrollbar-width:none;flex:1;gap:4px;display:flex;overflow-x:auto}.sheet .tabs::-webkit-scrollbar{display:none}.sheet .tab{font:inherit;color:var(--ink);opacity:.55;cursor:pointer;white-space:nowrap;background:0 0;border:2px solid #0000;padding:5px 9px;font-size:13px;font-weight:800}.sheet .tab.on{opacity:1;border-color:var(--ink);background:#fffaf0}.sheet .icon{flex:none;width:32px;height:32px;padding:0;font-size:15px;line-height:1;box-shadow:1px 1px #000}.sheet .grid{scroll-snap-type:x mandatory;scrollbar-width:none;gap:6px;min-height:76px;margin:0 -12px;padding:2px 12px 4px;scroll-padding:0 12px;display:flex;overflow-x:auto}.sheet .grid::-webkit-scrollbar{display:none}.sheet .grid img{-webkit-user-drag:none;-webkit-user-select:none;user-select:none}.sheet .grid .cell{scroll-snap-align:start;flex:0 0 calc(18.1818% - 5.45455px)}.cell{font:inherit;color:var(--ink);border:2px solid var(--ink);cursor:pointer;background:#fffaf0;flex-direction:column;align-items:center;gap:2px;padding:4px 2px 6px;font-size:11px;font-weight:800;display:flex;box-shadow:2px 2px #000}.cell:active{box-shadow:none;transform:translate(2px,2px)}.cell img{aspect-ratio:1;object-fit:contain;image-rendering:auto;width:100%}.sheet .note{opacity:.65;text-align:center;margin:8px 0 0;font-size:12px}.bubble{z-index:3;pointer-events:none;flex-direction:column;align-items:center;gap:4px;display:none;position:absolute;top:0;left:0;transform:translate(-50%,-100%)}.bubble.show{display:flex}.bubble .tip{color:#fff;white-space:nowrap;background:#0a0a1ecc;padding:3px 8px;font-size:12px;font-weight:800}.bubble .acts{pointer-events:auto;gap:4px;display:flex}.bubble .acts .btn{width:34px;height:34px;padding:0;font-size:16px;line-height:1}.riteMenu .acts{flex-wrap:wrap;justify-content:center;max-width:170px}.riteMenu .acts .btn{width:auto;padding:0 9px;font-size:12px;font-weight:800}.bubble:after{content:"";border:6px solid #0000;border-top-color:var(--ink);width:0;height:0;margin-top:-2px}.debugBtn{left:12px;top:calc(12px + env(safe-area-inset-top));z-index:4;letter-spacing:.05em;background:#ffe36e;padding:4px 8px;font-size:11px;position:absolute}.weatherMenu{left:12px;top:calc(48px + env(safe-area-inset-top));z-index:4;background:var(--paper);border:2px solid var(--ink);flex-direction:column;min-width:210px;padding:4px;display:none;position:absolute;box-shadow:2px 2px #000}.weatherMenu.show{display:flex}.weatherMenu button{font:inherit;color:var(--ink);text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:8px;padding:7px 8px;font-size:13px;font-weight:700;display:flex}.weatherMenu button i{text-align:center;width:16px;font-style:normal}.weatherMenu button small{opacity:.6;margin-left:auto;font-size:11px;font-weight:600}.weatherMenu button[aria-checked=true]{background:var(--ink);color:var(--paper)}.debugMenu .time{align-items:center;gap:8px;padding:6px 8px 4px;font-size:12px;font-weight:700;display:flex}.debugMenu .time b{white-space:nowrap;min-width:78px}.debugMenu .time .speed{border:1px solid var(--ink);flex:none;justify-content:center;width:38px;padding:4px 0;font-size:12px}.debugMenu .time input{min-width:0;accent-color:var(--accent);flex:1;margin:0}.weatherMenu .seasons{display:flex}.weatherMenu .seasons button{flex:1;justify-content:center;padding:6px 2px;font-size:12px}.weatherMenu .next{opacity:.6;margin:4px 8px 2px;font-size:11px;font-weight:600}.weatherMenu hr{border:0;border-top:1px solid #241c2c33;margin:3px 2px}.toast{color:var(--paper);pointer-events:none;opacity:0;white-space:nowrap;background:#0a0a1ebf;padding:5px 10px;font-size:12px;font-weight:700;transition:opacity .3s;position:absolute;top:70px;left:50%;transform:translate(-50%)}.toast.show{opacity:1}#lanternSheet textarea.field{resize:none;font-size:16px}.sheet .pick{gap:6px;margin-bottom:10px;display:flex}.sheet .pick .btn{flex:1;padding:8px 4px}.sheet .pick .btn.on{background:var(--ink);color:var(--paper)}.sheet .swatches{justify-content:center;gap:8px}.sheet .swatches .btn{border-radius:50%;flex:none;width:34px;height:34px;padding:0}.sheet .swatches .btn.on{outline:3px solid var(--ink);outline-offset:2px}.sheet .hang{background:var(--accent);color:#fff;width:100%;padding:11px;font-size:15px}.bubble.lanternSay{opacity:0;transition:opacity .3s;display:flex}.bubble.lanternSay.on{opacity:1}.lanternSay .tip{white-space:normal;text-align:center;max-width:180px;line-height:1.35}.sheet .pick .btn img{width:40px;height:40px;margin:0 auto 2px;display:block}.linkBtn{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.privacy{max-height:60vh;font-size:13px;line-height:1.6;overflow-y:auto}.privacy h4{margin:12px 0 4px;font-size:14px}.privacy h4:first-child{margin-top:0}.privacy p,.privacy ul{margin:0 0 6px}.privacy ul{padding-left:18px}.privacy a{color:inherit}.keptList{max-height:52vh;overflow-y:auto}.keptList h4{margin:10px 0 6px;font-size:13px}.keptList h4:first-child{margin-top:0}.keptList .kept{border:2px solid var(--ink);background:#fffaf0;align-items:center;gap:10px;margin-bottom:6px;padding:6px 8px;display:flex}.keptList .kept img{flex:none;width:40px;height:40px}.keptList .kept p{margin:0;font-size:14px;font-weight:700}.keptList .kept small{opacity:.6;font-size:11px}.soundBtn{top:calc(12px + env(safe-area-inset-top));z-index:4;width:38px;height:38px;padding:0;font-size:17px;line-height:1;position:absolute;right:12px}.photoBtn{top:calc(58px + env(safe-area-inset-top));z-index:4;width:38px;height:38px;padding:0;font-size:17px;line-height:1;position:absolute;right:12px}.helpBtn{top:calc(104px + env(safe-area-inset-top))}.helpList{flex-direction:column;gap:6px;max-height:52vh;display:flex;overflow-y:auto}.helpList button{font:inherit;border:2px solid var(--ink);color:var(--ink);text-align:left;cursor:pointer;background:#fffaf0;align-items:center;gap:8px;padding:9px 10px;font-size:14px;font-weight:700;display:flex}.helpList button small{opacity:.55;flex:none;margin-left:auto;font-size:11px;font-weight:700}.helpList button.done{opacity:.75;background:0 0}.flash{z-index:10;pointer-events:none;background:#fff;animation:.45s ease-out forwards flash;position:absolute;inset:0}@keyframes flash{0%{opacity:.85}to{opacity:0}}.soundPop{top:calc(12px + env(safe-area-inset-top));box-sizing:border-box;z-index:4;background:var(--paper);border:2px solid var(--ink);align-items:center;gap:8px;width:210px;height:38px;padding:8px 10px;display:none;position:absolute;right:58px;box-shadow:2px 2px #000}.soundPop.show{display:flex}.soundPop input{min-width:0;accent-color:var(--accent);flex:1;margin:0}.soundPop .btn{flex:none;padding:4px 8px;font-size:12px;box-shadow:1px 1px #000}.bubble.hint{z-index:6;width:max-content;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;transition:none}.bubble.hint:after{transform:translateX(var(--dx,0px))}.bubble.hint.below{flex-direction:column-reverse;transform:translate(-50%)}.bubble.hint.below:after{border-top-color:#0000;border-bottom-color:var(--ink);margin:0 0 -2px}.bubble.hint.side{flex-direction:row;transform:translate(-100%,-50%)}.bubble.hint.side:after{border-top-color:#0000;border-left-color:var(--ink);margin:0 -2px 0 0;transform:none}.cell.hinted{outline:none;animation:1.4s ease-in-out infinite hintedIn}@keyframes hintedIn{0%,to{box-shadow:inset 0 0 0 3px #ffc94a}50%{box-shadow:inset 0 0 0 6px #ffc94a73}}.hinted{outline:3px solid #ffd77a;animation:1.4s ease-in-out infinite hinted}@keyframes hinted{0%,to{outline-offset:1px;outline-color:#ffd77a}50%{outline-offset:5px;outline-color:#ffd77a59}}.bubble.hint .tip{white-space:normal;text-align:center;max-width:230px;padding:5px 10px;font-size:13px;line-height:1.35;box-shadow:0 0 0 2px #ffd77a,0 0 14px #ffd77ab3}body.intro .decobar,body.intro .photoBtn,body.intro .soundBtn,body.intro .soundPop,body.intro .toast{opacity:0;pointer-events:none}body:not(.intro) .decobar,body:not(.intro) .photoBtn,body:not(.intro) .soundBtn{transition:opacity 1.2s}.introLayer{z-index:8;cursor:pointer;transition:opacity 1.8s;position:absolute;inset:0;overflow:hidden}.introLayer.cut{background:#0b0d1a;transition-duration:.9s}.introLayer.cut>*{display:none}.introLayer.done{opacity:0;pointer-events:none}.introTitle{text-align:center;color:#f6ecd6;text-shadow:0 2px 18px #0a0c1eb3;will-change:transform;position:absolute;top:36%;left:0;right:0}.introTitle h1{letter-spacing:.12em;margin:0;font-size:44px;font-weight:800}.introTitle p{letter-spacing:.3em;opacity:.8;margin:10px 0 0;font-size:15px}.introFront{filter:blur(6px);opacity:.85;will-change:transform;background:radial-gradient(closest-side at 18% 55%,#e6ecf8f2,#e6ecf800),radial-gradient(closest-side at 45% 40%,#f0f4fcf2,#f0f4fc00),radial-gradient(closest-side at 72% 60%,#e2e8f6f2,#e2e8f600),radial-gradient(closest-side at 90% 45%,#ecf0fae6,#ecf0fa00);height:46%;position:absolute;top:30%;left:-20%;right:-20%}.introFront.b{opacity:.6;height:34%;top:40%;transform:scaleX(-1)}.introCap{left:0;right:0;top:calc(16% + env(safe-area-inset-top));text-align:center;color:#fff8ea;text-shadow:0 2px 14px #14101ea6;opacity:0;position:absolute}.introCap b{letter-spacing:.3em;text-indent:.3em;font-size:34px;display:block}.introCap span{letter-spacing:.15em;opacity:.85;margin-top:6px;font-size:14px;display:block}.introCap.show{animation:1.5s forwards introCap}@keyframes introCap{0%{opacity:0;transform:translateY(8px)}20%,70%{opacity:1;transform:none}to{opacity:0}}.introEnd{left:16px;right:16px;top:calc(16% + env(safe-area-inset-top));z-index:8;text-align:center;color:#fff8ea;letter-spacing:.06em;text-shadow:0 2px 14px #14101eb3;pointer-events:none;opacity:0;font-size:19px;font-weight:800;animation:4.2s forwards introEnd;position:absolute}@keyframes introEnd{0%{opacity:0;transform:translateY(8px)}15%,70%{opacity:1;transform:none}to{opacity:0}}.introSkip{left:0;right:0;bottom:calc(22px + env(safe-area-inset-bottom));text-align:center;color:#fff8ea99;letter-spacing:.1em;font-size:12px;position:absolute}
