:root{--paper: #f4f1ea;--ink: #111111;--quiet: #6b665c;--tomato: #ff4a1c;--sticker: #ffd84d;--white: #ffffff;--dark-bg: #1a0806;--dark-text: #e8b8ae;--dark-line: #3a1812;--dark-dim: #6b3a31;--dark-ghost: #5a2a22;--dark-arrow: #8a5a50;--stop: #b3261e;--alarm-flash-a: #b3261e;--alarm-flash-b: #8e1c16;--stroke: 3px;--line: 2px;--shadow: 5px 5px 0;--radius-btn: 6px;--radius-sticker: 10px;--font-display: "Unbounded", system-ui, sans-serif;--font-body: "Onest", system-ui, sans-serif;--min-touch: 44px}@keyframes blink-dot{0%,to{opacity:1}50%{opacity:.3}}@keyframes ripple-sound{0%{transform:scale(1);opacity:.5}to{transform:scale(1.32);opacity:0}}@keyframes pulse-ring{0%{transform:scale(.94);opacity:.9}to{transform:scale(1.25);opacity:0}}@keyframes dim-in{0%{opacity:.55}to{opacity:1}}@keyframes warn-shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@keyframes loud-pop{0%{transform:scale(.88);opacity:0}to{transform:scale(1);opacity:1}}@keyframes tagged-pop{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@keyframes alarm-flash{0%,to{background:var(--alarm-flash-a)}50%{background:var(--alarm-flash-b)}}@keyframes alarm-ring{0%{transform:scale(.9);opacity:.7}to{transform:scale(1.5);opacity:0}}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;height:100%;width:100%;overflow:hidden;overscroll-behavior:none;position:fixed;background:var(--paper);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased}button,input,a,[role=button],select,textarea{font:inherit;touch-action:manipulation}#app{height:100dvh;max-width:390px;margin:0 auto;overflow:hidden}.screen{height:100dvh;max-height:100dvh;overflow:hidden;display:flex;flex-direction:column;padding:calc(64px + env(safe-area-inset-top,0px)) 24px calc(32px + env(safe-area-inset-bottom,0px));gap:18px;background:var(--paper)}.screen--join{gap:22px;overflow-y:auto;-webkit-overflow-scrolling:touch}.screen--soundcheck{overflow-y:auto;-webkit-overflow-scrolling:touch}.screen--waiting{gap:14px;overflow-y:auto;-webkit-overflow-scrolling:touch}.screen--mysound{gap:16px}@media(max-height:700px){.screen--mysound,.screen--mysound [data-mysound-fallback-section]{gap:8px}}.screen--mysound [data-mysound-header]{display:flex;align-items:center;gap:14px;flex-shrink:0}.screen--mysound [data-mysound-main]{display:flex;flex-direction:column;gap:16px;flex:1 1 auto;min-height:0}@media(max-height:700px){.screen--mysound [data-mysound-main]{gap:8px}}.screen--mysound [data-mysound-note]{font-size:16px;line-height:1.45;color:var(--quiet);margin:0;flex-shrink:0}.screen--mysound [data-mysound-circle-zone]{position:relative;display:flex;align-items:center;justify-content:center;flex:1 1 auto;min-height:0}.screen--mysound [data-mysound-ripple]{position:absolute;width:calc(clamp(132px,30dvh,220px) + 4px);height:calc(clamp(132px,30dvh,220px) + 4px);border-radius:50%;border:var(--line) solid var(--tomato);animation:ripple-sound 1.2s ease-out infinite}.screen--mysound .mysound-circle{position:relative;width:clamp(132px,30dvh,220px);min-height:clamp(132px,30dvh,220px);border-radius:50%;border:var(--stroke) solid var(--ink);box-shadow:var(--shadow) var(--ink);background:var(--tomato);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:0;cursor:pointer;touch-action:none;user-select:none;-webkit-touch-callout:none;-webkit-user-select:none}.screen--mysound .mysound-circle--recording{gap:6px}.screen--mysound .mysound-circle svg{width:clamp(28px,7.5dvh,40px);height:clamp(28px,7.5dvh,40px)}.screen--mysound [data-testid=mysound-circle-label]{font-weight:800;letter-spacing:-.02em;text-align:center;line-height:1.2;padding:0 16px;color:var(--white);font-size:clamp(12px,2.4dvh,20px)}.screen--mysound [data-testid=mysound-recording-seconds]{font-weight:800;color:var(--white);line-height:1;font-size:clamp(36px,9dvh,64px)}.screen--mysound [data-testid=mysound-recording-label]{font-weight:600;font-size:clamp(12px,1.8dvh,13px);color:var(--white);text-transform:uppercase;letter-spacing:.12em}.screen--mysound [data-mysound-fallback-section]{display:flex;flex-direction:column;gap:10px;flex-shrink:0}.screen--mysound [data-mysound-rerecord-slot]:empty{display:none}.screen--safety [data-safety-stack] :not(button){pointer-events:inherit}.screen--safety [data-safety-stack] .safety-rules{pointer-events:auto}.screen--countdown{align-items:center;justify-content:space-between;gap:0}.screen--traitor-round{gap:16px}.screen--tagged{gap:0}.screen--dark{background:var(--dark-bg);color:var(--dark-text)}.screen--alarm{align-items:center;justify-content:space-between;gap:0;color:var(--white)}.round-stop-btn{min-height:56px;width:100%;border:none;border-radius:var(--radius-btn);box-shadow:none;background:var(--stop);color:var(--white);font-family:var(--font-body);font-weight:700;font-size:17px;letter-spacing:.08em;cursor:pointer}.display-title{font-family:var(--font-display);font-weight:800;font-size:clamp(26px,8.718vw,34px);line-height:1.05;letter-spacing:-.02em;color:var(--ink);margin:0}.font-display{font-family:var(--font-display);letter-spacing:-.02em}.font-display-tight{font-family:var(--font-display);letter-spacing:-.03em}.label-upper{font-weight:600;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--quiet)}.cta-main{min-height:64px;width:100%;border:var(--stroke) solid var(--ink);border-radius:var(--radius-btn);box-shadow:var(--shadow) var(--ink);background:var(--tomato);color:var(--white);font-family:var(--font-display);font-weight:800;font-size:20px;cursor:pointer}.cta-main:disabled{opacity:.45;cursor:not-allowed}.field-code{align-self:flex-start;width:220px;max-width:100%;min-height:72px;padding:0 20px;background:var(--sticker);border:var(--stroke) solid var(--ink);border-radius:var(--radius-sticker);box-shadow:var(--shadow) var(--ink);transform:rotate(-2deg);font-family:var(--font-display);font-weight:800;font-size:36px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink)}.field-name{width:100%;min-height:56px;padding:0;background:transparent;border:none;border-bottom:var(--line) solid var(--ink);border-radius:0;font-family:var(--font-display);font-weight:800;font-size:24px;color:var(--ink)}.hint{font-size:13px;line-height:1.4;color:var(--quiet);margin:0}.error-banner{margin:0;padding:10px 12px;font-weight:700;font-size:14px;text-align:center;background:inherit;color:var(--stop)}.screen--dark .error-banner{color:var(--dark-text)}.screen--alarm .error-banner{color:var(--white)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
