/* Chunky 16-bit hardware: top-loading console and landscape cartridges. */
.monitor-stand{height:23px;width:27%}
.console{width:76%;max-width:465px;padding:0;margin:0 auto;border-radius:9px 9px 14px 14px;border:1px solid #858b81;border-top:2px solid #f1f0e8;background:#b6b9b0;box-shadow:inset -3px 0 #969d90,0 8px 0 -2px #828c7c,0 18px 23px #292f2726;position:relative}
.console-deck{height:124px;position:relative;background:linear-gradient(115deg,#d8d9d1,#c6c9bf 70%,#bbc0b5);border-radius:7px 7px 0 0;border-bottom:3px solid #9ea696;box-shadow:inset 2px 2px #edece3,inset -3px 0 #b1b8a9;padding:30px 18% 12px}
.console-deck:after{content:'';position:absolute;left:12%;right:12%;bottom:0;height:5px;background:#c7cbbf;box-shadow:0 -1px #e4e6dc}
.deck-ribs{position:absolute;top:8px;bottom:7px;width:12%;background:repeating-linear-gradient(0deg,#b1b8a9 0 3px,#d8dcd0 3px 7px);border:1px solid #a9b29f;border-radius:2px}
.deck-ribs.left{left:7px}.deck-ribs.right{right:7px}
.cartridge-well{height:42px;padding:8px 10px 0;background:#adb4a6;border:1px solid #969f8c;border-radius:4px;box-shadow:inset 0 3px 2px #87917c,0 2px #e3e5d9;position:relative}
.slot{height:13px;width:100%;background:#30382d;border:1px solid #68745e;border-radius:2px;box-shadow:inset 0 4px 4px #11190f,0 2px #dce0d1;position:relative;z-index:2}
.slot-name{position:absolute;left:0;right:0;bottom:4px;font:6px var(--mono);letter-spacing:.8px;color:#58654d;text-align:center;white-space:nowrap}
.slot.loaded:after{left:6%;right:6%;top:-32px;height:38px;background:linear-gradient(#c1c5ba 0 3px,#a8afa0 3px 6px,#c7cbbf 6px 10px,#55634b 10px 24px,#b7bfae 24px);border:1px solid #77856a;border-radius:3px 3px 0 0;box-shadow:inset 2px 0 #e0e3d7,2px 2px #727f6655}
.deck-brand{margin-top:12px;font-size:20px;font-weight:700;letter-spacing:-1px;color:#5c6754;line-height:.9}.deck-brand>span{font-style:italic;color:#9a715c;margin-left:3px}.deck-brand small{display:block;font:5px var(--mono);letter-spacing:1px;margin-top:5px;color:#74806b}
.console-front{min-height:64px;padding:12px 16px 14px;display:flex;align-items:center;gap:15px;flex-wrap:wrap;background:linear-gradient(#b7bdb0,#a6afa0);border-radius:0 0 12px 12px;border-top:1px solid #dfe2d6;box-shadow:inset 0 -6px #929e87,inset 2px 0 #cdd3c4}
.hardware-buttons{gap:8px}.hardware-button{min-height:31px;background:linear-gradient(#8e879d,#736c85);color:#f1ecdf;border:1px solid #655e73;border-radius:3px;box-shadow:0 3px #585164,inset 1px 1px #b5aec1;padding:7px 9px;font-size:7px}.hardware-button.power{color:#fff1e8;background:linear-gradient(#b77962,#945c47);border-color:#86533f;box-shadow:0 3px #70432f,inset 1px 1px #d6a18a}.hardware-button:active{box-shadow:inset 0 2px #403a4a;transform:translateY(2px)}
.console-name{font-size:10px;letter-spacing:.8px;flex:1;text-align:right}.controller-ports{display:flex;gap:5px}.controller-ports i{font:6px var(--mono);font-style:normal;border:2px solid #707a64;border-radius:6px;background:#48523f;color:#b3bea7;width:23px;height:12px;text-align:center;box-shadow:0 1px #d0d8c5}
.cartridges{gap:15px;align-items:end;padding:34px 0 24px}
.cartridge{height:auto;aspect-ratio:1.15;min-height:0;padding:14% 16% 12%;border-radius:4px;clip-path:polygon(9% 0,91% 0,91% 8%,100% 8%,100% 87%,94% 87%,94% 100%,6% 100%,6% 87%,0 87%,0 8%,9% 8%);background:linear-gradient(115deg,#cbd0c3,#b4bdab 70%);border:1px solid #87977a;box-shadow:inset 2px 2px #e1e6d8,inset -3px -3px #95a489}
.cartridge:before{left:8%;right:8%;top:5%;bottom:auto;height:5%;background:repeating-linear-gradient(0deg,#96a58b 0 1px,#ced8c4 1px 3px);border-top:0;border-bottom:1px solid #a4b397}
.cartridge:after{left:4%;right:auto;width:8%;top:22%;bottom:16%;border-radius:1px;background:repeating-linear-gradient(0deg,#93a386 0 2px,#d4dec9 2px 5px);box-shadow:calc(100% + 76px) 0 #a1af95}
.label{padding:6px 5px 5px;border-radius:2px;border:1px solid #6f7f61;box-shadow:0 1px #e4ead9;min-height:0}
.label-title{font-size:clamp(10px,1.05vw,15px);letter-spacing:-.4px;line-height:1}.label-title.small{font-size:clamp(9px,.95vw,13px)}.label-top{font-size:4px;letter-spacing:.4px}.label-sub{font-size:4px;letter-spacing:.2px}.label svg{height:90%;width:74%;left:26%;top:12%;opacity:.38}.label-title{max-width:100%}.selected-mark{font-size:6px}.cart-number{font-size:7px}
@media(min-width:1550px){.cartridge{height:auto}.label-title{font-size:17px}.label-title.small{font-size:15px}.label-top,.label-sub{font-size:5px}}
@media(max-width:1150px){.console{width:84%}.console-name{font-size:8px}.controller-ports{display:none}.console-deck{height:114px}.console-front{min-height:60px;padding:10px 13px 13px;gap:8px}.hardware-button{padding:7px}.cartridges{gap:10px}.cartridge{height:auto;padding:14% 15% 12%}.label{padding:5px 4px}.label-title{font-size:11px}.label-title.small{font-size:9px}.label-top,.label-sub{font-size:3.5px}}
@media(max-width:850px){.console{width:74%;max-width:430px}.console-deck{height:124px}.console-front{min-height:65px;padding:12px 16px 15px}.controller-ports{display:flex}.console-name{font-size:11px}.cartridges{gap:22px;padding:27px 5px 23px}.label{padding:9px 7px}.label-title{font-size:20px}.label-title.small{font-size:18px}.label-top,.label-sub{font-size:6px}.selected-mark{font-size:8px}.cart-number{font-size:9px}}
@media(max-width:540px){.console{width:82%}.console-deck{height:115px;padding-top:27px}.console-front{min-height:65px;padding:11px 12px 15px;gap:10px}.controller-ports{display:none}.console-name{font-size:9px}.hardware-button{padding:6px 7px;font-size:6px;min-height:29px}.cartridges{gap:12px;padding:27px 0 20px}.cartridge{height:auto;padding:14% 15% 12%}.label{padding:5px 4px}.label-title{font-size:12px}.label-title.small{font-size:10px}.label-top,.label-sub{font-size:3.8px}.cart-number{font-size:7px}.selected-mark{font-size:5px}.slot-name{font-size:5px}.deck-brand small{font-size:4px}}
/* Project-supplied label artwork uses a consistent 800 × 600 master. */
.cartridge{aspect-ratio:1.18;padding:14% 15% 18%}
.label{height:auto;aspect-ratio:4/3}
.label img.project-artwork{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}