:root{color-scheme:dark;--bg:#06101d;--bg2:#091827;--panel:#0d1b2d;--panel2:#112238;--soft:#152943;--line:#243a58;--line2:#304b70;--text:#f4f7fb;--muted:#94a7be;--blue:#2fa9e0;--blue2:#74c8f0;--green:#2fdaa8;--red:#ff627f;--amber:#ffc45a;--purple:#a68cff;--shadow:0 22px 70px rgba(0,0,0,.28);--radius:20px}
html[data-theme="light"]{color-scheme:light;--bg:#dff2fc;--bg2:#effaff;--panel:#ffffff;--panel2:#f5fbff;--soft:#e6f5fc;--line:#d5e1ec;--line2:#b7c9da;--text:#102033;--muted:#60748b;--shadow:0 18px 55px rgba(42,70,95,.11)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 12% -8%,rgba(47,169,224,.22) 0,transparent 32%),radial-gradient(circle at 92% 8%,rgba(74,194,180,.13) 0,transparent 28%),linear-gradient(180deg,var(--bg2) 0%,var(--bg) 55%,#d7eef9 100%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}button,input,select{font:inherit}.app-shell{width:min(1480px,100%);margin:auto;padding:24px 28px 56px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:4px 0 22px}.brand-lockup{display:flex;align-items:center;gap:15px;color:var(--text);text-decoration:none;min-width:0}.logo-frame{width:190px;height:64px;border-radius:14px;background:#020508;border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;padding:5px 10px;overflow:hidden}.logo-frame img{width:100%;height:100%;object-fit:contain}.brand-copy{display:flex;flex-direction:column;gap:3px;min-width:0}.brand-copy strong{font-size:18px;letter-spacing:-.02em;white-space:nowrap}.brand-copy strong em{font-style:normal;color:var(--blue);font-size:.67em;vertical-align:top;margin-left:4px}.brand-copy small{color:var(--muted);font-size:12px;letter-spacing:.06em}.top-actions{display:flex;align-items:center;gap:9px}.icon-btn{width:44px;height:44px;border-radius:13px;border:1px solid var(--line);background:var(--panel);color:var(--text);display:grid;place-items:center;cursor:pointer;font-size:20px;box-shadow:0 6px 18px rgba(0,0,0,.08)}.icon-btn:hover{border-color:var(--line2);transform:translateY(-1px)}.icon-btn.spinning{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.account-menu{position:relative}.account-btn{height:46px;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:14px;padding:5px 10px 5px 6px;display:flex;align-items:center;gap:8px;cursor:pointer}.avatar{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--blue),#1769aa);display:grid;place-items:center;color:white;font-size:11px;font-weight:900}.account-text{display:flex;flex-direction:column;text-align:left;font-weight:700;font-size:12px}.account-text small{color:var(--muted);font-weight:500;font-size:10px}.account-drop{position:absolute;right:0;top:52px;width:190px;padding:7px;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);z-index:20}.account-drop a{display:block;padding:10px 11px;border-radius:9px;color:var(--text);text-decoration:none;font-size:13px}.account-drop a:hover{background:var(--soft)}.danger-link{color:var(--red)!important}
.hero-panel{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;padding:26px 28px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(125deg,color-mix(in srgb,var(--panel) 94%,var(--blue) 6%),var(--panel));box-shadow:var(--shadow);overflow:hidden;position:relative}.hero-panel:after{content:"";position:absolute;width:390px;height:390px;right:-180px;top:-250px;border-radius:50%;background:color-mix(in srgb,var(--blue) 14%,transparent);filter:blur(4px);pointer-events:none}.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:850;color:var(--blue);margin-bottom:7px}.hero-panel h1{font-size:clamp(30px,4vw,50px);margin:0;letter-spacing:-.045em;line-height:1}.hero-panel p{color:var(--muted);font-size:16px;margin:11px 0 0;max-width:720px;line-height:1.55}.hero-meta{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-end;gap:8px;color:var(--muted);font-size:13px;text-align:right}.hero-meta a{display:inline-flex;align-items:center;gap:7px;color:var(--blue2);text-decoration:none;font-weight:700}.live-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 14px var(--green)}
.summary-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:13px;margin:16px 0}.summary-card{min-width:0;min-height:108px;padding:17px 18px;border:1px solid var(--line);border-radius:18px;background:var(--panel);display:flex;gap:13px;align-items:center}.summary-icon{width:36px;height:36px;border-radius:11px;background:var(--soft);display:grid;place-items:center;color:var(--blue);font-weight:900;flex:0 0 auto}.summary-card div:last-child{display:flex;flex-direction:column;min-width:0}.summary-card span{font-size:11px;color:var(--muted);letter-spacing:.085em;font-weight:750;white-space:nowrap}.summary-card strong{font-size:30px;margin-top:5px;letter-spacing:-.02em}.summary-card.online strong,.summary-card.online .summary-icon{color:var(--green)}.summary-card.offline strong,.summary-card.offline .summary-icon{color:var(--red)}.summary-card.special strong b:first-child{color:var(--amber)}.summary-card.special strong b:last-child{color:var(--purple)}
.data-panel{border:1px solid var(--line);border-radius:24px;background:var(--panel);overflow:hidden}.toolbar{display:flex;gap:12px;padding:17px 18px 11px}.search-wrap{height:50px;flex:1;border:1px solid var(--line);border-radius:14px;background:var(--panel2);display:flex;align-items:center;padding:0 14px}.search-wrap:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 12%,transparent)}.search-wrap svg{width:20px;height:20px;fill:none;stroke:var(--muted);stroke-width:2;margin-right:10px}.search-wrap input{width:100%;border:0;outline:0;background:transparent;color:var(--text);font-size:15px}.search-wrap input::placeholder{color:color-mix(in srgb,var(--muted) 75%,transparent)}.toolbar select{height:50px;min-width:160px;border:1px solid var(--line);border-radius:14px;background:var(--panel2);color:var(--text);padding:0 12px;outline:0}.list-meta{display:flex;justify-content:space-between;gap:12px;padding:0 20px 12px;color:var(--muted);font-size:12px}.asset-note{font-size:11px}.error-box{margin:0 18px 14px;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--red) 10%,transparent);border:1px solid color-mix(in srgb,var(--red) 30%,transparent);color:var(--red)}.table-scroll{overflow:auto;max-height:calc(100vh - 360px)}table{width:100%;border-collapse:collapse;min-width:1200px}thead{position:sticky;top:0;background:var(--panel2);z-index:2}th{text-align:left;color:var(--muted);font-size:10px;letter-spacing:.085em;text-transform:uppercase;padding:13px 12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);white-space:nowrap}td{padding:12px;border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent);font-size:12px;white-space:nowrap}tbody tr{cursor:pointer;transition:.14s ease}tbody tr:hover{background:color-mix(in srgb,var(--blue) 5%,transparent)}.user-link{color:var(--text);background:none;border:0;padding:0;font-weight:800;cursor:pointer}.ip-link{appearance:none;border:0;background:transparent;padding:0;color:var(--blue2);font:inherit;font-weight:800;cursor:pointer;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}.ip-link:hover{color:var(--blue);text-decoration-style:solid}.ip-link:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}.mobile-ip-link{color:var(--blue2);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:2px}.inline-muted{display:block;color:var(--muted);font-size:10px;margin-top:3px}.status-badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 8px;font-weight:800;font-size:10px}.status-badge:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}.status-badge.online{color:var(--green);background:color-mix(in srgb,var(--green) 11%,transparent)}.status-badge.offline{color:var(--red);background:color-mix(in srgb,var(--red) 11%,transparent)}.status-badge.isolir{color:var(--amber);background:color-mix(in srgb,var(--amber) 13%,transparent)}.tag-isolir{display:inline-flex;margin-left:6px;font-size:8px;padding:3px 5px;border-radius:5px;background:color-mix(in srgb,var(--amber) 15%,transparent);color:var(--amber);font-weight:900}.loading{text-align:center;color:var(--muted);padding:35px}.mobile-cards{display:none}.pagination{padding:13px 18px;display:flex;align-items:center;justify-content:flex-end;gap:10px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.pagination button{height:34px;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:9px;padding:0 11px;cursor:pointer}.pagination button:disabled{opacity:.4;cursor:not-allowed}footer{display:flex;justify-content:space-between;gap:15px;color:var(--muted);font-size:11px;padding:18px 3px}
.modal-open{overflow:hidden}.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(0,7,16,.68);backdrop-filter:blur(7px);display:flex;justify-content:flex-end}.modal-backdrop[hidden]{display:none}.user-modal{width:min(570px,100%);height:100%;background:var(--panel);border-left:1px solid var(--line);box-shadow:-20px 0 70px rgba(0,0,0,.28);display:flex;flex-direction:column}.drag-handle{display:none}.modal-head{padding:22px 24px 18px;display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--line)}.modal-head h2{font-size:22px;margin:0 0 7px;letter-spacing:-.02em}.close-btn{width:40px;height:40px;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:12px;font-size:23px;cursor:pointer}.modal-scroll{padding:7px 24px 24px;overflow:auto;flex:1}.detail-row{display:grid;grid-template-columns:42% 58%;gap:10px;padding:13px 0;border-bottom:1px solid var(--line)}.detail-row .k{font-size:10px;letter-spacing:.075em;text-transform:uppercase;color:var(--muted);font-weight:850}.detail-row .v{text-align:right;font-size:12px;font-weight:650;overflow-wrap:anywhere}.feature-card{margin-top:18px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--panel2)}.feature-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.feature-head div{display:flex;flex-direction:column;gap:3px}.feature-head small{font-size:9px;letter-spacing:.09em;color:var(--muted);font-weight:850}.feature-head strong{font-size:11px}.live-pill,.shield-pill{font-size:8px;font-weight:900;letter-spacing:.08em;border-radius:999px;padding:5px 7px}.live-pill{color:var(--green);background:color-mix(in srgb,var(--green) 12%,transparent)}.shield-pill{color:var(--blue);background:color-mix(in srgb,var(--blue) 12%,transparent)}.traffic-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}.traffic-grid>div{padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.traffic-grid span{display:block;color:var(--muted);font-size:9px}.traffic-grid strong{display:block;color:var(--green);font-size:19px;margin:4px 0}.traffic-grid>div:nth-child(2) strong{color:var(--blue)}.traffic-grid small{color:var(--muted);font-size:9px}.feature-foot{margin-top:9px;color:var(--muted);font-size:9px}.ont-card p{color:var(--muted);font-size:11px;line-height:1.5;margin:10px 0}.ont-result{display:flex;flex-direction:column;gap:3px;margin:9px 0;padding:10px;border-radius:11px;font-size:10px;overflow-wrap:anywhere}.ont-result.success{background:color-mix(in srgb,var(--green) 9%,transparent);border:1px solid color-mix(in srgb,var(--green) 25%,transparent)}.ont-result.error{background:color-mix(in srgb,var(--red) 9%,transparent);border:1px solid color-mix(in srgb,var(--red) 25%,transparent)}.ont-result span{color:var(--blue2);font-weight:750}.ont-result small{color:var(--muted)}.feature-actions{display:flex;gap:8px;flex-wrap:wrap}.modal-actions{padding:14px 24px 20px;border-top:1px solid var(--line)}.primary-btn,.secondary-btn{min-height:44px;border-radius:12px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:800;cursor:pointer}.primary-btn{border:1px solid color-mix(in srgb,var(--blue) 65%,var(--line));background:linear-gradient(135deg,#168cc7,var(--blue));color:white}.primary-btn:hover{filter:brightness(1.05)}.secondary-btn{border:1px solid var(--line);background:var(--panel2);color:var(--text)}.primary-btn.small,.secondary-btn.small{min-height:38px;font-size:11px}.modal-actions .secondary-btn{width:100%}
.login-page{display:grid;place-items:center;min-height:100vh;padding:24px;background:radial-gradient(circle at 50% 0%,#12304c 0,transparent 38%),#050c15}.login-shell{width:min(460px,100%)}.login-card{background:#0c1828;border:1px solid #263a55;border-radius:24px;padding:28px;box-shadow:0 30px 90px rgba(0,0,0,.42);color:#f4f7fb}.login-card.compact{max-width:450px}.login-logo{height:95px;border-radius:17px;background:#020508;display:flex;align-items:center;justify-content:center;padding:8px 18px;margin-bottom:23px}.login-logo img{width:100%;height:100%;object-fit:contain}.login-copy h1{font-size:31px;margin:0;letter-spacing:-.04em}.login-copy p{color:#91a5bb;line-height:1.55;font-size:13px;margin:9px 0 22px}.login-form{display:flex;flex-direction:column;gap:14px}.login-form label{display:flex;flex-direction:column;gap:7px;color:#a9b8c8;font-size:11px;font-weight:750}.login-form input{width:100%;height:48px;background:#0a1422;border:1px solid #273c58;border-radius:12px;color:white;padding:0 13px;outline:none}.login-form input:focus{border-color:#2fa9e0;box-shadow:0 0 0 3px rgba(47,169,224,.10)}.password-wrap{display:flex;position:relative}.password-wrap input{padding-right:66px}.password-wrap button{position:absolute;right:6px;top:6px;height:36px;border:0;border-radius:8px;background:#14253a;color:#8fc9e5;font-size:10px;font-weight:800;cursor:pointer}.login-form .primary-btn{width:100%;margin-top:4px;border:0}.login-form .primary-btn:disabled{opacity:.5;cursor:not-allowed}.form-alert{margin-bottom:15px;border:1px solid rgba(255,98,127,.25);background:rgba(255,98,127,.08);color:#ff8ea2;border-radius:11px;padding:10px 12px;font-size:11px}.form-alert.success{border-color:rgba(47,218,168,.25);background:rgba(47,218,168,.08);color:#65e6bc}.login-foot{text-align:center;color:#62768b;font-size:9px;letter-spacing:.1em;margin-top:22px}.secondary-link{text-align:center;color:#69bfe7;text-decoration:none;font-size:11px;padding:6px}
@media(max-width:1050px){.summary-grid{grid-template-columns:repeat(3,1fr)}.summary-card:nth-child(4),.summary-card:nth-child(5){grid-column:auto}.hero-panel{align-items:flex-start;flex-direction:column}.hero-meta{align-items:flex-start;text-align:left}.logo-frame{width:160px}}
@media(max-width:760px){.app-shell{padding:14px 14px 35px}.topbar{padding-bottom:14px}.logo-frame{width:124px;height:48px;border-radius:11px}.brand-copy strong{font-size:14px}.brand-copy small{font-size:9px}.account-text{display:none}.account-btn{padding-right:7px}.avatar{width:32px;height:32px}.icon-btn{width:39px;height:39px}.hero-panel{padding:20px;border-radius:20px}.hero-panel h1{font-size:30px}.hero-panel p{font-size:13px}.hero-meta{font-size:11px}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:10px 0}.summary-card{min-height:86px;padding:12px;gap:9px;border-radius:15px}.summary-card:last-child{grid-column:1/-1}.summary-icon{width:31px;height:31px;border-radius:9px}.summary-card span{font-size:8px}.summary-card strong{font-size:24px}.toolbar{padding:12px;display:grid;grid-template-columns:1fr}.search-wrap,.toolbar select{height:46px;min-width:0;width:100%}.list-meta{padding:0 13px 10px;font-size:10px}.asset-note{display:none}.desktop-table{display:none}.mobile-cards{display:grid;padding:0 10px 10px;gap:9px}.mobile-user-card{width:100%;text-align:left;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:15px;padding:13px;cursor:pointer}.mobile-user-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.mobile-user-head>div:first-child{display:flex;flex-direction:column;min-width:0}.mobile-user-head strong{font-size:13px;overflow-wrap:anywhere}.mobile-user-head small{color:var(--muted);font-size:10px;margin-top:3px}.mobile-user-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}.mobile-user-grid span{min-width:0}.mobile-user-grid small{display:block;color:var(--muted);font-size:8px;letter-spacing:.06em}.mobile-user-grid b{display:block;font-size:10px;margin-top:3px;overflow-wrap:anywhere}.tap-hint{margin-top:11px;padding-top:9px;border-top:1px solid var(--line);color:var(--blue);font-size:9px}.pagination{justify-content:space-between;padding:11px 12px}.pagination button{font-size:10px}.pagination span{font-size:10px}footer{flex-direction:column;font-size:9px}.modal-backdrop{align-items:flex-end}.user-modal{width:100%;height:auto;max-height:94vh;border-left:0;border-top:1px solid var(--line);border-radius:24px 24px 0 0}.drag-handle{display:block;width:50px;height:5px;border-radius:99px;background:var(--line2);margin:8px auto 0}.modal-head{padding:15px 17px}.modal-head h2{font-size:18px}.modal-scroll{padding:4px 17px 17px}.detail-row{grid-template-columns:42% 58%;padding:11px 0}.detail-row .k{font-size:9px}.detail-row .v{font-size:11px}.traffic-grid{grid-template-columns:1fr 1fr}.traffic-grid strong{font-size:16px}.modal-actions{padding:11px 17px 15px}.login-page{padding:14px}.login-card{padding:20px;border-radius:20px}.login-copy h1{font-size:27px}}

/* v5.3 — perbaikan NAT akses Web ONT */
.ip-link,.detail-ip-link{color:var(--blue2);font-weight:850;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;cursor:pointer}
.ip-link:hover,.detail-ip-link:hover{color:var(--blue);text-decoration-style:solid}
.detail-ip-link{border:0;background:transparent;padding:0;font-size:inherit}
.mobile-ip-link[data-ip-user]{color:var(--blue2);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;cursor:pointer}

/* ===== ICOMMEDIA v6.0 navigation + ONU GPON ===== */
.main-nav{display:flex;gap:10px;align-items:center;margin:-4px 0 22px;overflow:auto;padding:2px 0 4px;scrollbar-width:none}.main-nav::-webkit-scrollbar{display:none}.main-nav-link{display:inline-flex;align-items:center;gap:9px;min-height:42px;padding:0 15px;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--panel) 88%,transparent);color:var(--muted);text-decoration:none;white-space:nowrap;font-size:13px;font-weight:700}.main-nav-link span{font-size:17px;color:var(--blue)}.main-nav-link em{font-style:normal;font-size:9px;letter-spacing:.08em;padding:3px 6px;border-radius:999px;background:var(--soft);color:var(--blue2)}.main-nav-link:hover,.main-nav-link.active{color:var(--text);border-color:color-mix(in srgb,var(--blue) 55%,var(--line));background:color-mix(in srgb,var(--blue) 11%,var(--panel));box-shadow:0 10px 28px rgba(0,0,0,.08)}
.onu-hero{background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 8%,var(--panel)) 0%,var(--panel) 52%,color-mix(in srgb,var(--green) 6%,var(--panel)) 100%)}.onu-summary{grid-template-columns:repeat(5,minmax(150px,1fr))}.onu-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;margin-top:18px}.onu-main-col{display:grid;gap:18px;min-width:0}.onu-side-col{min-width:0}.onu-block{margin:0}.sticky-card{position:sticky;top:16px}.panel-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.panel-title-row h2{margin:3px 0 5px;font-size:20px;letter-spacing:-.02em}.panel-title-row p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}.panel-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.primary-btn,.secondary-btn,.small-action{appearance:none;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;min-height:42px;padding:0 15px;font-weight:800;cursor:pointer;transition:.2s}.primary-btn{border:1px solid color-mix(in srgb,var(--blue) 80%,white);background:linear-gradient(135deg,var(--blue),color-mix(in srgb,var(--blue) 72%,#1556d8));color:white;box-shadow:0 9px 22px color-mix(in srgb,var(--blue) 20%,transparent)}.secondary-btn{border:1px solid var(--line);background:var(--panel2);color:var(--text)}.primary-btn:hover,.secondary-btn:hover,.small-action:hover{transform:translateY(-1px)}.primary-btn.small,.secondary-btn.small{min-height:35px;padding:0 11px;font-size:12px}.small-action{min-height:32px;padding:0 10px;border:1px solid color-mix(in srgb,var(--blue) 38%,var(--line));background:color-mix(in srgb,var(--blue) 9%,var(--panel2));color:var(--blue2);font-size:11px}.small-action:disabled,.primary-btn:disabled,.secondary-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.onu-toolbar{margin-bottom:12px}.onu-table th,.onu-table td{vertical-align:middle}.onu-table code{font:700 12px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--blue2)}.rx-badge{display:inline-flex;flex-direction:column;gap:1px;font-weight:800;font-size:12px}.rx-badge small{font-size:9px;letter-spacing:.06em;text-transform:uppercase}.rx-badge.good{color:var(--green)}.rx-badge.warning{color:var(--amber)}.rx-badge.critical{color:var(--red)}.onu-status{display:inline-flex;align-items:center;min-height:26px;padding:0 9px;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--line)}.onu-status.online{color:var(--green);border-color:color-mix(in srgb,var(--green) 38%,var(--line));background:color-mix(in srgb,var(--green) 9%,transparent)}.onu-status.dyinggasp{color:var(--amber);border-color:color-mix(in srgb,var(--amber) 38%,var(--line));background:color-mix(in srgb,var(--amber) 9%,transparent)}.onu-status.los{color:var(--red);border-color:color-mix(in srgb,var(--red) 38%,var(--line));background:color-mix(in srgb,var(--red) 9%,transparent)}.onu-status.offline{color:var(--muted)}.mode-badge{display:inline-flex;align-items:center;min-height:27px;padding:0 9px;border-radius:999px;background:color-mix(in srgb,var(--purple) 12%,var(--panel2));border:1px solid color-mix(in srgb,var(--purple) 30%,var(--line));color:var(--purple);font-size:9px;font-weight:900;letter-spacing:.08em}.onu-form{display:grid;gap:14px}.onu-form label{display:grid;gap:7px}.onu-form label>span{font-size:11px;font-weight:800;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}.onu-form input,.onu-form select{width:100%;height:45px;border:1px solid var(--line);border-radius:11px;background:var(--panel2);color:var(--text);padding:0 12px;outline:none}.onu-form input:focus,.onu-form select:focus{border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 12%,transparent)}.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:11px}.form-help{margin:0;color:var(--muted);font-size:11px;line-height:1.55}.compact-form{gap:12px}.success-box{border-color:color-mix(in srgb,var(--green) 42%,var(--line))!important;background:color-mix(in srgb,var(--green) 8%,var(--panel2))!important;color:var(--green)!important}.activity-log{display:grid;gap:5px}.activity-item{display:grid;grid-template-columns:14px 1fr;gap:10px;padding:11px 4px;border-bottom:1px solid var(--line)}.activity-item:last-child{border-bottom:0}.activity-dot{width:8px;height:8px;border-radius:50%;background:var(--green);margin-top:5px;box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 10%,transparent)}.activity-dot.error{background:var(--red)}.activity-item b{font-size:12px}.activity-item p{margin:3px 0;color:var(--muted);font-size:12px}.activity-item small{font-size:10px;color:var(--muted)}.onu-modal{max-width:650px}.command-preview{white-space:pre-wrap;word-break:break-word;margin:12px 0 0;padding:14px;border-radius:12px;border:1px solid var(--line);background:#07101d;color:#bce8ff;font:600 11px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.command-preview.compact{max-height:210px;overflow:auto;text-align:left}.onu-mobile-cards{display:none}.onu-mobile-card .rx-badge{display:inline-flex}.onu-mobile-card .mobile-user-grid span{min-width:0}
@media(max-width:1120px){.onu-layout{grid-template-columns:1fr}.sticky-card{position:static}.onu-summary{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.main-nav{margin-top:0}.main-nav-link{flex:1;justify-content:center;padding:0 11px}.main-nav-link em{display:none}.onu-summary{grid-template-columns:1fr 1fr}.panel-title-row{flex-direction:column;align-items:stretch}.panel-actions>*{flex:1}.onu-block .table-scroll{display:none}.onu-block#unconfiguredSection .table-scroll{display:block;overflow:auto}.onu-block#unconfiguredSection table{min-width:650px}.onu-mobile-cards{display:grid}.form-grid-2{grid-template-columns:1fr}.onu-side-col{order:-1}.sticky-card{position:static}.onu-hero h1{font-size:28px}.onu-modal{width:100%;max-width:none}}
@media(max-width:480px){.onu-summary{grid-template-columns:1fr 1fr}.onu-summary .summary-card:last-child{grid-column:1/-1}.main-nav-link b{font-size:11px}.panel-actions{width:100%}.primary-btn,.secondary-btn{width:100%}}

/* ===== ICOMMEDIA v6.1 — ONU aesthetic + ZTE C320 Sync ===== */
.sync-btn{appearance:none;border:1px solid color-mix(in srgb,var(--green) 48%,var(--line));background:color-mix(in srgb,var(--green) 10%,var(--panel2));color:var(--green);min-height:42px;padding:0 15px;border-radius:12px;font-weight:850;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;transition:.2s}.sync-btn:hover{transform:translateY(-1px);border-color:var(--green)}.sync-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.settings-message{margin:16px 0;padding:13px 15px;border:1px solid var(--line);border-radius:14px;background:var(--panel2);color:var(--text);font-size:12px;font-weight:700;line-height:1.55}.settings-message.success{border-color:color-mix(in srgb,var(--green) 38%,var(--line));color:var(--green);background:color-mix(in srgb,var(--green) 8%,var(--panel))}.settings-message.error{border-color:color-mix(in srgb,var(--red) 38%,var(--line));color:var(--red);background:color-mix(in srgb,var(--red) 8%,var(--panel))}.settings-message.warning{border-color:color-mix(in srgb,var(--amber) 38%,var(--line));color:var(--amber);background:color-mix(in srgb,var(--amber) 8%,var(--panel))}
.panel-title-row.roomy{padding:23px 24px 0;margin-bottom:18px}.onu-block{margin-top:18px}.onu-block>.activity-log{padding:0 24px 20px}.onu-discovery-panel{overflow:visible}.onu-toolbar{padding:0 24px 18px;margin:0}.onu-table-scroll{max-height:none;border-top:1px solid var(--line)}
.onu-hero-v61{align-items:stretch;gap:22px}.onu-hero-copy{min-width:0;flex:1;display:flex;flex-direction:column;justify-content:center}.onu-hero-copy p{max-width:780px}.hero-action-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px;position:relative;z-index:2}.olt-live-card{position:relative;z-index:2;width:min(360px,34%);min-width:290px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--panel2) 88%,transparent);padding:17px;display:flex;flex-direction:column;justify-content:space-between;gap:16px}.olt-live-head{display:flex;align-items:center;gap:11px}.olt-live-head>div{display:flex;flex-direction:column;min-width:0}.olt-live-head small{font-size:9px;letter-spacing:.13em;color:var(--muted);font-weight:900}.olt-live-head strong{font-size:13px;margin-top:3px;overflow-wrap:anywhere}.connection-dot{width:12px;height:12px;border-radius:50%;background:var(--muted);box-shadow:0 0 0 5px color-mix(in srgb,var(--muted) 9%,transparent);flex:0 0 auto}.connection-dot.ready{background:var(--green);box-shadow:0 0 14px color-mix(in srgb,var(--green) 75%,transparent),0 0 0 5px color-mix(in srgb,var(--green) 10%,transparent)}.olt-live-meta{display:grid;gap:6px;color:var(--muted);font-size:11px;line-height:1.45;overflow-wrap:anywhere}.olt-live-card>a{display:inline-flex;align-items:center;gap:7px;color:var(--blue2);text-decoration:none;font-size:11px;font-weight:800}
.uncfg-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 24px 24px}.uncfg-card{min-width:0;border:1px solid var(--line);border-radius:17px;background:var(--panel2);padding:16px;display:flex;flex-direction:column;gap:14px}.uncfg-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.uncfg-top>div{display:flex;flex-direction:column}.uncfg-top small,.uncfg-sn small,.uncfg-meta small,.onu-card-sn small,.onu-card-grid small{font-size:8px;letter-spacing:.09em;color:var(--muted);font-weight:850;text-transform:uppercase}.uncfg-top strong{font-size:18px;margin-top:2px}.source-chip{font-size:8px;letter-spacing:.08em;font-weight:900;padding:5px 7px;border-radius:999px;color:var(--blue2);border:1px solid color-mix(in srgb,var(--blue) 30%,var(--line));background:color-mix(in srgb,var(--blue) 7%,transparent);max-width:45%;overflow-wrap:anywhere;text-align:right}.uncfg-sn{display:flex;flex-direction:column;gap:5px;min-width:0}.uncfg-sn code{font:800 13px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--blue2);overflow-wrap:anywhere;word-break:break-word;white-space:normal}.uncfg-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px}.uncfg-meta span{min-width:0}.uncfg-meta b{display:block;font-size:10px;margin-top:3px;overflow-wrap:anywhere;white-space:normal}.uncfg-card .primary-btn{margin-top:auto;width:100%}.empty-state-card{grid-column:1/-1;min-height:150px;border:1px dashed var(--line2);border-radius:17px;background:color-mix(in srgb,var(--panel2) 75%,transparent);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:25px;color:var(--muted)}.empty-state-card>div{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--soft);color:var(--green);font-weight:900;margin-bottom:9px}.empty-state-card strong{color:var(--text);font-size:13px}.empty-state-card span{font-size:11px;margin-top:5px;line-height:1.5}
.onu-table-v61{min-width:1050px;table-layout:fixed}.onu-table-v61 th:nth-child(1){width:10%}.onu-table-v61 th:nth-child(2){width:21%}.onu-table-v61 th:nth-child(3){width:16%}.onu-table-v61 th:nth-child(4){width:14%}.onu-table-v61 th:nth-child(5),.onu-table-v61 th:nth-child(6){width:10%}.onu-table-v61 th:nth-child(7){width:10%}.onu-table-v61 th:nth-child(8){width:9%}.onu-table-v61 td{white-space:normal;vertical-align:top;padding:15px 12px}.onu-table-v61 tbody tr{cursor:default}.wrap-cell{min-width:0;overflow-wrap:anywhere;word-break:break-word}.cell-stack{display:flex;flex-direction:column;gap:4px;min-width:0}.cell-stack b{overflow-wrap:anywhere}.cell-stack small,.full-subtext{color:var(--muted);font-size:9px;line-height:1.45;white-space:normal;overflow-wrap:anywhere}.full-subtext{display:block;margin-top:4px}.full-code{display:block;white-space:normal!important;overflow-wrap:anywhere;word-break:break-word}.onu-name-link{appearance:none;border:0;background:transparent;color:var(--text);padding:0;text-align:left;font:inherit;font-weight:850;cursor:pointer;white-space:normal;overflow-wrap:anywhere;line-height:1.35}.onu-name-link:hover{color:var(--blue2)}
.onu-mobile-v61{display:none;padding:0 14px 14px;gap:10px}.onu-card-v61{border:1px solid var(--line);border-radius:17px;background:var(--panel2);padding:14px;min-width:0;cursor:pointer}.onu-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.onu-card-name{min-width:0;display:flex;flex-direction:column;gap:4px}.onu-card-name strong{font-size:14px;line-height:1.35;overflow-wrap:anywhere}.onu-card-name span{color:var(--muted);font-size:9px;overflow-wrap:anywhere}.onu-card-sn{margin:12px 0;padding:10px;border:1px solid var(--line);border-radius:11px;background:var(--panel)}.onu-card-sn code{display:block;color:var(--blue2);font:800 11px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;margin-top:4px;overflow-wrap:anywhere;word-break:break-word}.onu-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.onu-card-grid>span{min-width:0}.onu-card-grid b{display:block;margin-top:3px;font-size:10px;overflow-wrap:anywhere}.span-card-2{grid-column:1/-1}.onu-card-foot{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);color:var(--blue2);font-size:9px;font-weight:800}
.modal-subtitle{margin:5px 0 0;color:var(--muted);font-size:11px;line-height:1.45}.onu-register-modal{width:min(880px,100%);max-width:none}.onu-detail-modal{width:min(690px,100%);max-width:none}.register-scroll{padding:20px 24px 25px}.onu-form-v61{gap:16px}.form-section{border:1px solid var(--line);border-radius:17px;background:var(--panel2);padding:17px;min-width:0}.form-section-head{display:flex;align-items:center;gap:10px;margin-bottom:15px}.form-section-head>span,.settings-section-title>span{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;background:color-mix(in srgb,var(--blue) 12%,var(--soft));color:var(--blue);font-size:10px;font-weight:900;flex:0 0 auto}.form-section-head>div,.settings-section-title>div{display:flex;flex-direction:column;min-width:0}.form-section-head strong,.settings-section-title strong{font-size:12px}.form-section-head small,.settings-section-title small{color:var(--muted);font-size:9px;margin-top:2px;line-height:1.4}.reg-grid{display:grid;gap:12px;min-width:0}.reg-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.reg-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.reg-grid .span-2{grid-column:span 2}.field{display:flex!important;flex-direction:column;gap:7px;min-width:0}.field>span{font-size:9px!important;letter-spacing:.08em!important;color:var(--muted)!important;font-weight:850!important;text-transform:uppercase}.field input,.field select,.field textarea{width:100%;min-width:0;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--text);padding:0 12px;outline:none}.field input,.field select{height:46px}.field textarea{min-height:86px;padding:11px 12px;resize:vertical;line-height:1.5;font:inherit}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 11%,transparent)}.field small{color:var(--muted);font-size:9px}.register-footer{display:flex;justify-content:flex-end;gap:9px;padding-top:3px}.register-submit{min-width:180px}.detail-v61 .detail-row{grid-template-columns:34% 66%}.detail-v61 .detail-row .v{white-space:normal;overflow-wrap:anywhere;word-break:break-word}

