@font-face{
  font-family:"PLCFont";
  src:
    url("../assets/fonts/Phi.woff2") format("woff2"),
    url("../assets/fonts/Phi.ttf") format("truetype");
  font-weight:normal;
  font-style:normal;
  font-display:swap;
}

:root{
  --bg:#070912;
  --panel:rgba(10,14,26,.78);
  --panel-strong:rgba(14,20,34,.92);
  --line:rgba(255,255,255,.14);
  --line-strong:rgba(124,226,255,.38);
  --text:#f6fbff;
  --muted:#aab5c8;
  --cyan:#67e7ff;
  --green:#93ffbc;
  --yellow:#ffe477;
  --pink:#ff75bd;
  --red:#ff6178;
}

*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

[hidden]{
  display:none !important;
}

body{
  min-height:100vh;
  color:var(--text);
  background:var(--bg);
  font-family:"PLCFont", "Microsoft YaHei", sans-serif;
  overflow-x:hidden;
}

body::before{
  content:"";
  position:fixed;
  inset:-28px;
  z-index:-2;
  background:
    linear-gradient(135deg, rgba(5,7,15,.48), rgba(5,10,18,.86)),
    url("../assets/bp-background.jpg") center/cover no-repeat;
  filter:blur(18px) saturate(1.05);
  transform:scale(1.05);
}

body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
    radial-gradient(circle at 20% 8%, rgba(103,231,255,.18), transparent 34%),
    radial-gradient(circle at 82% 18%, rgba(255,117,189,.14), transparent 28%);
  background-size:46px 46px, 46px 46px, auto, auto;
}

a{
  color:inherit;
  text-decoration:none;
}

button,
input,
select,
textarea{
  font:inherit;
}

button{
  color:inherit;
}

.schedule-header{
  position:sticky;
  top:0;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  width:min(1220px, calc(100% - 32px));
  margin:16px auto 0;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:8px;
  background:rgba(6,9,18,.78);
  backdrop-filter:blur(16px);
  box-shadow:0 18px 48px rgba(0,0,0,.28);
}

.schedule-brand{
  display:flex;
  align-items:center;
  gap:9px;
  flex:0 0 auto;
  font-size:18px;
}

.schedule-brand img{
  display:block;
  width:42px;
  height:42px;
  object-fit:contain;
}

.schedule-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
  color:var(--muted);
  font-size:14px;
}

.schedule-nav a:hover,
.schedule-nav a:focus-visible{
  color:var(--text);
}

.schedule-page{
  width:min(1220px, calc(100% - 32px));
  margin:0 auto;
  padding:34px 0 68px;
}

.schedule-hero{
  display:grid;
  gap:12px;
  min-height:170px;
  align-content:center;
}

.eyebrow{
  color:var(--cyan);
  font-size:13px;
  letter-spacing:1px;
  text-transform:uppercase;
}

.schedule-hero h1{
  font-size:64px;
  line-height:1;
  text-shadow:0 0 26px rgba(103,231,255,.32);
}

.schedule-hero p:not(.eyebrow){
  max-width:720px;
  color:var(--muted);
  line-height:1.7;
}

.practice-random-panel{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(300px, .72fr);
  gap:24px;
  align-items:stretch;
  margin-bottom:24px;
  padding:22px;
  overflow:hidden;
  border:1px solid rgba(255,228,119,.28);
  border-radius:8px;
  background:
    linear-gradient(115deg, rgba(13,21,36,.94), rgba(12,16,30,.82)),
    var(--panel);
  box-shadow:0 24px 70px rgba(0,0,0,.34);
}

.practice-random-panel::before{
  content:"";
  position:absolute;
  top:-110px;
  right:-70px;
  width:280px;
  height:280px;
  border:1px solid rgba(255,228,119,.12);
  border-radius:50%;
  box-shadow:0 0 0 32px rgba(255,228,119,.035), 0 0 80px rgba(255,228,119,.09);
  pointer-events:none;
}

.practice-random-copy,
.practice-random-result{
  position:relative;
  z-index:1;
}

.practice-random-copy{
  display:grid;
  align-content:center;
  gap:8px;
}

.practice-random-copy h2{
  font-size:27px;
  line-height:1.2;
}

.practice-random-copy > p:not(.eyebrow){
  color:var(--muted);
  font-size:14px;
  line-height:1.65;
}

.practice-random-controls{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  margin-top:8px;
}

.practice-pool-switch{
  display:inline-grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  padding:3px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(255,255,255,.045);
}

.practice-pool-switch button{
  min-height:38px;
  padding:7px 12px;
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--muted);
  cursor:pointer;
  transition:color .2s ease, background .2s ease, box-shadow .2s ease;
}

