@font-face{
  font-family:'Smiley Sans';
  src:url('https://cdn.jsdelivr.net/gh/atelier-anchor/smiley-sans@v2.0.1/dist/SmileySans-Oblique.woff2') format('woff2');
  font-display:swap;
  crossorigin:anonymous;
}

*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{
  background:var(--nm-bg-base);
  color:var(--nm-text);
  font-family:var(--nm-font-body);
  display:flex;justify-content:center;
  background-image:var(--nm-glow,rgba(245,196,81,.15));
  background-image:radial-gradient(120% 80% at 50% -10%, rgba(245,196,81,.18), transparent 55%);
}
#app{
  width:100%;max-width:480px;min-height:100vh;position:relative;
}

/* 屏幕切换 */
.screen{display:none;min-height:100vh;flex-direction:column;}
.screen.active{display:flex;}

/* 通用按钮 */
.btn-primary{
  background:linear-gradient(135deg,var(--nm-gold),var(--nm-gold-bright));
  color:#1a1206;font-weight:800;font-size:18px;
  border:none;border-radius:var(--nm-radius-pill);
  padding:16px 40px;cursor:pointer;
  box-shadow:var(--nm-shadow-glow-gold);
  font-family:var(--nm-font-body);
  transition:transform .12s ease;
}
.btn-primary:active{transform:scale(.96);}
.btn-ghost{
  background:transparent;color:var(--nm-gold);
  border:1.5px solid var(--nm-gold);border-radius:var(--nm-radius-pill);
  padding:14px 32px;font-size:16px;font-weight:700;cursor:pointer;
}
.btn-text{
  background:none;border:none;color:var(--nm-text-muted);
  font-size:14px;cursor:pointer;text-decoration:underline;
}

/* 落地页 */
.landing-inner{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:32px 24px;gap:14px;
}
.mascot-hero{width:160px;height:160px;object-fit:contain;filter:drop-shadow(0 0 20px rgba(245,196,81,.4));}
.mascot-fallback{font-size:96px;filter:drop-shadow(0 0 20px rgba(245,196,81,.4));}
.eyebrow{color:var(--nm-gold);font-size:13px;letter-spacing:2px;opacity:.9;}
.title-display{
  font-family:var(--nm-font-display);
  font-size:54px;line-height:1.05;text-align:center;
  background:linear-gradient(135deg,#fff,var(--nm-gold));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 0 30px rgba(245,196,81,.25);
}
.subtitle{color:var(--nm-text-muted);font-size:15px;line-height:1.6;margin-top:4px;}
.tiny{color:var(--nm-text-muted);font-size:12px;margin-top:8px;opacity:.7;}

/* 答题页 */
.quiz-inner{flex:1;display:flex;flex-direction:column;padding:28px 22px;gap:22px;}
.progress-wrap{display:flex;align-items:center;gap:12px;}
.progress-bar{flex:1;height:8px;background:var(--nm-bg-surface-2);border-radius:var(--nm-radius-pill);overflow:hidden;}
.progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--nm-gold),var(--nm-gold-bright));transition:width .35s ease;border-radius:var(--nm-radius-pill);}
.progress-text{color:var(--nm-gold);font-size:13px;font-weight:700;min-width:42px;text-align:right;}
.question{font-size:24px;font-weight:800;line-height:1.4;font-family:var(--nm-font-display);}
.options{display:flex;flex-direction:column;gap:12px;margin-top:4px;}
.option{
  background:var(--nm-bg-surface);border:1.5px solid transparent;
  border-radius:var(--nm-radius-md);padding:16px 18px;font-size:16px;
  color:var(--nm-text);cursor:pointer;text-align:left;
  transition:all .15s ease;
}
.option:active{border-color:var(--nm-gold);background:var(--nm-bg-surface-2);transform:scale(.98);}

/* 揭晓页 */
.reveal-inner{flex:1;display:flex;align-items:center;justify-content:center;perspective:1200px;padding:24px;}
.flip-card{width:300px;height:420px;position:relative;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.2,.8,.2,1);}
.flip-card.flipped{transform:rotateY(180deg);}
.flip-front,.flip-back{position:absolute;inset:0;backface-visibility:hidden;border-radius:var(--nm-radius-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;}
.flip-front{background:linear-gradient(160deg,var(--nm-bg-surface),var(--nm-bg-surface-2));border:1.5px solid var(--nm-gold);}
.lottery{font-size:80px;animation:shake 1s infinite;}
.lottery-text{color:var(--nm-gold);margin-top:16px;font-size:16px;}
@keyframes shake{0%,100%{transform:rotate(-12deg);}50%{transform:rotate(12deg);}}
.flip-back{transform:rotateY(180deg);background:linear-gradient(160deg,#1a1206,var(--nm-bg-surface));border:1.5px solid var(--nm-gold);color:var(--nm-gold);font-family:var(--nm-font-display);font-size:40px;}

/* 结果页 */
.result-inner{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:22px 18px 32px;gap:18px;overflow-y:auto;}
.result-card{
  position:relative;width:100%;max-width:340px;aspect-ratio:3/4;
  background:linear-gradient(165deg,#15131f 0%, #0E0E16 60%);
  border:1.5px solid var(--nm-gold);border-radius:var(--nm-radius-lg);
  box-shadow:var(--nm-shadow-card);overflow:hidden;
  display:flex;flex-direction:column;align-items:center;
  padding:22px 20px;color:var(--nm-text);
}
.rc-glow{position:absolute;top:-40%;left:50%;transform:translateX(-50%);width:140%;height:60%;
  background:radial-gradient(circle, var(--rc-color,var(--nm-gold)) 0%, transparent 70%);opacity:.28;pointer-events:none;}
.rc-head{display:flex;align-items:center;gap:8px;z-index:1;}
.rc-mascot{width:42px;height:42px;object-fit:contain;}
.rc-label{font-size:13px;color:var(--nm-text-muted);letter-spacing:1px;}
.rc-type{font-family:var(--nm-font-display);font-size:46px;margin-top:10px;color:var(--rc-color,var(--nm-gold));text-shadow:0 0 22px var(--rc-color,var(--nm-gold));z-index:1;}
.rc-emoji{font-size:60px;margin:2px 0 6px;z-index:1;}
.rc-god{font-size:15px;color:var(--nm-text);z-index:1;}
.rc-god b{color:var(--rc-color,var(--nm-gold));}
.rc-fortune{margin:12px 0;font-family:var(--nm-font-display);font-size:22px;color:#1a1206;background:var(--rc-color,var(--nm-gold));padding:4px 18px;border-radius:var(--nm-radius-pill);z-index:1;}
.rc-quote{font-size:16px;line-height:1.6;text-align:center;color:var(--nm-text);padding:0 6px;z-index:1;font-style:italic;}
.rc-footer{margin-top:auto;display:flex;align-items:center;gap:12px;z-index:1;width:100%;border-top:1px dashed rgba(245,196,81,.3);padding-top:14px;}
.rc-qr{width:64px;height:64px;border-radius:8px;background:#fff;padding:3px;}
.rc-cta{display:flex;flex-direction:column;gap:2px;}
.rc-cta b{color:var(--nm-gold);font-size:15px;}
.rc-cta span{font-size:11px;color:var(--nm-text-muted);}
.rc-scan{color:var(--nm-gold)!important;font-size:11px!important;}

.actions{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;}
.toast{color:var(--nm-gold);font-size:14px;min-height:18px;text-align:center;opacity:0;transition:opacity .3s;}
.toast.show{opacity:1;}
