:root { --blue:#1267c4; --blue-strong:#0b4f99; --blue-soft:#eaf4ff; --ink:#172033; --muted:#6f7c91; --line:#e6ecf5; --canvas:#f5f8fc; --success:#11805e; --danger:#ba3e45; --card:#fff; font-family: Inter, "Microsoft YaHei", Arial, sans-serif; color:var(--ink); background:var(--canvas); }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:var(--canvas); }
button { font:inherit; cursor:pointer; }
.shell { width:min(1120px, calc(100% - 32px)); margin:0 auto; padding:26px 0 52px; }
.brand { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:22px; }
.brand-copy h1 { margin:0; font-size:23px; letter-spacing:-.4px; }
.brand-copy p { margin:7px 0 0; color:var(--muted); font-size:14px; }
.tag { color:var(--blue-strong); background:var(--blue-soft); border-radius:999px; padding:7px 11px; font-size:12px; font-weight:700; }
.hero { background:var(--blue); border-radius:20px; padding:25px; color:white; display:flex; align-items:flex-start; justify-content:space-between; gap:20px; box-shadow:0 14px 32px rgba(18,103,196,.2); }
.hero h2 { margin:7px 0 0; font-size:25px; }.hero p{ margin:7px 0 0; opacity:.84; font-size:14px;}.hero .code{opacity:.9;font-size:13px;}
.balance-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:18px 0; }
.balance { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:18px; }.balance span { display:block; color:var(--muted);font-size:13px; }.balance strong{display:block;margin-top:9px;font-size:25px;letter-spacing:-.6px;}.balance em{font-style:normal;color:var(--blue);font-size:13px;margin-left:4px;}
.tabs { display:flex; overflow:auto; gap:8px; padding:4px 0 14px; border-bottom:1px solid var(--line); margin-bottom:18px; }.tabs button { white-space:nowrap; padding:9px 12px; border:0; background:transparent; color:var(--muted); border-radius:9px; font-size:14px; }.tabs button.active{color:var(--blue-strong);background:var(--blue-soft);font-weight:700;}
.grid { display:grid; grid-template-columns:1.2fr .8fr; gap:18px; }.card { background:var(--card);border:1px solid var(--line);border-radius:16px;padding:19px; }.card h3{margin:0;font-size:16px;}.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;}.muted{color:var(--muted);font-size:13px;}.records{display:grid;gap:0;}.record{display:flex;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);font-size:14px;}.record:last-child{border-bottom:0}.record b{font-size:14px;}.record small{display:block;margin-top:4px;color:var(--muted);font-size:12px;}.positive{color:var(--success)}.negative{color:var(--danger)}
.primary{border:0;border-radius:10px;padding:10px 14px;background:var(--blue);color:#fff;font-weight:700}.primary:disabled{background:#9ab8da;cursor:not-allowed}.secondary{border:1px solid #b7cae3;border-radius:10px;padding:9px 12px;background:#fff;color:var(--blue-strong);font-weight:700}.notice{padding:13px 15px;border-radius:12px;background:#fff8dc;color:#765b00;font-size:13px;margin-bottom:14px}.empty{color:var(--muted);padding:22px 0;text-align:center;font-size:14px}.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.product{border:1px solid var(--line);border-radius:14px;padding:15px}.product-image{display:block;width:100%;height:132px;object-fit:cover;border-radius:10px;margin:0 0 12px;background:#eef4fb}.product h4{margin:0 0 6px}.product p{margin:0 0 13px;color:var(--muted);font-size:13px;line-height:1.5}.product-footer{display:flex;align-items:center;justify-content:space-between;gap:8px}.pill{font-size:12px;background:var(--blue-soft);color:var(--blue-strong);padding:5px 8px;border-radius:999px;font-weight:700}.draw{border:1px solid var(--line);border-radius:14px;padding:15px;margin-bottom:10px}.draw:last-child{margin:0}.result{margin:12px 0 0;padding:11px 12px;border-radius:10px;background:#edf8f3;color:var(--success);font-size:14px}.fatal{max-width:540px;margin:14vh auto;padding:28px;background:#fff;border:1px solid var(--line);border-radius:18px;text-align:center}.fatal h1{font-size:21px}.fatal p{color:var(--muted);line-height:1.7}.loading{padding:18vh 0;text-align:center;color:var(--muted)}
@media (max-width:720px){.shell{width:min(100% - 24px,560px);padding-top:16px}.brand{align-items:flex-start}.brand h1{font-size:20px}.hero{padding:20px;border-radius:16px;display:block}.hero h2{font-size:22px}.balance-grid{grid-template-columns:1fr;gap:10px}.balance{padding:15px}.balance strong{font-size:22px}.grid{grid-template-columns:1fr;gap:12px}.card{padding:16px}.product-grid{grid-template-columns:1fr}.record{font-size:13px}.tabs{margin-left:-4px;margin-right:-4px}.tabs button{padding:9px 10px}}

/* 会员首页与抽奖页：沿用现有蓝色、白卡、圆角和低干扰动效。 */
.member-identity { margin-bottom:16px; }
.asset-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:0 0 14px; }
.asset-card { min-height:132px; display:flex; flex-direction:column; justify-content:space-between; padding:18px; background:var(--card); border:1px solid var(--line); border-radius:16px; }
.asset-card span,.asset-card small { color:var(--muted); font-size:13px; }.asset-card strong{font-size:27px;letter-spacing:-.7px;}.asset-card em{font-size:13px;font-style:normal;color:var(--blue);margin-left:4px;}
.member-stat-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:19px; }
.member-stat-grid article { min-height:82px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:6px; background:#fff; border:1px solid var(--line); border-radius:14px; }.member-stat-grid strong{font-size:22px;color:var(--blue-strong);}.member-stat-grid span{font-size:12px;color:var(--muted);}
.section-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 11px;}.section-heading h3{margin:0;font-size:16px;}.section-heading span{font-size:12px;color:var(--muted);}
.feature-section{margin-bottom:18px;}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;}.feature-tile{min-height:102px;border:1px solid var(--line);border-radius:15px;background:#fff;color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;box-shadow:0 4px 12px rgba(22,50,83,.025);}.feature-tile:hover{border-color:#b9d2ee;background:#fbfdff;transform:translateY(-1px);}.feature-tile i{font-style:normal;font-size:22px;color:var(--blue);line-height:1;}.feature-tile span{font-size:13px;font-weight:700;}
.overview-stack{display:grid;gap:18px;}.overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}.text-button{border:0;background:transparent;color:var(--blue-strong);font-weight:700;padding:3px;}.membership-note{display:flex;justify-content:space-between;align-items:center;gap:16px;}.membership-note h3{margin:0 0 7px;}.membership-note p{margin:0;color:var(--muted);font-size:13px;line-height:1.6;}.membership-note div:last-child{display:flex;flex-direction:column;align-items:flex-end;gap:5px;white-space:nowrap;}.membership-note span{font-size:12px;color:var(--muted);}.membership-note strong{font-size:15px;color:var(--blue-strong);}
.member-detail{display:grid;gap:14px;margin-top:18px}.member-detail>h2{margin:0;color:#1d3657;font-size:21px}.back-home{justify-self:start;min-height:34px;padding:0 12px;border:1px solid #cfe0f4;border-radius:8px;color:var(--blue);background:#fff;font-weight:700}.back-home:hover{background:#f2f8ff}
.lottery-page{display:grid;gap:16px;}.lottery-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;}.eyebrow{display:block;color:var(--blue);font-weight:800;font-size:13px;margin-bottom:5px;}.lottery-header h2{margin:0;font-size:23px;letter-spacing:-.4px;}.lottery-header p{margin:7px 0 0;font-size:13px;color:var(--muted);}.draw-count{min-width:104px;padding:11px 13px;background:var(--blue-soft);border-radius:13px;text-align:right;}.draw-count span{display:block;color:var(--blue-strong);font-size:12px;}.draw-count strong{display:block;margin-top:2px;color:var(--blue-strong);font-size:25px;line-height:1;}.entry-picker{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;}.entry-picker select{min-width:0;flex:1;border:1px solid var(--line);border-radius:10px;padding:9px;background:#fff;color:var(--ink);}.lottery-stage{padding:19px;background:#fff;border:1px solid var(--line);border-radius:17px;overflow:hidden;}.lottery-tip{margin:0 0 15px;text-align:center;color:var(--muted);font-size:13px;}.lottery-deck{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;perspective:1000px;}.lottery-card{min-width:0;aspect-ratio:3 / 4.15;border:0;border-radius:16px;background:transparent;padding:0;perspective:900px;}.lottery-card:disabled{cursor:default;}.card-3d{display:block;position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .68s cubic-bezier(.22,.72,.25,1);filter:drop-shadow(0 11px 12px rgba(18,72,131,.16));}.lottery-card:not(:disabled):hover .card-3d{transform:translateY(-4px) rotateX(2deg);}.lottery-card.is-revealed .card-3d{transform:rotateY(180deg) scale(1.035);}.lottery-card.is-winner .card-3d{filter:drop-shadow(0 12px 17px rgba(18,103,196,.28));}.card-face{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;border-radius:16px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;}.card-back{color:#fff;background:linear-gradient(145deg,#1677d1,#0b56a8);border:1px solid rgba(255,255,255,.38);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -9px 18px rgba(5,56,119,.23);}.card-back::before{content:"";position:absolute;inset:9px;border:1px solid rgba(255,255,255,.27);border-radius:11px;}.card-back-mark{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(255,255,255,.58);border-radius:50%;font-size:24px;font-weight:900;box-shadow:0 4px 12px rgba(0,32,85,.2);}.card-back small{position:relative;z-index:1;font-size:11px;opacity:.9;}.card-back i{position:absolute;right:11px;bottom:12px;font-size:16px;font-style:normal;opacity:.74;}.card-front{padding:13px;text-align:center;color:var(--ink);background:linear-gradient(150deg,#fff,#edf6ff);border:1px solid #b8d7f3;box-shadow:inset 0 1px 0 #fff;transform:rotateY(180deg);}.card-front small{color:var(--blue-strong);font-size:11px;}.card-front b{font-size:15px;line-height:1.35;word-break:break-word;}.card-front strong{color:var(--blue);font-size:13px;}.draw-result{display:grid;justify-items:center;gap:6px;margin:18px auto 0;padding:14px;text-align:center;border-radius:13px;background:#edf8f3;color:var(--success);}.draw-result.empty-result{background:#f4f7fa;color:#64748b;}.draw-result b{font-size:16px;}.draw-result span{font-size:13px;}.draw-result div{display:flex;gap:9px;margin-top:5px;}.result-error{background:#fff0f0;color:var(--danger);}.pool-card{overflow:hidden;}.pool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}.pool-item{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fbfdff;}.pool-item i{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--blue-soft);color:var(--blue);font-style:normal;font-size:17px;}.pool-item b,.pool-item small{display:block;}.pool-item b{font-size:13px;}.pool-item small{margin-top:3px;color:var(--muted);font-size:11px;}.lottery-rules h3{margin:0 0 9px;}.lottery-rules ol{margin:0;padding-left:19px;color:var(--muted);font-size:13px;line-height:1.8;}
@media (prefers-reduced-motion: reduce){.feature-tile,.card-3d{transition:none!important;}.lottery-card:not(:disabled):hover .card-3d{transform:none;}.lottery-card.is-revealed .card-3d{transform:rotateY(180deg);}}
@media (max-width:720px){.asset-card{min-height:118px;padding:15px}.asset-card strong{font-size:23px}.overview-grid{grid-template-columns:1fr;gap:12px}.feature-grid{gap:9px}.feature-tile{min-height:94px}.membership-note{align-items:flex-start;flex-direction:column}.membership-note div:last-child{align-items:flex-start}.lottery-header h2{font-size:21px}.lottery-stage{padding:14px 10px}.lottery-deck{gap:8px}.card-face{border-radius:13px}.lottery-card{border-radius:13px}.card-back-mark{width:39px;height:39px;font-size:20px}.card-back small{font-size:10px}.card-front{padding:8px}.card-front b{font-size:12px}.card-front strong{font-size:10px}.pool-grid{grid-template-columns:1fr}.draw-result div{width:100%;}.draw-result button{flex:1;padding-left:8px;padding-right:8px}.record-right{white-space:nowrap;text-align:right}}
@media (max-width:390px){.shell{width:calc(100% - 20px)}.member-stat-grid{gap:7px}.member-stat-grid strong{font-size:19px}.member-stat-grid span{font-size:11px}.feature-tile span{font-size:12px}.lottery-deck{gap:6px}.card-back-mark{width:34px;height:34px;font-size:18px}.card-back small{font-size:9px}.card-front small{font-size:9px}.card-front b{font-size:11px}.card-front strong{font-size:9px}.draw-count{min-width:88px}}

/* 身份卡在 320–430px 保持三层信息：入口、昵称、会员等级。 */
.member-identity { display:block; padding:19px 20px; }
.member-card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.member-card-top .code { min-width:0; color:rgba(255,255,255,.84); font-size:12px; font-weight:800; letter-spacing:.05em; }
.member-status { flex:0 0 auto; display:inline-flex; align-items:center; min-height:24px; padding:2px 9px; border:1px solid rgba(255,255,255,.32); border-radius:999px; background:rgba(255,255,255,.14); color:#fff; font-size:12px; font-weight:800; white-space:nowrap; }
.member-status.is-attention { background:rgba(255,242,195,.18); color:#fff7d7; }
.member-identity .member-name { display:-webkit-box; margin:11px 0 4px; overflow:hidden; color:#fff; font-size:clamp(18px,5.7vw,24px); line-height:1.32; letter-spacing:-.02em; overflow-wrap:anywhere; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.member-identity .member-level { margin:0; color:rgba(255,255,255,.84); font-size:13px; line-height:1.45; }
@media (max-width:430px){.member-identity{padding:17px 16px}.member-card-top{gap:8px}.member-card-top .code{font-size:11px}.member-status{min-height:22px;padding:2px 8px;font-size:11px}.member-identity .member-name{margin-top:10px}.member-identity .member-level{font-size:12px}}

/* Stacked-card lottery and invitation details retain the member portal's blue
   and white language while making the draw mechanics obvious. */
.lottery-card-stack { position:relative; width:min(220px,62vw); aspect-ratio:3 / 4.12; margin:8px auto 22px; isolation:isolate; perspective:900px; }
.stack-card,.stack-top-card { position:absolute; inset:0; border-radius:20px; }
.stack-card { display:block; border:1px solid rgba(255,255,255,.5); background:linear-gradient(145deg,#0b4f99,#1d78d7); box-shadow:0 16px 28px rgba(11,79,153,.2),inset 0 1px 0 rgba(255,255,255,.4); }
.stack-card::after { content:""; position:absolute; inset:10px; border:1px solid rgba(255,255,255,.28); border-radius:14px; }
.stack-card-back-3 { z-index:0; transform:rotate(7deg) translate(15px,9px); opacity:1; }
.stack-card-back-2 { z-index:1; transform:rotate(-5deg) translate(-10px,6px); opacity:1; }
.stack-card-back-1 { z-index:2; transform:rotate(2deg) translate(6px,2px); opacity:1; }
.stack-top-card { z-index:4; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; overflow:hidden; color:#fff; background:radial-gradient(circle at 50% 25%,rgba(255,255,255,.28),transparent 28%),linear-gradient(145deg,#1d7ee0,#0b4f99); border:1px solid rgba(255,255,255,.66); box-shadow:0 20px 34px rgba(11,79,153,.28),inset 0 1px 0 rgba(255,255,255,.44); transition:transform .45s cubic-bezier(.22,.72,.25,1),filter .3s ease; }
.stack-top-card::before { content:""; position:absolute; inset:12px; border:1px solid rgba(255,255,255,.34); border-radius:14px; }
.stack-top-card:not(:disabled):hover { transform:translateY(-8px) rotateX(3deg); filter:brightness(1.06); }
.lottery-card-stack.is-drawing .stack-top-card { animation:draw-card .62s cubic-bezier(.22,.72,.25,1) both; }
.stack-card-title,.stack-top-card small,.stack-top-card em,.card-mascot { position:relative; z-index:1; }
.stack-card-title { font-size:23px; font-weight:950; letter-spacing:.08em; text-shadow:0 3px 10px rgba(2,37,89,.28); }
.stack-top-card small { font-size:12px; opacity:.9; }.stack-top-card em { position:absolute; right:20px; bottom:18px; font-style:normal; font-size:18px; opacity:.72; }
.card-mascot { position:relative; display:block; width:74px; height:62px; border-radius:48% 48% 46% 46%; background:linear-gradient(145deg,#7ed9ff,#1f86e4 62%,#0b58af); box-shadow:inset 0 2px 0 rgba(255,255,255,.55),0 8px 14px rgba(2,48,115,.22); }
.card-mascot::before,.card-mascot::after { content:""; position:absolute; top:24px; width:9px; height:11px; border-radius:50%; background:#fff; box-shadow:inset 0 -1px 0 rgba(9,55,115,.18); }.card-mascot::before { left:17px; }.card-mascot::after { right:17px; }
.card-mascot i { position:absolute; z-index:1; top:28px; left:20px; width:4px; height:6px; border-radius:50%; background:#153c74; box-shadow:30px 0 #153c74; }.card-mascot b { position:absolute; left:26px; bottom:11px; width:22px; height:9px; border:2px solid #fff; border-top:0; border-radius:0 0 14px 14px; }
.draw-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; max-width:460px; margin:0 auto; }.draw-actions button { min-height:52px; display:flex; flex-direction:column; gap:2px; align-items:center; justify-content:center; }.draw-actions button small { font-size:11px; font-weight:600; opacity:.84; }.draw-five-btn { background:#edf6ff; border-color:#b8d7f3; }
.draw-results { display:grid; gap:10px; margin:22px auto 0; justify-content:center; perspective:900px; }.draw-results.is-single { grid-template-columns:minmax(0,178px); }.draw-results.is-batch { grid-template-columns:repeat(5,minmax(0,1fr)); max-width:610px; }
.result-card { min-width:0; aspect-ratio:3 / 4.1; perspective:800px; }.result-card-inner { position:relative; width:100%; height:100%; transform-style:preserve-3d; transform:rotateY(0); transition:transform .56s cubic-bezier(.22,.72,.25,1); filter:drop-shadow(0 9px 11px rgba(18,72,131,.14)); }.result-card.is-revealed .result-card-inner { transform:rotateY(180deg); }.result-card.is-winner .result-card-inner { filter:drop-shadow(0 10px 15px rgba(18,103,196,.3)); }
.result-card-face { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:11px; overflow:hidden; border-radius:15px; text-align:center; backface-visibility:hidden; -webkit-backface-visibility:hidden; }.result-card-back { color:#fff; background:linear-gradient(145deg,#1677d1,#0b56a8); border:1px solid rgba(255,255,255,.36); }.result-card-back .card-mascot { transform:scale(.8); }.result-card-back small { font-size:10px; opacity:.9; }.result-card-front { color:var(--ink); background:linear-gradient(150deg,#fff,#edf6ff); border:1px solid #b8d7f3; box-shadow:inset 0 1px 0 #fff; transform:rotateY(180deg); }.result-card-front small { color:var(--blue-strong); font-size:10px; }.result-card-front b { font-size:13px; line-height:1.35; word-break:break-word; }.result-card-front strong { color:var(--blue); font-size:12px; }
.invite-record-card .card-head { align-items:flex-start; }.invite-code { flex:0 0 auto; padding:7px 10px; border-radius:10px; color:var(--blue-strong); background:var(--blue-soft); font-size:13px; font-weight:900; letter-spacing:.06em; }.invite-record-list { display:grid; gap:10px; }.invitee-record { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px; border:1px solid var(--line); border-radius:13px; background:#fbfdff; }.invitee-main { min-width:0; }.invitee-main b,.invitee-main small { display:block; }.invitee-main b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }.invitee-main small { margin-top:5px; color:var(--muted); font-size:12px; line-height:1.5; }.invitee-tags { display:flex; flex:0 0 auto; flex-wrap:wrap; justify-content:flex-end; gap:6px; }.invite-status { padding:4px 7px; border-radius:999px; color:#526071; background:#f0f3f7; font-size:11px; font-weight:700; white-space:nowrap; }.invite-status.is-normal { color:#087657; background:#e4f7ef; }.invite-status.is-attention { color:#8a6100; background:#fff4d7; }
@keyframes draw-card { 0% { transform:translateY(0) rotate(0); opacity:1; } 45% { transform:translateY(-28px) rotate(-4deg) scale(1.035); opacity:1; } 100% { transform:translateY(-12px) rotate(3deg) scale(.98); opacity:1; } }
@media (prefers-reduced-motion: reduce) { .stack-top-card,.card-cover-image,.result-card-inner { transition:none; }.lottery-card-stack.is-drawing .stack-top-card { animation:none; } }
@media (max-width:720px) { .lottery-card-stack{width:min(198px,62vw);margin-bottom:18px}.draw-results.is-batch{gap:6px}.result-card-face{padding:5px;border-radius:10px}.result-card-front b{font-size:10px}.result-card-front strong,.result-card-front small{font-size:9px}.result-card-back .card-mascot{transform:scale(.5)}.invitee-record{align-items:flex-start;flex-direction:column}.invitee-tags{justify-content:flex-start}.invite-code{font-size:12px}.invite-record-card .card-head{gap:8px}.invite-record-card .card-head>div{min-width:0} }
@media (max-width:390px) { .draw-actions{gap:8px}.draw-actions button{padding-left:7px;padding-right:7px}.draw-results.is-batch{gap:4px}.result-card-front b{font-size:9px}.result-card-front strong,.result-card-front small{font-size:8px}.result-card-back .card-mascot{transform:scale(.42)} }

/* Lottery presentation zones deliberately reserve their own vertical space.
   Animating a card can therefore never spill into the action controls. */
.lottery-stage { overflow:visible; }
.lottery-card-zone { position:relative; display:grid; place-items:center; min-height:342px; margin:0 -2px 14px; overflow:hidden; isolation:isolate; border-radius:18px; background:radial-gradient(circle at 50% 20%,#f1f8ff 0,rgba(241,248,255,.58) 34%,rgba(255,255,255,0) 72%); }
.lottery-card-zone::after { content:""; position:absolute; z-index:-1; bottom:17px; width:min(268px,72vw); height:24px; border-radius:50%; background:rgba(11,79,153,.12); filter:blur(10px); }
.lottery-card-zone .lottery-card-stack { margin:8px auto 20px; }
.lottery-actions-zone { position:relative; z-index:3; padding:14px 0 2px; border-top:1px solid #e6eff9; background:linear-gradient(180deg,rgba(255,255,255,.88),#fff 42%); }
.draw-actions { max-width:510px; gap:12px; }
.draw-actions button { min-height:72px; padding:11px 14px; border-radius:17px; line-height:1.2; box-shadow:0 8px 18px rgba(17,83,156,.10); transition:transform .2s ease,box-shadow .2s ease,filter .2s ease; }
.draw-actions button:not(:disabled):hover { transform:translateY(-2px); box-shadow:0 13px 22px rgba(17,83,156,.16); }
.draw-actions button small { margin-top:3px; font-size:11px; font-weight:750; letter-spacing:.01em; }
.draw-actions .primary { color:#fff; background:linear-gradient(135deg,#1677d1,#0b4f99); border:1px solid #0c5cac; }
.draw-actions .secondary { color:#104f91; background:linear-gradient(135deg,#fafdff,#eaf5ff); border:1px solid #b8d7f3; }
.draw-actions button:disabled { color:#8498b0; background:#f0f4f8; border-color:#dde6ee; box-shadow:none; cursor:not-allowed; }
.draw-actions button:disabled small { color:#8498b0; opacity:1; }
.card-cover-image { position:absolute; z-index:0; inset:0; width:100%; height:100%; object-fit:cover; opacity:.88; pointer-events:none; }
.stack-top-card::before { z-index:1; }
.stack-top-card .card-mascot,.stack-top-card .stack-card-title,.stack-top-card small,.stack-top-card em { z-index:2; }
.stack-top-card .card-mascot { margin-top:7px; }
@media (max-width:720px) { .lottery-card-zone { min-height:304px; margin-bottom:11px; border-radius:15px; }.lottery-card-zone .lottery-card-stack { margin-bottom:13px; }.lottery-actions-zone { padding-top:12px; }.draw-actions { gap:9px; }.draw-actions button { min-height:68px; border-radius:15px; }.draw-actions button small { font-size:10px; } }
@media (max-width:390px) { .lottery-card-zone { min-height:280px; }.lottery-card-stack { width:min(178px,59vw); }.draw-actions { gap:7px; }.draw-actions button { min-height:66px; padding-left:6px; padding-right:6px; font-size:14px; }.draw-actions button small { max-width:125px; line-height:1.25; } }
@media (max-width:340px) { .lottery-card-zone { min-height:266px; }.lottery-card-stack { width:min(166px,58vw); }.draw-actions button { font-size:13px; }.draw-actions button small { font-size:9.5px; } }

/* 会员抽奖页：在原有蓝白系统上强化活动感，卡牌、操作、奖池、记录各自成区。 */
.lottery-page { gap:20px; }
.lottery-page .lottery-header { position:relative; overflow:hidden; align-items:center; padding:22px; border:1px solid #9bc9f4; border-radius:22px; color:#fff; background:linear-gradient(135deg,#126bc9 0%,#138cde 53%,#50b7f0 100%); box-shadow:0 18px 34px rgba(13,94,182,.18); }
.lottery-page .lottery-header::before { content:""; position:absolute; width:190px; height:190px; right:-52px; top:-84px; border:1px solid rgba(255,255,255,.26); border-radius:50%; box-shadow:-42px 50px 0 -1px rgba(255,255,255,.12),-84px 100px 0 -2px rgba(255,255,255,.12); pointer-events:none; }
.lottery-page .lottery-header > div:first-child { position:relative; z-index:1; min-width:0; }
.lottery-page .eyebrow { color:#d9f2ff; font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
.lottery-page .lottery-header h2 { color:#fff; font-size:clamp(23px,5vw,29px); letter-spacing:-.035em; }
.lottery-page .lottery-header p { max-width:270px; color:rgba(255,255,255,.84); line-height:1.6; }
.lottery-page .draw-count { position:relative; z-index:1; min-width:126px; padding:13px 15px; border:1px solid rgba(255,255,255,.38); border-radius:16px; background:rgba(255,255,255,.17); box-shadow:inset 0 1px 0 rgba(255,255,255,.25); backdrop-filter:blur(8px); }
.lottery-page .draw-count span { color:#def5ff; font-weight:700; }
.lottery-page .draw-count strong { color:#fff; font-size:29px; }
.lottery-page .entry-picker { gap:10px; padding:12px 14px; border:1px solid #d8e9f7; border-radius:14px; color:#55708d; background:#f8fbff; }
.lottery-page .entry-picker select { min-height:40px; border-color:#c9def2; border-radius:10px; box-shadow:inset 0 1px 1px rgba(29,93,157,.04); }
.lottery-experience-stage { position:relative; padding:20px; overflow:hidden; border:1px solid #d2e5f6; border-radius:22px; background:linear-gradient(145deg,#fff 0%,#f7fbff 60%,#edf7ff 100%); box-shadow:0 12px 28px rgba(19,77,142,.07); }
.lottery-experience-stage::before { content:""; position:absolute; inset:auto -80px 31% auto; width:190px; height:190px; border-radius:50%; background:radial-gradient(circle,rgba(110,198,244,.16),rgba(110,198,244,0) 68%); pointer-events:none; }
.lottery-experience-stage .lottery-tip { position:relative; z-index:1; margin:0 auto 8px; max-width:320px; padding:7px 10px; border-radius:999px; color:#3970a6; background:#e9f5ff; font-size:12px; font-weight:700; }
.lottery-card-zone { min-height:356px; margin:0 -2px 16px; border:1px solid #dcecf9; border-radius:19px; background:radial-gradient(circle at 50% 14%,rgba(178,225,252,.75),rgba(245,251,255,.62) 39%,rgba(255,255,255,.2) 73%); }
.lottery-card-zone::before { content:""; position:absolute; inset:13px; z-index:-1; border:1px solid rgba(155,201,244,.43); border-radius:14px; pointer-events:none; }
.lottery-zone-kicker { position:absolute; top:17px; left:50%; z-index:2; display:inline-flex; align-items:center; gap:6px; transform:translateX(-50%); padding:6px 10px; border:1px solid #c8e2f7; border-radius:999px; color:#276cae; background:rgba(255,255,255,.74); box-shadow:0 4px 12px rgba(25,102,175,.08); font-size:11px; font-weight:850; white-space:nowrap; }
.lottery-zone-kicker span { color:#1d82d7; }
.lottery-card-zone .lottery-card-stack { margin:28px auto 22px; }
.lottery-card-stack { filter:drop-shadow(0 20px 19px rgba(10,78,147,.12)); }
.stack-top-card.has-card-cover { background:#1169c1; }
.stack-top-card.has-card-cover .card-mascot,.stack-top-card.has-card-cover .stack-card-title,.stack-top-card.has-card-cover small,.stack-top-card.has-card-cover em { opacity:0; visibility:hidden; }
.card-cover-image { opacity:1; transform:scale(1); transform-origin:center; will-change:opacity,transform; transition:opacity 140ms ease,transform 180ms cubic-bezier(.22,.72,.25,1); }
/* Hide the old portrait before changing src, so two mascot faces never blend. */
.stack-top-card.is-cover-switching .card-cover-image { opacity:0; transform:scale(1.018) translateY(-1px); }
.lottery-actions-zone { display:grid; gap:11px; padding:16px 0 2px; border-top:1px solid #dcecf9; background:linear-gradient(180deg,rgba(255,255,255,.4),rgba(255,255,255,.94) 42%); }
.lottery-action-copy { display:flex; align-items:baseline; justify-content:space-between; gap:14px; max-width:510px; margin:0 auto; color:#57718d; font-size:12px; }
.lottery-action-copy b { color:#274f7d; font-size:14px; }
.lottery-action-copy span { text-align:right; }
.draw-actions { max-width:510px; }
.draw-actions button { position:relative; overflow:hidden; min-height:74px; border-radius:16px; font-size:16px; font-weight:850; }
.draw-actions button::after { content:""; position:absolute; right:-18px; bottom:-35px; width:90px; height:90px; border:1px solid rgba(255,255,255,.26); border-radius:50%; pointer-events:none; }
.draw-actions .primary { background:linear-gradient(135deg,#177bd5,#0752a2); box-shadow:0 12px 24px rgba(13,87,171,.24); }
.draw-actions .secondary { background:linear-gradient(135deg,#fafdff,#dff1ff); box-shadow:0 9px 19px rgba(18,101,182,.10); }
.draw-actions button small { position:relative; z-index:1; font-size:11px; }
.draw-actions button:disabled { background:#f1f5f8; }
.draw-results { position:relative; z-index:2; margin-top:20px; }
.draw-result.is-pending { display:none; }
.lottery-page .pool-card,.lottery-page .lottery-history,.lottery-page .lottery-rules { border:1px solid #dceaf8; border-radius:18px; box-shadow:0 8px 20px rgba(22,80,143,.05); }
.lottery-page .pool-card .card-head,.lottery-page .lottery-history .card-head { margin-bottom:14px; padding-bottom:11px; border-bottom:1px solid #edf4fb; }
.lottery-page .pool-card h3,.lottery-page .lottery-history h3,.lottery-page .lottery-rules h3 { color:#204a78; font-size:17px; }
.lottery-page .pool-grid { gap:11px; }
.lottery-page .pool-item { min-height:62px; padding:13px; border-color:#dceaf7; border-radius:14px; background:linear-gradient(135deg,#fff,#f5faff); }
.lottery-page .pool-item i { width:38px; height:38px; border-radius:12px; background:#e5f3ff; color:#1675cb; }
.lottery-page .pool-item b { color:#294a6d; }
.lottery-page .pool-item small { line-height:1.45; }
.lottery-page .lottery-history .lottery-history-record { align-items:center; gap:14px; min-width:0; padding:10px 2px; }
.lottery-page .lottery-history .lottery-history-record + .lottery-history-record { border-top:1px solid #edf3f9; }
.lottery-history-card-cover { flex:0 0 auto; display:grid; width:34px; height:51px; place-items:center; overflow:hidden; border:1px solid #b7d9f3; border-radius:7px; background:#f5fbff; }
.lottery-history-card-cover img { display:block; width:100%; height:100%; object-fit:contain; }
.lottery-history-main { flex:1 1 auto; min-width:0; }
.lottery-page .lottery-history .lottery-history-main b { display:block; overflow-wrap:anywhere; color:#1f466f; font-size:14px; font-weight:750; line-height:1.4; }
.lottery-page .lottery-history .lottery-history-main small { margin-top:3px; color:#8390a2; font-size:12px; line-height:1.35; }
.lottery-history-reward { flex:0 0 auto; align-self:center; text-align:right; font-size:14px; line-height:1.4; }
.lottery-history-record.is-no-prize { gap:0; }
.lottery-page .empty { padding:17px; border:1px dashed #c9def1; border-radius:13px; color:#66809a; background:#f8fbff; text-align:center; }
.lottery-page .lottery-rules { padding:18px 20px; background:linear-gradient(135deg,#f7fbff,#fff); }
.lottery-page .lottery-rules ol { padding-left:21px; line-height:1.85; }

@media (max-width:720px) {
  .lottery-page { gap:16px; }
  .lottery-page .lottery-header { align-items:flex-start; padding:18px; border-radius:19px; }
  .lottery-page .draw-count { min-width:102px; padding:10px 12px; }
  .lottery-page .draw-count strong { font-size:25px; }
  .lottery-experience-stage { padding:14px 10px; border-radius:19px; }
  .lottery-card-zone { min-height:318px; border-radius:16px; }
  .lottery-card-zone .lottery-card-stack { margin-top:26px; }
  .lottery-action-copy { padding:0 4px; }
  .draw-actions button { min-height:70px; border-radius:14px; font-size:15px; }
  .lottery-page .pool-card,.lottery-page .lottery-history,.lottery-page .lottery-rules { border-radius:16px; }
  .lottery-page .lottery-history .lottery-history-record { gap:12px; padding:10px 0; }
  .lottery-history-card-cover { width:31px; height:47px; }
}
@media (max-width:390px) {
  .lottery-page .lottery-header { gap:12px; padding:16px; }
  .lottery-page .lottery-header h2 { font-size:22px; }
  .lottery-page .lottery-header p { font-size:12px; }
  .lottery-page .draw-count { min-width:88px; }
  .lottery-card-zone { min-height:292px; }
  .lottery-zone-kicker { top:13px; font-size:10px; }
  .lottery-card-zone .lottery-card-stack { margin-top:23px; }
  .lottery-action-copy { align-items:flex-start; flex-direction:column; gap:3px; }
  .lottery-action-copy span { text-align:left; font-size:10px; }
  .draw-actions button { min-height:68px; font-size:14px; }
  .lottery-page .lottery-history .lottery-history-main b { font-size:13px; }
  .lottery-history-reward { font-size:13px; }
}
@media (max-width:340px) {
  .lottery-page .lottery-header { padding:14px; }
  .lottery-page .draw-count { min-width:80px; padding:9px; }
  .lottery-card-zone { min-height:276px; }
  .lottery-zone-kicker { max-width:calc(100% - 24px); overflow:hidden; text-overflow:ellipsis; }
  .draw-actions button { min-height:66px; font-size:13px; }
}

/* Rear cards are deliberately art-free. The sole mascot portrait lives on the
   opaque top card, eliminating translucent face-on-face ghosting. */
.lottery-card-stack .stack-card { background:radial-gradient(circle at 50% 18%,rgba(152,221,255,.42),transparent 29%),linear-gradient(145deg,#0b4f99 0%,#1473cc 48%,#083b85 100%); background-position:center; background-size:cover; }
.stack-top-card.has-card-cover::after { content:""; position:absolute; z-index:2; inset:auto 0 0; height:36%; background:linear-gradient(0deg,rgba(3,35,91,.78),rgba(3,35,91,0)); pointer-events:none; }
.card-cover-caption { position:absolute; z-index:3; right:0; bottom:24px; left:0; display:grid; gap:3px; color:#fff; text-align:center; text-shadow:0 3px 9px rgba(2,31,77,.7); pointer-events:none; }
.card-cover-caption b { font-size:clamp(21px,6.1vw,28px); font-weight:950; letter-spacing:.08em; }
.card-cover-caption small { font-size:11px; font-weight:700; letter-spacing:.12em; opacity:.95; }
@media (max-width:390px) { .card-cover-caption { bottom:19px; }.card-cover-caption b { font-size:20px; }.card-cover-caption small { font-size:9px; } }

/* 旧版结果面样式保留给历史页面，正式路径不会再覆盖数字或单位。 */
.result-card-front { padding:0; background:#0b5eb2; }
.result-reward-image { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.result-card-front::after { content:""; position:absolute; z-index:1; inset:42% 0 0; background:linear-gradient(0deg,rgba(2,32,81,.92),rgba(2,32,81,0)); pointer-events:none; }
.result-reward-caption { position:absolute; z-index:2; right:5px; bottom:7px; left:5px; display:grid; gap:2px; color:#fff; text-align:center; text-shadow:0 2px 7px rgba(0,18,59,.82); }
.result-reward-caption small { color:#d8f5ff; font-size:9px; font-weight:800; letter-spacing:.06em; }
.result-reward-caption b { font-size:clamp(10px,2.7vw,14px); line-height:1.22; word-break:break-word; }
.result-reward-caption strong { color:#fff2a3; font-size:clamp(9px,2.35vw,12px); line-height:1.2; }
.result-card.is-revealed .result-reward-image { animation:result-art-pop .42s ease-out both; }
@keyframes result-art-pop { from { opacity:.45; transform:scale(1.07); } to { opacity:1; transform:scale(1); } }
@media (prefers-reduced-motion:reduce) { .result-card.is-revealed .result-reward-image { animation:none; } }
@media (max-width:390px) { .result-reward-caption { right:3px; bottom:5px; left:3px; }.result-reward-caption small { font-size:8px; }.result-reward-caption b { font-size:9px; }.result-reward-caption strong { font-size:8px; } }

/* 权益流水按真实 delta 着色：增加为红、减少为绿、零值为中性灰。 */
.asset-delta { font-weight:800; white-space:nowrap; }
.asset-increase { color:#E53935 !important; }
.asset-decrease { color:#16A34A !important; }
.asset-neutral { color:#64748B !important; }
.lottery-history .positive { color:#E53935; }
.draw-result-summary,.lottery-preview-summary > span { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:0 6px; }
.draw-result-summary > i,.lottery-preview-summary > span > i { color:#6d8296; font-style:normal; }

/* 积分商城的两种履约方式共享会员中心的蓝白卡片体系，避免把自动奖励伪装成充值。 */
.point-store-product { position:relative; display:flex; min-width:0; min-height:230px; flex-direction:column; }
.product-delivery-badge { align-self:flex-start; margin:0 0 9px; padding:4px 8px; border-radius:999px; font-size:11px; font-weight:800; line-height:1.2; }
.product-delivery-badge.is-direct { color:#0b5b9d; background:#e8f4ff; }
.product-delivery-badge.is-service { color:#7a5a16; background:#fff5db; }
.point-store-description { white-space:pre-wrap; overflow-wrap:anywhere; }
.point-store-fulfillment { display:block; min-height:19px; margin:0 0 13px; color:#6e7e92; font-size:12px; line-height:1.55; }
.point-store-product .product-footer { margin-top:auto; }
.redemption-success-mask { position:fixed; z-index:1000; inset:0; display:grid; place-items:center; padding:20px; background:rgba(15,37,65,.42); }
.redemption-success-dialog { position:relative; width:min(100%,480px); max-height:min(720px,calc(100vh - 40px)); overflow:auto; padding:28px; border:1px solid #cfe2f4; border-radius:20px; background:#fff; box-shadow:0 22px 52px rgba(19,58,100,.24); }
.redemption-close { position:absolute; top:12px; right:13px; width:32px; height:32px; border:0; border-radius:50%; color:#64748b; background:#f1f5f9; font-size:23px; line-height:1; }
.redemption-success-mark { display:grid; width:44px; height:44px; place-items:center; margin:0 auto 12px; border-radius:50%; color:#fff; background:linear-gradient(135deg,#1986df,#0b5ba9); font-size:24px; font-weight:900; }
.redemption-success-dialog h3 { margin:0; color:#173a63; text-align:center; font-size:19px; }
.redemption-order-no { margin:7px 0 17px; color:#76869a; font-size:12px; text-align:center; }
.redemption-product-name { margin:0 0 13px; color:#173a63; font-size:16px; font-weight:850; text-align:center; overflow-wrap:anywhere; }
.redemption-success-copy { margin:0 0 13px; color:#63748a; font-size:13px; line-height:1.7; }
.redemption-reward { display:grid; gap:4px; padding:14px; border:1px solid #cde5f7; border-radius:14px; background:#f4faff; text-align:center; }
.redemption-reward span,.redemption-reward small { color:#6a8199; font-size:12px; }.redemption-reward b { color:#d92f34; font-size:22px; }
.redemption-copy-row { display:flex; align-items:center; gap:8px; padding:11px 0; border-bottom:1px solid #ebf0f5; }.redemption-copy-row span { color:#718197; font-size:12px; }.redemption-copy-row b { min-width:0; flex:1; color:#234b76; font-size:13px; overflow-wrap:anywhere; }.redemption-copy-row .secondary { flex:0 0 auto; padding:7px 9px; font-size:12px; }
.redemption-description { margin:13px 0; padding:12px; border:1px solid #e0eaf3; border-radius:12px; background:#f8fbfe; }.redemption-description>div { display:flex; align-items:center; justify-content:space-between; gap:8px; color:#64758a; font-size:12px; }.text-copy { border:0; padding:3px 0; color:#0b5ba9; background:transparent; font-weight:750; }.redemption-description pre { max-height:180px; margin:9px 0 0; overflow:auto; color:#31465d; font:12px/1.65 Inter,"Microsoft YaHei",sans-serif; white-space:pre-wrap; overflow-wrap:anywhere; }
.redemption-success-actions { display:flex; justify-content:center; margin-top:18px; }.redemption-success-actions .primary { min-width:150px; }
@media (max-width:420px) { .redemption-success-mask { padding:12px; }.redemption-success-dialog { max-height:calc(100vh - 24px); padding:23px 18px 18px; border-radius:17px; }.redemption-copy-row { align-items:flex-start; flex-wrap:wrap; }.redemption-copy-row b { flex-basis:calc(100% - 94px); }.redemption-copy-row .secondary { margin-left:auto; } }

/* 正式开奖结果：上传的完整中奖卡牌就是唯一视觉层，不再叠加动态数字或单位艺术字。 */
.draw-results.is-single { width:min(100%,350px); grid-template-columns:minmax(0,1fr); }
.draw-results.is-batch { grid-template-columns:repeat(5,minmax(106px,120px)); justify-content:start; max-width:100%; padding:3px 3px 12px; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:thin; }
.result-card { aspect-ratio:2 / 3; }
.result-card-front { padding:0; background:#eef7ff; }
.result-card-front::after { content:none; }
.result-reward-image { position:absolute; z-index:0; inset:0; display:block; width:100%; height:100%; object-fit:contain; object-position:center; background:#eef7ff; }
.result-reward-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }
.result-template-fallback { position:absolute; z-index:1; inset:13% 8%; display:none; place-content:center; gap:7px; padding:15px; border:2px solid #9ecaf0; border-radius:15px; color:#1d4d79; background:linear-gradient(145deg,#f7fcff,#dff1ff); box-shadow:inset 0 1px 0 #fff; text-align:center; }
.result-template-fallback b { font-size:14px; }.result-template-fallback span { color:#0b66b9; font-size:15px; font-weight:900; }.result-template-fallback small { color:#6e8398; font-size:11px; }
.result-card-front.has-image-error .result-reward-image { display:none; }
.result-card-front.has-image-error .result-template-fallback { display:grid; }
@media (max-width:720px) { .draw-results.is-single { width:min(100%,320px); }.draw-results.is-batch { grid-template-columns:repeat(5,minmax(104px,112px)); gap:8px; } .result-template-fallback b { font-size:10px; }.result-template-fallback span { font-size:13px; } }
@media (max-width:390px) { .draw-results.is-batch { grid-template-columns:repeat(5,104px); gap:7px; } }

/* A filter anywhere on this card's ancestor chain flattens 3D descendants in
   Chromium and mirrors the card back after reveal. Use face box-shadows. */
.result-card { filter:none; }
.result-card.is-winner { filter:none; }
.result-card-inner { filter:none; transform-style:preserve-3d; -webkit-transform-style:preserve-3d; will-change:transform; }
.result-card.is-winner .result-card-inner { filter:none; }
.result-card-face { transform-style:preserve-3d; -webkit-transform-style:preserve-3d; backface-visibility:hidden; -webkit-backface-visibility:hidden; box-shadow:0 9px 11px rgba(18,72,131,.14); }
.result-card.is-winner .result-card-face { box-shadow:0 10px 15px rgba(18,103,196,.3); }
.result-card-back { transform:rotateY(0deg) translateZ(.1px); }
.result-card-front { transform:rotateY(180deg) translateZ(.1px); box-shadow:inset 0 1px 0 #fff,0 9px 11px rgba(18,72,131,.14); }
.result-card.is-winner .result-card-front { box-shadow:inset 0 1px 0 #fff,0 10px 15px rgba(18,103,196,.3); }
.result-reward-image { z-index:0; }

/* 六宫格在白色会员卡片内保持等高、居中、统一的线性图标视觉重心。 */
.feature-grid { grid-auto-rows:1fr; }
.feature-tile { min-height:106px; padding:14px 8px 13px; gap:10px; }
.feature-tile .feature-icon { display:block; width:30px; height:30px; flex-basis:30px; object-fit:contain; background:none; filter:none; }
.feature-tile:hover .feature-icon,
.feature-tile:focus-visible .feature-icon { opacity:.82; }
@media (max-width:390px) {
  .feature-grid { gap:8px; }
  .feature-tile { min-height:92px; padding:11px 4px 10px; gap:7px; }
  .feature-tile .feature-icon { width:26px; height:26px; flex-basis:26px; }
  .feature-tile span { font-size:11px; white-space:nowrap; }
}
@media (max-width:340px) {
  .feature-grid { gap:6px; }
  .feature-tile { min-height:86px; padding:9px 2px; gap:6px; }
  .feature-tile .feature-icon { width:24px; height:24px; flex-basis:24px; }
  .feature-tile span { font-size:10px; letter-spacing:-.02em; }
}

/* 会员身份卡与充值抽奖共用同一套活动渐变，使首页状态和抽奖入口成为连续体验。 */
.member-identity {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:1px solid #9bc9f4;
  border-radius:22px;
  background:linear-gradient(135deg,#126bc9 0%,#138cde 53%,#50b7f0 100%);
  box-shadow:0 18px 34px rgba(13,94,182,.18);
}
.member-identity::before {
  content:"";
  position:absolute;
  z-index:0;
  width:190px;
  height:190px;
  right:-52px;
  top:-84px;
  border:1px solid rgba(255,255,255,.26);
  border-radius:50%;
  box-shadow:-42px 50px 0 -1px rgba(255,255,255,.12),-84px 100px 0 -2px rgba(255,255,255,.12);
  pointer-events:none;
}
.member-identity > * { position:relative; z-index:1; }
.feature-tile {
  gap:10px;
  transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease;
}
.feature-tile .feature-icon {
  display:block;
  width:30px;
  height:30px;
  flex:0 0 30px;
  object-fit:contain;
  background:none;
  filter:drop-shadow(0 2px 2px rgba(8,84,164,.12));
}
.feature-tile:hover .feature-icon,
.feature-tile:focus-visible .feature-icon { opacity:.82; }
.feature-tile:focus-visible { outline:3px solid rgba(63,160,235,.3); outline-offset:2px; }
@media (max-width:720px) {
  .member-identity { border-radius:19px; }
  .feature-tile .feature-icon { width:24px; height:24px; flex-basis:24px; }
}

/* 图片资源比外部 CSS mask 在移动端 WebView 中更稳定，避免功能入口图标丢失。 */
.feature-tile img.feature-icon {
  display:block;
  width:30px;
  height:30px;
  flex:0 0 30px;
  object-fit:contain;
  background:none;
  -webkit-mask:none;
  mask:none;
  filter:drop-shadow(0 2px 2px rgba(8,84,164,.12));
}
.feature-tile:hover img.feature-icon,
.feature-tile:focus-visible img.feature-icon { opacity:.82; }
@media (max-width:390px) {
  .feature-tile img.feature-icon { width:26px; height:26px; flex-basis:26px; }
}
@media (max-width:340px) {
  .feature-tile img.feature-icon { width:24px; height:24px; flex-basis:24px; }
}

/* 会员等级采用同一组本地徽章资源；邀请奖励名称在窄屏下可截断并保留完整提示。 */
.member-identity > .member-level { display:inline-flex; align-items:center; gap:7px; min-width:0; margin:0; color:rgba(255,255,255,.9); font-size:13px; font-weight:800; line-height:1.45; }
.member-identity > .member-level > img { display:block; width:24px !important; max-width:24px !important; height:24px !important; max-height:24px !important; flex:0 0 24px; object-fit:contain; }
.ledger-record-copy { min-width:0; }
.ledger-record-copy b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:430px) {
  .member-identity > .member-level { font-size:12px; }
  .member-identity > .member-level > img { width:21px !important; max-width:21px !important; height:21px !important; max-height:21px !important; flex-basis:21px; }
}

/* Draw backs are real local cover art. The two faces remain in the same 3D
   context so a reveal is a rotateY flip, never an image substitution. */
.result-card { perspective:1050px; transform-style:preserve-3d; }
.result-card-inner { position:relative; transform-style:preserve-3d; -webkit-transform-style:preserve-3d; transition:transform .72s cubic-bezier(.2,.78,.2,1); }
.result-card.is-revealed .result-card-inner { transform:rotateY(180deg) rotateZ(0.35deg); }
.result-card-face { transform-style:preserve-3d; -webkit-transform-style:preserve-3d; backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.result-card-back { position:absolute; inset:0; padding:0; background:#075dad; box-shadow:0 13px 22px rgba(13,78,151,.24); transform:rotateY(0deg) translateZ(.5px); }
.result-card-front { position:absolute; inset:0; overflow:hidden; transform:rotateY(180deg) translateZ(.5px); box-shadow:0 13px 22px rgba(13,78,151,.24); }
.result-card-cover { position:absolute; inset:0; z-index:0; display:block; width:100%; height:100%; object-fit:cover; }
.result-card-back::after { content:""; position:absolute; z-index:1; inset:0; background:linear-gradient(145deg,rgba(255,255,255,.18),transparent 36%,rgba(0,35,102,.28)); pointer-events:none; }
.result-card-back-gloss { position:absolute; z-index:2; top:-20%; left:-40%; width:72%; height:150%; border-radius:50%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent); transform:rotate(18deg); pointer-events:none; }
.result-card-back small { position:absolute; z-index:3; right:0; bottom:8%; left:0; color:#fff; font-size:10px; font-weight:800; letter-spacing:.08em; text-align:center; text-shadow:0 2px 5px rgba(0,34,91,.7); }
.result-card.is-preview-card:not(.is-revealed) { animation:preview-card-deal .34s cubic-bezier(.2,.86,.28,1) both; animation-delay:calc(var(--draw-card-index) * 42ms); }
@keyframes preview-card-deal { from { opacity:0; transform:translateY(18px) scale(.9) rotate(-3deg); } to { opacity:1; transform:translateY(0) scale(1) rotate(0); } }

/* Pool art is attached only to prizes returned for the published activity. */
.lottery-page .pool-item .pool-reward-art { flex:0 0 42px; width:42px; height:42px; overflow:hidden; border:1px solid #b8daf7; border-radius:13px; background:#e5f3ff; box-shadow:inset 0 1px 0 rgba(255,255,255,.75); }
.lottery-page .pool-reward-art img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 100%; transform:scale(1.08); }
.lottery-page .pool-reward-art.is-no_prize img { object-position:center 100%; transform:scale(1.02); }

/* The optional preview is opt-in by URL and never invokes a draw endpoint. */
.lottery-preview { display:grid; gap:16px; margin-top:18px; padding:18px; border:1px solid #a8d3f5; border-radius:18px; background:linear-gradient(155deg,#eaf7ff,#fff); box-shadow:0 12px 26px rgba(20,103,184,.09); }
.lottery-preview-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.lottery-preview-head .eyebrow { margin-bottom:3px; }
.lottery-preview-head h3 { margin:0; color:#1f568a; font-size:17px; }
.lottery-preview-head p { margin:5px 0 0; color:#58728f; font-size:12px; line-height:1.55; }
.lottery-preview-badge { flex:0 0 auto; padding:5px 8px; border-radius:999px; color:#096795; background:#d7f1ff; font-size:11px; font-weight:850; }
.lottery-preview-showcase { display:flex; max-width:100%; gap:9px; padding:2px 2px 10px; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:thin; }
.lottery-preview-showcase .result-card { flex:0 0 102px; min-width:102px; }
.lottery-preview-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.lottery-preview-actions button { min-height:58px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; }
.lottery-preview-actions small { font-size:10px; font-weight:700; opacity:.82; }
.lottery-preview-playback { min-height:54px; }
.lottery-preview-results { margin-top:0; }
.lottery-preview-idle,.lottery-preview-summary { display:grid; justify-items:center; gap:5px; padding:13px; border:1px dashed #a6d3f4; border-radius:12px; color:#477294; background:rgba(255,255,255,.72); font-size:12px; line-height:1.5; text-align:center; }
.lottery-preview-summary { margin-top:10px; border-style:solid; border-color:#b8e5d2; color:#08795d; background:#effaf5; }
.lottery-preview-summary b { font-size:14px; }
@media (max-width:430px) {
  .lottery-preview { padding:15px 12px; }
  .lottery-preview-showcase { gap:7px; }
  .lottery-preview-showcase .result-card { flex-basis:92px; min-width:92px; }
}
@media (max-width:390px) {
  .lottery-preview-head { display:grid; gap:8px; }
  .lottery-preview-badge { justify-self:start; }
  .lottery-preview-actions { gap:7px; }
  .lottery-preview-actions button { min-height:54px; padding:7px 4px; font-size:13px; }
}
@media (prefers-reduced-motion:reduce) {
  .result-card-inner { transition-duration:0s; }
  .result-card.is-preview-card:not(.is-revealed),.result-card.is-revealed .result-reward-image { animation:none; }
}

/* A five-card rail may scroll inside its own results viewport, but never
   increases the document width on a narrow phone. */
.lottery-stage,.lottery-preview,.lottery-preview-playback { min-width:0; max-width:100%; }
.draw-results.is-batch { width:100%; min-width:0; box-sizing:border-box; }
.lottery-preview-playback { overflow:hidden; }