/* FreeHost: a quiet, friendly interface shared by every screen. */
:root {
  color-scheme:dark;
  --bg:#0e151d;
  --panel:#151e27;
  --panel2:#1c2931;
  --border:#293a3d;
  --text:#e3ede8;
  --muted:#9eafa9;
  --accent:#8bdab6;
  --red:#f0a09b;
  font-size:15px;
}

body {
  background:var(--bg);
  color:var(--text);
}

.site-header {
  background:#151e27;
  border-color:var(--border);
  backdrop-filter:blur(14px);
}

.header-inner {
  min-height:78px;
  max-width:1240px;
  gap:28px;
}

.site-header .brand {
  font-size:24px;
  letter-spacing:-1px;
}

.brand-mark {
  background:#1b302b;
  color:#8bdab6;
  transform:none;
  border-radius:12px;
  width:36px;
  height:38px;
}

.primary-nav a {
  font-size:13px;
  color:var(--muted);
  border-radius:10px;
}

.primary-nav a:hover {
  background:#151e27;
}

.primary-nav a.active {
  color:var(--accent);
  background:#151e27;
  border-color:transparent;
}

.nav-count,.avatar {
  background:#151e27;
  color:var(--accent);
}

.header-inner,.page-context,#app,footer {
  max-width:1240px;
}

.shell {
  margin:0;
}

.page-context {
  padding-top:20px;
}

.breadcrumb,.breadcrumb strong {
  color:var(--muted);
}

.service-status {
  color:var(--muted);
}

#app {
  padding-top:34px;
}

.page-heading {
  margin-bottom:30px;
}

.page-heading h1 {
  font-size:34px;
  letter-spacing:-1.2px;
}

.page-heading p {
  font-size:15px;
}

.eyebrow {
  color:var(--accent);
  letter-spacing:1.5px;
  font-size:10px;
}

.muted,p {
  color:var(--muted);
}

.button {
  background:var(--accent);
  border-color:var(--accent);
  color:white;
  font-size:13px;
  border-radius:11px;
  min-height:44px;
  padding:11px 19px;
  box-shadow:none;
  gap:12px;
}

.button:hover {
  background:#206248;
  filter:none;
  box-shadow:0 4px 12px #1a573315;
}

.button.secondary,.button.outline {
  background:#151e27;
  border-color:var(--border);
  color:var(--text);
}

.button.secondary:hover,.button.outline:hover {
  background:#151e27;
  border-color:#30413f;
}

.button.ghost {
  color:var(--muted);
}

.button.ghost:hover {
  background:#151e27;
}

.button.danger {
  background:#151e27;
  border-color:#53383b;
  color:#f0a09b;
}

.button.small {
  min-height:38px;
}

.button:disabled {
  cursor:not-allowed;
  opacity:.55;
}

.text-link,.text-button {
  color:var(--accent);
}

.icon-button {
  color:var(--muted);
  min-width:40px;
  min-height:40px;
}

.icon-button:hover {
  background:#151e27;
}

.hero {
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:430px;
  background:#151e27;
  border:0;
  border-radius:24px;
  box-shadow:none;
  overflow:hidden;
}

.hero-copy {
  width:100%;
  padding:54px 44px;
  background:none;
}

.hero-copy h1 {
  font-size:clamp(40px,4.5vw,60px);
  letter-spacing:-2.7px;
  line-height:1.08;
  max-width:530px;
  color:#8bdab6;
}

.hero-copy h1 em {
  color:var(--accent);
}

.hero-copy p {
  color:#9eafa9;
  font-size:16px;
  line-height:1.75;
  max-width:400px;
  margin:23px 0 28px;
}

.hero-note {
  color:#9eafa9;
  font-size:12px;
  margin-top:18px;
}

.hero-art {
  position:relative;
  inset:auto;
  min-height:100%;
  background:none;
  opacity:1;
  align-self:stretch;
}

.hero-art img {
  height:100%;
  width:100%;
  object-fit:cover;
  object-position:65% center;
  animation:none;
}

.hero-art .art-label {
  background:#151e27;
  color:#8bdab6;
  border:0;
  letter-spacing:0;
  font-size:13px;
  padding:10px 18px;
  bottom:24px;
  right:24px;
}