.practice-pool-switch button:hover,
.practice-pool-switch button:focus-visible{
  color:var(--text);
}

.practice-pool-switch button.is-active{
  background:rgba(103,231,255,.13);
  color:var(--cyan);
  box-shadow:inset 0 0 0 1px rgba(103,231,255,.18);
}

.practice-pool-switch button:disabled{
  cursor:not-allowed;
  opacity:.62;
}

.practice-random-button{
  min-width:154px;
}

.practice-random-result{
  display:grid;
  min-height:154px;
  align-content:center;
  gap:9px;
  padding:22px;
  overflow:hidden;
  border:1px solid rgba(255,228,119,.22);
  border-radius:8px;
  background:
    radial-gradient(circle at 88% 20%, rgba(255,228,119,.13), transparent 34%),
    rgba(255,255,255,.045);
}

.practice-random-result::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(100deg, transparent 22%, rgba(255,255,255,.12) 48%, transparent 74%);
  opacity:0;
  transform:translateX(-110%);
}

.practice-random-result.is-rolling::after{
  opacity:1;
  animation:practiceRandomSweep 1.05s ease-in-out infinite;
}

.practice-random-status{
  color:var(--yellow);
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.practice-random-result strong{
  position:relative;
  z-index:1;
  overflow:hidden;
  font-size:23px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.practice-random-result small{
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

.practice-random-result.is-rolling strong{
  color:var(--cyan);
  text-shadow:0 0 22px rgba(103,231,255,.26);
}

.practice-random-result.is-revealed{
  animation:practiceRandomReveal .46s cubic-bezier(.18,.82,.2,1) both;
}

.schedule-layout{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
  align-items:start;
}

.schedule-layout.is-detail .match-list-panel{
  display:none;
}

.schedule-layout.is-detail .bp-panel{
  display:block;
}

.match-list-panel,
.bp-panel,
.bp-section,
.action-panel,
.summary-panel,
.result-panel{
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--panel);
  backdrop-filter:blur(16px);
  box-shadow:0 24px 70px rgba(0,0,0,.34);
}

.match-list-panel{
  padding:18px;
  width:100%;
}

.panel-heading,
.bp-heading,
.section-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.panel-heading h2,
.bp-heading h2,
.section-heading h3{
  margin-top:5px;
  font-size:22px;
  line-height:1.2;
}

.icon-button{
  display:inline-grid;
  place-items:center;
  width:42px;
  height:42px;
  flex:0 0 auto;
  border:1px solid var(--line);
  border-radius:8px;
  background:rgba(255,255,255,.08);
  color:var(--text);
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}

.icon-button:hover,
.icon-button:focus-visible{
  transform:translateY(-1px);
  border-color:var(--line-strong);
  background:rgba(103,231,255,.14);
}

.match-list{
  display:grid;
  gap:12px;
  margin-top:18px;
}

.finished-match-section{
  display:grid;
  grid-column:1 / -1;
  gap:12px;
  margin-top:8px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.1);
}

.finished-match-toggle{
  display:flex;
  align-items:center;
  width:100%;
  min-height:48px;
  gap:10px;
  padding:12px 14px;
  border:1px solid rgba(255,228,119,.22);
  border-radius:8px;
  background:rgba(255,228,119,.06);
  color:var(--text);
  font:inherit;
  font-size:17px;
  font-weight:700;
  text-align:left;
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}

.finished-match-toggle:hover,
.finished-match-toggle:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(255,228,119,.48);
  background:rgba(255,228,119,.11);
}

.finished-match-count,
.finished-match-indicator{
  flex:0 0 auto;
  color:var(--yellow);
  font-size:13px;
  font-weight:400;
}

.finished-match-indicator{
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin-left:auto;
}

.finished-match-indicator::after{
  content:"";
  width:7px;
  height:7px;
  border-right:1px solid currentColor;
  border-bottom:1px solid currentColor;
  transform:translateY(-2px) rotate(45deg);
  transition:transform .2s ease;
}

.finished-match-toggle[aria-expanded="true"] .finished-match-indicator::after{
  transform:translateY(2px) rotate(225deg);
}

.finished-match-content{
  display:grid;
  gap:12px;
}

.match-category-section{
  display:grid;
  grid-column:1 / -1;
  gap:12px;
  min-width:0;
}

.match-category-section + .match-category-section{
  margin-top:8px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.1);
}

.match-category-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
}

.match-category-heading h3{
  min-width:0;
  font-size:24px;
  line-height:1.2;
  overflow-wrap:anywhere;
}

.match-category-heading span{
  flex:0 0 auto;
  color:var(--cyan);
  font-size:13px;
}

.match-category-stage,
.match-category-group,
.match-category-card-stack{
  display:grid;
  gap:10px;
  min-width:0;
}

