:root{--ink:#5a3e36;--paper:#fff8f0c7;--paper-strong:#fffaf4eb;--accent:#e8735a;--font:"Jua", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif}.ui{font-family:var(--font);color:var(--ink);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.ui button{font:inherit;color:inherit;cursor:pointer;border:0;transition:transform .12s,background .2s}.ui button:active{transform:scale(.95)}button.ui{border:0}.ui button:focus,button.ui:focus{outline:none}.ui button:focus-visible,button.ui:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.recording .ui:not(.fade):not(.room-dim):not(.desk-settle):not(.read-soften):not(.read-note):not(.buddy){display:none!important}.choice{z-index:10;background:#281c3040;justify-content:center;align-items:center;padding:16px;transition:opacity .4s;display:flex;position:fixed;inset:0}.choice.hidden{opacity:0;pointer-events:none}.choice-card{background:var(--paper-strong);-webkit-backdrop-filter:blur(12px);text-align:center;border-radius:24px;width:min(340px,100%);padding:26px 20px 18px;box-shadow:0 12px 40px #3c1e2840}.choice-card h2{margin:0 0 18px;font-size:22px;font-weight:400}.choice-card .choices{flex-direction:column;gap:10px;display:flex}.choice-card .choices button{background:#fde7d6;border-radius:16px;padding:14px;font-size:18px}.choice-card .choices button.primary{background:var(--accent);color:#fff}.info{top:calc(8px + env(safe-area-inset-top));left:calc(6px + env(safe-area-inset-left));z-index:6;opacity:.75;background:radial-gradient(circle,#fff8f08c 13.5px,#0000 14.5px);border-radius:50%;width:44px;height:44px;font-family:system-ui,sans-serif;font-size:16px;line-height:44px;position:fixed}.credits{z-index:11}.credits .choice-card{max-height:calc(100dvh - 32px);overflow-y:auto}.credits section{text-align:left;margin:0 0 14px}.credits h4{opacity:.55;margin:0 0 4px;font-size:12px;font-weight:400}.credits .setting{text-align:left;background:0 0;border-radius:0;justify-content:space-between;align-items:center;gap:14px;width:100%;height:auto;min-height:44px;padding:0;font-size:15px;display:flex}.credits .setting input[type=range]{accent-color:var(--accent);flex:0 58%;margin:0}.credits .switch{background:#5a3e3633;border-radius:999px;flex:none;width:44px;height:26px;transition:background .2s;position:relative}.credits .switch:after{content:"";background:#fffaf4;border-radius:50%;width:20px;height:20px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #3c1e2840}.credits [aria-checked=true] .switch{background:var(--accent)}.credits [aria-checked=true] .switch:after{transform:translate(18px)}.credits .outfit{justify-content:flex-start;margin:4px 0 0}.credits ul{text-align:left;margin:0;padding:0;font-family:system-ui,sans-serif;font-size:13px;line-height:1.4;list-style:none}.credits li{border-bottom:1px solid #5a3e361f;padding:6px 0}.credits li small{opacity:.65;display:block}.credits .fine{opacity:.55;margin:14px 0 0;font-size:12px;line-height:1.6}.bar{left:0;right:0;bottom:calc(18px + env(safe-area-inset-bottom));z-index:5;pointer-events:none;justify-content:center;gap:10px;padding:0 16px;display:flex;position:fixed}.bar button{pointer-events:auto;background:var(--paper);-webkit-backdrop-filter:blur(10px);white-space:nowrap;border-radius:999px;padding:12px 18px;font-size:17px;box-shadow:0 6px 18px #3c1e282e}.menu-scrim{z-index:7;position:fixed;inset:0}.menu{left:50%;bottom:calc(76px + env(safe-area-inset-bottom));z-index:7;background:var(--paper-strong);-webkit-backdrop-filter:blur(12px);border-radius:20px;flex-direction:column;gap:4px;width:min(300px,100% - 32px);padding:8px;animation:.18s ease-out menu-in;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 10px 30px #3c1e2838}.menu button{text-align:left;background:0 0;border-radius:14px;padding:11px 12px;font-size:16px}.menu button:hover:not(:disabled),.menu button:active:not(:disabled){background:#fde7d6}.menu button:disabled{opacity:.5;cursor:default}@keyframes menu-in{0%{opacity:0;transform:translate(-50%,8px)}}.timer{top:calc(14px + env(safe-area-inset-top));z-index:5;font:inherit;color:var(--ink);-webkit-backdrop-filter:blur(10px);opacity:.85;cursor:pointer;background:#fff8f099;border:0;border-radius:999px;align-items:center;gap:5px;padding:6px 13px 6px 10px;font-size:14px;transition:opacity .3s;display:flex;position:fixed;left:50%;transform:translate(-50%)}.timer svg{opacity:.7;width:15px;height:15px}.timer.hidden{opacity:0;pointer-events:none}.timer.dim,.focus .timer.dim{opacity:.3}.sound{top:calc(9px + env(safe-area-inset-top));right:calc(11px + env(safe-area-inset-right));z-index:6;background:radial-gradient(circle, var(--paper) 18.5px, transparent 19.5px);border-radius:50%;place-items:center;width:44px;height:44px;display:grid;position:fixed}.sound svg{width:20px;height:20px}.camera{top:calc(9px + env(safe-area-inset-top));right:calc(59px + env(safe-area-inset-right));z-index:6;background:radial-gradient(circle, var(--paper) 16.5px, transparent 17.5px);border-radius:50%;place-items:center;width:44px;height:44px;display:grid;position:fixed}.camera svg{width:18px;height:18px}.focus .camera{opacity:.3}.fade{z-index:8;opacity:0;pointer-events:none;background:#2b2236;transition:opacity .9s;position:fixed;inset:0}.fade.on{opacity:1}.outfit{justify-content:center;gap:6px;margin:0 0 12px;display:flex}.outfit button{background:0 0;border:1px solid #5a3e3633;border-radius:999px;padding:6px 12px;font-size:14px}.outfit button.on{background:#f1e1d2;border-color:#5a3e3659}.bar button,.timer,.info,.sound{transition:opacity 1.5s,transform .12s,background .2s}.focus .bar button{opacity:.45;box-shadow:none}.focus .info,.focus .sound{opacity:.3}.bar button .icon{vertical-align:-2px;width:16px;height:16px;margin-right:5px;display:inline-block}.bar button .icon svg{width:100%;height:100%}.bar button:disabled{opacity:.6;cursor:default}.bar button.on{background:#f1e1d2eb;box-shadow:inset 0 0 0 1px #5a3e3640}.cheer-float{z-index:4;white-space:nowrap;opacity:0;will-change:transform, opacity;background:#fff6e8d1;border-radius:999px;padding:6px 12px;font-size:14px;position:fixed;top:0;left:0;box-shadow:0 4px 14px #ffb45a40}.card{z-index:9;background:var(--paper-strong);pointer-events:none;border-radius:16px;padding:10px 20px;font-size:20px;transition:opacity 1s;animation:.6s ease-out soft-in;position:fixed;top:30%;left:50%;transform:translate(-50%,-50%);box-shadow:0 8px 24px #3c1e2833}.card.out{opacity:0}.share{z-index:9;background:radial-gradient(circle, var(--paper) 17px, transparent 18px);border-radius:50%;place-items:center;width:44px;height:44px;transition:opacity .8s;animation:1.2s ease-out soft-in;display:grid;position:fixed;top:calc(38% + 86px);left:50%;transform:translate(-50%)}.share svg{width:18px;height:18px}.share.out{opacity:0}.room-dim{z-index:1;pointer-events:none;visibility:hidden;opacity:0;background:linear-gradient(#1a101800 80%,#1a10182e 100%),radial-gradient(64% 46% at 50% 72%,#1a101800 42%,#1a101838 80%,#1a101845 100%);position:fixed;inset:0}.read-soften{z-index:2;pointer-events:none;visibility:hidden;opacity:0;-webkit-backdrop-filter:blur(3px);background:#1e141c29;position:fixed;inset:0}.read-note{z-index:3;transform-origin:0 0;visibility:hidden;opacity:0;cursor:pointer;filter:drop-shadow(0 6px 10px #28181452);width:100px;height:100px;position:fixed;top:0;left:0}.buddy{z-index:1;pointer-events:none;visibility:hidden;opacity:0;width:34vmin;height:40vmin;position:fixed;top:9%;right:-9vmin}.buddy-glow{background:radial-gradient(circle,#ffc8788c 0%,#ffbe6e00 70%);border-radius:50%;width:70%;height:60%;position:absolute;bottom:4%;left:-12%}.desk-settle{z-index:1;pointer-events:none;visibility:hidden;opacity:0;background:linear-gradient(#1c121e26 0%,#1c121e17 45%,#1c121e00 62%),radial-gradient(70% 55% at 50% 74%,#0000 55%,#1c121e1c 100%);position:fixed;inset:0}.ui.focus-exit,.focus-exit{right:calc(14px + env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));z-index:6;font:inherit;color:var(--ink);opacity:.6;cursor:pointer;background:#fff8f073;border:0;border-radius:14px;padding:7px 12px;font-size:13px;transition:opacity .6s;position:fixed}.focus-exit:hover{opacity:.9}.focus-exit.hidden{opacity:0;pointer-events:none}.top-line{left:50%;top:calc(64px + env(safe-area-inset-top));z-index:9;text-align:center;color:#fff6ea;text-shadow:0 2px 12px #3c1e2873;pointer-events:none;max-width:calc(100% - 32px);font-size:16px;transition:opacity 1.6s;animation:1.2s ease-out soft-in;position:fixed;transform:translate(-50%)}.top-line.out{opacity:0}.soft-message{z-index:9;color:#fff6ea;text-shadow:0 2px 16px #3c1e2873;pointer-events:none;font-size:26px;transition:opacity 1.6s;animation:1.2s ease-out soft-in;position:fixed;top:38%;left:50%;transform:translate(-50%)}.soft-message small{text-align:center;opacity:.85;margin-top:8px;font-size:15px;display:block}.soft-message{white-space:nowrap;text-align:center}.soft-message.out{opacity:0}@keyframes soft-in{0%{opacity:0;transform:translate(-50%,8px)}}
