.device { position: relative; width: min(1140px, 100%); padding: 31px 30px 25px; border-radius: 31px; background: linear-gradient(145deg, #f4f0e6, #e5e0d3); border: 1px solid #fcfaf4; box-shadow: inset 0 2px 2px #fff, inset 0 -5px 0 #c6c1b5, 0 7px 0 #bcb8ad, 0 26px 40px -18px #554d424d, 0 2px 4px #554d4226; }
.device-heading { display: flex; align-items: center; justify-content: space-between; padding: 0 5px 24px; }
.brand { color: var(--red); font-size: 19px; font-weight: 800; letter-spacing: 3.4px; display: flex; align-items: center; gap: 9px; }
.brand-mark { display: inline-grid; place-items: center; font-size: 28px; font-style: italic; line-height: 28px; width: 32px; border-top: 2px solid; border-bottom: 2px solid; }
.model { font-family: Consolas, monospace; color: #8a8b80; font-size: 12px; letter-spacing: 2px; }
.model span { margin: 0 10px; color: #b7b8ae; }
.game-layout { display: grid; grid-template-columns: 85px minmax(0,1fr) 85px; align-items: stretch; gap: 21px; }
.screen-bezel { background: #303b38; border-radius: 14px; padding: 14px 15px 10px; box-shadow: 0 2px 0 #fff9, inset 0 2px 4px #101a1780; min-width: 0; }
.screen-topline, .screen-bottomline { display: flex; justify-content: space-between; align-items: center; color: #d1d4c4; }
.screen-topline { padding: 0 3px 11px; font-size: 12px; letter-spacing: 2px; font-weight: 700; }
.screen-caption { font-size: 7px; letter-spacing: 1.5px; font-weight: 400; color: #9baba1; }
.screen-bottomline { padding: 9px 3px 0; font-size: 6px; letter-spacing: 1.5px; color: #a0afa2; }
.screen { position: relative; background: var(--lcd); border-radius: 5px; overflow: hidden; border: 2px solid #202c25; box-shadow: inset 0 0 15px #34433335; color: var(--lcd-ink); }
#game-scene { display: block; width: 100%; height: auto; }
.control-bank { display: flex; flex-direction: column; justify-content: center; gap: 41px; padding-top: 27px; }
.control-unit { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.direction { display: grid; place-items: center; width: 69px; height: 69px; border-radius: 50%; border: 5px solid #d8d3c7; color: #f2c7ae; background: linear-gradient(145deg, #c95242, #a93b31); box-shadow: 0 3px 0 #aaa597, inset 0 2px 2px #e7856c, inset 0 -4px 2px #872e2b; touch-action: none; }
.direction svg { width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.direction.selected { outline: 1px solid #ae6a5670; outline-offset: 4px; }
.direction.pressed, .direction:active { transform: translateY(2px); background: #a63b30; box-shadow: 0 1px 0 #aaa597, inset 0 2px 5px #702d2b; }
.key-label { color: #8b8d81; font: 11px Consolas, monospace; }
.device-footer { display: flex; align-items: center; gap: 30px; margin: 23px 110px 0; }
.record { display: flex; align-items: center; gap: 12px; flex: 1; }
.record > span { font-size: 7px; letter-spacing: 1.5px; line-height: 1.5; max-width: 90px; color: #767d70; }
.record strong { font: 24px Consolas, monospace; font-weight: 400; color: #515c4a; letter-spacing: 2px; }
.utility-controls { display: flex; gap: 9px; }
.utility-controls button { border: 1px solid #c8c5b9; border-bottom: 3px solid #c1beb1; border-radius: 5px; background: #eeeae0; color: #687062; padding: 9px 11px; font-size: 8px; letter-spacing: 1px; min-height: 34px; touch-action: manipulation; }
.utility-controls button:active { border-bottom-width: 1px; transform: translateY(1px); }
.utility-controls span { margin-left: 7px; color: #9b9c8f; font-size: 7px; }
.speaker { display: flex; gap: 4px; transform: skew(-12deg); margin-left: 10px; }
.speaker i { width: 3px; height: 25px; background: #c5c2b4; border-radius: 3px; box-shadow: 1px 0 0 #fff9; }
.screw { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #d4d0c3; box-shadow: inset 0 1px 2px #aaa596; bottom: 26px; }
.screw::after { content: ''; position: absolute; width: 5px; height: 1px; background: #9f9e90; top: 4px; left: 2px; transform: rotate(-35deg); }
.screw-left { left: 34px; } .screw-right { right: 34px; }