/* ============================================================================
   Lenta V3 clean stylesheet
   Admin-KB palette, dark-only UI, compact server catalog layout
   ============================================================================ */

:root,
:root[data-theme="light"],
:root[data-theme="dark"]{
  color-scheme: dark;
  --bg:#070a0f;
  --side:#0b0f17;
  --side2:#111720;
  --panel:#11161f;
  --panel2:#171d26;
  --card:#11161f;
  --row:#131923;
  --text:#edf1f7;
  --fg:#edf1f7;
  --muted:#8993a3;
  --soft:#c4ccd8;
  --accent:#7b1730;
  --accent-2:#a82543;
  --border:#252b36;
  --line:#252b36;
  --line2:#343b48;
  --badge:rgba(255,255,255,.055);
  --good:#73e142;
  --green:#73e142;
  --warn:#f5c542;
  --danger:#ff6671;
  --mark:#c59a34;
  --body:Inter,'DM Sans',system-ui,-apple-system,Segoe UI,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--body);
  font-size:15px;
  line-height:1.55;
  overflow:hidden;
}
body::before{
  content:'';
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(70% 55% at 80% -10%,rgba(125,23,48,.22),transparent 56%),
    radial-gradient(50% 40% at 0 100%,rgba(34,43,60,.45),transparent 62%);
  opacity:.82;
}
mark{background:var(--mark);color:#070a0f;border-radius:3px;padding:0 3px;}
input,select,button{font-family:var(--body);}

/* Layout */
.container{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:350px minmax(0,1fr);
  height:100vh;
  min-height:100vh;
}
.sidebar{
  width:350px;
  height:100vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:linear-gradient(180deg,#101722 0%,#090d14 100%);
  border-right:1px solid #1e2530;
  box-shadow:20px 0 60px rgba(0,0,0,.36);
  scrollbar-color:#4b1728 #0c1119;
  scrollbar-width:thin;
}
.sidebar::-webkit-scrollbar,
#nav::-webkit-scrollbar{width:8px;}
.sidebar::-webkit-scrollbar-track,
#nav::-webkit-scrollbar-track{background:#0c1119;}
.sidebar::-webkit-scrollbar-thumb,
#nav::-webkit-scrollbar-thumb{background:#4b1728;border-radius:20px;border:0;}
.main{
  min-width:0;
  padding:18px 22px 48px;
  display:block;
  overflow:auto;
}
.content{width:min(100%,1360px);}

/* Sidebar header */
.brand{
  display:flex;
  align-items:center;
  gap:13px;
  padding:21px 15px 17px;
  border-bottom:1px solid #1d2430;
  color:#fff;
}
.brand-row{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.brand-title{display:flex;align-items:center;gap:12px;min-width:0;}
.brand-title b{display:block;font-size:15px;line-height:1.05;font-weight:900;letter-spacing:.04em;color:#fff;}
.brand-title small{display:block;margin-top:3px;color:var(--muted);font-size:11px;line-height:1;text-transform:uppercase;letter-spacing:.035em;font-weight:750;}
.brand-mark{width:31px;height:31px;position:relative;display:inline-block;filter:drop-shadow(0 0 10px rgba(168,37,67,.4));}
.brand-mark::before{content:'';position:absolute;inset:3px 2px;border:3px solid #fff;border-radius:2px;}
.brand-mark::after{content:'';position:absolute;left:7px;right:7px;top:11px;height:3px;background:#fff;box-shadow:0 7px 0 #fff;}
.sort-pill{
  height:32px;
  min-width:88px;
  padding:0 9px;
  border:1px solid #2a3340;
  border-radius:8px;
  background:#151b25;
  color:#edf1f7;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
.sort-pill:hover,.sort-pill:focus{border-color:#7b1730;outline:none;}

/* Search */
.search-box{
  position:relative;
  display:flex;
  align-items:center;
  gap:4px; /* reduced icon-to-input distance */
  height:40px;
  margin:14px 15px 12px;
  padding:0 10px 0 10px;
  border:1px solid #242d3a;
  border-radius:10px;
  background:#101620;
}
.search-box:focus-within{border-color:#3e4655;box-shadow:0 0 0 3px rgba(124,23,48,.2);}
.search-icon{width:15px;height:15px;opacity:.78;flex:0 0 auto;}
.search-box input{
  min-width:0;
  flex:1;
  height:100%;
  padding:0 4px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font:500 13px var(--body);
}
.search-box input::placeholder{color:#697383;}
.search-box input::-webkit-search-cancel-button{filter:invert(1);opacity:.55;}
.search-box kbd{
  height:22px;
  padding:0 8px;
  border:1px solid #2b3544;
  border-radius:7px;
  display:flex;
  align-items:center;
  background:#151c27;
  color:#aab3c1;
  font-size:11px;
  font-weight:850;
  line-height:1;
  white-space:nowrap;
}

/* Navigation */
#nav{flex:1;overflow:auto;padding:0 10px 14px;scrollbar-color:#4b1728 #0c1119;}
.group{margin:0 0 8px;}
.group-header{
  min-height:44px;
  margin:8px 0 7px;
  padding:0 10px 0 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:1px solid color-mix(in srgb,var(--accent) 48%,#343b48);
  border-radius:11px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 58%,#171d26),#1a202a 80%);
  box-shadow:inset 4px 0 0 var(--accent);
  color:#fff;
  font-size:14px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.group-header .count{
  padding:1px 7px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:#e8edf5;
  font:800 10px var(--mono);
}
.item{
  min-height:36px;
  margin:3px 8px;
  padding:7px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border:1px solid transparent;
  border-radius:9px;
  color:#d6dce6;
  font-size:13px;
  font-weight:650;
  cursor:pointer;
  transition:background .12s,border-color .12s,color .12s,box-shadow .12s;
}
.item .name{flex:1;min-width:0;}
.item:hover{background:#171d26;border-color:#2d3541;color:#fff;}
.item.active{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 42%,#171d26),#1c222c 92%);border-color:color-mix(in srgb,var(--accent) 42%,#333b48);box-shadow:inset 3px 0 0 var(--accent);color:#fff;}
.item.active .name{color:#fff;font-weight:850;}
.nav-score{font-family:var(--mono);font-size:12px;color:#abb4c2;white-space:nowrap;}
.status{width:18px;height:18px;display:inline-flex;}
.status svg{width:100%;height:100%;display:block;}
.status.verified{color:var(--green);filter:drop-shadow(0 0 5px rgba(115,225,66,.24));}
.status.draft{color:#f5c542;filter:drop-shadow(0 0 5px rgba(245,197,66,.20));}
.status.unknown{color:#8d97a7;}

/* Topbar */
.topbar{height:36px;margin-bottom:10px;display:flex;align-items:center;justify-content:space-between;gap:14px;}
.breadcrumbs{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#9aa4b4;font-size:13px;font-weight:850;}
.breadcrumbs span{color:#576170;font-weight:900;}
.breadcrumbs b{color:#edf1f7;font-weight:950;}
.toolbar{height:auto;margin-bottom:14px;display:flex;align-items:center;gap:12px;}
.toolbar h2{margin:0;flex:1;color:#edf1f7;font-size:25px;font-weight:950;letter-spacing:-.02em;}

/* Buttons and modal */
button,.toggle,.controls button{
  min-height:32px;
  padding:8px 10px;
  border:1px solid #2a3340;
  border-radius:8px;
  background:#151b25;
  color:#edf1f7;
  font-weight:800;
  cursor:pointer;
}
button:hover,.toggle:hover,.controls button:hover{background:#1b222d;border-color:#7b1730;color:#fff;}
.monkey-btn{height:36px;min-height:36px;min-width:118px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:10px;font-size:13px;font-weight:900;letter-spacing:.01em;box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 12px 36px rgba(0,0,0,.18);}
.modal{position:fixed;inset:0;z-index:10000;display:none;}
.modal.open{display:block;}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.62);backdrop-filter:blur(5px);}
.modal-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(760px,calc(100vw - 34px));max-height:calc(100vh - 48px);padding:18px;border:1px solid #293241;border-radius:14px;background:linear-gradient(180deg,#121822,#0d121a);box-shadow:0 28px 90px rgba(0,0,0,.58);}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:10px;}
.modal-kicker{color:#ff5575;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;}
.modal-head h3{margin:2px 0 0;font-size:22px;line-height:1.12;}
.modal-close{width:34px;height:34px;min-height:34px;padding:0;border-radius:9px;font-size:22px;line-height:1;}
.modal-text{margin:0 0 12px;color:#b8c1cf;font-size:14px;}
.modal-actions{display:flex;justify-content:flex-end;margin-top:12px;}

/* Details card and main table */
#details{background:linear-gradient(180deg,#121822,#0e131b);border:1px solid #242b36;border-radius:10px;box-shadow:0 22px 70px rgba(0,0,0,.28);overflow:hidden;}
#details:empty{display:none;}
.table{width:100%;margin-top:0;border-spacing:0;border-collapse:separate;border-radius:0;overflow:hidden;}
.table th,.table td{padding:12px 14px;vertical-align:top;border-top:1px solid rgba(37,43,54,.86);background:transparent;}
.table tr:first-child th,.table tr:first-child td{border-top:0;}
.table th,.table th:hover,.table > tbody > tr:hover > th{width:224px;text-align:center;background:linear-gradient(90deg,rgba(123,23,48,.64),rgba(123,23,48,.38));color:#fff;font-size:14px;font-weight:900;border-right:1px solid rgba(123,23,48,.33);box-shadow:none;transform:none;}
.table td,.table td:hover,.table > tbody > tr:hover > td{background:rgba(17,22,31,.44);color:var(--text);}

/* Note outside details */
#noteFooter.note-outside{display:block;margin:8px 0 0;padding:0 0 0 2px;border:0;background:transparent;color:#c59a34;font-size:12px;line-height:1.45;}
#details #noteFooter{display:none;}
.footer{margin:14px 0 0;color:#8d97a7;font-size:12px;}

/* Badges */
.badges{display:flex;gap:8px;flex-wrap:wrap;}
.badge{min-height:25px;padding:3px 8px;border:1px solid #343b48;border-radius:6px;display:inline-flex;align-items:center;gap:6px;background:#151b25;color:#e7edf6;font-size:13px;font-weight:650;box-shadow:inset 0 1px 0 rgba(255,255,255,.035);}
.badge:is(a){position:relative;color:#ff4f67;border-color:#4c2935;background:#141a23;text-decoration:none;}
.badge:is(a)::after{content:'';position:absolute;left:6px;right:6px;bottom:3px;height:1px;border-bottom:1px dashed #ff4f67;opacity:.38;}
.badge:is(a):hover{color:#fff;border-color:#a82543;background:#211721;text-shadow:none;}
.sel-badges .badge{cursor:pointer;}
/* Keep selection badge rows spaced even if a mobile breakpoint is not active. */
#locRow,#ntRow,#osCell{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px;row-gap:8px;}
#locRow > .badge,#ntRow > .badge,#osCell > .badge{margin:0;}
.sel-badges .badge:hover,.badge.os.has-config:hover{border-color:#7b1730;background:rgba(123,23,48,.22);}
.sel-badges .badge.active,.badge.os.has-config.active{border-color:#c59a34;background:rgba(197,154,52,.10);color:#fff;}
.badge.os,.badge.os *{cursor:help;}
.badge.os img{width:17px;height:17px;}
.badge.os.disabled{opacity:.6;cursor:default;}
.badge.os.has-config{cursor:pointer;font-weight:700;}
.badge.os .cfg-ico{display:inline-block;width:14px;height:14px;margin-left:6px;vertical-align:-2px;opacity:.9;background:currentColor;-webkit-mask:url('./icons/ui/gear.svg') no-repeat center / contain;mask:url('./icons/ui/gear.svg') no-repeat center / contain;}
.badge.file,.badge.image{position:relative;padding-left:28px;}
.badge.file::before,.badge.image::before{content:'';position:absolute;left:8px;top:50%;width:14px;height:14px;transform:translateY(-50%);background:currentColor;}
.badge.file::before{-webkit-mask:url('./icons/ui/file.svg') no-repeat center / contain;mask:url('./icons/ui/file.svg') no-repeat center / contain;}
.badge.image::before{-webkit-mask:url('./icons/ui/image.svg') no-repeat center / contain;mask:url('./icons/ui/image.svg') no-repeat center / contain;}
.badge.adapter{cursor:default;}
.badge.adapter[data-tip]{cursor:help;}
.badge.adapter .badge-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;margin-left:7px;padding:0 6px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.08);color:var(--muted);font-size:12px;font-weight:800;line-height:1;}

/* Tooltip */
.tooltip{position:fixed;z-index:9999;max-width:340px;padding:10px 12px;border:1px solid #343b48;border-radius:10px;background:#11161f;color:#edf1f7;box-shadow:0 22px 70px rgba(0,0,0,.42);pointer-events:none;white-space:pre-wrap;font-size:13px;line-height:1.35;overflow:visible;}
.tooltip::before,.tooltip::after{content:'';position:absolute;left:var(--arrow-x,16px);width:0;height:0;border-style:solid;pointer-events:none;}
.tooltip[data-pos="top"]::before{top:100%;border-width:10px 8px 0 8px;border-color:#343b48 transparent transparent transparent;}
.tooltip[data-pos="top"]::after{top:calc(100% - 1px);border-width:10px 8px 0 8px;border-color:#11161f transparent transparent transparent;}
.tooltip .inner{font-size:13px;line-height:1.3;letter-spacing:.1px;}

/* CPU card */
.cpu-card{padding:14px 14px 12px;border:1px solid #252b36;border-radius:10px;background:linear-gradient(180deg,#171d26,#11161f);box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 18px 50px rgba(0,0,0,.20);}
.cpu-headline{margin-bottom:12px;opacity:.85;}
.cpu-scores{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch;gap:12px;width:100%;min-width:0;}
.cpu-scores > .score-box{flex:1 1 0;min-width:0;}
.cpu-scores > .divider{flex:0 0 1px;width:1px;min-width:1px;align-self:stretch;background:#343b48;}
.score-box .label{margin-bottom:4px;color:#aeb7c5;opacity:1;}
.score-box .value{margin-bottom:8px;color:#e8edf5;font-size:34px;line-height:1;font-weight:900;letter-spacing:-.03em;}
.segbar{display:flex;gap:6px;}
.segbar .seg{width:26px;height:8px;border-radius:6px;background:#303742;}
.segbar .seg.on{background:#73e142;}
.score-box .value.single + .segbar .seg.on{background:#c59a34;}
.cpu-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px;opacity:.9;font-size:12px;}
.cpu-meta .meta-item{padding:4px 8px;border:1px solid #2a3340;border-radius:999px;background:#151b25;color:#aeb7c5;}
.cpu-meta .meta-link{text-decoration:none;color:inherit;cursor:pointer;}
.cpu-meta .meta-link:hover{background:#1b222d;border-color:#7b1730;color:#fff;}

/* Dimensions */
.dimensions-row{
  display:grid;
  grid-template-columns:minmax(240px,1fr) minmax(240px,1fr) minmax(190px,.72fr);
  gap:10px;
  align-items:stretch;
}
.dimension-item.dimension-card{
  min-width:0;
  min-height:56px;
  padding:7px 9px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr) auto;
  align-items:center;
  column-gap:9px;
  border:1px solid #283242;
  border-radius:11px;
  background:linear-gradient(180deg,#151d28,#111821);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.dimension-item.dimension-card.is-count{grid-template-columns:36px minmax(0,1fr);}
.dimension-icon{
  width:32px;
  height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(72,145,222,.30);
  border-radius:9px;
  background:linear-gradient(180deg,rgba(30,93,158,.32),rgba(16,47,83,.30));
  color:#75b9ff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 0 18px rgba(44,128,213,.08);
}
.dimension-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.dimension-copy{min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.15;}
.dim-label{color:#91a0b4;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.045em;white-space:nowrap;}
.dim-value{min-width:0;color:#eef3fa;font-size:15px;font-weight:900;letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dimension-card.is-count .dim-value{font-size:17px;}
.dimension-card .copy-btn{width:27px;height:27px;min-height:27px;border-radius:7px;}
.copy-btn{width:22px;height:22px;min-height:22px;padding:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid #3b4654;border-radius:7px;background:#121923;color:#b8c1cf;line-height:1;cursor:pointer;}
.copy-btn:hover{background:#18212d;border-color:#a82543;color:#fff;}
.copy-icon{width:17px;height:17px;}

/* Network */
.network-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:0;align-items:stretch;}
.network-main{min-width:0;padding-right:24px;}
.network-adapters{min-width:0;min-height:100%;padding-left:24px;border-left:1px solid #252d3a;}
.network-adapters .section-title{margin:0 0 7px;color:#eef4ff;font-size:14px;font-weight:900;}
.section-title{margin:8px 0 5px;color:#e8edf5;font-size:14px;font-weight:850;}

.network-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.network-metric-card{min-width:0;min-height:72px;padding:9px 11px;display:flex;align-items:center;gap:10px;border:1px solid #293342;border-radius:10px;background:linear-gradient(180deg,#141c27,#101720);box-shadow:inset 0 1px 0 rgba(255,255,255,.025);}
.network-metric-icon{width:42px;height:42px;flex:0 0 42px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(45,153,255,.08);color:#4eb2ff;}
.network-metric-icon svg{width:27px;height:27px;display:block;fill:currentColor;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.network-metric-icon .network-speedometer-icon{fill:none;stroke:currentColor;stroke-width:1.85;}
.network-metric-icon svg:not(.network-speedometer-icon) path[fill]{fill:currentColor;}
.network-metric-icon .network-speedometer-icon path[fill="none"]{fill:none;}
.network-metric-copy{min-width:0;display:grid;gap:1px;}
.network-metric-label{color:#a8b2c1;font-size:10px;font-weight:900;line-height:1.05;text-transform:uppercase;letter-spacing:.04em;}
.network-metric-copy strong{color:#f2f5fa;font-size:16.5px;font-weight:950;line-height:1.15;white-space:nowrap;}
.network-metric-copy small{color:#8f9aaa;font-size:11px;font-weight:650;line-height:1.1;}

.network-config-row{display:flex;align-items:center;flex-wrap:nowrap;gap:9px;margin-top:10px;padding-top:10px;border-top:1px solid #222b38;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;}
.network-config-label{flex:0 0 auto;color:#d7dee8;font-size:12px;font-weight:800;white-space:nowrap;}
.network-config-dot{margin-left:3px;color:#687384;}
.network-config-os{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;color:#eef3f9;font-size:12px;white-space:nowrap;}
.network-config-os img{width:20px;height:20px;display:block;}
.network-config-os strong{font-weight:900;}
.network-config-actions{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;}
.network-config-btn{height:30px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 10px;border:1px solid #245f83;border-radius:8px;background:#101822;color:#47baf2;text-decoration:none;font-size:11.5px;font-weight:900;box-shadow:inset 0 1px 0 rgba(255,255,255,.025);}
.network-config-btn:hover{background:#122131;color:#78d0ff;border-color:#2f94c9;}
.network-config-btn.is-private{border-color:#70406d;color:#df7bd6;background:#17131d;}
.network-config-btn.is-private:hover{border-color:#a95aa2;color:#ffa0f4;background:#211622;}
.network-config-file-icon{width:15px;height:17px;display:inline-block;background:currentColor;-webkit-mask:url('./icons/ui/file.svg') no-repeat center / contain;mask:url('./icons/ui/file.svg') no-repeat center / contain;}

.network-adapter-list{display:grid;gap:7px;}
.network-adapter-card{min-width:0;min-height:36px;padding:5px 8px;display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:8px;border:1px solid #293342;border-radius:9px;background:linear-gradient(180deg,#151d28,#111821);color:#eef3f9;box-shadow:inset 0 1px 0 rgba(255,255,255,.025);}
.network-adapter-card[data-tip]{cursor:help;}
.network-adapter-icon{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:rgba(45,153,255,.07);color:#4eb2ff;}
.network-adapter-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.network-adapter-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#eef3f9;font-size:11.5px;font-weight:850;}
.network-adapter-count{display:inline-flex;align-items:center;justify-content:center;min-width:29px;height:20px;padding:0 7px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(255,255,255,.07);color:#98a3b2;font:850 10.5px var(--mono);}

/* RAM options table */
.dimms{width:auto;min-width:min(760px,100%);max-width:100%;margin-top:8px;border:1px solid #252d3a;border-radius:10px;border-collapse:separate;border-spacing:0;overflow:hidden;font-size:13px;}
.dimms th,.dimms td{text-align:center;vertical-align:middle;}
.dimms thead{pointer-events:none;}
.dimms thead th,.dimms thead th:hover{padding:7px 10px;background:#7b1730;color:#fff;font-size:12px;font-weight:900;box-shadow:none;}
.dimms tbody td{padding:6px 10px;border-top:1px solid #242c38;color:#e8edf5;}
.dimms tbody tr:nth-child(odd) td,.dimms tbody tr:nth-child(odd):hover td,.dimms tbody tr:nth-child(odd) td:hover{background:#111720;color:#e8edf5;}
.dimms tbody tr:nth-child(even) td,.dimms tbody tr:nth-child(even):hover td,.dimms tbody tr:nth-child(even) td:hover{background:#151c26;color:#e8edf5;}

/* DIMM population matrix */
#extra{overflow-x:visible;max-width:none;}
#extra .meta{margin-bottom:8px;color:#aab3c1;font-size:13px;}
.dimm-matrix{width:auto;min-width:100%;max-width:none;margin-top:8px;border:1px solid #252d3a;border-radius:0;border-collapse:collapse;border-spacing:0;table-layout:fixed;overflow:hidden;background:#111720;font-size:14px;}
.dimm-matrix thead,.dimm-matrix thead *{pointer-events:none;}
.dimm-matrix th,.dimm-matrix td{height:38px;min-width:0;padding:0 8px;text-align:center;vertical-align:middle;white-space:nowrap;border:1px solid #252d3a;box-shadow:none;}
.dimm-matrix th:first-child,.dimm-matrix td:first-child{width:140px;}
.dimm-matrix th:nth-child(2),.dimm-matrix td:nth-child(2){width:96px;}
.dimm-matrix th,.dimm-matrix th:hover{background:#161d27;color:#fff;font-weight:900;box-shadow:none;}
.dimm-matrix tbody tr:nth-child(n) td,.dimm-matrix tbody tr:nth-child(n):hover td,.dimm-matrix tbody tr:nth-child(n) td:hover{background:#121821;color:#e8edf5;box-shadow:none;}
.dimm-matrix tbody tr:nth-child(n) td.filled,.dimm-matrix tbody tr:nth-child(n):hover td.filled,.dimm-matrix tbody tr:nth-child(n) td.filled:hover{background:rgba(45,97,47,.60);color:#73e142;border-color:#252d3a;box-shadow:none;outline:0;font-weight:950;}
.dimm-matrix .warn{display:block;margin-top:2px;color:#ff6671;font-size:12px;font-weight:850;line-height:1.15;}
.dimm-matrix td.qty-cell[data-copy]{position:relative;cursor:pointer;color:#e8edf5;transition:background .12s,color .12s,border-color .12s;}
.dimm-matrix td.qty-cell[data-copy]:hover{background:#241722;color:#f2c94c;border-color:#c59a34;outline:1px solid #c59a34;outline-offset:-1px;box-shadow:none;}
.dimm-matrix td.qty-cell[data-copy]:hover .warn{color:#ff6671;}
.dimm-matrix td.qty-cell[data-copy].is-copied{background:rgba(80,180,70,.12);color:#8eff7e;border-color:#6fdc5f;}
.dimm-matrix tbody tr:has(td.qty-cell[data-copy]:hover) td.filled,
.dimm-matrix tbody tr.dual-start:has(td.qty-cell[data-copy]:hover) + tr.dual-cont td.filled{background:#2d612f;color:#8cff65;border-color:#252d3a;box-shadow:none;}

#moreBtn{border:1px dashed #c59a34;background:#151b25;color:#f2d28c;}
#moreBtn:hover{background:rgba(197,154,52,.11);}


/* Auxiliary table sizing */
.spec-table,
.ram-options-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
}
.spec-table th:first-child,
.spec-table td:first-child{
  width:220px;
  min-width:220px;
  max-width:220px;
  white-space:nowrap;
}
.spec-table{overflow:hidden;}
.ram-options-table{margin-top:10px;}
.dimm-matrix-wrap{width:100%;overflow-x:auto;}

/* === Phase 6.1: consistent split dividers for GPU and Drives === */
.gpu-split,
.drives-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:0;
  align-items:start;
}
.gpu-split > div,
.drives-main,
.drives-variations{
  min-width:0;
}
.gpu-split > div:first-child,
.drives-main{
  padding-right:24px;
}
.gpu-split > div:nth-child(2),
.drives-variations{
  min-height:72px;
  padding-left:24px;
  border-left:1px solid #252d3a;
}
.gpu-split .section-title,
.drives-variations .section-title{
  margin-top:0;
}

/* Report bug / idea */
.top-actions-inline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.report-btn{min-width:94px;}
.shake-icon{display:inline-block;font-size:17px;transform-origin:50% 80%;animation:report-shake 1.15s ease-in-out infinite;}
@keyframes report-shake{0%,100%{transform:translateX(0) rotate(0)}20%{transform:translateX(-1px) rotate(-8deg)}40%{transform:translateX(2px) rotate(7deg)}60%{transform:translateX(-2px) rotate(-6deg)}80%{transform:translateX(1px) rotate(5deg)}}
.report-modal-panel{width:min(620px,calc(100vw - 34px));}
.report-form{display:grid;gap:12px;}
.report-type-row{display:flex;gap:10px;flex-wrap:wrap;}
.report-type-row label{display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border:1px solid #343b48;border-radius:10px;background:#151b25;color:#e8edf5;font-weight:800;}
.report-field{display:grid;gap:6px;color:#b8c1cf;font-size:13px;font-weight:800;}
.report-field input,.report-field textarea{width:100%;border:1px solid #343b48;border-radius:10px;background:#0e141d;color:#e8edf5;padding:10px 11px;outline:none;resize:vertical;}
.report-field input:focus,.report-field textarea:focus{border-color:#a82543;box-shadow:0 0 0 3px rgba(168,37,67,.18);}
.report-meta-grid{display:grid;grid-template-columns:1fr 180px;gap:10px;}
.report-status{min-height:18px;color:#aeb7c5;font-size:13px;}
.report-status.ok{color:#73e142;}.report-status.err{color:#ff6671;}

/* Cherry sync additions */

.item .name-wrap{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;}
.plan-updated{margin-top:1px;color:#7f8998;font-size:10.5px;font-weight:650;line-height:1.15;letter-spacing:.01em;}
.item.active .plan-updated{color:#b9c1ce;}
.title-sync-meta{margin-left:auto;text-align:right;}
.title-sync-meta .plan-updated{font-size:11px;color:#8993a3;white-space:nowrap;}
.stock-pill{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;margin-left:4px;padding:0 6px;border-radius:999px;background:rgba(115,225,66,.10);border:1px solid rgba(115,225,66,.22);color:#9be76d;font:800 11px var(--mono);}
.badge.location .stock-pill{margin-left:2px;}
.update-link{display:inline-flex;align-items:center;justify-content:center;height:32px;padding:0 10px;border:1px solid #2a3340;border-radius:8px;background:#151b25;color:#edf1f7;text-decoration:none;font-size:12px;font-weight:800;}
.update-link:hover{border-color:#7b1730;color:#fff;background:#1b222d;}
.updates-page{overflow:auto;}
.updates-wrap{max-width:1180px;margin:0 auto;padding:28px 18px 60px;position:relative;z-index:1;}
.updates-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px;}
.updates-head h1{margin:0;font-size:28px;line-height:1.1;}
.updates-head p{margin:6px 0 0;color:var(--muted);}
.updates-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--panel);border:1px solid var(--border);border-radius:12px;overflow:hidden;}
.updates-table th,.updates-table td{padding:10px 12px;border-bottom:1px solid var(--border);vertical-align:top;text-align:left;font-size:13px;}
.updates-table th{background:#151b25;color:#dfe5ef;font-size:12px;text-transform:uppercase;letter-spacing:.04em;}
.updates-table tr:last-child td{border-bottom:0;}
.updates-type{display:inline-flex;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.10);font:800 11px var(--mono);}
.updates-muted{color:var(--muted);}
.updates-empty{padding:18px;border:1px dashed var(--border);border-radius:12px;color:var(--muted);background:rgba(255,255,255,.03);}
.stock-pill.available{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.32);color:#15803d;}
.stock-pill.zero{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.32);color:#dc2626;}
.global-sync-meta{font-size:12px;color:var(--muted,#6b7280);margin-top:4px;}

/* RAM configurator */
.ram-config{display:grid;gap:10px;max-width:100%;}
.ram-config .section-title{margin:0 0 2px;padding:0;line-height:1;}
.ram-support-head{display:block;padding:12px 16px;border:1px solid #252d3a;border-radius:12px;background:linear-gradient(180deg,#151c26,#111720);}
.ram-summary{margin:0 0 10px;color:#e8edf5;font-size:15px;line-height:1.4;}
.ram-meta-badges{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:8px;margin-top:0;}
.ram-support-head.is-guide-preview .ram-summary{margin-bottom:0;}
.dimm-guide-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px;}
.dimm-guide-heading .meta{margin:0;color:#aab3c1;}
.dimm-guide-heading .badge.image{flex:0 0 auto;}

.ram-guide-open{position:relative;cursor:pointer;min-height:25px;padding:3px 8px;border:1px solid #4c2935;border-radius:6px;background:#141a23;color:#ff4f67;font-size:13px;font-weight:650;box-shadow:inset 0 1px 0 rgba(255,255,255,.035);text-decoration:none;}
.ram-guide-open::after{content:'';position:absolute;left:6px;right:6px;bottom:3px;height:1px;border-bottom:1px dashed #ff4f67;opacity:.38;}
.ram-guide-open:hover{color:#fff;border-color:#a82543;background:#211721;}
.ram-guide-modal[hidden]{display:none;}
.ram-guide-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:24px;}
.ram-guide-backdrop{position:absolute;inset:0;background:rgba(4,7,12,.72);backdrop-filter:blur(4px);}
.ram-guide-dialog{position:relative;width:min(1180px,calc(100vw - 48px));max-height:calc(100vh - 64px);overflow:auto;border:1px solid #30394a;border-radius:14px;background:#111821;box-shadow:0 24px 80px rgba(0,0,0,.55);}
.ram-guide-dialog-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid #252d3a;background:linear-gradient(180deg,#171f2a,#111821);}
.ram-guide-dialog-head b{display:block;color:#eef4ff;font-size:15px;}
.ram-guide-dialog-head span{display:block;margin-top:2px;color:#96a2b4;font-size:12px;}
.ram-guide-board-link,.ram-guide-body .image-badge,.ram-guide-body .img-link,.ram-guide-body a[href*="assets/boards"]{display:none;}
.ram-guide-body{padding:12px 14px 14px;overflow-x:auto;}
.ram-guide-body .meta{margin-bottom:6px;color:#aab3c1;font-size:13px;}
.ram-guide-body .dimm-matrix{margin-top:0;font-size:12px;}
.ram-guide-body .dimm-matrix th,.ram-guide-body .dimm-matrix td{height:28px;padding:0 6px;}
.ram-guide-body .dimm-matrix th:first-child,.ram-guide-body .dimm-matrix td:first-child{width:104px;}
.ram-guide-body .dimm-matrix th:nth-child(2),.ram-guide-body .dimm-matrix td:nth-child(2){width:70px;}

.ram-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px;margin:0 0 6px;}
.ram-choice-card{position:relative;display:grid;grid-template-columns:18px minmax(0,1fr);grid-template-rows:auto auto;align-content:center;align-items:center;column-gap:10px;row-gap:2px;min-height:56px;padding:9px 13px;text-align:left;border:1px solid #252d3a;border-radius:10px;background:#111720;color:#e8edf5;cursor:pointer;transition:border-color .14s,background .14s,transform .14s;}
.ram-choice-card:hover{border-color:#7b1730;background:#151b25;transform:translateY(-1px);}
.ram-choice-card.active{border-color:#e13c66;background:linear-gradient(135deg,rgba(123,23,48,.78),rgba(123,23,48,.18) 62%,#111720);}
.ram-choice-card.no-more{grid-template-rows:1fr;}
.ram-choice-dot{grid-column:1;grid-row:1 / span 2;width:14px;height:14px;margin:0;border:1px solid #465367;border-radius:50%;background:#0f151d;}
.ram-choice-card.no-more .ram-choice-dot{grid-row:1;align-self:center;}
.ram-choice-card.active .ram-choice-dot{background:#e13c66;border-color:#ff5c82;box-shadow:0 0 0 3px rgba(225,60,102,.16);}
.ram-choice-line{grid-column:2;grid-row:1;display:flex;align-items:center;gap:8px;min-width:0;color:#eef4ff;font-size:15px;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ram-choice-card.no-more .ram-choice-line{grid-row:1;align-self:center;}
.ram-choice-spec{display:inline-flex;align-items:center;padding:3px 8px;border-radius:999px;background:#0d131c;border:1px solid #263143;color:#b4bfce;font-size:13px;font-weight:850;white-space:nowrap;}
.ram-choice-more{grid-column:2;grid-row:2;display:block;margin:0;padding:0;color:#8d98aa;font-size:9px;font-weight:800;line-height:1.05;white-space:nowrap;}
.ram-choice-title,.ram-choice-primary,.ram-choice-altcount,.ram-card-line{display:none;}

.ram-panel{display:block;}
.ram-panel-main{padding:12px 16px;overflow:hidden;border:1px solid #252d3a;border-radius:12px;background:linear-gradient(180deg,#141b25,#101720);}
.ram-panel-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:2px;}
.ram-panel-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;}
.ram-panel-title b{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:#eef4ff;font-size:18px;line-height:1.1;}
.ram-panel-title span{font-size:12px;color:#aeb8c8;}
.ram-fill-inline{display:inline-flex;align-items:center;gap:8px;padding:0;background:transparent;border:0;}
.ram-panel-info{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:0 0 10px;color:#aeb8c8;font-size:12px;line-height:1.15;}
.ram-info-tag{display:inline-flex;align-items:center;min-height:20px;padding:2px 7px;border-radius:7px;border:1px solid transparent;font-size:11px;font-weight:850;line-height:1;white-space:nowrap;}
.ram-info-tag.rec{color:#ffc8d4;background:rgba(225,60,102,.18);border-color:rgba(225,60,102,.42);}
.ram-info-tag.alt{color:#d8c4ff;background:rgba(136,89,210,.18);border-color:rgba(136,89,210,.42);}
.ram-info-tag.neutral{color:#b7c1cf;background:#111822;border-color:#283143;}

.ram-variant-list{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end;flex:0 0 auto;}
.ram-variant-btn{display:inline-flex;align-items:center;gap:8px;min-height:25px;padding:3px 8px;border:1px solid #343b48;border-radius:6px;background:#151b25;color:#e7edf6;font-size:13px;font-weight:650;box-shadow:inset 0 1px 0 rgba(255,255,255,.035);}
.ram-variant-btn span{color:#aeb8c8;font-weight:700;}
.ram-variant-btn:hover{border-color:#7b1730;background:rgba(123,23,48,.22);color:#fff;}
.ram-variant-btn.active{border-color:rgba(136,89,210,.64);background:rgba(136,89,210,.18);color:#d8c4ff;}
.ram-variant-btn.active span{color:#d8c4ff;}

.ram-diagram{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start;min-height:160px;padding:12px;border:1px solid #202837;border-radius:10px;background:#101720;}
.ram-diagram.is-single{grid-template-columns:1fr;}
.ram-diagram.is-dual{grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr);gap:18px;align-items:stretch;}
.ram-diagram-divider{width:1px;min-height:150px;background:linear-gradient(180deg,transparent,#2b3545,transparent);align-self:stretch;}
.ram-diagram-cpu{position:relative;min-width:0;padding-top:20px;}
.ram-diagram.is-dual .ram-diagram-cpu{display:grid;grid-template-rows:auto 1fr;gap:12px;padding-top:0;}
.ram-cpu-label{position:absolute;top:0;left:50%;transform:translateX(-50%);padding:3px 12px;border:1px solid #26486e;border-radius:999px;background:#122033;color:#74b8ff;font-size:12px;font-weight:900;}
.ram-diagram.is-dual .ram-cpu-label{position:static;transform:none;justify-self:center;margin:0;}
.ram-slot-row{display:flex;justify-content:space-around;gap:8px;min-width:0;}
.ram-diagram.is-single .ram-slot-row{justify-content:space-around;gap:12px;overflow-x:auto;padding-bottom:4px;}
.ram-diagram.is-dual .ram-slot-row{justify-content:space-around;gap:10px;overflow-x:auto;padding-bottom:4px;}
.ram-slot-item{display:grid;gap:8px;justify-items:center;min-width:32px;}
.ram-slot-name{font-size:13px;font-weight:900;color:#d8e0ec;}
.ram-slot-stick{width:18px;height:110px;border:1px solid #657181;border-radius:4px;background:linear-gradient(180deg,#111720,#0c1118);box-shadow:inset 0 0 0 2px rgba(255,255,255,.03);}
.ram-slot-item.is-filled .ram-slot-stick{border-color:#77d865;background:linear-gradient(180deg,#76d65f,#2d842f);box-shadow:0 0 0 2px rgba(90,220,84,.12),inset 0 0 0 2px rgba(255,255,255,.10);}
.ram-legend{display:flex;justify-content:center;gap:22px;margin-top:12px;padding-top:12px;border-top:1px solid #222b39;color:#aeb8c8;font-size:12px;}
.ram-legend span{display:inline-flex;align-items:center;gap:7px;}
.ram-legend i{width:14px;height:14px;border:1px solid #657181;border-radius:3px;background:#0c1118;}
.ram-legend i.filled{border-color:#77d865;background:#4caf3f;}

.copy-btn.is-copied{width:auto;min-width:72px;padding:0 10px;border-color:#6fdc5f;color:#8eff7e;background:rgba(80,180,70,.12);}
.copy-btn.is-copied .copy-icon{display:none;}
.copy-btn.is-copied::after{content:'Copied';font-size:12px;font-weight:900;}

.ram-empty{padding:16px;border:1px dashed #344052;border-radius:10px;color:#aeb8c8;background:#101720;}


/* Settings: optional DIMM guide preview */
.settings-btn{min-width:108px;}
.settings-panel{width:min(640px,calc(100vw - 34px));}
.settings-row{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:15px;border:1px solid #293241;border-radius:12px;background:#101720;}
.settings-copy{display:grid;gap:4px;min-width:0;}
.settings-copy b{color:#eef4ff;font-size:14px;}
.settings-copy span,.settings-note{color:#9eabba;font-size:12px;line-height:1.45;}
.settings-note{margin:10px 2px 0;}
.switch-control{position:relative;flex:0 0 auto;width:46px;height:26px;cursor:pointer;}
.switch-control input{position:absolute;opacity:0;pointer-events:none;}
.switch-ui{position:absolute;inset:0;border:1px solid #3b4656;border-radius:999px;background:#151b25;transition:.16s;}
.switch-ui::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#8d98a8;transition:.16s;}
.switch-control input:checked + .switch-ui{border-color:#e13c66;background:rgba(123,23,48,.72);}
.switch-control input:checked + .switch-ui::after{left:23px;background:#ff5575;box-shadow:0 0 0 3px rgba(225,60,102,.13);}

.ram-guide-preview{overflow-x:auto;padding:10px 12px 12px;border:1px solid #202837;border-radius:10px;background:#101720;}
.ram-guide-preview .meta{margin:0 0 8px;color:#aab3c1;font-size:12px;}
.ram-guide-preview .dimm-matrix{margin-top:0;min-width:760px;font-size:12px;}
.ram-guide-preview .dimm-matrix th,.ram-guide-preview .dimm-matrix td{height:30px;padding:0 6px;}
.ram-guide-preview .dimm-matrix th:first-child,.ram-guide-preview .dimm-matrix td:first-child{width:112px;}
.ram-guide-preview .dimm-matrix th:nth-child(2),.ram-guide-preview .dimm-matrix td:nth-child(2){width:72px;}
/* Selected DIMM configuration: keep the row subtle, brighten populated cells,
   and use only an inset shadow (no left border) on the DIMM QTY cell. */
.dimm-matrix tbody tr.is-selected td:not(.filled),
.dimm-matrix tbody tr.is-selected:hover td:not(.filled){
  background:linear-gradient(90deg,rgba(123,23,48,.34),rgba(123,23,48,.16));
}
.dimm-matrix tbody tr.is-selected td:first-child{
  border-left-color:#252d3a;
  padding-left:8px;
  box-shadow:inset 4px 0 0 #ff3f70 !important;
}
.dimm-matrix tbody tr.is-selected td.filled,
.dimm-matrix tbody tr.is-selected:hover td.filled{
  background:#2d612f;
  color:#8cff65;
  border-color:#252d3a;
  box-shadow:none;
}
/* If a filled cell happens to be one of the two label columns, keep the selected fill. */
.dimm-matrix tbody tr.is-selected td:first-child.filled,
.dimm-matrix tbody tr.is-selected td:nth-child(2).filled{
  background:linear-gradient(90deg,rgba(123,23,48,.34),rgba(123,23,48,.16));
}

/* ============================================================================
   Responsive layout
   Consolidated here so mobile rules do not override each other unpredictably.
   ============================================================================ */

@media (max-width:1180px){
  .network-grid{grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);}
  .network-main{padding-right:18px;}
  .network-adapters{padding-left:18px;}
  .network-metric-copy strong{font-size:16px;}
  .network-metric-icon{width:40px;height:40px;flex-basis:40px;}
}

@media (max-width:980px){
  .ram-panel-top{display:grid;grid-template-columns:1fr;gap:8px;}
  .ram-variant-list{justify-content:flex-start;}
  .ram-guide-dialog{width:calc(100vw - 24px);max-height:calc(100vh - 24px);}
  .ram-choice-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));}
  .ram-choice-line{font-size:14px;}
  .ram-choice-spec{font-size:12px;}
  .ram-diagram.is-dual{grid-template-columns:1fr;}
  .ram-diagram-divider{display:none;}
  .ram-diagram.is-dual .ram-slot-row{gap:14px;}
}

.brand-actions{display:flex;align-items:center;gap:8px;}
.mobile-menu-btn,.mobile-drawer-close,.mobile-nav-backdrop{display:none;}

@media (max-width:900px){
  html{width:100%;height:auto;min-height:100%;overflow-x:hidden;overflow-y:visible;overscroll-behavior-y:auto;}
  body{width:100%;height:auto;min-height:100%;overflow:visible;overscroll-behavior-y:auto;}
  .container{display:block;width:100%;height:auto;min-height:100dvh;}

  /* Off-canvas server catalog */
  .sidebar{
    position:fixed;z-index:3200;top:0;bottom:0;left:0;
    width:min(88vw,360px);max-width:360px;height:100dvh;max-height:none;
    transform:translateX(-104%);transition:transform .22s ease;
    box-shadow:24px 0 70px rgba(0,0,0,.62);border-right:1px solid #293241;
  }
  body.mobile-nav-open .sidebar{transform:translateX(0);}
  .sidebar .brand{flex:0 0 auto;padding:16px 14px 14px;}
  .sidebar .brand-row{display:grid;grid-template-columns:1fr;gap:10px;}
  .sidebar .brand-actions{width:100%;gap:6px;}
  .sidebar .sort-pill{flex:1;min-width:0;max-width:none;height:36px;}
  .sidebar .search-box{flex:0 0 auto;margin:12px 12px 10px;height:44px;}
  .sidebar #nav{min-height:0;flex:1;padding:0 8px 18px;overflow-y:auto;overscroll-behavior:contain;}
  .sidebar .group-header{min-height:42px;margin-top:7px;}
  .sidebar .item{min-height:42px;margin:3px 5px;padding:8px 10px;font-size:14px;}

  .mobile-drawer-close{
    display:inline-flex;align-items:center;justify-content:center;
    width:36px;height:36px;min-height:36px;padding:0;border-radius:9px;font-size:24px;line-height:1;
  }
  .mobile-nav-backdrop{
    display:block;position:fixed;z-index:3100;inset:0;width:100%;height:100%;padding:0;border:0;border-radius:0;
    background:rgba(2,5,10,.66);backdrop-filter:blur(3px);opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .2s ease,visibility .2s ease;
  }
  body.mobile-nav-open .mobile-nav-backdrop{opacity:1;visibility:visible;pointer-events:auto;}
  .mobile-nav-backdrop:hover,.mobile-nav-backdrop:focus{background:rgba(2,5,10,.66);border:0;outline:0;color:transparent;}

  /* Native page scrolling keeps pull-to-refresh available */
  .main{width:100%;height:auto;min-height:100dvh;padding:0 0 28px;overflow:visible;overscroll-behavior:auto;-webkit-overflow-scrolling:auto;}
  .content{width:100%;max-width:none;margin:0;padding:0;}

  /* Mobile header */
  .topbar{
    position:sticky;top:0;z-index:90;min-height:58px;height:auto;margin:0 0 10px;padding:9px 12px;
    display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:8px;
    background:rgba(10,15,23,.94);border-bottom:1px solid #202837;backdrop-filter:blur(12px);
  }
  .mobile-menu-btn{display:inline-flex;width:42px;height:40px;min-height:40px;padding:0 11px;flex-direction:column;justify-content:center;gap:4px;}
  .mobile-menu-btn span{display:block;width:100%;height:2px;border-radius:2px;background:#edf1f7;}
  .breadcrumbs{font-size:12px;line-height:1.25;}
  .top-actions-inline{display:flex;justify-content:flex-end;gap:6px;flex-wrap:nowrap;}
  .top-actions-inline .monkey-btn{width:38px;min-width:38px;height:38px;min-height:38px;padding:0;border-radius:9px;}
  .top-actions-inline .monkey-btn > span:last-child{display:none;}
  .top-actions-inline .shake-icon{font-size:16px;}
  .toolbar{margin:0 12px 10px;padding:0;align-items:flex-start;}
  .toolbar h2{font-size:21px;line-height:1.18;overflow-wrap:anywhere;}
  .title-sync-meta{margin-left:8px;max-width:42%;}
  .title-sync-meta .plan-updated{white-space:normal;text-align:right;font-size:10px;}

  /* Edge-to-edge server details */
  #details{width:100%;margin:0;border-left:0;border-right:0;border-radius:0;box-shadow:none;overflow:hidden;}
  .table{display:block;width:100%;margin:0;border-radius:0;}
  .table > tbody{display:block;width:100%;}
  .table > tbody > tr{display:block;width:100%;border-top:1px solid rgba(37,43,54,.86);}
  .table > tbody > tr:first-child{border-top:0;}
  .table > tbody > tr > th,.table > tbody > tr > td{
    display:block;width:100% !important;min-width:0 !important;max-width:none !important;box-sizing:border-box;border:0;
  }
  .table > tbody > tr > th,.table > tbody > tr:hover > th{
    padding:8px 12px;text-align:left;border:0;border-bottom:1px solid rgba(123,23,48,.34);
    background:linear-gradient(90deg,rgba(123,23,48,.68),rgba(123,23,48,.24));
    font-size:12px;line-height:1.2;letter-spacing:.035em;text-transform:uppercase;
  }
  .table > tbody > tr > td,.table > tbody > tr:hover > td{padding:11px 12px 13px;background:rgba(17,22,31,.44);overflow:visible;}

  /* Badge spacing: Location, Node type, Software and generic rows */
  .badges,#locRow.badges.sel-badges,#ntRow.badges.sel-badges,#osCell.badges{
    display:flex !important;flex-wrap:wrap;align-items:center;column-gap:10px;row-gap:8px;width:100% !important;
  }
  #locRow .badge.location,#ntRow.badges.sel-badges .badge,#osCell .badge.os{margin:0 !important;flex:0 0 auto;}
  .badge{max-width:100%;white-space:normal;overflow-wrap:anywhere;}
  .dimensions-row{grid-template-columns:1fr 1fr;gap:8px;}
  .dimension-item.dimension-card.is-count{grid-column:1 / -1;}

  /* CPU benchmark: one compact horizontal row */
  .cpu-card{padding:10px 12px;}
  .cpu-headline{margin-bottom:9px;}
  .cpu-card .cpu-scores{gap:8px;}
  .cpu-card .cpu-scores > .score-box{width:0;min-width:0;}
  .cpu-card .cpu-scores > .divider{min-height:58px;}
  .cpu-card .score-box .label{margin-bottom:3px;font-size:12px;line-height:1.15;white-space:nowrap;}
  .cpu-card .score-box .value{margin-bottom:6px;font-size:26px;line-height:1;font-weight:900;}
  .cpu-card .segbar{display:flex;gap:3px;min-width:0;}
  .cpu-card .segbar .seg{flex:1 1 0;width:auto;min-width:8px;max-width:18px;height:6px;}
  .cpu-meta{gap:6px;margin-top:9px;}

  /* Split desktop sections stack on mobile */
  .network-grid,.gpu-split,.drives-grid{grid-template-columns:1fr;gap:12px;}
  .network-main,.gpu-split > div:first-child,.drives-main{padding-right:0;}
  .network-adapters,.gpu-split > div:nth-child(2),.drives-variations{
    min-height:0;padding:11px 0 0;border-left:0;border-top:1px solid #252d3a;
  }
  .network-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}
  .network-config-row{padding-bottom:4px;}
  .network-adapter-list{grid-template-columns:1fr;}

  /* RAM configurator */
  .ram-config,.ram-support-head,.ram-choice-grid,.ram-choice-card,.ram-panel,.ram-panel-main,.ram-panel-top,.ram-guide-preview{
    min-width:0;max-width:100%;box-sizing:border-box;
  }
  .ram-config{gap:9px;}
  .ram-support-head,.ram-panel-main{padding:10px;}
  .ram-summary{font-size:14px;margin-bottom:8px;}
  .ram-meta-badges{gap:6px;}
  .ram-choice-grid{width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}
  .ram-choice-card{width:100%;min-height:58px;padding:8px 9px;column-gap:8px;}
  .ram-choice-line{font-size:13px;white-space:normal;line-height:1.2;}
  .ram-choice-spec{padding:2px 6px;font-size:11px;}
  .ram-panel-title b{font-size:16px;}
  .ram-variant-list{
    width:100%;max-width:100%;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    padding:0 0 5px;scrollbar-width:thin;-webkit-overflow-scrolling:touch;
  }
  .ram-variant-btn{flex:0 0 auto;}

  .ram-guide-preview{
    width:100%;margin:0 -2px;padding:8px;overflow-x:auto;overflow-y:hidden;
    overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;
  }
  .ram-guide-preview .dimm-matrix{width:max-content;min-width:max-content;max-width:none;margin-top:0;table-layout:fixed;font-size:12px;}
  .ram-guide-preview .dimm-matrix th,.ram-guide-preview .dimm-matrix td{width:52px;min-width:52px;height:30px;padding:0 4px;}
  .ram-guide-preview .dimm-matrix th:first-child,.ram-guide-preview .dimm-matrix td:first-child{width:88px;min-width:88px;}
  .ram-guide-preview .dimm-matrix th:nth-child(2),.ram-guide-preview .dimm-matrix td:nth-child(2){width:56px;min-width:56px;}
  .dimm-guide-heading{align-items:flex-start;}
  .dimm-guide-heading .badge.image{margin-left:0;}
  .ram-legend{gap:14px;flex-wrap:wrap;}

  .settings-panel,.report-modal-panel,.modal-panel{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);padding:14px;overflow:auto;}
  .settings-row{align-items:flex-start;gap:12px;padding:12px;}
  .modal-head h3{font-size:20px;}

}

/* Phones/tablets can report a CSS viewport wider than 900px.
   Coarse-pointer fallback keeps the phone layout active and preserves native viewport scrolling. */
@media (hover:none) and (pointer:coarse) and (max-width:1100px){
  html{overflow-x:hidden;overflow-y:visible !important;overscroll-behavior-y:auto !important;}
  body{margin:0 !important;padding:0 !important;overflow:visible !important;overscroll-behavior-y:auto !important;}
  .container,.main,.content{width:100% !important;max-width:none !important;margin-left:0 !important;margin-right:0 !important;}
  .main{height:auto !important;min-height:100dvh;padding-left:0 !important;padding-right:0 !important;overflow:visible !important;}
  #details{width:100% !important;margin:0 !important;border-left:0 !important;border-right:0 !important;border-radius:0 !important;box-shadow:none !important;}
  .table{width:100% !important;margin:0 !important;}
  #ntRow{display:flex !important;flex-wrap:wrap !important;column-gap:10px !important;row-gap:8px !important;}
  #ntRow > .badge{margin:0 !important;}
  .cpu-card .cpu-scores{display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;align-items:stretch !important;width:100% !important;}
  .cpu-card .cpu-scores > .score-box{flex:1 1 0 !important;width:0 !important;min-width:0 !important;}
  .cpu-card .cpu-scores > .divider{display:block !important;flex:0 0 1px !important;width:1px !important;min-width:1px !important;height:auto !important;align-self:stretch !important;}
}

@media (max-width:720px){
  .report-meta-grid{grid-template-columns:1fr;}
  .dimensions-row{grid-template-columns:1fr;}
  .dimension-item.dimension-card.is-count{grid-column:auto;}
  .dimension-item.dimension-card{min-height:54px;padding:7px 8px;grid-template-columns:34px minmax(0,1fr) auto;column-gap:8px;}
  .dimension-item.dimension-card.is-count{grid-template-columns:34px minmax(0,1fr);}
  .dimension-icon{width:30px;height:30px;border-radius:7px;}
  .dimension-icon svg{width:21px;height:21px;}
  .dim-value{font-size:14px;}
}

@media (max-width:520px){
  .topbar{padding-left:9px;padding-right:9px;grid-template-columns:40px minmax(0,1fr) auto;gap:6px;}
  .mobile-menu-btn{width:40px;height:38px;min-height:38px;}
  .top-actions-inline{gap:4px;}
  .top-actions-inline .monkey-btn{width:34px;min-width:34px;height:36px;min-height:36px;}
  .breadcrumbs{font-size:11px;}
  .toolbar{margin-left:9px;margin-right:9px;}
  .toolbar h2{font-size:19px;}
  .title-sync-meta{display:none;}

  #locRow.badges.sel-badges,#ntRow.badges.sel-badges,#osCell.badges{gap:7px 8px;}

  .ram-choice-grid{grid-template-columns:1fr;}
  .ram-choice-card{grid-template-columns:18px minmax(0,1fr);min-height:54px;}
  .ram-choice-line{font-size:14px;}
  .ram-choice-more{font-size:10px;}
  .ram-support-head,.ram-panel-main{padding-left:9px;padding-right:9px;}
  .ram-guide-preview{padding:8px 7px 10px;}
  .ram-guide-preview .dimm-matrix th,.ram-guide-preview .dimm-matrix td{width:48px;min-width:48px;padding-left:3px;padding-right:3px;}
  .ram-guide-preview .dimm-matrix th:first-child,.ram-guide-preview .dimm-matrix td:first-child{width:82px;min-width:82px;}
  .ram-guide-preview .dimm-matrix th:nth-child(2),.ram-guide-preview .dimm-matrix td:nth-child(2){width:52px;min-width:52px;}

  .cpu-card{padding:9px 10px;}
  .cpu-card .cpu-scores{gap:7px;}
  .cpu-card .score-box .label{font-size:11px;}
  .cpu-card .score-box .value{font-size:23px;}
  .cpu-card .segbar .seg{max-width:15px;height:6px;}

  .report-type-row{display:grid;grid-template-columns:1fr 1fr;}
  .settings-row{display:grid;grid-template-columns:minmax(0,1fr) auto;}
}

/* === Compact drive capacity / configuration visualizer === */
.drives-grid{
  grid-template-columns:minmax(390px,.95fr) minmax(360px,1.05fr);
}
.drives-main{padding-right:20px;}
.drives-variations{padding-left:20px;min-height:0;}
.drives-total{
  display:flex;align-items:baseline;gap:6px;margin-bottom:8px;
  color:#b9c3d2;font-size:13px;font-weight:700;
}
.drives-total strong{color:#f3f6fb;font-size:18px;line-height:1;}
.drive-type-list{
  border:1px solid #2d3542;border-radius:10px;overflow:hidden;background:#111822;
}
.drive-type-row{
  display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;align-items:center;
  padding:8px 10px;border-bottom:1px solid #29313d;min-width:0;
}
.drive-type-row:last-child{border-bottom:0;}
.drive-type-icon{
  width:32px;height:32px;display:block;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.2));
}
.drive-type-icon-fallback{
  display:flex;align-items:center;justify-content:center;border:1px solid #445064;border-radius:7px;
  color:#dfe7f2;background:#19222f;font-size:9px;font-weight:900;
}
.drive-type-body{min-width:0;}
.drive-type-head{
  display:flex;align-items:center;gap:7px;min-width:0;margin-bottom:6px;line-height:1.1;
}
.drive-type-name{color:#eef3f9;font-size:13px;font-weight:850;white-space:nowrap;}
.drive-status{
  flex:0 0 auto;padding:2px 6px;border:1px solid #3b4656;border-radius:999px;
  color:#bac4d2;background:#1a2230;font-size:10px;font-weight:750;white-space:nowrap;
}
.drive-status.is-hot-swap{color:#74e69a;border-color:rgba(53,211,92,.38);background:rgba(53,211,92,.10);}
.drive-status.is-downtime{color:#ff8e9b;border-color:rgba(251,99,116,.48);background:rgba(251,99,116,.12);}
.drive-type-capacity{display:flex;align-items:center;gap:8px;min-width:0;}
.drive-type-max{margin-left:0;color:#aeb9c8;font-size:11px;white-space:nowrap;}
.drive-type-max strong{color:#f4f7fb;font-size:12px;}
.drive-slots{display:flex;align-items:center;gap:4px;min-width:0;}
.drive-slot{
  display:block;flex:0 0 15px;width:15px;height:12px;border-radius:4px;
  border:1px solid #465366;background:#222c39;box-sizing:border-box;
}
.drive-slot.is-empty{background:#202936;border-color:#465366;box-shadow:inset 0 0 0 1px rgba(255,255,255,.015);}
.drive-slot.is-filled{border-color:transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 10px rgba(0,0,0,.14);}

.drive-slot.drive-generic.is-filled{background:#8b98a9;}

/* Standalone drive list: keep the content compact when no variations exist. */
.drives-main.is-standalone{padding-right:0;}

.drives-variations .section-title{margin:0 0 8px;color:#eef3f9;font-size:13px;font-weight:850;}
.drive-variation-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;
}
.drive-variation-card{
  min-width:0;padding:8px 9px;border:1px solid #303a48;border-radius:9px;background:#121a24;
}
.drive-variation-card .drive-slots{margin-bottom:6px;}
.drive-slots.is-compact{gap:3px;}
.drive-slots.is-compact .drive-slot{flex-basis:13px;width:13px;height:11px;border-radius:3px;}
.drive-variation-name{
  color:#e9eef5;font-size:11px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.drive-variation-fallback{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.drive-variation-fallback .badge.disk-variation{font-size:11px;padding:5px 8px;}

@media (max-width:1100px){
  .drives-grid{grid-template-columns:minmax(330px,.9fr) minmax(300px,1.1fr);}
  .drive-slot{flex-basis:13px;width:13px;height:11px;}
  .drive-slots.is-compact .drive-slot{flex-basis:11px;width:11px;height:10px;}
}

@media (max-width:760px){
  .drives-grid{grid-template-columns:1fr;gap:10px;}
  .drives-main{padding-right:0;}
  .drives-variations{padding:10px 0 0;border-left:0;border-top:1px solid #252d3a;}
  .drive-variation-grid{grid-template-columns:1fr 1fr;}
  .drive-type-row{grid-template-columns:34px minmax(0,1fr);padding:7px 8px;gap:8px;}
  .drive-type-icon{width:28px;height:28px;}
  .drive-type-capacity .drive-type-max{margin-left:auto;}
}


@media (max-width:520px){
  .drive-variation-grid{grid-template-columns:1fr;}
  .drive-type-head{flex-wrap:wrap;}
  .drive-type-capacity .drive-type-max{margin-left:auto;}
}

/* Drive max value: keep it directly after the final slot on every viewport. */
.drive-type-capacity{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  justify-content:flex-start;
  width:max-content;
  max-width:100%;
}
.drive-type-capacity > .drive-slots{
  flex:0 0 auto;
}
.drive-type-capacity > .drive-type-max{
  flex:0 0 auto;
  margin-left:2px;
}
@media (max-width:760px){
  .drive-type-capacity > .drive-type-max{margin-left:2px;}
}
@media (max-width:520px){
  .drive-type-capacity > .drive-type-max{margin-left:2px;}
}


/* === Settings: section visibility + RAM preview === */
.settings-panel{width:min(660px,calc(100vw - 34px));}
.settings-section{padding:4px 0 2px;}
.settings-section-head{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;}
.settings-section-head b,.settings-copy b{color:#eef2f8;font-size:15px;font-weight:900;}
.settings-section-head span,.settings-copy span{color:#9faaba;font-size:13px;line-height:1.45;}
.settings-toggle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
.settings-toggle-item{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border:1px solid #293241;border-radius:9px;background:#111821;color:#e6ebf3;font-size:14px;font-weight:800;cursor:pointer;}
.settings-toggle-item:hover{border-color:#384456;background:#151d28;}
.settings-toggle-item>.switch-control{flex:0 0 auto;}
.settings-divider{height:1px;margin:16px 0;background:#293241;}
.settings-row.settings-ram-preview{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;padding:0;border:0;background:transparent;}
.settings-copy{display:flex;flex-direction:column;gap:4px;min-width:0;}
.settings-note{margin:14px 0 0;color:#7f8a99;font-size:12px;}

@media (max-width:700px){
  .settings-toggle-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:460px){
  .settings-toggle-grid{grid-template-columns:1fr;}
  .settings-row.settings-ram-preview{gap:12px;}
}


/* Network compact mobile tuning */
@media (max-width:520px){
  .network-metrics{gap:7px;}
  .network-metric-card{min-height:68px;padding:8px 9px;gap:8px;}
  .network-metric-icon{width:34px;height:34px;flex-basis:34px;}
  .network-metric-icon svg{width:22px;height:22px;}
  .network-metric-label{font-size:9.5px;}
  .network-metric-copy strong{font-size:14px;}
  .network-metric-copy small{font-size:10.5px;}
  .network-config-row{gap:7px;margin-top:8px;padding-top:8px;}
  .network-config-label,.network-config-os{font-size:12px;}
  .network-config-os img{width:20px;height:20px;}
  .network-config-btn{height:30px;padding:0 9px;font-size:12px;}
}

/* Compact platform BMC console indicator, matching existing badge height. */
.platform-bmc{display:inline-flex;align-items:center;gap:6px;min-height:25px;padding:3px 7px;border:1px solid #293747;border-radius:6px;background:#121b27;color:#dce7f5;font-size:12px;font-weight:750;line-height:1.2;white-space:nowrap;vertical-align:middle;}
.platform-bmc svg{width:16px;height:16px;flex:0 0 16px;color:#4daeff;}
.platform-bmc-label{margin-right:2px;}
.platform-bmc-type{display:inline-flex;align-items:center;justify-content:center;min-height:19px;padding:1px 6px;border:1px solid;border-radius:5px;font-size:11px;font-weight:800;line-height:1.1;}
.platform-bmc-type.is-html5{color:#a5f3b2;background:#163c28;border-color:#2d7e49;}
.platform-bmc-type.is-java{color:#dac6ff;background:#38265d;border-color:#6e4ba6;}
@media(max-width:520px){.platform-bmc{max-width:100%;flex-wrap:wrap;white-space:normal;}}

/* Network icons are external SVG files in assets/icons/ui. */
.network-metric-icon img{display:block;width:27px;height:27px;object-fit:contain;flex-shrink:0;}
.network-adapter-icon img{display:block;width:19px;height:19px;object-fit:contain;flex-shrink:0;}
@media(max-width:520px){.network-metric-icon img{width:22px;height:22px;}}

/* Shared drive bays: single canonical layout (desktop and mobile). */
.drive-slot.drive-m2.is-filled{background:#fb6374;}
.drive-slot.drive-u2.is-filled,.drive-slot.drive-u3.is-filled,.drive-slot.drive-u23.is-filled{background:#9579ff;}
.drive-slot.drive-ssd.is-filled{background:#32b5d9;}
.drive-slot.drive-hdd.is-filled{background:#24d39b;}
.drive-type-icon{width:34px;height:38px;filter:none;}
.drive-exclusive-group{position:relative;min-width:0;margin:5px 7px;border:1px solid #344767;border-radius:10px;padding:3px 0 3px 43px;background:rgba(33,48,75,.13);overflow:visible;}
.drive-exclusive-group::before{content:"";position:absolute;left:22px;top:20px;bottom:20px;width:10px;border:1.5px solid #589bea;border-right:0;border-radius:8px 0 0 8px;}
.drive-exclusive-group .drive-type-row{border:0;padding:7px 9px;grid-template-columns:38px minmax(0,1fr);}
.drive-exclusive-group .drive-type-row:last-child{border-bottom:0;}
.drive-exclusive-or{position:relative;display:flex;align-items:center;gap:8px;padding:3px 8px 3px 9px;color:#edbb56;white-space:normal;font-size:10px;line-height:1.35;font-weight:750;letter-spacing:0;}
.drive-exclusive-or::before{content:"OR";position:absolute;left:-35px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:27px;height:27px;border:1.5px solid #589bea;border-radius:50%;background:#142339;color:#c5ddff;font-size:10px;}
.drive-exclusive-or span{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border:1px solid rgba(237,187,86,.28);background:rgba(237,187,86,.07);border-radius:7px;}
.drive-exclusive-or span::before{content:"!";display:grid;place-items:center;width:14px;height:14px;border:1.5px solid currentColor;border-radius:50%;font-size:10px;flex-shrink:0;}
@media(max-width:520px){
  .drive-type-icon{width:28px;height:34px;}
  .drive-exclusive-group{padding-left:37px;margin:4px;}
  .drive-exclusive-group::before{left:19px;}
  .drive-exclusive-group .drive-type-row{grid-template-columns:30px minmax(0,1fr);padding:7px 5px;gap:7px;}
  .drive-exclusive-or{padding-left:5px;font-size:9px;}
  .drive-exclusive-or::before{left:-31px;width:24px;height:24px;}
}