:root{--gold:#C9A25E;--black:#0D0D0D;--gray:#333333;--muted:#626262;--line:#DFE3E5;--light:#F2F2F2;--beige:#F7F1E6;--white:#FFFFFF;--radius:12px;--space:8px}*{box-sizing:border-box}body{margin:0;background:#fafaf8;color:var(--gray);font-family:Arial,sans-serif;font-size:16px;line-height:1.5}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,input:focus-visible{outline:3px solid #92702e;outline-offset:4px}header{height:98px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 4.5%;background:white;border-bottom:1px solid var(--line)}.brand{background:none;border:0;padding:0}.brand img{width:216px;display:block}.header-label{font-size:11px;letter-spacing:2px;display:flex;align-items:center;gap:16px}.header-label i{height:20px;width:1px;background:var(--gold)}.text-btn{border:0;background:none;color:var(--gray);padding:10px}.text-btn:hover{color:#856323}main{max-width:1320px;margin:auto;padding:42px 48px 60px}.eyebrow{font-size:11px;font-weight:bold;letter-spacing:2px;text-transform:uppercase;color:#846127}.pill{display:inline-flex;padding:6px 12px;border:1px solid #e2d5bd;border-radius:30px;background:var(--beige);font-size:12px;color:#725320;gap:8px}.hero{display:grid;grid-template-columns:1.18fr 1fr;min-height:490px;border:1px solid var(--line);background:white;overflow:hidden;border-radius:16px}.hero-copy{padding:50px 42px}.hero h1{font-size:58px;line-height:1.06;letter-spacing:-2px;margin:24px 0}.hero h1 span{color:#a87c31}.lead{font-size:18px;color:var(--muted);max-width:490px}.hero-art{position:relative;background:#161616 url('industry.jpg') center/cover;min-height:400px;color:white;display:flex;align-items:flex-end;padding:32px}.hero-art:before{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.88),transparent 85%)}.art-note{position:relative;border-left:2px solid var(--gold);padding-left:20px}.art-note strong{font-size:24px}.art-note p{font-size:14px;color:#eee}.primary,.secondary{border-radius:7px;padding:14px 22px;font-weight:bold;display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:50px}.primary{background:var(--gold);color:var(--black);border:1px solid var(--gold)}.primary:hover{background:#d6b77f}.secondary{background:white;border:1px solid var(--line);color:var(--gray)}.secondary:hover{border-color:var(--gold);background:var(--beige)}.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:28px}.facts{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:12px;background:white;margin-top:24px}.fact{padding:24px 30px;border-right:1px solid var(--line);display:flex;gap:18px;align-items:center}.fact:last-child{border:0}.fact b{font-size:27px;color:#a87c31}.fact span{font-size:13px;color:var(--muted)}.section-head{display:flex;justify-content:space-between;align-items:end;margin:30px 0 22px;gap:20px}h1{font-size:38px;letter-spacing:-1px;line-height:1.15;margin:14px 0}h2{font-size:25px;line-height:1.2;margin:14px 0}h3{font-size:19px;margin:8px 0}p{margin:12px 0}.muted{color:var(--muted)}.small{font-size:13px}.roles{display:grid;grid-template-columns:1fr 1fr;gap:24px}.card{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:30px}.role{position:relative;transition:.2s}.role:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:0 8px 24px #00000008}.hex{width:50px;height:54px;clip-path:polygon(50% 0,95% 25%,95% 75%,50% 100%,5% 75%,5% 25%);background:var(--beige);color:#9c742e;display:grid;place-items:center;font-size:22px;font-weight:bold;margin-bottom:24px}.role p{min-height:50px}.role ul{padding-left:18px;font-size:14px;color:var(--muted);line-height:2}.role .primary{width:100%;justify-content:space-between;margin-top:20px}.full-route{display:flex;justify-content:space-between;align-items:center;margin-top:24px;padding:22px 30px;border-radius:12px;background:var(--beige);gap:20px}.footer{display:flex;justify-content:space-between;color:#747474;font-size:11px;letter-spacing:.5px;margin-top:32px;gap:20px}.crumbs{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--muted);margin-bottom:28px}.crumbs button{background:none;border:0;color:inherit;padding:0}.map-layout{display:grid;grid-template-columns:260px 1fr;gap:30px}.sidebar{background:var(--black);color:white;border-radius:12px;padding:28px;height:fit-content}.sidebar .eyebrow{color:var(--gold)}.sidebar p{font-size:14px;color:#c7c7c7}.sidebar hr{border:0;border-top:1px solid #444;margin:26px 0}.progress{height:6px;background:#e6e3dd;border-radius:8px;overflow:hidden;margin:12px 0}.progress>div{background:var(--gold);height:100%;transition:width .4s}.sidebar .progress{background:#444}.timeline{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin:22px 0 30px}.step{font-size:10px;line-height:1.35;border-top:2px solid var(--line);padding-top:12px}.step b{display:block;color:#9d7839;font-size:12px;margin-bottom:8px}.step.active{border-color:var(--gold)}.mission-row{display:flex;justify-content:space-between;gap:20px;align-items:center}.mission-row+.mission-row{margin-top:14px}.mission-meta{display:flex;gap:18px;margin-top:18px;font-size:12px;color:var(--muted)}.locked{background:transparent;border-style:dashed;opacity:.7}.topline{display:flex;align-items:center;justify-content:space-between;gap:20px}.indicators{display:flex;gap:16px}.indicator{font-size:10px;letter-spacing:1px}.indicator b{display:block;font-size:17px;letter-spacing:0}.mission-layout{display:grid;grid-template-columns:1fr 290px;gap:28px;margin-top:24px}.scenario{background:var(--beige);border-left:3px solid var(--gold);border-radius:0 9px 9px 0;padding:20px 24px;margin:24px 0}.scenario p{margin-bottom:0}.options{display:grid;gap:12px}.option{display:flex;align-items:center;gap:16px;text-align:left;width:100%;padding:17px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--gray)}.option .letter{flex-shrink:0;border:1px solid #ccc;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px}.option:hover:not(:disabled){border-color:var(--gold)}.option.selected{border-color:#9a742f;background:var(--beige)}.option.selected .letter{background:var(--gold);border-color:var(--gold);color:var(--black)}.option.correct{border:2px solid #427756;background:#f1f6f2}.option.wrong{border:2px solid #a35047;background:#fbf2f0}.side-note{font-size:14px}.side-note .card{padding:24px}.side-note h3{font-size:16px}.score{font-size:44px;color:var(--black);line-height:1}.reference{border:1px solid #dbc69d;color:#745621;border-radius:7px;background:var(--beige);padding:12px 15px;text-align:left;width:100%;margin-top:16px}.form{border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:20px 0}.form-head{padding:14px 18px;background:var(--black);color:white;display:flex;justify-content:space-between;font-size:11px;letter-spacing:1px}.field{width:100%;background:white;border:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 1.2fr;text-align:left;padding:12px 16px;font-size:13px;color:var(--gray);gap:12px}.field:nth-child(odd){background:var(--light)}.field.selected{background:var(--beige);box-shadow:inset 4px 0 var(--gold)}.field:disabled{opacity:1}.field span:first-child{font-weight:bold}.feedback{padding:24px;border:1px solid #87a792;background:#f3f7f4;border-radius:10px;margin-top:24px}.feedback.error{background:#fcf5f1;border-color:#c28f70}.feedback h3{margin-top:0}.critical{font-size:11px;font-weight:bold;letter-spacing:1px;color:#9c412d;margin:12px 0}.feedback .small{color:#626262}.backdrop{position:fixed;inset:0;background:#0007;z-index:9}.drawer{position:fixed;right:0;top:0;height:100%;width:min(480px,100%);padding:40px;background:white;z-index:10;overflow:auto;box-shadow:-10px 0 50px #0002}.drawer h2{margin:35px 0 20px}.close{position:absolute;right:20px;top:20px;border:1px solid var(--line);background:white;width:36px;height:36px;border-radius:50%;font-size:22px}.source-box{padding:22px;background:var(--beige);border-left:3px solid var(--gold);margin:22px 0}.result{max-width:860px;margin:0 auto}.result-hero{background:var(--black);color:white;padding:38px;border-radius:12px;display:flex;justify-content:space-between;align-items:center;gap:20px}.result-hero h1{font-size:32px}.result-score{font-size:64px;color:var(--gold);white-space:nowrap}.result-score small{font-size:18px;color:#aaa}.review{margin-top:20px}.review summary{cursor:pointer;font-weight:bold}.review-item{border-top:1px solid var(--line);padding:20px 0}.tokens{display:flex;gap:10px;flex-wrap:wrap}.swatch{padding:14px;background:var(--light);border-radius:6px;font-size:12px}.swatch i{display:block;width:40px;height:25px;margin-bottom:8px;border:1px solid #ddd}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#222;color:white;padding:12px 20px;border-radius:8px;z-index:20;display:none}.storage-warning{background:#fff1dc;padding:10px;text-align:center;font-size:13px}@media(max-width:1000px){.header-label{display:none}.hero h1{font-size:46px}.hero-copy{padding:35px}.timeline{grid-template-columns:repeat(4,1fr)}.map-layout{grid-template-columns:210px 1fr}.mission-layout{grid-template-columns:1fr 230px}main{padding:30px 24px}}@media(max-width:700px){header{height:78px;padding:0 20px}.brand img{width:160px}.hero,.roles,.map-layout,.mission-layout{grid-template-columns:1fr}.hero-art{min-height:240px}.hero-copy{padding:28px}.hero h1{font-size:42px}.facts{grid-template-columns:1fr}.fact{border:0;border-bottom:1px solid var(--line);padding:16px 24px}.full-route,.section-head,.topline{align-items:flex-start;flex-direction:column}.sidebar{display:none}.timeline{grid-template-columns:repeat(4,1fr)}.mission-row{align-items:flex-start;flex-direction:column}.card{padding:22px}.side-note{order:-1}.side-note .card{display:flex;align-items:center;justify-content:space-between;gap:16px}.side-note .card p{display:none}.side-note .card .reference{width:auto;margin:0}.score{font-size:28px}h1{font-size:30px}.result-hero{padding:24px;align-items:flex-start;flex-direction:column}.footer{flex-direction:column}.field{grid-template-columns:1fr 1fr}.indicators{gap:30px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Revision 2: explicit full-width layout and readable status labels. */
body #app{display:block;width:100%;min-width:0}
body #app>main{display:block;width:100%;max-width:1320px;margin:0 auto;min-width:0;float:none;position:static}
body #app .mission-layout{display:grid;width:100%;grid-template-columns:minmax(0,1fr) 290px;grid-template-areas:"question result";align-items:start;justify-items:stretch;gap:28px}
body #app .mission-layout>section{grid-area:question;display:block;min-width:0;width:100%;margin:0;float:none}
body #app .mission-layout>.side-note{grid-area:result;min-width:0;width:100%;margin:0}
.mission-layout .topline>.small{white-space:nowrap;flex-shrink:0}
.topline>div:first-child{min-width:0}
.simulation-status{flex:0 0 auto;padding:14px 18px;border:1px solid var(--line);border-radius:10px;background:white}
.status-caption{font-size:11px;color:var(--muted);display:block;margin-bottom:10px;letter-spacing:0}
.simulation-status .indicators{display:grid;grid-template-columns:repeat(3,minmax(72px,1fr));gap:18px}
.simulation-status .indicator{white-space:nowrap;font-size:10px;letter-spacing:1px}
.simulation-status .indicator b{font-size:22px;line-height:1.4;white-space:nowrap}
.course-footer{display:flex;width:100%;min-width:0;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px 32px;padding:24px 0 0;margin-top:36px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;line-height:1.7}
.course-footer>div{display:grid;gap:2px}
.course-footer strong{font-size:13px;color:var(--gray)}
.course-footer>span{max-width:100%}
header .header-label{display:flex;flex-direction:column;align-items:flex-start;gap:5px;font-size:10px;letter-spacing:1px;line-height:1.6}
.header-label span{font-size:12px;letter-spacing:.2px;color:var(--muted)}
.brand{display:flex;flex-direction:column;align-items:center;flex-shrink:0}
.brand-mark{display:block;width:216px;height:47px;overflow:hidden}
.brand-mark img{width:216px;height:auto}
.brand-descriptor{font-family:Arial,sans-serif;font-size:8px;letter-spacing:2px;color:var(--black);line-height:1.5;margin-top:3px;white-space:nowrap}
@media(max-width:1100px){header{padding:0 24px;gap:18px}header .header-label{max-width:390px;letter-spacing:.5px}body #app .mission-layout{grid-template-columns:minmax(0,1fr) 250px}.topline{flex-wrap:wrap}.simulation-status{max-width:100%}}
@media(max-width:800px){header{height:auto;min-height:98px;flex-wrap:wrap;padding:16px 20px}header .header-label{order:3;flex-basis:100%;max-width:none;border-top:1px solid var(--line);padding-top:10px}.brand-mark{width:180px;height:39px}.brand-mark img{width:180px}.brand-descriptor{font-size:7px;letter-spacing:1.4px}body #app .mission-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"question" "result"}.side-note{order:initial}.side-note .card{display:block}.side-note .card p{display:block}.side-note .card .reference{width:100%;margin-top:16px}.simulation-status{width:100%}.simulation-status .indicators{grid-template-columns:repeat(3,minmax(0,1fr))}.course-footer{align-items:flex-start;flex-direction:column;gap:10px}.field{overflow-wrap:anywhere}}

/* Full logo symbol; mask only the superseded descriptor beside the symbol. */
header .brand-mark{position:relative;width:216px;height:auto;aspect-ratio:613 / 174;overflow:visible}
header .brand-mark img{display:block;width:100%;height:auto}
header .brand-mark::after{content:"";position:absolute;left:28%;right:0;top:73%;bottom:0;background:#fff}
header .brand-descriptor{margin-top:2px}
@media(max-width:800px){header .brand-mark{width:180px;height:auto}}

.mission-entry{display:flex;flex-direction:column;align-items:stretch;gap:8px;flex-shrink:0;max-width:100%}.resume-note{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--beige);border:1px solid #e2d5bd;border-radius:8px;padding:10px 16px;margin:18px 0 12px;font-size:13px}.resume-note .text-btn{font-size:13px;text-decoration:underline}