/* OLT C320 settings page */
.olt-settings-hero{align-items:center}.hero-status-card{position:relative;z-index:2;min-width:270px;border:1px solid var(--line);border-radius:17px;background:var(--panel2);padding:15px;display:flex;align-items:center;gap:12px}.hero-status-card>div{display:flex;flex-direction:column}.hero-status-card small{font-size:8px;color:var(--muted);letter-spacing:.11em;font-weight:900}.hero-status-card strong{font-size:13px;margin-top:3px}.hero-status-card em{font-style:normal;color:var(--muted);font-size:9px;margin-top:3px}.olt-settings-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;margin-top:18px;align-items:start}.olt-settings-card{padding:24px;overflow:visible}.olt-settings-card .panel-title-row{margin-bottom:25px}.settings-section-title{display:flex;align-items:center;gap:10px;padding:17px 0 11px;border-top:1px solid var(--line);margin-top:4px}.settings-section-title:first-of-type{border-top:0;padding-top:0}.olt-form-grid{display:grid;gap:12px;margin-bottom:16px}.olt-form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.olt-form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.field-wide{grid-column:span 1}.password-field{display:flex;min-width:0}.password-field input{border-radius:11px 0 0 11px;border-right:0}.password-field button{width:78px;border:1px solid var(--line);border-radius:0 11px 11px 0;background:var(--soft);color:var(--text);font-size:10px;font-weight:800;cursor:pointer}.switch-row{display:flex!important;align-items:center;gap:11px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel2) 82%,transparent);padding:12px 14px;margin-bottom:18px;cursor:pointer}.switch-row>input{position:absolute;opacity:0;pointer-events:none}.switch-ui{width:42px;height:24px;border-radius:99px;background:var(--line2);position:relative;flex:0 0 auto;transition:.2s}.switch-ui:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:white;top:3px;left:3px;transition:.2s}.switch-row>input:checked+.switch-ui{background:var(--green)}.switch-row>input:checked+.switch-ui:after{left:21px}.switch-row>span:last-child{display:flex;flex-direction:column}.switch-row strong{font-size:11px}.switch-row small{color:var(--muted);font-size:9px;margin-top:2px;line-height:1.45}.olt-command-grid{display:grid;grid-template-columns:1fr;gap:11px}.settings-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}.olt-settings-side{display:grid;gap:18px;position:sticky;top:16px}.connection-overview-card,.raw-output-card{padding:20px}.connection-overview-card h2,.raw-output-card h2{font-size:18px;margin:2px 0 15px}.overview-list{display:grid}.overview-list>div{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}.overview-list span{color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.07em}.overview-list strong{font-size:10px;text-align:right;overflow-wrap:anywhere}.security-note{margin-top:15px;border:1px solid color-mix(in srgb,var(--green) 28%,var(--line));border-radius:13px;background:color-mix(in srgb,var(--green) 6%,transparent);padding:12px}.security-note b{font-size:9px;color:var(--green);letter-spacing:.08em}.security-note p{margin:5px 0 0;color:var(--muted);font-size:10px;line-height:1.5}.raw-output-card .panel-title-row{margin-bottom:12px}.raw-output-card pre{min-height:260px;max-height:520px;overflow:auto;margin:0;border:1px solid var(--line);border-radius:13px;background:#050b13;color:#bce8ff;padding:13px;white-space:pre-wrap;word-break:break-word;font:600 10px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}

@media(max-width:1180px){.uncfg-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.olt-settings-layout{grid-template-columns:1fr}.olt-settings-side{position:static;grid-template-columns:1fr 1fr}.onu-hero-v61{flex-direction:column}.olt-live-card{width:100%;min-width:0}}
@media(max-width:860px){.desktop-onu-table{display:none!important}.onu-mobile-v61{display:grid}.reg-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}.reg-grid.three .span-2{grid-column:span 2}.olt-form-grid.three{grid-template-columns:1fr 1fr}.olt-settings-side{grid-template-columns:1fr}.hero-status-card{width:100%;min-width:0}.olt-settings-hero{flex-direction:column;align-items:stretch}}
@media(max-width:760px){.panel-title-row.roomy{padding:17px 16px 0}.onu-toolbar{padding:0 16px 16px}.uncfg-card-grid{grid-template-columns:1fr;padding:0 16px 16px}.onu-block>.activity-log{padding:0 16px 16px}.hero-action-row{display:grid;grid-template-columns:1fr}.hero-action-row>*{width:100%}.olt-live-card{padding:14px}.register-scroll{padding:13px 16px 18px}.form-section{padding:14px}.reg-grid.three,.reg-grid.two{grid-template-columns:1fr}.reg-grid .span-2,.reg-grid.three .span-2{grid-column:span 1}.register-footer{display:grid;grid-template-columns:1fr}.register-footer>*{width:100%}.register-submit{min-width:0}.onu-register-modal,.onu-detail-modal{width:100%;max-width:none}.olt-settings-card{padding:17px}.olt-form-grid.three,.olt-form-grid.two{grid-template-columns:1fr}.settings-actions{display:grid;grid-template-columns:1fr}.settings-actions>*{width:100%}.main-nav-link{min-width:max-content;flex:0 0 auto}.detail-v61 .detail-row{grid-template-columns:40% 60%}}
@media(max-width:480px){.onu-card-grid{grid-template-columns:1fr}.span-card-2{grid-column:1}.uncfg-meta{grid-template-columns:1fr}.modal-head{gap:10px}.modal-head>div{min-width:0}.modal-head h2,.modal-subtitle{overflow-wrap:anywhere}.detail-v61 .detail-row{grid-template-columns:1fr;gap:5px}.detail-v61 .detail-row .v{text-align:left}.hero-panel h1{overflow-wrap:anywhere}.summary-card span{white-space:normal}.olt-live-head strong{font-size:11px}}

