:root{font-family:Arial,Helvetica,sans-serif;color:#f5e9df;background:#d95747}*{box-sizing:border-box}body{margin:0}button{cursor:pointer;font:inherit}button:focus-visible,[role=button]:focus-visible{outline:3px solid #70e4d7;outline-offset:6px}[hidden]{display:none!important}.app{max-width:1100px;margin:auto;padding:30px 16px 20px}.masthead{text-align:center;margin:0 auto 28px}.masthead h1{font:900 clamp(36px,7vw,70px)/1 Arial,sans-serif;letter-spacing:-.06em;margin:4px 0 0;color:#fff5ed;font-style:italic;text-align:left;}.masthead h1 span{font-size:.34em;color:#ffe0b5;letter-spacing:0}.masthead p{font:700 12px monospace;letter-spacing:.25em;text-align:left;}.cartridge-shelf{display:flex;justify-content:center;align-items:flex-start;gap:clamp(8px,3vw,35px);padding:4px 10px 18px}.game-cartridge{position:relative;flex:0 1 170px;height:176px;max-width:27%;background:linear-gradient(#aaa5a1 0 12%,#d2ccca 12% 17%,#a7a3a2 17% 100%);border:3px solid #dedad7;border-bottom:9px solid #77716e;border-radius:9px 9px 4px 4px;box-shadow:5px 7px 0 #a33f37;color:white;cursor:grab;transition:transform .17s,box-shadow .17s;padding:21px 12px 8px;touch-action:pan-y}.game-cartridge:hover,.game-cartridge:focus-visible,.game-cartridge.chosen{transform:translateY(-8px);box-shadow:5px 15px 0 #a33f37}.game-cartridge:active{cursor:grabbing}.game-cartridge.chosen{outline:3px solid #69ebe0;outline-offset:2px}.cart-ridges{position:absolute;top:8px;left:12%;right:12%;height:7px;background:repeating-linear-gradient(90deg,#888 0 7%,#bbb 7% 10%)}.game-label{display:flex;flex-direction:column;justify-content:space-between;align-items:center;height:132px;background:#1a1e24;border:5px solid #e5e3df;padding:5px 3px 7px;text-align:center;overflow:hidden}.game-label b,.game-label small{font:700 8px monospace;letter-spacing:.03em}.game-label strong{font:900 clamp(11px,1.7vw,19px)/1.06 Arial,sans-serif;letter-spacing:-.04em}.game-label.dudes{background:linear-gradient(145deg,#0b141d 0 50%,#5331a6 50% 70%,#9bebf1 70%);color:#fff}.game-label.ice{background:linear-gradient(140deg,#144d77,#8ae3e5);color:white}.game-label.own{background:#34313b;color:#e3d6c4}.hint{min-height:30px;text-align:center;font:700 13px/1.5 monospace;letter-spacing:.04em;margin:7px 0 6px;color:#fff5e9}.nes-stage{width:100%;overflow:visible;display:grid;place-items:center;min-height:340px;padding-top:40px;padding-bottom:20px}.nes{font-size:clamp(5px,1.2vw,16px);width:45em;height:15em;position:relative;color:#b62f28;font-family:Arial,sans-serif;font-weight:900;filter:drop-shadow(10px 16px 10px #a33c33)}.nes:before{content:"";position:absolute;width:91%;top:0%;left:.3%;border-bottom:.5em solid #c9c4c1;border-left:2em solid transparent;border-right:2em solid transparent}.nes-top{position:absolute;top:0;left:0;width:45em;height:7.4em;background:#cdc8c5;border-top:.2em solid #dfd9d6;border-right:.2em solid #bdb9b7;border-radius:.3em .3em 0 0;box-shadow:0 .5em 0 -.2em #535353;perspective:75em;cursor:default}.nes-top:before{content:"";position:absolute;border-right:.8em solid #b8b8b8;border-top:.3em solid transparent;top:-.22em;left:4.8em}.nes-top:after{content:"";position:absolute;border-left:.8em solid #b8b8b8;border-top:.3em solid transparent;top:-.22em;left:29.4em}.lid{z-index:3;width:25em;height:6em;background:#cdc8c5;position:absolute;left:5em;top:-.2em;transition:transform .48s,box-shadow .48s;transform-style:preserve-3d;transform-origin:50% 0;border-top:.2em solid #e0dcd9;border-right:.1em solid #e4dfdc;border-bottom:.1em solid #e5e1df;border-radius:.15em;box-shadow:0 .1em .2em #777}.nes-top:hover .lid,.nes-top.open .lid,.nes-top.drop-hover .lid{box-shadow:0 3em 5em -2em #666;transform:rotateX(65deg)}.lid:after{content:"";width:100%;height:0.7em;background:#c7c3c1;position:absolute;left:1px;top:0;transform-origin:top;transform:rotateX(45deg)}.lid h2{position:absolute;top:.4em;left:.8em;font:bold 2.5em Arial,sans-serif;margin:0;color:#c62d27;letter-spacing:-.05em}.lid h3{font:bold .85em Arial,sans-serif;position:absolute;top:5.6em;left:2.7em;letter-spacing:.05em;margin:0;color:#c62d27}.cartridge-slot{width:25em;height:5.9em;position:absolute;left:4.8em;overflow:hidden;border-right:.2em solid #b9b5b3;border-bottom:.2em solid #eee;border-left:.2em solid #b5b0ad;border-radius:0 0 .5em .5em;background:#817b79}.cartridge-slot-border{position:absolute;left:2%;width:95%;bottom:15%;height:.4em;background:#bebaba}.cartridge-slot-hole{width:82%;height:75%;background:#423f3f;position:absolute;left:8.6%;top:5%;border-left:.1em solid #eee;border-right:.1em solid #eee;border-radius:.2em;box-shadow:inset 0 2em 3em black,inset 0 -.4em #424242,inset 0 -1.2em #222}.cartridge-slot-hole:after{content:"";position:absolute;bottom:1.6em;left:8%;width:84%;height:.2em;background:repeating-linear-gradient(90deg,#444 0 .25em,#1c1c1c .25em .5em)}.inserted-cart{position:absolute;z-index:2;top:1em;left:7em;width:11em;height:3.8em;border:.3em solid #bab4ad;background:#8e8988;border-radius:.3em .3em 0 0;color:#f9f9f9;display:grid;place-items:center;text-align:center;font:bold 1em/1.1 monospace;animation:insert .26s ease-out}.nes-bottom{width:39em;height:7.5em;background:#7a7077;position:absolute;bottom:0;left:3em;box-shadow:0 .6em 1em -.3em #8d342d;border-bottom:.2em solid #958991}.nes-bottom:before{content:"";height:1.5em;position:absolute;left:-3em;top:0;border-right:3em solid #7a7077;border-bottom:6em solid transparent}.nes-bottom:after{content:"";height:1.5em;position:absolute;right:-3em;top:0;border-left:3em solid #7a7077;border-bottom:6em solid transparent}.power-box{position:absolute;left:1.4em;top:0;width:11.5em;height:5.8em;border:1px solid #898087;border-top:0;border-radius:.3em}.power,.reset{position:absolute;cursor:pointer;width:6em;height:2.8em;left:3em;top:5em;font-size:.6em;border:.5em ridge #857d84;border-radius:.6em;background:#7a7077;color:#ae2828;font-weight:900;box-shadow:0 -.4em #665e64,0 .2em 1em -.3em #292327}.power:before{content:"POWER"}.reset:before{content:"RESET"}.reset{left:11em}.power:active,.reset:active{transform:translateY(.2em);box-shadow:0 -.1em #665e64}.power:disabled,.reset:disabled{opacity:.65}.light{position:absolute;width:.6em;height:.6em;left:.6em;bottom:1.3em;background:#504f4f;box-shadow:inset 0 0 .2em #333}.light.on{background:#ff371c;box-shadow:0 0 .5em .2em #ff411c}.gamepads-slots{height:100%;position:absolute;width:19%;right:13%;background:#333;border-top:.2em solid #5d5d5d;border-bottom:.2em solid #555;box-shadow:inset 0 1.3em #333,inset 0 1.4em #555,inset 0 -1.9em #333,inset 0 -2.1em #555}.gamepad-slot{position:absolute;width:33%;height:36%;bottom:14%;border-radius:1em;background:#222;border:.25em solid #444;box-shadow:inset 0 0 .8em #000}.gamepad-slot:after{content:"";position:absolute;inset:15% 25%;border-radius:1em;background:repeating-linear-gradient(0deg,#111 0 12%,#484848 12% 18%)}.gamepad-slot.p1{left:9%}.gamepad-slot.p2{right:9%}.nes-top.drop-hover .cartridge-slot-hole{box-shadow:inset 0 2em 3em black,0 0 0 .3em #7ff5df}.quiet{display:block;margin:0 auto;background:transparent;border:0;text-decoration:underline;text-underline-offset:4px;color:#fff4e8;font:12px monospace}.player{width:min(900px,100%);margin:auto}.player-tools{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px;font:bold 13px monospace}.player-tools button,.controls button{background:#292b34;border:1px solid #c1b6af;color:white;padding:10px 14px;font:700 12px monospace}#screen{display:block;width:min(100%,768px);height:auto;aspect-ratio:256/240;image-rendering:pixelated;background:#060608;margin:auto;border:12px solid #302d36;box-shadow:0 12px 0 #943f36}.controls{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;font:11px/1.6 monospace;padding:30px 0 14px}.player-error{text-align:center;min-height:20px;font:12px monospace}.touch-controls{display:flex;justify-content:space-between;gap:25px;padding:10px 0 20px}.dpad{text-align:center}.dpad div{display:flex;gap:35px}.touch-controls button{min-width:50px;min-height:48px;padding:9px;background:#292b34;color:white;border:2px solid #8b8587;border-radius:6px;touch-action:none;user-select:none}.action-buttons{display:flex;flex-wrap:wrap;align-content:center;justify-content:flex-end;gap:12px;max-width:245px}footer{text-align:center;font:10px monospace;margin:40px 0 10px;letter-spacing:.13em;color:#f2d6cd}@keyframes insert{from{transform:translateY(-2em);opacity:.5}to{transform:translateY(0);opacity:1}}@media(max-width:550px){.app{padding:22px 10px}.game-cartridge{height:127px;padding:14px 5px 5px}.game-label{height:98px;border-width:3px}.game-label strong{font-size:11px}.game-label b,.game-label small{font-size:6px}.nes-stage{min-height:220px;padding-top:20px}.nes{font-size:min(2vw,10px)}.hint{font-size:11px}.controls{padding-top:30px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Automatic ROM catalogue cartridges */
.game-label.generated{background:linear-gradient(145deg,hsl(var(--hue) 55% 22%),hsl(var(--hue) 65% 40%));color:#fff}
.game-label.generated strong{font-size:clamp(10px,1.5vw,16px);overflow-wrap:anywhere;word-break:normal;line-height:1.05}

/* Cartridge library layout: console gets the stage, cards get their own scroll. */
.app { max-width:none; width:100%; min-height:100vh; display:flex; flex-direction:column; padding:22px clamp(12px,2.5vw,40px) 12px; }
.masthead { flex:none; margin:20px auto 10px; width: 75%; }
.launcher-layout { display:grid; grid-template-columns:minmax(0,1fr) clamp(195px,20vw,350px); gap:clamp(14px,2vw,35px); min-height:0; flex:1; align-items:stretch; }
.launcher-main { min-width:0; display:flex; flex-direction:column; align-items:stretch; justify-content:center; }
.launcher-main .hint { order:2; margin:18px auto 0; display: flex; flex: content; width: 68%; }
.launcher-main .nes-stage { order:1; container-type:inline-size; min-height:350px; padding:10px 0 20px; }
.launcher-main .nes { font-size:clamp(5px,1.85cqw,16px); }
.cartridge-sidebar { min-width:0; height:calc(100vh - 170px); min-height:300px; position:sticky; top:16px; align-self:start; display:flex; flex-direction:column; border-radius:12px; border:1px solid rgba(255,255,255,.22); background:rgba(0,0,0,.10); padding:14px 12px 12px; }
.sidebar-heading { flex:none; margin:0 0 14px; text-align:center; font:700 12px/1.4 monospace; letter-spacing:.18em; color:#fff7ef; }
.cartridge-scroll { flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; scrollbar-color:rgba(255,255,255,.45) rgba(0,0,0,.13); scrollbar-width:thin; }
.cartridge-shelf { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; flex-wrap:nowrap; gap:23px; padding:10px 10px 24px; }
.cartridge-shelf .game-cartridge { flex:0 0 auto; width:min(100%,175px); max-width:none; }
.cartridge-shelf .game-label.generated strong { font-size:clamp(11px,1.2vw,16px); overflow-wrap:anywhere; }
.app > footer { margin:14px auto 4px; width: 73%; text-align: left; }
@media (max-width:850px) {
  .app { padding:18px 12px; }
  .launcher-layout { display:flex; flex-direction:column-reverse; gap:8px; }
  .cartridge-sidebar { height:auto; min-height:0; position:static; width:100%; padding:12px; }
  .sidebar-heading { text-align:left; margin:0 0 9px; }
  .cartridge-scroll { overflow-x:auto; overflow-y:hidden; }
  .cartridge-shelf { flex-direction:row; width:max-content; min-width:100%; justify-content:flex-start; gap:16px; padding:8px 10px 14px; }
  .cartridge-shelf .game-cartridge { flex:0 0 145px; width:145px; max-width:none; }
  .cartridge-shelf .game-label.generated strong { font-size:12px; }
  .launcher-main .nes-stage { min-height:240px; }
  .launcher-main .nes { font-size:clamp(5px,1.85cqw,16px); }
}

/* User-drawn controller plugs and shaded cables. Coordinates follow the NES's em geometry. */
.nes .console-plugs {
  position:absolute;
  left:30.84em;
  top:7.06em;
  width:23.81em;
  height:auto;
  max-width:none;
  z-index:5;
  pointer-events:none;
  user-select:none;
}