.hero-actions {
  flex-wrap:wrap;
  gap:22px;
}

.hero-actions .button {
  padding:13px 23px;
}

#catalog {
  margin-top:46px;
  scroll-margin-top:100px;
}

.section-heading {
  margin-bottom:21px;
}

.section-heading h2 {
  font-size:24px;
  letter-spacing:-.6px;
}

.section-heading p {
  font-size:14px;
  margin-top:6px;
}

.catalog {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.software-card {
  padding:25px;
  border:1px solid var(--border)!important;
  background:#151e27;
  border-radius:17px;
  box-shadow:none;
  transition:transform .15s,border-color .15s;
}

.software-card:after {
  display:none;
}

.software-card:hover {
  transform:translateY(-3px);
  border-color:#30413f!important;
  box-shadow:0 8px 20px #264e3310;
}

.software-card h3 {
  font-size:20px;
  color:var(--text);
}

.software-card p {
  color:var(--muted);
  font-size:13px;
  min-height:42px;
}

.card-top {
  margin-bottom:16px;
}

.tag {
  color:var(--muted);
  background:#151e27;
  border:0;
  font-size:10px;
}

.card-bottom {
  border-top:1px solid #30413f!important;
  margin-top:22px;
  color:var(--muted);
}

.card-bottom b {
  color:var(--accent);
}

.software-icon {
  border-radius:12px;
  background:#151e27;
  color:#8bdab6;
}

.software-icon.minecraft {
  background:#1b302b;
  color:#8bdab6;
}

.software-icon.mtasa {
  background:#34252a;
  color:#f0a09b;
}

.software-icon.nodejs {
  background:#151e27;
  color:#9eafa9;
}

.software-icon.python {
  background:#151e27;
  color:#9ebce7;
}

.software-icon.nginx {
  background:#151e27;
  color:#8bdab6;
}

.simple-steps {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin:36px 0 10px;
  padding:24px 0;
  border-top:1px solid var(--border);
}

.simple-steps>div {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:13px;
  color:var(--muted);
}

.simple-steps b {
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:50%;
  background:#151e27;
  color:#9eafa9;
}

.simple-steps>span {
  color:#9eafa9;
}

.count-label {
  color:var(--muted);
  font-size:13px;
  font-weight:400;
  margin-left:10px;
}

.more-software {
  margin-top:32px;
  border-top:1px solid var(--border);
  padding-top:22px;
}

.more-software>summary {
  color:var(--accent);
  font-weight:600;
}

.more-software #catalog {
  margin-top:24px;
}

summary {
  cursor:pointer;
  font-size:14px;
  padding:6px 0;
}

summary:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:4px;
}

.server-list {
  display:grid;
  gap:12px;
}

.server-row {
  background:#151e27;
  border:1px solid var(--border);
  padding:24px;
  border-radius:15px;
  box-shadow:none;
}

.server-row:hover {
  background:#151e27;
  border-color:#30413f;
}

.server-row h3 {
  font-size:19px;
}

.server-row p {
  color:var(--muted);
}

.server-row .row-resources {
  color:var(--muted);
}

.status {
  font-size:12px;
  background:#151e27;
  color:#9eafa9;
  border-radius:30px;
  padding:6px 10px;
}

.status.running {
  color:#8bdab6;
  background:#151e27;
}

.status.stopped {
  color:#9eafa9;
  background:#151e27;
}

.status.starting {
  color:#f0a09b;
  background:#34252a;
}

.status.error,.status.unavailable {
  color:#f0a09b;
  background:#151e27;
}

.toolbar {
  justify-content:space-between;
  gap:12px;
  margin-bottom:20px;
}

.toolbar input {
  max-width:380px;
}

.toolbar select {
  max-width:190px;
}

.empty {
  background:#151e27;
  border:1px dashed #30413f;
  border-radius:18px;
  padding:48px 24px;
}

.empty h2 {
  color:var(--text);
  font-size:25px;
}

.empty p {
  max-width:390px;
  margin:12px auto 23px;
}

.empty-icon {
  background:#151e27;
  color:#8bdab6;
  border:0;
  transform:rotate(-8deg);
  border-radius:18px;
}

