*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:root{--purple:#8b5cf6;--purple-light:#ede9fe;--blue:#3b82f6;--blue-light:#dbeafe;--pink:#ec4899;--pink-light:#fce7f3;--orange:#f97316;--orange-light:#ffedd5;--green:#10b981;--green-light:#d1fae5;--red:#ef4444;--red-light:#fee2e2;--white:#ffffff;--gray-50:#f8fafc;--gray-100:#f1f5f9;--gray-200:#e2e8f0;--gray-300:#cbd5e1;--gray-400:#94a3b8;--gray-500:#64748b;--gray-600:#475569;--gray-700:#334155;--gray-800:#1e293b;--gray-900:#0f172a;--bg:#fafaff;--text:var(--gray-900);--text-sub:var(--gray-500);--text-muted:var(--gray-400);--border:var(--gray-200);--r-sm:10px;--r-md:14px;--r-lg:20px;--r-xl:24px;--r-full:9999px;--shadow-xs:0 1px 2px rgba(0,0,0,0.04);--shadow-sm:0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04);--shadow-md:0 4px 12px rgba(0,0,0,0.06),0 1px 3px rgba(0,0,0,0.04);--shadow-lg:0 8px 30px rgba(0,0,0,0.08),0 2px 8px rgba(0,0,0,0.04);--shadow-color:0 4px 20px rgba(139,92,246,0.12),0 1px 4px rgba(139,92,246,0.06);--ease:cubic-bezier(0.4,0,0.2,1);--transition:0.25s var(--ease)}html{scroll-behavior:smooth}body{font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}
.bg-decor{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}.blob{position:absolute;border-radius:50%;filter:blur(100px);opacity:.35;animation:blobFloat 25s ease-in-out infinite}.blob-1{width:500px;height:500px;background:radial-gradient(circle,var(--purple),transparent 70%);top:-8%;left:-5%;animation-duration:22s}.blob-2{width:450px;height:450px;background:radial-gradient(circle,var(--pink),transparent 70%);top:30%;right:-10%;animation-duration:28s;animation-delay:-6s}.blob-3{width:400px;height:400px;background:radial-gradient(circle,var(--blue),transparent 70%);bottom:5%;left:10%;animation-duration:24s;animation-delay:-12s}.blob-4{width:350px;height:350px;background:radial-gradient(circle,var(--orange),transparent 70%);top:60%;left:50%;opacity:.2;animation-duration:30s;animation-delay:-18s}@keyframes blobFloat{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(30px,-30px) scale(1.05)}50%{transform:translate(-20px,20px) scale(.95)}75%{transform:translate(15px,10px) scale(1.02)}}
.navbar{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.75);backdrop-filter:blur(16px) saturate(1.6);-webkit-backdrop-filter:blur(16px) saturate(1.6);border-bottom:1px solid rgba(226,232,240,.6)}.nav-inner{max-width:880px;margin:0 auto;padding:0 1.5rem;height:62px;display:flex;align-items:center;justify-content:space-between}.nav-brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--text)}.brand-icon{width:38px;height:38px;display:grid;place-items:center;background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;font-weight:800;font-size:1rem;border-radius:var(--r-sm);letter-spacing:-.02em;box-shadow:0 2px 8px rgba(139,92,246,.25)}.brand-name{font-size:1.125rem;font-weight:700}.brand-sub{font-weight:400;color:var(--text-sub)}.nav-pill{display:flex;align-items:center;gap:.5rem;padding:.35rem .85rem;font-size:.7rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--purple);background:var(--purple-light);border:1px solid rgba(139,92,246,.15);border-radius:var(--r-full)}.nav-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 2px rgba(16,185,129,.25);animation:dotPulse 2s ease infinite}@keyframes dotPulse{0%,100%{box-shadow:0 0 0 2px rgba(16,185,129,.25)}50%{box-shadow:0 0 0 5px rgba(16,185,129,0)}}
.container{position:relative;z-index:1;max-width:880px;margin:0 auto;padding:0 1.5rem 5rem}
.hero{text-align:center;padding:3.5rem 0 2.5rem}.hero-badge{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem 1rem .375rem .7rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--purple);background:linear-gradient(135deg,var(--purple-light),var(--pink-light));border:1px solid rgba(139,92,246,.12);border-radius:var(--r-full);margin-bottom:1.25rem}.hero-title{font-size:clamp(2rem,5vw,3rem);font-weight:800;line-height:1.15;letter-spacing:-.03em;margin-bottom:1rem}.gradient-text{background:linear-gradient(135deg,var(--purple),var(--pink),var(--orange));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-sub{max-width:620px;margin:0 auto 2rem;font-size:1.0625rem;color:var(--text-sub);line-height:1.7}
.audience-tabs{display:inline-flex;gap:.5rem;padding:.3rem;background:var(--gray-100);border:1px solid var(--border);border-radius:var(--r-full);margin-bottom:2rem}.audience-tab{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1.125rem;font-size:.8125rem;font-weight:600;color:var(--text-sub);border-radius:var(--r-full);cursor:pointer;transition:all .25s var(--ease);user-select:none}.audience-tab:hover{color:var(--text)}.audience-tab.active{color:var(--white);background:linear-gradient(135deg,var(--purple),var(--pink));box-shadow:0 2px 8px rgba(139,92,246,.25)}.audience-tab.active svg{stroke:#fff}
.hero-features{display:grid;grid-template-columns:repeat(4,1fr);gap:.875rem;max-width:680px;margin:0 auto}.hf-item{display:flex;align-items:center;gap:.625rem;padding:.75rem;background:var(--white);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-xs);text-align:left}.hf-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:var(--r-sm);flex-shrink:0}.hf-icon--purple{background:var(--purple-light);color:var(--purple)}.hf-icon--blue{background:var(--blue-light);color:var(--blue)}.hf-icon--pink{background:var(--pink-light);color:var(--pink)}.hf-icon--orange{background:var(--orange-light);color:var(--orange)}.hf-item strong{display:block;font-size:.8125rem;font-weight:700;color:var(--text)}.hf-item span{font-size:.6875rem;color:var(--text-muted)}
.card{position:relative;background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);padding:2.25rem;box-shadow:var(--shadow-md);overflow:hidden}.card-top-gradient{position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--purple),var(--pink),var(--orange),var(--blue));border-radius:var(--r-xl) var(--r-xl) 0 0}.card-top-gradient--red{background:linear-gradient(90deg,var(--red),var(--orange))}.card-header{margin-bottom:1.75rem}.card-header h2{font-size:1.375rem;font-weight:700;margin-bottom:.25rem}.card-header p{color:var(--text-sub);font-size:.9375rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}.form-group{margin-bottom:1.375rem}.form-group label{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;font-weight:600;color:var(--gray-700);margin-bottom:.5rem}.label-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.label-dot--purple{background:var(--purple)}.label-dot--blue{background:var(--blue)}.label-dot--pink{background:var(--pink)}.label-dot--orange{background:var(--orange)}
input[type="text"],input[type="url"],textarea{width:100%;padding:.75rem 1rem;font-size:.9375rem;font-family:inherit;color:var(--text);background:var(--gray-50);border:1.5px solid var(--border);border-radius:var(--r-sm);outline:none;transition:border-color var(--transition),box-shadow var(--transition),background var(--transition)}input:hover,textarea:hover{border-color:var(--gray-300)}input:focus,textarea:focus{background:var(--white);border-color:var(--purple);box-shadow:0 0 0 3px rgba(139,92,246,.1)}input::placeholder,textarea::placeholder{color:var(--text-muted)}textarea{resize:vertical;min-height:140px;line-height:1.65}.textarea-meta{display:flex;justify-content:space-between;align-items:flex-start;margin-top:.35rem}.char-count{font-size:.75rem;color:var(--text-muted);font-family:'JetBrains Mono',monospace;white-space:nowrap;margin-left:auto}.err{font-size:.8125rem;color:var(--red);min-height:0;display:block;margin-top:.3rem}input.invalid,textarea.invalid{border-color:var(--red)}input.invalid:focus,textarea.invalid:focus{box-shadow:0 0 0 3px rgba(239,68,68,.1)}
.dropzone{border:2px dashed var(--border);border-radius:var(--r-md);cursor:pointer;transition:border-color var(--transition),background var(--transition);overflow:hidden}.dropzone:hover,.dropzone.dragover{border-color:var(--purple);background:rgba(139,92,246,.03)}.dropzone.invalid{border-color:var(--red)}.dropzone-idle{display:flex;flex-direction:column;align-items:center;padding:1.75rem;text-align:center}.dropzone-icon{width:52px;height:52px;display:grid;place-items:center;background:linear-gradient(135deg,var(--purple-light),var(--blue-light));border:1px solid rgba(139,92,246,.1);border-radius:var(--r-md);color:var(--purple);margin-bottom:.75rem;transition:transform var(--transition)}.dropzone:hover .dropzone-icon{transform:translateY(-2px)}.dropzone-idle p{font-size:.9375rem;color:var(--text-sub)}.dropzone-link{color:var(--purple);font-weight:600;text-decoration:underline;text-underline-offset:2px;text-decoration-color:rgba(139,92,246,.3)}.dropzone-idle small{font-size:.75rem;color:var(--text-muted);margin-top:.25rem}
.dropzone-file{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;background:linear-gradient(135deg,rgba(139,92,246,.04),rgba(236,72,153,.04))}.file-badge{width:40px;height:40px;display:grid;place-items:center;background:linear-gradient(135deg,var(--purple),var(--pink));border-radius:var(--r-sm);color:#fff;flex-shrink:0}.file-meta{flex:1;min-width:0;display:flex;flex-direction:column}.file-name{font-size:.875rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-size{font-size:.75rem;color:var(--text-muted);font-family:'JetBrains Mono',monospace}.file-rm{width:30px;height:30px;display:grid;place-items:center;background:none;border:1px solid transparent;border-radius:6px;color:var(--text-muted);cursor:pointer;transition:all var(--transition);flex-shrink:0}.file-rm:hover{color:var(--red);background:var(--red-light);border-color:rgba(239,68,68,.15)}
.btn-submit{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;width:100%;height:52px;margin-top:.25rem;font-size:.9375rem;font-weight:700;font-family:inherit;color:#fff;background:linear-gradient(135deg,var(--purple),var(--pink),var(--orange));background-size:200% 200%;animation:gradShift 5s ease infinite;border:none;border-radius:var(--r-md);cursor:pointer;box-shadow:0 2px 12px rgba(139,92,246,.25);transition:transform var(--transition),box-shadow var(--transition)}.btn-submit:hover{box-shadow:0 4px 20px rgba(139,92,246,.35);transform:translateY(-1px)}.btn-submit:active{transform:translateY(0) scale(.985)}.btn-submit:disabled{opacity:.55;cursor:not-allowed;transform:none}.btn-submit--small{width:auto;padding:0 1.75rem;height:46px}@keyframes gradShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.loading-section{padding-top:1.5rem}.loading-card{text-align:center;padding:3rem 2rem}.loading-anim{margin-bottom:1.5rem}.ring-loader{position:relative;width:88px;height:88px;margin:0 auto}.ring-loader svg{width:100%;height:100%}.ring-spin{transform-origin:center;animation:ringRotate 1.4s linear infinite}@keyframes ringRotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.ring-center{position:absolute;inset:0;display:grid;place-items:center}.loading-title{font-size:1.25rem;font-weight:700;margin-bottom:.4rem}.loading-sub{color:var(--text-sub);font-size:.9375rem;margin-bottom:2.5rem}
.steps{display:flex;flex-direction:column;align-items:flex-start;max-width:300px;margin:0 auto;text-align:left}.step{display:flex;align-items:center;gap:.75rem;padding:.375rem 0;font-size:.875rem;color:var(--text-muted);transition:color .4s}.step.active{color:var(--purple);font-weight:500}.step.done{color:var(--green)}.step-icon{width:22px;height:22px;display:grid;place-items:center;flex-shrink:0;position:relative}.step-dot{width:8px;height:8px;border-radius:50%;background:var(--gray-300);transition:all .4s}.step.active .step-dot{background:var(--purple);box-shadow:0 0 0 4px rgba(139,92,246,.15);animation:stepPulse 1.5s ease infinite}.step.done .step-dot{opacity:0;transform:scale(0)}@keyframes stepPulse{0%,100%{box-shadow:0 0 0 4px rgba(139,92,246,.15)}50%{box-shadow:0 0 0 8px rgba(139,92,246,0)}}.step-check{position:absolute;opacity:0;transform:scale(0);transition:all .3s;color:var(--green)}.step.done .step-check{opacity:1;transform:scale(1)}.step-line{width:2px;height:12px;margin-left:10px;background:var(--gray-200);border-radius:2px;transition:background .4s}.step-line.done{background:var(--green)}.loading-tip{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:2rem;padding:.625rem 1rem;font-size:.8125rem;color:var(--text-sub);background:var(--gray-50);border:1px solid var(--border);border-radius:var(--r-full)}
.result-section{padding-top:1.5rem;animation:fadeUp .5s var(--ease)}@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.result-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}.result-head-left{display:flex;align-items:center;gap:.875rem}.result-icon{width:46px;height:46px;display:grid;place-items:center;background:linear-gradient(135deg,var(--green-light),rgba(52,211,153,.15));border:1px solid rgba(16,185,129,.2);border-radius:var(--r-md);color:var(--green)}.result-head h2{font-size:1.25rem;font-weight:700}.result-head p{font-size:.8125rem;color:var(--text-sub)}.btn-outline{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.8125rem;font-weight:600;font-family:inherit;color:var(--text-sub);background:var(--white);border:1px solid var(--border);border-radius:var(--r-sm);cursor:pointer;transition:all var(--transition)}.btn-outline:hover{color:var(--purple);border-color:var(--purple);background:var(--purple-light)}
.score-card{display:flex;align-items:center;gap:2rem;padding:2rem 2.5rem;background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-color);margin-bottom:1.25rem}.score-ring-wrap{position:relative;width:140px;height:140px;flex-shrink:0}.score-ring{width:100%;height:100%;transform:rotate(-90deg)}.score-fill{transition:stroke-dashoffset 1.5s var(--ease),stroke .5s}.score-value{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.score-num{font-size:2.5rem;font-weight:800;line-height:1;letter-spacing:-.03em;font-family:'JetBrains Mono',monospace}.score-label{font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-top:.25rem}.score-detail{flex:1}.score-detail h3{font-size:1.125rem;font-weight:700;margin-bottom:.5rem}.score-detail p{color:var(--text-sub);font-size:.9375rem;line-height:1.7}.score-recommendation{display:inline-flex;align-items:center;gap:.5rem;margin-top:.875rem;padding:.5rem 1rem;font-size:.8125rem;font-weight:600;border-radius:var(--r-sm)}.score-recommendation.rec-green{color:#065f46;background:var(--green-light);border:1px solid rgba(16,185,129,.2)}.score-recommendation.rec-yellow{color:#92400e;background:var(--orange-light);border:1px solid rgba(245,158,11,.2)}.score-recommendation.rec-red{color:#991b1b;background:var(--red-light);border:1px solid rgba(239,68,68,.2)}
.result-card{margin-bottom:1.25rem}.rc-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem}.rc-header h3{font-size:1.0625rem;font-weight:700;flex:1}.rc-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:var(--r-sm);flex-shrink:0}.rc-icon--pink{background:var(--pink-light);color:var(--pink)}.rc-icon--blue{background:var(--blue-light);color:var(--blue)}.rc-icon--orange{background:var(--orange-light);color:var(--orange)}.rc-icon--purple{background:var(--purple-light);color:var(--purple)}.rc-subtitle{font-size:.875rem;color:var(--text-muted);margin-bottom:1rem;padding-left:calc(38px + .75rem)}.rc-body{font-size:.9375rem;line-height:1.75;color:var(--gray-600)}.rc-body p{margin-bottom:.625rem}.rc-body strong{color:var(--text);font-weight:600}.rc-body ul,.rc-body ol{margin:.5rem 0 .75rem 1.25rem}.rc-body li{margin-bottom:.35rem}
.cover-text{white-space:pre-wrap;font-size:.9375rem;line-height:1.8;background:var(--gray-50);border:1px solid var(--border);border-radius:var(--r-md);padding:1.5rem}.btn-copy{display:inline-flex;align-items:center;gap:.375rem;margin-left:auto;padding:.375rem .75rem;font-size:.75rem;font-weight:600;font-family:inherit;color:var(--text-sub);background:var(--gray-50);border:1px solid var(--border);border-radius:6px;cursor:pointer;transition:all var(--transition)}.btn-copy:hover{color:var(--purple);border-color:var(--purple);background:var(--purple-light)}.btn-copy.copied{color:var(--green);border-color:var(--green);background:var(--green-light)}
.email-notice{display:flex;align-items:center;justify-content:center;gap:.625rem;margin-top:.75rem;padding:.875rem 1.25rem;background:linear-gradient(135deg,var(--purple-light),var(--blue-light));border:1px solid rgba(139,92,246,.12);border-radius:var(--r-md);font-size:.875rem;color:var(--gray-700)}.email-notice svg{color:var(--purple);flex-shrink:0}
.error-section{padding-top:1.5rem}.error-card{text-align:center;padding:3rem 2rem}.error-ring{width:70px;height:70px;display:grid;place-items:center;margin:0 auto 1.25rem;background:var(--red-light);border:1px solid rgba(239,68,68,.15);border-radius:50%;color:var(--red)}.error-card h2{font-size:1.25rem;margin-bottom:.5rem}.error-card p{color:var(--text-sub);margin-bottom:1.5rem;max-width:400px;margin-left:auto;margin-right:auto}
.footer{position:relative;z-index:1;text-align:center;padding:1.75rem 1.5rem;font-size:.8125rem;color:var(--text-muted)}.footer strong{color:var(--text-sub)}
@media(max-width:700px){.container{padding:0 1rem 4rem}.hero{padding:2.5rem 0 2rem}.hero-title{font-size:1.75rem}.hero-features{grid-template-columns:1fr 1fr;gap:.625rem}.card{padding:1.5rem;border-radius:var(--r-lg)}.form-row{grid-template-columns:1fr;gap:0}.score-card{flex-direction:column;text-align:center;padding:2rem 1.5rem;gap:1.25rem}.result-head{flex-direction:column;align-items:flex-start}}@media(max-width:420px){.hero-features{grid-template-columns:1fr}.hf-item{gap:.5rem;padding:.625rem}}