/* Пульт в стиле ekagrata.ru: токены из ekagrata/hugo/assets/css/tokens.css, карточки, поля
   и кнопки - как на сайте, но плотнее: на занятии до кнопок надо дотянуться быстро. */
:root{
  --bg:#f6f9fc; --white:#ffffff; --ink:#14233a; --ink-2:#2a3b52; --muted:#52627a; --line:#dbe4ef;
  --deep:#244f8c; --mid:#4b78b4; --pale:#e7eff8; --error:#b42318; --error-soft:#fbe4e1; --ok:#2f7a4d;
  --display:"Manrope",system-ui,sans-serif;
  --text:"Golos Text",system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,monospace;
}
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:400 15px/1.5 var(--text);-webkit-font-smoothing:antialiased;padding:0 20px 28px;max-width:820px;margin:0 auto}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--white);box-shadow:0 0 0 5px var(--ink);border-radius:6px}

.top{display:flex;align-items:center;min-height:68px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.brand img{width:40px;height:30px;flex:none}
.brand b{display:block;font:800 23px/1 var(--display);letter-spacing:-.03em}
.brand span span{display:block;font-size:13px;line-height:17px;color:var(--muted);margin-top:3px}

h1{font:800 28px/1.15 var(--display);letter-spacing:-.025em;margin:6px 0 6px}
.sub{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:12px;display:flex;gap:14px;flex-wrap:wrap}
.sub b{color:var(--ok);font-weight:600}
.sub b.off{color:var(--error)}
section{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:16px 18px;margin-bottom:12px}
section h2{font:800 17px/1.2 var(--display);letter-spacing:-.015em;color:var(--ink);margin-bottom:11px}
.row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.row:last-child{margin-bottom:0}

button{font:700 14px/1.2 var(--display);letter-spacing:-.005em;color:var(--deep);background:var(--white);border:1.5px solid var(--deep);border-radius:12px;padding:10px 15px;cursor:pointer;min-height:44px}
button:hover{background:var(--pale)}
button:active{transform:scale(.97)}
button.on,#loginBtn,#tbStart{background:var(--deep);border-color:var(--deep);color:var(--white)}
button.on:hover,#loginBtn:hover,#tbStart:hover{filter:brightness(.88);background:var(--deep)}
button.warn{border-color:var(--error);color:var(--error)}
button.warn:hover{background:var(--error-soft)}
button.small{font-size:13px;padding:7px 11px;min-height:36px}
button.wide{width:100%}
button:disabled{opacity:.4;cursor:default}
select,input{font-size:15px;background:var(--white);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:10px 13px;min-height:44px}
select:focus,input:focus{outline:none;border-color:var(--deep);box-shadow:0 0 0 3px var(--pale)}
.grow{flex:1}

#emg{display:none;background:var(--error-soft);border:1px solid var(--error);color:var(--error);border-radius:14px;padding:11px 16px;margin-bottom:12px;font-size:14px}
#notOwner{display:none;background:var(--pale);border:1px solid var(--mid);color:var(--ink-2);border-radius:14px;padding:11px 16px;margin-bottom:12px;font-size:14px}
#login{display:none;max-width:380px;margin:40px auto 0}
#panel{display:none}
.kv{font-family:var(--mono);font-size:12px;color:var(--muted)}
#cmdlog{font-family:var(--mono);font-size:11px;color:var(--muted);max-height:110px;overflow-y:auto;line-height:1.6}
#cmdlog .err{color:var(--error)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start;margin-bottom:12px}
.cols section{margin-bottom:0;height:100%}
.tgrid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:8px}
.tgrid button{font-size:13px;padding:9px 8px;min-height:42px;width:100%}
.tgrid .pdiv{grid-column:1/-1;height:1px;background:var(--line);margin:3px 0}
.volrow{display:flex;align-items:center;gap:10px;margin:4px 0 8px}
.volrow input[type=range]{flex:1;min-height:0;padding:0;border:0;accent-color:var(--deep)}
.volrow input[type=range]:focus{box-shadow:none}
.volrow b{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--ink);min-width:64px;text-align:right}
.volrow .vlab{font-size:14px}
.tbform{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:9px}
.tbform label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
.tbform input{width:100%}
.tbform input:disabled{opacity:.5}
#tInfo{font:700 16px/1.4 var(--display);font-variant-numeric:tabular-nums;margin-top:8px;color:var(--ink-2)}
#tInfo.over{color:var(--error)}
@media (max-width:640px){
  .cols{grid-template-columns:1fr}
  h1{font-size:24px}
}
.mrow{align-items:center;margin-top:9px}
.mrow .vlab{font-size:14px;color:var(--muted)}
.mcheck{display:flex;align-items:center;gap:8px;margin-left:8px;font-size:14px;cursor:pointer}
.mcheck input{width:20px;height:20px;min-height:0;padding:0;accent-color:var(--deep)}