:root{
  --bg:#060911;--panel:#0c121d;--panel2:#101927;--line:#223248;
  --text:#eef6ff;--muted:#8191a6;--cyan:#24d7ff;--blue:#4f8cff;
  --purple:#bb66ff;--green:#39e58c;--red:#ff5a6e;--yellow:#ffc85c;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#060911;color:var(--text);font-family:Inter,system-ui,Segoe UI,Arial,sans-serif}
body{background:radial-gradient(circle at 15% 0,#13243c 0,#060911 36%) fixed}
a{color:inherit}
.shell{display:grid;grid-template-columns:245px minmax(0,1fr);min-height:100vh}
.sidebar{border-right:1px solid var(--line);background:#080d15;padding:24px 16px;position:sticky;top:0;height:100vh}
.logo{font-size:22px;font-weight:950;letter-spacing:.8px;padding:5px 10px 22px}.logo b{color:var(--cyan)}
.nav-title{font-size:10px;color:#617189;text-transform:uppercase;letter-spacing:1.5px;margin:21px 10px 8px}
.nav a,.nav .disabled{display:block;padding:10px 12px;margin:3px 0;border-radius:9px;text-decoration:none;color:#9badc2;font-weight:650;font-size:14px}
.nav a:hover,.nav a.active{background:#142033;color:white}.nav a.active{border-left:3px solid var(--cyan)}
.nav .disabled{opacity:.34;cursor:not-allowed}
.main{min-width:0}.wrap{max-width:1450px;margin:auto;padding:28px}
.top{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:22px}
.title{font-size:27px;font-weight:900}.subtitle{color:var(--muted);font-size:13px;margin-top:5px}
.userbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.badge{border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:#a8bad0;font-size:12px}
.stats{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:13px;margin-bottom:18px}
.metric,.card{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:14px;box-shadow:0 16px 45px #0005}
.metric{padding:17px}.metric .k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.metric .v{font-size:25px;font-weight:900;margin-top:7px}.metric .s{font-size:12px;color:var(--muted);margin-top:5px}
.bar{height:5px;background:#172231;border-radius:99px;overflow:hidden;margin-top:10px}.bar span{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));border-radius:99px}
.section-head{display:flex;align-items:center;justify-content:space-between;margin:26px 0 11px;gap:15px}
.section-head h2{font-size:15px;margin:0;letter-spacing:.5px}.section-head span{color:var(--muted);font-size:12px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px}.card{padding:19px}
.server{position:relative;overflow:hidden}.server:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--cyan)}
.name{font-size:18px;font-weight:850;margin-bottom:12px}
.row{display:flex;justify-content:space-between;gap:14px;border-top:1px solid #ffffff0b;padding:9px 0;color:var(--muted);font-size:13px}
.row strong{color:var(--text);text-align:right;overflow-wrap:anywhere}
.online{color:var(--green)!important;font-weight:800}.offline{color:var(--red)!important;font-weight:800}
.warning{color:var(--yellow)!important}.error{color:#ff9aa7!important}
button,.btn{border:1px solid #334b67;background:#17283b;color:var(--text);padding:9px 13px;border-radius:9px;font-weight:750;cursor:pointer;text-decoration:none;display:inline-block;font-size:13px}
button:hover,.btn:hover{border-color:var(--cyan)}button:disabled{opacity:.4;cursor:not-allowed}
.danger{border-color:#703244;background:#2b1620}.restart{border-color:#6b5427;background:#2b2516}.primary{border-color:#235e79;background:#123247}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.actions form{margin:0}.actions input[type=hidden]{display:none}
.notice{border:1px solid #4b3c1e;background:#211b0e;color:var(--yellow);padding:12px;border-radius:10px;margin-bottom:16px;font-size:13px}
.two{display:grid;grid-template-columns:1.15fr .85fr;gap:14px}
.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:10px}
.quick{border:1px solid var(--line);border-radius:10px;padding:13px;background:#0a111b;text-decoration:none;display:block}
.quick:hover{border-color:#345776;background:#0d1724}.quick b{display:block;font-size:13px}.quick span{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.quick.live b{color:var(--cyan)}.quick.coming{opacity:.48;pointer-events:none}
.console-shell{background:#03060a;border:1px solid #1c2a3a;border-radius:12px;overflow:hidden}
.console-head{display:flex;justify-content:space-between;align-items:center;padding:10px 13px;background:#0a111b;border-bottom:1px solid #192637;font-size:12px}
.console-live{color:var(--green);font-weight:850}.console-output{margin:0;min-height:470px;max-height:62vh;overflow:auto;padding:15px;white-space:pre-wrap;word-break:break-word;color:#b9cbe0;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.command-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;margin-top:12px}
.command-row input{margin:0;width:100%;padding:12px;border-radius:9px;background:#07101a;border:1px solid #2b4058;color:white;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.command-result{margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#09111a;color:#a9bdd2;font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;display:none;white-space:pre-wrap}
.command-result.show{display:block}.command-result.fail{border-color:#6e3040;color:#ff9aa7}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px}
table{width:100%;border-collapse:collapse;min-width:680px;background:#09101a}
th,td{padding:11px 13px;text-align:left;border-bottom:1px solid #172333;font-size:12px}
th{color:#91a5bc;background:#0d1622;text-transform:uppercase;letter-spacing:.7px;font-size:10px}
td{color:#d7e5f4}.muted{color:var(--muted)}.right{text-align:right}
.login{max-width:430px;margin:12vh auto}.login input{width:100%;padding:12px;border-radius:9px;background:#09111c;border:1px solid #2b4058;color:white;margin:7px 0 14px}
pre.result{white-space:pre-wrap;background:#05080d;border:1px solid #1c2a3a;padding:14px;border-radius:10px;color:#b9cbe0;max-height:420px;overflow:auto}
.footer{color:#526176;font-size:11px;margin-top:30px}
@media(max-width:1100px){.stats{grid-template-columns:repeat(2,1fr)}.two{grid-template-columns:1fr}}
@media(max-width:760px){
 .shell{display:block}.sidebar{position:relative;height:auto;border-right:0;border-bottom:1px solid var(--line)}
 .nav{display:grid;grid-template-columns:repeat(2,1fr)}.nav-title{grid-column:1/-1}.wrap{padding:16px}
 .stats{grid-template-columns:1fr 1fr}.top{align-items:flex-start;flex-direction:column}.quick-grid{grid-template-columns:1fr}
 .command-row{grid-template-columns:1fr}
}

.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.form-grid .wide{grid-column:1/-1}
label{display:block;color:#91a5bc;font-size:11px;font-weight:750;text-transform:uppercase;letter-spacing:.55px}
input,select,textarea{width:100%;margin-top:6px;padding:11px 12px;border-radius:9px;background:#07101a;border:1px solid #2b4058;color:#eef6ff;font:13px Inter,system-ui,sans-serif}
input:focus,select:focus,textarea:focus{outline:none;border-color:#24d7ff;box-shadow:0 0 0 2px #24d7ff1a}
.editor{min-height:420px;resize:vertical;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre;overflow:auto}
.backup-card .name{display:flex;justify-content:space-between;gap:12px}.backup-meta{white-space:pre-wrap;color:#7f91a7;font:11px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;max-height:130px;overflow:auto;background:#070d15;border-radius:8px;padding:9px}
.restore-box{border-top:1px solid #ffffff0b;margin-top:12px;padding-top:12px}.restore-box input{max-width:170px}
@media(max-width:760px){.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}}


/* =====================================================================
   CRO WEB PANEL — CINEMATIC COMMAND SYSTEM v6
   Visual-only layer. Existing backend/API behavior remains intact.
   ===================================================================== */

:root{
  --cro-glow:rgba(36,215,255,.20);
  --cro-glow-soft:rgba(36,215,255,.07);
  --cro-grid:rgba(36,215,255,.022);
}

html{background:#03060b}
body{position:relative;overflow-x:hidden}

/* Ambient HUD grid */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background:
    linear-gradient(var(--cro-grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--cro-grid) 1px,transparent 1px);
  background-size:48px 48px;
  animation:cro-grid-drift 24s linear infinite;
}
body::after{
  content:"";
  position:fixed;
  width:900px;height:900px;
  top:-520px;right:-280px;
  z-index:-2;
  pointer-events:none;
  border-radius:50%;
  background:radial-gradient(circle,rgba(36,215,255,.085),rgba(79,140,255,.025) 32%,transparent 68%);
  filter:blur(8px);
  animation:cro-ambient 8s ease-in-out infinite;
}
@keyframes cro-grid-drift{to{background-position:48px 48px}}
@keyframes cro-ambient{50%{opacity:.55;transform:scale(1.08)}}

/* Sidebar upgrade */
.sidebar{
  overflow:hidden;
  box-shadow:18px 0 60px rgba(0,0,0,.18);
}
.sidebar::before{
  content:"";
  position:absolute;
  top:-120px;left:-80px;
  width:330px;height:330px;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(circle,rgba(36,215,255,.08),transparent 67%);
}
.sidebar::after{
  content:"";
  position:absolute;
  left:0;right:0;top:-30%;
  height:90px;
  pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(36,215,255,.035),transparent);
  animation:cro-sidebar-scan 9s linear infinite;
}
@keyframes cro-sidebar-scan{to{top:110%}}

.cro-sidebar-logo{
  position:relative;
  line-height:1.05;
  text-shadow:0 0 20px rgba(36,215,255,.05);
}
.cro-sidebar-logo b{
  display:inline-block;
  animation:cro-logo-pulse 3s ease-in-out infinite;
}
.cro-logo-sub{
  display:block;
  margin-top:8px;
  color:#53667a;
  font-size:7px;
  letter-spacing:.22em;
  font-weight:800;
}
@keyframes cro-logo-pulse{
  50%{color:#9ceeff;text-shadow:0 0 10px rgba(36,215,255,.82),0 0 28px rgba(36,215,255,.28)}
}

.nav a{
  position:relative;
  overflow:hidden;
  transition:background .2s ease,color .2s ease,transform .2s ease,border-color .2s ease;
}
.nav a::after{
  content:"";
  position:absolute;
  left:-45%;top:0;
  width:32%;height:100%;
  transform:skewX(-25deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.045),transparent);
  transition:left .45s ease;
}
.nav a:hover{transform:translateX(3px)}
.nav a:hover::after{left:120%}
.nav a.active{
  box-shadow:inset 10px 0 30px rgba(36,215,255,.035),0 0 24px rgba(36,215,255,.018);
}
.nav a.active::before{
  content:"";
  position:absolute;
  width:5px;height:5px;
  right:10px;top:50%;
  margin-top:-2px;
  border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 9px var(--cyan);
  animation:cro-status-pulse 1.8s ease-in-out infinite;
}

/* Main top scan */
.main{position:relative}
.cro-top-scan{
  position:fixed;
  left:245px;right:0;top:0;
  height:1px;
  z-index:8;
  pointer-events:none;
  opacity:.8;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  box-shadow:0 0 12px rgba(36,215,255,.35);
  animation:cro-top-beam 7s ease-in-out infinite;
}
@keyframes cro-top-beam{
  0%,100%{transform:translateX(-90%);opacity:0}
  15%{opacity:.8}
  60%{transform:translateX(90%);opacity:.8}
  70%,100%{opacity:0}
}

/* Content entrance */
.top,.stats,.section-head,.grid,.two,.console-shell,.command-row,.card,.footer{
  animation:cro-reveal .48s cubic-bezier(.2,.75,.25,1) both;
}
.stats{animation-delay:.05s}
.section-head{animation-delay:.08s}
.grid,.two,.console-shell{animation-delay:.11s}
.footer{animation-delay:.15s}
@keyframes cro-reveal{
  from{opacity:0;transform:translateY(9px);filter:blur(2px)}
  to{opacity:1;transform:none;filter:none}
}

/* Cards and metrics */
.card,.metric,.quick,.console-shell,.table-wrap{
  position:relative;
  transition:border-color .22s ease,transform .22s ease,box-shadow .22s ease,background .22s ease;
}
.card:hover,.metric:hover{
  transform:translateY(-2px);
  border-color:#314b65;
  box-shadow:0 20px 58px #0007,0 0 34px rgba(36,215,255,.025);
}
.metric{overflow:hidden}
.metric::before{
  content:"";
  position:absolute;
  left:-45%;top:0;
  width:28%;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  animation:cro-metric-line 5.5s ease-in-out infinite;
}
@keyframes cro-metric-line{
  0%,20%{left:-45%;opacity:0}
  35%{opacity:.7}
  75%{left:115%;opacity:.6}
  100%{left:115%;opacity:0}
}
.metric .v{
  text-shadow:0 0 20px rgba(36,215,255,.035);
}
.bar span{
  transform-origin:left center;
  transition:width .8s cubic-bezier(.2,.8,.2,1);
  box-shadow:0 0 10px rgba(36,215,255,.28);
}

.server::after{
  content:"";
  position:absolute;
  width:160px;height:160px;
  right:-90px;top:-90px;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(circle,rgba(36,215,255,.055),transparent 67%);
}

/* Buttons */
button,.btn{
  transition:border-color .18s ease,background .18s ease,transform .12s ease,box-shadow .18s ease;
}
button:hover,.btn:hover{
  transform:translateY(-1px);
  box-shadow:0 7px 22px rgba(0,0,0,.22),0 0 18px rgba(36,215,255,.035);
}
button:active,.btn:active{transform:translateY(0) scale(.985)}
.primary{position:relative;overflow:hidden}
.primary::after{
  content:"";
  position:absolute;
  top:-75%;left:-45%;
  width:25%;height:250%;
  transform:rotate(18deg);
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.24),transparent);
  transition:left .55s ease;
}
.primary:hover::after{left:130%}

/* Status */
.online,.console-live{
  text-shadow:0 0 12px rgba(57,229,140,.25);
}
.offline,.error{
  text-shadow:0 0 12px rgba(255,90,110,.15);
}
.console-live::before,.online.cro-live-dot::before{
  content:"";
  display:inline-block;
  width:5px;height:5px;
  margin-right:6px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 9px rgba(57,229,140,.8);
  animation:cro-status-pulse 1.6s ease-in-out infinite;
}
@keyframes cro-status-pulse{50%{opacity:.28;transform:scale(.75)}}

/* Console */
.console-shell{
  box-shadow:0 20px 60px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.018);
}
.console-head{
  position:relative;
  overflow:hidden;
}
.console-head::after{
  content:"";
  position:absolute;
  left:-30%;bottom:0;
  width:25%;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  animation:cro-console-head 4.5s linear infinite;
}
@keyframes cro-console-head{to{left:110%}}
.console-output{
  text-shadow:0 0 8px rgba(36,215,255,.025);
}

/* Tables */
tbody tr{transition:background .15s ease}
tbody tr:hover{background:rgba(36,215,255,.025)}
th{position:sticky;top:0;z-index:1}

/* Forms */
input,select,textarea{
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:#2f7895!important;
  box-shadow:0 0 0 3px rgba(36,215,255,.05),0 0 24px rgba(36,215,255,.035);
}

/* LOGIN */
.cro-login-page{
  min-height:100vh;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 38%,rgba(20,70,104,.28),transparent 30%),
    linear-gradient(180deg,#07111c 0,#03060b 75%);
}
.cro-login-page .wrap{
  width:100%;
  max-width:none;
  margin:0;
  padding:28px 18px;
  position:relative;
  z-index:3;
}
.cro-login-bg{
  position:fixed;
  inset:0;
  pointer-events:none;
  overflow:hidden;
  opacity:.7;
}
.cro-radar-ring{
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(36,215,255,.065);
  border-radius:50%;
}
.cro-radar-ring::before,.cro-radar-ring::after{
  content:"";
  position:absolute;
  width:4px;height:4px;
  border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 10px var(--cyan);
}
.cro-radar-ring::before{left:50%;top:-2px}
.cro-radar-ring::after{left:15%;bottom:14%}
.cro-radar-ring.r1{width:520px;height:520px;animation:cro-ring 20s linear infinite}
.cro-radar-ring.r2{width:730px;height:730px;opacity:.55;animation:cro-ring 31s linear infinite reverse}
.cro-radar-ring.r3{width:960px;height:960px;opacity:.28;border-style:dashed;animation:cro-ring 46s linear infinite}
@keyframes cro-ring{
  from{transform:translate(-50%,-50%) rotate(0)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
.cro-radar-sweep{
  position:absolute;
  left:50%;top:50%;
  width:380px;height:380px;
  transform-origin:0 0;
  background:conic-gradient(from -12deg,rgba(36,215,255,.1),transparent 14deg);
  clip-path:polygon(0 0,100% 0,100% 100%);
  opacity:.38;
  animation:cro-radar 7s linear infinite;
}
@keyframes cro-radar{to{transform:rotate(360deg)}}

.cro-login-card{
  width:min(455px,100%);
  max-width:455px;
  margin:0 auto;
  position:relative;
  overflow:hidden;
  padding:31px 30px 25px;
  background:linear-gradient(180deg,rgba(15,27,42,.96),rgba(7,13,22,.975));
  border-color:#2a4159;
  box-shadow:
    0 32px 100px rgba(0,0,0,.64),
    0 0 90px rgba(36,215,255,.035),
    inset 0 1px 0 rgba(255,255,255,.025);
  animation:cro-login-in .7s cubic-bezier(.18,.8,.25,1) both;
}
@keyframes cro-login-in{
  from{opacity:0;transform:translateY(22px) scale(.98);filter:blur(7px)}
  to{opacity:1;transform:none;filter:none}
}
.cro-login-card::before{
  content:"";
  position:absolute;
  top:0;left:-50%;
  width:38%;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  box-shadow:0 0 14px rgba(36,215,255,.55);
  animation:cro-login-line 3.8s ease-in-out infinite;
}
@keyframes cro-login-line{
  0%,15%{left:-50%;opacity:0}
  35%{opacity:1}
  72%{left:112%;opacity:1}
  100%{left:112%;opacity:0}
}
.cro-login-kicker{
  color:#526a81;
  font-size:8px;
  font-weight:900;
  letter-spacing:.28em;
  margin:0 10px 15px;
}
.cro-login-logo{
  padding:0 10px 9px;
  font-size:25px;
  letter-spacing:.055em;
}
.cro-login-slogan{
  min-height:18px;
  margin:0 10px 4px;
  color:#b8c9da;
  font:700 10px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.09em;
}
.cro-login-slogan::after{
  content:"";
  display:inline-block;
  width:6px;height:11px;
  margin-left:4px;
  vertical-align:-1px;
  background:var(--cyan);
  box-shadow:0 0 8px rgba(36,215,255,.65);
  animation:cro-cursor .8s steps(1) infinite;
}
@keyframes cro-cursor{50%{opacity:0}}
.cro-login-signature{margin:0 10px}
.cro-login-signature b{color:#d8edff}
.cro-security-line{
  height:1px;
  margin:21px 10px 20px;
  overflow:hidden;
  background:#182638;
}
.cro-security-line span{
  display:block;
  width:32%;height:100%;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  animation:cro-security 4s ease-in-out infinite;
}
@keyframes cro-security{
  0%,100%{transform:translateX(-110%)}
  50%{transform:translateX(330%)}
}
.cro-login-card form{padding:0 10px}
.cro-login-card label{
  display:block;
  margin:3px 0 6px;
  color:#6f8398;
  font-size:9px;
  font-weight:850;
  letter-spacing:.13em;
}
.cro-login-card input{
  width:100%;
  padding:12px;
  border-radius:9px;
  background:#09111c;
  border:1px solid #2b4058;
  color:#fff;
  margin:0 0 15px;
}
.cro-login-card input:focus{background:#07131f}
.cro-login-button{
  width:100%;
  min-height:42px;
  margin-top:2px;
  letter-spacing:.08em;
  font-size:11px;
}
.cro-login-button.cro-auth{
  cursor:wait;
  border-color:#2b819a;
  box-shadow:0 0 28px rgba(36,215,255,.075);
}
.cro-login-footer{
  display:flex;
  align-items:center;
  gap:7px;
  margin:18px 10px 0;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.045);
  color:#60758a;
  font:700 8px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.09em;
}
.cro-status-dot{
  width:6px;height:6px;
  flex:0 0 auto;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 9px rgba(57,229,140,.75);
  animation:cro-status-pulse 1.5s ease-in-out infinite;
}
.cro-encryption{margin-left:auto;color:#405267}

/* BOOT */
.cro-boot{
  position:fixed;
  inset:0;
  z-index:2147483647;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 42%,rgba(36,215,255,.11),transparent 25%),
    linear-gradient(180deg,#07111c,#02050a 72%);
  color:#eaf7ff;
}
.cro-boot::before{
  content:"";
  position:absolute;
  inset:-65%;
  background-image:
    linear-gradient(rgba(36,215,255,.038) 1px,transparent 1px),
    linear-gradient(90deg,rgba(36,215,255,.038) 1px,transparent 1px);
  background-size:42px 42px;
  transform:perspective(650px) rotateX(62deg) translateY(22%);
  animation:cro-boot-grid 7s linear infinite;
}
@keyframes cro-boot-grid{to{background-position:0 84px}}
.cro-boot-inner{
  position:relative;
  z-index:3;
  width:min(590px,calc(100vw - 42px));
  text-align:center;
}
.cro-boot-classified{
  margin-bottom:24px;
  color:#526a80;
  font-size:9px;
  font-weight:850;
  letter-spacing:.38em;
}
.cro-boot-logo{
  position:relative;
  display:inline-block;
  color:var(--cyan);
  font-size:74px;
  line-height:1;
  font-weight:1000;
  letter-spacing:.07em;
  text-shadow:0 0 10px rgba(36,215,255,.9),0 0 38px rgba(36,215,255,.34),0 0 90px rgba(36,215,255,.12);
  animation:cro-boot-logo .72s cubic-bezier(.18,.8,.25,1) both;
}
@keyframes cro-boot-logo{
  from{opacity:0;filter:blur(8px);transform:scale(.7)}
  to{opacity:1;filter:none;transform:none}
}
.cro-boot-logo::before,.cro-boot-logo::after{
  content:"CRO";
  position:absolute;inset:0;
  opacity:0;
  pointer-events:none;
}
.cro-boot-logo.glitch::before{
  color:#4f8cff;
  animation:cro-glitch-a .18s steps(2,end);
}
.cro-boot-logo.glitch::after{
  color:white;
  animation:cro-glitch-b .18s steps(2,end);
}
@keyframes cro-glitch-a{
  0%{opacity:.75;clip-path:inset(12% 0 60% 0)}
  50%{opacity:.8;transform:translateX(-5px);clip-path:inset(56% 0 15% 0)}
  100%{opacity:0}
}
@keyframes cro-glitch-b{
  0%{opacity:.65;clip-path:inset(58% 0 10% 0)}
  50%{opacity:.8;transform:translateX(5px);clip-path:inset(20% 0 52% 0)}
  100%{opacity:0}
}
.cro-boot-title{
  margin-top:12px;
  color:#d6ebfa;
  font-size:13px;
  font-weight:900;
  letter-spacing:.31em;
}
.cro-boot-status{
  min-height:18px;
  margin-top:41px;
  color:#8096aa;
  font:700 10px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.1em;
}
.cro-boot-status::before{
  content:">";
  margin-right:8px;
  color:var(--cyan);
  text-shadow:0 0 8px rgba(36,215,255,.7);
}
.cro-boot-progress{
  height:3px;
  margin-top:16px;
  overflow:hidden;
  border-radius:99px;
  background:#101b27;
  box-shadow:0 0 0 1px rgba(36,215,255,.055);
}
.cro-boot-progress-bar{
  position:relative;
  width:0;height:100%;
  border-radius:99px;
  background:linear-gradient(90deg,#4f8cff,#24d7ff,#c0f7ff);
  box-shadow:0 0 15px rgba(36,215,255,.72);
  transition:width .28s cubic-bezier(.2,.8,.2,1);
}
.cro-boot-progress-bar::after{
  content:"";
  position:absolute;
  right:-2px;top:-4px;
  width:16px;height:11px;
  background:#fff;
  opacity:.7;
  filter:blur(6px);
}
.cro-boot-percent{
  margin-top:8px;
  text-align:right;
  color:#50667a;
  font:700 9px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.1em;
}
.cro-boot-log{
  min-height:66px;
  margin-top:25px;
  padding:11px 13px;
  text-align:left;
  border:1px solid rgba(36,215,255,.055);
  border-radius:8px;
  background:rgba(3,8,13,.45);
  color:#536a7e;
  font:600 8px/1.65 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.045em;
}
.cro-boot-log div::before{content:"[OK] ";color:#4a9d71}
.cro-boot-footer{
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-top:16px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.05);
  color:#3f5569;
  font:700 8px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.1em;
}
.cro-boot.ready .cro-boot-logo{
  color:#75f0ad;
  text-shadow:0 0 10px rgba(57,229,140,.8),0 0 36px rgba(57,229,140,.28);
}
.cro-boot.ready .cro-boot-status{color:#72dca3}
.cro-boot.exit{
  opacity:0;
  visibility:hidden;
  transition:opacity .55s ease,visibility .55s ease;
}
.cro-boot.exit .cro-boot-inner{
  transform:scale(1.025);
  filter:blur(4px);
  transition:transform .55s ease,filter .55s ease;
}

/* Page-exit flash for internal navigation */
body.cro-page-exit .main{
  opacity:.15;
  transform:translateY(4px);
  filter:blur(2px);
  transition:opacity .13s ease,transform .13s ease,filter .13s ease;
}

/* Toast */
.cro-toast{
  position:fixed;
  right:22px;bottom:22px;
  z-index:9999;
  max-width:min(380px,calc(100vw - 44px));
  padding:11px 14px;
  border:1px solid #29445b;
  border-radius:10px;
  background:rgba(8,17,27,.96);
  box-shadow:0 16px 45px rgba(0,0,0,.42),0 0 25px rgba(36,215,255,.035);
  color:#b9cce0;
  font:700 10px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.04em;
  animation:cro-toast-in .25s ease both;
}
@keyframes cro-toast-in{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:none}
}

@media(max-width:760px){
  .cro-top-scan{left:0}
  .cro-encryption{display:none}
}
@media(max-width:600px){
  .cro-login-card{padding:25px 20px 22px}
  .cro-radar-ring.r1{width:440px;height:440px}
  .cro-radar-ring.r2{width:610px;height:610px}
  .cro-radar-ring.r3{width:790px;height:790px}
  .cro-boot-logo{font-size:52px}
  .cro-boot-title{font-size:11px;letter-spacing:.22em}
  .cro-boot-footer{font-size:7px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
  }
}


/* =====================================================================
   CRO WEB PANEL v7 — CLEAN DASHBOARD / COMPACT INSTANCE CARDS
   ===================================================================== */

.cro-selected-instance{
  display:flex;
  align-items:center;
  gap:8px;
  margin:4px 8px 10px;
  padding:9px 10px;
  border:1px solid rgba(36,215,255,.10);
  border-radius:8px;
  background:rgba(36,215,255,.035);
  color:#c8d9e8;
  font:800 10px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.06em;
  overflow:hidden;
}
.cro-selected-instance span:last-child{
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.cro-selected-dot{
  flex:0 0 auto;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 9px rgba(36,215,255,.75);
  animation:cro-status-pulse 1.8s ease-in-out infinite;
}

.cro-future-title{margin-top:24px}
.cro-future-item{font-size:12px!important;padding-top:8px!important;padding-bottom:8px!important}

/* Dashboard instance grid is intentionally tighter than generic content grids. */
.cro-instance-section-head{
  align-items:flex-end;
}
.cro-instance-section-head > div > span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:11px;
}
.cro-section-hint{
  color:#49677f!important;
  font:800 9px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important;
  letter-spacing:.12em;
}

.grid:has(.cro-instance-card){
  grid-template-columns:repeat(auto-fit,minmax(285px,360px));
  justify-content:start;
  gap:12px;
}

.cro-instance-card{
  min-height:0;
  padding:15px 15px 13px;
  border-radius:12px;
  background:
    linear-gradient(180deg,rgba(15,25,39,.94),rgba(8,14,23,.96));
  box-shadow:0 12px 34px rgba(0,0,0,.28);
  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}
.cro-instance-card:hover{
  transform:translateY(-2px);
  border-color:#31506c;
  box-shadow:
    0 16px 42px rgba(0,0,0,.36),
    0 0 28px rgba(36,215,255,.025);
}
.cro-instance-card.server::before{
  width:2px;
}

.cro-instance-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.cro-instance-eyebrow{
  margin-bottom:4px;
  color:#526a80;
  font-size:8px;
  font-weight:850;
  letter-spacing:.16em;
}
.cro-instance-name{
  margin:0;
  max-width:210px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size:15px;
  line-height:1.25;
}

.cro-instance-status{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
  padding:5px 7px;
  border:1px solid currentColor;
  border-radius:999px;
  background:rgba(255,255,255,.015);
  font:850 8px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.08em;
  opacity:.92;
}
.cro-instance-status-dot{
  width:5px;
  height:5px;
  border-radius:50%;
  background:currentColor;
  box-shadow:0 0 8px currentColor;
}
.cro-instance-status.online .cro-instance-status-dot{
  animation:cro-status-pulse 1.8s ease-in-out infinite;
}

.cro-instance-id{
  margin-top:7px;
  color:#53667a;
  font:700 9px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.cro-instance-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  margin-top:13px;
}
.cro-mini-stat{
  min-width:0;
  padding:8px 8px 7px;
  border:1px solid rgba(255,255,255,.045);
  border-radius:8px;
  background:rgba(4,10,17,.50);
}
.cro-mini-stat span{
  display:block;
  margin-bottom:4px;
  color:#53677b;
  font-size:7px;
  font-weight:850;
  letter-spacing:.10em;
}
.cro-mini-stat strong{
  display:block;
  overflow:hidden;
  color:#dcebf8;
  font-size:10px;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.cro-instance-map{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:7px;
  padding:8px 2px 3px;
  color:#566b80;
  font-size:8px;
  letter-spacing:.08em;
}
.cro-instance-map strong{
  min-width:0;
  overflow:hidden;
  color:#a9bfd3;
  font-size:9px;
  font-weight:750;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.cro-instance-actions{
  align-items:center;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.045);
  gap:6px;
}
.cro-instance-actions button,
.cro-instance-actions .btn{
  min-height:31px;
  padding:7px 10px;
  border-radius:7px;
  font-size:9px;
  letter-spacing:.06em;
}
.cro-manage-btn{
  padding-left:14px!important;
  padding-right:14px!important;
}
.cro-compact-action{
  padding-left:9px!important;
  padding-right:9px!important;
}

/* Keep older browser behavior usable even if :has() is unsupported. */
@supports not selector(:has(*)){
  .grid{gap:12px}
  .cro-instance-card{max-width:360px}
}

@media(max-width:760px){
  .grid:has(.cro-instance-card){
    grid-template-columns:1fr;
  }
  .cro-instance-card{max-width:none}
  .cro-section-hint{display:none}
}


/* =====================================================================
   CRO WEB PANEL v8 — INSTANCE VIEW SWITCHER
   ===================================================================== */

.cro-instance-section-head{align-items:flex-end;flex-wrap:wrap}
.cro-view-switch{
  display:flex;align-items:center;gap:5px;padding:5px;
  border:1px solid rgba(255,255,255,.055);border-radius:9px;
  background:rgba(5,11,18,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.02)
}
.cro-view-label{
  margin:0 4px 0 3px;color:#50667a!important;
  font:850 8px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important;
  letter-spacing:.14em
}
.cro-view-btn{
  display:flex;align-items:center;gap:6px;min-height:28px;padding:6px 8px;
  border:1px solid transparent;border-radius:6px;background:transparent;
  color:#667d91;font-size:8px;font-weight:850;letter-spacing:.07em;
  transition:color .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease
}
.cro-view-btn:hover{color:#bcd0e1;border-color:rgba(36,215,255,.12);background:rgba(36,215,255,.035)}
.cro-view-btn.active{
  color:#e9f8ff;border-color:rgba(36,215,255,.26);
  background:rgba(36,215,255,.085);box-shadow:0 0 14px rgba(36,215,255,.045)
}
.cro-view-icon{display:inline-block;width:12px;height:10px;opacity:.85;background-repeat:no-repeat}
.cro-view-icon-cards{
  background:
    linear-gradient(currentColor,currentColor) 0 0/5px 4px,
    linear-gradient(currentColor,currentColor) 7px 0/5px 4px,
    linear-gradient(currentColor,currentColor) 0 6px/5px 4px,
    linear-gradient(currentColor,currentColor) 7px 6px/5px 4px;
  background-repeat:no-repeat
}
.cro-view-icon-wide{
  background:
    linear-gradient(currentColor,currentColor) 0 0/12px 4px,
    linear-gradient(currentColor,currentColor) 0 6px/12px 4px;
  background-repeat:no-repeat
}
.cro-view-icon-list{
  background:
    linear-gradient(currentColor,currentColor) 0 0/2px 2px,
    linear-gradient(currentColor,currentColor) 4px 0/8px 2px,
    linear-gradient(currentColor,currentColor) 0 4px/2px 2px,
    linear-gradient(currentColor,currentColor) 4px 4px/8px 2px,
    linear-gradient(currentColor,currentColor) 0 8px/2px 2px,
    linear-gradient(currentColor,currentColor) 4px 8px/8px 2px;
  background-repeat:no-repeat
}

/* endpoint */
.cro-instance-meta{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:7px}
.cro-instance-endpoint{min-width:0;text-align:right;font:700 8px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.cro-instance-endpoint span{display:block;margin-bottom:3px;color:#465d72;font-size:7px;letter-spacing:.11em}
.cro-instance-endpoint strong{display:block;color:#91b3cb;font-size:9px;white-space:nowrap}

/* CARDS */
.cro-instance-grid[data-view="cards"]{
  grid-template-columns:repeat(auto-fit,minmax(320px,395px));justify-content:start;gap:14px
}
.cro-instance-grid[data-view="cards"] .cro-instance-card{padding:17px 17px 15px}
.cro-instance-grid[data-view="cards"] .cro-instance-name{max-width:235px;font-size:16px}
.cro-instance-grid[data-view="cards"] .cro-mini-stat{padding:9px 9px 8px}

/* WIDE */
.cro-instance-grid[data-view="wide"]{grid-template-columns:repeat(2,minmax(390px,1fr));gap:14px}
.cro-instance-grid[data-view="wide"] .cro-instance-card{
  display:grid;grid-template-columns:minmax(170px,.9fr) minmax(250px,1.1fr);
  grid-template-areas:"head stats" "meta stats" "map actions";
  column-gap:22px;row-gap:6px;align-items:center;padding:18px 18px 16px
}
.cro-instance-grid[data-view="wide"] .cro-instance-head{grid-area:head}
.cro-instance-grid[data-view="wide"] .cro-instance-meta{grid-area:meta;display:block;margin-top:0}
.cro-instance-grid[data-view="wide"] .cro-instance-endpoint{margin-top:8px;text-align:left}
.cro-instance-grid[data-view="wide"] .cro-instance-stats{grid-area:stats;margin-top:0}
.cro-instance-grid[data-view="wide"] .cro-instance-map{
  grid-area:map;margin-top:4px;padding-top:7px;border-top:1px solid rgba(255,255,255,.04)
}
.cro-instance-grid[data-view="wide"] .cro-instance-actions{
  grid-area:actions;justify-content:flex-end;margin-top:4px;padding-top:7px
}

/* LIST */
.cro-instance-grid[data-view="list"]{display:block}
.cro-instance-grid[data-view="list"] .cro-instance-card{
  display:grid;
  grid-template-columns:minmax(180px,1.25fr) minmax(150px,.9fr) minmax(260px,1.45fr) minmax(150px,.9fr) auto;
  align-items:center;gap:16px;width:100%;max-width:none;margin-bottom:7px;padding:10px 12px;border-radius:9px
}
.cro-instance-grid[data-view="list"] .cro-instance-head{min-width:0}
.cro-instance-grid[data-view="list"] .cro-instance-eyebrow{display:none}
.cro-instance-grid[data-view="list"] .cro-instance-name{max-width:none;font-size:12px}
.cro-instance-grid[data-view="list"] .cro-instance-status{padding:4px 6px;font-size:7px}
.cro-instance-grid[data-view="list"] .cro-instance-meta{display:block;min-width:0;margin:0}
.cro-instance-grid[data-view="list"] .cro-instance-id{margin:0 0 4px}
.cro-instance-grid[data-view="list"] .cro-instance-endpoint{text-align:left}
.cro-instance-grid[data-view="list"] .cro-instance-endpoint span{display:none}
.cro-instance-grid[data-view="list"] .cro-instance-stats{grid-template-columns:repeat(3,minmax(0,1fr));margin:0}
.cro-instance-grid[data-view="list"] .cro-mini-stat{padding:6px 7px;border-radius:6px}
.cro-instance-grid[data-view="list"] .cro-mini-stat span{margin-bottom:2px;font-size:6px}
.cro-instance-grid[data-view="list"] .cro-mini-stat strong{font-size:9px}
.cro-instance-grid[data-view="list"] .cro-instance-map{display:block;margin:0;padding:0;text-align:left}
.cro-instance-grid[data-view="list"] .cro-instance-map span{display:block;margin-bottom:3px;color:#465d72;font-size:6px}
.cro-instance-grid[data-view="list"] .cro-instance-map strong{
  display:block;max-width:170px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis
}
.cro-instance-grid[data-view="list"] .cro-instance-actions{
  margin:0;padding:0;border:0;flex-wrap:nowrap;justify-content:flex-end
}
.cro-instance-grid[data-view="list"] .cro-instance-actions button,
.cro-instance-grid[data-view="list"] .cro-instance-actions .btn{
  min-height:28px;padding:6px 8px;font-size:8px
}

.cro-instance-grid.cro-view-changing .cro-instance-card{animation:croInstanceViewChange .22s ease both}
@keyframes croInstanceViewChange{
  from{opacity:.25;transform:translateY(4px) scale(.995)}
  to{opacity:1;transform:none}
}

@media(max-width:1250px){
  .cro-instance-grid[data-view="wide"]{grid-template-columns:1fr}
  .cro-instance-grid[data-view="list"] .cro-instance-card{
    grid-template-columns:minmax(160px,1.2fr) minmax(140px,.9fr) minmax(230px,1.3fr) auto
  }
  .cro-instance-grid[data-view="list"] .cro-instance-map{display:none}
}
@media(max-width:900px){
  .cro-instance-grid[data-view="wide"] .cro-instance-card{display:block}
  .cro-instance-grid[data-view="wide"] .cro-instance-meta{display:flex}
  .cro-instance-grid[data-view="wide"] .cro-instance-endpoint{margin-top:0;text-align:right}
  .cro-instance-grid[data-view="wide"] .cro-instance-stats{margin-top:13px}
  .cro-instance-grid[data-view="wide"] .cro-instance-actions{
    justify-content:flex-start;margin-top:10px;padding-top:10px
  }
  .cro-instance-grid[data-view="list"] .cro-instance-card{
    grid-template-columns:minmax(150px,1fr) minmax(210px,1.25fr) auto
  }
  .cro-instance-grid[data-view="list"] .cro-instance-meta{display:none}
}
@media(max-width:760px){
  .cro-instance-section-head{align-items:flex-start}
  .cro-view-switch{width:100%;justify-content:flex-start}
  .cro-view-label{margin-right:auto}
  .cro-instance-grid[data-view="cards"]{grid-template-columns:1fr}
  .cro-instance-grid[data-view="list"] .cro-instance-card{display:block;padding:13px}
  .cro-instance-grid[data-view="list"] .cro-instance-meta,
  .cro-instance-grid[data-view="list"] .cro-instance-map{display:flex}
  .cro-instance-grid[data-view="list"] .cro-instance-stats{margin-top:11px}
  .cro-instance-grid[data-view="list"] .cro-instance-actions{
    justify-content:flex-start;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.045)
  }
}

/* CRO v8 command processing modal */
.cro-process-modal{display:none;position:fixed;inset:0;z-index:10050;align-items:center;justify-content:center;padding:20px}
.cro-process-modal.show{display:flex}
.cro-process-backdrop{position:absolute;inset:0;background:rgba(1,5,10,.86);backdrop-filter:blur(8px)}
.cro-process-box{position:relative;z-index:1;width:min(470px,94vw);overflow:hidden;padding:31px 30px 27px;text-align:center;background:linear-gradient(180deg,rgba(11,23,35,.98),rgba(5,12,20,.99));border:1px solid rgba(56,205,255,.28);border-radius:10px;box-shadow:0 0 0 1px rgba(0,0,0,.7),0 24px 100px rgba(0,0,0,.75),0 0 55px rgba(0,190,255,.08)}
.cro-process-box:before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,#3dd9ff,transparent);opacity:.75}
.cro-process-box:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) 1px,transparent 1px,transparent 4px)}
.cro-process-kicker{position:relative;z-index:1;color:#4f7188;font:700 8px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.24em;margin-bottom:14px}
.cro-process-close{display:none;position:absolute;z-index:5;right:10px;top:9px;width:31px;height:31px;padding:0;border-radius:5px;border:1px solid #29435a;background:#0b1723;color:#8aa7bb;font-size:20px;line-height:28px}
.cro-process-close:hover{border-color:#39d9ff;color:#e7faff;box-shadow:0 0 16px rgba(42,207,255,.12)}
.cro-process-modal.done .cro-process-close,.cro-process-modal.fail .cro-process-close{display:block}
.cro-process-icon{position:relative;z-index:1;height:58px;display:flex;align-items:center;justify-content:center;margin-bottom:8px}
.cro-process-spinner{width:43px;height:43px;border-radius:50%;border:3px solid #183247;border-top-color:#3ad9ff;border-right-color:#2686a9;box-shadow:0 0 24px rgba(38,205,255,.12);animation:croV8Spin .72s linear infinite}
.cro-process-modal.done .cro-process-spinner,.cro-process-modal.fail .cro-process-spinner{display:none}
.cro-process-modal.done .cro-process-icon:before{content:"✓";font:900 46px/1 system-ui;color:#4be99a;text-shadow:0 0 22px rgba(75,233,154,.25)}
.cro-process-modal.fail .cro-process-icon:before{content:"×";font:900 52px/1 system-ui;color:#ff5c70;text-shadow:0 0 22px rgba(255,92,112,.22)}
.cro-process-title{position:relative;z-index:1;font:900 18px/1.2 system-ui;letter-spacing:.16em;color:#39d9ff}
.cro-process-modal.done .cro-process-title{color:#4be99a}.cro-process-modal.fail .cro-process-title{color:#ff5c70}
.cro-process-message{position:relative;z-index:1;margin-top:10px;color:#8da9bc;font-size:12px;line-height:1.55}
.cro-process-track{position:relative;z-index:1;height:2px;margin:19px auto 0;max-width:310px;overflow:hidden;background:#132536}
.cro-process-track span{display:block;height:100%;width:38%;background:linear-gradient(90deg,transparent,#39d9ff,transparent);animation:croV8Track 1.05s ease-in-out infinite}
.cro-process-modal.done .cro-process-track span{width:100%;animation:none;background:#4be99a}
.cro-process-modal.fail .cro-process-track span{width:100%;animation:none;background:#ff5c70}
.cro-process-detail{display:none;position:relative;z-index:1;margin-top:15px;max-height:170px;overflow:auto;padding:10px 12px;text-align:left;white-space:pre-wrap;border:1px solid #183047;border-radius:6px;background:#030910;color:#66859b;font:10px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.cro-process-detail.show{display:block}
body.cro-modal-lock{overflow:hidden}
@keyframes croV8Spin{to{transform:rotate(360deg)}}@keyframes croV8Track{0%{transform:translateX(-120%)}100%{transform:translateX(330%)}}

html.cro-force-long-boot .cro-boot-overlay,html.cro-force-long-boot #cro-boot-overlay{display:flex!important;opacity:1!important;visibility:visible!important;pointer-events:all!important}
.cro-boot-overlay.cro-long-boot-done,#cro-boot-overlay.cro-long-boot-done{opacity:0!important;transition:opacity .6s ease!important;pointer-events:none!important}


/* v4.3.5 — CRO login/boot visual sequence is intentionally consistent on desktop/mobile.
   The generic accessibility reduction still applies to the rest of the control panel. */
@media (prefers-reduced-motion: reduce){
  .cro-login-card{animation:cro-login-in .7s cubic-bezier(.18,.8,.25,1) both!important}
  .cro-login-card::before{animation:cro-login-line 3.8s ease-in-out infinite!important}
  .cro-login-slogan::after{animation:cro-cursor .8s steps(1) infinite!important}
  .cro-security-line span{animation:cro-security 4s ease-in-out infinite!important}
  .cro-status-dot{animation:cro-status-pulse 1.5s ease-in-out infinite!important}
  .cro-radar-ring.r1{animation:cro-ring 20s linear infinite!important}
  .cro-radar-ring.r2{animation:cro-ring 31s linear infinite reverse!important}
  .cro-radar-ring.r3{animation:cro-ring 46s linear infinite!important}
  .cro-radar-sweep{animation:cro-radar 7s linear infinite!important}
  .cro-boot::before{animation:cro-boot-grid 7s linear infinite!important}
  .cro-boot-logo{animation:cro-boot-logo .72s cubic-bezier(.18,.8,.25,1) both!important}
  .cro-boot-logo.glitch::before{animation:cro-glitch-a .18s steps(2,end)!important}
  .cro-boot-logo.glitch::after{animation:cro-glitch-b .18s steps(2,end)!important}
}

@media (prefers-reduced-motion: reduce){
  .cro-process-spinner{animation:croV8Spin .72s linear infinite!important}
  .cro-process-track span{animation:croV8Track 1.05s ease-in-out infinite!important}
}


/* =====================================================================
   CRO WEB PANEL v11 — REAL CONCEPT IMPLEMENTATION
   IMPORTANT: image URLs are RELATIVE to static/css/cro-panel.css
   ===================================================================== */

body.cro-concept-ui{
  background:
    radial-gradient(circle at 70% 0,rgba(21,111,151,.10),transparent 30%),
    #02070d;
  color:#eaf8ff;
}

.cro-concept-grid{
  position:fixed;inset:0;z-index:-3;pointer-events:none;opacity:.16;
  background-image:
    linear-gradient(rgba(34,216,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(34,216,255,.035) 1px,transparent 1px);
  background-size:44px 44px;
}

.cro-concept-shell{grid-template-columns:250px minmax(0,1fr)}
.cro-concept-sidebar{
  padding:0;
  overflow:hidden;
  background:linear-gradient(180deg,#04121d 0,#020a12 100%);
  border-right:1px solid #15536f;
  box-shadow:12px 0 40px rgba(0,0,0,.20);
}

.cro-concept-brand{
  display:block;height:145px;padding:11px 12px 4px;text-decoration:none;
  background:linear-gradient(180deg,rgba(20,57,78,.28),transparent);
}
.cro-concept-brand img{
  width:100%;height:125px;object-fit:contain;
  filter:drop-shadow(0 0 11px rgba(34,216,255,.22));
}

.cro-concept-divider{
  height:1px;margin:0 11px;
  background:linear-gradient(90deg,transparent,#1784a7,transparent);
}

.cro-concept-nav{position:relative;z-index:4;padding:11px 11px}
.cro-concept-nav .nav-title{
  margin:16px 7px 7px;
  color:#4e8ca5;font-size:8px;letter-spacing:.18em
}
.cro-concept-nav a{
  display:flex;align-items:center;gap:10px;
  min-height:43px;margin:4px 0;padding:10px 11px;
  border:1px solid transparent;border-radius:4px;
  color:#7898ac;
}
.cro-concept-nav a:hover{
  color:#d9f7ff;background:rgba(34,216,255,.035);
  border-color:rgba(34,216,255,.11)
}
.cro-concept-nav a.active{
  color:#2de1ff;
  background:linear-gradient(90deg,rgba(34,216,255,.14),rgba(34,216,255,.025));
  border-color:#17627f;
  box-shadow:inset 4px 0 0 #22d8ff,0 0 20px rgba(34,216,255,.045)
}
.cro-concept-home-icon{
  font-size:17px;
  text-shadow:0 0 8px currentColor
}

.cro-concept-sidebar-bg{
  position:absolute;left:0;right:0;bottom:0;height:49%;
  pointer-events:none;opacity:.60;
  background:
    linear-gradient(180deg,#020a12 0%,transparent 22%,rgba(2,9,15,.08) 62%,#020a12 96%),
    url("../img/cro-final-sidebar.png") center bottom/cover no-repeat;
  filter:saturate(.82) contrast(1.08);
}
.cro-concept-powered{
  position:absolute;left:27px;bottom:22px;z-index:4;
  text-shadow:0 2px 8px #000
}
.cro-concept-powered span,.cro-concept-powered small{
  display:block;color:#4e94ad;font-size:7px;letter-spacing:.20em
}
.cro-concept-powered strong{
  display:block;margin:5px 0;color:#e3faff;
  font-size:12px;letter-spacing:.24em
}

.cro-concept-topbar{
  height:54px;position:sticky;top:0;z-index:25;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 20px;
  border-bottom:1px solid #14465f;
  background:rgba(2,9,15,.93);
  backdrop-filter:blur(12px)
}
.cro-concept-security{
  color:#5c8399;font-size:8px;font-weight:850;letter-spacing:.25em
}
.cro-concept-security i{
  color:#1c799a;font-style:normal;margin:0 8px
}
.cro-concept-topbar-right{
  display:flex;height:100%;align-items:center
}
.cro-concept-clock{
  padding:0 18px;color:#a0c4d7;
  font:700 9px ui-monospace,SFMono-Regular,Menlo,monospace;
  border-left:1px solid #163a4d
}
.cro-concept-system{
  height:100%;padding:0 18px;display:flex;align-items:center;gap:7px;
  color:#39e58c;font-size:7px;font-weight:900;
  border-left:1px solid #163a4d
}
.cro-concept-system i{
  width:7px;height:7px;border-radius:50%;
  background:#39e58c;box-shadow:0 0 10px #39e58c
}
.cro-concept-user{
  height:100%;padding:0 18px;
  display:flex;flex-direction:column;justify-content:center;
  color:#6c8a9d;font-size:7px;border-left:1px solid #163a4d
}
.cro-concept-user strong{
  margin-top:3px;color:#d5edf8;font-size:9px
}

.cro-concept-wrap{
  max-width:1600px;
  padding:15px 18px 24px
}

/* Dashboard old TOP is replaced by visual hero */
.cro-concept-wrap > .top:first-child{display:none}

/* HERO */
.cro-concept-hero{
  position:relative;min-height:230px;overflow:hidden;
  border:1px solid #1a6684;border-radius:7px;
  padding:23px 25px;
  background:url("../img/cro-final-hero.png") center 45%/cover no-repeat;
  box-shadow:0 18px 55px rgba(0,0,0,.28)
}
.cro-concept-hero-shade{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(2,11,19,.96) 0%,rgba(3,14,23,.80) 42%,rgba(2,10,17,.25) 72%,rgba(2,9,15,.67) 100%),
    linear-gradient(180deg,rgba(0,0,0,.06),rgba(1,8,13,.55))
}
.cro-concept-hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,#22d8ff,transparent);
  box-shadow:0 0 12px rgba(34,216,255,.45)
}
.cro-concept-hero-copy,.cro-concept-hero-side{
  position:relative;z-index:2
}
.cro-concept-kicker{
  color:#49c0df;font-size:8px;font-weight:900;letter-spacing:.22em
}
.cro-concept-hero h1{
  margin:5px 0 0;font-size:28px;letter-spacing:.02em;
  text-shadow:0 3px 14px #000
}
.cro-concept-hero p{
  margin:2px 0;color:#a7c1cf;font-size:11px;
  text-shadow:0 2px 8px #000
}
.cro-concept-hero-side{
  position:absolute;right:24px;top:24px;
  text-align:right;color:#e2f5fb;
  font-size:12px;font-weight:900;line-height:1.48;letter-spacing:.22em;
  text-shadow:0 2px 9px #000
}

/* Metrics INSIDE hero, like plan */
.cro-concept-metrics{
  position:absolute;z-index:3;left:20px;right:20px;bottom:18px
}
.cro-concept-metrics .stats{
  margin:0;
  grid-template-columns:repeat(5,minmax(130px,1fr));
  gap:8px
}
.cro-concept-metrics .metric{
  min-height:72px;padding:10px 12px;
  border-radius:5px;border-color:#17607d;
  background:rgba(3,15,25,.83);
  box-shadow:0 9px 22px rgba(0,0,0,.20);
  backdrop-filter:blur(7px)
}
.cro-concept-metrics .metric .k{font-size:7px}
.cro-concept-metrics .metric .v{font-size:19px;margin-top:4px}
.cro-concept-metrics .metric .s{font-size:7px;margin-top:3px}
.cro-concept-metrics .bar{height:4px;margin-top:6px}

/* TOOLBAR */
.cro-concept-toolbar{
  display:flex;align-items:center;justify-content:space-between;
  gap:15px;margin:12px 0 10px
}
.cro-concept-view,.cro-concept-tools{
  display:flex;align-items:center;gap:7px
}
.cro-concept-view>span{
  color:#52788e;font-size:8px;font-weight:900;letter-spacing:.15em
}
.cro-concept-search{position:relative}
.cro-concept-search span{
  position:absolute;left:10px;top:4px;
  color:#779aae;font-size:19px
}
.cro-concept-search input{
  width:230px;height:34px;margin:0;padding:0 10px 0 31px;
  border:1px solid #184c65;border-radius:5px;
  background:#04121c;color:#dff7ff;font-size:9px
}
.cro-concept-search input:focus{
  outline:none;border-color:#1d9cc0;
  box-shadow:0 0 0 3px rgba(34,216,255,.04)
}
#cro-instance-sort{
  height:34px;border:1px solid #184c65;border-radius:5px;
  background:#04121c;color:#94adbd;padding:0 9px;font-size:9px
}
.cro-concept-instance-heading{margin:8px 0 8px}
#cro-visible-count{
  color:#4a8199!important;
  font:800 8px ui-monospace,SFMono-Regular,Menlo,monospace!important;
  letter-spacing:.12em!important
}

/* SERVER CARDS */
.cro-concept-instance-grid[data-view="cards"]{
  grid-template-columns:repeat(auto-fit,minmax(330px,1fr));
  gap:10px
}
.cro-concept-server{
  padding:12px;border-radius:6px;
  border-color:#17627f;
  background:linear-gradient(180deg,rgba(5,19,31,.98),rgba(2,12,20,.99));
  box-shadow:0 13px 32px rgba(0,0,0,.25)
}
.cro-concept-server:hover{
  transform:translateY(-2px);
  border-color:#1d8cb0;
  box-shadow:0 17px 40px rgba(0,0,0,.32),0 0 24px rgba(34,216,255,.04)
}
.cro-concept-server.server::before{width:2px}

.cro-concept-server-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px
}
.cro-concept-server-title{
  display:flex;align-items:center;gap:9px;min-width:0
}
.cro-concept-server-title>i{
  width:9px;height:9px;flex:0 0 auto;border-radius:50%;
  background:currentColor;box-shadow:0 0 10px currentColor
}
.cro-concept-server-title .name{
  margin:0;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.cro-concept-server-title span{
  display:block;margin-top:2px;color:#668599;font-size:8px
}
.cro-concept-status{
  display:flex;align-items:center;gap:5px;
  padding:4px 7px;border:1px solid currentColor;border-radius:999px;
  font-size:7px;font-weight:900;letter-spacing:.06em
}
.cro-concept-status i{
  width:5px;height:5px;border-radius:50%;background:currentColor;
  box-shadow:0 0 8px currentColor
}

.cro-concept-server-image{
  position:relative;height:86px;overflow:hidden;
  margin:9px 0;border:1px solid #174c65;border-radius:4px;
  background:#06121b
}
.cro-concept-server-image img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.9) contrast(1.08);
  transition:transform .35s ease,filter .35s ease
}
.cro-concept-server:hover .cro-concept-server-image img{
  transform:scale(1.035);filter:saturate(1.06) contrast(1.08)
}
.cro-concept-server-image::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 40%,rgba(2,10,17,.70))
}
.cro-concept-server-image span{
  position:absolute;right:8px;bottom:5px;z-index:2;
  color:#75cce1;font-size:6px;font-weight:900;letter-spacing:.15em;
  text-shadow:0 2px 8px #000
}

.cro-concept-server-info{display:grid;gap:4px}
.cro-concept-server-info>div{
  display:grid;grid-template-columns:80px minmax(0,1fr);
  gap:9px;color:#7492a5;font-size:9px
}
.cro-concept-server-info strong{
  min-width:0;color:#c6dce8;text-align:right;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}

.cro-concept-server-bars{
  margin-top:8px;padding-top:7px;
  border-top:1px solid rgba(255,255,255,.045)
}
.cro-concept-server-bars>div{
  display:grid;grid-template-columns:28px minmax(0,1fr) 78px;
  align-items:center;gap:8px;margin:5px 0
}
.cro-concept-server-bars span{color:#8ca6b7;font-size:8px}
.cro-concept-server-bars b{
  height:5px;border-radius:99px;overflow:hidden;background:#0b2735
}
.cro-concept-server-bars b i{
  display:block;width:0;height:100%;border-radius:99px;
  background:linear-gradient(90deg,#1486b4,#22d8ff);
  box-shadow:0 0 9px rgba(34,216,255,.25)
}
.cro-concept-server-bars strong{
  color:#66dcf7;text-align:right;font-size:8px
}

.cro-concept-actions{
  margin-top:9px;padding-top:9px;gap:6px
}
.cro-concept-actions .btn,.cro-concept-actions button{
  min-height:31px;padding:7px 11px;
  border-radius:5px;font-size:8px
}
.cro-concept-actions .cro-manage-btn{
  background:linear-gradient(180deg,#29ddff,#16a4cc)!important;
  color:#00131b!important;border-color:#65ebff!important;
  box-shadow:0 0 15px rgba(34,216,255,.16);
  font-weight:1000
}
.cro-concept-actions .cro-manage-btn:hover{
  box-shadow:0 0 22px rgba(34,216,255,.27)
}

/* WIDE */
.cro-concept-instance-grid[data-view="wide"]{
  grid-template-columns:repeat(2,minmax(450px,1fr));gap:10px
}
.cro-concept-instance-grid[data-view="wide"] .cro-concept-server{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  grid-template-areas:
    "head head"
    "image info"
    "bars actions";
  column-gap:14px;row-gap:7px
}
.cro-concept-instance-grid[data-view="wide"] .cro-concept-server-head{grid-area:head}
.cro-concept-instance-grid[data-view="wide"] .cro-concept-server-image{grid-area:image;height:95px;margin:0}
.cro-concept-instance-grid[data-view="wide"] .cro-concept-server-info{grid-area:info}
.cro-concept-instance-grid[data-view="wide"] .cro-concept-server-bars{grid-area:bars}
.cro-concept-instance-grid[data-view="wide"] .cro-concept-actions{grid-area:actions;align-self:end}

/* LIST */
.cro-concept-instance-grid[data-view="list"]{display:block}
.cro-concept-instance-grid[data-view="list"] .cro-concept-server{
  display:grid;
  grid-template-columns:minmax(190px,1.1fr) 170px minmax(280px,1.4fr) 250px auto;
  align-items:center;gap:13px;margin-bottom:6px;padding:8px 10px
}
.cro-concept-instance-grid[data-view="list"] .cro-concept-server-image{height:54px;margin:0}
.cro-concept-instance-grid[data-view="list"] .cro-concept-server-bars{margin:0;padding:0;border:0}
.cro-concept-instance-grid[data-view="list"] .cro-concept-actions{margin:0;padding:0;border:0;flex-wrap:nowrap}

/* LOWER PANELS */
.cro-concept-lower{
  display:grid;grid-template-columns:1.25fr .9fr .9fr;
  gap:10px;margin-top:11px
}
.cro-concept-widget{
  padding:12px;border-radius:6px;border-color:#175b77;
  background:linear-gradient(180deg,rgba(5,19,31,.98),rgba(2,12,20,.99))
}
.cro-concept-widget-head{
  display:flex;align-items:flex-start;justify-content:space-between
}
.cro-concept-widget-head span{
  color:#4d8299;font-size:7px;font-weight:900;letter-spacing:.14em
}
.cro-concept-widget-head h3{
  margin:4px 0 0;font-size:10px;letter-spacing:.04em
}
.cro-concept-widget-head h3 small{
  color:#668a9d;font-size:7px;font-weight:700
}
.cro-concept-widget-head b{
  display:flex;align-items:center;gap:5px;color:#39e58c;font-size:7px
}
.cro-concept-widget-head b i{
  width:5px;height:5px;border-radius:50%;background:#39e58c;
  box-shadow:0 0 8px #39e58c
}
.cro-concept-chart{
  position:relative;height:143px;margin-top:4px
}
.cro-concept-chart-grid{
  position:absolute;inset:4px 0 17px;
  background-image:
    linear-gradient(rgba(34,216,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(34,216,255,.05) 1px,transparent 1px);
  background-size:48px 29px
}
.cro-concept-chart svg{
  position:absolute;left:0;top:0;width:100%;height:120px
}
.cro-concept-chart-labels{
  position:absolute;left:0;right:0;bottom:0;
  display:flex;justify-content:space-between;
  color:#55778a;font-size:6px
}
.cro-concept-rings{
  display:flex;justify-content:center;gap:11px;padding:17px 0 15px
}
.cro-concept-ring{
  --v:calc(var(--p)*1%);
  width:70px;height:70px;position:relative;
  display:grid;place-items:center;border-radius:50%;
  background:conic-gradient(#22d8ff var(--v),#123247 0)
}
.cro-concept-ring.disk{
  background:conic-gradient(#ffb865 var(--v),#123247 0)
}
.cro-concept-ring::after{
  content:"";position:absolute;inset:7px;border-radius:50%;
  background:#06131e
}
.cro-concept-ring strong,.cro-concept-ring span{
  position:relative;z-index:2
}
.cro-concept-ring strong{font-size:14px}
.cro-concept-ring span{
  position:absolute;bottom:-15px;color:#6d899b;font-size:7px
}
.cro-concept-ok{
  margin-top:13px;text-align:center;color:#39e58c;font-size:7px
}
.cro-concept-ok i{
  display:inline-block;width:5px;height:5px;border-radius:50%;
  background:#39e58c;margin-right:6px
}
.cro-concept-events{margin-top:6px}
.cro-concept-events>div{
  display:grid;grid-template-columns:8px 1fr auto;gap:7px;align-items:center;
  padding:7px 0;border-bottom:1px solid rgba(255,255,255,.045);
  font-size:7px
}
.cro-concept-events i{
  width:5px;height:5px;border-radius:50%;
  background:#22d8ff;box-shadow:0 0 8px rgba(34,216,255,.65)
}
.cro-concept-events i.green{
  background:#39e58c;box-shadow:0 0 8px rgba(57,229,140,.65)
}
.cro-concept-events i.red{
  background:#ff5364;box-shadow:0 0 8px rgba(255,83,100,.65)
}
.cro-concept-events span{color:#a9c2d0}
.cro-concept-events time{color:#527086}

.cro-concept-footer{
  display:flex;justify-content:space-between;gap:16px;
  margin-top:10px;padding:11px 14px;
  border:1px solid #174d66;border-radius:5px;
  background:rgba(4,15,24,.75);
  color:#588096;font-size:7px;letter-spacing:.14em
}
.cro-concept-footer strong{color:#bfefff}

/* Real image login */
.cro-login-page{
  background:
    linear-gradient(180deg,rgba(2,8,13,.69),rgba(2,7,12,.95)),
    url("../img/cro-final-login.png") center/cover fixed no-repeat!important
}
.cro-login-real-logo{
  height:120px;margin:-12px auto 0;text-align:center
}
.cro-login-real-logo img{
  width:320px;max-width:96%;height:120px;object-fit:contain;
  filter:drop-shadow(0 0 14px rgba(34,216,255,.18))
}

/* Keep all other current pages functional, but visually aligned */
.cro-concept-ui .card,
.cro-concept-ui .metric{
  border-color:#17506b;
  background:linear-gradient(180deg,rgba(6,19,31,.98),rgba(3,12,20,.99))
}
.cro-concept-ui .console-shell,
.cro-concept-ui .table-wrap,
.cro-concept-ui pre.result{
  border-color:#17506b!important
}
.cro-concept-ui .quick{
  border-color:#17506b;background:#06131e
}
.cro-concept-ui .quick:hover{
  border-color:#1f86aa;background:#071927
}

@media(max-width:1250px){
  .cro-concept-lower{grid-template-columns:1fr 1fr}
  .cro-concept-player-widget{grid-column:1/-1}
  .cro-concept-metrics .stats{grid-template-columns:repeat(3,1fr)}
  .cro-concept-hero{padding-bottom:105px}
  .cro-concept-instance-grid[data-view="wide"]{grid-template-columns:1fr}
  .cro-concept-instance-grid[data-view="list"] .cro-concept-server{
    grid-template-columns:minmax(180px,1fr) 145px minmax(260px,1.25fr) auto
  }
  .cro-concept-instance-grid[data-view="list"] .cro-concept-server-bars{display:none}
}
@media(max-width:900px){
  .cro-concept-shell{grid-template-columns:215px minmax(0,1fr)}
  .cro-concept-brand{height:115px}
  .cro-concept-brand img{height:100px}
  .cro-concept-hero-side{display:none}
  .cro-concept-toolbar{align-items:flex-start;flex-direction:column}
  .cro-concept-tools{width:100%}
  .cro-concept-search{flex:1}
  .cro-concept-search input{width:100%}
  .cro-concept-lower{grid-template-columns:1fr}
  .cro-concept-instance-grid[data-view="list"] .cro-concept-server{display:block}
  .cro-concept-instance-grid[data-view="list"] .cro-concept-server-image{height:75px;margin:8px 0}
  .cro-concept-instance-grid[data-view="list"] .cro-concept-server-bars{display:block;margin-top:8px}
  .cro-concept-instance-grid[data-view="list"] .cro-concept-actions{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.04)}
}
@media(max-width:760px){
  .cro-concept-shell{display:block}
  .cro-concept-sidebar{position:relative;height:auto}
  .cro-concept-sidebar-bg,.cro-concept-powered{display:none}
  .cro-concept-topbar{position:relative}
  .cro-concept-security,.cro-concept-clock,.cro-concept-user{display:none}
  .cro-concept-wrap{padding:10px}
  .cro-concept-hero{min-height:170px;padding:17px}
  .cro-concept-metrics{position:relative;left:auto;right:auto;bottom:auto;margin-top:30px}
  .cro-concept-metrics .stats{grid-template-columns:1fr 1fr}
  .cro-concept-instance-grid[data-view="cards"]{grid-template-columns:1fr}
  .cro-concept-footer{flex-direction:column}
}


/* v4.3.13 — authenticated user/logout control */
.cro-concept-logout{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 12px;
  border:1px solid rgba(255,78,78,.45);
  border-radius:6px;
  color:#ff8a8a;
  background:rgba(120,10,10,.18);
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-decoration:none;
}
.cro-concept-logout:hover{
  border-color:#ff5d5d;
  color:#fff;
  box-shadow:0 0 18px rgba(255,60,60,.18);
}

/* Functional ONLINE state must animate equally on desktop/mobile. */
.cro-concept-status.online i,
.cro-concept-server-title i.online,
.cro-concept-system i{
  animation:cro-status-pulse 1.45s ease-in-out infinite!important;
}
@media (prefers-reduced-motion: reduce){
  .cro-concept-status.online i,
  .cro-concept-server-title i.online,
  .cro-concept-system i{
    animation:cro-status-pulse 1.45s ease-in-out infinite!important;
  }
}


/* v4.3.14 — LIST mode must never overlap long Rust server names. */
.cro-concept-instance-grid[data-view="list"] .cro-concept-server{
  grid-template-columns:minmax(300px,1.5fr) 170px minmax(230px,1fr) minmax(210px,.9fr) minmax(285px,auto);
  min-width:0;
}
.cro-concept-instance-grid[data-view="list"] .cro-concept-server-title,
.cro-concept-instance-grid[data-view="list"] .cro-concept-server-title>div,
.cro-concept-instance-grid[data-view="list"] .cro-concept-server-info,
.cro-concept-instance-grid[data-view="list"] .cro-concept-server-bars{min-width:0}
.cro-concept-instance-grid[data-view="list"] .cro-concept-server-title .name{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;max-width:100%;
}
.cro-concept-instance-grid[data-view="list"] .cro-concept-server-info strong{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;
}
.cro-concept-player-summary{display:flex;align-items:baseline;gap:7px;margin:9px 0 -3px}
.cro-concept-player-summary strong{font-size:28px;color:#fff}
.cro-concept-player-summary span{font-size:10px;color:#6e91a7;letter-spacing:.08em}
@media(max-width:1350px){
  .cro-concept-instance-grid[data-view="list"] .cro-concept-server{
    grid-template-columns:minmax(260px,1.3fr) 150px minmax(210px,1fr) minmax(180px,.8fr) minmax(250px,auto);
  }
}

.oxide-health-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:14px}.oxide-action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.oxide-action-grid p{min-height:58px;color:var(--muted);line-height:1.55}.oxide-status-line{display:flex;align-items:center;gap:12px;padding:12px 0 15px;font-size:23px;letter-spacing:.04em}.oxide-big-dot{width:13px;height:13px;border-radius:50%;display:inline-block}.oxide-big-dot.online{background:#42ff9a;box-shadow:0 0 18px rgba(66,255,154,.65)}.oxide-big-dot.offline{background:#ff516d;box-shadow:0 0 16px rgba(255,81,109,.4)}.oxide-runtime-output{margin-top:12px;padding:12px;border:1px solid rgba(38,201,255,.15);background:rgba(2,12,18,.55);border-radius:6px;color:#94b7c8;white-space:pre-wrap;word-break:break-word;font:12px/1.45 ui-monospace,monospace;min-height:72px}.oxide-error-row,.oxide-file-row{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid rgba(76,170,210,.12)}.oxide-error-row:last-child,.oxide-file-row:last-child{border-bottom:0}.oxide-error-row span,.oxide-file-row span{color:#6d93a8;font-size:11px}.oxide-error-row code,.oxide-file-row code{white-space:pre-wrap;word-break:break-word;color:#cde9f4}.empty-state{padding:16px;color:#6f94a7}@media(max-width:1000px){.oxide-health-grid,.oxide-action-grid{grid-template-columns:1fr}.oxide-action-grid p{min-height:auto}}

/* v4.5 complete Oxide suite */
.plugin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}.plugin-card .name{display:flex;justify-content:space-between;gap:12px;align-items:center}.plugin-card form{margin-top:10px}.plugin-card input,.plugin-card select,.oxide-action-grid input,.oxide-action-grid select{width:100%;margin:5px 0}.inline-form{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid rgba(70,180,220,.12)}.tag-cloud{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.card pre{white-space:pre-wrap;word-break:break-word;color:#a9d4e5}@media(max-width:900px){.plugin-grid{grid-template-columns:1fr}}

/* v4.5.1 Intelligence + compact list/card UX */
.view-switch{display:flex;justify-content:flex-end;gap:6px;margin:10px 0}.view-switch button,.intel-tabs button{padding:7px 11px;font-size:10px;letter-spacing:.08em}.view-switch button.active,.intel-tabs button.active{border-color:#25d5ff;box-shadow:0 0 12px rgba(37,213,255,.18);color:#dff9ff}
.plugin-grid.cro-view-list,.intel-plugin-list.cro-view-list{display:block}.cro-view-list .plugin-card{display:grid;grid-template-columns:minmax(230px,1.4fr) repeat(4,minmax(95px,.55fr)) auto;align-items:center;gap:10px;margin:7px 0;padding:10px 13px}.cro-view-list .plugin-card .name{margin:0}.cro-view-list .plugin-card .row{border:0;padding:0;display:block}.cro-view-list .plugin-card .row span{display:block;font-size:8px}.cro-view-list .plugin-card .actions{margin:0;justify-content:flex-end}.cro-view-cards{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.intel-toolbar{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.intel-toolbar form{margin:0}.intel-stat-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:12px 0}.intel-stat{padding:12px!important}.intel-stat span{display:block;color:#6f9caf;font-size:9px}.intel-stat strong{font-size:22px;color:#dff8ff}.intel-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0 8px}.intel-tab{display:none}.intel-tab.active{display:block}.intel-row{display:grid;grid-template-columns:90px minmax(160px,.8fr) minmax(250px,1.4fr) minmax(130px,.6fr);gap:12px;align-items:center;padding:8px 4px;border-bottom:1px solid rgba(70,180,220,.11)}.intel-row:last-child{border-bottom:0}.intel-row code{word-break:break-word}.intel-row small{color:#7395a6}.permission-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1100px){.intel-stat-grid{grid-template-columns:repeat(4,1fr)}.cro-view-list .plugin-card{grid-template-columns:1fr 1fr}.intel-row{grid-template-columns:80px 1fr}.permission-grid{grid-template-columns:1fr}}
@media(max-width:650px){.intel-stat-grid{grid-template-columns:repeat(2,1fr)}.cro-view-list .plugin-card{grid-template-columns:1fr}.intel-row{grid-template-columns:1fr}.cro-view-cards{grid-template-columns:1fr!important}}

.admin-tabs{display:flex;gap:7px;margin:14px 0;position:sticky;top:8px;z-index:5;background:rgba(2,8,12,.92);padding:8px;border:1px solid rgba(38,201,255,.12);backdrop-filter:blur(10px)}
.admin-tabs button.active{border-color:#25d5ff;color:#e6fbff;box-shadow:0 0 14px rgba(37,213,255,.16)}
.admin-panel{display:none}.admin-panel.active{display:block}
.owner-row,.migration-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid rgba(70,180,220,.12)}.owner-row:last-child,.migration-row:last-child{border-bottom:0}.owner-row div,.migration-row div{display:flex;flex-direction:column;gap:3px}.owner-row span,.migration-row span{color:#6f97aa;font-size:11px}
textarea{min-height:120px;resize:vertical}
.intel-tabs{position:sticky;top:8px;z-index:6;background:rgba(2,8,12,.94);padding:8px;border:1px solid rgba(38,201,255,.13);backdrop-filter:blur(10px)}
.intel-tab:not(.active){display:none!important}
@media(max-width:700px){.owner-row,.migration-row{align-items:stretch;flex-direction:column}.admin-tabs,.intel-tabs{overflow-x:auto;flex-wrap:nowrap}.admin-tabs button,.intel-tabs button{white-space:nowrap}}

/* v4.6.1: sidebar must never hide implemented managers */
.sidebar,.cro-sidebar,aside.sidebar,#sidebar{
  max-height:100vh!important;height:100vh!important;overflow-y:auto!important;overflow-x:hidden!important;
  overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(38,213,255,.55) rgba(3,14,20,.45);
  padding-bottom:96px!important;
}
.sidebar::-webkit-scrollbar,.cro-sidebar::-webkit-scrollbar,#sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-thumb,.cro-sidebar::-webkit-scrollbar-thumb,#sidebar::-webkit-scrollbar-thumb{background:rgba(38,213,255,.45);border-radius:10px}
.sidebar .brand,.cro-sidebar .brand,.sidebar-logo{position:relative;z-index:2}
.sidebar a,.cro-sidebar a{flex-shrink:0}
@media(max-width:900px){
 .sidebar,.cro-sidebar,aside.sidebar,#sidebar{height:100dvh!important;max-height:100dvh!important;padding-bottom:120px!important}
}

/* v4.7.0 Server Manager + Logs */
.server-manager-list{display:grid;gap:12px;margin-top:12px}.server-manager-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start}.server-manager-row>details{grid-column:1/-1}.server-manager-main small{display:block;color:#688fa3;margin:5px 0 10px;word-break:break-all}.server-manager-meta{display:flex;flex-wrap:wrap;gap:10px 18px;color:#7196aa;font-size:11px}.server-manager-meta b{color:#d8f5ff}.server-manager-edit,.server-manager-delete{border-top:1px solid rgba(60,180,220,.12);padding-top:8px}.server-manager-edit summary,.server-manager-delete summary{cursor:pointer;color:#8ac8df;font-size:10px;letter-spacing:.09em}.server-manager-delete summary{color:#ff8f9d}.server-manager-form .form-grid,.server-manager-edit .form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.form-grid label{display:flex;flex-direction:column;gap:5px;color:#7298aa;font-size:10px}.logs-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:12px 0}.logs-toolbar form{display:flex;gap:8px;flex:1}.logs-toolbar select,.logs-toolbar input{min-width:0}.logs-toolbar input{flex:1}.live-toggle{font-size:10px;color:#8eb8ca;white-space:nowrap}.log-viewer{padding:0!important;overflow:hidden}.log-viewer pre{height:58vh;min-height:420px;overflow:auto;margin:0;padding:14px;background:#02090d;color:#b9dce8;font:11px/1.48 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;word-break:break-word}.logs-summary strong{word-break:break-all}
@media(max-width:1000px){.server-manager-form .form-grid,.server-manager-edit .form-grid{grid-template-columns:repeat(2,1fr)}.server-manager-row{grid-template-columns:1fr}.logs-toolbar,.logs-toolbar form{flex-direction:column;align-items:stretch}}
@media(max-width:620px){.server-manager-form .form-grid,.server-manager-edit .form-grid{grid-template-columns:1fr}.log-viewer pre{height:52vh;min-height:320px}}

/* v4.7.1 overview module truth-state */
.quick.live{cursor:pointer;opacity:1!important}
.quick.live:hover{transform:translateY(-1px);border-color:rgba(37,213,255,.65);box-shadow:0 0 18px rgba(37,213,255,.10)}
.quick.coming{opacity:.42!important;filter:saturate(.55)}

/* CRO FINAL PNG ASSET LAYER */
.cro-concept-brand img,.cro-login-real-logo img{object-fit:contain!important;filter:drop-shadow(0 0 9px rgba(255,102,24,.40)) drop-shadow(0 0 12px rgba(30,199,241,.18))!important}
.cro-concept-brand{background:radial-gradient(circle at 50% 45%,rgba(255,91,19,.08),transparent 63%)!important}
.cro-concept-sidebar-bg{top:auto!important;bottom:0!important;height:39%!important;background:linear-gradient(180deg,#02070b 0%,rgba(2,7,11,.04) 28%,rgba(2,7,11,.08) 72%,#02070b 100%),url("../img/cro-final-sidebar.png") center bottom/cover no-repeat!important}
.cro-concept-hero,.cro-v13-hero{background-image:url("../img/cro-final-hero.png")!important;background-position:center 52%!important;background-size:cover!important}
body.login-page,.cro-login-page{background-image:linear-gradient(rgba(1,6,10,.40),rgba(1,6,10,.72)),url("../img/cro-final-login.png")!important;background-position:center!important;background-size:cover!important}
.cro-v13-server:nth-child(3n+1) .cro-v13-server-image{background:url("../img/cro-final-server-pve.png") center/cover no-repeat!important}
.cro-v13-server:nth-child(3n+2) .cro-v13-server-image{background:url("../img/cro-final-server-arena.png") center/cover no-repeat!important}
.cro-v13-server:nth-child(3n+3) .cro-v13-server-image{background:url("../img/cro-final-server-dev.png") center/cover no-repeat!important}
.cro-v13-server-image img{opacity:0!important}


/* =====================================================================
   CRO FINAL UI v16
   ===================================================================== */
:root{
  --cro-cyan:#20d8ff;--cro-orange:#ff7a1a;--cro-green:#15e487;
  --cro-red:#ff4c55;--cro-purple:#ba4fff;--cro-text:#d8ebf4;--cro-muted:#6b8a9c;
}
html{scroll-behavior:smooth}
body.cro-final-ui{background:#02070b!important;color:var(--cro-text);overflow-x:hidden}
.cro-final-background{position:fixed;inset:0;z-index:-10;pointer-events:none;background:radial-gradient(circle at 82% 7%,rgba(255,100,24,.07),transparent 26%),radial-gradient(circle at 34% 20%,rgba(25,199,242,.045),transparent 28%),#02070b}
.cro-final-grid{position:absolute;inset:0;opacity:.12;background-image:linear-gradient(rgba(45,162,195,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(45,162,195,.08) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 88%)}
.cro-final-vignette{position:absolute;inset:0;box-shadow:inset 0 0 220px rgba(0,0,0,.82)}
.cro-final-sidebar{border-right:1px solid #234454!important;background:linear-gradient(180deg,rgba(4,12,18,.99),rgba(2,7,11,.985))!important;box-shadow:10px 0 34px rgba(0,0,0,.34);overflow:hidden}
.cro-final-sidebar::before{content:"";position:absolute;right:-1px;top:0;bottom:0;width:2px;background:linear-gradient(transparent 4%,var(--cro-orange) 14%,transparent 28%,var(--cro-cyan) 55%,transparent 82%);opacity:.55}
.cro-final-brand{height:162px!important;padding:13px 12px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:radial-gradient(circle at 50% 46%,rgba(255,114,24,.12),transparent 58%)!important}
.cro-final-brand img{max-width:205px!important;max-height:145px!important;width:auto!important;height:auto!important;object-fit:contain!important;filter:drop-shadow(0 0 11px rgba(255,107,24,.34)) drop-shadow(0 0 12px rgba(26,205,242,.16)) drop-shadow(0 9px 12px rgba(0,0,0,.68))!important;transition:.25s ease}
.cro-final-brand:hover img{transform:scale(1.025)}
.cro-final-brand-divider{height:16px;position:relative}
.cro-final-brand-divider::before,.cro-final-brand-divider::after{content:"";position:absolute;top:7px;width:42%;height:1px;background:linear-gradient(90deg,transparent,#704527)}
.cro-final-brand-divider::before{left:0}.cro-final-brand-divider::after{right:0;transform:scaleX(-1)}
.cro-final-brand-divider i{position:absolute;width:5px;height:5px;left:50%;top:5px;transform:translateX(-50%) rotate(45deg);background:var(--cro-orange);box-shadow:0 0 9px rgba(255,122,26,.65)}
.cro-final-nav{position:relative;z-index:3;padding-bottom:330px}
.cro-final-nav .nav-title{font-size:9px!important;letter-spacing:.18em!important;font-weight:950!important;color:#4687a0!important;margin:15px 14px 9px!important}
.cro-final-nav a{min-height:43px!important;margin:3px 9px!important;padding:9px 11px!important;border:1px solid transparent!important;border-radius:5px!important;font-size:12px!important;gap:11px!important;color:#9db9c8!important;position:relative;overflow:hidden;transition:.18s ease!important}
.cro-final-nav a:hover{color:#eaf9ff!important;border-color:rgba(36,201,238,.14)!important;background:rgba(18,79,104,.10)!important;transform:translateX(2px)}
.cro-final-nav a.active{color:#fff!important;border-color:#a85a22!important;background:linear-gradient(90deg,rgba(255,115,22,.24),rgba(255,115,22,.045))!important;box-shadow:inset 3px 0 0 var(--cro-orange),0 0 18px rgba(255,104,20,.09)!important}
.cro-final-nav-icon{width:20px;height:20px;display:grid;place-items:center;font-size:18px!important;color:#c3ecf8}
.cro-final-sidebar-art{top:auto!important;bottom:0!important;height:350px!important;opacity:.88!important;background:linear-gradient(180deg,#02070b 0%,rgba(2,7,11,.12) 23%,rgba(2,7,11,.12) 70%,#02070b 100%),url("../img/cro-final-sidebar.png") center bottom/cover no-repeat!important}
.cro-final-powered{bottom:19px!important;z-index:4!important;text-align:center!important;width:100%!important;left:0!important}
.cro-final-powered span{font-size:6px!important;letter-spacing:.20em!important}.cro-final-powered strong{display:block;margin:5px 0;font-size:8px!important;letter-spacing:.16em}.cro-final-powered small{font-size:5.5px!important;letter-spacing:.16em!important}
.cro-final-main{min-width:0}
.cro-final-topbar{position:sticky;top:0;z-index:120;height:60px;display:flex;align-items:center;gap:12px;padding:0 15px;border-bottom:1px solid #173c50;background:linear-gradient(180deg,rgba(4,14,22,.985),rgba(3,11,17,.965));backdrop-filter:blur(13px);box-shadow:0 9px 28px rgba(0,0,0,.22)}
.cro-final-scanline{position:fixed;top:59px;left:230px;right:0;height:1px;z-index:121;pointer-events:none;background:linear-gradient(90deg,transparent,var(--cro-cyan),transparent);opacity:.22;animation:croFinalTopScan 5s linear infinite}
@keyframes croFinalTopScan{0%{transform:translateX(-75%);opacity:0}20%{opacity:.25}70%{opacity:.14}100%{transform:translateX(75%);opacity:0}}
.cro-final-mobile-menu{display:none}
.cro-final-search-wrap{position:relative;width:min(520px,42vw);height:38px;margin-left:3px;display:flex;align-items:center;border:1px solid #27526a;border-radius:6px;background:rgba(2,9,15,.78)}
.cro-final-search-wrap:focus-within{border-color:#2a9eb9;box-shadow:0 0 20px rgba(32,216,255,.05)}
.cro-final-search-icon{width:37px;text-align:center;font-size:19px}.cro-final-search-wrap input{min-width:0;flex:1;border:0!important;background:transparent!important;color:#d6e9f2!important;font-size:10px!important;padding:0!important;height:100%!important}
.cro-final-search-wrap kbd{margin-right:8px;padding:4px 7px;border:1px solid #233b4b;border-radius:4px;background:#0b1720;color:#7e98aa;font-size:7px;font-family:inherit}
.cro-global-search-results{position:absolute;left:0;right:0;top:calc(100% + 7px);z-index:300;max-height:330px;overflow:auto;padding:6px;border:1px solid #1c536e;border-radius:7px;background:rgba(2,11,18,.99);box-shadow:0 24px 70px rgba(0,0,0,.62)}
.cro-search-result{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:40px;padding:8px 10px;border-radius:5px;text-decoration:none;color:#a7c1d0}.cro-search-result:hover{background:rgba(28,151,182,.08);color:#fff}.cro-search-result strong{font-size:9px}.cro-search-result span{font-size:7px;color:#547589}
.cro-final-top-actions{margin-left:auto;height:100%;display:flex;align-items:stretch}.cro-profile-wrap,.cro-notify-wrap{position:relative;height:100%}
.cro-final-icon-btn{position:relative;width:55px;height:100%;padding:0!important;border:0!important;border-left:1px solid #17394c!important;border-radius:0!important;background:transparent!important;color:#9fb9c7!important;display:grid;place-items:center;font-size:17px!important}.cro-final-icon-btn:hover{background:rgba(34,216,255,.045)!important;color:#fff!important}
.cro-final-icon-btn b{position:absolute;top:7px;right:6px;min-width:16px;height:16px;padding:0 4px;display:grid;place-items:center;border-radius:99px;background:var(--cro-red);color:#fff;font-size:7px;box-shadow:0 0 8px rgba(255,76,85,.55)}
.cro-final-profile{min-width:205px;height:100%;padding:0 11px!important;display:flex;align-items:center;gap:9px;border:0!important;border-left:1px solid #17394c!important;border-radius:0!important;background:transparent!important;color:#dbeaf1!important;text-align:left}
.cro-final-avatar{width:34px;height:34px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;border:1px solid #e87a2b;background:linear-gradient(145deg,#173345,#071018);color:#fff;font-weight:1000;font-size:10px;box-shadow:0 0 12px rgba(255,112,24,.12)}
.cro-final-avatar.large{width:46px;height:46px;font-size:14px}.cro-final-avatar.xlarge{width:74px;height:74px;font-size:20px}
.cro-final-profile-copy{display:flex;flex-direction:column;min-width:0}.cro-final-profile-copy strong{max-width:118px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9px}.cro-final-profile-copy small{margin-top:3px;color:#33cf87;font-size:6.5px}.cro-final-chevron{margin-left:auto;color:#688799;font-size:15px}
.cro-final-popover{position:absolute;right:7px;top:calc(100% + 7px);z-index:320;border:1px solid #1b5068;border-radius:7px;background:rgba(3,12,19,.985);box-shadow:0 24px 70px rgba(0,0,0,.62);backdrop-filter:blur(15px);animation:croPopoverIn .16s ease both}.cro-final-popover[hidden]{display:none!important}@keyframes croPopoverIn{from{opacity:0;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:none}}
.cro-profile-menu{width:288px;padding:7px}.cro-profile-head{display:flex;align-items:center;gap:11px;padding:11px;border-bottom:1px solid rgba(255,255,255,.055);margin-bottom:5px}.cro-profile-head div{display:flex;flex-direction:column}.cro-profile-head small{font-size:6px;color:#5e8092}.cro-profile-head strong{margin:3px 0;font-size:10px}.cro-profile-head span:last-child{font-size:7px;color:#27d98d}
.cro-profile-menu>button,.cro-profile-menu>a{width:100%;min-height:52px;padding:8px 10px!important;display:flex;align-items:center;gap:10px;border:1px solid transparent!important;border-radius:5px!important;background:transparent!important;color:#a4bfce!important;text-decoration:none!important;text-align:left}.cro-profile-menu>button:hover,.cro-profile-menu>a:hover{border-color:rgba(32,216,255,.10)!important;background:rgba(32,216,255,.042)!important;color:#fff!important}.cro-menu-ico{width:24px;text-align:center;color:#65d9f2;font-size:17px}.cro-profile-menu>button div,.cro-profile-menu>a div{display:flex;flex-direction:column}.cro-profile-menu strong{font-size:9px}.cro-profile-menu small{margin-top:3px;font-size:6.5px;color:#5e7c8f}.cro-profile-separator{height:1px;margin:5px;background:rgba(255,255,255,.055)}.cro-profile-menu .cro-profile-logout{color:#ff8583!important}
.cro-notify-menu{width:360px;overflow:hidden}.cro-popover-title{min-height:57px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.055);background:linear-gradient(90deg,rgba(20,76,98,.16),transparent)}.cro-popover-title div{display:flex;flex-direction:column}.cro-popover-title small{font-size:5.5px;letter-spacing:.17em;color:#527f94}.cro-popover-title strong{margin-top:3px;font-size:9px}.cro-popover-title button{padding:5px!important;border:0!important;background:transparent!important;color:#4ccce8!important;font-size:6.5px!important}
.cro-panel-update-alert{margin:8px;padding:10px;display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;border:1px solid rgba(255,118,26,.35);border-radius:5px;background:linear-gradient(90deg,rgba(255,104,22,.12),rgba(255,104,22,.025))}.cro-panel-update-alert[hidden]{display:none!important}.cro-update-orb{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--cro-cyan);color:var(--cro-cyan);font-size:20px}.cro-panel-update-alert>div:last-child{display:flex;flex-direction:column}.cro-panel-update-alert small,.cro-final-toast small{font-size:5.5px;color:#ff9a51;letter-spacing:.14em}.cro-panel-update-alert strong{margin:3px 0;font-size:9px}.cro-panel-update-alert span{font-size:6.5px;color:#7593a4}
.cro-notify-events{max-height:310px;overflow:auto;padding:3px 8px 8px}.cro-notify-event{display:grid;grid-template-columns:7px minmax(0,1fr) auto;gap:8px;align-items:start;padding:9px 4px;border-bottom:1px solid rgba(255,255,255,.042)}.cro-notify-event i{width:6px;height:6px;margin-top:3px;border-radius:50%;background:var(--cro-cyan)}.cro-notify-event strong{display:block;font-size:8px;color:#b7d0db}.cro-notify-event small{display:block;margin-top:2px;font-size:6px;color:#547588;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cro-notify-event time{font-size:6px;color:#496a7b}
.cro-concept-hero{min-height:286px!important;border:1px solid #2b4d5d!important;border-radius:0 0 9px 9px!important;background-image:url("../img/cro-final-hero.png")!important;background-size:cover!important;background-position:center 55%!important;box-shadow:0 18px 42px rgba(0,0,0,.28)!important}
.cro-concept-hero::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(2,8,13,.88) 0%,rgba(2,8,13,.42) 28%,rgba(2,8,13,.10) 68%,rgba(2,8,13,.66) 100%),linear-gradient(180deg,rgba(0,0,0,.03),rgba(3,10,15,.50))}
.cro-concept-hero-copy{z-index:2!important;max-width:570px}.cro-concept-kicker{color:#ff9e58!important;letter-spacing:.19em!important;font-size:8px!important}.cro-concept-hero h1{margin:8px 0 5px!important;font-size:39px!important;line-height:.95!important;letter-spacing:.025em!important;text-shadow:0 4px 20px rgba(0,0,0,.72)}.cro-concept-hero p{font-size:11px!important;color:#a9c6d4!important;max-width:510px}.cro-hero-pills{display:flex;gap:6px;margin-top:13px;flex-wrap:wrap}.cro-hero-pills span{padding:5px 8px;border:1px solid rgba(43,193,225,.25);border-radius:3px;background:rgba(3,13,20,.47);font-size:6px;font-weight:900;letter-spacing:.10em;color:#84d9ed}.cro-concept-hero-side{z-index:2!important;text-align:right!important;line-height:1!important;border-left:2px solid var(--cro-cyan)!important;padding-left:14px!important}.cro-concept-hero-side small{display:block;margin-bottom:7px;font-size:6px;color:#98aeba;letter-spacing:.18em}.cro-concept-hero-side strong{font-size:17px;letter-spacing:.12em;color:#e3f3f8}
.cro-concept-metrics .metric{min-height:71px!important;padding:10px 11px!important;border:1px solid #194e67!important;border-radius:5px!important;background:linear-gradient(180deg,rgba(5,21,32,.96),rgba(3,13,21,.98))!important;transition:.2s ease!important}.cro-concept-metrics .metric:hover{transform:translateY(-2px);border-color:#2b829f!important}.cro-concept-metrics .metric:nth-child(2){border-color:#755126!important}.cro-concept-metrics .metric:nth-child(3){border-color:#53336d!important}.cro-concept-metrics .metric:nth-child(5){border-color:#275c44!important}
.cro-final-toolbar{display:flex!important;align-items:center!important;gap:10px!important;padding:10px 11px!important;margin-top:10px!important;border:1px solid #1f5369!important;border-radius:7px!important;background:linear-gradient(180deg,rgba(4,17,27,.98),rgba(3,11,18,.99))!important}.cro-toolbar-title{margin-right:auto;display:flex;flex-direction:column}.cro-toolbar-title strong{font-size:12px}.cro-toolbar-title small{margin-top:2px;color:#6d8da0;font-size:7px}.cro-concept-view{margin-left:auto!important}.cro-view-btn{min-height:34px!important;padding:7px 11px!important;font-size:8px!important}.cro-view-btn.active{border-color:#b05b22!important;background:rgba(255,111,22,.14)!important;color:#ffb26b!important}.cro-add-instance{min-height:35px!important;padding:8px 13px!important;border-color:#b05c24!important;background:linear-gradient(180deg,#ff8e37,#df601b)!important;color:#140902!important;font-size:8px!important;font-weight:1000!important}
.cro-concept-server{position:relative;padding:11px!important;border:1px solid #175b77!important;border-radius:7px!important;background:linear-gradient(180deg,rgba(5,19,29,.99),rgba(2,11,18,.995))!important;box-shadow:0 8px 25px rgba(0,0,0,.20)!important;overflow:hidden;transition:.22s ease!important}.cro-concept-server::before{content:"";position:absolute;left:0;top:0;width:3px;height:72%;background:linear-gradient(var(--cro-cyan),transparent);opacity:.8}.cro-concept-server:hover{transform:translateY(-3px);border-color:#2581a3!important;box-shadow:0 13px 31px rgba(0,0,0,.28),0 0 24px rgba(32,216,255,.055)!important}
.cro-concept-server-image{height:112px!important;margin:9px -2px!important;border-color:#27556a!important;background-position:center!important;background-size:cover!important}.cro-concept-server:nth-child(3n+1) .cro-concept-server-image{background:url("../img/cro-final-server-pve.png") center/cover no-repeat!important}.cro-concept-server:nth-child(3n+2) .cro-concept-server-image{background:url("../img/cro-final-server-arena.png") center/cover no-repeat!important}.cro-concept-server:nth-child(3n+3) .cro-concept-server-image{background:url("../img/cro-final-server-dev.png") center/cover no-repeat!important}.cro-concept-server-image img{display:none!important}
.cro-concept-actions .btn,.cro-concept-actions button{min-height:37px!important;padding:8px 12px!important;font-size:9px!important;font-weight:900!important}.cro-concept-actions .cro-manage-btn{background:linear-gradient(180deg,#31e1ff,#10a9d3)!important;border-color:#68edff!important;color:#00131b!important}.cro-concept-actions .danger{border-color:#b9363c!important;background:linear-gradient(180deg,#481317,#26090c)!important;color:#ffb1b1!important}
.cro-concept-widget{border-radius:7px!important;background:linear-gradient(180deg,rgba(4,17,27,.99),rgba(2,11,18,.995))!important;box-shadow:0 8px 25px rgba(0,0,0,.18)!important}.cro-concept-events>div:hover{background:rgba(32,216,255,.035);transform:translateX(2px)}
.cro-side-panel-overlay{position:fixed;inset:0;z-index:400;background:rgba(0,0,0,.52);backdrop-filter:blur(2px)}.cro-side-panel-overlay[hidden],.cro-side-panel[hidden]{display:none!important}.cro-side-panel{position:fixed;right:0;top:0;bottom:0;z-index:410;width:min(390px,94vw);padding:28px 23px;border-left:1px solid #205d77;background:linear-gradient(180deg,rgba(5,18,27,.995),rgba(2,8,13,.998));box-shadow:-26px 0 70px rgba(0,0,0,.55);animation:croSideIn .22s ease both}@keyframes croSideIn{from{transform:translateX(100%)}to{transform:none}}.cro-side-close{position:absolute;right:15px;top:15px;width:32px;height:32px;padding:0!important;border:1px solid #284b5e!important;border-radius:4px!important;background:#07131c!important;color:#9bb6c5!important;font-size:18px!important}.cro-side-kicker{margin-top:16px;color:#4e98b0;font-size:6.5px;font-weight:900;letter-spacing:.17em}.cro-side-panel h2{font-size:19px;margin:6px 0 20px}.cro-side-profile{display:flex;flex-direction:column;align-items:center;padding:19px;border:1px solid #17465d;border-radius:7px;background:#05131d}.cro-side-profile strong{margin-top:10px;font-size:13px}.cro-side-profile small{margin-top:3px;color:#67889b;font-size:8px}.cro-side-profile i{margin-top:10px;color:#2ee68f;font-style:normal;font-size:6.5px}.cro-side-info{margin-top:13px}.cro-side-info>div{display:flex;justify-content:space-between;padding:11px 3px;border-bottom:1px solid rgba(255,255,255,.05);font-size:8px}.cro-side-info span{color:#668596}.cro-side-logout{display:block;margin-top:17px;text-align:center}
.cro-setting{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:13px;align-items:center;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.05)}.cro-setting>div{display:flex;flex-direction:column}.cro-setting strong{font-size:9px}.cro-setting small{margin-top:4px;color:#638194;font-size:7px}.cro-toggle{position:relative;width:43px;height:23px}.cro-toggle input{position:absolute;opacity:0}.cro-toggle i{position:absolute;inset:0;border:1px solid #284958;border-radius:99px;background:#111f29;transition:.2s}.cro-toggle i::after{content:"";position:absolute;left:3px;top:3px;width:15px;height:15px;border-radius:50%;background:#718996;transition:.2s}.cro-toggle input:checked+i{border-color:#1b9bb7;background:#093540}.cro-toggle input:checked+i::after{left:23px;background:var(--cro-cyan);box-shadow:0 0 8px rgba(32,216,255,.45)}.cro-settings-save{width:100%;margin-top:18px}.cro-settings-status{text-align:center;margin-top:9px;min-height:16px;color:#3add90;font-size:7px}
.cro-final-toast{position:fixed;right:19px;bottom:19px;z-index:500;width:min(405px,calc(100vw - 30px));display:grid;grid-template-columns:42px 1fr 28px;gap:11px;align-items:center;padding:12px;border:1px solid #9f5629;border-radius:7px;background:rgba(8,15,20,.99);box-shadow:0 22px 65px rgba(0,0,0,.58);animation:croToastIn .3s ease both}.cro-final-toast[hidden]{display:none!important}@keyframes croToastIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}.cro-final-toast>div:nth-child(2){display:flex;flex-direction:column}.cro-final-toast strong{font-size:9px;margin:3px 0}.cro-final-toast span{font-size:6.5px;color:#6f8c9d}.cro-final-toast>button{padding:0!important;border:0!important;background:transparent!important;color:#778e9b!important;font-size:20px!important}
body.cro-no-motion *,body.cro-no-motion *::before,body.cro-no-motion *::after{animation:none!important;transition-duration:.01ms!important}body.cro-no-glow .cro-concept-server,body.cro-no-glow .cro-final-brand img,body.cro-no-glow .cro-concept-actions .cro-manage-btn{box-shadow:none!important;filter:none!important}body.cro-no-scan .cro-final-scanline,body.cro-no-scan .cro-final-grid{display:none!important}body.cro-compact-sidebar .cro-final-nav a{min-height:35px!important;padding-top:6px!important;padding-bottom:6px!important}
@media(max-width:1050px){.cro-final-search-wrap{width:360px}.cro-final-profile{min-width:52px;width:52px;padding:0 9px!important}.cro-final-profile-copy,.cro-final-chevron{display:none}.cro-concept-lower{grid-template-columns:1fr 1fr!important}.cro-concept-player-widget{grid-column:1/-1}}
@media(max-width:760px){.cro-final-topbar{padding:0 7px;height:54px}.cro-final-mobile-menu{display:block;width:38px;height:38px;padding:0!important;font-size:18px!important}.cro-final-search-wrap{width:auto;flex:1;height:36px}.cro-final-search-wrap kbd{display:none}.cro-final-icon-btn{width:44px}#cro-ui-mode{display:none}.cro-final-sidebar{transform:translateX(-100%);position:fixed!important;z-index:600!important;transition:transform .2s ease!important}body.cro-mobile-nav-open .cro-final-sidebar{transform:none}.cro-final-scanline{left:0}.cro-final-wrap{padding-left:8px!important;padding-right:8px!important}.cro-concept-hero{min-height:210px!important;padding:16px!important}.cro-concept-hero h1{font-size:30px!important}.cro-final-toolbar{align-items:stretch!important;flex-direction:column!important}.cro-toolbar-title{margin-right:0}.cro-concept-view{margin-left:0!important}.cro-concept-tools{width:100%;flex-wrap:wrap}.cro-add-instance{width:100%;text-align:center}.cro-concept-lower{grid-template-columns:1fr!important}.cro-concept-player-widget{grid-column:auto}.cro-final-popover{position:fixed;top:60px;right:8px;width:min(360px,calc(100vw - 16px))}}


/* =====================================================================
   CRO v16.1 — SIDEBAR TRUE BOTTOM FIX
   Instance pages can have long navigation. The scenery must be the LAST
   sidebar block, not absolute-positioned in the visible viewport.
   ===================================================================== */

.sidebar.cro-final-sidebar{
  display:flex!important;
  flex-direction:column!important;
  height:100vh!important;
  max-height:100vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-bottom:0!important;
  position:sticky!important;
  top:0!important;
}

/* Logo and nav are normal document flow. */
.cro-final-brand,
.cro-final-brand-divider{
  flex:0 0 auto!important;
}
.cro-final-nav{
  flex:0 0 auto!important;
  padding-bottom:18px!important;
}

/*
  If navigation is short, margin-top:auto pushes artwork to viewport bottom.
  If navigation is long, it naturally comes AFTER every menu item and is
  reached by scrolling to the true bottom.
*/
.cro-final-sidebar-bottom{
  position:relative!important;
  flex:0 0 350px!important;
  min-height:350px!important;
  width:100%!important;
  margin-top:auto!important;
  overflow:hidden!important;
  z-index:1!important;
}

/* No more absolute positioning against the whole sidebar. */
.cro-final-sidebar-bottom .cro-final-sidebar-art{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  opacity:.88!important;
  pointer-events:none!important;
  background:
    linear-gradient(180deg,#02070b 0%,rgba(2,7,11,.10) 22%,rgba(2,7,11,.08) 68%,#02070b 100%),
    url("../img/cro-final-sidebar.png") center bottom/cover no-repeat!important;
}

/* Footer branding belongs to the artwork block, never to viewport bottom. */
.cro-final-sidebar-bottom .cro-final-powered{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:18px!important;
  width:100%!important;
  z-index:4!important;
  margin:0!important;
  text-align:center!important;
}

/* Keep nav above artwork in the scroll document. */
.cro-final-nav{
  position:relative!important;
  z-index:5!important;
  background:linear-gradient(180deg,rgba(2,7,11,.05),rgba(2,7,11,.22))!important;
}

/* Cleaner scroll padding: the bottom block supplies its own space now. */
.sidebar.cro-final-sidebar::-webkit-scrollbar{width:6px}
.sidebar.cro-final-sidebar::-webkit-scrollbar-track{background:rgba(2,9,14,.55)}
.sidebar.cro-final-sidebar::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(255,121,26,.48),rgba(32,216,255,.42));
  border-radius:10px;
}

@media(max-width:900px){
  .sidebar.cro-final-sidebar{
    height:100dvh!important;
    max-height:100dvh!important;
    padding-bottom:0!important;
  }
  .cro-final-sidebar-bottom{
    flex-basis:310px!important;
    min-height:310px!important;
  }
}


/* =====================================================================
   CRO v16.2 — CORE STATUS / CLEAN DASHBOARD
   ===================================================================== */

/* CRO CORE replaces the uncertain notification widget. */
.cro-core-status{
  height:100%;
  min-width:154px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 13px;
  border-left:1px solid #17394c;
  border-right:1px solid #17394c;
  background:
    radial-gradient(circle at 24px 50%,rgba(34,216,255,.07),transparent 45px),
    linear-gradient(180deg,rgba(5,18,28,.20),rgba(2,8,13,.04));
}
.cro-core-reactor{
  position:relative;
  width:34px;
  height:34px;
  flex:0 0 34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  border:1px solid rgba(32,216,255,.55);
  box-shadow:
    0 0 0 3px rgba(32,216,255,.03),
    0 0 14px rgba(32,216,255,.13),
    inset 0 0 12px rgba(32,216,255,.08);
}
.cro-core-reactor::before,
.cro-core-reactor::after{
  content:"";
  position:absolute;
  border-radius:50%;
}
.cro-core-reactor::before{
  inset:5px;
  border:1px solid rgba(255,122,26,.80);
  border-left-color:transparent;
  border-bottom-color:transparent;
  animation:croCoreSpin 2.4s linear infinite;
}
.cro-core-reactor::after{
  inset:10px;
  background:radial-gradient(circle,#5beaff 0 30%,#118bb4 31% 58%,transparent 60%);
  box-shadow:0 0 10px rgba(32,216,255,.65);
  animation:croCorePulse 1.6s ease-in-out infinite;
}
.cro-core-reactor span{
  position:absolute;
  inset:-3px;
  border-radius:50%;
  border:1px dashed rgba(255,122,26,.20);
  animation:croCoreSpinReverse 6s linear infinite;
}
.cro-core-reactor i{
  position:absolute;
  width:3px;
  height:3px;
  border-radius:50%;
  background:#ff8731;
  right:0;
  top:8px;
  box-shadow:0 0 7px #ff7a1a;
}
@keyframes croCoreSpin{to{transform:rotate(360deg)}}
@keyframes croCoreSpinReverse{to{transform:rotate(-360deg)}}
@keyframes croCorePulse{
  0%,100%{transform:scale(.88);opacity:.68}
  50%{transform:scale(1.08);opacity:1}
}
.cro-core-copy{
  display:flex;
  flex-direction:column;
  line-height:1.05;
}
.cro-core-copy small{
  font-size:5.5px;
  color:#4f91a8;
  letter-spacing:.18em;
  font-weight:900;
}
.cro-core-copy strong{
  margin:3px 0;
  font-size:8px;
  color:#55e9a3;
  letter-spacing:.07em;
}
.cro-core-copy span{
  font-size:5.5px;
  color:#698697;
  letter-spacing:.08em;
}

/* Dashboard replacement for Add Instance. */
.cro-command-status{
  min-height:35px;
  min-width:175px;
  padding:7px 10px;
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid #285e4a;
  border-radius:4px;
  background:
    linear-gradient(180deg,rgba(22,87,63,.18),rgba(7,28,24,.22));
  box-shadow:inset 0 0 16px rgba(24,230,137,.025);
}
.cro-command-status>i{
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:#17e58a;
  box-shadow:0 0 9px rgba(23,229,138,.75);
  animation:croOperationalPulse 1.75s ease-in-out infinite;
}
@keyframes croOperationalPulse{
  0%,100%{opacity:.55;transform:scale(.85)}
  50%{opacity:1;transform:scale(1)}
}
.cro-command-status>div{
  display:flex;
  flex-direction:column;
}
.cro-command-status small{
  color:#527b6c;
  font-size:5px;
  font-weight:900;
  letter-spacing:.14em;
}
.cro-command-status strong{
  margin-top:2px;
  color:#4ee49c;
  font-size:6.5px;
  letter-spacing:.06em;
}

/* The old ADD INSTANCE visual class is intentionally disabled on dashboard. */
.cro-final-toolbar .cro-add-instance{display:none!important}

@media(max-width:950px){
  .cro-core-status{min-width:50px;width:50px;padding:0 8px}
  .cro-core-copy{display:none}
}
@media(max-width:760px){
  .cro-command-status{width:100%;min-width:0}
}

/* v5.5.0 WEB MAX BOOST */
.actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.actions .btn,.actions button,.right .btn,.right button,.oxide-file-row .btn,.oxide-file-row button{width:auto!important;min-width:0!important;display:inline-flex!important;padding:8px 12px!important;font-size:12px!important;line-height:1.15!important}
.sidebar .nav-title,.sidebar .section-title,.sidebar .nav-section-title{background:linear-gradient(90deg,#ff6a00,#ffd36a,#42d8ff,#9b6cff,#ff6a00);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent!important;animation:croSidebarFire 6s linear infinite;text-shadow:0 0 16px rgba(255,116,36,.18)}
html.cro-fx-off .sidebar .nav-title,html.cro-fx-off .sidebar .section-title,html.cro-fx-off .sidebar .nav-section-title{animation:none!important;background:none!important;color:#8fa4b8!important;text-shadow:none!important}@keyframes croSidebarFire{0%{background-position:0 50%}100%{background-position:300% 50%}}
.fx-settings-btn{border:1px solid rgba(66,216,255,.35);background:rgba(6,22,33,.9);border-radius:999px;padding:8px 10px;color:#7ee8ff;font-size:11px;font-weight:800}.cro-fx-pop{position:fixed;right:18px;top:76px;z-index:9999;width:250px;padding:14px;border:1px solid rgba(66,216,255,.35);background:#06111a;border-radius:14px}.cro-fx-pop label{display:flex;justify-content:space-between;gap:12px;align-items:center}
.reader-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.reader-wide{grid-column:1/-1}.reader-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.reader-stats span{padding:10px;border:1px solid rgba(80,160,200,.2);border-radius:10px}.perm-grid{display:flex;flex-wrap:wrap;gap:8px}.perm-chip,.perm-member{padding:7px 10px;border:1px solid rgba(66,216,255,.25);border-radius:999px;background:rgba(13,43,59,.5);font-size:12px}.reader-output{white-space:pre-wrap;overflow:auto;max-height:420px}
@media(max-width:700px){body{overflow-x:hidden}.main,.content,.page,.page-content{min-width:0!important;max-width:100%!important}.hero,.dashboard-hero,.server-hero{min-height:0!important;height:auto!important}.content{padding-top:12px!important}.card{max-width:100%;overflow:hidden}.card .name,strong,code,.row b{overflow-wrap:anywhere;word-break:break-word}table{display:block;overflow-x:auto;white-space:nowrap}.actions{gap:6px}.actions .btn,.actions button,.right .btn,.right button{padding:7px 9px!important;font-size:11px!important}.reader-grid{grid-template-columns:1fr}.reader-wide{grid-column:auto}.reader-stats{grid-template-columns:1fr}.cro-fx-pop{left:12px;right:12px;top:72px;width:auto}}
@media(prefers-reduced-motion:reduce){.sidebar .nav-title,.sidebar .section-title,.sidebar .nav-section-title{animation:none}}


/* =====================================================================
   CRO v5.5.1 — MOBILE LAYOUT HARD FIX
   v16.1's later sidebar rule forced the hidden mobile sidebar back into
   normal flow as a sticky 100vh element. That created one blank phone
   viewport before the topbar/content. Keep it fixed and out of flow.
   ===================================================================== */
@media (max-width:760px){
  .shell.cro-final-shell,
  .cro-concept-shell.cro-final-shell{
    display:block!important;
    min-height:100dvh!important;
  }

  .sidebar.cro-final-sidebar{
    position:fixed!important;
    left:0!important;
    top:0!important;
    bottom:0!important;
    width:min(86vw,310px)!important;
    height:100dvh!important;
    max-height:100dvh!important;
    transform:translateX(-105%)!important;
    z-index:600!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    margin:0!important;
  }
  body.cro-mobile-nav-open .sidebar.cro-final-sidebar{
    transform:translateX(0)!important;
  }

  .main.cro-final-main{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
  }

  .cro-final-topbar{
    position:sticky!important;
    top:0!important;
    width:100%!important;
    margin:0!important;
  }

  .wrap.cro-final-wrap{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:12px 8px 28px!important;
    overflow:visible!important;
  }

  /* Tables / modules such as Maps: true touch horizontal scrolling. */
  .table-wrap,
  .card:has(> table),
  .card:has(> .table-wrap){
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x pan-y!important;
  }
  table{
    width:max-content!important;
    min-width:680px!important;
    max-width:none!important;
    display:table!important;
  }
  th,td{white-space:nowrap!important}
  td.actions,.right.actions{min-width:220px!important}

  /* Avoid cards clipping child controls on small screens. */
  .card{
    min-width:0!important;
  }
  .card:not(:has(> table)):not(:has(> .table-wrap)){
    overflow-wrap:anywhere!important;
  }

  .migration-row,.oxide-file-row,.owner-row{
    min-width:0!important;
  }
  .migration-row strong,.oxide-file-row code{
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }

  .reader-load-form{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  .detected-groups{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:7px!important;
  }
}
.detected-groups{display:flex;flex-wrap:wrap;gap:8px}
.detected-group{
  display:inline-flex;align-items:center;min-height:30px;padding:6px 10px;
  border:1px solid rgba(32,216,255,.28);border-radius:999px;
  background:rgba(8,31,43,.72);color:#9edff0;text-decoration:none;
  font-size:11px;font-weight:850;letter-spacing:.03em
}
.detected-group:hover,.detected-group.active{
  border-color:rgba(255,122,26,.72);color:#ffd0a8;
  box-shadow:0 0 16px rgba(255,122,26,.12)
}
.reader-load-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}

/* v5.6.0 Multi-user Access Control */
.cro-server-access-dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex:0 0 auto;background:#53616b}
.cro-server-access-dot.online{background:#50e69a;box-shadow:0 0 10px rgba(80,230,154,.45)}
.cro-server-access-dot.offline{background:#e06a6a}.cro-quick-server{gap:10px!important}.cro-nav-empty{padding:8px 13px 12px;color:#678092;font-size:11px}
.users-summary{display:grid;grid-template-columns:repeat(2,minmax(0,220px));gap:12px;margin-bottom:14px}.cro-user-card{display:grid;gap:14px}
.access-box{padding:12px;border:1px solid rgba(54,177,219,.18);border-radius:12px;background:rgba(2,15,23,.55)}
.access-box>strong{display:block;margin-bottom:3px;font-size:12px;letter-spacing:.08em}.access-box>small{display:block;color:#728b9d;margin-bottom:10px}
.access-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:7px}
.access-check{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid rgba(54,177,219,.15);border-radius:9px;background:rgba(5,24,34,.6);cursor:pointer;min-width:0}
.access-check input{width:auto!important;margin:0!important}.access-check span{overflow-wrap:anywhere}.create-user-card{margin-bottom:18px}
@media(max-width:700px){.users-summary{grid-template-columns:1fr 1fr}.access-grid{grid-template-columns:1fr}.cro-user-card .form-grid,.create-user-card .form-grid{grid-template-columns:1fr!important}}

/* v5.7.0 Oxide Pro Suite */
.plugin-state-filter{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.plugin-state-filter button{display:inline-flex;gap:8px;align-items:center;width:auto!important;padding:8px 13px!important}
.plugin-state-filter button b{display:inline-grid;place-items:center;min-width:22px;height:20px;padding:0 6px;border-radius:999px;background:rgba(100,190,220,.12)}
.plugin-state-filter button.active{border-color:rgba(255,122,26,.65);box-shadow:0 0 18px rgba(255,122,26,.1)}
.cro-plugin-filter-item[hidden]{display:none!important}
.permission-db-groups .detected-group{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.permission-db-groups .detected-group b{font-size:9px;color:#6f93a6}
.permission-db-head{display:grid;grid-template-columns:1.5fr 1fr;gap:14px}
.oxide-danger-card{border-color:rgba(220,70,70,.3)!important;background:linear-gradient(180deg,rgba(55,8,12,.23),rgba(4,16,23,.75))!important}
.updater-history-row{align-items:center}
@media(max-width:700px){
 .permission-db-head{grid-template-columns:1fr}
 .plugin-state-filter{position:sticky;top:64px;z-index:20;padding:7px;background:rgba(1,10,15,.9);backdrop-filter:blur(10px);border-radius:11px}
}


/* =====================================================================
   CRO v5.8.0 — Desktop readability + FX consistency
   ===================================================================== */
.cro-concept-metrics .metric .s,
.metric .s{
  font-size:10px!important;
  line-height:1.35!important;
  color:#8eacbd!important;
  font-weight:650!important;
}
.cro-concept-server-info>div{
  font-size:10.5px!important;
  line-height:1.45!important;
}
.cro-concept-server-info strong{
  font-size:11.5px!important;
  font-weight:800!important;
  color:#d4e7f0!important;
}
.cro-concept-server-bars span{font-size:9.5px!important}
.cro-concept-server-bars strong{font-size:11.5px!important}
.cro-concept-server-title>i[data-live-dot]{width:9px!important;height:9px!important;flex:0 0 9px!important}
.cro-concept-status>i{display:none!important}

.plugin-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.plugin-title-row .name{margin:0!important;min-width:0;overflow-wrap:anywhere}
.plugin-title-meta{margin-left:auto;display:flex;gap:6px;align-items:center;flex:0 0 auto}
.json-editor-text{width:100%!important;min-height:520px!important;resize:vertical!important;font:12px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace!important;white-space:pre!important;overflow:auto!important}
.cro-json-editor{scroll-margin-top:90px}
.plugin-master-tabs{position:sticky;top:58px;z-index:30;background:rgba(1,10,15,.92);padding:8px;border:1px solid rgba(42,165,205,.12);border-radius:10px;backdrop-filter:blur(12px)}

.cro-users-section-head{padding:12px 15px!important;border:1px solid rgba(42,165,205,.22);border-radius:11px;background:linear-gradient(90deg,rgba(9,42,58,.68),rgba(3,18,27,.38));margin-top:22px!important}
.cro-users-section-head>div{display:flex;flex-direction:column;gap:3px}
.cro-users-section-head h2{margin:0!important}
.cro-users-section-head b{font-size:10px;color:#5be8ff;letter-spacing:.08em}
.cro-user-card>.name{padding-bottom:10px;border-bottom:1px solid rgba(51,168,204,.12)}

.upload-progress{height:34px;position:relative;border:1px solid rgba(40,190,225,.25);border-radius:9px;overflow:hidden;margin-top:10px;background:#03111a}
.upload-progress i{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#0f8fb8,#33e0ff);transition:width .12s linear}
.upload-progress span{position:relative;z-index:1;display:grid;place-items:center;height:100%;font-size:10px;font-weight:850;letter-spacing:.06em;color:#d9f8ff}

/* Force the premium nav/core animation consistently on desktop too.
   Panel Settings -> Cinematic Motion still disables it. */
body:not(.cro-no-motion):not(.cro-fx-off) .cro-final-nav .nav-title{
  background:linear-gradient(90deg,#ff6a00,#ffd36a,#42d8ff,#9b6cff,#ff6a00)!important;
  background-size:300% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  color:transparent!important;
  animation:croSidebarFire 6s linear infinite!important;
  text-shadow:0 0 14px rgba(255,116,36,.16)!important;
}
body.cro-no-motion .cro-final-nav .nav-title,
html.cro-fx-off .cro-final-nav .nav-title{
  animation:none!important;background:none!important;color:#8fa4b8!important;text-shadow:none!important;
}
body:not(.cro-no-motion) .cro-core-reactor::before{animation:croCoreSpin 2.4s linear infinite!important}
body:not(.cro-no-motion) .cro-core-reactor::after{animation:croCorePulse 1.6s ease-in-out infinite!important}
body:not(.cro-no-motion) .cro-core-reactor span{animation:croCoreSpinReverse 6s linear infinite!important}
body.cro-no-motion .cro-core-reactor::before,
body.cro-no-motion .cro-core-reactor::after,
body.cro-no-motion .cro-core-reactor span{animation:none!important}

@media(max-width:700px){
  .json-editor-text{min-height:420px!important;font-size:11px!important}
  .plugin-title-row{align-items:flex-start}
  .plugin-title-meta{flex-wrap:wrap;justify-content:flex-end}
  .cro-concept-server-info>div{font-size:11px!important}
  .cro-concept-server-info strong{font-size:12px!important}
}

/* v5.8.1 — authoritative CRO Fire/Reactor FX on desktop + mobile */
body:not(.cro-no-fx) .cro-final-nav .nav-title{
  background:linear-gradient(90deg,#ff4d00 0%,#ff8a00 14%,#ffd24a 29%,#fff0a0 42%,#ff6a00 55%,#32ddff 72%,#a95cff 86%,#ff4d00 100%)!important;
  background-size:420% 100%!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  color:transparent!important;
  animation:croSidebarFirePro 4.2s linear infinite!important;
  text-shadow:none!important;
  filter:drop-shadow(0 0 4px rgba(255,112,20,.25))!important;
}
@keyframes croSidebarFirePro{
  from{background-position:0% 50%}
  to{background-position:420% 50%}
}
body.cro-no-fx .cro-final-nav .nav-title{
  background:none!important;-webkit-text-fill-color:initial!important;color:#8fa4b8!important;
  animation:none!important;filter:none!important;text-shadow:none!important
}
body:not(.cro-no-fx) .cro-core-reactor::before{animation:croCoreSpin 2.1s linear infinite!important}
body:not(.cro-no-fx) .cro-core-reactor::after{animation:croCorePulse 1.35s ease-in-out infinite!important}
body:not(.cro-no-fx) .cro-core-reactor span{animation:croCoreSpinReverse 5.2s linear infinite!important}
body:not(.cro-no-fx) .cro-core-reactor i{animation:croCoreDotPulse .9s ease-in-out infinite alternate!important}
@keyframes croCoreDotPulse{from{opacity:.55;box-shadow:0 0 4px #ff7a1a}to{opacity:1;box-shadow:0 0 14px #ffb451}}
body.cro-no-fx .cro-core-reactor::before,
body.cro-no-fx .cro-core-reactor::after,
body.cro-no-fx .cro-core-reactor span,
body.cro-no-fx .cro-core-reactor i{animation:none!important}

/* v5.8.2 Plugin Workspace */
.plugin-master-tabs a{
  display:inline-flex;align-items:center;gap:8px;width:auto!important;padding:8px 13px!important;
  border:1px solid rgba(50,170,210,.15);border-radius:8px;text-decoration:none;color:#8eb0c2;background:rgba(4,20,29,.65)
}
.plugin-master-tabs a b{display:inline-grid;place-items:center;min-width:22px;height:20px;padding:0 6px;border-radius:999px;background:rgba(100,190,220,.12)}
.plugin-master-tabs a.active{color:#fff;border-color:rgba(255,122,26,.62);background:rgba(255,122,26,.08);box-shadow:0 0 18px rgba(255,122,26,.08)}
.plugin-welcome-hero{display:grid;grid-template-columns:1.35fr 1fr;gap:14px;padding:20px;border:1px solid rgba(36,174,216,.2);border-radius:14px;background:linear-gradient(135deg,rgba(5,31,44,.92),rgba(5,17,25,.7))}
.plugin-welcome-hero small{color:#ff9a40;letter-spacing:.18em;font-weight:900;font-size:9px}
.plugin-welcome-hero h2{margin:7px 0 8px;font-size:24px}
.plugin-welcome-hero p{margin:0;color:#7f9baa;line-height:1.55}
.plugin-welcome-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.plugin-welcome-stats span{display:flex;flex-direction:column;padding:12px;border:1px solid rgba(41,164,202,.15);border-radius:10px;background:rgba(2,16,24,.6);color:#7390a1;font-size:10px}
.plugin-welcome-stats b{font-size:21px;color:#dff8ff}
.plugin-welcome-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
.plugin-welcome-grid a{display:flex;flex-direction:column;gap:5px;padding:16px;border:1px solid rgba(36,174,216,.17);border-radius:12px;background:rgba(4,20,29,.62);text-decoration:none}
.plugin-welcome-grid a:hover{border-color:rgba(255,122,26,.45);transform:translateY(-1px)}
.plugin-welcome-grid strong{color:#dff8ff;font-size:13px}.plugin-welcome-grid span{color:#7895a6;font-size:11px;line-height:1.45}
.plugin-data-group{border:1px solid rgba(41,164,202,.14);border-radius:10px;background:rgba(3,18,27,.48);margin:8px 0;overflow:hidden}
.plugin-data-group summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 13px;cursor:pointer;list-style:none}
.plugin-data-group summary::-webkit-details-marker{display:none}
.plugin-data-group summary span{font-weight:850;color:#d7eff9;overflow-wrap:anywhere}
.plugin-data-group summary b{font-size:9px;letter-spacing:.08em;color:#5ccfea;white-space:nowrap}
.plugin-data-group[open] summary{border-bottom:1px solid rgba(41,164,202,.12);background:rgba(7,34,47,.55)}
.plugin-data-group-body{padding:8px}
.cro-editor-only{max-width:1180px;margin:0 auto}
.cro-editor-only .json-editor-text{min-height:62vh!important}
@media(max-width:700px){
  .plugin-welcome-hero{grid-template-columns:1fr}.plugin-welcome-grid{grid-template-columns:1fr}
  .plugin-master-tabs{display:flex;overflow-x:auto;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch}
  .plugin-master-tabs a{white-space:nowrap;flex:0 0 auto}
}

/* v5.8.3 — visible Fire FX and larger My Profile */
body:not(.cro-no-fx) .sidebar.cro-final-sidebar .cro-final-nav .nav-title{
  position:relative!important;
  display:block!important;
  padding-left:13px!important;
  overflow:visible!important;
  background:linear-gradient(90deg,#ff3d00,#ff9a00,#ffe66a,#ff5a00,#33e3ff,#bb5cff,#ff3d00)!important;
  background-size:500% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
  animation:croNavInferno 3.5s linear infinite!important;
  filter:drop-shadow(0 0 5px rgba(255,98,0,.32))!important;
}
body:not(.cro-no-fx) .sidebar.cro-final-sidebar .cro-final-nav .nav-title::before{
  content:""!important;position:absolute!important;left:1px!important;top:3px!important;bottom:3px!important;width:3px!important;border-radius:99px!important;
  background:linear-gradient(180deg,#fff6a0,#ff8a00,#ff3d00,#34dcff)!important;
  box-shadow:0 0 9px #ff6a00,0 0 16px rgba(255,90,0,.45)!important;
  animation:croNavFlameBar 1s ease-in-out infinite alternate!important;
}
@keyframes croNavInferno{to{background-position:500% 50%}}
@keyframes croNavFlameBar{from{transform:scaleY(.55);opacity:.55}to{transform:scaleY(1.12);opacity:1}}
body.cro-no-fx .sidebar.cro-final-sidebar .cro-final-nav .nav-title::before{display:none!important}

#cro-profile-panel{width:min(92vw,460px)!important}
#cro-profile-panel>h2{font-size:30px!important;letter-spacing:.06em!important}
#cro-profile-panel .cro-side-kicker{font-size:12px!important}
.cro-profile-hero .cro-final-avatar.xlarge{width:108px!important;height:108px!important;font-size:30px!important;background-size:cover!important;background-position:center!important}
.cro-profile-hero>strong{font-size:25px!important}
.cro-profile-hero>small{font-size:14px!important}
.cro-profile-hero>i{font-size:11px!important}
.cro-side-info>div span{font-size:12px!important}
.cro-side-info>div strong{font-size:14px!important}
.cro-profile-actions{display:grid;gap:12px;margin:16px 0}
.cro-profile-edit-form{padding:13px;border:1px solid rgba(41,171,211,.18);border-radius:11px;background:rgba(3,19,28,.65)}
.cro-profile-edit-form label{display:grid;gap:6px;margin:7px 0;font-size:11px;color:#8cabbb}
.cro-profile-edit-form input{width:100%}
.cro-final-avatar.has-image{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;color:transparent!important}
.permission-add-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:10px 0 14px}
.perm-action-chip{margin:0!important}
.perm-action-chip button{display:inline-flex!important;align-items:center!important;gap:8px!important;width:auto!important;padding:7px 10px!important;border-radius:999px!important;border:1px solid rgba(39,190,224,.23)!important;background:rgba(5,29,40,.72)!important}
.perm-action-chip button span{color:#bcefff;font-size:11px}
.perm-action-chip button b{color:#ff7777;font-size:8px;letter-spacing:.08em}
.perm-action-chip button:hover{border-color:rgba(255,80,80,.55)!important;background:rgba(70,12,17,.48)!important}
@media(max-width:700px){.permission-add-form{grid-template-columns:1fr}}

/* v5.8.5 — CRO CLASSIC ORANGE / GOLD NAV FX
   Replaces the v5.8.4 per-letter Prism Fire renderer completely. */
body:not(.cro-no-fx) .sidebar.cro-final-sidebar .cro-final-nav .nav-title.cro-orange-nav-title{
  position:relative!important;display:block!important;
  margin:17px 14px 8px!important;padding:3px 0 4px 0!important;
  font-size:9px!important;font-weight:950!important;letter-spacing:.18em!important;
  line-height:1.15!important;white-space:nowrap!important;
  background:linear-gradient(90deg,#ff6a00 0%,#ff9d18 24%,#ffd36a 50%,#ff9d18 76%,#ff6a00 100%)!important;
  background-size:240% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
  text-shadow:none!important;filter:drop-shadow(0 0 5px rgba(255,126,24,.24))!important;
  animation:croClassicOrangeSweep 4.8s linear infinite!important;
}
body:not(.cro-no-fx) .sidebar.cro-final-sidebar .cro-final-nav .nav-title.cro-orange-nav-title::before{display:none!important;content:none!important}
body.cro-no-fx .sidebar.cro-final-sidebar .cro-final-nav .nav-title.cro-orange-nav-title{
  background:none!important;-webkit-text-fill-color:#8fa4b8!important;color:#8fa4b8!important;
  text-shadow:none!important;filter:none!important;animation:none!important;
}
@keyframes croClassicOrangeSweep{0%{background-position:0% 50%}100%{background-position:240% 50%}}
@media(prefers-reduced-motion:reduce){body:not(.cro-no-fx) .sidebar.cro-final-sidebar .cro-final-nav .nav-title.cro-orange-nav-title{animation:none!important}}

/* v5.8.6 — Permission Hub visual workspace
   Brings Permission Reader HOME/GROUPS/USERS to the same premium workspace language as Plugins. */
.permission-hub-tabs{position:sticky;top:58px;z-index:30;display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:rgba(1,10,15,.92);padding:8px;border:1px solid rgba(42,165,205,.12);border-radius:10px;backdrop-filter:blur(12px);margin-bottom:14px}
.permission-hub-tabs a{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid rgba(50,170,210,.15);border-radius:8px;text-decoration:none;color:#8eb0c2;background:rgba(4,20,29,.65);font-size:11px;font-weight:800;letter-spacing:.04em}
.permission-hub-tabs a b{display:inline-grid;place-items:center;min-width:22px;height:20px;padding:0 6px;border-radius:999px;background:rgba(100,190,220,.12);color:#a9d8e9}
.permission-hub-tabs a.active{color:#fff;border-color:rgba(255,122,26,.62);background:rgba(255,122,26,.08);box-shadow:0 0 18px rgba(255,122,26,.08)}
.permission-home-hero{display:grid;grid-template-columns:1.35fr 1fr;gap:14px;padding:20px;border:1px solid rgba(36,174,216,.2);border-radius:14px;background:linear-gradient(135deg,rgba(5,31,44,.92),rgba(5,17,25,.7))}
.permission-home-hero small{color:#ff9a40;letter-spacing:.18em;font-weight:900;font-size:9px}
.permission-home-hero h2{margin:7px 0 8px;font-size:24px;color:#dff8ff}
.permission-home-hero p{margin:0;color:#7f9baa;line-height:1.55;max-width:760px}
.permission-home-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.permission-home-stats span{display:flex;flex-direction:column;padding:12px;border:1px solid rgba(41,164,202,.15);border-radius:10px;background:rgba(2,16,24,.6);color:#7390a1;font-size:10px}
.permission-home-stats b{font-size:21px;color:#dff8ff}
.permission-home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
.permission-home-grid a{display:flex;flex-direction:column;gap:5px;padding:16px;border:1px solid rgba(36,174,216,.17);border-radius:12px;background:rgba(4,20,29,.62);text-decoration:none;transition:.16s ease}
.permission-home-grid a:hover{border-color:rgba(255,122,26,.45);transform:translateY(-1px)}
.permission-home-grid strong{color:#dff8ff;font-size:13px}.permission-home-grid span{color:#7895a6;font-size:11px;line-height:1.45}
.permission-browser{display:grid;grid-template-columns:minmax(260px,330px) minmax(0,1fr);gap:14px;align-items:start}
.permission-browser-list{border:1px solid rgba(36,174,216,.18);border-radius:12px;background:rgba(3,18,27,.62);padding:8px;max-height:68vh;overflow:auto;position:sticky;top:120px}
.permission-browser-title{padding:9px 10px 11px;color:#ff9a40;font-size:9px;font-weight:950;letter-spacing:.14em;border-bottom:1px solid rgba(36,174,216,.12);margin-bottom:6px}
.permission-list-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;align-items:center;padding:10px;border:1px solid transparent;border-radius:8px;text-decoration:none;margin:3px 0;background:rgba(2,14,21,.28)}
.permission-list-row span{grid-row:1 / span 2;color:#cfeaf4;font-weight:800;font-size:11px;overflow-wrap:anywhere}.permission-list-row b,.permission-list-row em{font-size:8px;letter-spacing:.06em;text-align:right;font-style:normal;color:#5ccfea}.permission-list-row em{color:#7797a8}
.permission-list-row:hover{background:rgba(8,39,52,.65);border-color:rgba(47,178,214,.18)}.permission-list-row.active{background:rgba(255,122,26,.08);border-color:rgba(255,122,26,.48);box-shadow:inset 3px 0 #ff7a1a}
.permission-detail-card{margin:0!important;padding:18px!important;min-width:0}.permission-detail-card>.name{font-size:20px;color:#e5f8ff;margin-bottom:8px;overflow-wrap:anywhere}
.permission-detail-card .section-head{display:flex;justify-content:space-between;gap:10px;align-items:end;margin:18px 0 9px;padding-bottom:8px;border-bottom:1px solid rgba(41,164,202,.13)}
.permission-detail-card .section-head h2{margin:0;font-size:11px;letter-spacing:.08em;color:#dff8ff}.permission-detail-card .section-head span{font-size:9px;color:#6f8c9d;text-align:right}
.permission-detail-card .perm-grid{display:flex;flex-wrap:wrap;gap:7px;min-width:0}
.perm-member,.perm-chip{display:inline-flex;align-items:center;min-height:30px;padding:7px 10px;border:1px solid rgba(39,190,224,.2);border-radius:8px;background:rgba(5,29,40,.66);color:#bcefff;text-decoration:none;font:700 10px/1.25 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere;max-width:100%}
a.perm-member:hover{border-color:rgba(255,122,26,.5);color:#fff;background:rgba(255,122,26,.08)}.perm-chip.effective{border-color:rgba(86,216,154,.24);color:#bdf8d9}
.reader-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}.reader-stats span{display:flex;flex-direction:column;gap:4px;padding:10px;border:1px solid rgba(41,164,202,.14);border-radius:9px;background:rgba(2,16,24,.52);color:#7895a6;font-size:9px}.reader-stats b{font-size:17px;color:#dff8ff}
@media(max-width:900px){.permission-browser{grid-template-columns:1fr}.permission-browser-list{position:static;max-height:340px}.permission-home-hero{grid-template-columns:1fr}}
@media(max-width:700px){.permission-hub-tabs{display:flex;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}.permission-hub-tabs a{white-space:nowrap;flex:0 0 auto}.permission-home-grid{grid-template-columns:1fr}.permission-home-stats{grid-template-columns:1fr 1fr}.reader-stats{grid-template-columns:1fr}.permission-detail-card .section-head{align-items:flex-start;flex-direction:column}.permission-detail-card .section-head span{text-align:left}}

/* CRO v5.9.0 — Owner names, Permission user identities, recycle bin, Maintenance */
.owner-row strong{font-size:15px;letter-spacing:.02em;color:#e9f7ff}
.owner-row span{font-size:14px!important;font-weight:800!important;color:#f3b35d!important;line-height:1.35}
.permission-user-row>span{display:flex!important;flex-direction:column!important;gap:4px!important;min-width:0}
.permission-user-row>span strong{font-size:13px;color:#e8f7ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.permission-user-row>span small{font-size:13px!important;font-weight:800;color:#f3b35d!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.permission-user-identity{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding-bottom:12px;border-bottom:1px solid rgba(77,180,220,.16)}
.permission-user-identity .name{font-size:24px!important;color:#f2b35c!important;letter-spacing:.02em}
.permission-user-identity code{font-size:13px;color:#a9c7d6;background:rgba(2,14,21,.62);border:1px solid rgba(75,181,221,.16);padding:7px 9px;border-radius:8px}
.perm-person{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:3px!important}
.perm-person strong{font-size:13px}.perm-person span{font-size:12px;color:#f3b35d;font-weight:800}
.perm-action-chip.deleted button{border-color:rgba(48,210,151,.34)!important;background:rgba(24,126,92,.08)!important}.perm-action-chip.deleted button b{color:#58e5ae!important}
.maintenance-hero{display:flex;justify-content:space-between;gap:28px;align-items:center;padding:24px;border:1px solid rgba(45,184,224,.26);border-radius:16px;background:linear-gradient(135deg,rgba(4,36,48,.74),rgba(1,15,23,.72));margin-bottom:14px}
.maintenance-hero small{color:#ff982f;font-weight:900;letter-spacing:.14em}.maintenance-hero h2{margin:7px 0 6px;font-size:27px}.maintenance-hero p{margin:0;color:#82a5b6;max-width:760px}
.maintenance-stats{display:grid;grid-template-columns:repeat(3,minmax(105px,1fr));gap:8px;min-width:390px}.maintenance-stats span{padding:12px;border:1px solid rgba(68,181,220,.17);border-radius:11px;background:rgba(2,18,27,.66);font-size:11px;color:#7295a6}.maintenance-stats b{display:block;font-size:15px;color:#dff7ff;margin-bottom:2px}
.maintenance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}.maintenance-grid .card{margin:0}.maintenance-grid .name{font-size:14px;margin-bottom:8px}.maintenance-grid p{color:#7f9eae;line-height:1.55}.maintenance-grid form{display:flex;gap:8px;flex-wrap:wrap}.maintenance-grid input{min-width:210px;flex:1}
.maintenance-entry{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid rgba(66,177,218,.12)}.maintenance-entry:last-child{border-bottom:0}.maintenance-entry>div{display:flex;flex-direction:column;gap:4px}.maintenance-entry strong{font-size:13px}.maintenance-entry span{font-size:13px;font-weight:800;color:#f3b35d}
@media(max-width:900px){.maintenance-hero{align-items:stretch;flex-direction:column}.maintenance-stats{min-width:0;width:100%}.maintenance-grid{grid-template-columns:1fr}.permission-user-identity{align-items:flex-start;flex-direction:column}}


/* v5.9.12: lifecycle confirmation shares the command processing dialog. */
.cro-confirm-actions{display:none;position:relative;z-index:2;gap:14px;margin-top:26px}
.cro-process-modal.confirming .cro-confirm-actions{display:flex}
.cro-process-modal.confirming .cro-process-spinner,.cro-process-modal.confirming .cro-process-track{display:none}
.cro-process-modal.confirming .cro-process-icon:before{content:"?";font:800 46px/1 system-ui;color:#3dd9ff;text-shadow:0 0 22px #3dd9ff55}
.cro-confirm-actions button{flex:1;min-height:48px;font-weight:800;letter-spacing:.12em;border-radius:7px}
#cro-confirm-yes{background:linear-gradient(180deg,#175e3e,#103c2c);border:1px solid #43df93;color:#baffd9}
#cro-confirm-no{background:linear-gradient(180deg,#642735,#3b1722);border:1px solid #ff657a;color:#ffd1d8}
.cro-confirm-actions button:focus-visible{outline:3px solid #e4f7ff;outline-offset:4px}
.cro-process-message{overflow-wrap:anywhere}

.permission-membership-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid #29435a;border-radius:7px;min-width:0}
.permission-membership-row a{overflow-wrap:anywhere;min-width:0}
.permission-membership-row form{margin:0;flex-shrink:0}
.permission-membership-row button{min-height:40px}
.permission-user-search{padding:12px;display:grid;gap:8px}
.permission-user-search input{width:100%;min-width:0;box-sizing:border-box}
.permission-user-search small{color:#8aa7bb}
.permission-user-row[hidden],#permission-user-empty[hidden]{display:none!important}

/* Instance Management workspace — uses the same module catalog as the sidebar. */
.im-hub{margin:30px 0;min-width:0}.im-hub-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.im-eyebrow{font:700 10px/1.4 ui-monospace,monospace;letter-spacing:.2em;color:#f49a50}.im-hub-head h2{font-size:24px;letter-spacing:.045em;color:#eef6ff;margin:8px 0}.im-hub-head p{margin:0;color:#8da0b4;font-size:13px}.im-hub-badge{border:1px solid #354352;border-radius:30px;padding:10px 14px;color:#b0bfce;font:600 10px/1.4 ui-monospace,monospace;white-space:nowrap}.im-hub-badge i{color:#ee9550;padding:0 7px;font-style:normal}
.im-section{--im-accent:#f7a15c;--im-glow:#f7a15c12;margin:0 0 20px;border:1px solid #263340;border-radius:12px;background:linear-gradient(115deg,var(--im-glow),transparent 55%),#0a121c;overflow:hidden}.im-oxide{--im-accent:#67d2c5;--im-glow:#67d2c510}.im-admin{--im-accent:#b6a0fa;--im-glow:#b6a0fa10}.im-system{--im-accent:#75b8ee;--im-glow:#75b8ee10}.im-section-head{display:flex;align-items:center;gap:14px;padding:22px 24px;border-bottom:1px solid #ffffff09}.im-index{color:var(--im-accent);font:600 21px/1 ui-monospace,monospace;opacity:.8}.im-section-head h3{color:var(--im-accent);font:750 12px/1.4 system-ui;letter-spacing:.14em;margin:0 0 5px}.im-section-head p{margin:0;color:#8798aa;font-size:12px}.im-count{margin-left:auto;color:#778ba0;font:600 9px/1.4 ui-monospace,monospace;letter-spacing:.06em;white-space:nowrap}.im-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:18px}.im-module{display:flex;align-items:flex-start;gap:13px;padding:20px 16px;min-width:0;min-height:108px;border:1px solid #293542;border-radius:8px;background:#101b28;text-decoration:none!important;color:#e8f0f8;transition:background .18s,border-color .18s,transform .18s;box-sizing:border-box}.im-module:hover{background:#162536;border-color:var(--im-accent);transform:translateY(-2px)}.im-module:focus-visible{outline:2px solid var(--im-accent);outline-offset:3px}.im-icon{display:flex;align-items:center;justify-content:center;flex:0 0 35px;height:35px;border:1px solid #ffffff16;border-radius:8px;background:var(--im-glow);color:var(--im-accent);font:700 11px/1 ui-monospace,monospace}.im-copy{display:flex;flex-direction:column;gap:7px;min-width:0}.im-copy strong{font-size:13px;line-height:1.4;color:#e7f0f9}.im-copy>span{font-size:12px;line-height:1.6;color:#8fa2b5;overflow-wrap:anywhere}.im-arrow{color:var(--im-accent);margin-left:auto;opacity:.65;font-size:16px}.im-module[aria-current=page]{border-color:#69503a}
@media(max-width:1150px){.im-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.im-hub-head{align-items:flex-start;flex-direction:column;gap:12px}.im-hub-head h2{font-size:20px}.im-section-head{padding:18px 14px;gap:10px}.im-section-head p{font-size:11px}.im-count{font-size:8px}.im-grid{grid-template-columns:1fr;padding:12px;gap:10px}.im-module{min-height:88px;padding:16px}.im-index{font-size:17px}}
@media(prefers-reduced-motion:reduce){.im-module{transition:none}.im-module:hover{transform:none}}

.hosting-test-banner{display:flex;flex-direction:column;gap:8px;padding:20px;border:1px solid #a57532;border-radius:9px;background:#322619;margin-bottom:20px;color:#ffcb80}.hosting-test-banner span{font-size:13px;color:#c7bba5}.hosting-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.hosting-stats strong{display:block;margin-top:8px;font-size:22px}.hosting-stats small{color:#839bb1}.hosting-create{display:flex;flex-wrap:wrap;align-items:end;gap:16px;margin-bottom:20px}.hosting-create label{flex:1;min-width:160px}.hosting-create button{min-height:44px}.hosting-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid #ffffff12}.hosting-item>div:first-child{display:flex;flex-direction:column;gap:8px;min-width:0}.hosting-item code{overflow-wrap:anywhere;font-size:11px}.hosting-type{font:600 10px ui-monospace,monospace;color:#70c9bd}.hosting-item .actions{flex-shrink:0}.hosting-item form{margin:0}
@media(max-width:700px){.hosting-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.hosting-item{align-items:flex-start;flex-direction:column}}

/* CRO hosting workspace: separate web and database views. */
.host3{max-width:1280px;margin:auto}.host3-head{padding:24px 4px 30px}.host3-head>span{font-size:11px;font-weight:800;letter-spacing:2px;color:#f2a260}.host3-head h2{font-size:clamp(26px,4vw,40px);letter-spacing:-1px;margin:12px 0}.host3-head p{color:#91a7b9;margin:0}.host3-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:22px}.host3-stats>div{padding:22px;border:1px solid #293a48;background:#0e1925;border-radius:12px;min-width:0}.host3-stats small{font-size:10px;letter-spacing:1.1px;color:#95aabd}.host3-stats b{display:block;font-size:23px;margin-top:6px;overflow-wrap:anywhere}.host3 .card{margin-bottom:18px;padding:24px}.host3 h2{font-weight:800}.host3-form{display:flex;flex-wrap:wrap;align-items:end;gap:14px}.host3-form label{flex:1;min-width:180px}.host3 label{display:block;font-size:11px;letter-spacing:.6px;color:#a5b7c7}.host3 label input,.host3 label select{margin:8px 0 14px;width:100%}.host3-form>button{margin-bottom:14px}.host3-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.host3-two p,.host3 p{color:#99adbe;font-size:13px;line-height:1.7}.host3-note{padding:18px 22px;border:1px solid #725132;background:#291e14;border-radius:12px;margin-bottom:28px}.host3-note strong{color:#f4bd85}.host3-note p{margin:6px 0 0}.host3-domain{padding:24px;margin:14px 0;background:#0e1925;border:1px solid #2b3d4c;border-radius:12px}.host3-domain-top{display:flex;justify-content:space-between;gap:16px;align-items:center}.host3-domain small{font-size:10px;letter-spacing:1.5px;color:#84a6be}.host3-domain h3{font-size:21px;margin:5px 0 14px;overflow-wrap:anywhere}.host3-domain code,.host3-help code{display:inline-block;overflow-wrap:anywhere;max-width:100%;color:#aabdd0;font-size:12px}.host3-badge{padding:5px 9px;border-radius:6px;font-size:10px;letter-spacing:.6px}.host3-badge.on{background:#133b30;color:#89dbb4}.host3-badge.off{background:#3a2527;color:#eaa7a7}.host3-actions{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin-top:22px}.host3-actions form{margin:0}.host3-actions button,.host3-actions .btn{font-size:10px}.host3-help{font-size:12px!important}.host3-table{overflow:auto}.host3-table table{width:100%}.host3 .host3-crumb{overflow-wrap:anywhere;font-size:14px;margin:14px 0 22px}@media(max-width:700px){.host3-two{grid-template-columns:1fr}.host3-stats{grid-template-columns:1fr}.host3-stats>div{padding:14px 20px}.host3-stats b{font-size:20px}.host3 .card,.host3-domain{padding:18px}.host3-domain-top{align-items:start}.host3-form{display:block}.host3-form label{min-width:0}.host3 .section-head{flex-wrap:wrap}}

.host4-remove{margin-top:18px;padding-top:16px;border-top:1px solid #30404b}.host4-remove summary{color:#e7a39e;font-size:11px;cursor:pointer}.host4-remove p{max-width:700px}.host4-remove input{max-width:420px}.host4-error{color:#f5b4a4!important;padding:12px;background:#442822;border-radius:8px}

/* CROCP Web Panel Settings — scoped routing and storage overview. */
.host3 .host6-support{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin:0 0 8px;font-size:12px}.host6-support b{font-size:10px;letter-spacing:1px;color:#86dbbc;background:#12392f;border:1px solid #275449;padding:6px 9px;border-radius:5px}
.host6-settings{margin-top:42px;border:1px solid #35434f;border-radius:16px;background:radial-gradient(ellipse at 95% 0,#f09a4610,transparent 42%),#0b141e;overflow:hidden;scroll-margin-top:24px}
.host6-heading{padding:30px;display:flex;gap:20px;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0b}.host6-eyebrow{font:700 10px/1.5 ui-monospace,monospace;letter-spacing:1.7px;color:#eca76c}.host6-heading h2{margin:10px 0 8px;font-size:28px;letter-spacing:-.5px}.host3 .host6-heading p{margin:0;font-size:13px;color:#96aabd}.host6-heading .btn{font-size:10px;white-space:nowrap}
.host6-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#283542;border-bottom:1px solid #283542}.host6-summary>div{display:grid;grid-template-columns:1fr auto;gap:6px 14px;align-items:center;background:#111e2b;padding:22px 26px;min-width:0}.host6-summary span{font:700 10px/1.5 ui-monospace,monospace;letter-spacing:1px;color:#b6c7d7}.host6-summary b{grid-row:span 2;color:#ecb885;font:500 30px/1 ui-monospace,monospace}.host6-summary>div:nth-child(2) b{color:#a7b8f6}.host6-summary>div:nth-child(3) b{color:#7ccebc}.host3 .host6-summary p{font-size:11px;margin:0;line-height:1.5;color:#849bae}
.host6-toolbar{display:flex;gap:16px;align-items:end;padding:24px 24px 6px}.host6-toolbar label:first-child{flex:1;min-width:0}.host6-toolbar label:nth-child(2){flex:0 1 220px;min-width:0}.host3 .host6-toolbar label input,.host3 .host6-toolbar label select{margin:8px 0 0;min-height:42px;font-size:12px;letter-spacing:0}.host6-toolbar>span{font:500 10px/1.5 ui-monospace,monospace;color:#8aa2b7;padding-bottom:13px;white-space:nowrap}
.host6-routes{padding:8px 24px 24px}.host6-route{--route-accent:#e9ae79;--route-shade:#30271f;border:1px solid #30404e;border-radius:10px;background:#0f1c28;margin-top:16px;min-width:0;overflow:hidden}.host6-panel{--route-accent:#afbcf4;--route-shade:#222b43}.host6-database{--route-accent:#85d6c1;--route-shade:#1a342f}.host6-route-head{display:flex;align-items:center;gap:13px;padding:20px 22px}.host6-mark{width:38px;height:38px;display:flex;flex:none;align-items:center;justify-content:center;border:1px solid #ffffff1c;border-radius:9px;font:700 12px ui-monospace,monospace;color:var(--route-accent);background:var(--route-shade)}.host6-address{flex:1;min-width:0}.host6-address small{font:600 9px/1.6 ui-monospace,monospace;letter-spacing:1px;color:var(--route-accent)}.host6-address h3{color:#e8f0f7;margin:4px 0 0;font-size:17px;line-height:1.4;overflow-wrap:anywhere}.host6-enabled{font:600 9px/1.5 ui-monospace,monospace;color:#91a6b8;letter-spacing:.4px;text-align:right}
.host6-flow{display:grid;grid-template-columns:minmax(0,.8fr) 30px minmax(0,1.4fr);gap:18px;align-items:start;margin:0 22px 20px;padding:18px;border:1px solid #ffffff09;border-radius:7px;background:#09131d}.host6-flow small{display:block;font:600 9px/1.6 ui-monospace,monospace;letter-spacing:.8px;color:#819bb0;text-transform:uppercase;margin-bottom:8px}.host6-from span{font:500 12px/1.7 ui-monospace,monospace;color:#bacbdb;overflow-wrap:anywhere}.host6-arrow{align-self:center;color:var(--route-accent);font-size:26px;text-align:center}.host6-to code{font:500 12px/1.8 ui-monospace,monospace;color:var(--route-accent);overflow-wrap:anywhere;white-space:normal;background:none;padding:0}.host3 .host6-to p{color:#8ba1b4;margin:8px 0 0;font-size:11px;line-height:1.7}
.host6-details{border-top:1px solid #30404e}.host6-details>summary{display:flex;align-items:center;gap:12px;cursor:pointer;padding:15px 22px;font:650 10px/1.6 ui-monospace,monospace;color:#adbecd;list-style:none}.host6-details>summary::-webkit-details-marker{display:none}.host6-details>summary:before{content:'+';font-size:18px;color:var(--route-accent);width:12px;flex:none}.host6-details[open]>summary:before{content:'−'}.host6-details>summary:hover{background:#162534}.host6-details>summary:focus-visible{outline:2px solid var(--route-accent);outline-offset:-3px}.host6-health{margin-left:auto;font-size:9px;letter-spacing:.3px;text-align:right}.host6-health.match{color:#7fc3aa}.host6-health.warn{color:#f0b477}.host6-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px;padding:10px 22px 22px;margin:0}.host6-fields>div{min-width:0;border-bottom:1px solid #ffffff0a;padding-bottom:16px}.host6-fields dt{font:600 10px/1.5 ui-monospace,monospace;color:#8ea6b9;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.host6-fields dd{margin:0}.host6-fields code{font:500 11px/1.8 ui-monospace,monospace;color:#c1d2e1;overflow-wrap:anywhere;white-space:normal;background:none;padding:0}.host3 .host6-fields p{font-size:11px;color:#8ba1b4;margin:8px 0 0}.host6-details .host3-actions{margin:0;padding:0 22px 22px}
.host6-footer{padding:22px 26px;background:#09121b;border-top:1px solid #293947}.host6-footer>strong{color:#a7bbc9;font-size:11px;font-weight:600}.host3 .host6-footer p{font-size:11px;color:#829bad;max-width:840px;margin:8px 0 16px}.host6-footer>div{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}.host6-footer span{font:600 9px ui-monospace,monospace;color:#688699;letter-spacing:.6px}.host6-footer code{color:#9cb4c7;font:500 11px/1.6 ui-monospace,monospace;overflow-wrap:anywhere;max-width:100%}.host3 .host6-empty{padding:18px 24px;font-size:12px;color:#9db0c0}.host6-settings [hidden]{display:none!important}.host3-domain[id]{scroll-margin-top:24px}
@media(max-width:850px){.host6-summary>div{padding:20px 16px;grid-template-columns:1fr}.host6-summary b{grid-row:1;grid-column:1;margin-bottom:6px}.host6-heading{padding:24px}.host6-flow{grid-template-columns:minmax(0,1fr) 24px minmax(0,1.4fr);gap:10px}.host6-toolbar{flex-wrap:wrap}.host6-toolbar>span{padding:0;flex-basis:100%}}
@media(max-width:600px){.host6-settings{margin-top:30px;border-radius:12px}.host6-heading{padding:22px 18px;align-items:flex-start;flex-direction:column;gap:16px}.host6-heading h2{font-size:25px}.host6-summary{grid-template-columns:1fr}.host6-summary>div{grid-template-columns:1fr auto;padding:16px 18px;gap:5px 12px}.host6-summary b{grid-column:2;grid-row:1/span 2;margin:0;font-size:26px}.host6-summary span{grid-column:1;grid-row:1}.host6-summary p{grid-column:1;grid-row:2}.host6-toolbar{padding:18px 14px 2px;gap:12px}.host6-toolbar label:first-child,.host6-toolbar label:nth-child(2){flex-basis:100%}.host6-routes{padding:4px 12px 18px}.host6-route-head{padding:18px 14px;flex-wrap:wrap;gap:10px}.host6-address h3{font-size:15px}.host6-enabled{flex-basis:100%;text-align:left;margin-left:48px;font-size:8px}.host6-flow{grid-template-columns:1fr;margin:0 12px 16px;padding:15px;gap:10px}.host6-arrow{transform:rotate(90deg);justify-self:start;font-size:23px}.host6-details>summary{padding:14px 12px;flex-wrap:wrap;font-size:9px;gap:8px}.host6-health{margin-left:20px;flex-basis:100%;text-align:left;font-size:8px}.host6-fields{grid-template-columns:1fr;padding:8px 16px 18px;gap:16px}.host6-details .host3-actions{padding:0 16px 18px}.host6-footer{padding:20px 18px}.host6-from span,.host6-to code{font-size:11px}}