:root{color-scheme:light;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#172d40;background:#f6f7f8;font-size:17px;line-height:1.65}*{box-sizing:border-box}body{margin:0;border-top:8px solid #ffcb05}main{max-width:900px;margin:0 auto;padding:40px 36px 96px;background:white;min-height:100vh}h1{font-size:2.5rem;line-height:1.15;margin:0 0 12px;color:#00274c}h2{font-size:1.27rem;line-height:1.45;color:#00274c;border-top:2px solid #e5e9ee;padding-top:28px;margin:40px 0 18px}p{margin:14px 0;overflow-wrap:anywhere}.number{display:inline-block;margin-right:.55em;font-weight:650}.level-2{padding-left:20px}details{border:1px solid #c7d1dc;border-radius:6px;margin:12px 0;background:#fff}summary{cursor:pointer;padding:14px 18px;color:#00274c;line-height:1.55}summary::marker{color:#00274c}summary:hover{background:#f2f5f8}summary:focus-visible,a:focus-visible{outline:3px solid #005cb9;outline-offset:3px}details[open]>summary{border-bottom:1px solid #e0e6ed;background:#f5f7fa}.fold-content{padding:0 20px 12px}.theory{border-left:4px solid #ffcb05}.screenshots{border-style:dashed}.images{padding:16px;display:grid;gap:20px}.images a{display:block}.images img{display:block;max-width:100%;height:auto;margin:auto}mark{color:#102233;background:#fff2a8;padding:.07em .1em;box-decoration-break:clone}mark.yellow{background:#fff29b}mark.cyan,mark.blue{background:#c8e8ff}mark.green{background:#d2efd2}em{font-style:italic}@media(max-width:600px){:root{font-size:16px}main{padding:26px 18px 60px}h1{font-size:2rem}h2{font-size:1.15rem}summary{padding:12px}.fold-content{padding:0 12px 10px}.level-2{padding-left:10px}}@media print{body{border:0}main{max-width:none;padding:0}details::details-content{display:block!important}details{break-inside:avoid}.images img{max-height:75vh}summary{border:0!important}h2{break-after:avoid}}

/* Screenshot controls stay compact beside the source text. */
p:has(+ .screenshots){display:inline}.screenshots{display:inline;border:0;margin:0 0 0 .35em;background:transparent}.screenshots>summary{display:inline-block;padding:2px 5px;color:#0062a8;font-weight:750;cursor:pointer;border:0!important;background:transparent!important}.screenshots>summary::marker,.screenshots>summary::-webkit-details-marker{display:none;content:""}.screenshots>summary:hover{text-decoration:underline}.screenshots[open]>.images{display:grid;border-left:3px solid #ffcb05;margin:12px 0 20px}.screenshots + p,.screenshots + details,.screenshots + h2{margin-top:18px}

/* Theory and procedural disclosures use distinct box treatments. */
.clicks{background:#f1f6fc;border-color:#b7cde2;border-left:4px solid #245f91}
.clicks>summary,.clicks[open]>summary{background:#eaf2fa}
.clicks>summary:hover{background:#dfeaf6}
.theory{background:#fffaf0;border:1px dashed #9b751b;border-left:4px solid #d0a220}
.theory>summary,.theory[open]>summary{background:#fff3ce}
.theory>summary:hover{background:#ffedb3}
.theory>summary .original::before{content:"💡 ";font-style:normal}
.camera-icon{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;vertical-align:middle}
.screenshots>summary{min-width:36px;min-height:36px;text-align:center;vertical-align:middle;border-radius:4px}
.screenshots>summary:hover{background:#eaf2fa!important}

mark.cyan,mark.blue{background:transparent;padding:0}.page-tools{margin:24px 0 32px;padding:18px;background:#f5f7fa;border:1px solid #c7d1dc;border-radius:6px}.page-tools button{font:inherit;font-weight:650;background:#00274c;color:white;border:0;border-radius:5px;padding:12px 16px;cursor:pointer;width:100%;text-align:left}.page-tools button:disabled{opacity:.65;cursor:wait}.page-tools button:focus-visible{outline:3px solid #005cb9;outline-offset:3px}.page-tools a{color:#005b9a}.page-tools ul{padding:0 24px 12px 38px}.page-tools li{margin:6px 0}#download-status:empty{display:none}.layout-key{border-color:#aebdcc}.individual{font-size:.9rem}

.step-with-pictures{position:relative;margin:12px 0}.step-with-pictures>details.clicks,.step-with-pictures>details.theory{margin:0}.step-with-pictures>details.clicks>summary,.step-with-pictures>details.theory>summary{padding-right:64px}.step-with-pictures>.screenshots{margin:0}.step-with-pictures>.screenshots>summary{position:absolute;top:8px;right:12px}.step-with-pictures>.screenshots>.images{background:white;border:1px solid #c7d1dc;border-left:3px solid #ffcb05;border-radius:4px;margin-top:8px}

/* Shared course navigation */
.course-header{position:relative!important;top:auto!important;z-index:40!important;max-width:none!important;margin:0!important;padding:12px max(22px,calc((100vw - 1240px)/2))!important;display:flex!important;align-items:center!important;gap:24px!important;flex-wrap:wrap!important;background:#00274c!important;color:#fff!important;box-shadow:0 2px 12px #001b3540}
.course-brand{color:#ffcb05!important;font-size:1.02rem!important;font-weight:850!important;letter-spacing:.08em!important;text-decoration:none!important;white-space:nowrap}
.course-header nav{display:flex!important;align-items:center!important;gap:6px!important}
.course-header nav>a,.nav-menu>summary{display:block!important;margin:0!important;padding:8px 12px!important;border:0!important;border-radius:3px!important;background:transparent!important;color:#fff!important;font-size:.92rem!important;font-weight:700!important;line-height:1.2!important;text-decoration:none!important;cursor:pointer!important;list-style:none!important}
.nav-menu>summary::-webkit-details-marker{display:none}.nav-menu>summary::marker{content:""}.nav-menu>summary::after{content:" ▾";color:#ffcb05}
.course-header nav>a:hover,.nav-menu>summary:hover,.nav-menu[open]>summary{background:#173f67!important}
.course-header nav>a[aria-current=page],.nav-menu[data-active=true]>summary{background:#ffcb05!important;color:#00274c!important}
.nav-menu{position:relative!important;margin:0!important;border:0!important;background:transparent!important}
.nav-menu>div{position:absolute;z-index:50;top:calc(100% + 7px);left:0;display:grid;min-width:230px;padding:7px;background:#fff;border:1px solid #b9c6d0;box-shadow:0 10px 28px #001b3540}
.nav-menu:not([open])>div{display:none}.course-header nav .nav-menu>div a{padding:10px 12px!important;border-radius:2px;color:#00274c!important;background:#fff!important;font-size:.9rem;text-decoration:none;white-space:nowrap}.course-header nav .nav-menu>div a:hover{background:#eaf0f5!important}.course-header nav .nav-menu>div a[aria-current=page]{background:#fff1b8!important;color:#00274c!important;font-weight:800}
.course-header .site-actions{margin:0 0 0 auto!important;padding:0!important}.course-header .site-actions button{border:1px solid #fff!important;background:transparent!important;color:#fff!important}.course-header .site-actions #editor-open{border-color:#ffcb05!important;background:#ffcb05!important;color:#00274c!important}
.header-right{display:flex;align-items:center;gap:10px;margin-left:auto}.about-menu{position:relative!important;margin:0!important;border:0!important;background:transparent!important}.about-menu>summary{margin:0!important;padding:8px 12px!important;border:1px solid #ffffff70!important;border-radius:3px!important;background:transparent!important;color:#fff!important;font-size:.9rem!important;font-weight:750!important;line-height:1.2!important;list-style:none!important}.about-menu>summary::-webkit-details-marker{display:none}.about-menu>summary::marker{content:""}.about-menu>summary::before{content:"ⓘ ";color:#ffcb05}.about-menu>summary:hover,.about-menu[open]>summary{background:#173f67!important}.about-menu>div{position:absolute;z-index:60;top:calc(100% + 8px);right:0;width:min(360px,calc(100vw - 24px));padding:18px 20px;background:#fff;color:#172d40;border:1px solid #b9c6d0;box-shadow:0 12px 30px #001b3545}.about-menu:not([open])>div{display:none}.about-menu>div strong{color:#00274c}.about-menu>div p{margin:7px 0 0;font-size:.88rem;line-height:1.45}.header-right .site-actions{margin:0!important}
@media(max-width:700px){.course-header{gap:8px!important;padding:10px 12px!important}.course-header nav{order:3;width:100%;flex-wrap:wrap}.header-right{margin-left:auto}.course-header .site-actions{margin-left:auto!important}.nav-menu>div{position:fixed;top:auto;left:12px;right:12px;min-width:0}.about-menu>div{position:fixed;top:64px;right:12px;left:12px;width:auto}}
