:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;background:#101719;color:#edf5f3}*{box-sizing:border-box}body{margin:0}main{max-width:960px;margin:auto;padding:32px 22px}header,.status,.section-title{display:flex;justify-content:space-between;align-items:center;gap:16px}h1{font-size:36px;letter-spacing:-1.5px;margin:0 0 24px}h1 span{display:block;font-size:14px;letter-spacing:1px;color:#91aaa5;margin-top:8px}h2{font-size:19px;margin:0 0 20px}.eyebrow{font-size:11px;letter-spacing:3px;color:#89d7be}.status{background:#1b302c;border:1px solid #35554b;border-radius:18px;padding:20px}.status p{font-size:14px;color:#bdd1cb;margin-bottom:0;overflow-wrap:anywhere}button,input{font:inherit}button{min-height:48px;border:1px solid #40524e;border-radius:12px;background:#293935;color:#eff9f5;padding:10px 17px;cursor:pointer;touch-action:manipulation}button:hover{background:#354e46}button:focus-visible,input:focus-visible{outline:3px solid #a5efd2;outline-offset:3px}button:disabled{opacity:.45;cursor:wait}.primary{background:#a5efd2;color:#102c21;border-color:#a5efd2;font-weight:700}.primary:hover{background:#c2ffe7}.quiet{background:transparent;font-size:13px}#feedback{min-height:44px;font-size:14px;color:#b6d5ca;overflow-wrap:anywhere}#feedback.error{color:#ffc2b7}.layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}.card{border:1px solid #30413c;border-radius:20px;background:#192320;padding:24px}.navtools{display:flex;gap:8px;justify-content:center}.navtools button{flex:1;padding:10px}.dpad{display:grid;grid-template-columns:repeat(3,64px);grid-template-rows:repeat(3,58px);gap:8px;justify-content:center;margin:24px 0}.up{grid-area:1/2}.left{grid-area:2/1}.ok{grid-area:2/2}.right{grid-area:2/3}.down{grid-area:3/2}.hint,footer{font-size:12px;line-height:1.6;color:#9aafa7}.volume{font-size:56px;font-weight:650;margin:24px 0}.volume small{font-size:16px;color:#9aafa7}label{display:block;font-size:14px;margin:22px 0 10px}input[type=range]{width:100%;accent-color:#a5efd2;min-height:44px}#set-volume{width:100%;margin-top:12px}.section-title h2{margin:0}.section-title{margin-bottom:20px}.section-title button{font-size:13px}.choices{display:grid;gap:9px}.choices button{text-align:left;overflow-wrap:anywhere}footer{margin:28px 0;text-align:center}.login{max-width:440px;padding-top:12vh}.login input[type=password]{width:100%;background:#192b24;color:white;border:1px solid #456456;border-radius:10px;padding:14px}.login button{width:100%;margin-top:20px}@media(max-width:600px){main{padding:24px 14px}.layout{grid-template-columns:1fr}h1{font-size:30px}.status{align-items:flex-start;flex-direction:column}.card{padding:20px}header{gap:8px}.quiet{padding:8px;font-size:12px}}