/* Styling aligned with the supplied offline exercise documentation. */
.exercise pre{max-width:100%;overflow-x:hidden;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;background:#1f1f1f;color:#f5f5f5;border-radius:6px;padding:1rem 1.1rem;margin:1rem 0;font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;font-size:.94rem;line-height:1.5}
.exercise pre code{background:transparent;color:inherit;padding:0;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}
.copy-code{min-width:32px;opacity:0;pointer-events:none;transition:opacity .28s ease;font-size:.76rem;border:0!important;border-radius:4px!important;background:#3a86ff!important;color:#fff!important;padding:5px 9px!important;line-height:1!important;box-shadow:none!important}
.code-block:hover .copy-code,.code-block:focus-within .copy-code{opacity:1;pointer-events:auto}

/* Course images stay within the viewport; authors may select safe size and alignment presets. */
.exercise .markdown-image{display:block;width:auto;height:auto;max-width:100%;max-height:70vh;object-fit:contain;margin:1rem auto}
.exercise .markdown-image--super-small{max-width:96px}.exercise .markdown-image--even-smaller{max-width:160px}.exercise .markdown-image--smaller{max-width:240px}.exercise .markdown-image--small{max-width:320px}.exercise .markdown-image--medium{max-width:480px}.exercise .markdown-image--large{max-width:640px}
.exercise .markdown-image--align-left{margin-left:0;margin-right:auto}.exercise .markdown-image--align-center{margin-left:auto;margin-right:auto}.exercise .markdown-image--align-right{margin-left:auto;margin-right:0}
.exercise .markdown-image--zoomable{cursor:zoom-in;border-radius:4px;transition:box-shadow .18s ease,transform .18s ease}
.exercise .markdown-image--zoomable:hover{box-shadow:0 0 0 3px #3a86ff66}.exercise .markdown-image--zoomable:focus-visible,.exercise a:focus-visible>.markdown-image--zoomable{outline:3px solid #3a86ff;outline-offset:4px}

/* Full-screen viewer for exercise images. */
html.image-viewer-open{overflow:hidden}
.image-viewer{width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:#101318eb;color:#fff;overflow:hidden}
.image-viewer::backdrop{background:#101318eb}
.image-viewer__stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:64px 20px 72px;overflow:hidden;touch-action:none}
.image-viewer__image{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;cursor:zoom-in;user-select:none;-webkit-user-drag:none;transition:transform .2s ease}
.image-viewer.is-zoomed .image-viewer__stage.is-draggable,.image-viewer.is-zoomed .image-viewer__image{cursor:grab}.image-viewer.is-dragging .image-viewer__stage,.image-viewer.is-dragging .image-viewer__image{cursor:grabbing;transition:none}
.image-viewer__image:focus-visible{outline:3px solid #fff;outline-offset:5px}
.image-viewer__close{position:absolute;z-index:2;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));display:grid;place-items:center;width:44px;height:44px;margin:0;padding:0;border:1px solid #ffffff80;border-radius:50%;background:#161a20dd;color:#fff;font-size:2rem;line-height:1}
.image-viewer__close:hover,.image-viewer__close:focus-visible{background:#3a86ff;border-color:#fff;outline:2px solid #fff;outline-offset:2px}
.image-viewer__hint,.image-viewer__error{position:absolute;z-index:2;left:50%;bottom:max(16px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:calc(100% - 32px);margin:0;padding:7px 12px;border-radius:20px;background:#161a20dd;color:#fff;text-align:center;font-size:.88rem}
.image-viewer__error{top:50%;bottom:auto;transform:translate(-50%,-50%);border-radius:6px}

@media(max-width:720px){.image-viewer__stage{padding:58px 8px 68px}.image-viewer__hint{width:max-content}}
@media(prefers-reduced-motion:reduce){.exercise .markdown-image--zoomable,.image-viewer__image{transition:none}}

/* Accessible, toggleable Markdown spoilers. */
.markdown-spoiler{margin:1rem 0;border:1px solid #d5d9e0;border-radius:7px;background:#f7f8fa;overflow:hidden}
.markdown-spoiler>summary{cursor:pointer;padding:.75rem 1rem;color:#7a4a08;background:#fff6e9;font-weight:750;list-style-position:inside}
.markdown-spoiler>summary:hover,.markdown-spoiler>summary:focus-visible{background:#ffe8c7;color:#5e3600;outline:0}
.markdown-spoiler>summary:focus-visible{box-shadow:inset 0 0 0 3px #f39221}
.markdown-spoiler__hide-label{display:none}.markdown-spoiler[open]>summary>.markdown-spoiler__show-label{display:none}.markdown-spoiler[open]>summary>.markdown-spoiler__hide-label{display:inline}
.markdown-spoiler__content{padding:1rem}.markdown-spoiler__content>:first-child{margin-top:0}.markdown-spoiler__content>:last-child{margin-bottom:0}
.markdown-spoiler--code .code-block{margin:0}.markdown-spoiler--image .markdown-spoiler__content{display:flex;justify-content:center}.markdown-spoiler--image p{margin:0;width:100%}
.exercise .markdown-spoiler-inline{display:inline;width:auto;margin:0 .08em;padding:.05em .32em;border:0;border-radius:3px;background:#202124;color:transparent;font:inherit;line-height:inherit;vertical-align:baseline;user-select:none;box-shadow:none}
.exercise .markdown-spoiler-inline:hover,.exercise .markdown-spoiler-inline:focus-visible{background:#34373b;outline:2px solid #f39221;outline-offset:2px}
.exercise .markdown-spoiler-inline.is-revealed{background:#fff0d8;color:inherit;user-select:text;outline:1px solid #f0c98a}

/* GitHub-style Markdown alerts in the visual language of the supplied template. */
.markdown-alert{position:relative;margin:1rem 0;padding:.85rem 1rem .85rem 2.9rem;border:0;border-left:5px solid;border-radius:6px;color:#242424}
.markdown-alert::before{content:"";position:absolute;left:.72rem;top:.72rem;width:1.3rem;height:1.3rem;background:center/contain no-repeat}
.markdown-alert__title{margin:0 0 .4rem;font-weight:800}.markdown-alert p:last-child{margin-bottom:0}
.markdown-alert--note{border-color:#3a86ff;background:#e8f1ff;color:#173a63}.markdown-alert--note::before{background-image:url('/assets/img/emoji-note.svg')}
.markdown-alert--tip{border-color:#2a9d4a;background:#e7f6ec;color:#14502a}.markdown-alert--tip::before{background-image:url('/assets/img/emoji-rocket.svg')}
.markdown-alert--important{border-color:#8250df;background:#f4edff;color:#4c2882}.markdown-alert--important::before{background-image:url('/assets/img/emoji-tip.svg')}
.markdown-alert--warning{border-color:#f0a000;background:#fff6d8;color:#7a4a08}.markdown-alert--warning::before{background-image:url('/assets/img/emoji-warning.svg')}
.markdown-alert--caution{border-color:#d7322b;background:#fdecea;color:#7a1410}.markdown-alert--caution::before{background-image:url('/assets/img/emoji-stop.svg')}

/* Placeholder panels are intentionally compact and visually attached to their code block. */
.template-inputs{display:flex;flex-direction:column;gap:.6rem;margin:1rem 0 0;padding:.75rem .9rem;border:1px solid;border-left:5px solid;border-radius:6px 6px 0 0}
.template-inputs label{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0;font-size:.92rem;font-weight:600}.template-inputs input{flex:1 1 210px;min-width:160px;width:auto;margin:0;padding:6px 9px;border:1px solid #cfcfcf;border-radius:4px;background:#fff;font:inherit}.template-inputs input:focus{outline:2px solid #f39221;border-color:#f39221}
.template-inputs--brand,.template-inputs--important,.template-inputs--warning{border-color:#f0c98a;border-left-color:#f39221;background:#fff6e9;color:#7a4a08}
.template-inputs--note{border-color:#9bc2ff;border-left-color:#3a86ff;background:#e8f1ff;color:#173a63}.template-inputs--tip{border-color:#90d4a4;border-left-color:#2a9d4a;background:#e7f6ec;color:#14502a}.template-inputs--caution{border-color:#efaaa7;border-left-color:#d7322b;background:#fdecea;color:#7a1410}
.template-inputs + .code-block pre{margin-top:0;border-top-left-radius:0;border-top-right-radius:0}
.template-variable{background:#f39221;color:#1e1e1e;border-radius:3px;padding:0 4px;font-weight:700}.template-variable.is-filled{background:#2a9d4a;color:#fff}
.copyable-inline{display:inline-flex;align-items:center;gap:4px;vertical-align:middle}.exercise .copyable-inline code{background:#f1f1f1;color:#c7254e;padding:1px 6px;border-radius:3px;font-size:.92em}.copy-inline{display:inline-flex!important;align-items:center;width:auto!important;margin:0!important;padding:2px 6px!important;border:0!important;border-radius:3px!important;background:transparent!important;color:#3a86ff!important;font-size:.76rem!important;line-height:1.2!important}.copy-inline:hover,.copy-inline:focus{background:#e8f0fe!important;color:#173a63!important}

@media(max-width:720px){.template-inputs label{align-items:stretch}.template-inputs input{width:100%;flex-basis:100%}}