.character-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:-3px 0 17px;font-size:9px;letter-spacing:1.5px;color:#bad2db}.character-toolbar b{font-size:8px;color:#8fe7c8}.character-locker{display:grid;grid-template-columns:minmax(230px,.88fr) minmax(0,1.4fr);gap:22px;align-items:start}.character-preview-panel{position:sticky;top:0;min-width:0;border:1px solid #b4e3ec25;border-radius:12px;background:linear-gradient(145deg,#29516088,#0d273be8);overflow:hidden}.character-preview-stage{position:relative;height:310px;background:radial-gradient(ellipse at 50% 55%,#5d9b852e,transparent 67%);overflow:hidden}.character-preview-stage canvas{position:relative;width:100%;height:100%;display:block;touch-action:none;cursor:grab}.character-preview-stage canvas:active{cursor:grabbing}.character-orbit{position:absolute;inset:35px 18px;border:1px solid #9de6d51c;border-radius:50%;transform:rotate(-18deg)}.character-orbit:after{content:'';position:absolute;inset:18px -12px;border:1px solid #b6e5ee15;border-radius:50%;transform:rotate(35deg)}.character-rotate{position:absolute;bottom:6px;left:0;right:0;text-align:center;pointer-events:none;font-size:8px;letter-spacing:1.5px;color:#c0d9df}.character-details{padding:17px 18px 19px;border-top:1px solid #a2dfc52b}.character-details>small{font-size:8px;letter-spacing:1.7px;color:#98e2c5}.character-details h3{font-family:'Arial Black',Arial,sans-serif;font-size:24px;line-height:1.15;margin:7px 0 8px;letter-spacing:-.5px}.character-details>p{font-size:10px;line-height:1.65;color:#b4ced5;min-height:48px;margin:0 0 14px}.character-hand-match{display:flex;gap:10px;align-items:center;background:#0d263b9e;border:1px solid #d8ecdc20;border-radius:6px;padding:9px 10px}.character-hand-match>span{width:30px;height:31px;border-radius:3px;box-shadow:inset -7px -6px 0 #0002;border:1px solid #ffffff38}.character-hand-match div{flex:1;display:grid;gap:5px}.character-hand-match strong{font-size:8px;letter-spacing:.7px}.character-hand-match small{font-size:8px;color:#9fbec8}.character-hand-match>b{color:#86e8bd}.character-details .primary{margin-top:14px;padding:14px;font-size:10px}.character-details .primary:disabled{background:#305b58;color:#b9e6d8;opacity:1;cursor:default;box-shadow:none}#characterEquipped{display:block;font-size:8px;color:#9ccebd;text-align:center;letter-spacing:.7px;min-height:10px;margin-top:10px}.character-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.character-card{position:relative;overflow:hidden;text-align:left;padding:0;min-width:0;border:1px solid #a9d5d82b;border-radius:9px;background:linear-gradient(145deg,#36576580,#17374ace);transition:border-color .16s,background .16s,transform .16s}.character-card:hover{border-color:#b4ecd58a;transform:translateY(-2px)}.character-card.selected{border-color:#8ae4c6;background:linear-gradient(145deg,#3c746980,#1b4a4fe6);box-shadow:0 0 0 1px #8ae4c64a}.character-card-art{display:block;height:142px;background:radial-gradient(ellipse at 50% 50%,color-mix(in srgb,var(--outfit) 55%,transparent),transparent 70%)}.character-card-art svg{width:100%;height:100%;filter:drop-shadow(0 6px 6px #071a3155)}.character-card-copy{display:grid;gap:6px;padding:10px 11px 13px;border-top:1px solid #b7deca20;background:#09243745}.character-card-copy small{font-size:7px;color:#a2c9c8;letter-spacing:.8px}.character-card-copy strong{font-size:10px;font-weight:900;letter-spacing:.5px;white-space:nowrap}.character-card-check{display:none;position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;background:#91e8c3;color:#193c36;font-size:11px;place-items:center}.character-card.selected .character-card-check{display:grid}.character-card.is-equipped:after{content:'EQUIPPED';position:absolute;top:10px;left:8px;font-size:6px;letter-spacing:1px;color:#b8f4d9;background:#113729db;padding:4px 5px;border-radius:3px}#characterFallback{position:absolute;inset:8px 0 18px;text-align:center}#characterFallback svg{width:100%;height:100%}.lobby-character-name{display:block;color:#c5e9e4;font-size:8px;letter-spacing:1px;margin-top:6px}.pause-actions{flex-wrap:wrap}.pause-actions button{min-width:65px}
@media(max-width:700px){.character-locker{grid-template-columns:1fr;gap:14px}.character-preview-panel{position:static;display:grid;grid-template-columns:42% 58%}.character-preview-stage{height:260px}.character-details{padding:14px 12px;border-top:0;border-left:1px solid #b7deca20}.character-details h3{font-size:20px}.character-details>p{font-size:9px;min-height:0;margin-bottom:10px}.character-hand-match{padding:7px;gap:7px}.character-hand-match>span{width:22px;height:25px}.character-hand-match small{font-size:7px}.character-hand-match strong{font-size:7px}.character-details .primary{padding:11px 9px;font-size:8px}.character-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.character-card-art{height:119px}.character-card-copy{padding:9px 7px}.character-card-copy strong{font-size:8px;letter-spacing:0}.character-card-copy small{font-size:6px;letter-spacing:.2px}.character-toolbar{font-size:8px;letter-spacing:.8px}.character-toolbar b{font-size:7px}}
@media(max-width:390px){.character-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.character-preview-panel{grid-template-columns:38% 62%}.character-details{padding:12px 9px}.character-details h3{font-size:18px}.character-hand-match small{display:none}.character-preview-stage{height:245px}}
@media(prefers-reduced-motion:reduce){.character-card{transition:none}.character-card:hover{transform:none}}