/* White porcelain and pine, shared by the mobile public pages. */
:root {
    color-scheme: light;
    --pine: #195641;
    --pine-deep: #103d30;
    --navy: var(--pine-deep);
    --blue: var(--pine);
    --blue-deep: var(--pine-deep);
    --ink: #142622;
    --muted: #52645c;
    --surface: #f9faf8;
    --card: #fff;
    --line: #dce4df;
    --pale: #eaf1eb;
    --action-fill: var(--pine);
    --action-soft: #eef4ef;
    --action-edge: #aebfb5;
    --action-hover: #e0ece3;
    --gold: #765321;
    --gold-pale: #fcf1d6;
    --red: #d92b39;
    --green: #128244;
    --nav-height: 76px;
    --shadow: 0 1px 3px #17372a09;
    --ease: cubic-bezier(.22,1,.36,1);
    --press: 120ms;
    --state: 180ms;
    --enter: 240ms;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
.tier-tabs button:active{transform:none!important;opacity:1!important}
.pager button:disabled,.pagination button:disabled{cursor:default;background:var(--pale)}
.empty-state button.text-link{border:0;background:transparent;padding:0;color:var(--blue)}
html{background:#eef2ef;scroll-padding-bottom:112px;-webkit-text-size-adjust:100%;scrollbar-width:none}
html::-webkit-scrollbar{width:0;height:0}
body{margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;font-size:16px;line-height:1.5;font-variant-numeric:tabular-nums}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
a{color:inherit;text-decoration:none}
button{cursor:pointer;color:inherit}
button:disabled{cursor:wait;opacity:.6}
:is(button,a,summary):focus-visible{outline:2px solid var(--pine);outline-offset:2px}
img,svg{display:block}
h1,h2,h3,p{margin:0}
h1,h2,h3{line-height:1.35;letter-spacing:-.025em;text-wrap:balance}
h2{font-size:23px;font-weight:750}
h3{font-size:18px}
.icon{width:24px;height:24px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.small-icon{width:18px;height:18px}
.app-shell{width:100%;max-width:480px;min-height:100dvh;margin:0 auto;background:var(--surface);padding-bottom:calc(var(--nav-height) + env(safe-area-inset-bottom) + 18px);overflow-wrap:break-word;box-shadow:0 0 32px #183c2d0a}
.skip-link{position:fixed;top:-80px;left:16px;z-index:100;background:var(--card);padding:12px;border-radius:10px}
.skip-link:focus{top:8px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.draw-hero{--draw-gutter:16px;--draw-overlap:46px}
.draw-stage{
    --stage-ink:#19293e;
    --stage-blue:#344f6b;
    --stage-ivory:#f7efdf;
    padding:calc(18px + env(safe-area-inset-top)) var(--draw-gutter) calc(16px + var(--draw-overlap));
    border-radius:0 0 28px 28px;
    color:var(--card);
    background:
        linear-gradient(133deg,transparent 67%,#e4ebf129 67.15%,transparent 67.45%),
        linear-gradient(133deg,transparent 54%,#b4c7df24 54.15%,#b4c7df06 77%,transparent 77.15%),
        linear-gradient(112deg,var(--stage-ink) 12%,var(--stage-blue) 100%);
}
.masthead{display:flex;align-items:center;justify-content:space-between;gap:12px}
.masthead .brand,.brand-copy{min-width:0}
.brand-copy{overflow-wrap:anywhere}
.masthead .support-trigger{flex-shrink:0;background:#101d2b40;border-color:#ffffff66;border-radius:10px;font-weight:650}
.brand-mark{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border-radius:12px;background:var(--stage-ivory);color:var(--stage-ink);font-size:23px;font-weight:800;letter-spacing:-.045em}
.brand-icon{display:block;width:100%;height:100%;object-fit:contain}
.brand{display:inline-flex;align-items:center;gap:10px;min-height:48px;font-size:24px;font-weight:800;letter-spacing:-.5px;line-height:1.2}
.support-trigger{display:inline-flex;gap:6px;align-items:center;justify-content:center;background:#ffffff0c;border:1px solid #ffffff20;border-radius:14px;padding:8px 11px;min-height:44px;font-size:13px;font-weight:600;color:inherit}
.support-trigger .icon{width:19px;height:19px}

.game-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;padding:1px;border:1px solid var(--action-edge);border-radius:11px;margin:18px 0 0;background:var(--surface)}
.game-switch :is(a,button){min-height:44px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:14px;font-weight:650;padding:6px 4px;border:0;border-radius:9px;white-space:nowrap;color:var(--pine-deep);background:transparent}
.game-switch :is(a,button)[aria-current=true]{font-weight:750}
.draw-stage .game-switch{margin-top:16px;padding:3px;gap:8px;border-color:#ffffff40;border-radius:14px;background:#101d2b80}
.draw-stage .game-switch :is(a,button){color:var(--card);white-space:normal;text-align:center}
.draw-stage .game-switch :is(a,button)[aria-current=true]{background:var(--stage-ivory);color:var(--stage-ink)}
.draw-stage :is(a,button):focus-visible{outline-color:var(--gold-pale)}

.draw-card{
    position:relative;margin:calc(-1 * var(--draw-overlap)) var(--draw-gutter) 0;padding:14px;
    border:1px solid var(--line);border-radius:18px;background:var(--card);
    box-shadow:0 8px 24px #103d3014;
}
.draw-meta{display:flex;justify-content:space-between;align-items:flex-end;gap:4px 8px;flex-wrap:wrap}
.draw-meta h1{font-size:clamp(25px,8.6vw,36px);font-weight:800;line-height:1.2;color:var(--pine-deep);margin-top:4px}
.draw-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.draw-kicker::before{content:"";width:6px;height:6px;flex-shrink:0;border-radius:50%;background:var(--gold)}
.draw-kicker time{border-inline-start:1px solid var(--line);padding-inline-start:8px}
.draw-card :is(.number-row,.draw-empty){margin-top:12px;padding-top:14px;border-top:1px solid var(--line)}
.draw-empty{display:grid;align-items:center;min-height:72px;font-size:14px;color:var(--muted)}
.eyebrow{font-size:12px;color:var(--muted);display:block;margin-bottom:2px}
.text-link{display:inline-flex;align-items:center;justify-content:flex-end;gap:2px;min-height:44px;font-size:13px;font-weight:550;white-space:nowrap;color:var(--muted)}
.text-link .icon{width:16px;height:16px}
.draw-meta .text-link{color:var(--blue);min-width:44px}
.number-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) 10px minmax(0,1fr);gap:3px;align-items:start;margin-top:13px}
.ball-cell{display:flex;flex-direction:column;align-items:center;min-width:0;gap:6px}
.ball{display:flex;align-items:center;justify-content:center;width:100%;max-width:42px;aspect-ratio:1;border-radius:50%;color:#fff;font-size:clamp(16px,5.4vw,24px);font-weight:780;line-height:1}
.ball--red{background:#c83335}
.ball--blue{background:#1b68a8}
.ball--green{background:#247c41}
.ball-caption{font-size:12px;font-weight:500;line-height:18px;white-space:nowrap;color:var(--muted)}
.plus{font-size:18px;line-height:clamp(30px,9.3vw,40px);text-align:center;color:var(--muted)}
.market-panel{margin:12px 16px 0}
.market-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:38px}
.market-heading h2{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:750;letter-spacing:0}
.heading-dot{width:4px;height:14px;border-radius:3px;background:var(--pine)}
.market-heading .refresh{display:flex;align-items:center;justify-content:center;gap:5px;border:0;background:transparent;font-size:12px;min-height:44px;min-width:60px;padding:0 6px;color:var(--muted);border-radius:10px}
.refresh .icon{width:15px;height:15px}
.market-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));background:var(--pale);border-radius:10px}
.market-item{min-width:0;padding:10px 11px 9px}
.market-item + .market-item{border-inline-start:1px solid var(--line)}
.quote-label{font-size:12px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:6px;min-height:22px;white-space:nowrap}
.quote-symbol{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:7px;font-size:13px;color:#167358;background:#e9f7f1}
.market-item--gold .quote-symbol{color:var(--gold);background:var(--gold-pale)}
.quote-symbol .icon{width:14px;height:14px}
.usdt-logo{width:22px;height:22px;flex-shrink:0;object-fit:contain}
.quote-price{display:block;font-size:clamp(20px,6.15vw,29px);line-height:1.25;letter-spacing:-.035em;font-weight:800;color:var(--ink);margin-top:3px;white-space:nowrap}
.quote-unit{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.quote-status{font-size:12px;color:#28705c;white-space:nowrap}
.quote-status:empty{display:none}
.quote-status[data-stale=true]{color:#8c5717}
.quote-meta{display:flex;flex-direction:column;color:var(--muted);font-size:12px;line-height:1.5;margin-top:4px;min-height:18px}
.market-note{margin-top:8px;font-size:12px;color:var(--muted)}
.home-materials{padding:16px 16px 0}
.section-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:44px}
.section-heading h2{display:flex;align-items:center;gap:8px;font-size:21px}
.heading-icon{display:block;width:4px;height:19px;border-radius:3px;background:var(--pine)}
.tier-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 6px;
    margin-top: 6px;
}
.tier-tab {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 44px;
    padding: 5px 3px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: var(--tier-bg, #e1ede1);
    color: var(--tier-ink, var(--pine-deep));
    font-size: 14px;
    font-weight: 650;
    white-space: nowrap;
}
:is([data-tier=bronze],.membership-badge.bronze,.avatar.bronze) {
    --tier-bg: #f2e5dc;
    --tier-ink: #63432e;
}
:is([data-tier=silver],.membership-badge.silver,.avatar.silver) {
    --tier-bg: #e7ebed;
    --tier-ink: #35454d;
}
:is([data-tier=gold],.membership-badge.gold,.avatar.gold) {
    --tier-bg: #f9ecc8;
    --tier-ink: #664b19;
}
.tier-tab[aria-current=page] {
    border-color: var(--pine);
    font-weight: 750;
}
.tier-tab .icon {
    position: absolute;
    inset-inline-end: 6px;
    width: 13px;
    height: 13px;
    visibility: hidden;
}
.tier-tab[aria-current=page] .icon { visibility: visible; }
@media(prefers-reduced-motion:no-preference) {
    .tier-tabs[data-tier-motion=true] .tier-tab[aria-current=page] {
        animation: tier-settle var(--enter) ease-out;
    }
    @keyframes tier-settle {
        from { box-shadow: inset 0 0 0 24px #ffffff65; }
        to { box-shadow: inset 0 0 0 24px #ffffff00; }
    }
}
.material-list{margin-top:12px;border:1px solid var(--line);border-radius:11px;background:var(--card);overflow:hidden}
.material-list--grouped { border: 0; border-radius: 0; background: transparent; overflow: visible; }
.material-date {
    margin: 12px 0 0;
    padding: 6px 11px;
    border-radius: 7px 7px 0 0;
    background: var(--pale);
    color: var(--pine-deep);
    font-size: 13px;
}
.material-list--grouped .material-row { padding-inline: 11px; }
.material-list--grouped .material-row:last-child { border-bottom: 1px solid var(--line); }
.material-row{display:flex;align-items:center;gap:8px;min-height:66px;padding:11px 13px;border-bottom:1px solid var(--line)}
.material-row:last-child{border-bottom:0}

.row-main{flex:1;min-width:0}
.material-row h3{font-size:16px;font-weight:650;line-height:1.5;overflow-wrap:anywhere}
.material-row small{display:block;font-size:12px;line-height:1.5;color:var(--muted);margin-top:3px}
.material-row>.icon{width:18px;height:18px;color:var(--pine)}
.primary-button,.game-switch :is(a,button)[aria-current=true]{background:var(--action-fill);color:#fff}
.primary-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;border:1px solid transparent;border-radius:10px;background:var(--action-fill);font-size:16px;font-weight:700;padding:9px 14px;text-align:center}
.primary-button>.icon{width:18px;height:18px}
.home-materials>.soft-notice{margin:12px 0 0}
.membership-strip{display:flex;align-items:center;gap:10px;margin:16px 16px 0;padding:10px 13px;min-height:46px;border:1px solid var(--line);background:var(--action-hover);border-radius:10px;color:var(--pine-deep)}
.membership-strip--page{margin-inline:0}
.membership-strip>.icon:first-child{width:21px;height:21px;color:var(--pine)}
.membership-strip>.icon:last-child{width:17px;height:17px;color:var(--pine)}
.strip-title{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px}
.strip-title strong{font-size:15px;color:var(--pine-deep)}
.outline-button,.admin-user-action,.async-feedback button{border:1px solid var(--action-edge);color:var(--blue-deep);background-color:var(--action-soft)}
.outline-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:65px;padding:9px 13px;border-radius:12px;font-size:14px;font-weight:650}
.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#fffffffa;border:1px solid var(--line);border-bottom:0;border-radius:18px 18px 0 0;padding:4px 6px calc(4px + env(safe-area-inset-bottom));z-index:20;box-shadow:0 -2px 10px #213d2f07}
.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:54px;border-radius:10px;font-size:12px;color:var(--muted);font-weight:550}
.bottom-nav a .icon{width:22px;height:22px}
.bottom-nav a[aria-current=page]{color:var(--pine-deep);font-weight:750}
.bottom-nav a[aria-current=page] .icon{fill:#d5e7db;stroke-width:2}

.page-header{display:flex;align-items:center;gap:10px;padding:calc(12px + env(safe-area-inset-top)) 16px 8px;background:var(--surface);color:var(--ink);min-height:64px}
.page-header h1{font-size:22px;flex:1}
.back-button{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border-radius:10px;color:var(--pine-deep)}
.page-header .support-trigger{padding:8px}
.page-content{padding:24px 16px}
.page-content:is([data-page=draws],[data-page=materials],[data-page=member]){padding-top:calc(16px + env(safe-area-inset-top))}
.section-heading--page{margin-bottom:16px}
.section-title{font-size:25px;font-weight:800;color:var(--pine-deep)}
.page-content>h2{font-size:24px}
.page-subtitle{font-size:14px;color:var(--muted);margin:8px 0 20px;line-height:1.8}
.soft-notice{background:var(--pale);color:var(--muted);font-size:13px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:14px;line-height:1.65}
.light-switch{margin:0 0 14px}
.history-item{padding:14px 0;margin:0;border-bottom:1px solid var(--line)}
.history-title{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.history-title h2{font-size:18px;color:var(--pine-deep)}
.history-title time{font-size:12px;color:var(--muted)}
.history-item .ball{max-width:40px;font-size:clamp(19px,5.7vw,24px)}
.history-item .plus{line-height:37px}
.filters{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.6fr) auto;align-items:center;gap:6px;margin-top:14px}
.field-label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
.field{width:100%;min-height:46px;padding:9px 10px;border:1px solid var(--action-edge);border-radius:9px;color:var(--ink);background:var(--card);min-width:0;font-size:16px;outline-offset:2px}
.field:focus{outline:none;box-shadow:none}
.field:focus-visible{outline:1px solid var(--blue);outline-offset:-1px}
.field::placeholder{color:var(--muted)}
.filter-submit{min-height:44px;min-width:46px;padding:6px;font-size:13px;white-space:nowrap}
.filters .field { min-height: 44px; padding-inline: 7px; }
.material-search { position: relative; }
.material-search .icon {
    position: absolute;
    inset-inline-start: 8px;
    top: 50%;
    translate: 0 -50%;
    width: 16px;
    height: 16px;
    color: var(--muted);
    pointer-events: none;
}
.material-search .field { padding-inline-start: 28px; }
.empty-state{padding:28px 12px;text-align:center;color:var(--muted);border:1px solid var(--line);border-radius:10px;margin-top:14px;background:var(--card)}
.empty-state h2{font-size:19px;margin-bottom:8px;color:var(--ink)}
.article-meta{color:var(--muted);font-size:13px;margin-bottom:16px;display:flex;gap:8px;flex-wrap:wrap}
.article-title{font-size:25px;margin-bottom:24px;overflow-wrap:anywhere}
.article-body{font-size:16px;line-height:1.95;color:var(--ink);padding:20px 16px;background:var(--card);border:1px solid var(--line);border-radius:18px}
.article-body p+p{margin-top:18px}
.article-divider{border:0;border-top:1px solid var(--line);margin:28px 0}
.locked-panel{padding:30px 20px;text-align:center;border:1px solid var(--line);border-radius:20px;background:var(--card);box-shadow:var(--shadow)}
.locked-panel>.icon{width:44px;height:44px;padding:10px;border-radius:14px;background:var(--pale);margin:0 auto 16px;color:var(--blue)}
.locked-panel h2{font-size:19px}
.locked-panel p{font-size:14px;line-height:1.85;color:var(--muted);margin:12px 0 22px}
.pager,.pagination{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;margin-top:22px}
.pager :is(a,button),.pagination :is(a,button){display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:65px;padding:10px 12px;border:1px solid var(--line);background:var(--card);border-radius:12px}
.pager [aria-disabled=true]{color:#707f92;pointer-events:none;background:var(--pale)}
.membership-header { display: grid; grid-template-columns: 44px 1fr 44px; text-align: center; }
.membership-header h1 { font-size: 25px; }
.membership-page { padding-top: 6px; }
.plan-options { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; min-width: 0; }
.plan-choice {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto 17px;
    gap: 8px;
    align-items: center;
    min-height: 82px;
    padding: 12px;
    border: 1px solid transparent;
    border-radius: 11px;
    background: color-mix(in srgb, var(--tier-bg) 53%, var(--surface));
    cursor: pointer;
    scroll-margin-top: 12px;
}
.plan-choice:has(input:checked) { border-color: var(--pine); background: var(--action-soft); }
.plan-choice:has(input:focus-visible) { outline: 2px solid var(--pine); outline-offset: 2px; }
.plan-choice > .icon { width: 17px; height: 17px; color: var(--pine); visibility: hidden; }
.plan-choice:has(input:checked) > .icon { visibility: visible; }
.plan-choice-copy { display: grid; gap: 3px; }
.plan-choice-copy strong { font-size: 18px; line-height: 1.3; }
.plan-choice-copy span { font-size: 13px; color: var(--muted); }
.plan-price { font-size: clamp(16px,5.5vw,24px); font-weight: 800; text-align: end; }
.plan-price small { display: block; font-size: 12px; font-weight: 550; color: var(--muted); }
.payment-facts { margin: 18px 0; border-top: 1px solid var(--line); font-size: 14px; }
.payment-facts > div { display: flex; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.payment-facts dd { margin: 0; color: var(--muted); text-align: end; }
.plan-action { display: none; }
.plan-action .primary-button:disabled { cursor: not-allowed; background: #dce7df; color: #365448; opacity: 1; }
.membership-page:has(#plan-bronze input:checked) [data-plan-action=bronze],
.membership-page:has(#plan-silver input:checked) [data-plan-action=silver],
.membership-page:has(#plan-gold input:checked) [data-plan-action=gold] { display: block; }
.plan-details,.membership-payment-note { margin-top: 10px; font-size: 13px; color: var(--muted); white-space: pre-line; overflow-wrap: anywhere; }
.pending-plan { display: grid; gap: 8px; margin-bottom: 14px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--pale); }
.pending-plan h2 { font-size: 17px; }
.pending-plan p { font-size: 14px; color: var(--muted); }
.membership-badge{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;vertical-align:middle;white-space:nowrap;border-radius:6px;padding:3px 7px;background:var(--tier-bg,#e1ede1);color:var(--tier-ink,var(--pine-deep));font-size:12px;font-weight:650;line-height:1.5}
.membership-badge>.icon{width:17px;height:17px;flex-shrink:0}

.row-meta{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin-top:5px}
.row-meta small{margin:0}
.row-meta .membership-badge{padding:2px 6px}
.row-meta .membership-badge>.icon{display:none}
.material-row[aria-busy=true]{opacity:.65;cursor:progress}
.material-row[aria-busy=true]>.icon{opacity:.4}
.member-status{padding:12px 0;margin-bottom:12px;border-bottom:1px solid var(--line)}
.member-status>div{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.member-status p{font-size:13px;line-height:1.8;color:var(--muted);margin-top:10px}
.plan-included{display:flex;align-items:center;justify-content:center;min-height:48px;background:var(--pale);color:var(--pine-deep);border:1px solid var(--line);border-radius:10px;font-size:14px;font-weight:600}
.membership-prompt{text-align:center}
.membership-prompt>.membership-badge,.locked-panel>.membership-badge{font-size:15px;padding:9px 14px;border-radius:12px;margin-bottom:18px}
.membership-prompt>.membership-badge>.icon,.locked-panel>.membership-badge>.icon{width:24px;height:24px}
.membership-prompt h3{font-size:20px;margin-bottom:12px}
.checkout-card{padding:20px 16px;text-align:center;border:1px solid var(--line);border-radius:20px;background:var(--card);box-shadow:var(--shadow)}
.checkout-summary{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;font-size:13px;color:var(--muted);margin-bottom:14px}
.checkout-card h2{font-size:22px;margin-bottom:16px}
.checkout-amount{font-size:16px;color:var(--blue)}
.checkout-amount strong{font-size:38px;line-height:1.2}
.checkout-network{margin:4px 0 12px;font-size:13px;font-weight:650;color:var(--muted)}
.checkout-qr{margin:0 auto 16px;padding:4px;border:1px solid var(--line);border-radius:12px;background:white}
.checkout-address{padding:11px;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:10px;font-size:13px;margin:12px 0}
.checkout-address span{display:block;color:var(--muted);margin-bottom:5px}
.checkout-address code{overflow-wrap:anywhere;user-select:all}
.checkout-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.checkout-note{font-size:14px;line-height:1.8;color:var(--muted);margin:14px 0}
.checkout-card>.text-link{display:flex;justify-content:center;margin-top:6px}
.checkout-card>.outline-button{margin-top:8px}
.checkout-card>.primary-button:disabled{opacity:.68;cursor:wait}
.admin-heading{margin-bottom:14px}.admin-heading h1{margin-top:2px}
.admin-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:0 0 18px}
.admin-nav a{display:grid;place-items:center;min-height:44px;border:1px solid var(--line);border-radius:10px;background:var(--card);font-size:13px;text-align:center}
.admin-nav a[aria-current=page]{background:var(--action-hover);border-color:#819bc5;color:var(--blue-deep);font-weight:700}
.admin-card{display:grid;gap:10px;margin:0 0 16px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--card)}
.admin-card h2{font-size:18px;margin:0}.admin-card .field-label,.admin-card .field-help,.admin-card .page-subtitle{margin:0}
.wallet-key-label,.wallet-api-status{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px}
.wallet-api-status{margin:0;font-size:13px;color:var(--muted)}
.wallet-api-badge{border-radius:6px;padding:3px 7px;background:var(--surface);color:var(--muted);font-size:12px;font-weight:650}
.wallet-api-badge[data-tone=ok]{background:var(--pale);color:var(--pine-deep)}
.wallet-api-badge[data-tone=pending]{background:var(--gold-pale);color:var(--gold)}
.wallet-api-badge[data-tone=error]{background:#fbe9e8;color:#942631}
.admin-card textarea{padding:12px;resize:vertical}.admin-addresses{font-family:ui-monospace,monospace;font-size:14px}
.admin-brand-preview{object-fit:contain;border:1px solid var(--line);border-radius:12px}
.admin-file{padding:10px}.admin-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.admin-form-grid .field-label{margin-bottom:5px}
.admin-menu-row small,.admin-entry small,.admin-qr small{display:block;color:var(--muted);font-size:13px}
.admin-entry{border-top:1px solid var(--line);padding:12px 0 0}.admin-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}
.admin-order-data{margin:0}.admin-order-data dt{color:var(--muted);font-size:13px}.admin-order-data dd{margin:0 0 12px;overflow-wrap:anywhere}
.admin-order-data a{color:var(--blue);text-decoration:underline}.admin-qr summary{overflow-wrap:anywhere}.admin-qr summary small{margin-top:3px}
.admin-delete summary{color:#ac2530}
.admin-delete summary{min-height:44px;line-height:44px;cursor:pointer}
.admin-delete p{margin:0 0 10px}
.admin-user-row+.admin-user-row{border-top:1px solid var(--line)}
.admin-user-row{display:flex;align-items:center;gap:8px;padding-inline-end:12px}
.admin-user-row .material-row{flex:1;min-width:0;border-bottom:0}
.admin-user-actions{display:flex;gap:8px}
.admin-user-action{display:grid;place-items:center;width:44px;height:44px;border-radius:11px}
.admin-user-action .icon{width:18px;height:18px}
.admin-user-action:active{background-color:var(--action-hover)}
.admin-danger,.admin-delete-button{--action-soft:#fff6f6;--action-edge:#e8b7ba;--action-hover:#ffebed;color:#ac2530}
.admin-user-form{display:grid;gap:10px;overflow-wrap:anywhere}
.admin-user-form :is(.field-label,p){margin:0}
.admin-user-form .primary-button{margin-top:4px}
.material-image{display:block;max-width:100%;height:auto;margin:12px auto 0;border-radius:8px}
.membership-prompt .primary-button{width:100%}
.membership-prompt>.text-link{display:flex;justify-content:center;margin-top:7px}
.article-meta{align-items:center}
.member-guest-page{display:flex;flex-direction:column;min-height:calc(100dvh - var(--nav-height) - env(safe-area-inset-bottom) - 24px)}
.member-guest{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px 0;text-align:center}
.member-guest p{font-size:14px;color:var(--muted)}
.member-guest .primary-button{width:min(100%,224px);margin-top:8px}
.account-head{display:flex;align-items:center;gap:12px;margin:0 0 8px;padding:14px;background:var(--card);border:1px solid var(--line);border-radius:12px}
.account-head>div:last-child{min-width:0;overflow-wrap:anywhere}
.avatar{display:grid;place-items:center;flex-shrink:0;width:56px;height:56px;border:1px solid var(--line);border-radius:16px;background:var(--tier-bg,var(--pale));color:var(--tier-ink,var(--pine))}
.avatar>.icon{width:28px;height:28px}
.account-head h2{font-size:20px}
.account-head p{font-size:13px;color:var(--muted);margin-top:5px}
.menu-list{margin:18px 0;padding:0 12px;background:var(--card);border:1px solid var(--line);border-radius:12px}
.menu-row{display:flex;align-items:center;gap:10px;min-height:54px;border:0;border-bottom:1px solid var(--line);font-size:15px;width:100%;background:transparent;text-align:left;padding:8px 0}
.menu-row:last-child{border-bottom:0}
.menu-row>.icon:first-child{width:24px;height:24px;padding:3px;border-radius:6px;background:var(--pale);color:var(--pine)}
.menu-row span{flex:1}
.menu-row>.icon:last-child{width:17px;height:17px;color:#7888a0}
.form-group{margin-bottom:19px}
.form-group small,.field-help{display:block;font-size:12px;color:var(--muted);margin-top:7px;line-height:1.7}
.form-group .field{min-height:50px}
.page-content>form:not(.filters){margin-top:24px}
.remember-field{display:flex;align-items:center;gap:8px;min-height:44px;margin:0 0 16px;font-size:14px;color:var(--muted)}
.remember-field input{width:20px;height:20px;accent-color:var(--blue)}
.password-control{position:relative}
.password-control .field{padding-right:64px}
.password-toggle{position:absolute;right:5px;top:3px;bottom:3px;min-width:48px;min-height:44px;border:0;border-radius:9px;background:transparent;color:var(--blue);font-size:13px;font-weight:600}
.password-toggle[aria-pressed=true]{background-color:var(--action-hover)}
.validation-summary-errors,.field-validation-error{font-size:13px;color:#ab263a;line-height:1.8}
.validation-summary-errors{background:#fff0f2;border:1px solid #f5d7de;border-radius:14px;padding:12px;margin:0 0 18px}
.validation-summary-errors ul{padding-left:18px;margin:0}
.field-validation-error{display:block;margin-top:6px}
.input-validation-error{border-color:#b52f44}
.form-secondary{text-align:center;margin-top:18px}
.form-secondary a{display:inline-flex;min-height:44px;align-items:center;color:var(--blue);font-size:14px}
.invite-code strong{display:block;overflow-wrap:anywhere;font-size:13px;margin-top:5px;letter-spacing:.3px}
.logout-button{width:100%;min-height:48px}
.dialog{width:calc(100% - 32px);max-width:400px;max-height:calc(100dvh - 32px);border:1px solid #ffffff70;border-radius:24px;padding:0;color:var(--ink);background:var(--card);box-shadow:0 24px 100px #07172d50}
.dialog::backdrop{background:#0e261e80;backdrop-filter:blur(4px)}
.dialog-heading{display:flex;align-items:center;gap:10px;padding:16px 18px;background:var(--navy);color:#fff}
.dialog-heading h2{flex:1;font-size:19px}
.close-dialog{background:#ffffff10;color:inherit;border:1px solid #ffffff20;border-radius:13px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}
.close-dialog .icon{width:20px;height:20px}
.dialog-content{padding:22px 20px}
.dialog-content p{font-size:14px;line-height:1.9;color:var(--muted)}
.dialog-content .primary-button{margin-top:22px}
.help-details{margin-top:17px;border-top:1px solid var(--line)}
.help-details summary{padding:16px 0;min-height:48px;cursor:pointer;font-size:14px;font-weight:600}
.help-details p{padding:0 0 16px;font-size:14px;color:var(--muted);line-height:1.8}
.not-found{padding:75px 18px;text-align:center}
.not-found h1{font-size:32px}
.not-found p{color:var(--muted);margin:16px 0 28px}
.async-feedback{position:fixed;bottom:calc(var(--nav-height) + 16px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:30;display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:400px;width:calc(100% - 48px);padding:10px 14px;border:1px solid var(--line);border-radius:16px;background:var(--card);box-shadow:0 6px 28px #142c4726;font-size:13px;color:var(--muted)}
.async-feedback[hidden],.async-feedback button[hidden]{display:none}
.async-feedback[data-state=error]{border-color:#e5c9cd;color:#9c2c3d}
.async-feedback button{flex-shrink:0;min-width:52px;min-height:44px;border-radius:10px;font-size:13px;font-weight:650}
a[data-async-pending]{box-shadow:inset 0 0 0 2px var(--action-edge)}
@media(max-width:350px) {
    .draw-hero { --draw-gutter:12px; }
    .home-materials,.page-content { padding-inline: 12px; }
    .market-panel,.membership-strip { margin-inline: 12px; }
    .draw-card { padding-inline: 12px; }
    .number-row { gap: 2px; }
    .quote-label { gap: 4px; }
    .tier-tab .icon { inset-inline-end: 3px; width: 11px; }
}
@media(prefers-reduced-motion:no-preference){
    a,button{transition:background-color var(--state),color var(--state),box-shadow var(--state),opacity var(--press),transform var(--press) var(--ease)}
    .field{transition:border-color var(--state),box-shadow var(--state),background-color var(--state)}
    :is(.primary-button,.outline-button,.game-switch :is(a,button),.admin-user-action,.async-feedback button):active:not(:disabled){transform:scale(.975)}
    :is(.material-row,.menu-row,.bottom-nav a,.support-trigger,.back-button,.membership-strip,.password-toggle):active{transform:scale(.975);opacity:.85}
    
    .refresh[aria-busy=true] .icon{animation:spin .8s linear infinite}
    button[data-submit-pending]::before{content:"";width:15px;height:15px;flex-shrink:0;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite}
    .dialog{opacity:0;transform:translateY(14px) scale(.98);transition:opacity 160ms ease-out,transform var(--enter) var(--ease),display var(--enter) allow-discrete,overlay var(--enter) allow-discrete}
    .dialog[open]{opacity:1;transform:translateY(0) scale(1)}
    .dialog::backdrop{opacity:0;transition:opacity var(--state),display var(--enter) allow-discrete,overlay var(--enter) allow-discrete}
    .dialog[open]::backdrop{opacity:1}
    @starting-style{.dialog[open]{opacity:0;transform:translateY(14px) scale(.98)}.dialog[open]::backdrop{opacity:0}}
    @keyframes spin{to{transform:rotate(360deg)}}
}
@media(hover:hover){
    .primary-button:hover:not(:disabled),.game-switch :is(a,button)[aria-current=true]:hover{background:var(--pine-deep)}
    :is(.outline-button,.admin-user-action,.async-feedback button,.password-toggle):hover:not(:disabled){background-color:var(--action-hover)}
    .game-switch :is(a,button):not([aria-current=true]):hover{background:var(--action-hover)}
    .material-row:hover,.menu-row:hover{background:var(--pale)}
    .support-trigger:hover,.back-button:hover{background:var(--action-hover)}
    .masthead .support-trigger:hover{background:var(--stage-blue)}
    .draw-stage .game-switch :is(a,button):not([aria-current=true]):hover{background:#ffffff26}
    .draw-stage .game-switch :is(a,button)[aria-current=true]:hover{background:var(--card)}
    .text-link:hover{color:var(--blue)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.dialog[open]{opacity:1;transform:none}}
