:root{--paper:#f7f4e7;--ground:#e8e6d7;--ink:#242b23;--muted:#646c5e;--accent:#c6db73;--butter:#f4d656;--edge:#d8d7c7;--radius:12px;--small:13px;--body:16px;--lead:20px;--head:clamp(30px,4vw,52px);--display:clamp(45px,5.9vw,78px)}*{box-sizing:border-box}body{margin:0;background:var(--ground);color:var(--ink);font:var(--body)/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button{border:0}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #53713a;outline-offset:5px}img{display:block;max-width:100%;object-fit:cover}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:"STSong","Songti SC","SimSun",serif;font-weight:800;line-height:1.16}h1{font-size:var(--display);letter-spacing:-.045em}h2{font-size:var(--head)}h3{font-size:24px}p{line-height:1.85}.top{max-width:1240px;margin:auto;padding:26px 40px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:20px}.eyes{display:flex;transform:rotate(-8deg);gap:2px}.eyes i{display:block;width:18px;height:22px;background:#9cb954;border-radius:50%;position:relative}.eyes i:after{content:"";position:absolute;background:var(--ink);width:9px;height:12px;left:5px;top:5px;border-radius:50%}nav{display:flex;gap:28px;align-items:center;font-size:14px}nav button{background:none;padding:0}.home,.gallery-page,.quiz,.result{max-width:1160px;margin:12px auto 64px}.hero{display:grid;grid-template-columns:1.05fr 1fr;min-height:600px;background:var(--paper);border-radius:var(--radius);overflow:hidden}.hero-copy{padding:52px 46px;display:flex;flex-direction:column;justify-content:center}.slip{display:inline-flex;align-self:flex-start;background:var(--accent);padding:4px 12px;margin-bottom:30px;font-size:14px;transform:rotate(-3deg)}.hero-copy h1 span{display:block}.hero-copy .intro{margin:28px 0 26px;max-width:390px;color:var(--muted);font-size:18px}.primary{background:var(--ink);color:var(--paper);padding:16px 26px;border-radius:var(--radius);font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:22px;transition:transform .18s,background .18s}.primary:hover{transform:translateY(-3px);background:#3d4938}.hero-copy .primary{align-self:flex-start}.secondary{background:var(--paper);padding:13px 22px;border-radius:var(--radius);transition:transform .18s}.secondary:hover{transform:translateY(-2px)}.meta{display:flex;gap:22px;color:var(--muted);font-size:14px;margin-top:22px}.hero-art{position:relative;background:var(--butter);padding:30px;display:flex;align-items:center;justify-content:center}.hero-art>img{width:100%;height:100%;max-height:545px;border-radius:50% 50% 8px 8px;object-fit:cover}.art-caption{position:absolute;bottom:32px;left:22px;background:var(--paper);padding:9px 17px;transform:rotate(-5deg);font-size:14px}.art-stamp{position:absolute;right:14px;top:24px;background:var(--accent);width:92px;height:92px;display:grid;place-content:center;text-align:center;border-radius:50%;transform:rotate(13deg);font-size:15px;line-height:1.4}.preview{padding:64px 0 10px}.section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:28px;gap:22px}.section-head p{color:var(--muted);max-width:360px;font-size:15px}.mini-grid,.all-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.specimen{padding:0;text-align:left;background:var(--paper);border-radius:var(--radius);overflow:hidden;transition:transform .22s}.specimen:hover{transform:translateY(-6px) rotate(-1deg)}.specimen img{aspect-ratio:1/1;width:100%}.specimen .label{display:block;padding:20px}.specimen h3{font-size:22px;margin-bottom:9px}.specimen p{font-size:14px;color:var(--muted)}.gallery-link{display:block;margin:26px auto 0;text-align:center;width:max-content;background:none;text-decoration:underline;text-underline-offset:5px}.faq-block{margin-top:60px;background:var(--ink);color:var(--paper);padding:42px;display:grid;grid-template-columns:1fr 1.2fr;gap:50px;border-radius:var(--radius)}.faq-block h2{font-size:34px}.faq-block details{padding:0 0 22px}.faq-block summary{cursor:pointer;font-weight:700}.faq-block p{font-size:15px;margin-top:10px;color:#d1d5c4}footer{max-width:1240px;padding:0 40px 30px;margin:auto;display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}.gallery-page>h1{font-size:var(--head);margin:36px 0 20px}.gallery-page>.intro{color:var(--muted);margin-bottom:32px}.all-grid{row-gap:30px}.back-link{background:none;padding:4px 0;color:var(--muted);font-size:14px}.quiz{max-width:900px}.progress-row{display:flex;justify-content:space-between;margin:28px 0 12px;font-size:14px}.progress{height:7px;border-radius:10px;background:#d8dcca;overflow:hidden;margin-bottom:28px}.progress>i{display:block;height:100%;background:#728e40;transition:width .25s}.question-paper{background:var(--paper);padding:40px 48px;border-radius:var(--radius);position:relative;min-height:570px;animation:arrive .26s ease-out}.question-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.question-head small{font-size:13px;color:var(--muted)}.tiny-mascot{height:62px;width:62px;border-radius:50%;object-fit:cover}.question-paper h1{font-size:clamp(27px,4vw,37px);letter-spacing:0}.prompt{margin:20px 0 28px;font-size:18px;max-width:620px}.options{display:grid;gap:12px}.option{background:#e9ebdf;padding:17px 20px;display:flex;align-items:center;gap:18px;text-align:left;border-radius:var(--radius);font-size:16px;line-height:1.6;transition:background .16s,transform .16s;min-height:66px}.option b{display:grid;place-content:center;min-width:30px;height:30px;font-size:15px;font-weight:600;background:var(--paper);border-radius:50%}.option:hover{background:#dce5c7;transform:translateX(3px)}.option[aria-pressed=true]{background:var(--accent)}.option[aria-pressed=true] b{background:var(--ink);color:var(--paper)}.feedback{margin-top:26px;color:var(--muted);font-size:14px;min-height:24px}.quiz-actions{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:24px}.draft-actions{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:30px;font-size:13px;color:var(--muted)}.text-btn{background:none;text-decoration:underline;text-underline-offset:3px;padding:0;font-size:13px}.result{max-width:1000px}.certificate{background:var(--paper);border-radius:var(--radius);overflow:hidden}.result-top{padding:25px 38px;display:flex;justify-content:space-between;align-items:center;background:var(--accent);font-size:14px}.result-hero{display:grid;grid-template-columns:.95fr 1.05fr}.result-image{position:relative;overflow:hidden}.result-image>img{width:100%;height:100%;object-fit:cover;min-height:500px}.specimen-id{position:absolute;left:24px;bottom:20px;background:var(--paper);padding:5px 12px;border-radius:var(--radius);font-size:13px}.result-copy{padding:40px 36px;display:flex;flex-direction:column;justify-content:center}.result-copy h1{font-size:clamp(35px,5vw,53px);margin:14px 0 20px;line-height:1.2}.result-type{font-size:14px;color:var(--muted)}.quote{font-size:21px;font-weight:700;line-height:1.7;margin-bottom:24px}.result-desc{font-size:16px;color:var(--muted)}.result-traits{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:32px 38px;background:#e8ecda}.trait h3{font:700 16px/1.5 inherit;margin-bottom:9px}.trait p{font-size:15px;color:var(--muted)}.care{padding:28px 38px}.care strong{display:block;margin-bottom:8px}.care p{font-size:16px}.result-extra{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}.mix{background:var(--paper);padding:26px;border-radius:var(--radius)}.mix h2{font-size:23px;margin-bottom:12px}.mix p{font-size:15px;color:var(--muted)}.result-buttons{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0 14px}.result-note{font-size:13px;color:var(--muted);margin-bottom:36px}.dimension-list{padding:28px 38px}.dimension-list h2{font-size:24px;margin-bottom:22px}.bar-row{display:grid;grid-template-columns:125px 1fr 44px;align-items:center;gap:14px;font-size:14px;margin:15px 0}.bar{height:8px;background:#e1e4d5;border-radius:8px;overflow:hidden}.bar i{display:block;height:100%;background:#7b9450;border-radius:8px}.bar-row span:last-child{text-align:right;color:var(--muted)}dialog{border:0;border-radius:var(--radius);background:var(--paper);color:var(--ink);padding:40px;width: min(640px,90vw);max-height:86dvh}dialog::backdrop{background:#20251cc0}dialog h2{font-size:30px;margin:15px 0 24px}dialog p{font-size:15px;margin:14px 0}.close{background:none;position:absolute;right:18px;top:12px;font-size:30px}.modal-art{width:180px;aspect-ratio:1;border-radius:var(--radius);float:right;margin:0 0 20px 20px}#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:var(--ink);color:var(--paper);padding:12px 22px;border-radius:var(--radius);font-size:14px;opacity:0;pointer-events:none;transition:.2s;z-index:10;max-width:90vw}#toast.show{opacity:1;transform:translate(-50%,0)}.resume{margin-left:18px;background:none;font-size:14px;text-decoration:underline}.save-preview{max-width:340px;margin:0 auto 20px}.save-preview img{width:100%}.download-link{display:block;background:var(--ink);color:var(--paper);padding:13px;text-align:center;border-radius:var(--radius)}@keyframes arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@media(max-width:800px){.top{padding:22px 24px}.home,.gallery-page,.quiz,.result{margin:8px 24px 40px}.hero{min-height:520px}.hero-copy{padding:32px 28px}.hero-copy .intro{font-size:16px}.hero-art{padding:16px}.hero-art>img{max-height:480px}.art-stamp{width:72px;height:72px;font-size:13px}.meta{gap:12px;font-size:13px}.mini-grid,.all-grid{grid-template-columns:repeat(2,1fr)}.question-paper{padding:30px}.result-copy{padding:28px}.result-image>img{min-height:450px}.section-head h2{font-size:32px}}@media(max-width:560px){.top{padding:19px 20px}.brand{font-size:17px;gap:8px}nav{gap:15px;font-size:13px}nav button{font-size:13px}.home,.gallery-page,.quiz,.result{margin:4px 16px 40px}.hero{display:flex;flex-direction:column;min-height:0}.hero-copy{padding:32px 28px 28px}.slip{margin-bottom:23px;font-size:13px}h1{font-size:46px}.hero-copy .intro{margin:22px 0;max-width:310px}.hero-copy .primary{width:100%;padding:15px}.meta{justify-content:space-between;margin-top:15px}.hero-art{height:300px;padding:0 36px;background:var(--butter)}.hero-art>img{height:300px;width:260px;border-radius:48% 48% 0 0;object-position:center 38%}.art-caption{left:14px;bottom:20px;font-size:13px;padding:6px 12px}.art-stamp{top:16px;right:14px;width:72px;height:72px}.preview{padding:42px 0 0}.section-head{display:block;margin-bottom:22px}.section-head h2{font-size:29px;margin-bottom:15px}.section-head p{font-size:14px}.mini-grid,.all-grid{gap:12px}.specimen .label{padding:16px 12px}.specimen h3{font-size:20px}.specimen p{font-size:13px}.faq-block{margin-top:36px;padding:28px;display:block}.faq-block h2{font-size:29px;margin-bottom:28px}footer{display:block;padding:0 20px 28px;font-size:13px}footer span{display:block;margin:4px 0}.question-paper{padding:24px 20px;min-height:0}.question-head{margin-bottom:22px}.tiny-mascot{width:48px;height:48px}.question-paper h1{font-size:29px}.prompt{font-size:16px;margin:18px 0 24px}.option{padding:15px 13px;gap:12px;font-size:15px;min-height:72px}.option b{min-width:27px;height:27px;font-size:14px}.options{gap:12px}.feedback{font-size:13px;margin-top:24px}.progress-row{margin-top:20px;font-size:13px}.progress{margin-bottom:20px}.quiz-actions{margin-top:20px}.quiz-actions .primary,.quiz-actions .secondary{padding:13px 21px;font-size:15px}.draft-actions{display:block;font-size:13px}.draft-actions button{margin-top:12px}.result-top{padding:18px 22px;font-size:13px}.result-hero{display:flex;flex-direction:column}.result-image>img{height:340px;min-height:0;object-position:center 42%}.result-copy{padding:28px 24px}.result-copy h1{font-size:39px}.quote{font-size:20px}.result-traits{padding:25px 24px;grid-template-columns:1fr;gap:24px}.care{padding:26px 24px}.result-extra{grid-template-columns:1fr;gap:14px}.mix{padding:24px}.dimension-list{padding:25px 24px}.bar-row{grid-template-columns:115px 1fr 36px;gap:10px;font-size:13px}.result-buttons{gap:10px}.result-buttons>*{flex:1;font-size:14px;padding:14px 12px;white-space:nowrap}.result-buttons .text-btn{flex-basis:100%;padding:10px}.result-note{font-size:13px}.modal-art{width:120px}dialog{padding:32px 24px}dialog h2{font-size:27px}.resume{margin:16px 0 0;align-self:center}.gallery-page>h1{font-size:36px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:560px){.result-image>img{object-position:center 10%}}
