/* Course-local Jeongbo-aligned layout: navy branding, light cards, isolated selectors. */
:is(body.alzio-csts,body.alzio-int){margin:0;color:#172b45;background:#f3f6fa;font:16px/1.7 system-ui,-apple-system,"Malgun Gothic",sans-serif;--accent:#6542b4;--bright:#d4c6ff;--tint:#f0ebfa;--ink:#172b45;--line:#dce4ef;color-scheme:light}
body.alzio-int{--accent:#126b60;--bright:#86e4d6;--tint:#e8f5f1}
:is(body.alzio-csts,body.alzio-int) *,:is(body.alzio-csts,body.alzio-int) *::before,:is(body.alzio-csts,body.alzio-int) *::after{box-sizing:border-box}
:is(body.alzio-csts,body.alzio-int) a{color:var(--accent);text-decoration:none;text-underline-offset:4px}
:is(body.alzio-csts,body.alzio-int) a:hover{text-decoration:underline}
:is(body.alzio-csts,body.alzio-int) header{background:#081528;border-bottom:1px solid #ffffff1f;color:#fff}
:is(body.alzio-csts,body.alzio-int) .head-inner{width:min(1240px,calc(100% - 40px));min-height:78px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px}
:is(body.alzio-csts,body.alzio-int) .brand{display:flex;gap:12px;align-items:center;color:#fff;font-size:16px;font-weight:800}
:is(body.alzio-csts,body.alzio-int) .brand small{display:block;color:#a9bed8;font-size:11px;letter-spacing:.08em}
:is(body.alzio-csts,body.alzio-int) .brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--accent);color:#fff;box-shadow:0 4px 14px #0004;font-size:22px}
:is(body.alzio-csts,body.alzio-int) .head-links{display:flex;gap:10px;flex-wrap:wrap}
:is(body.alzio-csts,body.alzio-int) .head-links a{color:#e0eaf8;font-size:13px;background:#ffffff0c;border:1px solid #ffffff25;border-radius:8px;padding:8px 14px}
:is(body.alzio-csts,body.alzio-int) main{padding-bottom:50px}
:is(body.alzio-csts,body.alzio-int) .hero{padding:54px 0 58px;background:radial-gradient(circle at 85% 20%,#a080ef30,transparent 38%),radial-gradient(circle at 12% 85%,#19789b20,transparent 42%),linear-gradient(135deg,#07152b,#0d2242 50%,#152d52);color:#fff;border-bottom:1px solid #ffffff1a}
body.alzio-int .hero{background:radial-gradient(circle at 85% 20%,#43c2a92b,transparent 38%),radial-gradient(circle at 12% 85%,#b8774524,transparent 42%),linear-gradient(135deg,#07152b,#0d2242 50%,#152d52)}
:is(body.alzio-csts,body.alzio-int) .hero-inner{width:min(1240px,calc(100% - 40px));margin:auto;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,.8fr);gap:48px;align-items:center}
:is(body.alzio-csts,body.alzio-int) .hero-copy{min-width:0}
:is(body.alzio-csts,body.alzio-int) .eyebrow{display:inline-flex;padding:5px 12px;color:var(--bright);background:#ffffff0d;border:1px solid #ffffff2b;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.1em}
:is(body.alzio-csts,body.alzio-int) h1{font-size:clamp(27px,3.5vw,43px);font-weight:900;line-height:1.35;letter-spacing:-.035em;margin:19px 0 18px;word-break:keep-all;overflow-wrap:anywhere}
:is(body.alzio-csts,body.alzio-int) .hero p{font-size:14px;color:#c9d8ea;margin:12px 0;word-break:keep-all;overflow-wrap:anywhere}
:is(body.alzio-csts,body.alzio-int) .hero-actions{display:flex;gap:12px;margin-top:25px;flex-wrap:wrap}
:is(body.alzio-csts,body.alzio-int) .hero-actions a{padding:12px 22px;background:var(--bright);color:#13213c;border-radius:10px;font-weight:800;box-shadow:0 8px 24px #0003}
:is(body.alzio-csts,body.alzio-int) .course-overview{background:#ffffff08;border:1px solid #ffffff29;border-radius:18px;padding:26px;box-shadow:0 15px 40px #0002}
:is(body.alzio-csts,body.alzio-int) .course-overview h2{font-size:15px;color:#edf4ff;margin:0 0 17px}
:is(body.alzio-csts,body.alzio-int) .overview-row{display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid #ffffff1f;padding:13px 0}
:is(body.alzio-csts,body.alzio-int) .overview-row span{color:#b6c9e1;font-size:13px}
:is(body.alzio-csts,body.alzio-int) .overview-row strong{color:#fff;font-size:20px}
:is(body.alzio-csts,body.alzio-int) .overview-note{font-size:12px!important;color:#b6c9e1!important;margin-bottom:0!important}
:is(body.alzio-csts,body.alzio-int) .section-head{width:min(1240px,calc(100% - 40px));margin:46px auto 24px;display:flex;gap:20px;align-items:end;justify-content:space-between}
:is(body.alzio-csts,body.alzio-int) .section-head h2{font-size:28px;margin:0 0 5px;letter-spacing:-.03em}
:is(body.alzio-csts,body.alzio-int) .section-head p{font-size:14px;color:#55677d;margin:0}
:is(body.alzio-csts,body.alzio-int) .section-label{font-size:12px;letter-spacing:.12em;font-weight:800;color:var(--accent)}
:is(body.alzio-csts,body.alzio-int) .cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;width:min(1240px,calc(100% - 40px));margin:auto}
:is(body.alzio-csts,body.alzio-int) .card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px;min-width:0;display:flex;flex-direction:column;box-shadow:0 4px 15px #10244305;transition:transform .2s,box-shadow .2s,border-color .2s;position:relative;overflow:hidden}
:is(body.alzio-csts,body.alzio-int) .card::before{content:"";height:4px;position:absolute;inset:0 0 auto;background:var(--accent);opacity:.85}
:is(body.alzio-csts,body.alzio-int) .card:hover{transform:translateY(-4px);box-shadow:0 15px 35px #10244312;border-color:var(--accent)}
:is(body.alzio-csts,body.alzio-int) .number{font-size:12px;font-weight:900;background:var(--tint);color:var(--accent);padding:6px 10px;border-radius:7px;align-self:start}
:is(body.alzio-csts,body.alzio-int) .card small{color:#64758b;font-size:12px;margin-top:13px}
:is(body.alzio-csts,body.alzio-int) .card h2{font-size:18px;line-height:1.5;margin:9px 0 12px;word-break:keep-all}
:is(body.alzio-csts,body.alzio-int) .card p{font-size:13px;color:#586b81;line-height:1.8;margin:0 0 15px;flex:1}
:is(body.alzio-csts,body.alzio-int) .card a{display:block;padding:11px 14px;background:var(--accent);color:#fff;font-size:13px;font-weight:800;border-radius:8px;text-align:center}
:is(body.alzio-csts,body.alzio-int) #quiz-app{width:min(1240px,calc(100% - 40px));min-height:420px;margin:30px auto 0}
:is(body.alzio-csts,body.alzio-int) .status{display:flex;gap:24px;align-items:center;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 24px;margin-bottom:24px;box-shadow:0 3px 14px #10244305}
:is(body.alzio-csts,body.alzio-int) .status span{font-size:13px;font-weight:700;color:#4d617a}
:is(body.alzio-csts,body.alzio-int) .status progress{flex:1;min-width:80px;height:8px;accent-color:var(--accent)}
:is(body.alzio-csts,body.alzio-int) #clock{font-size:23px;color:var(--accent);font-variant-numeric:tabular-nums}
:is(body.alzio-csts,body.alzio-int) .workspace{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:24px;align-items:start}
:is(body.alzio-csts,body.alzio-int) .question,:is(body.alzio-csts,body.alzio-int) .workspace aside,:is(body.alzio-csts,body.alzio-int) .result{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 5px 20px #10244305;min-width:0}
:is(body.alzio-csts,body.alzio-int) .question{padding:34px}
:is(body.alzio-csts,body.alzio-int) .question>p{font-size:12px;color:var(--accent);font-weight:800;letter-spacing:.04em;margin:0 0 17px}
:is(body.alzio-csts,body.alzio-int) #question-heading{font-size:clamp(20px,2vw,25px);line-height:1.65;font-weight:800;letter-spacing:-.025em;margin:0 0 27px;white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal}
:is(body.alzio-csts,body.alzio-int) .choices{display:grid;gap:12px}
:is(body.alzio-csts,body.alzio-int) button,:is(body.alzio-csts,body.alzio-int) input{font:inherit;max-width:100%;border-radius:9px}
:is(body.alzio-csts,body.alzio-int) button{padding:11px 17px;min-height:46px;background:#f7f9fc;border:1px solid #cbd6e5;color:#213854;font-weight:700;cursor:pointer}
:is(body.alzio-csts,body.alzio-int) button:hover{background:#edf2fa;border-color:#8d9eb7}
:is(body.alzio-csts,body.alzio-int) button:disabled{cursor:default;opacity:.7}
:is(body.alzio-csts,body.alzio-int) .choice{background:#fff;border:1px solid #d4deeb;text-align:left;white-space:pre-wrap;overflow-wrap:anywhere;padding:16px 18px;line-height:1.75;font-size:16px;font-weight:500;min-height:60px}
:is(body.alzio-csts,body.alzio-int) .choice span{font-weight:900;color:var(--accent)}
:is(body.alzio-csts,body.alzio-int) .choice.selected{border:2px solid var(--accent);padding:15px 17px;background:var(--tint);opacity:1}
:is(body.alzio-csts,body.alzio-int) .choices:has(+.feedback.correct) .choice.selected{border-color:#21764c;background:#eef8f1}
:is(body.alzio-csts,body.alzio-int) .choices:has(+.feedback.incorrect) .choice.selected{border-color:#b73645;background:#fff0f2}
:is(body.alzio-csts,body.alzio-int) .actions{display:flex;justify-content:space-between;gap:12px;margin-top:27px}
:is(body.alzio-csts,body.alzio-int) .primary{background:var(--accent);border-color:var(--accent);color:#fff;min-width:120px}
:is(body.alzio-csts,body.alzio-int) .primary:hover{background:var(--accent);filter:brightness(.92)}
:is(body.alzio-csts,body.alzio-int) .workspace aside{padding:24px;position:sticky;top:20px}
:is(body.alzio-csts,body.alzio-int) .workspace aside h2{font-size:15px;margin:0 0 18px}
:is(body.alzio-csts,body.alzio-int) .workspace aside p{font-size:12px;color:#5a6e85;line-height:1.8}
:is(body.alzio-csts,body.alzio-int) .workspace aside>button{width:100%;margin-top:9px;background:#132b4b;color:#fff}
:is(body.alzio-csts,body.alzio-int) .navigator{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}
:is(body.alzio-csts,body.alzio-int) .navigator button{padding:6px;min-height:38px;font-size:12px;background:#fff}
:is(body.alzio-csts,body.alzio-int) .navigator .answered{background:var(--tint);border-color:var(--accent);color:var(--accent)}
:is(body.alzio-csts,body.alzio-int) .navigator [aria-current]{background:#17365c;color:#fff;outline:2px solid #17365c;outline-offset:1px}
:is(body.alzio-csts,body.alzio-int) .feedback{margin-top:26px;padding:18px 20px;border:1px solid #a8d7b8;border-radius:10px;background:#eef8f1;color:#145a35}
:is(body.alzio-csts,body.alzio-int) .feedback.incorrect{border-color:#efb5bd;background:#fff0f2;color:#9b2335}
:is(body.alzio-csts,body.alzio-int) .feedback strong{font-size:17px}
:is(body.alzio-csts,body.alzio-int) .feedback p{margin:7px 0 0;color:inherit;font-weight:700}
:is(body.alzio-csts,body.alzio-int) .result{padding:26px 30px;margin-bottom:24px;border-top:4px solid var(--accent)}
:is(body.alzio-csts,body.alzio-int) .result h2{font-size:25px;margin:0 0 6px}
:is(body.alzio-csts,body.alzio-int) .result p{color:#586b81}
:is(body.alzio-csts,body.alzio-int) .result button{margin:5px 7px 0 0}
:is(body.alzio-csts,body.alzio-int) input{display:block;width:100%;margin:10px 0 14px;padding:14px;border:1px solid #b8c8dd;background:#fff;color:#172b45}
:is(body.alzio-csts,body.alzio-int) form label{font-weight:700}
:is(body.alzio-csts,body.alzio-int) footer{border-top:1px solid var(--line);padding:28px max(20px,calc((100% - 1240px)/2));font-size:12px;color:#586b81;background:#fff}
:is(body.alzio-csts,body.alzio-int) .skip{position:absolute;top:-100px}
:is(body.alzio-csts,body.alzio-int) .skip:focus{top:8px;left:8px;z-index:10;background:#fff;padding:12px;border-radius:8px}
:is(body.alzio-csts,body.alzio-int) :focus-visible{outline:3px solid #bf7800;outline-offset:4px}
@media(max-width:1100px){:is(body.alzio-csts,body.alzio-int) .cards{grid-template-columns:repeat(3,minmax(0,1fr))}:is(body.alzio-csts,body.alzio-int) .hero-inner{gap:28px;grid-template-columns:minmax(0,1.4fr) minmax(230px,.8fr)}}
@media(max-width:850px){:is(body.alzio-csts,body.alzio-int) .cards{grid-template-columns:repeat(2,minmax(0,1fr))}:is(body.alzio-csts,body.alzio-int) .hero-inner{grid-template-columns:minmax(0,1fr)}:is(body.alzio-csts,body.alzio-int) .hero{padding:35px 0}:is(body.alzio-csts,body.alzio-int) .course-overview{padding:20px}:is(body.alzio-csts,body.alzio-int) .workspace{grid-template-columns:minmax(0,1fr)}:is(body.alzio-csts,body.alzio-int) .workspace aside{position:static}:is(body.alzio-csts,body.alzio-int) .navigator{grid-template-columns:repeat(10,minmax(0,1fr))}:is(body.alzio-csts,body.alzio-int) .question{padding:26px}:is(body.alzio-csts,body.alzio-int) .head-inner{padding:16px 0;flex-wrap:wrap}:is(body.alzio-csts,body.alzio-int) h1{font-size:32px}}
@media(max-width:520px){:is(body.alzio-csts,body.alzio-int) .cards{grid-template-columns:minmax(0,1fr)}:is(body.alzio-csts,body.alzio-int) .head-inner,:is(body.alzio-csts,body.alzio-int) .hero-inner,:is(body.alzio-csts,body.alzio-int) .section-head,:is(body.alzio-csts,body.alzio-int) .cards,:is(body.alzio-csts,body.alzio-int) #quiz-app{width:calc(100% - 28px)}:is(body.alzio-csts,body.alzio-int) .head-links a{padding:7px 10px;font-size:12px}:is(body.alzio-csts,body.alzio-int) h1{font-size:27px}:is(body.alzio-csts,body.alzio-int) .section-head{margin-top:30px}:is(body.alzio-csts,body.alzio-int) .section-head h2{font-size:24px}:is(body.alzio-csts,body.alzio-int) .question{padding:21px 18px}:is(body.alzio-csts,body.alzio-int) .choice{padding:13px;font-size:15px}:is(body.alzio-csts,body.alzio-int) .choice.selected{padding:12px}:is(body.alzio-csts,body.alzio-int) .navigator{grid-template-columns:repeat(6,minmax(0,1fr))}:is(body.alzio-csts,body.alzio-int) .status{gap:12px;padding:14px}:is(body.alzio-csts,body.alzio-int) #clock{font-size:20px}:is(body.alzio-csts,body.alzio-int) .result{padding:22px 18px}:is(body.alzio-csts,body.alzio-int) .course-overview strong{font-size:18px}}
@media(prefers-reduced-motion:reduce){:is(body.alzio-csts,body.alzio-int) *,:is(body.alzio-csts,body.alzio-int) *::before,:is(body.alzio-csts,body.alzio-int) *::after{transition:none!important;scroll-behavior:auto!important}:is(body.alzio-csts,body.alzio-int) .card:hover{transform:none}}