/* Full-width, click-safe, container-aware Boat Index. */
.fgi-index{position:relative!important;z-index:2147482990!important;isolation:isolate;container:boats-index / inline-size;display:block!important;width:100%!important;max-width:100%!important;margin-inline:0!important;padding-inline:clamp(10px,2vw,28px);overflow-x:clip!important;box-sizing:border-box!important;pointer-events:auto!important;transform:translateZ(0)}
.fgi-index.fgib-body-mounted{clear:both;width:100%!important;max-width:100vw!important;margin-inline:0!important;overflow-x:clip!important;box-sizing:border-box!important;pointer-events:auto!important}
body.fgib-index-page{overflow-x:clip!important}
.fgi-index:not(.fgib-body-mounted){width:100vw!important;max-width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important}
body.fgib-index-page>.fgi-index.fgib-body-mounted{width:100%!important;max-width:none!important;margin:0!important}
.fgi-index,.fgi-index *{min-width:0}
.fgi-index>.fgi-hero,.fgi-index>.fgi-tools,.fgi-index>.fgi-count,.fgi-index>.fgi-group,.fgi-index>.fgi-empty,.fgi-grid,.fgi-card,.fgi-card-button,.fgi-panel{width:100%;max-width:100%;box-sizing:border-box}
.fgi-grid{grid-template-columns:1fr}
.fgi-card.is-open{grid-column:1/-1}
.fgi-tools{grid-template-columns:1fr}
.fgi-card-button{grid-template-columns:70px minmax(0,1fr) 28px;gap:9px}
.fgi-image{width:70px;max-width:100%}
.fgi-rarity{grid-column:2;justify-self:start}
.fgi-plus{grid-column:3;grid-row:1/3}
.fgi-name strong,.fgi-name small,.fgi-stat strong{overflow-wrap:anywhere;word-break:normal}
.fgi-panel{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}

/* Fluid game profile layout. */
.fgi-profile-console{width:min(1100px,calc(100% - 24px));max-width:100%;grid-template-columns:minmax(180px,clamp(220px,28vw,320px)) minmax(0,1fr);gap:clamp(10px,2vw,20px);padding:clamp(10px,1.5vw,18px)}
.fgi-profile-image{max-height:clamp(180px,32vh,320px)}
.fgi-profile-photo{max-height:clamp(180px,32vh,320px)!important}
.fgi-profile-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.fgi-profile-notes{width:min(1100px,calc(100% - 24px))}

@container boats-index (min-width:720px){
  .fgi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fgi-tools{grid-template-columns:minmax(220px,1fr) repeat(2,minmax(150px,220px))}
  .fgi-card-button{grid-template-columns:78px minmax(0,1fr) auto 28px}
  .fgi-image{width:78px}
  .fgi-rarity{grid-column:3}
  .fgi-plus{grid-column:4;grid-row:1}
}

@container boats-index (min-width:1140px){
  .fgi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fgi-card-button{grid-template-columns:84px minmax(0,1fr) auto 30px}
  .fgi-image{width:84px}
}

@media(max-width:900px){
  .fgi-profile-console{grid-template-columns:minmax(150px,240px) minmax(0,1fr)}
  .fgi-profile-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:680px){
  .fgi-index{padding-inline:10px}
  .fgi-group{padding:9px}
  .fgi-card-button{grid-template-columns:70px minmax(0,1fr) 28px;gap:9px}
  .fgi-image{width:70px}
  .fgi-rarity{grid-column:2}
  .fgi-plus{grid-column:3;grid-row:1/3}
  .fgi-panel{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fgi-profile-console{width:calc(100% - 12px);grid-template-columns:minmax(100px,32vw) minmax(0,1fr);gap:8px;padding:8px}
  .fgi-profile-image,.fgi-profile-photo{max-height:min(32vw,160px)!important}
  .fgi-profile-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
}

@media(max-width:400px){
  .fgi-card-button{grid-template-columns:62px minmax(0,1fr) 26px;padding:8px}
  .fgi-image{width:62px}
  .fgi-panel{grid-template-columns:1fr}
  .fgi-profile-console{grid-template-columns:90px minmax(0,1fr)}
  .fgi-profile-image,.fgi-profile-photo{max-height:90px!important}
}

.fgi-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;width:min(1500px,calc(100% - 20px));margin:0 auto 12px;padding:8px;border:1px solid #2b4e58;border-radius:11px;background:#091920;color:#f3fcff;font-family:Inter,system-ui,sans-serif;box-sizing:border-box}
.fgi-index>.fgi-nav{width:100%}
.fgi-nav div{display:flex;gap:7px}
.fgi-nav a,.fgi-nav button{display:inline-flex;min-height:40px;align-items:center;justify-content:center;padding:8px 12px;border:1px solid #37645f;border-radius:8px;background:#0d252c;color:#5df3df!important;font-size:12px;font-weight:800;line-height:1;text-decoration:none!important;cursor:pointer}
.fgi-nav a:hover,.fgi-nav button:hover{border-color:#5df3df;background:#12353b}
@media(max-width:480px){.fgi-nav{align-items:stretch;flex-direction:column}.fgi-nav div{display:grid;grid-template-columns:1fr 1fr}.fgi-nav button{width:100%}}
.fgi-hero,.fgi-tools,.fgi-count,.fgi-group,.fgi-grid,.fgi-card,.fgi-card-button,.fgi-panel,.fgi-tools label,.fgi-tools input,.fgi-tools select,.fgi-profile-link{position:relative;pointer-events:auto!important}
.fgi-hero,.fgi-tools,.fgi-count,.fgi-group,.fgi-grid{z-index:10}.fgi-card{z-index:20}.fgi-card-button,.fgi-panel,.fgi-tools label,.fgi-tools input,.fgi-tools select,.fgi-profile-link{z-index:30;touch-action:manipulation}
.fgi-card-button>*{pointer-events:none}.fgi-card-button:before{content:none!important;display:none!important;pointer-events:none!important}
