:root{color-scheme:light;--slate-900: #0f172a;--slate-800: #1e293b;--slate-700: #334155;--slate-600: #475569;--slate-500: #64748b;--slate-400: #94a3b8;--slate-300: #cbd5e1;--slate-200: #e2e8f0;--slate-100: #f1f5f9;--slate-50: #f8fafc;--blue-600: #2563eb;--blue-500: #3b82f6;--blue-50: #eff6ff;--green-600: #16a34a;--green-500: #22c55e;--green-100: #dcfce7;--green-50: #f0fdf4;--red-600: #dc2626;--red-100: #fee2e2;--red-50: #fef2f2;--surface: #ffffff;--radius: 16px;--radius-sm: 12px;--shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);--shadow-lg: 0 20px 60px rgba(15,23,42,.08), 0 4px 16px rgba(15,23,42,.04);--shadow-xl: 0 32px 80px rgba(15,23,42,.12);--ease-out-expo: cubic-bezier(.16, 1, .3, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1)}@keyframes fadeUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes staggerUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;color:var(--slate-900);background:var(--slate-50);-webkit-font-smoothing:antialiased}.page{height:100vh;overflow:hidden;display:flex;flex-direction:column}.container{max-width:960px;width:100%;margin:0 auto;padding:0 24px;flex:1;display:flex;flex-direction:column}.nav{padding:14px 0;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;animation:fadeIn .6s var(--ease-out-expo) both}.nav-brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.05rem;text-decoration:none;color:var(--slate-900)}.nav-mark{width:36px;height:36px;border-radius:10px;background:var(--slate-900);color:#fff;display:grid;place-items:center;font-weight:800;font-size:.85rem;letter-spacing:-.5px}.nav-links{display:flex;align-items:center;gap:8px}.nav-link{padding:8px 14px;border-radius:8px;font-size:.85rem;font-weight:500;color:var(--slate-600);text-decoration:none;transition:background .15s}.nav-link:hover{background:var(--slate-100);color:var(--slate-900)}.nav-link--primary{background:var(--slate-900);color:#fff}.nav-link--primary:hover{background:var(--slate-800);color:#fff}.hero{text-align:center;padding:20px 0 16px;flex-shrink:0}.hero-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:.75rem;font-weight:600;color:var(--slate-600);background:var(--surface);border:1px solid var(--slate-200);margin-bottom:12px;animation:fadeUp .5s .1s var(--ease-out-expo) both}.hero-badge:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green-500);animation:blink 2s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.hero h1{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;letter-spacing:-.03em;line-height:1.15;margin-bottom:8px;animation:fadeUp .6s .15s var(--ease-out-expo) both}.hero h1 span{color:var(--slate-500);font-weight:600}.hero-sub{font-size:.92rem;color:var(--slate-500);line-height:1.5;max-width:480px;margin:0 auto;animation:fadeUp .6s .25s var(--ease-out-expo) both}.stepper{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:16px;flex-shrink:0;animation:fadeUp .5s .3s var(--ease-out-expo) both}.stepper-step{display:flex;align-items:center;gap:6px;font-size:.78rem;font-weight:600;color:var(--slate-400);transition:color .4s var(--ease-out-expo)}.stepper-step.active{color:var(--slate-900)}.stepper-step.done{color:var(--green-600)}.stepper-num{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:.72rem;font-weight:700;background:var(--slate-100);color:var(--slate-400);transition:all .4s var(--ease-out-expo)}.stepper-step.active .stepper-num{background:var(--slate-900);color:#fff;box-shadow:0 2px 8px #0f172a40}.stepper-step.done .stepper-num{background:var(--green-100);color:var(--green-600)}.stepper-line{width:36px;height:2px;background:var(--slate-200);margin:0 8px;border-radius:1px;transition:background .5s var(--ease-out-expo)}.stepper-line.done{background:var(--green-500)}.card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--slate-200);box-shadow:var(--shadow-lg);overflow:hidden}.configure{padding:24px;max-width:480px;margin:0 auto;animation:slideUp .5s .35s var(--ease-out-expo) both}.configure h2{font-size:1rem;font-weight:700;margin-bottom:2px}.configure-sub{font-size:.82rem;color:var(--slate-500);margin-bottom:16px}.check-list{display:grid;gap:8px;margin-bottom:16px}.check-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;border-radius:var(--radius-sm);background:var(--slate-50);border:1px solid var(--slate-200);transition:border-color .25s,background .25s,box-shadow .25s,transform .2s;animation:staggerUp .4s var(--ease-out-expo) both}.check-item:nth-child(1){animation-delay:.4s}.check-item:nth-child(2){animation-delay:.48s}.check-item:nth-child(3){animation-delay:.56s}.check-item:has(input:checked){border-color:var(--blue-500);background:var(--blue-50);box-shadow:0 0 0 3px #2563eb14}.check-item:hover{transform:translateY(-1px)}.check-label{display:flex;align-items:center;gap:10px;font-weight:600;font-size:.85rem;cursor:pointer}.check-label input[type=checkbox]{width:18px;height:18px;accent-color:var(--blue-600);cursor:pointer}.check-tag{font-size:.72rem;font-weight:600;padding:4px 10px;border-radius:6px;background:var(--slate-200);color:var(--slate-600);white-space:nowrap}.check-item:has(input:checked) .check-tag{background:#2563eb1a;color:var(--blue-600)}.age-input{width:64px;padding:6px 10px;border-radius:8px;border:1px solid var(--slate-200);font-size:16px;font-weight:600;text-align:center;background:var(--surface)}.age-input:focus{outline:2px solid var(--blue-500);outline-offset:-1px;border-color:transparent}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;padding:11px 24px;border-radius:var(--radius-sm);font-weight:700;font-size:.88rem;cursor:pointer;transition:all .2s;width:100%}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.btn-start{background:var(--slate-900);color:#fff;box-shadow:0 4px 16px #0f172a33;animation:fadeUp .4s .6s var(--ease-out-expo) both}.btn-start:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px #0f172a4d}.btn-start:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 8px #0f172a33}.btn-outline{background:var(--surface);color:var(--slate-700);border:1px solid var(--slate-200);padding:12px 20px;font-weight:600;font-size:.85rem}.btn-outline:hover:not(:disabled){background:var(--slate-50);border-color:var(--slate-300)}.btn-group{display:flex;gap:10px}.btn-group .btn{flex:1}.error-msg{font-size:.85rem;color:var(--red-600);margin-bottom:16px;text-align:center}.scan-section{max-width:620px;margin:0 auto;animation:slideUp .5s var(--ease-out-expo) both}.scan-layout{display:grid;grid-template-columns:auto 1fr;gap:24px;padding:24px}.phone-frame{width:190px;background:var(--slate-900);border-radius:26px;padding:10px;box-shadow:var(--shadow-xl);position:relative;animation:slideInLeft .6s .1s var(--ease-out-expo) both}.phone-notch{width:60px;height:5px;background:var(--slate-700);border-radius:3px;margin:3px auto 8px}.phone-screen{background:#fff;border-radius:18px;padding:14px 10px;text-align:center;min-height:210px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.phone-screen img{width:140px;height:140px;border-radius:6px}.phone-label{font-size:.7rem;color:var(--slate-500);font-weight:600}.phone-pulse{position:absolute;top:-5px;right:-5px;bottom:-5px;left:-5px;border-radius:30px;border:2px solid rgba(37,99,235,.15);animation:pulse 2.5s ease-out infinite;pointer-events:none}@keyframes pulse{0%{transform:scale(1);opacity:.5}70%{transform:scale(1.03);opacity:0}to{transform:scale(1);opacity:0}}.scan-info{display:flex;flex-direction:column;justify-content:center;gap:14px;animation:slideInRight .6s .15s var(--ease-out-expo) both}.scan-info h2{font-size:1rem;font-weight:700}.scan-info p{font-size:.82rem;color:var(--slate-500);line-height:1.5}.scan-meta{display:grid;gap:6px}.meta-row{display:flex;align-items:center;justify-content:space-between;font-size:.8rem;padding:8px 12px;background:var(--slate-50);border-radius:8px}.meta-label{color:var(--slate-500);font-weight:500}.meta-value{font-weight:700;font-variant-numeric:tabular-nums}.status-dot{display:inline-flex;align-items:center;gap:6px}.status-dot:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--slate-400)}.status-dot.pending:before{background:#f59e0b;animation:blink 1.5s infinite}.status-dot.completed:before{background:var(--green-500)}.status-dot.failed:before{background:var(--red-600)}.simulate-section{padding:0 24px 20px;animation:fadeUp .5s .25s var(--ease-out-expo) both}.simulate-label{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--slate-400);margin-bottom:8px}.btn-pass{background:var(--green-50);color:var(--green-600);border:1px solid rgba(22,163,74,.15)}.btn-pass:hover:not(:disabled){background:var(--green-100)}.btn-fail{background:var(--red-50);color:var(--red-600);border:1px solid rgba(220,38,38,.15)}.btn-fail:hover:not(:disabled){background:var(--red-100)}.results-section{max-width:480px;margin:0 auto;animation:slideUp .5s var(--ease-out-expo) both}.results-card{padding:24px;text-align:center}.result-icon{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;margin:0 auto 10px;font-size:26px;animation:pop .6s .1s var(--ease-spring) both}.result-icon.success{background:var(--green-100);color:var(--green-600);box-shadow:0 0 0 6px #16a34a14}.result-icon.failure{background:var(--red-100);color:var(--red-600);box-shadow:0 0 0 6px #dc262614}@keyframes pop{0%{transform:scale(0);opacity:0}50%{transform:scale(1.15)}to{transform:scale(1);opacity:1}}.result-title{font-size:1.2rem;font-weight:800;margin-bottom:4px;animation:fadeUp .4s .2s var(--ease-out-expo) both}.result-subtitle{font-size:.82rem;color:var(--slate-500);margin-bottom:16px;animation:fadeUp .4s .25s var(--ease-out-expo) both}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--slate-200);border-radius:10px;overflow:hidden;margin-bottom:16px;animation:fadeUp .5s .3s var(--ease-out-expo) both}.stat{background:var(--slate-50);padding:12px 10px;text-align:center}.stat-value{font-size:1.1rem;font-weight:800;color:var(--slate-900)}.stat-label{font-size:.7rem;color:var(--slate-500);font-weight:500;margin-top:1px}.result-checks{display:grid;gap:6px;text-align:left;margin-bottom:16px;animation:fadeIn .3s .35s var(--ease-out-expo) both}.result-check-row{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--slate-50);border-radius:8px;font-size:.82rem;font-weight:600;animation:staggerUp .4s var(--ease-out-expo) both}.result-check-row:nth-child(1){animation-delay:.4s}.result-check-row:nth-child(2){animation-delay:.48s}.result-check-row:nth-child(3){animation-delay:.56s}.check-pass{color:var(--green-600);font-weight:700}.check-fail{color:var(--red-600);font-weight:700}.pitch{text-align:center;padding:20px 0 0;max-width:480px;margin:0 auto;animation:fadeUp .6s .5s var(--ease-out-expo) both}.pitch h3{font-size:1rem;font-weight:700;margin-bottom:6px}.pitch p{font-size:.82rem;color:var(--slate-500);margin-bottom:14px}.code-block{background:var(--slate-900);color:#e2e8f0;border-radius:10px;padding:14px 18px;font-family:SF Mono,Fira Code,monospace;font-size:.75rem;line-height:1.65;text-align:left;overflow-x:auto;margin-bottom:14px}.code-block .kw{color:#93c5fd}.code-block .fn{color:#60a5fa}.code-block .str{color:#6ee7b7}.code-block .cm{color:#64748b}.pitch-cta{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.pitch-cta .btn{width:auto;padding:10px 20px;font-size:.82rem}.footer{text-align:center;padding:16px 0 20px;font-size:.75rem;color:var(--slate-400);flex-shrink:0;margin-top:auto}.footer a{color:var(--blue-600);text-decoration:none;font-weight:500}.main-content{flex:1;display:flex;flex-direction:column;justify-content:center;min-height:0}@media (max-width: 640px){.page{height:auto;overflow:auto}.hero{padding:16px 0 12px}.scan-layout,.result-stats{grid-template-columns:1fr}.btn-group{flex-direction:column}.pitch-cta{flex-direction:column;align-items:center}.nav-links{display:none}}
