/* Bright paper, fruit colors. References and role decisions: docs/design/v0.2.3-color-card.md. */
@font-face{font-family:'Zhini Happy';src:url('/assets/fonts/ZCOOLKuaiLe-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
body{background-color:var(--bg);color:var(--ink)}
.brand-slogan,.eyebrow,.quiz-edition,.hero-note,.home-footer,.scrapbook-home .hero-description,.catalog-heading p,.test-product-heading p,.test-edition p,.test-edition .edition-extra,.edition-count,.report-summary,.traits-title p,.traits-paper>.muted,.trait-answered,.chart-note,.version-note,.admin-footnote,.paper-heading p,.paper-settings .muted,.admin-login .muted{color:var(--muted)}
h1,h2,h3,h4,.trait-heading .trait-name{color:var(--ink)}
.button,.icon-button{border-color:#53659a}.button.primary{background-color:var(--coral);border-color:#873f46;color:var(--ink)}.button.primary:hover{background-color:#ff9a80;color:var(--ink)}.button.secondary{background-color:var(--aqua);border-color:#376c94;color:var(--ink)}.button.secondary:hover{background-color:#cef5fc}.button:focus-visible,.icon-button:focus-visible,.text-button:focus-visible,summary:focus-visible{outline-color:#345fab}
.text-button{background-color:#fffdf7;border-color:#6478a8;color:#345795}.text-button:hover{background-color:#e2f7fc}.catalog-jump.button.secondary{background-color:var(--lemon);border-color:#86742b;color:var(--ink)}
.catalog-heading em{color:#315da4}.test-product{background-color:var(--lemon);border-color:#e4c84c}.catalog-symbol{background:var(--coral);color:var(--ink)}.test-edition{background-color:var(--aqua)}.edition-advanced{background-color:var(--lime)}.test-edition .button.secondary{background-color:#fffdf7}.edition-count{color:#345795}
.review-group{--review-paper:#fff0a3;--review-accent:#615015;background:#fffdf7}.review-color-1{--review-paper:#dff0a6;--review-accent:#40531a}.review-color-2{--review-paper:#bfeef8;--review-accent:#235078}.review-color-3{--review-paper:#ffd0be;--review-accent:#7a3b36}.review-color-4{--review-paper:#e1d5ff;--review-accent:#543d87}.review-button{border-color:#a9b5ca}.review-button:hover{background-color:#fff7d3;border-color:#526a9c}.review-answer{color:var(--ink);background:#fffdf7}.answer-label{color:var(--muted)}
.option{background-color:#fffefa;border-color:#8091b2}.option:has(input:checked){background-color:var(--aqua);border-color:#345fab;box-shadow:inset 0 0 0 1px #345fab}.option:has(input:checked) .option-indicator{border-color:#345fab}.question-footer{background-color:var(--bg)}.question-progress{color:#345fab}
.direction-card{--direction-paper:#dff5fb;border-color:#c3d4e5}.direction-card:nth-of-type(3n){--direction-paper:#e1efa9}.direction-card:nth-of-type(3n + 1){--direction-paper:#ffdbcf}.direction-heading>.doodle-icon{color:#345fab}.direction-card .career-card{border-top-color:#a3b7cf}.direction-card .career-card .text-button{color:#345795;border-color:#6478a8;background-color:#fffdf7}.direction-card .career-card .occupation{color:var(--category-color,#345795)}.direction-card .career-card .tag{width:fit-content;background:#fffdf7;color:#8b3d38;border:1px solid #b57c73;padding:3px 8px;border-radius:6px}.career-card-top{color:var(--category-color,#345795)}
.traits-paper{background-color:#fffefa;border-color:#cfdae6}.trait-row .trait-bar{border-color:#aabbd0;background:#fffefa}.trait-unknown .trait-segment,.trait-unknown .trait-value{background:#edf0f5;color:#515b78}.trait-unknown .trait-letter{background:#edf0f5;border-color:#8b98ad;color:#515b78}
.type-block{margin:24px 0 32px}.type-portrait{position:relative;max-width:650px;margin:0 auto;padding:0;overflow:hidden;border:1px solid #e4c84c;border-radius:24px 29px 23px 26px;background:var(--lemon) url('/assets/zhini/paper.svg');box-shadow:0 8px 20px #263c6012}
.type-card-face{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:27px 30px 17px;min-height:195px}.type-portrait .type-name{font-family:var(--display);font-size:48px;font-weight:400;line-height:1.1;color:var(--ink);margin:0;letter-spacing:1px;z-index:1}.type-name>span{display:block}.type-card-art{width:150px;height:auto;flex:none}
.type-portrait .type-code{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:none;margin:0;padding:0 30px 25px;font-family:var(--display);font-size:52px;font-weight:400;letter-spacing:0;color:var(--ink)}
.type-code-letter{display:grid;place-items:center;height:74px;background:var(--letter-paper);color:var(--letter-ink);border:1px solid currentColor;border-radius:12px 15px 10px 14px;line-height:1;transform:rotate(-3deg)}.type-code-letter:nth-child(even){transform:rotate(3deg)}
.type-portrait .type-letters{display:grid;grid-template-columns:1fr 1fr;gap:13px 16px;background:var(--aqua);margin:0;padding:23px 30px;border-top:1px dashed #407595}.type-letters span{font-size:14px;color:#254576;white-space:nowrap}.type-letters b{font-family:var(--display);font-weight:400;font-size:22px;margin-right:8px;color:#254576}
.type-portrait[data-type-status=insufficient] .type-code-letter,.type-portrait[data-type-status=balanced] .type-code-letter{color:#515b78;background:#fffdf7;border-color:#8d9ebc}
.image-dialog{background-color:var(--bg);border-color:#a5b9d4;color:var(--ink)}.image-dialog-header{background-color:var(--aqua);border-color:#739cba}.pdf-reminder{background:var(--lime);color:#3b4d21}.image-page img{border-color:#b6c6db}.admin-header,.password-panel{border-color:var(--line)}.admin-field input:not([type=checkbox]){border-color:#8091b2;color:var(--ink)}.admin-check input{accent-color:#345fab}.paper-count{background:var(--lemon);color:var(--ink)}.paper-settings{background:#fff8cd;border-color:#d1c68d}.paper-settings:nth-child(2){background:#dcf7fc}
@media(max-width:760px){.type-block{margin:22px 0 28px}.type-card-face{min-height:175px;padding:22px 18px 16px;gap:0}.type-portrait .type-name{font-size:37px;letter-spacing:0;min-width:0}.type-card-art{width:112px}.type-portrait .type-code{gap:8px;padding:0 18px 20px;font-size:43px}.type-code-letter{height:60px}.type-portrait .type-letters{padding:18px;gap:11px 8px}.type-letters span{font-size:12px}.type-letters b{font-size:20px;margin-right:5px}}
@media(max-width:359px){.type-card-face{padding:22px 14px 15px;min-height:163px}.type-portrait .type-name{font-size:32px}.type-card-art{width:92px}.type-portrait .type-code{padding:0 14px 18px;gap:7px;font-size:37px}.type-code-letter{height:51px}.type-portrait .type-letters{padding:15px 13px;gap:10px 5px}.type-letters span{font-size:11px}.type-letters b{font-size:18px;margin-right:3px}}

/* Answer first: compact rhythm, full text, one natural page scroll. */
.question-page{padding:12px 20px max(12px,env(safe-area-inset-bottom));min-height:100dvh}
.question-page .quiz-top{gap:10px;margin-bottom:10px}
.question-page .quiz-edition{flex:1;max-width:none;font-size:12px;line-height:1.45}
.question-page .quiz-top .text-button{flex:none;min-height:44px;padding:7px 10px}
.question-page .progress-meta{font-size:11px;line-height:1.5}
.question-page progress{margin:6px 0 14px}
.question-page .question-heading{margin-bottom:12px}
.question-page .question-heading h1{font-size:1.25rem;line-height:1.45;letter-spacing:0;margin-bottom:8px;text-wrap:wrap}
.question-page .question-heading .muted,.question-page .selection-message{font-size:.8125rem;line-height:1.5;min-height:0}
.question-page .question-heading:after{display:none}
.question-page .options{gap:6px;min-width:0}
.question-page .option{min-height:48px;padding:10px 12px;gap:10px;font-size:1rem;line-height:1.45}
.question-page .option input{left:12px}
.question-page .options:after{margin-top:2px;font-size:9px;line-height:1.5;letter-spacing:.3px}
.question-page .question-footer{position:static;box-shadow:none;margin-top:12px;padding:0;background:none}
.question-page .question-actions{gap:12px}
.question-page .question-actions .button{min-height:48px;padding:10px;font-size:.9375rem}
.question-page .save-hint{margin-top:6px;line-height:1.5}
.question-page .text-answer textarea{min-height:160px;height:clamp(160px,27dvh,230px);padding:12px;line-height:1.6}
.review-page>.eyebrow{margin:16px 0 8px}
.review-page .intro{margin-top:12px;font-size:15px}
.review-page .review-summary{padding:16px 0 12px}
.review-page .review-group{margin:10px 0;padding:0}
.review-page .review-group>summary{padding:13px 42px 13px 16px;min-height:52px;line-height:1.6}
.review-page .review-list{gap:10px;padding:12px 2px 4px}
.review-page .review-button{padding:15px 14px}
.review-page .review-answer{margin-top:9px}
.review-page .review-button,.review-page .review-button:hover{background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none}
.review-page .review-answer{background:none;padding:0;overflow-wrap:anywhere}
.review-page .review-content{min-width:0}
.review-page .review-end{padding-top:14px}
.matching-summary{margin:24px 0 12px}.matching-summary h2{margin-bottom:10px}.matching-summary .button{margin-top:12px}
.evidence-form select{max-width:100%;min-width:0;white-space:normal}
@media(max-width:359px){.question-page{padding-left:16px;padding-right:16px}.question-page .question-heading h1{font-size:1.1875rem}}
.test-edition>.button{margin-top:17px}.test-edition .edition-extra+.button{margin-top:0}
@media print{.type-block{break-inside:avoid}.type-portrait{max-width:520px;box-shadow:none;print-color-adjust:exact;-webkit-print-color-adjust:exact}}