:root {
    --night: #130503;
    --night-soft: #210906;
    --wood: #59220f;
    --wood-dark: #2c0b06;
    --wood-light: #965126;
    --wine: #7c1521;
    --wine-dark: #3c0910;
    --gold: #efb24a;
    --gold-bright: #ffda76;
    --paper: #edce91;
    --paper-light: #ffe8b0;
    --paper-deep: #dcae68;
    --ink: #48190d;
    --cream: #fff0c5;
    --moss: #58763a;
    --moss-bright: #9bc56c;
    --ember: #ef7326;
    --danger: #9d372e;
    --story: "Almendra", Georgia, serif;
    --pixel: "Pixelify Sans", Consolas, monospace;
    --number: "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--night); }
body.profile-quarters-page {
    margin: 0;
    min-width: 320px;
    min-height: 100vh;
    overflow-x: hidden;
    color: var(--cream);
    background: var(--night);
    font-family: var(--story);
    letter-spacing: 0;
}
.profile-quarters-page [hidden] { display: none !important; }
.profile-quarters-page a { color: inherit; text-decoration: none; }
.profile-quarters-page button,
.profile-quarters-page input { font: inherit; }
.profile-quarters-page button { cursor: pointer; }
.profile-quarters-page img { display: block; max-width: 100%; }
.quarters-main { overflow: hidden; }

/* Tavern header */
.quarters-navbar {
    position: relative;
    z-index: 1200;
    display: grid;
    grid-template-columns: minmax(245px, 1fr) minmax(620px, 760px) minmax(415px, 1fr);
    column-gap: 12px;
    align-items: center;
    min-height: 102px;
    padding: 0 clamp(22px, 3.5vw, 68px);
    background:
        linear-gradient(90deg, transparent, rgba(235, 157, 64, .08) 48%, transparent),
        repeating-linear-gradient(0deg, rgba(255, 208, 119, .025) 0 1px, transparent 1px 10px),
        linear-gradient(180deg, #35140c 0%, #1b0906 100%);
    box-shadow: 0 5px 0 #7b3d1e, 0 9px 0 #1a0705, 0 20px 38px rgba(0, 0, 0, .52);
}
.quarters-navbar::before {
    content: "";
    position: absolute;
    inset: 6px 0 auto;
    height: 2px;
    background: repeating-linear-gradient(90deg, transparent 0 32px, rgba(244, 180, 76, .36) 33px 34px, transparent 35px 68px);
}
.quarters-brand {
    justify-self: start;
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 225px;
}
.quarters-brand > img {
    width: 82px;
    height: 82px;
    object-fit: contain;
    filter: drop-shadow(0 5px 3px rgba(0, 0, 0, .55));
    transition: transform .25s ease;
}
.quarters-brand:hover > img { transform: rotate(-4deg) scale(1.06); }
.quarters-brand > span { display: grid; gap: 2px; }
.quarters-brand strong { color: var(--cream); font: 700 30px/.9 var(--story); text-shadow: 2px 2px 0 #7a2b21; }
.quarters-brand small { color: var(--gold); font: 700 9px/1 var(--pixel); }
.quarters-nav-links {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    width: 100%;
    min-height: 102px;
    border-right: 1px solid rgba(230, 164, 77, .16);
    border-left: 1px solid rgba(230, 164, 77, .16);
}
.quarters-nav-links a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 0;
    min-height: 102px;
    padding: 0 12px;
    color: #e9c99a;
    font: 700 17px/1 var(--story);
    text-shadow: 1px 2px 0 #210905;
    transition: color .18s ease, background-color .18s ease;
}
.quarters-nav-links a + a::before {
    content: "";
    position: absolute;
    left: 0;
    width: 1px;
    height: 42px;
    background: linear-gradient(transparent, rgba(239, 176, 75, .32), transparent);
}
.quarters-nav-links a::after {
    content: "";
    position: absolute;
    right: 18px;
    bottom: 0;
    left: 18px;
    height: 4px;
    background: var(--gold);
    box-shadow: 0 -4px 14px rgba(239, 171, 60, .4);
    transform: scaleX(0);
    transition: transform .18s ease;
}
.quarters-nav-links a:hover { color: #fff0bd; background: rgba(121, 50, 25, .22); }
.quarters-nav-links a:hover::after { transform: scaleX(1); }
.quarters-nav-links i { color: var(--gold); font-size: 21px; }
.nav-right { justify-self: end; display: flex; align-items: center; gap: 7px; }
.utility-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 90px;
    min-height: 54px;
    padding: 5px 11px 5px 7px;
    border: 1px solid rgba(227, 160, 72, .28);
    border-radius: 4px;
    color: #f4d9aa;
    background: linear-gradient(180deg, rgba(104, 43, 24, .62), rgba(53, 18, 12, .82));
    box-shadow: inset 0 1px rgba(255, 218, 147, .12), 0 4px 0 rgba(15, 4, 3, .72);
    font: 700 15px/1 var(--story);
    transition: transform .18s ease, border-color .18s ease;
}
.profile-quarters-page .utility-button { color: #f4d9aa; }
.utility-button:hover,
.utility-button.active { border-color: rgba(244, 185, 83, .72); color: #fff1c5; background: linear-gradient(180deg, rgba(129, 55, 28, .78), rgba(62, 20, 12, .92)); transform: translateY(-2px); }
.utility-shield {
    position: relative;
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 36px;
    height: 40px;
    padding: 8px 6px 10px;
    background: linear-gradient(145deg, #b86a31, #6b2717 63%, #3e130d);
    clip-path: polygon(50% 0, 92% 15%, 86% 69%, 50% 100%, 14% 69%, 8% 15%);
    filter: drop-shadow(0 3px 0 #210805);
}
.utility-shield::before { content: ""; position: absolute; inset: 4px; background: linear-gradient(150deg, #5f2215, #2c0b08); clip-path: inherit; }
.utility-shield i,
.utility-shield img { position: relative; z-index: 1; }
.utility-shield i { color: #ffe3a0; font-size: 21px; }
.utility-shield img { width: 24px; max-height: 21px; object-fit: contain; }
.utility-kick { min-width: 78px; }
.utility-kick .utility-shield img { width: 28px; }
.menu-toggle { display: none; }

/* Carved controls */
.quarters-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 54px;
    padding: 0 19px;
    border: 3px solid #8c4b22;
    border-radius: 0;
    outline: 2px solid #331008;
    color: #42170b;
    background: linear-gradient(180deg, #ffd073, #e89c35);
    box-shadow: inset 0 0 0 2px rgba(255, 239, 169, .54), 0 6px 0 #5a2512, 0 13px 23px rgba(0, 0, 0, .36);
    font: 700 16px/1 var(--story);
    text-align: center;
    text-shadow: 0 1px rgba(255, 233, 166, .5);
    transition: transform .18s ease, filter .18s ease;
}
.profile-quarters-page .quarters-button { color: #42170b; }
.quarters-button::before,
.quarters-button::after {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border: 1px solid #7c421d;
    border-radius: 50%;
    background: #ffe199;
    box-shadow: inset 0 -1px #9d5a27;
}
.quarters-button:hover { filter: brightness(1.08); transform: translateY(-3px); }
.quarters-button:active { transform: translateY(2px); box-shadow: inset 0 0 0 2px rgba(255, 239, 169, .54), 0 2px 0 #5a2512; }
.quarters-button:disabled { cursor: wait; filter: grayscale(.35); opacity: .65; transform: none; }
.quarters-button i { flex: 0 0 auto; font-size: 20px; }
.quarters-button-dark {
    color: #f8dfab;
    border-color: #8c4f2c;
    background: linear-gradient(180deg, #6b2c1c, #38110c);
    box-shadow: inset 0 0 0 2px rgba(255, 192, 103, .11), 0 6px 0 #1c0704, 0 13px 23px rgba(0, 0, 0, .36);
    text-shadow: 0 2px #1c0704;
}
.profile-quarters-page .quarters-button-dark { color: #f8dfab; }
.quarters-button-dark::before,
.quarters-button-dark::after { border-color: #b86b32; background: #d78b39; }

/* Private quarters hero */
.quarters-hero {
    position: relative;
    isolation: isolate;
    display: flex;
    min-height: max(850px, calc(100svh - 102px));
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    padding: 30px 34px 94px;
    border-bottom: 5px solid #9a4d20;
    background: #1a0704;
}
.quarters-hero-art {
    position: absolute;
    z-index: -4;
    inset: -18px;
    background: url("/art/profile-quarters/member-quarters.webp?v=20260910-mobile1") center 46% / cover no-repeat;
    transform: translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0) scale(1.035);
    animation: room-fire-breathe 14s ease-in-out infinite alternate;
    will-change: transform, filter;
}
.quarters-hero-shade {
    position: absolute;
    z-index: -3;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(20, 5, 2, .35) 0%, rgba(20, 5, 2, .06) 30%, rgba(15, 4, 2, .25) 71%, rgba(14, 3, 2, .88) 100%),
        radial-gradient(ellipse at 50% 48%, rgba(21, 7, 3, .05) 0 34%, rgba(14, 3, 2, .42) 86%, rgba(10, 2, 1, .72) 100%);
}
.quarters-heading {
    position: relative;
    z-index: 2;
    display: grid;
    justify-items: center;
    text-align: center;
    text-shadow: 0 4px 0 #4a150d, 0 9px 24px rgba(0, 0, 0, .82);
}
.chapter-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 29px;
    padding: 0 13px;
    border: 1px solid rgba(246, 189, 83, .48);
    color: #ffe294;
    background: rgba(91, 19, 20, .9);
    box-shadow: 0 4px 0 rgba(24, 4, 3, .72);
    font: 700 10px/1 var(--pixel);
}
.quarters-heading > p { margin: 11px 0 0; color: #efc77f; font: 700 15px/1 var(--story); }
.quarters-heading h1 { margin: 2px 0 0; color: #fff0be; font: 700 clamp(48px, 4.6vw, 78px)/.9 var(--story); }
.quarters-heading h1 em { color: var(--gold-bright); font-style: normal; }

.profile-loading {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 16px;
    width: min(480px, calc(100vw - 40px));
    margin-top: 110px;
    padding: 22px 26px;
    border: 7px solid #4b170c;
    outline: 2px solid #b9692d;
    color: var(--ink);
    background: #efd293;
    box-shadow: inset 0 0 0 2px #ffeab5, 0 12px 0 #190503, 0 24px 44px rgba(0, 0, 0, .55);
}
.wax-loader { display: grid; flex: 0 0 auto; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: #ffe5a1; background: #8a2022; box-shadow: inset 0 0 0 4px #b8492c, 0 3px 0 #4a110e; }
.wax-loader i { font-size: 26px; }
.profile-loading div { display: grid; gap: 4px; }
.profile-loading strong { font: 700 21px/1 var(--story); }
.profile-loading small { color: #805137; font: 600 12px/1.3 var(--number); }

/* Guest scroll */
.sealed-ledger {
    position: relative;
    z-index: 2;
    display: grid;
    justify-items: center;
    width: min(720px, calc(100vw - 40px));
    margin-top: 48px;
    padding: 62px 76px 52px;
    border: 12px solid #4b180d;
    outline: 3px solid #aa622d;
    color: var(--ink);
    background:
        repeating-linear-gradient(0deg, transparent 0 25px, rgba(111, 57, 25, .035) 26px 27px),
        linear-gradient(145deg, #f8dda0, #e7bf7b);
    box-shadow: inset 0 0 0 3px rgba(255, 242, 190, .72), 0 14px 0 #170403, 0 30px 55px rgba(0, 0, 0, .62);
    text-align: center;
    clip-path: polygon(2% 0, 98% 0, 100% 4%, 99% 96%, 96% 100%, 3% 99%, 0 95%, 1% 5%);
}
.sealed-ledger::before,
.sealed-ledger::after { content: ""; position: absolute; top: 17px; width: 13px; height: 13px; border: 2px solid #784119; border-radius: 50%; background: #e7a841; box-shadow: inset 0 -2px #9a5621; }
.sealed-ledger::before { left: 20px; }
.sealed-ledger::after { right: 20px; }
.sealed-ledger-mark { display: grid; place-items: center; width: 76px; height: 76px; margin-bottom: 16px; border-radius: 50%; color: #ffe1a0; background: #8d2222; box-shadow: inset 0 0 0 6px #bd4b2e, 0 5px 0 #57130e, 0 0 0 4px #6f2c17; }
.sealed-ledger-mark i { font-size: 34px; }
.scroll-overline { margin: 0; color: #9a3d2d; font: 700 10px/1 var(--pixel); }
.sealed-ledger h2 { margin: 8px 0 9px; color: #4b1b10; font: 700 clamp(32px, 3vw, 47px)/.96 var(--story); }
.sealed-ledger > p:not(.scroll-overline) { max-width: 510px; margin: 0; color: #704128; font: 600 17px/1.45 var(--story); }
.login-steps { display: flex; align-items: center; justify-content: center; gap: 15px; width: 100%; margin: 28px 0 31px; padding: 19px 0; border-top: 2px dashed rgba(104, 52, 23, .28); border-bottom: 2px dashed rgba(104, 52, 23, .28); }
.login-steps span { display: flex; align-items: center; gap: 8px; }
.login-steps b { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; color: #ffe5a5; background: #6a2418; font: 800 13px/1 var(--number); }
.login-steps small { color: #663720; font: 700 14px/1 var(--story); }
.login-steps > i { color: #a1632d; font-size: 20px; }
.sealed-ledger .quarters-button { min-width: 270px; }
.sealed-ledger-back { margin-top: 24px; color: #88472a; font: 700 14px/1 var(--story); }
.sealed-ledger-back:hover { color: #5f2817; }

/* Authenticated hero ledger */
.hero-dashboard {
    position: relative;
    z-index: 2;
    width: min(1420px, 94vw);
    margin-top: 20px;
}
.member-nameplate {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: auto minmax(240px, 1fr) auto auto;
    align-items: center;
    gap: 18px;
    width: calc(100% - 90px);
    min-height: 92px;
    margin: 0 auto -5px;
    padding: 14px 22px;
    border: 4px solid #a95b29;
    outline: 3px solid #321008;
    color: #f7ddaa;
    background:
        repeating-linear-gradient(0deg, rgba(255, 206, 119, .025) 0 2px, transparent 2px 9px),
        linear-gradient(180deg, #6d2d18, #37110b);
    box-shadow: inset 0 0 0 2px rgba(255, 209, 124, .15), 0 7px 0 #1b0604, 0 18px 28px rgba(0, 0, 0, .45);
}
.member-nameplate::before,
.member-nameplate::after { content: ""; width: 12px; height: 12px; border: 2px solid #87501f; border-radius: 50%; background: #efb34e; box-shadow: inset 0 -2px #9d5d23; }
.member-nameplate::before { position: absolute; left: 13px; }
.member-nameplate::after { position: absolute; right: 13px; }
.member-avatar { position: relative; display: grid; place-items: center; width: 64px; height: 70px; overflow: hidden; color: #ffe6a9; background: #7c261a; clip-path: polygon(50% 0, 92% 15%, 86% 69%, 50% 100%, 14% 69%, 8% 15%); filter: drop-shadow(0 4px 0 #1f0704); }
.member-avatar::before { content: ""; position: absolute; inset: 5px; background: #3c100b; clip-path: inherit; }
.member-avatar img { position: relative; z-index: 1; width: 52px; height: 56px; object-fit: cover; clip-path: inherit; }
.member-avatar i { position: relative; z-index: 1; font-size: 32px; }
.member-welcome { min-width: 0; }
.member-welcome span { color: var(--gold); font: 700 9px/1 var(--pixel); }
.member-welcome h2 { overflow: hidden; margin: 4px 0 2px; color: #fff0c4; font: 700 31px/.95 var(--story); text-overflow: ellipsis; white-space: nowrap; }
.member-welcome p { margin: 0; color: #d8b681; font: 600 12px/1.2 var(--number); }
.member-seal { display: flex; align-items: center; gap: 9px; padding: 9px 13px; border: 1px solid #73964c; color: #dff4b5; background: #32451f; box-shadow: inset 0 0 0 2px rgba(181, 222, 125, .08); }
.member-seal i { color: var(--moss-bright); font-size: 25px; }
.member-seal span { font: 700 8px/1.25 var(--pixel); }
.nameplate-logout { display: inline-flex; align-items: center; gap: 7px; min-height: 42px; padding: 0 14px; border: 2px solid #8d4e2b; color: #edc995; background: #2f0d08; box-shadow: 0 3px 0 #170503; font: 700 14px/1 var(--story); }
.nameplate-logout:hover { color: #fff0c4; border-color: var(--gold); }

.dashboard-ledger {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 365px;
    min-height: 510px;
    border: 12px solid #4b170c;
    outline: 3px solid #aa622d;
    color: var(--ink);
    background: #efd294;
    box-shadow: inset 0 0 0 3px rgba(255, 241, 184, .58), 0 14px 0 #170403, 0 28px 45px rgba(0, 0, 0, .58);
    clip-path: polygon(1% 0, 99% 0, 100% 3%, 99% 97%, 97% 100%, 2% 99%, 0 96%, 1% 4%);
}
.dashboard-ledger::before { content: ""; position: absolute; z-index: 2; top: 20px; bottom: 20px; left: calc(100% - 365px); width: 4px; background: linear-gradient(90deg, rgba(89, 37, 17, .5), rgba(255, 235, 178, .8), rgba(89, 37, 17, .35)); box-shadow: -5px 0 10px rgba(71, 26, 11, .15), 5px 0 9px rgba(255, 239, 188, .36); }
.ledger-progress-page { min-width: 0; padding: 44px 53px 39px; background: repeating-linear-gradient(0deg, transparent 0 30px, rgba(112, 61, 29, .035) 31px 32px); }
.ledger-page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-bottom: 16px; border-bottom: 2px dashed rgba(105, 54, 23, .3); }
.ledger-page-heading span { color: #9a3d2d; font: 700 9px/1 var(--pixel); }
.ledger-page-heading h3 { margin: 6px 0 0; color: #4e1c11; font: 700 25px/1 var(--story); }
.ledger-page-heading > p { display: flex; align-items: center; gap: 7px; margin: 4px 0 0; color: #805039; font: 600 12px/1.25 var(--number); text-align: right; }
.ledger-page-heading > p i { color: #a7592a; font-size: 17px; }
.wager-total { display: grid; justify-items: start; padding: 23px 0 18px; }
.wager-total > span { color: #744129; font: 700 17px/1 var(--story); }
.wager-total > strong { max-width: 100%; margin: 4px 0 3px; color: #4a180e; font: 800 clamp(44px, 4.2vw, 72px)/.95 var(--number); letter-spacing: 0; overflow-wrap: anywhere; }
.wager-total > small { color: #926246; font: 600 12px/1.3 var(--number); }
.progress-inscription { padding: 18px 21px 15px; border-top: 2px solid rgba(130, 71, 31, .45); border-bottom: 2px solid rgba(130, 71, 31, .45); background: rgba(255, 235, 181, .42); }
.progress-inscription > div:first-child,
.progress-scale { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.progress-inscription > div:first-child span { color: #62331f; font: 700 15px/1.25 var(--story); }
.progress-inscription > div:first-child b { color: #5c7b3f; font: 800 18px/1 var(--number); }
.progress-track { position: relative; display: block; height: 19px; margin: 12px 0 8px; border: 3px solid #6d3018; background: #3b130c; box-shadow: inset 0 3px 5px rgba(0, 0, 0, .42), 0 2px #f6dd9f; }
.progress-track > i { display: block; width: 0; height: 100%; background: repeating-linear-gradient(135deg, #7ea44d 0 10px, #94bd5f 10px 20px); box-shadow: inset 0 2px rgba(224, 255, 176, .35); transition: width .9s cubic-bezier(.2, .75, .2, 1); }
.progress-track > em { position: absolute; top: 50%; right: -5px; width: 12px; height: 27px; border: 2px solid #75411d; background: #efb34c; transform: translateY(-50%); box-shadow: inset 0 0 0 2px #ffdb78; }
.progress-scale b { color: #4c2014; font: 800 13px/1 var(--number); }
.progress-scale span { color: #845039; font: 600 12px/1 var(--number); }
.ledger-milestones { display: grid; grid-template-columns: 1fr 1fr; margin-top: 19px; border-top: 1px solid rgba(114, 56, 24, .22); border-bottom: 1px solid rgba(114, 56, 24, .22); }
.ledger-milestones > div { position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto auto; column-gap: 12px; padding: 16px 19px 16px 6px; }
.ledger-milestones > div + div { padding-left: 24px; border-left: 1px dashed rgba(112, 54, 23, .35); }
.ledger-milestones i { grid-row: 1 / 4; align-self: center; color: #a94828; font-size: 33px; }
.ledger-milestones span { color: #956049; font: 700 9px/1 var(--pixel); }
.ledger-milestones strong { margin-top: 4px; color: #4d1b10; font: 700 24px/1 var(--story); overflow-wrap: anywhere; }
.ledger-milestones small { margin-top: 4px; color: #805039; font: 600 11px/1.25 var(--number); }

.next-quest-page { position: relative; display: flex; flex-direction: column; align-items: center; min-width: 0; padding: 41px 30px 33px; color: #ffe6b0; background: repeating-linear-gradient(0deg, rgba(255, 205, 118, .025) 0 2px, transparent 2px 10px), linear-gradient(165deg, #70271c, #37100b 78%); text-align: center; }
.next-quest-page::before,
.next-quest-page::after { content: ""; position: absolute; top: 17px; width: 11px; height: 11px; border: 2px solid #7b451e; border-radius: 50%; background: #edb14a; }
.next-quest-page::before { left: 16px; }
.next-quest-page::after { right: 16px; }
.quest-ribbon { display: inline-flex; align-items: center; gap: 8px; padding: 8px 13px; border: 1px solid rgba(246, 186, 80, .45); color: #ffe094; background: #4a1010; box-shadow: 0 4px 0 #210604; font: 700 9px/1 var(--pixel); }
.quest-ribbon i { font-size: 16px; }
.reward-emblem { display: grid; place-items: center; width: 74px; height: 82px; margin-top: 21px; color: #ffde82; background: linear-gradient(145deg, #b6642d, #671e15 67%, #3e0e0a); clip-path: polygon(50% 0, 92% 15%, 86% 69%, 50% 100%, 14% 69%, 8% 15%); filter: drop-shadow(0 6px 0 #200604); }
.reward-emblem::before { content: ""; position: absolute; width: 58px; height: 65px; background: #3b100c; clip-path: inherit; }
.reward-emblem i { position: relative; z-index: 1; font-size: 36px; }
.next-label { margin-top: 17px; color: #dba875; font: 700 10px/1 var(--pixel); }
.next-quest-page > strong { margin-top: 4px; color: #ffdc75; font: 800 44px/1 var(--number); }
.next-quest-page h3 { margin: 5px 0 6px; color: #fff0c1; font: 700 27px/1 var(--story); }
.next-quest-page > p { min-height: 44px; margin: 0; color: #d8b486; font: 600 14px/1.4 var(--story); }
.quest-detail { display: flex; align-items: center; justify-content: space-between; width: 100%; margin: 16px 0 19px; padding: 11px 3px; border-top: 1px dashed rgba(235, 178, 82, .3); border-bottom: 1px dashed rgba(235, 178, 82, .3); }
.quest-detail span { color: #c89a6b; font: 600 12px/1 var(--number); }
.quest-detail b { color: #ffe7a9; font: 800 15px/1 var(--number); }
.next-quest-page .quarters-button { width: 100%; min-height: 48px; margin-top: 1px; font-size: 14px; }
.next-quest-page .quarters-button + .quarters-button { margin-top: 12px; }
.desk-cue { position: absolute; z-index: 3; bottom: 15px; left: 50%; display: grid; justify-items: center; gap: 4px; color: #ffe09a; font: 700 9px/1 var(--pixel); text-shadow: 0 2px #321008; transform: translateX(-50%); }
.desk-cue i { font-size: 30px; animation: cue-drop 1.35s ease-in-out infinite; }

/* Connections desk */
.account-desk {
    position: relative;
    isolation: isolate;
    min-height: 820px;
    padding: 98px 28px 110px;
    color: var(--cream);
    background:
        linear-gradient(rgba(25, 6, 3, .7), rgba(31, 8, 4, .9)),
        url("/art/profile-quarters/member-quarters.webp?v=20260910-mobile1") center 86% / cover no-repeat;
}
.account-desk::before { content: ""; position: absolute; z-index: -1; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 190px, rgba(236, 164, 69, .035) 191px 193px); }
.desk-heading,
.archive-heading { width: min(1320px, 94vw); margin: 0 auto 34px; }
.desk-heading { display: grid; justify-items: center; text-align: center; text-shadow: 0 3px #3b1009; }
.chapter-label { display: inline-grid; place-items: center; min-width: 88px; min-height: 28px; border: 1px solid rgba(240, 177, 72, .5); color: #ffe091; background: #641a19; font: 700 9px/1 var(--pixel); box-shadow: 0 4px 0 #2a0805; }
.desk-heading > p,
.archive-heading p { margin: 15px 0 0; color: var(--gold); font: 700 10px/1 var(--pixel); }
.desk-heading h2,
.archive-heading h2 { margin: 7px 0 5px; color: #fff0c2; font: 700 clamp(39px, 4vw, 62px)/.95 var(--story); }
.desk-heading > span:last-child { color: #d6b482; font: 600 17px/1.4 var(--story); }
.desk-ledger {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr);
    width: min(1320px, 94vw);
    min-height: 510px;
    margin: 0 auto;
    border: 13px solid #49160c;
    outline: 3px solid #ad642f;
    color: var(--ink);
    background: linear-gradient(145deg, #f5daa0, #dfb46f);
    box-shadow: inset 0 0 0 3px rgba(255, 242, 193, .7), 0 15px 0 #160403, 0 33px 53px rgba(0, 0, 0, .64);
    clip-path: polygon(1% 0, 99% 0, 100% 3%, 99% 97%, 97% 100%, 2% 99%, 0 96%, 1% 4%);
}
.desk-ledger::before { content: ""; position: absolute; z-index: 2; top: 24px; bottom: 24px; left: 54.4%; width: 4px; background: linear-gradient(90deg, rgba(91, 39, 17, .5), rgba(255, 238, 185, .85), rgba(91, 39, 17, .33)); box-shadow: -6px 0 11px rgba(68, 22, 9, .14), 6px 0 9px rgba(255, 237, 180, .4); }
.uid-contract,
.social-register { min-width: 0; padding: 45px 51px 42px; }
.social-register { padding-right: 44px; padding-left: 46px; background: rgba(224, 178, 105, .2); }
.contract-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 18px; border-bottom: 2px dashed rgba(105, 53, 22, .3); }
.contract-heading > div { min-width: 0; }
.contract-heading > div > span { color: #9c3d2d; font: 700 9px/1 var(--pixel); }
.contract-heading h3 { margin: 7px 0 0; color: #4a180e; font: 700 clamp(25px, 2vw, 34px)/1 var(--story); }
.status-seal { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 6px; min-height: 34px; padding: 0 11px; border: 1px solid #9e5430; color: #7f2b24; background: #efc985; font: 700 11px/1 var(--number); }
.status-seal.locked { border-color: #658645; color: #365323; background: #dbe5a9; }
.optional-mark { flex: 0 0 auto; margin-top: 3px; color: #85523a; font: 700 9px/1 var(--pixel); }
.uid-state { display: flex; align-items: center; gap: 17px; padding: 24px 0 20px; }
.uid-chain { display: grid; flex: 0 0 auto; place-items: center; width: 55px; height: 61px; color: #ffe0a0; background: #8b2b1e; clip-path: polygon(50% 0, 92% 15%, 86% 69%, 50% 100%, 14% 69%, 8% 15%); filter: drop-shadow(0 4px 0 #5a1c12); }
.uid-chain i { font-size: 29px; }
.uid-state > div { display: grid; gap: 5px; min-width: 0; }
.uid-state small { color: #956047; font: 700 9px/1 var(--pixel); }
.uid-state strong { color: #4b1a10; font: 700 18px/1.25 var(--number); overflow-wrap: anywhere; }
.uid-form { padding: 19px; border: 2px solid rgba(126, 68, 29, .4); background: rgba(255, 235, 183, .43); }
.uid-form label { display: block; margin-bottom: 8px; color: #68351f; font: 700 15px/1 var(--story); }
.uid-input-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.uid-input-row input,
.social-entry input { min-width: 0; min-height: 52px; border: 3px solid #7b3b21; border-radius: 0; outline: 0; color: #3f170e; background: #fff0bd; box-shadow: inset 0 3px 0 rgba(111, 53, 24, .12); font: 600 16px/1 var(--number); }
.uid-input-row input { padding: 0 15px; }
.uid-input-row input:focus,
.social-entry input:focus { border-color: #b46b2e; box-shadow: inset 0 3px 0 rgba(111, 53, 24, .12), 0 0 0 3px rgba(239, 177, 73, .28); }
.uid-input-row .quarters-button { min-height: 48px; white-space: nowrap; }
.uid-warning { display: flex; align-items: flex-start; gap: 11px; margin-top: 17px; color: #77432d; }
.uid-warning i { flex: 0 0 auto; margin-top: 2px; color: #a4482d; font-size: 21px; }
.uid-warning p { margin: 0; font: 600 13px/1.4 var(--story); }
.uid-help { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; margin-top: 18px; padding: 13px 15px; border-top: 2px dashed rgba(105, 53, 22, .3); border-bottom: 2px dashed rgba(105, 53, 22, .3); color: #62311f; transition: background-color .18s ease; }
.uid-help:hover { background: rgba(255, 235, 180, .45); }
.uid-help > i { color: #a34b2c; font-size: 21px; }
.uid-help > i:last-child { font-size: 17px; }
.uid-help span { font: 600 13px/1.35 var(--story); }
.uid-help b { display: block; color: #4c1a10; font-size: 15px; }
.social-entry { display: grid; grid-template-columns: auto 118px minmax(0, 1fr); align-items: center; gap: 13px; padding: 20px 0; border-bottom: 1px dashed rgba(105, 53, 22, .33); cursor: text; }
.social-crest { display: grid; place-items: center; width: 48px; height: 53px; color: #ffe2a3; background: #7f281d; clip-path: polygon(50% 0, 92% 15%, 86% 69%, 50% 100%, 14% 69%, 8% 15%); }
.social-crest i { font-size: 28px; }
.social-crest img { width: 27px; max-height: 23px; object-fit: contain; }
.social-copy { display: grid; gap: 4px; min-width: 0; }
.social-copy b { color: #4d1a10; font: 700 20px/1 var(--story); }
.social-copy small { color: #8c5941; font: 600 11px/1.2 var(--number); overflow-wrap: anywhere; }
.social-entry input { width: 100%; padding: 0 13px; }
.social-save { width: 100%; margin-top: 24px; }
.profile-message { min-height: 20px; margin: 16px 0 0; color: #76432d; font: 700 13px/1.35 var(--number); text-align: center; }
.profile-message.success { color: #49662f; }
.profile-message.error { color: #8e2825; }
.profile-message.loading { color: #8a542d; }

/* Reward archive */
.reward-archive {
    position: relative;
    min-height: 610px;
    padding: 96px 28px 110px;
    border-top: 4px solid #7f3e1e;
    color: var(--cream);
    background:
        repeating-linear-gradient(0deg, rgba(255, 194, 93, .02) 0 2px, transparent 2px 19px),
        linear-gradient(180deg, #2a0c07, #140402);
}
.reward-archive::before { content: ""; position: absolute; inset: 19px 0 auto; height: 14px; border-top: 2px solid rgba(213, 135, 53, .2); border-bottom: 2px solid rgba(213, 135, 53, .13); }
.archive-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; }
.archive-heading h2 { margin-bottom: 0; }
.archive-heading .quarters-button { min-width: 245px; }
.archive-ledger {
    width: min(1320px, 94vw);
    margin: 0 auto;
    border: 10px solid #4b170d;
    outline: 3px solid #9c5628;
    color: var(--ink);
    background: #edcc8c;
    box-shadow: inset 0 0 0 3px #ffe8aa, 0 12px 0 #110302, 0 28px 45px rgba(0, 0, 0, .52);
}
.archive-columns,
.reward-row { display: grid; grid-template-columns: minmax(220px, 1.35fr) minmax(120px, .6fr) minmax(190px, .85fr) minmax(130px, .55fr); align-items: center; column-gap: 18px; }
.archive-columns { min-height: 48px; padding: 0 27px; border-bottom: 3px solid #7e381e; color: #ffe3a1; background: #5b1f14; font: 700 9px/1 var(--pixel); }
.reward-history { min-height: 170px; }
.reward-row { min-height: 77px; padding: 13px 27px; border-bottom: 1px dashed rgba(104, 50, 22, .36); }
.reward-row:last-child { border-bottom: 0; }
.reward-name { display: flex; align-items: center; gap: 13px; min-width: 0; }
.reward-name i { display: grid; flex: 0 0 auto; place-items: center; width: 40px; height: 44px; color: #ffe09a; background: #892b1e; clip-path: polygon(50% 0, 92% 15%, 86% 69%, 50% 100%, 14% 69%, 8% 15%); font-size: 20px; }
.reward-name span { display: grid; gap: 3px; min-width: 0; }
.reward-name strong { color: #4a190f; font: 700 20px/1 var(--story); overflow-wrap: anywhere; }
.reward-name small { color: #8a573e; font: 600 11px/1.2 var(--number); }
.reward-value { color: #4a190f; font: 800 20px/1 var(--number); }
.reward-date { color: #71412d; font: 600 13px/1.25 var(--number); }
.reward-status-cell { display: grid; justify-items: start; gap: 5px; }
.reward-status { display: inline-flex; align-items: center; justify-content: center; justify-self: start; min-width: 95px; min-height: 31px; padding: 0 10px; border: 1px solid #a26635; color: #744020; background: #f2d69b; font: 800 11px/1 var(--number); text-transform: capitalize; }
.reward-status.approved { border-color: #688845; color: #385322; background: #dce7ae; }
.reward-status.paid { border-color: #a36a24; color: #6b4516; background: #f2d17e; }
.reward-status.rejected { border-color: #9c4235; color: #7a2623; background: #efc0a0; }
.reward-paid-at { color: #71412d; font: 600 10px/1.25 var(--number); }
.empty-archive { display: flex; align-items: center; justify-content: center; gap: 18px; min-height: 170px; padding: 30px; text-align: left; }
.empty-archive img { width: 66px; height: 66px; object-fit: contain; filter: sepia(.25) saturate(.9) drop-shadow(0 4px 2px rgba(72, 24, 12, .28)); opacity: .72; }
.empty-archive div { display: grid; gap: 5px; }
.empty-archive strong { color: #542014; font: 700 24px/1 var(--story); }
.empty-archive span { color: #86553c; font: 600 14px/1.3 var(--number); }

/* Account popover */
.site-account { position: relative; z-index: 1500; }
.site-account-toggle { font-family: var(--story); }
.site-account-card {
    position: absolute;
    z-index: 1600;
    top: 67px;
    right: 0;
    width: 330px;
    padding: 22px;
    border: 8px solid #45170e;
    outline: 2px solid #a65e2b;
    color: var(--ink);
    background: linear-gradient(145deg, #f2d799, #e2b875);
    box-shadow: inset 0 0 0 2px rgba(255, 239, 184, .65), 0 12px 0 #1b0604, 0 24px 45px rgba(0, 0, 0, .55);
}
.site-account-card::before { content: ""; position: absolute; top: -19px; right: 28px; width: 27px; height: 19px; background: #6e2e17; clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.site-account-title { display: flex; align-items: center; justify-content: space-between; padding-bottom: 13px; border-bottom: 2px dashed rgba(104, 52, 23, .35); color: #9a3c2c; font: 700 9px/1 var(--pixel); }
.site-account-title i { font-size: 16px; }
.site-account-card > strong { display: block; margin-top: 15px; color: #4b1c11; font: 700 23px/1 var(--story); }
.site-account-card > small { display: block; margin-top: 3px; color: #4f7537; font: 700 11px/1 var(--story); }
.site-account-row { display: flex; align-items: center; gap: 11px; padding: 11px 0; border-bottom: 1px dashed rgba(104, 52, 23, .28); }
.site-account-row > i { color: #9d4029; font-size: 19px; }
.site-account-row div { display: grid; flex: 1; gap: 2px; min-width: 0; }
.site-account-row b { color: #562015; font: 700 15px/1 var(--story); }
.site-account-row span { overflow: hidden; color: #805136; font: 600 11px/1.2 var(--number); text-overflow: ellipsis; white-space: nowrap; }
.site-account-sync { display: flex; justify-content: space-between; gap: 10px; padding: 13px 0 9px; color: #88583b; font: 600 10px/1 var(--number); }
.site-account-sync b { color: #63301f; font-weight: 600; }
.site-account-progress { padding: 12px; border: 2px solid #9b6032; background: rgba(255, 235, 177, .4); }
.site-account-progress div { display: flex; justify-content: space-between; gap: 10px; color: #6e4229; font: 600 11px/1 var(--number); }
.site-account-progress b { color: #4c1b11; font: 800 18px/1 var(--number); }
.site-account-progress > span { display: block; margin-top: 5px; color: #89593d; font: 400 12px/1.25 var(--story); }
.site-account-manage,
.site-account-refresh,
.site-account-logout { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 42px; margin-top: 9px; border: 2px solid #6d2a17; color: #48170d; background: linear-gradient(#f4bd52, #dd8e2d); box-shadow: 0 3px 0 #57200f; font: 700 14px/1 var(--story); }
.site-account-manage { justify-content: space-between; padding: 0 12px; }
.site-account-refresh,
.site-account-logout { color: #f5ddae; background: linear-gradient(#78301f, #45140e); }

/* Footer and motion */
.quarters-footer { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 22px; padding: 34px clamp(24px, 4vw, 70px); border-top: 3px solid #7c3a1d; color: #c99c6f; background: #160603; }
.footer-brand { display: flex; align-items: center; gap: 12px; }
.footer-brand img { width: 64px; height: 64px; object-fit: contain; }
.footer-brand div { display: grid; }
.footer-brand strong { color: var(--cream); font: 700 19px/1 var(--story); }
.footer-brand span { margin-top: 3px; color: var(--gold); font: 700 9px/1 var(--pixel); }
.footer-brand small { margin-top: 5px; color: #a87a55; font: 600 10px/1 var(--number); }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 20px; color: #e1ba83; font: 700 13px/1 var(--story); }
.quarters-footer > p { grid-column: 1 / -1; margin: 0; padding-top: 17px; border-top: 1px solid rgba(226, 162, 72, .18); color: #8e684d; font: 400 11px/1.3 var(--story); }
.profile-toast {
    position: fixed;
    z-index: 3000;
    right: 25px;
    bottom: 25px;
    max-width: min(390px, calc(100vw - 30px));
    padding: 15px 18px;
    border: 3px solid #698a47;
    color: #385022;
    background: #e5dea4;
    box-shadow: 0 6px 0 #42150c, 0 17px 32px rgba(0, 0, 0, .42);
    font: 700 14px/1.35 var(--story);
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .2s ease, transform .2s ease;
}
.profile-toast.visible { opacity: 1; transform: translateY(0); }
.profile-toast.error { border-color: #9d3b31; color: #7f2824; background: #efc59b; }
.ember-field { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.pixel-ember { position: absolute; bottom: -15px; width: var(--size); height: var(--size); background: #ffc057; box-shadow: 0 0 7px #ef7626; opacity: 0; animation: ember-rise var(--duration) linear var(--delay) infinite; }
[data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
[data-reveal].visible { opacity: 1; transform: translateY(0); }
@keyframes room-fire-breathe { from { transform: translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0) scale(1.035); filter: brightness(.93) saturate(.98); } to { transform: translate3d(calc(var(--parallax-x, 0) - 4px), calc(var(--parallax-y, 0) - 2px), 0) scale(1.044); filter: brightness(1.04) saturate(1.04); } }
@keyframes cue-drop { 0%, 100% { transform: translateY(0); opacity: .65; } 50% { transform: translateY(8px); opacity: 1; } }
@keyframes ember-rise { 0% { opacity: 0; transform: translate3d(0, 0, 0) scale(.6); } 12% { opacity: .85; } 75% { opacity: .45; } 100% { opacity: 0; transform: translate3d(var(--drift), -78vh, 0) scale(1.15); } }

@media (max-width: 1450px) {
    .quarters-navbar { grid-template-columns: minmax(205px, 1fr) minmax(430px, 520px) minmax(275px, 1fr); padding-right: 22px; padding-left: 22px; }
    .quarters-brand strong { font-size: 23px; }
    .quarters-brand > img { width: 65px; height: 65px; }
    .quarters-nav-links a { gap: 5px; padding: 0 7px; font-size: 14px; }
    .quarters-nav-links i { font-size: 17px; }
    .utility-button { min-width: 48px; padding-right: 7px; font-size: 11px; }
    .utility-shield { width: 31px; height: 35px; }
    .social-icon > span:last-child { display: none; }
    .quarters-hero { padding-top: 24px; }
    .quarters-heading h1 { font-size: 54px; }
    .hero-dashboard { width: min(1200px, 94vw); }
    .dashboard-ledger { grid-template-columns: minmax(0, 1fr) 330px; }
    .dashboard-ledger::before { left: calc(100% - 330px); }
    .ledger-progress-page { padding: 35px 38px 32px; }
    .next-quest-page { padding: 35px 25px 29px; }
    .desk-ledger { width: min(1180px, 94vw); }
    .uid-contract,
    .social-register { padding-right: 37px; padding-left: 37px; }
    .social-entry { grid-template-columns: auto 95px minmax(0, 1fr); }
}

@media (max-width: 1060px) {
    .quarters-navbar { grid-template-columns: 1fr auto 1fr; min-height: 78px; }
    .quarters-brand > img { width: 56px; height: 56px; }
    .quarters-brand small { display: none; }
    .menu-toggle { display: grid; place-items: center; width: 43px; height: 43px; border: 2px solid #87502d; color: var(--gold); background: #35130d; font-size: 22px; }
    .quarters-nav-links { position: absolute; top: 100%; right: 12px; left: 12px; display: none; min-height: 82px; background: #2d0f09; box-shadow: 0 8px 0 #150503; }
    .quarters-navbar.menu-open .quarters-nav-links { display: grid; }
    .quarters-nav-links a { min-height: 82px; }
    .quarters-hero { min-height: 1080px; padding-right: 18px; padding-left: 18px; }
    .quarters-hero-art { filter: brightness(.72); }
    .hero-dashboard { width: min(790px, 94vw); }
    .member-nameplate { width: calc(100% - 32px); grid-template-columns: auto 1fr auto; }
    .member-seal { display: none; }
    .dashboard-ledger { grid-template-columns: 1fr; }
    .dashboard-ledger::before { display: none; }
    .next-quest-page { display: grid; grid-template-columns: auto 1fr 1fr; grid-template-rows: repeat(4, auto); column-gap: 22px; align-items: center; text-align: left; }
    .quest-ribbon { grid-column: 1 / -1; justify-self: start; }
    .reward-emblem { grid-row: 2 / 5; margin-top: 10px; }
    .next-label { align-self: end; margin-top: 12px; }
    .next-quest-page > strong { align-self: end; justify-self: end; margin-top: 10px; }
    .next-quest-page h3 { align-self: start; }
    .next-quest-page > p { align-self: start; justify-self: end; max-width: 260px; min-height: 0; text-align: right; }
    .quest-detail { grid-column: 2 / 4; }
    .next-quest-page .quarters-button { grid-column: span 1; }
    .account-desk { padding-right: 18px; padding-left: 18px; }
    .desk-ledger { grid-template-columns: 1fr; width: min(780px, 94vw); }
    .desk-ledger::before { display: none; }
    .uid-contract,
    .social-register { padding: 42px; }
    .social-register { border-top: 3px double rgba(105, 53, 22, .38); }
    .archive-heading { align-items: center; }
}

@media (max-width: 720px) {
    .quarters-navbar { padding: 0 12px; }
    .quarters-brand { min-width: 0; }
    .quarters-brand strong { font-size: 20px; }
    .nav-right .social-icon { display: none; }
    .site-account-login-top > span:last-child,
    .site-account-toggle > span:last-child { display: none; }
    .quarters-nav-links { grid-template-columns: 1fr 1fr; }
    .quarters-nav-links a { min-height: 62px; }
    .quarters-hero { min-height: 1160px; padding-top: 43px; }
    .quarters-heading > p { font-size: 13px; }
    .quarters-heading h1 { max-width: 340px; font-size: 45px; }
    .sealed-ledger { margin-top: 38px; padding: 45px 24px 38px; border-width: 8px; }
    .login-steps { gap: 6px; }
    .login-steps span { display: grid; justify-items: center; gap: 5px; }
    .login-steps small { font-size: 11px; }
    .login-steps > i { font-size: 15px; }
    .hero-dashboard { width: calc(100vw - 24px); }
    .member-nameplate { grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; width: calc(100% - 12px); padding: 12px 14px; }
    .member-avatar { width: 50px; height: 56px; }
    .member-avatar img { width: 42px; height: 47px; }
    .member-welcome h2 { font-size: 23px; }
    .member-welcome span { font-size: 7px; }
    .nameplate-logout { width: 42px; padding: 0; justify-content: center; }
    .nameplate-logout span { display: none; }
    .dashboard-ledger { border-width: 8px; }
    .ledger-progress-page { padding: 31px 20px 27px; }
    .ledger-page-heading { display: grid; gap: 8px; }
    .ledger-page-heading > p { text-align: left; }
    .wager-total > strong { font-size: 46px; }
    .progress-inscription { padding-right: 13px; padding-left: 13px; }
    .progress-inscription > div:first-child { align-items: flex-start; }
    .ledger-milestones { grid-template-columns: 1fr; }
    .ledger-milestones > div + div { padding-left: 6px; border-top: 1px dashed rgba(112, 54, 23, .35); border-left: 0; }
    .next-quest-page { display: flex; text-align: center; }
    .quest-ribbon { align-self: center; }
    .reward-emblem { margin-top: 20px; }
    .next-quest-page > p { max-width: 290px; text-align: center; }
    .desk-cue { width: 250px; text-align: center; }
    .account-desk,
    .reward-archive { padding-right: 12px; padding-left: 12px; }
    .desk-heading h2,
    .archive-heading h2 { font-size: 39px; }
    .desk-ledger { width: calc(100vw - 24px); border-width: 8px; }
    .uid-contract,
    .social-register { padding: 32px 20px; }
    .contract-heading { display: grid; }
    .status-seal,
    .optional-mark { justify-self: start; }
    .uid-input-row { grid-template-columns: 1fr; }
    .uid-input-row .quarters-button { width: 100%; }
    .social-entry { grid-template-columns: auto 1fr; }
    .social-entry input { grid-column: 1 / -1; }
    .archive-heading { display: grid; align-items: start; }
    .archive-heading .quarters-button { width: 100%; min-width: 0; }
    .archive-ledger { width: calc(100vw - 24px); border-width: 7px; }
    .archive-columns { display: none; }
    .reward-row { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding: 18px; }
    .reward-date { grid-column: 1; padding-left: 53px; }
    .reward-status-cell { grid-column: 2; grid-row: 2; }
    .empty-archive { text-align: center; }
    .empty-archive img { display: none; }
    .quarters-footer { grid-template-columns: 1fr; }
    .footer-links { justify-content: flex-start; }
    .site-account-card { position: fixed; top: 84px; right: 13px; width: min(330px, calc(100vw - 26px)); }
}

@media (prefers-reduced-motion: reduce) {
    html:not(.is-motion-override-full) { scroll-behavior: auto; }
    html:not(.is-motion-override-full) *, html:not(.is-motion-override-full) *::before, html:not(.is-motion-override-full) *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
    html:not(.is-motion-override-full) [data-reveal] { opacity: 1; transform: none; }
}