@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Crimson+Pro:opsz,wght@12..72,400;12..72,500;12..72,600&display=swap");

:root {
  --void: #050505;
  --obsidian: #0f0908;
  --surface: #16110e;
  --surface-raised: #21110f;
  --wine: #6a1b1d;
  --wine-deep: #180b0b;
  --wine-muted: #7d2824;
  --gold: #c79a60;
  --gold-light: #efd29b;
  --ink: #eadcc3;
  --muted: #b79c78;
  --line: rgba(199, 154, 96, .38);
  --line-strong: rgba(199, 154, 96, .72);
  --panel: rgba(18, 12, 10, .88);
  --panel-raised: rgba(33, 17, 15, .94);
  --signal: var(--wine-muted);
  --danger: #9e392e;
  --control-ink: #fff;
  --control-fill: var(--wine-deep);
  --control-border: var(--gold);
  --control-focus: var(--gold-light);
  --serif: "Crimson Pro", Georgia, serif;
  --display: "Cinzel", Georgia, serif;
}

* { box-sizing: border-box; }
html { min-height: 100%; overflow-x: clip; background: var(--void); }
body { margin: 0; min-width: 320px; color: var(--ink); background: #050505 url("../brand/hallowed-order-detailed-cave-background.png") center / cover fixed no-repeat; font-family: var(--serif); font-size: 18px; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; opacity: .27; background-image: linear-gradient(color-mix(in srgb, var(--gold-light) 4%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--gold-light) 3%, transparent) 1px, transparent 1px); background-size: 28px 28px; mask-image: linear-gradient(#000, transparent 80%); }
a { color: inherit; }
input, select, textarea { color: var(--control-ink); background: var(--control-fill); border: 1px solid var(--control-border); border-radius: 2px; font: inherit; }
input::placeholder, textarea::placeholder { color: var(--control-ink); opacity: 1; }
input:focus, select:focus, textarea:focus { border-color: var(--control-focus); box-shadow: 0 0 0 2px color-mix(in srgb, var(--gold) 22%, transparent); outline: none; }
.shell { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }
.site-header { position: relative; z-index: 1; padding: 26px 0; border-bottom: 1px solid var(--line); }
.site-header .shell, .topline { display: flex; justify-content: space-between; gap: 24px; align-items: center; }
.brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; font-family: var(--display); font-size: .83rem; letter-spacing: .14em; }
.brand__mark { width: 37px; height: 37px; border: 1px solid var(--gold); border-radius: 50%; object-fit: cover; object-position: center 35%; }
.site-nav { display: flex; gap: 22px; align-items: center; font-size: .96rem; }
.site-nav a { color: var(--muted); text-decoration: none; }
.site-nav a:hover { color: var(--gold-light); }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 43px; padding: 10px 18px; border: 1px solid var(--gold); color: var(--void); background: var(--gold); font-family: var(--display); font-size: .7rem; letter-spacing: .09em; text-decoration: none; transition: .18s ease; }
.button:hover { background: var(--gold-light); transform: translateY(-1px); }
.button--quiet { color: var(--ink); background: transparent; border-color: var(--line); }
.button--quiet:hover { color: var(--void); background: var(--ink); }
.hero { position: relative; z-index: 1; min-height: 620px; display: grid; align-items: center; padding: 74px 0 92px; }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(280px, .88fr); gap: 76px; align-items: center; }
.eyebrow { margin: 0 0 15px; color: var(--gold); font-family: var(--display); font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--display); font-weight: 600; }
h1 { max-width: 780px; margin-bottom: 25px; font-size: clamp(2.65rem, 6.5vw, 5.8rem); line-height: 1.07; letter-spacing: -.04em; }
h1 em { color: var(--gold); font-style: normal; }
.lede { max-width: 620px; margin-bottom: 30px; color: var(--muted); font-size: 1.32rem; line-height: 1.48; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.sigil { aspect-ratio: 1; display: grid; place-items: center; border: 1px solid var(--line); background: linear-gradient(145deg, color-mix(in srgb, var(--gold) 14%, transparent), color-mix(in srgb, var(--wine-deep) 88%, var(--void))); box-shadow: inset 0 0 80px color-mix(in srgb, var(--gold) 5%, transparent), 0 24px 60px rgba(0,0,0,.25); }
.sigil__inner { width: 68%; aspect-ratio: 1; display: grid; place-items: center; border: 1px solid var(--line-strong); transform: rotate(45deg); }
.sigil__inner span { color: var(--gold-light); font-family: var(--display); font-size: clamp(2rem, 7vw, 4.7rem); transform: rotate(-45deg); }
.principles { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.principle { min-height: 190px; padding: 31px; background: var(--panel); }
.principle h2 { margin-bottom: 10px; font-size: 1rem; letter-spacing: .04em; }
.principle p { margin: 0; color: var(--muted); line-height: 1.4; }
.site-footer { position: relative; z-index: 1; padding: 34px 0; color: var(--muted); border-top: 1px solid var(--line); font-size: .94rem; }
.site-footer .shell { display: flex; justify-content: space-between; gap: 18px; }
.portal-main { position: relative; z-index: 1; padding: 72px 0 90px; }
.portal-intro { max-width: 750px; margin-bottom: 45px; }
.portal-intro h1 { font-size: clamp(2.3rem, 5vw, 4.2rem); }
.portal-intro p:last-child { color: var(--muted); font-size: 1.23rem; line-height: 1.5; }
.portal-intro h1 em { color: var(--gold-light); font-style: normal; }
.access-note { display: flex; align-items: center; gap: 12px; max-width: 760px; margin: 0 0 42px; padding: 15px 18px; border-left: 2px solid var(--gold); background: color-mix(in srgb, var(--wine) 20%, transparent); color: var(--muted); }
.access-note strong { color: var(--ink); }
.access-note__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 5px color-mix(in srgb, var(--wine) 22%, transparent); }
.service-meta { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; margin-bottom: 16px; }
.service-meta h2 { margin: 0; font-size: 1.25rem; }
.service-meta span { color: var(--gold); font-family: var(--display); font-size: .75rem; }
.service-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.service-card, .service-empty { min-height: 168px; padding: 23px; border: 1px solid var(--line); background: var(--panel); text-decoration: none; }
.service-card { display: flex; align-items: flex-start; gap: 14px; transition: .18s ease; }
.service-card:hover { border-color: var(--gold); transform: translateY(-2px); background: var(--panel-raised); }
.service-card__signal { width: 8px; height: 8px; margin-top: 8px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 4px color-mix(in srgb, var(--wine) 20%, transparent); }
.service-card__body { display: grid; gap: 6px; flex: 1; color: var(--muted); line-height: 1.2; }
.service-card__body strong { color: var(--ink); font-family: var(--display); font-size: .94rem; }
.service-card__label { color: var(--gold); font-family: var(--display); font-size: .62rem; letter-spacing: .09em; text-transform: uppercase; }
.service-card__arrow { color: var(--gold); }
.service-empty { grid-column: 1 / -1; min-height: 0; padding: 32px; }
.service-empty h2 { margin-bottom: 8px; font-size: 1.15rem; }
.service-empty p:last-child { margin: 0; color: var(--muted); }
.tailnet-badge { display: inline-flex; gap: 8px; align-items: center; padding: 7px 10px; border: 1px solid var(--line-strong); color: var(--gold-light); background: color-mix(in srgb, var(--wine) 24%, transparent); font-family: var(--display); font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.tailnet-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 4px color-mix(in srgb, var(--wine) 28%, transparent); }
.entry-body { min-height: 100vh; overflow-x: hidden; background: #050505 url("../brand/hallowed-order-detailed-cave-background.png") center / cover fixed no-repeat; }
.entry-body::before { opacity: .22; background-image: linear-gradient(color-mix(in srgb, var(--gold) 7%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--gold) 4.5%, transparent) 1px, transparent 1px); background-size: 33px 33px; mask-image: radial-gradient(ellipse at 50% 45%, #000, transparent 74%); }
.entry-body::after { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(ellipse at 50% 48%, color-mix(in srgb, var(--wine) 36%, transparent), transparent 26rem), radial-gradient(ellipse at 50% 60%, color-mix(in srgb, var(--gold) 12%, transparent), transparent 38rem), linear-gradient(90deg, var(--void) 0%, transparent 23%, transparent 77%, var(--void) 100%); }
.entry-shell { position: relative; z-index: 1; width: min(1420px, calc(100% - 68px)); min-height: 100vh; margin: 0 auto; }
.entry-chamber { position: relative; display: grid; justify-items: center; align-content: center; min-height: 720px; padding: 60px 0 58px; isolation: isolate; text-align: center; }
.entry-chamber::before, .entry-chamber::after { content: ""; position: absolute; top: 13%; bottom: 13%; width: min(13vw, 165px); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); opacity: .74; }
.entry-chamber::before { left: 0; border-left: 1px solid var(--line); }
.entry-chamber::after { right: 0; border-right: 1px solid var(--line); }
.entry-chamber__ornament { position: absolute; top: 50%; width: min(16vw, 205px); aspect-ratio: 1; border: 1px solid color-mix(in srgb, var(--gold) 38%, transparent); transform: translateY(-50%) rotate(45deg); opacity: .32; }
.entry-chamber__ornament::before, .entry-chamber__ornament::after { content: ""; position: absolute; inset: 19%; border: 1px solid color-mix(in srgb, var(--wine) 75%, var(--gold)); }
.entry-chamber__ornament::after { inset: 36%; }
.entry-chamber__ornament--left { left: max(-6vw, -72px); }
.entry-chamber__ornament--right { right: max(-6vw, -72px); }
.entry-reliquary { position: relative; z-index: 1; width: clamp(270px, 27vw, 410px); aspect-ratio: 1; display: grid; place-items: center; margin: clamp(18px, 2vw, 30px) 0 clamp(22px, 3vw, 35px); }
.entry-reliquary::before { content: ""; position: absolute; inset: 11%; border: 1px solid color-mix(in srgb, var(--wine) 66%, var(--gold)); transform: rotate(45deg); box-shadow: 0 0 70px color-mix(in srgb, var(--wine) 38%, transparent), inset 0 0 30px color-mix(in srgb, var(--wine) 20%, transparent); }
.entry-reliquary__ring { position: absolute; border: 1px solid var(--line-strong); border-radius: 50%; }
.entry-reliquary__ring--outer { inset: 0; border-style: double; border-width: 3px; box-shadow: 0 0 42px color-mix(in srgb, var(--wine) 28%, transparent); }
.entry-reliquary__ring--inner { inset: 8%; border-color: color-mix(in srgb, var(--gold-light) 55%, transparent); }
.entry-reliquary__seal { position: relative; z-index: 1; width: 69%; aspect-ratio: 1; overflow: hidden; border: 1px solid var(--gold); border-radius: 50%; background: var(--void); box-shadow: 0 0 0 8px color-mix(in srgb, var(--wine-deep) 78%, transparent), 0 0 70px color-mix(in srgb, var(--wine) 36%, transparent); }
.entry-reliquary__seal img { display: block; width: 100%; height: 100%; object-fit: cover; }
.entry-reliquary__mark { position: absolute; z-index: 2; color: var(--gold-light); font-size: .86rem; text-shadow: 0 0 12px color-mix(in srgb, var(--gold) 50%, transparent); }
.entry-reliquary__mark--north { top: -8px; left: 50%; transform: translateX(-50%); }
.entry-reliquary__mark--east { top: 50%; right: -8px; transform: translateY(-50%); }
.entry-reliquary__mark--south { bottom: -8px; left: 50%; transform: translateX(-50%); }
.entry-reliquary__mark--west { top: 50%; left: -8px; transform: translateY(-50%); }
.entry-passage { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: min(100%, 720px); padding: 20px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--wine-deep) 55%, transparent), transparent); }
.entry-passage::before, .entry-passage::after { content: ""; position: absolute; top: -1px; width: 37px; height: 3px; background: var(--gold); }
.entry-passage::before { left: 0; }
.entry-passage::after { right: 0; }
.entry-button { display: block; justify-self: center; width: 250px; max-width: 100%; aspect-ratio: 1983 / 793; overflow: hidden; border: 0; background: #121210 url("../brand/hallowed-order-granite-veil-button.png") center / 100% 100% no-repeat; box-shadow: 0 5px 0 #050505, 0 11px 22px rgba(0,0,0,.36); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, filter .2s ease; }
.entry-button:hover { box-shadow: 0 5px 0 #050505, 0 0 23px color-mix(in srgb, var(--wine) 43%, transparent); filter: brightness(1.14) saturate(1.06); transform: translateY(-2px); }
.entry-button:active { box-shadow: 0 2px 0 #050505, 0 5px 12px rgba(0,0,0,.42); transform: translateY(2px); }
.entry-cipher { position: relative; z-index: 1; margin: 27px 0 0; color: color-mix(in srgb, var(--gold) 67%, transparent); font-family: var(--display); font-size: .59rem; letter-spacing: .17em; }
@media (max-width: 720px) { .shell { width: min(100% - 28px, 1160px); } .site-header { padding: 17px 0; } .site-nav { gap: 12px; font-size: .84rem; } .site-nav a:not(.button) { display: none; } .hero { min-height: auto; padding: 58px 0 66px; } .hero__grid { grid-template-columns: 1fr; gap: 42px; } .sigil { max-width: 330px; width: 72%; } .principles { grid-template-columns: 1fr; } .principle { min-height: auto; } .portal-main { padding: 49px 0 65px; } .site-footer .shell { display: grid; } }
@media (max-width: 760px) { .entry-body, .sanctum-body { background-image: url("../brand/hallowed-order-mobile-cave-background.png"); background-position: center top; background-attachment: scroll; } .entry-shell { width: min(100% - 32px, 600px); } .entry-chamber { min-height: 0; padding: 42px 0 53px; } .entry-chamber::before, .entry-chamber::after, .entry-chamber__ornament { display: none; } .entry-reliquary { width: min(83vw, 370px); margin: 22px 0 31px; } .entry-passage { padding: 23px 20px; } .entry-passage::before { left: calc(50% - 19px); } .entry-passage::after { display: none; } .entry-cipher { margin-top: 23px; font-size: .53rem; letter-spacing: .12em; } }

/* Member Sanctum — the shared portal shell. */
.sanctum-body { min-height: 100vh; background: #050505 url("../brand/hallowed-order-detailed-cave-background.png") center / cover fixed no-repeat; }
.sanctum-body::before { opacity: .18; background-size: 34px 34px; mask-image: linear-gradient(110deg, transparent 1%, #000 32%, transparent 78%); }
.sanctum-body::after { content: ""; position: fixed; z-index: 0; inset: 0; pointer-events: none; background: repeating-linear-gradient(90deg, transparent 0 79px, color-mix(in srgb, var(--gold) 4%, transparent) 80px, transparent 81px 160px); mask-image: linear-gradient(90deg, transparent, #000 45%, transparent); opacity: .3; }
.sanctum-header, .sanctum-main, .sanctum-footer { position: relative; z-index: 1; }
.sanctum-header { border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--void) 72%, transparent); backdrop-filter: blur(14px); }
.sanctum-header__inner { min-height: 82px; display: grid; grid-template-columns: minmax(190px, 1fr) auto minmax(110px, 1fr); align-items: center; gap: 24px; }
.sanctum-brand { display: inline-flex; align-items: center; gap: 12px; min-width: 0; color: var(--ink); text-decoration: none; }
.sanctum-brand img { width: 41px; height: 41px; flex: 0 0 auto; object-fit: cover; object-position: center 35%; border: 1px solid var(--gold); border-radius: 50%; box-shadow: 0 0 0 4px color-mix(in srgb, var(--wine) 25%, transparent); }
.sanctum-brand span { display: grid; gap: 1px; min-width: 0; font-family: var(--display); letter-spacing: .095em; text-transform: uppercase; }
.sanctum-brand b { overflow: hidden; font-size: .66rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.sanctum-brand small { color: var(--gold); font-size: .51rem; letter-spacing: .16em; }
.sanctum-nav { display: flex; align-items: stretch; align-self: stretch; }
.sanctum-nav a { position: relative; display: grid; place-items: center; padding: 0 15px; color: var(--muted); font-family: var(--display); font-size: .62rem; letter-spacing: .105em; text-decoration: none; text-transform: uppercase; transition: color .18s ease, background .18s ease; }
.sanctum-nav a::after { content: ""; position: absolute; right: 14px; bottom: 0; left: 14px; height: 2px; background: var(--gold); box-shadow: 0 0 12px color-mix(in srgb, var(--gold) 55%, transparent); transform: scaleX(0); transition: transform .18s ease; }
.sanctum-nav a:hover, .sanctum-nav a.is-active { color: var(--gold-light); background: color-mix(in srgb, var(--wine) 14%, transparent); }
.sanctum-nav a.is-active::after { transform: scaleX(1); }
.sanctum-exit { justify-self: end; display: inline-flex; align-items: center; gap: 9px; min-height: 34px; padding: 0 12px; border: 1px solid color-mix(in srgb, var(--gold) 38%, transparent); background: linear-gradient(135deg, color-mix(in srgb, var(--wine-deep) 72%, var(--void)), color-mix(in srgb, var(--surface) 86%, var(--void))); box-shadow: inset 0 0 18px color-mix(in srgb, var(--wine) 14%, transparent); color: var(--gold-light); font-family: var(--display); font-size: .55rem; letter-spacing: .13em; text-decoration: none; text-transform: uppercase; transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease; }
.sanctum-exit::before { content: ""; width: 6px; height: 6px; border: 1px solid var(--gold); transform: rotate(45deg); box-shadow: 0 0 8px color-mix(in srgb, var(--gold) 44%, transparent); }
.sanctum-exit:hover, .sanctum-exit:focus-visible { border-color: var(--gold-light); background: color-mix(in srgb, var(--wine) 36%, var(--void)); color: var(--ink); outline: none; transform: translateY(-1px); }
.sanctum-main { min-height: calc(100vh - 153px); padding: clamp(49px, 7vw, 93px) 0 clamp(66px, 8vw, 105px); }
.sanctum-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(275px, .66fr); align-items: end; gap: clamp(40px, 10vw, 145px); padding: 0 0 clamp(51px, 7vw, 84px); }
.sanctum-hero h1, .page-intro h1 { margin-bottom: 20px; font-size: clamp(3.15rem, 7.5vw, 6.8rem); line-height: .95; letter-spacing: -.055em; }
.sanctum-hero h1 em, .page-intro h1 em, .sanctum-aside h2 em { color: var(--gold-light); font-style: normal; }
.sanctum-hero__lede, .page-intro > p:last-child { max-width: 540px; margin: 0; color: var(--muted); font-size: 1.2rem; line-height: 1.45; }
.sanctum-overall { position: relative; display: flex; align-items: center; gap: 19px; padding: 27px 25px; border: 1px solid var(--line); background: linear-gradient(130deg, color-mix(in srgb, var(--wine-deep) 91%, transparent), color-mix(in srgb, var(--surface) 82%, transparent)); box-shadow: inset 0 0 50px color-mix(in srgb, var(--wine) 13%, transparent); }
.sanctum-overall::before, .sanctum-overall::after { content: ""; position: absolute; width: 9px; height: 9px; border: 1px solid var(--gold); transform: rotate(45deg); }
.sanctum-overall::before { top: -5px; left: -5px; }.sanctum-overall::after { right: -5px; bottom: -5px; }
.sanctum-overall__ring { width: 55px; height: 55px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--gold); border-radius: 50%; color: var(--gold-light); box-shadow: inset 0 0 0 5px color-mix(in srgb, var(--wine) 35%, transparent), 0 0 28px color-mix(in srgb, var(--wine) 36%, transparent); }
.sanctum-overall p, .sanctum-overall span { margin: 0; color: var(--muted); font-family: var(--display); font-size: .55rem; letter-spacing: .125em; text-transform: uppercase; }
.sanctum-overall strong { display: block; margin: 5px 0 7px; color: var(--gold-light); font-family: var(--display); font-size: 1.05rem; font-weight: 600; letter-spacing: .025em; }
.sanctum-section { padding: clamp(34px, 5vw, 60px) 0; border-top: 1px solid var(--line); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 25px; }
.section-heading .eyebrow { margin-bottom: 9px; }.section-heading h2, .service-meta h2 { margin: 0; font-size: clamp(1.3rem, 2.5vw, 1.75rem); letter-spacing: -.025em; }
.section-heading > p { max-width: 390px; margin: 0; color: var(--muted); font-size: 1rem; line-height: 1.35; text-align: right; }
.status-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); background: var(--line); gap: 1px; }
.status-card { min-height: 200px; padding: 23px 22px; background: linear-gradient(150deg, color-mix(in srgb, var(--wine-deep) 75%, var(--void)), color-mix(in srgb, var(--surface) 90%, var(--void))); }
.status-card__head { display: flex; justify-content: space-between; gap: 9px; color: var(--muted); font-family: var(--display); font-size: .54rem; letter-spacing: .12em; text-transform: uppercase; }.status-card__sigil { color: var(--gold); }
.status-card h3 { margin: 39px 0 10px; color: var(--ink); font-size: 1.01rem; letter-spacing: .02em; }.status-card p { margin: 0; color: var(--muted); font-size: .98rem; line-height: 1.28; }
.status-card--standing .status-card__head { color: var(--gold-light); }.status-card--guarded .status-card__sigil { color: var(--wine-muted); }.status-card--quiet { background: linear-gradient(150deg, color-mix(in srgb, var(--obsidian) 95%, var(--void)), color-mix(in srgb, var(--surface) 78%, var(--void))); }
.sanctum-columns { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr); align-items: stretch; gap: clamp(26px, 5vw, 67px); padding-top: clamp(32px, 5vw, 55px); }.sanctum-section--ledger { padding: 0; border: 0; }
.dispatch-list { border-top: 1px solid var(--line); }.dispatch { position: relative; display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 9px 25px; padding: 24px 0 25px; border-bottom: 1px solid var(--line); }.dispatch::before { content: ""; position: absolute; top: 34px; left: 0; width: 5px; height: 5px; border: 1px solid var(--gold); transform: translateX(-12px) rotate(45deg); }.dispatch--current::before { background: var(--gold); box-shadow: 0 0 12px var(--gold); }.dispatch__date { grid-row: 1 / span 2; margin: 2px 0 0; color: var(--gold); font-family: var(--display); font-size: .54rem; letter-spacing: .12em; }.dispatch h3 { margin: 0; color: var(--ink); font-size: 1.08rem; letter-spacing: .01em; }.dispatch > p:last-child { margin: 0; color: var(--muted); line-height: 1.35; }.text-link { color: var(--gold-light); font-family: var(--display); font-size: .61rem; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; white-space: nowrap; }.text-link:hover { color: var(--ink); }.text-link span { color: var(--gold); font-size: .86rem; }
.sanctum-aside { display: flex; flex-direction: column; justify-content: center; padding: clamp(30px, 4vw, 50px); border: 1px solid var(--line); background: linear-gradient(155deg, color-mix(in srgb, var(--wine) 24%, var(--void)), color-mix(in srgb, var(--surface) 88%, var(--void))); box-shadow: inset 0 0 85px color-mix(in srgb, var(--wine) 18%, transparent); }.sanctum-aside h2 { margin-bottom: 18px; font-size: clamp(1.7rem, 3vw, 2.45rem); line-height: 1.08; }.sanctum-aside > p:not(.eyebrow) { margin-bottom: 28px; color: var(--muted); line-height: 1.36; }.button--relic { align-self: flex-start; gap: 13px; color: var(--gold-light); background: color-mix(in srgb, var(--wine-deep) 72%, var(--void)); border-color: var(--line-strong); }.button--relic:hover { color: var(--void); background: var(--gold-light); }
.page-intro { max-width: 770px; margin-bottom: clamp(52px, 8vw, 93px); }.page-intro h1 { margin-bottom: 20px; }.service-archive, .chronicle-ledger { padding: clamp(29px, 4vw, 48px); border: 1px solid var(--line); background: color-mix(in srgb, var(--panel) 82%, transparent); box-shadow: inset 0 0 80px color-mix(in srgb, var(--wine) 9%, transparent); }.service-meta { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 25px; }.service-meta .eyebrow { margin-bottom: 9px; }.service-meta > span { color: var(--gold); font-family: var(--display); font-size: .6rem; letter-spacing: .1em; text-transform: uppercase; }.service-list--archive { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.game-badge-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); gap: 1px; border: 1px solid var(--line); background: var(--line); }.game-badge { min-height: 190px; display: flex; flex-direction: column; padding: 25px; background: color-mix(in srgb, var(--panel) 88%, var(--void)); }.game-badge > p, .game-badge div span { margin: 0; color: var(--muted); font-family: var(--display); font-size: .54rem; letter-spacing: .12em; text-transform: uppercase; }.game-badge h2 { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin: 22px 0 auto; color: var(--gold-light); font-size: 1.15rem; line-height: 1.2; }.game-badge h2 i { width: 10px; height: 10px; flex: 0 0 auto; margin-top: .25em; border-radius: 50%; background: #eee7db; box-shadow: 0 0 9px #eee7db; }.game-badge[data-status="online"] h2 i { background: #66ff8f; box-shadow: 0 0 14px #66ff8f; }.game-badge[data-status="offline"] h2 i { background: #8d1625; box-shadow: 0 0 9px #8d1625; }.game-badge div { display: grid; gap: 6px; padding-top: 16px; border-top: 1px solid var(--line); }.game-badge div strong { color: var(--ink); font-family: var(--display); font-size: .76rem; letter-spacing: .06em; }
.service-card { position: relative; min-height: 230px; display: flex; flex-direction: column; padding: 23px; gap: 25px; overflow: hidden; border-color: var(--line); background: linear-gradient(145deg, color-mix(in srgb, var(--wine-deep) 84%, var(--void)), color-mix(in srgb, var(--surface) 90%, var(--void))); }.service-card::after { content: ""; position: absolute; right: -35px; bottom: -35px; width: 130px; height: 130px; border: 1px solid color-mix(in srgb, var(--gold) 25%, transparent); transform: rotate(45deg); }.service-card--sealed { cursor: default; }.service-card--sealed:hover { border-color: var(--line); transform: none; background: linear-gradient(145deg, color-mix(in srgb, var(--wine-deep) 84%, var(--void)), color-mix(in srgb, var(--surface) 90%, var(--void))); }.service-card--ready:hover { border-color: var(--gold); }.service-card__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }.service-card__signal { margin: 0; background: var(--wine-muted); }.service-card__state, .service-card__seal { position: relative; z-index: 1; color: var(--gold); font-family: var(--display); font-size: .54rem; letter-spacing: .1em; text-transform: uppercase; }.service-card__body { position: relative; z-index: 1; gap: 8px; }.service-card__body strong { color: var(--gold-light); font-size: 1.12rem; }.service-card__seal { margin-top: auto; color: var(--muted); }.service-card--ready .service-card__seal { color: var(--gold-light); }.service-card--ready .service-card__signal { background: var(--gold); }.chronicle-ledger { max-width: 920px; }.ledger-mark { color: var(--gold); font-size: 1.4rem; text-shadow: 0 0 20px color-mix(in srgb, var(--gold) 48%, transparent); }
.codex-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid var(--line); background: var(--line); gap: 1px; }.codex-card { min-height: 260px; padding: clamp(28px, 4vw, 48px); background: linear-gradient(145deg, color-mix(in srgb, var(--wine-deep) 82%, var(--void)), color-mix(in srgb, var(--surface) 91%, var(--void))); }.codex-card > span { display: block; margin-bottom: 46px; color: var(--gold); font-family: var(--display); font-size: .6rem; letter-spacing: .14em; }.codex-card h2 { margin-bottom: 13px; font-size: 1.32rem; line-height: 1.18; }.codex-card p { max-width: 360px; margin: 0; color: var(--muted); line-height: 1.35; }.codex-card--seal { background: radial-gradient(circle at 70% 30%, color-mix(in srgb, var(--wine) 39%, transparent), transparent 18rem), var(--obsidian); }.codex-card--seal > span { color: var(--gold-light); font-size: 1.4rem; }.codex-card--seal .text-link { display: inline-block; margin-top: 26px; }
.sanctum-body--internal .sanctum-header { box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--wine) 68%, transparent); }.sanctum-body--internal .sanctum-overall__ring { border-color: var(--wine-muted); }.sanctum-body--internal .status-card--standing .status-card__head { color: var(--gold); }.sanctum-body--internal .service-archive { margin-top: clamp(43px, 6vw, 75px); }
.proxmox-bar { position: relative; z-index: 2; isolation: isolate; border-bottom: 1px solid color-mix(in srgb, var(--gold) 28%, transparent); background: color-mix(in srgb, var(--void) 54%, transparent); box-shadow: 0 1px 0 color-mix(in srgb, var(--void) 82%, transparent); }.proxmox-bar__inner { display: flex; align-items: stretch; min-height: 54px; overflow-x: auto; scrollbar-width: thin; }.proxmox-bar__host, .proxmox-bar__mass { display: inline-flex; flex: 0 0 auto; padding: 8px 16px; border-right: 1px solid color-mix(in srgb, var(--gold) 20%, transparent); white-space: nowrap; }.proxmox-bar__host { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; align-content: center; column-gap: 13px; min-width: 235px; }.proxmox-bar__host strong { grid-column: 1; grid-row: 1; color: var(--gold-light); font-family: var(--display); font-size: .66rem; letter-spacing: .08em; }.proxmox-bar__metrics { display: inline-flex; align-items: baseline; gap: 11px; }.proxmox-bar__metrics--top { grid-column: 2; grid-row: 1; }.proxmox-bar__metrics--bottom { grid-column: 1 / -1; grid-row: 2; margin-top: 5px; }.proxmox-bar__metrics span, .proxmox-bar__mass { color: var(--ink); font-size: .77rem; }.proxmox-bar__host b, .proxmox-bar__mass b { margin-right: 6px; color: var(--muted); font-family: var(--display); font-size: .48rem; letter-spacing: .09em; text-transform: uppercase; }.proxmox-bar__host--degraded strong { color: var(--muted); }.proxmox-bar__host--offline strong, .proxmox-bar__host--unknown strong { color: var(--wine-muted); }.proxmox-bar__mass { align-items: center; color: var(--muted); font-size: .69rem; }.proxmox-bar__mass b { color: var(--gold); }.sanctum-footer { padding: 24px 0; border-top: 1px solid var(--line); color: var(--muted); font-family: var(--display); font-size: .54rem; letter-spacing: .1em; text-transform: uppercase; }.sanctum-footer .shell { display: flex; justify-content: space-between; gap: 15px; }.sanctum-footer span:first-child { color: var(--gold); }
@media (max-width: 860px) { .sanctum-header__inner { grid-template-columns: 1fr auto; }.sanctum-nav { grid-row: 2; grid-column: 1 / -1; min-height: 47px; justify-content: space-around; margin: 0 -20px; border-top: 1px solid color-mix(in srgb, var(--gold) 18%, transparent); }.sanctum-nav a { flex: 1; }.sanctum-hero { grid-template-columns: 1fr; gap: 34px; }.sanctum-overall { max-width: 465px; }.status-grid { grid-template-columns: repeat(2, 1fr); }.sanctum-columns { grid-template-columns: 1fr; }.sanctum-aside { min-height: 340px; }.service-list--archive { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .sanctum-header__inner { min-height: 70px; }.sanctum-brand img { width: 35px; height: 35px; }.sanctum-brand b { font-size: .6rem; }.sanctum-exit { font-size: .52rem; }.sanctum-nav { margin: 0 -14px; overflow-x: auto; justify-content: flex-start; }.sanctum-nav a { min-width: 94px; padding: 0 11px; }.sanctum-nav a::after { right: 10px; left: 10px; }.sanctum-main { padding-top: 44px; }.sanctum-hero h1, .page-intro h1 { font-size: clamp(3rem, 16vw, 4.6rem); }.sanctum-hero__lede, .page-intro > p:last-child { font-size: 1.08rem; }.section-heading { display: block; }.section-heading > p { margin-top: 15px; text-align: left; }.status-grid { grid-template-columns: 1fr; }.status-card { min-height: 166px; }.status-card h3 { margin-top: 28px; }.proxmox-bar__inner { width: calc(100% - 28px); }.proxmox-bar__host, .proxmox-bar__mass { padding-right: 12px; padding-left: 12px; }.proxmox-bar__host { min-width: 222px; }.dispatch { grid-template-columns: 1fr; gap: 7px; padding-left: 17px; }.dispatch__date { grid-row: auto; }.dispatch::before { left: 0; transform: translateX(0) rotate(45deg); }.sanctum-aside { padding: 31px 28px; }.service-archive, .chronicle-ledger { margin-right: -2px; margin-left: -2px; padding: 27px 20px; }.service-meta { align-items: start; }.codex-grid { grid-template-columns: 1fr; }.codex-card { min-height: 220px; }.sanctum-footer .shell { display: grid; gap: 9px; }.tailnet-badge { font-size: .53rem; } }

.chronicle-pagination { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 25px; color: var(--muted); font-family: var(--display); font-size: .56rem; letter-spacing: .1em; text-transform: uppercase; }.chronicle-pagination .text-link[aria-disabled="true"] { visibility: hidden; pointer-events: none; }
.service-card__access { display: block; margin-top: 6px; color: color-mix(in srgb, var(--muted) 86%, var(--ink)); font-size: .82rem; font-style: normal; line-height: 1.25; }
.service-client-link { display: inline-flex; align-items: center; min-height: 39px; padding: 0 14px; border: 1px solid var(--gold); color: var(--gold-light); font-family: var(--display); font-size: .58rem; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }.service-client-link:hover, .service-client-link:focus-visible { color: var(--void); background: var(--gold-light); outline: none; }
.service-dashboard-note { display: block; margin-top: 10px; color: var(--muted); font-size: .82rem; }
.lostcity-page { display: grid; gap: 18px; max-width: 1120px; margin: 0 auto; }.lostcity-page h1 { margin: 0; color: var(--gold-light); font-size: clamp(2.4rem, 6vw, 5rem); line-height: .92; text-align: center; }.lostcity-client { display: grid; place-items: center; min-height: min(72vh, 760px); padding: clamp(8px, 2vw, 20px); border: 1px solid var(--line); background: #000; box-shadow: inset 0 0 80px color-mix(in srgb, var(--wine) 12%, transparent); overflow: auto; }.lostcity-client canvas { display: block; width: min(100%, 1050px); height: auto; aspect-ratio: 789 / 532; background: #000; image-rendering: auto; }
.sanctum-actions { justify-self: end; display: inline-flex; align-items: center; gap: 8px; }
.sanctum-actions .sanctum-exit { justify-self: auto; }
.sanctum-account { display: inline-flex; align-items: center; min-height: 34px; padding: 0 11px; border: 1px solid color-mix(in srgb, var(--gold) 28%, transparent); color: var(--muted); font-family: var(--display); font-size: .55rem; letter-spacing: .13em; text-decoration: none; text-transform: uppercase; transition: border-color .18s ease, color .18s ease, background-color .18s ease; }
.sanctum-account:hover, .sanctum-account:focus-visible { border-color: var(--gold); background: color-mix(in srgb, var(--wine) 17%, transparent); color: var(--gold-light); outline: none; }
@media (max-width: 560px) { .sanctum-actions { gap: 5px; }.sanctum-account { padding: 0 8px; font-size: .5rem; }.sanctum-actions .sanctum-exit { padding: 0 8px; } }

/* Service reliquary panels. Unselected services remain unlinked. */
.service-card--panel { min-height: 410px; gap: 19px; }
.service-card--detail { cursor: pointer; }.service-card--detail:hover { border-color: var(--gold); transform: translateY(-2px); background: var(--panel-raised); }
.service-card--panel > .service-card__top, .service-card--panel > .service-card__body, .service-card--panel > .service-card__health, .service-card--panel > .service-card__metrics, .service-card--panel > .service-card__seal { align-self: stretch; width: 100%; box-sizing: border-box; }
.service-card__top { min-height: 52px; align-items: flex-start; }
.service-icon { width: 52px; height: 52px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid color-mix(in srgb, var(--gold) 58%, transparent); background: radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--wine) 48%, transparent), transparent 67%), color-mix(in srgb, var(--void) 74%, var(--wine-deep)); box-shadow: inset 0 0 18px color-mix(in srgb, var(--gold) 9%, transparent), 0 0 18px color-mix(in srgb, var(--wine) 15%, transparent); }
.service-icon img { width: 68%; height: 68%; object-fit: contain; }
.service-card__health { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding: 12px 13px; border: 1px solid color-mix(in srgb, var(--gold) 25%, transparent); background: color-mix(in srgb, var(--void) 42%, transparent); }
.service-card__health > span { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-family: var(--display); font-size: .53rem; letter-spacing: .12em; text-transform: uppercase; }
.service-card__health i { width: 7px; height: 7px; border: 1px solid var(--gold); border-radius: 50%; background: color-mix(in srgb, var(--gold) 20%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--wine) 28%, transparent); }
.service-card__health strong { color: var(--gold-light); font-family: var(--display); font-size: .61rem; font-weight: 600; letter-spacing: .07em; text-align: right; text-transform: uppercase; }
.service-card__health small { grid-column: 1 / -1; color: var(--muted); font-size: .78rem; line-height: 1.24; }
.service-card__health--unwired i { border-color: var(--wine-muted); background: color-mix(in srgb, var(--wine-muted) 42%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--wine) 18%, transparent); }
.service-card__health--healthy i { border-color: var(--gold-light); background: var(--gold); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 18%, transparent), 0 0 12px color-mix(in srgb, var(--gold) 56%, transparent); }
.service-card__health--degraded i { border-color: var(--muted); background: var(--muted); }.service-card__health--offline i, .service-card__health--unknown i { border-color: var(--wine-muted); background: var(--wine-muted); }
.service-card__metrics { position: relative; z-index: 1; display: grid; overflow: hidden; border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent); background: color-mix(in srgb, var(--void) 46%, transparent); }
.service-card__metric-group { display: grid; grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); }.service-card__metric-group + .service-card__metric-group { border-top: 1px solid color-mix(in srgb, var(--gold) 21%, transparent); background: color-mix(in srgb, var(--wine) 9%, transparent); }
.service-card__metric-group-label { grid-column: 1 / -1; padding: 8px 12px 6px; color: var(--muted); font-family: var(--display); font-size: .45rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.service-card__metric { display: grid; gap: 5px; min-width: 0; padding: 8px 10px 11px; border-left: 1px solid color-mix(in srgb, var(--gold) 18%, transparent); }.service-card__metric-group-label + .service-card__metric { border-left: 0; }
.service-card__metric b { color: var(--muted); font-family: var(--display); font-size: .47rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }.service-card__metric strong { overflow: hidden; color: var(--gold-light); font-family: var(--display); font-size: .76rem; font-weight: 600; letter-spacing: .015em; text-overflow: ellipsis; white-space: nowrap; }
.service-card--panel .service-card__seal { padding-top: 13px; border-top: 1px solid color-mix(in srgb, var(--gold) 19%, transparent); color: color-mix(in srgb, var(--muted) 92%, var(--ink)); font-family: var(--serif); font-size: .82rem; letter-spacing: 0; line-height: 1.25; text-transform: none; }
.service-detail { max-width: 920px; margin: 0 auto; }.service-detail__record { display: grid; gap: 23px; padding: clamp(24px, 5vw, 48px); border: 1px solid var(--line); background: linear-gradient(145deg, color-mix(in srgb, var(--wine-deep) 84%, var(--void)), color-mix(in srgb, var(--surface) 90%, var(--void))); box-shadow: inset 0 0 80px color-mix(in srgb, var(--wine) 12%, transparent); }.service-detail__head { display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: start; }.service-detail__head h1 { margin: 4px 0 10px; color: var(--gold-light); font-size: clamp(2rem, 5vw, 4rem); line-height: .95; }.service-detail__head p:last-child { max-width: 630px; margin: 0; color: var(--muted); font-size: 1.02rem; line-height: 1.4; }.service-detail__section { display: grid; gap: 10px; }.service-detail__section > .eyebrow { margin: 0; }.service-detail__stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent); background: color-mix(in srgb, var(--void) 46%, transparent); }.service-detail__stat { display: grid; gap: 5px; min-width: 0; padding: 11px 12px; border-right: 1px solid color-mix(in srgb, var(--gold) 18%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--gold) 18%, transparent); }.service-detail__stat b { color: var(--muted); font-family: var(--display); font-size: .48rem; letter-spacing: .1em; text-transform: uppercase; }.service-detail__stat strong { overflow: hidden; color: var(--gold-light); font-family: var(--display); font-size: .84rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }.service-detail__actions { display: flex; flex-wrap: wrap; gap: 9px; }.service-action { min-height: 39px; padding: 0 14px; border: 1px solid color-mix(in srgb, var(--gold) 42%, transparent); color: var(--gold-light); background: color-mix(in srgb, var(--wine-deep) 72%, transparent); font-family: var(--display); font-size: .56rem; letter-spacing: .1em; text-transform: uppercase; }.service-action:not(:disabled) { cursor: pointer; }.service-action:not(:disabled):hover, .service-action:not(:disabled):focus-visible { border-color: var(--gold-light); color: var(--void); background: var(--gold-light); outline: none; }.service-action:disabled { border-color: color-mix(in srgb, var(--muted) 30%, transparent); color: color-mix(in srgb, var(--muted) 48%, transparent); background: color-mix(in srgb, var(--void) 55%, transparent); cursor: not-allowed; }.service-detail__action-status { min-height: 1.2em; color: var(--muted); font-size: .84rem; line-height: 1.3; }
@media (max-width: 560px) { .service-card--panel { min-height: 0; }.service-card__health { grid-template-columns: 1fr; }.service-card__health strong { text-align: left; }.service-card__metric-group { grid-template-columns: repeat(2, minmax(0, 1fr)); }.service-card__metric { padding: 9px 11px 12px; }.service-card__metric strong { font-size: .82rem; }.service-detail__record { padding: 24px 20px; }.service-detail__head { grid-template-columns: 1fr; }.service-detail__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }.service-detail__stat { padding: 10px; } }

