:root{--bg:#0f0e0c;--bg2:#181714;--bg3:#211f1b;--card:#1c1a16;--border:#2e2b24;--accent:#c8a96e;--accent2:#e8c98a;--text:#ede8df;--muted:#8a8070;--danger:#d97070;--info:#6e9ec8;--success:#6ec87a;--warn:#c8a96e;--female:#c86e9e;--male:#6e9ec8;--both:#9e6ec8}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:DM Sans,sans-serif;line-height:1.7}header{border-bottom:1px solid var(--border);text-align:center;background:linear-gradient(135deg,#1a1710 0%,#0f0e0c 60%);padding:48px 24px 40px;position:relative;overflow:hidden}header:before{content:"";pointer-events:none;background:radial-gradient(#c8a96e1f 0%,#0000 70%);width:600px;height:300px;position:absolute;top:-80px;left:50%;transform:translate(-50%)}.badge{color:var(--accent);letter-spacing:2px;text-transform:uppercase;background:#c8a96e1f;border:1px solid #c8a96e4d;border-radius:2px;margin-bottom:20px;padding:5px 14px;font-family:DM Mono,monospace;font-size:11px;display:inline-block}h1{color:var(--accent2);margin-bottom:14px;font-family:Playfair Display,serif;font-size:clamp(28px,5vw,52px);font-weight:700;line-height:1.15}header p{color:var(--muted);max-width:540px;margin:0 auto;font-size:15px;font-weight:300}nav{background:var(--bg2);border-bottom:1px solid var(--border);scrollbar-width:none;gap:4px;padding:16px 24px;display:flex;overflow-x:auto}nav::-webkit-scrollbar{display:none}.tab{cursor:pointer;color:var(--muted);background:0 0;border:1px solid #0000;border-radius:4px;flex-shrink:0;padding:8px 18px;font-size:13px;font-weight:500;transition:all .2s}.tab:hover{color:var(--text);background:var(--bg3)}.tab.active{color:var(--accent);background:#c8a96e26;border-color:#c8a96e4d}main{max-width:960px;margin:0 auto;padding:32px 24px 80px}.section{display:none}.section.active{display:block}.card{background:var(--card);border:1px solid var(--border);border-radius:8px;margin-bottom:16px;padding:24px;transition:border-color .2s}.card:hover{border-color:#3e3a30}.card-header{align-items:flex-start;gap:16px;margin-bottom:16px;display:flex}.icon-box{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:20px;display:flex}.icon-box.male{background:#6e9ec826}.icon-box.female{background:#c86e9e26}.icon-box.both{background:#9e6ec826}.icon-box.danger{background:#d9707026}.icon-box.warn{background:#c8a96e26}.card-title{color:var(--text);margin-bottom:4px;font-family:Playfair Display,serif;font-size:18px;font-weight:600}.card-sub{color:var(--muted);font-family:DM Mono,monospace;font-size:12px}.pill{letter-spacing:.5px;border-radius:20px;margin-bottom:6px;margin-right:6px;padding:3px 10px;font-size:11px;font-weight:500;display:inline-block}.pill.male{color:var(--male);background:#6e9ec833;border:1px solid #6e9ec84d}.pill.female{color:var(--female);background:#c86e9e33;border:1px solid #c86e9e4d}.pill.both{color:var(--both);background:#9e6ec833;border:1px solid #9e6ec84d}.pill.reversible{color:var(--success);background:#6ec87a26;border:1px solid #6ec87a4d}.pill.irreversible{color:var(--danger);background:#d9707026;border:1px solid #d970704d}.pill.partial{color:var(--warn);background:#c8a96e26;border:1px solid #c8a96e4d}.expand-btn{text-align:left;width:100%;color:var(--accent);cursor:pointer;border:none;border-top:1px solid var(--border);background:0 0;align-items:center;gap:6px;margin-top:12px;padding:8px 0 0;font-family:DM Sans,sans-serif;font-size:13px;font-weight:500;display:flex}.expand-content{padding-top:16px;display:none}.expand-content.open{display:block}.info-grid{grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;display:grid}@media (width<=600px){.info-grid{grid-template-columns:1fr}}.info-item{background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:12px 14px}.info-label{text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:4px;font-family:DM Mono,monospace;font-size:10px}.info-value{color:var(--text);font-size:14px}.anatomy-visual{background:var(--bg3);border:1px solid var(--border);text-align:center;border-radius:8px;margin-bottom:24px;padding:28px}.hair-cycle{flex-wrap:wrap;justify-content:center;align-items:center;gap:0;margin:20px 0;display:flex}.cycle-phase{text-align:center;padding:16px 12px;position:relative}.cycle-circle{border-radius:50%;justify-content:center;align-items:center;width:70px;height:70px;margin:0 auto 10px;font-size:28px;display:flex;position:relative}.cycle-circle.anagen{background:#6ec87a33;border:2px solid #6ec87a66}.cycle-circle.catagen{background:#c8a96e33;border:2px solid #c8a96e66}.cycle-circle.telogen{background:#d9707033;border:2px solid #d9707066}.cycle-circle.exogen{background:#6e9ec833;border:2px solid #6e9ec866}.cycle-name{color:var(--text);font-size:13px;font-weight:600}.cycle-desc{color:var(--muted);margin-top:2px;font-size:11px}.cycle-arrow{color:var(--border);align-self:center;margin:-10px 0 20px;font-size:20px}.section-title{color:var(--accent2);margin-bottom:8px;font-family:Playfair Display,serif;font-size:22px;font-weight:600}.section-desc{color:var(--muted);margin-bottom:24px;font-size:14px;line-height:1.6}.stats-row{grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:28px;display:grid}@media (width<=600px){.stats-row{grid-template-columns:1fr}}.stat-box{background:var(--bg3);border:1px solid var(--border);text-align:center;border-radius:8px;padding:18px}.stat-num{color:var(--accent);font-family:Playfair Display,serif;font-size:32px;font-weight:700;line-height:1}.stat-label{color:var(--muted);margin-top:6px;font-size:12px}.severity-bar{background:linear-gradient(90deg, var(--success), var(--warn), var(--danger));border-radius:3px;height:6px;margin:8px 0;position:relative}.severity-dot{border:2px solid var(--bg);background:#fff;border-radius:50%;width:14px;height:14px;position:absolute;top:-4px;transform:translate(-50%)}.callout{border-left:3px solid var(--accent);color:var(--text);background:#c8a96e0f;border-radius:0 6px 6px 0;margin:16px 0;padding:14px 18px;font-size:14px}.callout.info{border-color:var(--info);background:#6e9ec80f}.callout.danger{border-color:var(--danger);background:#d970700f}.compare-table{border-collapse:collapse;width:100%;margin-top:12px;font-size:13px}.compare-table th{background:var(--bg3);text-align:left;text-transform:uppercase;letter-spacing:1px;color:var(--muted);border-bottom:1px solid var(--border);padding:10px 14px;font-family:DM Mono,monospace;font-size:11px}.compare-table td{border-bottom:1px solid var(--border);vertical-align:top;padding:12px 14px}.compare-table tr:last-child td{border-bottom:none}.compare-table tr:hover td{background:#ffffff05}.footer-note{background:var(--bg3);border:1px solid var(--border);color:var(--muted);text-align:center;border-radius:8px;margin-top:48px;padding:20px;font-size:12px}.footer-note strong{color:var(--text)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg2)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.sc-answer-btn{text-align:left;background:var(--bg3);border:1px solid var(--border);width:100%;color:var(--text);cursor:pointer;border-radius:6px;align-items:center;gap:12px;padding:14px 18px;font-family:DM Sans,sans-serif;font-size:14px;transition:all .18s;display:flex}.sc-answer-btn:hover{border-color:var(--accent);color:var(--accent2);background:#c8a96e14}.sc-answer-btn .ans-icon{border:1px solid var(--border);width:28px;height:28px;color:var(--muted);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-family:DM Mono,monospace;font-size:12px;display:flex}.result-card{background:var(--card);border:1px solid var(--border);border-radius:8px;margin-bottom:16px;padding:28px}.result-title{margin-bottom:8px;font-family:Playfair Display,serif;font-size:24px;font-weight:700}.result-badge{border-radius:20px;margin-bottom:16px;padding:4px 14px;font-size:12px;font-weight:600;display:inline-block}.result-section{background:var(--bg3);border:1px solid var(--border);border-radius:6px;margin-bottom:12px;padding:16px 18px}.result-section-title{text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);margin-bottom:10px;font-family:DM Mono,monospace;font-size:10px}.result-item{align-items:flex-start;gap:10px;margin-bottom:8px;font-size:14px;display:flex}.result-item:last-child{margin-bottom:0}.next-step-card{border:1px solid;border-radius:8px;align-items:flex-start;gap:14px;margin-bottom:10px;padding:18px 20px;display:flex}.step-num{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-family:DM Mono,monospace;font-size:12px;font-weight:700;display:flex}