:root {
  color-scheme: dark;
  --bg: #02040a;
  --panel: rgba(4, 10, 20, .96);
  --panel-soft: rgba(8, 15, 29, .9);
  --line: rgba(25, 223, 255, .62);
  --line-soft: rgba(25, 223, 255, .2);
  --cyan: #19dfff;
  --cyan-soft: #8eeeff;
  --pink: #ff4edd;
  --purple: #a82be2;
  --green: #54ff9f;
  --amber: #ffc14a;
  --red: #ff5577;
  --text: #d8f4ff;
  --muted: #7190a5;
  --gap: 10px;
  --header-height: 102px;
  --panel-header: 32px;
  --cockpit-left: 12px;
  --cockpit-right: calc(100vw - 12px);
  --cockpit-top: 12px;
  --cockpit-bottom: calc(100vh - 34px);
}

* { box-sizing: border-box; }

html { min-width: 1320px; background: var(--bg); }

body {
  margin: 0;
  min-width: 1320px;
  min-height: 0;
  overflow-x: auto;
  overflow-y: auto;
  color: var(--text);
  background:
    radial-gradient(circle at 50% -20%, rgba(20, 75, 118, .28), transparent 43%),
    radial-gradient(circle at 9% 62%, rgba(255, 78, 221, .08), transparent 30%),
    radial-gradient(circle at 91% 62%, rgba(25, 223, 255, .07), transparent 30%),
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(80, 170, 220, .018) 3px 4px),
    #02040a;
  font-family: Consolas, "Lucida Console", "Courier New", monospace;
  font-size: 12px;
}

button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible {
  outline: 1px solid var(--pink);
  outline-offset: 2px;
}

#grid-shell {
  position: relative;
  width: min(1888px, calc(100vw - 24px));
  min-width: 1296px;
  margin: 12px auto 0;
}

body.grid-pseudo-fullscreen { overflow: hidden; }
body.grid-pseudo-fullscreen #grid-shell { position: fixed; inset: 0; z-index: 100; width: 100%; margin: 0; }
body.grid-pseudo-fullscreen #grid-cockpit { height: calc(100vh - 23px); border-radius: 0; }

#grid-cockpit {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-rows: var(--header-height) minmax(0, 1fr);
  gap: var(--gap);
  width: 100%;
  height: clamp(820px, calc(100vh - 36px), 1120px);
  padding: 8px;
  overflow: hidden;
  border: 1px solid rgba(25, 223, 255, .52);
  border-radius: 5px;
  background: rgba(1, 4, 10, .92);
  box-shadow: 0 0 0 1px rgba(255, 78, 221, .12), 0 0 35px rgba(22, 135, 190, .14), inset 0 0 50px rgba(14, 59, 87, .12);
}

#grid-cockpit::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(25, 223, 255, .025), transparent);
}

.grid-header {
  display: grid;
  grid-template-columns: minmax(330px, .95fr) minmax(320px, .9fr) minmax(300px, .84fr) minmax(400px, 1.28fr);
  grid-template-rows: var(--header-height);
  align-items: start;
  gap: var(--gap);
  min-width: 0;
  min-height: 0;
}
.grid-header { position: relative; z-index: 3; }
.grid-header > .identity-directory-cluster { grid-column: 1 / 3; height: 100%; }
.grid-header > .time-console { grid-column: 4; height: 100%; }

.header-module,
.panel,
.side-drawer {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: linear-gradient(145deg, rgba(8, 17, 30, .97), rgba(3, 8, 16, .98));
  box-shadow: inset 0 0 20px rgba(18, 109, 154, .07), 0 0 11px rgba(25, 223, 255, .07);
}

.header-module::after,
.panel::after {
  content: "";
  position: absolute;
  inset: 3px;
  pointer-events: none;
  border: 1px solid rgba(255, 78, 221, .055);
}

