#deck-preview-dialog { --preview-paper:#f3e8d2; --preview-gold:#d9b779; width:min(920px,calc(100vw - 40px)); max-width:none; max-height:calc(100svh - 40px); margin:auto; padding:0; border:1px solid #c9ab7659; border-radius:14px; color:var(--preview-paper); background:radial-gradient(ellipse at 50% 68%,#21434970,transparent 68%),#0b1b20; box-shadow:0 25px 100px #000a; font-family:'AEH Text',system-ui,sans-serif; overflow:auto; overscroll-behavior:contain; }
#deck-preview-dialog::backdrop { background:#030a0dd9; backdrop-filter:blur(6px); }
#deck-preview-dialog * { box-sizing:border-box; }
#deck-preview-dialog button { min-height:44px; font:inherit; cursor:pointer; color:inherit; -webkit-tap-highlight-color:transparent; }
#deck-preview-dialog :is(button,[tabindex]):focus-visible { outline:2px solid #f2d492; outline-offset:4px; }
.deck-preview-shell { padding:25px 36px 22px; }
.deck-preview-header { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.deck-preview-eyebrow { margin:0 0 5px; font-size:9px; text-transform:uppercase; letter-spacing:.22em; color:var(--preview-gold); }
#deck-preview-heading { margin:0; font:500 38px/1.1 'AEH Display','Arial Narrow',sans-serif; letter-spacing:.04em; }
.deck-preview-close { border:0; background:none; padding:8px 0 8px 16px; font-size:12px!important; color:#c7d5cd!important; }
.deck-preview-close span { margin-left:10px; font-size:22px; vertical-align:-2px; color:var(--preview-gold); }
#deck-preview-description { margin:12px 0 18px; color:#a5b9b3; font-size:12px; line-height:1.5; }
.deck-preview-tabs { display:flex; border-bottom:1px solid #c9ab7630; gap:24px; }
.deck-preview-tabs button { flex:1; border:0; border-bottom:2px solid transparent; padding:11px 4px; color:#95b0a8!important; font-size:13px!important; background:none; }
.deck-preview-tabs button[aria-selected='true'] { border-bottom-color:var(--preview-gold); color:#f3dfb8!important; }
.deck-preview-samples { display:flex; justify-content:center; gap:8px; margin:17px 0 15px; }
.deck-preview-samples button { min-width:68px; border:1px solid #829f9657; border-radius:5px; padding:6px 16px; background:#11292c; font:600 19px Georgia,serif!important; }
.deck-preview-samples button[aria-pressed='true'] { color:#ffdf9f!important; background:#b6955030; border-color:#d9b779; }
.deck-preview-samples button:hover,.deck-preview-tabs button:hover { background:#d9b77910; }
.deck-preview-status { margin:0; text-align:center; color:#adbbb1; font-size:13px; line-height:1.5; }
.deck-preview-status:not(:empty) { padding:15px 0; }
.deck-preview-retry { border:0; background:none; padding:5px 10px; text-decoration:underline; color:var(--preview-gold)!important; }
.deck-preview-comparison { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px; justify-content:center; min-height:220px; }
.deck-preview-figure { margin:0; min-width:0; display:flex; flex-direction:column; align-items:center; }
.deck-preview-figure figcaption { text-align:center; min-height:47px; margin-bottom:28px; }
.deck-preview-finish { font-size:9px; text-transform:uppercase; letter-spacing:.2em; color:#9db6ad; }
.deck-preview-figure[data-finish='foil'] .deck-preview-finish { color:var(--preview-gold); }
.deck-preview-figure h3 { margin:5px 0 0; font:400 clamp(16px,2vw,23px)/1.2 Georgia,serif; color:#f4e8cd; }
.deck-preview-hit { position:relative; width:min(100%,calc(clamp(180px,calc(100svh - 446px),520px)*var(--preview-ratio,.7142857))); aspect-ratio:5/7; }
.deck-preview-art { position:relative; isolation:isolate; width:100%; height:100%; overflow:hidden; border-radius:7px; background:#13272c; box-shadow:0 9px 22px #0007; }
.deck-preview-art canvas,.deck-preview-art .deck-preview-direct { display:block; width:100%; height:100%; }
.deck-preview-art .deck-preview-sheet { position:absolute; display:block; max-width:none; max-height:none; }
.deck-preview-art img { user-select:none; -webkit-user-drag:none; }
.deck-preview-unavailable { display:flex; align-items:center; justify-content:center; border:1px solid #9db6ad38; padding:18px; text-align:center; color:#a5b9b3; font-size:12px; line-height:1.6; }
.deck-preview-hint { margin:20px 0 0; text-align:center; color:#96aea6; font-size:11px; line-height:1.6; }
@media (max-width:600px) {
  #deck-preview-dialog { width:calc(100vw - 16px); max-height:calc(100svh - 16px); border-radius:10px; }
  .deck-preview-shell { padding:19px 14px 17px; }
  #deck-preview-heading { font-size:31px; }
  #deck-preview-description { font-size:11px; max-width:260px; margin-bottom:10px; }
  .deck-preview-tabs { gap:4px; }
  .deck-preview-tabs button { font-size:11px!important; padding-inline:0; }
  .deck-preview-comparison { gap:16px; }
  .deck-preview-figure figcaption { min-height:49px; margin-bottom:24px; }
  .deck-preview-figure h3 { font-size:16px; }
  .deck-preview-hit { width:100%; }
  .deck-preview-art { border-radius:5px; }
  .deck-preview-hint { font-size:10px; margin-top:16px; }
}