.match-category-stage{
  padding-left:14px;
  border-left:1px solid rgba(103,231,255,.22);
}

.match-category-stage h4{
  color:var(--yellow);
  font-size:17px;
  line-height:1.25;
  overflow-wrap:anywhere;
}

.match-category-group{
  padding-left:12px;
  border-left:1px solid rgba(255,228,119,.18);
}

.match-category-group h5{
  color:var(--green);
  font-size:15px;
  line-height:1.25;
  overflow-wrap:anywhere;
}

.match-card{
  display:grid;
  gap:10px;
  width:100%;
  padding:14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(255,255,255,.06);
  color:inherit;
  text-align:left;
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}

.match-card:hover,
.match-card:focus-visible,
.match-card.is-active{
  transform:translateY(-2px);
  border-color:var(--line-strong);
  background:rgba(103,231,255,.1);
}

.match-card-top,
.match-card-meta,
.participant-row,
.selection-meta,
.summary-meta,
.result-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}

.match-card h3{
  font-size:18px;
  line-height:1.3;
}

.match-card p{
  color:var(--muted);
  font-size:14px;
  line-height:1.6;
}

.tag,
.status-pill,
.participant-chip{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(255,255,255,.08);
  color:var(--muted);
  font-size:13px;
}

.status-pill{
  color:var(--cyan);
  border-color:rgba(103,231,255,.32);
  background:rgba(103,231,255,.08);
  white-space:nowrap;
}

.tag.is-public{
  color:var(--green);
  border-color:rgba(147,255,188,.26);
}

.tag.is-finished{
  color:var(--yellow);
  border-color:rgba(255,228,119,.28);
}

.bp-panel{
  min-height:480px;
  width:100%;
}

.bp-empty{
  display:grid;
  place-items:start;
  gap:10px;
  min-height:480px;
  padding:34px;
  align-content:center;
}

.bp-empty span{
  color:var(--cyan);
  font-size:13px;
  letter-spacing:1px;
}

.bp-empty strong{
  font-size:34px;
}

.bp-empty p{
  max-width:560px;
  color:var(--muted);
  line-height:1.7;
}

.bp-workbench{
  display:grid;
  gap:16px;
  padding:18px;
}

.detail-back{
  justify-self:start;
  min-height:40px;
  padding:9px 14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:8px;
  background:rgba(255,255,255,.08);
  color:var(--text);
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}

.detail-back:hover,
.detail-back:focus-visible{
  transform:translateY(-1px);
  border-color:var(--line-strong);
  background:rgba(103,231,255,.12);
}

.bp-heading{
  align-items:center;
}

.bp-heading p:not(.eyebrow){
  margin-top:8px;
  color:var(--muted);
  line-height:1.6;
}

.participant-row{
  min-height:36px;
}

.identity-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.identity-row > div{
  min-width:0;
  padding:13px 14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(255,255,255,.06);
}

.identity-row span{
  display:block;
  color:var(--muted);
  font-size:13px;
}

.identity-row strong{
  display:block;
  margin-top:5px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:18px;
}

.player-confirmation-panel{
  position:relative;
  display:grid;
  width:100%;
  gap:14px;
  padding:16px;
  border:1px solid rgba(255,228,119,.3);
  border-radius:8px;
  background:
    linear-gradient(135deg, rgba(255,228,119,.12), rgba(103,231,255,.055) 54%, rgba(147,255,188,.08)),
    rgba(8,12,24,.68);
  overflow:hidden;
  isolation:isolate;
  color:var(--text);
  font:inherit;
  text-align:left;
  transition:transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.player-confirmation-panel:disabled{
  opacity:1;
  cursor:default;
}

.player-confirmation-panel.is-actionable{
  cursor:pointer;
}

.player-confirmation-panel.is-actionable:hover,
.player-confirmation-panel.is-actionable:focus-visible{
  transform:translateY(-2px);
  border-color:rgba(103,231,255,.58);
  background:
    linear-gradient(135deg, rgba(103,231,255,.16), rgba(255,228,119,.09) 58%, rgba(147,255,188,.09)),
    rgba(8,12,24,.76);
  box-shadow:0 18px 42px rgba(0,0,0,.28), 0 0 0 3px rgba(103,231,255,.1);
}

.player-confirmation-panel::before{
  position:absolute;
  z-index:-1;
  top:-56px;
  right:-38px;
  width:156px;
  height:156px;
  border:1px solid rgba(255,228,119,.18);
  border-radius:50%;
  box-shadow:0 0 0 20px rgba(255,228,119,.035), 0 0 48px rgba(255,228,119,.12);
  content:"";
  animation:playerConfirmationPulse 3.2s ease-in-out infinite;
}

.player-confirmation-panel.is-complete{
  border-color:rgba(147,255,188,.42);
  background:
    linear-gradient(135deg, rgba(147,255,188,.15), rgba(103,231,255,.07) 58%, rgba(255,228,119,.08)),
    rgba(8,12,24,.68);
  animation:playerConfirmationReady .52s cubic-bezier(.18,.82,.2,1) both;
}

.player-confirmation-panel.is-complete::before{
  border-color:rgba(147,255,188,.23);
  box-shadow:0 0 0 20px rgba(147,255,188,.04), 0 0 52px rgba(147,255,188,.16);
}

.player-confirmation-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}

