:root{--cream:#faf6f0;--warm:#f4ede3;--card:#ffffff;--border:#e8ddd4;--brown:#6b4f3a;--dark:#2c1a0e;--accent:#c47d3e;--accent2:#9b6b8a;--muted:#a08878;--radius:18px}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--cream);color:var(--dark);font-family:'DM Sans',sans-serif;min-height:100vh;background-image:radial-gradient(ellipse at 10% 20%,rgb(196 125 62 / .07) 0%,transparent 50%),radial-gradient(ellipse at 90% 80%,rgb(155 107 138 / .06) 0%,transparent 50%)}.container{max-width:660px;margin:0 auto;padding:40px 20px 80px}#cover{text-align:center;padding:64px 20px 48px;animation:fadeUp 0.8s ease both}.cover-badge{display:inline-block;font-size:11px;font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent);border-radius:30px;padding:6px 20px;margin-bottom:32px}#cover h1{font-family:'Playfair Display',serif;font-size:clamp(2.4rem, 7vw, 3.6rem);line-height:1.2;color:var(--dark);margin-bottom:10px}#cover h1 em{color:var(--accent);font-style:italic}#cover p{font-size:14.5px;color:var(--brown);line-height:1.75;max-width:420px;margin:0 auto 36px;font-weight:300}#cover p strong{color:var(--dark);font-weight:500}.cover-features{display:flex;justify-content:center;gap:36px;margin-bottom:40px;flex-wrap:wrap}.feat-num{font-family:'Playfair Display',serif;font-size:30px;font-weight:700;color:var(--accent);line-height:1}.feat-label{font-size:11px;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase;margin-top:4px}.btn-start{display:inline-block;background:var(--dark);color:var(--cream);font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;letter-spacing:2px;padding:16px 52px;border-radius:50px;border:none;cursor:pointer;text-transform:uppercase;transition:all 0.3s ease}.btn-start:hover{background:var(--accent);transform:translateY(-2px);box-shadow:0 12px 30px rgb(196 125 62 / .25)}.cover-note{margin-top:18px;font-size:12px;color:var(--muted)}#quiz{display:none}.prog-wrap{margin-bottom:28px;animation:fadeUp 0.5s ease both}.prog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.prog-section{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);font-weight:500}.prog-num{font-family:'Playfair Display',serif;font-size:15px;color:var(--muted)}.prog-track{height:4px;background:var(--border);border-radius:4px;overflow:hidden}.prog-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:4px;transition:width 0.5s cubic-bezier(.22,1,.36,1);width:0%}.q-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:36px 32px 28px;margin-bottom:16px;box-shadow:0 4px 24px rgb(44 26 14 / .06)}.q-num-label{font-size:11px;letter-spacing:2.5px;color:var(--accent);text-transform:uppercase;font-weight:500;margin-bottom:12px}.q-text{font-family:'Playfair Display',serif;font-size:18px;line-height:1.6;color:var(--dark);margin-bottom:28px}.ab-wrap{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px}.ab-box{background:var(--warm);border:1px solid var(--border);border-radius:12px;padding:14px 16px}.ab-label{font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:6px}.ab-text{font-size:13px;color:var(--brown);line-height:1.5;font-weight:300}.scale-wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.scale-btn{background:var(--warm);border:1.5px solid var(--border);border-radius:12px;padding:14px 6px 12px;cursor:pointer;text-align:center;transition:all 0.22s ease;display:flex;flex-direction:column;align-items:center;gap:8px}.scale-btn:hover{border-color:var(--accent);background:#fff8f2}.scale-btn.selected{border-color:var(--accent);background:#fff8f2;box-shadow:0 2px 12px rgb(196 125 62 / .12)}.scale-dot{width:10px;height:10px;border-radius:50%;border:2px solid var(--border);transition:all 0.22s ease;flex-shrink:0}.scale-btn:hover .scale-dot,.scale-btn.selected .scale-dot{background:var(--accent);border-color:var(--accent)}.scale-text{font-size:11.5px;color:var(--brown);line-height:1.4;font-weight:300}.scale-btn.selected .scale-text{color:var(--accent);font-weight:500}.nav-row{display:flex;justify-content:space-between;align-items:center;margin-top:8px}.btn-nav{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;padding:12px 28px;border-radius:50px;border:none;cursor:pointer;transition:all 0.22s ease}.btn-prev{background:#fff0;color:var(--brown);border:1px solid var(--border)}.btn-prev:hover:not(:disabled){border-color:var(--brown)}.btn-prev:disabled{opacity:.3;cursor:not-allowed}.btn-next{background:var(--dark);color:var(--cream);font-weight:500}.btn-next:hover:not(:disabled){background:var(--accent);box-shadow:0 8px 20px rgb(196 125 62 / .22)}.btn-next:disabled{opacity:.3;cursor:not-allowed}#result{display:none;animation:fadeUp 0.8s ease both}.result-header{text-align:center;padding:52px 20px 36px}.result-eyebrow{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--accent2);margin-bottom:20px}.result-type{font-family:'Playfair Display',serif;font-size:clamp(4rem, 14vw, 6.5rem);font-weight:700;letter-spacing:8px;line-height:1;color:var(--dark);margin-bottom:14px}.result-name{font-family:'Playfair Display',serif;font-size:20px;font-style:italic;color:var(--accent);margin-bottom:12px}.result-tagline{font-size:14px;color:var(--brown);line-height:1.7;max-width:420px;margin:0 auto;font-weight:300}.divider{width:50px;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);margin:32px auto}.dims-wrap{display:flex;flex-direction:column;gap:14px}.dim-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px 28px;box-shadow:0 2px 12px rgb(44 26 14 / .04)}.dim-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}.dim-letters{display:flex;align-items:center;gap:10px;margin-bottom:4px}.dim-L{font-family:'Playfair Display',serif;font-size:30px;font-weight:700;line-height:1}.dim-L.win{color:var(--dark)}.dim-L.lose{color:var(--border)}.dim-vs{font-size:11px;color:var(--muted)}.dim-wordname{font-size:12px;font-weight:500;color:var(--brown);letter-spacing:.5px}.dim-right{text-align:right}.dim-pct{font-family:'Playfair Display',serif;font-size:30px;font-weight:700;color:var(--accent);line-height:1}.dim-tendency{font-size:11px;color:var(--muted);margin-top:4px;font-weight:300}.dim-bar-track{height:6px;background:var(--warm);border-radius:6px;overflow:hidden;margin-bottom:14px}.dim-bar-fill{height:100%;border-radius:6px;transition:width 1.3s cubic-bezier(.22,1,.36,1);width:0%}.fill-EI{background:linear-gradient(90deg,#c47d3e,#d4976a)}.fill-SN{background:linear-gradient(90deg,#9b6b8a,#b88aaa)}.fill-TF{background:linear-gradient(90deg,#6a8f7a,#8ab09a)}.fill-JP{background:linear-gradient(90deg,#7a8fa0,#9aaabb)}.dim-desc{font-size:13px;color:var(--brown);line-height:1.65;font-weight:300;border-top:1px solid var(--border);padding-top:14px}.dim-desc strong{color:var(--dark);font-weight:500}.result-footer{text-align:center;padding:32px 0 8px;display:flex;flex-direction:column;align-items:center;gap:12px}.btn-cta{display:inline-block;background:var(--accent);color:#fff;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:500;padding:16px 40px;border-radius:50px;border:none;cursor:pointer;text-decoration:none;transition:all 0.3s ease;letter-spacing:.3px}.btn-cta:hover{background:var(--dark);box-shadow:0 10px 28px rgb(44 26 14 / .18);transform:translateY(-2px)}.btn-retake{background:#fff0;color:var(--muted);font-family:'DM Sans',sans-serif;font-size:13px;padding:10px 28px;border-radius:50px;border:1px solid var(--border);cursor:pointer;transition:all 0.22s ease}.btn-retake:hover{border-color:var(--accent);color:var(--accent)}@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@media (max-width:480px){.q-card{padding:24px 18px 20px}.q-text{font-size:16px}.ab-wrap{grid-template-columns:1fr}.scale-text{font-size:10.5px}.dim-card{padding:20px 18px}.cover-features{gap:22px}.btn-cta{font-size:13px;padding:14px 28px}}.btn-home{display:inline-block;background:#fff0;color:var(--brown);font-family:'DM Sans',sans-serif;font-size:13px;font-weight:400;padding:10px 28px;border-radius:50px;border:1px solid var(--border);cursor:pointer;text-decoration:none;transition:all 0.22s ease}.btn-home:hover{border-color:var(--accent);color:var(--accent)}