/* Readable type, original block characters and native ambient motion. */
:root{color-scheme:dark}
.brand>span{width:auto;font:600 30px/1 var(--sans);letter-spacing:-1.6px}
.brand>img{width:29px;height:34px}
.brand-note{font-size:8px;line-height:1.6;letter-spacing:.15px;margin:9px 0 27px}
.nav-label{font-size:9px;line-height:1.5;letter-spacing:.5px}
.nav-button{font-size:11px;gap:8px;min-height:43px}
.nav-count{font-size:10px}
.spotlight>span,.spotlight>small{font-size:9px}
.spotlight>strong{font:600 15px/1.5 var(--sans);letter-spacing:-.3px}
.guide-link{font-size:10px;line-height:1.6}
.sidebar-footer{font-size:8px;line-height:1.6;gap:7px}
.collection-top .eyebrow{font-size:10px;letter-spacing:.8px}
.collection-top h2{font:600 24px/1.2 var(--sans);letter-spacing:-.8px;margin-top:6px}
.collection-counter>span{font-size:10px;letter-spacing:.5px}
.agent-cards{padding-top:3px;padding-bottom:10px;gap:8px;overflow-y:hidden}
.agent-card{padding-top:12px;transition:background .2s,border-color .2s,box-shadow .2s;animation:cardArrive .55s cubic-bezier(.2,.7,.25,1) both;animation-delay:calc(var(--card-index)*45ms)}
.agent-card strong{width:100%;max-width:none;margin:5px auto 6px;font:600 17px/1.2 var(--sans);letter-spacing:.3px;color:var(--ink)}
.agent-card small{font:9px/1.45 var(--sans);white-space:normal;min-height:2.9em;color:#b0bed2}
.card-number{font-size:9px;color:#a2afc2}
.agent-card>img{animation:unitIdle 4s ease-in-out infinite;animation-delay:calc(var(--card-index)*-.65s);transition:scale .25s;transform-origin:50% 75%}
.agent-card:hover>img{scale:1.08}
.agent-card:hover{border-color:var(--unit-color);box-shadow:inset 0 0 20px color-mix(in srgb,var(--unit-color) 8%,transparent)}
.agent-card.selected{background:#223047;box-shadow:inset 0 0 24px color-mix(in srgb,var(--unit-color) 9%,transparent)}
.agent-card.selected:before{content:'';position:absolute;top:0;left:0;width:32%;height:2px;background:var(--unit-color);opacity:.8;animation:cardAccent 5s ease-in-out infinite;pointer-events:none}
.mission-strip{position:relative;overflow:hidden;min-height:60px}
.mission-strip>div>span{font-size:9px;letter-spacing:.6px}
.mission-strip p{font-size:11px;white-space:normal;line-height:1.5}
.mission-strip button{font-size:10px;line-height:1.5;gap:10px}
.mini-crew>img{animation:crewNod 5s ease-in-out infinite}
.mini-crew>img:nth-child(2n){animation-delay:-1.5s}
.mini-crew>img:nth-child(3n){animation-delay:-3s}
.unit-heading .eyebrow{font-size:9px;line-height:1.7;letter-spacing:.4px;color:#a8bae8}
.unit-heading h1{margin:24px 0 23px}
.unit-name{display:block;font:600 clamp(54px,5.8vw,80px)/1.05 var(--sans);letter-spacing:-.055em;color:#f1f5ff}
.unit-heading h1>em{font-size:11px;line-height:1.6;letter-spacing:.7px;color:#b0bed2;margin-top:12px}
.open-module,.saved-link{font-size:11px;line-height:1.5;padding:13px}
.primary-button{background:#526ce5;border-color:#6c85ff;color:#fff}
.primary-button:hover:not(:disabled){background:#617cf5;color:#fff}
.unit-tags{gap:6px;margin-top:24px}
.unit-tags>span{font-size:9px;line-height:1.5;white-space:normal;color:#b0bed2}
.unit-tags>span:first-child{background:color-mix(in srgb,var(--unit) 13%,#172131);color:#e6eefb}
.assembly-row small{font-size:8px;letter-spacing:.3px;line-height:1.6}
.assembly-row p{font-size:11px;line-height:1.5}
.assembly-row p b{font-size:18px}
.assembly-row>img{width:45px;height:50px}
.agent-blurb{font-size:13px;line-height:1.85;color:#c0ccdc}
.unit-process{font-size:8px;letter-spacing:.4px}
.traits h2,.mechanism h2{font-size:10px;letter-spacing:.7px}
.traits dl{font-size:11px}
.traits dd{font-size:10px;line-height:1.6}
.mechanism p{font-size:12px;line-height:1.85}
.mechanism button strong{font-size:11px;line-height:1.5}
.mechanism button small{font-size:10px;line-height:1.6}
.plate-row>span{font-size:8px;line-height:1.6}
.plate-row button{font-size:10px;white-space:nowrap}
.detail-end{font-size:8px;letter-spacing:.2px;line-height:1.6}
.agent-search input{font-size:11px}
.stage-top{font-size:9px;line-height:1.6;letter-spacing:.2px;color:#a2afc2}
.stage-top>span:last-child{font-size:8px;max-width:250px;text-align:right}
.stage-caption{font-size:8px;line-height:1.6}
.stage-caption p{font-size:8px}
.stage-caption>span:nth-child(2){font-size:42px;color:#647da35c}
.stage-scale small{font-size:7px;letter-spacing:.2px}
.model-tagline{font:400 clamp(12px,1.2vw,17px)/1.5 var(--sans);letter-spacing:0;color:#c7d4e7}
.collection-bottom{font-size:8px;letter-spacing:.1px;line-height:1.5}
.stage-coordinate{animation:crossDrift 9s ease-in-out infinite;color:#627ca14d}
.stage-orbit{position:absolute;inset:23% 12% 15%;border:1px solid #829cff19;border-radius:50%;transform:rotate(-24deg);pointer-events:none;z-index:0;animation:orbitDrift 18s ease-in-out infinite}
.stage-orbit>i{position:absolute;inset:13% -7%;border:1px dashed #829cff19;border-radius:50%;transform:rotate(54deg)}
.stage-orbit>b{position:absolute;inset:0;animation:orbitTurn 16s linear infinite}
.stage-orbit>b:before{content:'';position:absolute;top:50%;left:-3px;width:5px;height:5px;background:var(--unit);border-radius:50%;box-shadow:0 0 14px color-mix(in srgb,var(--unit) 45%,transparent)}
.model-stage.dusk .stage-orbit{opacity:.45}
.primary-button>span,.mission-strip button>span,.guide-link>b{transition:transform .2s}
.primary-button:hover>span,.mission-strip button:hover>span,.guide-link:hover>b{transform:translate(3px,-2px)}
.unit-heading,.unit-tags,.assembly-row,.agent-blurb{animation:notesArrive .5s cubic-bezier(.2,.7,.25,1) both}
.unit-tags{animation-delay:.05s}.assembly-row{animation-delay:.1s}.agent-blurb{animation-delay:.15s}
body:not(.booting) .collection-top{animation:notesArrive .6s ease-out both}
body:not(.booting) .mission-strip{animation:notesArrive .65s .1s ease-out both}
.booting .agent-card,.booting .unit-heading,.booting .unit-tags,.booting .assembly-row,.booting .agent-blurb{animation-name:none}
.boot-word{width:auto;font:600 98px/1 var(--sans);letter-spacing:-7px;color:#f1f5ff}
.boot>p{font-size:11px;letter-spacing:1.2px;color:#b5c3db}
.boot>small{font-size:9px;color:#99adce}
.boot-bottom{font-size:9px;letter-spacing:.6px}
.boot-emblem{animation:emblemSettle 3s ease-in-out both}
.work-tabs b{font:600 12px/1.4 var(--sans)}
.work-tabs small{font-size:9px;line-height:1.4;white-space:normal}
.work-tabs>button{min-width:150px}
.form-field>span{font-size:11px;line-height:1.5}
.form-three .form-field>span{font-size:10px}
.form-section-label,.local-note,.output-header{font-size:9px;line-height:1.6}
.form-hint{font-size:11px}
@keyframes cardArrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes notesArrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes unitIdle{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-4px) rotate(1deg)}}
@keyframes crewNod{0%,70%,100%{transform:translateY(0)}80%{transform:translateY(-3px)}}
@keyframes cardAccent{0%,15%{transform:translateX(-115%)}70%,100%{transform:translateX(330%)}}
@keyframes crossDrift{50%{transform:translate(12px,-9px)}}
@keyframes orbitDrift{50%{transform:rotate(-6deg) scale(.96)}}
@keyframes orbitTurn{to{transform:rotate(360deg)}}
@keyframes emblemSettle{0%{transform:rotate(-10deg)}65%{transform:rotate(3deg)}100%{transform:rotate(0)}}
@media(min-width:961px) and (max-width:1250px){
 .agent-card small{font-size:8.5px}.agent-card strong{font-size:16px}
 .collection-top h2{font-size:21px}.collection-top .eyebrow{font-size:9px}
 .collection-counter>span{font-size:9px;margin-right:4px}
 .mission-strip{gap:9px;padding:9px}.mission-strip>div>span{font-size:8px}.mission-strip p{font-size:10px}.mission-strip button{font-size:9px;gap:6px}
 .detail-scroll{padding-left:16px;padding-right:16px}.unit-name{font-size:60px}
 .sidebar-footer{font-size:7px}.brand-note{font-size:7px}
 .nav-button{font-size:10px}
}
@media(max-height:760px) and (min-width:961px){
 .collection{gap:11px}.agent-card>img{height:58px}.agent-card small{font-size:8px;min-height:2.6em}.agent-card{padding-bottom:8px}
 .mission-strip{min-height:52px}.collection-bottom{padding-top:9px}
}
@media(max-width:960px){
 .mobile-bar>a{font:600 23px var(--sans);letter-spacing:-1px}
 .collection-top h2{font-size:25px}.unit-name{font-size:72px}
 .model-tagline{font-size:17px}.agent-card strong{font-size:19px}
 .agent-card small{font-size:11px}.card-number{font-size:10px}
}
@media(max-width:620px){
 .collection-top h2{font-size:20px;letter-spacing:-.6px}.collection-top .eyebrow{font-size:8px}
 .collection-counter>span{font-size:8px;margin-right:2px}
 .collection{gap:14px}.agent-card small{font-size:10px}.agent-card strong{font-size:18px}
 .mission-strip>div>span{font-size:7px}.mission-strip p{font-size:10px}.mission-strip button{font-size:9px}
 .unit-name{font-size:64px}.unit-heading .eyebrow{font-size:9px}
 .stage-top{font-size:8px}.stage-top>span:last-child{font-size:7px;max-width:150px}
 .stage-caption,.stage-caption p{font-size:7px}.stage-scale small{font-size:6px}
 .model-tagline{font-size:14px}.collection-bottom{font-size:7px}
 .boot-word{font-size:76px;letter-spacing:-5px}.boot>p{font-size:10px}.boot-bottom{font-size:7px}
 .detail-end{font-size:7px}.plate-row>span{font-size:7px}
 .work-tabs b{font-size:12px}.work-tabs small{font-size:9px}
}

/* Solid, integer-sized pixels preserve the identity without broken strokes. */
.pixel-word{--pixel-step:2px;display:block!important;width:calc(var(--glyph-columns)*var(--pixel-step))!important;height:calc(7*var(--pixel-step))!important;max-width:100%;overflow:visible}
.brand>span{line-height:0;letter-spacing:0}
.brand .pixel-word{--pixel-step:3px}
.agent-card strong{line-height:0;margin-top:8px;margin-bottom:10px}
.agent-card strong>.pixel-word{margin:0 auto;--pixel-step:2px}
.unit-name{font-size:0;line-height:0;letter-spacing:0}
.unit-name>.pixel-word{--pixel-step:8px}
.boot-word{line-height:0;letter-spacing:0}
.boot-word>.pixel-word{--pixel-step:12px}
.collection-top h2{font-family:var(--mono);font-weight:400;font-size:22px;letter-spacing:-.8px}
.stage-orbit,.stage-orbit>i{border-radius:0}
.stage-orbit>b:before{border-radius:0;width:6px;height:6px}
.agent-card.selected:after{height:4px}
.spotlight>span,.mission-strip>div>span{font-family:var(--mono)}
@media(min-width:961px) and (max-width:1250px){.unit-name>.pixel-word{--pixel-step:7px}.collection-top h2{font-size:20px}}
@media(min-width:1500px){.agent-card strong>.pixel-word{--pixel-step:3px}}
@media(max-width:960px){.unit-name>.pixel-word{--pixel-step:8px}.agent-card strong>.pixel-word{--pixel-step:3px}}
@media(max-width:620px){.unit-name>.pixel-word{--pixel-step:7px}.agent-card strong>.pixel-word{--pixel-step:2px}.boot-word>.pixel-word{--pixel-step:9px}.collection-top h2{font-size:19px}}

/* Pixel controls and hard-edged details; long explanations retain readable type. */
@font-face{font-family:KivoMatrix;src:url(assets/fonts/kivo-matrix.ttf) format('truetype');font-weight:400;font-display:swap}
:root{--pixel:KivoMatrix,var(--mono)}
.collection-top h2{font:500 28px/1.2 var(--pixel);letter-spacing:-.3px}
.collection-top .eyebrow,.nav-label{font-family:var(--pixel);font-size:11px;letter-spacing:.7px}
.nav-button{font-family:var(--pixel);font-size:15px;letter-spacing:0}
.nav-count{font-family:var(--pixel);font-size:12px}
.brand-note{font-family:var(--pixel);font-size:9px;letter-spacing:.3px}
.collection-counter>span{font-family:var(--pixel);font-size:12px}
.agent-card small{font:400 12px/1.2 var(--pixel);min-height:2.4em;color:#b9c8e0}
.agent-card.selected{box-shadow:inset 0 0 0 2px #101620,inset 0 0 0 3px color-mix(in srgb,var(--unit-color) 45%,transparent)}
.agent-card>img,.mini-crew>img,.spotlight>img,.work-tabs img{image-rendering:pixelated}
.mission-strip>div>span{font-family:var(--pixel);font-size:11px;letter-spacing:.3px}
.mission-strip button{font-family:var(--pixel);font-size:13px}
.unit-heading .eyebrow{font-family:var(--pixel);font-size:11px;letter-spacing:.5px}
.unit-heading h1>em{font-family:var(--pixel);font-size:14px;letter-spacing:.5px}
.primary-button,.secondary-button{font-family:var(--pixel);font-size:15px;box-shadow:3px 3px 0 #090e16}
.primary-button:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:5px 5px 0 #090e16}
.unit-tags>span{font-family:var(--pixel);font-size:12px;line-height:1.3}
.assembly-row small{font-family:var(--pixel);font-size:10px;letter-spacing:.5px}
.assembly-row p{font-family:var(--pixel);font-size:13px}
.assembly-row p b{font-size:22px}
.traits h2,.mechanism h2{font-family:var(--pixel);font-size:13px;letter-spacing:.5px}
.mechanism button strong{font-family:var(--pixel);font-size:14px}
.guide-link,.spotlight>small,.spotlight>span{font-family:var(--pixel);font-size:12px}
.spotlight>strong{font-family:var(--pixel);font-weight:500;font-size:19px;line-height:1.3;letter-spacing:0}
.stage-top{font-family:var(--pixel);font-size:11px;letter-spacing:.4px}
.stage-top>span:last-child{font-size:10px}
.stage-caption,.stage-caption p{font-family:var(--pixel);font-size:10px}
.stage-caption>span:nth-child(2){font-family:var(--pixel);font-size:48px}
.model-tagline{font:400 18px/1.5 var(--pixel);letter-spacing:0}
.collection-bottom{font-family:var(--pixel);font-size:10px;letter-spacing:.2px}
.agent-search input{font-family:var(--pixel);font-size:14px}
.dialog-header h2,.tool-heading h3,.result-title h3,.result-empty h3{font-family:var(--pixel);font-weight:500;letter-spacing:-.2px}
.dialog-header h2{font-size:29px}
.tool-heading h3,.result-title h3{font-size:28px}
.work-tabs b{font:500 16px/1.2 var(--pixel)}
.work-tabs small{font-family:var(--pixel);font-size:11px}
.form-field>span,.form-three .form-field>span{font-family:var(--pixel);font-size:14px}
.boot>p,.boot>small,.boot-bottom{font-family:var(--pixel)}
.boot>p{font-size:15px}.boot>small{font-size:12px}.boot-bottom{font-size:12px}
@media(min-width:961px) and (max-width:1250px){
 .collection-top h2{font-size:25px}.collection-top .eyebrow{font-size:10px}
 .nav-button{font-size:13px}.brand-note{font-size:8px}
 .agent-card small{font-size:11px}.mission-strip>div>span{font-size:10px}.mission-strip button{font-size:12px}
 .stage-top>span:last-child{font-size:9px;max-width:230px}.collection-bottom{font-size:9px}
}
@media(max-width:620px){
 .collection-top h2{font-size:23px}.collection-top .eyebrow{font-size:9px}.collection-counter>span{font-size:10px}
 .agent-card small{font-size:12px}.mission-strip>div>span{font-size:9px}.mission-strip button{font-size:11px}
 .stage-top{font-size:10px}.stage-top>span:last-child{font-size:8px}
 .stage-caption,.stage-caption p{font-size:9px}.model-tagline{font-size:16px}.collection-bottom{font-size:8px}
 .boot>p{font-size:12px}.boot-bottom{font-size:9px}
 .dialog-header h2{font-size:23px}
}

/* Original matrix alphabet, with explicit tracking for compact controls. */
.collection-top h2{font-size:24px;line-height:1.4;letter-spacing:-.6px}
.spotlight>strong{font-size:15px;line-height:1.7}
.mobile-bar>a{font-family:var(--pixel);font-size:22px;letter-spacing:0}
.agent-card small{font-size:11px;line-height:1.45}
.work-tabs b{font-size:14px}
.work-tabs small{font-size:10px}
.unit-heading .eyebrow{font-size:10px}
.unit-heading h1>em{font-size:12px}
@media(min-width:961px) and (max-width:1250px){.collection-top h2{font-size:21px}.nav-button{font-size:12px}.mission-strip button{font-size:11px}}
@media(max-width:620px){.collection-top h2{font-size:20px}.agent-card small{font-size:11px}.stage-top>span:last-child{font-size:7px}}

/* SIFT is the fixed brand mascot, independent of the selected collection unit. */
.brand>img{width:42px;height:42px;object-fit:contain;flex-shrink:0}
.brand{gap:10px}
.mobile-bar img{width:36px;height:36px;object-fit:contain}
@keyframes mascotHover{50%{transform:translateY(-6px)}}
@media(max-width:620px){.boot-mascot{width:130px;height:130px;margin-bottom:27px}}

/* Hundreds of colored cells gather into SIFT before the workspace opens. */
.boot-particles{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.boot-mascot{position:relative;width:208px;height:208px;margin-bottom:27px;animation:none;z-index:1}
.boot-mascot>img{display:block;width:100%;height:100%;object-fit:contain;opacity:0;image-rendering:pixelated}
.boot.pixel-fallback .boot-mascot>img{opacity:1;animation:mascotHover 3.4s ease-in-out infinite}
.boot-word,.boot>p,.boot-line,.boot>small,.boot-bottom{position:relative;z-index:1}
.boot-bottom{position:absolute}
.boot-line i{animation:none;transform:scaleX(0)}
.pixel-opening .boot-word{animation:bootWord .7s 1.45s ease-out both}
.pixel-opening>p{animation:bootWord .7s 1.75s ease-out both}
.boot[data-phase=assembled] .boot-line{box-shadow:0 0 12px #829cff30}
@media(max-width:620px){.boot-mascot{width:168px;height:168px;margin-bottom:24px}.boot-word>.pixel-word{--pixel-step:8px}}