.player-confirmation-heading h3{
  margin-top:5px;
  font-size:21px;
  line-height:1.2;
}

.player-confirmation-click-hint{
  display:none;
  width:100%;
  margin:0;
  color:rgba(255,255,255,.58);
  font-size:12px;
  line-height:1.4;
  letter-spacing:.04em;
  text-align:center;
}

.player-confirmation-panel.is-actionable .player-confirmation-click-hint{
  display:block;
}

.player-confirmation-count{
  display:inline-grid;
  min-width:62px;
  min-height:42px;
  place-items:center;
  padding:8px 12px;
  border:1px solid rgba(255,228,119,.32);
  border-radius:8px;
  background:rgba(255,228,119,.1);
  color:var(--yellow);
  font-size:17px;
  line-height:1;
}

.player-confirmation-panel.is-complete .player-confirmation-count{
  border-color:rgba(147,255,188,.38);
  background:rgba(147,255,188,.11);
  color:var(--green);
}

.player-confirmation-countdown{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  align-items:center;
  gap:12px;
  min-height:54px;
  padding:10px 13px;
  border:1px solid rgba(103,231,255,.28);
  border-radius:8px;
  background:linear-gradient(90deg, rgba(103,231,255,.1), rgba(103,231,255,.035));
}

.player-confirmation-countdown > span{
  color:var(--cyan);
  font-size:13px;
  white-space:nowrap;
}

.player-confirmation-countdown strong{
  color:var(--text);
  font-family:"PLCFont", "Microsoft YaHei", sans-serif;
  font-size:27px;
  font-variant-numeric:tabular-nums;
  letter-spacing:1px;
  line-height:1;
  text-align:center;
}

.player-confirmation-countdown small{
  color:var(--muted);
  font-size:12px;
  line-height:1.4;
  text-align:right;
}

.player-confirmation-roster{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:9px;
}

.player-confirmation-roster-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(255,255,255,.05);
}

.player-confirmation-roster-item strong{
  overflow:hidden;
  font-size:14px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.player-confirmation-state{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  gap:6px;
  color:var(--yellow);
  font-size:12px;
  white-space:nowrap;
}

.player-confirmation-state::before{
  width:7px;
  height:7px;
  border-radius:50%;
  background:currentColor;
  box-shadow:0 0 12px currentColor;
  content:"";
  animation:playerConfirmationDot 1.8s ease-in-out infinite;
}

.player-confirmation-roster-item.is-confirmed{
  border-color:rgba(147,255,188,.24);
  background:rgba(147,255,188,.065);
}

.player-confirmation-roster-item.is-confirmed .player-confirmation-state{
  color:var(--green);
}

.player-confirmation-roster-item.is-confirmed .player-confirmation-state::before{
  animation:none;
}

.player-confirmation-message{
  min-height:20px;
  color:var(--cyan);
  font-size:13px;
  line-height:1.5;
}

.player-confirmation-message.is-error{
  color:var(--red);
}

.participant-chip{
  color:var(--text);
}

.participant-chip.is-me{
  color:var(--green);
  border-color:rgba(147,255,188,.32);
  background:rgba(147,255,188,.09);
}

.live-presence{
  padding:12px 14px;
  border:1px solid rgba(103,231,255,.3);
  border-radius:8px;
  background:rgba(103,231,255,.09);
  color:var(--cyan);
}

.bp-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.bp-section,
.action-panel,
.summary-panel,
.result-panel{
  padding:16px;
  box-shadow:none;
}

.section-heading span{
  color:var(--muted);
  font-size:13px;
  white-space:nowrap;
}

.selection-list,
.summary-list,
.result-list{
  display:grid;
  gap:10px;
  margin-top:14px;
}

.selection-item,
.summary-item,
.result-item{
  display:grid;
  gap:6px;
  padding:12px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:8px;
  background:rgba(255,255,255,.055);
}

.selection-item.is-entering{
  animation:bpSelectionDropIn .38s cubic-bezier(.18,.82,.2,1) both;
  will-change:transform, opacity;
}

.selection-item strong,
.summary-item strong,
.result-item strong{
  line-height:1.35;
}

.selection-meta,
.summary-meta,
.result-row{
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}

.selection-item.is-ban{
  border-color:rgba(255,97,120,.26);
}

.selection-item.is-pick,
.summary-item.is-pick{
  border-color:rgba(147,255,188,.24);
}

.summary-item.is-random{
  border-color:rgba(255,228,119,.28);
}

.summary-item.is-random.is-rolling{
  border-color:rgba(255,228,119,.48);
  background:rgba(255,228,119,.08);
  box-shadow:0 0 24px rgba(255,228,119,.12);
}

.random-roll-title{
  min-height:1.4em;
  color:var(--yellow);
  transition:filter .16s ease, opacity .16s ease;
}

.summary-item.is-rolling .random-roll-title{
  filter:drop-shadow(0 0 10px rgba(255,228,119,.38));
}

.random-roll-label{
  color:rgba(255,228,119,.78);
}

.empty-line{
  color:rgba(255,255,255,.56);
  font-size:14px;
}

.bp-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:14px;
}

