:root{--ink:#3f474b;--teal:#426f2b;--bright:#75ad48;--pale:#edf5e6;--line:#dce5d5;--muted:#596451;--bg:#fafcf8;--yellow:#ffc52f;--orange:#ee823b;--purple:#87399c;--green-hover:#345923}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Arial,Helvetica,sans-serif}header{min-height:98px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:36px;padding:20px max(5vw,24px)}.brand{font-size:35px;font-weight:900;letter-spacing:-2px;line-height:1;color:var(--ink);text-decoration:none}.brand span{color:var(--teal)}.brand small{display:block;font-size:9px;letter-spacing:1.2px;margin-top:7px}.header-label{font-size:12px;letter-spacing:1.8px;color:var(--muted)}.tag{margin-left:auto;border:1px solid var(--line);border-radius:30px;padding:7px 13px;font-size:12px;letter-spacing:1px}main{max-width:1240px;margin:auto;padding:40px 28px}.intro{position:relative;padding-bottom:30px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1.8px;color:var(--teal);margin:0 0 15px}h1{font-size:clamp(30px,4vw,48px);line-height:1.12;letter-spacing:-1.6px;margin:0 0 15px}h1 span{color:var(--teal)}.intro>p:not(.eyebrow){color:var(--muted);margin:0}.facts{display:flex;gap:22px;margin-top:20px;color:var(--muted);font-size:14px}.facts span+span{border-left:1px solid var(--line);padding-left:22px}.workspace{display:grid;grid-template-columns:270px 1fr;gap:30px;align-items:start}aside{padding:23px 0}nav{display:grid;gap:5px}.area{border:0;background:none;display:flex;align-items:center;text-align:left;gap:12px;padding:12px;color:var(--muted);border-radius:7px;font:inherit;font-size:14px;cursor:pointer;width:100%}.area.active{background:var(--pale);color:var(--teal);font-weight:700}.num{display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;border:1px solid var(--line);border-radius:50%;font-size:12px}.active .num{background:var(--teal);color:white;border-color:var(--teal)}.side-note{border-top:1px solid var(--line);margin:24px 12px 0;padding-top:20px;font-size:14px}.side-note p{color:var(--muted);margin:7px 0}.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:30px 36px;box-shadow:0 8px 30px #31451e08}.progress-head{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:14px}.progress{height:4px;background:var(--pale);margin:12px 0 26px;border-radius:4px;overflow:hidden}.progress>span{display:block;background:var(--teal);height:100%;transition:width .25s}.qtag{font-size:12px;letter-spacing:1.4px;color:var(--teal);font-weight:700}.panel h2{font-size:25px;line-height:1.3;letter-spacing:-.5px;margin:10px 0}.helper{color:var(--muted);font-size:14px;margin:0 0 20px}fieldset{border:0;padding:0;margin:0;min-width:0}legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.option{display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:12px 15px;margin:8px 0;cursor:pointer}.option:hover{border-color:var(--teal);background:#f3f8ed}.option:has(input:checked){border-color:var(--teal);background:var(--pale);box-shadow:inset 3px 0 var(--teal)}input{accent-color:var(--teal);width:18px;height:18px;flex-shrink:0}.option strong{display:block;font-size:15px}.option small{display:block;color:var(--muted);font-size:14px}.controls{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:20px;margin-top:24px}button,.btn{font:inherit;font-size:14px;border:1px solid var(--line);border-radius:7px;padding:12px 20px;background:#fff;color:var(--ink);cursor:pointer;text-decoration:none;display:inline-block}button.primary,.btn.primary{background:var(--teal);color:#fff;border-color:var(--teal);font-weight:700}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--purple);outline-offset:4px}.method{margin-top:28px;border-top:1px solid var(--line);padding:20px 0;color:var(--muted);font-size:14px}.method summary{cursor:pointer;color:var(--ink)}.method a{color:var(--teal)}footer{max-width:1184px;border-top:1px solid var(--line);padding:25px 0;margin:0 auto;display:flex;gap:25px;color:var(--muted);font-size:12px}footer span:last-child{margin-left:auto}#results{scroll-margin-top:20px}#results h2{font-size:32px;margin:0 0 14px}.result-top{background:var(--ink);color:white;padding:32px;border-radius:14px;display:grid;grid-template-columns:170px 1fr;gap:35px;align-items:center}.score{font-size:64px;line-height:1.1;font-weight:bold;color:var(--yellow)}.score small{font-size:20px;font-weight:400}.result-top p{margin:7px 0;color:#edf5e6}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}.result-card{background:white;border:1px solid var(--line);padding:26px;border-radius:12px}h3{margin:0 0 20px;font-size:20px}.barrow{margin:19px 0}.barlabel{display:flex;justify-content:space-between;font-size:14px;gap:12px}.barrow .progress{margin:8px 0}.priority{border-top:1px solid var(--line);padding-top:15px;margin-top:15px}.priority strong{font-size:16px}.priority p{font-size:14px;color:var(--muted);margin:8px 0}.result-actions{display:flex;flex-wrap:wrap;gap:12px}.note{font-size:14px;color:var(--muted)}[hidden]{display:none!important}@media(min-width:1050px){.facts{position:absolute;right:0;bottom:35px}}@media(max-width:760px){header{padding:20px;gap:15px}.header-label{display:none}.tag{font-size:10px}main{padding:28px 18px}.workspace{grid-template-columns:1fr;gap:12px}aside{padding:0}aside>.eyebrow,.side-note{display:none}nav{grid-template-columns:repeat(6,1fr);gap:3px}.area{justify-content:center;padding:7px 0}.area .area-name{display:none}.panel{padding:23px 19px}.panel h2{font-size:22px}.facts{gap:12px}.facts span+span{padding-left:12px}.result-grid{grid-template-columns:1fr}.result-top{grid-template-columns:1fr;gap:12px;padding:24px}.score{font-size:52px}footer{margin:0 18px;flex-wrap:wrap;gap:10px}footer span:last-child{margin-left:0}.intro{padding-bottom:23px}h1 br{display:none}}@media print{header,.intro,.method,footer,.result-actions,.no-print{display:none}body{background:white}.result-grid{display:block}.result-card{break-inside:avoid;margin-top:20px}.result-top{background:white;color:var(--ink);border:1px solid var(--line)}.result-top p{color:var(--ink)}.score{color:var(--teal)}}

.brand img{display:block;width:205px;max-width:100%;height:auto}.brand{flex:0 1 205px;min-width:0}.tag{flex-shrink:0}@media(max-width:760px){.brand{flex-basis:155px}.brand img{width:155px}}

/* CREASI: green identity with yellow and orange accents. */
header{border-top:5px solid var(--yellow)}.tag{background:#fff5d5;border-color:var(--yellow);color:#71500b}.intro h1 span{text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:4px;text-underline-offset:8px}.qtag{border-left:3px solid var(--orange);padding-left:10px}.side-note{border-top-color:var(--orange)}.result-top{border-top:5px solid var(--yellow)}.priority strong{color:var(--teal)}.progress>span{background:var(--bright)}button.primary:hover,.btn.primary:hover{background:var(--green-hover);border-color:var(--green-hover)}@media print{.result-top{border-top-color:var(--yellow)}}

/* Logo palette: green surfaces, yellow highlights, orange accents. */
.panel{border-top:3px solid var(--bright)}.result-card{border-top:3px solid var(--bright)}.result-card:nth-child(2){border-top-color:var(--orange)}.result-top{background:#304b26}@media print{.result-top{background:white}}
footer{flex-wrap:wrap}.footer-contact{flex-basis:100%;margin:0;font-size:14px}.footer-contact a{color:var(--teal);text-underline-offset:3px;overflow-wrap:anywhere}
