:root {
  color-scheme: dark;
  font-family: "Segoe UI", Arial, sans-serif;
  background: #0b0807;
  color: #f3e8d4;
  --bg: #0b0807;
  --surface: #17100e;
  --surface-raised: #201512;
  --surface-deep: #0e0a09;
  --crimson: #641b12;
  --crimson-bright: #a93a1d;
  --ember: #e26424;
  --ember-soft: #b94a22;
  --bronze: #8d6b3d;
  --bronze-dark: #4b321d;
  --gold: #d6aa61;
  --gold-bright: #f0ce89;
  --line: #5a3b25;
  --line-soft: #332119;
  --muted: #b5a89b;
  --success: #a4bc83;
  --danger: #e4937f;
  --shadow: #000000b8;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--bg); }
body { min-height: 100vh; margin: 0; display: flex; flex-direction: column; background: #0b0807; }
a { color: inherit; }
button, input, textarea { font: inherit; letter-spacing: 0; }
h1, h2, h3, p { letter-spacing: 0; }
h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; font-weight: 600; }

.site-header {
  min-height: 76px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  padding: 0 max(24px, calc((100vw - 1180px) / 2));
  border-top: 2px solid #7c3a1d;
  border-bottom: 1px solid #6d4728;
  background: #0e0908f2;
  box-shadow: 0 12px 30px #00000094, inset 0 -1px #e8883517;
  backdrop-filter: blur(10px);
  position: sticky;
  top: 0;
  z-index: 20;
}
.brand { display: inline-flex; align-items: center; gap: 12px; width: max-content; text-decoration: none; color: var(--gold-bright); }
.brand > span { font: 700 18px Georgia, serif; text-shadow: 0 1px 8px #e6512440; }
.brand small { display: block; margin-top: 2px; font: 700 10px "Segoe UI", Arial, sans-serif; color: #b98d59; text-transform: uppercase; }
.brand-mark { width: 48px; height: 48px; object-fit: contain; filter: drop-shadow(0 0 7px #e65f2638); transition: filter 180ms ease, transform 180ms ease; }
.brand:hover .brand-mark { transform: scale(1.04); filter: drop-shadow(0 0 11px #ef6b2b70); }

.site-nav { display: flex; align-self: stretch; }
.site-nav a { min-width: 116px; display: grid; place-items: center; position: relative; color: #c6b7a6; text-decoration: none; font: 600 14px Georgia, serif; text-shadow: 0 1px #000; }
.site-nav a::after { content: ""; position: absolute; left: 20%; right: 20%; bottom: 0; height: 2px; background: var(--ember); transform: scaleX(0); transition: transform 180ms ease, box-shadow 180ms ease; }
.site-nav a:hover, .site-nav a.active { color: #fff1d9; background: #8c2d121a; }
.site-nav a:hover::after, .site-nav a.active::after { transform: scaleX(1); box-shadow: 0 0 12px #f06b2e; }

.language-switch { justify-self: end; display: flex; border: 1px solid #65452d; background: #100b09; box-shadow: inset 0 0 0 1px #000; }
.language-switch button { width: 44px; height: 34px; border: 0; border-right: 1px solid #3b281d; background: transparent; color: #a79786; cursor: pointer; }
.language-switch button:last-child { border-right: 0; }
.language-switch button:hover { color: #f4dfbd; background: #6d21121f; }
.language-switch button[aria-pressed="true"] { color: #fff0d4; background: #5b2014; box-shadow: inset 0 -2px var(--ember); }

main { flex: 1; }
.page { min-height: calc(100vh - 172px); }
.content-shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto; padding: 38px 0 64px; }
.narrow-shell { width: min(1000px, calc(100% - 32px)); }

.service-banner {
  min-height: 510px;
  display: flex;
  align-items: center;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: url("/assets/xen-hero-v2.webp") center 51% / cover no-repeat;
  border-bottom: 1px solid #7e4e28;
  box-shadow: inset 0 -72px 70px #090605, 0 16px 38px #000;
}
.service-banner::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #0a05053f; box-shadow: inset 0 0 160px #0000009e; }
.service-banner::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: #a03d1c; box-shadow: 0 0 18px #ed6c2c, 0 -2px 16px #c638187a; opacity: .62; }
.banner-content { width: min(1180px, calc(100% - 32px)); margin: 0 auto; padding: 72px 0 68px; position: relative; z-index: 1; }
.banner-content::before { content: ""; position: absolute; width: 76px; height: 2px; top: 52px; left: 0; background: var(--ember); box-shadow: 0 0 12px #e55a22; }
.eyebrow { margin: 0 0 9px; color: #d89350; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.banner-content h1 { margin: 0; max-width: 680px; color: #fff1d9; font-size: 76px; line-height: .9; text-shadow: 0 3px 3px #000, 0 0 28px #b62d1459; }
.banner-content h1 span { display: block; margin-top: 14px; color: var(--gold-bright); font: 700 22px "Segoe UI", Arial, sans-serif; line-height: 1.2; text-transform: uppercase; text-shadow: 0 2px 10px #000; }
.banner-content > p:last-child { max-width: 570px; margin: 18px 0 0; color: #dbcbb9; font-size: 17px; line-height: 1.55; text-shadow: 0 2px 6px #000; }

.status-band { display: grid; grid-template-columns: minmax(210px, .72fr) minmax(0, 2fr); gap: 36px; align-items: center; padding: 27px 0 34px; border-bottom: 1px solid var(--line-soft); }
.status-band h2, .page-heading h1 { margin: 0; color: #f1dfc3; font-size: 29px; }
.status-metrics { margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid #694528; background: #25150f; box-shadow: 0 16px 34px #0000005c, inset 0 0 0 1px #0b0706; }
.status-metrics div { min-height: 92px; padding: 17px 18px; position: relative; border-right: 1px solid #4b2d1e; background: #160e0c; }
.status-metrics div:last-child { border-right: 0; }
.status-metrics div::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: #763019; }
.status-metrics dt { color: #aa9886; font-size: 11px; font-weight: 600; text-transform: uppercase; }
.status-metrics dd { margin: 9px 0 0; color: #fff0d5; font: 700 25px Georgia, serif; text-shadow: 0 0 12px #e34f2630; }

.home-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); gap: 26px; padding: 35px 0; }
.primary-actions { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid #573722; background: #573722; gap: 1px; box-shadow: 0 18px 38px #00000045; }
.primary-actions article, .notice-panel, .registration-form, .registration-info { position: relative; background: #17100e; }
.primary-actions article { min-height: 260px; padding: 29px; }
.primary-actions article::before, .notice-panel::before, .registration-form::before, .registration-info::before, .table-wrap::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: #742817; box-shadow: 0 0 12px #d7572436; }
.primary-actions h2, .notice-panel h2 { margin: 0; color: #ead8bc; font-size: 23px; }
.primary-actions p:not(.eyebrow), .notice-panel p:not(.eyebrow) { min-height: 70px; color: var(--muted); line-height: 1.6; }
.notice-panel { padding: 29px; border: 1px solid #573722; box-shadow: 0 18px 38px #00000045; }
.notice-panel #public-motd { min-height: 0; white-space: pre-wrap; }

.button {
  min-width: 184px;
  min-height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  isolation: isolate;
  padding: 5px 30px;
  border: 0;
  background: transparent;
  color: #f5dfb8;
  text-decoration: none;
  font: 700 14px Georgia, serif;
  text-shadow: 0 2px 2px #000;
  cursor: pointer;
  transition: color 180ms ease, transform 180ms ease, filter 180ms ease;
}
.button::before { content: ""; position: absolute; inset: -7px -14px; z-index: -1; background: url("/assets/xen-button-v2.webp") center / 100% 100% no-repeat; filter: brightness(.85) saturate(.9); transition: filter 180ms ease, transform 180ms ease; }
.button::after { content: ""; position: absolute; left: 22%; right: 22%; bottom: 8px; height: 1px; background: #da5326; box-shadow: 0 0 9px #e76a2f; opacity: .38; transition: opacity 180ms ease, left 180ms ease, right 180ms ease; }
.button:hover { color: #fff4dc; transform: translateY(-1px); }
.button:hover::before { filter: brightness(1.2) saturate(1.2) drop-shadow(0 0 8px #d94d274d); }
.button:hover::after { left: 16%; right: 16%; opacity: .95; }
.button:active { transform: translateY(1px); }
.button:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: 5px; }
.button.secondary { color: #e6c78e; }
.submit-button { width: min(100%, 240px); margin: 25px auto 0; }
.submit-button:disabled { cursor: wait; opacity: .55; filter: grayscale(.45); }

.independence-note { display: grid; grid-template-columns: 260px 1fr; gap: 32px; padding: 23px 0; border-top: 1px solid var(--line-soft); color: #a99b8c; font-size: 13px; line-height: 1.6; }
.independence-note strong { color: #d8c5a7; }
.independence-note p { margin: 0; }

.page-heading { padding: 37px 0 29px; border-bottom: 1px solid var(--line); position: relative; }
.page-heading::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 110px; height: 2px; background: var(--ember); box-shadow: 0 0 10px #e85f28; }
.page-heading.compact { display: flex; flex-direction: column; }
.page-heading > p:last-child { max-width: 700px; margin: 12px 0 0; color: var(--muted); line-height: 1.6; }
.form-page, .ladder-page, .legal-page { background: linear-gradient(180deg, #2b100b28, #0b080700 280px); }
.registration-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(270px, .65fr); gap: 26px; padding-top: 32px; }
.registration-form, .registration-info { border: 1px solid #583722; box-shadow: 0 18px 40px #0000004d, inset 0 0 0 1px #090605; }
.registration-form { padding: 29px; }
.registration-form > label:not(.check-row) { display: block; margin: 19px 0 7px; color: #e0cfb6; font-size: 13px; font-weight: 700; }
.registration-form > label:first-child { margin-top: 0; }
.registration-form input:not([type="checkbox"]) { width: 100%; min-height: 47px; border: 1px solid #61412b; border-radius: 2px; background: #0c0807; color: #fff0d8; padding: 10px 12px; outline: none; box-shadow: inset 0 2px 10px #000; }
.registration-form input:hover { border-color: #7b5132; }
.registration-form input:focus { border-color: var(--ember-soft); box-shadow: inset 0 2px 10px #000, 0 0 0 2px #e15a2524, 0 0 12px #cf452426; }
.field-help { margin: 7px 0 0; color: #9f9387; font-size: 12px; line-height: 1.5; }
.field-help.warning { color: #d6ad78; }
.check-row { display: grid; grid-template-columns: 19px 1fr; gap: 10px; align-items: start; margin-top: 23px; color: #c7b9a8; font-size: 13px; line-height: 1.55; }
.check-row input { width: 17px; height: 17px; margin: 2px 0 0; accent-color: #a43c1d; }
.check-row a { color: var(--gold-bright); }
.form-status { min-height: 24px; margin: 14px 0 0; text-align: center; font-size: 13px; line-height: 1.5; }
.form-status.error { color: var(--danger); }
.form-status.success { color: var(--success); }
.registration-info { align-self: start; padding: 27px; }
.registration-info ul { padding-left: 19px; color: #c5b7a7; line-height: 1.6; }
.registration-info li + li { margin-top: 13px; }
.registration-info > p:last-child { margin: 25px 0 0; padding-top: 19px; border-top: 1px solid var(--line-soft); color: #9f9387; font-size: 13px; line-height: 1.55; }

.ladder-summary { display: flex; flex-wrap: wrap; gap: 32px; padding: 21px 0; color: var(--muted); font-size: 13px; }
.ladder-summary strong { color: #fff0d5; }
.table-wrap { overflow-x: auto; position: relative; border: 1px solid #604027; background: #140d0b; box-shadow: 0 18px 40px #00000052; }
table { width: 100%; min-width: 820px; border-collapse: collapse; }
th { padding: 14px; text-align: left; background: #251510; color: #dda85e; border-bottom: 1px solid #70452a; font-size: 11px; text-transform: uppercase; }
td { padding: 14px; border-bottom: 1px solid #352018; color: #d4c7b8; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr { transition: background 150ms ease, box-shadow 150ms ease; }
tbody tr:hover { background: #7b291514; box-shadow: inset 3px 0 var(--ember-soft); }
.rank-cell { color: var(--gold-bright); font-weight: 800; }
.empty-row { padding: 42px 14px; text-align: center; color: var(--muted); }

.legal-shell { max-width: 900px; padding-top: 50px; }
.legal-shell > h1 { margin: 0 0 12px; color: #f0dec2; font-size: 32px; }
.legal-shell > .legal-intro { margin: 0 0 35px; color: var(--muted); line-height: 1.65; }
.legal-section { padding: 26px 0; border-top: 1px solid var(--line-soft); }
.legal-section h2 { margin: 0 0 12px; color: #dfc49a; font-size: 20px; }
.legal-section p, .legal-section li { color: #c4b7a8; line-height: 1.7; }
.legal-section ul { padding-left: 20px; }
.legal-warning { padding: 17px 18px; border-left: 3px solid var(--ember); background: #2a1711; color: #e0c49d; line-height: 1.6; box-shadow: inset 0 0 0 1px #4c2b1d; }

.site-footer { min-height: 104px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 21px max(24px, calc((100vw - 1180px) / 2)); border-top: 1px solid #664126; background: #0e0908; box-shadow: inset 0 1px #120b08, 0 -16px 36px #00000052; }
.site-footer strong { color: #dfc8a4; font: 600 15px Georgia, serif; }
.site-footer p { margin: 5px 0 0; color: #998d80; font-size: 12px; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 22px; }
.site-footer a { color: #b7a897; font-size: 12px; text-decoration: none; }
.site-footer a:hover { color: var(--gold-bright); }

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

@media (max-width: 850px) {
  .site-header { grid-template-columns: 1fr auto; padding: 9px 16px; gap: 10px; }
  .site-nav { grid-column: 1 / -1; order: 3; overflow-x: auto; min-height: 43px; border-top: 1px solid #3b261a; }
  .site-nav a { min-width: 108px; }
  .service-banner { min-height: 440px; background-position: 59% 50%; }
  .status-band, .home-grid, .registration-layout { grid-template-columns: 1fr; }
  .status-metrics { grid-template-columns: 1fr 1fr; }
  .status-metrics div:nth-child(2) { border-right: 0; }
  .status-metrics div:nth-child(-n+2) { border-bottom: 1px solid #4b2d1e; }
  .independence-note { grid-template-columns: 1fr; gap: 8px; }
}

@media (max-width: 560px) {
  .brand small { display: none; }
  .brand-mark { width: 42px; height: 42px; }
  .service-banner { min-height: 390px; align-items: end; background-position: 62% 50%; }
  .banner-content { padding: 55px 0 45px; }
  .banner-content::before { top: 38px; }
  .banner-content h1 { font-size: 56px; }
  .banner-content h1 span { max-width: 280px; font-size: 15px; line-height: 1.35; }
  .banner-content > p:last-child { max-width: 310px; font-size: 15px; }
  .legal-shell > h1 { font-size: 28px; overflow-wrap: anywhere; }
  .content-shell, .banner-content { width: min(100% - 24px, 1180px); }
  .primary-actions, .status-metrics { grid-template-columns: 1fr; }
  .status-metrics div { min-height: 76px; border-right: 0; border-bottom: 1px solid #4b2d1e; }
  .status-metrics div:last-child { border-bottom: 0; }
  .primary-actions article { min-height: 0; padding: 25px 20px 29px; }
  .button { width: min(100%, 290px); min-width: 0; }
  .registration-form { padding: 24px 17px; }
  .submit-button { width: min(100%, 240px); }
  .site-footer { align-items: flex-start; flex-direction: column; padding: 25px 16px; }
}