:root{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#ecf3ff;background:#0c1220}*{box-sizing:border-box}body{margin:0}header{background:#151e32;border-bottom:1px solid #34425c;padding:20px max(16px,calc((100vw - 1100px)/2));display:flex;justify-content:space-between;gap:16px;align-items:center}h1{font-size:clamp(24px,4vw,34px);margin:0}h2{font-size:19px;margin:0 0 13px}p{margin:5px 0}header p,.hint,footer{color:#aebcd2;font-size:14px}.badge{border:1px solid #56647d;border-radius:20px;padding:8px 12px;white-space:nowrap;font-size:13px}.badge.good{background:#143c30;border-color:#287d60}.badge.warn{background:#493115;border-color:#d78e2d}main{max-width:1120px;margin:20px auto;padding:0 15px}.panel{background:#182238;border:1px solid #34415c;border-radius:16px;padding:18px;margin-bottom:17px}.actions{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:12px 0}button{border:0;border-radius:9px;padding:11px 14px;background:#5f8ff5;color:#081120;font-weight:700;cursor:pointer;font:inherit;font-weight:700;min-height:43px}button:disabled{opacity:.45;cursor:not-allowed}button.muted{background:#344562;color:#ecf3ff}button.danger{background:#d84f69;color:white}.status{padding:10px;background:#0f192b;border-radius:8px;margin:10px 0}.pads{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.pad{background:#233452;border:2px solid #4d6387;border-radius:13px;padding:12px;min-width:0}.pad.playing{border-color:#49e0b5;box-shadow:0 0 0 2px #49e0b533}.pad.learning{border-color:#f9c768;box-shadow:0 0 0 2px #f9c76866}.pad-num{color:#aec1e4;font-size:12px;font-weight:800}.pad-play{background:#304e7f;border:1px solid #5e86bc;color:white;display:block;width:100%;min-height:68px;margin:7px 0;word-break:break-word;font-size:clamp(12px,1.9vw,17px)}.pad-play small{display:block;color:#c5d4ea;font-size:11px;margin-top:4px}.pad .subbuttons{display:flex;gap:5px;flex-wrap:wrap}.pad .subbuttons button{padding:7px;flex:1;min-height:34px;font-size:12px}.pad .subbuttons .learn{background:#e4b64d}.pad .subbuttons .choose{background:#e1e9fa}.pad .mapping{font-size:11px;color:#c0cfe3;margin-top:7px;overflow-wrap:anywhere}.pad input.name{width:100%;border-radius:6px;padding:7px;background:#111c2f;border:1px solid #627697;color:white}.settings{display:flex;flex-wrap:wrap;gap:16px}.settings label{display:flex;flex-direction:column;gap:7px;min-width:210px}select{background:#263a5c;color:white;border:1px solid #526688;border-radius:7px;padding:10px;max-width:100%}.heading{display:flex;justify-content:space-between;gap:12px}.switch{font-size:13px;white-space:nowrap}.log{font-family:ui-monospace,monospace;background:#0a1020;min-height:55px;max-height:180px;overflow:auto;padding:12px;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:8px;font-size:12px}footer{text-align:center;padding:20px}@media(max-width:680px){header{flex-direction:column;align-items:start}.pads{gap:7px}.pad{padding:6px;border-radius:10px}.pad-play{min-height:66px;padding:6px 2px}.pad .subbuttons{display:block}.pad .subbuttons button{width:100%;margin-bottom:5px;font-size:11px;padding:5px 2px}.pad .mapping{font-size:10px}.panel{padding:12px}.heading{display:block}}

/* EMP16 physical layout is an approximation based on the manufacturer's panel. */
.emp-shell{background:linear-gradient(145deg,#242937,#101723);border:3px solid #414959;border-radius:14px;padding:12px;margin:12px 0;overflow-x:auto;box-shadow:0 8px 18px #0008}.emp-top{display:flex;align-items:center;gap:15px;padding:4px 3px 12px;font-size:17px}.emp-top small,.emp-top span{font-size:9px;color:#a9b7cc}.emp-top span{margin-left:auto}.emp-grid{display:grid;grid-template-columns:49% 51%;gap:8px;min-width:310px}.emp-left{padding-right:8px}.emp-right{padding-right:6px}.knob-row,.faders,.transport,.bank-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.hwcontrol{background:transparent;color:#dfe7f5;padding:3px;min-width:0;min-height:36px;border:1px solid transparent;display:flex;align-items:center;flex-direction:column;gap:3px;font-size:10px}.hwcontrol small{font-size:9px;line-height:1.2}.hwcontrol span{font-size:10px;color:#a9c7ed}.hwcontrol.chosen{border-color:#f4bf61;background:#223149}.hwcontrol.seen{color:#9aefd2}.hwcontrol.awaiting{box-shadow:inset 0 0 0 2px #ecad46}.hwknob{width:31px;height:31px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#65758b,#1b2432 68%);border:2px solid #8091a4;position:relative;flex:none}.hwknob:after{content:'';position:absolute;height:12px;width:3px;background:#f2c76f;left:12px;top:2px;transform-origin:1px 14px;transform:rotate(var(--angle,0deg))}.middle-row{display:flex;align-items:center;justify-content:space-around;gap:5px;margin:10px 0}.select-knob{text-align:center;font-size:9px}.oled{background:#071b30;border:2px solid #465b72;box-shadow:inset 0 0 8px #128acb55;border-radius:3px;color:#8aceff;font:10px ui-monospace,monospace;padding:8px 3px;text-align:center;flex:1}.oled span{font-size:8px;color:#86a4bd}.mini-grid{display:grid;gap:3px}.mini{font-size:8px;border:1px solid #56667c;padding:4px 2px}.nav-row{display:flex;gap:7px;align-items:center;margin:10px 0}.arrow-pad{display:grid;grid-template-columns:repeat(2,1fr);gap:3px}.arrow-pad span{font-size:12px;border:1px solid #60708a;text-align:center}.function-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;flex:1}.function-buttons .hwbutton,.transport .hwbutton{height:15px}.hwbutton{background:#4e5d70;border:1px solid #9caec0;border-radius:2px;width:90%;height:19px;flex:none}.bottom-controls{display:flex;gap:6px}.transport{grid-template-columns:1fr;width:21%;gap:2px}.transport .hwcontrol{min-height:31px}.faders{flex:1}.hwslider{height:85px;width:10px;background:#090e17;border-radius:5px;position:relative;border:1px solid #43506b}.hwslider:after{content:'';position:absolute;width:26px;height:12px;background:#73869e;border:1px solid #b2c0cb;border-radius:2px;left:-9px;bottom:calc(var(--level,50%) - 6px)}.banktag{border:1px solid #66748b;border-radius:3px;text-align:center;font-size:10px;padding:4px}.mirror-pads{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-top:7px}.mirror-pad{min-height:clamp(38px,9vw,80px);border:2px solid #4772a5;border-radius:7px;background:linear-gradient(130deg,#262f43,#121a2b);color:#b7c7e2;font-size:10px;padding:3px}.mirror-pad.sounding{border-color:#48efae;box-shadow:0 0 8px #48efae}.hardware-editor{background:#111b2c;border:1px solid #485b7b;border-radius:10px;padding:12px}.hardware-editor h3{margin:0 0 9px}.hw-status{background:#112033;border-radius:8px;padding:10px}.hw-status.live{color:#9eefd0}.effect-readouts{padding:9px;color:#b5c8e0;font-size:12px}.hardware-editor label{display:grid;gap:5px;font-size:13px}.hardware-editor .actions{align-items:end}@media(max-width:550px){.emp-shell{padding:6px}.emp-grid{gap:3px}.emp-left{padding-right:2px}.emp-top{gap:5px;font-size:13px}.hwknob{width:21px;height:21px}.hwknob:after{left:7px;height:8px;transform-origin:1px 9px}.hwcontrol small{font-size:7px}.hwcontrol span{font-size:8px}.hwcontrol{padding:1px}.mirror-pad{font-size:8px}.oled{font-size:8px}.oled span{font-size:6px}.hwslider{height:64px}.function-buttons{grid-template-columns:repeat(2,1fr)}}