.home{overscroll-behavior:contain;padding:max(20px, env(safe-area-inset-top)) max(var(--gutter), env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(var(--gutter), env(safe-area-inset-left));display:none;position:fixed;inset:0;overflow-y:auto}body[data-view=home] .home{animation:.8s arrive;display:block}@keyframes arrive{0%{opacity:.01}}.home-in{max-width:720px;margin:0 auto}h1{margin:0 0 16px;font-size:17px;font-weight:500}h1 span{color:var(--muted);font-weight:400}.tiles{gap:12px;display:grid}.tile{background:var(--glass);border:1px solid var(--line);text-align:left;cursor:pointer;border-radius:22px;align-items:center;gap:18px;width:100%;min-height:96px;padding:12px 18px;font-size:22px;transition:transform .15s,border-color .15s;display:flex}@media (hover:hover){.tile:hover{border-color:var(--accent)}}.tile:active{transform:scale(.98)}.tile svg{flex:none;width:72px;height:72px}@media (min-width:640px){.tiles{grid-template-columns:repeat(3,1fr)}.tile{text-align:center;flex-direction:column;justify-content:center;gap:10px;padding:20px 12px}.tile svg{width:104px;height:104px}}.note{color:var(--text);margin-top:14px}.note[hidden]{display:none}.grown-ups{margin-top:8px}.grown-ups .hint{margin-top:18px}.grown-ups .hint b{color:var(--text);font-weight:500}#stage{cursor:pointer;display:none;position:fixed;inset:0}body:not([data-view=home]) #stage{display:block}body[data-view=bell] #stage canvas{display:none}.act{cursor:pointer;background:0 0;border:0;width:100%;padding:0;display:none;position:fixed;inset:0}body[data-view=globe] .act,body[data-view=bell] .act{display:block}.act[aria-disabled=true]{cursor:default}.act:focus-visible{outline:1px solid var(--line);outline-offset:-6px}.line{text-align:center;pointer-events:none;left:max(var(--gutter), env(safe-area-inset-left));right:max(var(--gutter), env(safe-area-inset-right));bottom:max(6dvh, env(safe-area-inset-bottom));text-wrap:balance;margin:0;font-size:18px;transition:opacity 1.5s;display:none;position:fixed}body:not([data-view=home]) .line{display:block}.line.quiet{opacity:0}.back{cursor:pointer;width:50px;height:50px;top:max(6px, env(safe-area-inset-top));left:max(6px, env(safe-area-inset-left));background:0 0;border:0;border-radius:50%;padding:13px;transition:opacity 1s;display:none;position:fixed}.back svg{width:100%;height:100%;stroke:var(--muted);stroke-width:1.8px;stroke-linecap:round;display:block}body:not([data-view=home]) .back{display:block}body.idle .back{opacity:0;pointer-events:none}body.idle .back:focus-visible{opacity:1;pointer-events:auto}.bell-face{pointer-events:none;place-items:center;display:none;position:fixed;inset:0;overflow:hidden}body[data-view=bell] .bell-face{display:grid}.bell-face svg{opacity:.22;width:128px;height:128px;transition:opacity 3s ease-in-out}body.bell-ready .bell-face svg{opacity:.55}.bell-glow{opacity:0;background:radial-gradient(circle,#e3b8666b,#e3b86621 32%,#e3b86600 68%);border-radius:50%;width:min(120vw,120vh);height:min(120vw,120vh);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.bell-ripple{width:200px;height:200px;margin:auto;display:none;position:absolute;inset:0}body.bell-ready .bell-ripple{display:block}.bell-ripple{--ripple-s:12s}.bell-ripple:before,.bell-ripple:after{content:"";opacity:0;animation:ripple-spread var(--ripple-s) linear infinite, ripple-fade var(--ripple-s) ease-in-out infinite;border:1.5px solid #e3b866d9;border-radius:50%;position:absolute;inset:0}.bell-ripple:after{animation-delay:calc(var(--ripple-s) / 2)}@keyframes ripple-spread{0%{transform:scale(.62)}to{transform:scale(1.35)}}@keyframes ripple-fade{0%{opacity:0}30%{opacity:.6}to{opacity:0}}.play{display:none}body.interrupted .play{display:grid}@media (prefers-reduced-motion:reduce){body[data-view=home] .home{animation:none}.tile,.line,.back,.bell-face svg{transition:none}.bell-ripple:before{opacity:.8;animation:none}.bell-ripple:after{display:none}}
