/* Compact secondary surfaces, shared by the independent design previews only. */
:root{--menu-control:32px;--card-radius:12px;--menu-radius:16px}
html body :is(dialog,.viewer-dialog,.result-dialog-card,.text-style-popover,.team-autocomplete-panel,.carousel-editor-panel,.timing-popover){border-radius:var(--menu-radius)!important}
html body :is(.card,.panel,.plan-stage,.plan-preview,.design-rank-section,.design-bracket-match,.result-match-card,.court-setting-row){border-radius:var(--card-radius)!important}
html body :is(dialog,.text-style-popover,.carousel-editor-panel,.timing-popover,#soundSettings,#moreMatchSettings){font-size:14px;line-height:1.45}
html body :is(dialog,.text-style-popover,.carousel-editor-panel,.timing-popover,#soundSettings,#moreMatchSettings) :is(button,select,input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color])){min-height:var(--menu-control)!important;font-size:14px!important;line-height:1.35;padding:5px 9px;border-radius:7px!important}
html body :is(dialog,.text-style-popover,.carousel-editor-panel,.timing-popover,#soundSettings,#moreMatchSettings) :is(.design-icon-only,.icon-only,.court-eye,.court-drag-handle,.court-move-fallback button){width:var(--menu-control)!important;min-width:var(--menu-control)!important;height:var(--menu-control)!important;min-height:var(--menu-control)!important;padding:0!important;flex:none;border-radius:7px!important}
html body :is(dialog,.text-style-popover,.carousel-editor-panel,.timing-popover) button svg{width:17px!important;height:17px!important}
html body :is(dialog,.viewer-dialog) .dialog-head{padding:8px 14px!important;min-height:48px!important;gap:10px}
html body :is(dialog,.viewer-dialog) .dialog-head h2{font-size:16px!important;line-height:24px!important;font-weight:650!important;margin:0!important}
html body :is(dialog,.viewer-dialog) .dialog-head button:focus-visible{outline-width:1px!important;outline-offset:-2px!important}
html body :is(dialog,.viewer-dialog) :is(.viewer-dialog-body,#dialog-body){padding:12px 14px!important}
html body :is(dialog,.viewer-dialog) footer{padding:8px 14px!important}
html body .viewer-dialog{width:min(440px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow:hidden}
html body .viewer-dialog-body{max-height:calc(100dvh - 166px);overflow:auto}
html body .viewer-dialog .court-checkboxes{gap:6px;margin-top:8px}
html body .viewer-dialog .court-setting-row{grid-template-columns:var(--menu-control) minmax(0,1fr) var(--menu-control) calc(var(--menu-control)*2);gap:3px;padding:5px 6px;min-height:50px;border-color:#FFFFFF16}
html body .viewer-dialog .court-setting-row>div:nth-child(2){min-width:0;gap:0}
html body .viewer-dialog .court-setting-row strong{font-size:14px;font-weight:600;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body .viewer-dialog .court-setting-row small{font-size:12px;line-height:17px;color:#A4ACB5}
html body .viewer-dialog .court-drag-handle{font-size:17px!important;color:#9BA4AC}
html body .viewer-dialog .court-move-fallback{display:flex;gap:0}
html body .viewer-dialog .selection-actions{gap:4px;align-items:center}
html body .viewer-dialog #selection-summary{font-size:12px;line-height:18px;font-weight:450;color:#A4ACB5;margin:10px 0 0}
html body .viewer-dialog footer button.primary{min-width:64px!important;width:auto!important;font-size:14px!important;padding:5px 14px!important}
html body .viewer-dialog .team-option{padding:4px 0;min-height:42px;gap:6px}
html body .viewer-dialog .viewer-team-tools{gap:6px}
html body .viewer-dialog .favorites-only-toggle,html body #team-dialog [data-clear-team-filter]{min-height:var(--menu-control)!important;padding:4px 0!important;font-size:13px!important}
html body .viewer-dialog .match-details-grid{gap:7px;grid-template-columns:70px minmax(0,1fr)}
html body :is(.text-style-popover,.carousel-editor-panel,.timing-popover){padding:12px!important;max-width:calc(100vw - 24px)}
html body :is(#soundSettings,#moreMatchSettings) .setting-list{gap:8px}
html body :is(#soundSettings,#moreMatchSettings) .setting-row{gap:8px;margin-block:5px}
html body .result-dialog-card{padding:16px;gap:12px}
html body .result-dialog-header h2{font-size:17px!important}
html body :is(.team-more,.plan-stage-settings,.plan-toolbar,.bulk-side) :is(button,select){min-height:34px;font-size:14px}
html body .panel{padding:16px}
html body :is(.panel,.card) :is(.field,.row,.stack){gap:8px}
html body .viewer-live:not(.is-fullscreen) .court-card.original-court,html body .viewer-live:not(.is-fullscreen)>.court-carousel>.shared-score-frame{border-radius:var(--card-radius)}
html body :is(.center-frame,.viewer-design-frame,.score-design-frame){border-radius:var(--card-radius)}
@media(pointer:coarse){:root{--menu-control:36px}html body .viewer-dialog .court-setting-row{min-height:52px}html body .viewer-dialog input[type=search],html body .viewer-dialog #event-code{font-size:16px!important}}
@media(max-width:360px){html body .viewer-dialog :is(.dialog-head,.viewer-dialog-body,footer){padding-inline:10px!important}html body .viewer-dialog .court-setting-row{padding-inline:3px;gap:2px}}
html body .result-dialog-card :is(button,select,input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color])){min-height:var(--menu-control)!important;font-size:14px!important;padding:5px 9px;border-radius:7px!important}
html body .result-dialog-card :is(.result-dialog-actions,.panel-actions){gap:8px;margin-top:12px}
html body .team-autocomplete-panel{padding:6px!important}
html body .team-autocomplete-panel button{min-height:var(--menu-control)!important;padding:6px 10px!important;font-size:14px!important}
html body .design-bracket-match{border-radius:10px!important}
