:root{
  --bg:#f4f6fb;--surface:#fff;--ink:#1a2230;--sub:#5b6676;--line:#e3e8f0;
  --blue:#1a56db;--blue-soft:#e8f0fe;--green:#0f9d58;--green-soft:#e6f4ea;
  --red:#d93025;--red-soft:#fce8e6;--amber:#e37400;--amber-soft:#fef3e0;
  --purple:#7c3aed;--purple-soft:#f0e9fe;--r:14px;--shadow:0 2px 10px rgba(20,30,60,.06);
}
*{box-sizing:border-box}
body{margin:0;font-family:'Malgun Gothic','Apple SD Gothic Neo',system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5}
a{color:var(--blue)}
.topbar{background:linear-gradient(100deg,#1a56db,#3a6ff0);color:#fff;padding:12px 20px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.topbar b{font-size:16px}
.topbar .who{margin-left:auto;font-size:12.5px;opacity:.95;display:flex;align-items:center;gap:10px}
.topbar .who button{background:rgba(255,255,255,.2);border:none;color:#fff;border-radius:8px;padding:6px 12px;cursor:pointer;font-weight:600}
.wrap{max-width:1240px;margin:0 auto;padding:18px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);margin-bottom:16px}
.panel>.head{padding:13px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.panel>.head h2{margin:0;font-size:15px;font-weight:700}
.panel>.head .hint{color:var(--sub);font-size:12px;font-weight:400}
.panel>.body{padding:15px 18px}
textarea{width:100%;min-height:80px;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;font-family:'Consolas',monospace;font-size:12px;resize:vertical;background:#fbfcfe}
input,select{border:1.5px solid var(--line);border-radius:9px;padding:9px 11px;font-size:13px;background:#fbfcfe;font-family:inherit}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--blue)}
label{font-size:12px;color:var(--sub);font-weight:600;display:block;margin-bottom:4px}
.btn{border:none;border-radius:9px;padding:9px 16px;font-size:13px;font-weight:700;cursor:pointer;background:var(--blue);color:#fff;font-family:inherit}
.btn.ghost{background:#eef1f7;color:var(--ink)}.btn.sm{padding:6px 11px;font-size:12px}
.btn.red{background:var(--red)}.btn.green{background:var(--green)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.muted{color:var(--sub);font-size:12px}
.cnt{display:inline-block;background:var(--blue-soft);color:var(--blue);border-radius:20px;padding:2px 10px;font-size:12px;font-weight:700}
table{width:100%;border-collapse:collapse}
th,td{padding:8px 9px;border-bottom:1px solid var(--line);text-align:left;font-size:12.5px;vertical-align:middle}
th{background:#f8fafc;color:var(--sub);font-weight:700;font-size:11.5px;white-space:nowrap}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:11px}
.card{border-radius:12px;padding:13px 15px;border:1px solid var(--line)}
.card .k{font-size:12px;color:var(--sub);font-weight:600}.card .v{font-size:23px;font-weight:800;margin-top:3px}
.card.ok{background:var(--green-soft)}.card.ok .v{color:var(--green)}
.card.bad{background:var(--red-soft)}.card.bad .v{color:var(--red)}
.card.warn{background:var(--amber-soft)}.card.warn .v{color:var(--amber)}
.card.pur{background:var(--purple-soft)}.card.pur .v{color:var(--purple)}
.card.tot .v{color:var(--blue)}
.tag{display:inline-block;border-radius:6px;padding:2px 8px;font-size:11.5px;font-weight:700;white-space:nowrap}
.t-ok{background:var(--green-soft);color:var(--green)}.t-bad{background:var(--red-soft);color:var(--red)}
.t-warn{background:var(--amber-soft);color:var(--amber)}.t-pur{background:var(--purple-soft);color:var(--purple)}
.t-none{background:#eef1f7;color:var(--sub)}
.filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.filters .btn{background:#eef1f7;color:var(--ink)}.filters .btn.active{background:var(--blue);color:#fff}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:14px;flex-wrap:wrap}
.tabs button{background:none;border:none;padding:10px 14px;font-size:13.5px;font-weight:700;color:var(--sub);cursor:pointer;border-bottom:2px solid transparent}
.tabs button.active{color:var(--blue);border-bottom-color:var(--blue)}
.tabview{display:none}.tabview.active{display:block}
.thumb{width:38px;height:38px;object-fit:cover;border-radius:6px;border:1px solid var(--line);cursor:pointer}
/* 로그인 */
.login{max-width:380px;margin:8vh auto;background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:32px;border:1px solid var(--line)}
.login h1{margin:0 0 4px;font-size:20px}.login p{margin:0 0 20px;color:var(--sub);font-size:13px}
.login label{margin-top:12px}.login input{width:100%;margin-top:2px}
.login .btn{width:100%;margin-top:18px;padding:12px;font-size:14px}
.login .err{color:var(--red);font-size:12.5px;margin-top:10px;min-height:16px}
#_toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%) translateY(20px);background:#1a2230;color:#fff;padding:11px 18px;border-radius:10px;font-size:13px;opacity:0;pointer-events:none;transition:.25s;z-index:999}
#_toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:820px){.grid2{grid-template-columns:1fr}}
.warnbox{background:var(--red-soft);border:1px solid #f2b8b5;border-radius:10px;padding:10px 12px;margin-bottom:12px;font-size:12.5px;color:#a52714}