.stats-grid,.saga-rewards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin:24px 0}.stats-grid article,.saga-rewards article{background:#192a38;border:1px solid #bfa77855;padding:22px}.stats-grid strong{display:block;font-size:24px;margin-top:12px}.saga-rewards progress{width:100%;accent-color:#cbb077}.saga-rewards button{display:block;width:100%;margin-top:10px;min-height:44px}.saga-rewards .locked{opacity:.65}.cosmetic-defaults,.retry-options{display:flex;flex-wrap:wrap;gap:12px}.cosmetic-defaults button[aria-pressed=true],.saga-rewards button[aria-pressed=true]{border-color:#e5c688;background:#52472d}.cosmetic-frame{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;pointer-events:none;z-index:5;object-fit:fill}.board{position:relative;background-size:cover;background-position:center}.capture-aura{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:12;overflow:visible}.capture-aura g{color:#8cffb3}.aura-same{color:#8cffb3!important}.aura-plus{color:#ff6475!important}.aura-combo{color:#ffda71!important}.aura-preview{color:#c7f4ff!important}.capture-aura path{fill:none;stroke:currentColor;stroke-width:3;filter:drop-shadow(0 0 5px currentColor);stroke-linecap:round;stroke-dasharray:9 3;animation:aura-flow .5s linear infinite}.capture-aura circle{fill:none;stroke:currentColor;stroke-width:2;filter:drop-shadow(0 0 5px currentColor);opacity:.8}.capture-aura:not(.preview-aura),.capture-label{animation:aura-fade 1.6s forwards}.capture-label{position:absolute;top:42%;left:0;width:100%;text-align:center;font-size:clamp(18px,4vw,32px);font-weight:800;letter-spacing:3px;pointer-events:none;z-index:13;text-shadow:0 2px 8px #000,0 0 16px currentColor}.capture-label span{display:inline-block;background:#101c28dc;padding:8px;border-radius:6px}.preview-readout{position:absolute;bottom:0;left:0;right:0;z-index:14;background:#102635ed;color:#e4faff;text-align:center;font-size:12px;padding:9px;pointer-events:none}.board .empty{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.retry-options button{min-height:48px;flex:1 1 190px}nav{flex-wrap:wrap}@keyframes aura-flow{to{stroke-dashoffset:-24}}@keyframes aura-fade{0%{opacity:0}15%,75%{opacity:1}100%{opacity:0}}@media(prefers-reduced-motion:reduce){.capture-aura path{animation:none}.capture-aura:not(.preview-aura),.capture-label{animation:none}.capture-aura path{stroke-dasharray:none}}@media(max-width:600px){.stats-grid,.saga-rewards{grid-template-columns:1fr}.cosmetic-defaults button{flex:1 1 120px}}

.card .art.corrected-art{position:absolute;inset:10% 3% 15%;width:auto;height:auto;overflow:hidden;background:radial-gradient(ellipse,#c2d5df22,transparent 75%)}.corrected-art svg{display:block;width:100%;height:100%;overflow:hidden}.cosmetic-frame{z-index:4}.ranks,.card-name{z-index:6!important}

/* The supplied 776 x 997 artwork already contains the complete grid. */
.board.saga-board{display:block;aspect-ratio:776/997;padding:0;border:0;background-size:100% 100%;background-repeat:no-repeat;box-shadow:none;isolation:isolate}.board.saga-board>.cell{position:absolute;width:29.639175%;height:30.491475%;aspect-ratio:auto;margin:0;border-color:transparent;background:transparent;box-sizing:border-box;min-height:0}.board.saga-board>.cell:nth-child(3n+1){left:3.865979%}.board.saga-board>.cell:nth-child(3n+2){left:35.180412%}.board.saga-board>.cell:nth-child(3n){left:66.365979%}.board.saga-board>.cell:nth-child(-n+3){top:3.009027%}.board.saga-board>.cell:nth-child(n+4):nth-child(-n+6){top:34.704112%}.board.saga-board>.cell:nth-child(n+7):nth-child(-n+9){top:66.399198%}.board.saga-board>.cell.empty>span{visibility:hidden}.board.saga-board>.cell.available{border-color:#d6b37899}.board.saga-board>.cell.empty:not(:disabled):hover{background:#759ca625;border-color:var(--gold)}.board.saga-board>.cell.drop-valid{border:2px dashed #b2e6ff;background:#4389ac20}.board.saga-board>.cell.drop-target{border:2px solid #ffe1a0;background:#d6b37833;box-shadow:0 0 18px #e3c38a88}.board-thumbnail{display:block;width:100%;max-width:220px;aspect-ratio:776/997;object-fit:contain;margin:16px auto;border-radius:4px}

/* Personal skins sit over the artwork; ranks are a clean top layer. */
.card.saga-framed .cosmetic-frame{z-index:2;object-fit:fill;pointer-events:none}
.card.saga-framed:after{display:none}
.card.saga-framed .art,.card.saga-framed .art.corrected-art{z-index:0}
.card.saga-framed .art.sprite-art{inset:0;background:transparent}
.card.saga-framed .card-name{z-index:5}
.card.saga-framed .art.sprite-art img{left:8%;top:14%;width:84%;height:72%;max-width:84%}
.card.saga-frame-1 .cosmetic-frame,.card.saga-frame-4 .cosmetic-frame{filter:url(#frame-white-key)}
.card .art.sprite-art img[alt='Zack']{transform:scale(2.4);transform-origin:center}

.card.saga-framed .ranks,.card.saga-framed:has(.sprite-art) .ranks,.card.saga-framed .ranks b{z-index:6;background:none;box-shadow:none;text-shadow:none;filter:none;border:0}
.motion-settings{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin:20px 0}.motion-settings label{display:flex;align-items:center;gap:8px}.motion-settings small{width:100%;color:#b5c7d9}
/* Constrain reward previews independently of source-image dimensions. */
.saga-rewards>article{min-width:0}
.saga-rewards .frame-thumbnail{display:block;width:112px;max-width:100%;height:164px;object-fit:contain;margin:16px auto}