/* The browser floats across the field instead of pushing it down the page. */
.card-browser-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px 14px;background:var(--surface-alt,#f3edf7);border-bottom:1px solid var(--line,#dfd5e6)}
.card-browser-toolbar>div{display:flex;align-items:center;gap:8px;min-width:0}.card-browser-toolbar strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.browser-search{flex:1;min-width:100px}.browser-search input{width:100%;min-height:44px}
.card-browser-navigation{display:grid;grid-template-columns:38px minmax(0,1fr) 38px;align-items:center;padding:0 5px}.card-browser-navigation>button{padding:0;min-width:0;border:0;border-radius:3px}
.card-browser-track{display:flex;align-items:end;gap:0;overflow-x:auto;overflow-y:hidden;padding:24px 9px 17px;scrollbar-width:thin;scroll-snap-type:x proximity;overscroll-behavior-x:contain;min-width:0}
.browser-card{width:110px;flex-shrink:0;border:0;padding:0;margin:0 -16px 0 0;background:none;border-radius:4px;scroll-snap-align:center;position:relative;transform-origin:bottom center;min-height:0;transition:transform .22s;box-shadow:none}
.browser-card>img,.browser-card>.card-back{display:block;width:100%;aspect-ratio:.685;object-fit:cover;border:1px solid var(--line-strong,#b8a3c8);border-radius:4px;box-shadow:0 5px 9px #311b4f30}
.browser-card>span:last-child{display:none}.browser-card[aria-pressed=true],.browser-card:focus-visible,.browser-card:hover{transform:translateY(-12px);z-index:2;background:none}.browser-card:last-child{margin-right:0}
.card-browser-caption{text-align:center;font:12px var(--font-data);padding:5px 15px 12px;min-height:35px;color:var(--text,#311b4f)}
.duel-card-browser[data-overlay=true]{position:fixed;z-index:80;box-sizing:border-box;margin:0!important;overflow:auto;border:1px solid var(--border-strong,var(--line,#c8b89b))!important;border-radius:12px;background:var(--surface,#fffdf8);box-shadow:0 22px 80px #211a1255,0 2px 10px #211a1222;transform-origin:center center;color:var(--text,#27231d)}
.duel-card-browser[hidden]{display:none!important}
.duel-card-browser[data-overlay=true] .card-browser-toolbar{background:var(--surface-2,var(--surface,#f7f2e7));border-bottom-color:var(--border,var(--line,#ddd2bd));padding:12px 14px;gap:10px}
.duel-card-browser[data-overlay=true] .card-browser-toolbar strong{max-width:none;font-size:14px;color:var(--text,#27231d)}
.duel-card-browser[data-overlay=true] .card-browser-toolbar .tag{font-size:10px}
.duel-card-browser[data-overlay=true] .card-browser-toolbar button{font-size:12px;min-width:44px;min-height:44px}
.duel-card-browser[data-overlay=true] .browser-search input{font-size:14px;min-height:44px}
.duel-card-browser[data-overlay=true] .card-browser-note{font-size:12px;line-height:1.5;color:var(--muted,#6a655c);padding:10px 15px 0;margin:0}
.duel-card-browser[data-overlay=true] .card-browser-note:empty{display:none}
.duel-card-browser[data-overlay=true] .card-browser-navigation{grid-template-columns:38px minmax(0,1fr) 38px;padding:0 5px}
.duel-card-browser[data-overlay=true] .card-browser-navigation>button{font-size:30px;min-height:60px;color:var(--accent,#9b5c2e)}
.duel-card-browser[data-overlay=true] .card-browser-track{padding:24px 9px 17px;align-items:end;scrollbar-color:var(--accent,#9b5c2e) transparent}
.duel-card-browser[data-overlay=true] .browser-card{width:clamp(90px,8.7vw,132px);margin-right:-19px;transition:transform .22s cubic-bezier(.2,.75,.25,1);transform-origin:center bottom}
.duel-card-browser[data-overlay=true] .browser-card>img,.duel-card-browser[data-overlay=true] .browser-card>.card-back{border-color:var(--border-strong,#ad9675);box-shadow:0 6px 14px #211a1238}
.duel-card-browser[data-overlay=true] .browser-card[aria-pressed=true],.duel-card-browser[data-overlay=true] .browser-card:focus-visible,.duel-card-browser[data-overlay=true] .browser-card:hover{transform:translateY(-12px) rotate(-1deg)}
.duel-card-browser[data-overlay=true] .browser-card[aria-pressed=true]>img{border:2px solid var(--accent,#9b5c2e)}
.duel-card-browser[data-overlay=true] .browser-card:last-child{margin-right:0}
.duel-card-browser[data-overlay=true] .card-browser-caption{font-size:12px;min-height:35px;padding:5px 15px 12px;color:var(--text,#27231d)}
.duel-motion-card{pointer-events:none!important;user-select:none!important;transform-origin:top left!important;overflow:hidden;box-sizing:border-box;border-radius:4px;box-shadow:0 8px 20px #17110c44;will-change:transform,opacity}
.duel-motion-card img{display:block;width:100%;height:100%;object-fit:fill}
.duel-motion-card.card-back{display:grid;place-items:center;background:radial-gradient(ellipse,#b8723b,#513727 40%,#211a15 70%);color:#ddb77d;border:3px solid #806344;aspect-ratio:.685}
@media(max-width:680px){.duel-card-browser[data-overlay=true] .card-browser-toolbar{padding:9px;gap:6px}.duel-card-browser[data-overlay=true] .card-browser-toolbar>div{flex-basis:100%}.duel-card-browser[data-overlay=true] .card-browser-toolbar strong{font-size:13px}.duel-card-browser[data-overlay=true] .browser-search input{font-size:16px}.duel-card-browser[data-overlay=true] .card-browser-note{font-size:11px;padding-inline:12px}.duel-card-browser[data-overlay=true] .card-browser-navigation{grid-template-columns:28px minmax(0,1fr) 28px}.duel-card-browser[data-overlay=true] .browser-card{width:94px;margin-right:-14px}.duel-card-browser[data-overlay=true] .card-browser-caption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.duel-card-browser .browser-card{transition:none!important}.duel-motion-card{display:none!important}}
.card-browser-track{overscroll-behavior:contain;touch-action:pan-x}
.duel-activation-flight{position:fixed;z-index:95;pointer-events:none!important;transform-origin:top left;will-change:transform,opacity;perspective:900px}
.duel-activation-turn{width:100%;height:100%;position:relative;transform-style:preserve-3d;will-change:transform}
.duel-activation-face,.duel-activation-back{position:absolute;inset:0;width:100%;height:100%;border-radius:5px;backface-visibility:hidden;box-shadow:0 10px 30px #311b4f55}
.duel-activation-face{object-fit:fill;transform:rotateY(0deg)}
.duel-activation-back{transform:rotateY(180deg);display:grid;place-items:center;background:radial-gradient(ellipse,#b8723b,#513727 40%,#211a15 70%);color:#ddb77d;border:3px solid #806344}
.duel-activation-back>img{width:100%;height:100%;object-fit:cover;border-radius:2px}
.duel-opening-result{position:fixed;z-index:96;padding:18px 20px 14px;border:1px solid var(--border-strong,#bbaac4);border-radius:14px;background:var(--surface,#fffdf8);box-shadow:0 20px 75px #311b4f40;text-align:center;color:var(--text,#311b4f)}
.duel-opening-result>strong{display:block;font:700 11px var(--font-data,monospace);letter-spacing:1.7px;text-transform:uppercase;color:var(--muted,#796888)}
.duel-opening-dice{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:11px 0 7px}
.duel-opening-dice>div{min-width:0;display:grid;justify-items:center;gap:3px}
.duel-opening-die{font-size:74px;line-height:1.1;color:var(--text,#311b4f);display:block}
.duel-opening-dice small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.duel-opening-result p{font-size:13px;line-height:1.55;margin:8px 0 12px;color:var(--text,#311b4f)}
.duel-opening-ties{display:block;font:10px var(--font-data,monospace);max-height:44px;overflow:auto}
.duel-opening-result>button{width:100%}
@media(prefers-reduced-motion:reduce){.duel-activation-flight{display:none!important}.duel-opening-die{animation:none!important}}
/* Travel and orientation are independent: the whole card moves/turns sideways,
   while two backface-hidden surfaces rotate as one physical card. */
.duel-card-flight{position:fixed;z-index:94;pointer-events:none!important;transform-origin:center center;perspective:1000px;will-change:transform,opacity}
.duel-card-turn{position:relative;width:100%;height:100%;transform-style:preserve-3d;will-change:transform}
.duel-card-face,.duel-card-back{position:absolute!important;inset:0;width:100%!important;height:100%!important;box-sizing:border-box;border-radius:4px;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 8px 24px #311b4f45;overflow:hidden}
.duel-card-face{transform:rotateY(0deg);display:grid;place-items:center;background:var(--surface,#fffdf8)}
.duel-card-back{transform:rotateY(180deg);display:grid;place-items:center;background:radial-gradient(ellipse,#b8723b,#513727 40%,#211a15 70%);color:#ddb77d;border:3px solid #806344}
.duel-card-face>img,.duel-card-back>img{display:block;width:100%;height:100%;object-fit:fill}
@media(prefers-reduced-motion:reduce){.duel-card-flight{display:none!important}}
