/* Opt-in layers: the Barracudas artwork, rig and layout remain untouched. */
.team-lineup>img[data-character]{filter:brightness(var(--team-depth-brightness,1)) blur(var(--team-depth-blur,0px)) drop-shadow(0 5px 5px #02071199)}
.individual-team-lineup{position:absolute;inset:0;isolation:isolate;pointer-events:none}
.individual-team-lineup[hidden],.cutout-viewport[hidden],.cutout-controls[hidden]{display:none}
.cutout-unit{position:absolute;transform:translate(-50%,-100%);transform-origin:50% 100%;padding:0;border:0;background:none;transition:left .65s cubic-bezier(.2,.7,.2,1),top .65s,width .65s,height .65s,opacity .45s;pointer-events:none}
button.cutout-unit{pointer-events:auto;outline-offset:4px}
.cutout-sway{display:block;position:absolute;inset:0;transform-origin:50% 100%;animation:cutout-breathe 5.4s ease-in-out var(--phase) infinite alternate;filter:brightness(var(--team-depth-brightness,1)) blur(var(--team-depth-blur,0px));transition:filter .65s ease}
.cutout-image{position:absolute;display:block;max-width:none;max-height:none;pointer-events:none;object-fit:fill;transition:width .65s,height .65s,left .65s,top .65s;filter:drop-shadow(0 2px 2px #02081066)}
.cutout-contact{position:absolute;transform:translate(-50%,-45%);border-radius:50%;background:radial-gradient(ellipse,#01050bf2 5%,#01050bad 36%,transparent 72%);pointer-events:none;transition:left .65s,top .65s,width .65s,height .65s}
/* A soft floor shadow surrounds each measured sole, beneath the original art. */
.individual-team-lineup[data-team=titans] .cutout-contact::before{content:"";position:absolute;inset:-65% -16%;border-radius:inherit;background:radial-gradient(ellipse,#01040a8c 5%,#01040a45 38%,transparent 72%);pointer-events:none}
.cutout-reflection{position:absolute;inset:0;transform:scaleY(-.16);transform-origin:50% 100%;opacity:.1;filter:blur(1.3px);mask-image:linear-gradient(to top,#000,transparent 55%);pointer-events:none}
.cutout-unit[data-hover=true] .cutout-reflection{display:none}
.cutout-unit[data-hover=true] .cutout-contact{opacity:.4;filter:blur(3px)}
.cutout-distant .cutout-sway{filter:brightness(.6) saturate(.5) blur(3px)}
.cutout-distant{pointer-events:none!important}
@keyframes cutout-breathe{from{transform:scaleX(1)}to{transform:scaleX(1.0015)}}
body[data-motion=paused] .cutout-sway{animation-play-state:paused}
.team-art:not(.layered-team)>.individual-team-lineup{display:none}
.team-art.layered-team>.individual-team-lineup{inset:-3% -1% 1% -1%;overflow:visible}
.team-art.layered-team>.league-team-foreground{display:none}
.individual-team-open #ragers-lineup{display:none}
.has-layered-team .league-backdrop{background-size:100% 100%,var(--ground-backdrop-width,auto) var(--ground-backdrop-height,100%)!important;background-position:center,50% var(--ground-backdrop-y,0px)!important;mask-image:linear-gradient(to bottom,#000 var(--ground-backdrop-fade-start,90%),transparent var(--ground-backdrop-fade-end,100%))}
.individual-team-open #layered-garage-backdrop{transform:none!important}
.cutout-viewport{position:absolute;left:29%;right:2%;top:128px;bottom:180px;z-index:1;overflow:visible}
.individual-team-open .shade{z-index:2;opacity:.4}
.individual-team-open .identity{z-index:3;width:23vw;top:calc(clamp(90px,16svh,170px) + 210px)}
.individual-team-open .garage-title{font-size:clamp(32px,4.1vw,64px)}
.individual-team-open #number{display:block}
.individual-team-open .utility{bottom:64px;z-index:4}
.individual-team-open .identity #bio{font-size:12px;line-height:1.7;max-width:250px}
.cutout-controls{position:absolute;z-index:4;left:5vw;right:5vw;bottom:87px;display:grid;gap:10px}
/* The named roster is the visible character navigation; omit the secondary action row. */
.cutout-actions{display:none}
.cutout-actions button{background:#06101bd9;border:1px solid #99c3db44;padding:7px 13px;min-height:36px;font:10px 'Courier New',monospace;letter-spacing:1px}
.cutout-actions button:hover{border-color:var(--accent)}
.cutout-selection{font:9px 'Courier New',monospace;letter-spacing:1.5px;color:#c0d1df;min-width:190px;text-align:center}
.cutout-roster{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.cutout-roster button{display:flex;align-items:center;gap:8px;min-width:0;width:100%;height:var(--player-button-height);min-height:var(--player-button-height);padding:6px 10px;text-align:left;border:1px solid #7aa1ba40;border-bottom:2px solid #5679916b;background:#06111ed9;backdrop-filter:blur(14px);line-height:1.2;transition:background .2s,border-color .2s,box-shadow .2s}
.cutout-roster button[aria-pressed=true]{border-bottom-color:var(--accent);background:#0c2234eb;box-shadow:0 0 20px #38c2ff22}
.cutout-roster button:hover,.cutout-roster button:focus-visible{border-color:#ff6cd8;box-shadow:0 0 20px #ff37c726}
.cutout-roster .mini-number{flex:none}
.cutout-roster .character-name{min-width:0}
.cutout-roster .tech-icon{width:13px;height:13px;flex-basis:13px}
.cutout-sheet-dialog{width:min(1536px,96vw);height:min(94svh,1100px);max-height:94svh;max-width:96vw;overflow:hidden;border:1px solid #98d8f56b;background:#050c14}
.cutout-sheet-dialog[open]{display:flex;flex-direction:column}
.cutout-sheet-dialog header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;flex:none;border-bottom:1px solid #98d8f533}
.cutout-sheet-dialog h2{font:950 24px/.97 var(--character-name-font);margin:3px 0 0;letter-spacing:-.024em;text-transform:uppercase;color:var(--white)}
.cutout-sheet-team{font:9px 'Courier New',monospace;letter-spacing:2px;color:var(--accent)}
.cutout-sheet-dialog button,.cutout-sheet-dialog a{background:#091725;border:1px solid #97b2c342;color:#e2edf4;padding:12px;font:10px 'Courier New',monospace;text-decoration:none;min-height:44px;text-align:center}
.cutout-sheet-dialog header button{font-size:24px;min-width:44px;padding:2px 10px}
.cutout-sheet-canvas{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;display:grid;place-items:center;padding:10px}
.cutout-sheet-canvas img{width:100%;height:100%;max-height:100%;object-fit:contain}
.cutout-sheet-dialog.enlarged .cutout-sheet-canvas{display:block}
.cutout-sheet-dialog.enlarged .cutout-sheet-canvas img{width:1536px;height:1024px;max-width:none;max-height:none}
.cutout-sheet-dialog footer{display:flex;justify-content:space-between;gap:10px;padding:10px 18px;flex:none;border-top:1px solid #98d8f533}
@media(max-width:1000px){.cutout-viewport{left:26%;bottom:185px}.individual-team-open .identity{width:22vw}.cutout-reflection{opacity:.09}}
@media(max-width:760px){
 .cutout-viewport{left:1%;right:1%;top:242px;bottom:232px}
 .individual-team-open:has(.individual-team-lineup[data-focused=true]) .cutout-viewport{left:37%;top:185px;right:2%;bottom:232px}
 .individual-team-open .identity,body.individual-team-open[data-selected=team] .identity{left:calc(6vw + 135px);top:143px;width:calc(88vw - 135px);max-width:none}
 body.individual-team-open[data-selected]:not([data-selected=team]) .identity{left:6vw;top:208px;width:30vw}
 .individual-team-open .garage-title{font-size:clamp(25px,6vw,40px);letter-spacing:-.8px;margin:12px 0}
 .individual-team-open .identity #bio{font-size:10px;line-height:1.6;margin:8px 0}
 .individual-team-open #number{font-size:9px}
 .cutout-controls{bottom:77px;left:5vw;right:5vw;gap:6px}
 .individual-team-open .utility{bottom:48px}
 .cutout-roster{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 .cutout-roster button{gap:7px;padding:6px 8px}
 .cutout-actions{gap:5px;flex-wrap:wrap}.cutout-selection{min-width:75px;font-size:8px;letter-spacing:.7px}
 .cutout-actions button{padding:5px 9px;min-height:44px;min-width:44px;font-size:9px}
 .cutout-actions [data-cutout-sheet]{font-size:8px;letter-spacing:0}
 .cutout-sheet-dialog header{padding:8px 12px}.cutout-sheet-dialog footer{padding:8px;gap:5px;flex-wrap:wrap}.cutout-sheet-dialog footer>*{flex:1;font-size:8px;padding:10px 6px;white-space:nowrap}
}
@media(max-height:700px) and (min-width:761px){.cutout-viewport{top:120px;bottom:175px}.individual-team-open .team-brand{width:155px;top:125px}.individual-team-open .identity{top:275px}.individual-team-open .garage-title{font-size:30px}.individual-team-open .identity #bio{font-size:10px}}
@media(max-height:690px) and (max-width:760px){.cutout-viewport{top:210px;bottom:230px}.individual-team-open .team-brand{top:105px;width:105px}.individual-team-open .identity,body.individual-team-open[data-selected=team] .identity{top:130px;left:calc(6vw + 115px)}body.individual-team-open[data-selected]:not([data-selected=team]) .identity{top:195px;left:5vw}.individual-team-open .garage-title{font-size:25px}.cutout-actions{gap:3px}}
@media(max-height:560px) and (min-width:761px){.individual-team-open .team-brand{top:105px;width:105px}.individual-team-open .identity{top:195px}.individual-team-open .garage-title{font-size:24px;margin:10px 0}.individual-team-open .identity #bio,.individual-team-open .blue-rule{display:none}}
/* Keep the latest return toolbar clear while using the cutout layout's own HUD spacing. */
@media(max-width:760px){
 .individual-team-open #garage-route .team-brand,.individual-team-open #garage-route .identity{margin-top:0}
 .individual-team-open #garage-route .team-brand{top:calc(var(--garage-toolbar-top) + 64px);width:80px}
 body.individual-team-open[data-selected=team] #garage-route .identity{top:148px;left:calc(6vw + 100px);width:calc(88vw - 100px)}
 body.individual-team-open[data-selected]:not([data-selected=team]) #garage-route .identity{top:235px}
 .cutout-viewport{top:225px}
}
@media(max-height:560px) and (min-width:761px){
 .individual-team-open #garage-route .team-brand,.individual-team-open #garage-route .identity{margin-top:0}
 .individual-team-open #garage-route .team-brand{top:160px;width:80px}
 .individual-team-open #garage-route .identity{top:160px;left:calc(5vw + 95px);width:calc(24vw - 100px)}
}
@media(max-height:620px) and (max-width:760px){
 body.individual-team-open[data-selected]:not([data-selected=team]) .identity #bio{display:none}
 .individual-team-open .garage-title{font-size:22px;margin:6px 0}
}
@media(prefers-reduced-motion:reduce){.cutout-unit,.cutout-image,.cutout-contact,.cutout-sway{transition:none}.cutout-sway{animation:none}}
/* Use the Barracudas' compact right-hand roster area, leaving the bio clear. */
.cutout-controls{left:calc(42% - var(--player-nav-shift));right:calc(5% + var(--player-nav-shift));bottom:76px;max-width:840px;margin-inline:auto}
/* Six names need a second row sooner than the five-name Barracudas roster. */
@media(min-width:761px) and (max-width:1360px){
 .cutout-controls{max-width:440px}
 .cutout-roster{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1700px){.cutout-roster .arrow{display:none}}
@media(max-width:760px){
 .cutout-controls{left:calc(6vw - var(--player-nav-shift));right:calc(6vw + var(--player-nav-shift));bottom:calc(72px + env(safe-area-inset-bottom,0px))}
}

/* On mobile, introduce the team beside the crest instead of over the cast. */
@media(max-width:760px){
 body[data-selected=team]:not(.individual-team-open) #garage-route .identity{top:var(--garage-logo-base-top)}
 body.individual-team-open[data-selected=team] #garage-route .identity{top:calc(var(--garage-toolbar-top) + 64px)}
 body[data-selected=team] #garage-route .identity .eyebrow{margin-top:0}
}