:root{color:#1d2528;background:#f4f0e8;font-family:Inter,PingFang SC,Hiragino Sans GB,Microsoft YaHei,system-ui,sans-serif;font-synthesis:none;line-height:1.5;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(180deg,#f4f0e8e0,#eff4eff2),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cpath fill='none' stroke='%23bac7b7' stroke-opacity='.34' d='M22 34h176M22 74h176M22 114h176M22 154h176M22 194h176M44 18v184M88 18v184M132 18v184M176 18v184'/%3E%3C/svg%3E")}button{font:inherit}.app-shell{width:min(1440px,100%);margin:0 auto;padding:24px}.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:18px}.brand-row,.source-note,.segmented button,.primary-action,.ghost-action,.question-meta,.chapter-meta{display:inline-flex;align-items:center;gap:8px}.brand-row{color:#7a3f2b;font-weight:800}.brand-row svg,.source-note svg,.segmented svg,.primary-action svg,.ghost-action svg,.explanation svg{width:18px;height:18px;flex:0 0 18px}h1,h2,h3,p{margin-top:0}h1{margin-bottom:0;font-size:clamp(28px,4vw,48px);line-height:1.05;letter-spacing:0}.landing-page{display:grid;grid-template-columns:minmax(320px,.82fr) minmax(0,1.18fr);align-items:center;gap:28px;min-height:calc(100vh - 48px)}.landing-copy{min-width:0;padding:10px 0}.landing-copy h1{margin:14px 0 18px;max-width:720px;font-size:clamp(42px,5.8vw,82px);line-height:.98}.landing-copy p{max-width:620px;margin-bottom:22px;color:#40504b;font-size:18px}.landing-points{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}.landing-points span{padding:7px 10px;border:1px solid #c9d4c7;border-radius:999px;background:#ffffffb8;color:#315f5a;font-size:13px;font-weight:850}.hero-action{width:min(260px,100%);min-height:54px;font-size:17px}.landing-visual{min-width:0}.landing-visual img{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover;border:1px solid #becbc4;border-radius:8px;box-shadow:0 22px 54px #3b4e4a2e}.source-note{max-width:440px;min-height:38px;padding:8px 12px;border:1px solid #c9d4c7;border-radius:8px;background:#ffffffb8;color:#43605a;font-size:14px}.source-note.compact{max-width:520px}.segmented{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:min(520px,100%);padding:6px;margin-bottom:18px;border:1px solid #c9d4c7;border-radius:8px;background:#ffffffc2}.segmented button{justify-content:center;min-height:44px;border:0;border-radius:6px;background:transparent;color:#52615d;cursor:pointer}.segmented button.active{background:#315f5a;color:#fff}.workspace{display:grid;grid-template-columns:300px minmax(0,1fr);align-items:start;gap:18px}.status-panel{position:sticky;top:18px;display:grid;gap:14px;padding:16px;border:1px solid #ccd6cd;border-radius:8px;background:#ffffffdb;box-shadow:0 16px 42px #3b4e4a1a}.metric{display:grid;gap:4px}.metric span,.stat span,.mini-grid span,.chapter-meta,.eyebrow{color:#66736f;font-size:13px}.metric strong{font-size:32px;line-height:1}.progress-track{height:10px;overflow:hidden;border-radius:999px;background:#d8ded8}.progress-track div{height:100%;border-radius:inherit;background:#bd6f3a;transition:width .18s ease}.mini-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mini-grid div,.stat{min-width:0;padding:12px;border:1px solid #d8ddd7;border-radius:8px;background:#f7f8f4}.mini-grid strong,.stat strong{display:block;font-size:24px}.primary-action,.ghost-action{justify-content:center;min-height:44px;width:100%;border-radius:8px;border:1px solid transparent;cursor:pointer;font-weight:800}.primary-action{background:#315f5a;color:#fff}.primary-action.small{margin-top:auto}.primary-action:disabled{cursor:not-allowed;background:#a8b2ae}.ghost-action:disabled{cursor:not-allowed;opacity:.62}.ghost-action{background:#fff;color:#315f5a;border-color:#c9d4c7}.ghost-action.danger{color:#9d3d2e;border-color:#dfb8ad}.ghost-action.inline{min-height:36px;width:auto;padding:0 12px}.content-column,.question-list,.chapter-dashboard{display:grid;gap:16px}.result-band{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(250px,.8fr);gap:14px;padding:18px;border:1px solid #becbc4;border-radius:8px;background:#fdfbf6;box-shadow:0 16px 42px #3b4e4a1a}.result-main{min-width:0}.result-main h2{margin-bottom:10px;color:#7a3f2b;font-size:clamp(28px,4vw,46px);line-height:1.05}.type-subtitle{display:block;margin-bottom:10px;color:#315f5a;font-size:18px}.save-result-action{margin-top:14px}.result-main p,.personality-section p,.personality-grid p,.wrong-list p{color:#3f4b48}.result-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.personality-section,.personality-grid,.wrong-list{grid-column:1 / -1;padding-top:8px;border-top:1px solid #e0e4dc}.personality-section h3,.personality-grid h3,.wrong-list h3{margin-bottom:10px}.personality-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.personality-grid>div,.type-rank div{min-width:0;padding:12px;border-radius:8px;background:#eef4ef}.personality-grid p:last-child{margin-bottom:0}.profile-stack{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.profile-chip{min-width:0;padding:12px;border:1px solid #d8e0d8;border-radius:8px;background:#f7f8f4}.profile-chip.main{background:#eef4ef;border-color:#b8c8bd}.profile-chip span,.profile-chip strong{display:block}.profile-chip span{margin-bottom:6px;color:#7a3f2b;font-size:12px;font-weight:900}.profile-chip p{margin:8px 0 0;font-size:14px}.type-rank{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.type-rank strong,.type-rank span{display:block}.type-rank span{margin-top:4px;color:#66736f;font-size:13px}.question-card,.chapter-card{min-width:0;padding:16px;border:1px solid #ccd6cd;border-radius:8px;background:#ffffffe6}.question-head,.chapter-card-head,.dashboard-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.question-head{margin-bottom:12px}.question-head>span,.chapter-card-head>span{display:inline-grid;place-items:center;min-width:42px;height:32px;border-radius:999px;background:#e7eee9;color:#315f5a;font-weight:900}.question-meta{flex-wrap:wrap;justify-content:flex-end}.question-meta span{padding:4px 8px;border-radius:999px;background:#f0ece3;color:#6d5748;font-size:12px}.question-card h3{margin-bottom:14px;font-size:18px;line-height:1.55}.question-card.collapsed{padding:12px 14px;background:#ffffffb8}.question-card.collapsed .question-head{margin-bottom:6px}.collapsed-row{display:grid;grid-template-columns:minmax(0,1fr) 112px;align-items:center;gap:12px}.collapsed-row h3{margin-bottom:0;color:#52615d;font-size:15px;line-height:1.45}.option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.option-button{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:start;gap:10px;min-height:72px;padding:12px;border:1px solid #d4d9d1;border-radius:8px;background:#fff;color:#25302d;text-align:left;cursor:pointer}.option-button span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#eef2ed;color:#315f5a;font-weight:900}.option-button strong{min-width:0;overflow-wrap:anywhere;font-weight:650}.option-button:hover:not(:disabled),.option-button.selected{border-color:#315f5a;box-shadow:inset 0 0 0 1px #315f5a}.option-button.correct{border-color:#2f7b4f;background:#edf7ef;box-shadow:inset 0 0 0 1px #2f7b4f}.option-button.wrong{border-color:#a94736;background:#fff1ed;box-shadow:inset 0 0 0 1px #a94736}.option-button:disabled{cursor:default}.explanation{display:grid;grid-template-columns:22px minmax(0,1fr);gap:8px;margin-top:12px;padding:12px;border-radius:8px;background:#f2f6ef;color:#40504b}.explanation.needs-review{background:#fff4ed}.explanation p{margin-bottom:0}.submit-footer{display:grid;grid-template-columns:minmax(0,1fr) 280px;align-items:center;gap:14px;padding:16px;border:1px solid #becbc4;border-radius:8px;background:#fdfbf6;box-shadow:0 16px 42px #3b4e4a1a}.submit-footer strong{display:block;font-size:28px;line-height:1}.footer-action{min-height:52px}.stats-page{display:grid;gap:16px}.stats-login-page{min-height:calc(100vh - 48px);align-content:center}.stats-login-card{width:min(100%,440px);margin:0 auto;padding:22px;border:1px solid #ccd6cd;border-radius:8px;background:#ffffffeb;box-shadow:0 18px 50px #2737331f}.stats-login-card h1{margin:12px 0 8px;font-size:clamp(26px,6vw,36px)}.stats-login-card p{color:#40504b}.stats-login-form{display:grid;gap:12px;margin-top:18px}.stats-login-form label{display:grid;gap:6px;color:#2c3935;font-weight:900}.stats-login-form input{min-height:46px;width:100%;border:1px solid #b9c6bd;border-radius:8px;padding:0 12px;background:#fffdf8;color:#18211f;font:inherit}.stats-login-form input:focus{border-color:#315f5a;outline:3px solid rgba(49,95,90,.15)}.login-error{margin:0;color:#9a2f23;font-weight:800}.stats-head{display:grid;grid-template-columns:minmax(0,1fr) 260px;align-items:end;gap:18px}.stats-head h1{margin:10px 0}.stats-head p{max-width:760px;color:#40504b}.stats-actions{display:grid;gap:10px}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.stats-panel{padding:16px;border:1px solid #ccd6cd;border-radius:8px;background:#ffffffe0}.stats-panel h2{margin-bottom:12px}.type-bars,.records-table{display:grid;gap:8px}.type-bar,.record-row{display:grid;align-items:center;gap:10px;min-width:0}.type-bar{grid-template-columns:120px minmax(0,1fr) 44px}.type-bar span,.record-row span{color:#52615d;font-size:14px}.type-bar div{height:10px;overflow:hidden;border-radius:999px;background:#e0e7e0}.type-bar i{display:block;height:100%;border-radius:inherit;background:#315f5a}.record-row{grid-template-columns:1.25fr .9fr minmax(170px,1fr) 92px 92px;padding:10px 0;border-bottom:1px solid #edf0ea}.record-location{display:grid;gap:2px}.record-location small{color:#7a8581;font-size:12px;font-weight:700;overflow-wrap:anywhere}.empty-state{margin-bottom:0;color:#66736f}.dashboard-head{align-items:flex-end;padding:4px 0 8px}.dashboard-head h2{margin-bottom:0;font-size:clamp(24px,3vw,34px)}.chapter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.chapter-card{display:flex;flex-direction:column;gap:12px;min-height:330px}.chapter-card h3{margin-bottom:0;font-size:22px}.chapter-card p{margin-bottom:0;color:#4f5b57}.chapter-card-head strong{color:#7a3f2b}.tag-row{display:flex;flex-wrap:wrap;gap:6px}.tag-row.vertical{align-items:flex-start}.tag-row span{padding:5px 8px;border-radius:999px;background:#e7eee9;color:#315f5a;font-size:12px;font-weight:800}.chapter-meta{justify-content:space-between;margin-top:auto}.eyebrow{display:inline-block;margin-bottom:6px;font-weight:900;text-transform:uppercase}@media(max-width:1100px){.landing-page{grid-template-columns:1fr;min-height:auto}.landing-visual{order:-1}.workspace{grid-template-columns:1fr}.status-panel{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.chapter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.app-shell{padding:12px}.topbar,.dashboard-head,.question-head{align-items:flex-start;flex-direction:column}.source-note,.segmented{width:100%}.source-note{display:none}h1{font-size:30px;line-height:1.08}.landing-page{gap:14px}.landing-copy h1{margin:10px 0 12px;font-size:38px;line-height:1.02}.landing-copy p{margin-bottom:16px;font-size:16px}.landing-visual img{aspect-ratio:4 / 3;border-radius:8px}.landing-points{margin-bottom:18px}.landing-points span{font-size:12px}.hero-action{width:100%}.status-panel,.result-band,.result-stats,.personality-grid,.profile-stack,.type-rank,.submit-footer,.stats-head,.stats-grid,.record-row,.option-grid,.chapter-grid{grid-template-columns:1fr}.status-panel,.question-card,.result-band,.submit-footer,.stats-panel{padding:12px}.question-list,.content-column{gap:10px}.question-card h3{margin-bottom:10px;font-size:16px}.option-button{min-height:58px;padding:10px}.result-main h2{font-size:34px}.record-row,.type-bar,.collapsed-row{grid-template-columns:1fr}.question-meta{justify-content:flex-start}.chapter-card{min-height:auto}}