/* v6.2 - All ONU inventory */
.all-onu-hero{display:flex;justify-content:space-between;align-items:center;gap:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 8%,var(--panel)),var(--panel) 55%,color-mix(in srgb,var(--green) 6%,var(--panel)))}
.all-onu-hero>div:first-child{min-width:0}.all-onu-hero .hero-action-row{margin:0;flex:0 0 auto}.all-onu-hero-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:15px;color:var(--muted);font-size:11px}.hero-total-pill{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--panel2);border-radius:999px;padding:7px 11px;font-weight:800;letter-spacing:.04em}.hero-total-pill b{font-size:15px;color:var(--blue2)}
.signal-overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0 18px}.signal-card{border:1px solid var(--line);border-radius:19px;background:var(--panel);padding:16px;min-width:0}.signal-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.signal-card-head>div{display:flex;flex-direction:column;gap:4px;min-width:0}.signal-card-head span{font-size:15px;font-weight:900}.signal-card-head small{font-size:9px;color:var(--muted);white-space:normal}.signal-card-head strong{font-size:12px}.signal-card.good .signal-card-head strong,.signal-card.good .signal-ring{color:var(--green)}.signal-card.warning .signal-card-head strong,.signal-card.warning .signal-ring{color:var(--amber)}.signal-card.critical .signal-card-head strong,.signal-card.critical .signal-ring{color:var(--red)}.signal-card.other .signal-card-head strong,.signal-card.other .signal-ring{color:var(--muted)}.signal-card-body{display:flex;align-items:center;gap:14px;margin-top:14px}.signal-ring{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;border:4px solid currentColor;box-shadow:inset 0 0 0 5px color-mix(in srgb,currentColor 10%,transparent)}.signal-ring span{font-size:17px;font-weight:900}.signal-counts{min-width:0;flex:1}.signal-counts p{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0;padding:5px 0;border-bottom:1px solid color-mix(in srgb,var(--line) 65%,transparent)}.signal-counts p:last-child{border-bottom:0}.signal-counts span{font-size:9px;color:var(--muted);font-weight:800}.signal-counts b{font-size:13px}
.all-onu-panel{overflow:visible}.all-onu-filterbar{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr)) minmax(220px,1.6fr);gap:8px;padding:0 18px 12px}.all-onu-filterbar select,.all-onu-list-head select{height:38px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);color:var(--text);padding:0 10px;outline:0;min-width:0}.all-onu-search{height:38px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);display:flex;align-items:center;padding:0 10px;min-width:0}.all-onu-search svg{width:17px;height:17px;fill:none;stroke:var(--muted);stroke-width:2;flex:0 0 auto;margin-right:7px}.all-onu-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--text)}.all-onu-list-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 18px 12px;color:var(--muted);font-size:11px}.all-onu-list-head label{display:flex;align-items:center;gap:7px}.all-onu-list-head select{height:34px;width:76px}.all-onu-table-scroll{max-height:none;overflow:auto;border-top:1px solid var(--line)}.all-onu-table{min-width:1320px;table-layout:fixed}.all-onu-table th:nth-child(1){width:8%}.all-onu-table th:nth-child(2){width:12%}.all-onu-table th:nth-child(3){width:14%}.all-onu-table th:nth-child(4){width:9%}.all-onu-table th:nth-child(5){width:8%}.all-onu-table th:nth-child(6){width:8%}.all-onu-table th:nth-child(7),.all-onu-table th:nth-child(8){width:8%}.all-onu-table th:nth-child(9){width:12%}.all-onu-table th:nth-child(10){width:8%}.all-onu-table th:nth-child(11){width:5%}.all-onu-table td{white-space:normal;vertical-align:middle;overflow-wrap:anywhere;word-break:break-word}.all-onu-table tbody tr{cursor:default}.onu-id-chip{display:inline-flex;align-items:center;border-radius:9px;padding:6px 8px;background:color-mix(in srgb,var(--amber) 18%,var(--panel2));color:var(--amber);font-weight:900;font-size:10px;white-space:nowrap}.strongish{font-size:11px;color:var(--text)}.rx-badge.na{color:var(--muted)}.all-onu-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px;border-top:1px solid var(--line);color:var(--muted);font-size:11px}.page-buttons{display:flex;gap:5px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.page-buttons button{height:34px;min-width:34px;padding:0 10px;border-radius:8px;border:1px solid var(--line);background:var(--panel2);color:var(--text);cursor:pointer}.page-buttons button.active{background:var(--blue);color:#fff;border-color:var(--blue)}.page-buttons button:disabled{opacity:.4;cursor:not-allowed}.all-onu-mobile{display:none;padding:0 12px 12px;gap:10px}.all-onu-card{border:1px solid var(--line);border-radius:16px;background:var(--panel2);padding:14px;cursor:pointer;min-width:0}.all-onu-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.all-onu-card-head>div{display:flex;flex-direction:column;gap:4px;min-width:0}.all-onu-card-head small{color:var(--muted);font-size:9px;overflow-wrap:anywhere}.all-onu-card-head strong{font-size:14px;overflow-wrap:anywhere;line-height:1.35}.all-onu-card>p{margin:10px 0;color:var(--muted);font-size:10px;line-height:1.45;overflow-wrap:anywhere}.all-onu-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.all-onu-card-grid>span{min-width:0}.all-onu-card-grid small{display:block;color:var(--muted);font-size:8px;letter-spacing:.05em}.all-onu-card-grid b,.all-onu-card-grid code{display:block;margin-top:4px;font-size:10px;overflow-wrap:anywhere;word-break:break-word}.all-onu-card-grid .wide{grid-column:1/-1}
@media(max-width:1220px){.signal-overview{grid-template-columns:repeat(2,minmax(0,1fr))}.all-onu-filterbar{grid-template-columns:repeat(3,minmax(0,1fr))}.all-onu-search{grid-column:span 3}}
@media(max-width:860px){.desktop-all-onu{display:none}.all-onu-mobile{display:grid}.all-onu-hero{flex-direction:column;align-items:stretch}.all-onu-hero .hero-action-row{display:grid;grid-template-columns:1fr 1fr}.all-onu-filterbar{grid-template-columns:1fr 1fr}.all-onu-search{grid-column:1/-1}.all-onu-pagination{align-items:flex-start;flex-direction:column}.page-buttons{width:100%;justify-content:flex-start}}
@media(max-width:560px){.signal-overview{grid-template-columns:1fr}.all-onu-filterbar{grid-template-columns:1fr;padding:0 14px 12px}.all-onu-search{grid-column:1}.all-onu-hero .hero-action-row{grid-template-columns:1fr}.all-onu-list-head{padding-left:14px;padding-right:14px}.all-onu-pagination{padding:12px 14px}.page-buttons button{height:32px;min-width:31px;padding:0 8px;font-size:10px}}

/* v6.7 — ONU GPON unified menu + SNMP v2c sync */
.onu-module-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0 18px}
.onu-module-tab{display:grid;grid-template-columns:42px 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:14px 16px;border:1px solid var(--border);border-radius:16px;background:var(--panel);color:var(--text);text-decoration:none;min-width:0;transition:.18s ease}
.onu-module-tab>span{grid-row:1/3;display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--soft);font-size:20px}
.onu-module-tab b{font-size:14px;white-space:normal;overflow-wrap:anywhere}.onu-module-tab small{color:var(--muted);font-size:11px;white-space:normal;overflow-wrap:anywhere}
.onu-module-tab:hover{transform:translateY(-1px);border-color:var(--accent)}.onu-module-tab.active{border-color:rgba(44,181,232,.55);box-shadow:0 0 0 1px rgba(44,181,232,.12) inset}.onu-module-tab.active>span{background:rgba(44,181,232,.14);color:var(--accent)}
@media(max-width:620px){.onu-module-tabs{grid-template-columns:1fr;gap:8px}.onu-module-tab{padding:11px 13px}.onu-module-tab>span{width:38px;height:38px}.main-nav-link em{display:none}}

