dialog.match-modal{width:min(920px,calc(100vw - 16px));max-width:100%;max-height:calc(100dvh - 16px);padding:24px;background:#fffcf1;overflow:auto;overscroll-behavior:contain}.match-playing{overflow:hidden}.match-modal h2{font-family:Georgia,serif;font-size:30px;margin:8px 32px 18px 0}.match-options{display:flex;gap:16px;flex-wrap:wrap}.match-options label{display:grid;gap:8px;flex:1;font-weight:bold;min-width:180px}.match-options select{font:inherit;padding:12px;border:1px solid #b8c3aa;border-radius:8px;background:white;color:#254c39;width:100%}.match-actions{display:flex;gap:8px;flex-wrap:wrap}.match-actions button{min-height:44px;touch-action:manipulation}.match-meta,.match-stats{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:14px}.match-stats{background:#294c39;color:#fff8da;border-radius:10px;padding:12px;margin:12px 0;font-variant-numeric:tabular-nums}.match-help{font-size:14px;line-height:1.5;color:#58654d}.match-board{display:grid;grid-template-columns:repeat(var(--match-columns),minmax(0,1fr));gap:10px}.match-card{padding:0;border:0;background:transparent!important;min-width:0;aspect-ratio: .86;perspective:900px;touch-action:manipulation;user-select:none;border-radius:13px;transition:none}.match-card:active{transform:none}.match-flipper{display:block;position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .38s}.match-card.is-up .match-flipper{transform:rotateY(180deg)}.match-back,.match-front{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:13px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;border:2px solid #d7a447}.match-back{background-color:#eeb94e;background-image:linear-gradient(30deg,#ffe5a233 12%,transparent 12.5%,transparent 87%,#ffe5a233 87.5%),linear-gradient(150deg,#ffe5a233 12%,transparent 12.5%,transparent 87%,#ffe5a233 87.5%),linear-gradient(30deg,#ffe5a233 12%,transparent 12.5%,transparent 87%,#ffe5a233 87.5%);background-size:30px 52px;box-shadow:inset 0 0 0 5px #ffe9b57a,0 3px 7px #50380c20;color:#473014;gap:8px;padding:8px}.match-back img{width:56%;max-width:78px;border-radius:50%;pointer-events:none}.match-back b{font:700 16px Georgia,serif;text-align:center}.match-front{transform:rotateY(180deg);background:#fffef8;padding:6px;gap:3px}.match-art{display:block;width:75%;aspect-ratio:1;flex-shrink:1;min-height:0;background-repeat:no-repeat}.match-front b{font-size:14px;line-height:1.15;text-align:center;overflow-wrap:anywhere}.match-front small{font-size:12px;letter-spacing:1px;color:#687154}.match-card.is-matched .match-front{border-color:#b78116;box-shadow:inset 0 0 18px #f3c85570,0 0 10px #dba72d60;animation:match-spark .5s ease-out}.match-celebration{text-align:center;margin:18px 0;padding:22px;background:#fbe5a3;border:1px solid #d5a63e;border-radius:16px}.match-celebration>span{font-size:38px}.match-celebration h3{font-family:Georgia,serif;font-size:26px}.match-celebration .match-actions{justify-content:center}.match-record{padding:14px;background:#edf1e4;border-radius:10px}@keyframes match-spark{50%{box-shadow:0 0 22px #e9b12b;filter:brightness(1.15)}}@media(max-width:600px){dialog.match-modal{padding:16px 10px}.match-modal h2{font-size:25px}.match-board{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.match-card{aspect-ratio:.8}.match-back b{font-size:14px}.match-front b{font-size:14px}.match-meta{gap:6px}.match-options label{min-width:120px}}@media(prefers-reduced-motion:reduce){.match-flipper{transition:none}.match-card.is-matched .match-front{animation:none}}
/* Keep the whole round in the viewport; the board takes only the remaining space. */
dialog.match-modal{height:min(900px,calc(var(--match-vh,100dvh) - 12px));max-height:calc(var(--match-vh,100dvh) - 12px);width:min(1000px,calc(100vw - 12px));padding:14px;overflow:hidden;margin:auto}.match-modal #modalbody,.match-modal #match-app{height:100%;min-height:0;min-width:0}.match-modal #match-app{position:relative}.match-modal .match-active{display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto auto;gap:7px}.match-active>.eyebrow{display:none}.match-modal .match-active>h2{font-size:24px;line-height:1.2;margin:0 36px 0 0}.match-active .match-meta{font-size:13px;line-height:1.2}.match-active .match-stats{margin:0;padding:9px 10px;gap:6px;flex-wrap:nowrap}.match-active .match-board{min-height:0;gap:6px;overflow:hidden;padding:3px}.match-active .match-card{aspect-ratio:auto;height:100%;min-height:0}.match-active .match-front{padding:3px;gap:2px}.match-active .match-art{width:var(--match-art-size,40px);height:var(--match-art-size,40px);flex:none}.match-active .match-front small{display:none}.match-active .match-front b{font-size:14px;line-height:1.1}.match-active .match-dense .match-front b{font-size:12px}.match-active .match-back{padding:4px;gap:4px}.match-active .match-back img{width:auto;height:var(--match-art-size,40px);max-width:65%;max-height:55%;object-fit:contain}.match-active .match-back b{font-size:14px;line-height:1.1}.match-active .match-dense .match-back b{font-size:12px}.match-active .match-actions{flex-wrap:nowrap;gap:6px}.match-active>.match-actions button{flex:1;font-size:14px;padding:7px 5px;min-width:0}.match-active #match-notice:empty,.match-active #match-result:empty{display:none}.match-modal #match-notice{margin:0;font-size:13px;line-height:1.2}.match-active #match-result:not(:empty){position:absolute;inset:0;z-index:5;background:#fffcf1ed;display:flex;align-items:center;justify-content:center;border-radius:12px}.match-active .match-celebration{margin:0;max-height:100%;padding:16px;width:min(100%,500px)}.match-active .match-celebration p{font-size:15px;line-height:1.4}.match-active .match-celebration h3{margin:12px 0}.match-modal .match-setup{display:flex;flex-direction:column;justify-content:center;gap:12px}.match-modal .match-setup h2,.match-modal .match-setup p{margin:0}.match-modal .match-setup p{font-size:16px;line-height:1.35}.match-setup .match-record{padding:10px}.match-setup .match-options{gap:10px}.match-setup .match-options label{min-width:0}.match-setup .match-options select{padding:10px 4px;font-size:14px}@media(max-width:600px){dialog.match-modal{padding:10px 8px}.match-modal .match-active>h2{font-size:20px}.match-active .match-meta{font-size:12px}.match-active .match-stats{font-size:13px;padding:7px 8px}.match-active>.match-actions button{font-size:12px}.match-modal .match-setup{gap:10px}.match-modal .match-setup h2{font-size:24px}.match-front,.match-back,.match-card{border-radius:8px}}@media(max-height:500px){.match-modal .match-active>h2{font-size:18px}.match-active .match-meta{display:none}.match-modal .match-active{grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:4px}.match-active .match-stats{padding:5px 8px}.match-modal .match-setup{gap:6px}.match-modal .match-setup>.eyebrow{display:none}.match-modal .match-setup p{font-size:14px}.match-setup .match-record{padding:6px}}