:root{--bg:#f5f6f8;--card:#fff;--ink:#1d2330;--sub:#5d6677;--line:#dde1e8;--acc:#1f5fbf;--acc2:#e9f0fb;--ok:#1d7f46;--warn:#a86a00;--bad:#b3261e}
*{box-sizing:border-box} [hidden]{display:none!important}
body{margin:0;font-family:system-ui,"Malgun Gothic","Apple SD Gothic Neo",sans-serif;background:var(--bg);color:var(--ink);font-size:15px}
header{display:flex;align-items:center;gap:16px;padding:10px 20px;background:var(--card);border-bottom:1px solid var(--line);flex-wrap:wrap}
.brand{font-weight:700;font-size:18px;letter-spacing:.5px}
nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}
nav a{padding:6px 12px;border-radius:6px;color:var(--sub);text-decoration:none}
nav a.on{background:var(--acc2);color:var(--acc);font-weight:600}
.who{color:var(--sub);font-size:14px}
main{max-width:1100px;margin:24px auto;padding:0 16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:20px;margin-bottom:16px}
h1{font-size:20px;margin:0 0 4px} h2{font-size:16px;margin:0 0 12px}
.sub{color:var(--sub);margin:0 0 16px;font-size:14px}
label{display:block;font-size:13px;color:var(--sub);margin:10px 0 4px}
input,select{width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:6px;font-size:15px;background:#fff;color:var(--ink)}
button{padding:9px 16px;border:0;border-radius:6px;background:var(--acc);color:#fff;font-size:14px;cursor:pointer}
button.sec{background:#eef0f4;color:var(--ink)} button.danger{background:var(--bad)}
button.link{background:none;color:var(--acc);padding:0;font-size:14px}
button:disabled{opacity:.5;cursor:default}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.login{max-width:380px;margin:60px auto}
.tabs{display:flex;gap:4px;margin-bottom:12px}
.tabs button{flex:1;background:#eef0f4;color:var(--sub)} .tabs button.on{background:var(--acc);color:#fff}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:8px 6px;border-bottom:1px solid var(--line);vertical-align:middle}
th{color:var(--sub);font-weight:600;font-size:13px}
tr.pick{cursor:pointer} tr.pick:hover{background:var(--acc2)} tr.sel{background:var(--acc2)}
.tag{display:inline-block;padding:2px 8px;border-radius:10px;font-size:12px;background:#eef0f4;color:var(--sub)}
.tag.PENDING{background:#fff4dc;color:var(--warn)} .tag.UNCLAIMED{background:#e9f0fb;color:var(--acc)}
.tag.CLAIMED,.tag.ACTIVE{background:#e3f4ea;color:var(--ok)} .tag.BLOCKED,.tag.SUSPENDED{background:#fbe6e4;color:var(--bad)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#c3c8d1;margin-right:6px} .dot.on{background:var(--ok)}
.code{font-family:ui-monospace,Consolas,monospace;letter-spacing:2px;font-size:20px;text-align:center}
.empty{color:var(--sub);text-align:center;padding:24px}
.err{color:var(--bad);font-size:14px;min-height:20px;margin-top:8px}
#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#1d2330;color:#fff;padding:10px 18px;border-radius:8px;font-size:14px}
.mono{font-family:ui-monospace,Consolas,monospace;font-size:13px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px} @media(max-width:760px){.grid2{grid-template-columns:1fr}}
.kv td:first-child{color:var(--sub);width:130px}

a.btn{display:inline-block;padding:8px 14px;border-radius:8px;background:var(--acc,#2563eb);color:#fff;text-decoration:none;font-weight:600}
/* 장비 제어 (10-01) */
.og{margin:18px 0 6px;font-weight:700;color:var(--acc);border-bottom:1px solid var(--line);padding-bottom:4px}
label.opt{display:grid;grid-template-columns:22px 1fr;gap:8px;align-items:start;margin:10px 0;font-weight:400;cursor:pointer}
label.opt input{margin-top:3px;width:auto} label.opt .h{color:var(--sub);font-size:13px;margin-top:2px}
.msg{margin:8px 0;min-height:1em} .msg.ok{color:var(--ok)} .msg.bad{color:var(--bad)}
button:disabled{opacity:.45;cursor:not-allowed}
button.armed{outline:3px solid var(--bad);outline-offset:1px}

/* ===== 고객 대시보드 개편 (2026-10-12) ===== */
body{background:#eef1f6}
header{box-shadow:0 1px 0 rgba(20,30,60,.06),0 2px 10px rgba(20,30,60,.03);border-bottom:0;padding:12px 24px}
.brand{font-size:19px;background:linear-gradient(90deg,#1f5fbf,#3b82f6);-webkit-background-clip:text;background-clip:text;color:transparent}
main{max-width:1180px}
.who{margin-left:auto;display:flex;align-items:center;gap:8px}
/* 계정 드롭다운 */
.acct{position:relative}
.acctbtn{display:flex;align-items:center;gap:8px;background:#f1f4f9;color:var(--ink);border:1px solid var(--line);padding:6px 10px 6px 6px;border-radius:999px;font-size:14px}
.acctbtn .ava{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#1f5fbf,#3b82f6);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}
.acctbtn .acctnm{font-weight:600}
.acctbtn .car{color:var(--sub);font-size:11px}
.acctmenu{position:absolute;right:0;top:46px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(20,30,60,.16);min-width:210px;padding:6px;z-index:40}
.acctmenu .accthead{padding:10px 12px;border-bottom:1px solid var(--line);font-weight:700;display:flex;flex-direction:column;gap:2px;margin-bottom:4px}
.acctmenu .accthead span{font-weight:400;color:var(--sub);font-size:13px}
.acctmenu a,.acctmenu button{display:block;width:100%;text-align:left;padding:9px 12px;border-radius:8px;background:none;color:var(--ink);font-size:14px;text-decoration:none;border:0;cursor:pointer}
.acctmenu a:hover,.acctmenu button:hover{background:var(--acc2)}
/* 히어로 */
.hero{background:linear-gradient(135deg,#17306a 0%,#1f5fbf 100%);border-radius:16px;padding:22px 24px;color:#fff;margin-bottom:18px;box-shadow:0 10px 30px rgba(23,48,106,.18)}
.hero-in{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.hello{font-size:22px;font-weight:300}
.hello b{font-weight:700}
.hello-sub{color:#cfe0fb;font-size:14px;margin-top:5px}
.btn-primary{background:#fff;color:#1f5fbf;font-weight:700;border-radius:10px;padding:11px 18px;font-size:15px;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.btn-primary:hover{background:#f3f7ff}
.btn-primary .badge{display:inline-block;background:#ff5a4d;color:#fff;border-radius:999px;padding:1px 8px;font-size:12px;margin-left:6px;vertical-align:middle}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}
.stat{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:14px 16px}
.statnum{font-size:30px;font-weight:700;line-height:1}
.statnum.ok{color:#8ff0b5}.statnum.bad{color:#ffb4ac}.statnum.acc{color:#ffe08a}
.statlbl{color:#cfe0fb;font-size:13px;margin-top:7px}
@media(max-width:720px){.stats{grid-template-columns:repeat(2,1fr)}.hello{font-size:20px}}
/* 리스트 헤더 · 툴바 */
.listhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.muted{color:var(--sub);font-weight:400;font-size:14px}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.search{width:220px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:#f7f9fc}
.chips{display:flex;gap:6px}
.chip{background:#f1f4f9;color:var(--sub);border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:600;cursor:pointer}
.chip.on{background:var(--acc);color:#fff;border-color:var(--acc)}
/* 장비 카드 그리드 */
.dev-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:14px}
.dev-card{border:1px solid var(--line);border-radius:14px;padding:16px;cursor:pointer;transition:.15s;background:#fff}
.dev-card:hover{box-shadow:0 8px 24px rgba(20,30,60,.10);transform:translateY(-2px);border-color:#c4d2ea}
.dc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.statusdot{width:10px;height:10px;border-radius:50%;flex:none}
.statusdot.on{background:var(--ok);box-shadow:0 0 0 4px rgba(29,127,70,.14)}
.statusdot.off{background:#c3c8d1}
.dc-name{font-size:17px;font-weight:700;margin-bottom:2px;word-break:break-all}
.dc-sub{font-size:12px;color:var(--sub);margin-bottom:12px;word-break:break-all;min-height:14px}
.dc-meta{display:flex;justify-content:space-between;align-items:center;font-size:13px;padding-top:10px;border-top:1px solid var(--line)}
.dc-meta .okt{color:var(--ok);font-weight:600}.dc-meta .badt{color:var(--sub);font-weight:600}
.dc-fw{font-size:11px;margin-top:8px}
.dc-go{margin-top:10px;color:var(--acc);font-weight:600;font-size:13px}
/* 등록 패널 */
.claim .unc-list{display:flex;flex-direction:column;gap:8px;max-height:300px;overflow:auto}
.unc-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
.unc-item:hover{background:var(--acc2)}
.unc-item input{width:auto;flex:none}
.unc-item .muted{margin-left:auto}
.claim-code{background:#f7f9fc;border:1px solid var(--line);border-radius:12px;padding:16px;align-self:start}

.statnum.stream{color:#7ad0ff}
.conn{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--sub)}
.conn.on{color:var(--ok)}
.spill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;background:#eef0f4;color:var(--sub)}
.spill.on{background:#e3f4ea;color:var(--ok)}

.back{display:inline-block;margin:0 0 10px;color:var(--acc);text-decoration:none;font-weight:600}
.dev-head .dh-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.dh-name{font-size:21px;font-weight:700;word-break:break-all}
.dh-sub{font-size:12px;color:var(--sub);margin-top:3px}
.statband{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:14px;margin:16px 0;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sb{display:flex;flex-direction:column;gap:5px}
.sb-l{font-size:12px;color:var(--sub)}
.sb-v{font-size:14px;font-weight:600;display:flex;align-items:center;gap:6px}
.dh-rename{margin-top:4px}
.sec-h{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.sec-h h2{margin:0}
.vwrap{position:relative;max-width:480px;background:#0d1420;border-radius:10px;overflow:hidden;aspect-ratio:16/9}
.vwrap video{width:100%;height:100%;display:block;background:#000;object-fit:contain}
.vposter{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:linear-gradient(135deg,#17306a,#0d1420)}
.vposter .vhint{color:#9fb2d0;font-size:12px;text-align:center;padding:0 16px}
.subcard{border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin-bottom:12px;background:#fbfcfe}
.og2{font-weight:700;color:var(--acc);margin-bottom:4px}
details.card summary{font-size:16px;font-weight:700;cursor:pointer}
details.card[open] summary{margin-bottom:10px}

.cbx{display:inline-flex;align-items:center;gap:6px;margin:4px 16px 4px 0;font-weight:400;cursor:pointer}
.cbx input{width:auto;flex:none}
.clswrap{display:flex;flex-wrap:wrap;margin-top:4px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:620px){.grid4{grid-template-columns:repeat(2,1fr)}}

.tabrow{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:14px;flex-wrap:wrap}
.tabbtn{background:none;color:var(--sub);border:0;border-bottom:2px solid transparent;border-radius:0;padding:8px 14px;font-size:14px;font-weight:600;cursor:pointer}
.tabbtn:hover{color:var(--ink)}
.tabbtn.on{color:var(--acc);border-bottom-color:var(--acc)}
.spill.bad{background:#fbe6e4;color:var(--bad)}
.spill.off{background:#eef0f4;color:var(--sub)}
.spill.idle{background:#fff4dc;color:var(--warn)}
#appToggle[disabled]{opacity:.45;cursor:not-allowed}

.tabrow{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;border-bottom:0}
.tabbtn{background:#eef2f7;border:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:10px;padding:10px 16px;font-size:14px;font-weight:700;color:var(--sub);cursor:pointer;transition:.12s}
.tabbtn:hover{background:#e3e9f1;color:var(--ink)}
.tabbtn.on{background:var(--acc);color:#fff;border-color:var(--acc);box-shadow:0 3px 10px rgba(31,95,191,.28)}
.tabintro{background:#eef4ff;border:1px solid #d4e2fb;border-radius:10px;padding:12px 14px;font-size:14px;color:#24456e;margin:0 0 16px}
.setguide{color:var(--sub);font-size:14px;margin:0 0 14px}
.grid4 label{line-height:1.3}

/* ===== 상세 화면 섹션 라벨 · NDJSON (2026-10-12) ===== */
.secbar{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:800;color:#17306a;margin:-2px 0 14px}
.secbar::before{content:"";width:4px;height:17px;border-radius:3px;background:var(--acc);flex:none}
.ndbox{border:1px dashed #c4d2ea;border-radius:10px;padding:14px 16px;margin-top:18px;background:#f7faff}
.ndbox .ndhead{font-weight:700;margin-bottom:0}

/* 10-13 내 장비 — 장비 1대 = 긴 줄 1개 */
.dev-rows{display:flex;flex-direction:column;gap:12px}
.dev-row{display:grid;grid-template-columns:260px 1fr 300px;gap:22px;align-items:stretch;border:1px solid var(--line);border-radius:14px;padding:18px 20px;background:#fff;cursor:pointer;transition:.15s}
.dev-row:hover{box-shadow:0 8px 24px rgba(20,30,60,.10);border-color:#c4d2ea}
.dr-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.dr-name{font-size:20px;font-weight:800;word-break:break-all}
.dr-sub{font-size:12px;color:var(--sub);margin:3px 0 12px;word-break:break-all}
.dr-badges{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:13px}
.dr-badges .okt{color:var(--ok);font-weight:600}.dr-badges .badt{color:#b45309;font-weight:600}
.dr-info{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 22px;padding:0 22px;border-left:1px solid var(--line);border-right:1px solid var(--line);align-content:center}
.kv{display:grid;grid-template-columns:96px 1fr;gap:8px;font-size:13.5px;align-items:baseline}
.kv .k{color:var(--sub)}.kv .v{word-break:break-all}.kv .v.mono{font-size:12.5px}
.dr-live{display:flex;flex-direction:column;justify-content:space-between}
.dl-h{font-size:12.5px;color:var(--sub);margin-bottom:8px}
.dl-g{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}
.dl-g div{background:#f5f7fb;border-radius:10px;padding:10px 4px}
.dl-g b{display:block;font-size:18px}.dl-g span{font-size:11.5px;color:var(--sub)}
.dr-live .dc-go{text-align:right}
@media(max-width:1100px){.dev-row{grid-template-columns:1fr}.dr-info{border:0;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}}
@media(max-width:640px){.dr-info{grid-template-columns:1fr}}

/* 10-13b 내 장비 줄 정리 — 오른쪽 리포트 칸 삭제 · 등록코드 */
.dev-row{grid-template-columns:280px 1fr 130px}
.dr-info{border-right:0}
.dr-code{font-size:14px;color:var(--sub);margin-top:4px}.dr-code b{color:var(--acc);font-size:17px;letter-spacing:1px;margin-left:4px}
.dr-sub{margin:4px 0 12px}
.dr-badges .conn{font-size:13px}
.dr-go{display:flex;align-items:center;justify-content:flex-end}
.kv{grid-template-columns:88px 1fr}
@media(max-width:1100px){.dev-row{grid-template-columns:1fr}.dr-go{justify-content:flex-start}}

/* 10-13c 대시보드 별칭 · 열기 버튼 / 장비 화면 큰 박스 · 실시간 카드 */
.dev-row{cursor:default}
.dr-alias{font-size:13.5px;color:var(--sub);margin-top:4px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.dr-alias b{color:var(--ink,#1d2330)}
.mini{font:inherit;font-size:12px;padding:3px 9px;border-radius:6px;border:1px solid var(--line);background:#f4f6fa;cursor:pointer;color:var(--ink,#1d2330)}
.mini.ok{background:var(--acc);border-color:var(--acc);color:#fff}
.nm-in{font:inherit;font-size:13px;padding:4px 8px;border:1px solid var(--line);border-radius:6px;width:150px}
.dr-open[disabled]{opacity:.45;cursor:not-allowed}
.backbtn{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;padding:9px 18px 9px 10px;border-radius:10px;background:#fff;border:1px solid var(--line);color:var(--acc);font-weight:700;text-decoration:none;box-shadow:0 1px 3px rgba(20,30,60,.06)}
.backbtn:hover{background:#eef4ff;border-color:#c4d2ea}
.backbtn .bi{display:inline-flex;width:26px;height:26px;border-radius:50%;background:var(--acc);color:#fff;align-items:center;justify-content:center;font-size:15px}
.bigbox{border:1px solid #cfdaee;box-shadow:0 2px 10px rgba(20,30,60,.05);padding:22px 24px}
.bb-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.bb-t{font-size:18px;font-weight:800;color:#17306a}.bb-t .tsub{font-weight:600;color:var(--sub);font-size:15px}
.bigbox .vwrap{max-width:860px}
.vwrap:fullscreen{max-width:none;border-radius:0}.vwrap:fullscreen video{height:100vh}
.livebox{margin-top:16px;display:flex;flex-direction:column;gap:12px;max-width:860px}
.lrow{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#fafbfd}
.lh{font-weight:700;font-size:14px;margin-bottom:8px}
.lg{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.lc{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;text-align:center}
.lc b{display:block;font-size:20px}.lc span{font-size:12px;color:var(--sub)}
.lc.hit{border-color:#9cc3f5;background:#eef5ff}.lc.sev1{background:#f0f7ee}.lc.sev2{background:#fff5e0}.lc.sev3{background:#ffe8e6}

.rtcstat{margin-top:6px;font-size:12px;color:#334;background:#f3f6fb;border:1px dashed #c9d6ee;border-radius:8px;padding:6px 10px;line-height:1.7}

/* 10-13: 수신 통계 4항목 · FSM/통신/대역폭 카드 · 모델명 */
#rtcStat{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px}
#rtcStat b{font-size:14px}
.lg4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:640px){.lg4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.lg4 .lc{padding:14px 10px;border-radius:12px;box-shadow:0 1px 2px rgba(16,24,40,.05)}
.lg4 .lc b{font-size:24px;letter-spacing:-.3px}
.lc b small{font-size:12px;font-weight:500;color:var(--sub);margin-left:3px}
.lc.fsm{border-left:4px solid #9aa4b2}
.lc.fsm.sev0{border-left-color:#7a8796}.lc.fsm.sev1{border-left-color:#4caf50}.lc.fsm.sev2{border-left-color:#f0a020}.lc.fsm.sev3{border-left-color:#e5483b}
.lh .mdl{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:#eef3fb;color:#1f4f9a;font-size:12px;font-weight:600}

/* 10-13: 모니터링 보고서 */
.dr-go{flex-direction:column;gap:10px;align-items:flex-end}
.btn-report{display:inline-block;font-size:13px;font-weight:700;color:#0e7f72;background:#eaf6f4;border:1px solid #cbe8e3;border-radius:10px;padding:8px 14px;text-decoration:none}
.btn-report:hover{background:#dff1ed}
@media(max-width:1100px){.dr-go{align-items:flex-start}}
.rp h2{margin:0 0 4px}
.rp-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0 10px}
.rp-bar label{font-size:13px;color:var(--sub)}
.rp-bar input[type=date]{padding:6px 8px;border:1px solid var(--line);border-radius:8px}
.rp-quick{display:flex;gap:6px}
.rp-tabs{margin:6px 0 12px}
.rp-meta{font-size:13px;color:var(--sub);margin:4px 0 10px}
.rp-meta .mdl,.rp .mdl{display:inline-block;padding:1px 8px;border-radius:999px;background:#eef3fb;color:#1f4f9a;font-size:12px;font-weight:600}
.rp-kpi{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));margin-bottom:8px}
.rp-kpi .lc b{font-size:22px}
.rp-kpi .lc em{display:block;font-style:normal;font-size:11px;color:var(--sub);margin-top:2px}
.rp-h{font-size:14px;margin:16px 0 6px}
.rp-svg{width:100%;height:auto;display:block;background:#fff;border:1px solid var(--line);border-radius:10px}
.rp-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--sub);margin:6px 2px}
.rp-lg i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.rp-sev{display:flex;height:18px;border-radius:9px;overflow:hidden;border:1px solid var(--line)}
.rp-sevseg.sev0,.rp-lg i.sev0{background:#9aa4b2}.rp-sevseg.sev1,.rp-lg i.sev1{background:#4caf50}.rp-sevseg.sev2,.rp-lg i.sev2{background:#f2a33a}.rp-sevseg.sev3,.rp-lg i.sev3{background:#e5483b}
.rp-tbl{width:100%;border-collapse:collapse;margin-top:14px;font-size:13px}
.rp-tbl th,.rp-tbl td{border-bottom:1px solid var(--line);padding:7px 8px;text-align:right;white-space:nowrap}
.rp-tbl th:first-child,.rp-tbl td:first-child{text-align:left}
.rp-tbl th{background:#f5f7fa;font-weight:600}
.rp{overflow-x:auto}
.rp-kpi4{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:700px){.rp-kpi4{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------------------------------------------------------------- 10-14 대시보드 줄 2판 · 장비 화면 머리 · 설정 출처 */
.dev-row.v2{grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;padding:18px 22px}
.v2 .dr-alias{font-size:inherit;color:inherit;margin:0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.v2 .dr-title{font-size:24px;font-weight:800;color:#13265a;letter-spacing:-.3px;word-break:break-all;line-height:1.25}
.v2 .nm-edit{opacity:.75}
.v2 .dr-meta{font-size:13px;color:var(--sub);margin:5px 0 12px}
.v2 .dr-meta b{color:var(--acc);letter-spacing:.5px;margin-left:3px}
.v2 .dsep{margin:0 8px;opacity:.5}
.dr-model{font-size:12px;color:var(--sub);background:#f3f6fb;border:1px solid var(--line);border-radius:999px;padding:3px 10px}
.dr-act{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.act{display:inline-flex;align-items:center;gap:10px;min-width:172px;padding:10px 16px 10px 10px;border-radius:12px;border:1px solid;font:inherit;text-align:left;cursor:pointer;text-decoration:none;transition:.15s;background:#fff;line-height:1.25}
.act .ai{display:inline-flex;width:36px;height:36px;border-radius:10px;align-items:center;justify-content:center;font-size:16px;flex:none}
.act b{display:block;font-size:14.5px;font-weight:800}
.act small{display:block;font-size:11.5px;opacity:.8;font-weight:500;margin-top:2px}
.act-live{color:#fff;background:linear-gradient(135deg,#1e40af,#2563eb);border-color:#1e40af}
.act-live .ai{background:rgba(255,255,255,.2)}
.act-set{color:#1e3a8a;border-color:#c7d4ee}
.act-set .ai{background:#eef3ff}
.act-rep{color:#0e7f72;background:#f4fbf9;border-color:#cbe8e3}
.act-rep .ai{background:#dff1ed}
.act:hover:not([disabled]){transform:translateY(-1px);box-shadow:0 6px 16px rgba(20,30,60,.12)}
.act[disabled]{opacity:.42;cursor:not-allowed}
@media(max-width:1100px){.dev-row.v2{grid-template-columns:1fr}.dr-act{justify-content:flex-start}}
@media(max-width:640px){.act{flex:1 1 100%}}
.devhead{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.devhead .backbtn{margin:0}
.dh-t{flex:1;min-width:220px}
.dh-name{font-size:22px;font-weight:800;color:#13265a;line-height:1.25}
.dh-sub{font-size:12.5px;color:var(--sub);margin-top:3px}
.dh-sub .conn{font-size:12.5px}
.segs{display:flex;background:#fff;border:1px solid var(--line);border-radius:12px;padding:4px;gap:4px;flex-wrap:wrap;box-shadow:0 1px 3px rgba(20,30,60,.06)}
.seg{padding:8px 14px;border-radius:9px;font-weight:700;font-size:13.5px;color:var(--sub);text-decoration:none}
.seg:hover{background:#f1f5fc}
.seg.on{background:var(--acc);color:#fff}
.srcbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;border-radius:10px;margin:0 0 12px;font-size:13.5px}
.srcbar.ok{background:#ecfdf3;border:1px solid #bbf0cf;color:#166534}
.srcbar.warn{background:#fff7e6;border:1px solid #fde1a8;color:#92400e}
.srcbar .sp{flex:1}
.dh-sub .conn{padding:0;border:0;background:none;box-shadow:none;display:inline-flex;align-items:center;gap:4px}
.dh-sub .statusdot{box-shadow:none}
/* 10-14b: 세 버튼을 같은 무게로 — 옅은 색감 · 마우스를 올리면 진하게 */
.act{background:var(--ab);color:var(--af);border-color:var(--al);box-shadow:none}
.act .ai{background:var(--ai);color:var(--af);transition:.15s}
.act small{color:inherit}
.act-live{--ab:#f1f5ff;--af:#1e40af;--al:#d3def5;--ai:#e0e9fd;--ah:#1e40af}
.act-set{--ab:#f4f3fe;--af:#4338ca;--al:#dddaf6;--ai:#e8e6fc;--ah:#4338ca}
.act-rep{--ab:#effaf7;--af:#0e7f72;--al:#cbe8e3;--ai:#d9f1ec;--ah:#0e7f72}
.act:hover:not([disabled]){background:var(--ah);color:#fff;border-color:var(--ah);transform:translateY(-1px);box-shadow:0 6px 16px rgba(20,30,60,.16)}
.act:hover:not([disabled]) .ai{background:rgba(255,255,255,.22);color:#fff}
.act[disabled]{opacity:.45}

/* 10-14c: 객체 표시 형태 */
.bishape{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin:8px 0 4px 26px;padding:8px 12px;border-left:3px solid #d3def5;background:#f8faff;border-radius:0 8px 8px 0}
.bishape.off{opacity:.45}
.bs-h{font-size:12.5px;font-weight:700;color:var(--sub);margin-right:4px}
.bs-ic{display:inline-block;margin:0 6px 0 2px;vertical-align:-2px}
.bs-ic.rect{width:16px;height:11px;border:2px solid #2563eb;border-radius:2px}
.bs-ic.dot{width:11px;height:11px;border-radius:50%;background:#dc2626;box-shadow:0 0 0 2px #fff,0 0 0 3px #e5e7eb}

/* ================================================================ 10-14d 환경설정 화면 — 설명문 vs 설정 항목 구분
   설명문 = 작은 회색 글씨(상자 없음) · 항목 제목 = 굵고 진한 글씨 · 고를 수 있는 것 = 테두리 있는 선택 칩 · 입력칸 = 진한 테두리 */
#ctlBox .tabintro, #ctlBox .setguide{background:none;border:0;border-left:3px solid #d5dbe5;border-radius:0;padding:2px 0 2px 12px;margin:0 0 14px;font-size:13px;color:#6b7486;line-height:1.55}
#ctlBox .tabintro b, #ctlBox .setguide b{color:#4b5568;font-weight:700}
#ctlBox p.sub{font-size:12.5px;color:#7a8496}
/* 항목 제목 */
#cf label:not(.cbx), #ctlBox .grid4 label{display:block;font-size:15.5px;font-weight:800;color:#13265a;margin:22px 0 8px;letter-spacing:-.2px}
#cf .tabpane > label:first-of-type{margin-top:4px}
#cf label:not(.cbx) .sub, #ctlBox .grid4 label .sub{font-size:12.5px;font-weight:400;color:#7a8496;margin:0;letter-spacing:0}
/* 입력칸 · 선택 상자 */
#cf input:not([type=checkbox]):not([type=radio]), #cf select{border:1.5px solid #8e9bb1;border-radius:8px;padding:11px 12px;font-size:15.5px;color:#13265a;font-weight:600;background:#fff}
#cf input:not([type=checkbox]):not([type=radio]):hover, #cf select:hover{border-color:#5b6b86}
#cf input:focus, #cf select:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px rgba(31,95,191,.18)}
#cf input:not([type=checkbox]):not([type=radio]):disabled{background:#f3f5f8;border-style:dashed;border-color:#c3cad6;color:#9aa3b2;font-weight:400}
/* 선택 칩(체크 · 라디오) */
#cf .clswrap{gap:8px;margin-top:0}
#cf .cbx{margin:0;padding:8px 14px 8px 10px;border:1.5px solid #a9b4c6;border-radius:9px;background:#fff;font-size:15px;font-weight:600;color:#1d2a44;transition:.12s;line-height:1.3}
#cf .cbx:hover{border-color:#5b6b86;background:#f7f9fc}
#cf .cbx input{width:18px;height:18px;accent-color:var(--acc);margin:0}
#cf .cbx:has(input:checked){border-color:var(--acc);background:#eaf1ff;color:#123c8c}
#cf .cbx:has(input:disabled){cursor:default;opacity:.75;background:#f3f5f8}
#cf .cbx .sub{font-size:12px;font-weight:400;color:#7a8496;margin:0}
/* 표시 형태 묶음 */
#cf .bishape{margin:10px 0 2px 18px;padding:10px 12px;gap:8px;background:#f7f9fc;border-left:3px solid #b9c7e3}
#cf .bs-h{font-size:13.5px;font-weight:800;color:#13265a}
/* NDJSON 묶음 */
#cf .ndbox{border:1.5px solid #cdd7e6;border-style:solid;background:#fbfcfe;padding:16px 18px;margin-top:24px}
#cf .ndbox .ndhead{font-size:15.5px;font-weight:800;color:#13265a;margin-bottom:6px}
#cf .ndbox .ndhead .sub{font-size:12.5px;font-weight:400;color:#7a8496}
#cf .ndbox > label.cbx{margin:0 8px 8px 0}
/* 저장 버튼 */
#cf #applyRow{margin-top:22px;padding-top:16px;border-top:1px solid var(--line)}
#cf #applyRow button{padding:13px 24px;font-size:15.5px;font-weight:800;border-radius:10px;box-shadow:0 3px 10px rgba(31,95,191,.25)}

/* 10-14e: AI 탭 한 줄 배치 */
#cf .frow{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
#cf .frow.top{align-items:flex-start}
#cf .frow.top .flab{padding-top:9px}
#cf .flab{flex:none;width:132px;font-size:15.5px;font-weight:800;color:#13265a}
#cf .frow select{flex:1;min-width:260px;width:auto}
#cf .frow .clswrap{flex:1}
#cf .fgap{height:24px}
#cf .fhint{margin:8px 0 0 146px;font-size:12.5px;color:#7a8496}
#cf .ftitle{font-size:15.5px;font-weight:800;color:#13265a;margin:0 0 10px}
#cf .ftitle .sub{font-size:12.5px;font-weight:400;color:#7a8496;margin:0}
#cf .vlist{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
#cf .vlist .bishape{margin:0 0 0 24px;align-self:stretch}
@media(max-width:640px){#cf .flab{width:100%}#cf .fhint{margin-left:0}}

/* 10-14f: 대역폭 자동 조절 켜기/끄기 */
#cf .bwsw{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 18px}
#cf .bwsw .sub{font-size:12.5px;color:#7a8496;margin:0}
#cf .bwsw .sub.hot{color:#92400e;font-weight:600}
#cf #bwGrid.off{opacity:.45}
#cf #bwGrid select:disabled{background:#f3f5f8;border-style:dashed;cursor:not-allowed}

/* 10-14g: NDJSON 전송 간격 */
#cf .ndiv{display:flex;align-items:center;flex-wrap:wrap;gap:8px 8px;margin:4px 0 14px}
#cf .ndiv-h{font-size:14.5px;font-weight:800;color:#13265a;margin-right:4px}
#cf .ndiv .sub{font-size:12.5px;color:#7a8496;margin:0 0 0 6px}

/* 10-14h: 장비 폐기 */
.act-del{--ab:#fbf5f5;--af:#9b2c2c;--al:#efd6d6;--ai:#f6e4e4;--ah:#b42318;min-width:150px}
.dev-row.v2 .dr-delbox{grid-column:1/-1}
.delwarn{border:1.5px solid #f2c4c4;background:#fff7f7;border-radius:10px;padding:14px 16px;color:#5b1d1d;font-size:14px}
.delwarn ul{margin:8px 0 10px 18px;padding:0;line-height:1.6}
.delrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.delrow .delin{width:90px;border:1.5px solid #c98d8d;border-radius:8px;padding:8px 10px;font-weight:700}
.delerr{margin-top:6px}

/* 10-15 NVR 받는 방법 고르기 */
#ctlBox .nvrsel{display:flex;flex-direction:column;gap:10px;margin:0 0 10px}
#ctlBox .nvropt{display:flex;gap:12px;align-items:flex-start;border:1.5px solid #c9d1de;border-radius:10px;padding:12px 14px;cursor:pointer;background:#fff;margin:0}
#ctlBox .nvropt:hover{border-color:#8796ad}
#ctlBox .nvropt:has(input:checked){border-color:#2a5bd7;background:#f3f7ff}
#ctlBox .nvropt input{margin-top:3px;width:18px;height:18px;flex:none}
#ctlBox .nvropt b{display:block;font-size:15px;color:#1d2433}
#ctlBox .nvropt small{display:block;font-size:13px;color:#6b7486;line-height:1.5;margin-top:3px}
#ctlBox .nvropt small b{display:inline;font-size:13px;color:#4b5568}
#ctlBox .nvrnow{margin:4px 0 12px}
#ctlBox .nvrsteps{margin:6px 0 10px 20px;padding:0;line-height:1.7;font-size:14px}
#ctlBox .warnt{color:#b4441c;font-size:13px}

/* 10-15 카메라 영상 경로 자동 찾기 */
#cf .camauto{display:block;margin:10px 0 14px;line-height:1.6}
#cf .camauto .sub{display:block;margin-left:24px}

/* 10-15 ONVIF 이름 강조 */
#ctlBox .onvname{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:8px 0 6px;padding:12px 16px;border:2px solid #1d2433;border-radius:10px;background:#fffbe6}
#ctlBox .onvname .ol{font-size:13px;font-weight:700;color:#4b5568}
#ctlBox .onvname .ov{font-size:24px;font-weight:900;letter-spacing:1px;color:#000}

/* 10-15 카메라 찾아 등록 */
#ctlBox .camnow{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;background:#f5f7fb;border:1px solid #d5dbe5;border-radius:8px;padding:10px 14px;font-size:14px;margin:0 0 12px}
#ctlBox .camnow b{font-size:16px} #ctlBox .camnow .sep{color:#9aa3b2}
#ctlBox .scanrow{gap:12px;align-items:center;margin:0 0 10px} #ctlBox #camScan{font-weight:800}
#ctlBox .scantbl{width:100%;margin:6px 0 10px;font-size:14px} #ctlBox .scantbl td,#ctlBox .scantbl th{padding:7px 8px;vertical-align:middle}
#ctlBox .scantbl tr.cur{background:#f3f7ff} #ctlBox .scantbl tr.pick{background:#fffbe6;outline:2px solid #e0b100}
#ctlBox .pill{display:inline-block;font-size:12px;padding:2px 8px;border-radius:99px;background:#e8edf6;color:#2a3a55;font-weight:700}
#ctlBox .pill.ok{background:#e3f5e8;color:#1c6b34} #ctlBox .pill.warn{background:#fff1d6;color:#8a5a00}
#ctlBox .scanother summary{cursor:pointer;color:#6b7486;font-size:13px;margin:4px 0}
#ctlBox .camreg{border:1.5px solid #c9d1de;border-radius:10px;padding:14px 16px;margin-top:6px}
#ctlBox .camurl{margin:8px 0} #ctlBox .camurl summary{cursor:pointer;color:#4b5568;font-size:13px}