@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&family=JetBrains+Mono&display=swap');
:root{--brand:#272362;--brand3:#4f48b8;--teal:#0395ab;--amber:#ffaa00;--green:#27ae60;--red:#d2502f;
--bg:#eef0f5;--paper:#fff;--ink:#1b1930;--muted:#6b6980;--line:#e5e6ef;
--shadow:0 1px 3px rgba(16,14,40,.06),0 6px 18px rgba(16,14,40,.05);--r:16px;}
*{box-sizing:border-box;}
html,body{height:100%;margin:0;}
body{background:var(--bg);color:var(--ink);font-family:'Manrope',system-ui,'Segoe UI',Roboto,Arial,sans-serif;
font-size:14px;line-height:1.5;display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden;overscroll-behavior:none;}
a{color:var(--teal);text-decoration:none;}a:hover{text-decoration:underline;}
.topbar{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;
background:linear-gradient(135deg,var(--teal),var(--brand3));color:#fff;box-shadow:var(--shadow);}
.brand{display:flex;align-items:center;gap:12px;}
.brand img{width:42px;height:42px;border-radius:11px;box-shadow:0 2px 8px rgba(0,0,0,.25);}
.brand .bt{font-size:21px;font-weight:800;letter-spacing:.4px;line-height:1;}
.brand .bt b{color:var(--amber);}
.brand .bs{font-size:12px;opacity:.9;font-weight:600;margin-top:2px;}
.topbar nav a{color:#fff;font-weight:700;padding:7px 13px;border-radius:10px;background:rgba(255,255,255,.16);margin-left:8px;font-size:13px;}
.topbar nav a:hover{background:rgba(255,255,255,.28);text-decoration:none;}
.wrap{flex:1;min-height:0;width:100%;max-width:1060px;margin:14px auto;padding:0 14px;display:flex;flex-direction:column;gap:14px;}
.card{flex:none;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow);min-width:0;}
.card h2{margin:0 0 12px;font-size:15px;font-weight:800;letter-spacing:.2px;flex:none;}
.muted{color:var(--muted);}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;min-width:0;}
.kv{background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:9px 12px;min-width:0;}
.kv .k{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;}
.kv .v{font-size:16px;font-weight:800;margin-top:2px;overflow-wrap:anywhere;}
.chip{display:inline-block;padding:4px 11px;border-radius:999px;font-size:12px;font-weight:700;margin:2px 4px 0 0;}
.chip.on{background:rgba(3,149,171,.14);color:var(--teal);}.chip.off{background:#eceaf1;color:var(--muted);}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px;vertical-align:middle;}
.dot.g{background:var(--green);}.dot.r{background:var(--red);}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;}
.card.lh{flex:1;min-height:0;display:flex;flex-direction:column;}
.lh-list{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;}
.lh-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 2px;border-bottom:1px solid var(--line);}
.lh-row:last-child{border-bottom:0;}
.lh-time{color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:12.5px;min-width:62px;}
.lh-dir{font-weight:800;min-width:28px;font-size:13px;}
.lh-dir.tx{color:var(--red);}.lh-dir.rx{color:var(--teal);}
.lh-call{flex:1;min-width:130px;font-weight:600;font-size:14px;}
.lh-call .tg{color:var(--muted);font-family:'JetBrains Mono',monospace;font-weight:700;}
.lh-meta{color:var(--muted);font-size:12.5px;margin-left:auto;white-space:nowrap;display:flex;align-items:center;gap:8px;}
.ber{font-weight:800;padding:2px 9px;border-radius:999px;font-size:12.5px;white-space:nowrap;letter-spacing:.2px;}
.ber-ok{background:rgba(39,174,96,.14);color:#1e8e4e;}
.ber-mid{background:rgba(255,170,0,.20);color:#b07a06;}
.ber-bad{background:rgba(210,80,47,.16);color:var(--red);}
.foot{flex:none;text-align:center;color:var(--muted);font-size:12px;padding:10px 12px 12px;}
.foot a{color:var(--teal);font-weight:700;}.foot .a73{color:var(--amber);font-weight:800;}
/* Мобила: страница так же фиксирована, скроллится только список; строки переносят мету на 2-ю строку */
@media(max-width:640px){
  .lh-meta{margin-left:0;width:100%;justify-content:flex-start;}
  .topbar{flex-direction:column;align-items:flex-start;gap:8px;}
  .topbar nav{margin-left:-8px;}
  .brand .bt{font-size:19px;}
  .wrap{margin:12px auto;}
}
/* нижние вкладки (только мобила) */
.tabbar{display:none;}
@media(max-width:640px){
  .tabbar{display:flex;flex:none;background:var(--paper);border-top:1px solid var(--line);box-shadow:0 -2px 12px rgba(16,14,40,.07);}
  .tabbar button{flex:1;border:none;background:none;padding:11px 6px;font-family:inherit;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer;border-top:3px solid transparent;}
  .tabbar button.active{color:var(--teal);border-top-color:var(--teal);background:rgba(3,149,171,.06);}
  .foot{display:none;}
  body.tab-air #card-info{display:none;}
  body.tab-mast #card-lh{display:none;}
  body.tab-mast #card-info{flex:1;min-height:0;overflow-y:auto;}
  .lh-meta{margin-left:0;width:100%;justify-content:flex-start;}
  .topbar{flex-direction:column;align-items:flex-start;gap:8px;}
  .topbar nav{margin-left:-8px;}
  .brand .bt{font-size:19px;}
  .wrap{margin:10px auto 0;}
}