.bp-form label,
.bp-field{
  display:grid;
  gap:7px;
  color:var(--muted);
  font-size:13px;
}

.bp-form label:first-child{
  grid-column:1 / -1;
}

.bp-picker-field{
  grid-column:1 / -1;
}

.bp-difficulty-field{
  grid-column:1 / -1;
}

.bp-form input,
.bp-form select{
  width:100%;
  min-height:44px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:8px;
  background:rgba(0,0,0,.22);
  color:var(--text);
  outline:none;
}

.bp-form option{
  color:#111827;
}

.bp-native-select{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.bp-difficulty-picker{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(62px, 1fr));
  gap:8px;
  width:100%;
  min-height:44px;
  padding:4px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:8px;
  background:rgba(0,0,0,.22);
}

.bp-difficulty-picker.is-disabled{
  display:flex;
  align-items:center;
  padding:10px 12px;
  color:rgba(255,255,255,.48);
}

.bp-difficulty-option{
  min-height:36px;
  padding:8px 10px;
  border:1px solid rgba(103,231,255,.18);
  border-radius:7px;
  background:rgba(103,231,255,.07);
  color:rgba(226,247,255,.88);
  font-weight:700;
  cursor:pointer;
  outline:none;
  transition:border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}

.bp-difficulty-option:hover,
.bp-difficulty-option:focus-visible{
  border-color:var(--line-strong);
  background:rgba(103,231,255,.14);
  transform:translateY(-1px);
}

.bp-difficulty-option.is-selected{
  border-color:rgba(255,228,119,.45);
  background:rgba(255,228,119,.16);
  color:var(--yellow);
  box-shadow:0 0 0 1px rgba(255,228,119,.12) inset;
}

.bp-difficulty-placeholder{
  color:rgba(255,255,255,.5);
  line-height:1.4;
}

.bp-form input:focus,
.bp-form select:focus{
  border-color:var(--line-strong);
  box-shadow:0 0 0 3px rgba(103,231,255,.12);
}

.bp-picker-button{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:12px;
  width:100%;
  min-height:58px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:8px;
  background:rgba(0,0,0,.22);
  color:var(--text);
  text-align:left;
  cursor:pointer;
  outline:none;
  transition:border-color .2s ease, background .2s ease, transform .2s ease;
}

.bp-track-picker-button{
  grid-template-columns:minmax(0, 1fr);
}

.bp-picker-button:hover,
.bp-picker-button:focus-visible{
  border-color:var(--line-strong);
  background:rgba(103,231,255,.08);
  transform:translateY(-1px);
}

.bp-picker-button:disabled{
  cursor:not-allowed;
  opacity:.58;
  transform:none;
}

.bp-picker-button span{
  min-width:0;
  display:grid;
  gap:4px;
}

.bp-picker-button strong{
  overflow:hidden;
  color:var(--text);
  font-size:15px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.bp-picker-button small{
  overflow:hidden;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.primary-action{
  min-height:44px;
  padding:10px 16px;
  border:1px solid rgba(103,231,255,.35);
  border-radius:8px;
  background:linear-gradient(135deg, rgba(13,145,210,.92), rgba(48,204,232,.92));
  color:white;
  font-weight:700;
  cursor:pointer;
  transition:transform .2s ease, filter .2s ease;
}

.primary-action:hover,
.primary-action:focus-visible{
  transform:translateY(-1px);
  filter:brightness(1.06);
}

.primary-action:disabled{
  cursor:not-allowed;
  opacity:.55;
  transform:none;
  filter:none;
}

.bp-form .primary-action{
  align-self:end;
  grid-column:1 / -1;
}

.confirm-action{
  margin-top:14px;
  width:100%;
}

.action-message{
  min-height:24px;
  margin-top:12px;
  color:var(--cyan);
  line-height:1.6;
}

.action-message.is-waiting{
  position:relative;
  overflow:hidden;
  border-radius:8px;
  background:rgba(103,231,255,.045);
  box-shadow:inset 0 0 0 1px rgba(103,231,255,.08);
}

.action-message.is-waiting::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg, transparent 18%, rgba(103,231,255,.2) 50%, transparent 82%);
  opacity:.72;
  transform:translateX(-100%);
  animation:bpWaitingPulse 1.9s ease-in-out infinite;
  will-change:transform;
}

