/* Landing-page illustrations, progressively enhanced by landing-visuals.js. */
.project-home .visual-panel{border:1px solid var(--project-line);border-radius:14px;background:var(--project-tint);padding:1.25rem;margin:1.5rem 0;min-width:0;overflow:hidden}
.visual-topline{display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap;color:var(--project-muted);font-size:.63rem;font-weight:600;letter-spacing:.02em}
.project-home .visual-note{font-size:.64rem;color:var(--project-muted);line-height:1.65;margin:.7rem 0 0}
.parts-explainer{--split:1;--regions:1;--codes:1;--photo:.18}
.parts-canvas{display:block;width:100%;height:auto;margin:.8rem 0;color:var(--project-ink)}
.parts-photo{opacity:var(--photo)}
.moving-part{transform:translate(calc(var(--split)*var(--dx)),calc(var(--split)*var(--dy)))}
.part-outline{opacity:var(--regions)}
.part-code{opacity:var(--codes)}
.parts-explainer[data-manual] .moving-part,.parts-explainer[data-manual] .part-code,.parts-explainer[data-manual] .parts-photo,.parts-explainer[data-manual] .part-outline{transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .6s}
.visual-controls{display:flex;flex-wrap:wrap;gap:.35rem}
.visual-controls[hidden]{display:none}
.visual-controls button{border:1px solid var(--project-line);border-radius:6px;padding:.5rem .7rem;font-size:.65rem;min-height:44px;background:var(--md-default-bg-color);color:var(--project-ink);cursor:pointer}
.visual-controls button[aria-pressed=true]{background:var(--project-blue);border-color:var(--project-blue);color:var(--md-default-bg-color)}

