:root{color-scheme:dark;--bg:#061521;--panel:#0b2632;--border:rgba(47,215,222,.23);--mint:#16e7c4;--ink:#eaffff;--muted:#9fc5d1;--orange:#ffc267;--font:Tahoma,"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse 66% 55% at 80% 5%,rgba(15,77,89,.25),transparent),radial-gradient(ellipse 44% 55% at 0 70%,rgba(15,43,76,.3),transparent),var(--bg);font-family:var(--font);font-size:14px;color:var(--ink);min-height:100vh;overflow-x:hidden}.grain{position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.013) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.013) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(to bottom,black,transparent);opacity:.7}button{font-family:inherit}button:focus-visible{outline:3px solid var(--orange);outline-offset:4px}.app-shell{width:min(1320px,calc(100% - 64px));margin:auto}.topbar{height:100px;display:flex;align-items:center;gap:14px}.brand-mark{width:60px;height:60px;border-radius:19px;border:1px solid rgba(30,232,199,.38);background:linear-gradient(135deg,#0c3d45,#0a273a);display:grid;place-items:center;box-shadow:0 0 38px rgba(13,229,195,.1)}.logo-ring{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#021f29}.brand-name{display:flex;flex-direction:column;gap:6px}.brand-name strong{font-size:17px}.brand-name span{color:var(--muted);font-size:12px}.port-indicator{margin-right:auto;direction:ltr;display:flex;align-items:center;gap:13px;background:rgba(13,47,60,.75);padding:10px 16px;border:1px solid var(--border);border-radius:18px}.port-label{letter-spacing:2.4px;color:#78c3ca;font-size:11px}.port-indicator b{font-family:Consolas,monospace;font-size:20px;color:var(--mint)}.panel{border:1px solid var(--border);background:linear-gradient(155deg,rgba(12,40,53,.94),rgba(7,28,42,.95));border-radius:26px;box-shadow:0 20px 70px rgba(0,0,0,.15),inset 0 1px rgba(255,255,255,.018)}.hero{position:relative;display:grid;grid-template-columns:1.1fr .9fr;min-height:332px;overflow:hidden;background:radial-gradient(circle at 78% 55%,rgba(16,196,181,.11),transparent 38%),linear-gradient(125deg,#0d3040,#081e2f 64%,#082434);padding:40px 46px;align-items:center}.hero:after{content:"";width:170px;height:170px;position:absolute;border-radius:50%;background:#14e4bc;filter:blur(130px);opacity:.1;left:30%;top:-130px}.hero-copy{position:relative;z-index:2;max-width:590px}.eyebrow{display:inline-flex;align-items:center;gap:10px;color:#54e9d2;letter-spacing:2px;font-size:11px;font-family:Arial,sans-serif;font-weight:700}.pulse-dot{width:8px;height:8px;border-radius:50%;background:#16e7c4;box-shadow:0 0 0 5px rgba(22,231,196,.1);animation:pulse 1.8s ease-in-out infinite}.hero h1{font-size:clamp(28px,3.4vw,47px);line-height:1.47;letter-spacing:-1.2px;margin:18px 0 14px;font-weight:900}.hero h1 em{color:#1befc8;font-style:normal}.hero p{line-height:2.1;color:#b8d6df;margin:0 0 22px;max-width:535px}.hero-actions{display:flex;gap:11px;flex-wrap:wrap}.btn{border:1px solid #277987;border-radius:14px;display:inline-flex;gap:9px;align-items:center;justify-content:center;padding:13px 19px;cursor:pointer;transition:transform .15s,background .15s;font-size:13px;font-weight:bold}.btn svg{height:18px;width:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.btn:hover:not(:disabled){transform:translateY(-2px)}.btn.primary{background:linear-gradient(120deg,#13cda7,#11eac5);color:#062b32;border-color:transparent;box-shadow:0 12px 30px rgba(18,232,185,.1)}.btn.secondary{color:#dcffff;background:rgba(13,60,68,.6)}.btn:disabled{opacity:.48;cursor:not-allowed}.hero-hint{display:block;color:#91c0ca;font-size:11px;margin-top:15px;line-height:1.8}.hero-visual{height:285px;width:100%;position:relative;display:grid;place-items:center}.orbit{position:absolute;border:1px solid rgba(22,239,195,.28);width:245px;height:245px;border-radius:50%;transform:rotateX(60deg) rotate(27deg)}.orbit-two{width:300px;height:300px;border-color:rgba(58,174,226,.15);transform:rotateY(65deg) rotate(-28deg)}.orbit-three{width:210px;height:210px;border-style:dashed;border-color:rgba(39,229,215,.22);animation:turn 38s linear infinite}.server-core{width:149px;height:149px;border-radius:34px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;background:linear-gradient(150deg,#093e47,#062936);border:1px solid #257e82;box-shadow:0 0 0 18px rgba(17,191,173,.03),0 0 80px rgba(11,230,184,.13),inset 0 2px rgba(255,255,255,.08);transform:rotate(-7deg);z-index:1}.server-core svg{width:74px;fill:none;stroke:#2ee6c6;stroke-width:3.4;stroke-linecap:round}.server-core span{font-family:Consolas,monospace;font-size:22px;letter-spacing:2px;color:#d5fff1}.orbit-particle{position:absolute;width:10px;height:10px;background:#23f5cc;border-radius:50%;box-shadow:0 0 22px #19ffb1}.p1{right:18%;top:15%}.p2{left:21%;bottom:13%;width:7px;height:7px;background:#ffc267;box-shadow:0 0 22px #ffc267}.p3{left:22%;top:17%;width:6px;height:6px;background:#6bbaff;box-shadow:0 0 22px #6bbaff}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-top:18px}.metric{min-height:168px;padding:21px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.metric-top{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:17px}.metric-icon{width:35px;height:35px;border-radius:13px;display:grid;place-items:center;font-size:19px}.turquoise{background:rgba(11,221,178,.12);color:#14ecbc}.orange{background:rgba(250,190,94,.12);color:#ffd177}.blue{background:rgba(47,160,255,.13);color:#61ceff}.violet{background:rgba(186,122,253,.13);color:#d9aaff}.dot-label{font-family:Consolas,monospace;color:#76ccd3;font-size:10px;background:#0b3944;border:1px solid rgba(38,217,206,.13);padding:5px 9px;border-radius:99px;letter-spacing:.6px}.metric-label{color:#9ec9d6;font-size:12px}.metric strong{margin:9px 0;font-size:23px;line-height:1.25;word-break:break-word}.metric strong sup{font-size:12px;color:#94d9df;vertical-align:middle;font-weight:400}.metric small{font-size:11px;color:#91b7c3;line-height:1.6}.metric .good{color:#21e9bf}.metric .bad{color:#ff818d}.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.details,.checks{padding:24px}.section-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.section-header small{color:#15dcb7;letter-spacing:2px;font-size:10px;font-family:Consolas,monospace}.section-header h2{font-size:18px;margin:9px 0 0}.live-pill,.tag{display:inline-flex;align-items:center;gap:9px;border-radius:100px;padding:9px 12px;color:#99e9dd;border:1px solid rgba(43,212,185,.2);background:#0a3a42;font-size:11px}.live-pill i{width:7px;height:7px;border-radius:50%;background:#2bffb9;box-shadow:0 0 12px #16d6a4;animation:pulse 1.8s infinite}.detail-rows{display:flex;flex-direction:column;gap:4px}.detail-rows div{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid rgba(72,177,189,.1);min-height:46px}.detail-rows div:last-child{border-bottom:0}.detail-rows span{color:#a1c6d2;font-size:12px}.detail-rows b{font-size:12px;font-weight:600;text-align:left;word-break:break-word}.check-row{width:100%;display:flex;align-items:center;gap:15px;border:1px solid rgba(52,179,186,.13);background:rgba(10,48,58,.45);border-radius:15px;padding:12px 14px;margin-bottom:8px;text-align:right;cursor:pointer;color:var(--ink)}.check-row:hover{border-color:rgba(24,231,198,.5);background:#103d4a}.check-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:20px;color:#21ecc0;background:#124750}.check-text{display:flex;flex-direction:column;gap:6px}.check-text b{font-size:12px}.check-text small{color:#8eb6c4;font-size:11px}.check-arrow{margin-right:auto;color:#3fbdc9;font-size:20px}.result{margin-top:10px;min-height:45px;display:flex;align-items:center;padding:10px 13px;border:1px dashed rgba(49,182,181,.27);border-radius:13px;color:#b9dbe0;font-size:11px;line-height:1.8}.result.good{border-color:#18977d;color:#89f5d9}.result.bad{border-color:#ad515e;color:#ffabae}.footer{display:flex;justify-content:space-between;gap:20px;color:#628e9b;font-size:11px;padding:24px 2px 30px;direction:ltr}.footer span:last-child{direction:rtl}@keyframes pulse{50%{opacity:.55;transform:scale(.9)}}@keyframes turn{to{transform:rotate(360deg)}}
@media(max-width:1050px){.app-shell{width:min(960px,calc(100% - 36px))}.hero{padding:35px}.metrics{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.app-shell{width:calc(100% - 26px)}.topbar{height:86px}.brand-mark{width:48px;height:48px;border-radius:15px}.brand-name strong{font-size:13px}.brand-name span{font-size:10px}.port-indicator{padding:9px 10px;gap:7px}.port-label{font-size:9px}.port-indicator b{font-size:15px}.hero{grid-template-columns:1fr;padding:30px 23px;gap:5px}.hero-visual{height:135px;order:-1;margin-top:-10px}.server-core{width:93px;height:93px;border-radius:24px;gap:1px;transform:rotate(-6deg)}.server-core svg{width:45px}.server-core span{font-size:14px}.orbit{width:138px;height:138px}.orbit-two{width:175px;height:175px}.orbit-three{width:123px;height:123px}.hero h1{font-size:29px;line-height:1.65;margin:12px 0}.hero p{font-size:12px}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.btn{padding:12px 7px;font-size:11px}.metrics{gap:10px;margin-top:12px}.metric{padding:15px;min-height:144px}.metric strong{font-size:17px}.metric small{font-size:10px}.bottom-grid{grid-template-columns:1fr;gap:12px;margin-top:12px}.details,.checks{padding:17px}.panel{border-radius:21px}.footer{flex-direction:column;align-items:center;gap:10px;text-align:center;padding-bottom:28px}.section-header h2{font-size:16px}}
@media(max-width:390px){.brand-name span{display:none}.brand-mark{width:43px;height:43px}.port-indicator{padding:8px}.metric{min-height:134px}.metric strong{font-size:15px}.hero-actions{display:flex}.hero-actions .btn{flex:1}}
