/*
Theme Name: HTML Code Runner Learning
Version: 2.0.1
Requires at least: 6.6
Requires PHP: 8.2
Text Domain: html-code-runner
License: GPL-2.0-or-later
*/
:root{color-scheme:light;--ink:#192c2b;--muted:#61706f;--accent:#08775c;--accent-dark:#075d49;--mint:#e9f5ed;--paper:#fff;--canvas:#fafbf8;--line:#e1e7e2;--soft:#f1f4f0;--header:82px;--font:Inter,"Segoe UI",Arial,sans-serif;--mono:"Cascadia Code",Consolas,"Courier New",monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.7 var(--font);-webkit-font-smoothing:antialiased}a{color:var(--accent);text-underline-offset:4px}button,input,select,textarea{font:inherit}button,a,input,textarea,summary{touch-action:manipulation}button,summary{cursor:pointer}button{color:var(--ink)}button:disabled{cursor:default;opacity:.55}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid #dba52d;outline-offset:4px}img,svg{max-width:100%}svg{vertical-align:middle}h1,h2,h3,h4{color:var(--ink);line-height:1.2;letter-spacing:-.035em}p{margin:0 0 1.2em}h1{font-size:clamp(2.35rem,3.5vw,3.5rem);margin:0 0 20px;font-weight:750}h2{font-size:2rem;font-weight:700}h3{font-size:1.28rem}strong,b{font-weight:650}[hidden]{display:none!important}.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;left:16px;top:-90px;z-index:100;background:var(--ink);color:white;padding:10px 18px;border-radius:5px}.skip:focus{top:10px}.content{min-width:0}.content:focus{outline:none}.eyebrow{font-size:11px;font-weight:750;letter-spacing:.14em;line-height:1.5;color:var(--accent);margin:0 0 20px}.eyebrow>span{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:8px;vertical-align:2px}.button{display:inline-flex;justify-content:center;align-items:center;gap:25px;min-height:50px;padding:13px 22px;text-decoration:none;border-radius:7px;border:1px solid transparent;font-size:14px;line-height:1.4;font-weight:650}.button-primary{background:var(--accent);color:white;box-shadow:0 3px 0 rgba(5,70,52,.1)}.button-primary:hover{background:var(--accent-dark);color:white}.button-primary span{font-size:20px;font-weight:400}.button-text{padding-left:0;background:transparent;color:var(--ink)}.button-text:hover{color:var(--accent)}.button-outline{background:white;border-color:#b9d0c2;color:var(--accent)}.button-outline:hover{border-color:var(--accent)}.text-link{font-size:14px;font-weight:650;text-decoration:none;white-space:nowrap}.text-link span{margin-left:16px}.text-link:hover{text-decoration:underline}.level-dot,.status-dot{display:inline-block;flex-shrink:0;width:6px;height:6px;background:#25966c;border-radius:50%}
/* Header */
.site-header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.header-inner{max-width:1500px;min-height:var(--header);margin:auto;padding:0 38px;display:flex;align-items:center;gap:34px}.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;flex-shrink:0}.brand-mark{display:grid;place-items:center;background:var(--accent);color:white;width:39px;height:39px;font:700 18px var(--mono);border-radius:9px;letter-spacing:-3px;padding-right:3px}.brand-name{font-size:15px;font-weight:760;letter-spacing:-.025em;line-height:1.4}.brand-caption{display:block;font-size:8px;font-weight:650;letter-spacing:.19em;color:var(--muted);margin-top:3px}.primary-nav{display:flex;gap:24px;align-items:center;flex-shrink:0}.primary-nav>a{font-size:13px;white-space:nowrap;font-weight:550;text-decoration:none;color:#4b5a56;padding:30px 0;position:relative}.primary-nav>a:hover,.primary-nav>a[aria-current]{color:var(--accent)}.primary-nav>a[aria-current]:after{content:"";height:2px;position:absolute;bottom:0;left:0;right:0;background:var(--accent)}.header-search{margin-left:auto;min-width:190px;max-width:300px;flex:1}.search-form{display:flex;align-items:center;min-height:40px;border:1px solid var(--line);background:#f8faf7;border-radius:6px;position:relative}.search-icon{display:flex;align-items:center;padding:0 9px 0 12px;color:#7a8580;flex-shrink:0}.search-icon svg{width:17px;height:17px}.search-form input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:12px;padding:10px 0}.search-form input:focus-visible{outline-offset:1px}.search-form input::placeholder{color:#7b8580}.search-form button{border:0;border-left:1px solid var(--line);background:white;margin:0 6px 0 8px;color:#63716b;border-radius:3px;width:24px;height:24px;font-size:14px}.runner-link{display:flex;gap:16px;align-items:center;font-size:12px;font-weight:650;color:var(--ink);text-decoration:none;white-space:nowrap}.runner-link:hover{color:var(--accent)}.runner-link span{font-size:19px}.mobile-menu,.drawer-close{display:none}.home-view>.chapters{display:none}
/* Homepage */
.home-view{background:var(--canvas)}.home-container{max-width:1240px;margin:auto;padding:0 44px}.hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px;padding:83px 0 70px}.hero h1{font-size:clamp(3.7rem,5.8vw,5rem);font-weight:740;letter-spacing:-.065em;line-height:1.035;margin-bottom:27px}.hero h1>span{color:var(--accent)}.hero-description{color:var(--muted);font-size:16px;line-height:1.85;max-width:440px}.hero-actions{display:flex;gap:25px;align-items:center;margin-top:31px;flex-wrap:wrap}.hero-note{display:flex;align-items:center;gap:8px;color:#6b7871;font-size:11px;margin-top:21px}.check-circle{display:grid;place-items:center;border:1px solid #adc8b6;width:14px;height:14px;border-radius:50%;color:var(--accent);font-size:9px}.hero-workspace{background:white;border:1px solid #d9e3da;border-radius:12px;box-shadow:0 28px 65px -38px #405c4680,0 2px 4px #152f1c05;position:relative;transform:rotate(1deg)}.hero-workspace:before{content:"";position:absolute;inset:22px -17px -17px 22px;border:1px solid #e0e9d8;background:#f1f5e9;border-radius:12px;z-index:-1;transform:rotate(-3deg)}.workspace-top{display:flex;align-items:center;gap:20px;border-bottom:1px solid #e9ede7;padding:15px 19px;color:#6d7872;font-size:10px;font-family:var(--mono)}.window-dots{display:flex;gap:5px}.window-dots i{width:6px;height:6px;border-radius:50%;background:#d5ddd4}.window-dots i:first-child{background:#d7b0a1}.window-dots i:nth-child(2){background:#dccb8d}.window-dots i:last-child{background:#9fbea7}.workspace-badge{margin-left:auto;background:#e9f3e8;color:#4d7758;padding:3px 6px;border-radius:3px;font-size:9px}.workspace-code{padding:25px 18px;background:#f9fbf8;overflow:auto}.code-line{display:flex;gap:20px;white-space:nowrap;font:11px/2.2 var(--mono);color:#495958}.code-line>span{color:#a1aca4;font-size:10px;user-select:none}.code-line code{font:inherit}.code-line b{color:#168363;font-weight:500}.code-line em{color:#8064a1;font-style:normal}.code-line strong{color:#b07926;font-weight:400}.preview-label{display:flex;align-items:center;gap:7px;border-top:1px solid #e9ede7;border-bottom:1px solid #e9ede7;padding:10px 19px;color:#65736b;font-size:8px;letter-spacing:.1em;font-weight:650}.preview-label>span:last-child{margin-left:auto;letter-spacing:0;font-weight:400}.preview-label .status-dot{width:4px;height:4px}.workspace-preview{padding:25px 34px 30px;background:white;border-radius:0 0 12px 12px}.preview-icon{display:grid;place-items:center;width:33px;height:33px;background:#edf4e4;border-radius:8px;color:#578350;font-size:27px;margin-bottom:17px}.workspace-preview h2{font-size:23px;letter-spacing:-.05em;margin:0 0 10px}.workspace-preview p{font-size:12px;color:#7b867e;line-height:1.8;margin-bottom:19px}.workspace-preview a{font-size:10px;color:var(--accent);font-weight:650;text-decoration:none;border-bottom:1px solid #94b5a3;padding-bottom:4px}.workspace-preview a span{margin-left:25px}.workspace-caption{position:absolute;bottom:-43px;left:15px;color:#718271;font-size:10px;font-family:var(--mono);transform:rotate(-1deg)}.workspace-caption span{font-size:24px;display:inline-block;vertical-align:-4px;margin-right:8px}.proof-strip{display:grid;grid-template-columns:repeat(3,1fr) 1.4fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;margin-top:18px;gap:20px}.proof-strip>div{display:flex;flex-direction:column;padding-left:30px;border-left:1px solid var(--line)}.proof-strip>div:first-child{padding-left:0;border-left:0}.proof-strip strong{font-size:22px;letter-spacing:-.04em;font-weight:700;line-height:1.4}.proof-strip span{color:var(--muted);font-size:11px;margin-top:3px}.proof-strip>div:last-child strong{font-size:19px}.home-section{padding:76px 0 0}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin-bottom:30px}.section-heading .eyebrow{margin-bottom:12px}.section-heading h2{font-size:32px;margin:0;letter-spacing:-.05em}.section-heading>p{font-size:13px;color:var(--muted);line-height:1.8;max-width:340px;margin:0 0 3px}.path-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.path-card{padding:25px 26px 23px;border-radius:8px;border:1px solid rgba(30,65,30,.05)}.path-mint{background:#eaf3e8}.path-lavender{background:#eeedf6}.path-peach{background:#f7eee2}.path-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:31px}.path-top>span{text-transform:uppercase;font-size:9px;font-weight:700;letter-spacing:.1em;color:#637163}.path-top>b{font-family:var(--mono);font-size:25px;font-weight:400;color:#5a715d;opacity:.7}.path-lavender .path-top>b{color:#706587}.path-peach .path-top>b{color:#947047}.path-card h3{font-size:19px;margin:0 0 12px;letter-spacing:-.035em}.path-card p{font-size:12px;color:#647069;line-height:1.9;min-height:68px;margin:0 0 25px}.path-card a{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:650;text-decoration:none;color:var(--ink);border-top:1px solid rgba(30,65,30,.11);padding-top:14px}.path-card a span{font-size:18px}.library-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.library-card{display:flex;gap:20px;border:1px solid var(--line);padding:26px;background:white;border-radius:8px;text-decoration:none;transition:box-shadow .15s,border-color .15s}.library-card:hover{border-color:#95b9a0;box-shadow:0 8px 18px #243a2b06}.library-icon{width:42px;height:42px;display:grid;place-items:center;background:#f3f6f0;color:var(--accent);font:600 17px var(--mono);flex-shrink:0;border-radius:8px}.library-card h3{font-size:16px;margin:0 0 9px}.library-card h3 span{float:right;margin-left:15px;color:#7c8a7d;font-size:16px;font-weight:400}.library-card p{color:var(--muted);font-size:12px;line-height:1.85;margin:0 0 12px}.library-card small{font-size:10px;color:#788679}.resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.resource-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;padding:23px;background:white;min-width:0;transition:border-color .15s,box-shadow .15s}.resource-card:hover{border-color:#99b6a0;box-shadow:0 6px 18px #203c2b06}.resource-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.resource-type{font-size:9px;text-transform:uppercase;font-weight:700;letter-spacing:.08em;background:#edf5ed;color:#56755d;padding:3px 7px;border-radius:3px}.resource-number{font-family:var(--mono);font-size:13px;color:#94a094}.resource-card h2{font-size:17px;letter-spacing:-.025em;line-height:1.45;margin:0 0 11px}.resource-card h2 a{color:var(--ink);text-decoration:none}.resource-card h2 a:after{content:"";position:absolute;inset:0;border-radius:8px}.resource-card h2 a:focus-visible{outline:none}.resource-card:focus-within{outline:3px solid #dba52d;outline-offset:3px}.resource-card p{font-size:12px;line-height:1.85;color:var(--muted);margin:0 0 22px}.resource-meta{display:flex;align-items:center;gap:7px;font-size:10px;color:#778176;margin-top:auto;padding-top:16px;border-top:1px solid #edf0ea;flex-wrap:wrap}.resource-meta .level-dot{width:4px;height:4px}.card-arrow{margin-left:auto;color:var(--accent);font-size:16px}.approach-section{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding:66px;background:#eef4eb;border:1px solid #e5ece1;border-radius:12px;margin-top:76px}.approach-section h2{font-size:36px;letter-spacing:-.05em;margin:0 0 20px}.approach-section p{font-size:13px;color:#627360;line-height:1.9;margin-bottom:26px}.approach-list article{display:flex;gap:19px;padding:20px 0;border-bottom:1px solid #dce5d8}.approach-list article:first-child{padding-top:0}.approach-list article:last-child{border-bottom:0;padding-bottom:0}.approach-list article>span{font:12px var(--mono);color:#80947b;padding-top:4px}.approach-list h3{font-size:16px;margin:0 0 8px}.approach-list p{font-size:12px;margin:0;line-height:1.8}.markup-callout{display:flex;align-items:center;gap:28px;border:1px solid var(--line);background:white;border-radius:10px;padding:33px 36px;margin-top:35px}.markup-symbol{font:600 30px var(--mono);color:var(--accent);background:#eff7ed;border-radius:12px;display:grid;place-items:center;width:80px;height:80px;flex-shrink:0}.markup-callout .eyebrow{font-size:9px;margin-bottom:8px}.markup-callout h2{font-size:24px;margin:0 0 8px}.markup-callout p:not(.eyebrow){font-size:12px;line-height:1.8;color:var(--muted);margin:0;max-width:530px}.markup-callout .button{white-space:nowrap;margin-left:auto;font-size:12px;padding:12px 17px;gap:15px}.start-banner{display:flex;justify-content:space-between;align-items:center;gap:30px;margin:76px 0 80px;padding:45px 50px;border:1px solid #dae6d9;border-radius:10px;background:#f0f5e9}.start-banner .eyebrow{font-size:9px;margin-bottom:12px}.start-banner h2{font-size:37px;letter-spacing:-.05em;margin:0}.start-banner .button{min-width:220px}
/* Shared sidebar and learning workspace */
.learning-shell{display:grid;grid-template-columns:260px minmax(0,1fr);max-width:1600px;margin:auto;min-height:calc(100vh - var(--header))}.chapters{background:#fafbf8;border-right:1px solid var(--line);position:sticky;top:var(--header);align-self:start;height:calc(100vh - var(--header));overflow:auto;padding:25px 18px 30px;scrollbar-width:thin;scrollbar-color:#d4dfd4 transparent}.sidebar-heading{display:flex;justify-content:space-between;align-items:center;margin:0 7px 22px}.sidebar-heading a{color:var(--ink);font-size:12px;font-weight:700;text-decoration:none;display:flex;align-items:center;gap:8px}.small-code{font:600 14px var(--mono);color:var(--accent)}.course-progress{margin:0 7px 21px;padding:14px;border:1px solid #e0e8dd;background:white;border-radius:6px}.course-progress>div{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#6c7a6d}.course-progress strong{font-size:10px;color:var(--accent)}.course-progress progress{appearance:none;display:block;width:100%;height:4px;margin:10px 0 7px;border:0;border-radius:3px;overflow:hidden;background:#e8eee4}.course-progress progress::-webkit-progress-bar{background:#e8eee4}.course-progress progress::-webkit-progress-value{background:var(--accent);border-radius:3px}.course-progress progress::-moz-progress-bar{background:var(--accent)}.course-progress small{font-size:8px;color:#8a9589}.sidebar-tools{padding:0 7px 18px;margin-bottom:16px;border-bottom:1px solid var(--line)}.sidebar-tools a{display:flex;justify-content:space-between;padding:5px 0;text-decoration:none;color:#63705f;font-size:11px}.sidebar-tools a:hover{color:var(--accent)}.sidebar-tools a span{color:#a1ada0}.chapter-group{border:0;margin-bottom:12px}.chapter-group>summary{display:flex;align-items:center;gap:8px;list-style:none;padding:7px 8px;font-size:10px;font-weight:750;letter-spacing:.02em;color:#3e5143;line-height:1.4}.chapter-group>summary::-webkit-details-marker{display:none}.chapter-group>summary:before{content:"›";font-size:14px;color:#92a28e;transition:transform .15s}.chapter-group[open]>summary:before{transform:rotate(90deg)}.chapter-group>summary>span{margin-left:auto;font:9px var(--mono);color:#9aa697}.chapter-group a{display:flex;align-items:flex-start;gap:9px;font-size:11px;line-height:1.6;padding:7px 10px 7px 24px;color:#6b7667;border-radius:5px;text-decoration:none}.chapter-group a:hover{background:#edf3e9;color:var(--accent)}.chapter-group a[aria-current]{color:var(--accent);background:#e9f3e6;font-weight:650}.lesson-marker{width:5px;height:5px;border:1px solid #bdc8b7;border-radius:50%;margin-top:6px;flex-shrink:0}.chapter-group a[aria-current] .lesson-marker{background:var(--accent);border-color:var(--accent)}.chapter-group a.is-complete .lesson-marker{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 2px #e1efdc}.sidebar-note{display:flex;gap:12px;align-items:center;margin:25px 7px 0;padding-top:20px;border-top:1px solid var(--line)}.sidebar-note>span{font-size:25px;color:#8ba67c}.sidebar-note p{font-size:10px;color:#8a9583;line-height:1.6;margin:0}.sidebar-note strong{color:#6b7b61}.learning-main{min-width:0}.lesson-page,.archive-page{padding:30px 44px 65px;max-width:1310px;margin:0 auto}.breadcrumbs{display:flex;align-items:center;gap:9px;font-size:10px;color:#8a958a;line-height:1.7;margin:0 0 35px;min-width:0;flex-wrap:wrap}.breadcrumbs a{color:#788676;text-decoration:none}.breadcrumbs a:hover{color:var(--accent)}.breadcrumbs span[aria-current]{max-width:600px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#586957}.lesson-header{max-width:930px;border-bottom:1px solid var(--line);padding-bottom:28px;margin-bottom:30px}.lesson-kicker{display:flex;align-items:center;gap:14px;color:#91a08d;font-size:10px;margin-bottom:18px}.content-kind{font-size:9px;letter-spacing:.1em;font-weight:750;text-transform:uppercase;background:#edf5e9;color:#527349;padding:4px 8px;border-radius:3px}.lesson-header h1{max-width:850px;font-size:clamp(2rem,3.3vw,3.1rem);line-height:1.15;letter-spacing:-.05em;margin-bottom:20px}.lesson-deck{max-width:750px;font-size:15px;line-height:1.8;color:#71806b;margin-bottom:20px}.lesson-meta{display:flex;align-items:center;gap:22px;color:#84917f;font-size:10px;flex-wrap:wrap}.lesson-meta>span{display:flex;align-items:center;gap:7px}.lesson-meta svg{width:14px;height:14px}.reading-layout{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:46px;align-items:start}.reading-main{min-width:0;max-width:850px}.lesson-body{font-size:15px;line-height:1.9;color:#465544}.lesson-body h2{font-size:25px;line-height:1.35;letter-spacing:-.035em;margin:42px 0 15px;padding-top:0;scroll-margin-top:110px}.lesson-body>h2:first-child{margin-top:0}.lesson-body h3{font-size:20px;line-height:1.4;margin:30px 0 12px}.lesson-body p{margin-bottom:20px}.lesson-body ul,.lesson-body ol{padding-left:23px;margin:12px 0 24px}.lesson-body li{margin-bottom:8px;padding-left:3px}.lesson-body a{color:var(--accent);overflow-wrap:anywhere}.lesson-body a:hover{text-decoration-thickness:2px}.lesson-body :not(pre)>code{font:12px/1.7 var(--mono);color:#925737;background:#f6f1e9;border:1px solid #efe8dd;padding:2px 5px;border-radius:4px;overflow-wrap:anywhere}.lesson-body blockquote{margin:25px 0;background:#f1f6ec;border-left:3px solid #76a55f;padding:20px 23px;color:#5b7051;font-size:14px;border-radius:0 6px 6px 0}.lesson-body blockquote p:last-child{margin-bottom:0}.lesson-body table{border-collapse:collapse;margin:20px 0 30px;width:100%;display:block;overflow-x:auto;font-size:13px}.lesson-body th,.lesson-body td{text-align:left;border:1px solid var(--line);padding:12px 15px;vertical-align:top}.lesson-body th{background:#f4f7ef;color:#40533a;font-weight:650}.lesson-body tr:nth-child(even) td{background:#fcfdf9}.lesson-body details{border:1px solid #dce7d8;border-radius:7px;background:#fbfdf8;margin:20px 0;padding:0 20px 15px}.lesson-body details>summary{padding:15px 0;font-size:13px;font-weight:650;color:var(--accent);line-height:1.5}.lesson-body details:not([open]){padding-bottom:0}.lesson-body details>p{font-size:14px}.in-page-nav{position:sticky;top:110px;align-self:start;padding-top:4px;max-height:calc(100vh - 130px);overflow:auto;scrollbar-width:thin}.toc-label{font-size:9px;font-weight:750;letter-spacing:.11em;color:#91a08c;display:block;margin-bottom:13px}.toc{border-left:1px solid #e3eadd;padding-left:0}.toc a{display:block;font-size:10px;line-height:1.6;padding:5px 0 5px 13px;text-decoration:none;color:#8a9581;border-left:2px solid transparent;margin-left:-1px}.toc a:hover,.toc a.is-active{border-left-color:var(--accent);color:var(--accent)}.practice-note{margin-top:28px;padding:19px 15px;background:#f4f7ef;border:1px solid #e6ecdf;border-radius:6px}.practice-note>.small-code{display:block;margin-bottom:12px}.practice-note strong{display:block;font-size:12px;margin-bottom:7px}.practice-note p{font-size:11px;line-height:1.8;color:#8b9682;margin:0 0 13px}.practice-note a{font-size:10px;text-decoration:none;font-weight:650}.mobile-toc{display:none}.lesson-completion{display:flex;gap:14px;align-items:center;padding:23px;background:#edf5e7;border:1px solid #dbe8d3;border-radius:8px;margin-top:40px}.completion-icon{display:grid;place-items:center;width:34px;height:34px;background:#d8e9ce;color:var(--accent);border-radius:50%;flex-shrink:0;font-size:17px}.lesson-completion h2{font-size:15px;letter-spacing:-.02em;margin:0 0 5px}.lesson-completion p{font-size:11px;color:#78876c;line-height:1.65;margin:0}.lesson-completion .button{font-size:11px;min-height:40px;padding:10px 13px;gap:10px;white-space:nowrap;margin-left:auto}.lesson-completion .button span{font-size:11px}.progress-status:empty{display:none}.pager{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:25px 0 0}.pager>a{display:flex;flex-direction:column;gap:7px;border:1px solid var(--line);border-radius:7px;padding:17px 20px;text-decoration:none;line-height:1.6}.pager>a:hover{border-color:#9bb28f;background:#fafcf7}.pager>a:last-child{text-align:right}.pager small{color:#8c9a81;font-size:9px}.pager strong{font-size:12px;font-weight:600;color:#536748}.related-section{border-top:1px solid var(--line);margin-top:50px;padding-top:35px}.related-section .eyebrow{margin-bottom:10px}.related-section>h2{font-size:24px;margin:0 0 22px}.related-section .resource-card{padding:20px}.related-section .resource-card h2{font-size:15px}.related-section .resource-card p{font-size:11px}
/* Code and practice surfaces, all light */
pre{white-space:pre;overflow:auto;max-width:100%;background:#f6f8f2;color:#465943;padding:22px;border:1px solid #e1e8db;border-radius:7px;line-height:1.85;font-size:12px;tab-size:2}pre code{font:inherit;font-family:var(--mono)}.token-tag{color:#087760}.token-comment{color:#89977c;font-style:italic}pre+button{display:block;margin:-7px 0 25px auto;border:1px solid #dce5d5;background:white;border-radius:5px;font-size:10px;padding:5px 10px;color:#6e8063}.playground,.hcr-markup-lab,.hcr-challenge{border:1px solid #d4e1cc;border-radius:8px;background:#fff;margin:25px 0 30px;padding:18px;box-shadow:0 2px 4px #19362203}.toolbar{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.toolbar button,.hcr-assessment>button,.hcr-markup-lab>button,.hcr-challenge>button{border:1px solid #dbe5d5;background:#f8faf4;border-radius:5px;font-size:11px;line-height:1.4;padding:9px 13px;min-height:35px;color:#536a47;font-weight:600}.toolbar button:hover{border-color:#8aaa78;color:var(--accent)}.toolbar button[aria-pressed=true]{background:#e8f2df;color:var(--accent);border-color:#c6d9b9}.toolbar button[data-action=run],.hcr-assessment>button[type=submit]{background:var(--accent);color:white;border-color:var(--accent);padding-left:20px;padding-right:20px}.playground label[data-pane]{display:block;font:10px var(--mono);color:#9aa88d}.playground textarea,.hcr-markup-lab textarea,.hcr-challenge textarea{display:block;width:100%;resize:vertical;min-height:230px;background:#f9fbf6;color:#3f5537;border:1px solid #e1e8db;border-radius:5px;font:12px/1.9 var(--mono);padding:17px;tab-size:2;margin-top:6px}.playground iframe{display:block;width:100%;height:280px;background:white;border:1px solid #e3eadc;border-radius:5px}.playground [data-editor-status]{font-size:10px;line-height:1.6;color:#7f9070;margin:10px 0 0}.playground:fullscreen{background:white;padding:30px;overflow:auto}.playground:fullscreen iframe{height:40vh}.hcr-assessment{font-size:13px}.hcr-assessment>p:first-child{font-size:11px;color:#819174;border:1px solid #e2e9d9;background:#f8fbf3;padding:12px 15px;border-radius:5px}.hcr-assessment fieldset{border:1px solid #dfe8d6;border-radius:7px;padding:18px 21px;margin:22px 0;background:#fff}.hcr-assessment legend{font-size:14px;font-weight:650;padding:0 6px;color:#475e39;line-height:1.7}.hcr-assessment label{display:inline-block;margin:6px 0;color:#627653;font-size:13px;line-height:1.6}.hcr-assessment input[type=radio]{accent-color:var(--accent);margin-right:6px}.hcr-assessment input[type=text]{display:block;max-width:100%;width:100%;padding:10px 12px;border:1px solid #d9e4ce;background:#fbfdf8;color:#4a623d;border-radius:5px;font-family:var(--mono);font-size:12px}.hcr-assessment [data-feedback]{font-size:12px;line-height:1.8;margin:15px 0 0;color:#517243;background:#f1f7eb;padding:12px 14px;border-radius:4px}.hcr-assessment [data-feedback]:empty{display:none}.hcr-assessment [data-score]{margin-top:18px;font-size:13px;font-weight:650;color:var(--accent)}.hcr-markup-lab [data-lab-results],.hcr-challenge [data-challenge-results]{font-size:13px;line-height:1.8}.hcr-markup-lab h2,.hcr-challenge h2{margin-top:0}
/* Library and search */
.archive-page{max-width:1250px}.archive-header{margin-bottom:30px;max-width:730px}.archive-header .eyebrow{margin-bottom:14px}.archive-header h1{font-size:43px;letter-spacing:-.05em;margin-bottom:15px}.archive-header>p:not(.eyebrow){font-size:15px;color:#778670;max-width:650px;line-height:1.8;margin-bottom:20px}.archive-count{display:flex;align-items:center;gap:8px;font-size:10px;color:#8e9b85}.library-tabs{display:flex;gap:20px;border-bottom:1px solid var(--line);overflow-x:auto;margin-bottom:25px;white-space:nowrap;scrollbar-width:thin}.library-tabs a{font-size:11px;font-weight:550;text-decoration:none;color:#829078;padding:12px 0;border-bottom:2px solid transparent}.library-tabs a:hover,.library-tabs a[aria-current]{color:var(--accent);border-bottom-color:var(--accent)}.library-filter{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.library-filter label{display:flex;align-items:center;gap:10px;background:#fafcf7;border:1px solid var(--line);padding:6px 11px;border-radius:5px;max-width:360px;width:100%}.library-filter label>span{color:#a0ad96;font-size:20px;line-height:1}.library-filter input{font-size:11px;border:0;background:transparent;padding:4px;width:100%;min-width:0;color:#4f6441}.library-filter input::placeholder{color:#9aa98d}.library-filter>span{font-size:10px;color:#9aa78e;white-space:nowrap}.archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pagination-wrap{margin-top:35px}.pagination-wrap .nav-links{display:flex;gap:7px;flex-wrap:wrap;justify-content:center}.page-numbers{padding:6px 12px;border:1px solid var(--line);font-size:11px;border-radius:4px;text-decoration:none;color:#748565}.page-numbers.current{background:var(--accent);border-color:var(--accent);color:#fff}.empty-results{padding:50px 30px;background:#f7faf2;border:1px solid var(--line);border-radius:8px;text-align:center}.empty-results>span{font-size:40px;color:#9aaa8b}.empty-results h2{font-size:24px;margin:12px 0}.empty-results>p{font-size:13px;color:#7e8e70}.empty-results .search-form{max-width:430px;margin:20px auto}.filter-empty{font-size:13px;color:#859477;padding:25px;background:#f7faf2;border-radius:6px}.not-found{max-width:740px;padding:70px 50px 100px;margin:auto}.error-code{display:block;font:90px/.9 var(--mono);color:#dfebd5;margin-bottom:35px;letter-spacing:-.08em}.not-found h1{font-size:44px}.not-found>p:not(.eyebrow){color:#7f8f71;font-size:14px;max-width:460px}.not-found .search-form{margin:27px 0;max-width:460px}
/* Footer */
.site-footer{border-top:1px solid var(--line);background:#fff;padding:45px 44px 0}.footer-inner{max-width:1152px;margin:auto;display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:45px;padding-bottom:35px}.footer-brand .brand-mark{width:32px;height:32px;font-size:15px}.footer-brand .brand-name{font-size:13px}.footer-brand .brand-caption{font-size:7px}.footer-inner>div>p{font-size:11px;line-height:1.8;color:#98a18e;margin-top:17px}.footer-inner nav{display:flex;flex-direction:column;gap:8px}.footer-label{font-size:8px;letter-spacing:.12em;color:#829078;font-weight:700;margin-bottom:10px}.footer-inner nav a{color:#7a8970;font-size:11px;text-decoration:none}.footer-inner nav a:hover{color:var(--accent)}.footer-bottom{max-width:1152px;margin:auto;border-top:1px solid #edf0e8;padding:17px 0 20px;display:flex;justify-content:space-between;gap:20px;color:#a1ab98;font-size:9px}.footer-bottom a{color:#829576;text-decoration:none}.drawer-backdrop{position:fixed;inset:0;background:#1b332b50;z-index:44;backdrop-filter:blur(2px)}
/* Responsive */
@media(min-width:1600px){.hero{gap:100px}.home-container{max-width:1330px}.hero h1{font-size:87px}.workspace-code .code-line{font-size:13px}}
@media(max-width:1300px){.header-inner{gap:23px;padding:0 27px}.primary-nav{gap:20px}.primary-nav>a{font-size:12px}.header-search{max-width:240px}.runner-link{display:none}.learning-shell{grid-template-columns:235px minmax(0,1fr)}.lesson-page,.archive-page{padding:28px 32px 55px}.reading-layout{gap:28px;grid-template-columns:minmax(0,1fr) 150px}.lesson-header h1{font-size:40px}.resource-card{padding:20px}.archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.approach-section{gap:55px;padding:45px}.markup-callout{gap:22px;padding:27px}.markup-symbol{width:60px;height:60px;font-size:25px}}
@media(max-width:1100px){.primary-nav{gap:17px}.header-inner{gap:25px}.brand-name{font-size:13px}.brand-mark{width:35px;height:35px}.brand-caption{font-size:7px}.header-search{max-width:220px}.hero{gap:35px;padding:65px 0 60px}.hero h1{font-size:65px}.home-container{padding:0 35px}.hero-description{font-size:14px}.hero-actions{gap:10px}.hero-actions .button{font-size:12px;padding:13px 17px;gap:15px}.workspace-code{padding:20px 13px}.code-line{font-size:10px;gap:12px}.workspace-preview{padding:23px 27px}.workspace-preview h2{font-size:22px}.reading-layout{display:block}.in-page-nav{display:none}.mobile-toc{display:block;margin:0 0 28px;border:1px solid #dfe7d7;border-radius:6px;padding:0 15px;background:#f8fbf4}.mobile-toc>summary{font-size:12px;font-weight:650;color:#647e51;padding:11px 0}.toc-mobile{padding:0 0 14px;display:grid;grid-template-columns:1fr 1fr;gap:5px 15px}.toc-mobile a{font-size:11px;line-height:1.6;color:#7e9270;text-decoration:none}.lesson-header h1{font-size:36px}.lesson-deck{font-size:14px}.resource-card h2{font-size:15px}.resource-card p{font-size:11px}.resource-meta{font-size:9px;gap:5px}.related-section .resource-grid{grid-template-columns:1fr}.related-section .resource-card p{max-width:620px}.related-section .resource-card .resource-top{margin-bottom:10px}.related-section .resource-card h2{font-size:17px}.related-section .resource-card p{font-size:12px}.path-card{padding:22px 20px}.path-card h3{font-size:17px}.path-card p{font-size:11px}.section-heading h2{font-size:30px}.markup-callout{flex-wrap:wrap}.markup-callout>div:nth-child(2){flex:1}.markup-callout .button{margin-left:82px}.start-banner{padding:38px}.approach-section{gap:35px;padding:37px}}
@media(max-width:900px){:root{--header:72px}.header-inner{padding:0 22px;gap:20px}.primary-nav{display:none}.header-search{max-width:360px}.mobile-menu{display:flex;gap:6px;align-items:center;justify-content:center;font-size:11px;border:1px solid var(--line);background:white;padding:8px 10px;border-radius:5px;flex-shrink:0}.mobile-menu>span{font-size:15px;color:#6d8263}.learning-shell{display:block}.chapters,.home-view>.chapters{display:none;position:fixed;top:0;bottom:0;left:0;width:300px;height:100dvh;z-index:45;border-right:1px solid #cadac1;padding-top:25px;box-shadow:10px 0 40px #1d342612}.chapters.open,.home-view>.chapters.open{display:block}.drawer-close{display:inline-flex;justify-content:center;align-items:center;border:1px solid var(--line);background:white;border-radius:5px;width:28px;height:28px;font-size:20px;color:#7c9270}.sidebar-heading a{font-size:12px}.chapter-group a{font-size:12px;padding:8px 10px 8px 24px}.chapter-group>summary{font-size:11px}.sidebar-tools a{font-size:12px}.course-progress small{font-size:9px}.course-progress>div,.course-progress strong{font-size:11px}.lesson-page,.archive-page{padding:28px 38px 55px}.reading-layout{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:30px}.in-page-nav{display:block;top:98px}.mobile-toc{display:none}.lesson-header h1{max-width:670px;font-size:38px}.hero{gap:29px}.hero h1{font-size:57px}.hero-description{font-size:13px}.hero .eyebrow{font-size:9px}.hero-actions .button-text{font-size:10px;padding-left:0;gap:10px}.hero-actions .button-primary{font-size:11px;padding:12px 15px;min-height:45px}.hero-actions{gap:9px}.hero-note{font-size:9px}.code-line{font-size:9px;gap:9px}.workspace-code{padding:18px 11px}.workspace-top{padding:12px;gap:12px;font-size:8px}.workspace-preview{padding:20px}.workspace-preview h2{font-size:19px}.workspace-preview p{font-size:10px}.preview-label{padding:9px 12px;font-size:7px}.workspace-caption{font-size:8px;bottom:-37px;left:5px}.path-top{margin-bottom:25px}.path-card{padding:20px 17px}.path-top>span{font-size:8px}.path-card h3{font-size:16px}.path-card p{min-height:83px}.path-card a{font-size:10px}.section-heading>p{max-width:260px;font-size:12px}.section-heading{gap:25px}.section-heading h2{font-size:28px}.section-heading .eyebrow{font-size:9px}.home-section{padding-top:60px}.library-card{padding:22px 20px;gap:15px}.library-icon{width:34px;height:34px;font-size:14px}.library-card h3{font-size:14px}.library-card p{font-size:11px}.library-card small{font-size:9px}.resource-grid{gap:12px}.resource-card{padding:19px}.resource-card h2{font-size:14px}.resource-card p{font-size:10px}.approach-section{margin-top:60px;padding:30px;gap:30px}.approach-section h2{font-size:30px}.approach-section p{font-size:12px}.approach-list h3{font-size:14px}.approach-list p{font-size:11px}.approach-list article{gap:13px}.approach-section .button{font-size:11px;padding:12px 16px;gap:15px}.start-banner{margin:60px 0}.start-banner h2{font-size:33px}.start-banner .button{font-size:12px;min-width:190px}.proof-strip{gap:15px}.proof-strip>div{padding-left:20px}.proof-strip span{font-size:10px}.proof-strip strong{font-size:21px}.proof-strip>div:last-child strong{font-size:17px}}
@media(max-width:700px){.home-container{padding:0 24px}.header-inner{padding:0 20px;gap:15px}.header-search{margin-left:auto;max-width:240px}.header-search input{font-size:10px}.header-search .search-icon{padding-left:9px;padding-right:5px}.header-search input::placeholder{font-size:10px}.brand-caption{font-size:6px}.brand-name{font-size:12px}.brand-mark{width:32px;height:32px;font-size:15px}.brand{gap:8px}.hero{padding:50px 0 50px;grid-template-columns:1fr;gap:48px}.hero-copy{max-width:540px}.hero h1{font-size:65px;line-height:1.02;margin-bottom:23px}.hero-description{font-size:15px;max-width:470px}.hero .eyebrow{font-size:10px}.hero-actions{gap:25px;margin-top:26px}.hero-actions .button-primary{font-size:13px;min-height:48px;padding:13px 20px;gap:25px}.hero-actions .button-text{font-size:12px;gap:15px}.hero-note{font-size:10px;margin-top:18px}.hero-workspace{max-width:520px;width:calc(100% - 14px);margin:0 auto 20px;transform:none}.workspace-code{padding:23px 20px}.code-line{font-size:12px;gap:20px}.workspace-top{padding:14px 19px;font-size:10px;gap:20px}.preview-label{padding:10px 19px;font-size:8px}.workspace-preview{padding:25px 30px}.workspace-preview h2{font-size:25px}.workspace-preview p{font-size:12px}.workspace-caption{font-size:10px;bottom:-37px}.proof-strip{grid-template-columns:1fr 1fr;gap:22px 15px;padding:25px 0}.proof-strip>div{padding-left:20px}.proof-strip>div:nth-child(3){padding-left:0;border-left:0}.proof-strip strong{font-size:23px}.proof-strip span{font-size:11px}.proof-strip>div:last-child strong{font-size:19px}.section-heading{align-items:flex-start;flex-direction:column;gap:18px;margin-bottom:25px}.section-heading h2{font-size:31px}.section-heading>p{max-width:450px;font-size:13px}.section-heading .eyebrow{font-size:9px}.section-heading .text-link{font-size:12px}.path-grid{grid-template-columns:1fr;gap:13px}.path-card{padding:23px 25px}.path-top{margin-bottom:22px}.path-top>span{font-size:9px}.path-card h3{font-size:21px}.path-card p{min-height:0;font-size:12px;max-width:450px;margin-bottom:23px}.path-card a{font-size:11px}.path-top>b{font-size:30px}.library-grid{grid-template-columns:1fr;gap:12px}.library-card{padding:23px;gap:19px}.library-icon{width:40px;height:40px;font-size:17px}.library-card h3{font-size:17px}.library-card p{font-size:12px}.library-card small{font-size:10px}.resource-grid{grid-template-columns:1fr}.resource-card{padding:23px}.resource-card h2{font-size:19px;line-height:1.4}.resource-card p{font-size:12px;max-width:470px}.resource-type{font-size:9px}.resource-meta{font-size:10px}.resource-top{margin-bottom:15px}.approach-section{grid-template-columns:1fr;padding:29px;gap:35px}.approach-section h2{font-size:33px}.approach-section p{font-size:13px}.approach-list h3{font-size:16px}.approach-list p{font-size:12px}.approach-section .button{font-size:12px}.markup-callout{padding:25px;gap:18px}.markup-symbol{display:none}.markup-callout h2{font-size:25px}.markup-callout p:not(.eyebrow){font-size:12px}.markup-callout .button{margin-left:0}.start-banner{padding:30px;flex-direction:column;align-items:flex-start;gap:25px}.start-banner h2{font-size:36px}.start-banner .button{font-size:12px}.reading-layout{display:block}.in-page-nav{display:none}.mobile-toc{display:block}.lesson-page,.archive-page{padding:23px 25px 45px}.breadcrumbs{font-size:9px;margin-bottom:26px}.breadcrumbs span[aria-current]{max-width:100%;white-space:normal}.lesson-header h1{font-size:35px;letter-spacing:-.045em}.lesson-deck{font-size:14px;line-height:1.85}.lesson-meta{font-size:9px;gap:17px}.lesson-kicker{font-size:9px}.lesson-header{padding-bottom:23px;margin-bottom:25px}.lesson-body{font-size:15px;line-height:1.9}.lesson-body h2{font-size:24px}.lesson-body h3{font-size:19px}.lesson-body table{font-size:12px}.lesson-completion{flex-wrap:wrap;padding:20px;gap:12px}.lesson-completion>div{flex:1;min-width:200px}.lesson-completion .button{margin-left:46px;margin-top:5px}.pager{gap:10px}.pager>a{padding:15px 14px}.pager strong{font-size:11px}.related-section .resource-grid{grid-template-columns:1fr}.archive-header h1{font-size:38px}.archive-header>p:not(.eyebrow){font-size:14px}.archive-grid{grid-template-columns:1fr 1fr;gap:12px}.archive-grid .resource-card{padding:18px}.archive-grid .resource-card h2{font-size:16px}.archive-grid .resource-card p{font-size:11px}.library-tabs{gap:20px}.library-filter>span{font-size:9px}.footer-inner{grid-template-columns:1fr 1fr;gap:30px}.footer-inner>div{grid-column:1/-1}.site-footer{padding:35px 25px 0}.footer-inner>div>p{max-width:380px}.footer-bottom{flex-direction:column;gap:8px;font-size:8px}.not-found{padding:50px 30px 70px}.not-found h1{font-size:36px}.error-code{font-size:75px}}
@media(max-width:480px){:root{--header:66px}.header-inner{padding:0 16px;gap:12px}.header-search{display:none}.brand{margin-right:auto}.brand-name{font-size:13px}.brand-caption{font-size:7px}.brand-mark{width:34px;height:34px}.mobile-menu{font-size:11px;padding:8px 11px}.home-container{padding:0 20px}.hero{padding-top:40px;gap:40px}.hero h1{font-size:57px;line-height:1.04}.hero-description{font-size:14px}.hero-actions{gap:18px}.hero-actions .button-text{font-size:11px;gap:8px}.hero-actions .button-primary{font-size:12px;padding:12px 17px;gap:20px}.hero-note{font-size:9px}.workspace-code{padding:19px 12px}.code-line{font-size:9px;gap:12px}.code-line>span{font-size:8px}.workspace-top{padding:12px;font-size:8px;gap:13px}.workspace-preview{padding:22px}.workspace-preview h2{font-size:23px}.preview-label{font-size:7px;padding:10px 12px}.preview-label>span:last-child{font-size:7px}.workspace-caption{font-size:8px}.proof-strip>div{padding-left:16px}.proof-strip strong{font-size:21px}.proof-strip span{font-size:10px}.proof-strip>div:last-child strong{font-size:17px}.section-heading h2{font-size:29px}.home-section{padding-top:49px}.path-card{padding:22px}.library-card{padding:22px 19px;gap:14px}.library-card h3{font-size:16px}.library-card p{font-size:11px}.library-icon{width:33px;height:33px;font-size:14px}.approach-section{padding:26px;margin-top:49px}.approach-section h2{font-size:30px}.start-banner{margin:49px 0}.start-banner h2{font-size:33px}.lesson-page,.archive-page{padding:21px 20px 40px}.lesson-header h1{font-size:30px}.lesson-deck{font-size:13px}.lesson-meta{gap:12px;font-size:8px}.lesson-meta>span{gap:5px}.lesson-meta svg{width:12px}.lesson-body{font-size:14px}.lesson-body h2{font-size:23px}.lesson-body h3{font-size:18px}.toc-mobile{grid-template-columns:1fr}.lesson-completion>div{min-width:0}.lesson-completion h2{font-size:14px}.lesson-completion p{font-size:10px}.pager{grid-template-columns:1fr}.pager>a:last-child{text-align:left}.archive-header h1{font-size:33px}.archive-grid{grid-template-columns:1fr}.archive-grid .resource-card{padding:22px}.archive-grid .resource-card h2{font-size:18px}.archive-grid .resource-card p{font-size:12px}.library-filter{gap:10px}.library-filter label{padding-left:8px}.library-filter input{font-size:10px}.library-filter>span{font-size:8px}.playground,.hcr-markup-lab,.hcr-challenge{padding:12px}.playground textarea,.hcr-markup-lab textarea,.hcr-challenge textarea{font-size:11px;padding:12px}.toolbar{gap:5px}.toolbar button{font-size:10px;padding:8px 10px}.toolbar button[data-action=run]{padding-left:14px;padding-right:14px}.hcr-assessment fieldset{padding:15px}.hcr-assessment legend{font-size:13px}.hcr-assessment label{font-size:12px}pre{font-size:11px;padding:17px}.chapters{width:min(310px,88vw)}.not-found h1{font-size:31px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
@media print{.site-header,.chapters,.in-page-nav,.mobile-toc,.site-footer,.lesson-completion,.pager,.related-section,.playground,.hcr-assessment,.hcr-markup-lab,.hcr-challenge,pre+button{display:none!important}.learning-shell,.reading-layout{display:block}.lesson-page{padding:0}.lesson-body{font-size:11pt;color:#000}pre{white-space:pre-wrap;border:1px solid #aaa}a{color:#000}.lesson-body details{display:block}.lesson-body details>*{display:block!important}}
/* Reading clarity and diagnostic feedback. */
.lesson-body{font-size:17px;color:#354a40;line-height:1.85}.lesson-deck{color:#52665a}.chapter-group a{font-size:12px;color:#52604e}.chapter-group>summary{font-size:11px}.toc a{font-size:12px;color:#5d6c55}.toc a[aria-current=location]{border-left-color:var(--accent);color:var(--accent);font-weight:650}.lesson-meta,.lesson-kicker,.breadcrumbs,.archive-count,.resource-meta{font-size:12px;color:#5a6d55}.resource-card p{font-size:14px;color:#56654f}.library-card p{font-size:14px}.resource-type,.library-card small,.footer-inner nav a,.footer-inner>div>p{font-size:12px;color:#52654d}.footer-label,.footer-bottom{font-size:11px;color:#56654f}pre{font-size:13px}.playground textarea,.hcr-markup-lab textarea,.hcr-challenge textarea{font-size:13px;color:#2f493c}.toolbar button{font-size:12px;min-height:40px}.playground [data-editor-status]{font-size:12px;color:#546b49}.hcr-markup-lab [data-lab-results],.hcr-challenge [data-lab-results]{padding:0;list-style:none}.hcr-markup-lab [data-lab-results]>li,.hcr-challenge [data-lab-results]>li{border:1px solid #dce6d8;border-left:3px solid #198263;padding:15px 17px;margin:12px 0;background:#f8fcf6;border-radius:5px}.hcr-markup-lab [data-lab-results] p,.hcr-challenge [data-lab-results] p{font-size:14px;line-height:1.75;margin:7px 0 0}.hcr-markup-lab [data-lab-results] .check-review,.hcr-challenge [data-lab-results] .check-review{border-left-color:#a56917;background:#fffaf0}.standard-status{background:#edf3f7;color:#36546a;padding:3px 8px;border-radius:4px}.hcr-assessment label{font-size:15px}.hcr-assessment legend{font-size:16px}.hcr-assessment [data-feedback]{font-size:14px}.hcr-assessment>p:first-child{font-size:13px;color:#526b46}.hero-workspace .workspace-preview p{color:#52675b}.sidebar-tools a{font-size:12px}.home-view .runner-link{font-size:13px}
@media(max-width:700px){.lesson-body{font-size:16px}.resource-card p{font-size:14px}.toolbar button{min-height:44px}.lesson-meta{font-size:11px}.playground textarea,.hcr-markup-lab textarea,.hcr-challenge textarea{font-size:12px}.library-card p{font-size:13px}}
.sidebar-search{margin:14px 0 20px}.sidebar-search .search-form input{font-size:11px}.reference-groups{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 24px}.reference-groups a{font-size:13px;text-decoration:none;background:#f4f8f0;padding:8px 15px;border-radius:20px;border:1px solid #dfe8d8}.reference-groups a[aria-current]{background:#e7f2e4;color:#075d49;border-color:#adc9a6}.toc-mobile a[aria-current=location]{font-weight:700;color:#075d49}

.support-links{display:flex;flex-wrap:wrap;gap:14px;max-width:1320px;margin:24px auto;padding:0 28px;font-size:14px}.support-body{max-width:850px}.editorial-note{font-size:14px;color:#52675e;margin-top:18px}.directory-list{columns:2;column-gap:32px}.directory-list li{break-inside:avoid;margin-bottom:10px}@media(max-width:650px){.directory-list{columns:1}}