@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;600;700;800&family=Manrope:wght@600;700;800&display=swap');
:root{--bg:#090d18;--panel:#111827;--line:#263148;--text:#eef3ff;--muted:#8793ac;--blue:#4b7dff;--violet:#8a5cff;--green:#28d7a0;--red:#ff5774;--shadow:0 22px 70px #0007}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text)}button,input,select{font:inherit}button{cursor:pointer}.shell{min-height:100vh;display:flex}.sidebar{position:fixed;inset:0 auto 0 0;width:265px;background:#0c1220;border-right:1px solid var(--line);padding:22px 16px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:11px;color:var(--text);text-decoration:none;padding:3px 8px 20px}.brand i{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--blue),var(--violet));font-style:normal;font-weight:800;box-shadow:0 8px 24px #4b7dff55}.brand span,.workspace span{display:flex;flex-direction:column}.brand b{font:800 14px Manrope;letter-spacing:.7px}.brand small{font-size:9px;letter-spacing:1.6px;color:#75829e}.workspace{display:flex;gap:10px;align-items:center;background:#121b2c;border:1px solid #202c42;border-radius:13px;padding:11px;margin-bottom:20px}.workspace>i,.avatar{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#283552;color:#a9c2ff;font-style:normal;font-weight:800}.workspace b{font-size:12px}.workspace small{font-size:8px;color:#70809e;margin-top:3px}nav{display:flex;flex-direction:column;gap:4px;overflow:auto}nav button{position:relative;display:flex;align-items:center;gap:12px;border:0;background:transparent;color:#8390a9;padding:11px 13px;border-radius:10px;text-align:left}nav button i{font-style:normal;width:21px;text-align:center;font-size:17px}nav button span{flex:1}nav button:hover,nav button.on{background:linear-gradient(90deg,#23335a,#192440);color:#fff}nav button.on:before{content:'';position:absolute;left:-16px;width:3px;height:22px;background:#7297ff}nav button em{font-style:normal;font-size:9px;background:var(--red);color:white;border-radius:10px;padding:2px 6px}.nav-label{font-size:9px;color:#52617f;letter-spacing:1.5px;font-weight:800;padding:19px 13px 5px}.sidebar-foot{margin-top:auto}.sidebar-foot>a{display:block;color:#7f8ca7;text-decoration:none;padding:12px}.system{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding:17px 10px 8px}.system>span{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}.system p{margin:0;display:flex;flex-direction:column}.system b{font-size:11px}.system small{font-size:9px;color:var(--muted)}.content{margin-left:265px;width:calc(100% - 265px)}header{height:84px;padding:0 30px;display:flex;align-items:center;border-bottom:1px solid var(--line);background:#0c111ed9;backdrop-filter:blur(16px);position:sticky;top:0;z-index:10}header h1{margin:0;font:800 21px Manrope}header p{margin:5px 0 0;color:var(--muted);font-size:12px}.head-actions{margin-left:auto;display:flex;align-items:center;gap:9px}.head-actions button,#menuBtn{position:relative;border:1px solid var(--line);background:#131c2c;color:#a8b4ca;width:39px;height:39px;border-radius:11px}.head-actions button b{position:absolute;right:-4px;top:-5px;background:var(--red);color:white;font-size:9px;border-radius:9px;padding:2px 5px}#menuBtn{display:none;margin-right:12px}#page{padding:27px 30px 50px;max-width:1600px;margin:auto}.welcome{min-height:150px;padding:29px 33px;margin-bottom:22px;border:1px solid #2b3e6a;border-radius:18px;background:radial-gradient(circle at 80% 30%,#533a9166,transparent 24%),linear-gradient(110deg,#172543,#18203b);display:flex;align-items:center;justify-content:space-between}.welcome span,.eyebrow{font-size:9px;font-weight:800;letter-spacing:1.8px;color:#7e9fff}.welcome h2{font:800 25px Manrope;margin:8px 0 4px}.welcome p{margin:0;color:#9aa7bf}.primary{border:0;border-radius:10px;background:linear-gradient(135deg,#527fff,#795bff);color:#fff;padding:11px 17px;font-weight:700;box-shadow:0 10px 25px #4f69ff33}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:20px}.metrics article{display:flex;align-items:center;gap:15px;background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:18px}.metrics article>i{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;font-style:normal;font-size:20px}.metrics .blue>i{background:#3976ff20;color:#6d9aff}.metrics .violet>i{background:#8a5cff20;color:#a783ff}.metrics .green>i{background:#28d7a020;color:#38e7b0}.metrics .red>i{background:#ff577420;color:#ff6c83}.metrics p{margin:0 0 3px;color:var(--muted);font-size:11px}.metrics b{font:800 24px Manrope}.metrics small{display:block;color:#687792;font-size:9px}.card{background:var(--panel);border:1px solid var(--line);border-radius:15px;overflow:hidden}.dash-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}.dash-grid .card{padding:20px}.dash-grid .full{grid-column:1/-1}.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.card h3,.card-head h3{font:700 14px Manrope;margin:0}.card-head p,.card>p{color:var(--muted);font-size:11px;margin:4px 0 0}.status{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:20px;font-size:9px;font-weight:800;text-transform:uppercase;white-space:nowrap}.status i{width:5px;height:5px;border-radius:50%;background:currentColor}.status.healthy,.status.active,.status.completed{color:var(--green);background:#24d39a18}.status.broken,.status.failed,.status.inactive{color:var(--red);background:#ff577418}.status.redirect,.status.running,.status.paused{color:#f6bd4c;background:#f6bd4c18}.link-btn{border:0;background:transparent;color:#7d9eff}.donut-wrap{display:flex;align-items:center;justify-content:center;gap:50px;padding:10px}.donut{width:155px;height:155px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(closest-side,var(--panel) 74%,transparent 75%),conic-gradient(var(--green) calc(var(--p)*1%),#28334a 0)}.donut b{font:800 28px Manrope}.donut small{font-size:8px;color:var(--muted)}.legend{min-width:165px}.legend p{display:flex;gap:8px;border-bottom:1px solid var(--line);padding:10px 0;margin:0;color:var(--muted);font-size:11px}.legend p i{width:7px;height:7px;border-radius:50%}.legend .g{background:var(--green)}.legend .r{background:var(--red)}.legend .v{background:var(--violet)}.legend p span{flex:1}.legend p b{color:var(--text)}.site-mini>div{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.favicon{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#243352;color:#a8bfff;font-weight:800}.site-mini p{display:flex;flex-direction:column;flex:1;margin:0}.site-mini p b{font-size:11px}.site-mini p small{color:var(--muted);font-size:9px}.toolbar{display:flex;justify-content:space-between;margin-bottom:15px}.toolbar input{width:300px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:11px 14px;color:var(--text)}.toolbar>button:not(.primary),.filter-tabs button{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:9px;padding:9px 14px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:800px}th{text-align:left;background:#151f30;color:#6f7e99;font-size:9px;letter-spacing:.8px;padding:12px 16px}td{border-top:1px solid var(--line);padding:13px 16px;color:#a9b4c9;font-size:11px}td b{color:var(--text)}td a{color:#7397f7;text-decoration:none}td small.block{display:block;margin-top:4px;color:var(--muted)}.site-cell{display:flex;align-items:center;gap:10px}.site-cell>i{display:grid;place-items:center;width:34px;height:34px;background:#223252;border-radius:9px;color:#9ab7ff;font-style:normal;font-weight:800}.site-cell span{display:flex;flex-direction:column}.site-cell small,.site-cell a{font-size:9px;color:var(--muted);margin-top:3px}.actions{display:flex;gap:5px}.actions button{width:30px;height:30px;border:1px solid var(--line);background:#192337;border-radius:7px;color:#9fb0cd}.actions .danger,.danger-text{color:var(--red)!important}.ok-text{color:var(--green)}code,.role{background:#202b41;color:#9db5e9;border-radius:5px;padding:3px 6px}.filter-tabs{display:flex;gap:6px;margin-bottom:14px}.filter-tabs button.on{background:#3158a9;color:white}.notice-list{display:grid;gap:10px}.notice-list article{padding:17px;display:flex;gap:13px}.notice-list article>i{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#ff57741b;color:var(--red);font-style:normal}.notice-list h3{margin:0}.notice-list p{margin:4px 0}.notice-list small{color:var(--muted)}.notice-list .unread{border-color:#4c6ab0}.report,.settings-grid>.card{padding:22px}.bars>div{display:grid;grid-template-columns:150px 1fr 60px;gap:10px;padding:9px}.bars i{height:7px;background:linear-gradient(90deg,var(--blue) var(--w),#263148 var(--w));border-radius:9px}.settings-grid{display:grid;grid-template-columns:1.5fr .8fr;gap:16px}.security p{padding:9px;border-bottom:1px solid var(--line)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-grid label{display:flex;flex-direction:column;gap:7px;color:#8b99b2;font-size:10px;font-weight:700}.form-grid input,.form-grid select{border:1px solid var(--line);background:#0c1423;color:var(--text);border-radius:9px;padding:11px}.form-grid .full{grid-column:1/-1}.modal{position:fixed;inset:0;z-index:100;background:#050915cc;backdrop-filter:blur(10px);display:grid;place-items:center;padding:20px}.modal[hidden]{display:none}.modal-box{position:relative;width:min(600px,100%);max-height:90vh;overflow:auto;background:#111a2b;border:1px solid #334363;border-radius:18px;padding:30px;box-shadow:var(--shadow)}.modal-box h2{font:800 20px Manrope;margin:8px 0}.modal-box>p{color:var(--muted);font-size:12px}.modal-x{position:absolute;right:16px;top:15px;border:0;background:#202b40;color:#a8b5ca;width:32px;height:32px;border-radius:8px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:9px}.modal-actions button{border:1px solid var(--line);background:#192337;color:#aebbd1;border-radius:9px;padding:10px 15px}.danger-btn{background:#bd3851!important;color:#fff!important}.scan-progress{text-align:center;padding:25px}.radar{width:100px;height:100px;margin:auto;border-radius:50%;border:1px solid #3a5797;background:conic-gradient(transparent,#527fff66);animation:spin 1.2s linear infinite}.empty{text-align:center;padding:45px;color:var(--muted)}.empty>i{display:grid;place-items:center;margin:auto;width:52px;height:52px;border-radius:15px;background:#202b40;font-style:normal}.empty h3{color:var(--text)}.loader{padding:80px;text-align:center;color:var(--muted)}@keyframes spin{to{transform:rotate(360deg)}}#toast{position:fixed;right:25px;top:25px;z-index:200;display:flex;gap:11px;background:#172338;border:1px solid #335646;padding:13px 17px;border-radius:11px;transform:translateY(-90px);opacity:0;transition:.25s}#toast.show{transform:none;opacity:1}#toast b{background:var(--green);border-radius:50%;padding:2px 7px}#toast.bad b{background:var(--red)}
.login-wrap{display:grid;grid-template-columns:1.15fr .85fr;min-height:100vh}.login-hero{padding:38px 7vw 34px;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(circle at 60% 40%,#314e9b55,transparent 25%),linear-gradient(135deg,#0b1223,#111a31)}.login-hero h1{font:800 clamp(38px,5vw,70px)/1.02 Manrope}.login-hero h1 em{font-style:normal;color:#8da8ff}.login-hero p{max-width:560px;color:#9ca9c1;line-height:1.7}.hero-points{display:flex;gap:10px}.hero-points span,.demo-note{border:1px solid #334260;border-radius:9px;padding:9px 12px;color:#9aa8c1;font-size:10px}.login-panel{display:grid;place-items:center;padding:30px}.login-panel form{width:min(390px,100%)}.login-panel h2{font:800 25px Manrope}.login-panel form>p{color:var(--muted);font-size:12px}.login-panel label{display:block;color:#a0acc0;font-size:11px;font-weight:700;margin:14px 0}.inputbox{display:flex;align-items:center;border:1px solid #293651;background:#111a2a;border-radius:10px;margin-top:7px;padding:0 11px}.inputbox input{flex:1;border:0;background:transparent;color:white;padding:13px 10px;outline:0}.inputbox button{border:0;background:transparent;color:#7887a2}.login-btn{width:100%;display:flex;justify-content:space-between;margin:22px 0}.form-error{background:#ff577416;color:#ff8ca0;padding:11px}.mobile-brand{display:none}.light{--bg:#f3f6fb;--panel:#fff;--line:#dce3ef;--text:#182238;--muted:#6d7890}.light .sidebar{background:#fff}.light header{background:#f8faffdd}.light th{background:#f7f9fc}.light .modal-box{background:#fff}.light .form-grid input,.light .form-grid select{background:#f7f9fc;color:#182238}.light .welcome{color:white}
@media(max-width:1050px){.metrics{grid-template-columns:1fr 1fr}.dash-grid{grid-template-columns:1fr}.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:none}.content{margin-left:0;width:100%}#menuBtn{display:block}.settings-grid{grid-template-columns:1fr}}@media(max-width:650px){header{padding:0 15px}header p{display:none}#page{padding:18px 14px}.metrics{grid-template-columns:1fr}.welcome{padding:22px;flex-direction:column;align-items:flex-start}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.login-wrap{grid-template-columns:1fr}.login-hero{display:none}.login-panel{min-height:100vh}.mobile-brand{display:block}}
.reference-note{display:grid!important;grid-template-columns:repeat(2,1fr);gap:7px;background:#0b1322;border:1px solid #2b3a57;border-radius:10px;padding:13px;color:#8493af}.reference-note b{grid-column:1/-1;color:#dce7ff}.reference-note span:before{content:'✓ ';color:var(--green)}.mismatch-row{background:#ff577408}.reason{display:block;color:#ff8094;margin:3px 0}.chain-btn{display:block;margin-top:8px;border:0;background:transparent;color:#789cff;padding:0;font-size:10px}.score{min-width:72px}.score b{font:800 14px Manrope}.score i{display:block;width:70px;height:5px;margin-top:6px;border-radius:8px;background:linear-gradient(90deg,var(--green) var(--score),#29344a var(--score))}.score.low b{color:var(--red)}.score.low i{background:linear-gradient(90deg,var(--red) var(--score),#29344a var(--score))}.chain-list{display:grid;gap:10px;margin-top:20px}.chain-list article{display:flex;gap:12px;background:#0c1423;border:1px solid var(--line);border-radius:11px;padding:13px}.chain-list article>i{display:grid;place-items:center;flex:0 0 30px;height:30px;border-radius:9px;background:#3158a9;font-style:normal;font-weight:800}.chain-list article>div{display:flex;min-width:0;flex-direction:column;gap:5px}.chain-list span,.chain-list small{font-size:9px;color:#7e91b3}.chain-list b{font-size:10px;overflow-wrap:anywhere}.chain-list em{color:#7196ff;font-style:normal}.light .reference-note,.light .chain-list article{background:#f6f8fc}
/* V19 — satu tabel per website asal, semua tombol dan rantainya di dalamnya */
.chain-groups{display:grid;gap:20px}.chain-group-card{background:linear-gradient(145deg,#111a2d,#0d1424);border:1px solid #263653;border-radius:18px;overflow:hidden;box-shadow:0 18px 45px #03081755}.chain-group-card>header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;background:linear-gradient(90deg,#17294c,#101a30);border-bottom:1px solid #30476c}.chain-origin{display:flex;align-items:center;gap:13px}.chain-origin>i{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:linear-gradient(135deg,#5378ff,#7557f4);font-style:normal;font-weight:900;color:#fff;box-shadow:0 8px 22px #4468ff55}.chain-origin span{font-size:9px;letter-spacing:1.5px;color:#7f9dce;font-weight:800}.chain-origin h3{margin:2px 0;color:#fff;font-size:16px}.chain-origin a{color:#76a7ff;font-size:11px}.chain-stats{display:flex;gap:9px}.chain-stats b{min-width:68px;padding:8px 11px;border:1px solid #314463;border-radius:11px;background:#0c1629;color:#fff;text-align:center;font-size:17px}.chain-stats b.good{color:#32e6ae}.chain-stats small{display:block;margin-top:2px;color:#7790b8;font-size:8px;letter-spacing:1px}.chain-table-wrap{overflow:auto}.chain-one-table{width:100%;border-collapse:collapse}.chain-one-table th{padding:12px 16px;background:#10192b;color:#7894c3;font-size:9px;letter-spacing:1.1px;text-align:left}.chain-one-table td{padding:16px;border-top:1px solid #202e49;vertical-align:top}.chain-one-table tr:hover td{background:#18233a88}.chain-one-table td:first-child{width:190px}.chain-one-table td:nth-child(3){width:180px}.chain-one-table td:last-child{width:125px}.button-pill{display:inline-flex;padding:6px 10px;border-radius:8px;background:#21345d;color:#fff;font-size:11px;font-weight:800}.chain-one-table td>small{display:block;max-width:190px;margin-top:7px;color:#6f89b1;font-size:9px;overflow-wrap:anywhere}.pretty-chain{display:flex;align-items:stretch;gap:6px;overflow-x:auto;padding:2px 2px 8px}.pretty-hop{display:flex;align-items:center;gap:7px;min-width:190px}.pretty-hop>i{display:grid;place-items:center;flex:0 0 25px;height:25px;border-radius:50%;background:#315bc7;color:#fff;font-style:normal;font-weight:800;font-size:10px}.pretty-hop>div{min-width:0;padding:8px 10px;border:1px solid #2a3c5e;border-radius:10px;background:#0b1426}.pretty-hop span{display:block;color:#7f9bc8;font-size:8px;font-weight:800;letter-spacing:.5px}.pretty-hop a{display:block;max-width:230px;margin-top:4px;color:#70a4ff;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pretty-hop>b{color:#466ba8;font-size:20px}.compact-result{display:grid;gap:7px}.compact-result strong{color:#fff;font-size:18px}.compact-result.matched strong{color:#2ce3ab}.compact-result.mismatch strong{color:#ff5277}.compact-result small{color:#7891b7;font-size:9px;line-height:1.4}.detail-chain-ui{border:1px solid #34518a;border-radius:10px;background:#17294b;color:#8cb4ff;padding:9px 11px;font-size:10px;font-weight:700;line-height:1.35}.detail-chain-ui:hover{background:#315dba;color:#fff}.chain-warning{display:block;margin-top:7px;color:#ff6987;font-size:9px}@media(max-width:800px){.chain-group-card>header{align-items:flex-start;flex-direction:column}.chain-stats{width:100%}.chain-stats b{flex:1}.chain-one-table{min-width:900px}}