.action-message.is-error{
  color:var(--red);
}

.result-panel.is-finished{
  border-color:rgba(255,228,119,.28);
}

.winner{
  color:var(--green);
}

.loser{
  color:var(--red);
}

@keyframes bpSelectionDropIn{
  0%{
    opacity:0;
    transform:translateY(-12px) scale(.992);
  }

  62%{
    opacity:1;
    transform:translateY(2px) scale(1);
  }

  100%{
    opacity:1;
    transform:none;
  }
}

@keyframes practiceRandomSweep{
  from{
    transform:translateX(-110%);
  }

  to{
    transform:translateX(110%);
  }
}

@keyframes practiceRandomReveal{
  0%{
    opacity:.72;
    transform:scale(.985);
  }

  68%{
    transform:scale(1.008);
  }

  100%{
    opacity:1;
    transform:none;
  }
}

@keyframes bpWaitingPulse{
  0%{
    transform:translateX(-100%);
  }

  56%,
  100%{
    transform:translateX(100%);
  }
}

@keyframes playerConfirmationPulse{
  0%,
  100%{
    transform:scale(.94);
    opacity:.5;
  }

  50%{
    transform:scale(1.05);
    opacity:1;
  }
}

@keyframes playerConfirmationDot{
  0%,
  100%{
    opacity:.42;
    transform:scale(.78);
  }

  50%{
    opacity:1;
    transform:scale(1);
  }
}

@keyframes playerConfirmationReady{
  0%{
    transform:translateY(5px) scale(.988);
  }

  70%{
    transform:translateY(-1px) scale(1.004);
  }

  100%{
    transform:none;
  }
}

@keyframes bpDialogFadeIn{
  from{
    opacity:0;
  }

  to{
    opacity:1;
  }
}

@keyframes bpDialogFadeOut{
  from{
    opacity:1;
  }

  to{
    opacity:0;
  }
}

@keyframes bpDialogPanelIn{
  from{
    opacity:0;
    transform:translateY(10px) scale(.985);
  }

  to{
    opacity:1;
    transform:none;
  }
}

@keyframes bpDialogPanelOut{
  from{
    opacity:1;
    transform:none;
  }

  to{
    opacity:0;
    transform:translateY(8px) scale(.99);
  }
}

.bp-library-dialog,
.bp-submit-dialog{
  position:fixed;
  inset:0;
  z-index:80;
  display:none;
  place-items:center;
  padding:20px;
}

.bp-library-dialog{
  z-index:78;
}

.bp-library-dialog.is-open,
.bp-submit-dialog.is-open,
.bp-submit-dialog.is-closing{
  display:grid;
}

.bp-library-backdrop,
.bp-submit-dialog-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.62);
  backdrop-filter:blur(10px);
}

.bp-library-dialog.is-open .bp-library-backdrop,
.bp-submit-dialog.is-open .bp-submit-dialog-backdrop{
  animation:bpDialogFadeIn .18s ease both;
}

.bp-submit-dialog.is-closing .bp-submit-dialog-backdrop{
  animation:bpDialogFadeOut .18s ease both;
}

.bp-library-panel,
.bp-submit-dialog-panel{
  position:relative;
  z-index:1;
  display:grid;
  gap:14px;
  width:min(520px, 100%);
  max-height:min(720px, calc(100vh - 40px));
  overflow:auto;
  padding:20px;
  border:1px solid var(--line-strong);
  border-radius:8px;
  background:rgba(9,13,29,.96);
  color:var(--text);
  box-shadow:0 30px 90px rgba(0,0,0,.48);
}

.bp-library-panel{
  width:min(720px, 100%);
}

.bp-library-panel,
.bp-library-list{
  scrollbar-width:thin;
  scrollbar-color:rgba(103,231,255,.38) transparent;
}

.bp-library-panel::-webkit-scrollbar,
.bp-library-list::-webkit-scrollbar{
  width:8px;
  height:8px;
}

.bp-library-panel::-webkit-scrollbar-button,
.bp-library-list::-webkit-scrollbar-button{
  display:none;
  width:0;
  height:0;
}

.bp-library-panel::-webkit-scrollbar-track,
.bp-library-list::-webkit-scrollbar-track{
  background:transparent;
}