/* v6.7 — SNMP v2c OLT sync */
.snmp-oid-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}.snmp-oid-grid>div{min-width:0;padding:14px 15px;border:1px solid var(--line,#24364d);border-radius:14px;background:var(--panel-soft,rgba(255,255,255,.025))}.snmp-oid-grid small{display:block;font-size:10px;font-weight:800;letter-spacing:.1em;opacity:.65;margin-bottom:7px}.snmp-oid-grid code{display:block;white-space:normal;overflow-wrap:anywhere;font-size:12px}.snmp-sync-grid .raw-output-card pre{min-height:255px}.connection-stack .conn-badge{white-space:nowrap}
@media(max-width:760px){.snmp-oid-grid{grid-template-columns:1fr}.olt-device-table-wrap{overflow-x:auto}.olt-connection-modal{width:min(94vw,720px)}.connection-section-row{grid-template-columns:1fr!important}.connection-section-row>span{margin-bottom:8px}.connection-fields{grid-template-columns:1fr!important}}

/* v6.8 — OLT C320 hybrid Telnet + SNMP v2c */
.olt-manage-hero{margin-bottom:16px}.hero-action-row{display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1}.primary-btn,.secondary-btn,.sync-btn,.test-btn{border:1px solid var(--line);border-radius:11px;padding:10px 14px;font-weight:800;cursor:pointer;transition:.15s ease}.primary-btn{background:var(--blue);border-color:var(--blue);color:#fff}.secondary-btn{background:var(--panel2);color:var(--text)}.sync-btn{background:color-mix(in srgb,var(--green) 16%,var(--panel2));border-color:color-mix(in srgb,var(--green) 45%,var(--line));color:var(--green)}.test-btn{background:color-mix(in srgb,var(--green) 82%,#0a5);border-color:transparent;color:#fff}.small{padding:7px 10px;font-size:11px}.panel-title-row.roomy{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px}.panel-title-row h2{margin:0;font-size:19px}.panel-title-row p{margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.5}.mode-badge{display:inline-flex;padding:7px 10px;border-radius:999px;background:color-mix(in srgb,var(--blue) 10%,var(--panel2));border:1px solid color-mix(in srgb,var(--blue) 30%,var(--line));color:var(--blue2);font-size:9px;font-weight:900;letter-spacing:.08em;white-space:nowrap}.olt-device-table-wrap{overflow:auto;border-top:1px solid var(--line)}.olt-device-table{min-width:900px}.olt-device-table td{vertical-align:middle}.device-cell,.endpoint-cell{display:flex;align-items:center;gap:10px}.endpoint-cell{flex-direction:column;align-items:flex-start;gap:3px}.endpoint-cell small,.device-cell small{display:block;color:var(--muted);font-size:10px}.olt-device-icon{width:36px;height:36px;border-radius:11px;background:var(--soft);display:grid;place-items:center;color:var(--blue2)}.connection-stack{display:flex;flex-direction:column;align-items:flex-start;gap:6px}.conn-badge{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:9px;font-weight:900;border:1px solid transparent}.conn-badge.ok{color:var(--green);background:color-mix(in srgb,var(--green) 12%,transparent);border-color:color-mix(in srgb,var(--green) 28%,transparent)}.conn-badge.bad{color:var(--red);background:color-mix(in srgb,var(--red) 10%,transparent);border-color:color-mix(in srgb,var(--red) 24%,transparent)}.conn-badge.pending{color:var(--muted);background:var(--panel2);border-color:var(--line)}.olt-action-stack{display:flex;gap:7px;flex-wrap:wrap}.olt-inline-message{margin:12px 18px 18px;padding:11px 13px;border-radius:11px;font-size:12px}.olt-inline-message.success{color:var(--green);background:color-mix(in srgb,var(--green) 10%,transparent)}.olt-inline-message.error{color:var(--red);background:color-mix(in srgb,var(--red) 10%,transparent)}.olt-inline-message.warning{color:var(--amber);background:color-mix(in srgb,var(--amber) 10%,transparent)}
.hybrid-sync-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin-top:14px}.hybrid-role-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 20px 20px}.hybrid-role{border:1px solid var(--line);border-radius:15px;background:var(--panel2);padding:15px;display:flex;flex-direction:column;gap:7px}.hybrid-role strong{font-size:14px;color:var(--blue2)}.hybrid-role span{font-size:11px;color:var(--muted)}.raw-output-card pre{margin:0 20px 20px;min-height:220px;max-height:430px;overflow:auto;padding:16px;border-radius:14px;background:#020912;color:#bfeaff;border:1px solid #15283c;font:11px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
.olt-settings-modal[hidden]{display:none}.olt-settings-modal{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:18px}.olt-modal-backdrop{position:absolute;inset:0;background:rgba(0,7,16,.66);backdrop-filter:blur(5px)}.olt-connection-modal{position:relative;width:min(720px,96vw);max-height:92vh;overflow:auto;border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:0 26px 90px rgba(0,0,0,.45);z-index:1}.olt-modal-header{display:flex;justify-content:space-between;align-items:center;padding:17px 18px;border-bottom:1px solid var(--line)}.olt-modal-header h2{margin:0;font-size:17px}.modal-x{width:36px;height:36px;border:0;background:transparent;color:var(--muted);font-size:25px;cursor:pointer}.olt-modal-form{padding:16px}.olt-basic-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.span-2{grid-column:1/-1}.rconfig-field{display:flex;flex-direction:column;gap:6px;min-width:0}.rconfig-field>span{font-size:11px;font-weight:800;color:var(--muted)}.rconfig-field input,.rconfig-field select{width:100%;min-width:0;height:44px;border:1px solid var(--line);border-radius:9px;background:var(--panel2);color:var(--text);padding:0 11px;outline:none}.rconfig-field input:focus,.rconfig-field select:focus{border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 10%,transparent)}.rconfig-field small{font-size:9px;color:var(--muted)}.password-field.clean{display:grid;grid-template-columns:1fr auto;border:1px solid var(--line);border-radius:9px;background:var(--panel2);overflow:hidden}.password-field.clean input{border:0;border-radius:0;background:transparent}.password-field.clean button{border:0;border-left:1px solid var(--line);background:var(--soft);color:var(--text);padding:0 12px;font-size:10px;font-weight:800;cursor:pointer}.rconfig-section{display:grid;grid-template-columns:110px 1fr;gap:18px;border-top:1px solid var(--line);padding-top:16px;margin-top:16px}.rconfig-section>span{font-size:13px;font-weight:900;color:var(--blue2);padding-top:7px}.connection-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;min-width:0}.sync-check{display:flex;align-items:center;gap:9px;margin:16px 0;padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--panel2);font-size:11px;font-weight:700}.modal-test-result{margin:12px 0;padding:12px;border-radius:11px;font-size:11px;line-height:1.55}.modal-test-result.success{background:color-mix(in srgb,var(--green) 10%,transparent);color:var(--green)}.modal-test-result.error{background:color-mix(in srgb,var(--red) 10%,transparent);color:var(--red)}.modal-test-result.warning{background:color-mix(in srgb,var(--amber) 10%,transparent);color:var(--amber)}.olt-modal-footer{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid var(--line);padding-top:14px;margin-top:14px}.main-nav{display:flex;gap:8px;overflow:auto;padding-bottom:14px}.main-nav-link{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--panel);padding:10px 13px;border-radius:12px;color:var(--text);text-decoration:none;font-size:11px}.main-nav-link.active{border-color:color-mix(in srgb,var(--blue) 55%,var(--line));background:color-mix(in srgb,var(--blue) 8%,var(--panel))}.main-nav-link em{font-style:normal;font-size:8px;color:var(--blue2)}
@media(max-width:900px){.hybrid-sync-grid{grid-template-columns:1fr}.olt-manage-hero{align-items:stretch;flex-direction:column}.hero-action-row{width:100%}.hero-action-row>*{flex:1}.panel-title-row.roomy{align-items:flex-start}}
@media(max-width:620px){.olt-settings-modal{padding:0;align-items:end}.olt-connection-modal{width:100%;max-height:94vh;border-radius:20px 20px 0 0}.olt-basic-grid,.connection-fields{grid-template-columns:1fr}.span-2{grid-column:auto}.rconfig-section{grid-template-columns:1fr;gap:8px}.rconfig-section>span{padding-top:0}.olt-modal-footer{display:grid;grid-template-columns:1fr 1fr}.olt-modal-footer .primary-btn{grid-column:1/-1}.hybrid-role-grid{grid-template-columns:1fr}.panel-title-row.roomy{padding:15px}.hybrid-role-grid{padding:0 15px 15px}.raw-output-card pre{margin:0 15px 15px}.app-shell{padding-left:14px;padding-right:14px}.logo-frame{width:140px;height:50px}.brand-copy small{display:none}}


