/* Diagrams use native text labels. Their scale never shrinks body copy below 16px. */
.ai-learning {
 --ai-ink:#f0f8f6;--ai-muted:#9ebcb8;--ai-line:#294b49;
 --ai-mint:#8ce3c5;--ai-blue:#a8cffa;--ai-amber:#f0c788;
 width:100%;min-width:0;margin:0;border:1px solid var(--ai-line);border-radius:22px;
 color:var(--ai-ink);background:radial-gradient(ellipse at 50% 0,#163b37 0,transparent 65%),#0c2526;
 font-family:inherit;overflow:hidden;isolation:isolate;
}
.ai-learning *,.ai-learning *::before,.ai-learning *::after{box-sizing:border-box}
.ai-learning .ai-learning__scene{padding:26px;display:grid;gap:16px;min-width:0}
.ai-learning .ai-learning__caption{margin:0;padding:18px 24px;border-top:1px solid var(--ai-line);font-size:16px;line-height:1.6;color:var(--ai-muted);background:rgba(1,15,18,.23)}
.ai-learning p{margin:0}
.ai-learning strong{font-weight:650}
.ai-learning .ai-vis-stack{display:grid;gap:18px;min-width:0}
.ai-learning .ai-vis-row{display:flex;align-items:stretch;gap:14px;min-width:0}
.ai-learning .ai-vis-row>.ai-vis-tile{flex:1;min-width:0}
.ai-learning .ai-vis-flow{display:flex;flex-direction:column;align-items:stretch;gap:7px}
.ai-learning .ai-vis-grid-three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ai-learning .ai-vis-tile{--ai-accent:var(--ai-mint);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;position:relative;padding:20px 16px;border:1px solid #30524f;border-radius:15px;background:#112e2e;text-align:center;color:var(--ai-ink);min-width:0}
.ai-learning .ai-vis-tile>strong{font-size:19px;line-height:1.35;text-wrap:balance}
.ai-learning .ai-vis-tile.is-active{border-color:var(--ai-accent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ai-accent) 25%,transparent);background:#173f38}
.ai-learning .ai-vis-detail{display:block;font-size:16px;line-height:1.45;color:var(--ai-muted);text-wrap:pretty}
.ai-learning .ai-vis-eyebrow{display:block;color:var(--ai-muted);font-size:16px;line-height:1.35;font-weight:500}
.ai-learning .ai-vis-mint{--ai-accent:var(--ai-mint)}
.ai-learning .ai-vis-blue{--ai-accent:var(--ai-blue)}
.ai-learning .ai-vis-amber{--ai-accent:var(--ai-amber)}
.ai-learning .ai-vis-icon{display:inline-flex;justify-content:center;align-items:center;flex:none;width:64px;height:64px;color:var(--ai-accent,var(--ai-mint))}
.ai-learning .ai-vis-icon svg{display:block;width:100%;height:100%;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.ai-learning .ai-vis-icon svg circle{fill:#173735}
.ai-learning .ai-vis-grid-three .ai-vis-tile{padding:16px 9px}
.ai-learning .ai-vis-grid-three .ai-vis-tile>strong{font-size:16px}
.ai-learning .ai-vis-grid-three .ai-vis-icon{width:46px;height:46px}
.ai-learning .ai-vis-arrow{align-self:center;font-size:27px;color:#72b6a7;line-height:1;font-weight:300}
.ai-learning .ai-vis-arrow-down{font-size:23px}
.ai-learning .ai-vis-badge{display:block;width:fit-content;max-width:100%;margin:0 auto;padding:10px 15px;border-radius:10px;background:color-mix(in srgb,var(--ai-accent,var(--ai-mint)) 12%,#112929);border:1px solid color-mix(in srgb,var(--ai-accent,var(--ai-mint)) 50%,transparent);color:var(--ai-accent,var(--ai-mint));font-size:16px;line-height:1.4;font-weight:600;text-align:center}
.ai-learning .ai-vis-sentence{padding:22px;border:1px solid #385d59;border-radius:15px;background:#102e2e}
.ai-learning .ai-vis-sentence p{margin:10px 0 0;font-size:23px;line-height:1.55;letter-spacing:-.025em;text-wrap:pretty}
.ai-learning .ai-vis-sentence p:first-child{margin:0}
.ai-learning mark{color:#c0f6e2;background:#225546;padding:2px 5px;border-radius:4px}
.ai-learning .ai-vis-blank{display:inline-block;width:54px;text-align:center;color:var(--ai-mint);border-bottom:2px solid var(--ai-mint)}
.ai-learning .ai-vis-tokens{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.ai-learning .ai-vis-token{--ai-accent:var(--ai-blue);display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 16px;background:#143238;border:1px solid #3b626d;border-radius:10px;color:var(--ai-accent);font-size:20px;line-height:1.4;min-width:62px}
.ai-learning .ai-vis-token.ai-vis-mint{--ai-accent:var(--ai-mint);background:#174539;border-color:#5ab69a}
.ai-learning .ai-vis-token.ai-vis-amber{--ai-accent:var(--ai-amber);background:#3b3428;border-color:#a38a65}
.ai-learning .ai-vis-token small{font:inherit;font-size:16px;color:var(--ai-muted)}
.ai-learning .ai-vis-specimen{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:22px;border:1px solid #42615c;border-radius:15px;background:linear-gradient(130deg,#163b36,#102e2e);color:var(--ai-ink)}
.ai-learning .ai-vis-specimen>p{font-size:20px;line-height:1.6}
.ai-learning .ai-vis-specimen.ai-vis-amber{background:#332e26;border-color:#786448}
.ai-learning .ai-vis-specimen.ai-vis-mint{border-color:#467969}
.ai-learning .ai-vis-mail-line{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:12px 0;border-bottom:1px solid var(--ai-line);font-size:17px;line-height:1.4}
.ai-learning .ai-vis-mail-line:last-child{border:0;padding-bottom:0}
.ai-learning .ai-vis-mail-line .ai-vis-badge{margin:0;flex-shrink:0;padding:7px 9px}
.ai-learning .ai-vis-return{display:flex;gap:12px;align-items:center;justify-content:center;padding:10px 14px;border-radius:12px;background:#193c33;border:1px dashed #4d8b70;color:var(--ai-mint);font-size:17px;line-height:1.4}
.ai-learning .ai-vis-return .ai-vis-icon{width:44px;height:44px}
.ai-learning .ai-vis-network{width:100%;padding:10px 0}
.ai-learning .ai-vis-network>svg{display:block;width:100%;height:auto;aspect-ratio:400/240;overflow:visible}
.ai-learning .ai-vis-network path{fill:none;stroke:#2a5853;stroke-width:1.2}
.ai-learning .ai-vis-network path.is-lit{stroke:#68bdab;stroke-width:1.7;opacity:.7}
.ai-learning .ai-vis-network circle{fill:#173e3b;stroke:#61978d;stroke-width:2}
.ai-learning .ai-vis-network circle.is-lit{fill:#9ae4c8;stroke:#d6ffed;stroke-width:2}
.ai-learning .ai-vis-network-labels{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:12px;text-align:center;color:var(--ai-muted);font-size:16px;line-height:1.35}
.ai-learning .ai-vis-network-labels span:first-child{text-align:left}
.ai-learning .ai-vis-network-labels span:last-child{text-align:right}
.ai-learning .ai-vis-attention{display:grid;grid-template-rows:auto auto auto;justify-items:center}
.ai-learning .ai-vis-attention>svg{width:100%;height:auto;aspect-ratio:420/92;overflow:visible}
.ai-learning .ai-vis-attention path{fill:none;stroke:#436966;stroke-width:2;stroke-dasharray:4 5}
.ai-learning .ai-vis-attention path.is-strong{stroke:var(--ai-mint);stroke-width:7;stroke-dasharray:none}
.ai-learning .ai-vis-attention-targets{display:flex;justify-content:space-between;width:100%;gap:8px}
.ai-learning .ai-vis-attention-targets .ai-vis-token{min-width:0;padding:10px 12px}
.ai-learning .ai-vis-transformer{display:grid;gap:12px}
.ai-learning .ai-vis-layer{display:grid;grid-template-columns:32px 1fr;align-items:center;gap:7px 14px;padding:18px;border:1px solid #3b5957;border-radius:12px;background:#12322f;color:#8faea8;position:relative}
.ai-learning .ai-vis-layer+.ai-vis-layer:before{content:'↓';position:absolute;top:-16px;left:calc(50% - 9px);background:#12322f;color:var(--ai-mint);font-size:20px;line-height:1;padding:0 3px}
.ai-learning .ai-vis-layer.is-active{background:#183e36;color:var(--ai-ink);border-color:#558e79}
.ai-learning .ai-vis-layer-number{width:30px;height:30px;display:grid;place-items:center;border:1px solid #477460;border-radius:50%;font-size:16px;color:var(--ai-mint)}
.ai-learning .ai-vis-layer>strong{font-size:18px;line-height:1.4}
.ai-learning .ai-vis-layer .ai-vis-detail{grid-column:2}
.ai-learning .ai-vis-maze{width:100%;max-width:320px;aspect-ratio:1;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:7px;margin:0 auto}
.ai-learning .ai-vis-square{display:flex;align-items:center;justify-content:center;min-width:0;border:1px solid #3b5d57;border-radius:10px;background:#13332f;font-size:19px}
.ai-learning .ai-vis-square .ai-vis-icon{width:62%;height:62%}
.ai-learning .ai-vis-square.is-wall{background:repeating-linear-gradient(45deg,#2f3f3b 0 7px,#384a42 7px 14px);border-color:#687264;color:#cfdbc8}
.ai-learning .ai-vis-square.is-wall span{padding:6px;background:#344539;border-radius:5px;font-size:16px}
.ai-learning .ai-vis-square.is-route{background:#255a42;border-color:#75ac89}
.ai-learning .ai-vis-square.is-route>span:not(.ai-vis-icon){font-size:40px;color:var(--ai-mint)}
.ai-learning .ai-vis-examples{display:grid;gap:15px;padding:12px;font-size:18px;line-height:1.5;color:var(--ai-muted)}
.ai-learning .ai-vis-examples strong{color:var(--ai-mint)}
.ai-learning .ai-vis-format{display:grid;grid-template-columns:30px 1fr;gap:14px;font-size:19px;line-height:1.5;align-items:start}
.ai-learning .ai-vis-format>span{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#235849;color:var(--ai-mint);font-size:16px}
.ai-learning .ai-vis-system-stack{display:grid;gap:10px}
.ai-learning .ai-vis-system-stack .ai-vis-tile{display:grid;grid-template-columns:54px 1fr;text-align:left;column-gap:18px;padding:17px 20px}
.ai-learning .ai-vis-system-stack .ai-vis-icon{grid-row:1/3;width:50px;height:50px}
.ai-learning .ai-vis-system-stack .ai-vis-detail{grid-column:2}
.ai-learning .ai-vis-system-stack .ai-vis-tile:only-child{grid-row:auto}
.ai-learning .ai-vis-photo{padding:16px;display:grid;place-items:center;background:linear-gradient(#234b5d 0 58%,#6b6244 58%);border:1px solid #54766c;border-radius:14px;min-height:150px;position:relative}
.ai-learning .ai-vis-photo .ai-vis-icon{width:112px;height:112px;color:#f4d9a8;filter:drop-shadow(0 4px 8px #182927)}
.ai-learning .ai-vis-photo .ai-vis-icon svg circle{fill:#5b4931}
.ai-learning .ai-vis-photo-label{position:absolute;bottom:9px;left:9px;right:9px;width:fit-content;padding:4px 8px;border-radius:6px;background:#183930;color:#e5f2de;font-size:16px;line-height:1.4}
.ai-learning .ai-vis-handwriting{display:grid;place-items:center;min-height:150px;border-radius:13px;border:1px solid #698077;background:repeating-linear-gradient(0deg,#dce6da 0 25px,#bfcec4 25px 26px);color:#26424c}
.ai-learning .ai-vis-handwriting svg{width:115px;height:115px;fill:none;stroke:currentColor;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;transform:rotate(-7deg)}
.ai-learning .ai-vis-road{position:relative;min-height:126px;border-radius:14px;overflow:hidden;background:#142e2d;border:1px solid #36554e;display:flex;align-items:center;justify-content:space-between;padding:25px}
.ai-learning .ai-vis-road:before{content:'';position:absolute;left:36px;right:36px;top:50%;border-top:2px dashed #69968a}
.ai-learning .ai-vis-road-stop{position:relative;display:grid;place-items:center;z-index:1;width:17px;height:17px;border:4px solid #bddfbb;border-radius:50%;background:#254035}
.ai-learning .ai-vis-road-distance{position:relative;z-index:1;padding:10px 18px;border-radius:9px;background:#1d423b;color:var(--ai-mint);font-size:20px}
.ai-learning .ai-vis-pixel-grid{display:grid;grid-template-columns:repeat(7,1fr);width:140px;aspect-ratio:1;gap:3px;margin:0 auto}
.ai-learning .ai-vis-pixel-grid span{background:#34514e;border-radius:2px}
.ai-learning .ai-vis-pixel-grid span.is-on{background:#a6e5cd}
@media(max-width:600px){
 .ai-learning .ai-learning__scene{padding:18px;gap:14px}
 .ai-learning .ai-learning__caption{padding:16px 18px}
 .ai-learning .ai-vis-tile{padding:16px 12px}
 .ai-learning .ai-vis-tile>strong{font-size:18px}
 .ai-learning .ai-vis-row{gap:10px}
 .ai-learning .ai-vis-grid-three{gap:7px}
 .ai-learning .ai-vis-grid-three .ai-vis-tile{padding:15px 7px}
 .ai-learning .ai-vis-grid-three .ai-vis-tile>strong{font-size:16px}
 .ai-learning .ai-vis-sentence,.ai-learning .ai-vis-specimen{padding:18px}
 .ai-learning .ai-vis-sentence p{font-size:21px}
 .ai-learning .ai-vis-token{font-size:19px;padding:10px 13px}
 .ai-learning .ai-vis-mail-line{font-size:16px;gap:8px}
 .ai-learning .ai-vis-system-stack .ai-vis-tile{padding:17px 14px;column-gap:13px;grid-template-columns:44px 1fr}
 .ai-learning .ai-vis-system-stack .ai-vis-icon{width:44px;height:44px}
}
@media(prefers-reduced-motion:reduce){.ai-learning *{animation:none!important;transition:none!important}}
@media print{.ai-learning{break-inside:avoid}}
.ai-learning .ai-vis-row>.ai-vis-photo{flex:1;min-width:0}
.ai-learning .ai-vis-row>.ai-vis-photo .ai-vis-icon{max-width:100%;min-width:0}
.ai-learning .ai-vis-specimen>.ai-vis-row{width:100%}
.ai-learning .ai-learning__scene,.ai-learning .ai-vis-stack{grid-template-columns:minmax(0,1fr)}
.ai-learning .ai-vis-stack>*,.ai-learning .ai-vis-specimen{min-width:0}
.ai-learning .ai-vis-photo .ai-vis-icon{width:100%;max-width:112px}
@media(max-width:480px){
 .ai-learning .ai-vis-grid-three{grid-template-columns:1fr}
 .ai-learning .ai-vis-grid-three>.ai-vis-tile{flex-direction:row;justify-content:flex-start;text-align:left;padding:12px 14px;gap:14px}
 .ai-learning .ai-vis-grid-three .ai-vis-icon{width:36px;height:36px}
 .ai-learning .ai-vis-row{flex-direction:column}
 .ai-learning .ai-vis-row>.ai-vis-arrow{transform:rotate(90deg)}
 .ai-learning .ai-vis-network-labels{grid-template-columns:1fr 1fr;gap:9px}
 .ai-learning .ai-vis-network-labels span:nth-child(2){grid-column:1/-1;grid-row:2;text-align:center}
 .ai-learning .ai-vis-network-labels span:last-child{grid-column:2;grid-row:1}
 .ai-learning .ai-vis-attention-targets .ai-vis-token{padding:9px 6px;font-size:17px}
}