:root{--text:#5a6078;--text-soft:#6f7899;--heading:#171a2a;--primary:#6f57ff;--bg:radial-gradient(circle at top right, #e4ebff, #f5f7ff 32%, #f9fbff 72%);--panel-bg:#ffffffc7;--panel-border:#fffffff2;--panel-shadow:0 12px 35px #43498129;--input-bg:#ffffffe0;--input-border:#7b88b659;color:var(--text);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,PingFang SC,Hiragino Sans GB,Microsoft YaHei,system-ui,sans-serif;font-weight:400;line-height:1.6}*{box-sizing:border-box}body{background:var(--bg);min-height:100svh;margin:0}#root{min-height:100svh}h1,h2,h3{color:var(--heading)}p{margin:0}@media (prefers-color-scheme:dark){:root{--text:#cad1ef;--text-soft:#a7b1d8;--heading:#f4f6ff;--primary:#8d8dff;--bg:radial-gradient(circle at top right, #2f2b54, #131728 36%, #0f1220 72%);--panel-bg:#13182bb8;--panel-border:#7482c659;--panel-shadow:0 14px 40px #03061473;--input-bg:#1a2239e0;--input-border:#7084d080}}.app-shell{min-height:100svh;padding:56px 24px 72px;position:relative;overflow:hidden}.bg-orb{filter:blur(50px);z-index:-1;opacity:.55;border-radius:999px;animation:7s ease-in-out infinite floatY;position:absolute}.orb-1{background:#7c5cff73;width:260px;height:260px;top:-70px;left:-80px}.orb-2{background:#00c9ff59;width:300px;height:300px;animation-delay:1.5s;top:35%;right:-120px}.orb-3{background:#ff73c759;width:220px;height:220px;animation-delay:.8s;bottom:-60px;left:38%}.home,.testing,.result{gap:22px;width:min(1020px,100%);margin:0 auto;display:grid}.hero-card,.auth-card,.version-card,.test-head,.question-card,.result-main,.panel,.result-foot{background:var(--panel-bg);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:var(--panel-shadow);border-radius:22px}.hero-card,.auth-card,.test-head,.question-card,.result-main,.panel,.result-foot{padding:28px}.badge{color:var(--heading);background:linear-gradient(120deg,#7b5eff38,#00c9ff33);border:1px solid #8475ff66;border-radius:999px;margin-bottom:14px;padding:6px 14px;font-size:13px;display:inline-flex}.hero-top{align-items:center;gap:10px;margin-bottom:6px;display:flex}.hero-icon{border-radius:14px;width:46px;height:46px;overflow:hidden;box-shadow:0 10px 20px #4a59c947}.hero-icon svg{width:100%;height:100%;display:block}.hero-card h1{margin:0 0 12px;font-size:clamp(30px,4vw,48px);line-height:1.18}.hero-card p{color:var(--text);margin:8px 0 0}.auth-card h2,.result-main h2{margin:0 0 10px;font-size:clamp(24px,3.4vw,34px)}.auth-card p{margin:0}.auth-row{grid-template-columns:1fr auto;gap:12px;margin-top:16px;display:grid}input{border:1px solid var(--input-border);background:var(--input-bg);width:100%;color:var(--heading);border-radius:14px;padding:14px 16px;font-size:15px;transition:border-color .25s,transform .25s}input:focus{border-color:var(--primary);outline:none;transform:translateY(-1px)}.btn-primary,.btn-ghost,.answer-btn{cursor:pointer;border:none;border-radius:14px;font-weight:700;transition:transform .24s,box-shadow .24s,filter .2s}.btn-primary:active,.btn-ghost:active,.answer-btn:active{transform:scale(.97)}.btn-primary{color:#fff;background:linear-gradient(135deg,#7f56ff,#00a7ff);padding:12px 18px;box-shadow:0 8px 24px #4654ff59}.btn-primary:hover{filter:brightness(1.05);transform:translateY(-1px)}.btn-ghost{color:var(--heading);background:#7f56ff1f;border:1px solid #7f56ff52;padding:12px 18px}.btn-ghost:hover{transform:translateY(-1px);box-shadow:0 6px 16px #7f56ff33}.btn-ghost:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}.status{color:var(--text-soft);margin:10px 0 0}.status.ok{color:#13a05f}.status.error{color:#db2e63}.status-grid{gap:4px;margin-top:10px;display:grid}.version-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.version-card{text-align:left;padding:24px;animation:.55s both rise;transform:translateY(0)}.version-card h3{color:var(--heading);margin:0;font-size:24px}.version-card p{margin:10px 0 0}.version-card .meta{color:var(--text-soft);margin-bottom:16px}.test-head{gap:12px;display:grid}.head-info{color:var(--heading);justify-content:space-between;gap:12px;font-weight:700;display:flex}.progress-track{background:#7f56ff1f;border-radius:999px;width:100%;height:12px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#6d5cff 0%,#00b8ff 60%,#43e7cf 100%);border-radius:999px;height:100%;transition:width .35s}.test-actions{justify-content:flex-start;display:flex}.question-card{gap:22px;animation:.45s slideIn;display:grid}.question-card h2{margin:0;line-height:1.4}.answers{gap:14px;display:grid}.answer-btn{text-align:left;color:var(--heading);border:1px solid #0000;padding:18px;font-size:16px;position:relative;overflow:hidden}.answer-btn:before{content:"";background:#ffffff4d;width:70px;height:100%;transition:left .45s;position:absolute;top:0;left:-90px;transform:skew(-25deg)}.answer-btn:hover:before{left:calc(100% + 25px)}.answer-btn.left{background:linear-gradient(135deg,#7f56ff3d,#7f56ff1a);border-color:#7f56ff66}.answer-btn.right{background:linear-gradient(135deg,#00b8ff3d,#00b8ff1a);border-color:#00b8ff66}.answer-btn.neutral{background:linear-gradient(135deg,#43e7cf38,#7f56ff24);border-color:#43e7cf73}.answer-btn:hover{transform:translateY(-2px)}.result-main strong{color:var(--primary)}.result-grid{grid-template-columns:1.2fr 1fr 1fr;gap:16px;display:grid}.panel h3{margin:0 0 10px;font-size:19px}.panel ul{gap:6px;margin:0 0 18px;padding-left:20px;display:grid}.report-text{gap:10px;display:grid}.report-text p{color:var(--text);margin-bottom:8px;line-height:1.8}.ratio-item+.ratio-item{margin-top:12px}.ratio-item p{color:var(--heading);margin:0 0 6px;font-weight:700}.ratio-track{background:#7f56ff14;border:1px solid #7f56ff33;border-radius:999px;display:flex;overflow:hidden}.ratio-left,.ratio-right{white-space:nowrap;padding:7px 10px;font-size:13px}.ratio-left{color:#fff;background:linear-gradient(90deg,#7f56ffb8,#00b8ffb8)}.ratio-right{color:var(--text-soft)}.result-foot{gap:12px;display:grid}.actions{flex-wrap:wrap;gap:12px;display:flex}@keyframes slideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes rise{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes floatY{0%,to{transform:translateY(0)}50%{transform:translateY(-14px)}}@media (width<=920px){.app-shell{padding:24px 14px 48px}.version-grid,.result-grid,.auth-row{grid-template-columns:1fr}}