/* Shared live infrastructure strip. */
.proxmox-bar { border-top: 1px solid color-mix(in srgb, var(--gold) 13%, transparent); border-bottom-color: color-mix(in srgb, var(--gold) 36%, transparent); background: linear-gradient(90deg, color-mix(in srgb, var(--wine-deep) 94%, var(--void)), color-mix(in srgb, var(--surface) 75%, var(--void)), color-mix(in srgb, var(--wine-deep) 94%, var(--void))); box-shadow: inset 0 1px 20px color-mix(in srgb, var(--wine) 18%, transparent), 0 8px 22px rgba(0, 0, 0, .16); }
.proxmox-bar__inner { min-height: 86px; overflow: visible; }
.proxmox-bar__host strong::before { content: ""; width: 7px; height: 7px; flex: 0 0 auto; border: 1px solid var(--gold); border-radius: 50%; background: color-mix(in srgb, var(--gold) 80%, transparent); box-shadow: 0 0 10px color-mix(in srgb, var(--gold) 62%, transparent); }
.proxmox-bar__nodes { display: flex; align-items: stretch; min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.proxmox-bar__host, .proxmox-bar__mass { min-height: 86px; padding: 15px 16px; border-right-color: color-mix(in srgb, var(--gold) 18%, transparent); background: linear-gradient(135deg, color-mix(in srgb, var(--wine) 10%, transparent), transparent); }
.proxmox-bar__host { grid-template-columns: 72px repeat(3, minmax(0, 1fr)); grid-template-rows: 1fr; column-gap: 10px; min-width: 300px; }.proxmox-bar__host-link { color: inherit; text-decoration: none; }.proxmox-bar__host-link:focus-visible { outline: 1px solid var(--gold-light); outline-offset: 4px; }
.proxmox-bar__host strong { display: flex; align-items: center; gap: 9px; font-size: .72rem; }
.proxmox-bar__metrics { gap: 10px; }
.proxmox-bar__metrics span, .proxmox-bar__mass { color: var(--ink); font-size: 1rem; }
.proxmox-bar__metrics span { display: grid; min-width: 0; gap: 4px; }
.proxmox-bar__metrics--top { grid-column: 2; grid-row: 1; align-self: center; }.proxmox-bar__metrics--bottom { display: grid; grid-column: 3 / -1; grid-row: 1; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; align-self: center; }
.proxmox-bar__host b, .proxmox-bar__mass b { margin: 0; font-size: .5rem; }
.proxmox-bar__mass { display: grid; align-content: center; gap: 5px; min-width: 94px; color: var(--ink); }.proxmox-bar__mass > span { display: inline-flex; align-items: center; gap: 8px; }.proxmox-bar__mass i { width: 9px; height: 9px; border: 1px solid currentColor; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px currentColor; }.proxmox-bar__mass--green i { color: #62bf82; }.proxmox-bar__mass--yellow i { color: #e4bd52; }.proxmox-bar__mass--red i { color: #a91520; }.proxmox-bar__mass--unknown i { color: var(--muted); }
.proxmox-bar__host--degraded strong::before { border-color: var(--muted); background: var(--muted); box-shadow: 0 0 9px color-mix(in srgb, var(--muted) 50%, transparent); }
.proxmox-bar__host--offline strong::before, .proxmox-bar__host--unknown strong::before { border-color: var(--wine-muted); background: var(--wine-muted); box-shadow: 0 0 9px color-mix(in srgb, var(--wine-muted) 50%, transparent); }
.proxmox-bar__inner, .proxmox-bar__host, .proxmox-bar__mass { min-height: 64px; }
.proxmox-bar__host, .proxmox-bar__mass { padding-top: 10px; padding-bottom: 10px; }
.proxmox-bar__host-link { display: flex; grid-column: 1; grid-row: 1; align-items: center; }
@media (max-width: 560px) { .proxmox-bar__inner { width: calc(100% - 28px); }.proxmox-bar__nodes { margin: 0 -14px; padding-left: 14px; }.proxmox-bar__host, .proxmox-bar__mass { min-height: 82px; }.proxmox-bar__host { min-width: 300px; }.proxmox-bar__mass { min-width: 90px; } }

.sanctum-footer .shell { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }.sanctum-footer .shell > span:last-child { justify-self: end; }.sanctum-admin { display: inline-flex; min-height: 29px; align-items: center; padding: 0 11px; border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent); color: var(--gold-light); background: color-mix(in srgb, var(--wine-deep) 68%, transparent); font-family: var(--display); font-size: .5rem; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }.sanctum-admin:hover, .sanctum-admin:focus-visible { border-color: var(--gold-light); color: var(--ink); outline: none; }
@media (max-width: 560px) { .sanctum-footer .shell { grid-template-columns: 1fr; }.sanctum-footer .shell > span:last-child { justify-self: start; } }

.admin-upload { width: min(440px, calc(100% - 32px)); padding: 28px; border: 1px solid var(--line); color: var(--ink); background: var(--wine-deep); box-shadow: 0 24px 70px rgba(0, 0, 0, .58); }.admin-upload::backdrop { background: rgba(0, 0, 0, .72); }.admin-upload form[data-admin-upload-form] { display: grid; gap: 16px; }.admin-upload h2 { margin: 0; color: var(--gold-light); font-size: 2.1rem; }.admin-upload label { display: grid; gap: 7px; color: var(--muted); font-family: var(--display); font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; }.admin-upload select, .admin-upload input { min-width: 0; padding: 11px; border: 1px solid color-mix(in srgb, var(--gold) 36%, transparent); color: var(--ink); background: color-mix(in srgb, var(--void) 72%, transparent); font: inherit; letter-spacing: normal; text-transform: none; }.admin-upload input { color: var(--muted); }.admin-upload output { min-height: 1.2em; color: var(--muted); font-size: .84rem; }.admin-upload__close { float: right; border: 0; color: var(--muted); background: transparent; font-size: 1.5rem; cursor: pointer; }

.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }.tv-page { display: grid; gap: 18px; max-width: 1120px; margin: 0 auto; }.tv-page h1 { margin: 0; color: var(--gold-light); font-size: clamp(2.4rem, 6vw, 5rem); line-height: .92; text-align: center; }.tv-picker { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }.tv-picker button { min-height: 42px; padding: 0 17px; border: 1px solid color-mix(in srgb, var(--gold) 42%, transparent); color: var(--gold-light); background: color-mix(in srgb, var(--wine-deep) 72%, transparent); font-family: var(--display); font-size: .58rem; letter-spacing: .11em; text-transform: uppercase; cursor: pointer; }.tv-picker button[aria-pressed="true"], .tv-picker button:hover, .tv-picker button:focus-visible { border-color: var(--gold-light); color: var(--void); background: var(--gold-light); outline: none; }.tv-player { padding: clamp(12px, 2.4vw, 22px); border: 1px solid var(--line); background: linear-gradient(145deg, color-mix(in srgb, var(--wine-deep) 84%, var(--void)), color-mix(in srgb, var(--surface) 90%, var(--void))); box-shadow: inset 0 0 80px color-mix(in srgb, var(--wine) 12%, transparent); }.tv-player video { display: block; width: 100%; max-height: calc(100vh - 250px); aspect-ratio: 16 / 9; background: #000; object-fit: contain; }
.tv-page > h1 { max-width: none; }
.service-jump { display: grid; gap: 20px; margin: 0 0 clamp(52px, 8vw, 93px); }.service-jump__group { display: grid; justify-items: center; gap: 10px; padding-top: 20px; border-top: 1px solid var(--line-strong); }.service-jump__group:first-child { padding-top: 0; border-top: 0; }.service-jump__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }.service-jump a { min-height: 34px; display: inline-flex; align-items: center; padding: 0 11px; border: 1px solid color-mix(in srgb, var(--gold) 32%, transparent); color: var(--gold-light); background: color-mix(in srgb, var(--wine-deep) 68%, transparent); font-family: var(--display); font-size: .52rem; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }.service-jump__section { border-color: var(--gold) !important; }.service-jump a:hover, .service-jump a:focus-visible { border-color: var(--gold-light); color: var(--void); background: var(--gold-light); outline: none; }.service-catalog-section { scroll-margin-top: 24px; }.service-catalog-section + .service-catalog-section { margin-top: clamp(52px, 8vw, 93px); padding-top: clamp(52px, 8vw, 93px); border-top: 1px solid var(--line-strong); }.service-card[id] { scroll-margin-top: 24px; }