/* Collectible cards with the original lab's neon and technical typography. */
.character-card{border:7px solid transparent;border-radius:12px 3px 12px 3px;background:linear-gradient(#20202a,#20202a) padding-box,linear-gradient(135deg,var(--frame-light) 0%,var(--frame-dark) 18%,var(--rarity-color) 31%,var(--frame-dark) 48%,var(--frame-light) 66%,var(--frame-dark) 81%,var(--rarity-color)) border-box;box-shadow:0 8px 18px #0006;transform:scale(.9) rotate(-3deg);filter:saturate(.8);outline:none}

.character-card>img{height:73%;object-position:center 18%;border-bottom:2px solid var(--rarity-color)}
.card-shade,.card-power{display:none}
.card-info{min-height:27%;padding:10px 9px 8px;background:#292632}
.card-series{color:var(--rarity-color);font:500 8px var(--mono);letter-spacing:.7px}
.card-info h3{color:var(--text);font:700 28px/1 var(--display);letter-spacing:.2px;text-transform:uppercase;margin:5px 0 0}
.card-serial{top:7px;left:7px;padding:5px 6px;background:#14131deb;color:var(--cyan);border:1px solid #82e8e066;border-radius:0;font:500 7px var(--mono);letter-spacing:.8px}
.reel-window.landed:not(.is-spinning) .character-card:nth-child(4){transform:scale(1);filter:none;border-color:transparent;outline:none;box-shadow:0 10px 25px #0007,0 0 18px var(--rarity-glow,#c9fa731a),0 0 22px var(--rarity-glow-2,#c9fa731a),inset 0 0 18px var(--rarity-inset,#c9fa731a)}
.reel-window.landed:not(.is-spinning) .character-card:nth-child(4)>img{border-bottom-color:var(--rarity-color,var(--lime))}
.reel-window.landed:not(.is-spinning) .character-card:nth-child(4) .card-series{color:var(--rarity-color,var(--lime))}
.reel-window.is-spinning .character-card{filter:none;transform:scale(.95)}
.reel-target{border:0;box-shadow:none!important}.reel-target i{display:none}.reel-target>span{color:var(--lime);text-shadow:0 0 10px #c9fa7344;font-size:12px;top:-8px}.reel-target>span:last-child{bottom:-8px}
@media(max-width:1100px){.card-info{padding:9px 7px}.card-info h3{font-size:26px}.card-series{font-size:7px}}
@media(max-width:760px){.character-card{border-width:6px}.card-info h3{font-size:27px}}
/* Rarity and transparent, current-pool draw odds. */
.header-actions{display:flex;align-items:center;gap:22px}.card-rarity{position:absolute;top:7px;right:7px;background:#14131deb;border:1px solid #61556d;padding:4px 5px;color:#c6bfcc;font:7px var(--mono);text-transform:uppercase;letter-spacing:.3px}.card-rarity{color:var(--rarity-color);border-color:var(--rarity-color)}.form-note{line-height:1.6}.form-note small{font-size:11px;color:var(--muted)}.odds-dialog{max-width:1000px;max-height:85vh;overflow:auto}.odds-dialog input[type=search]{display:block;width:100%;padding:12px;background:#12121b;border:1px solid var(--line);color:var(--text);margin-top:8px}.roster-table-wrap{overflow-x:auto}.roster-table{border-collapse:collapse;width:100%;min-width:660px;font:12px var(--mono)}.roster-table caption{text-align:left;font-size:10px;color:var(--muted);padding:10px 0}.roster-table th,.roster-table td{text-align:left;padding:12px 9px;border-bottom:1px solid var(--line);vertical-align:top}.roster-table thead th{color:var(--cyan);font-size:10px}.roster-table tbody th{width:45%;min-width:250px;font-weight:400}.roster-table th strong{color:var(--text);font:600 16px 'Space Grotesk',sans-serif}.roster-table th span,.roster-table th small{display:block;font-size:10px;line-height:1.6;margin-top:4px;color:var(--muted)}.roster-table th span{color:var(--pink)}.roster-table .rating-note{color:#a69bad}.roster-table td{color:var(--lime);white-space:nowrap}#roster-count{font-size:11px}@media(max-width:760px){.header-actions{gap:13px}.header-actions .text-button{font-size:9px;letter-spacing:0}.odds-dialog{padding:24px}.odds-dialog h2{font-size:30px}.brand{font-size:19px}.brand-icon{margin-right:4px}}

/* Idle reel motion and rarity lighting. */
.card-tilt-left{transform:scale(.9) rotate(-3deg)}.character-card.card-tilt-right{transform:scale(.9) rotate(3deg)}
.reel-tools{display:flex;align-items:center;gap:12px}.reel-tools .text-button{font-size:8px;letter-spacing:.5px;padding:0;white-space:nowrap}.reel-tools [hidden]{display:none!important}
/* Brushed steel, sapphire, amethyst, and gilded foil. */
.character-card{--rarity-color:#adb1b9;--frame-light:#e0e2e6;--frame-dark:#44474e;--rarity-glow:#aeb3bd18;--rarity-glow-2:#aeb3bd0c;--rarity-inset:#aeb3bd08;--frame-aura:8px}
.character-card.rarity-rare{--rarity-color:#65a6ff;--frame-light:#c2e1ff;--frame-dark:#172f68;--rarity-glow:#3988ff66;--rarity-glow-2:#2461ee35;--rarity-inset:#509bff20;--frame-aura:15px}
.character-card.rarity-epic{--rarity-color:#bb88ff;--frame-light:#ead3ff;--frame-dark:#43216c;--rarity-glow:#9b54ed88;--rarity-glow-2:#7936d94d;--rarity-inset:#b36dff29;--frame-aura:21px}
.character-card.rarity-legendary{--rarity-color:#f6c85b;--frame-light:#fff1ba;--frame-dark:#79501c;--rarity-glow:#ffc247a0;--rarity-glow-2:#e99b2159;--rarity-inset:#ffd97930;--frame-aura:28px}
.character-card{box-shadow:0 10px 20px #0009,0 0 var(--frame-aura) var(--rarity-glow),0 0 calc(var(--frame-aura) + 8px) var(--rarity-glow-2),inset 0 0 12px var(--rarity-inset)}
/* Raised corner fittings and engraved rails leave the portrait unobstructed. */
.character-card::before{content:'';position:absolute;inset:2px;z-index:4;pointer-events:none;border-radius:5px 0 5px 0;background:linear-gradient(var(--frame-light),var(--rarity-color)) left top/18px 2px no-repeat,linear-gradient(var(--frame-light),var(--rarity-color)) left top/2px 18px no-repeat,linear-gradient(var(--frame-light),var(--rarity-color)) right top/18px 2px no-repeat,linear-gradient(var(--frame-light),var(--rarity-color)) right top/2px 18px no-repeat,linear-gradient(var(--rarity-color),var(--frame-light)) left bottom/18px 2px no-repeat,linear-gradient(var(--rarity-color),var(--frame-light)) left bottom/2px 18px no-repeat,linear-gradient(var(--rarity-color),var(--frame-light)) right bottom/18px 2px no-repeat,linear-gradient(var(--rarity-color),var(--frame-light)) right bottom/2px 18px no-repeat}
.character-card.rarity-epic::before,.character-card.rarity-legendary::before{filter:drop-shadow(0 0 3px var(--rarity-color))}
.card-crest{position:absolute;z-index:5;top:3px;left:50%;transform:translateX(-50%);width:26px;height:22px;display:grid;place-items:center;background:linear-gradient(135deg,var(--frame-dark),#14141e);clip-path:polygon(0 0,100% 0,100% 65%,50% 100%,0 65%);color:var(--frame-light);font:14px/1 Georgia,serif;pointer-events:none}
.character-card.rarity-legendary .card-crest{height:27px;width:30px;color:#fff1ba;font-size:19px;background:linear-gradient(130deg,#79501c,#c08b30,#634017)}
.card-info{background:linear-gradient(125deg,var(--rarity-inset),transparent 70%),repeating-linear-gradient(135deg,#ffffff03 0 1px,transparent 1px 5px),#20202a;border-top:1px solid var(--frame-dark)}
.card-serial{color:var(--frame-light);border-color:var(--frame-dark)}
.card-rarity{border-radius:3px 0 3px 0;box-shadow:0 1px 6px #0008;z-index:5}
.character-card.rarity-legendary::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:3;background:linear-gradient(125deg,transparent 16%,#fff3 17%,transparent 18%,transparent 77%,#ffd66c18 78%,transparent 81%);border:1px solid #ffe6a24d;border-radius:5px 0 5px 0}
.reel-window:not(.is-spinning):not(.landed) .character-card{transform:scale(.92) rotate(var(--idle-tilt,0deg));filter:saturate(.9)}
.reel-window:not(.is-spinning):not(.landed) .character-card.card-tilt-left{--idle-tilt:-2deg}.reel-window:not(.is-spinning):not(.landed) .character-card.card-tilt-right{--idle-tilt:2deg}
.reel-window.landed:not(.is-spinning) .character-card:nth-child(4)>img{border-bottom-color:var(--rarity-color,var(--lime))}.reel-window.landed:not(.is-spinning) .character-card:nth-child(4) .card-series{color:var(--rarity-color,var(--lime))}
.reel-window.is-spinning .character-card{transform:scale(.95)}
@media(max-width:760px){.reel-tools{gap:8px}.reel-tools .text-button{font-size:7px;letter-spacing:0}}
@media(prefers-reduced-motion:reduce){.character-card.rarity-legendary:after{display:none}}

.reel-window:not(.is-spinning):not(.landed) .character-card:nth-child(4){transform:scale(.92) rotate(var(--idle-tilt,0deg));filter:saturate(.9)}
.roster-character{display:flex;align-items:flex-start;gap:12px;min-width:0}.roster-character>img{display:block;width:52px;height:66px;flex:0 0 52px;object-fit:cover;object-position:center 18%;border:1px solid #777284;border-radius:3px;box-shadow:0 3px 10px #0006}.roster-character-copy{min-width:0}.roster-character-copy>strong{display:block}.roster-character-copy>span,.roster-character-copy>small{display:block}
@media(max-width:760px){.roster-character{gap:8px}.roster-character>img{width:42px;height:56px;flex-basis:42px}}
.spin-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}.spin-options button{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;padding:11px 14px;border:1px solid #81748b;background:#1b1725;color:#f1e8f7;font:700 11px 'IBM Plex Mono',monospace;letter-spacing:.07em;text-align:left}.spin-options button:hover:not(:disabled),.spin-options button:focus-visible{border-color:#c9fa73;color:#c9fa73;background:#c9fa7310}.spin-options button:disabled{cursor:not-allowed;opacity:.4}.spin-options small{font:600 9px 'IBM Plex Mono',monospace;letter-spacing:.04em;color:#bbafc8;white-space:nowrap}.spin-options button:disabled small{color:inherit}#draft-action-hint{min-height:18px;margin:8px 0 0!important;color:#d5bded;font:10px 'IBM Plex Mono',monospace;text-align:center}
@media(max-width:540px){.spin-options{grid-template-columns:1fr}.spin-options button{padding:10px 12px}}
.snagged-card{display:flex;align-items:center;gap:11px;margin-top:11px;padding:8px 12px;border:1px solid #d9b45d8c;background:linear-gradient(95deg,#d9b45d21,#1b1725);color:#f4e7c3}.snagged-card img{width:42px;height:48px;object-fit:cover;object-position:center 18%;border:1px solid #d9b45d}.snagged-card span{display:grid;gap:2px}.snagged-card small{font:600 9px 'IBM Plex Mono',monospace;color:#d9b45d;letter-spacing:.06em}.snagged-card strong{font:700 17px 'Barlow Condensed',sans-serif;text-transform:uppercase}
