.screen{flex-direction:column;flex:1;display:none}.screen.on{animation:.3s fade;display:flex}@keyframes fade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.intro{text-align:center;justify-content:center;gap:16px;padding:8px 2px}.intro h1{font-family:var(--serif);letter-spacing:-.5px;text-wrap:balance;font-size:clamp(30px,8.5vw,42px);font-weight:600;line-height:1.06}.intro .sub{color:var(--dim);max-width:32ch;margin:0 auto;font-size:15px;line-height:1.55}.friend{border:1px solid var(--line);border-radius:999px;align-items:center;gap:8px;padding:8px 16px;font-size:14px;font-weight:700;display:inline-flex}.friend .fdot{border-radius:50%;width:12px;height:12px}.quiz{gap:18px;padding-top:4px}.qbar{align-items:center;gap:12px;display:flex}.back{background:var(--panel);color:var(--ink);cursor:pointer;border:1px solid var(--line);border-radius:50%;flex:none;width:38px;height:38px;font-size:18px}.progress{background:var(--panel);border-radius:999px;flex:1;height:6px;overflow:hidden}.progress i{background:linear-gradient(90deg,#4be3c0,#7c5cff,#ff5db1);width:0;height:100%;transition:width .3s;display:block}.qnum{color:var(--dim);letter-spacing:.5px;font-size:12px;font-weight:700}.qtext{text-wrap:balance;font-size:clamp(21px,6vw,27px);font-weight:800;line-height:1.25}.opts{flex-direction:column;gap:11px;margin-top:4px;display:flex}.opt{text-align:left;border:1px solid var(--line);background:var(--panel2);color:var(--ink);cursor:pointer;border-radius:15px;padding:18px;font-size:16px;font-weight:600;transition:border-color .15s,transform .1s}.opt:hover{border-color:#7c5cffb3}.opt:active{transform:scale(.985)}.spacer{flex:1}.analyzing{text-align:center;justify-content:center;align-items:center;gap:22px}.aura{filter:blur(2px);background:conic-gradient(#4be3c0,#7c5cff,#ff5db1,#4be3c0);border-radius:50%;width:116px;height:116px;animation:2.2s linear infinite spin;box-shadow:0 0 56px #7c5cff80}@keyframes spin{to{transform:rotate(360deg)}}.analyzing .t{font-size:17px;font-weight:700}.analyzing .step{color:var(--dim);height:18px;font-size:13px}.result{gap:14px;padding-top:2px}.card{background:var(--cbg);color:var(--cfg);isolation:isolate;border-radius:24px;padding:22px;position:relative;overflow:hidden;box-shadow:0 20px 50px #00000080}.card:before{content:"";z-index:-1;background:radial-gradient(120% 70% at 50% 0%, color-mix(in srgb, var(--caccent) 30%, transparent), transparent 62%);position:absolute;inset:0}.card .crow{letter-spacing:1.5px;text-transform:uppercase;color:var(--cmuted);justify-content:space-between;font-size:10px;font-weight:700;display:flex}.card svg{width:100%;height:96px;margin:4px 0;display:block}.card .code{letter-spacing:4px;color:var(--caccent);font-size:12px;font-weight:800}.card .name{font-family:var(--serif);letter-spacing:-.5px;margin:2px 0 6px;font-size:clamp(34px,10vw,46px);font-weight:600;line-height:1.02}.card .tag{font-family:var(--serif);opacity:.85;font-size:15px;font-style:italic;line-height:1.35}.card .chips{flex-wrap:wrap;gap:6px;margin-top:12px;display:flex}.card .chip{border:1px solid color-mix(in srgb, var(--cfg) 30%, transparent);border-radius:999px;padding:5px 10px;font-size:11px;font-weight:700}.card .bars{flex-direction:column;gap:7px;margin-top:14px;display:flex}.card .b .l{letter-spacing:.5px;text-transform:uppercase;color:var(--cmuted);justify-content:space-between;margin-bottom:4px;font-size:9.5px;font-weight:700;display:flex}.card .b .t{background:color-mix(in srgb, var(--cfg) 14%, transparent);border-radius:999px;height:5px;overflow:hidden}.card .b .f{background:var(--caccent);border-radius:999px;width:0;height:100%;transition:width .8s cubic-bezier(.2,.8,.2,1)}.card .foot{border-top:1px solid color-mix(in srgb, var(--cfg) 25%, transparent);justify-content:space-between;align-items:center;margin-top:14px;padding-top:12px;display:flex}.card .foot .wm{align-items:center;gap:7px;font-size:13px;font-weight:800;display:flex}.card .foot .wm .d{background:var(--caccent);border-radius:50%;width:14px;height:14px}.card .foot .cta{color:var(--caccent);font-size:11px;font-weight:700}.match{gap:10px;display:flex}.match .m{background:var(--panel);border:1px solid var(--line);text-align:center;border-radius:13px;flex:1;padding:11px}.match .m .h{letter-spacing:1px;text-transform:uppercase;color:var(--dim);font-size:10px}.match .m .v{margin-top:3px;font-size:15px;font-weight:700}.actions{flex-direction:column;gap:9px;display:flex}@media (prefers-reduced-motion:reduce){.aura,.screen.on{animation:none}.card .b .f{transition:none}}
