/* Knowledge catalog: graphics inherit the site's theme; no image downloads. */
body[data-ui-page=practice] .practice-selection{max-width:none;margin:16px auto 64px;padding:0;border:0;border-radius:0;background:none}
.practice-studio-hero{display:grid;grid-template-columns:1.05fr 1fr;position:relative;isolation:isolate;align-items:center;gap:24px;overflow:hidden;min-height:360px;padding:44px 48px;border:1px solid var(--ui-line);border-radius:24px;background:radial-gradient(ellipse at 90% 10%,color-mix(in srgb,var(--ui-accent) 12%,transparent),transparent 58%),var(--ui-panel)}
.practice-studio-hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(var(--ui-line) 1px,transparent 1px),linear-gradient(90deg,var(--ui-line) 1px,transparent 1px);background-size:36px 36px;opacity:.22;mask-image:linear-gradient(90deg,transparent,#000)}
.practice-studio-kicker,.practice-section-index{font:600 11px/1.5 Consolas,monospace;letter-spacing:2px;color:var(--ui-accent)}
#practiceSelection .practice-studio-copy h1{font-size:clamp(38px,4.6vw,64px);line-height:1.14;letter-spacing:-2px;margin:18px 0;color:var(--ui-text)}
.practice-studio-copy>p{font-size:15px;color:var(--ui-dim);margin:0 0 24px}
.practice-studio-metrics{display:flex;gap:24px;color:var(--ui-dim);font-size:11px}
.practice-studio-metrics span{display:flex;gap:8px;align-items:center;white-space:nowrap}.practice-studio-metrics b{color:var(--ui-text);font:600 24px/1 Consolas,monospace}
.practice-studio-links{display:flex;gap:10px;margin-top:30px}.practice-studio-links a{display:flex;gap:30px;align-items:center;text-decoration:none;font-size:13px;font-weight:600;padding:11px 16px;border:1px solid var(--ui-line);border-radius:9px;color:var(--ui-text);background:var(--ui-raised)}
.practice-studio-links a:first-child{background:var(--ui-button);border-color:var(--ui-button);color:white}
body[data-ui-page=practice] .practice-studio-links a:first-child{color:#fff!important}
.practice-studio-links a:hover{filter:brightness(1.12)}
.practice-circuit-art{min-width:0;color:var(--ui-accent)}.practice-circuit-art svg{display:block;width:100%;height:auto;overflow:visible}
.studio-trace{stroke:var(--ui-accent);stroke-width:1.5;opacity:.6}.studio-signal{stroke:var(--ui-text);stroke-width:2.5;stroke-dasharray:12 280}
.studio-terminal,.studio-chip{fill:var(--ui-panel);stroke:var(--ui-line)}.studio-chip{stroke:var(--ui-accent);filter:drop-shadow(0 8px 16px color-mix(in srgb,var(--ui-accent) 20%,transparent))}
.studio-chip-core{fill:var(--ui-raised);stroke:var(--ui-line)}.studio-pins{stroke:var(--ui-accent);stroke-width:4;stroke-linecap:round}
.studio-label,.studio-chip-title,.studio-chip-sub,.studio-footnote{text-anchor:middle;fill:var(--ui-accent);font:12px Consolas,monospace}.studio-chip-title{fill:var(--ui-text);font-size:18px;font-weight:bold}.studio-chip-sub{font-size:11px;letter-spacing:3px}.studio-footnote{fill:var(--ui-dim);font-size:9px;letter-spacing:2px}.studio-run{fill:#40cbb0}
html[data-ui-motion=on] .studio-signal{animation:studioSignal 5s linear infinite}@keyframes studioSignal{to{stroke-dashoffset:-584}}
.practice-catalog-section,.source-catalog{scroll-margin-top:92px}
.practice-section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:36px 0 20px}.practice-section-heading h2,#practiceSelection .practice-section-heading h2{font-size:24px;line-height:1.3;letter-spacing:-.5px;margin:7px 0 0;color:var(--ui-text)}.practice-section-heading>p{color:var(--ui-dim);font-size:12px;margin:0 0 3px;line-height:1.7}
body[data-ui-page=practice] #practiceLessonChoices,.source-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
#practiceLessonChoices a,.source-grid a{display:flex;flex-direction:column;gap:12px;position:relative;overflow:hidden;min-width:0;padding:20px;border:1px solid var(--ui-line);border-radius:16px;text-decoration:none;color:var(--ui-text);background:linear-gradient(135deg,color-mix(in srgb,var(--card-color,var(--ui-accent)) 5%,transparent),transparent 65%),var(--ui-panel)!important}
[data-studio-card]{--card-color:var(--ui-accent)}[data-studio-card][data-art=pwm]{--card-color:#aa89ee}[data-studio-card][data-art=adc]{--card-color:#48b79f}[data-studio-card][data-art=timer]{--card-color:#da9a51}[data-studio-card][data-art=serial]{--card-color:#54b2c9}
html[data-ui-theme=light] [data-studio-card][data-art=pwm]{--card-color:#7545c0}html[data-ui-theme=light] [data-studio-card][data-art=adc]{--card-color:#087d65}html[data-ui-theme=light] [data-studio-card][data-art=timer]{--card-color:#99631d}html[data-ui-theme=light] [data-studio-card][data-art=serial]{--card-color:#167b91}
.practice-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:64px}.practice-card-art{width:100px;flex:none;color:var(--card-color)}.practice-card-art svg{display:block;width:100%}.practice-art-grid{stroke:currentColor;stroke-width:.6;opacity:.15}.practice-art-trace{stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}.practice-art-dot{fill:currentColor}
.practice-card-type{font:600 10px/1.5 var(--ui-font);letter-spacing:.4px;color:var(--card-color);text-align:right;max-width:60%}
#practiceLessonChoices a>strong,.source-grid a>strong{font-size:17px;line-height:1.5;color:var(--ui-text)}
#practiceLessonChoices a>span,.source-grid a>span{font-size:13px;line-height:1.7;color:var(--ui-dim);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.practice-card-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:14px;margin-top:auto;border-top:1px solid var(--ui-line);font-size:11px;color:var(--ui-dim)}.practice-card-footer>span:last-child{color:var(--card-color);white-space:nowrap}
html[data-ui-motion=on] :is(#practiceLessonChoices,.source-grid) a{transition:transform .18s,border-color .18s,box-shadow .18s}
html[data-ui-motion=on] :is(#practiceLessonChoices,.source-grid) a:hover{transform:translateY(-4px);box-shadow:0 10px 28px #0002}
:is(#practiceLessonChoices,.source-grid) a:is(:hover,:focus-visible){border-color:var(--card-color)}
html[data-ui-motion=off] .source-grid a:hover{transform:none}
.source-catalog{margin-top:40px;padding-top:0}.source-catalog .practice-section-heading{margin-top:30px}.source-filters{grid-template-columns:minmax(0,1fr) minmax(180px,.45fr);gap:16px;margin-top:24px;padding:18px 20px;border:1px solid var(--ui-line);border-radius:14px;background:var(--ui-panel)}
.source-filters :is(input,select){border-radius:8px}.source-count{font-size:12px;margin:14px 2px}.source-gaps{border-top:1px solid var(--ui-line)}
#practiceRouteNotice:empty{display:none}#practiceRouteNotice{font-size:13px;color:var(--ui-dim)}
/* Keep the writing choice next to the code, independently of task variants. */
.practice-writing-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px 0}.practice-writing-switch{display:flex;gap:3px;padding:3px;border:1px solid var(--ui-line);border-radius:10px;background:var(--ui-raised);flex:none}
.practice-writing-switch button{border:0;border-radius:7px;padding:8px 13px;color:var(--ui-dim);background:transparent;cursor:pointer;font:600 12px/1.4 var(--ui-font)}
.practice-writing-switch button[aria-pressed=true]{background:var(--ui-button);color:#fff;box-shadow:0 3px 12px #0002}
.practice-writing-status{font-size:11px;color:var(--ui-dim)}.practice-writing-note,.source-layout .practice-writing-note{font-size:12px;color:var(--ui-dim);margin:10px 16px 14px;line-height:1.6}
.practice-editor:has([data-writing=full][aria-pressed=true]),.practice-editor:has([data-source-writing=full][aria-pressed=true]){border-color:color-mix(in srgb,var(--ui-accent) 65%,var(--ui-line))}
.practice-editor textarea::placeholder{color:var(--ui-dim);opacity:.65}
@media(min-width:1700px){.source-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1100px){.practice-studio-hero{padding:30px}.practice-studio-metrics{gap:14px}.practice-studio-metrics span{flex-direction:column;align-items:start;gap:5px}body[data-ui-page=practice] #practiceLessonChoices,.source-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.practice-writing-status{display:none}}
@media(max-width:680px){.practice-studio-hero{grid-template-columns:1fr;padding:28px 24px;gap:10px}.practice-circuit-art{max-width:360px;width:100%;margin:auto}.practice-studio-copy h1 br{display:none}#practiceSelection .practice-studio-copy h1{font-size:36px}.practice-studio-metrics span{flex-direction:row;align-items:center}.practice-studio-metrics{gap:14px;flex-wrap:wrap}.practice-studio-links{margin-top:22px}.practice-section-heading{display:block;margin-top:28px}.practice-section-heading>p{margin-top:10px}.practice-section-heading h2,#practiceSelection .practice-section-heading h2{font-size:22px}.source-filters{grid-template-columns:1fr;padding:16px;gap:12px}body[data-ui-page=practice] #practiceLessonChoices,.source-grid{grid-template-columns:1fr}#practiceLessonChoices a,.source-grid a{padding:18px}.practice-card-top{min-height:48px}.practice-card-art{width:85px}.practice-writing-toolbar{padding:12px 12px 0}.practice-writing-switch{width:100%}.practice-writing-switch button{flex:1}.practice-writing-note{margin-left:12px;margin-right:12px}}
@media(prefers-reduced-motion:reduce){.studio-signal{animation:none!important}:is(#practiceLessonChoices,.source-grid) a{transition:none!important;transform:none!important}}
