/* Compact player chrome; glyphs stay small while touch targets remain usable. */
.runtime-dialog .runtime-toolbar{display:flex;flex-wrap:nowrap;gap:3px;min-height:48px;padding:4px 6px;box-sizing:border-box}
.runtime-dialog .runtime-toolbar>.runtime-title{flex:1;min-width:0;font-size:13px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.runtime-dialog .runtime-toolbar .button{height:40px!important;min-height:40px!important;min-width:40px;width:auto;padding:7px 9px!important;font-size:12px!important;line-height:1.2;gap:5px;flex:0 0 auto;border-radius:8px;box-sizing:border-box}
.runtime-dialog .runtime-toolbar .icon{width:18px!important;height:18px!important;flex:0 0 18px}
.runtime-dialog .runtime-toolbar .runtime-control-label{font-size:12px;line-height:1.2}
.runtime-dialog .runtime-display{flex:0 0 106px;min-width:0}
.runtime-dialog .runtime-display select{width:100%;max-width:106px;min-width:0;height:40px!important;min-height:40px;padding:5px 7px;font-size:13px;line-height:1.2;border-radius:8px;box-sizing:border-box}
@media(max-width:899px){
 .runtime-dialog .runtime-toolbar .runtime-control-label{display:none}
 .runtime-dialog .runtime-toolbar .button{width:40px;flex:0 0 40px;padding:10px!important;gap:0}
 .runtime-dialog .runtime-display{flex:0 0 98px}
}
@media(max-width:620px){
 .runtime-dialog .runtime-toolbar{flex-wrap:wrap;column-gap:3px;row-gap:0;padding:4px 6px}
 .runtime-dialog .runtime-toolbar>.runtime-title{order:-1;flex:1 0 100%;font-size:12px;line-height:20px;padding:0 3px}
 .runtime-dialog .runtime-display{flex:1 1 70px;max-width:none;min-width:60px}
 .runtime-dialog .runtime-display select{max-width:none;font-size:16px}
}
@media(max-height:450px){
 .runtime-dialog .runtime-toolbar{flex-wrap:nowrap;min-height:48px}
 .runtime-dialog .runtime-toolbar>.runtime-title{display:none}
 .runtime-dialog .runtime-toolbar .runtime-control-label{display:none}
 .runtime-dialog .runtime-toolbar .button{width:40px;flex:0 0 40px;padding:10px!important;gap:0}
 .runtime-dialog .runtime-display{flex:1 1 70px;min-width:0;max-width:106px}
 .runtime-dialog .runtime-display select{font-size:13px}
}
.runtime-controls{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden;color:var(--ink);font-family:system-ui,sans-serif}
.runtime-controls[hidden],.runtime-controls-bar[hidden],.runtime-controls-note[hidden]{display:none}
.runtime-controls-stage{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.runtime-controls-bar{position:absolute;top:6px;right:6px;z-index:5;display:flex;align-items:center;gap:2px;padding:3px;background:var(--paper);border:1px solid var(--line);border-radius:9px;pointer-events:auto;max-width:calc(100% - 12px);box-shadow:0 2px 10px #0002}
.runtime-controls-bar .button{min-height:32px!important;padding:5px 8px!important;font-size:12px!important;line-height:1.2;border-radius:6px;gap:3px;white-space:nowrap}
.runtime-controls-bar .runtime-edit-mappings{min-width:32px;width:32px;padding:6px!important}.runtime-edit-mappings .icon{width:18px;height:18px}.runtime-edit-mappings[hidden]{display:none!important}
.runtime-controls-bar [aria-pressed=true]{background:var(--cobalt);color:#fff;border-color:var(--cobalt)}
.runtime-controls-note{position:absolute;bottom:4px;right:6px;left:6px;z-index:6;text-align:center;font-size:12px;line-height:1.35;background:var(--paper);color:var(--muted);border-radius:5px;padding:3px 6px;pointer-events:none;max-width:fit-content;margin:auto}
.runtime-touch-control{position:absolute;z-index:1;pointer-events:none}
.runtime-touch-button{position:absolute;left:0;top:0;border:2px solid #ffffffb3;border-radius:50%;background:#1b233dd9;color:#fff;font:600 12px system-ui,sans-serif;opacity:var(--control-opacity,.75);padding:4px;touch-action:none;user-select:none;-webkit-user-select:none;pointer-events:auto;box-shadow:0 2px 8px #0004;overflow:hidden;overflow-wrap:anywhere;cursor:pointer;line-height:1.2}
.runtime-touch-button.held,.runtime-joystick-pad.held{background:#546bf0;opacity:1;border-color:#fff}
.runtime-controls-stage.editing .runtime-touch-button,.runtime-controls-stage.editing .runtime-joystick-pad{cursor:move;border-style:dashed}
.runtime-touch-resize,.runtime-keyboard-resize{position:absolute;bottom:0;right:0;z-index:2;width:32px;height:32px;min-height:0;padding:0;border:1px solid #ffffffb3;border-radius:9px;background:#24345e;color:#fff;font:600 15px system-ui,sans-serif;display:grid;place-items:center;pointer-events:auto;touch-action:none;user-select:none;cursor:nwse-resize;box-shadow:0 1px 5px #0005}
.runtime-joystick-pad{position:absolute;left:0;top:0;padding:0;border:2px solid #ffffffb3;border-radius:50%;background:radial-gradient(circle,#283654cc 0 32%,#172135df 33%);opacity:var(--control-opacity,.75);pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;box-shadow:inset 0 0 0 8px #ffffff0b,0 2px 8px #0004;overflow:hidden}
.runtime-joystick-pad:before,.runtime-joystick-pad:after{content:'';position:absolute;background:#ffffff20;pointer-events:none}
.runtime-joystick-pad:before{width:1px;height:70%;top:15%;left:50%}.runtime-joystick-pad:after{height:1px;width:70%;left:15%;top:50%}
.runtime-joystick-thumb{position:absolute;left:50%;top:50%;width:32%;height:32%;border-radius:50%;transform:translate(-50%,-50%);background:linear-gradient(145deg,#829cff,#3b54b8);border:1px solid #d8e3ff;box-shadow:0 2px 7px #0005;pointer-events:none;z-index:1}
.runtime-joystick-label{position:absolute;top:7%;left:10%;right:10%;color:white;font-size:12px;line-height:1.2;text-align:center;overflow-wrap:anywhere;pointer-events:none}
.runtime-controls-options{position:absolute;top:50px;right:6px;z-index:4;width:260px;max-width:calc(100% - 12px);max-height:calc(100% - 62px);overflow:auto;overscroll-behavior:contain;pointer-events:auto;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px;font-size:12px;box-shadow:0 4px 18px #0004}
.runtime-controls-options p{margin:0 0 8px;line-height:1.45}
.runtime-controls-options label,.runtime-keyboard-settings label{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:7px 0;min-width:0}
.runtime-controls-options input,.runtime-controls-options select{max-width:142px;min-width:0;min-height:32px;font-size:16px;padding:5px 6px;border-radius:6px}
.runtime-controls-options input[type=range],.runtime-keyboard-settings input[type=range]{accent-color:var(--cobalt);max-width:135px;min-width:0}
.runtime-controls-options .button{min-height:32px!important;font-size:12px!important;padding:5px 8px!important;line-height:1.3;margin:2px 3px 2px 0;white-space:normal}
.runtime-control-mapping{padding:8px 0;border-top:1px solid var(--line);min-width:0}
.runtime-control-mapping-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;overflow-wrap:anywhere}
.runtime-control-mapping-heading small{font-size:12px;color:var(--muted)}
.runtime-virtual-keyboard{position:absolute;z-index:2;max-height:100%;overflow:auto;overscroll-behavior:contain;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:5px;pointer-events:auto;box-shadow:0 4px 16px #0004;min-width:0}
.runtime-keyboard-toolbar{display:flex;align-items:center;justify-content:space-between;gap:4px;min-width:0}
.runtime-keyboard-toolbar .button{min-height:30px!important;padding:4px 6px!important;font-size:12px!important;line-height:1.2;white-space:nowrap}
.runtime-keyboard-drag{flex:1;min-width:0;min-height:30px;border:0;border-radius:6px;padding:4px 6px;background:transparent;color:var(--muted);font-size:12px;line-height:1.2;cursor:move;text-align:left;touch-action:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.runtime-keyboard-drag:before{content:'⠿';margin-right:5px;font-size:16px}
.runtime-keyboard-settings{font-size:12px;margin:2px 0;border-bottom:1px solid var(--line);padding-bottom:3px}
.runtime-keyboard-settings summary{cursor:pointer;min-height:24px;display:flex;align-items:center;color:var(--muted)}
.runtime-keyboard-settings summary:after{content:' ▾';margin-left:4px}
.runtime-keyboard-settings input{max-width:60%;width:125px;min-width:0}
.runtime-key-row{display:flex;justify-content:center;gap:2px;margin:3px 0;min-width:0}
.runtime-key{flex:1;min-width:0;max-width:70px;min-height:40px;padding:4px 0;border:1px solid var(--line);border-radius:5px;background:var(--white);color:var(--ink);font:500 13px system-ui,sans-serif;line-height:1.2;touch-action:manipulation;overflow:hidden}
.runtime-key.space{flex:4;max-width:none}.runtime-key[aria-pressed=true]{background:var(--cobalt);color:#fff}
.runtime-keyboard-resize{position:sticky;bottom:0;float:right;margin-top:2px;height:28px;width:32px;cursor:ew-resize}
.creator-controls-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.creator-control-row{display:grid;grid-template-columns:1fr 1fr 70px;gap:8px;align-items:end;border-bottom:1px solid var(--line);padding:10px 0}
.creator-control-row input,.creator-control-row select{min-width:0;width:100%}.creator-control-row .field{min-width:0}
.creator-control-preview{position:relative;width:100%;height:180px;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:#10182c}
.creator-control-preview span{position:absolute;display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffffb3;border-radius:50%;background:#26304b;color:white;font-size:12px;transform:translate(-50%,-50%)}
@media(max-width:420px){.creator-controls-grid{grid-template-columns:1fr}.creator-control-row{grid-template-columns:1fr 1fr}.creator-control-row>.button{grid-column:1/-1;justify-self:start}}
@media(max-height:450px){.runtime-controls-bar{top:4px}.runtime-controls-options{top:44px;max-height:calc(100% - 52px)}.runtime-controls-note{bottom:2px}}
@media(max-height:300px){.runtime-controls-note{display:none}}
