/* Generated by tools/extract/extract-guides.mjs - do not edit. Moved verbatim from the <style> blocks of
   63 guide page(s), e.g. design/Applying DSAT.dc.html. */
@font-face{font-family:Exo2;src:url('../../_ds/agilexe-design-system-019dd376-daa3-75e9-86e7-ca27a40ff39e/fonts/Exo2-400.ttf')}@font-face{font-family:Exo2;src:url('../../_ds/agilexe-design-system-019dd376-daa3-75e9-86e7-ca27a40ff39e/fonts/Exo2-700.ttf');font-weight:700}
:root{--ink:#17171a;--muted:#626269;--line:#dedee3;--paper:#fff;--soft:#f6f6f8;--accent:#8b3677;--deep:#632653;--gold:#f4b05f;--green:#14734b;--shadow:0 24px 70px rgba(15,15,20,.14)}*{box-sizing:border-box}body{margin:0;background:#f0f0f3;overflow:hidden;color:var(--ink);font-family:Arial,sans-serif}button{font:inherit}
.top{height:62px;background:#08080a;color:#fff;display:flex;align-items:center;padding:0 24px;gap:18px;flex:none}.brand{font:700 22px Exo2,Arial}.tag{font:700 11px Exo2;letter-spacing:.15em;color:#c8c8ce;border-left:1px solid #45454b;padding-left:18px}.status{margin-left:auto;font-size:12px;color:#cacacf}.status b{color:#fff}
.shell{max-width:1540px;margin:auto;padding:10px 18px 6px;height:calc(100vh - 58px - 36px);display:flex;flex-direction:column;gap:8px;min-height:0}
.intro{display:flex;justify-content:space-between;gap:24px;align-items:end;margin:0;flex:none}.eyebrow{font:700 11px Exo2;letter-spacing:.16em;color:var(--accent)}.backlink{flex:none;align-self:flex-start;display:inline-flex;align-items:center;gap:6px;text-decoration:none;font:600 13px Exo2;color:var(--muted)}.backlink:hover{color:var(--ink)}h1{font:700 clamp(20px,2vw,26px) Exo2;margin:3px 0 2px;letter-spacing:-.03em}.lead{max-width:920px;margin:0;color:var(--muted);line-height:1.4;font-size:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.badge{padding:7px 11px;border:1px solid #d8c1d2;background:#fbf7fa;color:var(--deep);border-radius:999px;font:700 12px Exo2;white-space:nowrap}
.guide{background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;display:grid;grid-template-columns:360px minmax(0,1fr);flex:1 1 auto;min-height:0}
.side{padding:16px 18px 70px;min-height:0;overflow:hidden;position:relative;border-right:1px solid var(--line);background:linear-gradient(180deg,#fff,#fbf8fa);display:flex;flex-direction:column}.meta{display:flex;gap:8px;flex-wrap:wrap}.chip{font:700 10px Exo2;letter-spacing:.09em;text-transform:uppercase;border-radius:999px;padding:6px 8px;background:#eeeef2}.chip.live{background:#e9f5ef;color:var(--green)}h2{font:700 20px Exo2;margin:12px 0 4px}.muted{color:var(--muted);font-size:12.5px;line-height:1.45;min-height:0;overflow:hidden;flex:0 1 auto}
.progress{height:6px;background:#e8e8ec;border-radius:999px;margin:14px 0 8px;overflow:hidden}.progress i{display:block;height:100%;width:4.17%;background:linear-gradient(90deg,var(--accent),var(--gold));transition:width .45s ease}.progress-row{display:flex;justify-content:space-between;font:700 11px Exo2;color:var(--muted);letter-spacing:.04em}
.step-title{font:700 19px Exo2;margin:10px 0 6px;height:clamp(30px,5.5vh,46px);flex:none;display:flex;align-items:flex-end;overflow:hidden}.instruction{font-size:13px;line-height:1.55;margin:0;height:clamp(58px,13vh,104px);flex:none;overflow:auto}.completion{margin-top:8px;height:clamp(44px,9vh,70px);flex:0 1 auto;min-height:0;overflow:auto;padding:14px;border-left:3px solid var(--green);background:#edf8f2;border-radius:0 9px 9px 0;font-size:13px;line-height:1.5}.completion b{display:block;font:700 10px Exo2;letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin-bottom:4px}.note{margin-top:8px;height:clamp(40px,8.5vh,70px);flex:0 1 auto;min-height:0;overflow:auto;padding:13px;background:#fff8ec;border:1px solid #f0d4a9;border-radius:9px;font-size:12px;line-height:1.5}
.controls{position:absolute;left:18px;right:18px;bottom:16px;display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding-top:12px;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,0),#fbf8fa 30%)}.controls button{border:1px solid var(--line);background:#fff;border-radius:8px;padding:10px 12px;cursor:pointer}.controls button.primary{background:#111;color:#fff;border-color:#111;font-weight:700}.controls button:disabled{opacity:.35;cursor:not-allowed}.play{width:44px}
.screen-area{padding:12px 14px;min-height:0;overflow:hidden;background:radial-gradient(circle at 85% 10%,#f6e8f2 0,transparent 26%),#ededf1;display:flex;flex-direction:column}.screen-bar{display:flex;align-items:center;gap:10px;margin-bottom:8px;flex:none}.screen-bar strong{font:700 13px Exo2}.screen-bar small{color:var(--muted)}
.stage{position:relative;flex:1 1 auto;min-height:0;background:#111;border-radius:13px;overflow:hidden;box-shadow:0 18px 45px rgba(20,20,25,.2);display:flex;align-items:center;justify-content:center}.stage img{display:block;width:100%;height:100%;object-fit:contain;background:#fff}.spotlight{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);transform:translate(-50%,-50%);box-sizing:border-box;border:3px solid #ed61be;border-radius:4px;box-shadow:0 0 0 9999px rgba(8,8,11,.52);transition:left .42s cubic-bezier(.2,.8,.2,1),top .42s cubic-bezier(.2,.8,.2,1),width .42s cubic-bezier(.2,.8,.2,1),height .42s cubic-bezier(.2,.8,.2,1);pointer-events:none;animation:pulse 2s infinite}
.cue-dock{margin-top:8px;display:flex;align-items:stretch;gap:10px;flex:none}.cue-label{flex:none;display:flex;align-items:center;padding:0 13px;border-radius:9px;background:#efe6ed;color:var(--deep);font:700 10px Exo2;letter-spacing:.1em;text-transform:uppercase}.tip{position:relative;max-width:none;min-height:58px;flex:1;background:#111;color:#fff;padding:10px 13px;border-radius:9px;font-size:13px;line-height:1.4;box-shadow:0 8px 22px rgba(0,0,0,.18);z-index:5;pointer-events:none}.tip b{font-family:Exo2;display:block;color:#f3b9df;margin-bottom:2px}
.autoplay{height:3px;background:#d9d9de;margin-top:8px;flex:none;border-radius:999px;overflow:hidden}.autoplay i{display:block;height:100%;background:var(--accent);width:0}.autoplay.running i{animation:timer 5.5s linear forwards}
.below{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-size:11.5px;color:var(--muted);flex:none;gap:12px}.below button{border:0;background:transparent;color:var(--deep);font-weight:700;cursor:pointer}.screen-reader{position:absolute;left:-9999px}
.footer{max-width:1540px;margin:0 auto;padding:8px 24px;display:flex;justify-content:space-between;color:#696970;font-size:11px;height:36px;align-items:center;gap:12px}
:focus-visible{outline:3px solid #c98eba;outline-offset:2px}
@keyframes pulse{50%{border-color:rgba(237,97,190,.55)}}@keyframes timer{to{width:100%}}
@media(max-width:1120px){.guide{grid-template-columns:290px minmax(0,1fr)}.side{padding:14px 14px 70px}.step-title{font-size:17px;height:42px}.instruction{font-size:12.5px;height:96px}h2{font-size:18px}}
@media(max-width:760px){.shell{height:auto;overflow:auto}body{overflow:hidden auto}.guide{grid-template-columns:1fr}.side{border-right:0;border-bottom:1px solid var(--line);overflow:visible}.stage{min-height:380px}.intro{align-items:start;flex-direction:column}.badge{white-space:normal}}
@media(max-width:620px){.shell{padding:12px}.top{padding:0 14px}.tag{display:none}.guide{border-radius:12px}.side{padding:18px 18px 70px}.screen-area{padding:10px}.stage{min-height:340px}.tip{font-size:11px}.cue-label{display:none}.footer{flex-direction:column;height:auto;align-items:flex-start;gap:4px}}
@media(max-height:700px){.intro .lead{-webkit-line-clamp:1}.side{padding-top:12px}.muted{display:none}.note{display:none}.completion{height:auto}.instruction{height:clamp(48px,10vh,104px)}}
@media(max-height:580px){.intro{display:none}.completion{display:none}.step-title{height:auto;margin:6px 0 4px}.instruction{height:clamp(40px,8vh,72px);overflow:auto}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.autoplay{display:none}}

/* full-height readable sidebar — no clipped step text */
.shell{max-width:1720px}
.guide{grid-template-columns:400px minmax(0,1fr)}
.side{padding:10px 16px 0;overflow-y:auto;overflow-x:hidden;gap:0}
.meta{gap:6px;margin-bottom:5px}
.chip{font-size:9.5px;padding:5px 7px}
h2{font:700 17px Exo2;margin:5px 0 3px}
.muted{display:block;flex:none;font-size:11px;line-height:1.35;overflow:visible}
.progress{margin:6px 0 4px}
.step-title{font:700 16px Exo2;display:block;height:auto;min-height:0;flex:none;margin:5px 0 3px;overflow:visible}
.instruction{font-size:11.5px;line-height:1.4;height:auto;min-height:0;flex:none;overflow:visible}
.completion{display:block;flex:none;height:auto;min-height:0;overflow:visible;padding:8px 10px;font-size:11px;line-height:1.35;margin-top:6px}
.note{display:block;flex:none;height:auto;min-height:0;overflow:visible;padding:7px 10px;font-size:10.5px;line-height:1.35;margin-top:6px}
.note:empty{display:none}
.controls{position:sticky;left:auto;right:auto;bottom:0;margin-top:auto;padding:8px 0 14px;background:#fbf8fa}
.controls button{padding:9px 11px}
@media(max-width:1120px){.guide{grid-template-columns:330px minmax(0,1fr)}.side{padding:13px 13px 0}.step-title{font-size:15.5px;height:auto}.instruction{font-size:11.5px;height:auto}h2{font-size:16px}}
@media(max-width:760px){.guide{grid-template-columns:1fr}.side{overflow:visible;padding:16px 16px 0}.controls{position:static;margin-top:12px}}
@media(max-height:700px){.muted{display:block}.note{display:block}.completion{display:block;height:auto}.instruction{height:auto}}
@media(max-height:580px){.completion{display:block}.step-title{height:auto}.instruction{height:auto;overflow:visible}}

.instruction a,.note a{color:var(--deep);font-weight:700;text-decoration:underline;text-underline-offset:2px}
.instruction a:hover,.note a:hover{color:var(--accent)}
#axTop nav::-webkit-scrollbar{display:none}@media(max-width:1100px){#axTop .ax-header-icons{display:none!important}}