:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color-scheme:dark;--page:#050505;--card:#101216;--soft:#161a21;--line:#2b303b;--text:#e8ecf3;--muted:#9ca9b9;--blue:#60a5fa;--good:#46b88d;--warn:#edb761;--bad:#f38b88}
*{box-sizing:border-box}body{margin:0;background:var(--page);color:var(--text);line-height:1.55}a{color:#a2c9ff}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #93c5fd;outline-offset:3px}.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link{position:absolute;top:-100px;left:15px;padding:12px;background:#fff;color:#000;z-index:101}.skip-link:focus{top:15px}.shell{width:min(1190px,calc(100% - 36px));margin:0 auto}
.site-header{border-bottom:1px solid #1e2330;background:#06070aeD;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}.header-row{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:12px;font-weight:850;font-size:16px;letter-spacing:.07em;text-decoration:none;color:#fff}.mark{width:44px;height:44px;display:grid;place-items:center;background:#14253f;border:1px solid #40689e;border-radius:12px;color:#a6cbff}.blue{color:var(--blue)}.top-links{display:flex;align-items:center;gap:22px;font-size:13px}.top-links a{text-decoration:none;color:#cad1dd}.top-links a:hover{color:#fff}.lang-toggle{display:inline-flex;align-items:center;gap:3px;padding:4px;background:#111721;border:1px solid #34445a;border-radius:12px}.lang-choice{background:transparent;color:#b5c0d1;border:0;border-radius:8px;min-width:42px;min-height:36px;padding:5px 11px;font-size:12px;font-weight:800;letter-spacing:.05em}.lang-choice[aria-pressed=true]{background:#2563b7;color:#fff;box-shadow:0 1px 8px #142b44}.lang-choice:hover:not([aria-pressed=true]){background:#202b3d;color:#fff}
.hero{padding:49px 0 33px;max-width:800px}.eyebrow{font-size:11px;font-weight:750;letter-spacing:.16em;color:var(--blue);margin:0 0 11px}.pilot{color:#9ca3af;letter-spacing:.04em;border:1px solid #3a414b;border-radius:99px;padding:3px 6px;margin-left:9px}h1{font-size:clamp(32px,4vw,49px);line-height:1.12;letter-spacing:-.035em;color:white;margin:0 0 14px;font-weight:850}.hero>p:last-child{color:#aab4c2;font-size:17px;margin:0;max-width:690px}.editorial-grid{display:grid;grid-template-columns:minmax(0,225px) minmax(0,850px);gap:39px;align-items:start}.rail{position:static;overflow:visible;display:grid;gap:11px;padding-right:0}.rail-card{border:1px solid #2c3038;background:#101217;border-radius:15px;padding:15px;display:grid;gap:8px;text-decoration:none}.rail-card h2{font-size:17px;line-height:1.25;margin:0;color:#fff}.rail-card strong{color:#fff;line-height:1.25;font-size:15px}.rail-card .eyebrow{margin:0}.muted{color:var(--muted);font-size:12px;line-height:1.5}.rail-sub{margin:0}.rail-card>a,.rail-card .link{font-size:13px;color:#9bcaff;text-decoration:none;font-weight:700}.promo{background:linear-gradient(145deg,#111f32,#11151f);border-color:#2c4465}.promo:hover{border-color:#5f9ee3}.rail-foot{color:#7d8693;font-size:11px;margin:0;padding:5px 10px}
.workspace{min-width:0;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,#13161b,#0c0e12);padding:28px;box-shadow:0 20px 70px rgba(0,0,0,.28)}.workspace-header{display:flex;justify-content:space-between;align-items:start;gap:10px}.workspace-header h2{margin:0;font-size:25px;line-height:1.2;color:#fff}.step-count{font-size:12px;color:#aeb8c6;background:#191d25;border-radius:50px;border:1px solid #303642;padding:6px 10px;white-space:nowrap}.progress-head{display:flex;justify-content:space-between;font-size:13px;color:#9cabbf;margin:22px 0 8px}.progress-head strong{color:#fff}.progress{height:7px;border-radius:30px;overflow:hidden;background:#292e38}.progress-inner{height:100%;width:0;background:#5799f1;transition:width .2s ease}.screen-intro{margin:24px 0;color:#b6c0ce;font-size:15px}.compact-intro{font-size:13px;margin:15px 0 9px}.group-note{color:#8396ad}.dimension-caption{margin:20px 0 5px;color:#89bbfa;font-size:11px;letter-spacing:.10em;text-transform:uppercase;font-weight:800}.dimension-caption:first-of-type{margin-top:15px}.field{display:grid;gap:9px;margin-bottom:18px}.field label{font-size:13px;font-weight:700;color:#e5e9f1}.field select{width:100%;border:1px solid #394353;border-radius:10px;padding:13px;background:#171b22;color:#f4f6fa;min-height:46px}.hint{font-size:12px;color:#8896a9;margin:-4px 0 0}.question{background:#0d1015;border:1px solid #2c333d;border-radius:15px;padding:16px 18px;margin-top:11px}.question-top{display:flex;gap:10px;justify-content:space-between;align-items:start}.question h3{font-size:16px;line-height:1.36;margin:0;color:#fff;font-weight:720}.question-id{flex:none;font-size:10px;border:1px solid #465369;border-radius:7px;padding:3px 7px;color:#b7c8de}.critical{font-size:11px;color:#f1b2ad;margin-top:6px}.choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin-top:14px}.choice{border:1px solid #354052;min-height:46px;min-width:0;padding:10px 4px;background:#171d27;border-radius:10px;color:#dce3ed;font-size:12px;font-weight:650}.choice:hover{border-color:#6085b8}.choice[aria-pressed=true]{background:#17375a;border-color:#78b5ff;box-shadow:inset 0 0 0 1px #78b5ff;color:#fff}.choice.low[aria-pressed=true]{background:#4f2526;border-color:#e78482}.choice.na,.choice.ne{color:#b1bdcc;background:#141821}.choice:focus-visible{outline:2px solid #aacfff}.help{margin-top:11px;border-top:1px solid #252c37;padding-top:10px}.help summary{cursor:pointer;color:#9bcaff;font-size:12px}.help p{color:#bac5d4;font-size:13px;margin:10px 0 0}.nav-actions{display:flex;justify-content:space-between;gap:12px;margin-top:25px;flex-wrap:wrap}.btn{border:1px solid #334256;border-radius:10px;background:#202734;color:#e4ecf7;min-height:44px;padding:11px 17px;font-weight:700;font-size:13px}.btn.primary{background:#2563b7;border-color:#3073cc;color:#fff}.btn:disabled{opacity:.42;cursor:not-allowed}.small-actions{display:flex;gap:10px;flex-wrap:wrap}.alert{color:#f2bc7d;background:#302416;border:1px solid #67502e;padding:13px 15px;border-radius:10px;margin-top:16px;font-size:13px}.notice{background:#122439;border:1px solid #294766;border-radius:12px;padding:14px;color:#cbdff4;font-size:13px;margin-top:17px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:23px}.stat{border:1px solid #2f3844;background:#141b25;padding:13px;border-radius:13px}.stat strong{display:block;color:#fff;font-size:25px}.stat span{color:#9eacbd;font-size:11px}.result-title{font-size:21px;margin:27px 0 3px}.dimension-row{display:grid;grid-template-columns:145px 1fr 55px;gap:10px;align-items:center;margin:12px 0;font-size:13px}.scorebar{background:#273342;border-radius:20px;height:9px;overflow:hidden}.scorebar>span{display:block;background:#60a5fa;height:100%}.finding{padding:15px 0;border-bottom:1px solid #2f3743}.finding h4{font-size:14px;margin:0 0 5px}.finding p{margin:0;color:#adbacc;font-size:13px}.finding .key{font-size:11px;color:#f3b8aa;font-weight:600;margin:0 0 4px}.footer{font-size:12px;color:#7e8a9a;margin:50px auto;padding:20px 0;border-top:1px solid #252d38}.report-only{display:none}
@media(max-width:900px){.editorial-grid{grid-template-columns:1fr;gap:24px}.workspace{order:1}.rail{order:2;position:static;max-height:unset;grid-template-columns:repeat(2,minmax(0,1fr))}.rail-foot{grid-column:1/-1}}
@media(max-width:760px){.choices{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:550px){.shell{width:min(100% - 24px,1190px)}.header-row{min-height:65px}.top-links{gap:10px}.top-links a{display:none}.top-links a:first-child{display:inline}.hero{padding:28px 0 23px}.hero>p:last-child{font-size:14px}.workspace{padding:16px;border-radius:14px}.workspace-header h2{font-size:21px}.step-count{font-size:10px}.choices{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:1fr 1fr}.dimension-row{grid-template-columns:110px 1fr 40px;font-size:11px}.rail{grid-template-columns:1fr}.question{padding:14px}.group-note{display:block;margin-top:4px}.lang-choice{min-width:38px}}
@media print{body{background:#fff!important;color:#000!important}header,.hero,.rail,.workspace-header,.progress-head,.progress,.nav-actions,.footer,.notice{display:none!important}.shell{width:100%}.editorial-grid{display:block}.workspace{border:0;box-shadow:none;padding:0;background:#fff!important}.report-only{display:block!important}.report-print-title{display:block!important;color:#000}.question,.field,.screen-intro{display:none}.result-title,.finding,.finding h4,.finding p,.stats,.stat,.stat strong,.stat span,.dimension-row,.dimension-row span{color:#000!important;border-color:#aaa!important;background:#fff!important;break-inside:avoid}.scorebar{border:1px solid #bbb;background:#ddd}.scorebar>span{background:#555}#screen>div:not(.report-content){display:none}}

/* v0.3: chart-aware setup, accessible component selection and helpful alternatives */
.components{border:1px solid #334256;border-radius:12px;padding:15px;margin:8px 0 18px;background:#111923}
.components legend{padding:0 7px;color:#e4ebf5;font-size:13px;font-weight:800}
.components .hint{margin:3px 0 12px}
.component-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.component-option{display:flex;align-items:center;gap:8px;cursor:pointer;background:#1a2432;border:1px solid #334155;border-radius:10px;padding:9px 10px;min-height:44px;font-size:12px;color:#d4e3f4}
.component-option:has(input:checked){background:#17375a;border-color:#64a7f4}
.component-option input{accent-color:#60a5fa;width:17px;height:17px;flex:none}
.advice{border:1px solid #37516f;border-radius:11px;padding:13px 15px;background:#15243a;color:#c8dbef;font-size:13px;margin:14px 0}
.advice strong{color:#a8d2ff}.advice p{margin:6px 0 0}
.help strong,.finding strong{color:#e0e8f4}.help p+p,.finding p+p{margin-top:8px}
@media(max-width:700px){.component-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:339px){.component-grid{grid-template-columns:1fr}}
@media print{.advice{color:#222;border-color:#aaa;background:#eee}.advice strong{color:#222}}
@media print{.finding strong,.finding .key{color:#000!important}.alert{background:#fff!important;color:#000!important;border:1px solid #888!important}}


/* Inherit the Studios216 visual language while keeping the tool self-contained. */
.brand img{height:48px;width:auto;max-width:82px;object-fit:contain;border-radius:8px}.brand span{letter-spacing:.04em}.top-links{gap:15px}.rail-article a{display:block;margin:.45rem 0;text-decoration:none;font-size:13px}.rail-article a:hover{text-decoration:underline}.rail .rail-foot{font-size:11px}
@media(max-width:600px){.brand img{height:44px}.brand>span{display:none}.top-links a:not(#head-tools){display:none}.top-links{gap:6px}}
@media print{.site-header,.hero,.rail,.footer{display:none!important}}


/* Match Studios216's existing article-rail product cards. */
.rail .lab-course-promo{display:block;margin:0;padding:15px;min-width:0;
  border:1px solid rgba(96,165,250,.34);border-radius:16px;
  background:linear-gradient(145deg,rgba(15,23,42,.96),rgba(17,24,39,.94));
  box-shadow:0 14px 32px rgba(0,0,0,.22);text-decoration:none}
.rail .lab-course-promo:hover{border-color:#60a5fa;background:linear-gradient(145deg,#182b49,#182131)}
.rail .lab-course-promo .article-product-promo__header{display:flex;align-items:flex-start;gap:11px;margin:0 0 9px}
.rail .lab-course-promo .article-product-promo__image{
  width:64px;height:64px;flex:none;object-fit:contain;background:#111b2b;
  border-radius:11px;border:1px solid rgba(255,255,255,.12)}
.rail .lab-course-promo .article-product-promo__heading{min-width:0}
.rail .lab-course-promo .article-product-promo__eyebrow{
  color:#60a5fa;font-size:10px;font-weight:800;line-height:1.35;
  letter-spacing:.1em;margin:0 0 6px!important}
.rail .lab-course-promo h3{color:#fff;font-size:14px;line-height:1.3;font-weight:800;margin:0}
.rail .lab-course-promo .article-product-promo__body{
  color:#aeb8c5;font-size:12px;line-height:1.5;margin:0 0 10px}
.rail .lab-course-promo .article-product-promo__cta{
  color:#bfdbfe;font-size:13px;font-weight:800}
.rail .lab-course-promo:hover .article-product-promo__cta{color:#fff}
@media(max-width:900px){.rail .lab-course-promo .article-product-promo__image{width:60px;height:60px}}


/* v0.4.0: external AI handoff, download guidance and responsive layout */
.ai-handoff{margin-top:30px;padding:24px;border:1px solid #39516d;border-radius:18px;
 background:linear-gradient(135deg,#121f32,#0e1622);color:#dce7f3}
.ai-handoff__eyebrow{color:#60a5fa;letter-spacing:.11em;font-size:11px;font-weight:800;margin-bottom:9px}
.ai-handoff h3{font-size:23px;line-height:1.25;color:white;margin:0 0 13px}
.ai-handoff__intro{color:#bacbdf;font-size:15px;line-height:1.65;margin:0 0 20px}
.handoff-items{display:grid;gap:0;border:1px solid #334155;border-radius:13px;overflow:hidden;background:#101925}
.handoff-item{display:flex;align-items:flex-start;gap:15px;padding:17px 18px}
.handoff-item+.handoff-item{border-top:1px solid #334155}
.handoff-item__icon{display:flex;flex:none;align-items:center;justify-content:center;width:38px;height:38px;
 border-radius:10px;background:#1f3b5d;color:#a9d2ff;font-weight:800;font-size:13px}
.handoff-item h4{color:#f6faff;font-size:15px;margin:0 0 5px}
.handoff-item p{color:#aebfd2;font-size:13px;line-height:1.55;margin:0}
.handoff-guide{background:#17263c;border:1px solid #365374;border-radius:12px;margin-top:18px;padding:16px 18px}
.handoff-guide h4{color:#ecf5ff;font-size:15px;margin:0 0 8px}
.handoff-guide p{font-size:13px;line-height:1.6;margin:0;color:#d3e2f5}
.handoff-guide p+p{margin-top:10px}
.handoff-guide__caution{color:#b9cbe1!important}
.handoff-no-upload{color:#9fb1c7;font-size:12px;margin:14px 0 0}
.handoff-download-panel{margin:22px 0 12px}
.handoff-download-panel h3{color:#fff;font-size:19px;margin:0 0 14px}
.handoff-download-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.handoff-download{min-height:50px;padding:12px 14px;border:1px solid #40516a;background:#152132;
 border-radius:11px;color:#ddecff;font-size:14px;font-weight:700;cursor:pointer;text-align:left}
.handoff-download:hover{border-color:#7dbaff;background:#1c304a}
.handoff-download:focus-visible{outline:2px solid #60a5fa;outline-offset:3px}
.handoff-download--primary{background:#194a88;border-color:#4b98ff;color:#fff}
.handoff-download--primary:hover{background:#1c5fa9}
.handoff-download--secondary{opacity:.85}
@media(max-width:600px){.ai-handoff{padding:16px}.ai-handoff h3{font-size:20px}
 .handoff-item{padding:13px;gap:10px}.handoff-download-grid{grid-template-columns:1fr}
 .handoff-download{min-height:48px}}
@media print{.ai-handoff,.handoff-download-panel{display:none!important}}
/* Index cards use regular body-sized text; editorial sidebar captions remain compact. */
.rail-card .tools-card-description{font-size:16px;line-height:1.6}