.byof-draft-page{max-width:none;margin:-55px -5vw -80px;padding:0;background:#eaf4fb;color:#101820}
.draft-room-context{min-height:48px;display:flex;align-items:center;gap:14px;padding:8px clamp(20px,5vw,80px);background:#fffdfa;border-bottom:1px solid #d5e1eb;color:#49647e}
.draft-room-context-name{display:flex;align-items:center;gap:8px;min-width:0;flex:1;font-size:.82rem}.draft-room-context-name strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.draft-room-context-name img,.draft-room-context-name>span{display:grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:#e9f1f8;color:#1769b4;font-size:.78rem;font-weight:800;object-fit:cover}.draft-room-context .text-button{font-size:.75rem;white-space:nowrap}
.byof-live-room{font-family:Arial,Helvetica,sans-serif;background:#e7f3fa;color:#101820;min-height:calc(100vh - 126px)}
.byof-board-top{display:grid;grid-template-columns:250px minmax(0,1fr);background:#101c26;color:#fff;overflow:hidden}.byof-timer-card{display:grid;align-content:center;gap:1px;min-height:104px;padding:12px 16px;border-right:2px solid #294557}.byof-timer-card span,.byof-kicker{color:#89d1ff;font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.byof-timer-card strong{font-size:2.25rem;line-height:1.05;letter-spacing:-.03em}.byof-timer-card em{color:#d5e4ee;font-size:.7rem;font-style:normal;font-weight:700}.byof-upcoming{display:flex;gap:6px;padding:10px 8px;overflow:hidden}.byof-upcoming-card{display:grid;align-content:start;gap:4px;flex:0 0 145px;min-height:84px;padding:11px 12px;border:1px solid #294456;border-radius:2px;background:#172936;color:#dbe9f3}.byof-upcoming-card.is-current{border-left:4px solid #1b9fe1;background:#205586}.byof-upcoming-card strong{display:flex;align-items:center;gap:5px;color:#92d3ff;font-size:.85rem}.byof-upcoming-card>span{font-size:.78rem;font-weight:700;line-height:1.1}.byof-auto-dot{width:8px;height:8px;border-radius:50%;background:#ecae48}.byof-auto-dot.is-empty{opacity:.55}
.byof-board-body{display:grid;grid-template-columns:304px minmax(0,1fr) 300px;min-height:calc(100vh - 230px)}.byof-left-rail{padding:14px;background:#eaf4fa}.byof-center-room{min-width:0;background:#fff}.byof-right-rail{padding:16px 14px;background:#101c26;color:#fff}.byof-guest-card,.byof-side-card{padding:16px;border:1px solid #c8d8e4;border-radius:5px;background:#fff;color:#152637;box-shadow:0 1px 2px #102b4612}.byof-guest-card h3,.byof-side-card h3{margin:5px 0 14px;font-size:1.25rem;line-height:1.1}.byof-login-button{width:100%;background:#1898d5;border-color:#1898d5}.byof-side-card{margin-top:14px}.byof-side-actions{display:flex;gap:6px;flex-wrap:wrap}.byof-side-actions .secondary{padding:7px 9px;font-size:.7rem}
.byof-on-clock{display:flex;align-items:center;gap:12px;padding:10px 18px;background:#eaf7ff;border-bottom:1px solid #c9deed}.byof-on-clock-icon{width:22px;height:22px;flex:none;border:6px solid #b3e5ff;border-radius:50%;background:#198fd1}.byof-on-clock div{display:grid;gap:1px}.byof-on-clock strong{font-size:.92rem}.byof-on-clock em{color:#49647e;font-size:.7rem;font-style:normal;font-weight:700}.byof-draft-tabs{display:grid;grid-template-columns:repeat(4,1fr);background:#1a2934}.byof-draft-tabs button{min-height:46px;border:0;border-right:1px solid #30414d;background:#1a2934;color:#e6f0f6;font-size:.76rem;font-weight:800}.byof-draft-tabs button.is-active{background:#fff;color:#152637}
.byof-tab-panel[hidden]{display:none!important}.byof-list-panel{padding:18px}.byof-list-panel h2{margin:0 0 14px;color:#152637;font-size:1.2rem}.byof-panel-intro{margin:-5px 0 14px;color:#52687c;font-size:.76rem}.byof-team-list,.byof-results-board,.byof-auto-list{display:grid;border-top:1px solid #dbe5eb}.byof-team-row,.byof-result-row,.byof-auto-group{display:grid;align-items:center;gap:10px;min-height:54px;padding:10px;border-bottom:1px solid #dbe5eb}.byof-team-row{grid-template-columns:34px minmax(0,1fr) auto}.byof-team-mark{display:grid;place-items:center;width:28px;height:28px;border-radius:6px;background:#173452;color:#fff;font-size:.66rem;font-weight:800}.byof-team-row span:nth-child(2),.byof-result-row{min-width:0}.byof-team-row strong,.byof-result-row span,.byof-auto-group strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.78rem}.byof-team-row small,.byof-result-row small,.byof-auto-group span{display:block;margin-top:3px;color:#657b8d;font-size:.68rem}.byof-team-row em{color:#ab7014;font-size:.64rem;font-style:normal;font-weight:800;text-transform:capitalize}.byof-team-row em.is-confirmed{color:#16835c}.byof-result-row{grid-template-columns:60px minmax(0,1fr)}.byof-result-row strong{color:#176c9d;font-size:.72rem}.byof-result-row small{grid-column:2}.byof-auto-group{grid-template-columns:minmax(0,1fr) auto}
.byof-pick-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px;padding:14px;border:1px solid #b9d5e8;border-radius:6px;background:#f1f8fd}.byof-pick-form>div{grid-column:1/-1}.byof-pick-form h3{margin:2px 0 0;font-size:1.1rem}.byof-pick-form label{display:grid;gap:5px;color:#52687c;font-size:.72rem;font-weight:700}.byof-pick-form input,.byof-pick-form select{width:100%;min-height:36px;padding:7px 9px;border:1px solid #c4d6e3;border-radius:4px;background:#fff;color:#152637;font-size:.76rem}.byof-pick-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.byof-pick-form>.primary{grid-column:1/-1;background:#1898d5;border-color:#1898d5}.byof-waiting-message{margin:14px;padding:12px;border:1px solid #c9dce8;border-radius:4px;background:#f4f9fc;color:#52687c;font-size:.76rem}
.byof-pool-area{padding:10px 10px 0}.byof-board-tools{display:grid;grid-template-columns:180px 150px auto auto;align-items:center;gap:8px;padding:0 0 9px}.byof-filter{display:flex;align-items:center;gap:5px;min-width:0;border:1px solid #bccfdd;border-radius:3px;background:#fff}.byof-filter span{padding-left:7px;color:#73889a;font-size:1.15rem}.byof-filter input{width:100%;min-width:0;padding:9px 7px;border:0;outline:0;color:#152637;font-size:.72rem}.byof-board-tools select{min-width:0;padding:9px 7px;border:1px solid #bccfdd;border-radius:3px;background:#fff;color:#152637;font-size:.72rem}.byof-board-count{justify-self:end;color:#47627b;font-size:.7rem;font-weight:700}.clear-filter-button{justify-self:end;padding:8px 10px;border-radius:4px;font-size:.7rem}.byof-player-table{border-top:1px solid #c8d8e4}.byof-player-header,.byof-player-row{display:grid;grid-template-columns:70px 88px minmax(190px,1.4fr) 66px minmax(160px,1fr);align-items:center;gap:0}.byof-player-header{min-height:32px;background:#f2f6f8;color:#536777;font-size:.61rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.byof-player-header>span,.byof-player-row>span{padding:0 8px}.byof-player-body{max-height:calc(100vh - 382px);overflow:auto}.byof-player-row{min-height:43px;border-bottom:1px solid #dbe5eb;font-size:.71rem}.byof-player-row:nth-child(even){background:#fbfdfe}.byof-draft-button{justify-self:center;padding:5px 9px;border:1px solid #b9cfdd;border-radius:3px;background:#f4f8fa;color:#657a8b;font-size:.65rem;font-weight:800}.byof-draft-button:not(:disabled):hover{border-color:#168fcb;background:#e8f7ff;color:#0874a8}.byof-draft-button:disabled{cursor:not-allowed;opacity:.65}.byof-player-status{justify-self:start;padding:5px 7px;border-radius:99px;background:#e3f5ec;color:#16835c;font-size:.6rem;font-weight:800;text-transform:uppercase}.byof-player-name{display:flex;align-items:center;gap:6px;min-width:0}.byof-player-name strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.byof-watch-button{padding:0;border:0;background:transparent;color:#8ca2b1;font-size:1rem}.byof-player-position{color:#516a7d}.byof-player-stats{overflow:hidden;color:#52687c;font-size:.67rem;text-overflow:ellipsis;white-space:nowrap}.byof-info-button{padding:3px 7px;border:1px solid #a9c4d5;border-radius:99px;background:#fff;color:#176c9d;font-size:.6rem;font-weight:700}.byof-player-name .byof-info-button{margin-left:auto}
.byof-recent-card{padding:0 2px}.byof-recent-card h2{margin:5px 0 14px;color:#fff;font-size:1.45rem;letter-spacing:-.03em}.byof-recent-list{display:grid}.byof-recent-row{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid #334452}.byof-pick-avatar{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:#d2a073;color:#fff;font-size:.7rem;font-weight:800}.byof-pick-avatar.is-skipped{background:#f04c4c}.byof-recent-copy{display:grid;gap:2px;min-width:0;flex:1}.byof-recent-copy strong{overflow:hidden;color:#fff;font-size:.72rem;text-overflow:ellipsis;white-space:nowrap}.byof-recent-copy small{overflow:hidden;color:#a9c0cf;font-size:.62rem;text-overflow:ellipsis;white-space:nowrap}.byof-pick-method{margin-left:4px;padding:2px 5px;border-radius:99px;background:#2c9ddd;color:#fff;font-size:.55rem;font-style:normal;text-transform:uppercase}.byof-pick-method.is-skipped{background:#f3b0b0;color:#631d1d}.byof-recent-row .byof-info-button{flex:none}.byof-owner-card{margin-top:18px;border-color:#334452;background:#172936;color:#fff}.byof-owner-card h3{color:#fff}.byof-owner-list{display:grid;gap:4px}.byof-owner-list>div{display:flex;gap:8px;padding:6px 0;border-bottom:1px solid #334452;font-size:.68rem}.byof-owner-list span{color:#8ecfff}.byof-owner-list strong{font-size:.68rem}.byof-empty{margin:10px 0;color:#6a7f90;font-size:.72rem}.byof-right-rail .byof-empty{color:#a9c0cf}.byof-mobile-results{display:none}.byof-trade-list{display:none}
@media(max-width:900px){.byof-board-body{grid-template-columns:230px minmax(0,1fr) 250px}.byof-player-header,.byof-player-row{grid-template-columns:60px 78px minmax(150px,1fr) 54px 120px}.byof-board-tools{grid-template-columns:minmax(140px,1fr) 120px auto}.byof-board-tools .clear-filter-button{display:none}}
@media(max-width:700px){.byof-draft-page{margin:-35px -16px -80px}.draft-room-context{padding:7px 16px}.byof-live-room{min-height:0}.byof-board-top{display:block}.byof-timer-card{min-height:92px;border-right:0;border-bottom:3px solid #1d9dda}.byof-timer-card strong{font-size:2.1rem}.byof-upcoming{padding:9px 10px;overflow-x:auto;background:#e7f3fa}.byof-upcoming-card{flex-basis:126px;min-height:86px;padding:10px}.byof-board-body{display:grid;grid-template-columns:1fr;min-height:0}.byof-left-rail{order:1;padding:10px}.byof-center-room{order:2}.byof-right-rail{order:3;padding:10px;background:#e7f3fa}.byof-on-clock,.byof-draft-tabs,.byof-pool-area,.byof-owner-card{display:none}.byof-guest-card{padding:14px}.byof-guest-card h3{margin-bottom:14px;font-size:1.45rem}.byof-side-card{display:none}.byof-pick-form{grid-template-columns:1fr;margin:0 10px 10px}.byof-pick-fields{grid-template-columns:1fr 1fr}.byof-recent-card{padding:13px;border:1px solid #c8d8e4;border-radius:6px;background:#fff;color:#152637}.byof-recent-card h2{margin:0 0 10px;padding-bottom:9px;border-bottom:1px solid #dbe5eb;color:#152637;font-size:1.25rem}.byof-recent-row{border-bottom-color:#dbe5eb}.byof-recent-copy strong{color:#152637;font-size:.76rem}.byof-recent-copy small{color:#52687c;font-size:.65rem}.byof-recent-row:nth-child(n+6){display:none}.byof-mobile-results{display:block;margin:10px;padding:12px;border:1px solid #c8d8e4;border-radius:6px;background:#fff}.byof-section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.byof-section-heading h3{margin:0;font-size:1.2rem}.byof-section-heading span{color:#176c9d;font-size:.65rem;font-weight:800}.byof-results-list{display:none}.draft-room-context .status-pill{font-size:.56rem}}
@media(max-width:420px){.draft-room-context-name{font-size:.72rem}.byof-timer-card strong{font-size:1.95rem}.byof-upcoming-card{flex-basis:120px}.byof-pick-fields{grid-template-columns:1fr}.byof-player-body{max-height:none}}

/* BYOF mobile room: preserve the same calm, card-based hierarchy as the
   reference board while keeping the authenticated room controls available. */
@media(max-width:700px){
  .byof-timer-card{min-height:118px;padding:16px 22px;gap:3px}
  .byof-timer-card span{font-size:.76rem}
  .byof-timer-card strong{font-size:2.8rem;line-height:1}
  .byof-timer-card em{font-size:1rem}
  .byof-upcoming{gap:14px;padding:16px 17px;background:#e7f3fa;border-bottom:5px solid #169bd9}
  .byof-upcoming-card{flex-basis:216px;min-height:145px;padding:15px;border:1px solid #c9d8e4;border-radius:10px;background:#182d3d;color:#f5fbff}
  .byof-upcoming-card.is-current{border-left:5px solid #159bdc;background:#205687}
  .byof-upcoming-card strong{font-size:1.25rem}
  .byof-upcoming-card>span{font-size:1.1rem;line-height:1.2}
  .byof-left-rail{padding:16px 17px 10px}
  .byof-guest-card{padding:20px;border-radius:12px}
  .byof-guest-card .byof-kicker{font-size:.86rem}
  .byof-guest-card h3{margin:5px 0 16px;font-size:2rem}
  .byof-login-button{min-height:64px;border-radius:8px;font-size:1.15rem}
  .byof-right-rail{padding:6px 17px 18px}
  .byof-recent-card{padding:18px 20px;border-radius:12px}
  .byof-recent-card h2{margin:0 0 12px;padding-bottom:12px;font-size:1.7rem}
  .byof-recent-row{gap:13px;padding:12px 0}
  .byof-pick-avatar{width:54px;height:54px;font-size:.85rem}
  .byof-recent-copy{gap:4px}
  .byof-recent-copy strong{font-size:1rem;line-height:1.18}
  .byof-recent-copy small{font-size:.88rem}
  .byof-pick-method{font-size:.68rem;padding:3px 6px}
  .byof-info-button{padding:5px 9px;font-size:.72rem}
}

/* Public BYOF rooms are a standalone draft board. Keep the account shell,
   context bar, legacy title, and stats strip out of the guest experience. */
body.public-byof-mode{background:#e7f3fa}
body.public-byof-mode .topbar{display:none}
body.public-byof-mode #app.shell{max-width:none;margin:0;padding:0}
body.public-byof-mode .draft-detail-shell{min-height:100vh}
body.public-byof-mode .draft-room-context,
body.public-byof-mode .draft-room .room-head,
body.public-byof-mode .draft-room .room-stats{display:none}
body.public-byof-mode .draft-room{margin:0;border:0;border-radius:0;background:transparent;box-shadow:none}
body.public-byof-mode .byof-live-room{min-height:100vh}