/* RANUM Blue/Cyan, 26 Oct 2026: visual-only override on top of v3.9.4 */
:root{--green:#0b6fa6;--green2:#127aaf;--gold:#14d7e8;--gold2:#baf8fc;--line:#dce9f1;--muted:#668095;--danger:#b73f53;--shadow:0 12px 42px rgba(14,67,112,.075);font-family:Inter,"Segoe UI",Arial,system-ui,sans-serif;color:#152e44;background:#f2f7fb}
html{scroll-behavior:smooth;scroll-padding-top:108px}body{background:linear-gradient(140deg,#f4f9fc,#e9f5fb 65%,#f4f8fc);color:#182c42}
[hidden]{display:none!important}
#app:not([hidden]){min-height:100vh;display:grid;grid-template-columns:248px minmax(0,1fr);grid-template-rows:80px minmax(0,auto);align-items:start}
.ranum-sidebar{grid-column:1;grid-row:1/3;position:sticky;top:0;height:100vh;background:linear-gradient(166deg,#071a30 0%,#082944 70%,#051b30 100%);color:#eaf8fd;display:flex;flex-direction:column;padding:23px 14px 16px;z-index:41;border-right:1px solid #15435d;overflow:auto}
.ranum-side-brand{display:flex;align-items:center;gap:11px;padding:5px 12px 25px;border-bottom:1px solid #ffffff13}
.ranum-side-icon{font-family:'Segoe UI Emoji','Apple Color Emoji',sans-serif;display:grid;place-items:center;flex-shrink:0;width:48px;height:48px;background:linear-gradient(142deg,#123e68,#07577b);border:1px solid #20d9f349;border-radius:16px;font-size:28px;box-shadow:0 8px 22px #00d8ec16}
.ranum-side-brand strong{font-size:24px;letter-spacing:.025em;display:block}.ranum-side-brand strong span{color:#24dfe6}.ranum-side-brand small{font-size:9px;letter-spacing:.17em;font-weight:800;color:#8fb1c4}
.ranum-side-label{font-size:9px;font-weight:900;letter-spacing:.17em;color:#739bb1;display:block;margin:27px 12px 11px}
.ranum-side-nav{display:flex;flex-direction:column;gap:6px}.ranum-side-nav a{display:flex;align-items:center;gap:10px;border:1px solid transparent;border-radius:11px;padding:13px 14px;font-size:12px;font-weight:780;letter-spacing:.01em;color:#acc5d3;transition:background .15s,color .15s;min-height:45px}
.ranum-side-nav a:hover,.ranum-side-nav a:focus-visible{background:#183b54;color:#fff}.ranum-side-nav a.active{background:linear-gradient(90deg,#0c5e91,#0b3c61);border-color:#1cbfe43a;color:white;box-shadow:inset 3px 0 #13d7e8}
.ranum-side-grow{flex:1}.ranum-side-note{background:linear-gradient(145deg,#113c58,#0b3049);border:1px solid #2c5b704d;border-radius:15px;padding:15px;margin:18px 6px}.ranum-side-note .ranum-side-label{margin:0 0 8px;color:#39dbdc}.ranum-side-note b{display:block;font-size:12px}.ranum-side-note p{margin:8px 0 0;font-size:11px;line-height:1.55;color:#a7c1cf}.ranum-side-footer{display:flex;align-items:center;gap:9px;padding:15px 10px 0;border-top:1px solid #ffffff16}.ranum-side-footer b,.ranum-side-footer small{display:block}.ranum-side-footer b{font-size:11px}.ranum-side-footer small{font-size:10px;color:#87a8bc;margin-top:3px}.ranum-avatar{width:33px;height:33px;border-radius:11px;display:grid;place-items:center;background:#20d6e41e;color:#22dae5;font-weight:900;font-size:12px}
#app>.topbar{grid-column:2;grid-row:1;z-index:35;height:80px;position:sticky;top:0;box-shadow:none;border-bottom:1px solid #173f5c;background:#0a263f;padding:0 clamp(16px,2.7vw,40px);gap:12px}
.topbar .brand-row{min-width:0}.topbar .brand-row h1{font-size:19px;white-space:nowrap}.topbar .brand-row .brand-expansion{color:#a2bdcf}.topbar .eyebrow{color:#46dcdf}.topbar .brand-row h1 span{opacity:.7}.topbar .brand-mark{width:40px;height:40px;box-shadow:none}.topbar .revision-chip{color:#c2dce9;background:#113953;border:1px solid #24516b}.topbar .icon-btn{background:#123d57;border:1px solid #23546c}.topbar .btn.ghost{background:#e3f9fb;color:#103551}
#app>.main{grid-column:2;grid-row:2;width:auto;max-width:none;margin:0;padding:24px clamp(16px,2.7vw,40px) 75px;min-width:0}
.ranum-menu-button{display:none;width:39px;height:39px;flex:0 0 39px;border:1px solid #31586f;background:#123d57;color:#a9f4ff;border-radius:11px;cursor:pointer;font-size:20px}.ranum-scrim{display:none}
.brand-mark{background:linear-gradient(145deg,#06497d,#13d3dd);color:white;font-family:'Segoe UI Emoji','Apple Color Emoji',sans-serif;font-weight:400;box-shadow:0 10px 32px #11cfed33;font-size:28px}.brand-mark.small{font-size:24px}
.login-shell{background:radial-gradient(circle at 32% 12%,#0c6594 0%,transparent 38%),linear-gradient(140deg,#061a30,#0a3852)}.login-card{border-color:#c0eaf1;box-shadow:0 35px 100px #0005}.login-card h1{color:#102d48}.brand-expansion{color:#1974a2}.login-card .brand-mark{width:65px;height:65px}
.eyebrow{color:#2ddedc}.eyebrow.dark{color:#197eaa}.hero{background:linear-gradient(110deg,#fff 25%,#eaf8fc);border:1px solid #d8eaf4;border-radius:21px;box-shadow:var(--shadow);padding:28px}.hero h2{color:#0c3454;font-size:clamp(22px,2.8vw,33px)}.hero .hero-lead{color:#087b99}.hero p{color:#668095}
.btn.primary{background:linear-gradient(110deg,#087cc7,#0d62a6);color:#fff}.btn.accent{background:linear-gradient(120deg,#10d2e9,#03bdb4);color:#04364b;box-shadow:0 5px 14px #0ccbd523}.btn.ghost{background:#e8f3f9;color:#166188}.btn.ghost:hover{background:#d9eef7}.btn.has-changes{background:#075a9d}.icon-btn.light{background:#e7f3f8;color:#0c6498}
.stats-grid{gap:13px}.stat{border-radius:17px;box-shadow:var(--shadow);border:1px solid #dfeaf3;padding:17px 18px;background:#fff}.stat b{color:#102f4a}.stat:nth-child(4n+1){border-top:3px solid #14cce6}.stat:nth-child(4n+2){border-top:3px solid #1488e3}.stat:nth-child(4n+3){border-top:3px solid #0ec5b5}.stat:nth-child(4n){border-top:3px solid #4d92d4}
.node{border-radius:19px;border-color:#dceaf2;box-shadow:var(--shadow);padding:21px}.node:before{width:4px;background:#8ca6b7}.node.online:before{background:#08bda9}.node.online .pill{background:#defaf5;color:#037763}.node-grid-data div{background:#f2f7fb;border-radius:12px}.node-location{background:#f0f8fc;border-color:#d8ebf3}.node-diagnostic{background:#f2f8fc;border-radius:11px;padding:12px!important;border:1px solid #dcebf2!important}.node-diagnostic b{color:#0a597d}
.panel{border-radius:21px;border:1px solid #dfeaf3;box-shadow:var(--shadow)}.tablewrap{border-color:#dce7f0}th{background:#eff7fb;color:#50738e}td,th{border-bottom-color:#e9f0f6}.filterbar,.trial-history-tools{background:#f2f8fb;border-color:#e1edf4}.segmented button.active{color:#0567a6}.node-name input,.target-pick input{accent-color:#0abbd1}.field>span{color:#486a82}input:focus,select:focus,textarea:focus{border-color:#10bacf;box-shadow:0 0 0 3px #1acee21c}.trial-panel{background:linear-gradient(95deg,#effcff,#fff);border-color:#cdecf5}.trial-icon{background:#0b456d;color:#16dfe6}.trial-used b,.trial-summary-box b{color:#0877a5}.trial-summary-box{background:#f2f9fc}.preview-box{background:#08293f}.input-unit b{background:#eaf5f9;color:#4b7997}
.activity-bar{color:#3b637d;box-shadow:var(--shadow)}.activity-dot{background:#00bcae;box-shadow:0 0 0 4px #00bcae18}.status-badge.available{background:#e7f8f5;color:#0d806f}.toast{background:#0b3956}
.ranum-autoheal-summary{display:flex;gap:17px;align-items:flex-start;background:linear-gradient(110deg,#eafafe,#fff);border:1px solid #d5ecf2;border-radius:20px;padding:19px 21px;margin:26px 0 6px;box-shadow:var(--shadow)}.ranum-autoheal-summary h3{margin:5px 0;font-size:18px;color:#123d55}.ranum-autoheal-summary p{margin:0;color:#647f94;font-size:12px;line-height:1.65}.ranum-autoheal-icon{width:43px;height:43px;display:grid;place-items:center;flex:0 0 auto;border-radius:13px;background:linear-gradient(135deg,#0e83b8,#10d1c5);font-size:24px;color:#fff}
#activityBar,#nodeSection,#nodes,#voucherSection,#trialSection,#ranumAutohealInfo{scroll-margin-top:101px}
:focus-visible{outline:2px solid #0ccbe5;outline-offset:3px}
@media(max-width:1250px){#app:not([hidden]){grid-template-columns:216px minmax(0,1fr)}.ranum-sidebar{padding:17px 10px}.ranum-side-nav a{padding:12px 9px}.topbar .brand-row .brand-expansion{display:none}}
@media(max-width:920px){#app:not([hidden]){grid-template-columns:1fr;grid-template-rows:70px auto}.ranum-sidebar{position:fixed;left:0;top:0;width:260px;height:100dvh;transform:translateX(-105%);transition:transform .2s ease;box-shadow:15px 0 35px #03121d77}.ranum-sidebar.is-open{transform:translateX(0)}.ranum-scrim:not([hidden]){display:block;position:fixed;inset:0;background:#041b2c99;z-index:40}#app>.topbar{grid-column:1;grid-row:1;height:70px}#app>.main{grid-column:1;grid-row:2}.ranum-menu-button{display:block}.topbar .brand-row h1{font-size:15px}.topbar .brand-row .eyebrow{display:none}}
@media(max-width:640px){#app>.main{padding:15px 11px 55px}.topbar{padding:0 11px!important}.topbar .brand-mark.small{display:none}.topbar .brand-row h1 span{display:none}.topbar .revision-chip{display:none}.ranum-autoheal-summary{padding:13px 14px;gap:9px}.node-grid{grid-template-columns:1fr}.hero{padding:19px}.hero-actions{gap:8px}}
/* Dark mode is strictly presentation: no data or network behavior changes. */
body.ranum-dark{--line:#22425a;--muted:#9bb0c3;--shadow:0 10px 30px #0002;background:#081b2d;color:#e5f3fa}
body.ranum-dark #app>.main{background:#081b2d}body.ranum-dark .hero,body.ranum-dark .stat,body.ranum-dark .node,body.ranum-dark .panel,body.ranum-dark .activity-bar,body.ranum-dark .ranum-autoheal-summary,body.ranum-dark .trial-panel,body.ranum-dark .modal,body.ranum-dark .login-card{background:#102a40;color:#e8f4fb;border-color:#28516b}
body.ranum-dark .hero h2,body.ranum-dark .stat b,body.ranum-dark .node-diagnostic b,body.ranum-dark .ranum-autoheal-summary h3,body.ranum-dark .login-card h1,body.ranum-dark .section-head h3{color:#e8f7fe}
body.ranum-dark .node-grid-data div,body.ranum-dark .node-location,body.ranum-dark .node-diagnostic,body.ranum-dark .filterbar,body.ranum-dark .trial-history-tools,body.ranum-dark .trial-summary-box{background:#18354c;border-color:#31536a;color:#e1edf5}
body.ranum-dark .hero p,body.ranum-dark .trial-copy p,body.ranum-dark .ranum-autoheal-summary p,body.ranum-dark .node-grid-data span{color:#a7bccb}body.ranum-dark input,body.ranum-dark select,body.ranum-dark textarea{background:#122e46;border-color:#355771;color:#f3fbff}body.ranum-dark th{background:#193c55;color:#ccdeeb}body.ranum-dark .btn.ghost{background:#204761;color:#d3f9ff}body.ranum-dark .segmented button.active{background:#23516b;color:#fff}body.ranum-dark .brand-expansion{color:#4dd9ec}

.ranum-side-nav a,.ranum-side-nav a:visited{text-decoration:none!important;color:#acc5d3}
.ranum-side-nav a.active,.ranum-side-nav a.active:visited{color:#fff}
@media(max-width:640px){.topbar .brand-mark.small{display:grid!important;width:34px;height:34px;font-size:19px;border-radius:11px}}
