:root{--color-bg:#fafaf9;--color-surface:#fff;--color-border:#e5e4e2;--color-text:#1c1917;--color-text-muted:#78716c;--color-accent:#0f766e;--color-accent-strong:#115e59;--color-completed:#15803d;--color-current:#7c3aed;--color-current-strong:#5b21b6;--color-checkpoint:#ea580c;--color-locked:#a8a29e;--color-spine:#d6d3d1;--color-danger:#b91c1c;--color-incorrect-bg:#fef2f2;--color-correct-bg:#f0fdf4;--shadow-card:0 1px 2px #1c191714;color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-family:system-ui,Segoe UI,Roboto,sans-serif;line-height:1.6}*{box-sizing:border-box}body{margin:0}h1,h2,h3{overflow-wrap:break-word;margin:0 0 .5rem;line-height:1.3}p{overflow-wrap:break-word;margin:0 0 .75rem}button{font:inherit;border:1px solid var(--color-border);background:var(--color-surface);min-height:2.75rem;color:var(--color-text);cursor:pointer;border-radius:8px;padding:.55rem 1.1rem;font-size:.95rem}button:hover:not(:disabled){border-color:var(--color-accent);color:var(--color-accent)}button:disabled{cursor:not-allowed;opacity:.5}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important}}.course-overview,.coming-soon,.session-screen{max-width:760px;margin:0 auto;padding:2rem 1.25rem 4rem}.overview-header h1{letter-spacing:-.02em;font-size:2rem}.overview-header__tagline{color:var(--color-text-muted)}.overview-card,.dev-footer details{background:var(--color-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-card);border-radius:8px;padding:1rem 1.25rem}.course-overview>section,.course-overview>footer{margin-top:1.5rem}.progress-bar{background:var(--color-border);border-radius:5px;height:10px;overflow:hidden}.progress-bar__fill{background:var(--color-accent);border-radius:5px;height:100%;transition:width .2s}.session-list{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.session-row{border-radius:8px}.session-row__open{text-align:left;border:1px solid var(--color-border);background:var(--color-surface);width:100%;box-shadow:var(--shadow-card);border-radius:8px;align-items:center;gap:1rem;padding:.75rem 1rem;display:flex}.session-row__open:hover{border-color:var(--color-accent);color:var(--color-text)}.session-row--locked .session-row__open{display:none}.session-row--locked{background:var(--color-surface);border:1px dashed var(--color-border);opacity:.6;border-radius:8px;align-items:center;gap:1rem;padding:.75rem 1rem;display:flex}.session-row--locked .session-row__status{pointer-events:none}.session-row__index{font-variant-numeric:tabular-nums;color:var(--color-text-muted);min-width:1.5rem}.session-row__info{flex:1}.session-row__info h3{margin-bottom:.25rem;font-size:1.05rem}.session-row__info p{color:var(--color-text-muted);font-size:.875rem}.session-row__parts{color:var(--color-text-muted);flex-wrap:wrap;gap:.4rem 1rem;margin:.35rem 0 0;padding:0;font-size:.78rem;list-style:none;display:flex}.session-row__parts .is-done{color:var(--color-completed)}.session-row__status{text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-radius:999px;padding:.25rem .6rem;font-size:.68rem;font-weight:600}.session-row__status--completed{color:var(--color-completed);background:#15803d1f}.session-row__status--current{color:var(--color-current);background:#b453091f}.session-row__status--locked{color:var(--color-locked);background:#a8a29e2e}.dev-footer summary{cursor:pointer;color:var(--color-text-muted);font-size:.8rem}.dev-footer__hint{color:var(--color-text-muted);margin-top:.5rem;font-size:.8rem}.dev-footer__reset{color:var(--color-danger)}.coming-soon{flex-direction:column;align-items:flex-start;gap:.75rem;display:flex}.coming-soon h1{margin-top:1rem}.coming-soon p{color:var(--color-text-muted);max-width:42rem}.session-header{border-bottom:1px solid var(--color-border);margin-bottom:1.5rem;padding-bottom:1rem}.session-header__top{align-items:center;gap:1rem;display:flex}.session-header__title{margin:0;font-size:1.4rem}.stage-tabs{gap:.5rem;margin-top:1rem;display:flex}.stage-tab{border-radius:999px;align-items:center;gap:.4rem;min-height:2.5rem;padding:.35rem 1rem;font-size:.85rem;display:inline-flex}.stage-tab--active{border-color:var(--color-accent);background:var(--color-accent);color:#fff}.stage-tab--active:hover{border-color:var(--color-accent-strong);color:#fff}.stage-tab--done:not(.stage-tab--active){color:var(--color-completed)}.stage-tab__check{width:1rem}.session-header__next-unlocked{color:var(--color-completed);margin:.75rem 0 0;font-weight:600}.session-screen__body{flex-direction:column;gap:1.25rem;display:flex}.stage-empty{color:var(--color-text-muted)}.stage-progress{margin-bottom:.75rem}.stage-progress__label{color:var(--color-text-muted);margin-bottom:.3rem;font-size:.78rem;display:block}.stage-progress__bar{background:var(--color-border);border-radius:4px;height:8px;overflow:hidden}.stage-progress__fill{background:var(--color-accent);border-radius:4px;height:100%;transition:width .2s}.stage-actions{flex-wrap:wrap;gap:.5rem;margin-top:1rem;display:flex}.stage-actions button:first-child{border-color:var(--color-accent);background:var(--color-accent);color:#fff;font-weight:600}.stage-actions button:first-child:hover:not(:disabled){background:var(--color-accent-strong);border-color:var(--color-accent-strong);color:#fff}.learn-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:10px;padding:1.5rem 1.75rem}.learn-section__title{font-size:1.3rem}.learn-section__paragraph{max-width:68ch;margin:.75rem 0}.code-block{color:#fafaf9;tab-size:2;background:#1c1917;border-radius:8px;margin:.75rem 0;padding:1rem;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.85rem;line-height:1.6;overflow-x:auto}.fill-code{margin:.75rem 0}.fill-code__label{color:var(--color-text-muted);margin-bottom:.4rem;font-size:.8rem;font-weight:600;display:block}.fill-code__inline{margin:0}.fill-code__inline code{display:block}.fill-code__input{font:inherit;color:inherit;caret-color:#f59e0b;background:#f59e0b2e;border:none;border-bottom:2px solid #f59e0b;border-radius:2px 2px 0 0;min-width:6em;max-width:100%;margin:0;padding:0 .2rem}.fill-code__input::placeholder{color:#a8a29e}.code-preview-tabs{margin:.75rem 0}.code-preview-tabs__tabs{gap:.35rem;margin-bottom:.4rem;display:flex}.code-preview-tabs__tab{border-radius:999px;min-height:2.25rem;padding:.3rem 1rem;font-size:.85rem;font-weight:600}.code-preview-tabs__tab--active{border-color:var(--color-accent);background:var(--color-accent);color:#fff}.code-preview-tabs__tabs .code-preview-tabs__tab--active:hover{border-color:var(--color-accent-strong);color:#fff}.html-preview{border:1px solid var(--color-border);background:#fff;border-radius:8px;width:100%;height:15rem;display:block}.code-preview-tabs__preview-area{overflow:hidden}.code-preview-tabs__viewport-selector{gap:.35rem;margin-bottom:.4rem;display:flex}.code-preview-tabs__viewport-btn{border-radius:999px;min-height:2rem;padding:.2rem .75rem;font-size:.78rem;font-weight:600}.code-preview-tabs__viewport-btn--active{border-color:var(--color-accent);background:var(--color-accent);color:#fff}.code-preview-tabs__tabs .code-preview-tabs__viewport-btn--active:hover{border-color:var(--color-accent-strong);color:#fff}.code-preview-tabs__iframe-wrapper{overflow:hidden}.visual{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;margin:.75rem 0;padding:1rem}.visual__box{border:1px solid var(--color-accent);text-align:center;background:#0f766e14;border-radius:8px;padding:.55rem .9rem;font-weight:600}.visual--flow{flex-direction:column;align-items:center;gap:0;display:flex}.visual__arrow{color:var(--color-text-muted);align-items:center;gap:.5rem;font-size:.8rem;font-weight:600;display:flex}.visual__arrow--down:after{content:"↓";color:var(--color-accent);font-size:1.1rem}.visual__arrow--up:after{content:"↑";color:var(--color-accent);font-size:1.1rem}.visual__arrow--right:before{content:"→";color:var(--color-accent);font-size:1.1rem}.visual--dns{flex-flow:wrap;justify-content:center;align-items:center;gap:.6rem .75rem;display:flex}.visual--tree{font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.9rem;line-height:1.6}.html-tree__node{flex-direction:column;display:flex}.html-tree__name{align-items:center;display:inline-flex}.html-tree__branch{color:var(--color-accent);margin-right:.25rem}.html-tree__children{padding-left:1.4rem}.visual--anatomy{flex-wrap:wrap;justify-content:center;gap:.6rem;display:flex}.anatomy__part{border-radius:8px;flex-direction:column;align-items:center;gap:.3rem;min-width:5.5rem;padding:.6rem .9rem;display:flex}.anatomy__part code{font-family:ui-monospace,Consolas,Courier New,monospace;font-size:1rem;font-weight:700}.anatomy__label{text-transform:uppercase;letter-spacing:.04em;font-size:.7rem;font-weight:700}.anatomy__part--opening{border:1px solid var(--color-accent);color:var(--color-accent-strong);background:#0f766e1f}.anatomy__part--content{border:1px solid var(--color-checkpoint);color:#9a3412;background:#ea580c1a}.anatomy__part--closing{border:1px solid var(--color-danger);color:#7f1d1d;background:#7f1d1d14}.anatomy__attr-brackets{text-align:center;overflow-wrap:anywhere;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.95rem;font-weight:700}.anatomy__attr{background:var(--color-accent-strong);color:#fff;overflow-wrap:anywhere;border-radius:4px;margin:0 .1rem;padding:.1rem .35rem;font-size:.8rem;font-weight:600;display:inline-block}.anatomy__part--void{border:1px dashed var(--color-text-muted);color:var(--color-text-muted);background:#78716c1a}.visual--form-field{flex-direction:column;align-items:center;gap:.6rem;display:flex}.form-field__pair{flex-flow:wrap;justify-content:center;align-items:center;gap:.6rem;display:flex}.form-field__part{border:1px solid var(--color-accent);color:var(--color-accent-strong);background:#0f766e1f;border-radius:8px;flex-direction:column;align-items:center;gap:.3rem;padding:.6rem .9rem;display:flex}.form-field__part code{text-align:center;overflow-wrap:anywhere;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.9rem;font-weight:700}.form-field__part-label{text-transform:uppercase;letter-spacing:.04em;font-size:.7rem;font-weight:700}.form-field__tie{color:var(--color-accent);border:1px dashed var(--color-accent);background:#0f766e14;border-radius:8px;flex-direction:column;align-items:center;gap:.2rem;padding:.35rem .55rem;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.78rem;font-weight:700;display:flex}.form-field__submit{border-top:1px solid var(--color-border);width:100%;color:var(--color-text-muted);flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem;padding-top:.55rem;font-size:.85rem;display:flex}.form-field__submit code{color:#9a3412;overflow-wrap:anywhere;background:#ea580c1a;border-radius:4px;padding:.1rem .35rem;font-family:ui-monospace,Consolas,Courier New,monospace;font-weight:700}.visual--rule-anatomy{justify-content:center;display:flex}.rule-anatomy__rule{border:1px solid var(--color-border);background:#0f766e0f;border-radius:10px;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:.35rem;padding:.9rem 1rem;display:flex}.rule-anatomy__part{border-radius:8px;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem .7rem;display:flex}.rule-anatomy__part code{overflow-wrap:anywhere;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:1rem;font-weight:700}.rule-anatomy__label{text-transform:uppercase;letter-spacing:.04em;font-size:.7rem;font-weight:700}.rule-anatomy__part--selector{border:1px solid var(--color-accent);color:var(--color-accent-strong);background:#0f766e1f}.rule-anatomy__part--property{border:1px solid var(--color-checkpoint);color:#9a3412;background:#ea580c1a}.rule-anatomy__part--value{border:1px solid var(--color-danger);color:#7f1d1d;background:#7f1d1d14}.rule-anatomy__punct{color:var(--color-text-muted);align-items:flex-start;padding-top:.55rem;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:1.05rem;font-weight:700;display:flex}.visual--box-model{justify-content:center;display:flex}.box-model__layer{border-radius:8px;flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.box-model__tag{white-space:nowrap;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.72rem;font-weight:700;position:absolute;top:.25rem;left:.4rem}.box-model__layer--margin{border:1px dashed var(--color-checkpoint);color:#9a3412;background:#ea580c1f;padding:1.4rem 1.6rem}.box-model__layer--border{border:3px solid var(--color-accent);color:var(--color-accent-strong);background:#0f766e1a;padding:.9rem 1.1rem}.box-model__layer--padding{border:1px solid var(--color-danger);color:#7f1d1d;background:#7f1d1d14;padding:.9rem 1.1rem}.box-model__layer--content{background:var(--color-accent-strong);color:#fff;padding:.5rem 1rem}.box-model__layer--content .box-model__tag{color:#fff;position:static}.visual--block-vs-inline{flex-direction:column;gap:.6rem;display:flex}.bvi__row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.bvi__label{text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted);flex-shrink:0;min-width:5.5rem;font-size:.72rem;font-weight:700}.bvi__box{border:1px solid var(--color-accent);text-align:center;border-radius:6px;padding:.4rem .75rem;font-size:.85rem;font-weight:600}.bvi__box--block{background:#0f766e14;width:100%}.bvi__box--inline{border-color:var(--color-checkpoint);color:#9a3412;background:#ea580c1a}.bvi__box--inline-block{border-color:var(--color-danger);color:#7f1d1d;background:#7f1d1d14;width:80px}.visual--position-relative{flex-direction:column;align-items:center;gap:.4rem;display:flex}.posrel__column{flex-direction:column;align-items:center;gap:.3rem;display:flex}.posrel__row{align-items:center;gap:.6rem;display:flex}.posrel__label{color:var(--color-text-muted);white-space:nowrap;text-align:right;min-width:7rem;font-size:.72rem;font-weight:600}.posrel__label--strong{color:var(--color-accent-strong)}.posrel__ghost{border:2px dashed var(--color-locked);background:0 0;border-radius:6px;flex-shrink:0;width:160px;height:40px}.posrel__nudged{border:1px solid var(--color-accent);background:#0f766e14;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:160px;height:40px;display:flex}.posrel__offset{flex-direction:column;align-items:center;gap:0;margin-left:15.6rem;display:flex}.posrel__offset-text{color:var(--color-accent);background:var(--color-surface);border:1px solid #0f766e26;border-radius:3px;padding:.1rem .35rem;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.62rem;font-weight:700}.posrel__arrow{margin-top:-2px;display:block}.posrel__tag{color:var(--color-accent);font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.64rem;font-weight:700}.posrel__gap-label{color:var(--color-text-muted);font-size:.7rem;font-style:italic}.visual--flex-axes{flex-wrap:wrap;justify-content:center;gap:2rem;display:flex}.flexaxes__panel{flex-direction:column;align-items:center;gap:.6rem;min-width:180px;display:flex}.flexaxes__title{text-transform:uppercase;letter-spacing:.04em;color:var(--color-accent-strong);font-size:.85rem;font-weight:700}.flexaxes__box{border:1px solid var(--color-locked);background:#0f766e0d;border-radius:6px;padding:.5rem;display:flex}.flexaxes__box--row{flex-direction:row;gap:.5rem}.flexaxes__box--col{flex-direction:column;gap:.5rem}.flexaxes__item{border:1px solid var(--color-accent);width:2.8rem;height:2.8rem;color:var(--color-accent-strong);background:#0f766e1a;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;font-size:.85rem;font-weight:700;display:flex}.flexaxes__arrows{gap:1rem;margin-top:.25rem;display:flex}.flexaxes__axis{align-items:center;gap:.4rem;display:flex}.flexaxes__arrow-line{flex-shrink:0;display:block}.flexaxes__arrow-line--h{border-top:2px solid var(--color-accent);width:3.5rem;height:0;position:relative}.flexaxes__arrow-line--h:after{content:"";border:5px solid #0000;border-left:7px solid var(--color-accent);position:absolute;top:-5px;right:-1px}.flexaxes__arrow-line--v{border-left:2px solid var(--color-accent);width:0;height:3.5rem;position:relative}.flexaxes__arrow-line--v:after{content:"";border:5px solid #0000;border-top:7px solid var(--color-accent);position:absolute;bottom:-1px;left:-5px}.flexaxes__arrow-label{color:var(--color-accent);white-space:nowrap;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.72rem;font-weight:700}.visual--grid-vs-flexbox{flex-wrap:wrap;justify-content:center;gap:2rem;display:flex}.gvf__panel{flex-direction:column;align-items:center;gap:.5rem;min-width:160px;display:flex}.gvf__title{text-transform:uppercase;letter-spacing:.04em;color:var(--color-accent-strong);font-size:.85rem;font-weight:700}.gvf__subtitle{color:var(--color-text);font-size:1.4rem;font-weight:800;line-height:1}.gvf__box{border:1px solid var(--color-locked);background:#0f766e0d;border-radius:6px;padding:.4rem}.gvf__box--flex{gap:.4rem;width:100%;display:flex}.gvf__box--grid{grid-template-columns:1fr 1fr;gap:.4rem;display:grid}.gvf__item{border:1px solid var(--color-accent);width:2.8rem;height:2.8rem;color:var(--color-accent-strong);background:#0f766e1a;border-radius:4px;justify-content:center;align-items:center;font-size:.85rem;font-weight:700;display:flex}.gvf__desc{color:var(--color-muted);text-align:center;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.72rem}.steps-diagram{counter-reset:step;flex-direction:column;gap:.5rem;margin:1rem 0;padding:0;list-style:none;display:flex}.steps-diagram__step{align-items:center;gap:.75rem;font-size:.9rem;display:flex}.steps-diagram__marker{background:var(--color-accent);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:1.5rem;height:1.5rem;font-size:.75rem;font-weight:700;display:inline-flex}.knowledge-check{border-top:1px dashed var(--color-border);margin-top:1.25rem;padding-top:1rem}.knowledge-check__title{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);font-size:.8rem}.knowledge-check__prompt{font-weight:600}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.choice-group{border:none;margin:.5rem 0;padding:0}.choice-group__legend{color:var(--color-text-muted);margin-bottom:.35rem;font-size:.78rem}.choice-list{flex-direction:column;gap:.35rem;margin:0;padding:0;list-style:none;display:flex}.choice{border:1px solid var(--color-border);cursor:pointer;border-radius:6px;align-items:flex-start;gap:.6rem;padding:.55rem .75rem;display:flex}.choice:hover{border-color:var(--color-accent)}.choice--selected{border-color:var(--color-accent);background:#0f766e0f}.choice:has(input:focus-visible){outline:2px solid var(--color-accent);outline-offset:1px}.choice input{margin-top:.2rem}.exercise-unsupported{color:var(--color-text-muted);font-size:.9rem}.code-fill input[type=text]{border:1px solid var(--color-border);border-radius:6px;width:100%;max-width:22rem;padding:.45rem .6rem;font-family:ui-monospace,Consolas,monospace;font-size:.9rem}.ordering{flex-direction:column;gap:.4rem;margin:.5rem 0;display:flex}.ordering__hint{color:var(--color-text-muted);margin-bottom:.25rem;font-size:.78rem}.ordering-list{flex-direction:column;gap:.4rem;margin:0;padding:0;list-style:none;display:flex}.ordering__item{border:1px solid var(--color-border);background:var(--color-surface);border-radius:6px;align-items:center;gap:.6rem;padding:.45rem .75rem;display:flex}.ordering__buttons{gap:.25rem;margin-left:auto;display:flex}.ordering__buttons button{min-height:2.25rem;padding:.2rem .6rem;font-size:.8rem}.matching{flex-direction:column;gap:.45rem;margin:.5rem 0;display:flex}.matching__row{align-items:center;gap:.75rem;display:flex}.matching__left{flex:1;font-weight:500}.matching__arrow{color:var(--color-text-muted)}.matching__right select{font:inherit;border:1px solid var(--color-border);background:var(--color-surface);border-radius:6px;min-width:12rem;padding:.35rem .5rem;font-size:.85rem}.write-code{margin:.75rem 0}.write-code__label{color:var(--color-text-muted);margin-bottom:.4rem;font-size:.8rem;font-weight:600;display:block}.write-code__textarea{tab-size:2;border:1px solid var(--color-border);color:#fafaf9;resize:vertical;background:#1c1917;border-radius:8px;width:100%;min-height:16rem;padding:.85rem;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:.85rem;line-height:1.6}.write-code__textarea::placeholder{color:#a8a29e}.write-code__textarea:focus{outline:2px solid var(--color-accent);outline-offset:1px}.write-code__validation{flex-direction:column;gap:.5rem;margin-top:.75rem;display:flex}.validation-group{border:1px solid var(--color-border);background:var(--color-surface);border-radius:8px;padding:.6rem .85rem}.validation-group__heading{cursor:pointer;color:var(--color-text);font-size:.8rem;font-weight:600}.validation-group__checks{flex-direction:column;gap:.25rem;margin:.35rem 0 0;padding:0;list-style:none;display:flex}.validation-check{font-size:.82rem}.validation-check--passed{color:var(--color-completed)}.validation-check--failed{color:var(--color-danger)}.feedback{border-radius:8px;margin:.75rem 0;padding:.75rem 1rem;font-size:.9rem}.feedback--correct{background:var(--color-correct-bg);border:1px solid var(--color-completed);color:#14532d}.feedback--incorrect{background:var(--color-incorrect-bg);border:1px solid var(--color-danger);color:#7f1d1d}.banner{border-radius:8px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;padding:.75rem 1rem;display:flex}.banner p{margin:0}.banner--success{background:var(--color-correct-bg);border:1px solid var(--color-completed);color:#14532d}.exercise-card{background:var(--color-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-card);border-radius:8px;padding:1.25rem 1.5rem}.exercise-card__title{font-size:1.15rem}.test-intro{background:var(--color-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-card);border-radius:8px;padding:1rem 1.25rem}.test-intro__instructions{color:var(--color-text-muted);font-size:.9rem}.test-questions{flex-direction:column;gap:1rem;margin:0;padding:0;list-style:none;display:flex}.test-question{background:var(--color-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-card);border-radius:8px;padding:1rem 1.25rem}.test-question__heading{align-items:flex-start;gap:.6rem;margin-bottom:.5rem;display:flex}.test-question__number{background:var(--color-accent);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:1.5rem;height:1.5rem;font-size:.75rem;font-weight:700;display:inline-flex}.test-question__prompt{margin:0;font-size:1rem}.test-submit{flex-wrap:wrap;align-items:center;gap:.75rem;margin-top:1.25rem;display:flex}.test-submit__status{color:var(--color-text-muted);margin-right:auto;font-size:.85rem}.test-submit button:first-of-type{border-color:var(--color-accent);background:var(--color-accent);color:#fff;font-weight:600}.test-submit button:first-of-type:hover:not(:disabled){background:var(--color-accent-strong);border-color:var(--color-accent-strong);color:#fff}.result-heading{border-radius:8px;margin-bottom:1.5rem;padding:1.25rem 1.5rem}.result-heading--passed{background:var(--color-correct-bg);border:1px solid var(--color-completed)}.result-heading--failed{background:var(--color-incorrect-bg);border:1px solid var(--color-danger)}.result-heading__verdict{letter-spacing:.04em;margin-bottom:.25rem;font-size:2rem;font-weight:800}.result-heading--passed .result-heading__verdict{color:var(--color-completed)}.result-heading--failed .result-heading__verdict{color:var(--color-danger)}.result-heading__score,.result-heading__requirement,.result-heading__message{margin-bottom:.25rem}.result-heading__requirement{color:var(--color-text-muted);font-size:.9rem}.review-list{flex-direction:column;gap:.75rem;margin:.5rem 0 0;padding:0;list-style:none;display:flex}.review-item{border:1px solid var(--color-border);border-left:4px solid var(--color-border);background:var(--color-surface);border-radius:8px;padding:.9rem 1.1rem}.review-item--correct{border-left-color:var(--color-completed)}.review-item--incorrect{border-left-color:var(--color-danger)}.review-item__heading{align-items:baseline;gap:.6rem;display:flex}.review-item__status{text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;font-size:.72rem;font-weight:700}.review-item--correct .review-item__status{color:var(--color-completed)}.review-item--incorrect .review-item__status{color:var(--color-danger)}.review-item__prompt{margin:0;font-size:.98rem}.review-item__line{margin:.4rem 0 0;font-size:.88rem}.review-item__explanation{color:var(--color-text-muted);border-top:1px dashed var(--color-border);margin:.4rem 0 0;padding-top:.4rem;font-size:.85rem}@media (width<=600px){.course-overview,.session-screen{padding:1.25rem .9rem 3.5rem}.learn-section,.exercise-card,.test-question{padding:1rem}.anatomy__attr-brackets{line-height:1.45}.anatomy__attr{margin:.15rem .2rem;padding:.15rem .5rem;font-size:.85rem}.stage-tabs{flex-wrap:wrap}.stage-actions{flex-direction:column;align-items:stretch}.stage-actions button{width:100%}.matching__row{flex-direction:column;align-items:stretch;gap:.35rem}.matching__arrow{display:none}.matching__right select{width:100%;min-width:0}.ordering__buttons{justify-content:flex-end;margin-left:0}.review-item__heading{flex-direction:column;align-items:flex-start;gap:.2rem}.test-submit{flex-direction:column;align-items:stretch}.test-submit button{width:100%}.code-block{padding:.85rem;font-size:.8rem}.fill-code__input{min-width:5em}.form-field__part code{font-size:.8rem}.form-field__tie{font-size:.72rem}.visual--tree{font-size:.82rem}.rule-anatomy__part{padding:.4rem .5rem}.rule-anatomy__part code{font-size:.85rem}.box-model__layer--margin{padding:1.1rem 1.2rem}.box-model__layer--border,.box-model__layer--padding{padding:.7rem .8rem}.box-model__tag{font-size:.66rem}.html-preview{height:13rem}.write-code__textarea{min-height:12rem;font-size:.8rem}}.workspace-screen{grid-template-columns:200px 280px 300px minmax(0,1fr);grid-template-areas:"nav roadmap tree workspace";height:100vh;display:grid;overflow:hidden}.workspace-region{min-height:0;overflow-y:auto}.workspace-region--roadmap{background:var(--color-surface);border-right:1px solid var(--color-border);grid-area:roadmap;padding:1.25rem 1rem}.workspace-region--tree{background:var(--color-surface);border-right:1px solid var(--color-border);grid-area:tree;padding:1.25rem 1rem}.workspace-region--workspace{background:var(--color-bg);grid-area:workspace;padding:1.75rem 2rem 4rem}.region-back{margin-bottom:.75rem;display:none}.region-label{text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);margin-bottom:.5rem;font-size:.68rem;font-weight:700;display:block}.region-placeholder{color:var(--color-text-muted);font-size:.9rem}.nav-rail{background:var(--color-surface);border-right:1px solid var(--color-border);flex-direction:column;grid-area:nav;align-self:stretch;gap:1rem;min-height:0;padding:1rem;display:flex;overflow-y:auto}.nav-rail__brand{align-items:center;gap:.6rem;display:flex}.nav-rail__logo{background:var(--color-accent);color:#fff;border-radius:8px;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:.8rem;font-weight:800;display:inline-flex}.nav-rail__name{letter-spacing:-.01em;font-size:1.05rem;font-weight:700}.nav-rail__home{margin-top:.25rem}.nav-rail__footer{margin-top:auto}.nav-rail__dev summary{cursor:pointer;text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-muted);opacity:.35;padding:.35rem .1rem;font-size:.62rem;font-weight:700;list-style:none;transition:opacity .15s}.nav-rail__dev summary::-webkit-details-marker{display:none}.nav-rail:hover .nav-rail__dev summary,.nav-rail__dev[open] summary{opacity:.9}.nav-rail__dev-hint{color:var(--color-text-muted);margin:.4rem 0;font-size:.75rem}.nav-rail__dev-reset{min-height:2.25rem;color:var(--color-danger);padding:.35rem .8rem;font-size:.8rem}.roadmap{flex-direction:column;gap:1rem;display:flex}.roadmap__progress-label{color:var(--color-text-muted);margin-bottom:.3rem;font-size:.78rem;display:block}.roadmap__progress-bar{background:var(--color-border);border-radius:4px;height:8px;overflow:hidden}.roadmap__progress-fill{background:var(--color-accent);border-radius:4px;height:100%;transition:width .2s}.roadmap__modules{margin:0;padding:0;list-style:none;position:relative}.roadmap__modules:before{content:"";background:var(--color-spine);border-radius:1px;width:2px;position:absolute;top:.55rem;bottom:.55rem;left:calc(3rem - 1px)}.roadmap__module{margin-bottom:1.1rem;padding-left:2.25rem;position:relative}.roadmap__module:last-child{margin-bottom:0}.roadmap__module--future{margin-bottom:.45rem}.roadmap__module--future .roadmap__module-head{min-height:1.9rem}.roadmap__module--future .roadmap__module-eta{margin-top:-.1rem}.roadmap__module-head{align-items:center;gap:.6rem;min-height:2.25rem;display:flex}.roadmap__module-head-text{flex-direction:column;gap:.05rem;min-width:0;display:flex}.roadmap__module-title{text-transform:uppercase;letter-spacing:.04em;margin:0;font-size:.8rem;font-weight:700;line-height:1.35}.roadmap__module-eta{letter-spacing:.03em;color:var(--color-text-muted);font-size:.66rem;font-weight:600}.roadmap__module-head .status-glyph{border-radius:50%;flex-shrink:0;width:1.5rem;height:1.5rem;font-size:.72rem}.roadmap__module-head .status-glyph--completed{background:var(--color-completed);color:#fff}.roadmap__module-head .status-glyph--current{background:var(--color-current);color:#fff}.roadmap__module-head .status-glyph--upcoming,.roadmap__module-head .status-glyph--locked{background:var(--color-surface);border:2px solid var(--color-locked);color:var(--color-locked);font-size:0}.roadmap__module-head .status-glyph--upcoming:after,.roadmap__module-head .status-glyph--locked:after{content:"";border-radius:50%;width:.3rem;height:.3rem}.roadmap__module-head .status-glyph--upcoming:after{background:0 0}.roadmap__module-head .status-glyph--locked:after{background:var(--color-locked)}.roadmap__sessions{border-left:2px solid var(--color-spine);flex-direction:column;gap:.3rem;margin:.55rem 0 0 .75rem;padding:0 0 0 1.1rem;list-style:none;display:flex;position:relative}.roadmap__sessions>li{position:relative}.roadmap__sessions>li:before{content:"";background:var(--color-spine);width:1.1rem;height:2px;position:absolute;top:1.25rem;left:-1.1rem}.roadmap__session-button{text-align:left;background:0 0;border:none;border-radius:6px;align-items:center;gap:.5rem;width:100%;min-height:2.5rem;padding:.4rem .55rem;font-size:.88rem;display:flex}.roadmap__session-button:hover:not(:disabled){background:var(--color-surface);color:var(--color-text);border-color:#0000}.roadmap__session-button.is-active{color:var(--color-current-strong);background:#7c3aed1a}.roadmap__checkpoint{letter-spacing:.02em;color:var(--color-checkpoint);align-items:center;gap:.5rem;margin-top:.55rem;font-size:.72rem;font-weight:700;display:flex}.roadmap__sessions>li.roadmap__checkpoint:before{top:.8rem}.roadmap__checkpoint-marker{width:1.5rem;color:var(--color-checkpoint);justify-content:center;align-items:center;font-size:.9rem;display:inline-flex}.status-glyph{flex-shrink:0;justify-content:center;align-items:center;width:1.25rem;font-size:.8rem;display:inline-flex}.status-glyph--completed{color:var(--color-completed)}.status-glyph--current{color:var(--color-current)}.status-glyph--upcoming{color:var(--color-text-muted)}.status-glyph--locked{color:var(--color-locked)}.knowledge-tree{flex-direction:column;gap:.75rem;display:flex}.knowledge-tree__header{flex-direction:column;gap:.15rem;display:flex}.knowledge-tree__title{margin:0;font-size:1.05rem}.knowledge-tree__list{flex-direction:column;gap:.3rem;margin:0;padding:0;list-style:none;display:flex}.knowledge-tree__list--nested{margin:.3rem 0 0 .3rem;padding-left:1.1rem}.knowledge-tree__item{flex-direction:column;display:flex;position:relative}.knowledge-tree__item--branched:before{content:"";background:var(--color-spine);width:1.15rem;height:2px;position:absolute;top:1.25rem;left:.29rem}.knowledge-tree__item--branched:after{content:"";background:var(--color-spine);width:2px;position:absolute;top:1.25rem;bottom:1.25rem;left:.29rem}.knowledge-tree__list--nested>.knowledge-tree__item:before{content:"";background:var(--color-spine);width:1.1rem;height:2px;position:absolute;top:1.25rem;left:-1.1rem}.knowledge-tree__node{text-align:left;background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:.5rem;min-height:2.5rem;padding:.4rem .6rem;font-size:.9rem;display:flex}.knowledge-tree__node--parent{font-weight:700}.knowledge-tree__node:hover:not(:disabled){border-color:var(--color-border);background:var(--color-surface)}.knowledge-tree__node.is-selected{border-color:var(--color-current);color:var(--color-current-strong);background:#7c3aed1a}.knowledge-tree__node:disabled{cursor:not-allowed;opacity:.65}.tree-empty{color:var(--color-text-muted)}.concept-workspace{flex-direction:column;gap:1rem;max-width:1000px;margin:0 auto;display:flex;container:workspace/inline-size}.concept-header{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:flex-start;gap:1rem;padding-bottom:.9rem;display:flex}.concept-header__crumb{color:var(--color-text-muted);margin:0 0 .2rem;font-size:.78rem}.concept-header__title{letter-spacing:-.015em;margin:0;font-size:1.6rem;font-weight:800}.concept-header__exit{flex-shrink:0;min-height:2.5rem;padding:.4rem 1rem}.learn-section__media{margin:.9rem 0}@container workspace (width>=620px){.learn-section__media{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:1.25rem;display:grid}.learn-section__media>*{min-width:0;margin:0}}.takeaway{border-left:4px solid var(--color-accent);background:#0f766e0f;border-radius:0 8px 8px 0;margin:1rem 0 .25rem;padding:.75rem 1rem}.takeaway__label{text-transform:uppercase;letter-spacing:.06em;color:var(--color-accent-strong);margin-bottom:.25rem;font-size:.68rem;font-weight:700;display:block}.takeaway__text{margin:0;font-size:.92rem}.empty-session{flex-direction:column;align-items:flex-start;gap:.75rem;max-width:42rem;margin:2rem auto 0;display:flex}.empty-session__title{margin:0}.empty-session__message{color:var(--color-text-muted)}.overview-panel{flex-direction:column;gap:1.5rem;max-width:720px;margin:0 auto;display:flex}.overview-panel__header h1{letter-spacing:-.02em;margin-bottom:.25rem;font-size:1.6rem}.overview-panel__header p{color:var(--color-text-muted)}@media (width>=768px) and (width<=1023px){.workspace-screen{grid-template-columns:200px 300px minmax(0,1fr);grid-template-areas:"nav tree workspace"}.workspace-region--roadmap{display:none}}@media (width<=767px){.workspace-screen{flex-direction:column;display:flex}.nav-rail{border-right:none;border-bottom:1px solid var(--color-border);flex-direction:row;align-items:center;gap:.75rem}.nav-rail__home{margin-top:0}.nav-rail__footer{margin-top:0;margin-left:auto}.workspace-region{border-right:none;flex:1;padding:1rem;display:none}.workspace-region--workspace{padding:1rem}.workspace-screen[data-mobile-view=map] .workspace-region--roadmap,.workspace-screen[data-mobile-view=tree] .workspace-region--tree,.workspace-screen[data-mobile-view=concept] .workspace-region--workspace{display:block}.region-back{display:inline-flex}.workspace-screen[data-mobile-view=tree] .nav-rail__home,.workspace-screen[data-mobile-view=concept] .nav-rail__home,.nav-rail__dev{display:none}}