:root{color:#183047;background:#f3f6fa;font-family:system-ui,-apple-system,Arial}*{box-sizing:border-box}body{margin:0}header{color:#fff;background:#123e62;padding:19px 16px}header .wrap{padding:0}h1{margin:0;font-size:23px}h2{margin:0 0 13px;font-size:20px}h3{font-size:16px}hr{border:0;border-top:1px solid #e0e8ee;margin:18px 0}.sub{color:#cce2f4;font-size:12px}.wrap{max-width:820px;margin:auto;padding:16px}.panel{background:#fff;border-radius:15px;margin:14px 0;padding:18px;box-shadow:0 3px 12px #122d4310}.muted{color:#65788b;font-size:13px}.alert{color:#704d15;background:#fff3d9;border-radius:9px;padding:12px;font-size:13px}.error{color:#8f1d22;background:#fde8e8;border-radius:9px;margin:12px 0;padding:12px;font-size:14px}.ok{color:#145c39;background:#e7f5eb;border-radius:9px;margin:12px 0;padding:12px;font-size:14px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}label{margin:12px 0 5px;font-size:13px;font-weight:650;display:block}input,select,textarea{width:100%;font:inherit;background:#fff;border:1px solid #cbd6e2;border-radius:9px;min-width:0;padding:12px}button{color:#fff;cursor:pointer;background:#1269a8;border:0;border-radius:10px;padding:13px 16px;font-family:inherit;font-size:15px;font-weight:700}button.secondary{color:#16476e;background:#e7eff6}button.danger{background:#b7363c}button.link{color:#1269a8;background:0 0;padding:6px 0;font-size:13px;font-weight:600}button:disabled{opacity:.5;cursor:default}.wide{width:100%;margin-top:14px}.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.tile{text-align:left;color:#173b5b;background:#fff;border:1px solid #d8e3ed;flex-direction:column;gap:9px;min-height:128px;display:flex}.tile span{font-size:30px}.tile small{color:#607588;font-size:12px;font-weight:400}.nav{flex-wrap:wrap;gap:8px;margin:15px 0;display:flex}.nav button{flex:1;min-width:105px;padding:10px}.nav button.current{color:#fff;background:#123e62}.stat{background:#f0f5fa;border-radius:9px;margin:9px 0;padding:12px}.counter{justify-content:space-between;align-items:center;display:flex}.counter button{padding:6px 15px;font-size:23px}.counter strong{font-size:28px}.record{overflow-wrap:anywhere;border:1px solid #e2eaf1;border-radius:10px;margin:10px 0;padding:12px}.record .actions{flex-wrap:wrap;gap:8px;margin-top:9px;display:flex}.status-dot{background:#98a8b6;border-radius:50%;width:9px;height:9px;margin-right:6px;display:inline-block}.status-dot.online{background:#1d9c62}.status-dot.lost{background:#d59528}.metric{background:#f0f5fa;border-radius:10px;padding:12px}.metric strong{margin-top:4px;font-size:25px;display:block}.tag{background:#eaf1f8;border-radius:7px;padding:4px 8px;font-size:12px;display:inline-block}.tag.warn{color:#704d15;background:#fff3d9}.smallbtn{padding:8px 10px;font-size:12px}.log{max-height:320px;font-size:12px;overflow-y:auto}.log div{overflow-wrap:anywhere;border-bottom:1px solid #e0e8ee;padding:6px 0}@media (width<=420px){.wrap{padding:12px}.panel{padding:14px}.tiles{gap:9px}.tile{padding:12px}.grid{gap:8px}button{padding:12px;font-size:14px}}
