/* The BayRen bar (26 Oct 2026) — one bar over every practice site.
   Copied into each app by sync_core.sh as static/css/platform_bar.css; the
   markup is _platform_bar.html, the facts core/admission.py bar().
   Everything is under .bp and prefixed bp-, so no app's own sheet is touched
   and none of theirs reaches in. Two looks share the markup:
     A  navy bar, every module visible as a tab (a "Reading ▾" menu on phones)
     B  white bar, one "Modules" menu at every width */

.bp{--bp-navy:#0B2A49;--bp-navy-2:#1d4470;--bp-gold:#D8B04C;--bp-gold-ink:#2e2304;
  --bp-line:#dde3ea;--bp-ink:#0B2A49;--bp-muted:#56657a;--bp-wash:#f3f6fa;
  position:relative;z-index:900;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans Bengali",sans-serif;
  font-size:14px;line-height:1.2;-webkit-text-size-adjust:100%}
.bp *,.bp *::before,.bp *::after{box-sizing:border-box}
.bp [hidden]{display:none!important}
.bp-in{max-width:1280px;margin:0 auto;display:flex;align-items:stretch;gap:2px;min-height:46px;
  padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
.bp a{text-decoration:none;color:inherit}
.bp-i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bp-home,.bp-tab{display:flex;align-items:center;gap:7px;padding:0 10px;min-height:46px;white-space:nowrap;
  border-bottom:3px solid transparent;border-top:3px solid transparent}
.bp-tabs{display:flex;align-items:stretch;list-style:none;margin:0;padding:0;gap:0;min-width:0}
.bp-tabs li{display:flex}
.bp-lock{display:inline-flex;opacity:.75}
.bp-lock .bp-i{width:14px;height:14px}
.bp-menu{position:static;display:flex;align-items:center}
.bp-menu-btn{display:flex;align-items:center;gap:7px;min-height:38px;padding:0 12px;border-radius:9px;cursor:pointer;
  font-weight:600;list-style:none;white-space:nowrap}
.bp-menu-btn::-webkit-details-marker{display:none}
.bp-menu[open] .bp-menu-btn .bp-i:last-child{transform:rotate(180deg)}
.bp-sheet{position:absolute;left:0;right:0;top:100%;background:#fff;color:var(--bp-ink);
  border-bottom:1px solid var(--bp-line);box-shadow:0 18px 32px rgba(11,42,73,.18);padding:8px 0;
  max-height:calc(100vh - 60px);overflow-y:auto}
.bp-row{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 max(18px,env(safe-area-inset-left,0px));font-size:15px}
.bp-row .bp-lock{margin-left:auto}
.bp-row.is-here{background:var(--bp-wash);font-weight:600;box-shadow:inset 3px 0 0 var(--bp-gold)}
.bp-chip{margin-left:auto;align-self:center;display:inline-flex;align-items:center;gap:6px;min-height:34px;
  padding:0 12px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap}
.bp-chip b{margin-left:4px;padding:3px 9px;border-radius:999px;background:var(--bp-gold);color:var(--bp-gold-ink)}
.bp a:focus-visible,.bp-menu-btn:focus-visible{outline:3px solid var(--bp-gold);outline-offset:-3px}

/* ---- Look A: navy, every module a tab ---- */
.bp[data-look="A"]{background:var(--bp-navy);color:#dfe7f1}
.bp[data-look="A"] .bp-home.is-here,.bp[data-look="A"] .bp-tab.is-here{color:#fff;font-weight:600;border-bottom-color:var(--bp-gold)}
.bp[data-look="A"] .bp-home:hover,.bp[data-look="A"] .bp-tab:hover{color:#fff;background:rgba(255,255,255,.06)}
.bp[data-look="A"] .bp-home{border-right:1px solid #2c4f78;margin-right:4px}
.bp[data-look="A"] .bp-menu{display:none}
.bp[data-look="A"] .bp-all{display:none}
.bp[data-look="A"] .bp-menu-btn{background:var(--bp-navy-2);color:#fff}
.bp[data-look="A"] .bp-chip{background:var(--bp-navy-2);color:#fff}
.bp[data-look="A"] .bp-chip.is-ended{background:#5c1f1f}
@media (max-width:1180px){
  .bp[data-look="A"] .bp-tab .bp-i{display:none}
}
@media (max-width:960px){
  .bp[data-look="A"] .bp-tabs{display:none}
  .bp[data-look="A"] .bp-menu{display:flex}
  .bp[data-look="A"] .bp-home span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .bp[data-look="A"] .bp-home{min-width:44px;justify-content:center;border-right:0}
}

/* ---- Look B: white, one Modules menu ---- */
.bp[data-look="B"]{background:#fff;color:var(--bp-ink);border-bottom:1px solid var(--bp-line)}
.bp[data-look="B"] .bp-tabs{display:none}
.bp[data-look="B"] .bp-cur{display:none}
.bp[data-look="B"] .bp-home.is-here{font-weight:700;border-bottom-color:var(--bp-gold)}
.bp[data-look="B"] .bp-menu-btn{border:1px solid var(--bp-line);margin-left:6px}
.bp[data-look="B"] .bp-chip{background:#fbf3dd;color:#5d470c;border:1px solid #ecd9a3}
.bp[data-look="B"] .bp-chip.is-ended{background:#fbe9e7;color:#7a1f14;border-color:#efc2bb}
.bp[data-look="B"] .bp-sheet{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px;
  left:auto;right:auto;width:min(620px,calc(100vw - 24px));border:1px solid var(--bp-line);border-radius:14px;margin-top:6px}
.bp[data-look="B"] .bp-row{border:1px solid var(--bp-line);border-radius:10px;min-height:52px;padding:0 12px}
.bp[data-look="B"] .bp-row.is-here{box-shadow:inset 0 0 0 1px var(--bp-navy)}
@media (max-width:640px){
  .bp[data-look="B"] .bp-sheet{grid-template-columns:repeat(2,minmax(0,1fr));left:12px;right:12px;width:auto}
}
/* "My practice" keeps its word on a phone (3 Nov 2026, his pick B showed it);
   only the narrowest phones, where the bar would scroll, fall back to the icon. */
@media (max-width:360px){
  .bp[data-look="B"] .bp-home span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
}

.bp-short{display:none}
@media (max-width:560px){
  .bp-long{display:none}
  .bp-short{display:inline}
  .bp-chip{padding:0 10px;font-size:12.5px}
  .bp-chip .bp-i{display:none}
}
@media (pointer:coarse){
  .bp-menu-btn,.bp-chip{min-height:44px}
  .bp-home{min-width:44px;justify-content:center}
}
@media (prefers-reduced-motion:no-preference){
  .bp-menu-btn .bp-i{transition:transform .15s}
}