:root{color-scheme:light;--paper:#f2f1eb;--ink:#232941;--muted:#62677b;--line:#d5d6d1;--accent:#5964bc;--pale:#e4e5f3}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}main{max-width:1120px;margin:auto;padding:38px 44px 24px}.eyebrow{display:flex;justify-content:space-between;gap:16px;text-transform:uppercase;font-size:11px;font-weight:650;letter-spacing:.14em;border-bottom:1px solid var(--line);padding-bottom:17px}h1{font-size:clamp(36px,5.2vw,60px);font-weight:500;letter-spacing:-.055em;line-height:1.12;margin:31px 0 10px}.intro{margin:0 0 32px;color:var(--muted);font-size:17px}.workbench{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fafaf6}.room-panel{padding:25px 26px 22px;background:#e9eaf1;border-right:1px solid var(--line);display:flex;flex-direction:column}.room-top{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--muted)}.room-top>span:first-child{font-weight:650;color:var(--ink)}.room{position:relative;flex:1;min-height:390px;display:grid;place-items:center;overflow:hidden}.ring{position:absolute;border:1px solid #b8bed9;border-radius:50%;aspect-ratio:1;transition:opacity .2s,width .3s}.ring-1{width:24%}.ring-2{width:43%}.ring-3{width:65%}.ring-4{width:89%}.sound-dot{width:17px;height:17px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 7px #5964bc15;transition:transform .1s}.room.sounding .sound-dot{transform:scale(1.3)}.room.sounding .ring{animation:breathe 2s ease-in-out infinite}.room-center{position:absolute;top:calc(50% + 24px);font-size:11px;color:var(--muted)}.room-edge{position:absolute;right:7px;top:calc(50% + 12px);font-size:10px;color:#7b829d;writing-mode:vertical-rl}.sound-state{display:flex;align-items:center;gap:9px;font-size:12px;min-height:38px}.status-dot{flex:0 0 6px;width:6px;height:6px;border-radius:50%;background:#8b91a8}.status-dot.active{background:var(--accent);box-shadow:0 0 0 4px #5964bc16}.tail-track{height:3px;background:#d3d6e5;overflow:hidden;border-radius:3px;margin:5px 0 15px}.tail-track div{height:100%;background:var(--accent);width:0}.room-note{max-width:310px;margin:0;color:var(--muted);font-size:12px;line-height:1.6}.controls{padding:25px 28px 26px}fieldset{margin:0;padding:0;border:0}legend,.setting-title label{font-size:14px;font-weight:650}.step{font-size:11px;font-weight:500;color:#7e8396;margin-right:10px}.sources{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}.source-option{display:flex;position:relative;align-items:center;gap:8px;cursor:pointer;border:1px solid var(--line);border-radius:9px;padding:12px 10px;min-width:0}.source-option:has(input:checked){border-color:var(--accent);background:#eeeff8}.source-option input{accent-color:var(--accent);margin:0;width:14px;height:14px}.source-option strong{font-size:13px;font-weight:600;display:block}.source-option small{display:block;font-size:10px;color:var(--muted);margin-top:2px}.source-symbol{display:none}.setting{margin-top:25px}.setting-title{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.setting-title output{font-size:14px;font-variant-numeric:tabular-nums;color:var(--accent);font-weight:600}input[type=range]{width:100%;margin:17px 0 8px;accent-color:var(--accent);cursor:pointer;height:20px}.range-labels{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}button{font:inherit;cursor:pointer;color:var(--ink);border:1px solid var(--line);border-radius:7px;background:transparent;min-height:38px;padding:8px 12px;transition:background .15s,border-color .15s}button:hover{background:#e9eaf2;border-color:#b5b9d1}button:active{transform:translateY(1px)}button:focus-visible,input:focus-visible{outline:3px solid #939ae1;outline-offset:3px}.presets{display:flex;gap:8px;margin-top:15px}.presets button{font-size:11px;padding:5px 12px;min-height:31px;border-radius:20px}.presets button[aria-pressed=true]{background:var(--pale);border-color:var(--accent)}.hint{font-size:11px;color:var(--muted);margin:10px 0 0;line-height:1.55}.decay-setting{margin-top:20px}.repeat{display:flex;align-items:flex-start;gap:9px;font-size:12px;cursor:pointer;margin:21px 0 17px}.repeat input{accent-color:var(--accent);margin:3px 0 0;width:15px;height:15px}.repeat small{display:block;font-size:10px;color:var(--muted);margin-top:1px}.play{width:100%;background:var(--ink);color:white;border-color:var(--ink);font-size:14px;font-weight:600;min-height:48px}.play:hover{background:#3d466d;border-color:#3d466d}.play>span{margin-right:7px;font-size:11px}.stop-controls{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:9px}.stop-controls button{font-size:11px;line-height:1.5;padding:9px 4px}.stop-controls span{display:block;font-size:10px;color:var(--muted)}.error{font-size:12px;line-height:1.5;color:#9c3333;margin:14px 0 0}footer{display:grid;grid-template-columns:1fr 1fr;gap:50px;color:var(--muted);font-size:11px;line-height:1.7;padding:6px 0 0}footer strong{font-weight:600;color:var(--ink);margin-right:8px}footer p{margin:17px 0 0}@keyframes breathe{50%{opacity:.45}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:760px){main{padding:24px 22px}.workbench{grid-template-columns:1fr}.room-panel{border-right:0;border-bottom:1px solid var(--line);padding:20px}.room{min-height:280px;max-width:360px;width:100%;align-self:center}.room-note{max-width:none}.controls{padding:23px}.sources{gap:9px}.source-option{padding:13px 10px}footer{grid-template-columns:1fr;gap:0}.intro{font-size:15px;margin-bottom:25px}h1{margin-top:26px}.eyebrow{font-size:10px}}@media(max-width:370px){main{padding:20px 14px}.controls{padding:20px 16px}.source-option small{font-size:9px}.room{min-height:235px}}