:root {
    --bg: #08090c;
    --panel: #10131a;
    --line: #2a303c;
    --text: #efe8dc;
    --muted: #9aa1ae;
    --gold: #e4ae3a;
    --gold-2: #f4d27a;
    --ice: #7ec8ff;
    --red: #ff6a5c;
    --ok: #7dce8a;
    --shadow: 0 24px 70px rgba(0, 0, 0, .42);
    color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
    min-height: 100vh;
    font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    background: var(--bg);
    color: var(--text);
}

.bg-grid {
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(900px 420px at 8% -8%, rgba(228,174,58,.16), transparent 50%),
        radial-gradient(700px 360px at 100% 0%, rgba(126,200,255,.08), transparent 46%),
        linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
    background-size: auto, auto, 42px 42px, 42px 42px;
    mask-image: linear-gradient(#000, transparent 92%);
}

.scan {
    position: fixed;
    inset: 0;
    pointer-events: none;
    background: repeating-linear-gradient(to bottom, rgba(255,255,255,.015), rgba(255,255,255,.015) 1px, transparent 1px, transparent 4px);
    opacity: .35;
}

.visit-board {
    position: relative;
    z-index: 2;
    text-align: center;
    padding: 40px 16px 32px;
    background: linear-gradient(#1a1408, #0c0b0e);
    border-bottom: 1px solid #8a6a1c;
}
.visit-board p {
    margin: 0;
    letter-spacing: .42em;
    color: var(--gold);
    font-size: clamp(16px, 3vw, 24px);
    font-weight: 700;
}
.visit-board .visit-num {
    margin: 6px 0 0;
    font-size: clamp(80px, 20vw, 168px);
    line-height: .88;
    font-weight: 800;
    color: #f6d57a;
    letter-spacing: .04em;
    font-variant-numeric: tabular-nums;
    text-shadow: 0 0 48px rgba(228,174,58,.28);
}
.visit-board b {
    display: block;
    margin-top: 8px;
    font-size: clamp(24px, 5vw, 40px);
    color: #efe8dc;
    letter-spacing: .36em;
}
.nav-links { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.campaign-cards { display: grid; gap: 10px; }
.campaign-scroll { padding: 8px; }
.campaign-card {
    display: grid;
    gap: 8px;
    padding: 14px;
    border: 1px solid var(--line);
    background: #0c0e13;
}
.campaign-card:has(input:checked) {
    border-color: #8a6a1c;
    background: #16110a;
}
.campaign-cards label {
    display: flex;
    gap: 10px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    align-items: flex-start;
    justify-content: space-between;
}
.campaign-cards b { display: block; }
.campaign-cards small, .campaign-cards em { display: block; color: var(--muted); margin-top: 4px; font-size: 12px; font-style: normal; }
.campaign-cards label > span:first-of-type { flex: 1; }
.campaign-card .detail-link { justify-self: end; }

.scroll-list {
    max-height: 300px;
    overflow-y: scroll;
    overflow-x: hidden;
    border: 1px solid var(--line);
    background: #0b0d12;
    scrollbar-gutter: stable;
    scrollbar-width: auto;
    scrollbar-color: #e4ae3a #16110a;
}
.scroll-list.tall { max-height: 440px; }
.scroll-list.board { max-height: 520px; }
.scroll-list::-webkit-scrollbar { width: 14px; }
.scroll-list::-webkit-scrollbar-track { background: #16110a; border-left: 1px solid #2a303c; }
.scroll-list::-webkit-scrollbar-thumb {
    background: linear-gradient(#f4d27a, #e4ae3a);
    border-radius: 99px;
    border: 3px solid #16110a;
}

.join-badge {
    flex-shrink: 0;
    border: 1px solid #6d5318;
    color: var(--gold-2);
    padding: 6px 10px;
    font-size: 13px;
    white-space: nowrap;
    background: #16110a;
}
.join-badge em { font-style: normal; font-size: 18px; font-weight: 800; color: #f6d57a; }

.list-card {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border-bottom: 1px solid #242833;
}
.list-card b, .notice-item b { display: block; }
.list-card small, .notice-item small { color: var(--muted); font-size: 12px; }
.list-card small { display: block; margin-top: 4px; }
.notice-item { padding: 14px; border-bottom: 1px solid #242833; }
.notice-item p { margin: 8px 0 0; color: #d7d2c8; line-height: 1.6; }

.visit-board.compact { padding: 20px 16px 16px; }
.visit-board.compact .visit-num { font-size: clamp(52px, 12vw, 96px); }
.visit-board.compact b { font-size: 18px; letter-spacing: .28em; }

.top, footer, main { position: relative; z-index: 1; }
.top {
    width: min(1080px, calc(100% - 32px));
    margin: 0 auto;
    padding: 22px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.brand { display: flex; align-items: center; gap: 12px; }
.brand strong { display: block; letter-spacing: .16em; }
.brand small { color: var(--muted); letter-spacing: .08em; }

.mark {
    width: 42px;
    height: 42px;
    display: block;
    line-height: 0;
}

main { width: min(1080px, calc(100% - 32px)); margin: 0 auto 72px; }
.hero { padding: 28px 0 18px; }
.kicker, .stage-kicker {
    color: var(--gold);
    letter-spacing: .22em;
    text-transform: uppercase;
    font-size: 12px;
    margin: 0 0 12px;
}
h1 { font-size: clamp(32px, 6vw, 58px); line-height: 1.1; margin: 0 0 14px; letter-spacing: .02em; }
.lead { max-width: 640px; color: var(--muted); font-size: 17px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.chips span, .ghost {
    border: 1px solid var(--line);
    color: var(--text);
    background: rgba(16,19,26,.7);
    padding: 8px 12px;
    border-radius: 3px;
    text-decoration: none;
    font-size: 13px;
}

.rules, .panel, .login-card, .tab {
    background: rgba(16,19,26,.92);
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 28px;
    box-shadow: var(--shadow);
    margin-top: 22px;
}
.rules h2, .panel-head h2, .history h2 { margin: 0 0 14px; }
.rules ol { margin: 0; padding-left: 20px; color: #d7d2c8; }
.rules li { margin: 10px 0; }
.rules em { color: var(--gold); font-style: normal; }

.panel-head p, .lead-sm, .hint { color: var(--muted); }
.site-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.site-cards label, .mode {
    display: flex;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--line);
    background: #0c0e13;
    cursor: pointer;
}
.site-cards label:has(input:checked),
.mode:has(input:checked) {
    border-color: #8a6a1c;
    box-shadow: inset 0 0 0 1px #8a6a1c;
    background: #16110a;
}
.site-cards label.off { opacity: .45; cursor: not-allowed; }
.site-cards b, .mode b { display: block; }
.site-cards small, .mode small, .site-cards em { display: block; color: var(--muted); margin-top: 4px; font-size: 12px; font-style: normal; }
.site-cards input, .mode input { accent-color: var(--gold); margin-top: 4px; }

.order-guide {
    margin-top: 18px;
    padding: 14px 16px;
    border: 1px solid #8a6a1c;
    background: #16110a;
    color: #d7d2c8;
}
.order-guide b {
    display: block;
    color: var(--gold);
    margin-bottom: 8px;
}
.order-guide p { margin: 0 0 8px; }
.order-guide ul { margin: 0; padding-left: 18px; }
.order-guide li { margin: 6px 0; }
.order-guide li.on { color: #f3e6c4; }
.order-guide em, .order-guide strong { color: var(--gold); font-style: normal; }
.batch-note {
    margin: 0 0 10px;
    padding: 10px 12px;
    border: 1px solid #8a6a1c;
    background: #2a210f;
    color: #f3e6c4;
    font-weight: 600;
    line-height: 1.55;
}
.field-tip { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; line-height: 1.5; }

.fields, .grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; margin-top: 18px; }
label { display: block; font-size: 13px; color: #d5cfc4; }
input, select, textarea, button { font: inherit; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea {
    width: 100%;
    margin-top: 6px;
    border: 1px solid #343a48;
    background: #0b0d12;
    color: #fff;
    border-radius: 3px;
    padding: 10px 12px;
}
input[type="radio"], input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 3px 0 0;
    accent-color: var(--gold);
    flex-shrink: 0;
}
textarea { min-height: 84px; resize: vertical; }
.captcha-row { display: flex; gap: 10px; }
.captcha-row button { padding: 0; border: 1px solid var(--line); background: #090b10; }
.captcha-row img { display: block; width: 148px; height: 48px; }
.checks { display: grid; gap: 10px; margin: 18px 0; }
.checks label, .checkline { display: flex; align-items: flex-start; gap: 8px; color: #d7d2c8; }
.checks input, .checkline input { width: auto; margin-top: 3px; }

.submit, .ghost { cursor: pointer; }
.submit {
    border: 0;
    width: 100%;
    height: 48px;
    background: linear-gradient(90deg, var(--gold), var(--gold-2));
    color: #1a1203;
    font-weight: 800;
    letter-spacing: .08em;
    border-radius: 3px;
}
.submit.slim { width: auto; padding: 0 18px; height: 40px; }
a.submit.slim { display: inline-block; text-align: center; text-decoration: none; line-height: 40px; }
.form-msg { margin-top: 12px; white-space: pre-line; }
.form-msg.ok { color: var(--ok); }
.form-msg.bad, .alert { color: #ffc4bf; }
.alert { background: #3a1616; border: 1px solid #7a2b2b; padding: 12px 14px; }
input.bad { border-color: #9a3a3a !important; box-shadow: 0 0 0 1px #7a2b2b; }
.card-side { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex-shrink: 0; }
.detail-link {
    color: var(--gold-2);
    font-size: 13px;
    white-space: nowrap;
}
.detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 18px 0;
}
.detail-grid div {
    border: 1px solid var(--line);
    background: #0c0e13;
    padding: 12px 14px;
}
.detail-grid small { display: block; color: var(--muted); margin-bottom: 6px; }
.detail-grid b { word-break: break-all; }
.people-filter-box label { min-width: 160px; margin: 0; }
.people-filter-box input, .people-filter-box select { min-width: 180px; }
.order-test-box { margin-bottom: 22px; }

footer { text-align: center; color: var(--muted); padding: 0 16px 40px; font-size: 12px; }
footer p { margin: 8px 0 0; }

.admin-body { background:
    radial-gradient(800px 360px at 0 0, rgba(228,174,58,.1), transparent 50%),
    var(--bg);
}
.login-card { width: min(420px, calc(100% - 32px)); margin: 12vh auto; }
.login-card.wide { width: min(520px, calc(100% - 32px)); margin: 6vh auto; }
.login-card .brand { margin-bottom: 20px; }
.login-card label { margin-top: 12px; }

.desk { display: grid; grid-template-columns: 230px 1fr; min-height: 100vh; }
aside {
    border-right: 1px solid var(--line);
    padding: 22px 16px;
    display: flex;
    flex-direction: column;
    gap: 22px;
    background: #0c0e13;
}
aside nav { display: grid; gap: 8px; }
aside nav button, .ghost {
    border: 1px solid var(--line);
    background: transparent;
    color: var(--text);
    text-align: left;
    padding: 10px 12px;
    border-radius: 3px;
}
aside nav button.on { background: #1a150c; border-color: #6d5318; color: var(--gold-2); }
aside .ghost { margin-top: auto; display: block; text-align: center; }
.desk-main { padding: 28px; }
.tab { display: none; margin-top: 0; }
.tab.on { display: block; }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 18px 0; }
.stat {
    border: 1px solid var(--line);
    padding: 16px;
    background: #0c0e13;
}
.stat b { display: block; font-size: 28px; color: var(--gold-2); }
.stat span { color: var(--muted); font-size: 13px; }
.row-head, .toolbar, .row-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.row-head { justify-content: space-between; }
.toolbar { margin: 16px 0; }
.toolbar input, .toolbar select { width: auto; min-width: 140px; }
.table-wrap { overflow: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { border-bottom: 1px solid #242833; padding: 10px 8px; text-align: left; white-space: nowrap; }
th { color: var(--muted); font-weight: 600; }
.pager { margin-top: 14px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pager button[disabled] { opacity: .4; cursor: not-allowed; }
.table-wrap thead th { position: sticky; top: 0; background: #0b0d12; z-index: 1; }
.mode-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 16px 0; }
.mode i { color: var(--ice); font-style: normal; font-size: 12px; margin-left: 6px; }
.draw-form { display: grid; gap: 8px; }
.history { margin-top: 28px; }
.his-item { border-top: 1px solid var(--line); padding: 10px 0; color: #d7d2c8; font-size: 14px; }
fieldset { border: 1px solid var(--line); margin: 18px 0; padding: 16px; }
.status { padding: 2px 8px; border-radius: 99px; font-size: 12px; }
.status.pending { background: #2a2414; color: var(--gold-2); }
.status.qualified { background: #132819; color: var(--ok); }
.status.disqualified { background: #2b1616; color: #ffb4ae; }
.status.winner { background: #1a2a33; color: var(--ice); }

.stage {
    position: fixed;
    inset: 0;
    z-index: 20;
    background: #05060a;
}
#lottery-canvas { width: 100%; height: 100%; display: block; }
.stage-ui {
    position: absolute;
    left: 50%;
    bottom: 36px;
    transform: translateX(-50%);
    width: min(720px, calc(100% - 32px));
    text-align: center;
}
.stage-result {
    margin: 10px 0 16px;
    font-size: 28px;
    letter-spacing: .08em;
    color: var(--gold-2);
}

@media (max-width: 900px) {
    .site-cards, .fields, .grid2, .stats, .mode-grid, .detail-grid { grid-template-columns: 1fr; }
    .desk { grid-template-columns: 1fr; }
    aside { flex-direction: row; flex-wrap: wrap; }
    aside .ghost { margin-top: 0; }
}

/* 公示海报 */
.poster-panel { text-align: center; }
.poster-frame {
    display: inline-block;
    max-width: 680px;
    width: 100%;
    margin-top: 8px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--line);
    box-shadow: 0 18px 50px rgba(0, 0, 0, .5);
    transition: transform .2s ease, box-shadow .2s ease;
}
.poster-frame:hover { transform: translateY(-2px); box-shadow: 0 24px 64px rgba(0, 0, 0, .62); }
.poster-frame img { display: block; width: 100%; height: auto; }
.poster-hint { color: var(--muted); font-size: 12px; margin: 12px 0 0; }
@media (max-width: 560px) {
    .poster-frame { max-width: 100%; }
    .top { flex-wrap: wrap; gap: 12px; }
    .hero { padding: 20px 0 12px; }
    h1 { font-size: 28px; }
}

.poster-frame { background: #0c0e13; }
.poster-download { margin-top: 4px; }

/* 奖项等级配色（与海报一致） */
.tier-1 { color: #f4d27a; font-weight: 800; }
.tier-2 { color: #7ec8ff; font-weight: 800; }
.tier-3 { color: #9aa1ae; font-weight: 800; }

/* 信息使用与公示说明 */
.privacy-panel { margin-top: 24px; }
.privacy-list { margin: 0; padding-left: 20px; color: var(--muted); font-size: 13px; line-height: 1.9; }
.privacy-list li { margin-bottom: 6px; }
.privacy-list b { color: var(--text); font-weight: 700; }