/* Christmas game voucher page and staff page */
[hidden]{display:none!important}
.voucher-page{max-width:560px;padding-top:40px;padding-bottom:70px;text-align:center}
.voucher-page>.eyebrow{margin-bottom:18px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* The paper voucher */
.voucher-card{position:relative;margin:0 auto;width:min(100%,400px);background:var(--paper);color:var(--ink);border:1px solid var(--gold);outline:1.5px dashed #a38f61;outline-offset:-10px;padding:30px 26px 26px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.voucher-card-star{display:block;font-size:28px;color:#937342;line-height:1}
.voucher-card-amount{font-family:var(--serif);font-weight:500;font-size:64px;line-height:1;color:#223b2a;margin-top:6px}
.voucher-card-where{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#5c6150;margin-top:8px}
.voucher-card-qr{width:min(220px,70%);aspect-ratio:1;margin:20px auto 12px;background:#fff;border:1px solid #cec3a6}
.voucher-card-qr svg{width:100%;height:100%;display:block}
.voucher-card-code{font-weight:600;font-size:20px;letter-spacing:.1em;color:#223b2a;font-variant-numeric:tabular-nums}
.voucher-card-state{font-size:14px;color:#5c6150;margin-top:6px}
.voucher-card-fine{font-size:12px;line-height:1.55;color:#6c6e5e;margin-top:16px;padding-top:12px;border-top:1px solid #cec3a6}
.voucher-card[data-status="redeemed"] .voucher-card-qr,.voucher-card[data-status="expired"] .voucher-card-qr{opacity:.25}
.voucher-card[data-status="redeemed"] .voucher-card-state,.voucher-card[data-status="expired"] .voucher-card-state{color:#a3402f;font-weight:500}
.voucher-stamp{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%) rotate(-14deg);font-family:var(--sans);font-weight:600;font-size:46px;letter-spacing:.14em;color:rgba(163,64,47,.85);border:4px solid rgba(163,64,47,.85);padding:2px 18px;border-radius:6px;pointer-events:none}
.voucher-loading{display:flex;flex-direction:column;align-items:center;gap:14px;padding:50px 0;color:#5c6150}
.voucher-spinner{width:30px;height:30px;border-radius:50%;border:3px solid #e6dcc4;border-top-color:#937342;animation:spin .8s linear infinite}
.voucher-missing{padding:24px 0 8px}
.voucher-missing p:not(.voucher-card-amount){color:#5c6150;margin:14px 0 22px}
.voucher-tip{font-size:14px;color:#c9cdbd;margin:22px auto 0;max-width:400px;line-height:1.6}
.voucher-back{margin-top:22px}
@keyframes spin{to{transform:rotate(360deg)}}

/* Kim's panel on the voucher page */
.staff-panel{margin:0 auto 22px;width:min(100%,400px);padding:18px 20px 16px;border:2px solid #6f8f78;background:#1b2d22;text-align:center}
.staff-panel-tag{font-size:10px;letter-spacing:.24em;color:var(--gold)}
.staff-verdict{font-family:var(--sans);font-weight:600;font-size:30px;margin:6px 0 4px;letter-spacing:.01em}
.staff-detail{font-size:14px;color:#d6d8c8}
.staff-panel[data-status="valid"]{border-color:#5fbf7f;background:#183524}
.staff-panel[data-status="valid"] .staff-verdict{color:#8fe0a8}
.staff-panel[data-status="done"]{border-color:#5fbf7f;background:#1f5a35}
.staff-panel[data-status="done"] .staff-verdict{color:#fff}
.staff-panel[data-status="redeemed"],.staff-panel[data-status="expired"]{border-color:#d0644f;background:#3a1d18}
.staff-panel[data-status="redeemed"] .staff-verdict,.staff-panel[data-status="expired"] .staff-verdict{color:#ffab98}
.staff-redeem{margin-top:14px;width:100%;min-height:58px;font-size:18px;background:#5fbf7f;color:#0d2416;border:1px solid #5fbf7f}
.staff-redeem:hover{background:#78d495}
.staff-redeem:disabled{opacity:.6}
.staff-status{font-size:14px;color:var(--gold);min-height:1.4em;margin-top:8px}
.staff-status a{text-decoration:underline}
.staff-link{display:inline-block;margin-top:6px;font-size:13px;color:#b6bea9}

/* Staff page */
.staff-page h1{font-size:clamp(44px,8vw,64px);letter-spacing:-1.2px;margin:0 0 26px}
.staff-signin,.staff-home{text-align:left;max-width:420px;margin:0 auto}
.staff-signin>p:first-child{color:#c9cdbd;margin-bottom:20px}
.staff-signin label,.staff-check label{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.staff-signin input,.staff-check input{width:100%;min-height:54px;padding:12px 14px;font:500 22px var(--sans);letter-spacing:.12em;color:var(--ink);background:var(--paper);border:1px solid var(--gold)}
.staff-signin .button{width:100%;margin-top:14px}
.staff-signed{color:#8fe0a8;font-weight:500;margin-bottom:16px}
.staff-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:28px}
.staff-stats p{display:flex;flex-direction:column;align-items:center;padding:14px 6px;border:1px solid var(--line);background:#1b2d22;text-align:center}
.staff-stats strong{font-family:var(--serif);font-weight:500;font-size:40px;line-height:1;color:var(--gold)}
.staff-stats span{font-size:12px;color:#c1c6b6;margin-top:6px}
.staff-check-row{display:flex;gap:8px}
.staff-check-row input{flex:1;min-width:0;font-size:18px}
.staff-check-row .button{flex-shrink:0;min-height:54px}
.staff-howto{margin-top:30px;padding:22px 20px;border:1px solid var(--line);background:#1b2d22}
.staff-howto h2{font-size:30px;margin-bottom:12px}
.staff-howto ol{margin:0 0 12px;padding-left:20px;color:#d6d8c8;font-size:15px}
.staff-howto li{margin-bottom:8px}
.staff-howto>p{font-size:14px;color:#b6bea9}
.staff-actions{display:flex;justify-content:space-between;gap:16px;margin-top:22px;flex-wrap:wrap}
.staff-actions .text-link{font-size:13px}
@media(max-width:480px){.voucher-page{padding:28px 14px 56px}.voucher-card-amount{font-size:56px}.staff-stats strong{font-size:34px}}