.search-empty {
  padding:32px;
}

input,select,textarea {
  background:#151e27;
  border-color:#30413f;
  color:var(--text);
  border-radius:10px;
  min-height:44px;
}

input::placeholder {
  color:#9eafa9;
}

input:focus,select:focus,textarea:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 3px #28795b15;
}

label {
  color:#9eafa9;
  font-size:14px;
}

input[type=checkbox] {
  accent-color:var(--accent);
  min-height:0;
}

.form-panel,.workspace-card,.mc-panel,.diagnostic-card,.diagnostic-output {
  background:#151e27;
  border-color:var(--border);
  border-radius:16px;
  box-shadow:none;
}

.notice {
  background:#151e27;
  color:#9eafa9;
  border-color:#30413f;
  font-size:13px;
}

.notice.error,.form-error {
  color:#f0a09b;
}

.notice.error {
  background:#151e27;
  border-color:#53383b;
}

.review-table dt {
  color:var(--muted);
}

.review-table dd {
  color:var(--text);
}

.review-table>div {
  border-color:var(--border);
}

.wizard {
  max-width:820px;
  margin:auto;
}

.wizard>h1 {
  font-size:35px;
  margin-top:20px;
}

.wizard>.eyebrow {
  display:none;
}

.stepper {
  margin:30px 0;
}

.stepper span {
  color:#9eafa9;
}

.stepper b {
  background:#151e27;
  color:#9eafa9;
  border-color:#30413f;
}

.stepper .active {
  color:var(--accent);
}

.stepper .active b {
  background:#151e27;
  color:var(--accent);
  border-color:#30413f;
}

.choice-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.choice {
  background:#151e27;
  border-color:var(--border);
  text-align:left;
  padding:22px;
  align-items:flex-start;
  border-radius:15px;
}

.choice small {
  color:var(--muted);
  white-space:normal;
  font-size:12px;
  line-height:1.6;
}

.choice:hover {
  background:#151e27;
  border-color:#30413f;
  transform:none;
}

.choice.selected {
  background:#151e27;
  border-color:var(--accent);
  box-shadow:0 0 0 1px var(--accent);
}

.choice strong {
  color:var(--text);
}

.wizard-actions {
  margin-top:24px;
}

.advanced-settings {
  margin:18px 0;
  border-bottom:1px solid var(--border);
  padding-bottom:10px;
}

.settings-game-link {
  margin:20px 0;
}

.danger-zone {
  background:#151e27;
  border:1px solid #53383b;
  border-radius:13px;
  padding:18px 22px;
  margin-top:22px;
}

.danger-zone summary {
  color:#f0a09b;
  font-weight:600;
}

.danger-zone p {
  margin:15px 0;
  color:#f0a09b;
}

.server-head {
  min-height:0;
  background:#151e27;
  border:1px solid var(--border);
  border-radius:17px;
  margin-bottom:22px;
  box-shadow:none;
}

.server-head>img,.server-head:after {
  display:none;
}

.server-head-content {
  min-height:0;
  padding:25px 28px;
  background:none;
}

.server-head .eyebrow {
  color:var(--muted);
  margin-bottom:12px;
}

.server-head-bottom {
  align-items:center;
}

.server-head .detail-heading h1 {
  font-size:29px;
  color:var(--text);
  overflow-wrap:anywhere;
}

.server-head .detail-subtitle {
  color:var(--muted);
}

.server-head .detail-subtitle small {
  color:var(--muted);
}

.server-layout {
  grid-template-columns:190px minmax(0,1fr);
  gap:24px;
}

.server-main {
  min-width:0;
}

.server-rail {
  background:transparent;
  border:0;
  padding:4px 0;
  position:sticky;
  top:98px;
  align-self:start;
  border-radius:0;
}

.server-rail .rail-label {
  color:#9eafa9;
  font-size:9px;
  margin:0 12px 14px;
}

.server-rail .tabs {
  gap:6px;
}

.server-rail .tabs button {
  color:#9eafa9;
  border:0;
  border-radius:10px;
  font-size:13px;
  padding:12px;
  min-height:45px;
}

.server-rail .tabs button:hover {
  background:#151e27;
  color:var(--accent);
}

