:root{--bg:#fafafa;--bg-2:#f0f0f0;--text:#1c1c1c;--text-muted:#6b6b6b;--border:#d8d8d8;--primary:#1c1c1c;--primary-fg:#fff;--danger:#d12c2c;--accent:#ff4081;color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Hiragino Sans,Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,system-ui,sans-serif;font-size:16px;line-height:1.6}*{box-sizing:border-box}html,body,#root{min-height:100svh;margin:0;padding:0}body{background:var(--bg)}.app{flex-direction:column;max-width:640px;min-height:100svh;margin:0 auto;padding:24px 20px 48px;display:flex}.screen{flex-direction:column;flex:1;gap:24px;display:flex}.btn{font:inherit;border:1px solid var(--border);color:var(--text);cursor:pointer;background:#fff;border-radius:12px;width:100%;padding:14px 20px;font-weight:500;transition:transform 50ms,background .15s}.btn:hover{background:var(--bg-2)}.btn:active{transform:scale(.98)}.btn-primary{background:var(--primary);color:var(--primary-fg);border-color:var(--primary)}.btn-primary:hover{background:#333}.btn-danger{background:var(--danger);color:#fff;border-color:var(--danger)}.btn-danger:hover{background:#b22020}.btn-large{padding:18px 24px;font-size:18px}.btn-choice{text-align:left;flex-direction:column;align-items:flex-start;gap:2px;padding:14px 20px;font-size:16px;display:flex}.choice-ja{font-size:17px;font-weight:600}.choice-en{color:var(--text-muted);font-size:13px;font-weight:400}.title{letter-spacing:-.02em;text-align:center;margin:32px 0 8px;font-size:32px;font-weight:800}.title-num{color:var(--danger);font-size:1.4em}.subtitle{text-align:center;color:var(--text-muted);margin:0 0 24px}.rules{border:1px solid var(--border);background:#fff;border-radius:12px;padding:16px 20px}.rules p{color:var(--text-muted);margin:4px 0;font-size:14px}.difficulty{flex-direction:column;gap:12px;display:flex}.difficulty h2{text-align:center;margin:8px 0 0;font-size:16px}.hud{color:var(--text-muted);justify-content:space-between;font-size:14px;display:flex}.hud strong{color:var(--text);font-size:18px}.color-card{aspect-ratio:4/3;border:1px solid var(--border);border-radius:16px;width:100%;box-shadow:0 1px 3px #0000000a}.color-hex{color:#00000073;background:#ffffffb3;border-radius:6px;padding:4px 8px;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:13px}.question{text-align:center;margin:8px 0;font-size:20px;font-weight:600}.choices,.hard-form{flex-direction:column;gap:10px;display:flex}.hard-input{font:inherit;border:1px solid var(--border);background:#fff;border-radius:12px;width:100%;padding:14px 16px;font-size:18px}.hard-input:focus{outline:2px solid var(--text);outline-offset:1px}.gameover-screen{animation:.5s shake}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.anmika-frame{text-align:center;background:linear-gradient(135deg,#ff4081,#d12c2c);border-radius:20px;padding:40px 24px;position:relative;overflow:hidden;box-shadow:0 8px 24px #d12c2c4d}.anmika-frame:before{content:"";background:radial-gradient(circle,#ffffff4d 0%,#0000 60%);animation:2s ease-in-out infinite pulse;position:absolute;inset:-50%}@keyframes pulse{0%,to{opacity:.6;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}.anmika-shout{color:#fff;letter-spacing:.05em;text-shadow:2px 2px #0003;font-size:28px;font-weight:900;line-height:1.3;position:relative}.answer-reveal{border:1px solid var(--border);text-align:center;background:#fff;border-radius:12px;padding:16px}.answer-label{color:var(--text-muted);margin:0 0 8px;font-size:13px}.answer-card{border:1px solid var(--border);border-radius:8px;justify-content:flex-end;align-items:flex-end;width:100%;height:80px;padding:8px;display:flex}.answer-name-ja{margin:12px 0 2px;font-size:20px;font-weight:700}.answer-name-en{color:var(--text-muted);margin:0;font-size:14px}.score-box{border:1px solid var(--border);text-align:center;background:#fff;border-radius:12px;padding:20px}.score-label{color:var(--text-muted);margin:0 0 4px;font-size:14px}.score-value{color:var(--danger);margin:0;font-size:48px;font-weight:900}.score-total{color:var(--text-muted);font-size:20px;font-weight:400}.clear-screen{text-align:center;justify-content:center}.clear-title{background:linear-gradient(135deg,gold,#ff4081);color:#0000;-webkit-background-clip:text;background-clip:text;margin:80px 0 16px;font-size:48px}.clear-message{color:var(--text-muted);font-size:16px}.clear-score{margin:24px 0;font-size:24px;font-weight:700}