:root{--black: rgba(0, 0, 0, .9);--gray: rgba(0, 0, 0, .75);--gray-dim: rgba(0, 0, 0, .6);--accent: #f45d4c;--bg: #fee5ad;font-family:ui-monospace,SF Mono,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;line-height:1.5;font-weight:400;color:var(--gray);background-color:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}a{color:var(--gray);text-decoration:none;transition:color .15s}a:hover{color:var(--accent)}body{margin:0;display:flex;flex-direction:column;min-height:100vh}#app{display:flex;flex-direction:column;flex-grow:1}#main-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;flex-grow:1;padding:2rem}main{width:100%;max-width:360px;text-align:center}header{margin-bottom:3rem}h1{font-size:1.2rem;font-weight:600;margin:0;color:var(--black);letter-spacing:.1em}.tagline{margin:.5rem 0 0;font-size:.85rem;color:var(--gray-dim);letter-spacing:.05em}#volume-value{font-size:6rem;font-weight:500;margin:0;color:var(--black);font-variant-numeric:tabular-nums;line-height:1}#volume-bar{margin:2.5rem 0;font-size:1.2rem;letter-spacing:.05em;color:var(--gray-dim)}#volume-bar .filled{color:var(--black)}#volume-bar .peak{color:var(--accent)}#status{margin-top:2.5rem;font-size:.85rem;color:var(--gray-dim);letter-spacing:.08em}footer{padding:1.5rem;text-align:center;font-size:.85rem;letter-spacing:.05em}