/* TüraKarud live dashboard. */
:root {
  --page: #080906;
  --panel: #10120d;
  --panel-2: #151811;
  --line: rgba(239, 174, 61, .15);
  --line-strong: rgba(239, 174, 61, .35);
  --ink: #f6f0df;
  --quiet: #968f7d;
  --brand: #f1ad36;
  --brand-bright: #ffd36b;
}

html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
  align-items: stretch;
  background:
    radial-gradient(circle at 72% -10%, rgba(198, 112, 22, .18), transparent 38rem),
    linear-gradient(180deg, #0b0c08 0%, var(--page) 48rem);
  color: var(--ink);
}
body::before {
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(to bottom, #000 0, transparent 70%);
  opacity: .55;
}
#embers { opacity: .35; }
.bear-mark { display: none; }

body > nav {
  min-height: 72px;
  padding: 14px max(24px, calc((100vw - 1520px) / 2));
  gap: 12px;
  border-bottom: 1px solid rgba(255,255,255,.065);
  background: rgba(8,9,6,.82);
}
.nav-logo { width: 38px; height: 38px; border-radius: 2px; border-color: var(--line-strong); }
.nav-title { display: flex; flex-direction: column; gap: 0; font-size: 1rem; line-height: .95; letter-spacing: 2.5px; color: var(--ink); }
.nav-title span { font-size: .52rem; letter-spacing: 3.6px; color: var(--brand); margin-top: 5px; }
.nav-clock { font-size: .7rem; padding-left: 12px; border-left: 1px solid rgba(255,255,255,.1); }
.nav-links {
  gap: 2px;
  padding: 3px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 2px;
  background: rgba(255,255,255,.025);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
body > nav .nav-btn {
  min-height: 32px;
  padding: 6px 10px;
  border: 0 !important;
  background: transparent !important;
  color: #aaa596 !important;
  border-radius: 2px;
}
body > nav .nav-btn:hover,
body > nav .nav-btn.active-view {
  background: rgba(255,255,255,.065) !important;
  color: var(--ink) !important;
}
.nav-mark {
  display: inline-grid;
  place-items: center;
  min-width: 20px;
  height: 17px;
  padding: 0 4px;
  border-radius: 1px;
  background: rgba(255,255,255,.065);
  color: #aaa596;
  font: 700 .5rem Rajdhani,sans-serif;
  letter-spacing: .5px;
}
.et-mark { color: #f58484; background: rgba(224,85,85,.1); }
.mc-mark { color: #86efac; background: rgba(77,189,94,.1); }
.ic-mark { color: #f7c75c; background: rgba(245,158,11,.1); }
.shark-mark { color: #67e8f9; background: rgba(6,182,212,.1); }
.discord-mark { color: #afb7ff; background: rgba(99,102,241,.12); }
.nav-back { color: var(--brand); font-size: .9rem; }
.nav-separator { width: 1px; height: 20px; margin: 6px 3px; background: rgba(255,255,255,.09); }
body > nav .discord-count,
body > nav .sharkord-count { margin-left: 2px; background: rgba(255,255,255,.065); color: #aaa596; }

#view-hub { width: 100%; }
#view-hub header {
  width: min(1520px, calc(100% - 48px));
  min-height: 510px;
  margin: 0 auto;
  padding: 86px 0 74px;
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(290px, .62fr);
  align-items: center;
  gap: clamp(48px, 8vw, 120px);
  text-align: left;
}
.eyebrow { display: flex; align-items: center; gap: 10px; color: var(--brand); font-family: Rajdhani, sans-serif; font-weight: 700; font-size: .76rem; letter-spacing: 3px; margin-bottom: 24px; }
.live-pulse { width: 7px; height: 7px; border-radius: 50%; background: #73dc7c; box-shadow: 0 0 0 5px rgba(115,220,124,.09), 0 0 14px rgba(115,220,124,.6); }
#view-hub header h1 { margin: 0; max-width: 900px; font-size: clamp(3rem, 4.3vw, 4.5rem); line-height: .88; letter-spacing: -.5px; color: var(--ink); text-shadow: none; }
#view-hub header h1 span { color: transparent; -webkit-text-stroke: 1px rgba(255,106,178,.88); text-shadow: 0 0 40px rgba(255,106,178,.1); }
#view-hub .subtitle { max-width: 610px; min-height: 0; margin-top: 28px; color: #aaa391; font-size: 1rem; line-height: 1.7; letter-spacing: .15px; }
#view-hub .subtitle.typing::after { display: none; }
.hero-actions { display: flex; gap: 10px; margin-top: 30px; }
.hero-button { padding: 13px 18px; border: 1px solid rgba(255,255,255,.12); border-radius: 2px; color: #c9c2b0; font: 700 .7rem Rajdhani,sans-serif; letter-spacing: 1.8px; text-decoration: none; transition: .2s ease; }
.hero-button:hover { color: white; border-color: rgba(255,255,255,.3); transform: translateY(-2px); }
.hero-button.primary { background: var(--brand); border-color: var(--brand); color: #161006; box-shadow: 0 8px 30px rgba(241,173,54,.13); }
.hero-button.primary:hover { background: var(--brand-bright); }
.hero-status {
  position: relative;
  display: block;
  padding: 30px;
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(241,173,54,.07), rgba(255,255,255,.018));
  border-radius: 2px;
  box-shadow: 0 26px 80px rgba(0,0,0,.3);
  color: inherit;
}
.hero-status::before { content: ''; position: absolute; width: 34px; height: 34px; top: -1px; right: -1px; border-top: 2px solid var(--brand); border-right: 2px solid var(--brand); }
.hero-status-label { color: var(--quiet); font: 600 .64rem Rajdhani,sans-serif; letter-spacing: 2px; }
.total-online { align-items:center !important; justify-content:flex-start; margin:18px 0 20px; gap:14px; }
#total-count { flex:0 0 auto; font-size:clamp(3.7rem,6vw,5.4rem); line-height:.86; color:var(--ink); text-shadow:none; letter-spacing:-2px; }
.total-label { display:block; max-width:82px; color:var(--brand); font:700 .72rem Rajdhani,sans-serif; line-height:1.08; letter-spacing:1px; text-transform:uppercase; }
.status-rule { height: 1px; background: linear-gradient(90deg, var(--line-strong), transparent); }
.hero-status-meta { display: flex; justify-content: space-between; gap: 12px; margin-top: 18px; color: var(--quiet); font-size: .7rem; }
.hero-status-meta span:first-child { color: #78d983; }
.hero-status-meta i { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: currentColor; }
.hero-status-meta b { color: var(--ink); }

.server-section { width: 100%; align-self: stretch; padding: 62px 24px 110px; border-top: 1px solid rgba(255,255,255,.055); background: linear-gradient(180deg, rgba(255,255,255,.018), transparent 28rem); }
.section-heading { width: min(1520px, 100%); margin: 0 auto 28px; display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.section-heading > div { display: flex; align-items: baseline; gap: 14px; }
.section-index { color: var(--brand); font: 700 .66rem JetBrains Mono, monospace; }
.section-heading h2 { font: 700 clamp(1.55rem,3vw,2.35rem) Rajdhani,sans-serif; letter-spacing: 2px; }
.section-heading p { color: var(--quiet); font-size: .78rem; }
.section-meta { display: flex; align-items: flex-end; flex-direction: column; gap: 6px; text-align: right; }
#fleet-last-checked { color: #625e52; font: 600 .62rem Rajdhani,sans-serif; letter-spacing: 1px; text-transform: uppercase; }

.fleet-alert {
  width: min(1520px, 100%);
  min-height: 44px;
  margin: -10px auto 18px;
  padding: 10px 13px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(239,174,61,.24);
  border-radius: 2px;
  background: rgba(239,174,61,.06);
  color: #a9a18e;
  font-size: .74rem;
}
.fleet-alert[hidden] { display: none; }
.fleet-alert-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--brand); box-shadow: 0 0 12px rgba(241,173,54,.7); }
.fleet-alert strong { color: var(--ink); font: 700 .75rem Rajdhani,sans-serif; letter-spacing: .8px; text-transform: uppercase; }
.fleet-alert.is-down { border-color: rgba(240,92,92,.28); background: rgba(240,92,92,.065); }
.fleet-alert.is-down .fleet-alert-dot { background: #f06b6b; box-shadow: 0 0 12px rgba(240,92,92,.75); }

.network-summary { width:min(1520px,100%); margin:0 auto 12px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid rgba(255,255,255,.07); background:rgba(8,10,9,.72); }
.network-summary article { min-height:86px; padding:15px 18px; border-right:1px solid rgba(255,255,255,.07); }
.network-summary article:last-child { border-right:0; }
.network-summary span,.network-summary small { display:block; color:#666258; font:600 .53rem/1.4 Rajdhani,sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.network-summary strong { display:block; min-height:1.25em; margin:7px 0 4px; color:#d9d2c0; font:700 1rem/1 Rajdhani,sans-serif; letter-spacing:.06em; }
.network-summary strong.degraded { color:#f06f68; }
.network-summary small { color:#56534b; font-size:.58rem; letter-spacing:.04em; text-transform:none; }

#view-hub .container { width: min(1520px, 100%) !important; max-width: 1520px !important; margin: 0 auto; padding: 0; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: 1fr; align-items: stretch; gap: 12px; perspective: none; }
#view-hub .card {
  grid-column: span 2;
  width: 100%;
  min-width: 0;
  min-height: 252px;
  padding: 22px;
  border-radius: 2px;
  background: var(--panel);
  border: 1px solid rgba(255,255,255,.075);
  box-shadow: 0 12px 34px rgba(0,0,0,.18);
  transform: none !important;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, translate .2s ease;
}
#view-hub .card:nth-child(4),
#view-hub .card:nth-child(5) { grid-column: span 3; }
#view-hub .card:hover { background: var(--panel-2); border-color: var(--line-strong); box-shadow: 0 18px 48px rgba(0,0,0,.3); translate:0 -2px; }
#view-hub .card[data-server] { cursor: pointer; }
#view-hub .card[data-server]:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; border-color: var(--line-strong); }
#view-hub .card::before { border-radius:2px; background: linear-gradient(135deg, rgba(255,255,255,.035), transparent 35%); }
#view-hub .card::after { filter:grayscale(1) brightness(1.4); opacity:.045; }
#view-hub .card-glow,#view-hub .card-shine { border-radius:2px; }
#view-hub .card::after { right: 12px; bottom: 12px; width: 82px; height: 82px; }
#view-hub .accent-line { top: 18px; left: 0; right: auto; width: 3px; height: 46px; border-radius: 0 3px 3px 0; }
#view-hub .card-header { margin-bottom: 13px; }
#view-hub .card h2 { color: var(--ink); font-size: 1.12rem; text-shadow: none; }
#view-hub .card-icon { width: 18px; height: 18px; }
#view-hub .card-body {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  min-height: 0;
}
#view-hub .card-header { min-height:25px; }
#view-hub .status-badge { width: fit-content; padding: 5px 10px; margin-bottom: 14px; border-radius:2px; border-color: rgba(255,255,255,.08); background: rgba(255,255,255,.035); }
#view-hub .name-chips { min-height: 20px; margin-bottom: 7px; }
#view-hub .name-chip { border-radius:2px; }
#view-hub .name-chip.empty { border-color:rgba(255,255,255,.055); background:rgba(255,255,255,.018); color:#666257; font-style:italic; }
#view-hub .server-meta { display: flex; min-height: 34px; align-content: flex-start; align-items: flex-start; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
#view-hub .meta-chip { display: inline-flex; min-height: 25px; align-items: center; gap: 4px; padding: 4px 9px; border: 1px solid rgba(255,255,255,.09); border-radius: 2px; background: rgba(255,255,255,.035); color: #a8a191; font: 700 .64rem Rajdhani,sans-serif; letter-spacing: .7px; line-height: 1; text-decoration: none; white-space: nowrap; }
.et-human-meta { border-color:rgba(121,215,154,.18) !important; color:#91d8a7 !important; }
.et-bot-meta { color:#73756f !important; }
#view-hub .info-list { margin-top: 0; color: #8f8979; }
#view-hub .uptime-section { min-height: 50px; margin-top: 2px; padding-top: 10px; border-top-color: rgba(255,255,255,.07); }
#view-hub .action-btn { min-height: 38px; border-radius: 2px; background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.09); }
#view-hub .action-btn:hover { transform: translateY(-1px); }
#view-hub .action-btn:active { transform:translateY(0); }
#view-hub .btn-group { min-height: 38px; flex-direction: column; justify-content: flex-end; gap: 6px; }
#view-hub .btn-group > * { flex: 0 0 auto; }
#view-hub .btn-group > :only-child { width: 100%; flex-basis: auto; }
#view-hub .mc-card .action-btn.primary { background:#79d79a !important; border-color:#79d79a !important; color:#09120c !important; box-shadow:none; }
#view-hub .icarus-card .action-btn.primary { background:#f7c75c !important; border-color:#f7c75c !important; color:#171107 !important; box-shadow:none; }
#view-hub .et-card .action-btn.primary { background:#f46f64 !important; border-color:#f46f64 !important; color:#1a0c0b !important; box-shadow:none; }
#view-hub .action-btn.primary:hover { filter:brightness(1.12); transform:translateY(-1px); }
.mini-download { border-color: rgba(105,220,130,.3) !important; background: rgba(69,201,104,.09) !important; color: #79e38f !important; }
.mini-download:hover { border-color: rgba(147,237,165,.6) !important; background: rgba(69,201,104,.17) !important; color: #a4f2b3 !important; }
.pz-card { --glow-color: rgba(167,139,250,.14); }
.pz-card .accent-line { background: linear-gradient(180deg,#8b5cf6,#c4b5fd,transparent); }
.pz-card .status-badge { background: rgba(139,92,246,.1); border: 1px solid rgba(167,139,250,.2); }
.pz-card .meta-chip { border-color: rgba(167,139,250,.2); background: rgba(139,92,246,.07); color: #b9a9e8; }
.pz-card .action-btn { color: #c4b5fd; background: rgba(139,92,246,.1); border: 1px solid rgba(167,139,250,.25); }
.pz-card .action-btn:hover { background: rgba(139,92,246,.22); border-color: rgba(196,181,253,.5); }
.pz-card .sparkline svg polyline { stroke: #c4b5fd; }
.pz-glyph { display: inline-grid; place-items: center; color: #c4b5fd; font: 700 .54rem Rajdhani,sans-serif; border: 1px solid rgba(167,139,250,.35); border-radius: 4px; }

.server-dialog {
  position: fixed;
  inset: 0;
  width: min(560px, calc(100% - 28px));
  max-width: none;
  max-height: min(760px, calc(100dvh - 28px));
  margin: auto;
  padding: 28px;
  border: 1px solid rgba(241,173,54,.27);
  border-radius: 2px;
  background: linear-gradient(155deg, #15170f, #0c0d09 72%);
  color: var(--ink);
  box-shadow: 0 36px 120px rgba(0,0,0,.72);
  overflow: auto;
}
.server-dialog::backdrop { background: rgba(3,4,2,.76); backdrop-filter: blur(7px); }
.dialog-close { position: absolute; top: 14px; right: 15px; width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.09); border-radius: 2px; background: rgba(255,255,255,.035); color: #aaa391; font-size: 1.4rem; cursor: pointer; }
.dialog-close:hover { color: white; border-color: rgba(255,255,255,.2); }
.dialog-kicker { margin-bottom: 9px; color: var(--brand); font: 700 .62rem Rajdhani,sans-serif; letter-spacing: 2.2px; }
.dialog-title-row { display: flex; align-items: center; gap: 12px; padding-right: 36px; }
.dialog-title-row h2 { font: 700 1.65rem Rajdhani,sans-serif; letter-spacing: 1.7px; text-transform: uppercase; }
.dialog-state { padding: 5px 9px; border: 1px solid rgba(99,218,116,.24); border-radius: 2px; background: rgba(99,218,116,.08); color: #79dc85; font: 700 .61rem Rajdhani,sans-serif; letter-spacing: .8px; text-transform: uppercase; }
.dialog-state.offline { border-color: rgba(240,92,92,.28); background: rgba(240,92,92,.08); color: #ff9292; }
.dialog-address { margin-top: 5px; color: #817b6c; font: 600 .72rem JetBrains Mono,monospace; }
.dialog-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin: 22px 0; }
.dialog-grid > div { min-height: 70px; padding: 13px; border: 1px solid rgba(255,255,255,.065); border-radius: 2px; background: rgba(255,255,255,.022); }
.dialog-grid span { display: block; margin-bottom: 8px; color: #716c5f; font: 700 .57rem Rajdhani,sans-serif; letter-spacing: 1.4px; }
.dialog-grid strong { display: block; overflow: hidden; color: #d8d1bf; font: 700 .88rem Rajdhani,sans-serif; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.dialog-history-label { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 7px; color: #716c5f; font: 700 .57rem Rajdhani,sans-serif; letter-spacing: 1.2px; }
.dialog-heartbeats { display: flex; gap: 3px; height: 22px; }
.dialog-heartbeats .hb { min-width: 3px; }
.dialog-actions { display: grid; grid-template-columns: 1fr; margin-top: 22px; }
.dialog-actions button { min-height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.1); border-radius: 2px; background: rgba(255,255,255,.035); color: #c8c1af; font: 700 .68rem Rajdhani,sans-serif; letter-spacing: 1.2px; cursor: pointer; }

.telemetry-loading #view-hub .status-badge,.telemetry-loading #view-hub .uptime-section { position:relative; overflow:hidden; color:transparent; }
.telemetry-loading #view-hub .status-badge::after,.telemetry-loading #view-hub .uptime-section::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(255,255,255,.02),rgba(255,255,255,.075),rgba(255,255,255,.02)); background-size:200% 100%; animation:fleetShimmer 1.35s infinite; }
.telemetry-stale #view-hub .card { border-color:rgba(241,173,54,.16); }
.telemetry-stale #fleet-last-checked { color:#e0ae59; }
@keyframes fleetShimmer { to { background-position:-200% 0; } }
.dialog-actions button { border-color: rgba(241,173,54,.32); background: rgba(241,173,54,.1); color: var(--brand-bright); }
.dialog-actions button:hover { border-color: rgba(255,255,255,.25); background: rgba(255,255,255,.07); }

.heartbeat-tooltip { position: fixed; z-index: 10020; max-width: 230px; padding: 7px 9px; border: 1px solid rgba(255,255,255,.11); border-radius: 6px; background: #171911; color: #d4cdbb; box-shadow: 0 9px 32px rgba(0,0,0,.55); font: 600 .65rem Rajdhani,sans-serif; letter-spacing: .45px; pointer-events: none; opacity: 0; transform: translateY(4px); transition: opacity .12s ease, transform .12s ease; }
.heartbeat-tooltip.show { opacity: 1; transform: translateY(0); }
#view-hub footer { width: 100%; padding: 26px max(24px, calc((100vw - 1520px) / 2)); display: flex; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.06); color: #5e5a4f; font: 600 .62rem Rajdhani,sans-serif; letter-spacing: 2px; }
#view-hub footer span:first-child { color: #918878; }

@media (max-width: 900px) {
  .nav-clock { display: none; }
  #view-hub header { grid-template-columns: 1fr; gap: 38px; padding: 68px 0 58px; }
  .hero-status { max-width: 460px; }
}
@media (min-width: 1440px) {
  #view-hub .container { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  #view-hub .card,
  #view-hub .card:nth-child(4),
  #view-hub .card:nth-child(5) { grid-column: auto; min-height: 250px; padding: 20px; }
  #view-hub .name-chips { min-height: 18px; }
  #view-hub .server-meta { min-height: 30px; }
}
@media (max-width: 1100px) {
  #view-hub .container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #view-hub .card,
  #view-hub .card:nth-child(4),
  #view-hub .card:nth-child(5) { grid-column: auto; min-height: 250px; }
  #view-hub .btn-group { min-height: 44px; flex-direction: row; }
  #view-hub .btn-group > * { flex: 1 1 0; }
}
@media (max-width: 760px) {
  #view-hub .container { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  body > nav {
    min-height: 0;
    padding: 10px 14px 0;
    gap: 8px;
    background: rgba(8,9,6,.94);
  }
  .nav-logo { width: 34px; height: 34px; border-radius: 8px; }
  .nav-title { font-size: .82rem; }
  .nav-title span { font-size: .46rem; letter-spacing: 3px; }
  .nav-links {
    order: 3;
    width: calc(100% + 28px);
    margin: 1px -14px 0;
    padding: 7px 14px 9px;
    overflow-x: auto;
    flex-wrap: nowrap;
    gap: 3px;
    border: 0;
    border-top: 1px solid rgba(255,255,255,.06);
    border-radius: 0;
    background: rgba(255,255,255,.012);
    scrollbar-width: none;
    scroll-snap-type: x proximity;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }
  .nav-links::-webkit-scrollbar { display: none; }
  body > nav .nav-btn {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 8px 11px;
    scroll-snap-align: start;
  }
  .nav-separator { flex: 0 0 1px; height: 24px; margin-block: 8px; }
  #view-hub header {
    width: min(100% - 28px, 1240px);
    min-height: 0;
    gap: 30px;
    padding: 42px 0 46px;
  }
  .eyebrow { margin-bottom: 18px; font-size: .66rem; letter-spacing: 2.4px; }
  #view-hub header h1 { overflow:visible; font-size:clamp(2.65rem,13.2vw,3.75rem); line-height:1.01; letter-spacing:-1px; }
  #view-hub .subtitle { font-size: .88rem; line-height: 1.58; margin-top: 20px; }
  .hero-actions { gap: 8px; margin-top: 24px; }
  .hero-button { flex: 1 1 0; min-height: 44px; padding: 14px 10px; text-align: center; font-size: .64rem; }
  .hero-status { max-width: none; width: 100%; padding: 21px; }
  .hero-status-label { font-size: .58rem; }
  .total-online { margin: 12px 0 15px; }
  #total-count { font-size: 3.7rem; }
  .hero-status-meta { font-size: .64rem; }
  .server-section { padding: 38px 14px 60px; }
  .section-heading { align-items: flex-start; flex-direction: column; }
  .section-meta { align-items: flex-start; text-align: left; }
  .section-heading > div { gap: 10px; }
  .section-heading h2 { font-size: 1.65rem; }
  .section-heading p { line-height: 1.5; font-size: .73rem; }
  .fleet-alert { align-items: flex-start; flex-wrap: wrap; margin-top: -10px; }
  #view-hub .container { display: grid; gap: 12px; }
  #view-hub .card { grid-column: auto; min-height: 268px; padding: 20px; border-radius: 2px; }
  #view-hub .card-body { display: flex; flex: 1 1 auto; flex-direction: column; }
  #view-hub .card-header { margin-bottom: 10px; }
  #view-hub .card h2 { font-size: 1.05rem; }
  #view-hub .status-badge { margin-bottom: 10px; }
  #view-hub .info-list { margin-top: 8px; margin-bottom: 8px; }
  #view-hub .info-list li { font-size: .78rem; }
  #view-hub .uptime-section { min-height: 48px; margin-top: auto; padding-top: 10px; }
  #view-hub .btn-group { min-height: 44px; flex-direction: row; }
  #view-hub .action-btn { min-height: 44px; padding: 11px 8px; font-size: .68rem; letter-spacing: .7px; display: grid; place-items: center; }
  #view-hub footer { padding: 22px 14px; flex-direction: column; gap: 7px; font-size: .57rem; line-height: 1.5; }

  .server-dialog { padding: 23px 18px 18px; }
  .dialog-grid { grid-template-columns: 1fr; }
  .dialog-grid > div { min-height: 58px; }

  .stats-view .tabs,
  .icarus-stats-theme .itabs { top: 101px; }
  .stats-view .tabs { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .stats-view .tab { flex: 0 0 auto; min-height: 40px; }
  .stats-view .content { padding: .8rem .65rem; }
}
@media (max-width: 390px) {
  body > nav { padding-inline: 11px; }
  .nav-links { width: calc(100% + 22px); margin-inline: -11px; padding-inline: 11px; }
  #view-hub header { width: calc(100% - 22px); }
  #view-hub header h1 { font-size:clamp(2.45rem,12.9vw,3.2rem); line-height:1.02; }
  .hero-button { font-size: .58rem; letter-spacing: 1.2px; }
  .hero-status-meta { align-items: flex-start; flex-direction: column; gap: 7px; }
  .server-section { padding-inline: 11px; }
  #view-hub .card { padding: 18px; }
  #view-hub .action-btn { font-size: .62rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}