:root{--primary: #6C63FF;--accent: #FF6584;--bg: #F0F4F8;--card: #FFFFFF;--text: #2D3436;--success: #00B894}body{margin:0;background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,sans-serif}.app-container{max-width:500px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;background:#fff;box-shadow:0 0 30px #0000000d}.app-header{padding:15px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #eee}.cloud-tag{font-size:12px;color:var(--primary);background:#e8e7ff;padding:4px 10px;border-radius:20px;display:flex;align-items:center;gap:5px}.score-badge{display:flex;align-items:center;gap:8px;font-weight:700;color:#636e72}.view-home{padding:40px 20px;text-align:center}.hero-svg{margin-bottom:20px;filter:drop-shadow(0 10px 15px rgba(255,106,136,.3))}.view-home h1{font-size:28px;margin:10px 0;color:var(--primary)}.view-home p{color:#636e72;margin-bottom:40px}.menu-grid{display:flex;flex-direction:column;gap:15px}.menu-btn{padding:18px;border:none;border-radius:16px;font-size:18px;font-weight:700;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:12px;transition:transform .2s}.menu-btn:active{transform:scale(.98)}.menu-btn.primary{background:linear-gradient(135deg,#6c63ff,#4834d4)}.menu-btn.accent{background:linear-gradient(135deg,#ff6584,#d63031)}.view-list{padding:20px}.riddle-grid{display:grid;grid-template-columns:1fr;gap:12px}.riddle-card{background:var(--bg);padding:20px;border-radius:12px;cursor:pointer;transition:.2s;border:2px solid transparent}.riddle-card:hover{border-color:var(--primary);background:#fff;box-shadow:0 5px 15px #0000000d}.card-idx{font-size:12px;color:var(--primary);font-weight:700;margin-bottom:5px}.card-footer{font-size:12px;color:#b2bec3;display:flex;align-items:center;justify-content:flex-end;margin-top:10px}.view-detail{padding:20px}.detail-card{background:#fff;padding:30px;border-radius:24px;box-shadow:0 10px 30px #00000014;margin:20px 0;text-align:center;min-height:300px;display:flex;flex-direction:column;justify-content:center}.q-tag{color:var(--accent);font-weight:700;font-size:14px;margin-bottom:10px}.hint-box{background:#fff9e6;padding:12px;border-radius:10px;color:#d4a017;font-size:14px;display:flex;align-items:center;gap:8px;margin:20px 0}.answer-box{margin-top:20px;min-height:60px}.reveal-btn{background:var(--primary);color:#fff;border:none;padding:12px 30px;border-radius:30px;font-weight:700;cursor:pointer}.answer-content{color:var(--success);font-size:24px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:10px;animation:pop .3s cubic-bezier(.175,.885,.32,1.275)}@keyframes pop{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.view-game{padding:20px;height:100%;display:flex;flex-direction:column}.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.game-score{font-size:24px;font-weight:700;color:var(--primary)}.game-q-card{background:#6c63ff;color:#fff;padding:40px 20px;border-radius:20px;text-align:center;font-size:20px;margin-bottom:30px}.options-grid{display:grid;grid-template-columns:1fr;gap:12px}.option-btn{padding:15px;background:#fff;border:2px solid #eee;border-radius:12px;font-size:16px;cursor:pointer;transition:.2s}.option-btn:hover{border-color:var(--primary);color:var(--primary)}.game-over{text-align:center;padding:40px 0}.final-score{font-size:80px;font-weight:900;color:var(--accent);margin:20px 0}.retry-btn{background:var(--primary);color:#fff;border:none;padding:15px 40px;border-radius:30px;font-size:18px;display:flex;align-items:center;gap:10px;margin:30px auto;cursor:pointer}.back-btn{background:none;border:none;color:#636e72;display:flex;align-items:center;gap:5px;cursor:pointer;padding:0;margin-bottom:20px}.nav-controls{display:flex;gap:10px;margin-top:20px}.nav-controls button{flex:1;padding:12px;border:1px solid #ddd;background:#fff;border-radius:10px;cursor:pointer}.nav-controls button:disabled{opacity:.3}.loading{height:100vh;display:flex;align-items:center;justify-content:center;color:var(--primary)}