.server-rail .tabs button.active {
  background:#151e27;
  border:0;
  color:#8bdab6;
}

.server-rail .rail-icon {
  color:inherit;
}

.server-rail .rail-divider {
  color:#9eafa9;
  border-color:var(--border);
}

.server-rail .rail-arrow {
  display:none;
}

.server-status-card,.server-status-card.online,.server-status-card.offline,.server-status-card.busy,.server-status-card.fault {
  background:#151e27;
  border:1px solid var(--border);
  box-shadow:none;
  border-radius:17px;
  padding:28px;
}

.server-status-card.online {
  background:#151e27;
  border-color:#30413f;
}

.server-status-card.fault {
  background:#151e27;
  border-color:#53383b;
}

.server-status-kicker {
  color:var(--muted);
}

.server-status-kicker i {
  background:#94a19a;
  box-shadow:none;
}

.online .server-status-kicker i {
  background:#448756;
}

.server-status-body {
  margin:15px 0 24px;
}

.server-status-body h2 {
  color:var(--text);
  font-size:32px;
  letter-spacing:-1px;
}

.server-status-body p {
  color:var(--muted);
  font-size:14px;
  max-width:430px;
}

.server-status-orb {
  background:#151e27;
  color:#9eafa9;
  border:0;
  width:65px;
  height:65px;
  box-shadow:none;
  font-size:31px;
}

.server-status-card .power-bar {
  padding:0;
}

.server-status-card .power-bar .server-main-power {
  background:var(--accent);
  color:#e6f0eb;
  box-shadow:none;
  min-height:48px;
  border-radius:11px;
  font-size:15px;
}

.server-status-card .power-bar .server-main-power:hover {
  background:#216649;
}

.server-status-card .power-bar .server-stop {
  background:#151e27;
  color:#f0a09b;
  border:1px solid #53383b;
}

.server-status-card .power-bar .server-stop:hover {
  background:#151e27;
}

.server-status-card .idle-strip {
  border-color:#30413f;
  color:var(--muted);
  font-size:12px;
}

.idle-strip b {
  color:var(--muted);
}

.server-overview-grid {
  grid-template-columns:1fr;
  margin-top:16px;
}

.detail-v3 .network-summary {
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px 18px;
  padding:22px 25px;
  background:#151e27;
  border:1px solid var(--border);
  border-radius:15px;
}

.detail-v3 .network-summary>span {
  color:var(--muted);
  letter-spacing:1px;
}

.detail-v3 .network-summary strong {
  color:var(--text);
  grid-column:1;
  font-size:19px;
}

.detail-v3 .network-summary small {
  color:var(--muted);
  grid-column:1;
  font-size:11px;
}

.detail-v3 .network-summary .button {
  grid-column:2;
  grid-row:1/4;
  align-self:center;
  margin:0;
}

.server-metrics-title {
  margin-top:26px;
}

.server-metrics-title h3 {
  font-size:17px;
}

.server-metrics-title small {
  color:var(--muted);
  font-size:11px;
}

.detail-v3 .metric {
  background:#151e27;
  border-color:var(--border);
  padding:17px;
  border-radius:12px;
}

.detail-v3 .metric strong {
  color:var(--text);
  font-size:20px;
}

.metric span,.metric small {
  color:var(--muted);
}

#tabHeading p {
  color:var(--muted);
  font-size:14px;
}

#tabHeading h2 {
  font-size:27px;
}

.workspace,.mc-workspace {
  background:transparent;
  border:0;
}

.workspace-hero,.workspace-hero.game,.workspace-hero.nodejs,.workspace-hero.python,.workspace-hero.nginx,.mc-lead {
  background:#151e27;
  border:1px solid #30413f;
  border-radius:15px;
  padding:24px;
  color:var(--text);
}

.workspace-hero h2,.mc-lead h2,.mc-lead h2 span {
  color:var(--text);
}

.workspace-hero p,.mc-lead p,.mc-panel-heading p,.workspace-card p {
  color:var(--muted);
}

.workspace-pills span,.mc-lead-meta span {
  background:#151e27;
  color:var(--muted);
  border-color:#30413f;
}

