:root{--bg: #28272e;--case: #8b5a2b;--case-dark: #6b4423;--face: #faf7f0;--ink: #1a1a1a;--ink-soft: #5a5a5a;--accent: #d85a30;--pendulum: #ba7517;--pendulum-dark: #854f0b}*{box-sizing:border-box}html,body{margin:0;min-height:100vh}body{display:flex;align-items:center;justify-content:center;background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);padding:2rem 1rem}#root{width:100%;display:flex;justify-content:center}.app{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.25rem;width:100%;max-width:360px}.chime-banner{min-height:20px;font-size:13px;color:var(--ink-soft);text-align:center}.row{display:flex;align-items:center;gap:10px;width:100%}.muted-label{font-size:13px;color:var(--ink-soft);white-space:nowrap}input[type=range]{flex:1}input[type=time]{flex:1;padding:6px 8px;border-radius:6px;border:1px solid #ccc;font-size:14px}button{border:1px solid #ccc;background:#fff;padding:8px 14px;border-radius:6px;font-size:13px;cursor:pointer;color:var(--ink)}button:hover{background:#f0f0f0}button:active{transform:scale(.98)}.btn-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.vol-out{font-size:13px;color:var(--ink-soft);min-width:32px}.note{font-size:12px;color:#888;text-align:center;margin:0;max-width:340px}.sound-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#f5f0e8eb;display:flex;align-items:center;justify-content:center;z-index:100;cursor:pointer}.sound-overlay .card{background:#fff;border:1px solid #ddd;border-radius:10px;padding:1.5rem 2rem;text-align:center;max-width:280px}.sound-overlay .card .bell-icon{font-size:28px;margin:0 0 .5rem}.sound-overlay .card p:last-child{font-size:13px;color:#5a5a5a;margin:0}