.touch-settings-button{display:none}#touchLayoutEditor{position:fixed;inset:0;margin:0;padding:0;width:100vw;max-width:none;height:100dvh;max-height:none;background:#10202beF;color:#eef2e7;border:0;overflow:hidden;z-index:20000}#touchLayoutEditor::backdrop{background:#071015}.touch-editor-toolbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding:8px;background:#172d3d}.touch-editor-toolbar label{display:flex;align-items:center;gap:6px;font-size:13px}.touch-editor-toolbar input{width:120px}.touch-editor-toolbar button{min-height:36px;padding:4px 12px}.touch-editor-toolbar output{min-width:40px}#touchLayoutEditor>p{text-align:center;font-size:12px;margin:5px}.touch-editor-preview{position:absolute;inset:0;pointer-events:none}.touch-editor-preview button{pointer-events:auto;position:absolute;transform:translate(-50%,-50%);touch-action:none;user-select:none;min-width:0;min-height:0;padding:0;background:#284755;border:2px solid #eef2e7;border-radius:14px;cursor:grab;white-space:pre-line;font-size:16px}.touch-editor-preview button:active{cursor:grabbing;background:#986322}
@media(pointer:coarse){.touch-settings-button{display:inline-block}.mobile-playing #arena>.touch.custom-touch{position:fixed!important;inset:0!important;bottom:0!important;left:0!important;right:0!important;width:100%!important;max-width:none!important;padding:0!important;pointer-events:none;transform:none;contain:none}.custom-touch>div{display:contents!important}.mobile-playing #arena>.touch.custom-touch button{position:absolute!important;width:var(--touch-size)!important;min-width:var(--touch-size)!important;height:var(--touch-size)!important;min-height:var(--touch-size)!important;transform:translate(-50%,-50%)!important;pointer-events:auto;font-size:25px}.custom-touch>#touch2[hidden]{display:none!important}.custom-touch button small{font-size:8px}.mobile-playing .toolbar #touchSettingsMatch{font-size:10px;padding:4px}body:has(#online:not([hidden])) #touchSettingsMatch{display:none}}
/* Opacity changes only the paint, never the touch target or hit detection. */
@media(pointer:coarse){
 .mobile-playing #arena .touch button{opacity:var(--touch-opacity,.7)!important}
 .mobile-playing #arena .touch button.pressed{opacity:min(1,calc(var(--touch-opacity,.7) + .2))!important}
}
#touchLayoutEditor{background:linear-gradient(135deg,#182318f5,#07130df5);color:#f4edce}
#touchLayoutEditor .touch-editor-toolbar{background:#242b18;border-bottom:1px solid #a4a66c;gap:8px 14px;padding:9px 12px}
#touchLayoutEditor .touch-editor-toolbar label{color:#e0d9b5;white-space:nowrap}
#touchLayoutEditor .touch-editor-toolbar input{accent-color:#e4c54c;width:105px}
#touchLayoutEditor .touch-editor-toolbar output{font-size:12px;min-width:42px;color:#ffe58a}
#touchLayoutEditor>p{position:relative;z-index:2;pointer-events:none;color:#cbc9b0;margin:6px 10px;font-size:11px}
#touchLayoutEditor .touch-editor-preview::before{content:'';position:absolute;inset:120px 15% 30px;border:1px solid #a9bc8040;border-radius:3px;background:repeating-linear-gradient(90deg,#486e3b18 0 12.5%,#5c813b18 12.5% 25%);pointer-events:none}
#touchLayoutEditor .touch-editor-preview::after{content:'';position:absolute;left:50%;top:120px;bottom:30px;border-left:1px solid #a9bc8040;pointer-events:none}
#touchLayoutEditor .touch-editor-preview button{z-index:1;border-radius:14px;background:#1c3442;color:#f1f0e5;box-shadow:0 2px 8px #0004}
#touchLayoutEditor .touch-editor-preview button[data-key$=kickMove]{background:#ac4825}
#touchLayoutEditor .touch-editor-preview button[data-key$=upMove]{background:#365d40}
@media(pointer:coarse) and (orientation:landscape){
 #touchLayoutEditor .touch-editor-toolbar{justify-content:flex-start;display:grid;grid-template-columns:1fr 1fr auto auto auto;gap:6px 10px;padding:7px 10px}
 #touchLayoutEditor .touch-editor-toolbar>strong{grid-column:1/3;font-size:15px}
 #touchLayoutEditor .touch-editor-toolbar label{grid-row:2;font-size:11px}
 #touchLayoutEditor #touchReset{grid-column:3;grid-row:1/3}
 #touchLayoutEditor #touchCancel{grid-column:4;grid-row:1/3}
 #touchLayoutEditor #touchSave{grid-column:5;grid-row:1/3}
 #touchLayoutEditor .touch-editor-toolbar button{min-height:36px;font-size:11px;padding:5px 10px}
}
@media(pointer:coarse) and (orientation:portrait){
 #touchLayoutEditor .touch-editor-toolbar{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
 #touchLayoutEditor .touch-editor-toolbar>strong{grid-column:1/-1;text-align:center}
 #touchLayoutEditor .touch-editor-toolbar label{grid-column:1/-1;justify-content:space-between}
 #touchLayoutEditor .touch-editor-toolbar input{width:55%}
 #touchLayoutEditor .touch-editor-toolbar button{min-height:38px;padding:5px;font-size:12px}
 #touchLayoutEditor .touch-editor-preview::before{top:225px}
 #touchLayoutEditor .touch-editor-preview::after{top:225px}
}
#touchLayoutEditor .touch-editor-preview button small{display:block;font-size:9px;line-height:1.2;margin-top:2px}
#touchLayoutEditor .touch-editor-preview button{font-size:24px}
#touchLayoutEditor .touch-editor-players{position:relative;z-index:2;display:flex;justify-content:center;gap:7px;padding:4px 0}
#touchLayoutEditor .touch-editor-players button{min-height:30px;padding:3px 14px;font-size:11px;border:1px solid #a4a66c;border-radius:20px;background:#29311e;color:#dedbc2}
#touchLayoutEditor .touch-editor-players button[aria-pressed=true]{border-color:#e4c54c;background:#665c2d;color:#fff2b1}
#touchLayoutEditor .touch-editor-preview::before,#touchLayoutEditor .touch-editor-preview::after{top:145px}
@media(pointer:coarse) and (orientation:portrait){#touchLayoutEditor .touch-editor-preview::before,#touchLayoutEditor .touch-editor-preview::after{top:265px}}
#touchLayoutEditor :is(button,input):focus-visible{outline:3px solid #fff3a1;outline-offset:3px}
#touchLayoutEditor .touch-editor-toolbar output{font-size:13px}
#touchLayoutEditor .touch-editor-toolbar input{min-height:30px;cursor:pointer}
#touchLayoutEditor .touch-editor-preview button[hidden]{display:none!important}
@media(pointer:coarse){#touchLayoutEditor .touch-editor-toolbar button,#touchLayoutEditor .touch-editor-players button{min-height:38px}#touchLayoutEditor .touch-editor-toolbar label{font-size:12px}}

/* Four named controls share a complete row; action buttons stay above them. */
#touchLayoutEditor .touch-editor-toolbar select{min-width:0;width:100%;max-width:150px;font-size:12px;padding:6px}
@media(pointer:coarse) and (orientation:landscape){
 #touchLayoutEditor .touch-editor-toolbar{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px 12px}
 #touchLayoutEditor .touch-editor-toolbar>strong{grid-column:1;grid-row:1;font-size:14px}
 #touchLayoutEditor #touchReset{grid-column:2;grid-row:1}
 #touchLayoutEditor #touchCancel{grid-column:3;grid-row:1}
 #touchLayoutEditor #touchSave{grid-column:4;grid-row:1}
 #touchLayoutEditor .touch-editor-toolbar label{grid-row:2;min-width:0}
 #touchLayoutEditor .touch-editor-toolbar input{width:clamp(45px,10vw,105px);min-width:40px;flex:1}
 #touchLayoutEditor .touch-editor-toolbar output{min-width:34px}
}
.touch{--touch-inset-left:env(safe-area-inset-left,0px);--touch-inset-right:env(safe-area-inset-right,0px);--touch-inset-top:env(safe-area-inset-top,0px);--touch-inset-bottom:env(safe-area-inset-bottom,0px)}

/* Cabezones runtime recovery epoch 1 */