:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:#020711;color:#dff7ff;--cyan:#19d8ff;--cyan2:#0078ff;--panel:#071522;--line:#0d6283;--muted:#78a2b7;--magenta:#ff38d1;--amber:#ffc43d;--green:#35f69a;--red:#ff3d5a}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% 0,#08223a 0,#020711 45%,#01040a 100%);min-width:320px}.cockpit{padding:8px;min-height:100vh}.topbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;border-bottom:1px solid var(--line);padding:4px 8px 9px}.brand{display:flex;align-items:center;gap:9px;white-space:nowrap}.spider{font-size:35px;color:var(--cyan);text-shadow:0 0 18px var(--cyan)}h1{margin:0;font-size:24px;letter-spacing:.07em;color:#7eeaff}small{display:block;color:var(--muted);font-size:10px;letter-spacing:.04em}.tabs{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.tabs button,.rail button{border:1px solid #15506c;background:#06111c;color:#d9f6ff;border-radius:4px;padding:8px 11px;font-size:10px;letter-spacing:.05em}.tabs button.active{border-color:var(--cyan);background:#06223a;box-shadow:0 0 15px #00bfff77;color:#fff}.live{text-align:right;color:#5bf5a0}.live b{font-size:11px}.layout{display:grid;grid-template-columns:200px minmax(0,1fr) 330px;gap:8px;margin-top:8px}.rail,.center,.right{display:flex;flex-direction:column;gap:8px;min-width:0}.panel{border:1px solid #0d5575;background:linear-gradient(180deg,#061421ee,#030b14f5);border-radius:5px;overflow:hidden;box-shadow:inset 0 0 24px #00365322}.panel>h2{font-size:12px;color:#13ddff;border-bottom:1px solid #0d5575;margin:0;padding:8px 10px;letter-spacing:.06em}.panel-body{padding:8px}.metric{display:flex;justify-content:space-between;gap:8px;padding:5px 2px;border-bottom:1px solid #0b2636;font-size:10px}.metric span{color:#a7c5d5}.metric b{color:#7fe8ff}.rail button{display:block;width:100%;text-align:left;margin:4px 0;padding:8px}.rail button:disabled{opacity:.65;cursor:not-allowed}.rail .danger{border-color:#90243a;color:#ff6680}.event-line{display:flex;gap:7px;align-items:flex-start;font-size:9px;padding:4px 0;color:#a9c9d9}.event-dot{width:6px;height:6px;border-radius:50%;background:#8393a0;margin-top:3px}.topology{display:flex;flex-direction:column;align-items:center;gap:13px;padding:10px;background-image:linear-gradient(#0a243155 1px,transparent 1px),linear-gradient(90deg,#0a243155 1px,transparent 1px);background-size:22px 22px}.hero,.registry,.learning-engine{border:1px solid var(--cyan);border-radius:11px;padding:10px 20px;color:#c9faff;box-shadow:0 0 18px #00c8ff55;background:#041421}.registry{border-color:var(--green);box-shadow:0 0 18px #20ff9a44;min-width:45%;text-align:center}.registry small{margin-top:5px}.learning-engine{border-color:var(--amber);color:#ffe498;box-shadow:0 0 18px #ffb30044}.modules{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;width:100%}.module{min-width:125px;padding:13px;border:1px solid #2d7190;border-radius:10px;text-align:center;background:#07121e;box-shadow:0 0 16px #1dc9ff22}.module b{display:block;margin-bottom:5px}.module.clm{border-color:var(--magenta);box-shadow:0 0 16px #ff38d144}.module.rea,.module.executor{border-color:var(--cyan)}.module.laya,.module.verifier,.module.learning{border-color:var(--amber)}.module.planner{border-color:#d544ff}.nodes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.node-card{border:1px solid #135e7c;background:#06111b;padding:9px;border-radius:5px}.node-card header{display:flex;justify-content:space-between;gap:7px;color:#8beaff}.unknown{font-size:9px;color:#f0c164}.services{font-size:9px;color:#7999aa;padding-top:7px}.metrics-empty{height:112px;border:1px dashed #15516b;border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#6ab1ce}.metrics-empty b{color:#b3d6e4}.physical{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative}.node-mini,.shared{border:1px solid #14708f;border-radius:5px;padding:12px;text-align:center;background:#071724}.shared{grid-column:1/3;border-color:#9c45d9;color:#e8b7ff}.storage-row{display:flex;justify-content:space-between;border-bottom:1px solid #0b2c3c;padding:6px 2px;font-size:10px}.storage-row b{color:#8198a5}@media(max-width:1100px){.topbar{grid-template-columns:1fr}.live{text-align:left}.layout{grid-template-columns:1fr}.rail,.right{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.nodes{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.cockpit{padding:5px}.rail,.right{display:flex}.nodes{grid-template-columns:1fr}.tabs{justify-content:flex-start}.tabs button{padding:7px 8px}.modules{display:grid;grid-template-columns:1fr 1fr}.registry{width:100%}}
.login-form{display:grid;grid-template-columns:1fr;gap:5px;margin-bottom:7px}.login-form input{min-width:0;border:1px solid #15506c;background:#020a12;color:#dff7ff;border-radius:4px;padding:8px;font-size:11px;outline:none}.login-form input:focus{border-color:var(--cyan);box-shadow:0 0 10px #00bfff44}.login-form button{border-color:var(--cyan);color:#bff6ff;background:#06223a}


/* Spider Swarm worker fabric */
.swarm-shell{display:flex;flex-direction:column;gap:10px}
.swarm-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #0b2c3c;padding:2px 2px 9px}
.swarm-toolbar b{color:#aef6ff;letter-spacing:.06em;font-size:11px}
.swarm-note{font-size:9px;color:var(--muted)}
.swarm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:9px}
.swarm-empty{grid-column:1/-1;border:1px dashed #15516b;border-radius:8px;padding:18px;text-align:center;background:#04101a}
.swarm-empty b{display:block;color:#b8dae8;margin-bottom:6px}
.worker-bubble{position:relative;border:1px solid #19495f;border-radius:14px;background:radial-gradient(circle at 22% 20%,#0c2738 0,#06111b 58%,#030810 100%);box-shadow:inset 0 0 22px #00c8ff10;overflow:hidden}
.worker-open{display:flex!important;align-items:center!important;gap:10px!important;width:100%!important;margin:0!important;padding:12px!important;text-align:left!important;border:0!important;background:transparent!important;color:#dff7ff!important}
.worker-open:hover{background:#08203288!important}
.worker-orb{width:34px;height:34px;min-width:34px;border-radius:50%;background:#71808a;box-shadow:0 0 16px #71808a66;position:relative}
.worker-orb:after{content:"";position:absolute;inset:7px;border-radius:50%;border:1px solid #ffffff55}
.worker-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.worker-copy b{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.worker-copy small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.worker-detach{position:absolute;right:6px;top:6px}
.worker-detach button{font-size:8px!important;padding:4px 6px!important;margin:0!important;border-color:#5a2634!important;color:#ff8ca0!important;background:#16080d!important}
.state-working{border-color:#35f69a;box-shadow:0 0 18px #35f69a22}
.state-working .worker-orb{background:#35f69a;box-shadow:0 0 18px #35f69aaa;animation:workerPulse 1.25s ease-in-out infinite}
.state-idle .worker-orb,.state-registered .worker-orb{background:#19d8ff;box-shadow:0 0 16px #19d8ff88}
.state-waiting .worker-orb,.state-blocked .worker-orb{background:#ffc43d;box-shadow:0 0 16px #ffc43d88}
.state-reviewing .worker-orb{background:#c44dff;box-shadow:0 0 16px #c44dff88}
.state-error .worker-orb{background:#ff3d5a;box-shadow:0 0 18px #ff3d5aaa;animation:workerPulse .8s ease-in-out infinite}
.state-offline .worker-orb,.state-sleeping .worker-orb{background:#56636c;box-shadow:none}
.swarm-add{border-top:1px solid #0b2c3c;padding-top:8px}
.swarm-add summary{cursor:pointer;color:#71e8ff;font-size:10px;letter-spacing:.06em;user-select:none}
.swarm-form{display:grid;grid-template-columns:repeat(5,minmax(0,1fr)) auto;gap:6px;margin-top:8px}
.swarm-form input{min-width:0;border:1px solid #15506c;background:#020a12;color:#dff7ff;border-radius:4px;padding:8px;font-size:10px;outline:none}
.swarm-form input:focus{border-color:var(--cyan);box-shadow:0 0 10px #00bfff44}
.swarm-form button{border:1px solid var(--cyan);background:#06223a;color:#bff6ff;border-radius:4px;font-size:9px;padding:8px 10px}
@keyframes workerPulse{0%,100%{transform:scale(.92);opacity:.78}50%{transform:scale(1.05);opacity:1}}
@media(prefers-reduced-motion:reduce){.worker-orb{animation:none!important}}
@media(max-width:1100px){.swarm-form{grid-template-columns:1fr 1fr 1fr}.swarm-form button{grid-column:span 3}}
@media(max-width:650px){.swarm-grid{grid-template-columns:1fr}.swarm-form{grid-template-columns:1fr}.swarm-form button{grid-column:auto}.swarm-toolbar{align-items:flex-start;flex-direction:column}}


/* Spider Cognitive Fabric */
.cognitive-shell{display:flex;flex-direction:column;gap:10px}
.cognitive-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #0b2c3c;padding:2px 2px 9px}
.cognitive-summary b{color:#c5fbff;letter-spacing:.07em;font-size:12px}
.cognitive-badges{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.cognitive-badges span,.cognitive-meta span{border:1px solid #154e69;background:#061522;border-radius:999px;padding:5px 8px;font-size:9px;color:#8edff4}
.cognitive-meta{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:9px}
.cognitive-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px}
.cognitive-card{border:1px solid #21495d;border-radius:9px;background:#05101a;padding:9px;min-width:0;box-shadow:inset 0 0 18px #00c8ff0a}
.cognitive-card header{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;margin-bottom:5px}
.cognitive-card header b{font-size:10px;color:#d8f7ff}
.cognitive-card header span{font-size:8px;border:1px solid #445b66;border-radius:999px;padding:3px 6px;color:#b1c5ce}
.cognitive-card small{min-height:25px}
.cognitive-detail{font-size:9px;color:#9cb9c7;margin:7px 0;min-height:26px}
.cognitive-card code{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#72c5df;font-size:8px;border-top:1px solid #0b2938;padding-top:5px}
.cognitive-card footer{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.cognitive-card footer span{font-size:7px;color:#718f9d;border:1px solid #173544;border-radius:4px;padding:2px 4px}
.status-live{border-color:var(--green);box-shadow:0 0 15px #35f69a22}
.status-live header span{border-color:var(--green);color:var(--green)}
.status-configured,.status-installed{border-color:var(--cyan)}
.status-configured header span,.status-installed header span{border-color:var(--cyan);color:#77e9ff}
.status-stale{border-color:var(--amber);box-shadow:0 0 15px #ffc43d18}
.status-stale header span{border-color:var(--amber);color:var(--amber)}
.status-missing{border-color:#5b2935;opacity:.82}
.status-missing header span{border-color:var(--red);color:#ff8396}
.fabric-contracts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}
.fabric-contracts>div{border:1px solid #163b4d;border-radius:7px;padding:8px;background:#04101a}
.fabric-contracts b{font-size:9px;color:#a6eaff}
.fabric-contracts small{margin-top:4px;line-height:1.35}
.cognitive-empty{border:1px dashed #15516b;border-radius:8px;padding:18px;text-align:center}
.cognitive-empty b{display:block;color:#b8dae8;margin-bottom:5px}
@media(max-width:650px){.cognitive-summary{align-items:flex-start;flex-direction:column}.cognitive-badges{justify-content:flex-start}.fabric-contracts{grid-template-columns:1fr}}