/* v6.9 - Customer name writer for ZTE C320 */
.olt-name-editor{margin:18px 0 4px;padding:16px;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,var(--panel) 92%,var(--accent) 8%)}
.olt-name-editor p{margin:4px 0 14px;color:var(--muted);font-size:13px;line-height:1.55}.olt-name-editor .field{margin-top:10px}.olt-name-editor textarea,.olt-name-editor input{width:100%}
.onu-detail-modal .modal-actions{gap:10px;flex-wrap:wrap}.onu-detail-modal .modal-actions .primary-btn{min-width:170px}
@media(max-width:640px){.olt-name-editor{padding:13px}.onu-detail-modal .modal-actions>*{flex:1 1 100%}}

/* ===== ICOMMEDIA v7.0 — Monitoring & Registrasi ONU Rebuild ===== */
.onu-v70-tabs{position:sticky;top:10px;z-index:18;backdrop-filter:blur(14px);border-radius:18px;margin-bottom:18px}
.onu-v70-tabs .onu-module-tab{min-width:0;flex:1}
.onu-hero-v70{overflow:hidden;position:relative}
.onu-hero-v70:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-90px;top:-120px;background:radial-gradient(circle,rgba(43,177,225,.22),transparent 68%);pointer-events:none}
.onu-summary{grid-template-columns:repeat(6,minmax(0,1fr))}
.summary-card.uncfg strong{color:#42b9ff}
.onu-name-link{max-width:100%;white-space:normal;word-break:break-word;line-height:1.25;text-align:left}
.wrap-cell,.full-subtext,.full-code{white-space:normal!important;overflow-wrap:anywhere;word-break:break-word}
.uncfg-card code{white-space:normal;overflow-wrap:anywhere;word-break:break-all}
#allOnuSection,#unconfiguredSection,#activitySection{scroll-margin-top:115px}
@media(max-width:1100px){.onu-summary{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.onu-v70-tabs{position:static;display:grid;grid-template-columns:1fr 1fr;gap:8px}.onu-v70-tabs .onu-module-tab{padding:12px}.onu-summary{grid-template-columns:1fr 1fr}.onu-hero-v70 h1{font-size:clamp(28px,9vw,42px)}.hero-action-row{display:grid;grid-template-columns:1fr}.hero-action-row>*{width:100%;justify-content:center}.onu-toolbar{display:grid;grid-template-columns:1fr}.onu-toolbar select{width:100%}}

/* ===== Monitoring ICOMMEDIA v7.2: ONU menu + live detail ===== */
.onu-two-tabs{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px}
.add-onu-hero{margin-top:4px}
.clean-all-onu-hero{margin-top:4px}
.clean-all-onu-hero p{max-width:850px}
.compact-filters{grid-template-columns:repeat(5,minmax(125px,1fr)) minmax(260px,1.5fr)}
.all-onu-table-v72{min-width:1420px}
.all-onu-table-v72 th:nth-child(1){width:8%}.all-onu-table-v72 th:nth-child(2){width:15%}.all-onu-table-v72 th:nth-child(3){width:10%}.all-onu-table-v72 th:nth-child(4){width:8%}.all-onu-table-v72 th:nth-child(5){width:8%}.all-onu-table-v72 th:nth-child(6),.all-onu-table-v72 th:nth-child(7){width:8%}.all-onu-table-v72 th:nth-child(8){width:10%}.all-onu-table-v72 th:nth-child(9){width:11%}.all-onu-table-v72 th:nth-child(10){width:9%}.all-onu-table-v72 th:nth-child(11){width:5%}
.onu-detail-v72{width:min(720px,100%)}
.detail-status-line{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:7px}
.pppoe-state{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:9px;font-weight:900;letter-spacing:.04em}
.pppoe-state.online{color:var(--green);background:color-mix(in srgb,var(--green) 12%,transparent)}
.pppoe-state.offline{color:var(--red);background:color-mix(in srgb,var(--red) 12%,transparent)}
.pppoe-state.muted{color:var(--muted);background:var(--soft)}
.detail-section-card{margin-top:14px;padding:15px;border:1px solid var(--line);border-radius:16px;background:var(--panel2)}
.detail-section-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.detail-section-title>div{display:flex;flex-direction:column;gap:3px}.detail-section-title small{font-size:9px;letter-spacing:.085em;color:var(--muted);font-weight:850}.detail-section-title strong{font-size:13px}.detail-section-title>span{font-size:9px;color:var(--muted)}
.detail-grid-v72{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.detail-grid-v72 .detail-row{grid-template-columns:42% 58%;min-width:0}
.optical-grid,.service-grid,.pppoe-live-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.optical-grid>div,.service-grid>span,.pppoe-live-meta>span{padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);min-width:0}
.optical-grid span,.service-grid small,.pppoe-live-meta small{display:block;color:var(--muted);font-size:9px;letter-spacing:.05em}.optical-grid strong{display:block;font-size:22px;margin:4px 0;overflow-wrap:anywhere}.optical-grid small{font-size:9px;font-weight:850}.service-grid b,.pppoe-live-meta b{display:block;margin-top:4px;font-size:11px;overflow-wrap:anywhere}
.traffic-v72{margin-top:12px}.traffic-chart-wrap{position:relative;margin-top:12px;border:1px solid var(--line);border-radius:13px;background:var(--panel);padding:10px}.traffic-chart-wrap canvas{display:block;width:100%;height:150px}.traffic-legend{display:flex;justify-content:center;gap:18px;color:var(--muted);font-size:9px;margin-top:6px}.traffic-legend span:first-child{color:var(--blue2)}.traffic-legend span:last-child{color:#f06b8a}
@media(max-width:1050px){.compact-filters{grid-template-columns:repeat(3,minmax(0,1fr))}.compact-filters .all-onu-search{grid-column:1/-1}}
@media(max-width:720px){.onu-two-tabs{grid-template-columns:1fr 1fr;max-width:none}.onu-two-tabs .onu-module-tab{grid-template-columns:36px 1fr;padding:10px}.onu-two-tabs .onu-module-tab>span{width:36px;height:36px}.onu-two-tabs .onu-module-tab small{font-size:9px}.detail-grid-v72{grid-template-columns:1fr}.optical-grid,.service-grid,.pppoe-live-meta{grid-template-columns:1fr 1fr}.onu-detail-v72{width:100%}.compact-filters{grid-template-columns:1fr 1fr}.compact-filters .all-onu-search{grid-column:1/-1}}
@media(max-width:480px){.onu-two-tabs{grid-template-columns:1fr}.optical-grid,.service-grid,.pppoe-live-meta{grid-template-columns:1fr}.compact-filters{grid-template-columns:1fr}.compact-filters .all-onu-search{grid-column:auto}.traffic-chart-wrap canvas{height:125px}}


/* v7.3 - PPPoE auto mapping/status */
.pppoe-cell{gap:4px}.pppoe-mini{display:inline-flex;width:max-content;align-items:center;padding:2px 7px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.02em;background:var(--soft);color:var(--muted)}
.pppoe-mini.online{background:rgba(35,201,139,.12);color:#20b987}.pppoe-mini.offline{background:rgba(243,91,119,.12);color:#e75a76}.pppoe-mini.unknown{background:rgba(111,139,174,.12);color:var(--muted)}
.pppoe-unmapped{display:inline-flex;padding:4px 8px;border-radius:8px;background:rgba(246,183,64,.10);color:#c7952e;font-size:11px;font-weight:700;white-space:normal}

/* ONU management actions */
.onu-management-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.warning-action{border-color:rgba(245,180,55,.45)!important;color:#f5b437!important}
.danger-action{border-color:rgba(245,91,111,.5)!important;color:#f55b6f!important}
.edit-onu-modal{max-width:620px}
.edit-onu-form{padding:18px 22px}
.edit-onu-form label{display:flex;flex-direction:column;gap:7px;margin-bottom:14px;font-weight:700;color:var(--text)}
.edit-onu-form input{width:100%;box-sizing:border-box;border:1px solid var(--line);background:var(--panel-2);color:var(--text);border-radius:12px;padding:12px 13px;font:inherit;outline:none}
.edit-onu-form input:focus{border-color:#36a9df;box-shadow:0 0 0 3px rgba(54,169,223,.12)}
.edit-two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.modal-subtitle{margin:5px 0 0;color:var(--muted);font-size:13px}
@media(max-width:640px){.onu-management-actions{display:grid;grid-template-columns:1fr 1fr}.onu-management-actions button:last-child{grid-column:1/-1}.edit-two-col{grid-template-columns:1fr}}

/* v8.2 layout safety overrides */
html,body{width:100%;overflow-x:hidden}
.app-shell{width:min(1480px,calc(100% - 32px));margin:0 auto;padding:24px 0 56px}
.brand-lockup{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--text);min-width:0}
.brand-lockup img{display:block;max-width:100%;max-height:100%;object-fit:contain}
.main-nav{display:flex!important;align-items:center!important;gap:10px!important;margin:0 0 18px!important;padding:2px 0!important;overflow:visible!important}
.main-nav-link{display:inline-flex!important;align-items:center!important;gap:9px!important;min-height:42px!important;padding:0 15px!important;border:1px solid var(--line)!important;border-radius:13px!important;background:var(--panel)!important;color:var(--muted)!important;text-decoration:none!important;white-space:nowrap!important;font-size:13px!important;font-weight:700!important}
.main-nav-link b{display:inline!important;color:inherit!important}.main-nav-link em{display:inline!important;font-style:normal!important}
.onu-module-tabs{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;margin:16px 0 18px!important}
.onu-module-tab{display:grid!important}
.all-onu-panel{display:block!important;visibility:visible!important}
.desktop-all-onu{display:block!important;visibility:visible!important}
.all-onu-mobile{display:none!important}
.all-onu-list-head{display:flex!important;visibility:visible!important}
.all-onu-table-scroll{display:block!important;visibility:visible!important;overflow-x:auto!important}
.all-onu-table{display:table!important;width:100%!important;min-width:1320px!important;border-collapse:separate!important;border-spacing:0!important}
.all-onu-table thead{display:table-header-group!important}
.all-onu-table tbody{display:table-row-group!important}
.all-onu-table tr{display:table-row!important}
.all-onu-table th,.all-onu-table td{display:table-cell!important}
.all-onu-table .loading{display:table-cell!important}
.all-onu-table img{max-width:100%;max-height:100%;object-fit:contain}
@media(max-width:860px){
 .app-shell{width:calc(100% - 24px);padding:14px 0 36px}
 .desktop-all-onu{display:none!important}
 .all-onu-mobile{display:grid!important}
 .onu-module-tabs{grid-template-columns:1fr!important}
}

/* v8.3 PPPoE customer management */
.toolbar{align-items:center;flex-wrap:wrap}.add-customer-btn{min-height:50px;white-space:nowrap}.add-customer-modal{width:min(620px,100%)}.customer-form{padding:22px 24px 26px}.customer-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.customer-form label{display:flex;flex-direction:column;gap:7px;color:var(--muted);font-size:10px;font-weight:850;letter-spacing:.04em}.customer-form label input{width:100%;height:45px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);color:var(--text);padding:0 12px;outline:none;font:inherit;letter-spacing:normal}.customer-form label input:focus{border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 10%,transparent)}.customer-form label small{font-weight:500;letter-spacing:0}.customer-form .span-2{grid-column:1/-1}.customer-check{display:flex!important;flex-direction:row!important;align-items:center;gap:9px!important;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}.customer-check input{width:17px!important;height:17px!important}.customer-check span{color:var(--text);letter-spacing:normal}.customer-note{margin:14px 0;padding:11px 12px;border-radius:11px;background:color-mix(in srgb,var(--blue) 7%,var(--panel2));border:1px solid color-mix(in srgb,var(--blue) 18%,var(--line));color:var(--muted);font-size:10px;line-height:1.55}.customer-actions{justify-content:flex-end}.customer-actions>*{min-width:150px}.form-alert.success{border-color:color-mix(in srgb,var(--green) 30%,transparent);background:color-mix(in srgb,var(--green) 9%,transparent);color:var(--green)}
@media(max-width:760px){.toolbar{display:grid;grid-template-columns:1fr}.add-customer-btn{width:100%}.customer-form{padding:18px 16px 22px}.customer-form-grid{grid-template-columns:1fr}.customer-form .span-2{grid-column:auto}.customer-actions{display:grid;grid-template-columns:1fr}.customer-actions>*{width:100%}}

/* v8.6 Add ONU WAN */
.wan-method-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px}.wan-method-tab{border:1px solid var(--line,#dbe4ef);background:var(--card,#fff);color:inherit;border-radius:10px;padding:10px 14px;font-weight:700;cursor:pointer}.wan-method-tab.active{background:#168bd5;color:#fff;border-color:#168bd5}.wan-subsection{margin-top:16px;padding:16px;border:1px solid var(--line,#dbe4ef);border-radius:14px;background:rgba(127,160,190,.05)}.subsection-title{font-weight:800;margin-bottom:12px}.field-help{margin:0;color:#6b7280;font-size:.9rem}

/* v8.7 PPPoE dashboard actions */
.summary-clickable{cursor:pointer;user-select:none;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.summary-clickable:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.08);border-color:color-mix(in srgb,var(--blue) 35%,var(--line))}.summary-clickable:focus-visible{outline:3px solid color-mix(in srgb,var(--blue) 30%,transparent);outline-offset:2px}.detail-action-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.detail-action-grid button{min-height:40px}.action-help{margin:0 0 12px;color:var(--muted);font-size:10px;line-height:1.5}.warning-btn,.danger-btn,.success-btn{appearance:none;border:1px solid var(--line);min-height:40px;padding:0 12px;border-radius:10px;font-weight:850;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}.warning-btn{background:color-mix(in srgb,#f59e0b 12%,var(--panel2));color:#d97706;border-color:color-mix(in srgb,#f59e0b 40%,var(--line))}.danger-btn{background:color-mix(in srgb,#ef4444 10%,var(--panel2));color:#dc2626;border-color:color-mix(in srgb,#ef4444 35%,var(--line))}.success-btn{background:color-mix(in srgb,#10b981 10%,var(--panel2));color:#059669;border-color:color-mix(in srgb,#10b981 35%,var(--line))}.warning-btn:disabled,.danger-btn:disabled,.success-btn:disabled{opacity:.5;cursor:not-allowed}.customer-actions-card{margin-top:14px}.customer-actions-card .form-alert{margin-top:10px}
@media(max-width:900px){.detail-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.detail-action-grid{grid-template-columns:1fr}}

/* v8.8 - visible PPPoE dashboard interactions */
.summary-clickable{position:relative}
.summary-clickable.active-filter{border-color:var(--blue)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 12%,transparent),0 10px 24px rgba(0,0,0,.08);transform:translateY(-2px)}
.row-detail-btn{appearance:none;border:1px solid color-mix(in srgb,var(--blue) 35%,var(--line));background:color-mix(in srgb,var(--blue) 8%,var(--panel2));color:var(--blue2);border-radius:9px;padding:7px 11px;font-size:10px;font-weight:850;cursor:pointer}
.row-detail-btn:hover{background:color-mix(in srgb,var(--blue) 15%,var(--panel2));color:var(--blue)}
.tag-disabled{display:inline-flex;margin-left:5px;padding:3px 6px;border-radius:999px;font-size:8px;font-weight:900;color:var(--red);background:color-mix(in srgb,var(--red) 10%,transparent)}
.customer-actions-card{border:2px solid color-mix(in srgb,var(--blue) 16%,var(--line));background:linear-gradient(180deg,color-mix(in srgb,var(--blue) 4%,var(--panel2)),var(--panel2))}
.customer-actions-card .detail-action-grid button{font-size:11px;min-height:44px}
@media(max-width:900px){.detail-action-grid{grid-template-columns:1fr 1fr}.row-detail-btn{padding:6px 9px}}
@media(max-width:760px){.desktop-table table{min-width:1200px}.desktop-table{display:none}}

/* v8.10 PPP Secret editor */
.customer-form .wide{grid-column:1/-1}.customer-form .check-row{display:flex;flex-direction:row;align-items:center;gap:9px;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);letter-spacing:normal}.customer-form .check-row input{width:17px;height:17px}.detail-action-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){.detail-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.detail-action-grid{grid-template-columns:1fr}}

/* v8.11 — Bali Cool Theme / #InternetDariBali */
:root{
  --bali-ocean:#2aa9a1;
  --bali-ocean-deep:#167b78;
  --bali-leaf:#5f9d78;
  --bali-sage:#a9c8b2;
  --bali-sand:#e8d7b5;
  --bali-sky:#dff3f5;
}
html[data-theme="light"]{
  --bg:#edf7f5;
  --bg2:#f7fcfb;
  --panel:#ffffff;
  --panel2:#f1f8f6;
  --soft:#e5f2ee;
  --line:#d1e5df;
  --line2:#aecfc5;
  --blue:#218f91;
  --blue2:#267f80;
  --green:#2bb98a;
  --text:#17302f;
  --muted:#617b78;
}
html,body{
  background:
    radial-gradient(900px 500px at 8% -8%, rgba(77,171,163,.20), transparent 62%),
    radial-gradient(760px 460px at 96% 4%, rgba(169,200,178,.25), transparent 62%),
    radial-gradient(680px 420px at 72% 100%, rgba(232,215,181,.16), transparent 66%),
    linear-gradient(180deg,#eaf7f6 0%,#f5faf8 48%,#edf6f2 100%);
  background-attachment:fixed;
}
html[data-theme="dark"],html[data-theme="dark"] body{
  background:
    radial-gradient(900px 500px at 8% -8%, rgba(42,169,161,.16), transparent 62%),
    radial-gradient(760px 460px at 96% 4%, rgba(95,157,120,.13), transparent 62%),
    radial-gradient(680px 420px at 72% 100%, rgba(232,215,181,.07), transparent 66%),
    linear-gradient(180deg,#071b20 0%,#08151c 50%,#07171a 100%);
  background-attachment:fixed;
}
/* subtle tropical/rice-field atmosphere, intentionally abstract */
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.55;
  background:
    repeating-linear-gradient(168deg,transparent 0 44px,rgba(95,157,120,.035) 45px 46px,transparent 47px 82px),
    radial-gradient(ellipse at 18% 84%,rgba(95,157,120,.06),transparent 30%),
    radial-gradient(ellipse at 82% 20%,rgba(42,169,161,.05),transparent 28%);
}
.hero-panel{
  background:
    radial-gradient(360px 220px at 92% 0%,rgba(42,169,161,.13),transparent 72%),
    radial-gradient(300px 200px at 0% 100%,rgba(95,157,120,.09),transparent 72%),
    linear-gradient(135deg,color-mix(in srgb,var(--panel) 93%,#dff3f5 7%),var(--panel));
  border-color:color-mix(in srgb,var(--bali-ocean) 18%,var(--line));
}
.hero-panel:after{
  background:radial-gradient(circle,rgba(42,169,161,.16),rgba(169,200,178,.08) 45%,transparent 70%);
}
.eyebrow{color:var(--bali-ocean-deep)}
.live-dot{background:var(--bali-ocean);box-shadow:0 0 14px rgba(42,169,161,.55)}
.summary-card:hover,.data-panel:hover{
  border-color:color-mix(in srgb,var(--bali-ocean) 22%,var(--line));
}
.summary-icon{color:var(--bali-ocean)}
.summary-card.online strong,.summary-card.online .summary-icon{color:#2bb98a}
.search-wrap:focus-within,.toolbar select:focus{
  border-color:var(--bali-ocean);
  box-shadow:0 0 0 3px rgba(42,169,161,.10);
}
.main-nav-link:hover,.icon-btn:hover,.account-btn:hover{
  border-color:color-mix(in srgb,var(--bali-ocean) 30%,var(--line));
}
.main-nav-link.active,.main-nav-link[aria-current="page"]{
  border-color:color-mix(in srgb,var(--bali-ocean) 35%,var(--line))!important;
  background:color-mix(in srgb,var(--bali-ocean) 9%,var(--panel))!important;
  color:var(--bali-ocean-deep)!important;
}

/* v8.11.1 — Bali visual background (stronger, clearly visible) */
html[data-theme="light"] body{
  background:
    radial-gradient(ellipse 620px 360px at 0% 0%, rgba(37,181,174,.30) 0%, rgba(37,181,174,.10) 42%, transparent 72%),
    radial-gradient(ellipse 560px 420px at 100% 18%, rgba(119,178,133,.24) 0%, rgba(119,178,133,.08) 46%, transparent 74%),
    radial-gradient(ellipse 700px 360px at 52% 100%, rgba(226,207,166,.24) 0%, rgba(226,207,166,.08) 45%, transparent 78%),
    linear-gradient(135deg,#dff5f3 0%,#eef9f6 28%,#f8fbf5 58%,#e7f3ea 100%) !important;
  background-attachment:fixed !important;
}
html[data-theme="dark"] body{
  background:
    radial-gradient(ellipse 620px 360px at 0% 0%, rgba(37,181,174,.20) 0%, transparent 70%),
    radial-gradient(ellipse 560px 420px at 100% 18%, rgba(92,157,111,.18) 0%, transparent 74%),
    radial-gradient(ellipse 700px 360px at 52% 100%, rgba(210,190,145,.08) 0%, transparent 78%),
    linear-gradient(135deg,#061b20 0%,#082329 35%,#0b1e1b 70%,#101b16 100%) !important;
  background-attachment:fixed !important;
}
html[data-theme="light"] body:before{
  opacity:.95;
  background:
    radial-gradient(ellipse 420px 190px at 12% 92%, rgba(82,151,103,.13), transparent 72%),
    radial-gradient(ellipse 500px 210px at 88% 78%, rgba(42,169,161,.10), transparent 72%),
    repeating-linear-gradient(166deg, transparent 0 62px, rgba(72,137,92,.055) 63px 65px, transparent 66px 116px);
}
/* translucent surfaces let the Bali atmosphere remain visible */
html[data-theme="light"] .hero-panel,
html[data-theme="light"] .data-panel,
html[data-theme="light"] .summary-card{
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(8px);
}
html[data-theme="light"] .main-nav-link,
html[data-theme="light"] .search-wrap,
html[data-theme="light"] .toolbar select,
html[data-theme="light"] .account-btn,
html[data-theme="light"] .icon-btn{
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(8px);
}

/* v8.13 — Clean White + Light Blue Theme */
:root{
  --bali-ocean:#5bbfe8;
  --bali-ocean-deep:#2f91c4;
  --bali-leaf:#5bbfe8;
  --bali-sage:#d9f1fb;
  --bali-sand:#edf8fd;
  --bali-sky:#eaf7fd;
}
html[data-theme="light"]{
  --bg:#f5fbff;
  --bg2:#ffffff;
  --panel:#ffffff;
  --panel2:#f7fcff;
  --soft:#edf8fd;
  --line:#d8eaf4;
  --line2:#b9dced;
  --blue:#3aa9dc;
  --blue2:#2789bd;
  --green:#2bb98a;
  --text:#102a3d;
  --muted:#647f92;
}
html,body{
  background:
    radial-gradient(circle at 8% -10%,rgba(91,191,232,.20) 0,transparent 30%),
    radial-gradient(circle at 94% 0%,rgba(184,224,244,.22) 0,transparent 28%),
    linear-gradient(180deg,#ffffff 0%,#f7fcff 48%,#edf8fd 100%) !important;
}
/* Remove previous green cast from Bali theme */
.bali-theme,
[data-bali-theme]{background-color:transparent !important;}
/* Keep panels white and blue-tinted, never green */
.hero,
.hero-card,
.onu-hero,
.pppoe-hero{
  background:linear-gradient(135deg,#ffffff 0%,#f9fdff 58%,#eaf7fd 100%) !important;
}
.card,.panel,.summary-card,.table-wrap,.search-panel,.feature-card,.traffic-chart-wrap{
  background:#ffffff !important;
  border-color:#d8eaf4 !important;
}
.nav-link.active,.tab.active,.menu-link.active{
  background:#edf8fd !important;
  border-color:#b9dced !important;
  color:#2789bd !important;
}
.primary-btn{background:linear-gradient(135deg,#43b4e4,#2f91c4) !important;}
.icon-btn,.account-btn,.secondary-btn{background:#ffffff !important;}

/* v8.13.1 — PURE WHITE + LIGHT BLUE BACKGROUND OVERRIDE */
html[data-theme="light"], html[data-theme="light"] body {
  --bg:#f4faff;
  --bg2:#ffffff;
  --panel:#ffffff;
  --panel2:#f8fcff;
  --soft:#edf7fd;
  --line:#d7eaf5;
  --line2:#b9dced;
  --blue:#38a9dc;
  --blue2:#268bc0;
  --text:#102a3d;
  --muted:#647f92;
  background:#f5fbff !important;
  background-image:linear-gradient(180deg,#ffffff 0%,#f9fcff 48%,#f0f8fd 100%) !important;
  background-attachment:fixed !important;
}
html[data-theme="light"] body:before,
html[data-theme="light"] body:after { display:none !important; background:none !important; opacity:0 !important; }
html[data-theme="light"] .hero-panel {
  background:linear-gradient(135deg,#ffffff 0%,#ffffff 62%,#eef8fd 100%) !important;
}
html[data-theme="light"] .summary-card,
html[data-theme="light"] .data-panel,
html[data-theme="light"] .main-nav-link,
html[data-theme="light"] .search-wrap,
html[data-theme="light"] .toolbar select,
html[data-theme="light"] .account-btn,
html[data-theme="light"] .icon-btn,
html[data-theme="light"] .summary-card,
html[data-theme="light"] .detail-section-card,
html[data-theme="light"] .traffic-chart-wrap {
  background:#ffffff !important;
  border-color:#d7eaf5 !important;
}
html[data-theme="light"] .main-nav-link.active,
html[data-theme="light"] .main-nav-link[aria-current="page"] {
  background:#edf7fd !important;
  border-color:#a9d8ed !important;
  color:#268bc0 !important;
}
html[data-theme="light"] .primary-btn,
html[data-theme="light"] .add-customer-btn { 
  background:linear-gradient(135deg,#48b7e8,#2f91c4) !important;
}

/* v8.17 — Balinese corner ornament for ICOMMEDIA dashboard */
.hero-panel{isolation:isolate}
.hero-panel::before{content:"";position:absolute;z-index:0;right:-34px;top:-6px;width:min(380px,34%);height:155px;background:url('assets/bali-flourish.png') no-repeat right top / contain;opacity:.52;pointer-events:none;transform:rotate(2deg);filter:saturate(.82) contrast(.96)}
.hero-panel::after{z-index:0}
.hero-panel>div:first-child,.hero-panel>.hero-meta{position:relative;z-index:1}
@media(max-width:1050px){.hero-panel::before{width:320px;opacity:.38;right:-45px;top:-8px}}
@media(max-width:760px){.hero-panel::before{width:210px;height:100px;right:-32px;top:-4px;opacity:.28}.hero-panel>div:first-child{padding-right:55px}.hero-meta{position:relative;z-index:2}}
.password-onu-modal{max-width:620px}.password-onu-modal .modal-scroll{padding-bottom:20px}.password-onu-modal select,.password-onu-modal input{width:100%;box-sizing:border-box}.password-onu-modal .settings-message{margin:12px 0}.onu-management-actions{display:flex;flex-wrap:wrap;gap:8px}

/* v8.21 — Multi-site MikroTik selector */
.site-switcher{display:grid;grid-template-columns:repeat(2,minmax(220px,280px));gap:12px;margin-top:18px;position:relative;z-index:2}.site-btn{position:relative;display:grid;grid-template-columns:42px 1fr 24px;align-items:center;gap:11px;min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.78);color:var(--text);cursor:pointer;text-align:left;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;box-shadow:0 6px 20px rgba(15,45,65,.04)}.site-btn:hover{border-color:var(--line2);transform:translateY(-2px);box-shadow:0 10px 24px rgba(15,45,65,.08)}.site-btn.active{border-color:rgba(34,166,180,.65);background:linear-gradient(135deg,rgba(230,250,249,.96),rgba(255,255,255,.96));box-shadow:0 0 0 3px rgba(34,166,180,.10),0 10px 26px rgba(15,45,65,.08)}.site-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#eef7fa;color:#217f96;font-weight:800;font-size:12px;letter-spacing:.04em}.site-btn.active .site-icon{background:#d8f2ef;color:#168e7e}.site-copy{display:flex;flex-direction:column;gap:2px;min-width:0}.site-copy b{font-size:8px;letter-spacing:.12em;color:var(--muted);text-transform:uppercase}.site-copy strong{font-size:13px;line-height:1.2}.site-copy small{font-size:9px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.site-btn.active .site-copy small{color:#168e7e}.site-check{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#edf2f4;color:transparent;font-size:12px;font-weight:800}.site-btn.active .site-check{background:#d8f2ef;color:#168e7e}@media(max-width:760px){.site-switcher{grid-template-columns:1fr}.site-btn{width:100%}}

/* v8.29 — site selector always interactive */
.site-switcher{position:relative;z-index:20;pointer-events:auto!important}.site-btn{position:relative;z-index:21;pointer-events:auto!important;cursor:pointer!important;user-select:none}.site-btn:disabled{opacity:1;cursor:pointer!important}.site-btn:not(.active):hover{transform:translateY(-2px)}

/* v8.31 — Multi-site connection settings */
.site-tools{margin-top:10px}.site-settings-link{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid var(--line);border-radius:11px;background:var(--panel2);color:var(--text);text-decoration:none;font-size:11px;font-weight:800}.site-settings-link:hover{border-color:var(--blue);transform:translateY(-1px)}
.site-config-hero{margin-bottom:16px}.site-notice{margin:0 0 16px;padding:13px 15px;border-radius:13px;border:1px solid var(--line);font-size:12px;font-weight:700}.site-notice.success{color:var(--green);background:color-mix(in srgb,var(--green) 9%,var(--panel))}.site-notice.error{color:var(--red);background:color-mix(in srgb,var(--red) 9%,var(--panel))}.site-config-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.site-config-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 10px 28px rgba(12,35,60,.06)}.site-config-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}.site-config-head>div{display:flex;align-items:center;gap:12px}.site-number{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,var(--blue) 11%,var(--panel2));color:var(--blue2);font-weight:900}.site-config-head small{display:block;color:var(--muted);font-size:9px;font-weight:900;letter-spacing:.1em}.site-config-head h2{margin:3px 0 0;font-size:19px}.site-config-status{padding:7px 10px;border-radius:999px;font-size:9px;font-weight:900}.site-config-status.ready{color:var(--green);background:color-mix(in srgb,var(--green) 11%,transparent)}.site-config-status.empty{color:var(--amber);background:color-mix(in srgb,var(--amber) 11%,transparent)}.site-config-form{display:grid;gap:12px}.site-config-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.site-config-actions{display:flex;gap:9px;justify-content:flex-end;margin-top:4px}.site-config-actions>*{min-width:125px}@media(max-width:800px){.site-config-grid{grid-template-columns:1fr}}@media(max-width:520px){.site-config-two{grid-template-columns:1fr}.site-config-actions{display:grid;grid-template-columns:1fr}.site-config-actions>*{width:100%}}