@import "https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;700;900&family=Noto+Sans+JP:wght@400;500;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Inter:wght@400;500;600&display=swap";:root{--red-main:#c62828;--red-light:#ef5350;--red-dark:#8e0000;--gold:#ffb300;--gold-light:#ffd54f;--bg:#fafaf7;--surface:#fff;--border:#00000012;--text-primary:#1a1a1a;--text-secondary:#6b7280;--shadow-card:0 2px 12px #0000000f, 0 8px 32px #0000000a;--shadow-hero:0 16px 56px #c6282859, 0 8px 24px #c6282833;--shadow-red-glow:0 0 24px #c6282840, 0 8px 24px #c6282833;--shadow-gold-glow:0 0 20px #ffb3004d, 0 4px 16px #ffb30033}*,:before,:after{box-sizing:border-box}html,body{background-color:var(--bg);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.025'/%3E%3C/svg%3E");margin:0;padding:0;font-family:Plus Jakarta Sans,Noto Sans JP,Inter,sans-serif}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes bounceIn{0%{opacity:0;transform:scale(.8)translateY(8px)}60%{transform:scale(1.04)translateY(-2px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes pulse-glow{0%,to{box-shadow:var(--shadow-red-glow)}50%{box-shadow:0 0 36px #c6282866,0 12px 32px #c628284d}}@keyframes shimmer{0%{background-position:-200%}to{background-position:200%}}@keyframes slideOutLeft{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-32px)}}@keyframes slideInRight{0%{opacity:0;transform:translate(32px)}to{opacity:1;transform:translate(0)}}@keyframes revealUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes gradientShimmer{0%{background-position:-200%}to{background-position:200%}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}@keyframes correctPop{0%{transform:scale(1)}40%{transform:scale(1.04)}to{transform:scale(1)}}@keyframes floatUp{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes gokakuFlourish{0%{opacity:0;letter-spacing:.5em;transform:translate(-50%,-50%)scale(.6)}60%{opacity:.18;letter-spacing:.05em;transform:translate(-50%,-50%)scale(1.05)}to{opacity:.12;letter-spacing:.05em;transform:translate(-50%,-50%)scale(1)}}.anim-gokaku{animation:1.2s cubic-bezier(.22,1,.36,1) .2s both gokakuFlourish}@keyframes goldShimmer{0%{box-shadow:0 0 #ffb30066}60%{box-shadow:0 0 0 14px #ffb30000}to{box-shadow:0 0 #ffb30000}}.anim-gold-shimmer{animation:1.6s ease-out .4s both goldShimmer}@keyframes kanjiConfetti{0%{opacity:0;transform:translateY(-20vh)rotate(-12deg)}10%{opacity:1}to{opacity:0;transform:translateY(110vh)rotate(28deg)}}.anim-kanji-confetti{animation:2.2s ease-in forwards kanjiConfetti}@media (prefers-reduced-motion:reduce){.anim-kanji-confetti{animation:none!important}}.anim-fade-slide-up{animation:.5s both fadeSlideUp}.anim-fade-slide-up-d1{animation:.5s .1s both fadeSlideUp}.anim-fade-slide-up-d2{animation:.5s .2s both fadeSlideUp}.anim-fade-slide-up-d3{animation:.5s .35s both fadeSlideUp}.anim-scale-in{animation:.4s both scaleIn}.anim-bounce-in{animation:.5s cubic-bezier(.34,1.56,.64,1) both bounceIn}.anim-float{animation:3s ease-in-out infinite floatUp}.option-shake{animation:.4s both shake}.option-correct{animation:.3s both correctPop}.anim-slide-out-left{animation:.2s forwards slideOutLeft}.anim-slide-in-right{animation:.3s both slideInRight}.anim-reveal-up{animation:.35s .15s both revealUp}.option-selected{transition:transform .15s;transform:scale(1.02)}.shimmer-stripe{background:linear-gradient(90deg,#ffb300e6 0%,#ffd44f99 40%,#ffb300e6 100%) 0 0/200%;animation:2.5s linear infinite gradientShimmer}.gradient-text{background:linear-gradient(135deg, var(--red-main) 0%, var(--red-light) 50%, var(--gold) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.kanji-bg{position:relative;overflow:hidden}.kanji-bg:before{content:attr(data-kanji);color:#c628280a;pointer-events:none;-webkit-user-select:none;user-select:none;font-family:Noto Serif JP,serif;font-size:18rem;font-weight:900;line-height:1;position:absolute;top:50%;right:-2rem;transform:translateY(-50%)}.glass-card{-webkit-backdrop-filter:blur(12px);background:#fffc;border:1px solid #fff9}.pulse-red{animation:2.5s ease-in-out infinite pulse-glow}@keyframes spinShuriken{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin-on-hover:hover svg,.spin-on-hover:hover .shuriken-svg{animation:1.2s cubic-bezier(.4,0,.2,1) infinite spinShuriken}.option-selected{border-color:var(--gold)!important;background-color:#ffb30014!important;transition:all .15s!important;transform:scale(1.02)!important;box-shadow:0 0 14px #ffb30033!important}.option-btn-correct{animation:.35s both correctPop;box-shadow:0 0 18px #2e7d3266!important}.option-btn-wrong{animation:.4s both shake}.speech-bubble{position:relative}.speech-bubble:before{content:"";border:10px solid #0000;border-top-width:0;border-bottom:12px solid #fff3e0;position:absolute;top:-12px;left:28px}.score-ring{--ring-size:138px;width:var(--ring-size);height:var(--ring-size);background:conic-gradient(var(--ring-color,#c62828) var(--ring-pct,0%), #ffffff14 var(--ring-pct,0%));border-radius:50%;justify-content:center;align-items:center;display:flex;position:relative;box-shadow:0 8px 24px #00000080}.score-ring:before{content:"";background:#fff;border-radius:50%;position:absolute;inset:11px}.score-ring-inner{z-index:1;text-align:center;position:relative}