.identity-directory-cluster { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: var(--gap); min-width: 0; }
.identity-directory-cluster .system-directory-panel { order: 1; }
.identity-directory-cluster .forteca-identity-panel { order: 2; }
.system-directory-panel { display: grid; grid-template-rows: 18px minmax(0,1fr); min-width: 0; padding: 4px 6px; overflow: visible; }
.system-directory-panel > header { display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid rgba(25,223,255,.18);color:var(--cyan);font-size:7px;letter-spacing:.5px; }
.system-directory-panel > header span { color:#718da0;font-size:6px; }
.system-directory { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 2px 5px; padding-top: 3px; }
.system-link {
  position: relative;
  display: grid;
  grid-template-rows: auto auto;
  align-content: center;
  min-width: 0;
  height: auto;
  min-height: 0;
  padding: 0 3px;
  overflow: visible;
  border: 0;
  border-left: 2px solid color-mix(in srgb, var(--system-color) 75%, transparent);
  color: #8ba5b5;
  background: rgba(20, 50, 70, .13);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.system-link-main { display:flex;align-items:center;justify-content:space-between;gap:3px;min-width:0; }
.system-link b { color: var(--system-color); font-size: 8px; letter-spacing: .3px; text-shadow:0 0 7px color-mix(in srgb,var(--system-color) 55%,transparent); }
.system-link em { color:#778b98;font-size:5.5px;font-style:normal;white-space:nowrap; }
.system-link em.is-online { color:var(--green); }.system-link em.is-offline { color:var(--red); }.system-link em.is-active { color:var(--amber); }
.system-link small { overflow:hidden;color:#778d9b;font-size:5.5px;line-height:1.1;white-space:nowrap;text-overflow:ellipsis; }
.system-link:hover { border-left-color: var(--system-color); background: color-mix(in srgb,var(--system-color) 10%,transparent); }
.system-link.is-locked { opacity: .5; }
.system-link.is-unavailable { border-left-color: #5d5871; }
.system-link[data-tooltip]::after,.hub-link-grid [data-tooltip]::after { content:attr(data-tooltip);position:absolute;z-index:50;left:0;display:none;width:240px;padding:6px 7px;border:1px solid var(--system-color,var(--cyan));color:#dff8ff;background:#030914;box-shadow:0 5px 18px #000;font-size:8px;line-height:1.35;white-space:normal;pointer-events:none; }
.system-link[data-tooltip]::after { top:calc(100% + 4px); }.hub-link-grid [data-tooltip]::after { bottom:calc(100% + 4px); }
.system-link[data-tooltip]:hover::after,.system-link[data-tooltip]:focus-visible::after,.hub-link-grid [data-tooltip]:hover::after,.hub-link-grid [data-tooltip]:focus-visible::after { display:block; }
.forteca-identity-panel { display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:8px;min-width:0;padding:8px;overflow:hidden; }
.forteca-identity-panel img { width:90px;max-height:54px;object-fit:contain;filter:drop-shadow(0 0 8px rgba(25,223,255,.45)); }
.forteca-identity-panel div { display:grid;align-content:center;min-width:0; }
.forteca-identity-panel small { overflow:hidden;color:#e9aee5;font-size:5.5px;white-space:nowrap;text-overflow:ellipsis; }
.forteca-identity-panel strong { color:#fff;font-size:17px;letter-spacing:1px;text-shadow:0 0 9px var(--cyan); }
.forteca-identity-panel span { color:var(--cyan);font-size:13px;font-weight:900;letter-spacing:2px; }
.forteca-identity-panel em { overflow:hidden;color:#7f9bad;font-size:6px;font-style:normal;white-space:nowrap;text-overflow:ellipsis; }


.power-toggle { display: grid; justify-items: center; gap: 4px; padding: 7px 4px; border: 1px solid rgba(84, 255, 159, .5); border-radius: 3px; color: #71918a; background: rgba(3, 13, 16, .8); cursor: pointer; }
.power-toggle i { display: block; width: 26px; height: 12px; border: 1px solid #456; border-radius: 8px; background: #07101a; }
.power-toggle i::after { content: ""; display: block; width: 8px; height: 8px; margin: 1px; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px var(--green); transform: translateX(14px); transition: transform .18s ease; }
.power-toggle span, .power-toggle b { font-size: 8px; }
.power-toggle b { color: var(--green); }
.power-toggle:not(.is-on) i::after { transform: translateX(0); background: #777; box-shadow: none; }
.power-toggle:not(.is-on) b { color: #777; }
.time-console { display: grid; grid-template-rows: 27px minmax(0,1fr); align-items: stretch; gap: 4px; padding: 5px 6px; overflow: hidden; }
.age-console { display:grid;grid-template-columns:minmax(0,1fr) 112px;gap:5px;min-width:0;padding-bottom:3px;border-bottom:1px solid rgba(255,78,221,.28); }
.forteca-age { display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:center;gap:3px;min-width:0; }
.forteca-age span { color: #94acbd; font-size: 7px; white-space: nowrap; }
.forteca-age b { color: var(--pink); font-size: 11px; }
.age-actions { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 3px; min-width: 0; }
.age-actions .power-toggle { grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 1fr 1fr; align-items: center; gap: 0 2px; min-width: 0; padding: 1px 3px; }
.age-actions .power-toggle span, .age-actions .power-toggle b { justify-self: start; font-size: 6.5px; line-height: 1; }
.age-actions .power-toggle i { grid-column: 2; grid-row: 1 / 3; width: 23px; height: 11px; }
.age-actions .power-toggle i::after { width: 7px; height: 7px; transform: translateX(12px); }
.age-actions .power-toggle:not(.is-on) i::after { transform: translateX(0); }
.clock-countdown-line { display:grid;grid-template-columns:repeat(4,minmax(0,.72fr)) repeat(3,minmax(0,1.35fr));gap:3px;min-width:0;min-height:0;overflow:hidden; }
.world-clocks,.countdown-console { display:contents; }
.world-clocks div { display: grid; place-content: center; padding: 2px; border: 1px solid rgba(25, 223, 255, .16); background: rgba(13, 35, 50, .2); text-align: center; }
.world-clocks small { color: #a8bbca; font-size: 7px; letter-spacing: .1px; }
.world-clocks b { color: var(--cyan); font-size: 17px; line-height:1;font-weight: 700; }
.world-clocks div:nth-child(2n) b { color: var(--pink); }
.countdown-item { display:grid;grid-template-rows:auto 1fr;place-items:center;min-width:0;padding:2px 3px;border-left:2px solid rgba(255,78,221,.55);background:linear-gradient(90deg,rgba(255,78,221,.07),rgba(25,223,255,.025)); }
.countdown-item small { overflow: hidden; color: #e4c0e7; font-size: 7px; letter-spacing: .35px; white-space: nowrap; text-overflow: ellipsis; }
.countdown-item span { display:none; }
.countdown-item b { max-width:100%;overflow:hidden;color:var(--amber);font-size:13px;line-height:1;letter-spacing:-.7px;white-space:nowrap; }
.countdown-item.is-complete b { color: var(--green); }
#fullscreen-toggle { display: grid; grid-template-columns: 13px minmax(0, 1fr); place-items: center; gap: 1px; width: 100%; height: 25px; padding: 1px 3px; border: 1px solid rgba(25,223,255,.44); color: var(--cyan); background: rgba(7,26,40,.82); cursor: pointer; }
#fullscreen-toggle i { font-size: 10px; } #fullscreen-toggle span { font-size: 6.5px; }
#fullscreen-toggle[aria-pressed="true"] { color: var(--green); border-color: var(--green); }

.grid-body {
  display: grid;
  grid-template-columns: minmax(330px, .95fr) minmax(320px, .9fr) minmax(300px, .84fr) minmax(400px, 1.28fr);
  gap: var(--gap);
  min-width: 0;
  min-height: 0;
}
.grid-body > .column-media { padding-top: 0; }

.column { display: flex; flex-direction: column; gap: var(--gap); min-width: 0; min-height: 0; }
.panel { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
.fill-panel { flex: 1 1 0; }
.panel-header {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  flex: 0 0 var(--panel-header);
  gap: 7px;
  min-width: 0;
  height: var(--panel-header);
  padding: 0 6px 0 9px;
  border-bottom: 1px solid var(--line-soft);
  background: linear-gradient(90deg, rgba(8, 41, 57, .84), rgba(12, 14, 34, .75));
}
.panel-header::before { content: ""; width: 3px; height: 13px; flex: 0 0 3px; background: var(--pink); box-shadow: 0 0 7px var(--pink); }
.panel-header h2 { min-width: 0; margin: 0; overflow: hidden; color: var(--cyan); font-size: 13px; line-height: 1; letter-spacing: .65px; white-space: nowrap; text-overflow: ellipsis; text-shadow: 0 0 8px rgba(25,223,255,.35); }
.panel-body { position: relative; z-index: 1; flex: 1 1 auto; min-height: 0; }
.panel-toggle { width: 20px; height: 20px; margin-left: auto; padding: 0; flex: 0 0 20px; border: 1px solid rgba(25, 223, 255, .35); color: var(--cyan); background: rgba(2, 8, 15, .7); cursor: pointer; }
.panel.is-collapsed { flex: 0 0 var(--panel-header); min-height: var(--panel-header); max-height: var(--panel-header); align-self: stretch; }
.panel.is-collapsed .panel-body { display: none; }
.panel.is-collapsed .panel-header { border-bottom: 0; }
.panel.is-collapsed .panel-toggle { color: var(--pink); }
.header-status { margin-left: auto; overflow: hidden; color: #a9bfcc; font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }
.header-action { margin-left: auto; color: var(--pink); font-size: 10px; text-decoration: none; }
.button-action { padding: 2px 4px; border: 1px solid rgba(255, 78, 221, .35); background: transparent; cursor: pointer; }

.network-panel { height: 100%; }
.network-panel.is-collapsed { height: var(--panel-header); }
.network-meta { display: flex; gap: 7px; margin-left: auto; color: #91a8b8; font-size: 9px; }
.network-meta b { color: var(--green); font-weight: 500; }
.network-body { padding: 7px 8px 10px; overflow-y: auto; scrollbar-color: rgba(25, 223, 255, .45) transparent; scrollbar-width: thin; }
.server-group { margin-bottom: 7px; border-left: 3px solid currentColor; background: rgba(30, 55, 78, .11); }
.server-group.tone-pink { color: var(--pink); background: rgba(255, 78, 221, .055); }
.server-group.tone-cyan { color: var(--cyan); background: rgba(25, 223, 255, .045); }
.server-group.tone-purple { color: #c66bff; background: rgba(168, 43, 226, .055); }
.server-group-title { display: flex; align-items: center; width: 100%; height: 24px; padding: 0 7px; border: 0; color: inherit; background: rgba(3, 9, 18, .36); text-align: left; cursor: pointer; }
.server-group-title span { font-size: 13px; font-weight: 900; letter-spacing: .5px; }
.server-group-title small { margin-left: auto; color: #e09dcf; font-size: 9px; }
.server-group-title b { margin-left: 7px; transition: transform .18s ease; }
.server-group.is-folded .server-group-title b { transform: rotate(-90deg); }
.server-group.is-folded .server-list { display: none; }
.server-list { display: grid; }
.server-row {
  display: grid;
  grid-template-columns: 9px 19px minmax(0, 1fr) 56px 46px 53px;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-height: 25px;
  padding: 2px 6px;
  border: 0;
  border-top: 1px solid rgba(90, 130, 155, .07);
  color: #91a8b7;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.server-row:hover, .server-row.is-selected { color: var(--text); background: rgba(25, 223, 255, .08); }
.server-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 19px;
  width: 19px;
  height: 18px;
  overflow: hidden;
  color: var(--cyan);
  font-family: "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
  font-size: 12px;
  line-height: 1;
}
.server-icon-infinity {
  color: #19dfff;
  font-family: Consolas, monospace;
  font-size: 16px;
  font-weight: 900;
  animation: serverInfinityGlow 5s ease-in-out infinite;
}
.server-name { display: flex; align-items: center; gap: 5px; min-width: 0; }
.server-name b { overflow: hidden; font-size: 12px; white-space: nowrap; text-overflow: ellipsis; }
.server-flags { display: flex; align-items: center; gap: 3px; color: var(--cyan); font-size: 9px; }
.server-flags .flag-pvp { color: var(--pink); } .server-flags .flag-pve { color: var(--green); } .server-flags .flag-skull { color: var(--red); } .server-flags .flag-locked { color: var(--amber); }
.status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #667; box-shadow: 0 0 5px currentColor; }
.status-dot.is-online { color: var(--green); background: currentColor; }
.status-dot.is-offline { color: var(--red); background: currentColor; }
.status-dot.is-checking { color: var(--amber); background: currentColor; animation: blink 1.2s ease-in-out infinite; }
.server-day, .server-players { color: #b1c2ce; font-size: 10px; text-align: right; }
.server-day { color: var(--amber); }
.server-status { color: var(--amber); font-size: 10px; text-align: right; }
.server-row.is-online .server-status { color: var(--green); }
.server-row.is-offline .server-status { color: var(--red); }
.server-icon-legend { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px 7px; margin: 8px 0; padding: 7px; border: 1px solid rgba(25,223,255,.25); background: rgba(3,14,25,.75); color: #b2c5d3; font-size: 9px; }
.server-icon-legend span { display: flex; align-items: center; gap: 4px; white-space: nowrap; }
.server-icon-legend i, .server-icon-legend b { min-width: 14px; color: var(--cyan); text-align: center; }
.realm-detail { padding: 8px; border: 1px solid rgba(255, 78, 221, .24); background: rgba(16, 7, 22, .68); }
.realm-detail > div:first-child { display: flex; justify-content: space-between; gap: 8px; }
.realm-detail strong { color: var(--pink); font-size: 12px; }
.realm-detail button { padding: 2px 6px; border: 1px solid rgba(25, 223, 255, .3); color: var(--cyan); background: transparent; cursor: pointer; }
.realm-detail button:disabled { opacity: .4; cursor: default; }
.realm-detail p { min-height: 26px; margin: 6px 0; color: #b5c7d2; font-size: 11px; line-height: 1.35; }
.realm-detail dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; margin: 0; }
.realm-detail dl div { padding: 4px; border: 1px solid rgba(25, 223, 255, .1); }
.realm-detail dt { color: #8ba1b1; font-size: 9px; }
.realm-detail dd { margin: 2px 0 0; color: var(--cyan-soft); font-size: 11px; }

.search-panel { flex: 0 0 72px; }
.search-panel.is-collapsed { flex-basis: var(--panel-header); }
.search-system-actions { display:flex;align-items:center;gap:4px;margin-left:auto; }
.search-system-actions a { display:grid;place-items:center;min-width:62px;height:23px;padding:0 8px;border:1px solid rgba(25,223,255,.4);color:var(--cyan);background:rgba(6,26,40,.86);font-size:11px;font-weight:900;text-decoration:none; }
.search-system-actions a:first-child { color:var(--pink);border-color:rgba(255,78,221,.48); }.search-system-actions a:hover { color:#fff;box-shadow:inset 0 -2px currentColor; }
.search-body { display: grid; align-items: center; padding: 6px; }
.search-body form { display: grid; grid-template-columns: minmax(0, 1fr) 68px; gap: 5px; }
.search-body input { min-width: 0; height: 26px; padding: 0 8px; border: 1px solid rgba(25, 223, 255, .35); color: var(--text); background: rgba(0, 4, 10, .8); }
.search-body button { border: 1px solid rgba(255, 78, 221, .42); color: var(--pink); background: rgba(35, 10, 35, .7); cursor: pointer; }

.runix-panel { flex: 0 0 auto; }
.runix-body { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 6px; padding: 8px; overflow: hidden; }
.runix-access-form { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 5px; min-width: 0; }
.runix-access-form label { color: var(--cyan); font-size: 9px; font-weight: 700; }
.runix-access-form input { min-width: 0; height: 26px; padding: 0 7px; border: 1px solid rgba(25,223,255,.35); color: var(--text); background: #030914; }
.runix-access-form button { height: 26px; padding: 0 8px; border: 1px solid rgba(255,78,221,.5); color: var(--pink); background: rgba(54,12,55,.42); cursor: pointer; }
.runix-access-note { margin: 0; color: #9fb4c1; font-size: 9px; line-height: 1.35; }
.runix-access-note.is-error { color: var(--red); }.runix-access-note.is-ok { color: var(--green); }
.community-panel { flex: 0 0 auto; }
.community-body { display: grid; grid-template-columns: 118px minmax(0,1fr); gap: 6px; padding: 6px; }
.community-signal-panel { flex: 0 0 88px; }
.community-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; margin:7px 0; }
.community-metrics span { padding:5px; border:1px solid rgba(25,223,255,.18); color:#8da7b6; font-size:7px; }
.community-metrics b { display:block; margin-top:3px; color:#e8f8ff; font-size:9px; }
.reserved-panel-copy { margin:0; color:#7894a4; font-size:9px; }
.community-tabs { display: grid; gap: 3px; }
.community-tabs button { border: 1px solid rgba(25,223,255,.24); color: #9cb8c9; background: #06111d; cursor: pointer; font-size: 9px; }
.community-tabs button[aria-selected="true"] { border-color: var(--pink); color: #fff; background: rgba(255,78,221,.12); box-shadow: inset 2px 0 var(--pink); }
.community-view { display: none; min-height: 52px; padding: 8px; border: 1px solid rgba(25,223,255,.18); background: rgba(5,19,30,.62); }
.community-view.is-active { display: block; }.community-view strong { color: var(--cyan); font-size: 10px; }.community-view p { margin: 5px 0 0; color: #a4b9c6; font-size: 9px; line-height: 1.4; }
.pack-catalog { flex: 1 1 auto; min-height: 0; margin: 5px 0; overflow-y: auto; scrollbar-color: rgba(25, 223, 255, .45) transparent; scrollbar-width: thin; }
.pack-section h3 { position: sticky; top: 0; z-index: 1; margin: 0; padding: 5px 6px; border-left: 3px solid var(--purple); color: #d69aff; background: #090b17; font-size: 11px; letter-spacing: .7px; }
.pack-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px; min-height: 39px; padding: 4px 5px; border-bottom: 1px solid rgba(80, 120, 145, .1); }
.pack-row.is-realm-pack { background: linear-gradient(90deg, rgba(25, 223, 255, .11), transparent); box-shadow: inset 2px 0 var(--cyan); }
.pack-row.is-active { box-shadow: inset 2px 0 var(--green); }
.pack-info { display: grid; min-width: 0; gap: 2px; }
.pack-info strong { overflow: hidden; color: #d4e4ec; font-size: 11px; white-space: nowrap; text-overflow: ellipsis; }
.pack-info span { color: #8ba1b1; font-size: 9px; }
.pack-actions { display: flex; gap: 3px; }
.pack-actions button, .runix-launch-row button, .runix-launch-row a, .updater-summary button, .updater-summary a { padding: 3px 6px; border: 1px solid rgba(25, 223, 255, .42); color: var(--cyan); background: rgba(4, 17, 25, .9); font-size: 10px; text-decoration: none; cursor: pointer; }
.pack-actions button:last-child { border-color: rgba(255, 78, 221, .35); color: var(--pink); }
.pack-actions button[aria-pressed="true"] { border-color: var(--green); color: var(--green); }
.runix-launch-row { display: grid; grid-template-columns: 1fr 1fr auto; gap: 4px; flex: 0 0 auto; }
.runix-launch-row button { height: 30px; }
.runix-launch-row a { display: grid; place-items: center; color: var(--pink); border-color: rgba(255, 78, 221, .35); }

.column-media > .advertisement-panel { flex: 0 0 250px; min-height: 250px; max-height: 250px; }
.column-media > .audio-panel { flex: 0 0 150px; max-height: 150px; }
.column-media > .logo-slideshow-panel { flex: 1 1 180px; min-height: 180px; }
.column-media > .panel.is-collapsed { flex-basis: var(--panel-header); }
.column-media > .advertisement-panel.is-collapsed { min-height: var(--panel-header); max-height: var(--panel-header); }

/* The centre Solar module deliberately drops below the compact header row.
   Keep both columns beneath that shared footprint so Search and Advertisement
   align without being covered by the unchanged Solar System renderer. */
@media (min-width:1501px) {
  .grid-body > .column-runix,
  .grid-body > .column-media { padding-top: var(--solar-drop); }
}
.runic-body { padding: 6px; }
.runic-state { display: grid; grid-template-columns: 1fr auto 10px; align-items: center; padding: 4px 6px; border: 1px solid rgba(25, 223, 255, .28); color: #b0c2ce; }
.runic-state span { display: flex; align-items: center; gap: 4px; font-size: 10px; } .runic-state small { color: #7f96a8; font-size: 8px; }
.runic-state strong { color: var(--amber); }
.runic-state strong.is-online { color: var(--green); } .runic-state strong.is-offline { color: var(--red); } .runic-state strong.is-warn { color: var(--amber); }
.runic-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3px; margin-top: 4px; }
.runic-grid div, .network-grid div { display: grid; gap: 2px; min-width: 0; padding: 3px 4px; background: rgba(15, 36, 49, .42); }
.runic-grid span, .network-grid span { color: #89a0b0; font-size: 8px; }
.runic-grid b { overflow: hidden; color: #d1e2e9; font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }
.network-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 3px; margin-top: 4px; }
.network-grid b { color: var(--green); font-size: 10px; }
.runic-health { display: grid; grid-template-columns: auto auto auto minmax(0,1fr); align-items: center; gap: 6px; margin-top: 4px; color: #91a8b7; font-size: 8px; }
.runic-health span { display: flex; align-items: center; gap: 3px; } .runic-health .status-dot { width: 6px; height: 6px; }
.runic-health a { justify-self: end; overflow: hidden; color: var(--amber); font-size: 9px; white-space: nowrap; text-decoration: none; text-overflow: ellipsis; }

.media-body { display: grid; grid-template-columns: 23px minmax(0, 1fr) 23px; grid-template-rows: minmax(0, 1fr) 12px; gap: 3px; padding: 5px; }
.media-stage { position: relative; display: grid; place-items: center; min-width: 0; min-height: 0; overflow: hidden; border: 1px solid rgba(168, 43, 226, .26); background: radial-gradient(circle, rgba(36, 25, 70, .38), #030710 70%); }
.media-stage img, .media-stage video { display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; object-position: center center; }
.media-youtube-frame { display: grid; place-items: center; width: 100%; height: 100%; min-width: 0; min-height: 0; overflow: hidden; background: #000; }
.media-youtube-frame iframe { display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%; border: 0; background: #000; aspect-ratio: 16 / 9; }
.media-placeholder { display: grid; place-items: center; width: 100%; height: 100%; padding: 10px; color: #9f7ab5; text-align: center; text-decoration: none; }
.media-placeholder b { color: var(--pink); }
.media-nav { border: 1px solid rgba(25, 223, 255, .2); color: var(--cyan); background: rgba(4, 15, 24, .8); cursor: pointer; }
.media-dots { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; gap: 4px; }
.media-dots button { width: 5px; height: 5px; padding: 0; border: 0; border-radius: 50%; background: #38556a; cursor: pointer; }
.media-dots button.is-active { background: var(--pink); box-shadow: 0 0 6px var(--pink); }

.logo-slideshow-body { display:grid;grid-template-columns:25px minmax(0,1fr) 25px;grid-template-rows:minmax(0,1fr) 14px;gap:4px;padding:6px; }
.logo-stage { position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto;place-items:center;min-width:0;min-height:0;margin:0;overflow:hidden;border:1px solid rgba(25,223,255,.22);background:radial-gradient(circle,rgba(50,20,69,.34),rgba(2,7,13,.96) 72%); }
.logo-stage img { display:block;width:100%;height:100%;min-height:0;padding:10px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(25,223,255,.28)); }
.logo-stage figcaption { width:100%;overflow:hidden;padding:4px 7px;border-top:1px solid rgba(255,78,221,.2);color:#b9d4df;background:rgba(19,8,29,.72);font-size:8px;letter-spacing:.4px;text-align:center;text-overflow:ellipsis;white-space:nowrap; }
.logo-nav { border:1px solid rgba(25,223,255,.24);color:var(--cyan);background:rgba(4,15,24,.82);cursor:pointer; }
.logo-dots { grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:3px;overflow:hidden; }
.logo-dots button { flex:0 0 4px;width:4px;height:4px;padding:0;border:0;border-radius:50%;background:#344e61;cursor:pointer; }
.logo-dots button.is-active { background:var(--pink);box-shadow:0 0 5px var(--pink); }
.logo-placeholder { display:grid;place-items:center;height:100%;color:#866b95;font-size:9px;letter-spacing:.6px; }

.audio-body { display: grid; grid-template-columns: minmax(0,1fr) 166px; grid-template-rows: 27px 26px 28px; gap: 4px 6px; padding: 5px 6px; overflow: hidden; }
#audio-library { width: 100%; height: 25px; min-height: 25px; border: 1px solid rgba(25, 223, 255, .25); color: #adc5d2; background: #050b14; }
#audio-library { grid-column: 1; grid-row: 1; }
.audio-title { grid-column: 1; grid-row: 2; overflow: hidden; padding: 5px 6px; border-left: 2px solid var(--pink); color: #e0a1dc; background: rgba(255, 78, 221, .07); font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }
.audio-progress { grid-column: 1; grid-row: 3; display: grid; grid-template-columns: 38px 1fr 38px; align-items: center; gap: 5px; color: #8ca4b4; font-size: 10px; }
.audio-progress input, .audio-controls input { accent-color: var(--pink); min-width: 0; }
.audio-controls { grid-column: 2; grid-row: 1 / 4; display: grid; grid-template-columns: repeat(3,1fr); grid-template-rows: repeat(3,25px); gap: 3px; }
.audio-controls button { height: 27px; border: 1px solid rgba(25, 223, 255, .25); color: var(--cyan); background: rgba(5, 18, 28, .75); cursor: pointer; }
.audio-controls button[aria-pressed="true"] { border-color: var(--pink); color: var(--pink); }
.audio-controls #audio-shuffle { grid-column: 1 / -1; } .audio-controls label { grid-column: 1 / -1; display: flex; align-items: center; gap: 3px; color: #8ca4b4; font-size: 8px; }

#grid-shell > .pulsix-panel { margin-top: var(--gap); }
.pulsix-body { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(430px, 1.25fr) minmax(300px, .95fr); gap: 6px; padding: 6px; }
.pulsix-metrics { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 3px; }
.pulsix-metrics > div { display: grid; grid-template-columns: auto minmax(0,1fr); align-content: center; gap: 2px 4px; min-width: 0; padding: 3px 5px; color: #88a0b0; background: rgba(18,44,59,.26); font-size: 8px; }
.pulsix-metrics b { justify-self: end; overflow: hidden; color: var(--cyan-soft); font-size: 9px; white-space: nowrap; text-overflow: ellipsis; }
.pulsix-metrics i { grid-column: 1 / -1; height: 3px; overflow: hidden; background: #11212d; }.pulsix-metrics i span { display: block; width: 0; height: 100%; background: linear-gradient(90deg,var(--cyan),var(--pink)); transition: width .25s ease; }
.pulsix-client-network { min-width: 0; padding: 5px; border: 1px solid rgba(25,223,255,.22); background: rgba(4,15,25,.72); }
.pulsix-client-network > header { display:flex;align-items:center;gap:7px;padding-bottom:4px;border-bottom:1px solid rgba(25,223,255,.16);color:var(--cyan);font-size:10px; }.pulsix-client-network > header span{margin-left:auto;color:#96b4c6;font-size:8px}.pulsix-client-network > header button{padding:2px 5px;}
.pulsix-panel .activity-stream { min-height: 0; padding: 5px; border: 1px solid rgba(255,78,221,.28); background: rgba(20,7,25,.42); }.pulsix-panel #activity-log { height: 88px; max-height: 88px; overflow: auto; }
.pulse-service b.is-online { color: var(--green); } .pulse-service b.is-offline { color: var(--red); } .pulse-service b.is-warn { color: var(--amber); }
.pulsix-rune-badge { display: inline-grid; grid-template-columns: 18px auto; align-items: center; gap: 2px; height: 22px; margin-left: 3px; padding: 1px 4px 1px 2px; border: 1px solid rgba(168, 43, 226, .35); color: #9b7fb0; background: rgba(20, 8, 31, .55); }
.pulsix-rune-badge img { display: block; width: 18px; height: 18px; object-fit: contain; opacity: .9; filter: drop-shadow(0 0 5px rgba(168, 43, 226, .6)); }
.pulsix-rune-badge small { font-size: 6px; letter-spacing: .35px; }
.legend-help-toggle { display: inline-flex; align-items: center; gap: 3px; margin-left: 3px; white-space: nowrap; }

.legend-help[hidden] { display: none; }
.legend-help {
  position: fixed;
  z-index: 90;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}
.legend-help-backdrop { position: absolute; inset: 0; padding: 0; border: 0; background: rgba(0, 3, 9, .82); cursor: default; }
.legend-help-window {
  position: relative;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  width: min(1040px, calc(100vw - 48px));
  max-height: calc(100vh - 48px);
  overflow: hidden;
  border: 1px solid var(--cyan);
  border-radius: 4px;
  background: linear-gradient(145deg, rgba(7, 18, 31, .99), rgba(2, 7, 15, .99));
  box-shadow: 0 0 0 1px rgba(255, 78, 221, .3), 0 0 42px rgba(25, 223, 255, .22);
}
.legend-help-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 12px; border-bottom: 1px solid rgba(25, 223, 255, .34); background: linear-gradient(90deg, rgba(8, 48, 66, .85), rgba(41, 12, 52, .72)); }
.legend-help-head span { color: var(--pink); font-size: 9px; letter-spacing: 1.2px; }
.legend-help-head h2 { margin: 2px 0 0; color: var(--cyan); font-size: 18px; letter-spacing: 1.4px; }
.legend-help-head button { width: 28px; height: 28px; padding: 0; border: 1px solid rgba(255, 78, 221, .55); color: var(--pink); background: rgba(4, 10, 19, .85); font-size: 20px; cursor: pointer; }
.legend-help-intro { margin: 0; padding: 7px 12px; border-bottom: 1px solid rgba(25, 223, 255, .16); color: #a9bfcc; font-size: 10px; line-height: 1.35; }
.legend-help-groups { display: grid; align-content: start; gap: 5px; min-height: 0; padding: 8px; overflow-y: auto; scrollbar-color: rgba(25, 223, 255, .5) transparent; scrollbar-width: thin; }
.legend-help details { border: 1px solid rgba(25, 223, 255, .22); background: rgba(5, 16, 27, .76); }
.legend-help summary { display: grid; grid-template-columns: 18px auto minmax(0, 1fr) 14px; align-items: center; gap: 6px; min-height: 31px; padding: 5px 8px; color: var(--cyan); font-size: 11px; font-weight: 700; letter-spacing: .6px; cursor: pointer; list-style: none; }
.legend-help summary::-webkit-details-marker { display: none; }
.legend-help summary::after { content: "+"; justify-self: end; color: var(--pink); font-size: 14px; }
.legend-help details[open] summary { border-bottom: 1px solid rgba(255, 78, 221, .22); background: rgba(255, 78, 221, .06); }
.legend-help details[open] summary::after { content: "−"; }
.legend-help summary > i { color: var(--pink); text-align: center; }
.legend-help summary strong { white-space: nowrap; }
.legend-help summary span { color: #718b9e; font-size: 8px; font-weight: 400; }
.legend-help dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px; margin: 0; padding: 6px; }
.legend-help dl > div { display: grid; grid-template-columns: minmax(75px, auto) minmax(0, 1fr); align-items: start; gap: 7px; padding: 4px 6px; background: rgba(25, 223, 255, .035); }
.legend-help dt { color: var(--amber); font-size: 9px; font-weight: 700; line-height: 1.35; }
.legend-help dd { margin: 0; color: #b8cbd5; font-size: 9px; line-height: 1.35; }
.legend-code-grid dt { color: var(--pink); font-size: 10px; }
.legend-symbol-grid dt { color: var(--cyan); }
.legend-symbol-grid .status-dot { width: 7px; height: 7px; }
.legend-color-grid dt { display: flex; align-items: center; gap: 6px; }
.legend-swatch { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: currentColor; box-shadow: 0 0 6px currentColor; }
.legend-swatch.is-green { color: var(--green); } .legend-swatch.is-cyan { color: var(--cyan); } .legend-swatch.is-amber { color: var(--amber); }
.legend-swatch.is-purple { color: var(--pink); } .legend-swatch.is-red { color: var(--red); } .legend-swatch.is-grey { color: #6c7885; }

.hub-panel { flex: 0 0 180px; }
.hub-panel.is-collapsed { flex-basis: var(--panel-header); }
.hub-dots { display: flex; gap: 5px; margin-left: 4px; }
.hub-dots a { width: 7px; height: 7px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 6px currentColor; }
.hub-dots a:nth-child(2) { color: var(--green); background: currentColor; }
.hub-dots a:nth-child(3) { color: #6c7590; background: currentColor; }
.hub-head-links { display: flex; gap: 3px; margin-left: auto; }
.hub-head-links a { display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid rgba(25,223,255,.28); color: var(--cyan); text-decoration: none; }
.hub-body { display: grid; grid-template-columns: 112px minmax(0,1fr); gap: 6px; padding: 5px; overflow: hidden; }
.hub-tabs { display: grid; grid-template-rows: repeat(4,1fr); gap: 3px; min-height: 0; }
.hub-tabs button { display: grid; grid-template-columns: 17px minmax(0,1fr) 11px; align-items: center; min-width: 0; padding: 0 4px; border: 1px solid rgba(25,223,255,.2); color: #9bb4c3; background: rgba(7,23,36,.78); font-size: 8px; text-align: left; cursor: pointer; }
.hub-tabs button span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .hub-tabs button i { color: var(--cyan); } .hub-tabs button b { color: var(--pink); text-align: center; }
.hub-tabs button[aria-selected="true"] { color: white; border-color: var(--pink); background: rgba(255,78,221,.12); box-shadow: inset 2px 0 var(--pink); }
.hub-panes { min-width: 0; min-height: 0; overflow: hidden; }
.hub-pane { display: none; width: 100%; height: 100%; min-height: 0; } .hub-pane.is-active { display: block; }
.hub-link-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); grid-template-rows: repeat(2,1fr); gap: 4px; height: 100%; }
.hub-link-grid a, .hub-link-grid span { position:relative;display:flex;align-items:center;justify-content:center;min-width:0;border:1px solid rgba(25,223,255,.22);color:#d3e3eb;background:rgba(10,29,42,.42);font-size:20px;text-decoration:none; }
.hub-link-grid a:hover { border-color: var(--pink); color: white; } .hub-link-grid .is-unavailable { color: #6b7885; border-style: dashed; }
.hub-link-grid .fa-discord { color: #8c9eff; } .hub-link-grid .fa-heart,.hub-link-grid .fa-youtube,.hub-link-grid .fa-pinterest { color: var(--red); } .hub-link-grid .fa-steam,.hub-link-grid .fa-share-nodes { color: var(--cyan); } .hub-link-grid .fa-folder,.hub-link-grid .fa-hard-drive { color: var(--amber); }
.hub-current { display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:3px;height:100%; }.hub-current div{display:grid;place-content:center;min-width:0;padding:2px 4px;border:1px solid rgba(25,223,255,.2);text-align:center}.hub-current span{color:#8fa7b6;font-size:7px}.hub-current b{overflow:hidden;color:var(--cyan-soft);font-size:9px;white-space:nowrap;text-overflow:ellipsis}
.hub-current b.is-online { color: var(--green); } .hub-current b.is-offline { color: var(--red); } .hub-current b.is-warn { color: var(--amber); }
.hub-system-access { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;height:100%; }.hub-system-access div{display:grid;place-content:center;min-width:0;border:1px solid color-mix(in srgb,var(--system-color) 38%,transparent);text-align:center}.hub-system-access b{color:var(--system-color);font-size:8px}.hub-system-access span{font-size:6px}.hub-system-access .is-online{color:var(--green)}.hub-system-access .is-offline{color:#6f7b84}
.activity-stream { min-width: 0; height: 100%; overflow: hidden; }
.activity-stream > div { display: flex; justify-content: space-between; gap: 5px; color: var(--pink); font-size: 10px; }
#activity-live { color: var(--green); }
#activity-log { display:grid;gap:3px;max-height:118px;margin:5px 0 0;padding:0 3px 0 0;overflow:auto;list-style:none;color:#a6bac6;font-size:8px;scrollbar-width:thin;scrollbar-color:rgba(25,223,255,.45) transparent; }
#activity-log li { display:grid;grid-template-columns:42px 48px minmax(0,1fr);gap:4px;border-left:2px solid rgba(25,223,255,.25);padding-left:4px; }
#activity-log time { color: var(--cyan); }
#activity-log code { overflow:hidden;color:var(--amber);font:inherit;white-space:nowrap;text-overflow:ellipsis; }
#activity-log span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.login-bar .header-status { max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.login-bar-avatar { display:grid;place-items:center;width:20px;height:20px;margin-left:4px;border:1px solid rgba(25,223,255,.4);border-radius:50%;color:var(--cyan);background:#071421; }
.login-access-badge { padding:2px 5px;border:1px solid rgba(84,255,159,.4);color:var(--green);font-size:8px; }
.login-account-count { margin-left:auto;color:var(--amber);font-size:8px;white-space:nowrap; }
.login-body { display:grid;grid-template-rows:110px minmax(0,1fr);overflow:hidden;background:#03070e; }
.login-body iframe { display:block;width:100%;height:100%;min-height:0;border:0;border-top:1px solid rgba(25,223,255,.16);background:#03070e; }
.login-current-summary { display:grid;grid-template-columns:54px minmax(0,1.35fr) minmax(90px,.8fr) minmax(95px,.85fr);grid-template-rows:64px 31px;gap:5px;padding:6px;overflow:hidden; }
.profile-avatar-slot { grid-row:1;display:grid;place-items:center;width:54px;height:54px;border:1px solid var(--cyan);border-radius:50%;overflow:hidden;color:var(--cyan);background:radial-gradient(circle,rgba(25,223,255,.15),#05101c);font-size:25px;box-shadow:0 0 10px rgba(25,223,255,.18); }
.profile-avatar-slot img { width:100%;height:100%;object-fit:cover; }
.login-identity-copy,.login-function-list,.login-access-summary { display:grid;align-content:center;min-width:0;padding:4px 6px;border:1px solid rgba(25,223,255,.14);background:rgba(25,223,255,.035); }
.login-identity-copy strong { overflow:hidden;color:#fff;font-size:12px;white-space:nowrap;text-overflow:ellipsis; }.login-identity-copy span{color:var(--cyan);font-size:8px}.login-identity-copy small{overflow:hidden;color:#8199a8;font-size:7px;white-space:nowrap;text-overflow:ellipsis}
.login-function-list span,.login-access-summary span{color:#7893a4;font-size:7px}.login-function-list b{overflow:hidden;color:var(--pink);font-size:8px;white-space:nowrap;text-overflow:ellipsis}.login-access-summary b{color:var(--green);font-size:9px}.login-access-summary small{color:#8b9ca8;font-size:6px}
.login-system-access { grid-column:1/-1;display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:3px;min-width:0; }.login-system-access span{display:grid;place-items:center;overflow:hidden;border:1px solid rgba(25,223,255,.16);font-size:7px;white-space:nowrap}.login-system-access .is-allowed{color:var(--green);border-color:rgba(84,255,159,.3)}.login-system-access .is-denied{color:#697782;border-style:dashed}

.tool-wing {
  position: fixed;
  z-index: 20;
  top: calc(var(--cockpit-top) + 46%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 28px;
  height: 106px;
  padding: 5px 2px;
  border: 1px solid rgba(25, 223, 255, .6);
  color: var(--cyan);
  background: #050a13;
  box-shadow: 0 0 12px rgba(25, 223, 255, .16);
  cursor: pointer;
  writing-mode: vertical-rl;
}
.tool-wing-left { left: var(--cockpit-left); border-left: 0; }
.tool-wing-right { left: calc(var(--cockpit-right) - 28px); border-right: 0; }
.tool-wing b { color: var(--pink); letter-spacing: 2px; }
.wing-arrow { font-size: 12px; writing-mode: horizontal-tb; }
body.drawer-mode-outward .tool-wing-left .wing-arrow { transform: rotate(180deg); }
body.drawer-mode-outward .tool-wing-right .wing-arrow { transform: rotate(180deg); }
body.drawer-mode-outward .tool-wing-left { left: calc(var(--cockpit-left) - 28px); border-right: 0; border-left: 1px solid rgba(25, 223, 255, .6); }
body.drawer-mode-outward .tool-wing-right { left: var(--cockpit-right); border-left: 0; border-right: 1px solid rgba(25, 223, 255, .6); }

.side-drawer {
  position: fixed;
  z-index: 19;
  top: max(12px, var(--cockpit-top));
  width: min(680px, calc(100vw - 48px));
  height: min(900px, calc(100vh - 24px));
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transition: transform .22s ease, opacity .18s ease;
}
.side-drawer-left { left: var(--cockpit-left); transform: translateX(calc(-100% - 12px)); }
.side-drawer-right { left: var(--cockpit-right); transform: translateX(12px); }
.side-drawer.is-open { opacity: 1; pointer-events: auto; }
.side-drawer-left.is-open { transform: translateX(0); }
.side-drawer-right.is-open { transform: translateX(-100%); }
body.drawer-mode-outward .side-drawer-left { transform: translateX(calc(-100% - 12px)); }
body.drawer-mode-outward .side-drawer-right { transform: translateX(12px); }
body.drawer-mode-outward .side-drawer-left:not(.is-open), body.drawer-mode-outward .side-drawer-right:not(.is-open) { opacity: 0; }
.drawer-head { display: flex; align-items: center; height: 34px; padding: 0 7px 0 10px; border-bottom: 1px solid var(--line-soft); color: var(--pink); background: rgba(8, 32, 45, .96); font-size: 12px; }
.drawer-head button { width: 22px; height: 22px; margin-left: auto; padding: 0; border: 1px solid rgba(25, 223, 255, .35); color: var(--cyan); background: #030914; cursor: pointer; }
.side-drawer iframe { display: block; width: 100%; height: calc(100% - 34px); border: 0; background: #03070d; }


@keyframes core-pulse { 50% { transform: scale(1.17); filter: brightness(1.3); } }
@keyframes blink { 50% { opacity: .35; } }
@keyframes serverInfinityGlow {
  0%,100% { color:#19dfff; text-shadow:0 0 3px rgba(25,223,255,.75),0 0 7px rgba(25,223,255,.35); }
  25% { color:#9c6cff; text-shadow:0 0 3px rgba(156,108,255,.75),0 0 7px rgba(156,108,255,.35); }
  50% { color:#ff4edd; text-shadow:0 0 3px rgba(255,78,221,.75),0 0 7px rgba(255,78,221,.35); }
  75% { color:#4b8dff; text-shadow:0 0 3px rgba(75,141,255,.75),0 0 7px rgba(75,141,255,.35); }
}

@media (min-width: 2500px) {
  #grid-shell { margin-top: max(20px, calc((100vh - 1166px) / 2)); }
}

@media (max-height: 930px) {
  :root { --header-height: 98px; }
  #grid-cockpit { height: calc(100vh - 36px); min-height: 820px; }
  .column-media > .advertisement-panel { flex-basis: 211.5px; min-height: 211.5px; max-height: 211.5px; }
}

@media (max-width: 1500px) {
  .identity-directory-cluster { grid-template-columns:minmax(0,1fr) 220px; }
  .forteca-identity-panel { grid-template-columns:70px minmax(0,1fr); }.forteca-identity-panel img{width:68px}.forteca-identity-panel strong{font-size:14px}
  .countdown-item b { font-size:11px; }.world-clocks b{font-size:14px}
  .hub-body { grid-template-columns:96px minmax(0,1fr); }.hub-tabs button{font-size:7px}
}

@media (max-width: 1319px) {
  html,body { min-width:0; }
  #grid-shell { width:calc(100vw - 16px);min-width:0;margin:8px auto 0; }
  #grid-cockpit { height:auto;min-height:0;overflow:visible;grid-template-rows:auto auto; }
  .grid-header { grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:112px 220px; }
  .grid-header > .identity-directory-cluster { grid-column:1/-1; }
  #grid-cockpit .grid-header > .solar-system-module { grid-column:1!important;grid-row:2;height:220px!important; }
  .grid-header > .time-console { grid-column:2;grid-row:2;height:220px;grid-template-rows:36px minmax(0,1fr); }
  .clock-countdown-line { grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr)); }
  .countdown-item { grid-row:2; }.countdown-item:nth-child(1){grid-column:1/2}.countdown-item:nth-child(2){grid-column:2/3}.countdown-item:nth-child(3){grid-column:3/5}
  .grid-body { grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(680px,auto); }
  .grid-body > .column-media { padding-top:0; }.column{min-height:680px}
  .login-body { grid-template-rows:105px minmax(500px,1fr); }
}

@media (max-width: 760px) {
  .grid-header { grid-template-columns:1fr;grid-template-rows:auto 220px 230px; }
  .identity-directory-cluster { grid-template-columns:1fr;grid-template-rows:118px 88px; }
  .forteca-identity-panel { grid-row:2; }
  #grid-cockpit .grid-header > .solar-system-module { grid-column:1!important;grid-row:2; }
  .grid-header > .time-console { grid-column:1;grid-row:3;height:230px; }
  .grid-body { grid-template-columns:1fr; }.column{min-height:720px}
  .login-current-summary { grid-template-columns:48px minmax(0,1fr) minmax(86px,.8fr); }.login-access-summary{display:none}.login-system-access{grid-template-columns:repeat(6,minmax(0,1fr))}
}

/* Narrow desktop / embedded panels: never solve a shortage of width by
   allowing RUNiX text, the updater CTA, or the LOGIN frame to overflow. */
@media (max-width: 1319px) {
  .realm-selector { grid-template-columns:1fr; grid-auto-rows:90px; max-height:292px; padding-right:4px; }
  .realm-selector button { min-width:0; min-height:90px; }
  .runix-action-area { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:36px 36px 42px; }
  .runix-action-area a { grid-column:1 / -1; grid-row:3; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .runix-addons button { grid-template-columns:25px 24px minmax(0,1fr) auto; }
  .runix-addons button small { max-width:88px; }
  .login-panel,.login-body,.login-expanded,.login-expanded iframe { max-width:100%; overflow-x:clip; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto; animation-duration: .001ms; animation-iteration-count: 1; transition-duration: .001ms; }
}

/* BIG UPDATE — layout and readability polish */
.grid-header > .identity-directory-cluster { grid-column:1; }
.grid-header > .solar-system-module { grid-column:2 / 4; }
.identity-directory-cluster { grid-template-columns:minmax(0,1fr); }
.system-directory-panel { grid-template-rows:25px minmax(0,1fr); padding:4px 6px 5px; overflow:hidden; }
.system-directory-branding { position:relative; display:grid; grid-template-columns:34px 1fr 34px; align-items:center; min-width:0; border-bottom:1px solid rgba(25,223,255,.18); }
.system-directory-branding img { width:30px; max-height:19px; object-fit:contain; filter:drop-shadow(0 0 5px rgba(25,223,255,.5)); }
.system-directory-branding strong { justify-self:end; color:#f1fbff; font-size:8px; letter-spacing:.7px; text-shadow:0 0 7px var(--cyan); white-space:nowrap; }
.system-directory-branding strong span { color:var(--cyan); }
.system-directory-branding small { position:absolute; left:40px; right:40px; overflow:hidden; color:#e8a8e4; font-size:6.5px; letter-spacing:.55px; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
.system-directory { gap:3px 5px; padding-top:4px; }
.system-link { padding:1px 4px; border-left-width:3px; background:linear-gradient(90deg,color-mix(in srgb,var(--system-color) 11%,transparent),rgba(15,35,49,.08)); }
.system-link b { font-size:9px; letter-spacing:.45px; }
.system-link em { font-size:6.5px; font-weight:700; }
.system-link small { font-size:6.5px; line-height:1.2; }

/* The header, clocks and countdowns deliberately form three clear lines. */
.time-console { grid-template-rows:25px minmax(0,1fr); gap:3px; }
.age-console { min-height:25px; padding-bottom:2px; }
.forteca-age span,.forteca-age b,.age-actions .power-toggle span,.age-actions .power-toggle b,#fullscreen-toggle span { font-size:12px; line-height:1; }
.forteca-age b { font-size:12px; }
.age-actions .power-toggle { min-height:22px; }
#fullscreen-toggle { height:22px; }
.clock-countdown-line { grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:3px; }
.world-clocks div { min-height:0; padding:2px 3px; }
.world-clocks small,.world-clocks b,.countdown-item small,.countdown-item b { font-size:12px; line-height:1; letter-spacing:0; }
.countdown-item { min-width:0; padding:2px 4px; }
.countdown-console .countdown-item:nth-child(1) { grid-column:1 / 2; }
.countdown-console .countdown-item:nth-child(2) { grid-column:2 / 3; }
.countdown-console .countdown-item:nth-child(3) { grid-column:3 / 5; }

/* HUB keeps its modules but turns the vertical rail into a compact top strip. */
.hub-panel { flex-basis:165px; }
.hub-body { grid-template-columns:1fr; grid-template-rows:24px minmax(0,1fr); gap:4px; }
.hub-tabs { grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:1fr; }
.hub-tabs button { grid-template-columns:15px minmax(0,1fr) 10px; padding:0 3px; font-size:7px; }
.hub-tabs button[aria-selected="true"] { box-shadow:inset 0 -2px var(--pink); }
.hub-link-grid { grid-template-columns:repeat(5,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); }
.hub-link-grid a,.hub-link-grid span { font-size:17px; }

/* RUNiX cards and controls: even cards, readable state rows and a two-row action grid. */
.realm-selector { grid-auto-rows:84px; max-height:294px; gap:5px; padding:0 3px 5px 0; }
.realm-selector button { min-height:84px; gap:5px; padding:6px 7px; }
.realm-selector-title { grid-template-columns:20px minmax(0,1fr) auto auto; }
.realm-selector-title b { font-size:10px; }
.realm-required-line { font-size:7.5px; }
.realm-compat-line { min-height:27px; gap:3px 6px; align-content:start; }
.realm-compat-line small { font-size:7.5px; line-height:1.25; }
.runix-profile-controls { grid-template-rows:auto minmax(128px,auto) auto minmax(0,1fr); align-content:start; gap:6px; overflow:auto; }
.runix-action-area { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)) minmax(120px,.9fr); grid-template-rows:30px 34px; gap:4px; }
.runix-action-area button,.runix-action-area a { display:grid; place-items:center; min-width:0; padding:4px 6px; border:1px solid rgba(25,223,255,.42); color:var(--cyan); background:rgba(4,17,25,.92); font:700 9px Consolas,monospace; text-decoration:none; cursor:pointer; }
.runix-action-area #runix-use { color:var(--pink); border-color:rgba(255,78,221,.55); }
.runix-action-area #launch-modded { color:var(--green); border-color:rgba(84,255,159,.46); }
.runix-action-area #launch-vanilla { color:var(--cyan); }
.runix-action-area a { grid-column:3; grid-row:1 / 3; color:var(--amber); border-color:rgba(255,193,74,.55); background:linear-gradient(135deg,rgba(71,47,5,.66),rgba(7,19,27,.96)); }
.runix-action-area a:hover { color:#fff2cc; box-shadow:inset 0 0 16px rgba(255,193,74,.14); }
.runix-addons { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:5px; min-height:128px; }
.runix-addons h3 { margin:0; padding:3px 4px; border-left:3px solid var(--purple); color:#f0c7ff; font-size:10px; letter-spacing:.65px; }
.runix-addons button { min-height:45px; grid-template-columns:10px minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto; gap:1px 5px; padding:5px 6px; border-color:rgba(25,223,255,.34); }
.runix-addons button i { grid-row:1/3; width:9px; height:9px; }
.runix-addons button span { font-size:9px; font-weight:700; }
.runix-addons button small { color:#a0b4c0; font-size:7px; font-weight:700; }
.runix-addons button.is-selected { border-color:var(--green); color:var(--green); background:rgba(84,255,159,.08); }
.runix-addons button:disabled { color:#8c6875; border-color:rgba(255,85,119,.4); background:rgba(255,85,119,.035); }
.runix-addons button:disabled small { color:var(--red); }
.runix-addon-greylist { display:grid; grid-template-columns:56px minmax(0,1fr); grid-template-rows:1fr 1fr; gap:4px; min-width:0; grid-column:1/-1; }
.runix-addon-greylist > strong { display:grid; place-items:center; grid-row:1 / 3; padding:5px; border:1px solid rgba(168,43,226,.5); color:#e4b0ff; background:rgba(168,43,226,.1); font-size:9px; letter-spacing:.5px; writing-mode:vertical-rl; transform:rotate(180deg); }
#runix-counter { min-height:26px; padding:4px 7px; border:1px solid rgba(255,193,74,.42); background:rgba(40,28,6,.32); font-size:8px; }

/* Live correction pass — use the spare card width for readable neutral labels. */
.realm-selector { grid-auto-rows:92px; max-height:318px; grid-template-columns:repeat(2,minmax(0,1fr)); }
.realm-selector button { min-height:92px; padding:7px 9px; }
.realm-selector-title b { color:#f2f8fb; font-size:11px; }
.realm-required-line,.realm-compat-line { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px 5px; min-height:0; overflow:visible; }
.realm-required-line small,.realm-compat-line small { display:grid; grid-template-columns:8px minmax(0,1fr); align-items:center; gap:3px; min-width:0; color:#b9c7d0; font-size:8px; line-height:1.15; white-space:normal; }
.realm-required-line small i { color:#a7b7c2; font-style:normal; }
.realm-required-line small b,.realm-compat-line small b { grid-column:2; font-size:6.5px; letter-spacing:.2px; }
.realm-required-line .is-included,.realm-required-line .is-included i { color:#b9c7d0; }.realm-required-line .is-included b{color:var(--green)}
.realm-required-line .is-not-supported,.realm-required-line .is-not-supported i { color:#a5b1ba; }.realm-required-line .is-not-supported b{color:var(--red)}
.realm-compat-line .is-supported { color:#b9c7d0; }.realm-compat-line .is-supported b{color:var(--green)}
.realm-compat-line .is-unsupported { color:#b9c7d0; }.realm-compat-line .is-unsupported b{color:var(--red)}
.realm-compat-line small i { width:6px; height:6px; margin:0; }

.runix-action-area { grid-template-columns:repeat(2,minmax(0,1fr)) minmax(150px,1fr); grid-template-rows:36px 38px; }
.runix-action-area button,.runix-action-area a { font-size:12px; letter-spacing:.35px; }
.runix-action-area a { font-size:12px; font-weight:900; text-align:center; }

/* Operational compaction: the identity and directory are distinct header modules. */
.forteca-identity-panel { display:grid; grid-template-rows:1fr auto auto; place-items:center; padding:5px; border-color:rgba(255,78,221,.45); background:linear-gradient(145deg,rgba(44,12,49,.72),rgba(4,15,27,.94)); }
.forteca-identity-panel img { width:54px; height:30px; object-fit:contain; }.forteca-identity-panel strong { color:#f4a0e7; font-size:12px; letter-spacing:1px; }.forteca-identity-panel small { color:#b6d8e8; font-size:6px; letter-spacing:.35px; text-align:center; }
.hub-quick-actions { max-width:none; overflow:hidden; }.hub-quick-actions a { width:22px; height:22px; font-size:11px; }.hub-current { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(6,1fr); }.hub-current div,.hub-system-access div { display:flex; align-items:center; justify-content:space-between; gap:6px; padding:3px 6px; }.hub-current span,.hub-current b,.hub-system-access b,.hub-system-access span { font-size:10px; line-height:1.1; }.hub-system-access { grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:minmax(22px,1fr); }
.runix-profile-controls { overflow-x:hidden; overflow-y:auto; }
.runix-addons { display:grid; grid-template-columns:1fr; grid-auto-rows:34px; min-height:0; gap:4px; overflow:visible; }
.runix-addons h3 { display:flex; align-items:center; gap:7px; min-height:28px; margin:0; padding:4px 6px; border-left:3px solid var(--purple); color:#f3d2ff; font-size:10px; }
.runix-addons h3 em { color:#d39cff; font-size:9px; font-style:normal; letter-spacing:.7px; }
.runix-addons button { display:grid; grid-template-columns:25px 25px minmax(115px,1fr) minmax(160px,.9fr); grid-template-rows:1fr; align-items:center; min-height:34px; height:34px; padding:3px 7px; border:1px solid rgba(25,223,255,.38); background:linear-gradient(90deg,rgba(8,28,43,.9),rgba(5,12,22,.92)); }
.runix-addons button .addon-select { display:grid; place-items:center; grid-row:auto; width:19px; height:19px; margin:0; border:2px solid var(--cyan); border-radius:3px; background:#04111a; }
.runix-addons button .addon-icon { display:grid; place-items:center; font-size:14px; line-height:1; }
.runix-addons button .addon-name { overflow:hidden; color:#eff8fc; font-size:10px; font-weight:800; white-space:nowrap; text-overflow:ellipsis; }
.runix-addons button small { overflow:hidden; color:#a7b8c4; font-size:8px; font-weight:800; letter-spacing:.25px; white-space:nowrap; text-overflow:ellipsis; }
.runix-addons button.is-selected { border-color:var(--green); color:inherit; background:linear-gradient(90deg,rgba(24,90,63,.38),rgba(5,18,24,.94)); }
.runix-addons button.is-selected .addon-select { border-color:var(--green); background:var(--green); box-shadow:0 0 8px rgba(84,255,159,.55); }
.runix-addons button.is-selected .addon-select::after { content:'✓'; color:#032016; font-size:13px; font-weight:900; }
.runix-addons button.is-selected small { color:var(--green); }
.runix-addons button:disabled { color:inherit; border-color:rgba(255,85,119,.48); background:rgba(54,12,23,.42); opacity:1; }
.runix-addons button:disabled .addon-select { border-color:var(--red); }.runix-addons button:disabled small { color:var(--red); }

/* Access tiles express permission state, while system names retain their own identity colors. */
.login-system-access { grid-template-columns:repeat(auto-fit,minmax(42px,max-content)); justify-content:start; gap:4px; }
.login-system-access a,.login-system-access span { min-width:42px; min-height:27px; padding:3px 7px; border-width:1px; font-size:9px; font-weight:900; text-decoration:none; }
.login-system-access .is-allowed { color:var(--green); border-color:rgba(84,255,159,.55); background:rgba(25,85,62,.22); }
.login-system-access .is-denied { color:var(--red); border-color:rgba(255,85,119,.55); background:rgba(77,17,31,.22); }
.login-system-access .is-unavailable { color:#7e8992; border-color:rgba(126,137,146,.4); background:rgba(53,61,68,.18); }

/* Four countdowns share the third timer line without changing the three-line header layout. */
.countdown-console .countdown-item:nth-child(1) { grid-column:1; }
.countdown-console .countdown-item:nth-child(2) { grid-column:2; }
.countdown-console .countdown-item:nth-child(3) { grid-column:3; }
.countdown-console .countdown-item:nth-child(4) { grid-column:4; }
.countdown-item small { overflow:visible; white-space:nowrap; font-size:12px; letter-spacing:-.35px; }
.countdown-item b { font-size:12px; letter-spacing:-.5px; }

/* Account names are rendered server-side from safe display/username fields and never affect bar geometry. */
.login-account-count { position:relative; z-index:20; cursor:default; }
.login-account-popover { position:absolute; z-index:100; top:calc(100% + 7px); right:0; display:none; width:250px; padding:7px; border:1px solid rgba(255,193,74,.65); color:#dcecf4; background:linear-gradient(145deg,rgba(7,18,30,.98),rgba(5,8,16,.99)); box-shadow:0 8px 22px rgba(0,0,0,.7),0 0 14px rgba(255,193,74,.12); white-space:normal; }
.login-account-count:hover .login-account-popover,.login-account-count:focus-within .login-account-popover { display:grid; gap:5px; }
.login-account-popover strong { color:var(--amber); font-size:8px; letter-spacing:.6px; }.login-account-popover strong small{margin-left:6px;color:#88ddec;font-size:7px}
.login-account-popover > span { display:grid; max-height:142px; gap:3px; overflow:auto; scrollbar-width:thin; scrollbar-color:rgba(255,193,74,.6) transparent; }
.login-account-popover b { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:6px; align-items:center; overflow:hidden; padding:4px 5px; border-left:2px solid rgba(25,223,255,.55); color:#e8f6fc; font-size:9px; font-weight:700; }.login-account-popover b i{overflow:hidden;font-style:normal;text-overflow:ellipsis;white-space:nowrap}.login-account-popover b em{font-style:normal;font-size:8px;white-space:nowrap}.login-account-popover b em:nth-child(2){color:#8deeff}.login-account-popover b em:nth-child(3){color:#ffd57d}

/* Final GRID composition: service catalog -> compact identity -> Solar System. */
.grid-header{grid-template-columns:minmax(330px,.95fr) minmax(170px,.46fr) minmax(450px,1.28fr) minmax(400px,1.28fr)}
.grid-header > .system-directory-panel{grid-column:1;grid-row:1;height:100%;grid-template-rows:minmax(0,1fr);padding:5px 7px;overflow:visible}
.grid-header > .forteca-identity-panel{grid-column:2;grid-row:1;height:100%;display:grid;grid-template-columns:58px minmax(0,1fr);grid-template-rows:1fr auto;place-items:initial;align-items:center;gap:2px 8px;padding:7px 8px}
.grid-header > .forteca-identity-panel img{grid-column:1;grid-row:1/3;width:56px;height:44px;object-fit:contain}
.grid-header > .forteca-identity-panel strong{grid-column:2;grid-row:1;align-self:end;color:#f4dff2;font-size:14px;letter-spacing:.7px;white-space:nowrap}
.grid-header > .forteca-identity-panel strong span{color:var(--cyan)}
.grid-header > .forteca-identity-panel small{grid-column:2;grid-row:2;align-self:start;color:#d8afcf;font-size:6.5px;letter-spacing:.3px;text-align:left;white-space:normal}
.grid-header > .solar-system-module{grid-column:3!important;grid-row:1!important}
.grid-header > .time-console{grid-column:4;grid-row:1}
.system-directory{height:100%;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:3px 5px;padding:0}
.system-link{min-height:0;padding:2px 4px}
.system-link b{font-size:10px;line-height:1.05}
.system-link em{font-size:7px;line-height:1.05;font-weight:800}
.system-link small{font-size:7px;line-height:1.05}

/* Community panels use independent cells and the available vertical column space. */
.column-runix{--search-row-height:72px;--runix-row-height:var(--panel-header)}
.column-runix:has(.search-panel.is-collapsed){--search-row-height:var(--panel-header)}
.column-runix:has(.runix-panel:not(.is-collapsed)){--runix-row-height:72px}
.column-runix .search-panel{flex:0 0 var(--search-row-height)}
.column-runix .runix-panel{flex:0 0 var(--runix-row-height)}
.column-runix .community-panel{flex:1 1 300px;min-height:220px}
.community-body{flex:1;grid-template-columns:92px minmax(0,1fr);gap:7px;padding:7px}
.community-tabs{grid-template-rows:repeat(3,minmax(34px,1fr))}
.community-tabs button{font-size:9px;font-weight:900;letter-spacing:.35px}
.community-view{height:100%;min-height:0;padding:10px;overflow:auto}
.community-view strong{font-size:10px;letter-spacing:.45px}
.community-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:8px 0}
.community-metrics span,.community-live-grid span{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;min-height:38px;padding:6px 8px;border:1px solid rgba(25,223,255,.18);background:rgba(6,18,30,.72)}
.community-metrics small,.community-live-grid small,.community-recent small,.community-signal-body small{color:#8da7b6;font-size:7px;font-weight:900;letter-spacing:.5px}
.community-metrics b,.community-live-grid b{margin:0;color:#e8f8ff;font-size:9px;text-align:right;white-space:normal}
.community-metrics .metric-members{border-left:3px solid var(--cyan)}
.community-metrics .metric-online{border-left:3px solid #78909c}
.community-metrics .metric-doit{border-left:3px solid var(--purple)}
.community-metrics .metric-tasks{border-left:3px solid var(--amber)}
.community-metrics .metric-poker{border-left:3px solid #dcae3c}
.community-metrics .metric-fehu{border-left:3px solid #7396aa}
.community-view .is-unavailable{color:#81939e!important}
.community-live-grid{display:grid;gap:6px;margin-top:8px}
.community-live-grid span{min-height:34px}
.community-recent{display:grid;gap:4px;padding:7px 8px;border-top:1px solid rgba(255,78,221,.25);background:rgba(42,9,47,.18)}
.community-recent b{color:#dcecf4;font-size:8px;line-height:1.35}
.community-guide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:8px}
.community-guide a{display:grid;gap:2px;min-height:42px;padding:7px;border:1px solid rgba(25,223,255,.2);color:#dbeef6;background:rgba(5,17,28,.72);text-decoration:none}
.community-guide a:hover{border-color:rgba(255,78,221,.5)}
.community-guide b{color:var(--cyan);font-size:9px}.community-guide span{color:#93aab7;font-size:7.5px}
.community-signal-panel{flex:0 0 168px}
.community-signal-body{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:7px}
.community-signal-body span{display:grid;align-content:center;gap:4px;min-width:0;padding:7px;border:1px solid rgba(154,72,255,.2);background:rgba(24,10,41,.2)}
.community-signal-body b{overflow:hidden;color:#b9cbd4;font-size:8px;line-height:1.3;text-overflow:ellipsis}

@media (max-width:1500px){
  .grid-header > .system-directory-panel{grid-column:1;grid-row:1}
  .grid-header > .forteca-identity-panel{grid-column:2;grid-row:1}
  #grid-cockpit .grid-header > .solar-system-module{grid-column:1!important;grid-row:2!important}
  .grid-header > .time-console{grid-column:2;grid-row:2}
}
@media (max-width:760px){
  .grid-header{grid-template-rows:118px 88px 220px 230px}
  .grid-header > .system-directory-panel{grid-column:1;grid-row:1}
  .grid-header > .forteca-identity-panel{grid-column:1;grid-row:2}
  #grid-cockpit .grid-header > .solar-system-module{grid-column:1!important;grid-row:3!important}
  .grid-header > .time-console{grid-column:1;grid-row:4}
  .community-body{grid-template-columns:1fr}.community-tabs{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:34px}
  .community-signal-body{grid-template-columns:1fr}
}

/* R25 readability pass: retain the established panel geometry while giving the
   operational labels a usable desktop size. */
.panel-header h2 { font-size:13px; letter-spacing:.7px; }
.header-status,.network-meta,.network-meta span,.network-meta b { font-size:10px; }
.server-row,.server-row b,.server-row small,.server-row strong { font-size:10px; }
.server-row .server-day,.server-row .server-players { font-size:9px; }
.hub-current span,.hub-current b,.hub-system-access b,.hub-system-access span { font-size:11px; }
.login-card h3,.login-card b,.login-card span,.login-card small { font-size:10px; }
.audio-title,.audio-progress span,.audio-controls button,.audio-controls label { font-size:10px; }
.forteca-identity-panel { display:grid!important; place-items:center!important; grid-template-columns:1fr!important; grid-template-rows:1fr!important; padding:6px!important; }
.forteca-identity-panel img { grid-column:1!important; grid-row:1!important; width:min(156px,95%)!important; height:min(72px,92%)!important; max-height:none!important; object-fit:contain!important; }
.forteca-identity-panel strong,.forteca-identity-panel small { display:none!important; }

/* Countdown values use white digits and retain gold unit suffixes. */
.countdown-item > span { display:none; }
.countdown-item b span { display:inline; }
.countdown-item b { color:#fff!important; overflow:visible; }
.countdown-item b .countdown-number { color:#fff; }
.countdown-item b .countdown-unit { color:var(--amber); }
.countdown-item.is-complete b,.countdown-item.is-complete b .countdown-number,.countdown-item.is-complete b .countdown-unit { color:var(--green)!important; }

/* PULSiX is a bottom drawer. Its resting header stays available without taking
   height from the fixed GRiD cockpit. */
#pulsix-panel[data-pulsix-drawer] { position:relative; z-index:5; height:37px; margin-top:var(--gap); transition:height .28s cubic-bezier(.2,.8,.2,1); box-shadow:0 10px 30px rgba(0,0,0,.5),inset 0 0 20px rgba(18,109,154,.07); }
#pulsix-panel[data-pulsix-drawer].is-open { height:min(310px,calc(100vh - 86px)); }
#pulsix-panel[data-pulsix-drawer] .panel-header { flex:0 0 37px; height:37px; }
.pulsix-drawer-handle { display:flex; align-items:center; gap:7px; min-width:0; height:28px; margin-left:-3px; padding:0 8px; border:1px solid rgba(255,78,221,.45); color:var(--cyan); background:rgba(10,26,40,.88); cursor:pointer; }
.pulsix-drawer-handle span { color:var(--pink); font-size:13px; line-height:1; }.pulsix-drawer-handle h2 { margin:0; font:800 12px/1 Consolas,"Courier New",monospace; letter-spacing:.65px; }
#pulsix-panel[data-pulsix-drawer] .pulsix-body { min-height:0; overflow:auto; }

/* Corrective composition: the telemetry drawer is a sibling of the cockpit,
   so expanding it never participates in or reflows the cockpit grid. */
#grid-shell { padding-bottom:47px; transition:padding-bottom .28s cubic-bezier(.2,.8,.2,1); }
#grid-shell:has(#pulsix-panel.is-open) { padding-bottom:320px; }
#pulsix-panel[data-pulsix-drawer] { position:absolute; top:calc(clamp(820px,calc(100vh - 36px),1120px) + var(--gap)); right:0; left:0; margin:0; }
#pulsix-panel[data-pulsix-drawer] .panel-header { position:relative; justify-content:flex-end; }
.pulsix-drawer-handle { position:absolute; left:50%; transform:translateX(-50%); margin:0; }
.pulsix-drawer-handle:hover { border-color:var(--pink); box-shadow:0 0 12px rgba(255,78,221,.18); }

/* Configured destinations are linked/available; green ONLINE remains reserved
   for a positive runtime or health signal. */
.system-link em.is-linked { color:var(--cyan); }

/* POWER belongs to HUB operations, not to the clock/countdown module. */
.hub-power-toggle { display:grid; grid-template-columns:auto 24px auto; align-items:center; gap:3px; min-height:23px; padding:2px 5px; }
.hub-power-toggle span,.hub-power-toggle b { font-size:7px; }
.hub-power-toggle i { width:22px; height:10px; }
.hub-power-toggle i::after { width:6px; height:6px; transform:translateX(12px); }
.hub-power-toggle:not(.is-on) i::after { transform:translateX(0); }

/* Compact revival of the legacy Black Mithril / infinity dynamo. It occupies
   only the deliberately empty space beneath the FORTECA identity module. */
.grid-header > .mithril-dynamo-panel { grid-column:2; grid-row:1; align-self:start; z-index:8; height:calc(var(--solar-drop) - var(--gap)); margin-top:calc(var(--header-height) + var(--gap)); display:grid; grid-template-rows:24px minmax(0,1fr) 25px; overflow:hidden; border-color:rgba(173,66,255,.48); background:radial-gradient(circle at 50% 48%,rgba(80,27,111,.28),transparent 46%),linear-gradient(145deg,rgba(13,9,27,.98),rgba(3,13,24,.98)); }
.mithril-dynamo-panel header,.mithril-dynamo-panel footer { display:flex; align-items:center; justify-content:space-between; gap:6px; padding:3px 7px; border-bottom:1px solid rgba(25,223,255,.25); font-size:8px; letter-spacing:.45px; }
.mithril-dynamo-panel header strong { color:#e1b7ff; }.mithril-dynamo-panel header b { color:#788895; font-size:7px; }
.mithril-dynamo-panel footer { border-top:1px solid rgba(25,223,255,.2); border-bottom:0; color:#9db0bc; }
.mithril-dynamo-panel footer button { min-width:58px; height:19px; padding:1px 6px; border:1px solid rgba(192,61,255,.58); color:#e8bcff; background:rgba(31,10,45,.85); font-size:8px; cursor:pointer; }
.dynamo-machine { position:relative; min-height:0; overflow:hidden; }
.dynamo-infinity { position:absolute; inset:4% 7%; width:86%; height:92%; overflow:visible; filter:drop-shadow(0 0 5px rgba(191,68,255,.45)); }
.dynamo-track { fill:none; stroke:url(#grid-dynamo-gradient); stroke-width:3; stroke-linecap:round; opacity:.48; }
.dynamo-orb { fill:#fff; stroke:#77eaff; stroke-width:1; opacity:.28; filter:drop-shadow(0 0 4px #42dfff); }
.dynamo-core { position:absolute; top:50%; left:50%; width:26px; height:26px; border:2px solid #9460b7; border-radius:50%; background:radial-gradient(circle,#0a1019 22%,#54136f 25%,#180923 55%,#0ae4ff 58%,#07101a 63%); box-shadow:0 0 10px rgba(185,55,255,.35); transform:translate(-50%,-50%); }
.dynamo-ring { position:absolute; top:50%; left:50%; border:1px solid rgba(94,220,255,.32); border-radius:50%; transform:translate(-50%,-50%); }.dynamo-ring-a{width:62px;height:62px}.dynamo-ring-b{width:82px;height:82px;border-color:rgba(192,61,255,.26)}
.dynamo-coil { position:absolute; top:50%; width:19px; height:46px; border:2px solid #58266e; background:repeating-linear-gradient(0deg,#16081e 0 3px,#a23ccc 4px 5px); transform:translateY(-50%); opacity:.62; }.dynamo-coil-left{left:8px}.dynamo-coil-right{right:8px}
.dynamo-spark { position:absolute; top:50%; left:50%; width:4px; height:4px; border-radius:50%; background:#fff; opacity:0; box-shadow:0 0 8px 2px #c43dff; }.dynamo-spark-1{transform:translate(-35px,-29px)}.dynamo-spark-2{transform:translate(30px,-2px)}.dynamo-spark-3{transform:translate(-22px,27px)}
.mithril-dynamo-panel[data-dynamo-state="charging"] header b { color:#ff7dff; }.mithril-dynamo-panel[data-dynamo-state="charging"] .dynamo-track,.mithril-dynamo-panel[data-dynamo-state="charging"] .dynamo-orb { opacity:.75; }
.mithril-dynamo-panel[data-dynamo-state="online"] { border-color:rgba(25,223,255,.7); box-shadow:inset 0 0 25px rgba(25,223,255,.1),0 0 14px rgba(192,61,255,.2); }.mithril-dynamo-panel[data-dynamo-state="online"] header b{color:var(--green)}.mithril-dynamo-panel[data-dynamo-state="online"] .dynamo-track,.mithril-dynamo-panel[data-dynamo-state="online"] .dynamo-orb{opacity:1}.mithril-dynamo-panel[data-dynamo-state="online"] .dynamo-ring{animation:dynamo-spin 3.5s linear infinite}.mithril-dynamo-panel.is-sparking .dynamo-spark{animation:dynamo-spark .62s ease-out}
@keyframes dynamo-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes dynamo-spark{0%{opacity:0;scale:.4}35%{opacity:1;scale:1.8}100%{opacity:0;scale:.2}}

/* Microcopy remains compact, but no longer drops below practical reading size. */
.hub-tabs button,.community-metrics small,.community-live-grid small,.community-recent small,.community-signal-body small,.login-identity-copy small,.login-function-list span,.login-access-summary span,.login-access-summary small { font-size:8px; line-height:1.25; }
.community-signal-panel { flex-basis:132px; }.community-signal-body b { font-size:9px; }
.solar-system-module small,.solar-system-module .solar-micro { font-size:max(8px,.48rem); }

@media (max-width:1500px) {
  .grid-header > .mithril-dynamo-panel { display:none; }
  #grid-shell { padding-bottom:47px; }
  #grid-shell:has(#pulsix-panel.is-open) { padding-bottom:320px; }
}
@media (max-width:1319px) {
  #pulsix-panel[data-pulsix-drawer] { position:relative; top:auto; right:auto; left:auto; margin-top:var(--gap); }
}
@media (prefers-reduced-motion:reduce) {
  .mithril-dynamo-panel *,#pulsix-panel[data-pulsix-drawer],#grid-shell { animation:none!important; transition:none!important; }
}

/* GRiD finishing pass: reclaimed identity space supports a complete HUB and a
   compact, full-width Community workspace. */
.column-rail .hub-panel { flex:1 1 auto; min-height:245px; }
.column-rail .login-panel { flex:0 0 340px; }
.login-body { grid-template-rows:98px minmax(0,1fr); }
.community-body { display:grid; grid-template-columns:1fr; grid-template-rows:36px minmax(0,1fr); gap:6px; padding:7px; }
.community-tabs { grid-column:1; grid-row:1; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); grid-template-rows:36px; gap:4px; }
.community-tabs button { min-width:0; padding:4px 6px; font-size:10px; font-weight:900; letter-spacing:.35px; }
.community-tabs button[aria-selected="true"] { box-shadow:inset 0 -3px var(--pink); }
.community-view { grid-column:1; grid-row:2; height:100%; min-height:0; padding:9px 10px; overflow:auto; }
.community-view strong { font-size:12px; }.community-view p { font-size:10px; line-height:1.45; }
.community-live-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; margin-top:7px; }
.community-live-grid span,.community-metrics span,.community-summary-grid span { min-height:34px; padding:6px 8px; }
.community-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; margin:7px 0; }
.community-metrics small,.community-live-grid small,.community-summary-grid small,.community-recent small { font-size:9px; }
.community-metrics b,.community-live-grid b,.community-summary-grid b { font-size:11px; }
.community-summary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; margin:7px 0; }
.community-summary-grid span { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:7px; border:1px solid rgba(25,223,255,.18); background:rgba(6,18,30,.72); }
.community-recent b { font-size:10px; line-height:1.4; }
.community-open-action { display:inline-grid; place-items:center; min-height:28px; margin-top:7px; padding:4px 10px; border:1px solid rgba(25,223,255,.38); color:var(--cyan); background:rgba(4,20,31,.8); font-size:10px; font-weight:900; text-decoration:none; }
.community-guide { grid-template-columns:repeat(3,minmax(0,1fr)); }.community-guide a { min-height:48px; }.community-guide b{font-size:11px}.community-guide span{font-size:9px;line-height:1.3}
.community-signal-panel.community-pulse-panel { flex:0 0 84px; }
.community-pulse-panel .community-signal-body { display:grid; grid-template-columns:64px 76px 76px 72px minmax(0,1fr); gap:4px; padding:5px 6px; }
.community-pulse-panel .community-signal-body span { display:grid; grid-template-columns:1fr; align-content:center; gap:2px; min-height:0; padding:4px 6px; }
.community-pulse-panel .community-signal-body small { font-size:8px; }.community-pulse-panel .community-signal-body b{font-size:10px;white-space:nowrap}
.community-pulse-panel .community-pulse-latest b { overflow:hidden; text-overflow:ellipsis; }

/* All twelve canonical systems remain simultaneously visible. Existing
   favicon assets provide the established per-system visual identity. */
.hub-system-access { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(6,minmax(28px,1fr)); gap:4px; }
.hub-current div,.hub-system-access div { padding:4px 7px; }
.hub-system-access div { display:grid; grid-template-columns:20px minmax(44px,auto) minmax(0,1fr); align-items:center; justify-content:stretch; gap:6px; text-align:left; }
.hub-system-access img { width:18px; height:18px; object-fit:contain; filter:drop-shadow(0 0 4px color-mix(in srgb,var(--system-color) 55%,transparent)); }
.hub-system-access b { color:var(--system-color); font-size:11px; }.hub-system-access span{justify-self:end;font-size:9px}
.hub-tabs button { font-size:10px; }.hub-current span,.hub-current b { font-size:11px; }
.hub-power-toggle { min-width:82px; min-height:25px; padding:2px 7px; }.hub-power-toggle span,.hub-power-toggle b{font-size:8px}

/* The legacy side coils become short integrated flux rails; the infinity loop
   and central core remain the dominant Dynamo elements. */
.dynamo-coil { top:50%; width:10px; height:28px; border-width:1px; border-radius:6px; background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(192,61,255,.9) 4px 5px); opacity:.48; }
.dynamo-coil-left { left:18px; }.dynamo-coil-right { right:18px; }
.mithril-dynamo-panel[data-dynamo-state="online"] .dynamo-coil { opacity:.82; box-shadow:0 0 7px rgba(192,61,255,.45); }
.dynamo-infinity { inset:2% 4%; width:92%; height:96%; }.dynamo-core { width:30px; height:30px; }

/* PULSiX keeps its below-GRiD drawer mechanics and gains readable hierarchy. */
#grid-shell:has(#pulsix-panel.is-open) { padding-bottom:390px; }
#pulsix-panel[data-pulsix-drawer].is-open { height:min(380px,calc(100vh - 72px)); }
#pulsix-panel[data-pulsix-drawer] .pulsix-body { overflow:hidden; }
.pulsix-body { grid-template-columns:minmax(300px,.85fr) minmax(440px,1.2fr) minmax(340px,1fr); align-items:stretch; gap:8px; padding:8px; }
.pulsix-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:minmax(48px,1fr); gap:5px; }
.pulsix-metrics > div { padding:6px 8px; font-size:10px; line-height:1.2; }.pulsix-metrics b{font-size:13px}.pulsix-metrics i{height:4px}
.pulsix-client-network { display:flex; flex-direction:column; gap:5px; padding:7px; overflow:hidden; }
.pulsix-client-network > header { font-size:12px; }.pulsix-client-network > header span{font-size:10px}.pulsix-client-network > header button{font-size:9px}
.runic-state { padding:6px 8px; }.runic-state span{font-size:11px}.runic-state small{font-size:9px}.runic-state strong{font-size:12px}
.runic-grid,.network-grid { gap:4px; margin-top:0; }.runic-grid div,.network-grid div{padding:5px 6px}.runic-grid span,.network-grid span{font-size:9px}.runic-grid b,.network-grid b{font-size:11px}
.runic-health { margin-top:0; font-size:9px; }
.pulsix-updater-reserve { display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px; margin-top:auto; padding:5px 7px; border:1px dashed rgba(25,223,255,.25); color:#7f9eac; font-size:8px; }.pulsix-updater-reserve b{color:var(--cyan);font-size:9px}.pulsix-updater-reserve span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pulsix-panel .activity-stream { display:flex; flex-direction:column; height:100%; min-height:0; padding:8px; }
.activity-stream > div { flex:0 0 auto; font-size:11px; line-height:1.3; }
.pulsix-panel #activity-log { flex:1 1 auto; height:auto; max-height:none; min-height:0; margin-top:7px; gap:5px; font-size:10px; line-height:1.4; }
#activity-log li { grid-template-columns:54px 64px minmax(0,1fr); gap:6px; padding:2px 0 2px 6px; }
#activity-log span { white-space:normal; }
.pulsix-rune-badge small { font-size:8px; }.pulsix-drawer-handle h2{font-size:13px}
.system-link b{font-size:11px}.system-link em{font-size:8px}.login-identity-copy strong{font-size:13px}.login-identity-copy span{font-size:10px}.login-identity-copy small,.login-function-list span,.login-access-summary span,.login-access-summary small{font-size:9px}

@media (max-width:1500px) {
  .column-rail .hub-panel,.column-rail .login-panel { flex:1 1 auto; }
  .community-live-grid { grid-template-columns:1fr; }
  .pulsix-body { grid-template-columns:minmax(230px,.8fr) minmax(360px,1.2fr) minmax(280px,1fr); }
}
@media (max-width:900px) {
  .community-tabs { grid-template-columns:repeat(5,minmax(70px,1fr)); overflow-x:auto; }
  .community-pulse-panel .community-signal-body { grid-template-columns:repeat(2,minmax(0,1fr)); overflow:auto; }
  .community-pulse-latest { grid-column:1/-1; }
  #pulsix-panel[data-pulsix-drawer] .pulsix-body { grid-template-columns:1fr; overflow:auto; }
  .pulsix-panel .activity-stream { min-height:240px; }
}
