:root {
    color-scheme: dark;
    font-family: Inter, "Segoe UI", sans-serif;
    background: #070a0c;
    color: #d8cfbe;
}

* { box-sizing: border-box; }
html, body { min-width: 320px; min-height: 100%; margin: 0; }
body { background: #070a0c; }

.landing-page {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    display: grid;
    grid-template-rows: auto 1fr auto;
    isolation: isolate;
    background:
        radial-gradient(circle at 50% 43%, rgba(19, 70, 100, .19), transparent 23rem),
        radial-gradient(circle at 50% 46%, rgba(138, 97, 43, .12), transparent 38rem),
        linear-gradient(180deg, #080c0e 0%, #050809 72%, #090b0c 100%);
}

.landing-page::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -3;
    opacity: .18;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(218, 180, 112, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(218, 180, 112, .06) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: radial-gradient(circle at 50% 45%, black, transparent 70%);
}

.landing-page::after {
    content: "";
    position: absolute;
    inset: 12px;
    z-index: 5;
    border: 1px solid rgba(152, 109, 55, .24);
    pointer-events: none;
    box-shadow: inset 0 0 80px rgba(0,0,0,.7);
}

.landing-ambient { position: absolute; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; }
.landing-ambient::before, .landing-ambient::after { content: ""; position: absolute; top: 15%; width: 34vw; height: 70%; opacity: .16; }
.landing-ambient::before { left: -12%; border: 1px solid #8d6938; transform: rotate(45deg); }
.landing-ambient::after { right: -12%; border: 1px solid #8d6938; transform: rotate(-45deg); }

.landing-header { position: relative; z-index: 10; padding: 30px clamp(32px, 6vw, 96px); }
.landing-brand { display: inline-flex; align-items: center; gap: 13px; text-decoration: none; }
.landing-brand-mark { width: 44px; height: 44px; display: grid; place-items: center; overflow: hidden; border: 1px solid #74552f; background: #0a0e10; box-shadow: inset 0 0 20px #000; }
.landing-brand-mark img { width: 53px; height: 53px; object-fit: contain; }
.landing-brand strong, .landing-brand small { display: block; }
.landing-brand strong { color: #e5c98c; font: 1rem Georgia, serif; letter-spacing: .13em; }
.landing-brand small { margin-top: 4px; color: #69655e; font-size: .54rem; letter-spacing: .24em; }

.landing-hero { position: relative; z-index: 2; width: min(880px, calc(100% - 40px)); margin: auto; padding: 18px 20px 62px; display: flex; align-items: center; flex-direction: column; text-align: center; }
.landing-emblem { position: relative; width: clamp(136px, 16vw, 205px); aspect-ratio: 1; display: grid; place-items: center; filter: drop-shadow(0 24px 36px rgba(0,0,0,.7)); }
.landing-emblem::before, .landing-emblem::after, .landing-emblem-ring { content: ""; position: absolute; border-radius: 50%; }
.landing-emblem::before { inset: 1%; border: 1px solid rgba(211,164,87,.5); box-shadow: 0 0 45px rgba(27,115,177,.16), inset 0 0 30px rgba(0,0,0,.7); }
.landing-emblem::after { inset: 10%; border: 1px solid rgba(100,164,211,.22); }
.landing-emblem-ring { inset: -8%; border: 1px dashed rgba(138,102,53,.22); animation: landing-rotate 36s linear infinite; }
.landing-emblem img { width: 93%; height: 93%; object-fit: contain; }
.landing-kicker { margin: 20px 0 7px; color: #8b7b62; font-size: clamp(.58rem, .85vw, .7rem); letter-spacing: .32em; }
.landing-hero h1 { margin: 0; color: #eee0bf; font: 500 clamp(3.9rem, 9vw, 7.8rem)/.92 Georgia, serif; letter-spacing: .07em; text-shadow: 0 5px 30px #000; }
.landing-hero h1 span { color: #d6ad63; }
.landing-divider { width: min(400px, 72vw); margin: 22px 0 17px; display: flex; align-items: center; gap: 13px; color: #b98947; }
.landing-divider i { height: 1px; flex: 1; background: linear-gradient(90deg, transparent, #6b4e2c); }
.landing-divider i:last-child { background: linear-gradient(90deg, #6b4e2c, transparent); }
.landing-divider b { font-size: .68rem; font-weight: 400; }
.landing-status { margin: 0; color: #e3c482; font: clamp(1rem, 2vw, 1.4rem) Georgia, serif; letter-spacing: .35em; }
.landing-copy { margin: 18px 0 0; color: #948f85; font: clamp(.9rem, 1.25vw, 1.05rem)/1.75 Georgia, serif; letter-spacing: .025em; }
.access-request-button {
    position: relative;
    min-width: min(320px, 84vw);
    margin-top: 25px;
    padding: 13px 24px 12px;
    border: 1px solid #7f5b31;
    color: #e5c98c;
    background: linear-gradient(180deg, rgba(43, 33, 21, .92), rgba(15, 16, 15, .96));
    box-shadow: inset 0 0 0 1px rgba(225, 179, 100, .07), 0 13px 34px rgba(0, 0, 0, .34);
    cursor: pointer;
    transition: border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.access-request-button::before, .access-request-button::after { content: ""; position: absolute; top: 50%; width: 7px; height: 7px; border: solid #9b713c; border-width: 1px 1px 0 0; }
.access-request-button::before { left: 11px; transform: translateY(-50%) rotate(225deg); }
.access-request-button::after { right: 11px; transform: translateY(-50%) rotate(45deg); }
.access-request-button span, .access-request-button small { display: block; }
.access-request-button span { font: .75rem Georgia, serif; letter-spacing: .18em; }
.access-request-button small { margin-top: 5px; color: #7d786f; font: .55rem Inter, "Segoe UI", sans-serif; letter-spacing: .08em; }
.access-request-button:hover { transform: translateY(-2px); border-color: #c18b48; color: #f3dcaa; box-shadow: inset 0 0 0 1px rgba(225, 179, 100, .12), 0 16px 40px rgba(0, 0, 0, .44), 0 0 24px rgba(183, 125, 55, .08); }
.access-request-button:disabled {
    border-color: #3c3d3b;
    color: #777872;
    background: linear-gradient(180deg, rgba(30, 31, 30, .88), rgba(14, 16, 16, .96));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025), 0 10px 28px rgba(0, 0, 0, .24);
    cursor: not-allowed;
    filter: saturate(.25);
}
.access-request-button:disabled::before, .access-request-button:disabled::after { border-color: #4a4b47; }
.access-request-button:disabled small { color: #5f615d; }
.access-request-button:disabled:hover { transform: none; border-color: #3c3d3b; color: #777872; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025), 0 10px 28px rgba(0, 0, 0, .24); }
.access-request-button:focus-visible, .access-request-close:focus-visible, .access-request-submit:focus-visible, .access-request-form input:focus-visible, .access-request-form select:focus-visible, .access-request-form textarea:focus-visible { outline: 2px solid #d6ad63; outline-offset: 3px; }
.landing-support {
    width: min(420px, 92vw);
    margin-top: 20px;
    padding: 16px 22px 14px;
    border: 1px solid rgba(127, 91, 49, .5);
    background: linear-gradient(180deg, rgba(18, 22, 22, .86), rgba(9, 12, 13, .92));
    box-shadow: inset 0 0 24px rgba(164, 112, 47, .035), 0 12px 30px rgba(0, 0, 0, .22);
}
.landing-support-kicker { margin: 0; color: #c59d5f; font: .64rem Georgia, serif; letter-spacing: .2em; }
.landing-support-copy { margin: 7px auto 12px; color: #817d76; font: .72rem/1.5 Georgia, serif; }
#donate-button-container { min-height: 47px; display: grid; place-items: center; }
#donate-button { min-height: 47px; display: grid; place-items: center; color: #706c65; font-size: .68rem; }
#donate-button img { display: block; max-width: min(100%, 147px); height: auto; filter: saturate(.78) brightness(.95); transition: filter .2s ease, transform .2s ease; }
#donate-button a:hover img, #donate-button input:hover, #donate-button img:hover { filter: saturate(1) brightness(1.08); transform: translateY(-1px); }
.landing-support-note { margin: 4px 0 0; color: #5f5c57; font-size: .56rem; letter-spacing: .035em; }
.landing-pillars { margin-top: 26px; display: flex; align-items: center; gap: 13px; color: #6f6c65; font-size: .57rem; letter-spacing: .22em; }
.landing-pillars i { width: 3px; height: 3px; border-radius: 50%; background: #8f6936; }

.access-request-dialog {
    width: min(560px, calc(100% - 32px));
    max-height: calc(100vh - 32px);
    padding: 0;
    border: 1px solid #795730;
    color: #d8cfbe;
    background: #090d0f;
    box-shadow: 0 30px 100px rgba(0, 0, 0, .85), inset 0 0 50px rgba(93, 63, 27, .08);
}
.access-request-dialog::backdrop { background: rgba(2, 4, 5, .86); backdrop-filter: blur(5px); }
.access-request-form { position: relative; padding: 34px clamp(24px, 6vw, 42px) 30px; display: grid; gap: 15px; background: radial-gradient(circle at 50% 0, rgba(36, 92, 123, .12), transparent 18rem); }
.access-request-form::before { content: ""; position: absolute; inset: 7px; border: 1px solid rgba(153, 109, 54, .18); pointer-events: none; }
.access-request-close { position: absolute; z-index: 1; top: 13px; right: 15px; width: 34px; height: 34px; border: 0; color: #8c8374; background: transparent; font: 1.5rem/1 Georgia, serif; cursor: pointer; }
.access-request-close:hover { color: #e5c98c; }
.access-request-kicker { margin: 0; color: #9f7b48; font-size: .58rem; letter-spacing: .25em; }
.access-request-form h2 { margin: -5px 0 0; color: #ead8b3; font: 400 2rem Georgia, serif; letter-spacing: .04em; }
.access-request-intro { margin: -4px 0 3px; color: #8f8b83; font: .82rem/1.6 Georgia, serif; }
.access-request-form label { display: grid; gap: 7px; color: #bdb09b; font-size: .63rem; letter-spacing: .12em; text-transform: uppercase; }
.access-request-form .access-request-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.access-request-form label small { color: #67635d; font-size: .54rem; }
.access-request-form input, .access-request-form select, .access-request-form textarea { width: 100%; border: 1px solid #3c3428; border-radius: 0; color: #dfd4c0; background: #0c1011; padding: 11px 12px; font: .86rem Inter, "Segoe UI", sans-serif; }
.access-request-form textarea { min-height: 88px; resize: vertical; }
.access-request-form input:hover, .access-request-form select:hover, .access-request-form textarea:hover { border-color: #665034; }
.access-request-privacy { margin: 1px 0 0; color: #706c65; font-size: .65rem; line-height: 1.5; }
.access-request-submit { min-height: 43px; border: 1px solid #8c6435; color: #e6cc94; background: linear-gradient(180deg, #302417, #171510); font: .68rem Georgia, serif; letter-spacing: .16em; cursor: pointer; }
.access-request-submit:hover { border-color: #c28c49; color: #f1dcae; }
.access-request-submit:disabled { opacity: .55; cursor: wait; }
.access-request-status { min-height: 1em; margin: 0; color: #817b71; font-size: .67rem; line-height: 1.5; text-align: center; }
.access-request-status.is-success { color: #91b977; }
.access-request-status.is-error { color: #d79373; }

.landing-footer { position: relative; z-index: 10; padding: 24px clamp(32px, 6vw, 96px) 32px; display: grid; grid-template-columns: 1fr minmax(260px, 2fr) 1fr; align-items: center; gap: 24px; border-top: 1px solid rgba(86,66,42,.36); color: #5f5c57; }
.landing-footer span { font-size: .52rem; letter-spacing: .2em; }
.landing-footer span:last-child { text-align: right; }
.landing-footer p { margin: 0; color: #5f5c57; font-size: .56rem; text-align: center; }

@keyframes landing-rotate { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .landing-emblem-ring { animation: none; } }

@media (max-width: 680px) {
    .landing-page::after { inset: 7px; }
    .landing-header { padding: 21px 22px; }
    .landing-brand small { display: none; }
    .landing-brand-mark { width: 38px; height: 38px; }
    .landing-brand-mark img { width: 46px; height: 46px; }
    .landing-hero { padding: 10px 16px 44px; }
    .landing-kicker { letter-spacing: .19em; }
    .landing-hero h1 { font-size: clamp(3.3rem, 18vw, 5rem); }
    .landing-status { letter-spacing: .24em; }
    .landing-copy br { display: none; }
    .access-request-button { min-width: 0; width: min(320px, 90vw); }
    .landing-support { width: min(360px, 90vw); padding-inline: 17px; }
    .landing-pillars { gap: 8px; letter-spacing: .13em; }
    .access-request-form { padding: 31px 24px 25px; }
    .landing-footer { padding: 20px 25px 27px; grid-template-columns: 1fr; gap: 7px; }
    .landing-footer span, .landing-footer span:last-child, .landing-footer p { text-align: center; }
}