.workspace-index,.mc-panel-heading>span {
  color:var(--accent);
}

.workspace-links button {
  background:#151e27;
  border-color:var(--border);
  color:var(--text);
  border-radius:9px;
}

.workspace-links button:hover {
  background:#151e27;
}

.workspace-links small,.workspace-facts dt,.mc-inline-note,.mc-file-row small {
  color:var(--muted);
}

.workspace-links button>span:last-child {
  color:var(--accent);
}

.workspace-facts dd {
  color:var(--text);
}

.workspace-facts>div {
  border-color:var(--border);
}

.workspace-tip {
  background:#151e27;
  color:var(--muted);
  border-color:var(--border);
}

.mc-file-row,.mc-search-row {
  background:#151e27;
  border-color:var(--border);
}

.mc-market {
  background:#151e27;
  border-color:var(--border);
}

.mc-market h4 {
  color:var(--text);
}

.mc-market p {
  color:var(--muted);
}

.files-box,.files-toolbar,.file-list,.file-row,.editor,.editor-toolbar {
  background:#151e27;
  border-color:var(--border);
  color:var(--text);
}

.file-row:hover {
  background:#151e27;
}

.file-path,.file-meta {
  color:var(--muted);
}

#fileContent {
  background:#17241f;
  color:#e6f0eb;
  border-color:#354a3d;
  border-radius:0;
  font-size:13px;
}

.console-box {
  border-color:#31473b;
  border-radius:14px;
  overflow:hidden;
}

.console-toolbar,.console-command {
  background:#1d2d26;
  color:#9eafa9;
  border-color:#36493b;
}

.console-toolbar label,.console-toolbar button {
  color:#9eafa9;
}

.console-command input {
  background:#17251f;
  color:#e6f0eb;
  border-color:#3a5041;
}

.console-output {
  background:#13201b;
  scrollbar-color:#425d49 #13201b;
}

.console-hint {
  color:var(--muted);
  font-size:12px;
}

.diagnostic-hero,.diagnostic-hero.good,.diagnostic-hero.warning,.diagnostic-hero.error {
  background:#151e27;
  border-color:#30413f;
  color:var(--text);
}

.diagnostic-hero p,.diagnostic-card span,.diagnostic-card small {
  color:var(--muted);
}

.diagnostic-card strong {
  color:var(--text);
}

.diagnostic-output pre {
  background:#151e27;
  color:var(--text);
}

.diagnostic-footnote {
  color:var(--muted);
}

.admin-hero {
  background:#151e27;
  border-color:#30413f;
  box-shadow:none;
}

.admin-hero .eyebrow {
  color:var(--accent);
}

.admin-hero p {
  color:var(--muted);
}

.admin-hero .button {
  background:#151e27;
  border-color:var(--border);
}

.admin-tabs {
  background:#151e27;
  border-color:var(--border);
}

.admin-tabs button {
  color:var(--muted);
}

.admin-tabs button span {
  color:var(--accent);
}

.admin-tabs button.active {
  background:#151e27;
  color:var(--accent);
  border-color:#30413f;
}

.admin-tabs button:hover {
  background:#151e27;
  color:var(--accent);
}

.admin-summary-grid article,.admin-summary-grid article:nth-child(n),.admin-panel,.admin-attention,.admin-v3 .admin-server,.admin-user-row,.audit-list {
  background:#151e27;
  border-color:var(--border);
  box-shadow:none;
}

.admin-summary-grid article>span,.admin-summary-grid small,.admin-panel>p,.admin-section-header p,.admin-server small,.admin-user-row small,.audit-list time,.audit-list span,.admin-recent time,.admin-recent span {
  color:var(--muted);
}

.admin-action-panel button,.admin-attention>a {
  background:#151e27;
  border-color:var(--border);
  color:var(--text);
}

.admin-action-panel button:hover,.admin-attention>a:hover {
  background:#151e27;
}

.admin-action-panel button span,.admin-attention>a span {
  color:var(--accent);
}

.admin-recent strong {
  color:var(--text);
}

.admin-good,.admin-user-state {
  background:#151e27;
  color:#8bdab6;
  border-color:#30413f;
}

.admin-user-state.blocked {
  background:#151e27;
  color:#f0a09b;
}

