/* Bitmap shells, tiny instrument typography and real hardware-like controls. */
.desktop-window.frameless-player{padding:0;background:transparent;box-shadow:none;overflow:visible;min-width:0;min-height:0}
.frameless-player>.window-body{background:transparent;border:0;overflow:auto;height:100%;container-type:inline-size;scrollbar-width:thin}
.frameless-player .hariamp{padding:0;min-height:0;background:transparent;display:flex;flex-direction:column;position:relative;color:var(--amp-ink);font-family:'Courier New',monospace;font-size:10px;--amp-screen:#080b0d}
.amp-console{position:relative;isolation:isolate;width:100%;aspect-ratio:var(--amp-ratio,1.25);flex:none;container-type:inline-size;touch-action:none;cursor:move;filter:drop-shadow(2px 3px 1px #0008)}
.amp-art{position:absolute;inset:0;z-index:-1;pointer-events:none;user-select:none}.amp-art img{width:100%;height:100%;object-fit:fill;image-rendering:pixelated}
.frameless-player .amp-console>.titlebar{position:absolute;min-height:0;padding:0;background:transparent!important;color:var(--amp-ink);border:0;box-shadow:none;gap:4px;z-index:4;touch-action:none}
.frameless-player .titlebar>.pixel-icon,.frameless-player .titlebar h2{display:none}.frameless-player .titlebar .window-controls{gap:2px;margin:0;flex:none}
.frameless-player .titlebar .window-controls button{width:20px;min-width:20px;height:20px;padding:0;border:1px solid var(--amp-dark);border-radius:0;background:var(--amp-metal);box-shadow:inset 1px 1px var(--amp-light),inset -1px -1px #0009;color:#10171c;font:15px/1 monospace}
.frameless-player .titlebar .window-controls button::before,.frameless-player .titlebar .window-controls button::after{display:none}.frameless-player .titlebar .control-min{background:currentColor;width:8px;height:2px;margin-top:6px}.frameless-player .titlebar .control-max{width:9px;height:8px;border:1px solid currentColor;border-top:2px solid currentColor}
.amp-skin-picker{flex:1;min-width:0;position:relative;display:flex;align-items:center;height:20px;padding:0 5px;color:var(--amp-ink);background:var(--amp-dark);border:1px solid var(--amp-metal);box-shadow:inset 1px 1px #000;font:bold 10px/1 'Courier New',monospace;cursor:pointer}
.amp-skin-picker span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.amp-skin-picker select{position:absolute;inset:0;opacity:0;width:100%;height:100%;font-size:14px;cursor:pointer}
.frameless-player .amp-display{position:absolute;display:grid;grid-template-columns:31% minmax(0,1fr);grid-template-rows:1fr 15px 18px;gap:2px 7px;padding:6px;border:1px solid var(--amp-dark);border-radius:0;background:#070c0deb;box-shadow:inset 1px 1px #000;color:var(--amp-ink);overflow:hidden;cursor:move}
.amp-readout{display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0}#amp-clock{font:bold clamp(15px,5cqw,28px)/1 monospace;letter-spacing:-1px}#amp-state{font:8px/1 monospace;white-space:nowrap}
.amp-now{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px;overflow:hidden}.amp-now span{font:9px/1.1 monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.amp-now strong{font:bold 11px/1.15 'Courier New',monospace;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.amp-telemetry{grid-column:1/-1;display:flex;justify-content:space-between;gap:4px;font:8px/1.3 monospace;color:var(--amp-glow);white-space:nowrap}#amp-analyser{grid-column:1/-1;width:100%;height:18px;image-rendering:pixelated;background:repeating-linear-gradient(0deg,#ffffff04 0 1px,transparent 1px 3px)}
.amp-integrated-seek{position:absolute;display:flex;align-items:center;gap:6px;font:9px/1 monospace;z-index:3}.amp-integrated-seek input{flex:1;min-width:0;width:0}.hariamp input[type=range]{appearance:none;padding:0;margin:0;background:transparent;accent-color:var(--amp-glow);cursor:pointer;height:20px;touch-action:none}
.hariamp input[type=range]::-webkit-slider-runnable-track{height:5px;background:#101314;border:1px solid var(--amp-metal);box-shadow:0 1px var(--amp-light)}.hariamp input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:16px;margin-top:-6px;border:1px solid var(--amp-dark);border-radius:0;background:linear-gradient(90deg,var(--amp-light),var(--amp-metal));box-shadow:inset 1px 1px #fff8,inset -1px -1px #0008}.hariamp input[type=range]::-moz-range-track{height:4px;background:#101314;border:1px solid var(--amp-metal)}.hariamp input[type=range]::-moz-range-thumb{width:12px;height:15px;border-radius:0;border:1px solid var(--amp-dark);background:var(--amp-metal)}
.amp-transport{display:contents}.amp-transport button{position:absolute;display:grid;place-items:center;padding:0;min-width:0;min-height:0;border:0;background:transparent;box-shadow:none;color:var(--amp-light);text-shadow:1px 1px #000,-1px -1px #000;font:bold clamp(12px,3.5cqw,20px)/1 monospace;cursor:pointer;z-index:3;touch-action:manipulation}.amp-transport button:hover{background:#ffffff25}.amp-transport button:active{background:#0005;transform:translate(1px,1px)}
.amp-master,.amp-switches{position:absolute;z-index:3;display:flex;align-items:center;gap:4px;cursor:default}.amp-master{flex-wrap:wrap;justify-content:center;font:bold 9px/1 monospace;background:var(--amp-dark);padding:3px;border:1px solid var(--amp-metal)}.amp-master label{display:flex;align-items:center;gap:3px;flex:1;min-width:0}.amp-master input{width:100%;min-width:20px}.amp-switches{justify-content:center}
.hariamp button:not(.amp-transport button):not(.amp-playlist button):not(.window-controls button),.hariamp select,.amp-file-button{font:bold 9px/1.1 'Courier New',monospace;border:1px solid var(--amp-dark);border-radius:0;background:var(--amp-metal);color:#0c1319;box-shadow:inset 1px 1px var(--amp-light),inset -1px -1px #0007;padding:3px 5px;min-height:21px;white-space:nowrap}
.hariamp button[aria-pressed=true],.hariamp .amp-switches button[aria-expanded=true]{color:var(--amp-glow)!important;background:var(--amp-dark)!important;box-shadow:inset 1px 1px #000!important}.hariamp button:disabled,.hariamp input:disabled,.hariamp select:disabled{opacity:.45;cursor:not-allowed}.hariamp button:focus-visible,.hariamp input:focus-visible,.hariamp select:focus-visible,.amp-skin-picker:focus-within{outline:2px dotted var(--amp-glow);outline-offset:2px}
.amp-module{flex:none;position:relative;min-height:0;margin:0 3% 4px;padding:4px;border:2px solid var(--amp-dark);background:linear-gradient(110deg,#fff2,transparent 40%,#0003),var(--amp-metal);box-shadow:inset 1px 1px var(--amp-light),inset -1px -1px #0008,1px 2px #0008;image-rendering:pixelated;touch-action:pan-y}
.amp-module-title{height:23px;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 4px;margin-bottom:3px;background:var(--amp-dark);color:var(--amp-ink);font:9px/1 monospace;letter-spacing:.4px;border-top:1px solid var(--amp-light)}.amp-module-title>div{display:flex;gap:3px}.amp-module-title button,.amp-module-title select{min-height:17px!important;height:17px;padding:1px 4px!important}
.amp-eq{height:146px}.amp-eq-body{display:flex;height:91px;gap:5px}.amp-eq-scale{display:flex;flex-direction:column;justify-content:space-between;font:8px monospace;color:var(--amp-dark);width:23px;padding:15px 0 13px}.amp-eq #amp-bands{display:flex;justify-content:space-around;flex:1;min-width:0;background:repeating-linear-gradient(0deg,transparent 0 17px,#0002 17px 18px);border:1px solid var(--amp-dark);padding:2px}#amp-bands label{display:flex;flex-direction:column;align-items:center;justify-content:space-between;min-width:0;flex:1;font:8px monospace;color:var(--amp-ink);background:var(--amp-dark)}#amp-bands output{height:10px;font:7px monospace;opacity:.8}#amp-bands input[type=range]{writing-mode:vertical-lr;direction:rtl;width:20px;height:60px}#amp-bands input::-webkit-slider-runnable-track{width:4px;height:100%;border:1px solid #000}#amp-bands input::-webkit-slider-thumb{width:17px;height:8px;margin-left:-7px;margin-top:0;background:var(--amp-metal)}#amp-bands input::-moz-range-track{width:4px;height:100%}#amp-bands input::-moz-range-thumb{width:17px;height:8px}
.amp-tools{display:flex;flex-direction:column;justify-content:space-between;width:68px;flex:none}.amp-tools label{display:flex;align-items:center;gap:2px;font:8px monospace;color:var(--amp-dark)}.amp-tools select{width:44px;padding:2px!important}.amp-tools input{width:43px}#amp-eq-note{font:8px/1.2 monospace;margin:5px 2px 0;color:var(--amp-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.amp-drawer{height:186px;display:flex;flex-direction:column}.amp-list-toolbar{display:flex;gap:3px;margin-bottom:3px}.amp-list-toolbar select{width:125px}.amp-list-toolbar input{min-width:0;flex:1;width:0;height:21px;padding:2px 5px;border:1px solid var(--amp-dark);border-radius:0;background:var(--amp-screen);color:var(--amp-ink);font:10px monospace}
.frameless-player .amp-playlist{flex:1;min-height:0;margin:0;padding:3px;list-style:none;overflow:auto;overscroll-behavior:contain;background:var(--amp-screen);border:1px solid var(--amp-dark);scrollbar-width:thin;scrollbar-color:var(--amp-metal) var(--amp-dark);touch-action:pan-y}.amp-playlist li+li{margin:0}.amp-playlist button{display:flex;gap:6px;min-height:23px;padding:4px 3px;border:0;border-radius:0;background:transparent;color:var(--amp-ink);font:10px/1.3 'Courier New',monospace;width:100%;text-align:left;cursor:pointer}.amp-track-number{opacity:.65;flex:none}.amp-track-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.amp-playlist button[aria-current=true]{background:var(--amp-dark);color:var(--amp-glow)}.amp-playlist button:hover{background:#ffffff20}.amp-empty{font:10px monospace;padding:8px}.amp-list-footer{display:flex;gap:3px;margin-top:4px;align-items:center}.amp-file-button{position:relative;cursor:pointer;overflow:hidden}.amp-file-button input{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer}.amp-error{margin:2px 3%;padding:8px;background:var(--amp-screen);color:var(--amp-ink);font:11px/1.5 monospace;border:1px solid var(--amp-metal)}.amp-error a{color:inherit}
#amp-audio-host{position:fixed;left:-10000px;top:0;width:320px;height:200px;overflow:hidden;pointer-events:none}#amp-audio-host iframe{display:block;width:320px;height:200px;border:0}

.hariamp[data-skin=lunar] .amp-module{border:4px ridge #d49336;background:linear-gradient(90deg,#6f0808,#a9210b,#6f0808)}.hariamp[data-skin=lunar] .amp-module-title{border:1px solid #e9b348;background:#560b07}.hariamp[data-skin=lunar] .amp-eq-scale,.hariamp[data-skin=lunar] .amp-tools label,.hariamp[data-skin=lunar] #amp-eq-note{color:#ffde92}
.hariamp[data-skin=arcade] .amp-module{border:5px ridge #4b7150;background:repeating-linear-gradient(0deg,#789b64 0 7px,#6b8d56 7px 9px)}.hariamp[data-skin=arcade] .amp-module-title{background:#2f4530;color:#eafbb5}.hariamp[data-skin=arcade] .amp-drawer{border-bottom:7px ridge #805938}.hariamp[data-skin=vinyl] .amp-module{border:4px ridge #94703d;background:repeating-linear-gradient(0deg,#a68961 0 3px,#9e8055 3px 5px)}
.hariamp[data-skin=alien] .amp-module{border-radius:14px 4px 14px 4px;border:3px ridge #6f873f;background:#526343}.hariamp[data-skin=controller] .amp-module{border-radius:30px 8px 30px 8px;padding-left:14px;padding-right:14px;border:3px ridge #c3d3e4}.hariamp[data-skin=spaceship] .amp-module{border:5px ridge #7c96a1;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px)}.hariamp[data-skin=cassette] .amp-module{border:4px ridge #b1a575;background:repeating-linear-gradient(0deg,#938967 0 2px,#9e9575 2px 3px)}.hariamp[data-skin=boombox] .amp-module{border:3px ridge #494844;background:#3b3732}.hariamp[data-skin=boombox] .amp-eq-scale,.hariamp[data-skin=boombox] .amp-tools label,.hariamp[data-skin=boombox] #amp-eq-note{color:#dcb675}.hariamp[data-skin=atomic] .amp-module{border:4px ridge #cad8df;border-radius:5px 18px 5px 18px;background:linear-gradient(90deg,#e6e9e9,#93a8b8 30%,#e9eeee 65%,#657f95)}
@media(prefers-reduced-motion:no-preference){.hariamp.is-booting .amp-display{animation:amp-boot .65s steps(5) both}.hariamp.is-playing .amp-now strong{animation:amp-title-scroll 14s linear 3s infinite alternate}.hariamp.is-playing[data-skin=cassette] .amp-art,.hariamp.is-playing[data-skin=vinyl] .amp-art{animation:amp-warm 3s steps(6) infinite alternate}}
@keyframes amp-boot{0%{opacity:0;transform:scaleY(.03)}50%{opacity:.6}100%{opacity:1;transform:scaleY(1)}}@keyframes amp-warm{to{filter:brightness(1.07)}}@keyframes amp-title-scroll{0%,30%{text-indent:0}100%{text-indent:-50px}}
@media(max-width:500px){.amp-tools{width:61px}.amp-module{margin-left:1%;margin-right:1%}.amp-list-toolbar select{width:115px}.amp-display{padding:3px!important}.amp-now strong{font-size:9px}.amp-now span{font-size:8px}.amp-telemetry{font-size:7px}.amp-skin-picker{font-size:9px}.amp-master{font-size:8px}.amp-switches{gap:2px}.amp-switches button{padding:2px 3px!important}}
/* Final registration follows the bitmap's individual physical recesses. */
.amp-master{border:0;background:transparent;padding:0;flex-wrap:nowrap;flex-direction:column;gap:0}.amp-master label{width:100%;color:var(--amp-ink);text-shadow:1px 1px #000}.amp-master #amp-mute{min-height:14px;padding:1px 4px;font-size:7px;align-self:flex-end}.amp-master input{height:13px!important}.amp-master input::-webkit-slider-thumb{height:11px;margin-top:-4px}
.hariamp[data-skin=cassette] .amp-display{grid-template-rows:1fr;grid-template-columns:26% 1fr;padding:2px;gap:4px}.hariamp[data-skin=cassette] .amp-display .amp-telemetry,.hariamp[data-skin=cassette] #amp-analyser{display:none}.hariamp[data-skin=cassette] #amp-clock{font-size:16px}.hariamp[data-skin=cassette] #amp-state{font-size:7px}.hariamp[data-skin=cassette] .amp-now{gap:2px}.hariamp[data-skin=cassette] .amp-now strong{font-size:10px}.hariamp[data-skin=cassette] .amp-now span{font-size:8px}.hariamp[data-skin=vinyl] .amp-display{grid-template-columns:35% 1fr;grid-template-rows:1fr 11px 10px;gap:2px;padding:3px}.hariamp[data-skin=vinyl] #amp-clock{font-size:15px}.hariamp[data-skin=vinyl] #amp-state{font-size:6px}.hariamp[data-skin=vinyl] .amp-now strong{font-size:9px}.hariamp[data-skin=vinyl] .amp-now span{font-size:7px}.hariamp[data-skin=vinyl] .amp-telemetry{font-size:6px;gap:2px}.hariamp[data-skin=vinyl] #amp-analyser{height:10px}
.amp-rotating-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.amp-disc{animation:amp-disc-spin 6s linear infinite;animation-play-state:paused}.hariamp.is-visible.is-playing .amp-disc{animation-play-state:running}@keyframes amp-disc-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.hariamp *{animation:none!important}}
.amp-readout #amp-clock{font:bold clamp(15px,5cqw,28px)/1 monospace;letter-spacing:-1px}.amp-readout #amp-state{font:8px/1 monospace;letter-spacing:0}.amp-now span{letter-spacing:0}.amp-transport button{border-radius:2px}.hariamp[data-skin=orbit] .amp-console{margin-bottom:-7cqw}

/* Explicit art and UI planes: never place the bitmap behind the console. */
.amp-console>.amp-art{z-index:0;display:block}
.amp-console>.amp-art>img{display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none}
.frameless-player .amp-display{z-index:1}
/* Sculpted instruments have their own face, cockpit and grip controls. */
.hariamp[data-sculpted=true] .amp-display{background:transparent;border:0;box-shadow:none;padding:4px;grid-template-rows:1fr 10px 12px;gap:2px 4px}
.hariamp[data-sculpted=true] #amp-clock{font-size:clamp(14px,4cqw,23px)}
.hariamp[data-sculpted=true] #amp-state{font-size:7px}
.hariamp[data-sculpted=true] .amp-now span{font-size:8px}
.hariamp[data-sculpted=true] .amp-now strong{font-size:10px}
.hariamp[data-sculpted=true] .amp-telemetry{font-size:6px}
.hariamp[data-sculpted=true] #amp-analyser{height:12px}
.hariamp[data-sculpted=true] .amp-transport button{border-radius:50%;color:var(--amp-ink);font-size:clamp(14px,4cqw,24px);text-shadow:1px 2px #000;transition:filter .12s}
.hariamp[data-sculpted=true] .amp-transport button:hover{background:#ffffff18;filter:drop-shadow(0 0 3px var(--amp-glow))}
.hariamp[data-sculpted=true] .amp-module{margin:0 8% 5px;border:3px ridge var(--amp-light);border-radius:24px 6px 24px 6px;padding:9px 12px;background:var(--amp-metal)}
.hariamp[data-sculpted=true] .amp-eq{height:146px;padding-top:4px;padding-bottom:4px}
.hariamp[data-sculpted=true] .amp-drawer{height:186px}
.hariamp[data-sculpted=true] .amp-module-title{border-radius:12px 2px 12px 2px}
.hariamp[data-skin=xeno] #amp-play{border-radius:75% 20% 70% 25%;transform:rotate(15deg)}
.hariamp[data-skin=xeno] #amp-pause{border-radius:20% 75% 25% 70%;transform:rotate(-15deg)}
.hariamp[data-skin=xeno] .amp-module{border-radius:35px 35px 20px 20px}
.hariamp[data-skin=starfighter] .amp-module{border-radius:0;clip-path:polygon(15px 0,calc(100% - 15px) 0,100% 15px,100% calc(100% - 15px),calc(100% - 15px) 100%,15px 100%,0 calc(100% - 15px),0 15px)}
.hariamp[data-skin=joypad] .amp-module{border-radius:30px 30px 45px 45px}
@container(max-width:360px){
 .hariamp[data-sculpted=true] .amp-module{margin-left:1%;margin-right:1%;padding-left:5px;padding-right:5px}
 .hariamp[data-sculpted=true] .amp-now strong{font-size:8px}
 .hariamp[data-sculpted=true] .amp-now span{font-size:7px}
 .hariamp[data-sculpted=true] .amp-display{grid-template-rows:1fr 9px 8px;padding:2px}
 .hariamp[data-sculpted=true] #amp-analyser{height:8px}
}
.hariamp[data-sculpted=true] .amp-switches{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.hariamp[data-sculpted=true] .amp-switches button{min-height:14px;padding:1px 2px;font-size:7px}
.hariamp[data-sculpted=true] .amp-master{font-size:7px}
.hariamp[data-sculpted=true] .amp-master input{min-width:10px}
.hariamp[data-sculpted=true] .amp-master #amp-mute{font-size:6px;min-height:11px}
.hariamp[data-sculpted=true] .amp-skin-picker{font-size:8px;padding:0 2px;height:16px}
.frameless-player .hariamp[data-sculpted=true] .window-controls{gap:1px}
.frameless-player .hariamp[data-sculpted=true] .window-controls button{width:14px;min-width:14px;height:16px;font-size:12px}
.hariamp[data-skin=starfighter] .amp-transport button{color:transparent;text-shadow:none;font-size:0}
.hariamp[data-skin=starfighter] .amp-display{clip-path:polygon(6% 0,94% 0,100% 17%,100% 90%,94% 100%,6% 100%,0 90%,0 17%)}
.hariamp[data-sculpted=true] .amp-integrated-seek{font-size:7px;gap:3px}
.hariamp[data-sculpted=true] .amp-integrated-seek input{height:12px;background:#080b0d;border-radius:8px}
/* Keep all telemetry inside the shallower physical screens. */
.hariamp[data-sculpted=true] .amp-display{padding:2px;grid-template-rows:1fr 7px 5px;gap:1px 4px}
.hariamp[data-sculpted=true] .amp-readout,.hariamp[data-sculpted=true] .amp-now{gap:2px}
.hariamp[data-sculpted=true] #amp-clock{font-size:clamp(14px,3cqw,18px)}
.hariamp[data-sculpted=true] #amp-state{font-size:6px}
.hariamp[data-sculpted=true] #amp-analyser{height:5px}
.hariamp[data-sculpted=true] .amp-telemetry{line-height:1;font-size:6px}
@container(max-width:360px){
 .hariamp[data-sculpted=true] .amp-display{grid-template-rows:1fr}
 .hariamp[data-sculpted=true] .amp-telemetry,.hariamp[data-sculpted=true] #amp-analyser{display:none}
}

/* Let the whole instrument and its drawers extend beyond their layout box. */
.desktop-window.frameless-player,.desktop-window.frameless-player.is-dragging{overflow:visible;box-shadow:none}
.frameless-player>.window-body{overflow:visible;height:auto;flex:none}
.frameless-player .hariamp,.frameless-player .amp-console{overflow:visible}
.hariamp[data-skin=medusa] .amp-switches{grid-template-columns:repeat(4,1fr);gap:3px}
.hariamp[data-skin=medusa] .amp-switches button{border-radius:50%;background:transparent;border:0;box-shadow:none;color:#0b1739;text-shadow:0 1px #fff9}
.hariamp[data-skin=medusa] .amp-module{border:3px ridge #ffc570;border-radius:38px 38px 25px 25px;background:linear-gradient(110deg,#f49940,#8a7dcc,#de9959)}
.hariamp[data-skin=riff] .amp-switches{grid-template-columns:repeat(4,1fr)}
.hariamp[data-skin=riff] .amp-module{border:4px ridge #e7734a;border-radius:9px 26px 9px 26px;background:linear-gradient(135deg,#b42c29,#f87941,#ae263d)}
.hariamp[data-skin=riff] .amp-eq-scale,.hariamp[data-skin=riff] .amp-tools label,.hariamp[data-skin=riff] #amp-eq-note{color:#fff0c4}
.hariamp[data-skin=riff] .amp-transport button{border-radius:4px;color:#fff8d9}
@container(max-width:460px){
 .hariamp[data-skin=riff] .amp-display{grid-template-rows:1fr}
 .hariamp[data-skin=riff] .amp-telemetry,.hariamp[data-skin=riff] #amp-analyser{display:none}
 .hariamp[data-skin=riff] #amp-clock{font-size:12px}
 .hariamp[data-skin=riff] .amp-now strong{font-size:8px}
 .hariamp[data-skin=riff] .amp-now span{font-size:7px}
 .hariamp[data-skin=riff] .amp-transport button{font-size:12px}
}
