
@font-face{font-family:"Space Grotesk";src:url("./fonts/SpaceGrotesk-Variable.ttf") format("truetype");font-weight:300 700;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("./fonts/IBMPlexMono-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
/* Original hardware geometry. Shared lighting comes from the upper left. */
@layer hardware{
:root{--plastic:#e1daca;--rubber:#303631;--ease:cubic-bezier(.16,1,.3,1);--key-shadow:inset 0 1px 1px #ffffffb0,0 3px 2px #8e8677,1px 5px 6px #514a3526}
body{background:#eae6dc;font-size:16px}
h1,h2,h3{text-wrap:balance;letter-spacing:-.04em}h1{font-size:clamp(48px,5.65vw,80px);font-weight:600;line-height:1.02}h1>span{color:#ac4023}
a{text-underline-offset:4px}input{caret-color:var(--orange)}::selection{background:#c6522e;color:#fff8e7}
*{scrollbar-width:thin;scrollbar-color:#8d8c7b #dfdccf}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track{background:#dfdccf}*::-webkit-scrollbar-thumb{background:#8d8c7b;border:2px solid #dfdccf;border-radius:5px}
:focus-visible{outline:3px solid #b94723;outline-offset:5px}
.ui-icon{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}.ui-icon[data-filled=true]{fill:currentColor}
.header{min-height:112px;border-bottom:1px solid #bdb9ab;box-shadow:0 1px 1px #fff9ed}
.brand{font-family:var(--sans);font-size:16px;font-weight:700;line-height:1.02;letter-spacing:-.02em;gap:13px}.brand-mark{display:block;width:38px;height:38px;transform:none;filter:drop-shadow(0 2px 1px #524f382e)}.brand-note{margin-top:6px;font:9px/1.3 var(--sans);letter-spacing:.02em}
nav{gap:30px;font-size:13px;font-weight:500}.nav-count{background:#d8d5c8;color:#444a3f;border:0;box-shadow:inset 0 1px 2px #534c3826;font:10px var(--mono);font-variant-numeric:tabular-nums}
.saved-button{border:1px solid #aaa594;background:linear-gradient(155deg,#f7f3e6,#ded8c8);box-shadow:var(--key-shadow);border-radius:6px;min-height:42px;font:600 11px var(--sans);padding-inline:15px;transition:background .18s var(--ease)}
.saved-button[aria-pressed=true]{background:#303c30;color:#fbf3df;box-shadow:inset 0 2px 4px #1120167a,0 1px 1px #fff7e4}#saved-count{font:10px var(--mono);min-width:14px;text-align:center}
.hero{grid-template-columns:1.05fr 1fr;gap:66px;padding-top:64px;padding-bottom:72px}.hero-copy{padding-bottom:4px}.hero-description{max-width:370px;font-size:17px;line-height:1.65;margin-top:25px;color:#57594e}.hero-actions{gap:27px;margin-top:30px}.hero-footnote{font:10px/1.8 var(--mono);gap:13px;margin-top:28px;max-width:470px}.hero-footnote>span+span:before{margin-right:13px}
.hero-object{position:relative;padding:8px 7px 0;min-width:0}
.console{position:relative;isolation:isolate;max-width:482px;margin:auto;padding:27px 27px 24px;border:1px solid #a89f8b;border-radius:24px;transform:none;background:linear-gradient(128deg,#f5efdf,#e6decc 55%,#d6cdb9);box-shadow:inset 2px 3px 3px #fffcf3,inset -3px -4px 4px #aaa28dbf,0 4px 2px #d6cdb9,0 9px 2px #b3a98f,0 11px 2px #746e5d,8px 24px 28px #554a3230,0 34px 48px #5c4b251c}
.console:before{content:"";position:absolute;inset:7px;border:1px solid #b4ac9780;border-top-color:#fff9eb;border-left-color:#fff9eb;border-radius:18px;pointer-events:none;box-shadow:inset 0 -1px 2px #fff9e795}
.case-screw{position:absolute;width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,#dfd6c2,#928c7b);box-shadow:inset 0 1px 2px #6d675850,0 1px 1px #fffbed;z-index:2}.case-screw:after{content:"";position:absolute;left:2px;right:2px;top:3px;height:1px;background:#645f52;transform:rotate(-30deg)}.screw-tl{left:14px;top:17px}.screw-tr{right:14px;top:17px}.screw-bl{left:14px;bottom:15px}.screw-br{right:14px;bottom:15px}
.console-top{display:flex;align-items:center;justify-content:space-between;padding:0 2px 19px;color:#454b3e}.console-maker{font:500 8px/1.5 var(--sans);letter-spacing:.16em}.console-maker strong{display:block;font:700 18px/1.05 var(--sans);letter-spacing:-.015em}.console-model{display:flex;align-items:center;gap:8px;font:9px var(--mono);letter-spacing:.04em}.console-model i{display:block;width:34px;height:10px;background:linear-gradient(90deg,#b84927 0 33%,#d5a144 33% 66%,#5a7355 66%);box-shadow:inset 0 1px 2px #554a4230;border-radius:1px}
.screen-frame{position:relative;padding:14px;border-radius:17px;background:linear-gradient(140deg,#262c26,#494a40);box-shadow:inset 2px 3px 4px #111b15cc,inset -2px -2px 2px #6f706280,0 2px 2px #fff9eec7,0 -1px 2px #716c5c}
.console-screen{position:relative;overflow:hidden;padding:16px 19px 13px;border-radius:8px;background:radial-gradient(ellipse at 36% 40%,#2e4030,#16291f 65%,#101e17);color:#d2e3ab;box-shadow:inset 4px 5px 12px #080f09cc,inset -2px -2px 8px #080f0970}
.console-screen:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(143deg,#f3ffe00b,#f3ffe003 43%,transparent 44%);box-shadow:inset 0 1px 2px #cce7b82b}.console-screen:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent,transparent 3px,#05110933 4px)}
.screen-meta,.screen-bottom{display:flex;justify-content:space-between;align-items:center;font:9px/1.4 var(--mono);letter-spacing:.05em;position:relative;z-index:1;color:#aebe91}.screen-ready{font-size:7px;border:1px solid #7f90634d;padding:2px 4px;color:#cedea5}
.screen-main{position:relative;display:flex;gap:27px;align-items:center;min-height:151px;z-index:1}.mascot{width:114px;height:auto;image-rendering:pixelated;transform:none;filter:drop-shadow(2px 4px 2px #081a11a6)}.screen-kicker{font:9px/1.5 var(--mono);letter-spacing:.1em;display:block;color:#aebe91}.screen-number{font:68px/1.17 var(--mono);letter-spacing:-.04em;display:block;color:#ddeab9;text-shadow:1px 2px 4px #03120980;font-variant-numeric:tabular-nums}.screen-caption{font:8px/1.5 var(--mono);color:#b9ca9b;display:block}.screen-bottom{border-top:1px solid #97b78438;padding-top:10px;font-size:7px}
.console-controls{display:flex;align-items:center;gap:15px;padding:21px 2px 20px}.speaker{width:58px;height:38px;background:radial-gradient(circle,#414536 1px,#8d887480 1.5px,transparent 2px);background-size:5px 5px;flex-shrink:0}
.tuning-dial{width:37px;height:37px;flex-shrink:0;border-radius:50%;padding:4px;position:relative;background:repeating-conic-gradient(#262d26 0 9deg,#5c6152 9deg 13deg);box-shadow:inset 0 1px 1px #c5c9b180,0 3px 2px #7d7967,2px 4px 5px #554c343d}.tuning-dial i{position:absolute;inset:4px;border-radius:50%;background:linear-gradient(145deg,#565d4e,#222a24);box-shadow:inset 0 1px 1px #a4aa9460}.tuning-dial i:after{content:"";position:absolute;top:4px;left:13px;width:2px;height:9px;background:#ece5d4;border-radius:1px;transform:rotate(24deg);transform-origin:1px 10px}
.controls-label{flex:1;min-width:0;font:600 7px/1.8 var(--sans);letter-spacing:.08em;color:#62604f}
.power-button{width:47px;height:44px;flex-shrink:0;border-radius:10px;display:grid;place-items:center;border:1px solid #883c22;background:linear-gradient(145deg,#eb7546,#c34b25 75%);box-shadow:inset 1px 2px 2px #ffb17f,inset -2px -2px 2px #ad3c1c,0 4px 2px #944324,1px 6px 7px #5b452854;transition:box-shadow .2s var(--ease),transform .2s var(--ease)}
.power-button>span{width:14px;height:14px;border:1.5px solid #fff2d9;border-radius:50%;position:relative}.power-button>span:after{content:"";position:absolute;top:-4px;left:5px;width:2px;height:7px;background:#fff2d9;box-shadow:0 0 0 2px #df6537}.power-button:hover{filter:brightness(1.05)}.power-button:active{transform:translateY(3px);box-shadow:inset 1px 2px 2px #ffb17f,0 1px 2px #944324}
.console-slot{height:18px;position:relative;border-radius:4px;margin-bottom:20px;background:linear-gradient(#918b76,#b7ae96);padding:5px 18px;box-shadow:inset 0 2px 3px #5c584bc2,0 1px 1px #fffcf0}.console-slot span{display:block;height:5px;background:#222b22;border-radius:2px;box-shadow:inset 0 2px 2px #0a100bc7}.console-slot i{position:absolute;top:5px;right:10px;width:3px;height:7px;background:#dbe2b5;border-radius:1px;box-shadow:inset 0 1px 1px #65744c}
.console-base{display:flex;justify-content:space-between;gap:10px;font:6px/1.4 var(--mono);letter-spacing:.04em;color:#5b5e4e;padding:0 3px}
.object-caption{margin:28px 0 0;text-align:center;font:11px var(--sans);color:#636152}.status-light{width:6px;height:6px;background:#617550;margin-right:6px;box-shadow:inset 0 1px 1px #d8e6b49e,0 1px 1px #404d332e}
.hero-object.hello .mascot{animation:keeper-hello .7s var(--ease)}@keyframes keeper-hello{0%,100%{transform:translateY(0)}22%{transform:translateY(-8px) translateX(3px)}48%{transform:translateY(-4px) translateX(6px)}72%{transform:translateY(-7px) translateX(2px)}}

/* Fitted shelf housing and molded cartridge cases. */
.catalogue{max-width:1256px;padding:33px 30px 0;border:1px solid #aaa898;border-radius:18px;background:linear-gradient(140deg,#ddded3,#d2d2c6);scroll-margin-top:24px;box-shadow:inset 2px 2px 2px #fbfaf0,inset -2px -2px 3px #b8b9a7,0 5px 3px #c0beae,0 7px 4px #8b8c7b38,3px 16px 20px #58553a13}
.section-head{align-items:center;margin-bottom:25px}.section-head h2{font-size:38px}.section-head>.text-button{font:600 11px var(--sans)}
.search-console{background:linear-gradient(135deg,#434b41,#303b31);border:0;border-radius:9px;padding:9px 9px 9px 18px;gap:24px;margin-bottom:30px;box-shadow:inset 0 2px 3px #15271a80,0 1px 1px #f9f8e9}.search-label{color:#e3e9cc;font:500 10px var(--sans);letter-spacing:.025em}
.search-field{min-width:0;background:#f8f5e9;border:0;min-height:48px;border-radius:4px;padding:0 15px;box-shadow:inset 1px 2px 4px #5c61403b,0 1px 1px #121f1870}.search-field:focus-within{outline:0;box-shadow:inset 1px 2px 4px #5c61403b,inset 0 0 0 1px #757e69,0 1px 1px #121f1870}.search-field input:focus-visible{outline:0}.search-field input{font-size:14px;padding:13px 0}.search-field input::placeholder{color:#666455}.search-icon{border-color:#626557}.search-icon:after{background:#626557}.search-field kbd{background:linear-gradient(#faf8ee,#e3dfd0);border-color:#b9b6a5;box-shadow:0 2px 1px #aaa792;padding:3px 8px;color:#5d6254}
.catalogue-body{grid-template-columns:190px minmax(0,1fr);gap:30px}.filters{padding-right:20px;border-right:1px solid #b9bcab;box-shadow:1px 0 1px #edf0de}
.filter-heading{font:600 8px var(--sans);letter-spacing:.04em;margin-bottom:20px}.filter-heading .text-button{font:600 10px var(--sans);min-height:30px}.filter-group{padding:20px 0;border-top-color:#b9bcab}.filter-group h3,.filter-group summary{font:700 11px var(--sans);letter-spacing:.02em}.filter-group summary span{font:9px var(--mono)}
.filter-option{font-size:12px;gap:9px;min-height:37px}.filter-option input{width:14px;height:14px;background:#f6f3e7;border:1px solid #999d89;box-shadow:inset 0 1px 2px #615f4433,0 1px 1px #eef1dd;transition:background .15s}.filter-option input:checked{background:#38503c;border-color:#38503c;box-shadow:inset 0 0 0 3px #e7e9d9}.facet-count{color:#555c4c;min-width:28px;text-align:right;font-variant-numeric:tabular-nums}
.filter-note{border-top-color:#b9bcab;padding-top:24px;margin-top:5px}.mini-square{width:22px;height:6px;border-radius:1px;background:linear-gradient(90deg,#ba4d27 0 33%,#c4a44a 33% 66%,#607955 66%)}.filter-note p{font:11px/1.7 var(--sans);color:#555b4b}.filter-note button{font:500 11px var(--sans)}
.results-toolbar{margin-bottom:24px}.results-toolbar>p{font:11px/1.5 var(--mono);color:#4f5849;font-variant-numeric:tabular-nums}.sort-control{font:11px var(--sans);gap:9px}.sort-control select{font:600 10px var(--sans);min-height:34px;padding:6px 8px;border-radius:4px;background:#e9e9db;border:1px solid #b9bda9;box-shadow:inset 0 1px 1px #fffceb,0 2px 1px #b3b7a333}.active-filters:not(:empty){margin-bottom:25px}
.filter-chip{background:#f4eedc;border-color:#b4b59e;font-family:var(--sans);box-shadow:0 1px 2px #82836920}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 22px;padding:0 2px 6px}.cartridge-card{min-width:0}
.cartridge{--band:#d9a45e;--band-ink:#3d301a;--label:#f5eedc;display:flex;flex-direction:column;width:100%;aspect-ratio:1.025;min-height:238px;text-align:left;position:relative;isolation:isolate;border:1px solid #242c25;border-radius:14px 14px 9px 9px;padding:14px 15px 12px;background:linear-gradient(142deg,#596055,#39443a 18%,#303b32 62%,#283128);box-shadow:inset 1px 2px 2px #98a18b7a,inset -2px -3px 3px #152219c9,0 3px 2px #3b4537,0 7px 2px #1c281e,1px 9px 2px #909984,3px 12px 13px #35483238,0 19px 25px #3c493523;transition:transform .24s var(--ease),box-shadow .24s var(--ease)}
.cartridge:before{content:"";position:absolute;inset:5px;border:1px solid #19271d73;border-top-color:#86937a5c;border-left-color:#86937a5c;border-radius:9px 9px 4px 4px;pointer-events:none}
.cartridge:hover{transform:translateY(-5px);box-shadow:inset 1px 2px 2px #b1b8a285,inset -2px -3px 3px #152219c9,0 3px 2px #3b4537,0 7px 2px #1c281e,1px 9px 2px #909984,4px 17px 18px #35483240,0 23px 28px #3c49352e}.cartridge:active{transform:translateY(-1px)}
.cartridge[data-color=orange]{--band:#dea06e;--band-ink:#482713;--label:#f7ecd9}.cartridge[data-color=yellow]{--band:#d0b45d;--band-ink:#3f320d;--label:#f4eed6}.cartridge[data-color=green]{--band:#a8b486;--band-ink:#273e25;--label:#eff1de}.cartridge[data-color=blue]{--band:#8faeae;--band-ink:#233f3d;--label:#eaf0e5}.cartridge[data-color=purple]{--band:#b5a2bd;--band-ink:#402848;--label:#f2eae9}.cartridge[data-color=red]{--band:#d69b84;--band-ink:#4f261b;--label:#f5e8db}.cartridge[data-color=gray]{--band:#b6b6a3;--band-ink:#34392d;--label:#edeede}
.cart-screw{position:absolute;top:14px;width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,#bbc1a7,#656f5b);box-shadow:inset 0 1px 1px #dae0c7,0 1px 2px #142417,0 0 0 1px #202e20}.cart-screw:after{content:"";position:absolute;left:1.5px;right:1.5px;top:3px;height:1px;background:#3a4536;transform:rotate(-35deg)}.cart-screw.left{left:14px}.cart-screw.right{right:14px}
.cart-vents{height:8px;min-height:8px;margin:0 25px 12px;border-radius:2px;background:repeating-linear-gradient(90deg,#182a1d 0,#182a1d 2px,#5c6d514d 2px,#5c6d514d 3px,transparent 3px,transparent 6px);box-shadow:0 1px 1px #9dab8054}
.cart-label{position:relative;flex:1;display:flex;flex-direction:column;min-height:0;padding:0 13px 8px;border-radius:4px;overflow:hidden;background:var(--label);border:1px solid #101d157a;color:#29382b;box-shadow:inset 1px 1px 1px #fffdf280,inset -1px -1px 2px #827d5b30,0 0 0 2px #17271b80,0 2px 1px #818c7060}
.cart-category{display:flex;justify-content:space-between;gap:3px;flex-shrink:0;font:8px/1.4 var(--mono);letter-spacing:.02em;color:var(--band-ink);background:var(--band);padding:8px 11px 7px;margin:0 -13px 12px;border-bottom:1px solid #444e3030;box-shadow:inset 0 1px 1px #fff2d347}.cart-category>span:first-child{text-transform:uppercase}.cart-category>span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.cart-title{font:600 clamp(18px,1.64vw,23px)/1.08 var(--sans);letter-spacing:-.035em;min-height:46px;text-wrap:balance}.cart-graph{display:flex;align-items:center;flex:1;min-height:25px;width:100%;margin:5px 0 4px;color:#3e503d}.cart-graph svg{width:100%;height:auto;max-height:68px;opacity:.95}
.cart-bottom{display:flex;justify-content:space-between;align-items:center;gap:5px;min-height:21px;padding-top:6px;border-top:1px solid #61704c35;font:8px/1.4 var(--mono);color:#495943;flex-shrink:0}.cart-level{white-space:nowrap}.level-bars{letter-spacing:-2px;margin-right:5px;color:#657a50}.cart-bottom>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:50%}
.cart-footer{display:flex;height:13px;min-height:13px;gap:3px;align-items:center;justify-content:center;margin:10px 16px 0;padding:0 8px;border-radius:3px 3px 0 0;background:#1a281b;box-shadow:inset 0 2px 2px #0c190fc2,0 1px 1px #63725380}.cart-footer>i{display:block;width:7px;height:7px;background:linear-gradient(90deg,#a99e5c,#d7c57f 45%,#9c8a4c);box-shadow:inset 0 1px 1px #f4dfa657}
.card-caption{display:flex;align-items:flex-start;justify-content:space-between;gap:5px;padding:17px 1px 0}.card-caption p{font:11px/1.45 var(--sans);padding-top:4px;color:#505a48}.caption-actions{display:flex;gap:3px;flex-shrink:0}.caption-actions button{display:grid;place-items:center;width:30px;height:32px;margin:0;border:1px solid #aeb49e8c;border-radius:4px;color:#52604b;background:#e4e7d6;box-shadow:inset 0 1px 1px #f6f8e8,0 2px 1px #a3b0914d}.caption-actions button .ui-icon{width:15px;height:15px}.caption-actions button:hover{color:#263e2a;background:#f3f3e6;border-color:#8d9b7e}.caption-actions button[aria-pressed=true]{background:#3d513d;color:#f2f2d8;border-color:#3d513d;box-shadow:inset 0 1px 3px #172c1a80}
.load-area{padding:38px 0 40px}.load-area p{font:10px var(--mono);color:#505a48;margin-bottom:17px}.empty-state{padding:64px 15px;text-align:center}.empty-state img{width:90px;margin:0 auto 24px;image-rendering:pixelated}.empty-state h3{font-size:26px}.empty-state p{font-size:14px;color:var(--muted);margin:13px 0 23px}
.library-note{padding-top:64px;padding-bottom:58px;border-top:0;column-gap:80px}.library-note h2{font-size:35px;line-height:1.08;max-width:500px}.library-note p{font-size:14px;line-height:1.8}.library-note button{grid-column:2;align-self:start}
.footer{border-top-color:#bdb9ab;padding-block:28px 38px;color:#5d6053;font:10px/1.9 var(--sans)}.footer strong{font:700 13px var(--sans);margin-bottom:5px}.footer p{font:10px/1.9 var(--sans)}.footer a{text-decoration:underline}.footer>a{font-size:11px}

/* Keycaps and inspection panels use the same material system. */
.button{min-height:46px;padding:12px 19px;border-radius:6px;font:600 12px/1.5 var(--sans);gap:17px;transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease)}
.primary{border:1px solid #8e3a20;background:linear-gradient(155deg,#b24726,#a4381d);color:#fff8e8;box-shadow:inset 1px 1px 1px #f39c6c9e,0 3px 2px #883c23,1px 5px 7px #65412225}.primary:hover{background:linear-gradient(155deg,#b94c27,#ab3e1f);box-shadow:inset 1px 1px 1px #ffc098a1,0 3px 2px #883c23,1px 5px 9px #65412233}.primary:active{transform:translateY(2px);box-shadow:inset 0 1px 2px #8d392d4d,0 1px 1px #883c23}
.secondary{border:1px solid #a9ae96;background:linear-gradient(145deg,#f2f2e2,#d9decb);box-shadow:inset 1px 1px 1px #fffbee,0 3px 2px #9da88d,1px 5px 6px #40523720;color:#354630}.secondary:hover{background:linear-gradient(145deg,#fbf9eb,#e6ebd8)}
.text-button{font-family:var(--sans);font-weight:500;min-height:42px}button:disabled{opacity:.5;box-shadow:none}
dialog{border:1px solid #8d8e7c;background:#f0ebde;border-radius:16px;box-shadow:inset 0 1px 2px #fffbed,0 5px 3px #96917c,0 22px 70px #1728185c}dialog[open]{animation:none}dialog::backdrop{background:#18291c85;backdrop-filter:none}
.dialog-header{padding:14px 24px;font:9px var(--mono);color:#505a46;background:linear-gradient(120deg,#dddccc,#cdd1be);border-bottom:1px solid #aeb69c;box-shadow:0 1px 1px #faf7e6}
.close-button,.detail-save,.code-toolbar button,.compare-remove{display:grid;place-items:center;background:linear-gradient(145deg,#fcf8ec,#dfdac8);border:1px solid #b5af9d;border-radius:5px;box-shadow:inset 0 1px 1px #fffdf2,0 2px 1px #a9a08b5c}.close-button{width:40px;height:40px}
.detail-top{padding:30px 30px 25px}.detail-top h2{font-size:40px}.detail-subtitle{color:#57604d!important}.detail-tags>span{background:#e3e5d4;color:#424e37;border-color:#bcc2a9;font:9px var(--mono);padding:5px 7px}
.detail-tabs{border:0;background:#d4d9c5;padding:7px 24px 0;gap:4px;box-shadow:inset 0 2px 3px #626e4033,0 1px 1px #fffae8}.detail-tabs button{border:0;border-radius:5px 5px 0 0;font:500 12px var(--sans);padding:13px 16px;color:#4a583f}.detail-tabs button[aria-selected=true]{background:#f7f1e4;color:#a33b20;box-shadow:inset 0 1px 1px #fffef3,-1px 0 2px #6f78422e,1px 0 2px #6f78422e}
.detail-body{background:#f7f1e4;padding:28px 30px}.detail-body h3{font-size:25px}.detail-body h4{font:600 11px var(--sans);letter-spacing:.03em}.detail-body p,.detail-body li{color:#4b5944;max-width:72ch}
.detail-callout{border:1px solid #bdc3a7;background:#e6e9d4;padding:14px 16px;border-radius:4px}.example-input{border:0;padding:12px 14px;background:#ebe8d7;border-radius:4px}
.detail-footer{background:#e1e2d0;box-shadow:inset 0 1px 1px #fbf5e4;border-top:1px solid #bbc2a5}.detail-footer>span{font:10px var(--sans)}
pre{border-radius:6px;background:#21362b;box-shadow:inset 0 2px 5px #10281c99,0 1px 1px #fffbea;color:#dce7c8;font-size:11px}.code-toolbar{font-family:var(--sans)}.code-toolbar button{padding:9px 12px;font-size:11px}
.diagram{background:#eef0df;border:1px solid #b5bfa1;border-radius:6px;box-shadow:inset 0 1px 3px #697b3830,0 1px 1px #fffdee}.workflow-step,.transition-table td,.transition-table th{border-bottom-color:#cad0b8}.workflow-step{border-top-color:#cad0b8}
.preset-form label{font:11px var(--sans);gap:7px}.preset-form input{background:#fffcef;border-color:#b5bc9e;box-shadow:inset 0 1px 3px #6a733233;padding:10px}.preset-form .button{min-height:40px}
.source-type{font-size:9px;color:#59614f}.source-item a{font-size:16px}.source-item p{font-size:12px}.source-item .source-note{line-height:1.7}
.reading-inner h2,.info-inner h2,.comparison-inner h2{margin-top:0}.reading-intro{font-size:15px;max-width:62ch}
.reading-tabs button{font:11px var(--sans);padding:10px 15px;min-height:42px;background:linear-gradient(#faf5e7,#e6e2cf);border:1px solid #b3b79d;box-shadow:inset 0 1px 1px #fff9eb,0 2px 1px #a4ac8e5e}.reading-tabs button[aria-pressed=true]{background:#3c5039;color:#f4f1db;border-color:#3c5039;box-shadow:inset 0 1px 3px #1e301b}
.info-inner img{width:95px;image-rendering:pixelated;margin-bottom:23px}.comparison-table th[scope=col]{background:#e0e5cf;border-radius:5px 5px 0 0}.comparison-table td,.comparison-table th{border-bottom-color:#c4ccb0}
.compare-bar{border-color:#969e81;background:linear-gradient(140deg,#ebebd8,#cfd7bc);box-shadow:inset 0 1px 1px #ffffed,0 3px 2px #839275,0 8px 20px #293b3433;border-radius:9px;font:11px var(--sans);padding:13px 16px}.compare-bar .button{min-height:42px}
.toast{font:12px var(--sans);background:#2c4030;color:#f2f3d8;border-radius:5px;box-shadow:0 5px 16px #1a2d1830}
@media(max-width:1256px){.catalogue{margin-inline:28px}.hero{gap:42px}.cart-title{font-size:21px}}
@media(max-width:1100px){
.hero{gap:32px;padding-top:50px;padding-bottom:60px}h1{font-size:clamp(48px,6.3vw,66px)}
.console{padding:23px 21px 22px;border-radius:21px}.screen-frame{padding:11px}.screen-main{min-height:137px;gap:18px}.mascot{width:94px}.screen-number{font-size:58px}.controls-label{font-size:6px}.speaker{width:43px}.tuning-dial{width:32px;height:32px}.tuning-dial i:after{left:10px}.console-controls{gap:11px}
.hero-footnote{gap:9px;font-size:9px}.hero-footnote>span+span:before{margin-right:9px}
.catalogue{padding:28px 24px 0}.catalogue-body{grid-template-columns:160px minmax(0,1fr);gap:24px}.filters{padding-right:16px}
.cards{gap:26px 17px}.cartridge{padding:12px 12px 10px}.cart-label{padding-inline:10px}.cart-category{margin-inline:-10px;padding-inline:9px;font-size:7px;margin-bottom:10px}.cart-title{font-size:19px;min-height:41px}.cart-bottom{font-size:7px}.level-bars{display:none}.cart-vents{margin-bottom:10px}.cart-footer{margin-inline:10px;gap:2px}.caption-actions button{width:27px;height:30px}.card-caption p{font-size:10px}
}
@media(max-width:850px){
.header{min-height:98px}nav{gap:19px}.hero{gap:25px;grid-template-columns:1fr 1fr;padding-top:42px;padding-bottom:50px}h1{font-size:clamp(43px,6.6vw,57px)}.hero-description{font-size:15px}.hero-actions{gap:18px;flex-wrap:wrap}
.console{padding:21px 18px}.console-maker strong{font-size:15px}.screen-frame{padding:9px}.console-screen{padding:12px}.screen-main{min-height:124px;gap:12px}.mascot{width:73px}.screen-number{font-size:51px}.screen-kicker,.screen-caption,.screen-meta{font-size:7px}.screen-bottom{font-size:6px}.console-controls{gap:10px;padding-block:18px}.speaker{width:30px;height:34px}.controls-label{font-size:6px;letter-spacing:.04em}.tuning-dial{width:29px;height:29px}.tuning-dial i:after{left:9px;top:3px}.power-button{width:39px;height:39px}.console-base{font-size:5px}
.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.cart-title{font-size:23px;min-height:46px}.cart-category{font-size:8px;padding-block:8px}.cart-bottom{font-size:8px}.card-caption p{font-size:11px}.section-head h2{font-size:31px}.search-label{display:none}.library-note{column-gap:40px}.library-note h2{font-size:30px}
}

@media(max-width:650px){
.header{min-height:88px;gap:12px}.brand{font-size:13px;gap:9px}.brand-mark{width:32px;height:32px}.brand-note{font-size:8px}nav{gap:0}nav button{font-size:11px;min-height:44px}.saved-button{font-size:10px;min-height:42px;padding:8px 10px;gap:6px}.saved-button>.ui-icon{width:15px;height:15px}
.hero{display:block;padding-top:38px;padding-bottom:37px}h1{font-size:clamp(44px,11vw,66px);line-height:1.04}.hero-description{font-size:15px;max-width:34ch;margin-top:22px}.hero-actions{margin-top:25px;gap:22px;flex-wrap:nowrap}.hero-actions .button{font-size:11px;padding-inline:15px;gap:12px}.hero-actions .text-button{font-size:11px}
.hero-footnote{margin-top:24px;font:8px/1.7 var(--mono);gap:7px}.hero-footnote>span+span:before{margin-right:7px}
.hero-object{max-width:374px;margin:32px auto 0;padding:3px 5px 0;min-height:0}.console{max-width:none;padding:25px 23px 23px;border-radius:22px}.console-maker{font-size:7px}.console-maker strong{font-size:17px}.console-model{font-size:8px}.console-model i{width:29px;height:9px}.console-top{padding-bottom:16px}.screen-frame{padding:11px;border-radius:13px}.console-screen{padding:13px 15px 12px}.screen-main{min-height:127px;gap:24px}.mascot{width:98px}.screen-number{font-size:59px}.screen-kicker,.screen-meta{font-size:8px}.screen-caption{font-size:7px}.screen-ready,.screen-bottom{font-size:6px}.console-controls{gap:13px;padding-block:20px}.speaker{width:41px;height:32px}.tuning-dial{width:32px;height:32px}.tuning-dial i:after{left:10px}.controls-label{font-size:6px;letter-spacing:.03em}.power-button{width:43px;height:42px}.console-base{font-size:5px}.console-slot{margin-bottom:17px}.object-caption{margin-top:26px;font-size:10px}
.catalogue{margin-inline:12px;padding:25px 16px 0;border-radius:14px}.section-head{display:block;margin-bottom:19px}.section-head h2{font-size:30px;max-width:300px;line-height:1.1}.section-head>.text-button{font-size:11px;margin-top:10px;min-height:34px}
.search-console{padding:7px;gap:9px;margin-bottom:23px;border-radius:7px}.search-field{min-height:46px;padding-inline:11px;gap:10px}.search-field input{font-size:16px;padding-block:12px}.filter-toggle{display:flex;align-items:center;gap:6px;color:#eef0d5;min-height:44px;padding:8px 5px;font:500 10px var(--sans)}.filter-toggle>span{background:#62725a;color:#f5f4d7;border-radius:3px;padding:2px 4px;font:9px var(--mono)}
.filters{display:none;border:0;box-shadow:none;padding-right:0;margin-bottom:25px}.filters.is-open{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.filter-heading{grid-column:1/-1;margin-bottom:6px;min-height:35px;font-size:9px}.filter-heading .text-button{font-size:11px;min-height:44px}.filter-option{min-height:44px;font-size:12px}.filter-group{padding-block:16px}.filter-note{display:none}.catalogue-body{display:block}
.results-toolbar{min-height:36px;gap:10px;margin-bottom:23px}.results-toolbar>p{font-size:9px}.sort-control select{min-height:36px;font-size:10px;max-width:121px}
.cards{gap:25px 15px;padding-inline:0}.cartridge{aspect-ratio:.93;min-height:208px;padding:11px 10px 9px;border-radius:11px 11px 6px 6px;box-shadow:inset 1px 2px 2px #98a18b7a,inset -2px -3px 3px #152219c9,0 3px 2px #3b4537,0 6px 2px #1c281e,1px 8px 2px #909984,2px 10px 10px #35483238}.cartridge:before{inset:4px;border-radius:7px 7px 3px 3px}
.cart-screw{width:6px;height:6px;top:11px}.cart-screw:after{top:2.5px;left:1px;right:1px}.cart-screw.left{left:11px}.cart-screw.right{right:11px}.cart-vents{height:6px;min-height:6px;margin:0 17px 9px}
.cart-label{padding:0 8px 6px}.cart-category{margin:0 -8px 9px;padding:6px 7px;font-size:6px;letter-spacing:0;gap:2px}.cart-title{font-size:clamp(15px,4.2vw,21px);min-height:36px;line-height:1.08;letter-spacing:-.03em}.cart-graph{margin:3px 0;min-height:23px}.cart-graph svg{max-height:45px}.cart-bottom{min-height:19px;padding-top:5px;gap:4px;font-size:7px}.cart-bottom>span:last-child{font-size:6px;max-width:48%}.cart-footer{height:11px;min-height:11px;margin:8px 5px 0;gap:2px;padding:0 4px}.cart-footer>i{width:5px;height:6px}
.card-caption{flex-wrap:wrap;padding-top:14px;gap:5px}.card-caption p{font-size:10px;line-height:1.4;flex:1 1 100%;max-width:100%;padding:0}.caption-actions{margin:0;gap:6px}.caption-actions button{width:44px;height:44px}.caption-actions button .ui-icon{width:17px;height:17px}
.load-area{padding:30px 0 33px}.load-area .button{font-size:11px;padding:11px 15px}
.library-note{display:block;padding-top:43px;padding-bottom:38px}.library-note h2{font-size:31px}.library-note p{font-size:14px;margin-block:20px 13px}.library-note button{font-size:12px}.footer{font-size:10px;gap:20px;align-items:start}.footer p{font-size:10px}.footer>a{font-size:11px}
dialog{width:calc(100% - 24px);max-height:94dvh;border-radius:12px}.dialog-header{padding:11px 15px;font-size:8px}.close-button{width:44px;height:44px}.detail-top{display:block;padding:24px 20px 23px}.detail-top h2{font-size:31px;padding-right:44px}.detail-save{top:85px;right:19px;min-width:40px;width:40px;min-height:42px}.detail-tags>span{font-size:8px}.detail-tabs{padding:6px 10px 0}.detail-tabs button{min-height:44px;font-size:11px;padding:12px}.detail-body{padding:25px 20px}.detail-body h3{font-size:24px}.detail-columns{display:block}.detail-footer{padding:18px 20px}.detail-footer .downloads{gap:8px}.detail-footer .button{padding:11px 9px;font-size:10px}.reading-inner,.info-inner,.comparison-inner{padding:26px 20px}.reading-inner h2,.info-inner h2,.comparison-inner h2{font-size:33px}.source-item a{font-size:15px}.source-item{grid-template-columns:1fr;gap:7px}.reading-tabs{gap:7px}.reading-tabs button{min-height:44px;padding-inline:12px}.compare-bar{font-size:11px;padding:10px 12px;gap:12px}.compare-bar .button,.compare-bar>button:not(.button){min-height:44px}.preset-form{gap:13px}.preset-form input{min-height:44px}
}
@media(max-width:370px){
.shell{padding-inline:16px}.header{gap:8px}.brand{font-size:12px;gap:7px}.brand-mark{width:29px;height:29px}.brand-note{font-size:7px}nav button{font-size:10px}.saved-button{padding-inline:7px;gap:4px}.hero-actions{gap:15px}.console{padding:22px 19px}.screen-main{gap:15px}.mascot{width:87px}.screen-number{font-size:55px}.console-controls{gap:10px}.controls-label{font-size:5px}.catalogue{padding-inline:13px}.cards{gap:25px 13px;grid-template-columns:1fr}.cartridge{aspect-ratio:1.025;min-height:238px}.cart-title{font-size:22px}
}

/* Legibility corrections from the single batched inspection. */
.brand-note{font-size:11px;letter-spacing:0}
.nav-count,#saved-count,.saved-button,nav button{font-size:11px}
.hero-footnote{font:11px/1.7 var(--sans);max-width:490px}
.object-caption{font-size:12px}.controls-label{color:#494a3b}
.filter-heading{font-size:10px}.filter-heading .text-button{font-size:11px}
.facet-count,.filter-group summary span,.results-toolbar>p,.sort-control select{font-size:11px}
.cart-category{font-size:11px;letter-spacing:0}.cart-bottom{font-size:11px}
.level-bars{display:none}.card-caption p{font-size:12px}.caption-topology{display:none}
.filter-chip{font-size:11px}
.source-type,.source-item p,.detail-tags>span,.detail-subtitle,.detail-footer>span,.dialog-header{font-size:11px}
.detail-save .ui-icon{width:22px;height:22px}
.footer,.footer p,.footer a,.load-area p{font-size:11px}
@media(max-width:1100px){
.cart-category,.cart-bottom{font-size:11px}.cart-title{font-size:19px}
.card-caption{flex-wrap:wrap;gap:7px}.card-caption p{font-size:11px;flex:1 1 100%;padding:0}
}
@media(max-width:850px){.cart-title{font-size:23px}}
@media(max-width:650px){
.brand-note{font-size:11px}.brand{font-size:13px}
nav button,.saved-button,#saved-count{font-size:11px}
.hero-footnote{font:11px/1.7 var(--sans);gap:8px;max-width:34ch}
.hero-footnote>span+span:before{margin-right:8px}.object-caption{font-size:11px}
.results-toolbar>p,.sort-control select,.filter-toggle,.filter-toggle>span,.filter-heading,.filter-heading .text-button,.facet-count{font-size:11px}
.cartridge{min-height:224px}.cart-category{font-size:11px;padding:7px 7px;margin-bottom:9px}
.cart-title{font-size:clamp(15px,4.2vw,21px)}.cart-bottom{font-size:11px;min-height:23px}
.cart-bottom>span:last-child{display:none}
.caption-topology{display:block;font-size:11px;color:#565f4e;line-height:1.4;margin-top:4px}
.card-caption p{font-size:11px}
.dialog-header,.detail-tags>span,.detail-footer>span,.detail-footer .button{font-size:11px}
}
@media(max-width:370px){
.header{display:grid;grid-template-columns:1fr auto;gap:4px 12px;min-height:110px;padding-block:14px}
.header nav{grid-column:1/-1;justify-self:end}.header nav button{min-height:28px;padding-block:4px;font-size:11px}
.brand{font-size:13px}.brand-note{font-size:11px}
.hero-object{padding-inline:3px}.console{padding:22px 19px}.screen-frame{padding:9px}.console-screen{padding:12px 10px}
.screen-main{gap:13px}.screen-main>div{flex:1;min-width:0}.mascot{width:75px;flex-shrink:0}
.screen-number{font-size:50px}.screen-caption{white-space:normal}
.cards{grid-template-columns:1fr}.cartridge{aspect-ratio:1.025;min-height:238px}.cart-title{font-size:22px}
.cart-bottom>span:last-child{display:block;font-size:11px}.caption-topology{display:none}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.cartridge:hover,.hero-object.hello .mascot{transform:none}}
}