.admin-user-avatar {
  background:#1b302b;
  color:#8bdab6;
}

.admin-count,.admin-protected {
  color:var(--accent);
  border-color:#30413f;
}

.admin-filter input,.admin-filter select {
  background:#151e27;
}

.admin-recent>div:not(.admin-section-header),.audit-list>div {
  border-color:var(--border);
}

.admin-no-results {
  color:var(--muted);
  border-color:var(--border);
}

dialog {
  background:#151e27;
  border:1px solid var(--border);
  color:var(--text);
  border-radius:22px;
  box-shadow:0 24px 100px #18392630;
}

dialog::backdrop {
  background:#172c2566;
  backdrop-filter:blur(4px);
}

.toast {
  background:#151e27;
  border:1px solid #30413f;
  color:var(--text);
  border-radius:12px;
  box-shadow:0 5px 30px #22382717;
}

.toast.error {
  color:#f0a09b;
  border-color:#53383b;
}

.skeleton {
  background:linear-gradient(90deg,#151e27,#151e27,#151e27);
  background-size:200% 100%;
}

.skip-link {
  position:fixed;
  top:-100px;
  left:16px;
  z-index:100;
  background:var(--accent);
  color:#e6f0eb;
  padding:12px 20px;
  border-radius:10px;
}

.skip-link:focus {
  top:10px;
}

footer {
  color:#9eafa9;
  font-size:12px;
  border-top:1px solid var(--border);
  padding-top:22px;
}

@media(max-width:1000px) {
  .hero-copy {
    padding:40px 30px;
  }

  .hero-copy h1 {
    font-size:46px;
  }

  .hero-actions {
    gap:16px;
  }

  .server-layout {
    grid-template-columns:170px minmax(0,1fr);
    gap:18px;
  }

  .detail-v3 .metrics {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

}

@media(max-width:800px) {
  .server-layout {
    display:block;
  }

  .server-rail {
    position:static;
    padding:7px;
    background:#151e27;
    border:1px solid var(--border);
    border-radius:13px;
    margin-bottom:20px;
  }

  .server-rail .tabs {
    display:flex;
    overflow:auto;
    gap:4px;
    scrollbar-width:thin;
  }

  .server-rail .tabs button {
    flex-direction:row;
    white-space:nowrap;
    min-width:max-content;
    width:auto;
    padding:10px 13px;
    min-height:44px;
    font-size:12px;
  }

  .server-rail .rail-label,.server-rail .rail-divider {
    display:none;
  }

  .server-head-bottom {
    flex-direction:row;
  }

  .server-head-content {
    min-height:0;
  }

  .server-head {
    min-height:0;
  }

  .server-status-body h2 {
    font-size:28px;
  }

}

@media(max-width:760px) {
  .header-inner {
    min-height:112px;
    padding:14px 20px 10px;
    gap:12px;
  }

  .primary-nav {
    gap:4px;
  }

  .primary-nav a {
    font-size:12px;
    padding:9px;
  }

  .header-inner #accountActions {
    gap:3px;
  }

  .header-inner #accountActions .button {
    font-size:11px;
    padding:8px 10px;
  }

  .page-context {
    padding-top:16px;
  }

  #app {
    padding-top:24px;
  }

  .hero {
    grid-template-columns:1fr;
    min-height:0;
    display:grid;
    border-radius:20px;
  }

  .hero-copy {
    padding:34px 28px;
  }

  .hero-copy h1 {
    font-size:43px;
    letter-spacing:-1.8px;
  }

  .hero-copy p {
    font-size:15px;
    margin:20px 0;
  }

  .hero-art {
    height:210px;
    min-height:0;
    inset:auto;
    position:relative;
    display:block;
  }

  .hero-art img {
    object-position:60% 60%;
  }

  .hero-art .art-label {
    bottom:15px;
    right:15px;
    font-size:12px;
  }

  .catalog {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }

  .software-card {
    padding:20px;
  }

  .software-card p {
    min-height:60px;
  }

  .simple-steps {
    gap:10px;
  }

  .simple-steps>div {
    flex-direction:column;
    text-align:center;
    font-size:11px;
    gap:9px;
  }

  .page-heading h1 {
    font-size:28px;
  }

  .page-heading .button {
    flex-shrink:0;
    font-size:12px;
    padding:10px 12px;
  }

  .server-head-content {
    padding:22px;
  }

  .server-head .detail-heading h1 {
    font-size:25px;
  }

  .server-head-bottom>.button {
    display:none;
  }

  .server-status-card {
    padding:23px;
  }

  .server-status-body p {
    font-size:13px;
  }

  .detail-v3 .network-summary {
    padding:20px;
  }

  .detail-v3 .network-summary strong {
    font-size:16px;
  }

  .detail-v3 .network-summary .button {
    grid-column:1;
    grid-row:auto;
    justify-self:start;
    margin-top:6px;
  }

  .server-metrics-title small {
    display:none;
  }

  .server-row {
    padding:18px;
    gap:12px;
  }

  .server-row h3 {
    font-size:17px;
  }

  .choice-grid {
    gap:10px;
  }

  .choice {
    padding:18px;
  }

  .wizard>h1 {
    font-size:29px;
  }

  .stepper span {
    font-size:11px;
  }

  .stepper b {
    width:28px;
    height:28px;
  }

  .toolbar input {
    min-width:0;
  }

  .toolbar select {
    max-width:145px;
    font-size:12px;
  }

}

