.ib-band{--ib-h:200px;--ib-plate:72px;--ib-tab:44px;--ib-slash:.249;--ib-gut:24px;--ib-max:1180px;
  --ib-field:#222;--ib-stroke:transparent;--ib-logo-d:148px;--ib-logo:var(--ib-logo-d);--ib-run:calc(var(--ib-h) * var(--ib-slash));
  --ib-seam:min(calc(50% + 450px),calc(100% - 90px));position:relative;height:var(--ib-h);
  margin-bottom:calc(var(--ib-plate) / 2);color:#fff}
.ib-field{position:absolute;inset:0;background:var(--ib-field);
  clip-path:polygon(0 0,calc(var(--ib-seam) + var(--ib-run)) 0,var(--ib-seam) 100%,0 100%)}
.ib-field::after{content:"";position:absolute;inset:0;background:var(--ib-stroke);
  clip-path:polygon(calc(var(--ib-seam) + var(--ib-run) - 7px) 0,calc(var(--ib-seam) + var(--ib-run)) 0,
  var(--ib-seam) 100%,calc(var(--ib-seam) - 7px) 100%)}
.ib-wrap{position:relative;max-width:var(--ib-max);margin:0 auto;padding:0 var(--ib-gut);height:100%}
.ib-who{position:absolute;left:var(--ib-gut);top:41%;transform:translateY(-50%);max-width:54%}
.ib-name{margin:0;font-family:Archivo,"Helvetica Neue",Arial,sans-serif;font-stretch:78%;font-weight:800;
  line-height:.92;letter-spacing:-.01em;color:#fff}
.ib-first{display:block;font-weight:400;font-size:clamp(18px,1.5vw,24px);margin-bottom:4px}
.ib-last{display:block;font-weight:800;font-size:clamp(40px,4.4vw,66px);margin-left:-.03em}
.ib-last.ib-long{font-size:clamp(32px,3.5vw,52px)}
.ib-meta{margin:10px 0 0;font-size:15px;font-weight:500;line-height:1.4}
.ib-meta>span{display:block}
.ib-m2{font-weight:400;opacity:.88}
.ib-no{font-family:Archivo,"Helvetica Neue",Arial,sans-serif;font-stretch:78%;font-weight:800;font-size:21px;
  margin-right:4px;vertical-align:-1px}
.ib-band a{color:inherit}
.ib-band .ib-meta a,.ib-band .ib-first a{text-decoration:underline;text-decoration-color:rgba(255,255,255,.55);
  text-underline-offset:3px;text-decoration-thickness:1px}
.ib-band a:hover{opacity:.8}
.ib-band a:focus-visible{outline:2px solid #fff;outline-offset:3px}
.ib-logo{position:absolute;top:50%;transform:translateY(-50%);left:calc(var(--ib-seam) - var(--ib-logo) - 44px);
  width:var(--ib-logo);height:var(--ib-logo);display:block}
.ib-logo img{width:100%;height:100%;object-fit:contain;display:block}
.ib-letters{position:absolute;inset:0;margin:auto;width:92px;height:92px;border:1px solid rgba(255,255,255,.55);
  border-radius:3px;display:grid;place-items:center;font-family:Archivo,sans-serif;font-stretch:78%;
  font-weight:800;font-size:34px;color:#fff}
.ib-closed .ib-field,.ib-closed .ib-logo{filter:saturate(.3)}
.ib-plate{position:absolute;left:var(--ib-gut);bottom:calc(var(--ib-plate) / -2);height:var(--ib-plate);
  display:flex;background:#d9d9d3;
  clip-path:polygon(0 0,100% 0,calc(100% - var(--ib-plate) * var(--ib-slash)) 100%,0 100%);
  padding:1px calc(var(--ib-plate) * var(--ib-slash)) 1px 1px}
.ib-plate-in{display:flex;background:#fff;
  clip-path:polygon(0 0,100% 0,calc(100% - var(--ib-plate) * var(--ib-slash) + 1px) 100%,0 100%);
  margin-right:calc(var(--ib-plate) * var(--ib-slash) * -1);padding-right:calc(var(--ib-plate) * var(--ib-slash) + 10px)}
.ib-cell{display:grid;grid-template-rows:15px 36px 15px;align-content:center;padding:0 20px;
  border-left:1px solid #e7e7e2;min-width:128px;color:#222;text-decoration:none}
.ib-cell:first-child{border-left:0}
.ib-cell small{align-self:end;font-size:12.5px;font-weight:700;color:#686862;line-height:15px}
.ib-cell b{align-self:end;font-family:Archivo,sans-serif;font-stretch:78%;font-weight:800;font-size:28px;
  line-height:36px;color:#191919;white-space:nowrap}
.ib-cell.ib-loud b{font-size:34px;font-weight:900}
.ib-cell i{font-style:normal;font-size:12.5px;line-height:15px;color:#686862;white-space:nowrap}
a.ib-cell i{text-decoration:underline;text-decoration-color:#bdbdb6;text-underline-offset:2px;text-decoration-thickness:1px}
a.ib-cell:hover{opacity:.72}
a.ib-cell:focus-visible{outline:2px solid #1d68a3;outline-offset:3px}
.ib-blue{color:#1d68a3!important}.ib-gold{color:#8a6200!important}.ib-w{color:#3a7a4b}.ib-l{color:#bf3b31}
@media (max-width:1180px){.ib-cell.ib-opt{display:none}}
.ib-tabsbar,.ib-sbar{border-bottom:1px solid #e7e7e2;background:#fff}
.ib-tabs{max-width:1180px;margin:0 auto;padding:0 24px;display:flex;gap:30px;height:44px;overflow-x:auto;
  scrollbar-width:none}
.ib-tabs::-webkit-scrollbar{display:none}
.ib-tabs a{display:flex;align-items:center;font-size:15px;font-weight:600;color:#45453f;text-decoration:none;
  white-space:nowrap;position:relative}
.ib-tabs a:hover{opacity:.7}
.ib-tabs a.ib-cut{opacity:.4}
/* More tabs wholly off to the right (phone): a flat chevron on white at the bar's edge, set by the script while
   the row can still scroll right and removed at the end. No class, no marker, so a row that fits is unchanged.
   min-width:0 lets the compact bar's tab nav shrink in its flex row so its tabs scroll instead of running off-screen. */
.ib-more{position:relative}
.ib-sbar-tabs{min-width:0}
.ib-more::after{content:"\203A";content:"\203A"/"";position:absolute;top:0;right:0;bottom:0;width:28px;display:flex;
  align-items:center;justify-content:center;background:#fff;color:#45453f;font-size:22px;font-weight:600;pointer-events:none}
.ib-tabs a[aria-current],.ib-tabs a[aria-selected=true]{color:#191919;font-weight:700}
.ib-tabs a[aria-current]::after,.ib-tabs a[aria-selected=true]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:#191919}
.ib-tabs a:focus-visible{outline:2px solid #1d68a3;outline-offset:3px}
.ib-mood{color:#8a6200;font-weight:600;margin-left:6px}
.ib-status{max-width:1180px;margin:0 auto;padding:10px 24px 0;font-size:14.5px;line-height:1.4;color:#45453f}
p.tp-crown__av.ib-av{max-width:1180px;margin:0 auto;padding:10px 24px 0;font-size:14.5px;line-height:1.4;font-weight:700;color:#191919}
p.tp-crown__av.ib-av[hidden]{display:none}
.ib-sbar{position:fixed;top:0;left:0;right:0;z-index:30;height:44px;display:flex;align-items:center;gap:12px;padding:0 24px}
.ib-sbar[hidden]{display:none}
.ib-id{display:flex;align-items:center;gap:10px;text-decoration:none;color:#191919}
.ib-id img{width:26px;height:26px;object-fit:contain}
.ib-nm{font-family:Archivo,sans-serif;font-stretch:78%;font-weight:800;font-size:21px;line-height:1;white-space:nowrap}
.ib-sub{font-size:14px;color:#686862;white-space:nowrap}
.ib-div{width:1px;height:22px;background:#d9d9d3;margin:0 8px}
.ib-sbar .ib-tabs{padding:0;gap:26px;margin:0}
@media (max-width:600px){
  .ib-band{--ib-h:168px;--ib-gut:16px;--ib-logo:104px;--ib-seam:87%}
  .ib-wrap{position:static}
  .ib-who{max-width:calc(var(--ib-seam) - var(--ib-logo) - 32px - var(--ib-gut));top:50%;overflow-wrap:break-word}
  .ib-first{font-size:16px;margin-bottom:2px}
  .ib-last{font-size:40px}.ib-last.ib-long{font-size:30px}
  .ib-meta{font-size:13px;margin-top:8px}.ib-no{font-size:18px}
  .ib-who.ib-tight .ib-sz{display:none}
  .ib-logo{left:calc(var(--ib-seam) - var(--ib-logo) - 20px)}
  .coach-banded .ib-band{--ib-logo:min(104px,22vw)}
  /* Cells share the row equally (thirds when three fit, as the old 1fr grid: equal border-box bases, so the first
     cell's wider padding does not skew them), but a cell never shrinks below its label or value (min-width:auto;
     the b is nowrap and the small counts at its full width): a long one ("297-71-1", "at Eastern Washington")
     takes the room it needs from its neighbours, and when the row cannot hold them all the last cell wraps to a
     second row. */
  .ib-plate{position:absolute;top:100%;bottom:auto;left:0;right:0;height:auto;display:flex;flex-wrap:wrap;
    clip-path:none;background:#fff;padding:0;border-bottom:1px solid #e7e7e2}
  .ib-plate-in{display:contents}
  .ib-cell{padding:8px 12px;box-sizing:border-box;flex:1 1 40px;min-width:auto;grid-template-rows:16px 32px auto;
    align-content:start;min-height:84px}
  .ib-cell small{min-width:min-content}
  .ib-cell:first-child{padding-left:16px}
  .ib-cell b{font-size:24px;line-height:32px}.ib-cell.ib-loud b{font-size:27px}
  .ib-cell i{white-space:normal;line-height:15px}
  .ib-tabs{padding:0 16px;gap:18px}.ib-tabs a{font-size:14px}
  .ib-status{padding:8px 16px 0;font-size:13.5px}
  p.tp-crown__av.ib-av{padding:8px 16px 0;font-size:13.5px}
  .ib-sbar{padding:0 16px;gap:10px}.ib-sbar .ib-tabs{gap:16px}
  .ib-id img{width:24px;height:24px}
}
.ib-band.ib-noplate{margin-bottom:0}
.ib-tabsbar~.tp-panel>.tp-shell:first-child{padding-top:8px}
.ib-tabsbar~.tp-panel .hub-top{margin-top:0}

/* Team pages (D-180 slice 2). The band lines up with .content (1100px, the page's clamp gutter) and the page's
   own .team-tabs nav is the tab bar: ib-tabsbar unsticks it under the band (position:relative keeps the
   hscroll fades and the indicator anchored to the row), the wrapper carries the rule, and the type matches the
   player bar. tab-spine.js still owns the row: tb-* ids, aria-controls, the appended .tabs-jump button. */
.ib-team .ib-band{--ib-max:1100px;--ib-gut:clamp(16px,4vw,32px)}
.ib-tabswrap{border-bottom:1px solid #e7e7e2;background:#fff}
.team-tabs.ib-tabsbar{position:relative;top:auto;z-index:auto;margin:0 auto;max-width:1100px;height:44px;
  padding:0 clamp(16px,4vw,32px);gap:30px;border-bottom:0;background:#fff}
.team-tabs.ib-tabsbar .tab-btn{padding:0;margin-bottom:0;height:44px;gap:0;font-size:15px;font-weight:600;
  color:#45453f;border-bottom:0}
.team-tabs.ib-tabsbar .tab-btn[aria-selected=true],.team-tabs.ib-tabsbar .tab-btn[aria-current=page]{color:#191919;font-weight:700}
.team-tabs.ib-tabsbar .tab-indicator{background:#191919}
.team-tabs.ib-tabsbar .tab-glyph{display:none}
.team-tabs.ib-tabsbar .tabs-jump{height:44px;min-height:0;margin-right:calc(clamp(16px,4vw,32px) * -1);padding:0 16px}
.ib-tabswrap+.ib-sbar~main .tp-subnav,.ib-tabswrap~main .tp-subnav{top:44px}
/* Flag-off the section nav sits right under the tab bar inside .content; with the tab bar moved above <main>,
   .content's 24px top padding opened an empty strip over the section nav (S2.3). Pull the rows back up. */
.ib-tabswrap~main .content>.tp-subnav,.ib-pin~main .content>.tp-subnav{margin-top:-24px}
/* The hub's section nav (S2.4): one 44px bar like the tab bar above it (DESIGN.md: every bar 44px, one
   component), still pinned at 44px, with an 8px gap to the first module instead of 16px plus 4px of padding. On
   phones it does not show at all: the tab bar's "Jump to" button opens the same links (tab-spine.js reads them
   from this row, so it stays in the DOM, and scroll-spy still marks the active one for the sheet). */
.ib-tabswrap~main .content>.tp-subnav{height:44px;box-sizing:border-box;padding:0;margin-bottom:8px}
.ib-tabswrap~main .content>.tp-subnav .tp-subnav__link{min-height:43px}
@media (max-width:640px){
  .ib-tabswrap~main .content>.tp-subnav{display:none}
  /* with the row gone its -24px pull-up goes too; drop the column's top padding so the first module sits the
     same 8px under the tab bar it sits under the section nav on desktop */
  .ib-tabswrap~main .content{padding-top:0}
}
@media (max-width:600px){
  .team-tabs.ib-tabsbar{gap:18px}.team-tabs.ib-tabsbar .tab-btn{font-size:14px}
  /* A plate's sub-lines wrap ("3-2 SEC · T-4th", "of 1,290 tenures since 1937"), so its height is not fixed: on
     phones it sits in flow under a band whose field, name block and logo keep the 168px top, instead of hanging
     off a fixed margin that a third line ran past into the tab bar. Every band (team, coach, player). */
  .ib-band{height:auto;margin-bottom:0}
  .ib-field{bottom:auto;height:var(--ib-h)}
  .ib-wrap{height:auto;padding:var(--ib-h) 0 0}
  .ib-who,.ib-logo{top:calc(var(--ib-h) / 2)}
  .ib-plate{position:relative;top:auto}
}
/* Team sub-pages (Fans, Stats, History; D-180 slice 2.2): no band. The compact bar is the identity, shown from
   load in flow under the site header and pinned once that scrolls away (sticky, not fixed, so it never covers
   the header), lined up with the page column. It carries the page's own .team-tabs nav, so there is one 44px
   row and the section nav pins at 44px under it as before. The team name is the page's h1. Phones: two rows,
   name then tabs, stuck at -44px so the name scrolls off and only the tab row stays pinned. */
.ib-sbar.ib-pin{position:sticky;top:0;z-index:50;padding:0 max(clamp(16px,4vw,32px),calc((100% - 1100px) / 2 + clamp(16px,4vw,32px)))}
.ib-pin .ib-nm{margin:0;line-height:1;white-space:nowrap}
.ib-pin .ib-sub{white-space:nowrap}
.ib-pin .team-tabs.ib-tabsbar{flex:1 1 auto;min-width:0;max-width:none;margin:0;padding:0;background:transparent}
.ib-pin .team-tabs.ib-tabsbar .tabs-jump{margin-right:0}
.ib-pin~main .tp-subnav{top:44px}
@media (max-width:600px){
  .ib-sbar.ib-pin{top:-44px;height:auto;flex-wrap:wrap;gap:0;padding:0}
  .ib-pin .ib-id{flex:1 0 100%;box-sizing:border-box;height:44px;padding:0 16px}
  .ib-pin .ib-div{display:none}
  .ib-pin .team-tabs.ib-tabsbar{flex:1 0 100%;padding:0 0 0 16px;border-top:1px solid #e7e7e2}
}

/* ---- P2: one bar (CFB_BAND_ONE_BAR). Every rule below keys on .ib-one, a class only the one-bar markup carries, so a
   page without the switch is untouched. The section row (nav.tp-subnav, a popover) leaves the flow and the bar's right
   slot opens it: "Schedule  Roster  Jump to" from 1000px up, "Jump to" alone below. The hub's tab bar and the fixed
   compact bar swap (identity-band.js), so only one bar is ever pinned. */
.ib-tabswrap.ib-one,.ib-sbar.ib-one{padding:0 max(clamp(16px,4vw,32px),calc((100% - 1100px) / 2 + clamp(16px,4vw,32px)))}
.ib-tabswrap.ib-one{display:flex;align-items:center}
.ib-one .team-tabs.ib-tabsbar{flex:1 1 auto;min-width:0;max-width:none;margin:0;padding:0;background:transparent}
.ib-one .ib-sbar-tabs{flex:1 1 auto;min-width:0}
.ib-slot{display:flex;align-items:stretch;flex:none;height:44px}
.ib-q,.ib-jump{display:flex;align-items:center;box-sizing:border-box;height:100%;margin:0;padding:0 12px;border:0;background:none;
  font:600 15px/1 Archivo,"Helvetica Neue",Arial,system-ui,sans-serif;color:#191919;white-space:nowrap;cursor:pointer;
  text-decoration:underline;text-decoration-color:#191919;text-underline-offset:3px}
@media (min-width:641px){.ib-slot>:last-child{padding-right:0}}
.ib-q:hover,.ib-jump:hover{opacity:.7}
.ib-q:focus-visible,.ib-jump:focus-visible{outline:2px solid #1d68a3;outline-offset:-2px}
.ib-q{display:none}
@media (min-width:1000px){.ib-q{display:flex}}
@media (max-width:640px){
  .ib-tabswrap.ib-one,.ib-sbar.ib-one:not(.ib-pin){padding:0 0 0 16px;gap:0}
  .ib-jump{border-left:1px solid #e7e7e2;padding:0 14px;margin-left:8px;font-size:13px;text-decoration-color:currentColor}
  /* the phone compact bar drops the name and record to make room for Jump to (owner ruling) */
  .ib-sbar.ib-one:not(.ib-pin) .ib-id,.ib-sbar.ib-one:not(.ib-pin) .ib-div{display:none}
}
@media (max-width:600px){
  /* sub-pages: name row stays two rows; the tab row now also holds the slot */
  .ib-sbar.ib-pin.ib-one{padding:0}
  .ib-pin.ib-one .team-tabs.ib-tabsbar{flex:1 1 0;padding:0 0 0 16px;border-top:1px solid #e7e7e2}
  .ib-pin.ib-one .ib-slot{height:auto;align-self:stretch;border-top:1px solid #e7e7e2}
}
@supports not selector(:popover-open){
  /* no popover (Chrome before 114, Safari before 17, Firefox before 125): the row stays in flow as it is today */
  .ib-jump{display:none}
}
@supports selector(:popover-open){
  /* the row is the panel: closed it is gone, so .content's 24px top padding would come back (361px, not 349);
     it is zeroed at every width and the first pane takes the 12px gap instead */
  .ib-one~main .content{padding-top:0}
  .ib-one~main .tab-pane{padding-top:12px}
  .ib-one~main .tp-mod{scroll-margin-top:56px}
  .ib-one~main .tp-subnav[popover]:not(:popover-open){display:none}
  .ib-one~main .tp-subnav[popover]:popover-open{display:flex;flex-direction:column;position:fixed;inset:auto;top:100px;right:16px;
    left:auto;width:250px;max-height:70vh;height:auto;margin:0;padding:0;overflow:auto;background:#fff;
    border:1px solid #d9d9d3;border-radius:3px;z-index:100}
  .ib-one~main .tp-subnav[popover]::before,.ib-one~main .tp-subnav[popover]::after{display:none}
  .ib-one~main .tp-subnav[popover]::backdrop{background:transparent}
  .ib-one~main .tp-subnav[popover] .tp-subnav__link{display:flex;align-items:center;box-sizing:border-box;width:100%;height:44px;
    min-height:44px;padding:0 16px;font-size:15px;color:#191919;border-top:1px solid #e7e7e2}
  .ib-one~main .tp-subnav[popover] .tp-subnav__link:first-child{border-top:0}
  @media (max-width:640px){
    .ib-one~main .tp-subnav[popover]:popover-open{inset:auto 0 0 0;top:auto!important;left:0!important;right:0!important;
      width:auto;max-height:70vh;border-width:1px 0 0;border-radius:3px 3px 0 0;padding-bottom:env(safe-area-inset-bottom)}
    .ib-one~main .tp-subnav[popover]::backdrop{background:rgba(34,34,34,.35)}
    .ib-one~main .tp-subnav[popover] .tp-subnav__link{height:48px;min-height:48px}
  }
}
