.controls-dialog{width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 40px);margin:auto;padding:0;border:1px solid #91b9d36b;border-radius:12px;background:#10324d;color:#edf6ff;box-shadow:0 24px 90px #031420b3;overflow:hidden}
.controls-dialog[open]{display:flex;flex-direction:column}
.controls-dialog::backdrop{background:#051827c9;backdrop-filter:blur(5px)}
.controls-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 28px 16px;flex-shrink:0}
.controls-dialog-header h2{margin:0;font:400 32px/1.15 var(--font-display);text-transform:uppercase}
.controls-dialog .controls-dialog-close{display:grid;place-items:center;padding:0;width:40px;min-height:40px;border:1px solid #9cbcd64d;border-radius:6px;font:24px/1 var(--font-reading);background:#204862;box-shadow:none}
.controls-dialog-tabs{display:flex;gap:8px;padding:0 28px 18px;border-bottom:1px solid #9dc8e333;flex-shrink:0}
.controls-dialog-tabs button{flex:1;min-height:46px;padding:10px 18px;text-align:center;font:800 18px/1.2 var(--font-ui);border:1px solid #a1c9e34d;background:#183e59;box-shadow:none}
.controls-dialog-tabs button[aria-selected=true]{background:#ffe343;color:#102f48;border-color:#ffe343;text-shadow:none}
.controls-dialog-content{overflow-y:auto;overscroll-behavior:contain;min-height:0;padding:8px 28px 24px}
.controls-dialog-list{display:grid;grid-template-columns:minmax(125px,.85fr) minmax(0,1.15fr);margin:0;font:15px/1.45 var(--font-reading)}
.controls-dialog-list dt,.controls-dialog-list dd{padding:10px 0;border-bottom:1px solid #b6d8f01c;margin:0}
.controls-dialog-list dt{color:#bad3e5;padding-right:16px}
.controls-dialog-list dd{font-weight:700;overflow-wrap:anywhere}
.controls-dialog-note{font:13px/1.6 var(--font-reading);color:#bad3e5;margin:20px 0 0}
.controls-dialog :focus-visible{outline:3px solid #ffe343;outline-offset:3px}
.controls-dialog-panel:focus-visible{outline-offset:-3px}
@media(max-width:540px){
 .controls-dialog{max-height:calc(100dvh - 24px);width:calc(100vw - 24px)}
 .controls-dialog-header{padding:18px 18px 14px}
 .controls-dialog-tabs{padding:0 18px 14px}
 .controls-dialog-tabs button{padding-inline:10px;font-size:17px}
 .controls-dialog-content{padding:4px 18px 18px}
 .controls-dialog-list{font-size:14px;grid-template-columns:minmax(105px,.8fr) minmax(0,1.2fr)}
}