@media(max-width:440px) {
  .catalog {
    grid-template-columns:1fr;
  }

  .software-card p {
    min-height:0;
  }

  .page-heading {
    align-items:flex-start;
    gap:15px;
    flex-wrap:wrap;
  }

  .choice-grid {
    grid-template-columns:1fr;
  }

  .choice {
    display:grid;
    grid-template-columns:44px 1fr;
    gap:5px 14px;
  }

  .choice .software-icon {
    grid-row:1/3;
  }

  .choice small {
    grid-column:2;
  }

  .server-status-orb {
    display:none;
  }

  .server-status-body h2 {
    font-size:27px;
  }

  .server-status-card .power-bar .button {
    width:100%;
  }

  .server-row .status {
    font-size:10px;
  }

  .server-row h3 {
    font-size:15px;
  }

  .hero-actions {
    gap:16px;
  }

  .hero-actions .text-link {
    font-size:12px;
  }

  .site-header .brand {
    font-size:21px;
  }

  .header-inner .account-name {
    max-width:115px;
    overflow:hidden;
  }

  .detail-v3 .metric strong {
    font-size:17px;
  }

  .server-head .detail-heading h1 {
    font-size:23px;
  }

  .server-head .detail-heading {
    align-items:flex-start;
  }

  .toolbar {
    flex-wrap:nowrap;
  }

}

@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important;
  }

}

/* Final reading and spacing pass. */
.server-rail,.server-rail .tabs button.active {
  box-shadow:none;
}

.server-back,.back {
  color:var(--muted);
}

.server-status-card.offline .server-status-orb {
  color:#9eafa9;
}

.server-status-card.offline .server-status-kicker i {
  background:#93a099;
  box-shadow:none;
}

.server-status-card .server-status-kicker i {
  box-shadow:none;
}

.server-head-content {
  padding:21px 26px;
}

.software-card {
  min-height:0;
}

.software-card p {
  margin-bottom:8px;
}

.software-card .card-bottom {
  margin-top:20px;
}

.error-panel {
  background:#151e27;
  border-color:#53383b;
}

.file-actions button,.file-actions a {
  color:#9eafa9;
}

.file-actions .delete {
  color:var(--red);
}

.mc-empty {
  padding:24px;
}

.diagnostic-footnote {
  font-size:12px;
}

.art-label {
  font-family:inherit;
}

.stepper span[aria-current=step] {
  font-weight:700;
}

.mc-panels {
  margin-top:0;
}

/* Dark palette: retain warm green accents without bright surfaces. */
.site-header {
  background:#101820f2;
}

.brand-mark {
  background:#8bdab6;
  color:#122c23;
}

.button {
  color:#132a21;
  background:var(--accent);
  border-color:var(--accent);
}

.button:hover {
  background:#a4e9c7;
}

.button.secondary,.button.outline {
  background:#1b2830;
  color:#dce9e2;
  border-color:#354843;
}

