:root{font-family:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;line-height:1.5;font-weight:400;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;min-height:100%;margin:0;padding:0}:root{--primary-color: #1767d6;--primary-strong: #0f56bd;--success-color: #1f9d5a;--warning-color: #e08a1f;--danger-color: #d13434;--text-color: #1f2937;--muted-text: #6b7280;--border-color: #dbe3ef;--bg-color: #eef3fb;--card-bg: #ffffff}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;color:var(--text-color);background:radial-gradient(circle at top right,#f7fbff 0%,var(--bg-color) 55%,#e7eef9 100%)}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:linear-gradient(135deg,#0f56bd,#1f75e4 55%,#2391f0);color:#fff;padding:34px 20px;text-align:center;box-shadow:0 8px 24px #1045973d}.app-header h1{font-size:clamp(28px,4.2vw,46px);margin-bottom:8px;letter-spacing:1px}.app-header p{font-size:clamp(15px,2vw,20px);opacity:.95}.app-main{flex:1;width:min(1400px,100%);margin:0 auto;padding:30px 18px 40px}.app-footer{background:#edf2fa;border-top:1px solid var(--border-color);padding:16px;text-align:center;color:var(--muted-text);font-size:14px}.entry-container{min-height:420px;display:flex;align-items:center}.entry-options{width:min(760px,100%);margin:0 auto;display:grid;grid-template-columns:1fr;gap:16px}.entry-options-home{width:min(1180px,100%)}.key-card{width:min(760px,100%);margin:0 auto}.test-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.option-card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:18px;padding:24px;box-shadow:0 8px 28px #0f285414}.option-card h3{font-size:22px;margin-bottom:8px;color:var(--primary-color)}.option-card p{color:var(--muted-text);margin-bottom:18px}.test-type-card{display:flex;flex-direction:column}.test-type-card p{flex:1}.entry-start-button{width:100%;border:none;border-radius:10px;padding:12px 16px;font-size:15px;font-weight:700;color:#fff;background:var(--primary-color);cursor:pointer;transition:.2s ease}.entry-start-button:hover:not(:disabled){background:var(--primary-strong)}.entry-start-button:disabled{opacity:.55;cursor:not-allowed}.divider{display:none}.key-input-container{display:flex;flex-direction:column;gap:12px}.key-input-container h2{font-size:18px;margin-bottom:6px}.input-group{display:flex;gap:8px}.input-group input{flex:1;padding:11px 12px;border:1px solid var(--border-color);border-radius:10px;font-size:14px}.input-group input:focus{outline:2px solid rgba(23,103,214,.25);border-color:var(--primary-color)}.input-group button,.pagination button,.submit-button,.download-button,.reset-button{border:none;border-radius:10px;cursor:pointer;transition:.2s ease}.input-group button,.pagination button,.reset-button{background:var(--primary-color);color:#fff;font-weight:600}.input-group button{min-width:90px;padding:0 14px}.input-group button:hover:not(:disabled),.pagination button:hover:not(:disabled),.reset-button:hover{background:var(--primary-strong)}.input-group button:disabled,.pagination button:disabled,.submit-button:disabled,.download-button:disabled{opacity:.55;cursor:not-allowed}.error-message{margin-top:12px;color:var(--danger-color);background:#fff1f1;border-left:4px solid var(--danger-color);border-radius:8px;padding:10px 12px}.success-message{color:var(--success-color);background:#eefcf4;border-left:4px solid var(--success-color);border-radius:8px;padding:10px 12px}.questionnaire-container,.results-container{width:min(1100px,100%);margin:0 auto;background:var(--card-bg);border-radius:20px;border:1px solid var(--border-color);padding:26px;box-shadow:0 10px 30px #0f285414}.results-container{width:min(1240px,100%)}.questionnaire-container h2,.results-container h2{color:var(--primary-color);margin-bottom:14px;font-size:clamp(24px,3.5vw,34px)}.progress-bar{width:100%;height:10px;background:#e2e8f0;border-radius:999px;overflow:hidden;margin-bottom:8px}.progress{height:100%;background:linear-gradient(90deg,#1767d6,#22a0f3);transition:width .24s ease}.progress-text{text-align:right;color:var(--muted-text);margin-bottom:18px;font-size:14px}.question-bank-note{margin-bottom:14px;font-size:12px;color:#6f7f95;line-height:1.5}.questions{display:flex;flex-direction:column;gap:14px;margin-bottom:18px}.question-item{background:#f7faff;border:1px solid #d9e7fb;border-radius:12px;padding:14px}.question-item>label{display:block;font-size:22px;font-weight:600;margin-bottom:12px}.answer-options{display:grid;grid-template-columns:repeat(5,minmax(90px,1fr));gap:8px}.iq-options{grid-template-columns:repeat(2,minmax(150px,1fr))}.iq-question-item>label{font-size:20px}.iq-option{justify-content:flex-start;padding:10px 12px}.answer-options label{display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;min-height:44px;border:1px solid var(--border-color);border-radius:10px;background:#fff;font-weight:600;color:#334155}.answer-options label:hover{border-color:#a9c4ef}.answer-options input[type=radio]{margin:0}.pagination{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:14px}.pagination button{font-size:14px;padding:10px 16px;min-width:96px}.pagination span{color:var(--muted-text);font-weight:600}.submit-button{width:100%;padding:13px 16px;font-size:16px;background:var(--success-color);color:#fff;font-weight:700}.submit-button:hover:not(:disabled),.download-button:hover:not(:disabled){filter:brightness(.95)}.summary-card{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:22px}.summary-item{background:#f7faff;border-radius:12px;border:1px solid #d9e7fb;padding:16px;text-align:center}.summary-item.compact{padding:14px 12px}.summary-item label{color:var(--muted-text);font-size:13px}.summary-item .value{margin-top:8px;color:var(--primary-color);font-size:30px;font-weight:700}.results-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;margin-bottom:16px;border-radius:14px;border:1px solid #d2e2fb;background:linear-gradient(135deg,#eff6ff,#f7fbff)}.hero-caption{font-size:12px;color:#4b6b99;letter-spacing:1px;text-transform:uppercase;margin-bottom:4px}.hero-subtitle{color:#43536e;font-size:14px;line-height:1.6}.risk-pill{flex-shrink:0;border:1px solid;border-radius:999px;padding:8px 16px;font-weight:700;background:#fff}.top-dimensions-card{background:#f8fbff;border:1px solid #d9e7fb;border-radius:12px;padding:16px;margin-bottom:20px}.top-dimensions-card h3{margin-bottom:12px}.top-dimensions-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.top-dimension-item{display:flex;align-items:flex-start;gap:12px;background:#fff;border:1px solid #d8e4f7;border-radius:12px;padding:12px}.rank-badge{width:32px;height:32px;border-radius:50%;background:#1767d6;color:#fff;font-size:13px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.top-dimension-main{flex:1}.top-dimension-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.severity-tag{border-radius:999px;font-size:12px;font-weight:700;padding:4px 10px}.dimensions-card{background:#f7faff;border:1px solid #d9e7fb;border-radius:12px;padding:16px;margin-bottom:20px}.dimensions-card h3{margin-bottom:14px}.dimension-detail-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px}.dimension-detail-item{background:#fff;border:1px solid var(--border-color);border-radius:10px;padding:12px}.dimension-detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px}.dimension-name{font-size:16px;font-weight:700;margin-bottom:4px}.dimension-interpretation{color:#5d6c84;font-size:13px;line-height:1.55;margin-bottom:8px}.dimension-suggestion{color:#3f5778;font-size:13px;line-height:1.62;background:#f2f7ff;border:1px solid #dce8fb;border-radius:8px;padding:8px 10px}.score-bar{height:8px;background:#e4ebf5;border-radius:99px;overflow:hidden;margin-bottom:6px}.score-bar.large{height:10px;margin-bottom:8px}.score-fill{height:100%;background:linear-gradient(90deg,#1767d6,#21a7ed)}.score-meta{color:#4a5d7e;font-size:12px;display:flex;justify-content:flex-end}.interpretation-card{background:#eff6ff;border:1px solid #d9e8ff;border-left:4px solid var(--primary-color);border-radius:12px;padding:16px;margin-bottom:20px}.interpretation-card h3{margin-bottom:8px}.interpretation-card p{line-height:1.72;color:#38465b}.download-section{text-align:center;margin-bottom:18px}.download-button{background:var(--success-color);color:#fff;font-size:16px;font-weight:700;padding:12px 24px}.disclaimer{background:#fff7ea;border:1px solid #f3dfb8;border-left:4px solid var(--warning-color);border-radius:12px;padding:14px}.disclaimer h4{margin-bottom:8px;color:#9b5c07}.disclaimer p{line-height:1.65;color:#51483a;font-size:14px;margin-bottom:6px}.reset-button{display:block;margin:20px auto 0;padding:12px 22px;color:#fff;font-size:15px;font-weight:700}@media(max-width:1024px){.entry-options,.test-grid{grid-template-columns:1fr}.divider{display:none}.app-main{width:min(980px,100%)}.answer-options{grid-template-columns:repeat(3,minmax(88px,1fr))}}@media(max-width:768px){.app-header{padding:24px 14px}.app-main{padding:14px 10px 24px}.questionnaire-container,.results-container,.option-card{border-radius:14px;padding:14px}.question-item{padding:12px}.question-item>label{font-size:19px}.answer-options{grid-template-columns:1fr}.answer-options label{justify-content:flex-start;padding:10px 12px;min-height:50px;font-size:16px}.pagination{position:sticky;bottom:8px;z-index:5;background:#f8fbff;border:1px solid #d6e4fa;border-radius:12px;padding:8px;margin-bottom:12px}.pagination button{min-width:84px;padding:10px 12px}.pagination span{font-size:13px}.questionnaire-container.mobile-mode .question-item{min-height:220px}.submit-button{position:sticky;bottom:66px;z-index:4;border-radius:12px}.summary-card{grid-template-columns:1fr 1fr}.summary-item .value{font-size:24px}.results-hero{flex-direction:column;align-items:flex-start;padding:14px}.risk-pill{padding:6px 12px}.top-dimensions-list,.dimension-detail-list{grid-template-columns:1fr}}