.bp-library-panel::-webkit-scrollbar-thumb,
.bp-library-list::-webkit-scrollbar-thumb{
  border:2px solid rgba(9,13,29,.96);
  border-radius:999px;
  background:rgba(103,231,255,.34);
}

.bp-library-panel::-webkit-scrollbar-thumb:hover,
.bp-library-list::-webkit-scrollbar-thumb:hover{
  background:rgba(255,228,119,.42);
}

.bp-library-panel::-webkit-scrollbar-corner,
.bp-library-list::-webkit-scrollbar-corner{
  background:transparent;
}

.bp-library-dialog.is-open .bp-library-panel,
.bp-submit-dialog.is-open .bp-submit-dialog-panel{
  animation:bpDialogPanelIn .2s cubic-bezier(.18,.82,.2,1) both;
}

.bp-submit-dialog.is-closing .bp-submit-dialog-panel{
  animation:bpDialogPanelOut .18s ease both;
}

.bp-submit-dialog-panel h2{
  font-size:26px;
  line-height:1.15;
}

.bp-submit-dialog-panel p:not(.eyebrow){
  color:var(--muted);
  line-height:1.7;
}

.bp-library-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.bp-library-heading .icon-button{
  flex:0 0 auto;
}

.bp-library-hint{
  color:var(--muted);
  line-height:1.55;
}

.bp-library-list{
  display:grid;
  gap:10px;
  max-height:min(54vh, 520px);
  overflow:auto;
  padding-right:2px;
}

.bp-library-item{
  display:block;
  width:100%;
  padding:12px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:8px;
  background:rgba(255,255,255,.055);
  color:var(--text);
  text-align:left;
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}

.bp-library-item:hover,
.bp-library-item:focus-visible{
  border-color:var(--line-strong);
  background:rgba(103,231,255,.08);
  transform:translateY(-1px);
}

.bp-library-item.is-selected{
  border-color:rgba(255,228,119,.34);
  background:rgba(255,228,119,.08);
}

.bp-library-title{
  display:grid;
  gap:4px;
}

.bp-library-title strong{
  color:var(--text);
  line-height:1.35;
  overflow-wrap:anywhere;
}

.bp-library-title span{
  color:var(--muted);
  font-size:12px;
  line-height:1.4;
  overflow-wrap:anywhere;
}

.bp-library-difficulties{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding-top:2px;
}

.bp-library-difficulty-badge{
  min-width:34px;
  padding:4px 8px;
  border:1px solid rgba(103,231,255,.18);
  border-radius:999px;
  background:rgba(103,231,255,.075);
  color:rgba(226,247,255,.84);
  font-size:11px;
  font-weight:700;
  line-height:1.2;
  text-align:center;
  letter-spacing:0;
}

.bp-library-difficulty-badge.is-selected{
  border-color:rgba(255,228,119,.38);
  background:rgba(255,228,119,.14);
  color:var(--yellow);
}

.bp-submit-confirm-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.bp-submit-confirm-card{
  position:relative;
  display:grid;
  align-content:start;
  gap:7px;
  min-height:86px;
  padding:13px 14px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:8px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.035)),
    rgba(9,13,29,.62);
  overflow:hidden;
}

.bp-submit-confirm-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:rgba(103,231,255,.38);
}

.bp-submit-confirm-card.is-wide{
  grid-column:1 / -1;
}

.bp-submit-confirm-card span{
  color:var(--muted);
  font-size:12px;
  line-height:1.25;
}

.bp-submit-confirm-card strong{
  color:var(--text);
  font-size:18px;
  line-height:1.3;
  overflow-wrap:anywhere;
}

.bp-submit-confirm-card small{
  color:var(--muted);
  line-height:1.45;
  overflow-wrap:anywhere;
}

.bp-submit-confirm-card.is-track strong{
  font-size:20px;
}

.bp-submit-confirm-card.is-action,
.bp-submit-confirm-card.is-difficulty{
  align-content:center;
}

.bp-submit-confirm-card.is-action strong,
.bp-submit-confirm-card.is-difficulty strong{
  font-size:22px;
}

.bp-submit-dialog[data-action="ban"] .bp-submit-confirm-card.is-action::before{
  background:rgba(255,92,120,.72);
}

.bp-submit-dialog[data-action="ban"] .bp-submit-confirm-card.is-action strong{
  color:var(--red);
}

.bp-submit-dialog[data-action="pick"] .bp-submit-confirm-card.is-action::before{
  background:rgba(103,231,255,.74);
}

.bp-submit-dialog[data-action="pick"] .bp-submit-confirm-card.is-action strong{
  color:var(--cyan);
}

