/* Approved image artwork, with accessible live labels and controls. */
body #mode-dialog{background:#faf7ef!important;color:#102f25!important;--ink:#102f25;--muted:#687267;--paper:#faf7ef;--line:#d5d7cc;width:min(520px,calc(100vw - 24px));max-width:520px;padding:24px 20px;border:0;border-radius:20px}
body #mode-form{max-height:calc(100dvh - 76px);overflow:visible}
body #mode-form>.eyebrow{text-align:left;font:700 9px/1.5 'DM Sans',sans-serif;letter-spacing:1.8px;color:#526851}
body #mode-dialog h2{text-align:left;font:500 35px/1.2 Manrope,sans-serif!important;letter-spacing:-1px;margin:8px 0 20px;color:#102f25}
body #mode-dialog .mode-content{padding:3px 3px 0}
body #mode-dialog .mode-options{display:block;min-width:0;width:100%;margin:0;padding:0;border:0}
body #mode-dialog .mode-options legend{display:none}
body #mode-dialog .mode-options label{container-type:inline-size;position:relative;isolation:isolate;overflow:visible;display:flex;align-items:center;gap:0;width:100%;min-height:0;aspect-ratio:922/190;padding:0;border:0!important;border-radius:12px;color:#102f25!important;background:none!important;box-shadow:0 3px 7px #34200c18;cursor:pointer}
body #mode-dialog .mode-options label:before{content:'';position:absolute;inset:0;z-index:-1;background-image:url('media/menu-cards.png');background-repeat:no-repeat;background-size:111.063% 808.421%;background-position:50% 16.493%;border-radius:inherit}
body #mode-dialog .mode-options label[data-card=daily]:before{background-position:50% 32.541%}
body #mode-dialog .mode-options label[data-card=arcade]:before{background-position:50% 47.846%}
body #mode-dialog .mode-options label[data-card=challenge]{aspect-ratio:922/175}
body #mode-dialog .mode-options label[data-card=challenge]:before{background-size:111.063% 877.714%;background-position:50% 62.748%}
body #mode-dialog .mode-options label[data-card=duo]{aspect-ratio:922/180}
body #mode-dialog .mode-options label[data-card=duo]:before{background-size:111.063% 853.333%;background-position:50% 77.286%}
body #mode-dialog .mode-options label>input{appearance:none;-webkit-appearance:none;flex:none;position:relative;z-index:2;margin:0 4.5% 0 4.6%;padding:0;width:5.2%;height:auto;aspect-ratio:1;border:1.5px solid #776e5e;border-radius:50%;background:#faf7ef;box-shadow:none;outline:0}
body #mode-dialog .mode-options label>input:checked{background:#163e32;box-shadow:inset 0 0 0 2px #faf7ef}
body #mode-dialog .mode-options label:has(input:focus-visible){outline:2px solid #c55331;outline-offset:3px}
body #mode-dialog .mode-options label>span:not(.mode-calendar){position:relative;z-index:1;display:block;flex:1;min-width:0;padding:0}
body #mode-dialog .mode-options strong{display:block;font:700 6.2cqw/1.04 Georgia,serif;letter-spacing:-.15px;color:inherit!important;margin:0}
body #mode-dialog .mode-options small{display:block;font:400 3.25cqw/1.35 'DM Sans',sans-serif;color:inherit!important;margin-top:1.1cqw;white-space:nowrap}
body #mode-dialog .mode-options label[data-card=classic]{color:#301b08!important}
body #mode-dialog .mode-options label[data-card=arcade]{color:#eaf3ff!important}
body #mode-dialog .mode-options label[data-card=arcade] small{color:#c8eafa!important}
body #mode-dialog .mode-options label[data-card=arcade]>input{background:transparent;border-color:#bde7f8}
body #mode-dialog .mode-options label[data-card=arcade]>input:checked{background:#b590ff;box-shadow:inset 0 0 0 2px #10253e}
body #mode-dialog .mode-options label[data-card=duo] strong{font-size:5.5cqw}
body #mode-dialog .mode-options label[data-card=duo] small{font-size:2.95cqw}
.mode-calendar{position:absolute;left:82.3%;top:22.5%;width:12.5%;height:66%;text-align:center;pointer-events:none}
.mode-calendar i{display:block;font:400 2.5cqw/1 'DM Sans',sans-serif;color:white;text-transform:uppercase;padding-top:3%}
.mode-calendar b{display:block;font:700 5.5cqw/1.2 Georgia,serif;color:#102f25;padding-top:12%}
body #mode-dialog #mode-warning{font:400 12px/1.4 'DM Sans';text-align:center;color:#7c8277!important;margin:12px 0 0}
body #mode-dialog .mode-player-details{border:0;margin:6px 0 0;padding:0;color:#59675f}
.mode-player-details summary{font:400 12px 'DM Sans';min-height:24px;cursor:pointer}
body #mode-dialog .mode-player-details #player-fields{margin:6px 0}
body #mode-dialog .primary{background:#163e32!important;color:#faf7ef!important;border-radius:12px;justify-content:center;min-height:48px;font:800 16px var(--club-font-ui)!important;padding:12px;margin-top:12px}
body #mode-dialog .text-button{font:400 14px 'DM Sans'!important;text-align:center;justify-content:center;color:#163e32!important;min-height:38px;padding:8px}
@media(max-height:600px){body #mode-dialog{padding:16px}body #mode-dialog h2{font-size:29px!important;margin-bottom:12px}body #mode-form{max-height:calc(100dvh - 56px)}}
body #mode-dialog .mode-options label>input{width:5.2cqw!important;height:5.2cqw!important;min-width:0!important;min-height:0!important;max-height:none!important;align-self:center}

/* WebKit fieldsets cannot reliably size grid children with inline containment. */
body #mode-dialog .mode-options label+label{margin-top:10px}

body #mode-form>.eyebrow{justify-content:flex-start;padding:0 44px 0 0}
