@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap";:root{font-family:Manrope,Pretendard,sans-serif;color:#dce6f4;background:#08111f;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:1100px;background:#08111f}button,input,select{font:inherit}.boot{height:100vh;display:flex;align-items:center;justify-content:center;gap:14px;color:#48d9b6;letter-spacing:.18em}.login{min-height:100vh;display:grid;grid-template-columns:1.18fr .82fr}.login-art{position:relative;padding:42px 56px;background:radial-gradient(circle at 75% 35%,#16365b 0,transparent 38%),linear-gradient(145deg,#0b192b,#07101d);overflow:hidden}.brand{display:flex;align-items:center;gap:11px;font-size:17px}.brandmark{width:36px;height:36px;border-radius:10px;background:#37d9b1;color:#07131d;display:grid;place-items:center}.art-copy{position:relative;z-index:1;margin:21vh auto 0;max-width:650px}.eyebrow{font:500 11px DM Mono;letter-spacing:.18em;color:#45d7b4}.art-copy h1{font-size:64px;line-height:1.06;letter-spacing:-.055em;margin:19px 0}.art-copy h1 em{font-style:normal;color:#42d6b2}.art-copy p{max-width:490px;font-size:17px;line-height:1.7;color:#8fa1b9}.art-grid{position:absolute;inset:0;background-image:linear-gradient(#fff .5px,transparent .5px),linear-gradient(90deg,#fff .5px,transparent .5px);background-size:48px 48px;opacity:.025;transform:perspective(600px) rotateX(55deg) scale(1.4);transform-origin:bottom}.login-panel{display:grid;place-items:center;background:#0b1422}.login-panel form{width:390px}.mobile-brand{display:none}.login-panel h2{font-size:40px;line-height:1.16;letter-spacing:-.04em;margin:16px 0 10px}.muted{color:#7e8da3}.login label,.modal label{display:grid;gap:9px;color:#a9b6c9;font-size:13px;font-weight:600;margin-top:25px}.login input,.modal input,.modal select,.dnsbar select{border:1px solid #27364c;background:#0c1726;color:#edf5ff;border-radius:10px;padding:14px 15px;outline:none}.login input:focus,.modal input:focus{border-color:#39d7b2;box-shadow:0 0 0 3px #39d7b219}.login form>button{margin-top:24px;width:100%;border:0;border-radius:10px;padding:15px;background:#3ad7b3;color:#061812;font-weight:800;display:flex;justify-content:center;gap:12px;cursor:pointer}.login small{display:block;text-align:center;margin-top:18px;color:#5f6d81}.error{margin-top:15px;padding:11px;border-radius:8px;background:#ff5e6c14;color:#ff8993;font-size:13px}.app{display:grid;grid-template-columns:244px 1fr;min-height:100vh}.app aside{position:fixed;width:244px;height:100vh;padding:25px 18px;border-right:1px solid #192538;background:#091321;display:flex;flex-direction:column}.server-chip{display:flex;align-items:center;gap:10px;padding:13px;margin-top:30px;background:#0e1b2b;border:1px solid #1e2d42;border-radius:11px}.server-chip>i{width:8px;height:8px;border-radius:50%;background:#43dbaf;box-shadow:0 0 0 5px #43dbaf12}.server-chip span{display:grid}.server-chip b{font-size:12px}.server-chip small{font-size:10px;color:#6f8098;margin-top:3px}.app nav{display:grid;gap:5px;margin-top:25px}.app nav button,.aside-foot>button{display:flex;align-items:center;gap:11px;border:0;background:none;color:#75869e;padding:11px 12px;border-radius:8px;text-align:left;cursor:pointer;font-size:13px;font-weight:600}.app nav button:hover,.app nav button.active{background:#142438;color:#eaf2fc}.app nav button.active{box-shadow:inset 3px 0 #3ad7b3}.app nav button.active svg{color:#3ad7b3}.aside-foot{margin-top:auto}.health{border:1px solid #1d2b3f;border-radius:9px;padding:11px;color:#8393a9;font-size:11px}.health span{display:flex;align-items:center;gap:7px}.health b{display:block;color:#3bd6ae;margin:7px 0 0 22px}.aside-foot>button{margin-top:10px}.content{grid-column:2;padding:30px 40px 60px;max-width:1600px;width:100%}.content header{height:69px;display:flex;justify-content:space-between;align-items:flex-start}.crumb{font-size:10px;color:#687992}.content header h1{font-size:23px;margin:7px 0;letter-spacing:-.03em}.header-actions{display:flex;align-items:center;gap:13px}.iconbtn,.trash{width:36px;height:36px;display:grid;place-items:center;background:#101d2d;color:#8595ab;border:1px solid #223248;border-radius:9px;cursor:pointer}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#263c57;font-size:11px;font-weight:800}.toast{display:flex;justify-content:space-between;padding:12px 15px;background:#4e202b;border:1px solid #7d3444;border-radius:8px;margin-bottom:15px;font-size:13px}.toast button{border:0;background:none;color:#fff}.hero{height:160px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(100deg,#0e2034,#0b1828);border:1px solid #1d3046;border-radius:14px;padding:30px 34px;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;width:290px;height:290px;right:8%;border:1px solid #3bd7b31a;border-radius:50%;box-shadow:0 0 0 45px #3bd7b307,0 0 0 90px #3bd7b305}.hero h2{font-size:27px;margin:7px 0}.hero p{font-size:13px;color:#8293aa}.live{z-index:1;font:500 10px DM Mono;color:#45d7b4;border:1px solid #23463f;padding:10px 12px;border-radius:8px;background:#0a1b20}.live i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#46d8b2;margin-right:7px}.live b{color:#91a4b8;margin-left:9px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:16px}.metric,.panel,.domain{background:#0d1827;border:1px solid #1c2a3e;border-radius:12px}.metric{padding:18px;display:grid;grid-template-columns:40px 1fr;column-gap:11px}.metric-icon{width:38px;height:38px;border-radius:9px;display:grid;place-items:center}.mint{background:#35d6ad16;color:#39d7b2}.blue{background:#5d84ff17;color:#6d91ff}.violet{background:#a37aff17;color:#ad85ff}.amber{background:#ffbd5917;color:#ffc063}.metric>span{font-size:11px;color:#8494a9;margin-top:3px}.metric strong{grid-column:2;font-size:24px;margin-top:-16px}.metric strong small{font-size:12px;margin-left:2px;color:#8b99ac}.metric .meter{grid-column:1/3;height:3px;background:#1d2b3e;border-radius:3px;margin-top:16px;overflow:hidden}.meter i{display:block;height:100%;background:#3bd7b3}.metric p{grid-column:1/3;margin:9px 0 0;font-size:10px;color:#687990;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metric .network-num{font-size:16px;margin-top:-12px}.grid-two{display:grid;grid-template-columns:1.6fr 1fr;gap:14px;margin-top:16px}.panel{padding:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;font-size:13px;font-weight:700}.panel-head small{display:block;font-size:9px;color:#62748c;margin-top:3px}.legend{font-size:9px;color:#75869c}.legend i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#3bd7b3;margin-left:10px}.legend i:nth-child(2){background:#668cff}.facts dl{display:grid;grid-template-columns:1fr 1fr;margin:0}.facts dl div{padding:14px 0;border-bottom:1px solid #17263a}.facts dt{font-size:9px;color:#66788f}.facts dd{font-size:11px;font-weight:600;margin:5px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.toolbar h2{font-size:17px;margin:0}.toolbar p{font-size:11px;color:#72839a;margin:6px 0 0}.search{display:flex;align-items:center;gap:8px;border:1px solid #24344a;background:#0a1523;border-radius:8px;padding:0 11px}.search input{width:220px;padding:10px 0;background:none;border:0;outline:none;color:#dce6f4;font-size:11px}.table-panel{padding:0;overflow:hidden}.table-panel .toolbar{padding:20px 22px 0}table{width:100%;border-collapse:collapse;font-size:11px}th{text-align:left;color:#60738b;background:#0a1523;font-size:9px;text-transform:uppercase;letter-spacing:.08em;padding:12px 18px}td{border-top:1px solid #18263a;padding:15px 18px;color:#9aa9bc}td b{color:#dce6f4}.status{display:inline-flex;align-items:center;gap:6px;color:#64d7b8}.status i,.dot{width:6px;height:6px;background:#3bd6ae;border-radius:50%}.mono{font-family:DM Mono;font-size:10px}.danger-sm{border:1px solid #5e2d39;background:#311923;color:#f07884;border-radius:6px;padding:5px 9px;cursor:pointer}.danger-sm:disabled{opacity:.28;cursor:not-allowed}.dnsbar select{padding:8px 36px 8px 10px;margin-left:12px}.toolbar-right{display:flex;gap:10px}.primary{border:0;border-radius:8px;background:#39d7b2;color:#061712;padding:9px 13px;font-size:11px;font-weight:800;display:flex;align-items:center;gap:7px;cursor:pointer}.type{font:600 9px DM Mono;padding:5px 7px;border-radius:5px;background:#25344a;color:#9aacc4}.type-A,.type-AAAA{background:#166251;color:#57e0bd}.type-CNAME{background:#343364;color:#a9a7ff}.type-TXT{background:#61451e;color:#ffca73}.proxy{color:#f0a849;display:flex;align-items:center;gap:5px}.truncate{max-width:340px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trash{width:29px;height:29px;border:0;background:transparent}.trash:hover{background:#3a1b25;color:#fa7683}.empty{text-align:center;padding:50px;color:#64758b}.domain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.domain{padding:19px;display:grid;grid-template-columns:42px 1fr 32px;align-items:center}.domain-icon{width:40px;height:40px;border-radius:10px;background:#3bd7b314;color:#3bd7b3;display:grid;place-items:center}.domain h3{font-size:13px;margin:0}.domain p{font-size:9px;color:#76879d;margin:5px 0}.domain p .dot{display:inline-block;margin-right:3px}.domain>button{border:0;background:none;color:#6e8198}.domain dl{grid-column:1/4;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #1a293c;margin:15px 0 0;padding-top:14px}.domain dt{font-size:8px;color:#63758d}.domain dd{font-size:9px;margin:4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.modal-bg{position:fixed;inset:0;background:#02070dcc;display:grid;place-items:center;z-index:10}.modal{width:480px;background:#0d1928;border:1px solid #2a3b50;border-radius:14px;padding:25px;box-shadow:0 30px 80px #0008}.modal-head{display:flex;justify-content:space-between}.modal-head h2{margin:7px 0}.modal-head button{border:0;background:none;color:#8292a8}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modal select{width:100%}.check{display:flex!important;grid-template-columns:16px 1fr;align-items:center}.check input{width:15px;height:15px;margin:0;padding:0}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:28px}.modal-actions button{border:0;padding:10px 15px;border-radius:8px;background:#17263a;color:#9bacbf}.modal-actions .primary{background:#39d7b2;color:#061712}.skeleton{padding:50px;color:#789}@media(max-width:900px){body{min-width:0}.login{grid-template-columns:1fr}.login-art{display:none}.login-panel{min-height:100vh}.mobile-brand{display:flex;gap:8px;align-items:center;margin-bottom:50px}.app{grid-template-columns:76px 1fr}.app aside{width:76px;padding:20px 10px}.app aside .brand b,.server-chip span,.app nav button:not(.active){font-size:0}.app aside .brand{justify-content:center}.server-chip{justify-content:center}.app nav button{justify-content:center}.aside-foot{display:none}.content{grid-column:2;padding:25px 18px}.metrics{grid-template-columns:1fr 1fr}.grid-two,.domain-grid{grid-template-columns:1fr}.hero{height:auto}.hero .live{display:none}}.service-layout{display:grid;grid-template-columns:360px 1fr;gap:16px}.connect-form h2{margin:9px 0}.connect-form>p{font-size:11px;line-height:1.7;color:#74869e}.connect-form label{display:grid;gap:8px;margin-top:20px;font-size:11px;color:#8fa0b6;font-weight:700}.connect-form input,.connect-form select{background:#091523;border:1px solid #25364c;color:#dce6f4;border-radius:8px;padding:11px;outline:none}.domain-input{display:flex;align-items:center;background:#091523;border:1px solid #25364c;border-radius:8px}.domain-input input{min-width:0;flex:1;border:0}.domain-input span{font:500 10px DM Mono;color:#667990;padding-right:10px}.connection-preview{display:grid;gap:6px;background:#091522;border:1px solid #1c2c40;border-radius:9px;padding:13px;margin:18px 0;font-size:10px}.connection-preview span{color:#667990}.connection-preview b{font:500 10px DM Mono;color:#aab9ca}.connection-preview i{color:#3bd7b3}.connect-form>.primary{width:100%;justify-content:center;padding:12px}@media(max-width:900px){.service-layout{grid-template-columns:1fr}}