.bp-submit-confirm-card.is-difficulty::before{
  background:rgba(255,228,119,.68);
}

.bp-submit-confirm-card.is-difficulty strong{
  color:var(--yellow);
}

.bp-submit-confirm-message{
  min-height:22px;
  color:var(--cyan);
}

.bp-submit-confirm-message.is-error{
  color:var(--red);
}

.bp-submit-dialog-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
}

.ghost-action{
  min-height:44px;
  padding:10px 16px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:8px;
  background:rgba(255,255,255,.08);
  color:var(--text);
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}

.ghost-action:hover,
.ghost-action:focus-visible{
  transform:translateY(-1px);
  border-color:var(--line-strong);
  background:rgba(103,231,255,.12);
}

.ghost-action:disabled{
  cursor:not-allowed;
  opacity:.55;
  transform:none;
}

@media(max-width:980px){
  body::before{
    filter:blur(12px) saturate(1.02);
  }

  .schedule-header,
  .match-list-panel,
  .bp-panel{
    backdrop-filter:none;
  }

  .schedule-header{
    align-items:flex-start;
    flex-wrap:wrap;
  }

  .schedule-nav{
    order:3;
    width:100%;
    justify-content:flex-start;
  }

  .schedule-hero h1{
    font-size:48px;
  }

  .practice-random-panel{
    grid-template-columns:1fr;
  }

  .match-list{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:680px){
  .schedule-header,
  .schedule-page{
    width:min(100% - 22px, 1220px);
  }

  .schedule-header{
    gap:12px;
    padding:12px;
  }

  .schedule-brand strong{
    font-size:16px;
  }

  .schedule-nav{
    gap:12px;
    font-size:13px;
    overflow-x:auto;
    padding-bottom:2px;
  }

  .schedule-page{
    padding-top:22px;
  }

  .schedule-hero{
    min-height:130px;
  }

  .schedule-hero h1{
    font-size:38px;
  }

  .practice-random-panel{
    gap:18px;
    padding:16px;
  }

  .practice-random-copy h2{
    font-size:24px;
  }

  .practice-random-controls{
    align-items:stretch;
    flex-direction:column;
  }

  .practice-pool-switch,
  .practice-random-button{
    width:100%;
  }

  .practice-random-result{
    min-height:138px;
    padding:18px;
  }

  .practice-random-result strong{
    font-size:19px;
    white-space:normal;
  }

  .match-list{
    grid-template-columns:1fr;
  }

  .bp-empty{
    padding:24px;
  }

  .bp-empty strong{
    font-size:28px;
  }

  .bp-heading,
  .panel-heading,
  .section-heading{
    align-items:flex-start;
  }

  .bp-grid,
  .bp-form,
  .identity-row{
    grid-template-columns:1fr;
  }

  .player-confirmation-heading{
    align-items:flex-start;
    flex-direction:column;
  }

  .player-confirmation-count{
    min-width:0;
  }

  .player-confirmation-roster{
    grid-template-columns:1fr;
  }

  .player-confirmation-countdown{
    grid-template-columns:1fr;
    gap:5px;
    text-align:center;
  }

  .player-confirmation-countdown strong,
  .player-confirmation-countdown small{
    text-align:center;
  }

  .bp-form .primary-action{
    width:100%;
  }

  .bp-library-dialog,
  .bp-submit-dialog{
    padding:14px;
  }

  .bp-library-panel{
    max-height:calc(100vh - 28px);
  }

  .bp-library-list{
    max-height:50vh;
  }

  .bp-submit-confirm-grid{
    grid-template-columns:1fr;
  }

  .bp-submit-dialog-actions{
    display:grid;
    grid-template-columns:1fr;
  }
}

@media(pointer:coarse){
  body::before{
    filter:blur(10px) saturate(1.02);
  }

  .schedule-header,
  .practice-random-panel,
  .match-list-panel,
  .bp-panel,
  .bp-library-backdrop,
  .bp-submit-dialog-backdrop{
    backdrop-filter:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .selection-item.is-entering,
  .practice-random-result,
  .practice-random-result::after,
  .action-message.is-waiting::after,
  .player-confirmation-panel,
  .player-confirmation-panel::before,
  .player-confirmation-state::before,
  .bp-library-dialog.is-open .bp-library-backdrop,
  .bp-library-dialog.is-open .bp-library-panel,
  .bp-submit-dialog.is-open .bp-submit-dialog-backdrop,
  .bp-submit-dialog.is-closing .bp-submit-dialog-backdrop,
  .bp-submit-dialog.is-open .bp-submit-dialog-panel,
  .bp-submit-dialog.is-closing .bp-submit-dialog-panel{
    animation:none !important;
  }

  .action-message.is-waiting::after{
    opacity:.22;
    transform:none;
  }
}