:root {
  color-scheme: light;
  --ink: #2a2015;
  --ink-soft: #6d5d47;
  --paper: #e8ddc7;
  --paper-deep: #cfbd9d;
  --red: #983d2e;
  --red-dark: #70291f;
  --line: rgba(58, 42, 25, 0.22);
  --night: #17110d;
  --serif: "Newsreader", Georgia, serif;
  --sans: "Manrope", system-ui, sans-serif;
  --mono: "DM Mono", ui-monospace, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background-color: var(--paper); background-image: radial-gradient(circle at 18% 12%, rgba(255,255,255,.28), transparent 28%), radial-gradient(circle at 82% 72%, rgba(92,55,27,.07), transparent 34%), repeating-linear-gradient(0deg, rgba(73,48,27,.018) 0, rgba(73,48,27,.018) 1px, transparent 1px, transparent 4px); color: var(--ink); font-family: var(--sans); overflow-x: hidden; }
body::before { content: ""; position: fixed; z-index: 1000; inset: 0; pointer-events: none; opacity: .18; mix-blend-mode: multiply; background-image: repeating-linear-gradient(113deg, transparent 0 8px, rgba(66,43,23,.035) 8px 9px), repeating-linear-gradient(17deg, transparent 0 13px, rgba(255,255,255,.055) 13px 14px); }
main, section, article, div, nav, form { min-width: 0; }
img, svg { max-width: 100%; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
::selection { background: var(--red); color: #fff; }
.sr-only, .skip-link { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link:focus { z-index: 100; width: auto; height: auto; clip: auto; margin: 0; padding: .8rem 1rem; background: #fff; color: #000; }

.site-header { position: fixed; z-index: 30; top: 0; left: 0; width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 1.1rem clamp(1.2rem, 3vw, 3rem); color: #f5f0e8; background: rgba(24,16,11,.95); border-bottom: 1px solid rgba(232,221,199,.13); box-shadow: 0 .35rem 1.5rem rgba(8,5,3,.16); backdrop-filter: blur(10px); transition: padding .35s ease; }
.site-header.is-scrolled { padding-top: .8rem; padding-bottom: .8rem; }
.wordmark { display: inline-flex; align-items: center; gap: .65rem; font: 500 .62rem/1 var(--mono); letter-spacing: .13em; text-shadow: 0 1px 0 rgba(0,0,0,.5); }
.wordmark em { opacity: .48; font-style: normal; font-weight: 300; }
.wordmark-mark { width: 1.1rem; height: 1.1rem; border: 1px solid currentColor; border-radius: 50%; position: relative; }
.wordmark-mark::before, .wordmark-mark::after { content: ""; position: absolute; background: currentColor; }
.wordmark-mark::before { width: 140%; height: 1px; left: -20%; top: 50%; transform: rotate(-35deg); }
.wordmark-mark::after { width: 3px; height: 3px; border-radius: 50%; inset: 0; margin: auto; }
.site-nav { display: flex; align-items: center; gap: clamp(1rem, 2vw, 2rem); font: 500 .6rem/1 var(--mono); text-transform: uppercase; letter-spacing: .09em; }
.site-nav a, .text-button { position: relative; opacity: .78; transition: opacity .2s; }
.site-nav a::after { content: ""; position: absolute; left: 0; bottom: -.45rem; width: 100%; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .25s ease; }
.site-nav a:hover, .site-nav a:focus-visible, .text-button:hover, .text-button:focus-visible { opacity: 1; }
.site-nav a:hover::after, .site-nav a:focus-visible::after { transform: scaleX(1); transform-origin: left; }
.text-button { border: 0; background: transparent; color: inherit; cursor: pointer; font: inherit; text-transform: inherit; letter-spacing: inherit; padding: 0; }
.text-button span { color: #e56355; margin-left: .3rem; }
.account-button { min-height: 2.15rem; display: inline-flex; align-items: center; gap: .5rem; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.04); color: inherit; padding: .25rem .65rem; cursor: pointer; font: inherit; text-transform: uppercase; letter-spacing: inherit; }
.account-button:hover { border-color: rgba(255,255,255,.6); background: rgba(255,255,255,.1); }
.account-button img { width: 1.55rem; height: 1.55rem; border-radius: 50%; object-fit: cover; }
.account-button b { padding: .22rem .35rem; background: var(--red); color: #fff; font-size: .5rem; letter-spacing: .08em; }
.nav-toggle { display: none; border: 0; padding: .4rem; background: none; cursor: pointer; }
.nav-toggle > span:not(.sr-only) { display: block; width: 1.4rem; height: 1px; background: currentColor; margin: .3rem 0; }

.hero { position: relative; isolation: isolate; min-height: 88svh; display: grid; align-content: center; padding: 7rem clamp(1.2rem, 7vw, 7rem) 4rem; overflow: hidden; color: #f4ead8; background: var(--night) url("/hero-background-v2.png") 48% center / cover no-repeat; box-shadow: inset 0 0 10rem rgba(31,16,8,.42); }
.hero::after { content: ""; position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg, rgba(12,11,9,.95) 0%, rgba(12,11,9,.78) 40%, rgba(12,11,9,.26) 72%, rgba(12,11,9,.36) 100%), linear-gradient(0deg, rgba(12,11,9,.78) 0%, transparent 43%, rgba(12,11,9,.2) 100%); }
.hero::before { content: ""; position: absolute; z-index: -1; inset: 0; background: rgba(113,58,31,.1); mix-blend-mode: color; box-shadow: inset 0 0 9rem rgba(22,10,5,.48); }
.hero-grid { display: none; }
.sun { display: none; position: absolute; z-index: -2; width: min(38vw, 34rem); aspect-ratio: 1; border-radius: 50%; right: 8vw; top: 14%; background: linear-gradient(#d95747, #9a2a23); box-shadow: 0 0 100px rgba(183,58,47,.18); }
.sun::after { content: ""; position: absolute; inset: 20% -10% auto; height: 8%; border-top: 7px solid var(--night); border-bottom: 4px solid var(--night); opacity: .38; }
.ridge { display: none; position: absolute; z-index: -1; inset: auto -5% 0; background: #242019; clip-path: polygon(0 78%, 8% 63%, 15% 71%, 24% 47%, 31% 61%, 38% 40%, 46% 60%, 55% 32%, 61% 47%, 69% 24%, 76% 48%, 84% 36%, 93% 64%, 100% 52%, 100% 100%, 0 100%); }
.ridge-back { height: 46%; opacity: .82; }
.ridge-front { z-index: 0; height: 32%; background: #171511; clip-path: polygon(0 70%, 8% 52%, 17% 73%, 25% 44%, 36% 65%, 44% 49%, 52% 75%, 61% 53%, 70% 69%, 80% 42%, 91% 65%, 100% 49%, 100% 100%, 0 100%); }
.hero-copy { position: relative; z-index: 2; max-width: 65rem; }
.eyebrow { margin: 0 0 1.5rem; display: flex; align-items: center; gap: .7rem; font: 500 .64rem/1.3 var(--mono); letter-spacing: .2em; text-transform: uppercase; }
.eyebrow > span { display: inline-block; width: 2.5rem; height: 1px; background: currentColor; opacity: .65; }
.hero h1 { max-width: 820px; margin: 0; font: 300 clamp(3.8rem, 8vw, 7.2rem)/.82 var(--serif); letter-spacing: -.055em; text-wrap: balance; }
.hero h1 i, h2 em { color: #d95a4c; font-weight: 300; }
.hero-intro { width: min(34rem, 85vw); margin: 1.6rem 0 0; color: rgba(245,240,232,.68); font-size: clamp(.86rem, 1.1vw, .98rem); line-height: 1.7; }
.hero-actions { margin: 1.6rem 0 0; display: flex; gap: .65rem; flex-wrap: wrap; }
.button { border: 1px solid transparent; min-height: 3rem; display: inline-flex; align-items: center; justify-content: center; gap: 1rem; padding: 0 1.1rem; cursor: pointer; font: 500 .62rem/1 var(--mono); text-transform: uppercase; letter-spacing: .12em; transition: transform .2s, background .2s, color .2s, border-color .2s; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 2px 0 rgba(31,19,10,.18); }
.button:hover { transform: translateY(-2px); }
.button:disabled { cursor: wait; opacity: .62; transform: none; }
.button-primary { background: var(--red); color: #f9eedc; }
.button-primary:hover { background: var(--red-dark); }
.button-ghost { border-color: rgba(255,255,255,.22); color: #fff; background: rgba(255,255,255,.03); }
.button-ghost:hover { border-color: rgba(255,255,255,.55); }
.hero-meta { position: absolute; z-index: 2; right: clamp(1.2rem, 3vw, 3rem); bottom: 1.5rem; display: flex; }
.hero-meta div { display: grid; gap: .4rem; }
.hero-meta span, .hero-meta strong { font: 400 .57rem/1 var(--mono); letter-spacing: .1em; }
.hero-meta span { color: rgba(255,255,255,.36); }
.hero-meta strong { font-weight: 400; }
.hero-meta strong i { display: inline-block; width: .45rem; height: .45rem; border-radius: 50%; background: #d95a4c; margin-right: .35rem; box-shadow: 0 0 0 4px rgba(217,90,76,.12); }
.scroll-cue { position: absolute; z-index: 2; bottom: 2rem; left: clamp(1.2rem, 3vw, 3rem); display: grid; gap: .7rem; color: rgba(255,255,255,.45); font: 400 .55rem/1 var(--mono); text-transform: uppercase; letter-spacing: .13em; }
.scroll-cue i { width: 1px; height: 2.5rem; background: currentColor; animation: scrollPulse 1.8s ease-in-out infinite; }

.section { padding: clamp(4rem, 8vw, 7.5rem) clamp(1.2rem, 7vw, 7rem); }
.section[id], .hero[id] { scroll-margin-top: 4.5rem; }
.section-index { display: flex; align-items: center; gap: .65rem; font: 500 .6rem/1 var(--mono); letter-spacing: .16em; color: var(--ink-soft); text-transform: uppercase; }
.section-index::after { content: ""; width: 2rem; height: 1px; background: currentColor; opacity: .45; }
.statement { display: grid; grid-template-columns: .34fr 1.18fr .7fr; gap: clamp(1.5rem, 3vw, 3.25rem); padding-top: clamp(3.25rem, 5.5vw, 5.25rem); padding-bottom: clamp(3.25rem, 5.5vw, 5.25rem); border-bottom: 1px solid var(--line); }
.statement-copy .kicker { margin: 0 0 1rem; color: var(--red); font: 400 .7rem/1.3 var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.statement h2, .server-status h2, .roadmap h2, .rules h2, .applications h2, .faq h2, .application-dialog h2 { margin: 0; font: 300 clamp(2.8rem, 5vw, 5.2rem)/.94 var(--serif); letter-spacing: -.04em; }
.statement h2 { max-width: 12ch; font-size: clamp(2.7rem, 4.4vw, 4.55rem); line-height: .96; }
.statement-notes { padding-top: 2.2rem; color: var(--ink-soft); font-size: .85rem; line-height: 1.65; }
.statement-notes p { margin: 0 0 1.1rem; }
.principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; padding-top: 0; padding-bottom: 0; }
.principle { min-height: 13.5rem; padding: 1.65rem clamp(1.5rem, 3vw, 3rem) 1.9rem; display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid var(--line); background: rgba(255,250,239,.14); }
.principle:first-child { border-left: 1px solid var(--line); }
.principle > span { color: var(--red); font: 400 .62rem/1 var(--mono); }
.principle h3 { margin: 0 0 .65rem; font: 400 clamp(1.65rem, 2.2vw, 2.25rem)/1 var(--serif); }
.principle p { margin: 0; max-width: 23rem; color: var(--ink-soft); font-size: .82rem; line-height: 1.65; }
.server-status { display: grid; grid-template-columns: .72fr 1fr; gap: clamp(2.5rem, 7vw, 8rem); align-items: center; color: #eee1ca; background: radial-gradient(circle at 85% 15%, rgba(152,61,46,.2), transparent 34%), #1b1510; border-top: 1px solid rgba(255,255,255,.1); border-bottom: 1px solid rgba(0,0,0,.55); }
.server-status .section-index { margin-bottom: clamp(2.25rem, 4vw, 4rem); color: rgba(238,225,202,.48); }
.server-status .kicker { margin: 0 0 .9rem; color: #c86656; font: 500 .66rem/1.2 var(--mono); letter-spacing: .14em; }
.server-status h2 em { color: #d85f4e; }
.server-status-copy > p:last-child { max-width: 30rem; margin: 1.5rem 0 0; color: rgba(238,225,202,.62); font-size: .88rem; line-height: 1.75; }
.status-card { padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid rgba(238,225,202,.22); outline: 1px solid rgba(238,225,202,.08); outline-offset: -7px; background: rgba(5,3,2,.24); }
.status-card-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 1.5rem; border-bottom: 1px solid rgba(238,225,202,.14); color: rgba(238,225,202,.4); font: 500 .58rem/1 var(--mono); text-transform: uppercase; letter-spacing: .13em; }
.status-pill { display: inline-flex; align-items: center; gap: .65rem; color: #e7b0a7; }
.status-pill i { width: .48rem; height: .48rem; border-radius: 50%; background: #bd4d3d; box-shadow: 0 0 0 5px rgba(189,77,61,.12); }
.status-facts { display: grid; grid-template-columns: 1fr 1fr; margin: 1.7rem 0; }
.status-facts > div { display: grid; gap: .55rem; padding-right: 1.5rem; }
.status-facts > div + div { padding-left: 1.5rem; border-left: 1px solid rgba(238,225,202,.14); }
.status-facts span { color: rgba(238,225,202,.42); font: 500 .58rem/1 var(--mono); text-transform: uppercase; letter-spacing: .12em; }
.status-facts strong { font: 400 clamp(1.3rem, 2vw, 1.8rem)/1.1 var(--serif); }
.status-card > p { max-width: 31rem; margin: 0 0 1.5rem; color: rgba(238,225,202,.6); font-size: .84rem; line-height: 1.7; }
.rules { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(3rem, 6vw, 6rem); background: #d2c09f; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.rules-heading .kicker { margin: 3rem 0 1rem; color: var(--red); font: 400 .68rem/1.3 var(--mono); letter-spacing: .12em; }
.rules-empty { min-height: 23rem; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(1.7rem, 3vw, 3rem); border: 1px solid rgba(58,42,25,.3); outline: 1px solid rgba(255,248,232,.22); outline-offset: -6px; background: rgba(246,234,211,.28); }
.rules-status { display: flex; align-items: center; gap: .6rem; color: var(--red-dark); font: 500 .58rem/1 var(--mono); text-transform: uppercase; letter-spacing: .13em; }
.rules-status i { width: .42rem; height: .42rem; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 5px rgba(183,58,47,.11); }
.rules-count { margin: 0 0 1rem; color: var(--red); font: 400 .65rem/1 var(--mono); letter-spacing: .15em; }
.rules-empty h3 { margin: 0 0 1rem; font: 400 clamp(2.2rem, 3.5vw, 3.8rem)/1 var(--serif); letter-spacing: -.03em; }
.rules-empty div > p:last-child { max-width: 34rem; margin: 0; color: var(--ink-soft); font-size: .88rem; line-height: 1.8; }
.text-link { width: max-content; border: 0; border-bottom: 1px solid currentColor; background: none; padding: 0 0 .35rem; cursor: pointer; font: 500 .62rem/1 var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.text-link span { margin-left: .5rem; color: var(--red); }
.applications { color: #eee1ca; background: radial-gradient(circle at 85% 15%, rgba(152,61,46,.2), transparent 34%), #1b1510; border-top: 1px solid rgba(255,255,255,.1); border-bottom: 1px solid rgba(0,0,0,.55); }
.applications .section-index { color: rgba(238,225,202,.48); }
.applications h2 em { color: #d85f4e; }
.applications-intro { display: grid; grid-template-columns: .65fr 1.15fr .75fr; gap: 4rem; align-items: end; }
.applications-intro > p { margin: 0; color: rgba(238,225,202,.62); font-size: .9rem; line-height: 1.75; }
.application-list { display: grid; gap: 1rem; margin-top: 3rem; }
.application-card { position: relative; display: grid; grid-template-columns: .35fr 1.7fr auto; gap: 1.5rem; padding: clamp(1.6rem, 3vw, 2.5rem); border: 1px solid rgba(238,225,202,.22); outline: 1px solid rgba(238,225,202,.08); outline-offset: -7px; align-items: center; background: rgba(5,3,2,.24); transition: opacity .25s; }
.application-card::before { content: none; }
.card-number { align-self: start; font: 400 .64rem/1 var(--mono); color: rgba(238,225,202,.42); }
.availability { margin: 0 0 1.2rem; display: flex; align-items: center; gap: .5rem; color: rgba(238,225,202,.42); font: 500 .58rem/1 var(--mono); text-transform: uppercase; letter-spacing: .12em; }
.availability i { width: .4rem; height: .4rem; border-radius: 50%; background: #918b80; }
.availability.open { color: #e7b0a7; }
.availability.open i { background: #bd4d3d; box-shadow: 0 0 0 4px rgba(189,77,61,.12); }
.card-copy h3 { margin: 0 0 .8rem; font: 400 clamp(2rem, 3vw, 3rem)/1 var(--serif); }
.card-copy > p:not(.availability) { max-width: 42rem; margin: 0; color: rgba(238,225,202,.62); font-size: .87rem; line-height: 1.7; }
.card-copy ul { list-style: none; display: flex; gap: .55rem; flex-wrap: wrap; margin: 1.3rem 0 0; padding: 0; }
.card-copy li { padding: .45rem .65rem; border: 1px solid rgba(238,225,202,.22); background: rgba(238,225,202,.04); color: rgba(238,225,202,.76); font: 400 .55rem/1 var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.round-button { width: 3.7rem; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(238,225,202,.7); color: #eee1ca; background: transparent; cursor: pointer; font-size: 1.2rem; transition: background .25s, color .25s, transform .25s; }
.round-button:hover { background: #eee1ca; color: #1b1510; transform: rotate(45deg); }
.round-button:disabled { cursor: not-allowed; opacity: .45; transform: none; }
.application-card.muted { opacity: .58; }
.button-light { margin-top: 1.3rem; color: var(--ink); background: #f3eee6; }
.button-light:hover { background: #fff; }
.faq { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 7vw, 7rem); }
.faq-heading h2 { margin-top: 2rem; font-size: clamp(2.8rem, 5vw, 5rem); }
.faq-list { border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; padding: 1.35rem 0; display: flex; justify-content: space-between; gap: 2rem; cursor: pointer; font: 400 .92rem/1.3 var(--sans); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary span { transition: transform .2s; color: var(--red); font-size: 1.3rem; }
.faq details[open] summary span { transform: rotate(45deg); }
.faq details p { margin: -.3rem 3rem 1.7rem 0; color: var(--ink-soft); font-size: .86rem; line-height: 1.75; }
.site-footer { min-height: 7rem; padding: 1.5rem clamp(1.2rem, 3vw, 3rem); display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: end; gap: 1.5rem; background: #160f0a; color: rgba(246,232,208,.76); border-top: 1px solid rgba(232,210,177,.12); }
.site-footer > p { margin: 0; text-align: center; color: rgba(255,255,255,.38); font: 400 .7rem/1.4 var(--mono); }
.site-footer > div:last-child { display: flex; justify-content: flex-end; gap: 1.5rem; font: 400 .58rem/1 var(--mono); letter-spacing: .08em; }

.application-dialog { width: min(58rem, calc(100% - 2rem)); max-height: min(90vh, 60rem); border: 1px solid #6f5739; padding: 0; background: var(--paper); color: var(--ink); box-shadow: 0 2rem 8rem rgba(0,0,0,.45), inset 0 0 0 5px rgba(255,248,230,.26); }
.application-dialog::backdrop { background: rgba(12,11,9,.82); backdrop-filter: blur(7px); }
.application-dialog[open] { animation: dialogIn .3s ease both; }
.dialog-close { position: sticky; z-index: 5; float: right; top: 1rem; margin: 1rem; width: 2.6rem; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 50%; background: rgba(238,233,223,.86); backdrop-filter: blur(8px); cursor: pointer; font-size: 1.3rem; }
.application-form, .application-result { padding: clamp(2rem, 5vw, 5rem); }
.form-header { max-width: 40rem; margin-bottom: 3rem; }
.form-header h2, .application-result h2 { font-size: clamp(2.7rem, 5vw, 4.7rem); }
.form-header > p:last-child, .application-result > p { color: var(--ink-soft); font-size: .85rem; line-height: 1.7; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; }
.form-grid label { display: grid; gap: .65rem; }
.form-grid label > span { font: 500 .6rem/1 var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.form-grid .full { grid-column: 1 / -1; }
.application-trap { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.form-grid input, .form-grid textarea, .application-result textarea { width: 100%; border: 1px solid var(--line); border-radius: 0; background: rgba(255,250,238,.3); padding: .95rem 1rem; color: var(--ink); outline: none; resize: vertical; transition: border-color .2s, background .2s; }
.form-grid input:focus, .form-grid textarea:focus { border-color: var(--red); background: rgba(255,255,255,.55); }
.form-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.form-footer > p { margin: 0; color: var(--ink-soft); font: 400 .58rem/1.4 var(--mono); }
.form-error { margin: 1.4rem 0 0; padding: .9rem 1rem; border-left: 3px solid var(--red); background: rgba(183,58,47,.08); color: var(--red-dark); font-size: .78rem; line-height: 1.5; }
.application-result { min-height: 40rem; }
.application-result textarea { margin-top: 1.5rem; font-family: var(--mono); font-size: .72rem; line-height: 1.6; }
.result-actions { display: flex; gap: .8rem; margin-top: 1.4rem; }
.application-result .button-ghost { color: var(--ink); border-color: var(--line); }
.application-success { display: flex; flex-direction: column; justify-content: center; }
.application-success .success-mark { width: 4rem; height: 4rem; margin: 1rem 0 2rem; display: grid; place-items: center; border-radius: 50%; background: var(--red); color: #fff; font-size: 1.5rem; }
.application-success > p:not(.eyebrow) { max-width: 35rem; }
.toast { position: fixed; z-index: 50; right: 1rem; bottom: 1rem; width: min(25rem, calc(100% - 2rem)); display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: start; padding: 1.2rem; background: #f7f3eb; color: var(--ink); box-shadow: 0 1rem 3rem rgba(0,0,0,.2); border-left: 3px solid var(--red); transform: translateY(calc(100% + 2rem)); opacity: 0; transition: transform .35s ease, opacity .35s ease; }
.toast.is-visible { transform: translateY(0); opacity: 1; }
.toast > span { color: var(--red); font: 500 .57rem/1 var(--mono); letter-spacing: .1em; }
.toast p { margin: 0; color: var(--ink-soft); font-size: .75rem; line-height: 1.55; }
.toast button { border: 0; background: none; cursor: pointer; font-size: 1.2rem; line-height: .7; }

.dashboard-dialog { width: min(76rem, calc(100% - 2rem)); height: min(90vh, 54rem); max-height: 54rem; border: 1px solid #6f5739; padding: 0; background: #eadfc9; color: var(--ink); box-shadow: 0 2rem 8rem rgba(0,0,0,.5), inset 0 0 0 5px rgba(255,248,230,.22); }
.dashboard-dialog::backdrop { background: rgba(12,11,9,.86); backdrop-filter: blur(8px); }
.dashboard-dialog[open] { animation: dialogIn .3s ease both; }
.dashboard-close { position: absolute; right: 0; float: none; color: var(--ink); background: rgba(243,239,231,.9); }
.dashboard-shell { min-height: 100%; display: grid; grid-template-columns: 16.5rem 1fr; }
.dashboard-sidebar { display: flex; flex-direction: column; gap: .35rem; padding: 2.2rem 1.4rem; background: #1b120c; color: #f5ead6; }
.dashboard-sidebar > .wordmark { margin: 0 .5rem 2.5rem; }
.dashboard-sidebar > p { color: rgba(255,255,255,.55); font-size: .8rem; line-height: 1.7; }
.dashboard-sidebar > button { border: 0; border-left: 2px solid transparent; background: transparent; color: rgba(255,255,255,.58); padding: .85rem 1rem; text-align: left; cursor: pointer; font: 500 .62rem/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.dashboard-sidebar > button:hover, .dashboard-sidebar > button.active { border-color: var(--red); background: rgba(255,255,255,.06); color: #fff; }
.dashboard-sidebar .dashboard-logout { margin-top: auto; color: rgba(255,255,255,.38); }
.account-card { display: flex; align-items: center; gap: .8rem; margin: 0 0 1.5rem; padding: 1rem .75rem; border: 1px solid rgba(255,255,255,.12); }
.account-card img, .avatar-fallback { width: 2.6rem; height: 2.6rem; flex: 0 0 auto; border-radius: 50%; object-fit: cover; }
.avatar-fallback { display: grid; place-items: center; background: var(--red); color: #fff; font: 500 1rem/1 var(--mono); }
.account-card div { min-width: 0; display: grid; gap: .25rem; }
.account-card strong { overflow: hidden; text-overflow: ellipsis; font-size: .78rem; }
.account-card span { overflow: hidden; text-overflow: ellipsis; color: rgba(255,255,255,.45); font: 400 .58rem/1 var(--mono); }
.dashboard-main { min-width: 0; max-height: 90vh; overflow: auto; padding: clamp(2.5rem, 5vw, 4.5rem); }
.dashboard-main h2 { margin: 0; font: 300 clamp(3rem, 6vw, 5.2rem)/.9 var(--serif); letter-spacing: -.045em; }
.dashboard-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 2.5rem; }
.dashboard-heading > div > span, .control-card-heading span, .empty-state > span { display: block; margin-bottom: .8rem; color: var(--red); font: 500 .58rem/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.small-button { min-height: 2.7rem; border: 1px solid var(--ink); background: transparent; padding: 0 1rem; cursor: pointer; font: 500 .58rem/1 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.small-button:hover { background: var(--ink); color: #fff; }
.small-button:disabled { opacity: .5; cursor: wait; }
.login-panel, .setup-panel { min-height: 36rem; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.login-panel > p:not(.eyebrow), .setup-panel > p:not(.eyebrow) { max-width: 38rem; color: var(--ink-soft); line-height: 1.8; }
.discord-login { margin-top: 1.2rem; background: #5865f2; color: #fff; }
.discord-login:hover { background: #4752c4; }
.discord-mark { font-size: 1rem; }
.setup-panel ul { margin: .5rem 0 1.5rem; padding-left: 1.2rem; }
.setup-panel li { margin: .5rem 0; }
.setup-panel code { font: 500 .72rem/1.4 var(--mono); }
.code-block { display: block; margin: .4rem 0 1.5rem; padding: .85rem 1rem; background: #ded7ca; overflow-wrap: anywhere; }
.submission-list { border-top: 1px solid var(--line); }
.submission-item { display: flex; justify-content: space-between; gap: 2rem; padding: 1.3rem 0; border-bottom: 1px solid var(--line); }
.submission-item > div { display: grid; gap: .45rem; }
.submission-item > div:last-child { justify-items: end; text-align: right; }
.submission-item span { color: var(--ink-soft); font: 400 .58rem/1.2 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.submission-item strong { font: 400 1.5rem/1 var(--serif); }
.submission-item b { color: var(--red); font: 500 .58rem/1 var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.empty-state { padding: 4rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.empty-state p { margin: 0; color: var(--ink-soft); }
.owner-panel { display: grid; gap: 1.5rem; }
.panel-message { position: sticky; z-index: 4; top: -.5rem; margin: 0; padding: .9rem 1rem; background: var(--ink); color: #fff; font-size: .75rem; }
.control-card { padding: clamp(1.4rem, 3vw, 2rem); border: 1px solid var(--line); background: rgba(255,250,238,.2); box-shadow: inset 0 0 0 4px rgba(255,248,230,.14); }
.control-help { max-width: 46rem; margin: -.4rem 0 1.2rem; color: var(--ink-soft); font-size: .78rem; line-height: 1.6; }
.webhook-status-grid { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0 0 1.3rem; }
.webhook-status-grid > span { display: inline-flex; align-items: center; gap: .5rem; padding: .55rem .7rem; border: 1px solid var(--line); color: var(--ink-soft); font: 500 .56rem/1 var(--mono); text-transform: uppercase; letter-spacing: .07em; }
.webhook-status-grid i { width: .42rem; height: .42rem; border-radius: 50%; background: #918b80; }
.webhook-status-grid .is-configured { color: #386c3d; border-color: rgba(56,108,61,.3); }
.webhook-status-grid .is-configured i { background: #4f8f55; box-shadow: 0 0 0 3px rgba(79,143,85,.12); }
.control-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.control-card-heading span { margin-bottom: .45rem; }
.control-card-heading h3 { margin: 0; font: 400 2rem/1 var(--serif); }
.control-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.control-grid label { display: grid; gap: .55rem; }
.control-grid label > span { color: var(--ink-soft); font: 500 .56rem/1.2 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.control-grid .full { grid-column: 1 / -1; }
.control-grid input:not([type="checkbox"]), .control-grid textarea { width: 100%; border: 1px solid var(--line); background: #f7f3eb; padding: .8rem .9rem; color: var(--ink); outline: none; resize: vertical; }
.control-grid input:focus, .control-grid textarea:focus { border-color: var(--red); }
.control-grid .checkbox-label { display: flex; flex-direction: row; align-items: center; gap: .6rem; }
.type-list { border-top: 1px solid var(--line); }
.type-list article { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.type-list article > div { display: grid; gap: .3rem; }
.type-list article span { color: var(--ink-soft); font: 400 .58rem/1 var(--mono); text-transform: uppercase; }
.toggle-control { display: inline-flex; align-items: center; gap: .55rem; border: 1px solid var(--line); background: transparent; padding: .55rem .7rem; cursor: pointer; font: 500 .56rem/1 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.toggle-control i { width: .45rem; height: .45rem; border-radius: 50%; background: #918b80; }
.toggle-control.is-open i { background: #4f8f55; box-shadow: 0 0 0 3px rgba(79,143,85,.12); }
.toggle-control:disabled { cursor: wait; opacity: .5; }
.reveal { opacity: 0; transform: translateY(12px); transition: opacity .5s ease, transform .5s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.reveal[data-delay="1"] { transition-delay: .12s; }.reveal[data-delay="2"] { transition-delay: .24s; }

@keyframes scrollPulse { 0%,100% { transform: scaleY(.4); transform-origin: top; opacity: .35; } 50% { transform: scaleY(1); opacity: 1; } }
@keyframes dialogIn { from { opacity: 0; transform: translateY(20px) scale(.98); } to { opacity: 1; transform: none; } }

@media (max-width: 900px) {
  .site-header { align-items: flex-start; padding-inline: 1rem; }
  .nav-toggle { display: block; color: inherit; }
  .site-nav { position: absolute; top: calc(100% + .25rem); left: 1rem; right: 1rem; max-height: calc(100svh - 5rem); overflow: auto; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: .65rem; background: rgba(23,21,17,.98); border: 1px solid rgba(255,255,255,.12); box-shadow: 0 1rem 3rem rgba(0,0,0,.28); }
  .site-header.nav-open .site-nav { display: flex; }
  .site-nav > a, .site-nav > .text-button { min-height: 2.8rem; display: flex; align-items: center; padding: 0 .75rem; border-bottom: 1px solid rgba(255,255,255,.08); }
  .site-nav a::after { display: none; }
  .site-nav .account-button { width: 100%; margin-top: .65rem; justify-content: flex-start; }
  .hero { min-height: 80svh; padding-top: 6.5rem; align-content: start; background-position: 52% center; }
  .hero h1 { margin-top: 4vh; }
  .hero-intro, .hero-actions { margin-left: 0; }
  .hero-meta { display: none; }
  .sun { width: 52vw; right: -8vw; top: 27%; }
  .statement { grid-template-columns: 1fr; }
  .statement-notes { padding-top: 0; columns: 2; column-gap: 2rem; }
  .principles { grid-template-columns: 1fr; }
  .principle, .principle:first-child { min-height: 11.5rem; border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .server-status { grid-template-columns: 1fr; gap: 2.5rem; }
  .server-status .section-index { margin-bottom: 2rem; }
  .applications-intro { grid-template-columns: 1fr; gap: 1.5rem; }
  .rules { grid-template-columns: 1fr; gap: 2.5rem; }
  .rules-empty { min-height: 21rem; }
  .application-card { grid-template-columns: 4rem 1fr auto; }
  .faq { grid-template-columns: 1fr; }
  .site-footer { grid-template-columns: 1fr; text-align: left; }
  .site-footer > p { text-align: left; }
  .site-footer > div:last-child { justify-content: flex-start; }
  .dashboard-dialog { width: min(100% - 1rem, 48rem); height: min(96svh, 54rem); }
  .dashboard-shell { grid-template-columns: 1fr; }
  .dashboard-sidebar { min-height: auto; padding: 1.25rem; }
  .dashboard-sidebar > .wordmark { margin-bottom: 1rem; }
  .dashboard-sidebar .dashboard-logout { margin-top: 1rem; }
  .account-card { margin-bottom: .5rem; }
  .dashboard-main { max-height: none; }
}

@media (max-width: 600px) {
  .section { padding: 3.75rem 1rem; }
  .section[id], .hero[id] { scroll-margin-top: 3.6rem; }
  .site-header, .site-header.is-scrolled { padding: .8rem 1rem; }
  .wordmark { max-width: calc(100vw - 5rem); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .site-nav { left: .65rem; right: .65rem; }
  .wordmark em { display: none; }
  .status-card-top { align-items: flex-start; flex-direction: column; }
  .status-facts { grid-template-columns: 1fr; gap: 1.25rem; }
  .status-facts > div + div { padding: 1.25rem 0 0; border-top: 1px solid rgba(238,225,202,.14); border-left: 0; }
  .hero { min-height: 100svh; padding: 5.8rem 1rem 3rem; background-position: 55% center; }
  .hero::after { background: linear-gradient(90deg, rgba(12,11,9,.96) 0%, rgba(12,11,9,.82) 58%, rgba(12,11,9,.42) 100%), linear-gradient(0deg, rgba(12,11,9,.84) 0%, transparent 52%, rgba(12,11,9,.24) 100%); }
  .hero h1 { margin-top: 2vh; font-size: clamp(3.1rem, 15vw, 4.5rem); line-height: .86; letter-spacing: -.045em; }
  .hero-intro { width: auto; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .button { width: 100%; }
  .scroll-cue { display: none; }
  .statement h2, .faq h2 { font-size: clamp(2.75rem, 13vw, 3.5rem); }
  .statement-notes { columns: auto; }
  .principle { padding: 1.6rem 1.25rem; }
  .applications-intro h2 { font-size: clamp(2.8rem, 13vw, 3.25rem); }
  .rules { gap: 1.75rem; }
  .rules-heading .kicker { margin-top: 1.8rem; }
  .rules h2 { font-size: clamp(2.8rem, 13vw, 3.25rem); }
  .rules-empty { min-height: 20rem; padding: 1.35rem; }
  .rules-empty h3 { font-size: clamp(2rem, 10vw, 2.7rem); }
  .application-card { grid-template-columns: 1fr auto; }
  .card-number { grid-column: 1 / -1; }
  .card-copy { grid-column: 1; }
  .round-button { grid-column: 2; grid-row: 2; width: 3.7rem; }
  .card-copy ul { gap: .4rem; }
  .card-copy li { padding: .4rem .5rem; }
  .faq { gap: 2.25rem; }
  .faq-heading h2 { margin-top: 1.2rem; }
  .faq summary { gap: 1rem; }
  .site-footer { min-height: auto; padding: 2rem 1rem; gap: 1rem; }
  .site-footer > div:last-child { flex-wrap: wrap; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .full { grid-column: auto; }
  .form-footer, .result-actions { flex-direction: column; align-items: stretch; }
  .application-dialog { width: 100%; height: 100%; max-height: none; margin: 0; }
  .application-form, .application-result { padding: 4.25rem 1rem 2rem; }
  .application-result { min-height: auto; }
  .form-header { margin-bottom: 2rem; }
  .form-header h2, .application-result h2 { font-size: clamp(2.4rem, 12vw, 3.4rem); }
  .dashboard-dialog { width: 100%; height: 100%; max-height: none; margin: 0; }
  .dashboard-sidebar { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; padding: 1rem; }
  .dashboard-sidebar > .wordmark, .dashboard-sidebar .account-card, .dashboard-sidebar > p { grid-column: 1 / -1; }
  .dashboard-sidebar > p { display: none; }
  .dashboard-sidebar > button { min-height: 2.6rem; padding: .65rem .75rem; border-left: 0; border-bottom: 2px solid transparent; }
  .dashboard-sidebar .dashboard-logout { margin-top: 0; }
  .dashboard-main { max-height: none; padding: 2rem 1rem; }
  .dashboard-main h2 { font-size: clamp(2.5rem, 12vw, 3.4rem); }
  .dashboard-heading, .control-card-heading, .submission-item { align-items: flex-start; flex-direction: column; }
  .submission-item > div:last-child { justify-items: start; text-align: left; }
  .control-grid { grid-template-columns: 1fr; }
  .control-grid .full { grid-column: auto; }
  .control-card { padding: 1.1rem; }
  .type-list article { align-items: flex-start; flex-direction: column; }
  .toast { right: .5rem; bottom: .5rem; width: calc(100% - 1rem); }
}

@media (max-width: 380px) {
  .hero h1 { font-size: 2.9rem; }
  .hero-actions { gap: .5rem; }
  .button { min-height: 2.85rem; padding-inline: .8rem; }
  .application-card { grid-template-columns: 1fr; }
  .round-button { grid-column: 1; grid-row: auto; }
  .dashboard-sidebar { grid-template-columns: 1fr; }
  .dashboard-sidebar > .wordmark, .dashboard-sidebar .account-card, .dashboard-sidebar > p { grid-column: 1; }
}

@media (min-width: 1600px) {
  .section, .hero { padding-left: max(7vw, calc((100vw - 1800px) / 2)); padding-right: max(7vw, calc((100vw - 1800px) / 2)); }
}

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