
:root{--ink:#172e3c;--muted:#647982;--teal:#087e80;--line:#dce6e9;--bg:#f3f7f8}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 system-ui, sans-serif}button,input,select{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:white;color:var(--ink);padding:11px 18px;border-radius:10px;font-weight:650}button:hover{border-color:var(--teal);color:var(--teal)}button:disabled{opacity:.4;cursor:default}.primary{background:var(--teal);color:white;border-color:var(--teal)}.primary:hover{background:#056667;color:white}header{background:white;border-bottom:1px solid var(--line);padding:18px 5%;display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{font-size:22px;font-weight:850;letter-spacing:-1px}.brand span{color:var(--teal)}.sub{font-size:12px;font-weight:500;letter-spacing:1.5px;color:var(--muted)}.person{display:flex;align-items:center;gap:12px}.avatar{width:43px;height:43px;border-radius:50%;object-fit:cover;background:#d6eeea}.muted{color:var(--muted)}.tiny{font-size:12px}.wrap{max-width:1240px;margin:36px auto;padding:0 24px}.eyebrow{color:var(--teal);font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase}h1{font-size:34px;letter-spacing:-1.2px;line-height:1.2;margin:12px 0}h2{font-size:23px;line-height:1.4}h3{font-size:16px}.card{background:white;border:1px solid var(--line);border-radius:18px;padding:30px;box-shadow:0 8px 30px #12304004}.login{display:grid;grid-template-columns:1.1fr 1fr;max-width:1040px;margin:60px auto;overflow:hidden;border-radius:24px;background:white;border:1px solid var(--line)}.hero{background:#123b45;color:white;padding:55px;position:relative}.hero h1{font-size:44px}.hero p{color:#bed7dc}.hero .eyebrow{color:#83d5c5}.hero .orb{margin:40px 0;background:#20525b;border:1px solid #497079;border-radius:20px;padding:25px;transform:rotate(-3deg)}.form{padding:45px}label.field{display:block;margin:18px 0 6px;font-weight:650}input:not([type=radio]):not([type=checkbox]),select{width:100%;padding:12px;border:1px solid #cbd9df;border-radius:9px;background:white;color:var(--ink)}:focus-visible{outline:3px solid #5ac7bd;outline-offset:3px}.notice{background:#eaf6f4;padding:14px 18px;border-radius:10px;color:#245c59;font-size:13px}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.between{justify-content:space-between}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px 0}.metric{background:white;border:1px solid var(--line);border-radius:14px;padding:20px}.metric strong{display:block;font-size:25px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:24px}.timer{font-size:30px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:1px}.danger{color:#bc3d39}.tabs{display:flex;gap:8px;margin:25px 0}.tabs .active{background:#173e48;color:white;border-color:#173e48}.pill{font-size:12px;border-radius:20px;padding:5px 12px;background:#eaf4f3;color:var(--teal);font-weight:700}.option{display:flex;align-items:center;gap:15px;border:1px solid var(--line);border-radius:12px;padding:16px;margin:12px 0;cursor:pointer}.option:has(input:checked){border-color:var(--teal);background:#effaf8}.option input{accent-color:var(--teal);width:18px;height:18px}.letter{font-size:13px;color:var(--muted)}.progress{height:7px;background:#e4edef;border-radius:20px;overflow:hidden}.progress>i{display:block;height:100%;background:#219b92}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:20px 0}.qnav{padding:9px;position:relative}.qnav.answered{background:#ddf2ed;border-color:#86c6b6;color:#166251}.qnav.current{outline:2px solid #147e83}.qnav.flag:after{content:'★';position:absolute;right:-3px;top:-10px;color:#c28c20}.footer{padding:22px 0;display:flex;justify-content:space-between;gap:10px}.drop{border:2px dashed #97b9bd;padding:25px;border-radius:12px;text-align:center;background:#f7fbfb;margin:20px 0}.chip{display:inline-block;margin:5px;padding:10px 18px;border-radius:8px;border:1px solid #b8d4d4;background:#edf7f6;cursor:grab}.reviewitem{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 0;border-bottom:1px solid var(--line)}dialog{border:0;border-radius:18px;padding:30px;max-width:520px;width:90%;color:var(--ink)}dialog::backdrop{background:#102e3a80}.score{height:150px;width:150px;border-radius:50%;display:grid;place-content:center;text-align:center;background:#e9f7f3;border:10px solid #2e9e8d;font-size:36px;font-weight:800}.analysis{display:grid;grid-template-columns:1fr 1fr;gap:20px}.topic{padding:18px 0;border-bottom:1px solid var(--line)}.hide{display:none!important}footer{max-width:1240px;padding:20px 24px;margin:auto;color:var(--muted);font-size:12px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#173e48;color:white;padding:12px 22px;border-radius:10px;z-index:8} @media(max-width:800px){.login{grid-template-columns:1fr;margin:20px}.hero{padding:28px}.hero h1{font-size:30px}.hero .orb{display:none}.form{padding:25px}.layout,.analysis{grid-template-columns:1fr}.layout aside{order:-1}.layout aside .navigator{display:none}.layout aside .card{padding:15px;display:flex;align-items:center;justify-content:space-between;gap:10px}.layout aside h3{margin:0}.wrap{padding:0 16px;margin:24px auto}.card{padding:22px}h1{font-size:28px}header{padding:14px 16px}.person .details{display:none}.metrics{gap:8px}.metric{padding:13px}.metric strong{font-size:20px}.tabs button{padding:9px}.footer button{padding:10px}.timer{font-size:25px}}@media print{header,button,.tabs,footer{display:none!important}.card{box-shadow:none}.analysis{display:block}}

/* Compact laptop layout, fluid typography and accessible small-screen controls */
.wrap{width:min(100%,1180px);margin:24px auto}header{padding:12px 4%}h1{font-size:clamp(24px,2.6vw,34px)}.login{margin:24px auto;max-width:1000px}.hero{padding:36px}.hero h1{font-size:clamp(29px,3.5vw,42px)}.hero .orb{margin:24px 0;padding:18px}.form{padding:28px 36px}.card{padding:24px}.tabs{margin:16px 0}.layout{grid-template-columns:minmax(0,1fr) 250px;gap:18px}.option{padding:12px;margin:9px 0}.footer{padding:15px 0}.metrics{margin:20px 0}.certificate-preview{background:#faf7ee;border:1px solid #d8c397;padding:15px;border-radius:12px}.certificate-preview svg{display:block;width:100%;height:auto}.cert-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.verify-status{padding:22px;border-radius:12px;background:#eef8f4;margin-top:20px}body{overflow-wrap:anywhere}.row>*{min-width:0}.card{min-width:0}.login{width:calc(100% - 32px)}
@media(min-width:801px) and (max-height:800px){header{padding:9px 4%}.wrap{margin:18px auto}.hero{padding:25px 32px}.hero .orb{margin:17px 0;padding:15px}.hero h1{font-size:34px}.form{padding:22px 30px}.form .field{margin:12px 0 4px}.form .notice{margin-top:14px!important;padding:10px 14px}.card{padding:20px}.option{padding:10px;margin:8px 0}.tabs{margin:12px 0}h2{font-size:21px}footer{padding:10px 24px}.login{margin:18px auto}}
@media(max-width:800px){.layout,.analysis{grid-template-columns:1fr}.hero{padding:22px}.hero h1{margin:8px 0}.hero p{margin:8px 0}.form{padding:24px}.login{margin:16px auto}.layout aside .card{flex-wrap:wrap}.layout aside .navigator{display:block;width:100%}.navigator hr,.navigator h3,.navigator .progress,.navigator>.tiny,.navigator>p{display:none}.navigator .grid{grid-template-columns:repeat(12,1fr);gap:5px;margin:7px 0 0}.qnav{padding:6px 0;font-size:11px}.card{padding:18px}.person{gap:7px}.person button{font-size:12px;padding:8px}.brand{font-size:20px}.sub{font-size:9px}.avatar{width:35px;height:35px}.tabs{gap:5px}.tabs button{font-size:12px;padding:10px 9px}.reviewitem{align-items:flex-start}.reviewitem button{padding:8px}.score{width:120px;height:120px;font-size:28px}.certificate-preview{padding:4px}}
@media(max-width:380px){.avatar{display:none}.metric strong{font-size:17px}.tabs button{font-size:11px}.navigator .grid{grid-template-columns:repeat(6,1fr)}}

/* ICI identity: colours sampled from the-ici.com/css/style.css. */
:root{--ink:#202323;--muted:#5c656b;--teal:#b82f13;--line:#e2e4e2;--bg:#f8f7f4;--orange:#ff5733;--green:#18a577;--blue:#4c7bcb;--gold:#eec857}
body{font-family:Montserrat,Arial,sans-serif}.site-strip{display:flex;justify-content:space-between;gap:12px;background:#187b59;color:#fff;padding:7px 4%;font-size:10px;font-weight:700;letter-spacing:1px}.site-strip a{color:white;text-decoration:none;letter-spacing:0}.brand{color:#202323;text-decoration:none;font-size:30px;font-weight:850;letter-spacing:-1px}.brand span{color:#b82f13}.brand .brand-label{font-size:16px;letter-spacing:0;font-weight:650;color:#303535}.brand-divider{font-weight:400}.sub{font-size:9px;letter-spacing:1.2px}.hero{background:#1a1a1a;background-image:radial-gradient(ellipse at 100% 0%,#472f25 0,transparent 65%);border-top:5px solid var(--orange)}.hero .eyebrow{color:#f6cd65}.hero p{color:#e1ded9}.hero .orb{background:#292d2b;border:1px solid #575747;border-left:5px solid var(--gold);transform:none;box-shadow:10px 10px 0 #ff573320}.hero .orb h2{color:white}.hero .tiny{color:#e7dfcf}.primary{background:#b82f13;border-color:#b82f13;color:#fff}.primary:hover{background:#94240d;border-color:#94240d}.pill{background:#fff0e8;color:#a83118}.eyebrow{color:#ac3018}.notice{background:#fff3e8;color:#704024;border-left:3px solid #eec857}.tabs .active{background:#242c29;border-color:#242c29}.option:has(input:checked){background:#fff4ed;border-color:#b82f13;box-shadow:inset 3px 0 #ff5733}.option input{accent-color:#b82f13}.letter{color:#626969}.qnav.answered{background:#e4f3eb;color:#185b40;border-color:#a4cdb8}.qnav.current{outline-color:#b82f13}.qnav.flag:after{color:#966b00}.progress>i{background:#187b59}.drop{background:#fff9f2;border-color:#b58d54}.chip{background:#fff2e6;border-color:#d5b394;color:#5f3d20}.chip[aria-pressed=true]{background:#b82f13;border-color:#b82f13;color:white}.score{background:#edf6ee;border-color:#187b59}.verify-status{background:#edf6ee}.card{box-shadow:0 5px 24px #35271904;border-radius:13px}.metric{border-top:3px solid #ff5733}.metric:nth-child(2){border-top-color:#4c7bcb}.metric:nth-child(3){border-top-color:#18a577}#clock{color:#202b28}#clock.danger,.danger{color:#b52b24}.certificate-preview{background:#fdfbf6;border-color:#c4ad70}#toast{background:#252e2a}:focus-visible{outline-color:#2263a3}header{border-bottom:3px solid transparent;border-image:linear-gradient(to right,#eec857 25%,#ff5733 25% 50%,#4c7bcb 50% 75%,#18a577 75%) 1}
@media(max-width:600px){.site-strip>span{display:none}.site-strip{justify-content:flex-end;padding:5px 16px}.brand{font-size:26px}.brand .brand-label{font-size:12px}.brand-divider{font-size:16px}.sub{font-size:7px;letter-spacing:.5px}header{padding:12px}.person button{font-size:11px;padding:8px}.wrap{padding:0 12px}.hero h1{font-size:28px}}

/* Requested refinements to the original ICI design, from annotated screenshots. */
.site-strip{background:#FF5733;color:#281b16}.site-strip a{color:#281b16}.hero{background:#fff1e8;background-image:radial-gradient(ellipse at 100% 0,#ffe2d2 0,transparent 70%);color:#2d2927;border-top:5px solid #FF5733}.hero h1,.hero .orb h2{color:#2d2927}.hero p{color:#66554c}.hero .eyebrow{color:#a4381d}.hero .tiny{color:#66554c}.hero .orb{background:#fffaf6;border:1px solid #edcebd;border-left:5px solid #FF5733;box-shadow:10px 10px 0 #ff573312}.hero .orb p{color:#66554c}.form>.eyebrow{color:#FF5733}.person button{background:#FF5733;color:#281b16;border-color:#FF5733;font-weight:750}.person button:hover{background:#ff785b;border-color:#ff785b;color:#281b16}.brand-logo{display:inline-block;vertical-align:middle;width:52px;height:38px;object-fit:contain}.brand-logo-slot{display:inline-flex;align-items:center;gap:4px}
@media(max-width:600px){.brand-logo{width:42px;height:32px}}

/* Soft peach theme based on #FF5733; requested original layout retained. */
:root{--teal:#a3422b;--bg:#fffaf7;--line:#efdfd7;--muted:#74645e}
body{background:#fffaf7}.site-strip{background:#FF5733;color:#291c16}.site-strip a{color:#291c16}header{border-image:none;border-bottom:2px solid #ffd4c2}.logo-header{display:flex;align-items:center;gap:14px}.official-logo{display:block;width:54px;height:78px;object-fit:contain}.logo-header .brand-label{font-size:23px;font-weight:750;letter-spacing:-.5px}.logo-header .sub{margin-top:4px;font-size:9px}.hero{background:#fff5ee;background-image:none;border-top-color:#ffc0a8}.hero .eyebrow{color:#a64a31}.hero .orb{background:#fffaf6;border-color:#f0d9cb;border-left-color:#ffa183;box-shadow:10px 10px 0 #ff573309}.hero .orb h2{color:#45352e}.hero p,.hero .tiny{color:#766157}.primary,.person button{background:#ffb49b;border-color:#ffb49b;color:#3c251d;font-weight:750;box-shadow:none}.primary:hover,.person button:hover{background:#ffa184;border-color:#ffa184;color:#3c251d}.tabs .active{background:#ffdacb;color:#623525;border-color:#ffbc9f}.eyebrow{color:#ad4c31}.form>.eyebrow{color:#FF5733}.pill{background:#fff0e7;color:#914630;border-color:#f8d3bf}.notice{background:#fff3e9;border-left-color:#ffb296;color:#704936}.option:has(input:checked){background:#fff2e9;border-color:#ffb49b;box-shadow:inset 3px 0 #ffa386}.option input{accent-color:#bf593e}.progress{background:#f5e8df}.progress>i{background:#ffac8b}.qnav.answered{background:#ffe9dd;color:#76432f;border-color:#f8c7ad}.qnav.current{outline-color:#e98562}.qnav.flag:after{color:#9d6829}.score{background:#fff2e9;border-color:#ffb296;color:#573629}.verify-status{background:#fff2e9}.metric,.metric:nth-child(2),.metric:nth-child(3){border-top-color:#ffbb9e}.drop{background:#fff8f2;border-color:#f1bda1}.chip{background:#fff0e5;border-color:#efc5ac;color:#75422c}.chip[aria-pressed=true]{background:#ffd1b9;color:#62331f;border-color:#f0aa88}dialog{background:#fffaf6;border:1px solid #f2dacc;box-shadow:0 20px 80px #5d35251c}dialog::backdrop{background:#6d4b3c40}dialog .eyebrow{color:#ad4c31}#toast{background:#694837}#clock{color:#523b33}.certificate-preview{background:#fffbf6;border-color:#efd6c3}:focus-visible{outline-color:#b35b3d}
@media(min-width:801px) and (max-height:800px){.official-logo{width:43px;height:62px}}
@media(max-width:600px){.official-logo{width:38px;height:56px}.logo-header{gap:8px}.logo-header .brand-label{font-size:17px}.logo-header .sub{font-size:7px;max-width:165px}.person .avatar{display:none}header{padding:10px 12px;gap:8px}}

/* Extracted layout utilities: no inline styles are required. */
.util-1{margin:12px 0}
.util-2{width:100%}
.util-3{margin-top:22px}
.util-4{margin:24px 0}
.util-5{border:0;border-top:1px solid var(--line);margin:24px 0}
.util-6{margin-top:25px}
.util-7{gap:35px}
.util-8{margin-top:24px}
.util-9{max-width:780px}
.util-10{margin-top:16px}
.util-11{margin-top:20px}
.width-0{width:0%}.width-1{width:1%}.width-2{width:2%}.width-3{width:3%}.width-4{width:4%}.width-5{width:5%}.width-6{width:6%}.width-7{width:7%}.width-8{width:8%}.width-9{width:9%}.width-10{width:10%}.width-11{width:11%}.width-12{width:12%}.width-13{width:13%}.width-14{width:14%}.width-15{width:15%}.width-16{width:16%}.width-17{width:17%}.width-18{width:18%}.width-19{width:19%}.width-20{width:20%}.width-21{width:21%}.width-22{width:22%}.width-23{width:23%}.width-24{width:24%}.width-25{width:25%}.width-26{width:26%}.width-27{width:27%}.width-28{width:28%}.width-29{width:29%}.width-30{width:30%}.width-31{width:31%}.width-32{width:32%}.width-33{width:33%}.width-34{width:34%}.width-35{width:35%}.width-36{width:36%}.width-37{width:37%}.width-38{width:38%}.width-39{width:39%}.width-40{width:40%}.width-41{width:41%}.width-42{width:42%}.width-43{width:43%}.width-44{width:44%}.width-45{width:45%}.width-46{width:46%}.width-47{width:47%}.width-48{width:48%}.width-49{width:49%}.width-50{width:50%}.width-51{width:51%}.width-52{width:52%}.width-53{width:53%}.width-54{width:54%}.width-55{width:55%}.width-56{width:56%}.width-57{width:57%}.width-58{width:58%}.width-59{width:59%}.width-60{width:60%}.width-61{width:61%}.width-62{width:62%}.width-63{width:63%}.width-64{width:64%}.width-65{width:65%}.width-66{width:66%}.width-67{width:67%}.width-68{width:68%}.width-69{width:69%}.width-70{width:70%}.width-71{width:71%}.width-72{width:72%}.width-73{width:73%}.width-74{width:74%}.width-75{width:75%}.width-76{width:76%}.width-77{width:77%}.width-78{width:78%}.width-79{width:79%}.width-80{width:80%}.width-81{width:81%}.width-82{width:82%}.width-83{width:83%}.width-84{width:84%}.width-85{width:85%}.width-86{width:86%}.width-87{width:87%}.width-88{width:88%}.width-89{width:89%}.width-90{width:90%}.width-91{width:91%}.width-92{width:92%}.width-93{width:93%}.width-94{width:94%}.width-95{width:95%}.width-96{width:96%}.width-97{width:97%}.width-98{width:98%}.width-99{width:99%}.width-100{width:100%}
/* Exact sampled reference orange: RGB(255,94,20), #FF5E14 */
:root{--brand:#FF5E14;--brand-soft:#fff0e7;--brand-pale:#fff8f3}
.site-strip{background:var(--brand)}.primary,.person button{background:var(--brand);border-color:var(--brand);color:#2c1a11}.primary:hover,.person button:hover{background:#ff773b;border-color:#ff773b;color:#2c1a11}.form>.eyebrow{color:var(--brand)}.hero{background:var(--brand-pale);border-top-color:var(--brand)}.hero .orb{border-left-color:var(--brand)}.progress>i{background:var(--brand)}.score{border-color:var(--brand);background:var(--brand-soft)}.tabs .active{background:var(--brand-soft);border-color:#ffb48a;color:#813512}.qnav.answered{background:var(--brand-soft);border-color:#ffc39f;color:#7d3c1b}.qnav.current{outline-color:var(--brand)}
/* Requested white labels on exact brand-orange surfaces. */
.site-strip,.site-strip a,.primary,.person button,.primary:hover,.person button:hover{color:#fff}

/* Active question: exact brand orange with a visible white number. */
.qnav.current,.qnav.current:hover,.qnav.current.answered{background:#FF5E14;border-color:#FF5E14;outline-color:#FF5E14;color:#fff}
