:root{font-family:Arial,Helvetica,sans-serif;color:#272b28;background:#f7f5f0;font-size:16px;--ink:#293c33;--gold:#a17b43}*{box-sizing:border-box}body{margin:0}header{height:100px;padding:20px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d9d9cf}.brand{font:26px Georgia,serif;letter-spacing:4px;color:inherit;text-decoration:none}.brand span{display:block;font:11px Arial;letter-spacing:4px;margin-top:7px}.header-note,.eyebrow{font-size:12px;letter-spacing:2px}main{display:grid;grid-template-columns:35% 65%;min-height:760px}aside{position:relative;background:#333c33;color:#fff;min-height:720px;overflow:hidden}aside img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}aside:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(16,27,21,.93),rgba(16,27,21,.04) 90%)}.aside-copy{position:absolute;bottom:80px;left:12%;right:10%;z-index:1}h1{font:clamp(36px,4vw,58px)/1.1 Georgia,serif;font-weight:normal;margin:22px 0}p{line-height:1.6}.aside-copy p{max-width:270px;color:#e2e6dc}.credit{position:absolute;bottom:22px;left:12%;z-index:1;font-size:12px}.credit a{color:#eee}#workspace{padding:44px 8% 45px;max-width:1050px;width:100%;margin:auto}.topline{display:flex;justify-content:space-between;gap:15px;color:#686d64;font-size:13px;letter-spacing:1px}.progress{height:3px;background:#dedfd6;margin:18px 0 32px}.progress div{height:100%;background:var(--gold);transition:width .2s}h2{font:normal clamp(28px,3vw,40px)/1.2 Georgia,serif;margin:12px 0}h3{font:normal 25px Georgia,serif;margin:16px 0}.intro{color:#666d64;margin:14px 0 24px;font-size:16px}.options{display:grid;grid-template-columns:1fr 1fr;gap:12px}button{font:inherit;cursor:pointer}button.option{background:transparent;border:1px solid #cccec5;padding:17px 15px;text-align:left;min-height:84px;color:inherit;display:flex;gap:12px;align-items:center;border-radius:2px;line-height:1.4}button.option:hover{border-color:var(--ink);background:#eef0e9}button.option[aria-pressed=true]{background:#e5eade;border:2px solid var(--ink);padding:16px 14px}.letter{flex-shrink:0;width:27px;height:27px;border:1px solid #b6bbae;border-radius:50%;display:grid;place-items:center;font-size:12px}button.option[aria-pressed=true] .letter{background:var(--ink);color:white;border-color:var(--ink)}.actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:28px}.primary{background:var(--ink);color:#fff;border:1px solid var(--ink);padding:14px 26px;border-radius:2px}.primary:disabled{opacity:.4;cursor:not-allowed}.secondary{background:transparent;color:var(--ink);border:1px solid #a9b2a8;padding:13px 20px;border-radius:2px}.back{border:0;background:transparent;padding:14px 0;color:#636a60}.fine{font-size:13px;color:#6b7169;line-height:1.5;margin-top:24px}.result-badge{color:#7b5b2d;font-size:12px;letter-spacing:2px}.result-block{border-top:1px solid #d2d5ca;padding:20px 0}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.result-grid p{margin:6px 0}.label{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#656e63}.swatches{display:flex;gap:8px;margin:14px 0}.swatch{height:40px;flex:1;border:1px solid #0001}.swatch-name{font-size:12px;color:#646b61}.result-actions{display:flex;gap:10px;flex-wrap:wrap}.score-row{display:grid;grid-template-columns:145px 1fr 24px;gap:12px;align-items:center;margin:12px 0;font-size:14px}.bar{height:5px;background:#dfe2d8}.bar i{display:block;background:#64725e;height:100%}details{margin:20px 0}summary{cursor:pointer;font-size:14px}ol{padding-left:22px;line-height:1.7;font-size:14px}footer{display:flex;justify-content:space-between;padding:24px 5%;font-size:12px;letter-spacing:1px;border-top:1px solid #dadcd2}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #b08443;outline-offset:4px}#notice{font-size:14px;line-height:1.5}@media(max-width:850px){main{grid-template-columns:1fr}aside{min-height:210px}.aside-copy{bottom:25px;left:6%}.aside-copy h1{font-size:34px;margin:12px 0}.aside-copy h1 br{display:none}.aside-copy p,.aside-copy .eyebrow,.credit{display:none}#workspace{padding:28px 6% 40px}header{height:84px}.header-note{display:none}footer span{display:none}}@media(max-width:480px){.options{grid-template-columns:1fr}button.option{min-height:65px;padding:12px}button.option[aria-pressed=true]{padding:11px}.result-grid{grid-template-columns:1fr}aside{min-height:160px}.aside-copy h1{font-size:30px}.score-row{grid-template-columns:130px 1fr 20px}}@media print{body{background:white;font-size:11pt}header{height:70px}main{display:block;min-height:0}aside,footer,.result-actions,.fine,#notice{display:none}#workspace{padding:20px 0;max-width:none}h2{font-size:30px}.result-block{break-inside:avoid}.swatch{print-color-adjust:exact;-webkit-print-color-adjust:exact}details{display:none}}
/* Picture-led quiz */
main{display:block;min-height:calc(100vh - 175px)}#workspace{max-width:1440px;padding:28px 5% 34px;margin:0 auto}.progress{margin:14px 0 24px}.question-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:20px}.question-heading h2{margin:0}.question-heading .intro{margin:0;flex-shrink:0}.visual-options{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}button.visual-option{display:block;padding:0;overflow:hidden;min-height:0;background:#fff;border:2px solid transparent;box-shadow:0 0 0 1px #d5d8cd;transition:box-shadow .15s,transform .15s}button.visual-option:hover{transform:translateY(-2px);box-shadow:0 0 0 1px var(--ink);background:white}button.visual-option[aria-pressed=true]{padding:0;border:2px solid var(--ink);background:var(--ink);color:white;box-shadow:0 0 0 2px var(--ink)}.photo-crop{display:block;position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;background:#dcdcd2}.photo-crop img{position:absolute;width:400%;height:200%;max-width:none;object-fit:fill}.choice-caption{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:13px 12px;font-size:14px}.choice-check{display:grid;place-items:center;flex-shrink:0;width:23px;height:23px;border-radius:50%;border:1px solid #a9b2a3;font-size:16px}button[aria-pressed=true] .choice-check{background:var(--ink);color:white;border-color:var(--ink)}button.visual-option[aria-pressed=true] .choice-check{background:white;color:var(--ink);border-color:white}.palette-preview{display:flex;aspect-ratio:1/1;padding:14% 9%;background:#eeeae1;gap:3px;align-items:stretch}.palette-preview i{flex:1}.simple-options{max-width:850px;margin:40px auto 70px}.simple-options button{display:block;min-height:120px}.simple-options .choice-caption{font-size:18px;width:100%}.selection-hint{font-size:13px;color:#656d61}.actions{margin-top:24px}.fine{margin-top:18px;font-size:12px}.results{max-width:980px!important}.result-picture{width:100%;aspect-ratio:1/1;max-width:460px;margin-bottom:25px}.results h2{margin-top:16px}.result-block{padding:24px 0}footer{margin-top:0}@media(min-width:1500px){.photo-crop{aspect-ratio:1/1}}@media(max-width:850px){.visual-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.question-heading{display:block}.question-heading h2{font-size:30px}.question-heading .intro{margin:10px 0 0}#workspace{padding:24px 5% 32px}.photo-crop{aspect-ratio:1/1}.actions{position:sticky;bottom:0;background:#f7f5f0f5;padding:12px 0;margin-top:18px;z-index:3;border-top:1px solid #d9ddd3}.simple-options{margin:25px 0}.simple-options button{min-height:95px}}@media(max-width:480px){.visual-options{gap:12px}.choice-caption{font-size:13px;padding:10px 8px;min-height:52px}.choice-check{width:20px;height:20px;font-size:14px}button.visual-option,button.visual-option[aria-pressed=true]{padding:0}.selection-hint{display:none}.simple-options .choice-caption{font-size:16px}.question-heading h2{font-size:28px}.brand{font-size:23px}.result-picture{max-width:100%}}@media print{#workspace{padding:15px 0}.photo-crop.result-picture{width:230px;print-color-adjust:exact;-webkit-print-color-adjust:exact}.result-block{break-inside:auto}.result-grid{break-inside:avoid}}