.button.secondary:hover,.button.outline:hover {
  background:#243a33;
  border-color:#628a75;
}

.button.ghost {
  background:transparent;
  color:#a6b8ae;
}

.button.ghost:hover {
  background:#20332d;
}

.button.danger {
  background:#35242a;
  color:#f1a3a0;
  border-color:#694149;
}

.hero {
  background:#182b27;
}

.hero-copy h1 {
  color:#edf5ef;
}

.hero-copy h1 em {
  color:#8bdab6;
}

.hero-copy p {
  color:#acc1b4;
}

.hero-note {
  color:#8da99a;
}

.hero-art .art-label {
  background:#13251fed;
  color:#cce5d4;
}

.primary-nav a.active {
  background:#233d32;
  color:#9ee3bc;
}

.software-card:hover {
  background:#1a292c;
  border-color:#6c9b80!important;
}

.software-icon {
  border-color:transparent!important;
}

.software-icon.minecraft {
  background:#283f2c;
  color:#a5d58a;
}

.software-icon.mtasa {
  background:#3a3027;
  color:#efba7a;
}

.software-icon.nodejs {
  background:#273a2e;
  color:#a4d494;
}

.software-icon.python {
  background:#26354b;
  color:#a5c5f5;
}

.software-icon.nginx {
  background:#203c35;
  color:#90d6bf;
}

.server-row:hover {
  background:#1a2a2c;
  border-color:#608d77;
}

.server-rail .tabs button.active {
  background:#233d32;
  color:#9ee3bc;
}

.server-rail .tabs button:hover {
  background:#20332d;
  color:#bbebce;
}

.server-status-card.online {
  background:#192e28;
  border-color:#365b46;
}

.server-status-card.offline {
  background:#151e27;
}

.server-status-card.fault {
  background:#302128;
  border-color:#634048;
}

.server-status-card .power-bar .server-main-power {
  background:#8bdab6;
  color:#132a21;
}

.server-status-card .power-bar .server-main-power:hover {
  background:#a4e9c7;
}

.server-status-card .power-bar .server-stop {
  background:#39282e;
  color:#efafaa;
  border-color:#654149;
}

.server-status-card .power-bar .server-stop:hover {
  background:#483137;
}

.choice:hover {
  background:#1e322b;
}

.choice.selected {
  background:#233d32;
  border-color:#83c6a1;
}

.stepper .active b {
  background:#2a4436;
  color:#ace2bf;
  border-color:#608c70;
}

.status.running {
  background:#243d2f;
  color:#a0dfb4;
}

.status.stopped {
  background:#263139;
  color:#b0bdb8;
}

.status.starting {
  background:#403524;
  color:#efd192;
}

.status.error,.status.unavailable {
  background:#432b30;
  color:#f5aaaa;
}

.empty {
  background:#151e27;
  border-color:#344a41;
}

.empty-icon {
  background:#263d2c;
  color:#a7d28a;
}

.error-panel {
  background:#302128;
  color:#e6efea;
}

.notice {
  background:#1b3029;
  color:#b5d0bf;
  border-color:#355345;
}

.notice.error {
  background:#35232b;
  color:#f3aca7;
  border-color:#60414a;
}

.admin-tabs button.active {
  background:#233d32;
  color:#abe6c5;
  border-color:#41634d;
}

.admin-tabs button:hover {
  background:#21382e;
}

.admin-good,.admin-user-state {
  background:#243d2f;
  color:#a6dfb3;
}

.admin-user-state.blocked {
  background:#40292f;
  color:#f0a4a4;
}

.skip-link {
  color:#132a21;
}

.server-head-content {
  background:transparent;
}

.server-status-card.offline .server-status-orb {
  color:#9ab4a5;
  background:#23332e;
}

.software-card .card-bottom {
  border-color:#293a3d!important;
}

.server-head .button.secondary {
  background:#1b2830;
}

.hero-copy .eyebrow {
  color:#9cceae;
}

.admin-hero .button {
  background:#1b2830;
}

.simple-steps b {
  color:#bbd5c1;
}

.skeleton {
  background:linear-gradient(90deg,#18252b,#22362f,#18252b);
  background-size:200% 100%;
}