.project-home button:focus-visible,.cloud-scroll:focus-visible{outline:3px solid var(--project-blue);outline-offset:4px}
.project-home .architecture{display:grid;grid-template-columns:1.2fr auto .85fr auto 1.4fr;align-items:center;gap:1rem;padding:2rem 1.5rem}
.architecture-block{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;min-height:10rem;padding:1rem;border-radius:12px;text-align:center;border:1px solid var(--project-line);background:var(--md-default-bg-color)}
.architecture-block strong{font-size:.95rem;line-height:1.35}.architecture-block>span{font-size:.72rem;color:var(--project-muted)}
.architecture-block .frozen-badge{font-size:.65rem;color:var(--project-blue);background:var(--project-tint);border-radius:20px;padding:.2rem .6rem}.frozen-badge span{font-size:1rem;vertical-align:middle;margin-right:.2rem}
.architecture-block.adapter{border:2px solid var(--project-blue)}.adapter img{width:3.3rem;height:3.3rem}.adapter strong{font-size:1.3rem;letter-spacing:-.06em}
.flow-arrow{font-size:1.4rem;color:var(--project-blue)}
.architecture-outputs{display:grid;grid-template-columns:1fr;gap:.75rem}.output-box{display:grid;grid-template-columns:1fr 1.2fr;align-items:center;gap:.5rem;height:8rem;border:1px solid var(--project-line);border-radius:10px;padding:.7rem;background:var(--md-default-bg-color);min-width:0}
.project-home .output-box h3{font-size:.72rem;letter-spacing:-.02em;margin:0}.output-box>img{width:100%;height:6.4rem;object-fit:contain}
.task-tree{display:grid;gap:.35rem;border-left:2px solid var(--project-blue);padding-left:.5rem}.task-tree>span{display:block;position:relative;padding:.3rem;border:1px solid var(--project-line);border-radius:5px;font-size:.57rem;line-height:1.35}.task-tree>span:before{content:'';position:absolute;left:-.55rem;top:50%;width:.5rem;border-top:2px solid var(--project-blue)}.task-tree small{display:block;color:var(--project-muted);font-size:.5rem}.task-extension{border-style:dashed!important}
.project-home .distillation{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;padding:1.8rem}
.project-home .distill-copy .eyebrow{margin-bottom:.6rem}.project-home .distill-copy h3{margin:0 0 .65rem;font-size:1.2rem}.project-home .distill-copy p:not(.eyebrow){font-size:.72rem;max-width:26rem;color:var(--project-muted)}
.distill-animation{text-align:center;min-width:0}.feature-row>span{display:block;font-size:.65rem;margin-bottom:.5rem;color:var(--project-muted)}.feature-token{display:flex;justify-content:center;align-items:center;gap:5px;height:68px;width:min(100%,290px);margin:0 auto;border:1px solid var(--project-line);border-radius:40px;background:var(--md-default-bg-color)}.feature-token i{display:block;width:6px;border-radius:4px;background:var(--project-muted)}.feature-token.student{border-color:var(--project-blue);background:#19313e}.feature-token.student i{background:#7bc9f4}.transfer-lane{height:44px;position:relative;width:100%;overflow:hidden}.transfer-lane span{position:absolute;top:0;left:calc(50% - 3px);width:6px;height:6px;background:var(--project-blue);border-radius:50%;opacity:0}.distillation.is-playing .transfer-lane span{animation:knowledge-flow 1s linear infinite}.transfer-lane span:nth-child(2){animation-delay:.33s!important}.transfer-lane span:nth-child(3){animation-delay:.66s!important}
.project-home .distill-status{min-height:2.8em;margin:.8rem 0 0;font-size:.64rem;color:var(--project-muted)}
@keyframes knowledge-flow{0%{transform:translateY(0);opacity:0}25%{opacity:1}85%{opacity:1}100%{transform:translateY(44px);opacity:0}}
.cloud-layout{display:grid;grid-template-columns:minmax(0,1fr) 9rem;gap:1rem;align-items:center}.project-home .cloud-instruction{font-size:.7rem;margin:.7rem 0 0;color:var(--project-muted)}
.cloud-scroll{min-width:0;overflow-x:auto;overscroll-behavior-x:contain}.appearance-cloud{position:relative;min-width:560px;aspect-ratio:1.5;background-image:radial-gradient(var(--project-line) 1px,transparent 1px);background-size:22px 22px;margin:.6rem 0}
.cloud-point{position:absolute;transform:translate(-50%,-50%);width:clamp(44px,5.5vw,69px);aspect-ratio:1;border:2px solid var(--project-line);padding:0;border-radius:5px;overflow:hidden;background:#fff;cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s;z-index:1}.cloud-point img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0}.cloud-point:hover,.cloud-point:focus-visible{transform:translate(-50%,-50%) scale(1.15);z-index:3}.cloud-point[aria-pressed=true]{border:3px solid var(--project-blue);box-shadow:0 0 0 4px var(--md-default-bg-color);z-index:2}
.cloud-axis{position:absolute;bottom:0;right:.5rem;font-size:.58rem;color:var(--project-muted)}
.cloud-comparison{display:grid;gap:.8rem;align-items:start;padding:.8rem;border:1px solid var(--project-line);border-radius:9px;background:var(--md-default-bg-color)}.cloud-comparison>div{display:grid;gap:.3rem;justify-items:center}.cloud-comparison span{font-size:.6rem;color:var(--project-muted)}.cloud-comparison img{width:5.5rem;height:5.5rem;object-fit:cover}.project-home .cloud-selection-label{font-size:.57rem;color:var(--project-muted);margin:0;text-align:center}
@media(max-width:900px){.project-home .architecture{grid-template-columns:1fr auto 1fr;padding:1.2rem}.architecture-outputs{grid-column:1/-1;grid-template-columns:1fr 1fr}.architecture>.flow-arrow:nth-of-type(2){grid-column:1/-1;transform:rotate(90deg);text-align:center;line-height:1}.cloud-layout{grid-template-columns:minmax(0,1fr)}.cloud-comparison{grid-template-columns:1fr 1fr;align-items:center}.cloud-selection-label{grid-column:1/-1}.appearance-cloud{min-width:640px}.cloud-point{width:55px}}
@media(max-width:650px){.project-home .visual-panel{padding:.8rem;border-radius:9px}.visual-topline{font-size:.57rem}.parts-canvas{min-width:640px;margin:1rem 0}.visual-controls button{flex:1;padding:.4rem;font-size:.58rem}.project-home .architecture{gap:.6rem}.architecture-block{min-height:9rem;padding:.7rem}.architecture-block strong{font-size:.8rem}.architecture-outputs{gap:.5rem}.output-box{grid-template-columns:1fr;grid-template-rows:auto 1fr;height:10.5rem;text-align:center;padding:.5rem}.output-box>img{height:8rem}.task-tree{text-align:left}.task-tree>span{font-size:.6rem}.project-home .distillation{grid-template-columns:1fr;gap:1rem;padding:1rem}.project-home .distill-copy h3{font-size:1.1rem}.distill-animation{padding:.6rem 0}.cloud-comparison img{width:5rem;height:5rem}}
@media(prefers-reduced-motion:reduce){.project-home *, .project-home *:before{scroll-behavior:auto!important}.moving-part,.part-code,.parts-photo,.part-outline,.cloud-point{transition:none!important}.transfer-lane span{animation:none!important}}

.parts-viewport{overflow-x:auto;overscroll-behavior-x:contain;min-width:0}.parts-mobile-hint{display:none}.parts-viewport:focus-visible{outline:3px solid var(--project-blue);outline-offset:2px}
@media(max-width:650px){.project-home .parts-mobile-hint{display:block;font-size:.6rem;color:var(--project-muted);margin:0 0 .7rem}}

.cloud-mobile-hint{display:none}
@media(max-width:900px){.project-home .cloud-mobile-hint{display:block;font-size:.6rem;color:var(--project-muted);margin:.4rem 0}}

/* A calm continuous learning loop, with the reset hidden by a brief fade. */
.distillation.is-playing .student i{animation:feature-align 7s ease-in-out infinite}
.distillation.is-playing .student{animation:feature-cycle 7s linear infinite}
@keyframes feature-align{0%,5%{height:var(--start)}70%,94%{height:var(--target)}95%,100%{height:var(--start)}}
@keyframes feature-cycle{0%,89%,100%{opacity:1}94%,96%{opacity:0}}
.cloud-connection{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;color:var(--project-blue)}
.cloud-connection path{fill:none;stroke:currentColor;stroke-width:2.5;stroke-dasharray:6 7;vector-effect:non-scaling-stroke}
.cloud-connection circle{fill:none;stroke:currentColor;stroke-width:1.5;opacity:.4;vector-effect:non-scaling-stroke}
.cloud-query{position:absolute;transform:translate(-50%,-50%);width:clamp(44px,5.5vw,69px);aspect-ratio:1;border:3px solid var(--project-ink);border-radius:5px;background:var(--md-default-bg-color);z-index:2}
.cloud-query img{width:100%;height:100%;display:block;object-fit:cover}
.cloud-query>span{position:absolute;bottom:calc(100% + 5px);left:50%;transform:translateX(-50%);font-size:.6rem;font-weight:700;background:var(--project-tint);padding:0 .25rem;border-radius:3px}
.cloud-nearest-label{position:absolute;transform:translateX(-50%);font-size:.53rem;font-weight:600;color:var(--project-blue);white-space:nowrap;background:var(--project-tint);padding:0 .2rem;pointer-events:none}
.is-animating .cloud-connection path{animation:appearance-flow 1.3s linear infinite}
.is-animating .cloud-connection circle{animation:appearance-ring 2.6s ease-in-out infinite}
@keyframes appearance-flow{to{stroke-dashoffset:-26}}
@keyframes appearance-ring{0%,100%{opacity:.2;stroke-width:1.5}50%{opacity:.8;stroke-width:3}}
.three-ideas.has-entered>article,.example-grid.has-entered>a,.result-grid.has-entered>a,.architecture.has-entered>div,.architecture.has-entered>.flow-arrow{animation:landing-enter .65s cubic-bezier(.2,.7,.2,1) var(--entrance-delay,0ms) both}
@keyframes landing-enter{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
@media(max-width:900px){.cloud-query{width:55px}}
@media(prefers-reduced-motion:reduce){.project-home .has-entered>*,.cloud-connection path,.cloud-connection circle,.distillation .student,.distillation .student i{animation:none!important}}
@media(max-width:900px){.cloud-nearest-label{left:93%!important;top:50%!important;width:58px;white-space:normal;text-align:center;line-height:1.3;transform:translate(-50%,-50%)}}