:root{font-family:Inter,system-ui,sans-serif;color:#fff8e8;background:#101628;color-scheme:dark;--line:#35415b;--lime:#dfff70}*{box-sizing:border-box}body{margin:0;font-size:14px;line-height:1.45}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;background:#263149;color:inherit;border:0;border-radius:8px;padding:10px 14px;min-height:38px}button:hover:not(:disabled){background:#36445f}button:disabled{opacity:.45;cursor:default}.primary{background:var(--lime);color:#172014;font-weight:750}.primary:hover:not(:disabled){background:#eaffaa}button[aria-pressed=true]{background:#fff8e8;color:#101628}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--lime);outline-offset:3px}a{color:inherit;text-underline-offset:4px}header{padding:16px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;align-items:center}header nav{display:flex;gap:18px;flex-wrap:wrap}.brand{font-weight:900;text-decoration:none;font-size:20px}main{max-width:1380px;margin:auto;padding:24px}.page-title,.section-head{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap}.page-title h1{font-size:36px;letter-spacing:-.045em;margin:4px 0 16px}.page-title em{color:var(--lime);font-style:normal}small,.muted{color:#aebbd4}h2{font-size:21px;margin:0 0 16px}h3{font-size:16px;margin:0 0 12px}#identity{display:flex;align-items:center;gap:14px}#wallet{color:var(--lime)}.text{background:transparent;text-decoration:underline;padding:6px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 24px}.panel{background:#1c253d;border-radius:12px;padding:20px}.columns{display:grid;grid-template-columns:1.2fr 1fr;gap:24px}.row{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.row>label{flex:1;min-width:110px}label{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;color:#bac7de}input,select{border:1px solid #45516b;border-radius:7px;background:#202b43;color:#fff8e8;padding:10px;min-width:0;width:100%;min-height:38px}input[type=color]{height:40px;padding:4px}input[type=checkbox]{width:18px;min-height:18px;accent-color:var(--lime)}.check{display:flex;flex-direction:row;align-items:center;gap:8px}.list{display:flex;flex-direction:column;gap:8px;margin:12px 0 20px}.list-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;background:#1c253d;border-radius:8px;overflow-wrap:anywhere}.list-row small{display:block}.lesson-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:16px 0 24px}.lesson-card{padding:18px;background:#1c253d;border-radius:12px;display:flex;flex-direction:column;align-items:start;gap:10px}.lesson-card h3{margin:0}.lesson-card button{margin-top:auto}#message:empty{display:none}#message:not(:empty){padding:12px 16px;background:#303d57;border-radius:8px}#paint{width:256px;max-width:100%;height:auto;background:#263149;border:1px solid #627698;image-rendering:pixelated;touch-action:none;border-radius:8px}#profilePhoto,.avatar-photo{width:40px;height:40px;border-radius:50%;object-fit:cover}.sequencer{display:grid;grid-template-columns:80px repeat(16,minmax(22px,1fr));gap:5px;margin:16px 0 24px}.sequencer button{min-width:0;min-height:38px;padding:0;border-radius:5px;background:#253149}.sequencer button[aria-pressed=true]{background:var(--lime);color:#172014}.sequencer button.current{outline:2px solid #fff8e8;outline-offset:1px}.seq-label{display:flex;align-items:center}.stage{height:410px;background:#192139;border-radius:12px;overflow:hidden;position:relative}.stage canvas{display:block;width:100%;height:100%;touch-action:pan-y}.stage-caption{position:absolute;left:16px;right:16px;top:14px;display:flex;justify-content:space-between;gap:12px;pointer-events:none}.stage-caption>*{background:#101628dd;border-radius:6px;padding:5px 9px}.arena-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:24px}.pads{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:6px;margin:8px 0 12px}.pads button{padding:8px;min-height:52px}.pads kbd{display:block;font-size:11px;color:#aebbd4}.pads button[aria-pressed=true] kbd{color:#172014}#moveGroup{width:auto}.section-head{margin-bottom:12px}.section-head label{width:100px}#roomTools .row{gap:8px}#roomTools .row>label{min-width:100px}#lessonTask{margin-top:12px}progress{width:100%;accent-color:var(--lime)}#timer{font-size:26px;font-variant-numeric:tabular-nums}#arenaSection{margin-top:24px}[hidden]{display:none!important}#roomTools .panel{margin:12px 0}#pairQueue{padding-left:20px}#pairQueue li{margin:8px 0}#history{font-size:13px}#inviteCode{letter-spacing:.09em}#bpm{width:95px}#photoFile{font-size:12px}.empty{color:#aebbd4;padding:20px 0}
@media(max-width:800px){main{padding:16px}header{padding:12px 16px;flex-wrap:wrap}.columns,.arena-grid{grid-template-columns:1fr}.page-title h1{font-size:28px}.stage{height:340px}.sequencer{grid-template-columns:52px repeat(8,minmax(22px,1fr));gap:5px}.seq-label{grid-column:1;grid-row:span 2}.sequencer button{min-height:32px}#identity{flex-wrap:wrap}.panel{padding:16px}}
@media(pointer:coarse){button{min-height:44px}.sequencer{gap:7px}.sequencer button{min-height:38px}}

.turn-cue{background:#293754;border-left:3px solid var(--lime);padding:12px 16px;border-radius:8px;font-weight:600}.volume{flex-direction:row;align-items:center;margin-top:16px}.volume input{width:160px}#pairQueue li{display:flex;align-items:center;justify-content:space-between;gap:8px}#shopPreview{max-width:700px;margin-bottom:20px}#padPage{font-size:12px;margin:0}#matchReadiness{font-size:12px}#roomList:empty:after{content:'Загружаем круги…';color:#aebbd4}.columns>*{min-width:0}