:root{--ops-line:rgba(79,218,228,.2);--ops-glow:rgba(72,237,216,.12)}
.app-main{background:radial-gradient(ellipse at 75% 0,rgba(39,108,133,.12),transparent 55%),var(--bg)}
.topbar{border-bottom:1px solid var(--ops-line)}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--cyan,#57e5df)}
.operations-banner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 30px;margin:0 0 20px;border:1px solid var(--ops-line);background:linear-gradient(115deg,#0e2631,#101322 65%);border-radius:18px;position:relative;overflow:hidden}
.operations-banner:before{content:'';position:absolute;top:0;left:0;width:35%;height:2px;background:#77efe0;box-shadow:0 0 25px #70e7ee}.operations-banner h2{font-size:26px;margin:10px 0}.operations-banner p{color:#a8b8c7;max-width:650px;line-height:1.6;margin:0}
.signal-visual{display:flex;gap:8px;align-items:center;padding:20px}.signal-visual i{height:40px;width:5px;background:#74eadc;opacity:.7;animation:pulse-signal 2.5s infinite ease-in-out}.signal-visual i:nth-child(2){height:70px;animation-delay:.2s}.signal-visual i:nth-child(3){height:95px;animation-delay:.5s}.signal-visual i:nth-child(4){height:55px;animation-delay:.7s}
@keyframes pulse-signal{50%{opacity:.3;transform:scaleY(.65)}}
.drive-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,370px),1fr));gap:20px;margin:24px 0}.drive-hud{background:linear-gradient(145deg,#13212c,#10151f 65%);border:1px solid var(--ops-line);border-radius:16px;padding:22px;position:relative;box-shadow:0 12px 40px #0002}.drive-hud:hover{border-color:#46a8ad}.drive-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.drive-core{display:flex;gap:22px;align-items:center;margin:26px 0}.drive-core h2{font-size:23px;margin:0 0 8px}.drive-status{color:#c4d1db;font-size:13px}.capacity-ring{flex-shrink:0;width:112px;height:112px;border-radius:50%;background:conic-gradient(#59dfca var(--capacity),#283340 0);padding:6px;box-shadow:0 0 28px #42d2cb12}.capacity-ring.unknown{background:repeating-conic-gradient(#3d5261 0deg 5deg,#182c38 5deg 14deg)}.capacity-ring>div{background:#11212a;width:100%;height:100%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.capacity-ring svg{width:17px;height:17px;color:#7ce2dd}.capacity-ring b{font:700 23px ui-monospace,monospace}.capacity-ring small{font-size:10px;color:#9cadb7}.drive-metrics{display:grid;grid-template-columns:repeat(3,1fr);padding:16px 0;border-top:1px solid #324151;border-bottom:1px solid #324151;gap:12px}.drive-metrics small{font-size:10px;color:#9aabba;display:block;letter-spacing:1px}.drive-metrics strong{display:block;margin-top:7px;font:600 18px ui-monospace,monospace;white-space:nowrap}.drive-health{display:flex;gap:8px;align-items:center;font-size:11px;color:#9eafbc;margin:16px 0}.signal-dot{width:7px;height:7px;border-radius:50%;background:#627180;flex-shrink:0}.signal-dot.ok{background:#6ce6b6;box-shadow:0 0 10px #6ce6b64a}.drive-capabilities{display:flex;gap:6px;flex-wrap:wrap}.drive-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.drive-actions .btn{font-size:11px;min-height:36px}.operation-record{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid #273442;font-size:12px}.operation-record time{color:#98aabb;font-size:11px}
.mesh-panel{margin:22px 0;border:1px solid var(--ops-line);border-radius:16px;background:linear-gradient(135deg,#0c1c29,#10141e);overflow:hidden}.mesh-panel .panel-head h2{margin-top:8px}.mesh-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:#30415445}.mesh-node{position:relative;text-align:center;padding:26px 20px;background:#101923}.mesh-node.connected:before{content:'';height:1px;width:100%;background:linear-gradient(90deg,transparent,#64dfd6,transparent);position:absolute;left:0;top:60px;opacity:.4}.node-orbit{position:relative;margin:0 auto 18px;width:68px;height:68px;border:1px solid #3b6171;border-radius:50%;display:grid;place-items:center;background:#142a37;box-shadow:0 0 30px #2dd4c917}.node-orbit:after{content:'';position:absolute;inset:-7px;border:1px dashed #56c9cc65;border-radius:50%;animation:orbit 35s linear infinite}.mesh-node:not(.connected) .node-orbit:after{animation:none;opacity:.3}.node-orbit svg{width:28px;height:28px;color:#8be6df}.mesh-node h3{margin:12px 0 8px;font-size:18px}.mesh-node p,.mesh-node small{color:#a6b5c4;font-size:12px}.node-route{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:18px}.node-route a{font:10px ui-monospace,monospace;padding:5px;border:1px solid #344856;border-radius:4px;color:#a7d8da;text-decoration:none}.mesh-signal{display:block;margin-top:14px;font-size:10px;color:#7b92a2}@keyframes orbit{to{transform:rotate(360deg)}}
.event-filters{display:grid;grid-template-columns:2fr 1fr 1fr auto auto;gap:12px;align-items:end;margin-bottom:18px}.event-toolbar{display:flex;justify-content:space-between;align-items:center;color:#9eaebc;font-size:12px;margin:18px 0}.event-timeline{border:1px solid var(--ops-line);border-radius:12px;overflow:hidden}.event-record{width:100%;display:grid;grid-template-columns:160px 60px 1fr 20px;gap:14px;text-align:left;border:0;border-bottom:1px solid #273643;background:#111c27;padding:17px;color:#cdd9e3;cursor:pointer}.event-record:hover{background:#192b38}.event-record time{color:#8dabb9;font-size:11px}.event-record b{font-size:12px;color:#83dddc}.event-record p{font:12px/1.6 ui-monospace,monospace;overflow-wrap:anywhere;margin:6px 0 0;white-space:pre-wrap}.event-level{font:10px ui-monospace,monospace;color:#97acba}.event-record.WARN .event-level{color:#f3cc7f}.event-record.ERROR .event-level{color:#ff8ca2}.event-record.OK .event-level{color:#81e4b4}.wizard-steps{display:flex;gap:6px;list-style:none;padding:0;margin:0 0 24px}.wizard-steps li{flex:1;border-bottom:2px solid #344553;padding:9px 2px;font-size:11px;color:#90a4b4}.wizard-steps .current{color:#76e7d9;border-color:#76e7d9}.wizard-secret{font-family:ui-monospace,monospace;min-height:100px;-webkit-text-security:disc;width:100%;resize:vertical}.wizard-summary{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:18px;background:#11252e;border:1px solid #315c62;border-radius:10px}.wizard-summary small{display:block;color:#8fa7b4;margin-bottom:6px}.btn:disabled{opacity:.4;cursor:not-allowed}.event-record:focus-visible,.node-route a:focus-visible{outline:2px solid #78e6dd;outline-offset:-3px}
@media(max-width:900px){.event-filters{grid-template-columns:1fr 1fr}.event-filters .field:first-child{grid-column:1/-1}.event-record{grid-template-columns:100px 48px 1fr}.event-record>svg{display:none}}
@media(max-width:600px){.operations-banner{padding:20px}.operations-banner h2{font-size:22px}.signal-visual{display:none}.drive-hud{padding:18px}.drive-core{gap:15px}.drive-metrics strong{font-size:16px}.event-record{grid-template-columns:1fr 50px;gap:6px}.event-record>div{grid-column:1/-1}.mesh-grid{grid-template-columns:1fr}.event-toolbar{align-items:flex-start;gap:8px}.wizard-summary{grid-template-columns:1fr}.operation-record{gap:8px}.drive-grid{margin-top:16px}.drive-actions .btn{flex:1}}
@media(prefers-reduced-motion:reduce){.signal-visual i,.node-orbit:after{animation:none}}
