/* ═══════════════════════════════════════════════════════════════════════
 * AmpStack — styles.css
 *
 * Auto-generated from index.html. Section order matches original load
 * order to preserve cascade behavior. Each section retains its original
 * block ID (or "anonymous-N") so you can grep for the original location.
 * ═══════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 1/35: ampstack-update-banner-css */
/* ───────────────────────────────────────────────────────────────────── */
  #ampstack-update-banner {
    position: fixed;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%);
    background: linear-gradient(135deg, #ffcc00, #e6b800);
    color: #000;
    padding: 12px 18px;
    border-radius: 12px;
    font-weight: 900;
    font-size: 0.85rem;
    box-shadow: 0 8px 24px rgba(0,0,0,.5);
    z-index: 999999;
    display: none;
    cursor: pointer;
    letter-spacing: .2px;
  }
  #ampstack-update-banner.show { display: block; }
  #ampstack-update-banner:active { transform: translateX(-50%) scale(.97); }

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 2/35: anonymous-1 */
/* ───────────────────────────────────────────────────────────────────── */
  
/* =========================  
   GLOBAL THEME TOKENS  
   ========================= */  
:root{  
  --gold:#ffcc00;  
  --gold2:#ff9900;  
  --green:#2ecc71;  
  --red:#ff4444;  
  
  /* Dark mode defaults */  
  --bg:#0d0d0d;  
  --card:#1a1a1a;  
  --card2:#222;  
  --stroke:#333;  
  --stroke2:#444;  
  --text:#ffffff;  
  
  /* text helpers */  
  --sub:#888;          /* on background */  
  --subCard:#bdbdbd;   /* on cards */  
  
  /* UI */  
  --shadow: 0 14px 28px rgba(0,0,0,0.45);  
  --radius: 16px;  
  
  /* Result boxes */  
  --resBg: rgba(255,204,0,0.10);  
  --resStroke: var(--gold);  
}  
  
/* Light mode */  
html[data-theme="light"]{  
  --bg:#efefef;  
  
  /* white cards on light bg — paper-like aesthetic */  
  --card:#ffffff;  
  --card2:#f3f3f3;  
  
  --stroke:#e5e5e5;  
  --stroke2:#d6d6d6;  
  
  --text:#0d0d0d;  
  
  /* on background */  
  --sub:#666666;  
  /* on white cards */  
  --subCard:#5a5a5a;  
  
  --shadow: 0 6px 18px rgba(0,0,0,0.06);  
  --resBg: rgba(255,204,0,0.12);  
}  
  
/* =========================  
   BASE / PAGES  
   ========================= */  
body{  
  font-family:-apple-system, system-ui, sans-serif;  
  background: var(--bg);  
  color: var(--text);  
  margin:0;  
  overflow-x:hidden;  
}  
.page{  
  display:none;  
  padding:20px;  
  min-height:100vh;  
  animation:fadeIn 0.2s;  
}  
.active{ display:block; }  
@keyframes fadeIn { from {opacity:0;} to {opacity:1;} }  
  
/* =========================  
   HOME HEADER + THEME TOGGLE  
   ========================= */  
.home-header{  
  position:relative;  
  text-align:center;  
  
  /* 🔥 reduced spacing */  
  margin:12px 0 10px 0;  
  padding-top:28px;  
}  
/* ✅ top-right, NO bubble/box, stays put in header */  
.theme-toggle{  
  position:absolute;  
  top:10px;  
  right:10px;  
  display:flex;  
  align-items:center;  
  gap:10px;  
  
  /* ✅ remove any “weird box” look */  
  background:transparent;  
  border:none;  
  box-shadow:none;  
  padding:0;  
}  
  
/* ✅ label (DARK/LIGHT) */  
.theme-toggle .tlabel{  
  font-size:0.78em;  
  letter-spacing:2px;  
  font-weight:1000;  
  text-transform:uppercase;  
  color: var(--sub);  
  user-select:none;  
}  
  
/* =========================  
   UI KIT  
   ========================= */  
.btn-back{  
  background:none;  
  border:1px solid var(--gold);  
  color:var(--gold);  
  padding:10px 18px;  
  border-radius:10px;  
  margin-bottom:20px;  
  cursor:pointer;  
  font-weight:1000;  
  text-transform:uppercase;  
}  
  
.card{  
  background:var(--card);  
  border:1px solid var(--stroke);  
  border-radius:var(--radius);  
  padding:18px;  
  margin-bottom:15px;  
  box-shadow: var(--shadow);  
}  
  
input, select, textarea{  
  width:100%;  
  padding:14px;  
  background:var(--card2);  
  border:1px solid var(--stroke2);  
  color:var(--text);  
  border-radius:12px;  
  margin-top:8px;  
  box-sizing:border-box;  
  font-size:16px;  
}  
  
label{  
  display:block;  
  margin-top:12px;  
  font-size:0.85em;  
  color:var(--subCard);  
  text-transform:uppercase;  
  font-weight:1000;  
  letter-spacing:1px;  
}  
  
h2{  
  color:var(--gold);  
  font-size:1.1em;  
  margin:0 0 10px 0;  
  text-transform:uppercase;  
  border-left:3px solid var(--gold);  
  padding-left:10px;  
}  
  
.res-box{  
  background: var(--resBg);  
  border:1px solid var(--resStroke);  
  padding:18px;  
  border-radius:14px;  
  margin-top:15px;  
  font-weight:1000;  
  transition:0.3s ease;  
  box-shadow: var(--shadow);  
}  
  
/* =========================  
   DASHBOARD GRID  
   ========================= */  
.dashboard{  
  display:grid;  
  grid-template-columns:repeat(2, 1fr);  
  gap:12px;  
  padding:15px;  
}  
  
.block-card{  
  background:var(--card);  
  border:1px solid var(--stroke);  
  border-radius:22px;  
  padding:22px;  
  text-align:center;  
  cursor:pointer;  
  display:flex;  
  flex-direction:column;  
  align-items:center;  
  transition:0.12s;  
  box-shadow: var(--shadow);  
}  
  
.block-card:active{  
  transform:scale(0.97);  
  border-color:var(--gold);  
}  
  
.full-width{  
  grid-column:span 2;  
  flex-direction:row;  
  gap:15px;  
  justify-content:center;  
}  
  
.ai-bar{  
  background:linear-gradient(135deg, #ffcc00 0%, #ff9900 100%);  
  color:#000;  
  border:none;  
  box-shadow: 0 18px 34px rgba(0,0,0,0.25);  
}  
  
.icon{ font-size:26px; margin-bottom:8px; }  
.label{ font-size:0.95em; font-weight:1000; letter-spacing:0.3px; }  
.desc{ font-size:0.7em; color:var(--subCard); }  
  
/* =========================  
   SWITCH (global)  
   ========================= */  
.switch{ position:relative; display:inline-block; width:44px; height:22px; }  
.switch input{ opacity:0; width:0; height:0; }  
.slider{  
  position:absolute;  
  cursor:pointer;  
  top:0; left:0; right:0; bottom:0;  
  background-color:#555;  
  transition:.25s;  
  border-radius:999px;  
  border:1px solid rgba(255,255,255,0.12);  
}  
.slider:before{  
  position:absolute;  
  content:"";  
  height:16px;  
  width:16px;  
  left:3px;  
  bottom:2px;  
  background-color:white;  
  transition:.25s;  
  border-radius:50%;  
}  
input:checked + .slider{ background-color:var(--green); }  
input:checked + .slider:before{ transform:translateX(22px); }  
  
/* =========================  
   CALC TABS (wrap, no sideways scroll)  
   ========================= */  
.calc-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }  
.calc-tabs{  
  display:flex;  
  flex-wrap:wrap;  
  gap:10px;  
  margin:10px 0 12px;  
}  
.tab-btn{  
  background:var(--card2);  
  border:1px solid var(--stroke2);  
  color:var(--subCard);  
  padding:10px 16px;  
  border-radius:999px;  
  white-space:nowrap;  
  font-size:0.82em;  
  font-weight:1000;  
  cursor:pointer;  
  user-select:none;  
}  
.tab-btn.active{  
  background:var(--gold);  
  color:#000;  
  border-color:var(--gold);  
}  
  
/* Helpers */  
.mono{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:0.85em; }  
.warn{ color:var(--red); font-weight:1000; }  
.ok{ color:var(--green); font-weight:1000; }  
/* =========================
   P10 ESTIMATOR — POLISHED
   ========================= */

/* ─── Hero Header ─── */
#p10 .est-hero{
  text-align:center;
  margin: 6px 0 18px;
  padding: 0 8px;
}
#p10 .est-hero-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:56px; height:56px;
  border-radius:18px;
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  margin-bottom:12px;
  box-shadow:0 12px 28px rgba(255,204,0,.32);
  font-size:1.7rem;
}
#p10 .est-hero-title{
  font-size:1.55rem;
  font-weight:1000;
  letter-spacing:-0.5px;
  color:var(--text);
  margin:0 0 4px 0;
  line-height:1.1;
}
#p10 .est-hero-title span{ color:var(--gold); }
#p10 .est-hero-sub{
  font-size:.82rem;
  color:var(--sub);
  font-weight:700;
  margin:0;
}

/* ─── Mode Toggle ─── */
#p10 .est-mode-toggle{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  background:var(--card2);
  border:1px solid var(--stroke);
  border-radius:14px;
  padding:5px;
  margin-bottom:14px;
}
#p10 .est-mode-pill{
  padding:11px 8px;
  border:none;
  border-radius:10px;
  background:transparent;
  color:var(--sub);
  font-size:.78rem;
  font-weight:1000;
  letter-spacing:1px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all .18s;
  text-align:center;
}
#p10 .est-mode-pill.active{
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  color:#000;
  box-shadow:0 4px 12px rgba(255,204,0,.22);
}
#p10 .est-mode-chip{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:.65rem;
  font-weight:1000;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:14px;
  padding:8px 12px;
  background:rgba(255,204,0,.06);
  border:1px solid rgba(255,204,0,.18);
  border-radius:10px;
}

/* ─── Quote Header Card ─── */
#p10 .est-info-card{
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:16px;
  padding:18px 16px;
  box-shadow:var(--shadow);
  margin-bottom:14px;
}
#p10 .est-field{
  margin-bottom:12px;
}
#p10 .est-field:last-child{ margin-bottom:0; }
#p10 .est-field label{
  display:block;
  font-size:.65rem;
  font-weight:1000;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--subCard);
  margin-bottom:6px;
}
#p10 .est-field input,
#p10 .est-field textarea{
  width:100%;
  padding:13px 14px;
  background:var(--card2);
  border:1.5px solid var(--stroke2);
  color:var(--text);
  border-radius:12px;
  font-size:.92rem;
  font-weight:600;
  outline:none;
  font-family:inherit;
  transition:border-color .2s, box-shadow .2s;
}
#p10 .est-field textarea{
  min-height:72px;
  resize:vertical;
  line-height:1.4;
}
#p10 .est-field input:focus,
#p10 .est-field textarea:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(255,204,0,.10);
}
#p10 .est-field input::placeholder,
#p10 .est-field textarea::placeholder{
  color:var(--sub);
  font-weight:500;
}
#p10 .est-field-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

/* ─── Live Total Banner (sticky at top of items) ─── */
#p10 .est-live-banner{
  background:linear-gradient(135deg, rgba(255,204,0,.10), rgba(255,153,0,.04));
  border:1.5px solid rgba(255,204,0,.28);
  border-radius:16px;
  padding:14px 16px;
  margin-bottom:14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
#p10 .est-live-label{
  font-size:.65rem;
  font-weight:1000;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:3px;
}
#p10 .est-live-amount{
  font-size:1.7rem;
  font-weight:1000;
  color:var(--text);
  letter-spacing:-0.5px;
  line-height:1;
  font-variant-numeric:tabular-nums;
}
#p10 .est-live-margin-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:5px 10px;
  border-radius:999px;
  font-size:.65rem;
  font-weight:1000;
  letter-spacing:1px;
  text-transform:uppercase;
}
#p10 .est-live-margin-chip.strong{ background:rgba(46,204,113,.15); color:var(--green); border:1px solid rgba(46,204,113,.3); }
#p10 .est-live-margin-chip.ok{ background:rgba(255,204,0,.10); color:var(--gold); border:1px solid rgba(255,204,0,.25); }
#p10 .est-live-margin-chip.warn,
#p10 .est-live-margin-chip.low{ background:rgba(255,68,68,.10); color:var(--red); border:1px solid rgba(255,68,68,.3); }
#p10 .est-live-margin-chip.quick{ background:var(--card2); color:var(--subCard); border:1px solid var(--stroke2); }

/* ─── Pricing Settings Card ─── */
#p10 .est-pricing-card{
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:16px;
  margin-bottom:14px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
#p10 .est-pricing-toggle{
  width:100%;
  background:transparent;
  border:none;
  padding:16px 18px;
  color:var(--text);
  font-size:.85rem;
  font-weight:1000;
  letter-spacing:.5px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  text-align:left;
}
#p10 .est-pricing-toggle:hover{ background:var(--card2); }
#p10 .est-pricing-toggle .chev{
  font-size:.8rem;
  color:var(--gold);
  transition:transform .25s;
}
#p10 .est-pricing-card.open .est-pricing-toggle .chev{ transform:rotate(90deg); }
#p10 .est-pricing-body{
  display:none;
  padding:0 16px 16px;
  border-top:1px solid var(--stroke2);
}
#p10 .est-pricing-card.open .est-pricing-body{ display:block; }
#p10 .est-pricing-body .est-field{ margin-top:12px; }

/* Inline Toggle (Show Profit) */
#p10 .est-inline-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  background:var(--card2);
  border:1px solid var(--stroke);
  border-radius:12px;
  margin-top:14px;
}
#p10 .est-inline-toggle .toggle-copy{ flex:1; }
#p10 .est-inline-toggle .toggle-title{
  font-size:.82rem;
  font-weight:1000;
  color:var(--text);
  margin-bottom:2px;
}
#p10 .est-inline-toggle .toggle-sub{
  font-size:.7rem;
  color:var(--sub);
  font-weight:600;
}

/* Tax Toggle Button */
#p10 .est-tax-btn{
  width:100%;
  padding:12px;
  background:var(--card2);
  border:1.5px solid var(--stroke2);
  color:var(--text);
  border-radius:12px;
  font-size:.78rem;
  font-weight:1000;
  letter-spacing:1px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all .18s;
}
#p10 .est-tax-btn.on{
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  color:#000;
  border-color:transparent;
}

/* ─── Line Items Card ─── */
#p10 .est-items-card{
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:16px;
  padding:16px;
  box-shadow:var(--shadow);
  margin-bottom:14px;
}
#p10 .est-items-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
#p10 .est-items-title{
  font-size:.95rem;
  font-weight:1000;
  color:var(--text);
}
#p10 .est-items-count{
  font-size:.65rem;
  font-weight:1000;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--gold);
  padding:4px 10px;
  background:rgba(255,204,0,.08);
  border:1px solid rgba(255,204,0,.2);
  border-radius:999px;
}

#p10 #p10-items{
  display:flex;
  flex-direction:column;
  gap:10px;
}

#p10 .est-item-row{
  background:var(--card2);
  border:1px solid var(--stroke);
  border-radius:14px;
  padding:12px;
  position:relative;
}
#p10 .est-item-row .est-row-grid{
  display:grid;
  grid-template-columns: 1fr 70px 90px 90px 36px;
  gap:8px;
  align-items:center;
}
#p10 .est-item-row .est-row-grid.quick{
  grid-template-columns: 1fr 70px 110px 36px;
}
#p10 .est-item-row input{
  width:100%;
  padding:10px 10px;
  background:var(--card);
  border:1.5px solid var(--stroke2);
  color:var(--text);
  border-radius:10px;
  font-size:.85rem;
  font-weight:600;
  outline:none;
  transition:border-color .2s;
}
#p10 .est-item-row input:focus{
  border-color:var(--gold);
}
#p10 .est-item-row .p10-i-desc{
  font-weight:700;
}
#p10 .est-item-row .p10-i-qty,
#p10 .est-item-row .p10-i-mat,
#p10 .est-item-row .p10-i-hrs{
  text-align:center;
  font-variant-numeric:tabular-nums;
}
#p10 .est-item-row .p10-xbtn{
  width:36px; height:36px;
  border:none;
  background:var(--card);
  border:1.5px solid var(--stroke2);
  color:var(--red);
  border-radius:10px;
  font-size:1rem;
  font-weight:1000;
  cursor:pointer;
  transition:all .15s;
}
#p10 .est-item-row .p10-xbtn:hover{
  background:rgba(255,68,68,.1);
  border-color:var(--red);
}

#p10 .est-row-foot{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid var(--stroke2);
}
#p10 .p10-foot-hint{
  font-size:.66rem;
  font-weight:700;
  color:var(--sub);
  letter-spacing:.5px;
  text-transform:uppercase;
}
#p10 .p10-row-total{
  font-size:.95rem;
  font-weight:1000;
  color:var(--gold);
  font-variant-numeric:tabular-nums;
}
#p10 .p10-row-labels{
  display:grid;
  grid-template-columns: 1fr 70px 90px 90px 36px;
  gap:8px;
  margin-bottom:6px;
  padding: 0 4px;
}
#p10 .p10-row-labels.quick{
  grid-template-columns: 1fr 70px 110px 36px;
}
#p10 .p10-row-labels span{
  font-size:.6rem;
  font-weight:1000;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:var(--sub);
}

#p10 .est-empty-items{
  text-align:center;
  padding:30px 20px;
  color:var(--sub);
  font-size:.85rem;
  font-weight:600;
  border:2px dashed var(--stroke2);
  border-radius:12px;
}

/* ─── Action Buttons ─── */
#p10 .est-add-work-btn{
  width:100%;
  padding:15px;
  margin-top:12px;
  border:none;
  border-radius:14px;
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  color:#000;
  font-size:.95rem;
  font-weight:1000;
  letter-spacing:.5px;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(255,204,0,.25);
  transition:transform .12s, box-shadow .12s;
}
#p10 .est-add-work-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(255,204,0,.35);
}
#p10 .est-add-custom-btn{
  width:100%;
  padding:13px;
  margin-top:10px;
  background:transparent;
  border:1.5px dashed var(--stroke2);
  color:var(--subCard);
  border-radius:12px;
  font-size:.82rem;
  font-weight:1000;
  letter-spacing:.5px;
  cursor:pointer;
  transition:all .15s;
}
#p10 .est-add-custom-btn:hover{
  border-color:var(--gold);
  color:var(--gold);
}

/* ─── Top Action Buttons ─── */
#p10 .est-top-actions{
  display:flex;
  gap:8px;
  margin-bottom:14px;
}
#p10 .est-top-btn{
  flex:1;
  padding:11px;
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:12px;
  color:var(--subCard);
  font-size:.72rem;
  font-weight:1000;
  letter-spacing:1px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all .15s;
}
#p10 .est-top-btn:hover{
  border-color:var(--gold);
  color:var(--gold);
}

/* ─── Generated Quote Box ─── */
#p10 .est-res-box{
  background:linear-gradient(135deg, var(--card), var(--card2));
  border:2px solid rgba(255,204,0,.3);
  border-radius:20px;
  padding:22px 20px;
  margin-top:18px;
  box-shadow:0 20px 50px rgba(0,0,0,.4);
  display:none;
}
#p10 .est-quote-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px;
  padding-bottom:14px;
  border-bottom:1px solid var(--stroke2);
}
#p10 .est-res-title{
  font-size:1.05rem;
  font-weight:1000;
  color:var(--text);
  letter-spacing:.5px;
  line-height:1.2;
  margin-bottom:4px;
}
#p10 .est-res-job{
  font-size:.78rem;
  color:var(--subCard);
  font-weight:700;
  margin-bottom:2px;
}
#p10 .est-res-id{
  font-size:.68rem;
  color:var(--sub);
  font-weight:700;
  letter-spacing:.5px;
}
#p10 .est-res-date{
  font-size:.68rem;
  color:var(--sub);
  font-weight:700;
  margin-top:1px;
}
#p10 .est-quote-badge{
  flex-shrink:0;
  padding:5px 11px;
  border-radius:999px;
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  color:#000;
  font-size:.62rem;
  font-weight:1000;
  letter-spacing:1px;
  text-transform:uppercase;
}

#p10 .est-total-card{
  background:linear-gradient(135deg, rgba(255,204,0,.12), rgba(255,153,0,.04));
  border:1.5px solid rgba(255,204,0,.35);
  border-radius:14px;
  padding:18px;
  text-align:center;
  margin-bottom:14px;
}
#p10 .est-total-label{
  font-size:.65rem;
  font-weight:1000;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:6px;
}
#p10 .est-total-value{
  font-size:2.4rem;
  font-weight:1000;
  color:var(--text);
  letter-spacing:-1px;
  line-height:1;
  font-variant-numeric:tabular-nums;
}

#p10 .est-break-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:14px;
}
#p10 .est-break-item{
  background:var(--card2);
  border:1px solid var(--stroke);
  border-radius:12px;
  padding:11px 12px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
#p10 .est-break-item span{
  font-size:.7rem;
  font-weight:1000;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:var(--sub);
}
#p10 .est-break-item b{
  font-size:.92rem;
  font-weight:1000;
  color:var(--text);
  font-variant-numeric:tabular-nums;
}

#p10 .est-scope-box{
  background:var(--card2);
  border:1px solid var(--stroke);
  border-radius:14px;
  padding:14px;
  margin-bottom:14px;
}
#p10 .est-scope-title{
  font-size:.7rem;
  font-weight:1000;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:6px;
}
#p10 #p10-res-scope{
  font-size:.85rem;
  color:var(--text);
  line-height:1.5;
  white-space:pre-line;
  font-weight:600;
}

#p10 .est-result-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:12px;
}
#p10 .est-result-btn{
  padding:13px;
  border:none;
  border-radius:12px;
  font-size:.8rem;
  font-weight:1000;
  letter-spacing:.5px;
  cursor:pointer;
  transition:transform .12s, box-shadow .12s;
}
#p10 .est-result-btn.send{
  grid-column:1 / -1;
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  color:#000;
  box-shadow:0 6px 18px rgba(255,204,0,.25);
  font-size:.95rem;
  padding:15px;
}
#p10 .est-result-btn.send:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(255,204,0,.35); }
#p10 .est-result-btn.print{
  grid-column:1 / -1;
  background:transparent;
  border:1.5px solid var(--gold);
  color:var(--gold);
  font-size:.9rem;
  padding:14px;
}
#p10 .est-result-btn.print:hover{
  background:rgba(255,204,0,.08);
  transform:translateY(-1px);
}
#p10 .est-result-btn.dark{
  background:var(--card2);
  border:1px solid var(--stroke2);
  color:var(--subCard);
}
#p10 .est-result-btn.dark:hover{
  border-color:var(--gold);
  color:var(--gold);
}

#p10 .est-valid-line{
  text-align:center;
  font-size:.7rem;
  font-weight:1000;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:8px;
}
#p10 .est-fineprint{
  font-size:.68rem;
  color:var(--sub);
  text-align:center;
  line-height:1.5;
  padding-top:12px;
  border-top:1px solid var(--stroke2);
}

/* ─── Add Work Panel ─── */
#p10 .est-panel-mask{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.7);
  backdrop-filter:blur(4px);
  z-index:9000;
}
#p10 .est-panel{
  display:none;
  position:fixed;
  bottom:0; left:0; right:0;
  z-index:9001;
  background:var(--bg);
  border-top:2px solid rgba(255,204,0,.3);
  border-radius:24px 24px 0 0;
  padding:18px 16px;
  max-height:85vh;
  overflow-y:auto;
  box-shadow:0 -20px 50px rgba(0,0,0,.5);
}
#p10 .est-panel h3{
  font-size:1.2rem;
  font-weight:1000;
  color:var(--text);
  margin:0 0 14px;
  text-align:center;
  letter-spacing:-0.3px;
}
#p10 .est-panel-tabs{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:5px;
  background:var(--card2);
  border:1px solid var(--stroke);
  padding:4px;
  border-radius:12px;
  margin-bottom:12px;
}
#p10 .est-panel-tab{
  padding:9px 4px;
  border:none;
  border-radius:9px;
  background:transparent;
  color:var(--sub);
  font-size:.7rem;
  font-weight:1000;
  letter-spacing:.5px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all .15s;
}
#p10 .est-panel-tab.active{
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  color:#000;
}
#p10 .est-search{
  width:100%;
  padding:12px 14px;
  background:var(--card);
  border:1.5px solid var(--stroke2);
  color:var(--text);
  border-radius:12px;
  font-size:.9rem;
  outline:none;
  margin-bottom:12px;
}
#p10 .est-search:focus{ border-color:var(--gold); }
#p10 .est-panel-section{ margin-bottom:14px; }
#p10 .est-panel-section-title{
  font-size:.7rem;
  font-weight:1000;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:8px;
  padding:0 4px;
}
#p10 .est-panel-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
#p10 .est-pbtn{
  position:relative;
  text-align:left;
  padding:14px 64px 12px 12px;
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:12px;
  color:var(--text);
  font-size:.82rem;
  font-weight:1000;
  cursor:pointer;
  transition:border-color .15s, background .15s;
  line-height:1.3;
  min-height:72px;
  overflow:hidden;
  word-break:break-word;
}
@media (hover: hover) {
  #p10 .est-pbtn:hover{
    border-color:var(--gold);
    background:rgba(255,204,0,.04);
  }
}
#p10 .est-pbtn:active{
  border-color:var(--gold);
  background:rgba(255,204,0,.06);
}
#p10 .est-pbtn small{
  display:block;
  margin-top:5px;
  font-size:.66rem;
  color:var(--sub);
  font-weight:600;
  line-height:1.35;
  padding-right:0;
}
#p10 .est-pbtn .tag{
  position:absolute;
  top:8px;
  right:8px;
  font-size:.52rem;
  font-weight:1000;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:var(--gold);
  padding:3px 7px;
  background:rgba(255,204,0,.12);
  border:1px solid rgba(255,204,0,.3);
  border-radius:5px;
  line-height:1;
  z-index:2;
}
#p10 .est-panel-close{
  width:100%;
  padding:13px;
  margin-top:12px;
  background:var(--card2);
  border:1px solid var(--stroke2);
  color:var(--subCard);
  border-radius:12px;
  font-size:.82rem;
  font-weight:1000;
  letter-spacing:.5px;
  cursor:pointer;
}
#p10 .est-panel-close:hover{
  border-color:var(--gold);
  color:var(--gold);
}

/* ─── History Panel ─── */
#p10 #p10-hist-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:8px;
}
#p10 .est-hist-item{
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:12px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
#p10 .est-hist-meta{ flex:1; min-width:0; }
#p10 .est-hist-title{
  font-size:.88rem;
  font-weight:1000;
  color:var(--text);
  margin-bottom:2px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#p10 .est-hist-sub{
  font-size:.7rem;
  color:var(--sub);
  font-weight:600;
}
#p10 .est-hist-amt{
  font-size:1rem;
  font-weight:1000;
  color:var(--gold);
  font-variant-numeric:tabular-nums;
  flex-shrink:0;
}
#p10 .est-hist-actions{
  display:flex;
  gap:6px;
  flex-shrink:0;
}
#p10 .est-hist-btn{
  width:34px; height:34px;
  border:1px solid var(--stroke2);
  background:var(--card2);
  color:var(--subCard);
  border-radius:9px;
  font-size:.85rem;
  font-weight:1000;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all .15s;
}
#p10 .est-hist-btn:hover{
  border-color:var(--gold);
  color:var(--gold);
}
#p10 .est-hist-btn.delete:hover{
  border-color:var(--red);
  color:var(--red);
}
#p10 .est-hist-empty{
  text-align:center;
  padding:30px 20px;
  color:var(--sub);
  font-size:.85rem;
  font-weight:600;
  border:2px dashed var(--stroke2);
  border-radius:12px;
}

/* ─── Floating Generate Button (FAB) ─── */
#p10-generate.fab-generate{
  position:fixed;
  bottom:18px;
  left:50%;
  transform:translateX(-50%);
  z-index:8000;
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 20px 13px 18px;
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  border:none;
  border-radius:999px;
  color:#000;
  font-weight:1000;
  cursor:pointer;
  box-shadow:0 12px 32px rgba(255,204,0,.4), 0 0 0 1px rgba(0,0,0,.05);
  transition:transform .14s, box-shadow .14s;
}
#p10-generate.fab-generate:active{
  transform:translateX(-50%) scale(.96);
}
#p10-generate.fab-generate:hover{
  transform:translateX(-50%) translateY(-2px);
  box-shadow:0 16px 40px rgba(255,204,0,.5);
}
#p10-generate .fab-icon{
  font-size:1.1rem;
}
#p10-generate .fab-label{
  font-size:.88rem;
  letter-spacing:.5px;
  text-transform:uppercase;
}
#p10-generate .fab-total{
  background:rgba(0,0,0,.18);
  color:#000;
  font-size:.85rem;
  font-weight:1000;
  letter-spacing:.3px;
  padding:5px 11px;
  border-radius:999px;
  font-variant-numeric:tabular-nums;
}
#p10-generate.flash{
  animation: p10FabPulse .5s ease;
}
@keyframes p10FabPulse {
  0% { box-shadow:0 12px 32px rgba(255,204,0,.4); }
  50% { box-shadow:0 12px 32px rgba(255,204,0,.7), 0 0 0 8px rgba(255,204,0,.15); }
  100% { box-shadow:0 12px 32px rgba(255,204,0,.4); }
}

#p10 { padding-bottom: 110px; }

/* ===== P4 horizontal scroll tabs safe ===== */
#p4 .calc-tabs{
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:10px;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
  scrollbar-width:none;
  padding:2px 2px 10px;
  margin:12px 0 14px;
}
#p4 .calc-tabs::-webkit-scrollbar{ display:none; }
#p4 .tab-btn{
  flex:0 0 auto;
  white-space:nowrap;
  border-radius:999px;
  padding:12px 16px;
  transition:transform .16s ease, box-shadow .18s ease, opacity .18s ease;
  opacity:.84;
}
#p4 .tab-btn:active{ transform:scale(.98); }
#p4 .tab-btn.active{
  box-shadow:0 10px 22px rgba(255,204,0,.14), 0 0 0 1px rgba(255,204,0,.18) inset;
  opacity:1;
}


/* ===== P4 small polish ===== */
#p4 .calc-tabs{
  padding-left: 4px;
  padding-right: 18px;
}
#p4 .tab-btn{
  box-shadow:0 4px 10px rgba(0,0,0,.06);
}
#p4 .tab-btn.active{
  transform:translateY(-1px);
  box-shadow:0 12px 24px rgba(255,204,0,.16), 0 0 0 1px rgba(255,204,0,.18) inset;
}
html[data-theme="light"] #p4 .tab-btn{
  box-shadow:0 8px 16px rgba(15,23,42,.06);
}
html[data-theme="light"] #p4 .tab-btn.active{
  box-shadow:0 12px 22px rgba(212,166,0,.18), 0 0 0 1px rgba(212,166,0,.18) inset;
}
#p4 .p4-vd-pro-note{
  margin-top:10px;
  color:var(--sub);
  font-size:.92rem;
  line-height:1.4;
}


/* ===== P4 V-Drop visual upgrade ===== */
#p4-vd-res.p4-vd-status{
  border-width:1px;
  border-style:solid;
  border-radius:22px;
  padding:20px 22px;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
#p4-vd-res .p4-vd-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:140px;
  padding:8px 14px;
  border-radius:999px;
  font-size:1.1rem;
  font-weight:1000;
  letter-spacing:.04em;
  margin-bottom:12px;
}
#p4-vd-res .p4-vd-main{
  font-size:1.15rem;
  line-height:1.45;
}
#p4-vd-res .p4-vd-main b{
  font-size:1.18rem;
}
#p4-vd-res .p4-vd-target{
  margin-top:10px;
  color:var(--sub);
  font-size:.97rem;
}
#p4-vd-res .p4-vd-suggestion{
  margin-top:14px;
  padding:12px 14px;
  border-radius:16px;
  font-size:.98rem;
  line-height:1.45;
  font-weight:700;
}
#p4-vd-res.p4-vd-good{
  border-color:rgba(34,197,94,.55);
  background:linear-gradient(180deg, rgba(34,197,94,.12), rgba(34,197,94,.05));
  box-shadow:0 14px 30px rgba(34,197,94,.10);
}
#p4-vd-res.p4-vd-good .p4-vd-badge{
  background:rgba(34,197,94,.18);
  color:#4ade80;
}
#p4-vd-res.p4-vd-good .p4-vd-suggestion{
  background:rgba(34,197,94,.10);
  color:#86efac;
}
#p4-vd-res.p4-vd-warn{
  border-color:rgba(234,179,8,.55);
  background:linear-gradient(180deg, rgba(234,179,8,.13), rgba(234,179,8,.05));
  box-shadow:0 14px 30px rgba(234,179,8,.10);
}
#p4-vd-res.p4-vd-warn .p4-vd-badge{
  background:rgba(234,179,8,.18);
  color:#facc15;
}
#p4-vd-res.p4-vd-warn .p4-vd-suggestion{
  background:rgba(234,179,8,.10);
  color:#fde68a;
}
#p4-vd-res.p4-vd-bad{
  border-color:rgba(239,68,68,.55);
  background:linear-gradient(180deg, rgba(239,68,68,.13), rgba(239,68,68,.05));
  box-shadow:0 14px 30px rgba(239,68,68,.10);
}
#p4-vd-res.p4-vd-bad .p4-vd-badge{
  background:rgba(239,68,68,.18);
  color:#f87171;
}
#p4-vd-res.p4-vd-bad .p4-vd-suggestion{
  background:rgba(239,68,68,.10);
  color:#fca5a5;
}
html[data-theme="light"] #p4-vd-res.p4-vd-good{
  background:linear-gradient(180deg, rgba(34,197,94,.08), rgba(34,197,94,.03));
  box-shadow:0 12px 24px rgba(34,197,94,.08);
}
html[data-theme="light"] #p4-vd-res.p4-vd-warn{
  background:linear-gradient(180deg, rgba(234,179,8,.10), rgba(234,179,8,.03));
  box-shadow:0 12px 24px rgba(234,179,8,.08);
}
html[data-theme="light"] #p4-vd-res.p4-vd-bad{
  background:linear-gradient(180deg, rgba(239,68,68,.08), rgba(239,68,68,.03));
  box-shadow:0 12px 24px rgba(239,68,68,.08);
}


/* ===== PRO HEADER UPGRADE ===== */
.pro-header{
  display:flex;
  align-items:center;
  gap:12px;
  margin:18px 0 12px;
}
.pro-header-bar{
  width:4px;
  height:28px;
  border-radius:4px;
  background:linear-gradient(180deg,#ffd84d,#f4be00);
  box-shadow:0 0 10px rgba(255,204,0,.4);
}
.pro-header-title{
  font-size:1.35rem;
  font-weight:1000;
  letter-spacing:.04em;
  background:linear-gradient(90deg,#ffd84d,#f4be00);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
html[data-theme="light"] .pro-header-title{
  background:linear-gradient(90deg,#b68b00,#d4a600);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}


/* ===== P4 Breaker -> Wire result ===== */
#p4-bw-res.p4-bw-status{
  border-width:1px;
  border-style:solid;
  border-radius:22px;
  padding:20px 22px;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
#p4-bw-res .p4-bw-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:150px;
  padding:8px 14px;
  border-radius:999px;
  font-size:1.1rem;
  font-weight:1000;
  letter-spacing:.04em;
  margin-bottom:12px;
}
#p4-bw-res .p4-bw-main{
  font-size:1.1rem;
  line-height:1.45;
}
#p4-bw-res .p4-bw-main b{
  font-size:1.18rem;
}
#p4-bw-res .p4-bw-target{
  margin-top:10px;
  color:var(--sub);
  font-size:.97rem;
}
#p4-bw-res .p4-bw-suggestion{
  margin-top:14px;
  padding:12px 14px;
  border-radius:16px;
  font-size:.98rem;
  line-height:1.45;
  font-weight:700;
}
#p4-bw-res.p4-bw-good{
  border-color:rgba(34,197,94,.55);
  background:linear-gradient(180deg, rgba(34,197,94,.12), rgba(34,197,94,.05));
  box-shadow:0 14px 30px rgba(34,197,94,.10);
}
#p4-bw-res.p4-bw-good .p4-bw-badge{
  background:rgba(34,197,94,.18);
  color:#4ade80;
}
#p4-bw-res.p4-bw-good .p4-bw-suggestion{
  background:rgba(34,197,94,.10);
  color:#86efac;
}
#p4-bw-res.p4-bw-warn{
  border-color:rgba(234,179,8,.55);
  background:linear-gradient(180deg, rgba(234,179,8,.13), rgba(234,179,8,.05));
  box-shadow:0 14px 30px rgba(234,179,8,.10);
}
#p4-bw-res.p4-bw-warn .p4-bw-badge{
  background:rgba(234,179,8,.18);
  color:#facc15;
}
#p4-bw-res.p4-bw-warn .p4-bw-suggestion{
  background:rgba(234,179,8,.10);
  color:#fde68a;
}
#p4-bw-res.p4-bw-bad{
  border-color:rgba(239,68,68,.55);
  background:linear-gradient(180deg, rgba(239,68,68,.13), rgba(239,68,68,.05));
  box-shadow:0 14px 30px rgba(239,68,68,.10);
}
#p4-bw-res.p4-bw-bad .p4-bw-badge{
  background:rgba(239,68,68,.18);
  color:#f87171;
}
#p4-bw-res.p4-bw-bad .p4-bw-suggestion{
  background:rgba(239,68,68,.10);
  color:#fca5a5;
}
html[data-theme="light"] #p4-bw-res.p4-bw-good{
  background:linear-gradient(180deg, rgba(34,197,94,.08), rgba(34,197,94,.03));
  box-shadow:0 12px 24px rgba(34,197,94,.08);
}
html[data-theme="light"] #p4-bw-res.p4-bw-warn{
  background:linear-gradient(180deg, rgba(234,179,8,.10), rgba(234,179,8,.03));
  box-shadow:0 12px 24px rgba(234,179,8,.08);
}
html[data-theme="light"] #p4-bw-res.p4-bw-bad{
  background:linear-gradient(180deg, rgba(239,68,68,.08), rgba(239,68,68,.03));
  box-shadow:0 12px 24px rgba(239,68,68,.08);
}


/* subtle spacing improvement */
#p4-bf-res .p4-bw-main {
  margin-top: 6px;
}


/* highlight service result */
#p4-sl-res .p4-bw-main:first-of-type b {
  color: #ffd54a;
  font-size: 1.2em;
}


/* ===== Global UI tighten pass ===== */
.page h2{
  letter-spacing:.02em;
}
.card{
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}
.card label{
  margin-top:10px;
  margin-bottom:8px;
  display:block;
}
input, select, textarea{
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
input:focus, select:focus, textarea:focus{
  outline:none;
  border-color:#0b69b7 !important;
  box-shadow:0 0 0 1px rgba(11,105,183,.18), 0 0 0 4px rgba(11,105,183,.10);
}
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus{
  border-color:#0b69b7 !important;
  box-shadow:0 0 0 1px rgba(11,105,183,.18), 0 0 0 4px rgba(11,105,183,.08);
}
.tool-note{
  margin-top:12px;
  font-size:.88em;
  color:var(--sub);
  line-height:1.45;
}
#p4 .res-box{
  line-height:1.38;
}
#p4 .p4-bw-main{
  margin-top:6px;
}
#p4 .p4-bw-target{
  margin-top:12px;
}
#p4 .p4-bw-suggestion{
  margin-top:14px;
}
#p4-sl-res .p4-bw-main:first-of-type b{
  color:#ffd54a;
  font-size:1.2em;
}
html[data-theme="light"] #p4-sl-res .p4-bw-main:first-of-type b{
  color:#b68b00;
}
.sub-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
@media (max-width:700px){
  .sub-grid{grid-template-columns:1fr;}
}
.sub-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 12px;
  border-radius:999px;
  font-weight:900;
  letter-spacing:.04em;
  border:1px solid var(--stroke2);
  background:var(--card2);
}
.sub-pill.active{
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
  border-color:#d4a600;
}
.sub-btn{
  width:100%;
  padding:14px 16px;
  border-radius:16px;
  border:1px solid var(--stroke2);
  background:var(--card2);
  color:var(--text);
  font-weight:900;
  cursor:pointer;
}
.sub-btn.primary{
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
  border-color:#d4a600;
}
.paywall-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
  align-items:flex-end;
  justify-content:center;
  background:rgba(0,0,0,.55);
  padding:18px;
}
.paywall-sheet{
  width:min(720px,100%);
  border-radius:22px;
  border:1px solid var(--stroke2);
  background:var(--card);
  padding:18px;
  box-shadow:0 30px 60px rgba(0,0,0,.35);
}
.paywall-kicker{
  color:var(--gold);
  font-weight:1000;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.82rem;
}
.paywall-title{
  margin-top:6px;
  font-size:1.5rem;
  font-weight:1000;
}
.paywall-list{
  margin:12px 0 0;
  padding-left:18px;
  color:var(--sub);
  line-height:1.55;
}


/* ===== P2 conduit result upgrade ===== */
#c-res.p2-fill-card{
  border-width:1px;
  border-style:solid;
  border-radius:22px;
  padding:18px 20px;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
#c-res .p2-fill-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:130px;
  padding:8px 14px;
  border-radius:999px;
  font-size:1.05rem;
  font-weight:1000;
  letter-spacing:.04em;
  margin-bottom:12px;
}
#c-res .p2-fill-main{
  font-size:1.06rem;
  line-height:1.45;
  margin-top:6px;
}
#c-res .p2-fill-main b{
  font-size:1.14rem;
}
#c-res .p2-fill-target{
  margin-top:12px;
  color:var(--sub);
  font-size:.95rem;
}
#c-res .p2-fill-note{
  margin-top:14px;
  padding:12px 14px;
  border-radius:16px;
  font-size:.96rem;
  line-height:1.45;
  font-weight:700;
}
#c-res.p2-good{
  border-color:rgba(34,197,94,.55);
  background:linear-gradient(180deg, rgba(34,197,94,.12), rgba(34,197,94,.05));
  box-shadow:0 14px 30px rgba(34,197,94,.10);
}
#c-res.p2-good .p2-fill-badge{background:rgba(34,197,94,.18);color:#4ade80;}
#c-res.p2-good .p2-fill-note{background:rgba(34,197,94,.10);color:#86efac;}
#c-res.p2-warn{
  border-color:rgba(234,179,8,.55);
  background:linear-gradient(180deg, rgba(234,179,8,.13), rgba(234,179,8,.05));
  box-shadow:0 14px 30px rgba(234,179,8,.10);
}
#c-res.p2-warn .p2-fill-badge{background:rgba(234,179,8,.18);color:#facc15;}
#c-res.p2-warn .p2-fill-note{background:rgba(234,179,8,.10);color:#fde68a;}
#c-res.p2-bad{
  border-color:rgba(239,68,68,.55);
  background:linear-gradient(180deg, rgba(239,68,68,.13), rgba(239,68,68,.05));
  box-shadow:0 14px 30px rgba(239,68,68,.10);
}
#c-res.p2-bad .p2-fill-badge{background:rgba(239,68,68,.18);color:#f87171;}
#c-res.p2-bad .p2-fill-note{background:rgba(239,68,68,.10);color:#fca5a5;}
html[data-theme="light"] #c-res.p2-good{background:linear-gradient(180deg, rgba(34,197,94,.08), rgba(34,197,94,.03));box-shadow:0 12px 24px rgba(34,197,94,.08);}
html[data-theme="light"] #c-res.p2-warn{background:linear-gradient(180deg, rgba(234,179,8,.10), rgba(234,179,8,.03));box-shadow:0 12px 24px rgba(234,179,8,.08);}
html[data-theme="light"] #c-res.p2-bad{background:linear-gradient(180deg, rgba(239,68,68,.08), rgba(239,68,68,.03));box-shadow:0 12px 24px rgba(239,68,68,.08);}


/* ===== P2 fill bar + extras ===== */
#c-res .p2-fill-hero{
  font-size:1.28rem;
  line-height:1.25;
  margin-top:4px;
}
#c-res .p2-fill-hero b{
  font-size:1.42rem;
}
#c-res .p2-fill-bar{
  width:100%;
  height:12px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
  margin:12px 0 14px;
}
#c-res .p2-fill-bar > span{
  display:block;
  height:100%;
  width:0%;
  border-radius:999px;
}
#c-res .p2-fill-extra{
  margin-top:10px;
  padding:12px 14px;
  border-radius:16px;
  font-size:.96rem;
  line-height:1.45;
  font-weight:700;
  background:rgba(255,255,255,.06);
}
html[data-theme="light"] #c-res .p2-fill-bar{
  background:rgba(15,23,42,.06);
  border-color:rgba(15,23,42,.08);
}
html[data-theme="light"] #c-res .p2-fill-extra{
  background:rgba(15,23,42,.04);
}


/* ===== P2 wire sizing connection ===== */
#c-res .p2-wire-warning{
  margin-top:12px;
  padding:12px 14px;
  border-radius:16px;
  font-size:.96rem;
  line-height:1.45;
  font-weight:800;
  background:rgba(255,255,255,.06);
}
#c-res.p2-warn .p2-wire-warning{
  background:rgba(234,179,8,.10);
  color:#fde68a;
}
#c-res.p2-bad .p2-wire-warning{
  background:rgba(239,68,68,.10);
  color:#fca5a5;
}
html[data-theme="light"] #c-res .p2-wire-warning{
  background:rgba(15,23,42,.04);
  color:var(--text);
}


/* ===== P2 severe derating warning ===== */
#c-res .p2-wire-warning.severe{
  background:rgba(239,68,68,.15);
  color:#f87171;
  border:1px solid rgba(239,68,68,.28);
}
html[data-theme="light"] #c-res .p2-wire-warning.severe{
  background:rgba(239,68,68,.08);
  color:#b91c1c;
  border:1px solid rgba(239,68,68,.18);
}


/* ===== P5 Concrete buttons + result badges ===== */
#p5 .p5-btn-gold{
  flex:1;
  border:none;
  border-radius:12px;
  padding:12px 14px;
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  color:#1a1200;
  font-weight:1000;
  font-size:.88rem;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(255,204,0,.22);
  transition:transform .14s ease;
}
#p5 .p5-btn-gold:active{ transform:scale(.98); }
#p5 .p5-btn-subtle{
  flex:1;
  border:1px solid var(--stroke);
  border-radius:12px;
  padding:12px 14px;
  background:var(--card2);
  color:var(--text);
  font-weight:1000;
  font-size:.88rem;
  cursor:pointer;
  transition:transform .14s ease, background .14s ease;
}
#p5 .p5-btn-subtle:active{ transform:scale(.98); }
html[data-theme="light"] #p5 .p5-btn-subtle{
  background:rgba(15,23,42,.04);
}

/* Result cards (shared pattern with P4) */
#p5 .p5-result{
  padding:18px 16px;
}
#p5 .p5-res-badge{
  display:inline-block;
  padding:6px 14px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  color:#1a1200;
  font-weight:1000;
  font-size:.78rem;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:12px;
}
#p5 .p5-res-hero{
  font-size:2.1rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1;
  letter-spacing:-.5px;
  margin-bottom:4px;
}
#p5 .p5-res-hero-unit{
  font-size:.7rem;
  color:var(--sub);
  letter-spacing:1px;
  text-transform:uppercase;
  font-weight:800;
  margin-left:4px;
}
#p5 .p5-res-subline{
  font-size:.82rem;
  color:var(--sub);
  font-weight:700;
  margin-bottom:14px;
  line-height:1.4;
}
#p5 .p5-res-bags{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-bottom:10px;
}
#p5 .p5-bag-card{
  padding:12px 8px;
  border-radius:14px;
  background:rgba(255,255,255,.05);
  text-align:center;
  border:1px solid rgba(255,255,255,.04);
}
#p5 .p5-bag-card.preferred{
  background:rgba(255,204,0,.10);
  border:1px solid rgba(255,204,0,.24);
}
#p5 .p5-bag-size{
  font-size:.64rem;
  font-weight:1000;
  color:var(--sub);
  letter-spacing:.6px;
  text-transform:uppercase;
}
#p5 .p5-bag-card.preferred .p5-bag-size{ color:var(--gold); }
#p5 .p5-bag-qty{
  font-size:1.3rem;
  font-weight:1000;
  color:var(--text);
  line-height:1.1;
  margin-top:3px;
}
#p5 .p5-bag-qty-sub{
  font-size:.62rem;
  color:var(--sub);
  font-weight:700;
  margin-top:2px;
  line-height:1.2;
}
#p5 .p5-cost-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(34,197,94,.10);
  border:1px solid rgba(34,197,94,.22);
  margin-top:8px;
}
#p5 .p5-cost-label{
  font-size:.7rem;
  font-weight:1000;
  letter-spacing:1px;
  text-transform:uppercase;
  color:#4ade80;
}
#p5 .p5-cost-value{
  font-size:1.3rem;
  font-weight:1000;
  color:var(--text);
}
#p5 .p5-readymix{
  margin-top:10px;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(255,204,0,.08);
  border:1px solid rgba(255,204,0,.20);
  font-size:.76rem;
  color:var(--text);
  font-weight:700;
  line-height:1.5;
}
#p5 .p5-readymix b{ color:var(--gold); }
html[data-theme="light"] #p5 .p5-bag-card{
  background:rgba(15,23,42,.04);
  border-color:rgba(15,23,42,.06);
}
html[data-theme="light"] #p5 .p5-bag-card.preferred{
  background:rgba(212,166,0,.08);
  border-color:rgba(212,166,0,.22);
}


/* ===== P4 tile grid (replaces horizontal tab strip) ===== */
#p4 .p4-tilegrid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:8px;
  margin:6px 0 16px;
}
#p4 .p4-tile{
  all:unset;
  box-sizing:border-box;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-height:62px;
  padding:10px 6px;
  border-radius:14px;
  background:var(--card);
  border:1px solid var(--stroke);
  text-align:center;
  transition:transform .14s ease, border-color .14s ease, box-shadow .18s ease, background .18s ease;
  box-shadow:0 4px 10px rgba(0,0,0,.06);
}
#p4 .p4-tile:active{ transform:scale(.97); }
#p4 .p4-tile .p4-tile-ico{
  font-size:.95rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1;
  letter-spacing:.3px;
  text-transform:uppercase;
  opacity:.85;
}
#p4 .p4-tile .p4-tile-lbl{
  font-size:.68rem;
  font-weight:1000;
  letter-spacing:.3px;
  color:var(--text);
  line-height:1.1;
}
#p4 .p4-tile.active{
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  border-color:transparent;
  box-shadow:0 6px 14px rgba(255,204,0,.14), 0 0 0 1px rgba(255,204,0,.20) inset;
  transform:translateY(-1px);
}
#p4 .p4-tile.active .p4-tile-ico,
#p4 .p4-tile.active .p4-tile-lbl{
  color:#1a1200;
}
html[data-theme="light"] #p4 .p4-tile{
  box-shadow:0 8px 16px rgba(15,23,42,.06);
}
html[data-theme="light"] #p4 .p4-tile.active{
  box-shadow:0 12px 22px rgba(212,166,0,.22), 0 0 0 1px rgba(212,166,0,.22) inset;
}


/* ===== P4 Bending Master ===== */
/* ===== P4 Bending field reference - collapsible ===== */
#p4-bend .p4-bend-ref-collapsible{
  padding-bottom:0;
  transition:padding .18s ease;
}
#p4-bend .p4-bend-ref-collapsible[open]{
  padding-bottom:14px;
}
#p4-bend .p4-bend-ref-summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:6px 0;
  margin:0 0 -4px;
  user-select:none;
}
#p4-bend .p4-bend-ref-summary::-webkit-details-marker{ display:none; }
#p4-bend .p4-bend-ref-chev{
  font-size:1rem;
  color:var(--gold);
  transition:transform .22s ease;
  padding:4px 6px;
}
#p4-bend .p4-bend-ref-collapsible[open] .p4-bend-ref-chev{
  transform:rotate(180deg);
}
#p4-bend .p4-bend-ref-body{
  padding-top:4px;
}


/* ===== P4 Bending field reference card ===== */
#p4-bend .p4-bend-ref-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:4px 12px;
  font-size:.82rem;
  font-weight:700;
  color:var(--sub);
  line-height:1.5;
}
#p4-bend .p4-bend-ref-grid > div{
  display:flex;
  justify-content:space-between;
  padding:5px 0;
  border-bottom:1px solid rgba(255,255,255,.05);
}
#p4-bend .p4-bend-ref-grid b{
  color:var(--text);
  font-weight:1000;
}
#p4-bend .p4-bend-ref-tips{
  margin-top:14px;
  padding:12px 14px;
  border-radius:12px;
  background:rgba(255,204,0,.06);
  border:1px solid rgba(255,204,0,.14);
  font-size:.72rem;
  color:var(--sub);
  font-weight:700;
  line-height:1.55;
  display:flex;
  flex-direction:column;
  gap:4px;
}
#p4-bend .p4-bend-ref-tips b{
  color:var(--gold);
}
html[data-theme="light"] #p4-bend .p4-bend-ref-grid > div{
  border-bottom-color:rgba(15,23,42,.06);
}
html[data-theme="light"] #p4-bend .p4-bend-ref-tips{
  background:rgba(212,166,0,.08);
  border-color:rgba(212,166,0,.18);
}



/* ===== P4 Bending result UI (step cards, hero, SVG) ===== */
#p4-bend .p4-bend-res{
  margin:14px 0;
  padding:16px;
  border-radius:18px;
  background:var(--card);
  border:1px solid var(--stroke);
}
#p4-bend .p4-bend-visual{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:10px 0 6px;
  color:var(--gold);
  opacity:.9;
}
#p4-bend .p4-bend-visual svg{
  width:70%;
  max-width:220px;
  height:auto;
}
#p4-bend .p4-bend-conduit-line{
  text-align:center;
  font-size:.76rem;
  font-weight:800;
  color:var(--sub);
  letter-spacing:.3px;
  margin:0 0 10px;
}
#p4-bend .p4-bend-hero{
  text-align:center;
  padding:4px 0 14px;
}
#p4-bend .p4-bend-hero-badge{
  display:inline-block;
  padding:6px 14px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  color:#1a1200;
  font-weight:1000;
  font-size:.78rem;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:10px;
}
#p4-bend .p4-bend-hero-value{
  font-size:2.2rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1;
  letter-spacing:-.5px;
}
#p4-bend .p4-bend-hero-unit{
  font-size:.74rem;
  color:var(--sub);
  letter-spacing:1px;
  text-transform:uppercase;
  font-weight:800;
  margin-left:4px;
}
#p4-bend .p4-bend-step{
  display:flex;
  gap:12px;
  padding:14px 12px;
  margin-top:8px;
  border-radius:14px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.04);
}
#p4-bend .p4-bend-step-num{
  flex:0 0 auto;
  width:32px;
  height:32px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  color:#1a1200;
  font-weight:1000;
  font-size:.9rem;
  display:flex;
  align-items:center;
  justify-content:center;
}
#p4-bend .p4-bend-step-body{ flex:1 1 auto; min-width:0; }
#p4-bend .p4-bend-step-title{
  font-size:.86rem;
  font-weight:1000;
  color:var(--text);
  line-height:1.25;
}
#p4-bend .p4-bend-step-mark{
  font-size:1.5rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1.1;
  margin:4px 0 2px;
  letter-spacing:-.3px;
}
#p4-bend .p4-bend-step-hint{
  font-size:.78rem;
  color:var(--sub);
  font-weight:700;
  line-height:1.45;
  margin-top:3px;
}
#p4-bend .p4-bend-arrow{
  display:inline-block;
  margin-top:8px;
  padding:4px 10px;
  border-radius:999px;
  font-size:.66rem;
  font-weight:1000;
  letter-spacing:1px;
  text-transform:uppercase;
}
#p4-bend .p4-bend-arrow.toward{
  background:rgba(34,197,94,.14);
  color:#4ade80;
  border:1px solid rgba(34,197,94,.28);
}
#p4-bend .p4-bend-arrow.away{
  background:rgba(96,165,250,.14);
  color:#93c5fd;
  border:1px solid rgba(96,165,250,.28);
}
#p4-bend .p4-bend-arrow.opposite{
  background:rgba(168,85,247,.14);
  color:#c4b5fd;
  border:1px solid rgba(168,85,247,.28);
}
#p4-bend .p4-bend-footnote{
  margin-top:10px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(255,204,0,.06);
  border:1px solid rgba(255,204,0,.14);
  font-size:.72rem;
  color:var(--sub);
  font-weight:700;
  line-height:1.45;
}
html[data-theme="light"] #p4-bend .p4-bend-step{
  background:rgba(15,23,42,.04);
  border-color:rgba(15,23,42,.06);
}
html[data-theme="light"] #p4-bend .p4-bend-footnote{
  background:rgba(212,166,0,.08);
  border-color:rgba(212,166,0,.18);
}



#p4 .p4-bend-picker{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:6px;
}
#p4 .p4-bend-btn{
  all:unset;
  box-sizing:border-box;
  cursor:pointer;
  text-align:center;
  padding:10px 8px;
  border-radius:10px;
  background:var(--card2);
  border:1px solid var(--stroke);
  font-size:.78rem;
  font-weight:1000;
  color:var(--text);
  transition:transform .12s ease, background .16s ease, border-color .16s ease;
}
#p4 .p4-bend-btn:active{ transform:scale(.98); }
#p4 .p4-bend-btn.active{
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  color:#1a1200;
  border-color:transparent;
  box-shadow:0 8px 18px rgba(255,204,0,.22);
}
html[data-theme="light"] #p4 .p4-bend-btn{
  background:rgba(15,23,42,.04);
}


/* ===== P4 troubleshooting-only mode ===== */
#p4.service-mode .calc-tabs{ display:none !important; }
#p4.service-mode #p4-title{
  margin-bottom:10px;
}

#p4-sl-res .ts-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
#p4-sl-res .ts-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 14px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:1000;
  letter-spacing:.08em;
}
#p4-sl-res .ts-head{
  font-size:1.2rem;
  font-weight:1000;
  margin-top:10px;
}
#p4-sl-res .ts-sub{
  margin-top:6px;
  color:var(--sub);
  line-height:1.45;
}
#p4-sl-res .ts-ladder{
  margin-top:14px;
  display:grid;
  gap:12px;
}
#p4-sl-res .ts-node{
  border:1px solid rgba(255,204,0,.18);
  border-radius:20px;
  padding:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
}
#p4-sl-res .ts-node.red{
  border-color:rgba(255,68,68,.34);
  background:linear-gradient(180deg, rgba(255,68,68,.11), rgba(255,68,68,.05));
}
#p4-sl-res .ts-node.green{
  border-color:rgba(34,197,94,.34);
  background:linear-gradient(180deg, rgba(34,197,94,.10), rgba(34,197,94,.04));
}
#p4-sl-res .ts-node.yellow{
  border-color:rgba(234,179,8,.34);
  background:linear-gradient(180deg, rgba(234,179,8,.10), rgba(234,179,8,.04));
}
#p4-sl-res .ts-node-title{
  font-weight:1000;
  color:var(--gold);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.82rem;
  margin-bottom:8px;
}
#p4-sl-res .ts-branches{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:10px;
}
@media (max-width:720px){
  #p4-sl-res .ts-branches{ grid-template-columns:1fr; }
}
#p4-sl-res .ts-branch{
  border:1px dashed rgba(255,255,255,.18);
  border-radius:16px;
  padding:12px;
}
#p4-sl-res .ts-branch .yn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:54px;
  padding:5px 10px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:1000;
  margin-bottom:8px;
}
#p4-sl-res .ts-branch .yn.yes{
  background:rgba(239,68,68,.16);
  color:#fda4a4;
}
#p4-sl-res .ts-branch .yn.no{
  background:rgba(34,197,94,.16);
  color:#86efac;
}
#p4-sl-res .ts-branch .yn.note{
  background:rgba(234,179,8,.16);
  color:#fde68a;
}
#p4-sl-res .ts-list{
  margin:0 0 0 18px;
  line-height:1.45;
}
#p4-sl-res .ts-footer-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:12px;
}
@media (max-width:720px){
  #p4-sl-res .ts-footer-grid{ grid-template-columns:1fr; }
}



/* =========================
   P11 BUSBAR
   ========================= */
#p11{
  padding-bottom:110px;
}
.busbar-shell{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.busbar-hero{
  border:1px solid rgba(255,204,0,.35);
  background:linear-gradient(180deg, rgba(255,204,0,.10), rgba(255,204,0,.03));
}
.busbar-topline{
  color:var(--gold);
  font-size:.76rem;
  font-weight:1000;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.busbar-title-row{
  margin-top:10px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.busbar-title{
  font-size:2rem;
  line-height:1;
  font-weight:1000;
  letter-spacing:-.03em;
}
.busbar-sub{
  margin-top:8px;
  color:var(--subCard);
  line-height:1.45;
}
.busbar-post-btn,
.busbar-action{
  border:none;
  border-radius:14px;
  padding:14px 16px;
  font-weight:1000;
  cursor:pointer;
}
.busbar-post-btn,
.busbar-action.primary{
  background:var(--gold);
  color:#000;
}
.busbar-action.secondary{
  background:#111;
  color:#fff;
  border:1px solid var(--stroke2);
}
.busbar-stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}
.busbar-stat{
  background:rgba(0,0,0,.20);
  border:1px solid var(--stroke);
  border-radius:16px;
  padding:12px;
}
.busbar-stat span{
  display:block;
  color:var(--sub);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:1000;
}
.busbar-stat b{
  display:block;
  margin-top:6px;
  font-size:1rem;
}
.busbar-tab{display:none;}
.busbar-tab.active{display:block;}
.busbar-composer-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:10px;
}
.busbar-avatar{
  width:44px;
  height:44px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:1000;
  flex-shrink:0;
}
.busbar-avatar.gold{background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%); color:#000;}
.busbar-avatar.dark{background:#111; color:var(--gold); border:1px solid var(--stroke2);}
.busbar-section-title{
  font-size:1.05rem;
  font-weight:1000;
  margin-bottom:6px;
}
.busbar-muted{
  color:var(--sub);
  line-height:1.4;
  font-size:.9rem;
}
.busbar-grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.busbar-post-card,
.busbar-job-card,
.busbar-talk-card,
.busbar-badge-card{
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:16px;
  margin-bottom:12px;
}
.busbar-post-head,
.busbar-job-head,
.busbar-talk-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
}
.busbar-user-line{
  display:flex;
  align-items:center;
  gap:10px;
}
.busbar-name{
  font-weight:1000;
}
.busbar-meta{
  color:var(--sub);
  font-size:.84rem;
  margin-top:2px;
}
.busbar-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.busbar-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,204,0,.08);
  border:1px solid rgba(255,204,0,.20);
  color:var(--gold);
  font-size:.78rem;
  font-weight:1000;
}
.busbar-photo{
  margin-top:12px;
  border-radius:18px;
  min-height:180px;
  border:1px solid var(--stroke);
  background:
    linear-gradient(135deg, rgba(255,204,0,.18), rgba(255,153,0,.08)),
    linear-gradient(180deg, #222, #101010);
  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
  padding:14px;
  overflow:hidden;
  position:relative;
}
.busbar-photo:before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at top right, rgba(255,255,255,.18), transparent 40%);
  pointer-events:none;
}
.busbar-photo-label{
  position:relative;
  z-index:1;
  padding:8px 10px;
  border-radius:999px;
  background:rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.10);
  color:#fff;
  font-weight:1000;
}
.busbar-caption{
  margin-top:12px;
  line-height:1.45;
}
.busbar-reactions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.busbar-react-btn{
  border:none;
  border-radius:14px;
  padding:12px;
  font-weight:1000;
  cursor:pointer;
  background:var(--card2);
  color:var(--text);
  border:1px solid var(--stroke2);
}
.busbar-react-btn.primary{
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
  border:none;
}
.busbar-list-stack{display:flex; flex-direction:column; gap:12px;}
.busbar-job-pay{
  color:var(--gold);
  font-size:1.15rem;
  font-weight:1000;
}
.busbar-job-title,
.busbar-talk-title,
.busbar-badge-title{
  font-size:1.08rem;
  font-weight:1000;
}
.busbar-job-desc,
.busbar-talk-desc,
.busbar-badge-copy{
  margin-top:8px;
  color:var(--subCard);
  line-height:1.45;
}
.busbar-badge-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.busbar-badge-icon{
  width:54px;
  height:54px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
  font-size:1.5rem;
  box-shadow:0 10px 22px rgba(255,204,0,.20);
}
.busbar-progress{
  margin-top:12px;
  height:10px;
  border-radius:999px;
  background:#111;
  overflow:hidden;
  border:1px solid var(--stroke2);
}
.busbar-progress > span{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
}
.busbar-bottom-nav{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:80;
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:10px;
  padding:12px 14px calc(env(safe-area-inset-bottom) + 12px);
  background:linear-gradient(to top, rgba(0,0,0,.94) 75%, rgba(0,0,0,0));
}
.busbar-nav-btn{
  border:none;
  border-radius:16px;
  padding:14px 10px;
  font-weight:1000;
  cursor:pointer;
  background:#151515;
  color:#fff;
  border:1px solid #262626;
}
.busbar-nav-btn.active{
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
  border:none;
  box-shadow:0 10px 22px rgba(255,204,0,.18);
}
html[data-theme="light"] .busbar-hero,
html[data-theme="light"] .busbar-post-card,
html[data-theme="light"] .busbar-job-card,
html[data-theme="light"] .busbar-talk-card,
html[data-theme="light"] .busbar-badge-card{
  background:linear-gradient(180deg,#ffffff 0%, #fcfcfd 100%) !important;
  border:1px solid #cfd5de !important;
}
html[data-theme="light"] .busbar-stat{
  background:#fffdf7 !important;
  border-color:#d8dde5 !important;
}
html[data-theme="light"] .busbar-post-btn,
html[data-theme="light"] .busbar-action.primary,
html[data-theme="light"] .busbar-nav-btn.active{
  color:#000 !important;
}
html[data-theme="light"] .busbar-action.secondary,
html[data-theme="light"] .busbar-react-btn,
html[data-theme="light"] .busbar-nav-btn{
  background:#ffffff !important;
  color:#111827 !important;
  border:1px solid #cfd5de !important;
}
html[data-theme="light"] .busbar-bottom-nav{
  background:linear-gradient(to top, rgba(243,244,247,.96) 75%, rgba(243,244,247,0));
}
html[data-theme="light"] .busbar-photo{
  background:
    linear-gradient(135deg, rgba(255,204,0,.18), rgba(255,153,0,.10)),
    linear-gradient(180deg, #eef2f7, #d9e2ec);
}
@media (max-width:720px){
  .busbar-stats{grid-template-columns:1fr 1fr;}
  .busbar-grid-2,
  .busbar-badge-grid{grid-template-columns:1fr;}
  .busbar-reactions{grid-template-columns:1fr;}
  .busbar-title-row{flex-direction:column;}
}


/* ===== Busbar cleanup v4 ===== */
#p11 .busbar-hero,
#p11 .busbar-composer{
  display:none !important;
}
#p11 .busbar-shell{
  padding-top:6px !important;
}
#p11 .busbar-topbar{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}
#p11 .busbar-top-title{
  text-align:center;
  font-size:1.55rem;
  font-weight:1000;
  line-height:1;
  letter-spacing:-0.02em;
}
#p11 .busbar-add-btn{
  width:48px;
  height:48px;
  border-radius:14px;
  border:1px solid rgba(255,204,0,.45);
  background:var(--gold);
  color:#000;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:1.9rem;
  font-weight:1000;
  box-shadow:0 12px 24px rgba(255,204,0,.18);
}
#p11 .btn-back{
  margin-bottom:0 !important;
}
#p11{
  padding-bottom:110px !important;
}

.busbar-post-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.62);
  display:none;
  align-items:flex-end;
  justify-content:center;
  z-index:5000;
  padding:18px;
}
.busbar-post-modal.show{
  display:flex;
}
.busbar-post-sheet{
  width:min(760px,100%);
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:24px;
  padding:18px;
  box-shadow:var(--shadow);
}
.busbar-post-head{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:start;
  gap:12px;
  margin-bottom:12px;
}
.busbar-post-copy small{
  display:block;
  color:var(--sub);
  line-height:1.4;
  margin-top:6px;
  font-size:.96rem;
}
.busbar-post-close{
  width:42px;
  height:42px;
  border-radius:12px;
  border:1px solid var(--stroke);
  background:var(--card2);
  color:var(--text);
  font-size:1.15rem;
  font-weight:1000;
}
.busbar-post-id{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.busbar-post-avatar{
  width:52px;
  height:52px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--gold);
  color:#000;
  font-size:1.3rem;
  font-weight:1000;
}
.busbar-tag-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:10px;
}
.busbar-tag-btn{
  border:1px solid var(--stroke);
  background:var(--card2);
  color:var(--text);
  border-radius:14px;
  min-height:52px;
  font-weight:1000;
  padding:12px 14px;
}
.busbar-tag-btn.active{
  background:var(--gold);
  color:#000;
  border-color:var(--gold);
}
.busbar-modal-submit{
  margin-top:14px;
  width:100%;
  border:none;
  border-radius:14px;
  min-height:54px;
  background:var(--gold);
  color:#000;
  font-weight:1000;
}


/* ===== Busbar clean topbar fix ===== */
#p11 .busbar-shell{
  padding-top:8px !important;
}
#p11 .busbar-topbar-clean{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:12px;
  margin:0 0 16px 0;
}
#p11 .busbar-topbar-title{
  text-align:center;
  font-size:1.65rem;
  font-weight:1000;
  letter-spacing:-0.03em;
  line-height:1;
}
#p11 .busbar-topbar-plus{
  width:48px;
  height:48px;
  border:none;
  border-radius:14px;
  background:var(--gold);
  color:#000;
  font-size:1.9rem;
  font-weight:1000;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 12px 24px rgba(255,204,0,.18);
}
#p11 .btn-back{
  margin-bottom:0 !important;
}
#p11{
  padding-bottom:110px !important;
}

/* modal polish */
.busbar-post-modal{
  position:fixed;
  inset:0;
  display:none;
  align-items:flex-end;
  justify-content:center;
  background:rgba(0,0,0,.62);
  z-index:5000;
  padding:18px;
}
.busbar-post-modal.show{
  display:flex;
}
.busbar-post-sheet{
  width:min(760px,100%);
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:24px;
  padding:18px;
  box-shadow:var(--shadow);
}
.busbar-post-head{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:start;
  margin-bottom:12px;
}
.busbar-post-title{
  font-size:1.1rem;
  font-weight:1000;
}
.busbar-post-copy small{
  display:block;
  margin-top:6px;
  color:var(--sub);
  line-height:1.4;
}
.busbar-post-close{
  width:42px;
  height:42px;
  border-radius:12px;
  border:1px solid var(--stroke);
  background:var(--card2);
  color:var(--text);
  font-size:1.1rem;
  font-weight:1000;
}
.busbar-post-id{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.busbar-post-avatar{
  width:52px;
  height:52px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--gold);
  color:#000;
  font-size:1.25rem;
  font-weight:1000;
}
.busbar-tag-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:10px;
}
.busbar-tag-btn{
  min-height:52px;
  border-radius:14px;
  border:1px solid var(--stroke);
  background:var(--card2);
  color:var(--text);
  font-weight:1000;
  padding:12px 14px;
}
.busbar-tag-btn.active{
  background:var(--gold);
  color:#000;
  border-color:var(--gold);
}
.busbar-modal-submit{
  margin-top:14px;
  width:100%;
  min-height:54px;
  border:none;
  border-radius:14px;
  background:var(--gold);
  color:#000;
  font-weight:1000;
}


/* ===== Busbar alive upgrade ===== */
#p11 .card,
#p11 .busbar-nav-btn,
#p11 .busbar-topbar-plus,
#p11 .busbar-post-close,
#p11 .busbar-tag-btn,
#p11 .busbar-modal-submit,
#p11 .main-btn,
#p11 .dark-btn,
#p11 .btn-back{
  transition:transform .16s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease, opacity .18s ease;
}

#p11 .card{
  animation:busbarCardIn .34s ease both;
}
@keyframes busbarCardIn{
  from{ opacity:0; transform:translateY(10px) scale(.992); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}

#p11 .busbar-nav-btn:active,
#p11 .busbar-topbar-plus:active,
#p11 .busbar-post-close:active,
#p11 .busbar-tag-btn:active,
#p11 .busbar-modal-submit:active,
#p11 .btn-back:active,
#p11 .main-btn:active,
#p11 .dark-btn:active{
  transform:scale(.97);
}

#p11 .busbar-topbar-plus{
  position:relative;
  overflow:hidden;
}
#p11 .busbar-topbar-plus::after{
  content:"";
  position:absolute;
  inset:-16px;
  background:radial-gradient(circle, rgba(255,204,0,.22) 0%, rgba(255,204,0,0) 60%);
  opacity:.8;
  pointer-events:none;
  animation:busbarPulse 2.2s ease-in-out infinite;
}
@keyframes busbarPulse{
  0%,100%{ transform:scale(.9); opacity:.28; }
  50%{ transform:scale(1.08); opacity:.65; }
}

#p11 .busbar-nav-btn.active{
  box-shadow:0 10px 24px rgba(255,204,0,.18);
}

#p11 .busbar-live-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,204,0,.08);
  border:1px solid rgba(255,204,0,.18);
  color:var(--gold);
  font-weight:1000;
  font-size:.82rem;
  letter-spacing:.03em;
  margin-bottom:12px;
}
#p11 .busbar-live-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 0 0 rgba(255,204,0,.55);
  animation:busbarDotPulse 1.6s infinite;
}
@keyframes busbarDotPulse{
  0%{ box-shadow:0 0 0 0 rgba(255,204,0,.55); }
  70%{ box-shadow:0 0 0 10px rgba(255,204,0,0); }
  100%{ box-shadow:0 0 0 0 rgba(255,204,0,0); }
}

#p11 .busbar-feed-card,
#p11 .busbar-dispatch-card,
#p11 .busbar-thread-card,
#p11 .busbar-badge-card{
  position:relative;
  overflow:hidden;
}
#p11 .busbar-feed-card::before,
#p11 .busbar-dispatch-card::before,
#p11 .busbar-thread-card::before,
#p11 .busbar-badge-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.02) 28%, rgba(255,204,0,.06) 50%, transparent 72%);
  transform:translateX(-120%);
  pointer-events:none;
}
#p11 .busbar-stat-pill{
  transition:transform .16s ease, background .18s ease, border-color .18s ease;
}
#p11 .busbar-stat-pill.bump{
  transform:scale(1.08);
  background:rgba(255,204,0,.18) !important;
  border-color:rgba(255,204,0,.45) !important;
}
#p11 .busbar-action-glow{
  box-shadow:0 14px 28px rgba(255,204,0,.22) !important;
}
#p11 .busbar-post-modal{
  backdrop-filter:blur(8px);
}
#p11 .busbar-post-sheet{
  transform:translateY(18px) scale(.985);
  opacity:0;
  transition:transform .22s ease, opacity .22s ease;
}
#p11 .busbar-post-modal.show .busbar-post-sheet{
  transform:translateY(0) scale(1);
  opacity:1;
}
#p11 .busbar-image-shell{
  position:relative;
  overflow:hidden;
}
#p11 .busbar-image-shell::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:48%;
  background:linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,0));
  pointer-events:none;
}
#p11 .busbar-badge-progress > span{
  transition:width .6s cubic-bezier(.22,.9,.2,1);
}


/* ===== Busbar premium pass ===== */
#p11{
  background:
    radial-gradient(1200px 500px at 50% -10%, rgba(255,204,0,.08), rgba(255,204,0,0) 45%),
    linear-gradient(180deg, rgba(255,255,255,.01), rgba(255,255,255,0));
}

#p11 .busbar-shell{
  max-width: 860px;
  margin: 0 auto;
}

#p11 .busbar-topbar-clean,
#p11 .busbar-topbar{
  position: sticky;
  top: 0;
  z-index: 90;
  padding: 8px 0 14px;
  background: linear-gradient(to bottom, rgba(0,0,0,.96), rgba(0,0,0,.86), rgba(0,0,0,0));
  backdrop-filter: blur(10px);
}

#p11 .busbar-topbar-title{
  font-size: 1.9rem;
  letter-spacing: -.04em;
}

#p11 .busbar-topbar-plus{
  box-shadow: 0 16px 34px rgba(255,204,0,.22);
}

#p11 .card{
  border: 1px solid rgba(255,255,255,.09) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)) !important,
    #141416 !important;
  box-shadow:
    0 16px 34px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.03);
  border-radius: 26px !important;
}

#p11 .busbar-feed-card,
#p11 .busbar-dispatch-card,
#p11 .busbar-thread-card,
#p11 .busbar-badge-card{
  margin-bottom: 16px;
}

#p11 .busbar-feed-card:hover,
#p11 .busbar-dispatch-card:hover,
#p11 .busbar-thread-card:hover,
#p11 .busbar-badge-card:hover{
  transform: translateY(-2px);
  box-shadow:
    0 22px 44px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.04);
}

#p11 .busbar-live-chip{
  background: rgba(255,204,0,.10);
  border-color: rgba(255,204,0,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

#p11 .busbar-muted{
  color: #9a9aa3 !important;
  line-height: 1.42;
}

#p11 .busbar-bottom-nav{
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(env(safe-area-inset-bottom) + 78px);
  width: min(860px, calc(100% - 24px));
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
  z-index: 120;
  pointer-events: none;
}
#p11 .busbar-bottom-nav .busbar-nav-btn{
  pointer-events: auto;
}

#p11 .busbar-nav-btn{
  min-height: 62px !important;
  border-radius: 22px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)) !important,
    #111113 !important;
  box-shadow: 0 14px 26px rgba(0,0,0,.26);
  font-size: 1.02rem;
  font-weight: 1000;
}
#p11 .busbar-nav-btn.active{
  background: linear-gradient(180deg,#ffd84d 0%, #f4be00 100%) !important;
  color:#000 !important;
  border-color: rgba(255,204,0,.55) !important;
  box-shadow: 0 16px 32px rgba(255,204,0,.20);
}

#p11 .busbar-post-sheet{
  border-radius: 28px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)) !important,
    #161618 !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: 0 22px 48px rgba(0,0,0,.38);
}

#p11 textarea,
#p11 input,
#p11 select{
  border-radius: 18px !important;
  min-height: 58px;
}
#p11 textarea{
  min-height: 120px;
}

#p11 .busbar-tag-btn{
  min-height: 56px;
  border-radius: 16px;
}

#p11 .busbar-modal-submit,
#p11 .main-btn{
  min-height: 58px !important;
  border-radius: 18px !important;
  box-shadow: 0 14px 30px rgba(255,204,0,.20);
}

#p11 .dark-btn{
  border-radius: 18px !important;
}

#p11 .btn-back{
  background: rgba(255,204,0,.03) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}

#p11 .busbar-price,
#p11 .price,
#p11 [class*="price"]{
  text-shadow: 0 4px 16px rgba(255,204,0,.12);
}

#p11 .busbar-stat-pill,
#p11 .pill{
  border-radius: 999px !important;
  border: 1px solid rgba(255,204,0,.18) !important;
  background: rgba(255,204,0,.06) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

#p11 .busbar-image-shell,
#p11 .feed-image,
#p11 [class*="image"]{
  border-radius: 24px !important;
  overflow: hidden;
}

#p11 .busbar-image-shell::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(255,204,0,.12), rgba(255,204,0,0) 38%),
    linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,0));
  pointer-events: none;
}

#p11 .busbar-badge-progress,
#p11 [class*="progress"]{
  border-radius: 999px !important;
  overflow: hidden;
}

#p11 .busbar-badge-progress > span,
#p11 [class*="progress"] > span{
  background: linear-gradient(90deg,#ffd84d 0%, #f4be00 100%) !important;
  box-shadow: 0 0 18px rgba(255,204,0,.18);
}

#p11 .busbar-section-title{
  font-size: 1.15rem;
  letter-spacing: -.02em;
}

#p11 .busbar-feed-card .main-btn,
#p11 .busbar-dispatch-card .main-btn,
#p11 .busbar-thread-card .main-btn{
  font-size: 1.02rem;
}

#p11 .busbar-empty-state{
  border: 1px dashed rgba(255,255,255,.10);
  border-radius: 22px;
  background: rgba(255,255,255,.02);
}

html[data-theme="light"] #p11{
  background:
    radial-gradient(1200px 500px at 50% -10%, rgba(255,204,0,.10), rgba(255,204,0,0) 45%),
    #f3f4f7 !important;
}
html[data-theme="light"] #p11 .card{
  background: linear-gradient(180deg,#ffffff 0%, #fbfbfd 100%) !important;
  border:1px solid #d8dde5 !important;
  box-shadow: 0 16px 34px rgba(15,23,42,.08);
}
html[data-theme="light"] #p11 .busbar-nav-btn{
  background: linear-gradient(180deg,#ffffff 0%, #f9fafb 100%) !important;
  border:1px solid #d8dde5 !important;
  box-shadow: 0 12px 24px rgba(15,23,42,.07);
}
html[data-theme="light"] #p11 .busbar-post-sheet{
  background: linear-gradient(180deg,#ffffff 0%, #fbfbfd 100%) !important;
  border:1px solid #d8dde5 !important;
}


/* ===== Busbar premium pass v2 ===== */
#p11 .busbar-topbar-title{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
}
#p11 .busbar-topbar-title > div{
  font-size:.62rem !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
  color:var(--sub) !important;
  margin-top:6px !important;
  line-height:1.1 !important;
}
#p11 .busbar-bottom-nav{
  bottom: calc(env(safe-area-inset-bottom) + 18px) !important;
  width: min(860px, calc(100% - 18px)) !important;
  gap: 10px !important;
}
#p11 .busbar-nav-btn{
  min-height: 56px !important;
  border-radius: 20px !important;
  font-size: .95rem !important;
}
#p11{
  padding-bottom: 96px !important;
}
.busbar-upload-box{
  margin-top:12px;
  border:1px dashed rgba(255,255,255,.14);
  border-radius:18px;
  padding:14px;
  background:rgba(255,255,255,.02);
}
.busbar-upload-btn{
  width:100%;
  min-height:54px;
  border:none;
  border-radius:14px;
  background:rgba(255,204,0,.10);
  color:var(--gold);
  font-weight:1000;
  border:1px solid rgba(255,204,0,.20);
}
.busbar-upload-note{
  margin-top:8px;
  color:var(--sub);
  font-size:.84rem;
  line-height:1.35;
}
.busbar-post-user-row{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.busbar-post-user-copy{
  flex:1;
}
.busbar-post-user-copy .small{
  color:var(--sub);
  font-size:.86rem;
  margin-top:4px;
}
html[data-theme="light"] .busbar-upload-box{
  border-color:#d8dde5;
  background:#fafbfd;
}


/* ===== Busbar premium v3 safe fixes ===== */
#p11 .busbar-topbar-clean,
#p11 .busbar-topbar{
  position:sticky !important;
  top:0 !important;
  z-index:90 !important;
  display:grid !important;
  grid-template-columns:140px 1fr 140px !important;
  align-items:center !important;
}

#p11 .busbar-topbar-title{
  position:static !important;
  left:auto !important;
  transform:none !important;
  width:auto !important;
  text-align:center !important;
  justify-self:center !important;
}

#p11 .busbar-topbar-plus{
  justify-self:end !important;
}

html[data-theme="light"] #p11 .busbar-topbar-clean,
html[data-theme="light"] #p11 .busbar-topbar{
  background:linear-gradient(to bottom, rgba(255,255,255,.98), rgba(255,255,255,.92), rgba(255,255,255,0)) !important;
  backdrop-filter:blur(10px) !important;
}

html[data-theme="light"] #p11 .busbar-topbar-title,
html[data-theme="light"] #p11 .busbar-topbar-title > div{
  color:#111827 !important;
}

html[data-theme="light"] #p11 .busbar-topbar-title > div{
  color:#6b7280 !important;
}


/* ===== P12 Profile System ===== */
#p12{
  background:
    radial-gradient(1000px 420px at 50% -8%, rgba(255,204,0,.08), rgba(255,204,0,0) 46%),
    linear-gradient(180deg, rgba(255,255,255,.01), rgba(255,255,255,0));
  padding-bottom:120px !important;
}
#p12 .profile-shell{max-width:860px;margin:0 auto;}
#p12 .profile-topbar{
  position:sticky; top:0; z-index:90;
  display:grid; grid-template-columns:140px 1fr 140px; align-items:center; gap:12px;
  padding:8px 0 14px;
  background:linear-gradient(to bottom, rgba(0,0,0,.96), rgba(0,0,0,.88), rgba(0,0,0,0));
  backdrop-filter:blur(10px);
}
#p12 .profile-title{text-align:center;justify-self:center;font-size:1.85rem;font-weight:1000;letter-spacing:-.04em;line-height:1;}
#p12 .profile-title small{display:block;margin-top:6px;font-size:.64rem;letter-spacing:.20em;text-transform:uppercase;color:var(--sub);}
#p12 .profile-edit-btn{
  justify-self:end;min-width:56px;height:48px;border-radius:14px;border:1px solid rgba(255,204,0,.34);
  background:rgba(255,204,0,.08);color:var(--gold);font-weight:1000;box-shadow:0 12px 24px rgba(255,204,0,.14);
}
#p12 .profile-hero,
#p12 .profile-stat,
#p12 .profile-badge-card,
#p12 .profile-post-card,
#p12 .profile-about-card,
#p12 .profile-activity-card{
  border-radius:26px !important;
  border:1px solid rgba(255,255,255,.09) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)) !important, #141416 !important;
  box-shadow:0 16px 34px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.03);
}
#p12 .profile-main{display:grid;grid-template-columns:104px 1fr;gap:16px;align-items:start;}
#p12 .profile-avatar{
  width:92px;height:92px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);color:#000;font-size:2rem;font-weight:1000;box-shadow:0 16px 30px rgba(255,204,0,.18);
}
#p12 .profile-name{font-size:1.65rem;font-weight:1000;letter-spacing:-.03em;line-height:1.02;}
#p12 .profile-handle{color:var(--sub);margin-top:6px;font-size:1rem;font-weight:900;}
#p12 .profile-meta{color:var(--sub);margin-top:10px;line-height:1.45;}
#p12 .profile-bio{margin-top:14px;font-size:1rem;line-height:1.5;}
#p12 .profile-chip-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
#p12 .profile-chip{
  display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;
  border:1px solid rgba(255,204,0,.18);background:rgba(255,204,0,.06);color:var(--gold);font-size:.88rem;font-weight:1000;
}
#p12 .profile-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px;}
#p12 .profile-stat{padding:16px 14px;text-align:center;}
#p12 .profile-stat .k{color:var(--sub);font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;font-weight:1000;}
#p12 .profile-stat .v{margin-top:8px;font-size:1.45rem;font-weight:1000;letter-spacing:-.03em;}
#p12 .profile-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px;}
#p12 .profile-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0;}
#p12 .profile-tab-btn{
  min-height:54px;border-radius:18px;border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)), #111113;color:#fff;font-weight:1000;
}
#p12 .profile-tab-btn.active{
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);color:#000;border-color:rgba(255,204,0,.50);box-shadow:0 16px 32px rgba(255,204,0,.20);
}
#p12 .profile-pane{display:none;} #p12 .profile-pane.active{display:block;}
#p12 .profile-badge-grid{display:grid;grid-template-columns:1fr;gap:14px;}
#p12 .profile-post-head{display:flex;align-items:center;justify-content:space-between;gap:12px;}
#p12 .profile-post-badge{
  display:inline-flex;align-items:center;padding:10px 14px;border-radius:999px;border:1px solid rgba(255,204,0,.18);
  background:rgba(255,204,0,.06);color:var(--gold);font-weight:1000;
}
#p12 .profile-image{
  height:250px;margin-top:14px;border-radius:24px;overflow:hidden;position:relative;
  background:linear-gradient(135deg, rgba(255,204,0,.13), rgba(255,204,0,0) 36%), linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)), #26211a;
}
#p12 .profile-image::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:46%;background:linear-gradient(to top, rgba(0,0,0,.74), rgba(0,0,0,0));
}
#p12 .profile-image-label{
  position:absolute;left:16px;bottom:16px;z-index:2;display:inline-flex;align-items:center;padding:10px 16px;border-radius:999px;background:rgba(0,0,0,.50);color:#fff;font-weight:1000;font-size:1rem;
}
#p12 .profile-mini-stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
#p12 .profile-mini-pill{
  display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;border:1px solid rgba(255,204,0,.18);background:rgba(255,204,0,.06);color:var(--gold);font-weight:1000;
}
#p12 .profile-line{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.06);}
#p12 .profile-line:last-child{border-bottom:none;}
#p12 .profile-line .left .t{font-weight:1000;}
#p12 .profile-line .left .s{color:var(--sub);margin-top:4px;}
#p12 .profile-line .right{color:var(--gold);font-weight:1000;white-space:nowrap;}
@media (max-width:700px){
  #p12 .profile-topbar{grid-template-columns:120px 1fr 80px !important;}
  #p12 .profile-main{grid-template-columns:86px 1fr;}
  #p12 .profile-avatar{width:78px;height:78px;font-size:1.7rem;}
  #p12 .profile-stat-grid{grid-template-columns:1fr 1fr;}
  #p12 .profile-tabs{grid-template-columns:1fr 1fr;}
}
html[data-theme="light"] #p12{
  background:radial-gradient(1000px 420px at 50% -8%, rgba(255,204,0,.10), rgba(255,204,0,0) 46%), #f3f4f7 !important;
}
html[data-theme="light"] #p12 .profile-topbar{
  background:linear-gradient(to bottom, rgba(255,255,255,.98), rgba(255,255,255,.92), rgba(255,255,255,0)) !important;
}
html[data-theme="light"] #p12 .profile-title,
html[data-theme="light"] #p12 .profile-name,
html[data-theme="light"] #p12 .profile-stat .v{color:#111827 !important;}
html[data-theme="light"] #p12 .profile-title small,
html[data-theme="light"] #p12 .profile-handle,
html[data-theme="light"] #p12 .profile-meta,
html[data-theme="light"] #p12 .profile-line .left .s,
html[data-theme="light"] #p12 .profile-stat .k{color:#6b7280 !important;}
html[data-theme="light"] #p12 .profile-hero,
html[data-theme="light"] #p12 .profile-stat,
html[data-theme="light"] #p12 .profile-badge-card,
html[data-theme="light"] #p12 .profile-post-card,
html[data-theme="light"] #p12 .profile-about-card,
html[data-theme="light"] #p12 .profile-activity-card{
  background:linear-gradient(180deg,#ffffff 0%, #fbfbfd 100%) !important;border:1px solid #d8dde5 !important;box-shadow:0 16px 34px rgba(15,23,42,.08) !important;
}
html[data-theme="light"] #p12 .profile-tab-btn{
  background:linear-gradient(180deg,#ffffff 0%, #f9fafb 100%) !important;color:#111827 !important;border:1px solid #d8dde5 !important;box-shadow:0 12px 24px rgba(15,23,42,.07) !important;
}
html[data-theme="light"] #p12 .profile-image{
  background:linear-gradient(135deg, rgba(255,204,0,.10), rgba(255,204,0,0) 36%), linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)), #ebe6d4 !important;
}


/* ===== P11 Profile integration ===== */
#p11 .busbar-bottom-nav{
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:8px !important;
  width:min(920px, calc(100% - 14px)) !important;
}
#p11 .busbar-nav-btn{
  min-height:52px !important;
  border-radius:18px !important;
  font-size:.88rem !important;
  line-height:1.05 !important;
  padding:8px 6px !important;
}
#p11 .p11-profile-hero,
#p11 .p11-profile-card{
  border-radius:26px !important;
}
#p11 .p11-profile-main{
  display:grid;
  grid-template-columns:88px 1fr;
  gap:14px;
  align-items:start;
}
#p11 .p11-profile-avatar{
  width:78px;
  height:78px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
  font-size:1.75rem;
  font-weight:1000;
  box-shadow:0 14px 28px rgba(255,204,0,.18);
}
#p11 .p11-profile-name{
  font-size:1.45rem;
  font-weight:1000;
  letter-spacing:-.03em;
  line-height:1.02;
}
#p11 .p11-profile-handle,
#p11 .p11-profile-meta{
  color:var(--sub);
  margin-top:6px;
}
#p11 .p11-profile-bio{
  margin-top:10px;
  line-height:1.45;
}
#p11 .p11-profile-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
#p11 .p11-profile-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(255,204,0,.18);
  background:rgba(255,204,0,.06);
  color:var(--gold);
  font-size:.84rem;
  font-weight:1000;
}
#p11 .p11-profile-stat-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}
#p11 .p11-profile-stat{
  text-align:center;
  padding:14px 10px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
}
#p11 .p11-profile-stat span{
  display:block;
  color:var(--sub);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:1000;
}
#p11 .p11-profile-stat b{
  display:block;
  margin-top:6px;
  font-size:1.28rem;
}
#p11 .p11-profile-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:14px;
}
#p11 .p11-setting-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,.06);
}
#p11 .p11-setting-row.no-border{ border-bottom:none; }
#p11 .p11-setting-title{
  font-weight:1000;
}
#p11 .p11-setting-sub{
  color:var(--sub);
  margin-top:4px;
  line-height:1.35;
}
#p11 .p11-coming-soon,
#p11 .p11-handle-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(255,204,0,.18);
  background:rgba(255,204,0,.06);
  color:var(--gold);
  font-weight:1000;
  white-space:nowrap;
}
@media (max-width:700px){
  #p11 .busbar-bottom-nav{
    gap:6px !important;
  }
  #p11 .busbar-nav-btn{
    min-height:50px !important;
    font-size:.8rem !important;
  }
}
html[data-theme="light"] #p11 .p11-profile-stat{
  border:1px solid #d8dde5 !important;
  background:#ffffff !important;
}


/* ===== P11 profile visibility + premium 5-tab nav ===== */
#p11 .busbar-tab{ display:none !important; }
#p11 .busbar-tab.active{ display:block !important; }

#p11 .busbar-bottom-nav{
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:8px !important;
  width:min(940px, calc(100% - 14px)) !important;
  padding:10px !important;
  border-radius:28px !important;
  background:linear-gradient(180deg, rgba(10,10,12,.88), rgba(10,10,12,.72)) !important;
  border:1px solid rgba(255,255,255,.06) !important;
  box-shadow:
    0 18px 40px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
  backdrop-filter: blur(14px) !important;
}
#p11 .busbar-nav-btn{
  min-height:54px !important;
  border-radius:20px !important;
  font-size:.84rem !important;
  line-height:1.05 !important;
  padding:8px 4px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)) !important,
    #101114 !important;
  box-shadow:
    0 10px 20px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.03) !important;
  letter-spacing:-.02em !important;
}
#p11 .busbar-nav-btn.active{
  background:linear-gradient(180deg,#ffe26d 0%, #f4be00 100%) !important;
  color:#000 !important;
  border-color:rgba(255,204,0,.45) !important;
  box-shadow:
    0 16px 28px rgba(255,204,0,.22),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}
#p11 .busbar-nav-btn:active{
  transform:scale(.97) translateY(1px) !important;
}
#p11 .busbar-bottom-nav::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:28px;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0));
}
#p11 .p11-profile-hero,
#p11 .p11-profile-card{
  animation:p11ProfileIn .26s ease both;
}
@keyframes p11ProfileIn{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}
html[data-theme="light"] #p11 .busbar-bottom-nav{
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,249,251,.78)) !important;
  border:1px solid #d8dde5 !important;
  box-shadow:0 18px 38px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.6) !important;
}
html[data-theme="light"] #p11 .busbar-nav-btn{
  background:linear-gradient(180deg,#ffffff 0%, #f9fafb 100%) !important;
  border:1px solid #d8dde5 !important;
  color:#111827 !important;
  box-shadow:0 10px 18px rgba(15,23,42,.06) !important;
}


/* ===== P11 profile + nav cleanup v2 ===== */
#p11 .btn-back{
  min-height:50px !important;
  padding:10px 18px !important;
  border-radius:18px !important;
  font-size:.92rem !important;
  box-shadow:0 10px 20px rgba(0,0,0,.18) !important;
}
#p11 .busbar-topbar,
#p11 .busbar-topbar-clean{
  grid-template-columns:116px 1fr 72px !important;
}
#p11 .busbar-topbar-title{
  font-size:1.62rem !important;
}
#p11 .busbar-topbar-title > div{
  font-size:.56rem !important;
  letter-spacing:.15em !important;
}
#p11 .busbar-topbar-plus{
  width:50px !important;
  min-width:50px !important;
  height:50px !important;
  border-radius:18px !important;
}
#p11 .busbar-bottom-nav{
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:6px !important;
  width:min(960px, calc(100% - 10px)) !important;
  padding:8px !important;
  border-radius:24px !important;
  background:linear-gradient(180deg, rgba(10,10,12,.88), rgba(10,10,12,.72)) !important;
  border:1px solid rgba(255,255,255,.06) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.04) !important;
  backdrop-filter: blur(14px) !important;
}
#p11 .busbar-nav-btn{
  min-height:50px !important;
  border-radius:18px !important;
  font-size:.80rem !important;
  line-height:1.05 !important;
  padding:8px 3px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)) !important, #101114 !important;
  box-shadow:0 10px 20px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.03) !important;
}
#p11 .busbar-nav-btn.active{
  background:linear-gradient(180deg,#ffe26d 0%, #f4be00 100%) !important;
  color:#000 !important;
  border-color:rgba(255,204,0,.45) !important;
  box-shadow:0 16px 28px rgba(255,204,0,.22), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
#p11 .busbar-tab{ display:none !important; }
#p11 .busbar-tab.active{ display:block !important; }

#p11 .p11-profile-hero,
#p11 .p11-profile-card{ margin-bottom:14px; }
#p11 .p11-profile-main{
  display:grid;
  grid-template-columns:82px 1fr;
  gap:14px;
  align-items:start;
}
#p11 .p11-profile-avatar{
  width:74px;
  height:74px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
  font-size:1.65rem;
  font-weight:1000;
  box-shadow:0 14px 28px rgba(255,204,0,.18);
}
#p11 .p11-profile-name{
  font-size:1.38rem;
  font-weight:1000;
  letter-spacing:-.03em;
  line-height:1.02;
}
#p11 .p11-profile-handle,
#p11 .p11-profile-meta{
  color:var(--sub);
  margin-top:6px;
}
#p11 .p11-profile-bio{
  margin-top:10px;
  line-height:1.45;
}
#p11 .p11-profile-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
#p11 .p11-profile-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(255,204,0,.18);
  background:rgba(255,204,0,.06);
  color:var(--gold);
  font-size:.84rem;
  font-weight:1000;
}
#p11 .p11-profile-stat-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}
#p11 .p11-profile-stat{
  text-align:center;
  padding:14px 10px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
}
#p11 .p11-profile-stat span{
  display:block;
  color:var(--sub);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:1000;
}
#p11 .p11-profile-stat b{
  display:block;
  margin-top:6px;
  font-size:1.22rem;
}
#p11 .p11-profile-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:14px;
}
#p11 .p11-setting-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,.06);
}
#p11 .p11-setting-row.no-border{ border-bottom:none; }
#p11 .p11-setting-title{ font-weight:1000; }
#p11 .p11-setting-sub{ color:var(--sub); margin-top:4px; line-height:1.35; }
#p11 .p11-coming-soon,
#p11 .p11-handle-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(255,204,0,.18);
  background:rgba(255,204,0,.06);
  color:var(--gold);
  font-weight:1000;
  white-space:nowrap;
}
html[data-theme="light"] #p11 .p11-profile-stat{
  border:1px solid #d8dde5 !important;
  background:#ffffff !important;
}


/* ===== Final P11 profile + modal fit fix ===== */
#p11 .busbar-tab{
  display:none !important;
}
#p11 .busbar-tab.active{
  display:block !important;
}

#p11 .busbar-post-modal{
  align-items:flex-start !important;
  padding:12px !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
#p11 .busbar-post-sheet{
  width:min(760px,100%) !important;
  max-height:calc(100vh - 24px) !important;
  overflow-y:auto !important;
  margin:8px auto calc(env(safe-area-inset-bottom) + 14px) !important;
  border-radius:24px !important;
}
#p11 .busbar-post-sheet label{
  margin-top:10px !important;
}
#p11 .busbar-post-sheet textarea{
  min-height:92px !important;
}
#p11 .busbar-tag-grid{
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
}
#p11 .busbar-tag-btn{
  min-height:46px !important;
  padding:10px 10px !important;
  font-size:.95rem !important;
}
#p11 .busbar-upload-box{
  margin-top:10px !important;
  padding:12px !important;
}
#p11 .busbar-upload-btn{
  min-height:48px !important;
}
#p11 .busbar-modal-submit{
  min-height:50px !important;
  margin-top:12px !important;
}

#p11 .btn-back{
  min-height:44px !important;
  padding:8px 14px !important;
  font-size:.88rem !important;
  border-radius:16px !important;
}
#p11 .busbar-topbar,
#p11 .busbar-topbar-clean{
  grid-template-columns:104px 1fr 64px !important;
}
#p11 .busbar-topbar-plus{
  width:46px !important;
  min-width:46px !important;
  height:46px !important;
  border-radius:16px !important;
}
#p11 .busbar-bottom-nav{
  gap:6px !important;
  padding:8px !important;
}
#p11 .busbar-nav-btn{
  min-height:48px !important;
  font-size:.78rem !important;
  border-radius:16px !important;
}

@media (max-width:700px){
  #p11 .busbar-post-sheet{
    max-height:calc(100vh - 16px) !important;
    margin:8px auto calc(env(safe-area-inset-bottom) + 8px) !important;
  }
  #p11 .busbar-post-copy small,
  #p11 .busbar-upload-note,
  #p11 .p11-setting-sub{
    font-size:.82rem !important;
    line-height:1.28 !important;
  }
  #p11 .p11-profile-main{
    grid-template-columns:70px 1fr !important;
  }
  #p11 .p11-profile-avatar{
    width:62px !important;
    height:62px !important;
    font-size:1.45rem !important;
  }
  #p11 .p11-profile-name{
    font-size:1.18rem !important;
  }
}


/* ===== Busbar dock restyle ===== */
#p11{
  padding-bottom: 118px !important;
}
#p11 .busbar-bottom-nav.busbar-dock{
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  bottom: calc(env(safe-area-inset-bottom) + 60px) !important;
  width: min(860px, calc(100% - 18px)) !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 4px !important;
  padding: 6px !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, rgba(44,56,74,.78), rgba(28,36,48,.72)) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow:
    0 18px 40px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter: blur(18px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(120%) !important;
  z-index: 140 !important;
}
#p11 .busbar-dock::before{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  top:6px;
  height:1px;
  border-radius:999px;
  background: linear-gradient(90deg, rgba(255,255,255,.04), rgba(255,255,255,.24), rgba(255,255,255,.04));
  pointer-events:none;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  position: relative;
  min-height: 78px !important;
  border-radius: 22px !important;
  border: none !important;
  background: transparent !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-direction:column !important;
  gap:6px !important;
  padding:10px 4px 12px !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn::before{
  content:"";
  position:absolute;
  left:18%;
  right:18%;
  top:2px;
  height:4px;
  border-radius:999px;
  background: transparent;
  transition: all .18s ease;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active::before{
  background: linear-gradient(90deg, #5aa3ff, #2c7fff);
  box-shadow: 0 4px 10px rgba(58,133,255,.35);
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active{
  color: #ffffff !important;
}
#p11 .busbar-dock-icon{
  display:block;
  font-size: 1.7rem;
  line-height:1;
  font-weight: 700;
  opacity:.96;
}
#p11 .busbar-dock-label{
  display:block;
  font-size: .68rem;
  line-height:1.05;
  font-weight: 900;
  letter-spacing: .01em;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn:active{
  transform: scale(.97);
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock{
  background: linear-gradient(180deg, rgba(233,239,247,.94), rgba(219,228,239,.90)) !important;
  border: 1px solid rgba(170,182,196,.55) !important;
  box-shadow:
    0 18px 34px rgba(15,23,42,.10),
    inset 0 1px 0 rgba(255,255,255,.70) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  color: #64748b !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active{
  color: #0f172a !important;
}
@media (max-width: 700px){
  #p11 .busbar-bottom-nav.busbar-dock{
    width: calc(100% - 14px) !important;
    gap: 2px !important;
    padding: 5px !important;
    border-radius: 24px !important;
    bottom: calc(env(safe-area-inset-bottom) + 58px) !important;
  }
  #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
    min-height: 70px !important;
    border-radius: 18px !important;
    gap:5px !important;
    padding:10px 2px 10px !important;
  }
  #p11 .busbar-dock-icon{
    font-size:1.45rem !important;
  }
  #p11 .busbar-dock-label{
    font-size:.62rem !important;
  }
}


/* ===== Exact-style Busbar dock ===== */
#p11{
  padding-bottom: 126px !important;
}
#p11 .busbar-bottom-nav.busbar-dock{
  position: fixed !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  bottom: calc(env(safe-area-inset-bottom) + 48px) !important;
  width: min(880px, calc(100% - 12px)) !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding: 12px 10px 14px !important;
  border-radius: 30px 30px 26px 26px !important;
  background: linear-gradient(180deg, rgba(64,84,110,.86), rgba(53,71,95,.88)) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow:
    0 20px 38px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.14) !important;
  backdrop-filter: blur(22px) saturate(115%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(115%) !important;
  z-index: 180 !important;
  overflow: visible !important;
}
#p11 .busbar-bottom-nav.busbar-dock::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:1px;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.28), rgba(255,255,255,0));
  border-radius:999px;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  position: relative;
  min-height: 78px !important;
  border: none !important;
  background: transparent !important;
  color: rgba(255,255,255,.78) !important;
  box-shadow: none !important;
  border-radius: 22px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-direction:column !important;
  gap:6px !important;
  padding:10px 6px 6px !important;
  font-weight:800 !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn::before{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:2px;
  height:4px;
  border-radius:999px;
  background: transparent;
  transition: all .18s ease;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active::before{
  background: linear-gradient(90deg, #59a8ff, #2b7cff);
  box-shadow: 0 4px 12px rgba(52,132,255,.45);
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active{
  color:#ffffff !important;
}
#p11 .busbar-dock-icon{
  display:block;
  font-size:1.75rem !important;
  line-height:1;
  opacity:.95;
}
#p11 .busbar-dock-label{
  display:block;
  font-size:.64rem !important;
  line-height:1.05;
  font-weight:800;
}
#p11 .busbar-dock-badge{
  position:absolute;
  top:18px;
  right:28px;
  min-width:20px;
  height:20px;
  border-radius:999px;
  background:#ff5a59;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:.68rem;
  font-weight:900;
  border:2px solid rgba(53,71,95,.95);
}
#p11 .busbar-dock-create{
  position: relative;
  min-height: 90px !important;
  border:none !important;
  background: transparent !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex-direction:column !important;
  color:#e8edf7 !important;
  padding:0 !important;
  margin-top:-34px;
}
#p11 .busbar-dock-create-circle{
  width:82px;
  height:82px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background: linear-gradient(180deg, #4fa0ff 0%, #236eff 100%);
  color:#fff;
  font-size:3rem;
  font-weight:300;
  box-shadow:
    0 18px 26px rgba(35,110,255,.34),
    inset 0 1px 0 rgba(255,255,255,.28);
  border:6px solid rgba(53,71,95,.95);
}
#p11 .busbar-dock-create .busbar-dock-label{
  margin-top:6px;
  color:#e8edf7;
}
#p11 .busbar-dock-create:active{
  transform: scale(.98);
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock{
  background: linear-gradient(180deg, rgba(223,232,242,.95), rgba(205,219,233,.96)) !important;
  border:1px solid rgba(169,183,198,.70) !important;
  box-shadow:
    0 18px 34px rgba(15,23,42,.10),
    inset 0 1px 0 rgba(255,255,255,.72) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  color:#64748b !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active{
  color:#0f172a !important;
}
html[data-theme="light"] #p11 .busbar-dock-badge{
  border-color: rgba(205,219,233,.98);
}
@media (max-width:700px){
  #p11 .busbar-bottom-nav.busbar-dock{
    width: calc(100% - 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 46px) !important;
    padding: 10px 8px 12px !important;
    border-radius: 28px 28px 24px 24px !important;
  }
  #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
    min-height: 72px !important;
    gap:5px !important;
    padding:10px 4px 4px !important;
  }
  #p11 .busbar-dock-icon{
    font-size:1.45rem !important;
  }
  #p11 .busbar-dock-label{
    font-size:.60rem !important;
  }
  #p11 .busbar-dock-create{
    min-height: 84px !important;
    margin-top:-28px;
  }
  #p11 .busbar-dock-create-circle{
    width:72px;
    height:72px;
    font-size:2.6rem;
  }
  #p11 .busbar-dock-badge{
    right:20px;
    top:16px;
  }
}


/* ===== Stationary iPhone-style dock fix ===== */
#p11{
  padding-bottom: 190px !important;
}
#p11 .busbar-bottom-nav.busbar-dock{
  position: fixed !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  bottom: 0 !important;
  width: min(900px, 100%) !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 12px 10px calc(env(safe-area-inset-bottom) + 18px) !important;
  border-radius: 28px 28px 0 0 !important;
  z-index: 9999 !important;
}
#p11 .busbar-shell{
  padding-bottom: 18px !important;
}
#p11 .busbar-post-card:last-child,
#p11 .busbar-job-card:last-child,
#p11 .busbar-talk-card:last-child,
#p11 .busbar-badge-card:last-child,
#p11 .p11-profile-card:last-child{
  margin-bottom: 24px !important;
}
@media (max-width:700px){
  #p11{
    padding-bottom: 176px !important;
  }
  #p11 .busbar-bottom-nav.busbar-dock{
    width: 100% !important;
    padding: 10px 8px calc(env(safe-area-inset-bottom) + 16px) !important;
    border-radius: 24px 24px 0 0 !important;
  }
}


/* ===== Create button half-circle dock notch ===== */
#p11 .busbar-bottom-nav.busbar-dock{
  overflow: visible !important;
}
#p11 .busbar-dock-create{
  position: relative !important;
  min-height: 86px !important;
  margin-top: -46px !important;
  z-index: 3 !important;
}
#p11 .busbar-dock-create::before{
  content:"";
  position:absolute;
  top: 18px;
  left: 50%;
  transform: translateX(-50%);
  width: 114px;
  height: 58px;
  border-radius: 60px 60px 0 0;
  background: linear-gradient(180deg, rgba(38,53,74,.92), rgba(53,71,95,.98));
  border: 1px solid rgba(255,255,255,.10);
  border-bottom: none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 -8px 18px rgba(0,0,0,.10);
  z-index: -1;
}
#p11 .busbar-dock-create-circle{
  width: 78px !important;
  height: 78px !important;
  margin-top: 0 !important;
  position: relative;
  z-index: 2;
}
#p11 .busbar-dock-create .busbar-dock-label{
  margin-top: 8px !important;
  position: relative;
  z-index: 2;
}
html[data-theme="light"] #p11 .busbar-dock-create::before{
  background: linear-gradient(180deg, rgba(210,222,236,.96), rgba(205,219,233,.98)) !important;
  border-color: rgba(169,183,198,.70) !important;
}
@media (max-width:700px){
  #p11 .busbar-dock-create{
    margin-top: -40px !important;
  }
  #p11 .busbar-dock-create::before{
    width: 102px !important;
    height: 50px !important;
    top: 18px !important;
  }
  #p11 .busbar-dock-create-circle{
    width: 72px !important;
    height: 72px !important;
  }
}


/* ===== Floating create button, disconnected from dock ===== */
#p11 .busbar-dock-create{
  position: relative !important;
  min-height: 92px !important;
  margin-top: -54px !important;
  z-index: 4 !important;
}
#p11 .busbar-dock-create::before{
  content: none !important;
}
#p11 .busbar-dock-create-circle{
  width: 84px !important;
  height: 84px !important;
  margin-top: 0 !important;
  position: relative !important;
  z-index: 3 !important;
  border: 0 !important;
  box-shadow:
    0 22px 34px rgba(35,110,255,.34),
    0 0 0 10px rgba(53,71,95,.0),
    inset 0 1px 0 rgba(255,255,255,.24) !important;
}
#p11 .busbar-dock-create .busbar-dock-label{
  margin-top: 10px !important;
  position: relative !important;
  z-index: 3 !important;
}
@media (max-width:700px){
  #p11 .busbar-dock-create{
    margin-top: -48px !important;
    min-height: 88px !important;
  }
  #p11 .busbar-dock-create-circle{
    width: 76px !important;
    height: 76px !important;
  }
}


/* ===== Refine floating create to match reference ===== */
#p11{
  padding-bottom: 172px !important;
}
#p11 .busbar-bottom-nav.busbar-dock{
  bottom: 0 !important;
  width: min(900px, 100%) !important;
  padding: 10px 12px calc(env(safe-area-inset-bottom) + 12px) !important;
  border-radius: 26px 26px 0 0 !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  min-height: 74px !important;
  padding: 12px 8px 6px !important;
}
#p11 .busbar-dock-icon{
  font-size: 1.55rem !important;
}
#p11 .busbar-dock-label{
  font-size: .60rem !important;
}
#p11 .busbar-dock-create{
  min-height: 82px !important;
  margin-top: -36px !important;
  justify-content: flex-start !important;
}
#p11 .busbar-dock-create-circle{
  width: 72px !important;
  height: 72px !important;
  font-size: 2.5rem !important;
  box-shadow:
    0 16px 26px rgba(35,110,255,.28),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
}
#p11 .busbar-dock-create .busbar-dock-label{
  margin-top: 8px !important;
}
#p11 .busbar-dock-badge{
  top: 18px !important;
  right: 22px !important;
}
@media (max-width:700px){
  #p11{
    padding-bottom: 164px !important;
  }
  #p11 .busbar-bottom-nav.busbar-dock{
    padding: 8px 8px calc(env(safe-area-inset-bottom) + 10px) !important;
    border-radius: 24px 24px 0 0 !important;
  }
  #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
    min-height: 68px !important;
    padding: 10px 4px 4px !important;
  }
  #p11 .busbar-dock-icon{
    font-size: 1.35rem !important;
  }
  #p11 .busbar-dock-label{
    font-size: .56rem !important;
  }
  #p11 .busbar-dock-create{
    min-height: 76px !important;
    margin-top: -30px !important;
  }
  #p11 .busbar-dock-create-circle{
    width: 66px !important;
    height: 66px !important;
    font-size: 2.25rem !important;
  }
  #p11 .busbar-dock-badge{
    top: 16px !important;
    right: 16px !important;
    min-width: 18px !important;
    height: 18px !important;
    font-size: .62rem !important;
  }
}


/* ===== Dock scope fix ===== */
.bottom-dock,
.create-btn,
.create-cradle {
  display: none !important;
}

#p11 .bottom-dock {
  display: flex !important;
}
#p11 .create-btn,
#p11 .create-cradle {
  display: flex !important;
}
#p11 .create-cradle {
  display: block !important;
}

/* Prevent accidental duplication if old busbar dock exists */
#p11 .busbar-bottom-nav:not(.bottom-dock) {
  display: none !important;
}


/* ===== P11 dock visibility final fix ===== */
.bottom-dock,
.create-btn,
.create-cradle{
  display:none !important;
}

/* show only the real Busbar dock inside P11 */
#p11 .busbar-bottom-nav.busbar-dock{
  display:grid !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn,
#p11 .busbar-bottom-nav.busbar-dock .busbar-dock-create{
  display:flex !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-dock-create-circle,
#p11 .busbar-bottom-nav.busbar-dock .busbar-dock-label,
#p11 .busbar-bottom-nav.busbar-dock .busbar-dock-icon,
#p11 .busbar-bottom-nav.busbar-dock .busbar-dock-badge{
  display:inline-flex;
}


/* ===== Theme-aware dock polish ===== */
:root{
  --bb-dock-bg-dark-top: rgba(70, 91, 120, 0.90);
  --bb-dock-bg-dark-bottom: rgba(49, 66, 90, 0.94);
  --bb-dock-border-dark: rgba(255,255,255,.14);
  --bb-dock-text-dark: rgba(255,255,255,.78);
  --bb-dock-text-dark-muted: rgba(255,255,255,.58);
  --bb-dock-shadow-dark: rgba(0,0,0,.32);

  --bb-dock-bg-light-top: rgba(236, 242, 249, 0.96);
  --bb-dock-bg-light-bottom: rgba(220, 229, 240, 0.98);
  --bb-dock-border-light: rgba(145, 160, 180, .42);
  --bb-dock-text-light: rgba(16,24,40,.88);
  --bb-dock-text-light-muted: rgba(71, 85, 105, .78);
  --bb-dock-shadow-light: rgba(15,23,42,.10);
}

#p11 .busbar-bottom-nav.busbar-dock{
  background: linear-gradient(180deg, var(--bb-dock-bg-dark-top), var(--bb-dock-bg-dark-bottom)) !important;
  border: 1px solid var(--bb-dock-border-dark) !important;
  box-shadow:
    0 18px 34px var(--bb-dock-shadow-dark),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  color: var(--bb-dock-text-dark-muted) !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active{
  color: var(--bb-dock-text-dark) !important;
}
#p11 .busbar-dock-create .busbar-dock-label{
  color: var(--bb-dock-text-dark) !important;
}
#p11 .busbar-bottom-nav.busbar-dock::after{
  background: linear-gradient(180deg, rgba(76,96,124,.98), rgba(58,76,101,.99)) !important;
  border-color: rgba(255,255,255,.12) !important;
}
#p11 .busbar-bottom-nav.busbar-dock::before{
  background: rgba(31,43,61,.70) !important;
}
#p11 .busbar-dock-badge{
  border-color: rgba(58,76,101,.98) !important;
}

html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock,
.light-mode #p11 .busbar-bottom-nav.busbar-dock{
  background: linear-gradient(180deg, var(--bb-dock-bg-light-top), var(--bb-dock-bg-light-bottom)) !important;
  border: 1px solid var(--bb-dock-border-light) !important;
  box-shadow:
    0 16px 28px var(--bb-dock-shadow-light),
    inset 0 1px 0 rgba(255,255,255,.75) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn,
.light-mode #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  color: var(--bb-dock-text-light-muted) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active,
.light-mode #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active{
  color: var(--bb-dock-text-light) !important;
}
html[data-theme="light"] #p11 .busbar-dock-create .busbar-dock-label,
.light-mode #p11 .busbar-dock-create .busbar-dock-label{
  color: var(--bb-dock-text-light) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock::after,
.light-mode #p11 .busbar-bottom-nav.busbar-dock::after{
  background: linear-gradient(180deg, rgba(227,235,245,.98), rgba(214,224,236,.99)) !important;
  border-color: rgba(145,160,180,.42) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock::before,
.light-mode #p11 .busbar-bottom-nav.busbar-dock::before{
  background: rgba(198,210,224,.70) !important;
}
html[data-theme="light"] #p11 .busbar-dock-badge,
.light-mode #p11 .busbar-dock-badge{
  border-color: rgba(214,224,236,.98) !important;
}


/* ===== Busbar dock colors matched to app theme ===== */
:root{
  --amp-dock-dark-top: rgba(18,18,20,.96);
  --amp-dock-dark-bottom: rgba(10,10,12,.98);
  --amp-dock-dark-border: rgba(255,204,0,.12);
  --amp-dock-dark-text: rgba(255,255,255,.92);
  --amp-dock-dark-text-muted: rgba(255,255,255,.62);
  --amp-dock-dark-shadow: rgba(0,0,0,.42);

  --amp-dock-light-top: rgba(250,250,252,.98);
  --amp-dock-light-bottom: rgba(239,240,244,.99);
  --amp-dock-light-border: rgba(17,24,39,.10);
  --amp-dock-light-text: rgba(15,23,42,.92);
  --amp-dock-light-text-muted: rgba(71,85,105,.72);
  --amp-dock-light-shadow: rgba(15,23,42,.10);
}

#p11 .busbar-bottom-nav.busbar-dock{
  background:
    linear-gradient(180deg, rgba(255,204,0,.05), rgba(255,204,0,0) 18%),
    linear-gradient(180deg, var(--amp-dock-dark-top), var(--amp-dock-dark-bottom)) !important;
  border: 1px solid var(--amp-dock-dark-border) !important;
  box-shadow:
    0 16px 32px var(--amp-dock-dark-shadow),
    inset 0 1px 0 rgba(255,255,255,.05) !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  color: var(--amp-dock-dark-text-muted) !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active{
  color: var(--amp-dock-dark-text) !important;
}
#p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active::before{
  background: linear-gradient(90deg, #ffd84d, #f4be00) !important;
  box-shadow: 0 4px 10px rgba(244,190,0,.28) !important;
}
#p11 .busbar-dock-create .busbar-dock-label{
  color: var(--amp-dock-dark-text) !important;
}
#p11 .busbar-bottom-nav.busbar-dock::after{
  background:
    linear-gradient(180deg, rgba(255,204,0,.06), rgba(255,204,0,0) 20%),
    linear-gradient(180deg, rgba(24,24,27,.98), rgba(14,14,16,.99)) !important;
  border-color: rgba(255,204,0,.10) !important;
}
#p11 .busbar-bottom-nav.busbar-dock::before{
  background: rgba(0,0,0,.34) !important;
}
#p11 .busbar-dock-badge{
  border-color: rgba(14,14,16,.98) !important;
}
#p11 .busbar-dock-create-circle{
  box-shadow:
    0 18px 30px rgba(35,110,255,.26),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
}

html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock,
.light-mode #p11 .busbar-bottom-nav.busbar-dock{
  background:
    linear-gradient(180deg, rgba(255,204,0,.06), rgba(255,204,0,0) 20%),
    linear-gradient(180deg, var(--amp-dock-light-top), var(--amp-dock-light-bottom)) !important;
  border: 1px solid var(--amp-dock-light-border) !important;
  box-shadow:
    0 14px 28px var(--amp-dock-light-shadow),
    inset 0 1px 0 rgba(255,255,255,.88) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn,
.light-mode #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  color: var(--amp-dock-light-text-muted) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active,
.light-mode #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active{
  color: var(--amp-dock-light-text) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active::before,
.light-mode #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active::before{
  background: linear-gradient(90deg, #ffd84d, #f4be00) !important;
  box-shadow: 0 4px 10px rgba(244,190,0,.20) !important;
}
html[data-theme="light"] #p11 .busbar-dock-create .busbar-dock-label,
.light-mode #p11 .busbar-dock-create .busbar-dock-label{
  color: var(--amp-dock-light-text) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock::after,
.light-mode #p11 .busbar-bottom-nav.busbar-dock::after{
  background:
    linear-gradient(180deg, rgba(255,204,0,.06), rgba(255,204,0,0) 22%),
    linear-gradient(180deg, rgba(246,247,250,.99), rgba(233,235,240,.99)) !important;
  border-color: rgba(17,24,39,.08) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock::before,
.light-mode #p11 .busbar-bottom-nav.busbar-dock::before{
  background: rgba(148,163,184,.16) !important;
}
html[data-theme="light"] #p11 .busbar-dock-badge,
.light-mode #p11 .busbar-dock-badge{
  border-color: rgba(233,235,240,.99) !important;
}


/* === CREATE BUTTON THEME MATCH === */

/* DARK MODE */
#p11 .busbar-dock-create-circle{
  background: linear-gradient(145deg, #ffd84d, #f4be00) !important;
  color: #111 !important;
  box-shadow:
    0 12px 24px rgba(244,190,0,.35),
    inset 0 2px 4px rgba(255,255,255,.35) !important;
}
#p11 .busbar-dock-create-circle i{
  color:#111 !important;
}

/* LIGHT MODE */
html[data-theme="light"] #p11 .busbar-dock-create-circle,
.light-mode #p11 .busbar-dock-create-circle{
  background: linear-gradient(145deg, #111827, #1f2937) !important;
  color: #fff !important;
  box-shadow:
    0 10px 20px rgba(0,0,0,.15),
    inset 0 1px 2px rgba(255,255,255,.15) !important;
}
html[data-theme="light"] #p11 .busbar-dock-create-circle i,
.light-mode #p11 .busbar-dock-create-circle i{
  color:#fff !important;
}


/* ===== Final polish: create glow + press + remove top-right plus ===== */
#p11 .busbar-topbar-plus{
  display:none !important;
}
#p11 .busbar-topbar-clean{
  grid-template-columns: 120px 1fr 0 !important;
}
#p11 .busbar-dock-create-circle{
  transition: transform .15s ease, box-shadow .15s ease !important;
  box-shadow:
    0 8px 18px rgba(244,190,0,.25),
    inset 0 2px 4px rgba(255,255,255,.35) !important;
}
#p11 .busbar-dock-create-circle:active{
  transform: scale(0.92) !important;
}
html[data-theme="light"] #p11 .busbar-dock-create-circle,
.light-mode #p11 .busbar-dock-create-circle{
  transition: transform .15s ease, box-shadow .15s ease !important;
}
html[data-theme="light"] #p11 .busbar-dock-create-circle:active,
.light-mode #p11 .busbar-dock-create-circle:active{
  transform: scale(0.92) !important;
}


/* ===== Header refinement: center Busbar + smaller Back ===== */

/* Center title perfectly */
#p11 .busbar-header,
#p11 .busbar-topbar-clean{
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;
}

/* Force title to true center */
#p11 .busbar-title{
  justify-self: center !important;
  text-align: center !important;
}

/* Shrink BACK button */
#p11 .busbar-back{
  font-size: 12px !important;
  padding: 6px 12px !important;
  border-radius: 10px !important;
  border-width: 1.5px !important;
}

/* Tighten left spacing */
#p11 .busbar-back span{
  font-size: 12px !important;
}

/* Reduce header height slightly */
#p11 .busbar-header{
  padding-top: 10px !important;
  padding-bottom: 6px !important;
}


/* ===== TRUE CENTER FIX (ignore left BACK width) ===== */

/* Make header relative */
#p11 .busbar-header{
  position: relative !important;
}

/* Absolute center title */
#p11 .busbar-title{
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  text-align: center !important;
  width: max-content;
}

/* Keep back on left */
#p11 .busbar-back{
  position: relative;
  z-index: 2;
}


/* ===== HARD CENTER FIX (override EVERYTHING) ===== */

/* kill any layout interference */
#p11 .busbar-header{
  display: block !important;
  position: relative !important;
  text-align: center !important;
}

/* center title container */
#p11 .busbar-header h1,
#p11 .busbar-title{
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
  width: auto !important;
  text-align: center !important;
}

/* center subtitle too */
#p11 .busbar-header .busbar-subtitle{
  position: absolute !important;
  top: 48px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  text-align: center !important;
  width: max-content;
}

/* keep back pinned left */
#p11 .busbar-back{
  position: relative !important;
  display: inline-block !important;
  float: left !important;
  z-index: 2;
}

/* ensure spacing doesn't collapse */
#p11 .busbar-header{
  padding-bottom: 30px !important;
}


/* ===== REAL center fix for actual Busbar header ===== */
#p11 .busbar-topbar-clean{
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  /* v4.23: pad for the iOS safe area so BACK button isn't under the Dynamic Island.
     Was 0 4px which placed the button under the status bar on notched iPhones. */
  min-height: calc(72px + env(safe-area-inset-top, 0px)) !important;
  padding: env(safe-area-inset-top, 0px) 4px 0 4px !important;
}

/* v4.34: v4.23 hide rule removed — See Their Work sheet now built and
   functional via the v4_35 cleaner-rebuild block. */
#p11 .busbar-topbar-title{
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  width: max-content !important;
  text-align: center !important;
  z-index: 1 !important;
}
#p11 .busbar-topbar-clean > .btn-back{
  position: relative !important;
  z-index: 2 !important;
}
#p11 .busbar-topbar-plus{
  display: none !important;
}


/* ===== Injected Busbar feed redesign ===== */
#p11 #busbar-feed-list{
  display:grid;
  gap:16px;
}
#p11 .busbar-feed-card{
  position:relative;
  overflow:hidden;
  border-radius:26px !important;
  border:1px solid rgba(255,255,255,.09) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)),
    #141416 !important;
  box-shadow:0 16px 34px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.03) !important;
  padding:16px !important;
}
#p11 .busbar-feed-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.02) 28%, rgba(255,204,0,.06) 50%, transparent 72%);
  transform:translateX(-120%);
  pointer-events:none;
}
#p11 .busbar-feed-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
#p11 .busbar-feed-user{
  display:flex;
  align-items:flex-start;
  gap:12px;
  min-width:0;
}
#p11 .busbar-feed-avatar{
  width:58px;
  height:58px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.12);
  background:#0d0d10;
  color:var(--gold);
  font-size:1.35rem;
  font-weight:1000;
  flex:0 0 auto;
}
#p11 .busbar-feed-name{
  font-size:1.18rem;
  line-height:1.03;
  font-weight:1000;
  letter-spacing:-.02em;
}
#p11 .busbar-feed-meta{
  color:var(--sub);
  font-size:.92rem;
  margin-top:4px;
  line-height:1.32;
}
#p11 .busbar-feed-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(255,204,0,.18);
  background:rgba(255,204,0,.06);
  color:var(--gold);
  font-weight:1000;
  white-space:nowrap;
  flex:0 0 auto;
}
#p11 .busbar-feed-photo{
  position:relative;
  overflow:hidden;
  margin-top:14px;
  min-height:220px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(135deg, rgba(255,204,0,.15), rgba(255,153,0,.06) 36%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    #26211a;
}
#p11 .busbar-feed-photo::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top right, rgba(255,255,255,.12), transparent 32%),
    linear-gradient(to top, rgba(0,0,0,.66), rgba(0,0,0,0) 44%);
}
#p11 .busbar-feed-label{
  position:absolute;
  left:14px;
  right:auto;
  bottom:14px;
  z-index:2;
  max-width:calc(100% - 28px);
  padding:10px 16px;
  border-radius:999px;
  background:rgba(0,0,0,.48);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  color:#fff;
  font-weight:1000;
  font-size:1rem;
  line-height:1.15;
}
#p11 .busbar-feed-caption{
  margin-top:14px;
  color:var(--text);
  font-size:1.02rem;
  line-height:1.46;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
#p11 .busbar-feed-stats{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
#p11 .busbar-stat-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 14px;
  border-radius:999px;
  border:1px solid rgba(255,204,0,.18);
  background:rgba(255,204,0,.06);
  color:var(--gold);
  font-size:.86rem;
  font-weight:1000;
  transition:transform .16s ease, background .18s ease, border-color .18s ease;
}
#p11 .busbar-feed-actions{
  display:grid;
  gap:10px;
  margin-top:14px;
}
#p11 .busbar-feed-primary{
  width:100%;
  min-height:56px;
  border:none;
  border-radius:18px;
  background:linear-gradient(180deg, #ffd84d 0%, #f4be00 100%);
  color:#000;
  font-weight:1000;
  font-size:1rem;
  box-shadow:0 14px 24px rgba(244,190,0,.14), inset 0 1px 0 rgba(255,255,255,.20);
}
#p11 .busbar-feed-secondary{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
#p11 .busbar-feed-ghost{
  min-height:52px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.02);
  color:var(--text);
  font-weight:1000;
}
html[data-theme="light"] #p11 .busbar-feed-card,
.light-mode #p11 .busbar-feed-card{
  background:linear-gradient(180deg,#ffffff 0%, #fbfbfd 100%) !important;
  border:1px solid #d8dde5 !important;
  box-shadow:0 16px 34px rgba(15,23,42,.08) !important;
}
html[data-theme="light"] #p11 .busbar-feed-photo,
.light-mode #p11 .busbar-feed-photo{
  border:1px solid #d8dde5 !important;
  background:
    linear-gradient(135deg, rgba(255,204,0,.14), rgba(255,204,0,.03) 34%),
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0)),
    #e8e3cf !important;
}
html[data-theme="light"] #p11 .busbar-feed-label,
.light-mode #p11 .busbar-feed-label{
  background:rgba(109,104,94,.48) !important;
  border:1px solid rgba(255,255,255,.36) !important;
}
html[data-theme="light"] #p11 .busbar-feed-ghost,
.light-mode #p11 .busbar-feed-ghost{
  border:1px solid #c8ced9 !important;
  background:#ffffff !important;
}
@media (max-width:700px){
  #p11 .busbar-feed-card{
    padding:14px !important;
    border-radius:24px !important;
  }
  #p11 .busbar-feed-avatar{
    width:54px;height:54px;font-size:1.25rem;
  }
  #p11 .busbar-feed-name{
    font-size:1.1rem;
  }
  #p11 .busbar-feed-meta{
    font-size:.88rem;
  }
  #p11 .busbar-feed-badge{
    padding:9px 12px;
    font-size:.88rem;
  }
  #p11 .busbar-feed-photo{
    min-height:190px;
    border-radius:22px;
  }
  #p11 .busbar-feed-label{
    font-size:.96rem;
    padding:10px 14px;
  }
  #p11 .busbar-feed-caption{
    font-size:.98rem;
  }
  #p11 .busbar-stat-pill{
    font-size:.82rem;
    padding:8px 12px;
  }
}


/* ===== Instagram-style interaction polish ===== */
#p11 .busbar-feed-card{
  transition: transform .18s ease, box-shadow .22s ease;
}
#p11 .busbar-feed-card:active{
  transform: scale(.995);
}
#p11 .busbar-feed-photo{
  cursor:pointer;
}
#p11 .busbar-feed-photo.tap-pop{
  animation: busbarPhotoTap .24s ease;
}
@keyframes busbarPhotoTap{
  0%{ transform: scale(1); }
  50%{ transform: scale(.988); }
  100%{ transform: scale(1); }
}

#p11 .busbar-heart-burst{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  z-index:3;
  opacity:0;
  transform:scale(.6);
}
#p11 .busbar-heart-burst.show{
  animation: busbarHeartBurst .7s cubic-bezier(.22,.9,.2,1);
}
@keyframes busbarHeartBurst{
  0%{ opacity:0; transform:scale(.4); }
  18%{ opacity:1; transform:scale(1.08); }
  55%{ opacity:1; transform:scale(1); }
  100%{ opacity:0; transform:scale(1.18); }
}
#p11 .busbar-heart-burst span{
  width:88px;
  height:88px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.28);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  font-size:3rem;
  color:#ffd84d;
  box-shadow:0 16px 28px rgba(0,0,0,.24);
}

#p11 .busbar-feed-primary,
#p11 .busbar-feed-ghost{
  transition: transform .14s ease, box-shadow .18s ease, background .18s ease;
}
#p11 .busbar-feed-primary:active,
#p11 .busbar-feed-ghost:active{
  transform: scale(.97);
}
#p11 .busbar-feed-ghost:active{
  background:rgba(255,255,255,.06);
}

#p11 .busbar-feed-secondary{
  grid-template-columns:1fr 1fr;
}
#p11 .busbar-stat-pill{
  padding:8px 12px;
  font-size:.8rem;
  border-color:rgba(255,204,0,.16);
}
#p11 .busbar-feed-stats{
  gap:8px;
}
#p11 .busbar-feed-card:hover::before{
  animation: busbarSweep 1.1s ease;
}
@keyframes busbarSweep{
  0%{ transform:translateX(-120%); }
  100%{ transform:translateX(120%); }
}

#p11 .busbar-comment-sheet{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:4000;
  display:none;
  padding:12px 12px calc(env(safe-area-inset-bottom) + 12px);
  background:linear-gradient(180deg, rgba(10,10,12,.92), rgba(10,10,12,.98));
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-top-left-radius:24px;
  border-top-right-radius:24px;
  box-shadow:0 -18px 40px rgba(0,0,0,.35);
}
#p11 .busbar-comment-sheet.show{
  display:block;
  animation: busbarSheetUp .22s ease;
}
@keyframes busbarSheetUp{
  from{ transform:translateY(20px); opacity:0; }
  to{ transform:translateY(0); opacity:1; }
}
#p11 .busbar-comment-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
#p11 .busbar-comment-title{
  font-weight:1000;
  font-size:1rem;
}
#p11 .busbar-comment-close{
  width:40px;
  height:40px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:#fff;
  font-weight:1000;
}
#p11 .busbar-comment-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
}
#p11 .busbar-comment-input{
  min-height:48px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:#fff;
  padding:12px 14px;
}
#p11 .busbar-comment-send{
  min-width:88px;
  min-height:48px;
  border:none;
  border-radius:16px;
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
  font-weight:1000;
}
html[data-theme="light"] #p11 .busbar-heart-burst span,
.light-mode #p11 .busbar-heart-burst span{
  background:rgba(255,255,255,.52);
  color:#f4be00;
}
html[data-theme="light"] #p11 .busbar-comment-sheet,
.light-mode #p11 .busbar-comment-sheet{
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(247,248,250,.98));
  box-shadow:0 -18px 40px rgba(15,23,42,.12);
}
html[data-theme="light"] #p11 .busbar-comment-close,
html[data-theme="light"] #p11 .busbar-comment-input,
.light-mode #p11 .busbar-comment-close,
.light-mode #p11 .busbar-comment-input{
  background:#fff;
  color:#0f172a;
  border:1px solid #d8dde5;
}


/* ===== Restore sticky Busbar header ===== */
#p11 .busbar-topbar-clean{
  position: sticky !important;
  top: 0 !important;
  z-index: 350 !important;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.98), rgba(0,0,0,.92), rgba(0,0,0,.72), rgba(0,0,0,0)) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
html[data-theme="light"] #p11 .busbar-topbar-clean,
.light-mode #p11 .busbar-topbar-clean{
  background:
    linear-gradient(to bottom, rgba(255,255,255,.98), rgba(255,255,255,.94), rgba(255,255,255,.78), rgba(255,255,255,0)) !important;
}


/* ===== Feed tuning: bigger image + one-line stats ===== */
#p11 .busbar-feed-photo{
  min-height:340px !important;
  border-radius:24px !important;
}

#p11 .busbar-feed-stats{
  display:flex !important;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-top:12px;
}

#p11 .busbar-stat-pill{
  flex:1;
  justify-content:center;
  padding:8px 6px !important;
  font-size:.78rem !important;
  white-space:nowrap;
}


/* ===== Interactive stat pills ===== */
#p11 .busbar-stat-pill{
  cursor:pointer;
  user-select:none;
  -webkit-user-select:none;
  transition:transform .14s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
#p11 .busbar-stat-pill:active{
  transform:scale(.96);
}
#p11 .busbar-stat-pill.interactive{
  box-shadow:0 10px 18px rgba(0,0,0,.12);
}
#p11 .busbar-stat-pill.interactive:hover{
  background:rgba(255,204,0,.10);
}


/* ===== Stat pills exact 3-column layout ===== */
#p11 .busbar-feed-stats{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:8px !important;
  align-items:stretch !important;
  margin-top:12px !important;
}
#p11 .busbar-stat-pill{
  width:100% !important;
  min-width:0 !important;
  display:inline-flex !important;
  justify-content:center !important;
  align-items:center !important;
  overflow:hidden !important;
  white-space:nowrap !important;
  text-overflow:ellipsis !important;
}
#p11 .busbar-stat-pill span:last-child{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
@media (max-width:700px){
  #p11 .busbar-feed-stats{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:8px !important;
  }
  #p11 .busbar-stat-pill{
    font-size:.76rem !important;
    padding:8px 4px !important;
  }
}


/* ===== Working comments modal ===== */
#p11 .busbar-comment-sheet{
  position:fixed;
  inset:0;
  z-index:5000;
  display:none;
  align-items:flex-end;
  justify-content:center;
  padding:16px 12px calc(env(safe-area-inset-bottom) + 16px);
  background:rgba(0,0,0,.58);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
#p11 .busbar-comment-sheet.show{
  display:flex;
}
#p11 .busbar-comment-panel{
  width:min(760px,100%);
  max-height:min(74vh,760px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg, rgba(18,18,22,.98), rgba(11,11,14,.99));
  box-shadow:0 20px 50px rgba(0,0,0,.38);
}
#p11 .busbar-comment-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 14px 10px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
#p11 .busbar-comment-title{
  font-weight:1000;
  font-size:1rem;
}
#p11 .busbar-comment-close{
  width:40px;
  height:40px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:#fff;
  font-weight:1000;
}
#p11 .busbar-comment-list{
  padding:12px 14px;
  overflow:auto;
  display:grid;
  gap:12px;
}
#p11 .busbar-comment-card{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  padding:12px;
}
#p11 .busbar-comment-meta{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
#p11 .busbar-comment-avatar{
  width:38px;
  height:38px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#0d0d10;
  color:var(--gold);
  border:1px solid rgba(255,255,255,.10);
  font-weight:1000;
}
#p11 .busbar-comment-name{
  font-weight:1000;
  line-height:1.1;
}
#p11 .busbar-comment-time{
  color:var(--sub);
  font-size:.82rem;
  margin-top:2px;
}
#p11 .busbar-comment-body{
  color:var(--text);
  line-height:1.42;
  font-size:.95rem;
  word-break:break-word;
}
#p11 .busbar-comment-compose{
  padding:12px 14px 14px;
  border-top:1px solid rgba(255,255,255,.06);
  background:rgba(10,10,12,.92);
}
#p11 .busbar-comment-input{
  width:100%;
  min-height:52px;
  max-height:120px;
  resize:none;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:#fff;
  padding:14px 14px;
  outline:none;
}
#p11 .busbar-comment-compose-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:10px;
}
#p11 .busbar-comment-cap{
  color:var(--sub);
  font-size:.8rem;
}
#p11 .busbar-comment-send{
  min-width:96px;
  min-height:46px;
  border:none;
  border-radius:16px;
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
  font-weight:1000;
}
html[data-theme="light"] #p11 .busbar-comment-panel,
.light-mode #p11 .busbar-comment-panel{
  background:linear-gradient(180deg,#ffffff 0%, #f8f9fb 100%);
  border:1px solid #d8dde5;
  box-shadow:0 20px 50px rgba(15,23,42,.14);
}
html[data-theme="light"] #p11 .busbar-comment-card,
.light-mode #p11 .busbar-comment-card{
  background:#fff;
  border:1px solid #e2e8f0;
}
html[data-theme="light"] #p11 .busbar-comment-close,
html[data-theme="light"] #p11 .busbar-comment-input,
.light-mode #p11 .busbar-comment-close,
.light-mode #p11 .busbar-comment-input{
  background:#fff;
  color:#0f172a;
  border:1px solid #d8dde5;
}
html[data-theme="light"] #p11 .busbar-comment-compose,
.light-mode #p11 .busbar-comment-compose{
  background:rgba(248,249,251,.98);
}


/* ===== Global comments modal fix ===== */
.busbar-comment-sheet{
  position:fixed !important;
  inset:0 !important;
  z-index:5000 !important;
  display:none !important;
  align-items:flex-end !important;
  justify-content:center !important;
  padding:16px 12px calc(env(safe-area-inset-bottom) + 16px) !important;
  background:rgba(0,0,0,.58) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
.busbar-comment-sheet.show{
  display:flex !important;
}
.busbar-comment-panel{
  width:min(760px,100%) !important;
  max-height:min(74vh,760px) !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  border-radius:26px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  background:linear-gradient(180deg, rgba(18,18,22,.98), rgba(11,11,14,.99)) !important;
  box-shadow:0 20px 50px rgba(0,0,0,.38) !important;
}
.busbar-comment-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:14px 14px 10px !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
}
.busbar-comment-title{ font-weight:1000 !important; font-size:1rem !important; }
.busbar-comment-close{
  width:40px !important; height:40px !important; border-radius:12px !important;
  border:1px solid rgba(255,255,255,.10) !important; background:rgba(255,255,255,.04) !important;
  color:#fff !important; font-weight:1000 !important;
}
.busbar-comment-list{
  padding:12px 14px !important;
  overflow:auto !important;
  display:grid !important;
  gap:12px !important;
}
.busbar-comment-card{
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background:rgba(255,255,255,.03) !important;
  padding:12px !important;
}
.busbar-comment-meta{ display:flex !important; align-items:center !important; gap:10px !important; margin-bottom:8px !important; }
.busbar-comment-avatar{
  width:38px !important; height:38px !important; border-radius:50% !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  background:#0d0d10 !important; color:#f4be00 !important; border:1px solid rgba(255,255,255,.10) !important;
  font-weight:1000 !important;
}
.busbar-comment-name{ font-weight:1000 !important; line-height:1.1 !important; }
.busbar-comment-time{ color:#9ca3af !important; font-size:.82rem !important; margin-top:2px !important; }
.busbar-comment-body{ color:#fff !important; line-height:1.42 !important; font-size:.95rem !important; word-break:break-word !important; }
.busbar-comment-compose{
  padding:12px 14px 14px !important;
  border-top:1px solid rgba(255,255,255,.06) !important;
  background:rgba(10,10,12,.92) !important;
}
.busbar-comment-input{
  width:100% !important; min-height:52px !important; max-height:120px !important; resize:none !important;
  border-radius:18px !important; border:1px solid rgba(255,255,255,.10) !important;
  background:rgba(255,255,255,.04) !important; color:#fff !important; padding:14px 14px !important; outline:none !important;
}
.busbar-comment-compose-row{
  display:flex !important; align-items:center !important; justify-content:space-between !important;
  gap:12px !important; margin-top:10px !important;
}
.busbar-comment-cap{ color:#9ca3af !important; font-size:.8rem !important; }
.busbar-comment-send{
  min-width:96px !important; min-height:46px !important; border:none !important; border-radius:16px !important;
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%) !important; color:#000 !important; font-weight:1000 !important;
}
html[data-theme="light"] .busbar-comment-panel,
.light-mode .busbar-comment-panel{
  background:linear-gradient(180deg,#ffffff 0%, #f8f9fb 100%) !important;
  border:1px solid #d8dde5 !important;
  box-shadow:0 20px 50px rgba(15,23,42,.14) !important;
}
html[data-theme="light"] .busbar-comment-card,
.light-mode .busbar-comment-card{
  background:#fff !important; border:1px solid #e2e8f0 !important;
}
html[data-theme="light"] .busbar-comment-close,
html[data-theme="light"] .busbar-comment-input,
.light-mode .busbar-comment-close,
.light-mode .busbar-comment-input{
  background:#fff !important; color:#0f172a !important; border:1px solid #d8dde5 !important;
}
html[data-theme="light"] .busbar-comment-compose,
.light-mode .busbar-comment-compose{
  background:rgba(248,249,251,.98) !important;
}
html[data-theme="light"] .busbar-comment-body,
.light-mode .busbar-comment-body{
  color:#0f172a !important;
}


/* ===== FIX: composer always visible above keyboard ===== */
.busbar-comment-panel{
  display:flex !important;
  flex-direction:column !important;
}

.busbar-comment-list{
  flex:1 !important;
  overflow:auto !important;
}

.busbar-comment-compose{
  position:sticky !important;
  bottom:0 !important;
  background:rgba(10,10,12,.98) !important;
  padding-bottom:env(safe-area-inset-bottom) !important;
}

/* stronger button */
.busbar-comment-send{
  width:120px !important;
  font-size:0.95rem !important;
}


/* ===== Comment compose lifted above dock ===== */
.busbar-comment-compose{
  position: sticky !important;
  bottom: 80px !important;
  background: rgba(10,10,12,.98) !important;
  padding: 12px 14px calc(env(safe-area-inset-bottom) + 12px) !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
}
.busbar-comment-list{
  padding-bottom: 100px !important;
}
html[data-theme="light"] .busbar-comment-compose,
.light-mode .busbar-comment-compose{
  background: rgba(248,249,251,.98) !important;
}


/* ===== Comments modal final layout fix ===== */
.busbar-comment-panel{
  max-height:min(68vh,700px) !important;
}
.busbar-comment-list{
  flex:1 1 auto !important;
  min-height:0 !important;
  padding-bottom:16px !important;
}
.busbar-comment-compose{
  position:relative !important;
  bottom:auto !important;
  flex:0 0 auto !important;
  padding:12px 14px 14px !important;
  background:rgba(10,10,12,.98) !important;
  border-top:1px solid rgba(255,255,255,.06) !important;
}
.busbar-comment-input{
  width:100% !important;
  min-height:54px !important;
  max-height:110px !important;
}
.busbar-comment-compose-row{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  margin-top:10px !important;
}
.busbar-comment-cap{
  order:2 !important;
  text-align:right !important;
}
.busbar-comment-send{
  order:1 !important;
  width:100% !important;
  min-width:0 !important;
  min-height:50px !important;
  border-radius:16px !important;
  font-size:.98rem !important;
  font-weight:1000 !important;
}
html[data-theme="light"] .busbar-comment-compose,
.light-mode .busbar-comment-compose{
  background:rgba(248,249,251,.98) !important;
}


/* ===== Comments modal polish: visible action + longer scroll test ===== */
.busbar-comment-panel{
  max-height:min(62vh,640px) !important;
}
.busbar-comment-list{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow:auto !important;
  padding:12px 14px 12px !important;
}
.busbar-comment-compose{
  flex:0 0 auto !important;
  position:relative !important;
  bottom:auto !important;
  padding:10px 14px 18px !important;
  background:rgba(10,10,12,.99) !important;
  border-top:1px solid rgba(255,255,255,.06) !important;
}
.busbar-comment-input{
  min-height:56px !important;
}
.busbar-comment-compose-row{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:8px !important;
  margin-top:10px !important;
}
.busbar-comment-send{
  width:100% !important;
  min-width:0 !important;
  min-height:52px !important;
  border-radius:16px !important;
  font-size:1rem !important;
  font-weight:1000 !important;
  display:block !important;
}
.busbar-comment-cap{
  text-align:right !important;
}
html[data-theme="light"] .busbar-comment-compose,
.light-mode .busbar-comment-compose{
  background:rgba(248,249,251,.99) !important;
}


/* ===== Final comments composer visibility fix ===== */
.busbar-comment-panel{
  max-height:min(56vh,560px) !important;
}
.busbar-comment-list{
  padding:12px 14px 8px !important;
}
.busbar-comment-compose{
  padding:8px 14px calc(env(safe-area-inset-bottom) + 14px) !important;
}
.busbar-comment-input{
  min-height:52px !important;
  max-height:88px !important;
}
.busbar-comment-compose-row{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:6px !important;
  margin-top:8px !important;
}
.busbar-comment-send{
  width:100% !important;
  min-height:48px !important;
  margin-bottom:0 !important;
}
.busbar-comment-cap{
  font-size:.76rem !important;
}


/* ===== Lift entire comments modal above dock ===== */
.busbar-comment-sheet{
  padding:16px 12px 130px !important;
}
.busbar-comment-panel{
  margin-bottom: 18px !important;
  max-height:min(54vh,520px) !important;
}
.busbar-comment-compose{
  padding:8px 14px 12px !important;
}
.busbar-comment-input{
  min-height:48px !important;
  max-height:72px !important;
}
.busbar-comment-send{
  width:100% !important;
  min-height:46px !important;
  display:block !important;
}


/* ===== Realtime comments + amps burst + multi-image swipe ===== */
#p11 .busbar-feed-photo{
  overflow:hidden !important;
}
#p11 .busbar-feed-carousel{
  position:absolute;
  inset:0;
}
#p11 .busbar-feed-track{
  display:flex;
  width:100%;
  height:100%;
  transition:transform .28s ease;
}
#p11 .busbar-feed-slide{
  min-width:100%;
  height:100%;
  background:
    linear-gradient(135deg, rgba(255,204,0,.15), rgba(255,153,0,.06) 36%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    #26211a;
}
#p11 .busbar-feed-slide.variant-2{
  background:
    linear-gradient(135deg, rgba(255,204,0,.12), rgba(120,80,20,.10) 40%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    #1e1f24;
}
#p11 .busbar-feed-slide.variant-3{
  background:
    linear-gradient(135deg, rgba(255,204,0,.12), rgba(20,20,20,.08) 40%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    #2a2419;
}
#p11 .busbar-feed-slide::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top right, rgba(255,255,255,.12), transparent 32%),
    linear-gradient(to top, rgba(0,0,0,.66), rgba(0,0,0,0) 44%);
  pointer-events:none;
}
#p11 .busbar-feed-slide-label{
  position:absolute;
  left:18px;
  top:18px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(0,0,0,.32);
  border:1px solid rgba(255,255,255,.08);
  color:rgba(255,255,255,.92);
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.02em;
}
#p11 .busbar-carousel-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.36);
  color:#fff;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.1rem;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
#p11 .busbar-carousel-prev{ left:10px; }
#p11 .busbar-carousel-next{ right:10px; }
#p11 .busbar-carousel-dots{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:62px;
  z-index:3;
  display:flex;
  gap:6px;
}
#p11 .busbar-carousel-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:rgba(255,255,255,.34);
}
#p11 .busbar-carousel-dot.active{
  background:#ffd84d;
  box-shadow:0 0 0 2px rgba(255,216,77,.16);
}
#p11 .busbar-heart-burst span{
  font-size:3.3rem !important;
}
#p11 .busbar-stat-pill.live{
  box-shadow:0 10px 18px rgba(255,204,0,.12);
}
#p11 .busbar-comment-live-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#9ca3af;
  font-size:.78rem;
  font-weight:800;
}
#p11 .busbar-comment-live-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 0 0 rgba(34,197,94,.45);
  animation:busbarLivePulse 1.6s infinite;
}
@keyframes busbarLivePulse{
  0%{ box-shadow:0 0 0 0 rgba(34,197,94,.45);}
  70%{ box-shadow:0 0 0 8px rgba(34,197,94,0);}
  100%{ box-shadow:0 0 0 0 rgba(34,197,94,0);}
}
#p11 .busbar-comment-send{
  width:100% !important;
  text-align:center !important;
}
#p11 .busbar-comment-input:focus{
  border-color:#f4be00 !important;
  box-shadow:0 0 0 2px rgba(244,190,0,.25) !important;
}
@media (max-width:700px){
  #p11 .busbar-carousel-nav{
    width:34px;height:34px;
  }
}


/* ===== Carousel text cleanup ===== */
#p11 .busbar-feed-slide-label{
  position:absolute !important;
  left:14px !important;
  top:14px !important;
  padding:6px 10px !important;
  border-radius:999px !important;
  background:rgba(0,0,0,.45) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:#fff !important;
  font-size:.72rem !important;
  font-weight:800 !important;
  max-width:70% !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
}
#p11 .busbar-feed-label{
  position:absolute !important;
  left:16px !important;
  right:16px !important;
  bottom:14px !important;
  padding:10px 14px !important;
  border-radius:999px !important;
  background:rgba(0,0,0,.75) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  color:#fff !important;
  font-size:.88rem !important;
  font-weight:900 !important;
  text-align:center !important;
  line-height:1.2 !important;
}


/* ===== Multi-image label overlap fix ===== */
#p11 .busbar-feed-slide{
  position: relative !important;
  overflow: hidden !important;
}
#p11 .busbar-feed-slide-label{
  z-index: 2 !important;
}


/* ===== FINAL NO-SCROLL COMPRESSION ===== */
#home{
  padding:12px 12px 10px !important;
  min-height:100svh !important;
  overflow:hidden !important;
}

#home .home-header{
  margin:6px 0 6px 0 !important;
}

/* tighter grid */
#home .dashboard{
  gap:6px !important;
}

/* compact tiles */
#home .dashboard .block-card{
  padding:6px 6px !important;
  gap:2px !important;
  border-radius:18px !important;
}

/* regular tiles */
#home .dashboard .block-card:not(.full-width){
  height:82px !important;
  min-height:82px !important;
}

/* full width tiles (busbar + command center) */
#home .dashboard .block-card.full-width{
  height:60px !important;
  min-height:60px !important;
  padding:8px 12px !important;
  gap:10px !important;
}

/* icon spacing */
#home .dashboard .block-card .icon{
  margin-bottom:2px !important;
  line-height:1 !important;
}

/* text balance */
#home .dashboard .block-card .label{
  font-size:1.02rem !important;
  line-height:1.05 !important;
  font-weight:900 !important;
}

#home .dashboard .block-card .desc{
  font-size:.72rem !important;
  line-height:1.05 !important;
}

/* small screens */
@media (max-width:430px){
  #home .dashboard .block-card:not(.full-width){
    height:78px !important;
    min-height:78px !important;
  }
  #home .dashboard .block-card.full-width{
    height:58px !important;
    min-height:58px !important;
  }
}


/* ===== Full-width home cards fix only (Busbar + Command Center) ===== */
#home .dashboard .block-card.full-width{
  grid-column: span 2 !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:left !important;
  gap:14px !important;
  height:60px !important;
  min-height:60px !important;
  padding:8px 14px !important;
}
#home .dashboard .block-card.full-width .icon{
  font-size:1.55rem !important;
  line-height:1 !important;
  margin:0 !important;
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#home .dashboard .block-card.full-width > div{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  text-align:left !important;
  line-height:1.05 !important;
  flex:0 1 auto !important;
}
#home .dashboard .block-card.full-width .label{
  font-size:1.0rem !important;
  font-weight:1000 !important;
  margin:0 !important;
  line-height:1.05 !important;
}
#home .dashboard .block-card.full-width .desc{
  font-size:.72rem !important;
  margin-top:3px !important;
  line-height:1.05 !important;
}


/* ===== Final tune: keep middle blocks locked, tighten only top/bottom full-width cards ===== */
#home .dashboard .block-card:not(.full-width){
  position: relative !important;
  top: 0 !important;
  margin: 0 !important;
}

#home .dashboard .block-card.full-width{
  height: 56px !important;
  min-height: 56px !important;
  padding: 6px 14px !important;
  gap: 12px !important;
  align-items: center !important;
  justify-content: center !important;
}

#home .dashboard .block-card.full-width .icon{
  font-size: 1.45rem !important;
}

#home .dashboard .block-card.full-width .label{
  font-size: .96rem !important;
  line-height: 1 !important;
}

#home .dashboard .block-card.full-width .desc{
  font-size: .68rem !important;
  line-height: 1 !important;
  margin-top: 2px !important;
}

#home .dashboard .block-card.full-width > div{
  justify-content: center !important;
}

#home .dashboard .block-card.full-width:first-child{
  margin-bottom: 2px !important;
}
#home .dashboard .block-card.full-width:last-child{
  margin-top: 2px !important;
}


/* ===== PERFECT TEXT CENTERING (MIDDLE BLOCKS ONLY) ===== */
#home .dashboard .block-card:not(.full-width){
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
}
#home .dashboard .block-card:not(.full-width) .icon{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 0 4px 0 !important;
}
#home .dashboard .block-card:not(.full-width) .label{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  width:100% !important;
  margin:0 !important;
}


/* ===== P11 (Busbar) + P12 (Command Center) FINAL POLISH ===== */
#home .block-card.full-width .label{
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px !important;
}

#home .block-card.full-width .sub{
  font-size: 14px !important;
  margin-top: 2px !important;
  opacity: 0.9 !important;
}

#home .block-card.full-width{
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  gap: 2px !important;
}


/* ===== FINAL BOOSTED P11 + P12 (BIGGER + TIGHTER) ===== */
#home .block-card.full-width .label{
  font-size: 24px !important;
  font-weight: 800 !important;
  letter-spacing: 0.2px !important;
}

#home .block-card.full-width .sub{
  font-size: 16px !important;
  margin-top: 0px !important;
  opacity: 0.95 !important;
}

#home .block-card.full-width{
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  gap: 0px !important;
}


/* ===== FINAL MICRO TUNE (VISUAL BALANCE FIX) ===== */
#home .block-card.full-width .label{
  font-size: 26px !important;
  font-weight: 800 !important;
}

#home .block-card.full-width .sub{
  font-size: 17px !important;
}

#home .block-card.full-width{
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}


/* ===== FINAL BUSBAR DOMINANCE BOOST ===== */
#home .block-card.full-width.busbar{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
}
#home .block-card.full-width.busbar .label{
  font-size: 30px !important;
  font-weight: 900 !important;
  letter-spacing: 0.5px !important;
}

#home .block-card.full-width.busbar .sub{
  font-size: 18px !important;
  font-weight: 600 !important;
}

/* keep command center slightly smaller for hierarchy */
#home .block-card.full-width.command-center .label{
  font-size: 22px !important;
  font-weight: 700 !important;
}


/* ===== COMMAND CENTER MATCH MIDDLE BLOCKS ===== */
#home .block-card.full-width.command-center .label{
  font-size: 18px !important;
  font-weight: 700 !important;
}

#home .block-card.full-width.command-center .sub{
  font-size: 12px !important;
  opacity: 0.85 !important;
}


/* ===== HARD OVERRIDE: COMMAND CENTER EXACT MATCH ===== */
#home .block-card.full-width.command-center .label{
  font-size: 18px !important;
  font-weight: 700 !important;
  transform: none !important;
}

#home .block-card.full-width.command-center .sub{
  font-size: 12px !important;
  margin-top: 2px !important;
}

#home .block-card.full-width.command-center{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
}


/* ===== Fix swapped home hero classes + final top/bottom card hierarchy ===== */
#home .block-card.full-width.busbar{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
}
#home .block-card.full-width.busbar .label{
  font-size: 30px !important;
  font-weight: 900 !important;
  letter-spacing: .3px !important;
}
#home .block-card.full-width.busbar .desc{
  font-size: 18px !important;
  font-weight: 600 !important;
  margin-top: 2px !important;
}
#home .block-card.full-width.command-center .label{
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}
#home .block-card.full-width.command-center .desc{
  font-size: 12px !important;
  font-weight: 500 !important;
  opacity: .9 !important;
  margin-top: 2px !important;
}
#home .block-card.full-width.command-center{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:left !important;
}
#home .block-card.full-width.command-center > div{
  text-align:left !important;
}


/* ===== Tighten Busbar hero only ===== */
#home .block-card.full-width.busbar{
  height: 54px !important;
  min-height: 54px !important;
  padding: 4px 14px !important;
  gap: 10px !important;
}
#home .block-card.full-width.busbar .icon{
  font-size: 1.45rem !important;
  margin: 0 !important;
}
#home .block-card.full-width.busbar{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
}
#home .block-card.full-width.busbar .label{
  font-size: 28px !important;
  line-height: .95 !important;
  margin: 0 !important;
}
#home .block-card.full-width.busbar .desc{
  font-size: 16px !important;
  line-height: 1 !important;
  margin-top: 1px !important;
}
#home .block-card.full-width.busbar > div{
  gap: 1px !important;
}


/* ===== BUSBAR INLINE ICON + TITLE ===== */
#home .block-card.full-width.busbar{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
}

#home .block-card.full-width.busbar .icon{
  font-size: 1.6rem !important;
  margin:0 !important;
}

#home .block-card.full-width.busbar{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
}
#home .block-card.full-width.busbar .label{
  font-size: 30px !important;
  font-weight: 900 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}


/* ===== FINAL BUSBAR INLINE FIX ===== */
#home .block-card.full-width.busbar{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
}

#home .block-card.full-width.busbar .icon{
  font-size: 1.6rem !important;
  margin:0 !important;
}

#home .block-card.full-width.busbar{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
}
#home .block-card.full-width.busbar .label{
  font-size: 30px !important;
  font-weight: 900 !important;
  display:flex !important;
  align-items:center !important;
}


/* ===== Shop Talk / Dispatch split hub ===== */
#p11 .busbar-channel-hub{
  padding:14px;
}
#p11 .busbar-channel-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
#p11 .busbar-channel-tile{
  background:var(--card2);
  border:1px solid var(--stroke2);
  border-radius:18px;
  padding:14px;
  min-height:134px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:10px;
  cursor:pointer;
  transition:transform .12s ease,border-color .12s ease, box-shadow .18s ease;
}
#p11 .busbar-channel-tile.active{
  border-color:var(--gold);
  box-shadow:0 10px 20px rgba(255,204,0,.10);
}
#p11 .busbar-channel-title{
  font-size:1.2rem;
  font-weight:1000;
  color:#fff;
}
#p11 .busbar-channel-copy{
  color:var(--subCard);
  line-height:1.35;
  font-size:.92rem;
}
#p11 .busbar-channel-post{
  width:100%;
  border:none;
  border-radius:14px;
  padding:12px;
  font-weight:1000;
  cursor:pointer;
  background:var(--gold);
  color:#000;
}
html[data-theme="light"] #p11 .busbar-channel-title{ color:#111827; }
html[data-theme="light"] #p11 .busbar-channel-post{ box-shadow:0 8px 18px rgba(212,166,0,.18); }


/* Stronger clickability on create button */
#p11 .busbar-dock-create,
#p11 .busbar-dock-create-circle,
#p11 .busbar-topbar-plus{
  cursor:pointer !important;
  pointer-events:auto !important;
}


/* ===== Composer overlay readable + dashboard slides away ===== */
#p11.busbar-compose-open .busbar-topbar-clean,
#p11.busbar-compose-open .busbar-bottom-nav,
#p11.busbar-compose-open .busbar-dock,
#p11.busbar-compose-open .busbar-tab.active{
  transform: translateY(100vh) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: transform .22s ease, opacity .18s ease !important;
}

#p11 .busbar-topbar-clean,
#p11 .busbar-bottom-nav,
#p11 .busbar-dock,
#p11 .busbar-tab.active{
  transition: transform .22s ease, opacity .18s ease !important;
}

#p11 .busbar-post-modal{
  position: fixed !important;
  inset: 0 !important;
  z-index: 10020 !important;
  width: 100vw !important;
  height: 100svh !important;
  max-height: 100svh !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 12px 12px calc(env(safe-area-inset-bottom) + 18px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  background: rgba(13,13,13,.98) !important;
}

#p11 .busbar-post-shell{
  padding: 0 !important;
  margin: 0 auto !important;
  max-width: 560px !important;
}

#p11 .busbar-post-title,
#p11 #busbar-composer-title{
  font-size: 1rem !important;
  line-height: 1.1 !important;
  margin: 0 0 4px 0 !important;
}

#p11 .busbar-post-modal small,
#p11 #busbar-composer-subtitle{
  display: block !important;
  font-size: .78rem !important;
  line-height: 1.22 !important;
  margin-bottom: 8px !important;
}

#p11 .busbar-post-modal label{
  margin-top: 8px !important;
  margin-bottom: 4px !important;
  font-size: .74rem !important;
  line-height: 1.05 !important;
}

#p11 .busbar-post-modal input,
#p11 .busbar-post-modal textarea,
#p11 .busbar-post-modal select{
  margin-top: 4px !important;
  padding: 10px !important;
  font-size: 15px !important;
  border-radius: 12px !important;
}

#p11 .busbar-post-modal textarea{
  min-height: 74px !important;
}

#p11 .busbar-tag-grid{
  gap: 8px !important;
}

#p11 .busbar-tag-btn{
  min-height: 46px !important;
  padding: 8px !important;
  font-size: .86rem !important;
  border-radius: 12px !important;
}

#p11 .busbar-post-photo{
  margin: 10px 0 !important;
  padding: 10px !important;
  border-radius: 12px !important;
}

#p11 .busbar-post-photo button,
#p11 .busbar-photo-btn{
  padding: 10px 12px !important;
  font-size: .9rem !important;
}

#p11 .busbar-modal-submit{
  position: sticky !important;
  bottom: calc(env(safe-area-inset-bottom) + 8px) !important;
  z-index: 30 !important;
  margin-top: 12px !important;
  padding: 14px !important;
  font-size: .98rem !important;
  border-radius: 14px !important;
}

@media (max-width: 430px){
  #p11 .busbar-post-modal{
    padding: 10px 10px calc(env(safe-area-inset-bottom) + 16px) !important;
  }
  #p11 .busbar-post-modal textarea{
    min-height: 68px !important;
  }
}


/* ===== Composer compact + close button ===== */
#p11 .busbar-post-modal{
  padding: 8px 10px calc(env(safe-area-inset-bottom) + 16px) !important;
}

#p11 .busbar-post-shell{
  max-width: 520px !important;
}

#p11 .busbar-post-card{
  padding: 14px !important;
  border-radius: 18px !important;
}

#p11 .busbar-post-title,
#p11 #busbar-composer-title{
  font-size: .96rem !important;
  line-height: 1.05 !important;
  margin: 0 !important;
}

#p11 .busbar-post-modal small,
#p11 #busbar-composer-subtitle{
  font-size: .74rem !important;
  line-height: 1.15 !important;
  margin: 4px 0 8px 0 !important;
}

#p11 .busbar-post-modal label{
  margin-top: 6px !important;
  margin-bottom: 4px !important;
  font-size: .72rem !important;
}

#p11 .busbar-post-modal input,
#p11 .busbar-post-modal textarea,
#p11 .busbar-post-modal select{
  padding: 9px !important;
  font-size: 14px !important;
  border-radius: 12px !important;
}

#p11 .busbar-post-modal textarea{
  min-height: 64px !important;
}

#p11 .busbar-tag-grid{
  gap: 8px !important;
}

#p11 .busbar-tag-btn{
  min-height: 42px !important;
  padding: 8px !important;
  font-size: .82rem !important;
  border-radius: 12px !important;
}

#p11 .busbar-post-photo{
  margin: 8px 0 !important;
  padding: 10px !important;
}

#p11 .busbar-modal-submit{
  margin-top: 10px !important;
  padding: 13px !important;
  font-size: .95rem !important;
}

#p11 .busbar-compose-close{
  position: sticky;
  top: 0;
  z-index: 40;
  width: 40px;
  height: 40px;
  margin-left: auto;
  margin-bottom: 6px;
  border: 1px solid var(--stroke2);
  border-radius: 999px;
  background: rgba(0,0,0,.35);
  color: #fff;
  font-size: 1.2rem;
  font-weight: 900;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}


/* ===== ULTRA COMPACT COMPOSER ===== */
#p11 .busbar-post-modal{
  padding: 4px 8px calc(env(safe-area-inset-bottom) + 10px) !important;
}

#p11 .busbar-post-shell{
  max-width: 520px !important;
}

#p11 .busbar-post-card{
  padding: 10px !important;
  border-radius: 16px !important;
}

/* Always keep close visible */
#p11 .busbar-compose-close{
  position: sticky !important;
  top: 0 !important;
  margin-left: auto !important;
  margin-bottom: 4px !important;
  width: 34px !important;
  height: 34px !important;
  font-size: 1rem !important;
}

#p11 .busbar-post-title,
#p11 #busbar-composer-title{
  font-size: .9rem !important;
  line-height: 1.0 !important;
  margin: 0 !important;
}

#p11 .busbar-post-modal small,
#p11 #busbar-composer-subtitle{
  font-size: .68rem !important;
  line-height: 1.08 !important;
  margin: 2px 0 6px 0 !important;
}

/* Hide username row to save space */
#p11 .busbar-post-modal input[id="busbar-modal-username"]{
  display:none !important;
}
#p11 .busbar-post-modal input[id="busbar-modal-username"] + *{
  margin-top:0 !important;
}

/* Hide photo box for now to make it fit */
#p11 .busbar-post-photo{
  display:none !important;
}

#p11 .busbar-post-modal label{
  margin-top: 6px !important;
  margin-bottom: 3px !important;
  font-size: .68rem !important;
  line-height: 1 !important;
}

#p11 .busbar-post-modal input,
#p11 .busbar-post-modal textarea,
#p11 .busbar-post-modal select{
  padding: 8px !important;
  font-size: 13px !important;
  border-radius: 10px !important;
}

#p11 .busbar-post-modal textarea{
  min-height: 54px !important;
}

#p11 .busbar-tag-grid{
  gap: 6px !important;
}

#p11 .busbar-tag-btn{
  min-height: 36px !important;
  padding: 6px !important;
  font-size: .76rem !important;
  border-radius: 10px !important;
}

#p11 .busbar-modal-submit{
  margin-top: 8px !important;
  padding: 12px !important;
  font-size: .9rem !important;
  border-radius: 12px !important;
}


/* ===== SAFARI ULTRA COMPACT POST CARD ===== */
#p11 .busbar-post-modal{
  padding: 2px 8px calc(env(safe-area-inset-bottom) + 8px) !important;
}

#p11 .busbar-post-shell{
  max-width: 500px !important;
}

#p11 .busbar-post-card{
  padding: 8px !important;
  border-radius: 14px !important;
}

/* tighter header */
#p11 .busbar-post-head,
#p11 .busbar-post-header,
#p11 .busbar-compose-head{
  gap: 8px !important;
  margin-bottom: 6px !important;
}
#p11 .busbar-post-avatar{
  width: 54px !important;
  height: 54px !important;
  font-size: 1.4rem !important;
}
#p11 .busbar-post-title,
#p11 #busbar-composer-title{
  font-size: .88rem !important;
  line-height: 1 !important;
  margin: 0 !important;
}
#p11 .busbar-post-modal small,
#p11 #busbar-composer-subtitle{
  font-size: .66rem !important;
  line-height: 1.02 !important;
  margin: 2px 0 4px 0 !important;
}

/* kill username row + photo block to save space */
#p11 input#busbar-modal-username,
#p11 .busbar-post-photo{
  display: none !important;
}
#p11 input#busbar-modal-username + *{
  margin-top: 0 !important;
}

/* tighter labels + inputs */
#p11 .busbar-post-modal label{
  margin-top: 4px !important;
  margin-bottom: 3px !important;
  font-size: .64rem !important;
  line-height: 1 !important;
  letter-spacing: .08em !important;
}
#p11 .busbar-post-modal input,
#p11 .busbar-post-modal textarea,
#p11 .busbar-post-modal select{
  padding: 7px 9px !important;
  font-size: 13px !important;
  border-radius: 10px !important;
  margin-top: 2px !important;
}
#p11 .busbar-post-modal textarea{
  min-height: 46px !important;
}

/* tighter tag grid */
#p11 .busbar-tag-grid{
  gap: 5px !important;
}
#p11 .busbar-tag-btn{
  min-height: 34px !important;
  padding: 6px !important;
  font-size: .72rem !important;
  border-radius: 10px !important;
}

/* submit button smaller */
#p11 .busbar-modal-submit{
  margin-top: 8px !important;
  padding: 11px !important;
  font-size: .86rem !important;
  border-radius: 12px !important;
}

/* close button always visible + compact */
#p11 .busbar-compose-close{
  position: sticky !important;
  top: 0 !important;
  width: 30px !important;
  height: 30px !important;
  font-size: .9rem !important;
  margin: 0 0 4px auto !important;
}

/* reduce any default row gaps inside composer */
#p11 .busbar-post-card > *{
  margin-bottom: 0 !important;
}

@media (max-width: 430px){
  #p11 .busbar-post-modal{
    padding: 2px 6px calc(env(safe-area-inset-bottom) + 6px) !important;
  }
  #p11 .busbar-post-card{
    padding: 7px !important;
  }
  #p11 .busbar-post-avatar{
    width: 48px !important;
    height: 48px !important;
  }
  #p11 .busbar-tag-btn{
    min-height: 32px !important;
    font-size: .68rem !important;
  }
}


/* ===== COMPACT TRADE TAG SELECTOR ===== */
#p11 .busbar-tag-grid{
  display:none !important;
}
#p11 .busbar-tag-select{
  width:100% !important;
  padding:10px 12px !important;
  border-radius:12px !important;
  font-size:14px !important;
  font-weight:800 !important;
  background:var(--card2) !important;
  border:1px solid var(--stroke2) !important;
  color:var(--text) !important;
  margin-top:2px !important;
}
#p11 .busbar-post-photo{
  display:none !important;
}


/* ===== ROLLBACK DARK OVERLAY: KEEP COMPOSER VISIBLE ===== */
#p11::before,
#p11.busbar-compose-open::before{
  display:none !important;
  content:none !important;
}

body.busbar-lock{
  overflow:auto !important;
}

#p11 .busbar-post-modal{
  background:transparent !important;
  z-index:10020 !important;
}

#p11 .busbar-post-shell{
  position:relative !important;
  z-index:10030 !important;
}

#p11 .busbar-post-card{
  background:var(--card) !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* don't hide the whole page behind composer */
#p11.busbar-compose-open .busbar-tab.active,
#p11.busbar-compose-open .busbar-topbar-clean,
#p11.busbar-compose-open .busbar-bottom-nav,
#p11.busbar-compose-open .busbar-dock{
  transform:none !important;
  opacity:1 !important;
}


/* ===== Hide Busbar dashboard while composer is open ===== */
#p11 .busbar-post-modal{
  z-index: 10050 !important;
}
#p11 .busbar-bottom-nav,
#p11 .busbar-dock,
#p11 .busbar-topbar-clean{
  transition: opacity .18s ease, transform .18s ease !important;
}


/* ===== HARD HIDE BUSBAR DOCK WHILE COMPOSER OPEN ===== */
#p11 .busbar-post-modal{
  z-index: 10060 !important;
}
#p11.busbar-compose-open .busbar-bottom-nav.busbar-dock{
  display:none !important;
  opacity:0 !important;
  pointer-events:none !important;
}


/* ===== COMPOSER COMPACT MODE ===== */
#p11 .busbar-post-modal{
  max-height: 88vh !important;
  padding: 14px !important;
  border-radius: 20px !important;
  overflow-y: auto !important;
}

#p11 .busbar-post-modal h2{
  font-size: 1.2rem !important;
  margin-bottom: 4px !important;
}

#p11 .busbar-post-modal .sub{
  font-size: .8rem !important;
  margin-bottom: 10px !important;
}

#p11 .busbar-post-modal input,
#p11 .busbar-post-modal textarea,
#p11 .busbar-post-modal select{
  padding: 10px !important;
  font-size: .9rem !important;
  border-radius: 12px !important;
}

#p11 .p11-profile-avatar{
  width: 50px !important;
  height: 50px !important;
  font-size: 1.2rem !important;
}

#p11 .p11-profile-main{
  gap: 10px !important;
}

#p11 .busbar-upload{
  padding: 12px !important;
}

#p11 .busbar-upload button{
  padding: 10px !important;
  font-size: .9rem !important;
}

#p11 .busbar-post-btn{
  padding: 14px !important;
  font-size: 1rem !important;
  border-radius: 14px !important;
}


/* ===== Real upload preview support ===== */
#p11 .busbar-feed-slide.photo-real{
  background:#111 !important;
  overflow:hidden;
}
#p11 .busbar-feed-slide.photo-real::before{
  background:
    linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0) 40%) !important;
}
#p11 .busbar-feed-real-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}


/* ===== Simple photo fit + delete ===== */
#p11 .busbar-fit-label{
  display:block;
  margin:10px 0 6px;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.08em;
  color:var(--subCard);
}
#p11 .busbar-feed-delete{
  border:none;
  border-radius:999px;
  padding:8px 12px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  color:#fff;
  font-weight:900;
  cursor:pointer;
}
#p11 .busbar-feed-delete:hover{
  border-color:rgba(255,204,0,.35);
}


/* ===== Delete only on user's posts ===== */
#p11 .busbar-feed-head-actions{
  display:flex;
  gap:8px;
  align-items:center;
  flex:0 0 auto;
}


/* ===== Saved posts thread ===== */
#p11 .busbar-saved-preview-card{
  padding:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  margin-bottom:10px;
  background:rgba(255,255,255,.02);
}
#p11 .busbar-saved-preview-title{
  font-weight:900;
  font-size:.98rem;
  color:#fff;
}
#p11 .busbar-saved-preview-meta{
  color:var(--sub);
  font-size:.84rem;
  margin-top:4px;
}
#p11 .busbar-saved-preview-actions{
  display:flex;
  gap:10px;
  margin-top:10px;
}
#p11 .busbar-saved-pill{
  border:none;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
}
#p11 .busbar-saved-pill.primary{
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%);
  color:#000;
}
#p11 .busbar-saved-pill.secondary{
  background:#1a1a1a;
  color:#fff;
  border:1px solid rgba(255,255,255,.08);
}
#p11 .busbar-saved-panel{
  max-width:760px;
}
#p11 .busbar-saved-sheet-list{
  display:grid;
  gap:12px;
}


/* ===== Saved posts sheet polish ===== */
#p11 #busbar-saved-sheet{
  position: fixed !important;
  inset: 0 !important;
  z-index: 10080 !important;
  background: rgba(0,0,0,.55) !important;
  display: none !important;
}
#p11 #busbar-saved-sheet.show{
  display: block !important;
}
#p11 .busbar-saved-panel{
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  bottom: calc(env(safe-area-inset-bottom) + 96px) !important;
  width: min(760px, calc(100% - 22px)) !important;
  max-height: min(72vh, 760px) !important;
  overflow: hidden !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg,#17181d 0%, #111216 100%) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.45) !important;
}
#p11 .busbar-saved-sheet-list{
  padding: 14px !important;
  max-height: calc(min(72vh, 760px) - 86px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  display: grid !important;
  gap: 12px !important;
}
#p11 .busbar-saved-sheet-list .busbar-feed-card{
  margin: 0 !important;
  padding: 14px !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
}
#p11 .busbar-saved-sheet-list .busbar-feed-head{
  margin-bottom: 10px !important;
}
#p11 .busbar-saved-sheet-list .busbar-feed-avatar{
  width: 54px !important;
  height: 54px !important;
  font-size: 1.15rem !important;
}
#p11 .busbar-saved-sheet-list .busbar-feed-name{
  font-size: 1rem !important;
  line-height: 1.08 !important;
}
#p11 .busbar-saved-sheet-list .busbar-feed-meta{
  font-size: .86rem !important;
  line-height: 1.28 !important;
  margin-top: 4px !important;
}
#p11 .busbar-saved-sheet-list .busbar-feed-caption{
  margin-top: 10px !important;
  font-size: 1rem !important;
  line-height: 1.4 !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
  overflow: visible !important;
}
#p11 .busbar-saved-preview-actions{
  margin-top: 12px !important;
  flex-wrap: wrap !important;
}
#p11 .busbar-saved-pill{
  min-height: 42px !important;
}
@media (max-width: 430px){
  #p11 .busbar-saved-panel{
    width: calc(100% - 14px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 86px) !important;
    max-height: 74vh !important;
    border-radius: 22px !important;
  }
  #p11 .busbar-saved-sheet-list{
    padding: 12px !important;
  }
}


/* ===== Saved Posts sheet hard styling ===== */
#busbar-saved-sheet{
  position: fixed !important;
  inset: 0 !important;
  z-index: 10080 !important;
  background: rgba(0,0,0,.58) !important;
  display: none !important;
}
#busbar-saved-sheet.show{
  display: block !important;
}
#busbar-saved-sheet .busbar-saved-panel{
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  bottom: calc(env(safe-area-inset-bottom) + 96px) !important;
  width: min(760px, calc(100% - 22px)) !important;
  max-height: min(72vh, 760px) !important;
  overflow: hidden !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg,#17181d 0%, #111216 100%) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.45) !important;
}
#busbar-saved-sheet .busbar-comment-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  padding:18px 18px 16px !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
  background: transparent !important;
}
#busbar-saved-sheet .busbar-comment-title{
  font-size:1.1rem !important;
  font-weight:1000 !important;
  color:#fff !important;
  line-height:1.05 !important;
}
#busbar-saved-sheet .busbar-comment-live-pill{
  margin-top:6px !important;
  color:#d9d9df !important;
  font-size:.92rem !important;
  background:none !important;
  border:none !important;
  padding:0 !important;
}
#busbar-saved-sheet .busbar-comment-close{
  width:56px !important;
  height:56px !important;
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.04) !important;
  color:#fff !important;
  font-size:1.3rem !important;
  flex:0 0 auto !important;
}
#busbar-saved-sheet-list{
  padding: 14px !important;
  max-height: calc(min(72vh, 760px) - 90px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  display: grid !important;
  gap: 12px !important;
}
#busbar-saved-sheet-list .busbar-feed-card{
  margin: 0 !important;
  padding: 14px !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow:none !important;
}
#busbar-saved-sheet-list .busbar-feed-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin-bottom: 10px !important;
}
#busbar-saved-sheet-list .busbar-feed-user{
  display:flex !important;
  align-items:flex-start !important;
  gap:12px !important;
  min-width:0 !important;
}
#busbar-saved-sheet-list .busbar-feed-avatar{
  width: 54px !important;
  height: 54px !important;
  font-size: 1.15rem !important;
  border-radius:999px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
}
#busbar-saved-sheet-list .busbar-feed-name{
  font-size: 1rem !important;
  line-height: 1.08 !important;
  font-weight:1000 !important;
  color:#fff !important;
}
#busbar-saved-sheet-list .busbar-feed-meta{
  font-size: .86rem !important;
  line-height: 1.28 !important;
  margin-top: 4px !important;
  color:#a8abb6 !important;
}
#busbar-saved-sheet-list .busbar-feed-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:10px 14px !important;
  border-radius:999px !important;
  border:1px solid rgba(255,204,0,.18) !important;
  background:rgba(255,204,0,.06) !important;
  color:#ffcc00 !important;
  font-weight:1000 !important;
  white-space:nowrap !important;
}
#busbar-saved-sheet-list .busbar-feed-caption{
  margin-top: 10px !important;
  font-size: 1rem !important;
  line-height: 1.4 !important;
  color:#fff !important;
  display:block !important;
  -webkit-line-clamp: unset !important;
  overflow: visible !important;
}
#busbar-saved-sheet .busbar-saved-preview-actions{
  display:flex !important;
  gap:10px !important;
  margin-top:12px !important;
  flex-wrap:wrap !important;
}
#busbar-saved-sheet .busbar-saved-pill{
  min-height:42px !important;
  border:none !important;
  border-radius:999px !important;
  padding:10px 14px !important;
  font-weight:900 !important;
  cursor:pointer !important;
}
#busbar-saved-sheet .busbar-saved-pill.primary{
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%) !important;
  color:#000 !important;
}
#busbar-saved-sheet .busbar-saved-pill.secondary{
  background:#1a1a1a !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.08) !important;
}
@media (max-width: 430px){
  #busbar-saved-sheet .busbar-saved-panel{
    width: calc(100% - 14px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 86px) !important;
    max-height: 74vh !important;
    border-radius: 22px !important;
  }
  #busbar-saved-sheet-list{
    padding: 12px !important;
  }
}


/* ===== PROFILE HEADER UPGRADE ===== */
#p11 .p11-profile-main-upgraded{
  align-items:flex-start !important;
  gap:18px !important;
}
#p11 .p11-profile-avatar-glow{
  width:88px !important;
  height:88px !important;
  font-size:2rem !important;
  border-radius:999px !important;
  box-shadow:
    0 0 0 2px rgba(255,204,0,.18),
    0 0 28px rgba(255,204,0,.22),
    0 16px 30px rgba(0,0,0,.32) !important;
  flex:0 0 auto !important;
}
#p11 .p11-profile-copy{
  min-width:0 !important;
}
#p11 .p11-profile-name-row{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:wrap !important;
}
#p11 .p11-profile-name-row .p11-profile-name{
  margin:0 !important;
}
#p11 .p11-profile-verified{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  padding:7px 12px !important;
  border-radius:999px !important;
  background:rgba(255,204,0,.08) !important;
  border:1px solid rgba(255,204,0,.18) !important;
  color:var(--gold) !important;
  font-size:.82rem !important;
  font-weight:1000 !important;
  white-space:nowrap !important;
}
#p11 .p11-profile-rank{
  margin-top:8px !important;
  color:#fff !important;
  font-size:1rem !important;
  font-weight:900 !important;
  letter-spacing:-.01em !important;
}
#p11 .p11-profile-meta{
  margin-top:8px !important;
}
#p11 .p11-profile-bio{
  margin-top:14px !important;
  line-height:1.35 !important;
}
#p11 .p11-profile-chip-scroll{
  display:flex !important;
  gap:10px !important;
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch !important;
  padding-bottom:2px !important;
  margin-top:18px !important;
}
#p11 .p11-profile-chip-scroll::-webkit-scrollbar{
  display:none !important;
}
#p11 .p11-profile-chip.locked{
  color:rgba(255,255,255,.42) !important;
  border-color:rgba(255,255,255,.08) !important;
  background:rgba(255,255,255,.03) !important;
}
#p11 .p11-profile-stat-grid-upgraded .p11-profile-stat{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:6px !important;
  min-height:116px !important;
}
#p11 .p11-profile-stat small{
  color:var(--sub) !important;
  font-size:.72rem !important;
  font-weight:700 !important;
  line-height:1.1 !important;
  text-align:center !important;
}
#p11 .p11-profile-actions-upgraded{
  margin-top:18px !important;
  gap:12px !important;
}
#p11 .p11-profile-primary-btn{
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%) !important;
  color:#000 !important;
  border:none !important;
  box-shadow:0 14px 28px rgba(255,204,0,.18) !important;
}
#p11 .p11-profile-secondary-btn{
  background:rgba(255,255,255,.04) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.08) !important;
}
#p11 .p11-profile-workstrip{
  margin-top:18px !important;
  padding:16px !important;
  border-radius:24px !important;
  background:linear-gradient(180deg,#191b20 0%, #13151a 100%) !important;
}
#p11 .p11-workstrip-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:12px !important;
  margin-top:14px !important;
}
#p11 .p11-work-thumb{
  position:relative !important;
  min-height:118px !important;
  border-radius:22px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background:
    linear-gradient(135deg, rgba(255,204,0,.18), rgba(255,153,0,.06) 42%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    #26211a !important;
}
#p11 .p11-work-thumb.alt{
  background:
    linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.02) 46%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    #161a22 !important;
}
#p11 .p11-work-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,0) 50%);
}
#p11 .p11-work-thumb-label{
  position:absolute !important;
  left:12px !important;
  right:12px !important;
  bottom:12px !important;
  z-index:2 !important;
  padding:10px 12px !important;
  border-radius:999px !important;
  background:rgba(0,0,0,.45) !important;
  color:#fff !important;
  font-weight:1000 !important;
  font-size:.92rem !important;
  text-align:center !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
@media (max-width: 430px){
  #p11 .p11-profile-main-upgraded{
    gap:14px !important;
  }
  #p11 .p11-profile-avatar-glow{
    width:78px !important;
    height:78px !important;
    font-size:1.8rem !important;
  }
  #p11 .p11-profile-name-row{
    gap:8px !important;
  }
  #p11 .p11-profile-verified{
    font-size:.76rem !important;
    padding:6px 10px !important;
  }
  #p11 .p11-workstrip-grid{
    grid-template-columns:1fr !important;
  }
}


/* ===== PROFILE TIGHTEN PASS ===== */
#p11 .p11-profile-main-upgraded{
  gap:14px !important;
  align-items:flex-start !important;
}
#p11 .p11-profile-avatar-glow{
  width:76px !important;
  height:76px !important;
  font-size:1.7rem !important;
  box-shadow:
    0 0 0 2px rgba(255,204,0,.16),
    0 0 18px rgba(255,204,0,.18),
    0 10px 20px rgba(0,0,0,.28) !important;
}
#p11 .p11-profile-copy{
  min-width:0 !important;
  flex:1 1 auto !important;
}
#p11 .p11-profile-name-row{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  flex-wrap:nowrap !important;
  overflow:hidden !important;
}
#p11 .p11-profile-name-row .p11-profile-name{
  font-size:1.05rem !important;
  line-height:1.02 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  flex:0 1 auto !important;
}
#p11 .p11-profile-verified{
  flex:0 0 auto !important;
  font-size:.68rem !important;
  padding:5px 9px !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
#p11 .p11-profile-handle{
  margin-top:6px !important;
  font-size:.98rem !important;
}
#p11 .p11-profile-rank{
  margin-top:6px !important;
  font-size:.92rem !important;
  line-height:1.15 !important;
}
#p11 .p11-profile-meta{
  margin-top:6px !important;
  font-size:.92rem !important;
  line-height:1.22 !important;
}
#p11 .p11-profile-bio{
  margin-top:12px !important;
  font-size:1rem !important;
  line-height:1.32 !important;
}

#p11 .p11-profile-chip-scroll{
  gap:8px !important;
  margin-top:14px !important;
  padding-bottom:0 !important;
}
#p11 .p11-profile-chip{
  padding:9px 12px !important;
  font-size:.82rem !important;
  border-radius:999px !important;
  white-space:nowrap !important;
}

#p11 .p11-profile-stat-grid-upgraded{
  margin-top:14px !important;
  gap:10px !important;
}
#p11 .p11-profile-stat-grid-upgraded .p11-profile-stat{
  min-height:92px !important;
  padding:12px 8px !important;
  gap:4px !important;
  border-radius:18px !important;
}
#p11 .p11-profile-stat-grid-upgraded .p11-profile-stat span{
  font-size:.72rem !important;
  letter-spacing:.14em !important;
}
#p11 .p11-profile-stat-grid-upgraded .p11-profile-stat b{
  font-size:1.6rem !important;
  line-height:1 !important;
}
#p11 .p11-profile-stat-grid-upgraded .p11-profile-stat small{
  font-size:.64rem !important;
  line-height:1.05 !important;
  max-width:86px !important;
}

#p11 .p11-profile-actions-upgraded{
  margin-top:14px !important;
  gap:10px !important;
}
#p11 .p11-profile-primary-btn,
#p11 .p11-profile-secondary-btn{
  min-height:52px !important;
  border-radius:18px !important;
  font-size:.96rem !important;
  font-weight:900 !important;
}

#p11 .p11-profile-workstrip{
  margin-top:14px !important;
  padding:14px !important;
  border-radius:20px !important;
}
#p11 .p11-workstrip-grid{
  gap:10px !important;
  margin-top:12px !important;
}
#p11 .p11-work-thumb{
  min-height:96px !important;
  border-radius:18px !important;
  background:
    linear-gradient(135deg, rgba(255,204,0,.2), rgba(255,153,0,.05) 42%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    #211c16 !important;
}
#p11 .p11-work-thumb.alt{
  background:
    linear-gradient(135deg, rgba(98,140,255,.18), rgba(255,255,255,.02) 46%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    #141923 !important;
}
#p11 .p11-work-thumb-label{
  left:10px !important;
  right:10px !important;
  bottom:10px !important;
  padding:9px 10px !important;
  font-size:.88rem !important;
  border-radius:999px !important;
  background:rgba(0,0,0,.54) !important;
}

#p11 .p11-profile-card{
  margin-top:14px !important;
}

@media (max-width: 430px){
  #p11 .p11-profile-main-upgraded{
    gap:12px !important;
  }
  #p11 .p11-profile-avatar-glow{
    width:68px !important;
    height:68px !important;
    font-size:1.5rem !important;
  }
  #p11 .p11-profile-name-row .p11-profile-name{
    font-size:.98rem !important;
  }
  #p11 .p11-profile-verified{
    font-size:.62rem !important;
    padding:4px 8px !important;
  }
  #p11 .p11-profile-chip{
    padding:8px 11px !important;
    font-size:.78rem !important;
  }
  #p11 .p11-profile-stat-grid-upgraded .p11-profile-stat{
    min-height:86px !important;
  }
  #p11 .p11-profile-stat-grid-upgraded .p11-profile-stat b{
    font-size:1.45rem !important;
  }
  #p11 .p11-workstrip-grid{
    grid-template-columns:1fr !important;
  }
  #p11 .p11-work-thumb{
    min-height:88px !important;
  }
}


/* ===== Interaction upgrade ===== */
#p11 .p11-profile-chip,
#p11 .p11-profile-primary-btn,
#p11 .p11-profile-secondary-btn,
#p11 .p11-work-thumb{
  transition: transform .14s ease, box-shadow .14s ease, filter .14s ease, border-color .14s ease !important;
  -webkit-tap-highlight-color: transparent !important;
}
#p11 .p11-profile-chip:active,
#p11 .p11-profile-primary-btn:active,
#p11 .p11-profile-secondary-btn:active,
#p11 .p11-work-thumb:active{
  transform: scale(.97) !important;
}
#p11 .p11-profile-chip:active{
  box-shadow: 0 0 0 1px rgba(255,204,0,.22), 0 0 18px rgba(255,204,0,.14) !important;
}
#p11 .p11-profile-primary-btn:active{
  box-shadow: 0 10px 22px rgba(255,204,0,.28) !important;
}
#p11 .p11-profile-secondary-btn:active{
  border-color: rgba(255,255,255,.16) !important;
}
#p11 .p11-work-thumb{
  cursor:pointer !important;
  border:none !important;
  text-align:left !important;
  padding:0 !important;
}
#p11 .p11-work-thumb:hover,
#p11 .p11-work-thumb:focus-visible{
  box-shadow: 0 0 0 1px rgba(255,204,0,.14), 0 18px 34px rgba(0,0,0,.18) !important;
  filter: saturate(1.05) !important;
  outline:none !important;
}
#p11 .p11-work-thumb:active{
  box-shadow: 0 0 0 1px rgba(255,204,0,.18), 0 10px 20px rgba(0,0,0,.22) !important;
}


/* ===== All Work button reset fix ===== */
#p11 .p11-work-thumb{
  appearance:none !important;
  -webkit-appearance:none !important;
  background-clip:padding-box !important;
  display:block !important;
  width:100% !important;
}
#p11 .p11-work-thumb::-moz-focus-inner{
  border:0 !important;
}


/* ===== Feed avatar + profile viewer ===== */
#p11 .busbar-feed-avatar-btn{
  border:none !important;
  cursor:pointer !important;
  -webkit-tap-highlight-color: transparent !important;
}
#p11 .busbar-feed-avatar-btn:active{
  transform: scale(.97) !important;
}
#p11 #busbar-user-profile-sheet{
  position: fixed !important;
  inset: 0 !important;
  z-index: 10090 !important;
  background: rgba(0,0,0,.58) !important;
  display:none !important;
}
#p11 #busbar-user-profile-sheet.show{
  display:block !important;
}
#p11 .busbar-user-profile-panel{
  position:absolute !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  bottom:calc(env(safe-area-inset-bottom) + 96px) !important;
  width:min(760px, calc(100% - 22px)) !important;
  max-height:min(74vh, 760px) !important;
  overflow:hidden !important;
  border-radius:28px !important;
  background:linear-gradient(180deg,#17181d 0%, #111216 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 24px 60px rgba(0,0,0,.45) !important;
}
#p11 .busbar-user-profile-content{
  padding:16px !important;
  max-height:calc(min(74vh,760px) - 86px) !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
#p11 .busbar-user-hero{
  display:flex !important;
  gap:14px !important;
  align-items:flex-start !important;
  padding:14px !important;
  border-radius:22px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background:linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
}
#p11 .busbar-user-hero .busbar-feed-avatar{
  width:76px !important;
  height:76px !important;
  font-size:1.7rem !important;
  box-shadow:0 0 0 2px rgba(255,204,0,.14), 0 0 18px rgba(255,204,0,.14) !important;
}
#p11 .busbar-user-name{
  font-size:1.3rem !important;
  line-height:1.03 !important;
  font-weight:1000 !important;
  color:#fff !important;
}
#p11 .busbar-user-handle{
  color:#a8abb6 !important;
  font-size:1rem !important;
  margin-top:4px !important;
}
#p11 .busbar-user-meta{
  color:#bdbfc8 !important;
  font-size:.96rem !important;
  line-height:1.3 !important;
  margin-top:10px !important;
}
#p11 .busbar-user-bio{
  color:#fff !important;
  font-size:1rem !important;
  line-height:1.4 !important;
  margin-top:12px !important;
}
#p11 .busbar-user-chip-row{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  margin-top:12px !important;
}
#p11 .busbar-user-chip{
  display:inline-flex !important;
  align-items:center !important;
  padding:8px 12px !important;
  border-radius:999px !important;
  border:1px solid rgba(255,204,0,.16) !important;
  background:rgba(255,204,0,.06) !important;
  color:var(--gold) !important;
  font-size:.82rem !important;
  font-weight:900 !important;
}
#p11 .busbar-user-highlights{
  margin-top:14px !important;
  display:grid !important;
  gap:12px !important;
}
#p11 .busbar-user-highlight-card{
  padding:14px !important;
  border-radius:20px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background:linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
}
#p11 .busbar-user-highlight-title{
  font-size:1rem !important;
  font-weight:1000 !important;
  color:#fff !important;
}
#p11 .busbar-user-highlight-meta{
  color:#a8abb6 !important;
  font-size:.86rem !important;
  margin-top:4px !important;
}
#p11 .busbar-user-highlight-copy{
  color:#fff !important;
  font-size:.98rem !important;
  line-height:1.38 !important;
  margin-top:10px !important;
}
@media (max-width:430px){
  #p11 .busbar-user-profile-panel{
    width:calc(100% - 14px) !important;
    bottom:calc(env(safe-area-inset-bottom) + 86px) !important;
    border-radius:22px !important;
  }
  #p11 .busbar-user-hero{
    gap:12px !important;
  }
  #p11 .busbar-user-hero .busbar-feed-avatar{
    width:68px !important;
    height:68px !important;
    font-size:1.5rem !important;
  }
}


/* ===== Modal polish fix: Edit Profile + Viewed Profile ===== */
#p11 #busbar-profile-modal,
#p11 #busbar-user-profile-sheet{
  position: fixed !important;
  inset: 0 !important;
  z-index: 10100 !important;
  background: rgba(0,0,0,.58) !important;
  display: none !important;
}
#p11 #busbar-profile-modal.show,
#p11 #busbar-user-profile-sheet.show{
  display: block !important;
}

/* Edit profile modal */
#p11 #busbar-profile-modal .busbar-post-sheet{
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  /* v4_11: lower bottom offset on mobile so we get more vertical room */
  bottom: calc(env(safe-area-inset-bottom) + 24px) !important;
  /* v4_10 fix: account for left + right safe-area insets so X isn't clipped on iPhone */
  width: min(760px, calc(100% - 22px - env(safe-area-inset-left) - env(safe-area-inset-right))) !important;
  max-width: calc(100vw - 22px - env(safe-area-inset-left) - env(safe-area-inset-right)) !important;
  /* v4_11: was 78vh — bumped so Save button is reachable without scroll on iPhone */
  max-height: min(88vh, 820px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg,#17181d 0%, #111216 100%) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.45) !important;
  padding: 18px !important;
  box-sizing: border-box !important;
}
/* v4_11: tablet/desktop keep more breathing room from bottom */
@media (min-width:768px){
  #p11 #busbar-profile-modal .busbar-post-sheet{
    bottom: calc(env(safe-area-inset-bottom) + 96px) !important;
    max-height: min(78vh, 820px) !important;
  }
}
#p11 #busbar-profile-modal .busbar-post-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin-bottom: 14px !important;
}
#p11 #busbar-profile-modal .busbar-post-copy{
  min-width:0 !important;
}
#p11 #busbar-profile-modal .busbar-post-title{
  font-size: 1.15rem !important;
  font-weight: 1000 !important;
  color:#fff !important;
}
#p11 #busbar-profile-modal .busbar-post-copy small{
  display:block !important;
  margin-top:6px !important;
  color:#a8abb6 !important;
  font-size:.94rem !important;
  line-height:1.32 !important;
}
#p11 #busbar-profile-modal .busbar-post-close{
  width:56px !important;
  height:56px !important;
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.04) !important;
  color:#fff !important;
  font-size:1.3rem !important;
  flex:0 0 auto !important;
}
#p11 #busbar-profile-modal .busbar-post-user-row{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  margin-bottom: 14px !important;
}
#p11 #busbar-profile-modal .busbar-post-avatar{
  width:70px !important;
  height:70px !important;
  border-radius:999px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background: linear-gradient(180deg,#ffd84d 0%, #f4be00 100%) !important;
  color:#000 !important;
  font-size:1.8rem !important;
  font-weight:1000 !important;
  box-shadow:0 0 0 2px rgba(255,204,0,.14),0 0 18px rgba(255,204,0,.14) !important;
}
#p11 #busbar-profile-modal .busbar-post-user-copy{
  min-width:0 !important;
}
#p11 #busbar-profile-modal .busbar-post-user-copy > div:first-child{
  color:#fff !important;
  font-size:1.02rem !important;
}
#p11 #busbar-profile-modal .busbar-post-user-copy .small{
  color:#a8abb6 !important;
  font-size:.92rem !important;
  line-height:1.28 !important;
}
#p11 #busbar-profile-modal label{
  display:block !important;
  margin:12px 0 6px !important;
  color:#d8dae1 !important;
  font-size:.88rem !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
}
#p11 #busbar-profile-modal input,
#p11 #busbar-profile-modal textarea{
  width:100% !important;
  background:#1c1e24 !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:16px !important;
  padding:14px 16px !important;
  font-size:1rem !important;
}
#p11 #busbar-profile-modal textarea{
  min-height:112px !important;
  line-height:1.35 !important;
}
#p11 #busbar-profile-modal .busbar-modal-submit{
  margin-top:16px !important;
  width:100% !important;
  min-height:54px !important;
  border-radius:18px !important;
  border:none !important;
  background:linear-gradient(180deg,#ffd84d 0%, #f4be00 100%) !important;
  color:#000 !important;
  font-weight:1000 !important;
  font-size:1rem !important;
}

/* Viewed user profile modal */
#p11 .busbar-user-profile-panel{
  position:absolute !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  bottom:calc(env(safe-area-inset-bottom) + 96px) !important;
  width:min(760px, calc(100% - 22px)) !important;
  max-height:min(78vh, 820px) !important;
  overflow:hidden !important;
  border-radius:28px !important;
  background:linear-gradient(180deg,#17181d 0%, #111216 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 24px 60px rgba(0,0,0,.45) !important;
}
#p11 #busbar-user-profile-sheet .busbar-comment-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:18px 18px 16px !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
}
#p11 #busbar-user-profile-sheet .busbar-comment-title{
  font-size:1.12rem !important;
  font-weight:1000 !important;
  color:#fff !important;
}
#p11 #busbar-user-profile-sheet .busbar-comment-live-pill{
  margin-top:6px !important;
  color:#d9d9df !important;
  font-size:.92rem !important;
  background:none !important;
  border:none !important;
  padding:0 !important;
}
#p11 #busbar-user-profile-sheet .busbar-comment-close{
  width:56px !important;
  height:56px !important;
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.04) !important;
  color:#fff !important;
  font-size:1.3rem !important;
  flex:0 0 auto !important;
}
#p11 .busbar-user-profile-content{
  padding:16px !important;
  max-height:calc(min(78vh, 820px) - 86px) !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
#p11 .busbar-user-highlights{
  display:grid !important;
  gap:12px !important;
  margin-top:14px !important;
}
#p11 .busbar-user-highlights .p11-work-thumb{
  appearance:none !important;
  -webkit-appearance:none !important;
  border:none !important;
  width:100% !important;
  padding:0 !important;
  text-align:left !important;
}

@media (max-width: 430px){
  #p11 #busbar-profile-modal .busbar-post-sheet,
  #p11 .busbar-user-profile-panel{
    width: calc(100% - 14px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 86px) !important;
    max-height: 80vh !important;
    border-radius: 22px !important;
  }
  #p11 #busbar-profile-modal .busbar-post-sheet{
    padding:14px !important;
  }
  #p11 #busbar-profile-modal .busbar-post-avatar{
    width:62px !important;
    height:62px !important;
    font-size:1.55rem !important;
  }
}


/* ===== GLOBAL MODAL FIX FOR PROFILE SHEETS ===== */
#busbar-profile-modal,
#busbar-user-profile-sheet{
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  background: rgba(0,0,0,.60) !important;
  display: none !important;
}
#busbar-profile-modal.show,
#busbar-user-profile-sheet.show{
  display: block !important;
}

#busbar-profile-modal .busbar-post-sheet,
#busbar-user-profile-sheet .busbar-user-profile-panel{
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  bottom: 140px !important;
  width: min(760px, calc(100% - 20px)) !important;
  max-height: 74vh !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  border-radius: 26px !important;
  background: linear-gradient(180deg,#17181d 0%, #111216 100%) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.45) !important;
}

#busbar-profile-modal .busbar-post-sheet{
  padding: 18px !important;
}

#busbar-user-profile-sheet .busbar-comment-head{
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 18px 18px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
#busbar-user-profile-sheet .busbar-comment-title{
  font-size: 1.12rem !important;
  font-weight: 1000 !important;
  color: #fff !important;
}
#busbar-user-profile-sheet .busbar-comment-live-pill{
  margin-top: 6px !important;
  color: #d9d9df !important;
  font-size: .92rem !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
}
#busbar-user-profile-sheet .busbar-comment-close,
#busbar-profile-modal .busbar-post-close{
  width: 56px !important;
  height: 56px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.04) !important;
  color: #fff !important;
  font-size: 1.3rem !important;
  flex: 0 0 auto !important;
}
#busbar-user-profile-sheet .busbar-user-profile-content{
  padding: 16px !important;
  max-height: calc(74vh - 86px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}
#busbar-user-profile-sheet .busbar-user-hero{
  display: grid !important;
  grid-template-columns: 76px 1fr !important;
  gap: 16px !important;
  align-items: start !important;
  padding: 16px !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
}
#busbar-user-profile-sheet .busbar-user-hero .busbar-feed-avatar{
  width: 76px !important;
  height: 76px !important;
  min-width: 76px !important;
  min-height: 76px !important;
  border-radius: 999px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background: linear-gradient(180deg,#ffd84d,#f4be00) !important;
  color: #000 !important;
  font-size: 1.8rem !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  box-shadow: 0 0 0 2px rgba(255,204,0,.14),0 0 18px rgba(255,204,0,.14) !important;
}
#busbar-user-profile-sheet .busbar-user-name{
  font-size: 1.2rem !important;
  font-weight: 1000 !important;
  color: #fff !important;
  line-height: 1.04 !important;
}
#busbar-user-profile-sheet .busbar-user-handle{
  margin-top: 4px !important;
  color: #a8abb6 !important;
  font-size: .98rem !important;
}
#busbar-user-profile-sheet .busbar-user-meta{
  margin-top: 10px !important;
  color: #d0d2d8 !important;
  font-size: .96rem !important;
  line-height: 1.3 !important;
}
#busbar-user-profile-sheet .busbar-user-bio{
  margin-top: 10px !important;
  color: #fff !important;
  font-size: 1rem !important;
  line-height: 1.38 !important;
}
#busbar-user-profile-sheet .busbar-user-chip-row{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 12px !important;
}
#busbar-user-profile-sheet .busbar-user-chip{
  display: inline-flex !important;
  align-items: center !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,204,0,.16) !important;
  background: rgba(255,204,0,.06) !important;
  color: #ffcc00 !important;
  font-size: .84rem !important;
  font-weight: 900 !important;
}
#busbar-user-profile-sheet .busbar-user-highlights{
  display: grid !important;
  gap: 12px !important;
  margin-top: 14px !important;
}
#busbar-user-profile-sheet .busbar-user-highlights .p11-work-thumb{
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 100% !important;
  min-height: 96px !important;
  border: none !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  position: relative !important;
  background:
    linear-gradient(135deg, rgba(255,204,0,.18), rgba(255,153,0,.05) 42%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)),
    #211c16 !important;
}
#busbar-user-profile-sheet .busbar-user-highlights .p11-work-thumb::after{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(to top, rgba(0,0,0,.62), rgba(0,0,0,0) 52%) !important;
}
#busbar-user-profile-sheet .busbar-user-highlights .p11-work-thumb .p11-work-thumb-label{
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  bottom: 10px !important;
  z-index: 2 !important;
  padding: 10px 12px !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.54) !important;
  color: #fff !important;
  text-align: center !important;
  font-size: .92rem !important;
  font-weight: 1000 !important;
}

@media (max-width: 430px){
  #busbar-profile-modal .busbar-post-sheet,
  #busbar-user-profile-sheet .busbar-user-profile-panel{
    width: calc(100% - 14px) !important;
    bottom: 120px !important;
    max-height: 72vh !important;
    border-radius: 22px !important;
  }
  #busbar-profile-modal .busbar-post-sheet{
    padding: 14px !important;
  }
  #busbar-user-profile-sheet .busbar-user-hero{
    grid-template-columns: 68px 1fr !important;
    gap: 12px !important;
    padding: 14px !important;
  }
  #busbar-user-profile-sheet .busbar-user-hero .busbar-feed-avatar{
    width: 68px !important;
    height: 68px !important;
    min-width: 68px !important;
    min-height: 68px !important;
    font-size: 1.6rem !important;
  }
}


/* ===== User profile full work viewer ===== */
#busbar-user-profile-sheet .busbar-user-profile-content{
  padding: 16px !important;
  max-height: calc(74vh - 86px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}
#busbar-user-profile-sheet .busbar-user-work-section{
  margin-top: 16px !important;
}
#busbar-user-profile-sheet .busbar-user-work-title{
  font-size: 1rem !important;
  font-weight: 1000 !important;
  color: #fff !important;
}
#busbar-user-profile-sheet .busbar-user-work-sub{
  margin-top: 4px !important;
  color: #a8abb6 !important;
  font-size: .9rem !important;
}
#busbar-user-profile-sheet .busbar-user-work-list{
  display: grid !important;
  gap: 12px !important;
  margin-top: 12px !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-card{
  margin: 0 !important;
  padding: 14px !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: none !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-photo{
  min-height: 180px !important;
  margin-top: 12px !important;
  border-radius: 20px !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-caption{
  display: block !important;
  -webkit-line-clamp: unset !important;
  overflow: visible !important;
}


/* ===== Single post modal ===== */
#busbar-single-post-sheet{
  position:fixed !important;
  inset:0 !important;
  z-index:100100 !important;
  background:rgba(0,0,0,.62) !important;
  display:none !important;
}
#busbar-single-post-sheet.show{
  display:block !important;
}
#busbar-single-post-sheet .busbar-single-post-panel{
  position:absolute !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  bottom:140px !important;
  width:min(760px, calc(100% - 20px)) !important;
  max-height:74vh !important;
  overflow:hidden !important;
  border-radius:26px !important;
  background:linear-gradient(180deg,#17181d 0%, #111216 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 24px 60px rgba(0,0,0,.45) !important;
}
#busbar-single-post-sheet .busbar-single-post-content{
  padding:16px !important;
  max-height:calc(74vh - 86px) !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
#busbar-single-post-sheet .busbar-feed-card{
  margin:0 !important;
}
@media (max-width:430px){
  #busbar-single-post-sheet .busbar-single-post-panel{
    width:calc(100% - 14px) !important;
    bottom:120px !important;
    max-height:72vh !important;
    border-radius:22px !important;
  }
}


/* ===== Final master polish ===== */
#busbar-single-post-sheet .busbar-single-post-wrap{
  padding: 6px 0 2px !important;
}
#busbar-single-post-sheet .busbar-feed-card{
  margin: 0 !important;
  padding: 14px !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: none !important;
}
#busbar-single-post-sheet .busbar-feed-photo{
  min-height: 240px !important;
  border-radius: 20px !important;
  margin-top: 12px !important;
}
#busbar-single-post-sheet .busbar-feed-caption{
  display: block !important;
  -webkit-line-clamp: unset !important;
  overflow: visible !important;
  margin-top: 12px !important;
}
#busbar-single-post-sheet .busbar-feed-stats{
  margin-top: 14px !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-card{
  cursor: pointer !important;
}

/* smoother modal scrolling */
#busbar-profile-modal .busbar-post-sheet,
#busbar-user-profile-sheet .busbar-user-profile-panel,
#busbar-single-post-sheet .busbar-single-post-panel{
  scrollbar-width: thin;
}


/* ===== Preview interaction hard fix ===== */
#busbar-profile-preview-sheet,
#busbar-profile-preview-sheet *{
  pointer-events: auto !important;
}
#busbar-profile-preview-sheet .busbar-comment-panel{
  isolation:isolate !important;
}
#busbar-profile-preview-sheet .busbar-comment-close,
#busbar-profile-preview-sheet .busbar-preview-work-btn{
  position: relative !important;
  z-index: 5 !important;
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
}


/* ===== PREVIEW FLOW HARD FIX ===== */
#busbar-profile-preview-sheet{
  position:fixed !important;
  inset:0 !important;
  z-index:100050 !important;
  background:rgba(0,0,0,.58) !important;
  display:none !important;
  pointer-events:auto !important;
}
#busbar-profile-preview-sheet.show{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  padding:16px 12px calc(env(safe-area-inset-bottom) + 16px) !important;
}
#busbar-profile-preview-sheet .busbar-comment-panel{
  position:relative !important;
  width:min(720px,100%) !important;
  max-height:min(68vh,760px) !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
  border-radius:24px !important;
  background:linear-gradient(180deg,#17181d 0%, #111216 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 24px 60px rgba(0,0,0,.45) !important;
  pointer-events:auto !important;
}
#busbar-profile-preview-sheet .busbar-comment-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:14px 14px 10px !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
}
#busbar-profile-preview-sheet .busbar-comment-title{
  font-weight:1000 !important;
  font-size:1rem !important;
  color:#fff !important;
}
#busbar-profile-preview-sheet .busbar-comment-close{
  width:40px !important;
  height:40px !important;
  border-radius:12px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  background:rgba(255,255,255,.04) !important;
  color:#fff !important;
  font-weight:1000 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
  position:relative !important;
  z-index:10 !important;
}
#busbar-profile-preview-content{
  padding:16px !important;
}
#busbar-profile-preview-content .busbar-user-hero{
  display:grid !important;
  grid-template-columns:72px 1fr !important;
  gap:14px !important;
  align-items:start !important;
  padding:14px !important;
  border-radius:22px !important;
  background:linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
}
#busbar-profile-preview-content .busbar-feed-avatar{
  width:72px !important;
  height:72px !important;
  border-radius:999px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:linear-gradient(180deg,#ffd84d,#f4be00) !important;
  color:#000 !important;
  font-size:1.7rem !important;
  font-weight:1000 !important;
}
#busbar-profile-preview-content .busbar-preview-work-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:12px 18px !important;
  border-radius:18px !important;
  border:none !important;
  background:linear-gradient(180deg,#ffd84d,#f4be00) !important;
  color:#000 !important;
  font-weight:1000 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
  position:relative !important;
  z-index:10 !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
}
@media (max-width:430px){
  #busbar-profile-preview-sheet.show{
    padding:14px 7px calc(env(safe-area-inset-bottom) + 14px) !important;
  }
  #busbar-profile-preview-content .busbar-user-hero{
    grid-template-columns:64px 1fr !important;
    gap:12px !important;
  }
  #busbar-profile-preview-content .busbar-feed-avatar{
    width:64px !important;
    height:64px !important;
    font-size:1.5rem !important;
  }
}


/* ===== richer work view cards ===== */
#busbar-user-profile-sheet .busbar-user-work-list{
  display:grid !important;
  gap:14px !important;
  margin-top:14px !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-card{
  margin:0 !important;
  padding:14px !important;
  border-radius:20px !important;
  background:linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-photo{
  min-height:220px !important;
  margin-top:12px !important;
  border-radius:20px !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-real-img{
  object-fit:cover !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-caption{
  display:block !important;
  -webkit-line-clamp:unset !important;
  overflow:visible !important;
  margin-top:12px !important;
}


/* ===== Embedded image fix + work view polish ===== */
.busbar-feed-real-img{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-photo{
  min-height:220px !important;
  overflow:hidden !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-track,
#busbar-single-post-sheet .busbar-feed-track{
  height:100% !important;
}
#busbar-user-profile-sheet .busbar-user-work-list .busbar-feed-slide,
#busbar-single-post-sheet .busbar-feed-slide{
  min-height:220px !important;
}


/* ===== locked realistic photos ===== */
.busbar-feed-slide-label{display:none !important;}
.busbar-feed-real-img{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center center !important;
}
#busbar-user-profile-sheet .busbar-feed-photo,
#busbar-single-post-sheet .busbar-feed-photo,
#p11 .busbar-feed-photo{
  overflow:hidden !important;
}


/* ===== Shop Talk / Dispatch upgraded ===== */
#p11 .busbar-talk-card,
#p11 .busbar-job-card{
  background:linear-gradient(180deg,#1a1c22 0%,#14161b 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:22px !important;
  padding:16px !important;
  margin:0 0 14px 0 !important;
  box-shadow:0 14px 28px rgba(0,0,0,.18);
}
#p11 .busbar-talk-card.live,
#p11 .busbar-job-card.live{
  animation: busbarLiftIn .24s ease;
}
@keyframes busbarLiftIn{
  from{ opacity:.55; transform:translateY(10px) scale(.985);}
  to{ opacity:1; transform:translateY(0) scale(1);}
}
#p11 .busbar-talk-head,
#p11 .busbar-job-head{
  display:flex; gap:14px; justify-content:space-between; align-items:flex-start;
}
#p11 .busbar-talk-title,
#p11 .busbar-job-title{
  font-size:1.1rem; font-weight:1000; line-height:1.15; color:#fff;
}
#p11 .busbar-talk-desc,
#p11 .busbar-job-desc{
  color:#f0f0f2; line-height:1.38; margin-top:12px; font-size:1rem;
}
#p11 .busbar-job-pay{
  color:var(--gold); font-weight:1000; font-size:1.05rem; white-space:nowrap;
}
#p11 .busbar-reactions{
  display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:14px;
}
#p11 .busbar-react-btn{
  min-height:46px; border-radius:16px; border:1px solid rgba(255,204,0,.16);
  background:rgba(255,255,255,.02); color:#fff; font-weight:900; cursor:pointer;
  transition:transform .12s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
}
#p11 .busbar-react-btn:active{ transform:scale(.98); }
#p11 .busbar-react-btn.primary{
  background:linear-gradient(180deg,#ffd84d,#f4be00); color:#000; border:none;
}
#p11 .busbar-react-btn.active{
  background:rgba(255,204,0,.12); color:var(--gold); border-color:rgba(255,204,0,.34);
  box-shadow:0 8px 18px rgba(255,204,0,.08);
}
#p11 .busbar-talk-topline,
#p11 .busbar-job-topline{
  display:flex; align-items:center; gap:8px; margin-top:10px;
}
#p11 .busbar-live-chip.mini{
  font-size:.78rem; padding:6px 10px; border-radius:999px;
}
#p11 .busbar-meta-count{
  color:var(--subCard); font-size:.88rem; font-weight:700;
}
#p11 .busbar-channel-tile{ position:relative; overflow:hidden; }
#p11 .busbar-channel-tile::after{
  content:""; position:absolute; inset:auto -20% -45% auto; width:140px; height:140px;
  background:radial-gradient(circle, rgba(255,204,0,.12), transparent 70%);
  pointer-events:none;
}
#p11 .busbar-channel-copy{ max-width:18ch; }
#p11 .busbar-channel-tile.active .busbar-channel-title{ color:#fff; }
#p11 .busbar-toast{
  position:fixed; left:50%; transform:translateX(-50%);
  bottom:110px; z-index:10080; background:#111216; color:#fff;
  border:1px solid rgba(255,255,255,.08); border-radius:14px;
  padding:11px 14px; font-weight:800; box-shadow:0 18px 36px rgba(0,0,0,.28);
  opacity:0; pointer-events:none; transition:opacity .18s ease, transform .18s ease;
}
#p11 .busbar-toast.show{ opacity:1; transform:translateX(-50%) translateY(-4px); }

#busbar-thread-sheet .busbar-comment-panel,
#busbar-job-sheet .busbar-comment-panel{
  max-width:700px; width:min(700px, calc(100% - 18px)); bottom:118px;
}
#busbar-thread-sheet .busbar-comment-list,
#busbar-job-sheet .busbar-comment-list{
  max-height:52vh; overflow:auto;
}
#busbar-thread-sheet .busbar-thread-best{
  margin:12px 0; padding:12px; border-radius:16px;
  background:rgba(255,204,0,.07); border:1px solid rgba(255,204,0,.18);
}
#busbar-thread-sheet .busbar-thread-best-title{
  color:var(--gold); font-weight:1000; font-size:.84rem; margin-bottom:6px;
}
#busbar-thread-sheet .busbar-thread-reply{
  padding:12px 0; border-top:1px solid rgba(255,255,255,.06);
}
#busbar-thread-sheet .busbar-thread-reply:first-of-type{ border-top:none; }
#busbar-thread-sheet .busbar-thread-author{
  font-weight:1000; color:#fff; margin-bottom:4px;
}
#busbar-thread-sheet .busbar-thread-copy,
#busbar-job-sheet .busbar-thread-copy{
  color:#f1f1f4; line-height:1.38;
}
#busbar-thread-sheet .busbar-thread-compose{
  padding:12px 0 0;
}
#busbar-thread-sheet .busbar-thread-input{
  width:100%; min-height:92px; border-radius:16px; padding:12px;
  background:#0f1014; color:#fff; border:1px solid rgba(255,255,255,.08);
}
#busbar-job-sheet .busbar-job-detail{
  padding:4px 0 0;
}
#busbar-job-sheet .busbar-job-detail-grid{
  display:grid; gap:10px; margin:12px 0 0;
}
#busbar-job-sheet .busbar-job-detail-row{
  display:flex; justify-content:space-between; gap:12px; align-items:center;
  padding:10px 12px; border-radius:14px; background:rgba(255,255,255,.03);
}


/* ===== Reputation system safe patch ===== */
#p11 .busbar-rep-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin:14px 0 10px;
}
#p11 .busbar-rep-card{
  border-radius:18px;
  padding:12px 10px;
  background:linear-gradient(180deg,#1b1c21 0%,#15161a 100%);
  border:1px solid rgba(255,255,255,.08);
  text-align:center;
}
#p11 .busbar-rep-label{
  font-size:.72rem;
  color:#a8abb6;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#p11 .busbar-rep-value{
  font-size:1.28rem;
  font-weight:1000;
  color:#fff;
  margin-top:6px;
}
#p11 .busbar-rep-sub{
  font-size:.76rem;
  color:#8e92a0;
  margin-top:4px;
}
#p11 .busbar-rep-rank{
  margin-top:12px;
  padding:14px;
  border-radius:18px;
  background:rgba(255,204,0,.08);
  border:1px solid rgba(255,204,0,.16);
}
#p11 .busbar-rep-rank-title{
  font-size:1rem;
  font-weight:1000;
  color:var(--gold);
}
#p11 .busbar-rep-rank-copy{
  font-size:.92rem;
  color:#f2f2f4;
  margin-top:6px;
  line-height:1.35;
}
#p11 .busbar-badge-earned{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:10px;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
}
#p11 .busbar-badge-earned strong{ color:#fff; }
#p11 .busbar-badge-earned span{ color:#aeb2bf; font-size:.88rem; }
#busbar-rep-sheet .busbar-comment-panel{
  max-width:720px;
  width:min(720px, calc(100% - 18px));
  bottom:118px;
}
#busbar-rep-sheet .busbar-comment-list{
  max-height:56vh;
  overflow:auto;
}
#busbar-rep-sheet .busbar-rep-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:12px 0;
  border-top:1px solid rgba(255,255,255,.06);
}
#busbar-rep-sheet .busbar-rep-row:first-child{ border-top:none; }
#busbar-rep-sheet .busbar-rep-row b{ color:#fff; }
#busbar-rep-sheet .busbar-rep-row span{ color:#a9adba; }


/* ===== Fixes: profile close + Shop Talk composer + no photo on Shop Talk ===== */
#busbar-thread-sheet .busbar-thread-compose{
  padding:12px 0 0 !important;
}
#busbar-thread-sheet .busbar-comment-compose-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin-top:12px !important;
}
#busbar-thread-sheet .busbar-comment-cap{
  margin:0 !important;
  flex:1 1 auto !important;
  text-align:right !important;
  color:#9fa4b2 !important;
  font-size:.9rem !important;
}
#busbar-thread-sheet .busbar-comment-send{
  flex:0 0 auto !important;
}
#busbar-thread-sheet .busbar-thread-input{
  box-sizing:border-box !important;
}


/* ===== final cleanup patch ===== */
#busbar-thread-sheet .busbar-comment-compose-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin-top:12px !important;
}
#busbar-thread-sheet .busbar-comment-cap{
  flex:1 1 auto !important;
  text-align:right !important;
  margin:0 !important;
  color:#9fa4b2 !important;
  font-size:.88rem !important;
  line-height:1.1 !important;
}
@media (max-width:430px){
  #busbar-thread-sheet .busbar-comment-cap{
    display:none !important;
  }
}


/* ===== Notifications / Dispatch cleanup ===== */
#p11 .busbar-notif-tabs{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}
#p11 .busbar-notif-tab{
  min-height:44px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  color:#fff;
  font-weight:900;
}
#p11 .busbar-notif-tab.active{
  background:linear-gradient(180deg,#ffd84d,#f4be00);
  color:#000;
  border:none;
}
#p11 .busbar-notification-stack{
  display:grid;
  gap:12px;
}
#p11 .busbar-notification-card{
  border-radius:20px;
  padding:14px;
  background:linear-gradient(180deg,#1a1c22 0%,#14161b 100%);
  border:1px solid rgba(255,255,255,.08);
}
#p11 .busbar-notification-title{
  font-size:1rem;
  font-weight:1000;
  color:#fff;
}
#p11 .busbar-notification-copy{
  margin-top:8px;
  color:#e9eaf0;
  line-height:1.35;
}
#p11 .busbar-notification-meta{
  margin-top:8px;
  color:#9ea3b1;
  font-size:.9rem;
}


/* ===== Dispatch message composer + inbox ===== */
#busbar-message-sheet .busbar-comment-panel{
  width:min(720px, calc(100% - 18px));
  bottom:118px;
}
#busbar-message-sheet .busbar-comment-list{
  max-height:46vh;
  overflow:auto;
}
#busbar-message-sheet .busbar-msg-thread{
  display:grid;
  gap:10px;
}
#busbar-message-sheet .busbar-msg-bubble{
  max-width:84%;
  padding:12px 14px;
  border-radius:18px;
  line-height:1.35;
  font-size:.98rem;
}
#busbar-message-sheet .busbar-msg-bubble.out{
  margin-left:auto;
  background:linear-gradient(180deg,#ffd84d,#f4be00);
  color:#000;
}
#busbar-message-sheet .busbar-msg-bubble.in{
  background:rgba(255,255,255,.05);
  color:#fff;
  border:1px solid rgba(255,255,255,.08);
}
#busbar-message-sheet .busbar-msg-meta{
  font-size:.78rem;
  color:#9ea3b1;
  margin-top:4px;
}
#busbar-message-sheet .busbar-thread-input{
  min-height:92px;
}


/* ===== Notifications separation + Dispatch composer cleanup ===== */
#p11 .busbar-notif-tabs.busbar-notif-tabs-5{
  grid-template-columns:repeat(5, minmax(0,1fr)) !important;
}
#p11 .busbar-notif-tabs.busbar-notif-tabs-5 .busbar-notif-tab{
  min-height:40px !important;
  font-size:.82rem !important;
  padding:0 8px !important;
}
@media (max-width:430px){
  #p11 .busbar-notif-tabs.busbar-notif-tabs-5{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}


/* ===== Sparky DM system ===== */
#busbar-dm-sheet .busbar-comment-panel{
  width:min(720px, calc(100% - 18px));
  bottom:118px;
}
#busbar-dm-sheet .busbar-comment-list{
  max-height:46vh;
  overflow:auto;
}
#busbar-dm-sheet .busbar-dm-head{
  display:flex;
  align-items:center;
  gap:12px;
}
#busbar-dm-sheet .busbar-dm-avatar{
  width:50px;
  height:50px;
  border-radius:50%;
  background:linear-gradient(180deg,#ffd84d,#f4be00);
  color:#000;
  font-weight:1000;
  display:grid;
  place-items:center;
  flex:0 0 50px;
}
#busbar-dm-sheet .busbar-dm-name{
  font-size:1rem;
  font-weight:1000;
  color:#fff;
}
#busbar-dm-sheet .busbar-dm-handle{
  color:#9ea3b1;
  font-size:.9rem;
  margin-top:2px;
}
#busbar-dm-sheet .busbar-msg-thread{
  display:grid;
  gap:10px;
}
#busbar-dm-sheet .busbar-msg-bubble{
  max-width:84%;
  padding:12px 14px;
  border-radius:18px;
  line-height:1.35;
  font-size:.98rem;
}
#busbar-dm-sheet .busbar-msg-bubble.out{
  margin-left:auto;
  background:linear-gradient(180deg,#ffd84d,#f4be00);
  color:#000;
}
#busbar-dm-sheet .busbar-msg-bubble.in{
  background:rgba(255,255,255,.05);
  color:#fff;
  border:1px solid rgba(255,255,255,.08);
}
#busbar-dm-sheet .busbar-msg-meta{
  font-size:.78rem;
  color:#9ea3b1;
  margin-top:4px;
}


/* ===== DM tab patch ===== */
#p11 .busbar-notif-tabs.busbar-notif-tabs-6{
  grid-template-columns:repeat(3, minmax(0,1fr)) !important;
}
@media (max-width:430px){
  #p11 .busbar-notif-tabs.busbar-notif-tabs-6{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}


/* ===== DM inbox list flow ===== */
#p11 .busbar-dm-inbox-card{
  border-radius:20px;
  padding:14px;
  background:linear-gradient(180deg,#1a1c22 0%,#14161b 100%);
  border:1px solid rgba(255,255,255,.08);
  display:flex;
  align-items:center;
  gap:12px;
  cursor:pointer;
}
#p11 .busbar-dm-inbox-avatar{
  width:48px;
  height:48px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(180deg,#ffd84d,#f4be00);
  color:#000;
  font-weight:1000;
  flex:0 0 48px;
}
#p11 .busbar-dm-inbox-name{
  color:#fff;
  font-weight:1000;
  font-size:1rem;
}
#p11 .busbar-dm-inbox-preview{
  color:#d8dbe3;
  font-size:.92rem;
  margin-top:4px;
  line-height:1.3;
}
#p11 .busbar-dm-inbox-meta{
  margin-left:auto;
  color:#9ea3b1;
  font-size:.84rem;
  white-space:nowrap;
}


/* ===== Premium DM sheet ===== */
#busbar-dm-sheet{
  position:fixed;
  inset:0;
  background:rgba(4,6,10,.52);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  z-index:10060;
  display:none;
}
#busbar-dm-sheet.show{
  display:block;
}
#busbar-dm-sheet .busbar-comment-panel{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  width:min(780px, 100%);
  max-width:100%;
  height:85vh;
  max-height:92vh;
  margin:0 auto;
  border-top-left-radius:28px;
  border-top-right-radius:28px;
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  background:linear-gradient(180deg,#11141b 0%,#0b0e14 100%);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 -28px 60px rgba(0,0,0,.42);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  animation:busbarDmRise .24s ease;
}
@keyframes busbarDmRise{
  from{ transform:translateY(28px); opacity:.65; }
  to{ transform:translateY(0); opacity:1; }
}
#busbar-dm-sheet .busbar-comment-head{
  padding:16px 18px 14px;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));
}
#busbar-dm-sheet .busbar-comment-list{
  flex:1 1 auto;
  max-height:none;
  overflow-y:auto;
  padding:14px 14px 2px;
  scroll-behavior:smooth;
}
#busbar-dm-sheet .busbar-dm-head{
  display:flex;
  align-items:center;
  gap:12px;
}
#busbar-dm-sheet .busbar-dm-avatar{
  width:48px;
  height:48px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(180deg,#ffd84d,#f4be00);
  color:#000;
  font-weight:1000;
  font-size:1.2rem;
  box-shadow:0 0 22px rgba(255,204,0,.18);
}
#busbar-dm-sheet .busbar-dm-name{
  font-size:1rem;
  font-weight:1000;
  color:#fff;
}
#busbar-dm-sheet .busbar-dm-handle{
  color:#8f95a6;
  font-size:.9rem;
  margin-top:2px;
}
#busbar-dm-sheet .busbar-dm-status{
  color:#9da3b3;
  font-size:.82rem;
  margin-top:4px;
}
#busbar-dm-sheet .busbar-msg-thread{
  display:grid;
  gap:10px;
}
#busbar-dm-sheet .busbar-msg-row{
  display:flex;
}
#busbar-dm-sheet .busbar-msg-row.out{ justify-content:flex-end; }
#busbar-dm-sheet .busbar-msg-row.in{ justify-content:flex-start; }
#busbar-dm-sheet .busbar-msg-bubble{
  max-width:84%;
  padding:12px 14px 10px;
  border-radius:22px;
  line-height:1.34;
  font-size:1rem;
  word-wrap:break-word;
}
#busbar-dm-sheet .busbar-msg-bubble.out{
  background:linear-gradient(180deg,#ffd84d,#f4be00);
  color:#000;
  border-bottom-right-radius:8px;
  box-shadow:0 10px 22px rgba(255,204,0,.16);
}
#busbar-dm-sheet .busbar-msg-bubble.in{
  background:rgba(255,255,255,.05);
  color:#fff;
  border:1px solid rgba(255,255,255,.08);
  border-bottom-left-radius:8px;
}
#busbar-dm-sheet .busbar-msg-meta{
  font-size:.76rem;
  color:#9ea3b1;
  margin-top:6px;
  opacity:.95;
}
#busbar-dm-sheet .busbar-thread-compose{
  flex:0 0 auto;
  padding:12px 14px calc(14px + env(safe-area-inset-bottom));
  border-top:1px solid rgba(255,255,255,.07);
  background:linear-gradient(180deg,rgba(17,20,27,.88),rgba(10,12,18,.98));
}
#busbar-dm-sheet .busbar-thread-input{
  width:100%;
  min-height:84px;
  max-height:120px;
  border-radius:20px;
  padding:14px 16px;
  background:#161921;
  color:#fff;
  border:1px solid rgba(255,255,255,.08);
  box-sizing:border-box;
}
#busbar-dm-sheet .busbar-comment-compose-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin-top:10px !important;
}
#busbar-dm-sheet .busbar-comment-cap{
  color:#9fa4b2 !important;
  font-size:.86rem !important;
  margin:0 !important;
  text-align:right;
  flex:1 1 auto;
}
#busbar-dm-sheet .busbar-comment-send{
  min-width:126px;
  border-radius:18px;
  min-height:54px;
  font-size:1rem;
  font-weight:1000;
}
#busbar-dm-sheet .busbar-dm-typing{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 2px 2px;
  color:#a2a7b6;
  font-size:.82rem;
}
#busbar-dm-sheet .busbar-dm-dots{
  display:inline-flex;
  gap:4px;
}
#busbar-dm-sheet .busbar-dm-dots span{
  width:6px; height:6px; border-radius:50%;
  background:#a2a7b6;
  animation:busbarTyping 1s infinite ease-in-out;
}
#busbar-dm-sheet .busbar-dm-dots span:nth-child(2){ animation-delay:.12s; }
#busbar-dm-sheet .busbar-dm-dots span:nth-child(3){ animation-delay:.24s; }
@keyframes busbarTyping{
  0%,80%,100%{ transform:translateY(0); opacity:.35; }
  40%{ transform:translateY(-3px); opacity:1; }
}
@media (max-width:430px){
  #busbar-dm-sheet .busbar-comment-cap{ display:none !important; }
  #busbar-dm-sheet .busbar-comment-panel{ height:88vh; }
}


/* ===== hard override DM full-screen fix ===== */
#busbar-dm-sheet{
  position:fixed !important;
  inset:0 !important;
  background:rgba(4,6,10,.62) !important;
  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;
  z-index:10090 !important;
  display:none !important;
}
#busbar-dm-sheet.show{
  display:block !important;
}
#busbar-dm-sheet .busbar-comment-panel{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  top:auto !important;
  width:min(860px, 100%) !important;
  max-width:100% !important;
  height:88vh !important;
  max-height:94vh !important;
  min-height:88vh !important;
  margin:0 auto !important;
  border-top-left-radius:28px !important;
  border-top-right-radius:28px !important;
  border-bottom-left-radius:0 !important;
  border-bottom-right-radius:0 !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}
#busbar-dm-sheet .busbar-comment-list{
  flex:1 1 auto !important;
  max-height:none !important;
  min-height:0 !important;
  overflow-y:auto !important;
  padding:16px 16px 6px !important;
}
#busbar-dm-sheet .busbar-thread-compose{
  flex:0 0 auto !important;
  margin-top:auto !important;
  padding:12px 14px calc(16px + env(safe-area-inset-bottom)) !important;
}
#busbar-dm-sheet .busbar-thread-input{
  min-height:86px !important;
}
@media (max-width:430px){
  #busbar-dm-sheet .busbar-comment-panel{
    height:90vh !important;
    min-height:90vh !important;
    max-height:96vh !important;
  }
}

/* =================================================
   CONSOLIDATED PATCH CSS
   ================================================= */
/* injected dock v2 */
:root {
  --dock-bg: rgba(20, 28, 40, 0.85);
  --dock-border: rgba(255,255,255,0.08);
  --dock-text: rgba(255,255,255,0.7);
  --dock-active: #4da3ff;
}
.light-mode {
  --dock-bg: rgba(255,255,255,0.9);
  --dock-border: rgba(0,0,0,0.08);
  --dock-text: rgba(0,0,0,0.6);
  --dock-active: #007aff;
}
.bottom-dock {
  position: fixed;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  width: 92%;
  max-width: 500px;
  height: 64px;
  background: var(--dock-bg);
  backdrop-filter: blur(20px);
  border-radius: 22px;
  border: 1px solid var(--dock-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 18px;
  z-index: 9999;
}
.dock-item {
  flex:1;
  text-align:center;
  font-size:11px;
  color:var(--dock-text);
}
.dock-item.active { color: var(--dock-active);}
.dock-icon { display:block; font-size:20px; margin-bottom:2px;}
.create-btn {
  position:absolute;
  top:-26px;
  left:50%;
  transform:translateX(-50%);
  width:60px;
  height:60px;
  border-radius:50%;
  background:linear-gradient(180deg,#5eaaff,#2f6bff);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  color:white;
  box-shadow:0 10px 25px rgba(0,0,0,0.4), inset 0 2px 4px rgba(255,255,255,0.25);
}
.create-cradle {
  position:absolute;
  top:-10px;
  left:50%;
  transform:translateX(-50%);
  width:80px;
  height:30px;
  border-radius:50%;
  background:rgba(255,255,255,0.06);
  filter:blur(10px);
}

/* ===== FIX: composer always visible above keyboard ===== */
.busbar-comment-panel{
  display:flex !important;
  flex-direction:column !important;
}

.busbar-comment-list{
  flex:1 !important;
  overflow:auto !important;
}

.busbar-comment-compose{
  position:sticky !important;
  bottom:0 !important;
  background:rgba(10,10,12,.98) !important;
  padding-bottom:env(safe-area-inset-bottom) !important;
}

/* stronger button */
.busbar-comment-send{
  width:120px !important;
  font-size:0.95rem !important;
}

#busbar-profile-preview-sheet{
  position:fixed !important; inset:0 !important; z-index:100050 !important;
  background:rgba(0,0,0,.58) !important; display:none !important;
}
#busbar-profile-preview-sheet.show{ display:block !important; }
#busbar-profile-preview-sheet .busbar-comment-panel{
  position:absolute !important; left:50% !important; transform:translateX(-50%) !important;
  bottom:120px !important; width:min(720px, calc(100% - 20px)) !important; max-height:68vh !important;
  overflow-y:auto !important; -webkit-overflow-scrolling:touch !important;
  border-radius:24px !important; background:linear-gradient(180deg,#17181d 0%, #111216 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important; box-shadow:0 24px 60px rgba(0,0,0,.45) !important;
}
#busbar-profile-preview-content{ padding:16px !important; }
#busbar-profile-preview-content .busbar-user-hero{
  display:grid !important; grid-template-columns:72px 1fr !important; gap:14px !important; align-items:start !important;
  padding:14px !important; border-radius:22px !important; background:linear-gradient(180deg,#1a1c22 0%, #14161b 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
}
#busbar-profile-preview-content .busbar-feed-avatar{
  width:72px !important;height:72px !important;border-radius:999px !important;display:flex !important;
  align-items:center !important;justify-content:center !important;background:linear-gradient(180deg,#ffd84d,#f4be00) !important;
  color:#000 !important;font-size:1.7rem !important;font-weight:1000 !important;
}
#busbar-profile-preview-content .busbar-preview-work-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  padding:12px 18px !important;border-radius:18px !important;border:none !important;
  background:linear-gradient(180deg,#ffd84d,#f4be00) !important;color:#000 !important;font-weight:1000 !important;cursor:pointer !important;
}
/* ===== Next-level DM upgrades ===== */
#busbar-dm-sheet .busbar-msg-bubble{
  position:relative;
  transition:transform .14s ease, box-shadow .14s ease;
  user-select:none;
}
#busbar-dm-sheet .busbar-msg-bubble:active{
  transform:scale(.985);
}
#busbar-dm-sheet .busbar-msg-bubble.amped{
  box-shadow:0 0 0 1px rgba(255,204,0,.25), 0 12px 28px rgba(255,204,0,.14);
}
#busbar-dm-sheet .busbar-msg-amp{
  position:absolute;
  right:10px;
  bottom:-12px;
  min-width:28px;
  height:28px;
  border-radius:999px;
  padding:0 8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  background:linear-gradient(180deg,#1a1c22 0%,#101217 100%);
  border:1px solid rgba(255,255,255,.08);
  color:#ffd84d;
  font-size:.78rem;
  font-weight:900;
}
#busbar-dm-sheet .busbar-msg-row.out .busbar-msg-amp{
  right:auto;
  left:10px;
}
#busbar-dm-sheet .busbar-dm-toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
}
#busbar-dm-sheet .busbar-dm-mini-btn{
  width:42px;
  height:42px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:18px;
  font-weight:900;
}
#busbar-dm-sheet .busbar-dm-send{
  width:52px !important;
  height:52px !important;
  border-radius:50% !important;
  border:none !important;
  background:linear-gradient(180deg,#ffd84d,#f4be00) !important;
  color:#000 !important;
  font-size:20px !important;
  font-weight:1000 !important;
  display:grid !important;
  place-items:center !important;
  box-shadow:0 12px 24px rgba(255,204,0,.18);
}
#busbar-dm-sheet .busbar-dm-composer{
  display:flex;
  align-items:center;
  gap:10px;
}
#busbar-dm-sheet .busbar-dm-input{
  flex:1 1 auto;
  min-width:0;
  padding:14px 16px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
  outline:none;
  background:rgba(255,255,255,.06);
  color:#fff;
  font-size:1rem;
}
#busbar-dm-sheet .busbar-dm-replybar{
  display:none;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
  padding:10px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.06);
}
#busbar-dm-sheet .busbar-dm-replybar.show{
  display:flex;
}
#busbar-dm-sheet .busbar-dm-replycopy{
  color:#dfe2ea;
  font-size:.9rem;
  line-height:1.2;
}
#busbar-dm-sheet .busbar-dm-replylabel{
  color:#ffd84d;
  font-size:.78rem;
  font-weight:900;
  display:block;
  margin-bottom:4px;
}
#busbar-dm-sheet .busbar-dm-close-reply{
  border:none;
  background:none;
  color:#aeb3bf;
  font-size:18px;
}
#busbar-dm-sheet .busbar-dm-voicepill{
  display:none;
  align-items:center;
  gap:8px;
  margin-top:10px;
  padding:10px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.06);
  color:#fff;
}
#busbar-dm-sheet .busbar-dm-voicepill.show{
  display:flex;
}
#busbar-dm-sheet .busbar-dm-wave{
  display:inline-flex;
  gap:3px;
  align-items:flex-end;
  height:18px;
}
#busbar-dm-sheet .busbar-dm-wave span{
  width:3px;
  border-radius:999px;
  background:#ffd84d;
  animation:ampstackWave 1s infinite ease-in-out;
}
#busbar-dm-sheet .busbar-dm-wave span:nth-child(1){height:7px}
#busbar-dm-sheet .busbar-dm-wave span:nth-child(2){height:12px;animation-delay:.08s}
#busbar-dm-sheet .busbar-dm-wave span:nth-child(3){height:16px;animation-delay:.16s}
#busbar-dm-sheet .busbar-dm-wave span:nth-child(4){height:10px;animation-delay:.24s}
@keyframes ampstackWave{
  0%,100%{opacity:.45;transform:scaleY(.85)}
  50%{opacity:1;transform:scaleY(1.15)}
}
  /* Hide any accidental duplicate DM composers outside the real DM sheet */
  #busbar-thread-sheet .dm-hardfix,
  #busbar-thread-sheet #busbar-dm-send-btn,
  #busbar-thread-sheet #busbar-dm-send-btn-hardfix,
  #busbar-thread-sheet #busbar-dm-input,
  #busbar-thread-sheet #busbar-dm-input-hardfix{
    display:none !important;
  }

  /* Force one clean composer in the DM sheet */
  #busbar-dm-sheet .ampstack-dm-clean-composer{
    padding:12px 14px 18px !important;
    border-top:1px solid rgba(255,255,255,.08) !important;
    background:linear-gradient(180deg,rgba(17,20,27,.96),rgba(10,12,18,.99)) !important;
    margin-top:auto !important;
  }
  #busbar-dm-sheet .ampstack-dm-clean-row{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
  }
  #busbar-dm-sheet #ampstack-dm-clean-input{
    flex:1 !important;
    min-width:0 !important;
    height:54px !important;
    padding:0 16px !important;
    border-radius:27px !important;
    border:1px solid rgba(255,255,255,.10) !important;
    outline:none !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    font-size:18px !important;
  }
  #busbar-dm-sheet #ampstack-dm-clean-send{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    border-radius:50% !important;
    border:none !important;
    background:linear-gradient(180deg,#ffd84d,#f4be00) !important;
    color:#000 !important;
    font-size:24px !important;
    font-weight:1000 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-shadow:0 10px 24px rgba(255,204,0,.22) !important;
  }
  /* Make avatar buttons definitely clickable */
  .busbar-feed-avatar-btn{
    pointer-events:auto !important;
    cursor:pointer !important;
    position:relative !important;
    z-index:6 !important;
  }

  /* Hide every legacy DM composer/button inside DM sheet except the final one */
  #busbar-dm-sheet .busbar-thread-compose:not(.ampstack-final-dm-composer){
    display:none !important;
  }
  #busbar-dm-sheet #busbar-dm-send-btn,
  #busbar-dm-sheet #busbar-dm-send-btn-hardfix,
  #busbar-dm-sheet #busbar-dm-input,
  #busbar-dm-sheet #busbar-dm-input-hardfix{
    display:none !important;
  }

  #busbar-dm-sheet .ampstack-final-dm-composer{
    display:block !important;
    padding:12px 14px 18px !important;
    border-top:1px solid rgba(255,255,255,.08) !important;
    background:linear-gradient(180deg,rgba(17,20,27,.96),rgba(10,12,18,.99)) !important;
    margin-top:auto !important;
  }
  #busbar-dm-sheet .ampstack-final-dm-row{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
  }
  #busbar-dm-sheet #ampstack-final-dm-input{
    flex:1 !important;
    min-width:0 !important;
    height:54px !important;
    padding:0 16px !important;
    border-radius:27px !important;
    border:1px solid rgba(255,255,255,.10) !important;
    outline:none !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    font-size:18px !important;
  }
  #busbar-dm-sheet #ampstack-final-dm-send{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    border-radius:50% !important;
    border:none !important;
    background:linear-gradient(180deg,#ffd84d,#f4be00) !important;
    color:#000 !important;
    font-size:24px !important;
    font-weight:1000 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-shadow:0 10px 24px rgba(255,204,0,.22) !important;
    cursor:pointer !important;
  }

/* P1 Exam Trainer — light mode fixes */
html[data-theme="light"] #p1 button.dark-btn {
  background: var(--card2) !important;
  color: var(--text) !important;
  border: 1px solid var(--stroke2) !important;
}
html[data-theme="light"] #p1 .main-btn {
  background: linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  color: #000 !important;
}
/* P1 nav buttons (Prev/Hint/Skip) in light mode */
html[data-theme="light"] #p1-screen-exam .dark-btn {
  background: var(--card2) !important;
  color: var(--text) !important;
}


/* ===== HEADER FIX ===== */
.header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.header-title{
  flex:1;
  text-align:center;
  font-weight:900;
  color:#ffcc00;
  text-shadow:0 0 18px rgba(255,204,0,0.18);
}

.header-left{
  width:110px;
}

.header-right{
  width:110px;
}


/* ═══════════════════════════════════════════
   P11 BUSBAR — FINAL POLISH PASS (high specificity)
   Polishes: Bottom Nav, Feed Posts, Profile, Notifications
   ═══════════════════════════════════════════ */

/* ─── BOTTOM NAV / DOCK POLISH ─── */
#p11 .busbar-bottom-nav.busbar-dock{
  position:fixed !important;
  left:50% !important;
  bottom:14px !important;
  transform:translateX(-50%) !important;
  width:calc(100% - 24px) !important;
  max-width:480px !important;
  display:grid !important;
  grid-template-columns:1fr 1fr 80px 1fr 1fr !important;
  align-items:center !important;
  gap:0 !important;
  padding:8px 12px !important;
  background:rgba(20,20,20,.92) !important;
  backdrop-filter:blur(20px) saturate(1.4) !important;
  -webkit-backdrop-filter:blur(20px) saturate(1.4) !important;
  border:1px solid rgba(255,204,0,.18) !important;
  border-radius:22px !important;
  box-shadow:0 14px 40px rgba(0,0,0,.5), 0 0 0 1px rgba(0,0,0,.2) !important;
  z-index:8000 !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock{
  background:rgba(255,255,255,.92) !important;
  border-color:rgba(170,182,196,.55) !important;
  box-shadow:0 14px 40px rgba(15,23,42,.10), 0 0 0 1px rgba(0,0,0,.04) !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  color:#64748b !important;
}
html[data-theme="light"] #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn.active{
  color:#0f172a !important;
}
#p11 .busbar-nav-btn{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:3px !important;
  padding:6px 4px !important;
  background:transparent !important;
  border:none !important;
  color:#888 !important;
  font-size:.62rem !important;
  font-weight:1000 !important;
  letter-spacing:.3px !important;
  text-transform:uppercase !important;
  cursor:pointer !important;
  transition:color .15s !important;
  min-height:48px !important;
}
#p11 .busbar-nav-btn .busbar-dock-icon{
  font-size:18px !important;
  line-height:1 !important;
  margin:0 !important;
}
#p11 .busbar-nav-btn .busbar-dock-label{
  font-size:.6rem !important;
  font-weight:1000 !important;
  letter-spacing:.5px !important;
}
#p11 .busbar-nav-btn.active{
  color:var(--gold) !important;
}
#p11 .busbar-nav-btn.active .busbar-dock-icon{
  filter:drop-shadow(0 0 6px rgba(255,204,0,.5));
}
#p11 .busbar-nav-btn:active{
  transform:scale(.92);
}
#p11 .busbar-dock-create{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:3px !important;
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  cursor:pointer !important;
  color:#000 !important;
}
#p11 .busbar-dock-create .busbar-dock-create-circle{
  width:48px !important;
  height:48px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:24px !important;
  font-weight:300 !important;
  color:#000 !important;
  box-shadow:0 6px 18px rgba(255,204,0,.4) !important;
  transition:transform .14s, box-shadow .14s !important;
  margin-top:-18px !important;
}
#p11 .busbar-dock-create:active .busbar-dock-create-circle{
  transform:scale(.92);
  box-shadow:0 3px 10px rgba(255,204,0,.45) !important;
}
#p11 .busbar-dock-create .busbar-dock-label{
  font-size:.58rem !important;
  font-weight:1000 !important;
  color:#888 !important;
  letter-spacing:.5px !important;
  text-transform:uppercase !important;
  margin-top:-2px !important;
}
#p11 .busbar-dock-badge{
  position:absolute !important;
  top:2px !important;
  right:6px !important;
  min-width:16px !important;
  height:16px !important;
  padding:0 4px !important;
  background:#ff4444 !important;
  color:#fff !important;
  font-size:.55rem !important;
  font-weight:1000 !important;
  border-radius:999px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1.5px solid var(--bg) !important;
}

/* ─── PROFILE PAGE POLISH ─── */
#p11 .p11-profile-hero{
  background:linear-gradient(155deg, rgba(255,204,0,.06), rgba(255,153,0,.02) 50%, transparent) !important;
  border:1px solid rgba(255,204,0,.18) !important;
  border-radius:20px !important;
  padding:22px 18px 18px !important;
  margin-bottom:14px !important;
  position:relative !important;
  overflow:hidden !important;
}
#p11 .p11-profile-hero::before{
  content:'';
  position:absolute;
  top:-40px; right:-40px;
  width:140px; height:140px;
  background:radial-gradient(circle, rgba(255,204,0,.15), transparent 70%);
  pointer-events:none;
}
#p11 .p11-profile-main-upgraded{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  margin-bottom:16px !important;
}
#p11 .p11-profile-avatar.p11-profile-avatar-glow{
  width:64px !important;
  height:64px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:1.3rem !important;
  font-weight:1000 !important;
  color:#000 !important;
  flex-shrink:0 !important;
  box-shadow:0 8px 24px rgba(255,204,0,.35), 0 0 0 3px rgba(255,204,0,.15) !important;
  letter-spacing:-.5px !important;
}
#p11 .p11-profile-copy{
  flex:1 !important;
  min-width:0 !important;
}
#p11 .p11-profile-name-row{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  margin-bottom:2px !important;
}
#p11 .p11-profile-name{
  font-size:1.1rem !important;
  font-weight:1000 !important;
  color:var(--text) !important;
  letter-spacing:-.3px !important;
  line-height:1.2 !important;
}
#p11 .p11-profile-verified{
  font-size:.6rem !important;
  font-weight:1000 !important;
  letter-spacing:.5px !important;
  text-transform:uppercase !important;
  color:var(--gold) !important;
  background:rgba(255,204,0,.1) !important;
  border:1px solid rgba(255,204,0,.25) !important;
  padding:2px 7px !important;
  border-radius:999px !important;
}
#p11 .p11-profile-handle{
  font-size:.78rem !important;
  font-weight:700 !important;
  color:var(--gold) !important;
  margin-bottom:5px !important;
}
#p11 .p11-profile-rank{
  font-size:.7rem !important;
  font-weight:1000 !important;
  letter-spacing:.5px !important;
  text-transform:uppercase !important;
  color:var(--subCard) !important;
  margin-bottom:4px !important;
}
#p11 .p11-profile-meta{
  font-size:.74rem !important;
  font-weight:600 !important;
  color:var(--sub) !important;
  margin-bottom:6px !important;
}
#p11 .p11-profile-bio{
  font-size:.82rem !important;
  font-weight:500 !important;
  color:var(--subCard) !important;
  line-height:1.5 !important;
  margin-top:8px !important;
}
#p11 .p11-profile-chip-scroll{
  display:flex !important;
  gap:6px !important;
  overflow-x:auto !important;
  margin:14px 0 16px !important;
  padding-bottom:4px !important;
  scrollbar-width:none !important;
}
#p11 .p11-profile-chip-scroll::-webkit-scrollbar{ display:none !important; }
#p11 .p11-profile-chip{
  flex-shrink:0 !important;
  padding:6px 12px !important;
  background:var(--card2) !important;
  border:1px solid var(--stroke2) !important;
  color:var(--text) !important;
  font-size:.7rem !important;
  font-weight:1000 !important;
  border-radius:999px !important;
  white-space:nowrap !important;
}
#p11 .p11-profile-chip:not(.locked){
  border-color:rgba(255,204,0,.3) !important;
  color:var(--gold) !important;
  background:rgba(255,204,0,.06) !important;
}
#p11 .p11-profile-chip.locked{
  opacity:.5 !important;
  color:var(--sub) !important;
}
#p11 .p11-profile-stat-grid.p11-profile-stat-grid-upgraded{
  display:grid !important;
  grid-template-columns:1fr 1fr 1fr !important;
  gap:8px !important;
  margin-bottom:14px !important;
}
#p11 .p11-profile-stat-grid-upgraded .p11-profile-stat{
  background:var(--card2) !important;
  border:1px solid var(--stroke) !important;
  border-radius:14px !important;
  padding:12px 8px !important;
  text-align:center !important;
}
#p11 .p11-profile-stat-grid-upgraded .p11-profile-stat span{
  display:block !important;
  font-size:.6rem !important;
  font-weight:1000 !important;
  letter-spacing:.8px !important;
  text-transform:uppercase !important;
  color:var(--sub) !important;
  margin-bottom:4px !important;
}
#p11 .p11-profile-stat-grid-upgraded .p11-profile-stat b{
  display:block !important;
  font-size:1.4rem !important;
  font-weight:1000 !important;
  color:var(--gold) !important;
  line-height:1 !important;
  font-variant-numeric:tabular-nums !important;
  margin-bottom:3px !important;
}
#p11 .p11-profile-stat-grid-upgraded .p11-profile-stat small{
  display:block !important;
  font-size:.58rem !important;
  font-weight:700 !important;
  color:var(--sub) !important;
}
#p11 .p11-profile-actions.p11-profile-actions-upgraded{
  display:grid !important;
  grid-template-columns:2fr 1fr !important;
  gap:8px !important;
}
#p11 .p11-profile-primary-btn{
  padding:13px !important;
  background:linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  border:none !important;
  border-radius:12px !important;
  color:#000 !important;
  font-size:.85rem !important;
  font-weight:1000 !important;
  letter-spacing:.3px !important;
  cursor:pointer !important;
  box-shadow:0 6px 16px rgba(255,204,0,.25) !important;
}
#p11 .p11-profile-secondary-btn{
  padding:13px !important;
  background:transparent !important;
  border:1.5px solid var(--stroke2) !important;
  border-radius:12px !important;
  color:var(--subCard) !important;
  font-size:.85rem !important;
  font-weight:1000 !important;
  cursor:pointer !important;
}
#p11 .p11-profile-secondary-btn:hover{
  border-color:var(--gold) !important;
  color:var(--gold) !important;
}

/* Profile Cards */
#p11 .p11-profile-card{
  background:var(--card) !important;
  border:1px solid var(--stroke) !important;
  border-radius:16px !important;
  padding:16px !important;
  margin-bottom:12px !important;
}
#p11 .p11-profile-card .busbar-section-title{
  font-size:.72rem !important;
  font-weight:1000 !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  color:var(--gold) !important;
  margin-bottom:6px !important;
}
#p11 .p11-profile-card .busbar-muted{
  font-size:.78rem !important;
  color:var(--sub) !important;
  font-weight:500 !important;
  line-height:1.4 !important;
}
#p11 .p11-profile-workstrip{
  margin-top:14px !important;
  padding:14px !important;
  background:var(--card2) !important;
}
#p11 .p11-workstrip-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
  margin-top:12px !important;
}
#p11 .p11-work-thumb{
  aspect-ratio:1.4 !important;
  background:linear-gradient(135deg, rgba(255,204,0,.1), rgba(255,153,0,.04)) !important;
  border:1px solid rgba(255,204,0,.2) !important;
  border-radius:12px !important;
  position:relative !important;
  cursor:pointer !important;
  overflow:hidden !important;
  transition:transform .12s, border-color .12s !important;
}
#p11 .p11-work-thumb:active{
  transform:scale(.97) !important;
  border-color:var(--gold) !important;
}
#p11 .p11-work-thumb.alt{
  background:linear-gradient(135deg, rgba(46,204,113,.1), rgba(46,204,113,.02)) !important;
  border-color:rgba(46,204,113,.2) !important;
}
#p11 .p11-work-thumb-label{
  position:absolute !important;
  bottom:8px !important;
  left:10px !important;
  font-size:.7rem !important;
  font-weight:1000 !important;
  letter-spacing:.3px !important;
  color:var(--text) !important;
}

/* Settings rows */
#p11 .p11-setting-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:14px 0 !important;
  border-bottom:1px solid var(--stroke2) !important;
}
#p11 .p11-setting-row.no-border{ border-bottom:none !important; }
#p11 .p11-setting-title{
  font-size:.85rem !important;
  font-weight:1000 !important;
  color:var(--text) !important;
  margin-bottom:2px !important;
}
#p11 .p11-setting-sub{
  font-size:.7rem !important;
  color:var(--sub) !important;
  font-weight:500 !important;
}
#p11 .p11-handle-pill{
  background:rgba(255,204,0,.08) !important;
  border:1px solid rgba(255,204,0,.25) !important;
  color:var(--gold) !important;
  font-size:.78rem !important;
  font-weight:1000 !important;
  padding:5px 12px !important;
  border-radius:999px !important;
}
#p11 .p11-coming-soon{
  background:var(--card2) !important;
  border:1px solid var(--stroke2) !important;
  color:var(--sub) !important;
  font-size:.65rem !important;
  font-weight:1000 !important;
  letter-spacing:.5px !important;
  text-transform:uppercase !important;
  padding:4px 9px !important;
  border-radius:6px !important;
}

/* ─── FEED POSTS POLISH ─── */
#p11 #busbar-feed-list{
  padding-bottom:0 !important;
}
#p11 #busbar-feed-list .busbar-post,
#p11 #busbar-feed-list > .card{
  background:var(--card) !important;
  border:1px solid var(--stroke) !important;
  border-radius:18px !important;
  padding:14px !important;
  margin-bottom:12px !important;
  box-shadow:0 6px 16px rgba(0,0,0,.18) !important;
  transition:border-color .15s !important;
}
#p11 #busbar-feed-list .busbar-post:hover{
  border-color:rgba(255,204,0,.2) !important;
}

/* ─── NOTIFICATIONS POLISH ─── */
#p11 #busbar-tab-notifications .card{
  background:var(--card) !important;
  border:1px solid var(--stroke) !important;
  border-radius:16px !important;
  padding:16px !important;
  margin-bottom:12px !important;
}
#p11 .busbar-live-chip{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  padding:5px 12px !important;
  background:rgba(46,204,113,.12) !important;
  border:1px solid rgba(46,204,113,.3) !important;
  border-radius:999px !important;
  font-size:.65rem !important;
  font-weight:1000 !important;
  letter-spacing:.5px !important;
  text-transform:uppercase !important;
  color:var(--green) !important;
  margin-bottom:8px !important;
}
#p11 .busbar-live-dot{
  width:6px !important;
  height:6px !important;
  background:var(--green) !important;
  border-radius:50% !important;
  animation:busbarPulseDot 1.6s ease infinite !important;
}
@keyframes busbarPulseDot {
  0%, 100% { opacity:1; transform:scale(1); }
  50% { opacity:.5; transform:scale(1.2); }
}
#p11 .busbar-section-title{
  font-size:1.1rem !important;
  font-weight:1000 !important;
  color:var(--text) !important;
  letter-spacing:-.2px !important;
  margin-bottom:4px !important;
}
#p11 .busbar-muted{
  font-size:.8rem !important;
  color:var(--sub) !important;
  font-weight:500 !important;
  line-height:1.5 !important;
  margin-bottom:14px !important;
}
#p11 .busbar-notif-tabs.busbar-notif-tabs-6{
  display:grid !important;
  grid-template-columns:repeat(3, 1fr) !important;
  gap:5px !important;
  margin-top:10px !important;
}
@media (min-width: 480px) {
  #p11 .busbar-notif-tabs.busbar-notif-tabs-6{
    grid-template-columns:repeat(6, 1fr) !important;
  }
}
#p11 .busbar-notif-tab{
  padding:9px 4px !important;
  background:var(--card2) !important;
  border:1px solid var(--stroke2) !important;
  color:var(--sub) !important;
  font-size:.65rem !important;
  font-weight:1000 !important;
  letter-spacing:.3px !important;
  text-transform:uppercase !important;
  border-radius:9px !important;
  cursor:pointer !important;
  transition:all .15s !important;
}
#p11 .busbar-notif-tab.active{
  background:linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  color:#000 !important;
  border-color:transparent !important;
  box-shadow:0 4px 10px rgba(255,204,0,.2) !important;
}

/* ─── HEADER POLISH ─── */
#p11 .busbar-topbar-clean{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:14px 4px !important;
  margin-bottom:14px !important;
}
#p11 .busbar-topbar-title{
  font-size:1.4rem !important;
  font-weight:1000 !important;
  letter-spacing:-.5px !important;
  color:var(--text) !important;
}
/* v4_9 fix: top-right plus FAB intentionally hidden — dock + button is the canonical entry */
#p11 .busbar-topbar-plus{
  display:none !important;
}

/* ─── SHOP TALK / DISPATCH HUB ─── */
#p11 .busbar-channel-hub{
  background:var(--card) !important;
  border:1px solid var(--stroke) !important;
  border-radius:16px !important;
  padding:14px !important;
  margin-bottom:14px !important;
}
#p11 .busbar-channel-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
}
#p11 .busbar-channel-tile{
  background:linear-gradient(135deg, rgba(255,204,0,.05), transparent) !important;
  border:1px solid var(--stroke2) !important;
  border-radius:12px !important;
  padding:14px 12px !important;
  cursor:pointer !important;
  transition:transform .12s, border-color .15s !important;
}
#p11 .busbar-channel-tile:active{
  transform:scale(.97) !important;
  border-color:var(--gold) !important;
}
#p11 .busbar-channel-title{
  font-size:.9rem !important;
  font-weight:1000 !important;
  color:var(--text) !important;
  margin-bottom:4px !important;
}
#p11 .busbar-channel-copy{
  font-size:.7rem !important;
  color:var(--sub) !important;
  font-weight:500 !important;
  line-height:1.4 !important;
}

/* Padding for fixed dock */
#p11 .busbar-shell{
  padding-bottom:90px !important;
}

/* ─── COMPOSER MODAL POLISH (NEW) ─── */
.busbar-post-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999 !important;
  display:none !important;
  align-items:flex-end !important;
  justify-content:center !important;
}
.busbar-post-modal.show{
  display:flex !important;
}
.busbar-post-mask{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.78);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  animation:busbarMaskIn .2s ease;
}
@keyframes busbarMaskIn { from { opacity:0; } to { opacity:1; } }
@keyframes busbarSheetIn {
  from { transform:translateY(100%); }
  to { transform:translateY(0); }
}
.busbar-post-modal .busbar-post-sheet{
  position:relative !important;
  width:100% !important;
  max-width:520px !important;
  max-height:92vh !important;
  background:#141414 !important;
  border:1px solid rgba(255,204,0,.18) !important;
  border-radius:24px 24px 0 0 !important;
  padding:14px 18px 28px !important;
  overflow-y:auto !important;
  box-shadow:0 -20px 60px rgba(0,0,0,.6) !important;
  animation:busbarSheetIn .28s cubic-bezier(.2,.9,.3,1) !important;
}
html[data-theme="light"] .busbar-post-modal .busbar-post-sheet{
  background:#fff !important;
}
.busbar-composer-handle{
  width:42px;
  height:5px;
  background:rgba(255,255,255,.2);
  border-radius:999px;
  margin:2px auto 14px;
}
.busbar-composer-close{
  position:absolute !important;
  top:14px !important;
  right:14px !important;
  width:32px !important;
  height:32px !important;
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.1) !important;
  color:var(--sub) !important;
  font-size:.95rem !important;
  font-weight:1000 !important;
  border-radius:50% !important;
  cursor:pointer !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  transition:color .15s, background .15s !important;
  z-index:2 !important;
}
.busbar-composer-close:hover{
  background:rgba(255,68,68,.1) !important;
  color:#ff4444 !important;
}
.busbar-composer-head-new{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
  padding-right:36px;
}
.busbar-composer-icon{
  width:42px; height:42px;
  border-radius:13px;
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem;
  flex-shrink:0;
  box-shadow:0 6px 14px rgba(255,204,0,.25);
}
.busbar-post-modal .busbar-composer-title{
  font-size:1.05rem !important;
  font-weight:1000 !important;
  color:var(--text) !important;
  letter-spacing:-.2px !important;
  line-height:1.2 !important;
  margin:0 0 2px 0 !important;
}
.busbar-post-modal .busbar-composer-subtitle{
  font-size:.72rem !important;
  color:var(--sub) !important;
  font-weight:600 !important;
  line-height:1.4 !important;
  margin:0 !important;
}

/* Author preview */
.busbar-composer-author{
  display:flex;
  align-items:center;
  gap:10px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  padding:10px 12px;
  border-radius:12px;
  margin-bottom:14px;
}
html[data-theme="light"] .busbar-composer-author{
  background:#f5f5f0;
  border-color:#e0e0d8;
}
.busbar-composer-author-avatar{
  width:34px; height:34px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  display:flex; align-items:center; justify-content:center;
  color:#000;
  font-size:.8rem;
  font-weight:1000;
  flex-shrink:0;
  letter-spacing:-.3px;
}
.busbar-composer-author-name{
  font-size:.85rem;
  font-weight:1000;
  color:var(--text);
  line-height:1.2;
}
.busbar-composer-author-handle{
  font-size:.65rem;
  font-weight:700;
  color:var(--gold);
  letter-spacing:.3px;
  margin-top:1px;
}

/* Composer fields */
.busbar-composer-field{
  margin-bottom:14px;
}
.busbar-composer-field label{
  display:block !important;
  font-size:.62rem !important;
  font-weight:1000 !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  color:var(--subCard) !important;
  margin-bottom:6px !important;
}
.busbar-post-modal textarea#busbar-modal-caption{
  width:100% !important;
  min-height:96px !important;
  padding:13px 14px !important;
  background:rgba(255,255,255,.03) !important;
  border:1.5px solid rgba(255,255,255,.08) !important;
  color:var(--text) !important;
  border-radius:12px !important;
  font-size:.92rem !important;
  font-family:inherit !important;
  font-weight:600 !important;
  line-height:1.4 !important;
  outline:none !important;
  resize:none !important;
  transition:border-color .2s, box-shadow .2s !important;
}
html[data-theme="light"] .busbar-post-modal textarea#busbar-modal-caption{
  background:#f5f5f0 !important;
  border-color:#cfcfc5 !important;
}
.busbar-post-modal textarea#busbar-modal-caption:focus{
  border-color:var(--gold) !important;
  box-shadow:0 0 0 3px rgba(255,204,0,.10) !important;
}
.busbar-post-modal textarea#busbar-modal-caption::placeholder{
  color:var(--sub) !important;
  font-weight:500 !important;
}
.busbar-composer-counter{
  text-align:right;
  font-size:.65rem;
  font-weight:700;
  color:var(--sub);
  margin-top:5px;
  letter-spacing:.3px;
}
.busbar-composer-counter.warn{ color:#ff9900; }
.busbar-composer-counter.over{ color:#ff4444; }

/* Trade tag chips */
.busbar-composer-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.busbar-tag-chip{
  padding:7px 12px !important;
  background:rgba(255,255,255,.03) !important;
  border:1px solid rgba(255,255,255,.1) !important;
  color:var(--subCard) !important;
  font-size:.74rem !important;
  font-weight:1000 !important;
  border-radius:999px !important;
  cursor:pointer !important;
  transition:all .15s !important;
  white-space:nowrap !important;
}
html[data-theme="light"] .busbar-tag-chip{
  background:#f5f5f0 !important;
  border-color:#cfcfc5 !important;
}
.busbar-tag-chip:hover{
  border-color:rgba(255,204,0,.3) !important;
  color:var(--text) !important;
}
.busbar-tag-chip.active{
  background:linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  border-color:transparent !important;
  color:#000 !important;
  box-shadow:0 4px 12px rgba(255,204,0,.25) !important;
}

/* Photo upload */
.busbar-composer-photo-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(85px, 1fr));
  gap:8px;
}
.busbar-composer-photo-add{
  aspect-ratio:1 !important;
  background:rgba(255,255,255,.03) !important;
  border:2px dashed rgba(255,255,255,.15) !important;
  color:var(--sub) !important;
  border-radius:12px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  cursor:pointer !important;
  transition:all .15s !important;
}
.busbar-composer-photo-add:hover{
  border-color:var(--gold) !important;
  background:rgba(255,204,0,.04) !important;
  color:var(--gold) !important;
}
.busbar-composer-photo-add-icon{
  font-size:1.5rem;
  font-weight:300;
  line-height:1;
}
.busbar-composer-photo-add-label{
  font-size:.6rem;
  font-weight:1000;
  letter-spacing:.5px;
  text-transform:uppercase;
}
.busbar-composer-photo-thumb{
  position:relative;
  aspect-ratio:1;
  background:#222;
  border-radius:12px;
  overflow:hidden;
}
.busbar-composer-photo-thumb img{
  width:100%; height:100%;
  object-fit:cover;
}
.busbar-composer-photo-remove{
  position:absolute;
  top:4px; right:4px;
  width:22px; height:22px;
  background:rgba(0,0,0,.7);
  border:none;
  color:#fff;
  font-size:.7rem;
  font-weight:1000;
  border-radius:50%;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.busbar-composer-upload-hint{
  font-size:.66rem;
  color:var(--sub);
  margin-top:6px;
  font-weight:500;
}

/* Submit footer */
.busbar-composer-footer{
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.06);
}
html[data-theme="light"] .busbar-composer-footer{
  border-top-color:#e0e0d8;
}
.busbar-post-modal .busbar-modal-submit{
  width:100% !important;
  padding:15px !important;
  background:linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  border:none !important;
  border-radius:14px !important;
  color:#000 !important;
  font-size:1rem !important;
  font-weight:1000 !important;
  letter-spacing:.3px !important;
  cursor:pointer !important;
  box-shadow:0 8px 22px rgba(255,204,0,.3) !important;
  transition:transform .12s, box-shadow .12s !important;
}
.busbar-post-modal .busbar-modal-submit:hover{
  transform:translateY(-1px) !important;
  box-shadow:0 12px 28px rgba(255,204,0,.4) !important;
}
.busbar-post-modal .busbar-modal-submit:active{
  transform:scale(.98) !important;
}
.busbar-post-modal .busbar-modal-submit:disabled{
  opacity:.5 !important;
  cursor:not-allowed !important;
  transform:none !important;
}

/* ─── BADGE VAULT ─── */
.badges-vault-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.badges-progress-ring{
  width:86px; height:86px;
  border-radius:50%;
  background:conic-gradient(from -90deg, var(--gold) 0%, var(--gold) var(--badges-pct, 0%), rgba(255,255,255,.08) var(--badges-pct, 0%));
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  position:relative;
}
.badges-progress-ring::before{
  content:'';
  position:absolute;
  inset:5px;
  background:var(--card);
  border-radius:50%;
}
html[data-theme="light"] .badges-progress-ring::before{ background:#fff; }
.badges-progress-num{
  position:relative;
  z-index:2;
  text-align:center;
  font-weight:1000;
  color:var(--text);
  line-height:1;
  padding:0 4px;
}
.badges-progress-num span{
  font-size:1.45rem;
  color:var(--gold);
  line-height:1;
}
.badges-progress-num small{
  display:block;
  font-size:.68rem;
  color:var(--sub);
  margin-top:4px;
  letter-spacing:.4px;
  line-height:1;
}

/* Filter chips */
.badges-filter-row{
  display:flex;
  gap:6px;
  overflow-x:auto;
  padding-bottom:4px;
  margin-bottom:14px;
  scrollbar-width:none;
}
.badges-filter-row::-webkit-scrollbar{ display:none; }
.badges-filter{
  flex-shrink:0;
  padding:7px 13px !important;
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:var(--sub) !important;
  font-size:.7rem !important;
  font-weight:1000 !important;
  letter-spacing:.4px !important;
  text-transform:uppercase !important;
  border-radius:999px !important;
  cursor:pointer !important;
  transition:all .15s !important;
  white-space:nowrap !important;
}
html[data-theme="light"] .badges-filter{
  background:#f5f5f0 !important;
  border-color:#cfcfc5 !important;
}
.badges-filter:hover{ color:var(--text) !important; }
.badges-filter.active{
  background:linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  border-color:transparent !important;
  color:#000 !important;
}

/* Badge grid */
.badges-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(86px, 1fr));
  gap:10px;
}
.badge-card{
  position:relative;
  aspect-ratio:1 / 1.2;
  background:var(--card2);
  border:1px solid var(--stroke);
  border-radius:14px;
  padding:8px 6px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  cursor:pointer;
  overflow:hidden;
  transition:transform .15s, border-color .15s, background .15s;
}
.badge-card:active{ transform:scale(.94); }
.badge-card.earned{
  background:linear-gradient(155deg, rgba(255,204,0,.10), rgba(255,153,0,.03) 50%, var(--card2));
  border-color:rgba(255,204,0,.3);
}
.badge-card.earned::before{
  content:'';
  position:absolute;
  top:-30%; right:-30%;
  width:80%; height:80%;
  background:radial-gradient(circle, rgba(255,204,0,.18), transparent 65%);
  pointer-events:none;
}
.badge-card.locked{
  opacity:.55;
}
.badge-card-icon{
  font-size:1.7rem;
  line-height:1;
  filter:grayscale(1) brightness(.7);
  transition:filter .2s;
  position:relative;
  z-index:1;
}
.badge-card.earned .badge-card-icon{
  filter:none;
}
.badge-card-name{
  font-size:.62rem;
  font-weight:1000;
  color:var(--text);
  text-align:center;
  line-height:1.15;
  letter-spacing:.2px;
  padding:0 2px;
  position:relative;
  z-index:1;
}
.badge-card.locked .badge-card-name{ color:var(--sub); }
.badge-card-tier-bar{
  position:absolute;
  bottom:0; left:0; right:0;
  height:3px;
  background:rgba(255,204,0,.6);
  transform-origin:left;
  transform:scaleX(var(--tier, 0));
  transition:transform .3s;
}
.badge-card.locked .badge-card-tier-bar{
  background:rgba(255,255,255,.15);
}
.badge-card-rare{
  position:absolute;
  top:5px; right:5px;
  font-size:.55rem;
  font-weight:1000;
  letter-spacing:.5px;
  color:#000;
  background:linear-gradient(135deg, #ffcc00, #ff9900);
  padding:1px 5px;
  border-radius:4px;
  z-index:2;
}
.badge-card.locked .badge-card-rare{
  background:rgba(255,255,255,.15);
  color:var(--sub);
}

/* Badge detail modal */
.badge-detail-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:20px !important;
}
.badge-detail-modal.show{ display:flex !important; }
.badge-detail-mask{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.78);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.badge-detail-sheet{
  position:relative;
  width:100%;
  max-width:340px;
  background:#141414;
  border:1px solid rgba(255,204,0,.18);
  border-radius:24px;
  padding:32px 24px 24px;
  text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.6);
  animation:badgeDetailIn .3s cubic-bezier(.34,1.56,.64,1);
}
html[data-theme="light"] .badge-detail-sheet{ background:#fff; }
@keyframes badgeDetailIn {
  from { transform:scale(.85); opacity:0; }
  to { transform:scale(1); opacity:1; }
}
.badge-detail-close{
  position:absolute !important;
  top:14px !important;
  right:14px !important;
  width:32px !important;
  height:32px !important;
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.1) !important;
  color:var(--sub) !important;
  font-size:.95rem !important;
  border-radius:50% !important;
  cursor:pointer !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.badge-detail-icon-wrap{
  width:88px; height:88px;
  margin:0 auto 14px;
  border-radius:50%;
  background:linear-gradient(135deg, rgba(255,204,0,.12), rgba(255,153,0,.04));
  border:2px solid rgba(255,204,0,.3);
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}
.badge-detail-icon-wrap.locked{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.1);
}
.badge-detail-icon{
  font-size:3rem;
  line-height:1;
}
.badge-detail-icon-wrap.locked .badge-detail-icon{
  filter:grayscale(1) brightness(.5);
}
.badge-detail-status{
  display:inline-block;
  font-size:.6rem;
  font-weight:1000;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--gold);
  background:rgba(255,204,0,.1);
  border:1px solid rgba(255,204,0,.25);
  padding:3px 9px;
  border-radius:999px;
  margin-bottom:10px;
}
.badge-detail-status.locked{
  color:var(--sub);
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.1);
}
.badge-detail-name{
  font-size:1.4rem;
  font-weight:1000;
  color:var(--text);
  letter-spacing:-.3px;
  margin-bottom:6px;
}
.badge-detail-desc{
  font-size:.85rem;
  color:var(--subCard);
  line-height:1.45;
  font-weight:500;
}
.badge-detail-progress{
  margin-top:18px;
}
.badge-detail-progress-bar{
  width:100%;
  height:8px;
  background:rgba(255,255,255,.08);
  border-radius:999px;
  overflow:hidden;
  margin-bottom:6px;
}
.badge-detail-progress-fill{
  height:100%;
  background:linear-gradient(90deg, var(--gold), var(--gold2));
  border-radius:999px;
  transition:width .4s cubic-bezier(.34,1.56,.64,1);
}
.badge-detail-progress-text{
  font-size:.75rem;
  font-weight:1000;
  color:var(--gold);
  letter-spacing:.3px;
}
.badge-detail-meta{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.06);
  font-size:.7rem;
  color:var(--sub);
  font-weight:600;
  letter-spacing:.3px;
}

/* Badge unlock celebration modal */
.badge-unlock-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:99999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
}
.badge-unlock-modal.show{ display:flex !important; }
.badge-unlock-bg{
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 40%, rgba(255,204,0,.15), rgba(0,0,0,.92) 60%);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.badge-unlock-content{
  position:relative;
  text-align:center;
  padding:30px;
  animation:badgeUnlockIn .5s cubic-bezier(.34,1.56,.64,1);
}
@keyframes badgeUnlockIn {
  from { transform:scale(.5); opacity:0; }
  to { transform:scale(1); opacity:1; }
}
.badge-unlock-eyebrow{
  font-size:.85rem;
  font-weight:1000;
  letter-spacing:3px;
  color:var(--gold);
  margin-bottom:24px;
  text-shadow:0 0 14px rgba(255,204,0,.5);
  animation:badgeUnlockBlink 1.5s ease infinite;
}
@keyframes badgeUnlockBlink {
  0%, 100% { opacity:1; }
  50% { opacity:.7; }
}
.badge-unlock-icon-wrap{
  position:relative;
  width:140px; height:140px;
  margin:0 auto 20px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.badge-unlock-rays{
  position:absolute;
  inset:0;
  background:conic-gradient(from 0deg, transparent 0deg, rgba(255,204,0,.3) 30deg, transparent 60deg, rgba(255,204,0,.3) 90deg, transparent 120deg, rgba(255,204,0,.3) 150deg, transparent 180deg, rgba(255,204,0,.3) 210deg, transparent 240deg, rgba(255,204,0,.3) 270deg, transparent 300deg, rgba(255,204,0,.3) 330deg, transparent 360deg);
  border-radius:50%;
  animation:badgeRaysSpin 8s linear infinite;
  filter:blur(6px);
}
@keyframes badgeRaysSpin {
  to { transform:rotate(360deg); }
}
.badge-unlock-icon{
  position:relative;
  z-index:2;
  width:96px;
  height:96px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:3rem;
  box-shadow:0 0 60px rgba(255,204,0,.5), 0 0 0 4px rgba(255,204,0,.2);
}
.badge-unlock-name{
  font-size:2rem;
  font-weight:1000;
  color:var(--text);
  letter-spacing:-.5px;
  margin-bottom:6px;
  text-shadow:0 0 20px rgba(0,0,0,.4);
}
.badge-unlock-desc{
  font-size:.95rem;
  color:var(--subCard);
  line-height:1.5;
  margin-bottom:30px;
  max-width:300px;
  margin-left:auto;
  margin-right:auto;
  font-weight:500;
}
.badge-unlock-btn{
  background:linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  color:#000 !important;
  border:none !important;
  padding:14px 38px !important;
  border-radius:999px !important;
  font-size:1rem !important;
  font-weight:1000 !important;
  cursor:pointer !important;
  box-shadow:0 12px 32px rgba(255,204,0,.4) !important;
  letter-spacing:.3px !important;
  transition:transform .12s !important;
}
.badge-unlock-btn:active{ transform:scale(.96) !important; }

/* ─── PROFILE EDITOR ─── */
.busbar-profile-edit-avatar-row{
  display:flex;
  align-items:center;
  gap:14px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  padding:14px;
  border-radius:14px;
  margin-bottom:14px;
}
html[data-theme="light"] .busbar-profile-edit-avatar-row{
  background:#f5f5f0;
  border-color:#e0e0d8;
}
.busbar-profile-edit-avatar{
  width:54px; height:54px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--gold), var(--gold2));
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem;
  font-weight:1000;
  color:#000;
  flex-shrink:0;
  letter-spacing:-.5px;
  box-shadow:0 6px 16px rgba(255,204,0,.25);
}
.busbar-profile-edit-avatar-hint{
  font-size:.72rem;
  font-weight:600;
  color:var(--sub);
  line-height:1.5;
}
.busbar-profile-edit-input,
.busbar-profile-edit-textarea{
  width:100% !important;
  padding:13px 14px !important;
  background:rgba(255,255,255,.03) !important;
  border:1.5px solid rgba(255,255,255,.08) !important;
  color:var(--text) !important;
  border-radius:12px !important;
  font-size:.92rem !important;
  font-weight:600 !important;
  font-family:inherit !important;
  outline:none !important;
  transition:border-color .2s, box-shadow .2s !important;
}
html[data-theme="light"] .busbar-profile-edit-input,
html[data-theme="light"] .busbar-profile-edit-textarea{
  background:#f5f5f0 !important;
  border-color:#cfcfc5 !important;
}
.busbar-profile-edit-input:focus,
.busbar-profile-edit-textarea:focus{
  border-color:var(--gold) !important;
  box-shadow:0 0 0 3px rgba(255,204,0,.10) !important;
}
.busbar-profile-edit-input::placeholder,
.busbar-profile-edit-textarea::placeholder{
  color:var(--sub) !important;
  font-weight:500 !important;
}
.busbar-profile-edit-textarea{
  min-height:80px !important;
  resize:none !important;
  line-height:1.4 !important;
}

/* Empty recent work state */
#p11 .p11-recent-work-empty{
  text-align:center !important;
  padding:24px 16px !important;
  margin-top:14px !important;
  background:rgba(255,255,255,.02) !important;
  border:2px dashed rgba(255,255,255,.08) !important;
  border-radius:14px !important;
}
html[data-theme="light"] #p11 .p11-recent-work-empty{
  background:#f5f5f0 !important;
  border-color:#cfcfc5 !important;
}
#p11 .p11-recent-work-empty-icon{
  font-size:1.8rem !important;
  margin-bottom:6px !important;
  opacity:.5 !important;
}
#p11 .p11-recent-work-empty-text{
  font-size:.9rem !important;
  font-weight:1000 !important;
  color:var(--subCard) !important;
  margin-bottom:3px !important;
}
#p11 .p11-recent-work-empty-sub{
  font-size:.72rem !important;
  color:var(--sub) !important;
  font-weight:600 !important;
}

/* ═════════════════════════════════════════
   P12 COMMAND CENTER — POLISHED
   ═════════════════════════════════════════ */

#p12 {
  padding-bottom: 60px !important;
}

/* Hero */
#p12 .cc-hero {
  text-align: center;
  margin: 6px 0 22px;
  padding: 0 8px;
}
#p12 .cc-hero-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  margin-bottom: 12px;
  box-shadow: 0 12px 28px rgba(255,204,0,.32);
  font-size: 1.7rem;
}
#p12 .cc-hero-title {
  font-size: 1.6rem;
  font-weight: 1000;
  letter-spacing: -.5px;
  color: var(--text);
  margin: 0 0 4px 0;
  line-height: 1.1;
}
#p12 .cc-hero-title span { color: var(--gold); }
#p12 .cc-hero-sub {
  font-size: .82rem;
  color: var(--sub);
  font-weight: 700;
  margin: 0;
}

/* Sections */
#p12 .cc-section {
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: 18px;
  margin-bottom: 14px;
  overflow: hidden;
  box-shadow: var(--shadow);
}
#p12 .cc-section-title {
  padding: 14px 18px 10px;
  font-size: .68rem;
  font-weight: 1000;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold);
  border-bottom: 1px solid var(--stroke2);
}
#p12 .cc-section-title.danger {
  color: var(--red);
}

/* Rows */
#p12 .cc-row {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(255,255,255,.04);
  text-align: left;
  cursor: pointer;
  color: var(--text);
  font-family: inherit;
  transition: background .15s;
}
#p12 .cc-row:last-child {
  border-bottom: none;
}
#p12 .cc-row:hover:not(.cc-row-static):not(:disabled) {
  background: rgba(255,204,0,.04);
}
#p12 .cc-row:active:not(.cc-row-static):not(:disabled) {
  background: rgba(255,204,0,.08);
}
#p12 .cc-row-static {
  cursor: default;
}
#p12 .cc-row-icon {
  flex-shrink: 0;
  width: 40px; height: 40px;
  background: var(--card2);
  border: 1px solid var(--stroke2);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
}
#p12 .cc-row.danger .cc-row-icon {
  background: rgba(255,68,68,.06);
  border-color: rgba(255,68,68,.2);
}
#p12 .cc-row-body {
  flex: 1;
  min-width: 0;
}
#p12 .cc-row-title {
  font-size: .9rem;
  font-weight: 1000;
  color: var(--text);
  letter-spacing: -.1px;
  line-height: 1.3;
  margin-bottom: 2px;
}
#p12 .cc-row.danger .cc-row-title {
  color: var(--red);
}
#p12 .cc-row-sub {
  font-size: .72rem;
  color: var(--sub);
  font-weight: 600;
  line-height: 1.4;
}
#p12 .cc-row-arrow {
  flex-shrink: 0;
  font-size: 1.2rem;
  color: var(--sub);
  font-weight: 300;
}
#p12 .cc-row-action {
  flex-shrink: 0;
}
#p12 .cc-status-pill {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  color: var(--sub);
  font-size: .62rem;
  font-weight: 1000;
  letter-spacing: 1.2px;
  padding: 4px 10px;
  border-radius: 999px;
  white-space: nowrap;
  flex-shrink: 0;
}
#p12 .cc-status-pill.pro {
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  color: #000;
  border-color: transparent;
  box-shadow: 0 4px 10px rgba(255,204,0,.25);
  /* tighter for longer text like "🥇 FOUNDER" */
  font-size: .58rem;
  letter-spacing: .8px;
  padding: 4px 9px;
}
/* Ensure account row never clips the pill on narrow screens */
#p12 #cc-row-account {
  padding-right: 14px;
  gap: 10px;
}
#p12 #cc-row-account .cc-row-body {
  min-width: 0;
}
#p12 #cc-row-account .cc-row-title,
#p12 #cc-row-account .cc-row-sub {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Footer */
#p12 .cc-footer {
  text-align: center;
  padding: 30px 16px 20px;
  margin-top: 8px;
}
#p12 .cc-footer-bolt {
  font-size: 1.6rem;
  margin-bottom: 10px;
  filter: drop-shadow(0 0 8px rgba(255,204,0,.4));
}
#p12 .cc-footer-line {
  font-size: .78rem;
  color: var(--subCard);
  font-weight: 700;
  margin-bottom: 4px;
}
#p12 .cc-footer-copy {
  font-size: .68rem;
  color: var(--sub);
  font-weight: 600;
  margin-top: 8px;
}

/* ─── Command Center Modal ─── */
.cc-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: none !important;
  align-items: flex-end !important;
  justify-content: center !important;
}
.cc-modal.show {
  display: flex !important;
}
.cc-modal-mask {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.cc-modal-sheet {
  position: relative;
  width: 100%;
  max-width: 520px;
  max-height: 88vh;
  background: #141414;
  border: 1px solid rgba(255,204,0,.18);
  border-radius: 24px 24px 0 0;
  padding: 14px 20px 24px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 -20px 60px rgba(0,0,0,.6);
  animation: ccSheetIn .28s cubic-bezier(.2,.9,.3,1);
}
html[data-theme="light"] .cc-modal-sheet {
  background: #fff;
}
@keyframes ccSheetIn {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.cc-modal-handle {
  width: 42px;
  height: 5px;
  background: rgba(255,255,255,.2);
  border-radius: 999px;
  margin: 2px auto 14px;
}
.cc-modal-close {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  width: 32px !important;
  height: 32px !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  color: var(--sub) !important;
  font-size: .95rem !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 2 !important;
}
.cc-modal-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 16px;
  padding-right: 36px;
}
.cc-modal-icon {
  width: 44px; height: 44px;
  border-radius: 13px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  flex-shrink: 0;
  box-shadow: 0 6px 14px rgba(255,204,0,.25);
}
.cc-modal-title {
  font-size: 1.2rem;
  font-weight: 1000;
  color: var(--text);
  letter-spacing: -.3px;
  line-height: 1.2;
  margin-bottom: 3px;
}
.cc-modal-meta {
  font-size: .7rem;
  color: var(--sub);
  font-weight: 700;
  letter-spacing: .3px;
}
.cc-modal-body {
  flex: 1;
  overflow-y: auto;
  font-size: .85rem;
  color: var(--subCard);
  line-height: 1.6;
  font-weight: 500;
  padding: 4px 0 14px;
  white-space: pre-line;
}
.cc-modal-body h3 {
  font-size: .9rem;
  font-weight: 1000;
  color: var(--text);
  margin: 14px 0 6px;
  letter-spacing: -.1px;
}
.cc-modal-body h3:first-child {
  margin-top: 0;
}
.cc-modal-body p {
  margin-bottom: 10px;
}
.cc-modal-body strong {
  color: var(--text);
  font-weight: 1000;
}
.cc-modal-footer {
  border-top: 1px solid rgba(255,255,255,.06);
  padding-top: 14px;
}
html[data-theme="light"] .cc-modal-footer {
  border-top-color: #e0e0d8;
}
.cc-modal-btn-primary {
  width: 100% !important;
  padding: 14px !important;
  background: linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  border: none !important;
  border-radius: 12px !important;
  color: #000 !important;
  font-size: .95rem !important;
  font-weight: 1000 !important;
  cursor: pointer !important;
  box-shadow: 0 6px 18px rgba(255,204,0,.25) !important;
}

/* ─── END P11 POLISH ─── */

/* ═════════════════════════════════════════
   P9 JOB JOURNAL
   ═════════════════════════════════════════ */

#p9 {
  padding-bottom: 100px !important;
}

/* Hero */
#p9 .jj-hero {
  text-align: center;
  margin: 6px 0 18px;
  padding: 0 8px;
}
#p9 .jj-hero-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  margin-bottom: 12px;
  box-shadow: 0 12px 28px rgba(255,204,0,.32);
  font-size: 1.7rem;
}
#p9 .jj-hero-title {
  font-size: 1.55rem;
  font-weight: 1000;
  letter-spacing: -.5px;
  color: var(--text);
  margin: 0 0 4px 0;
  line-height: 1.1;
}
#p9 .jj-hero-title span { color: var(--gold); }
#p9 .jj-hero-sub {
  font-size: .82rem;
  color: var(--sub);
  font-weight: 700;
  margin: 0;
}

/* Stats banner */
#p9 .jj-stats {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  margin-bottom: 14px;
}
#p9 .jj-stat {
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: 14px;
  padding: 12px 8px;
  text-align: center;
}
#p9 .jj-stat-num {
  font-size: 1.6rem;
  font-weight: 1000;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 4px;
  font-variant-numeric: tabular-nums;
}
#p9 .jj-stat-label {
  font-size: .62rem;
  font-weight: 1000;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--sub);
}

/* Toolbar */
#p9 .jj-toolbar {
  margin-bottom: 14px;
}
#p9 .jj-search {
  width: 100%;
  padding: 12px 14px;
  background: var(--card);
  border: 1.5px solid var(--stroke2);
  color: var(--text);
  border-radius: 12px;
  font-size: .92rem;
  font-weight: 600;
  outline: none;
  margin-bottom: 10px;
}
#p9 .jj-search:focus {
  border-color: var(--gold);
}
#p9 .jj-filter-chips {
  display: flex;
  gap: 6px;
}
#p9 .jj-chip {
  padding: 8px 14px;
  background: var(--card2);
  border: 1px solid var(--stroke);
  color: var(--sub);
  font-size: .7rem;
  font-weight: 1000;
  letter-spacing: .5px;
  text-transform: uppercase;
  border-radius: 999px;
  cursor: pointer;
  transition: all .15s;
}
#p9 .jj-chip.active {
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  border-color: transparent;
  color: #000;
}

/* Job list */
#p9 #jj-job-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#p9 .jj-job-card {
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: 14px;
  padding: 14px;
  cursor: pointer;
  transition: border-color .15s, transform .12s;
  text-align: left;
  width: 100%;
}
#p9 .jj-job-card:active {
  transform: scale(.98);
  border-color: var(--gold);
}
#p9 .jj-job-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
#p9 .jj-job-card-name {
  font-size: .95rem;
  font-weight: 1000;
  color: var(--text);
  line-height: 1.3;
  flex: 1;
  min-width: 0;
}
#p9 .jj-job-card-status {
  flex-shrink: 0;
  font-size: .55rem;
  font-weight: 1000;
  letter-spacing: .8px;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(255,204,0,.12);
  color: var(--gold);
  border: 1px solid rgba(255,204,0,.25);
}
#p9 .jj-job-card-status.completed {
  background: rgba(46,204,113,.12);
  color: var(--green);
  border-color: rgba(46,204,113,.25);
}
#p9 .jj-job-card-customer {
  font-size: .78rem;
  color: var(--subCard);
  font-weight: 600;
  margin-bottom: 4px;
}
#p9 .jj-job-card-meta {
  font-size: .7rem;
  color: var(--sub);
  font-weight: 600;
  display: flex;
  gap: 10px;
}
#p9 .jj-job-card-meta span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* Empty state */
#p9 .jj-empty {
  text-align: center;
  padding: 40px 24px;
  background: rgba(255,255,255,.02);
  border: 2px dashed rgba(255,255,255,.08);
  border-radius: 16px;
}
#p9 .jj-empty-icon {
  font-size: 2.4rem;
  margin-bottom: 10px;
  opacity: .5;
}
#p9 .jj-empty-text {
  font-size: 1rem;
  font-weight: 1000;
  color: var(--subCard);
  margin-bottom: 4px;
}
#p9 .jj-empty-sub {
  font-size: .8rem;
  color: var(--sub);
  font-weight: 600;
}

/* New Job FAB */
#p9 .jj-fab {
  position: fixed;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 8000;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 22px 13px 18px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  border: none;
  border-radius: 999px;
  color: #000;
  font-weight: 1000;
  cursor: pointer;
  box-shadow: 0 12px 32px rgba(255,204,0,.4);
  transition: transform .14s, box-shadow .14s;
}
#p9 .jj-fab:active {
  transform: translateX(-50%) scale(.96);
}
#p9 .jj-fab-icon {
  font-size: 1.4rem;
  font-weight: 300;
  line-height: 1;
}
#p9 .jj-fab-label {
  font-size: .9rem;
  letter-spacing: .3px;
  text-transform: uppercase;
}

/* Detail view */
#p9 .jj-detail-hero {
  background: linear-gradient(155deg, rgba(255,204,0,.06), rgba(255,153,0,.02) 50%, transparent);
  border: 1px solid rgba(255,204,0,.18);
  border-radius: 18px;
  padding: 18px;
  margin-bottom: 14px;
}
#p9 .jj-detail-status-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
#p9 .jj-status-pill {
  font-size: .6rem;
  font-weight: 1000;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(255,204,0,.12);
  color: var(--gold);
  border: 1px solid rgba(255,204,0,.25);
}
#p9 .jj-status-pill.completed {
  background: rgba(46,204,113,.12);
  color: var(--green);
  border-color: rgba(46,204,113,.25);
}
#p9 .jj-detail-edit-btn {
  background: var(--card2);
  border: 1px solid var(--stroke);
  color: var(--subCard);
  padding: 6px 14px;
  border-radius: 8px;
  font-size: .72rem;
  font-weight: 1000;
  cursor: pointer;
}
#p9 .jj-detail-edit-btn:hover {
  border-color: var(--gold);
  color: var(--gold);
}
#p9 .jj-detail-title {
  font-size: 1.3rem;
  font-weight: 1000;
  color: var(--text);
  letter-spacing: -.3px;
  margin: 0 0 4px 0;
  line-height: 1.2;
}
#p9 .jj-detail-meta {
  font-size: .85rem;
  color: var(--subCard);
  font-weight: 600;
  margin-bottom: 4px;
}
#p9 .jj-detail-dates {
  font-size: .68rem;
  color: var(--sub);
  font-weight: 600;
}

/* Detail action buttons */
#p9 .jj-detail-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 14px;
}
#p9 .jj-detail-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 14px 10px;
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: 14px;
  color: var(--text);
  font-size: .82rem;
  font-weight: 1000;
  cursor: pointer;
  transition: border-color .15s;
}
#p9 .jj-detail-action.primary {
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  border-color: transparent;
  color: #000;
  box-shadow: 0 6px 16px rgba(255,204,0,.25);
}
#p9 .jj-detail-action:hover {
  border-color: var(--gold);
}
#p9 .jj-detail-action-icon {
  font-size: 1.3rem;
}

/* Card */
#p9 .jj-card {
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 12px;
}
#p9 .jj-card-title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
#p9 .jj-card-title {
  font-size: .72rem;
  font-weight: 1000;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 10px;
}
#p9 .jj-card-title-row .jj-card-title { margin-bottom: 0; }

/* Customer info rows */
#p9 .jj-info-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--stroke2);
}
#p9 .jj-info-row:last-child { border-bottom: none; }
#p9 .jj-info-label {
  font-size: .65rem;
  font-weight: 1000;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--sub);
  flex-shrink: 0;
  min-width: 70px;
}
#p9 .jj-info-value {
  font-size: .85rem;
  font-weight: 600;
  color: var(--text);
  text-align: right;
  word-break: break-word;
}
#p9 .jj-info-link {
  color: var(--gold);
  text-decoration: none;
}
#p9 .jj-info-link:hover {
  text-decoration: underline;
}

/* Entry count chip */
#p9 .jj-entry-count {
  font-size: .6rem;
  font-weight: 1000;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--sub);
  background: var(--card2);
  border: 1px solid var(--stroke);
  padding: 3px 9px;
  border-radius: 999px;
}

/* Entries list */
#p9 #jj-entries-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#p9 .jj-entry {
  background: var(--card2);
  border: 1px solid var(--stroke2);
  border-radius: 12px;
  padding: 12px 14px;
}
#p9 .jj-entry-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
#p9 .jj-entry-date {
  font-size: .72rem;
  font-weight: 1000;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--gold);
}
#p9 .jj-entry-hours {
  font-size: .7rem;
  font-weight: 1000;
  color: var(--subCard);
  background: rgba(255,255,255,.04);
  padding: 2px 8px;
  border-radius: 999px;
}
#p9 .jj-entry-text {
  font-size: .85rem;
  color: var(--text);
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 8px;
  white-space: pre-line;
}
#p9 .jj-entry-materials {
  font-size: .72rem;
  color: var(--sub);
  font-style: italic;
  border-top: 1px dashed var(--stroke2);
  padding-top: 6px;
  margin-top: 6px;
  white-space: pre-line;
}
#p9 .jj-entry-photos {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
  gap: 6px;
  margin-top: 8px;
}
#p9 .jj-entry-photo {
  aspect-ratio: 1;
  border-radius: 8px;
  overflow: hidden;
  background: #222;
}
#p9 .jj-entry-photo img {
  width: 100%; height: 100%;
  object-fit: cover;
}
#p9 .jj-entry-actions {
  display: flex;
  gap: 6px;
  margin-top: 8px;
}
#p9 .jj-entry-btn {
  background: transparent;
  border: 1px solid var(--stroke2);
  color: var(--sub);
  font-size: .65rem;
  font-weight: 1000;
  letter-spacing: .5px;
  text-transform: uppercase;
  padding: 5px 9px;
  border-radius: 6px;
  cursor: pointer;
}
#p9 .jj-entry-btn:hover { color: var(--gold); border-color: var(--gold); }
#p9 .jj-entry-btn.delete:hover { color: var(--red); border-color: var(--red); }

/* Empty entries state */
#p9 .jj-empty-entries {
  text-align: center;
  padding: 24px 16px;
  background: rgba(255,255,255,.02);
  border: 2px dashed rgba(255,255,255,.08);
  border-radius: 12px;
  color: var(--sub);
  font-size: .82rem;
  font-weight: 600;
}

/* Status / delete buttons */
#p9 .jj-status-btn {
  width: 100%;
  padding: 13px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  border: none;
  border-radius: 12px;
  color: #000;
  font-size: .9rem;
  font-weight: 1000;
  letter-spacing: .3px;
  cursor: pointer;
  margin-bottom: 8px;
}
#p9 .jj-status-btn.completed {
  background: var(--card2);
  color: var(--subCard);
  border: 1px solid var(--stroke2);
}
#p9 .jj-delete-btn {
  width: 100%;
  padding: 11px;
  background: transparent;
  border: 1.5px solid rgba(255,68,68,.3);
  color: #ff4444;
  border-radius: 12px;
  font-size: .78rem;
  font-weight: 1000;
  cursor: pointer;
}

/* ─── JOB JOURNAL MODALS ─── */
.jj-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: none !important;
  align-items: flex-end !important;
  justify-content: center !important;
}
.jj-modal.show { display: flex !important; }
.jj-modal-mask {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.jj-modal-sheet {
  position: relative;
  width: 100%;
  max-width: 520px;
  max-height: 92vh;
  background: #141414;
  border: 1px solid rgba(255,204,0,.18);
  border-radius: 24px 24px 0 0;
  padding: 14px 20px 24px;
  overflow-y: auto;
  box-shadow: 0 -20px 60px rgba(0,0,0,.6);
  animation: jjSheetIn .28s cubic-bezier(.2,.9,.3,1);
}
html[data-theme="light"] .jj-modal-sheet { background: #fff; }
@keyframes jjSheetIn {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.jj-modal-handle {
  width: 42px; height: 5px;
  background: rgba(255,255,255,.2);
  border-radius: 999px;
  margin: 2px auto 14px;
}
.jj-modal-close {
  position: absolute;
  top: 14px; right: 14px;
  width: 32px; height: 32px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  color: var(--sub);
  font-size: .95rem;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.jj-modal-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  padding-right: 36px;
}
.jj-modal-icon {
  width: 42px; height: 42px;
  border-radius: 13px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
  box-shadow: 0 6px 14px rgba(255,204,0,.25);
}
.jj-modal-title {
  font-size: 1.05rem;
  font-weight: 1000;
  color: var(--text);
  letter-spacing: -.2px;
  line-height: 1.2;
  margin-bottom: 2px;
}
.jj-modal-sub {
  font-size: .72rem;
  color: var(--sub);
  font-weight: 600;
  line-height: 1.4;
}

.jj-field { margin-bottom: 14px; }
.jj-field label {
  display: block;
  font-size: .62rem;
  font-weight: 1000;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--subCard);
  margin-bottom: 6px;
}
.jj-field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
/* v4_9 fix: iOS Safari forces intrinsic min-width on date inputs and pushes them
   past their grid track, colliding with the hours field. min-width:0 lets the
   columns honor 1fr/1fr. */
.jj-field-row > .jj-field { min-width: 0; }
.jj-field-row .jj-input { width: 100%; min-width: 0; box-sizing: border-box; }
.jj-input,
.jj-textarea {
  width: 100%;
  padding: 13px 14px;
  background: rgba(255,255,255,.03);
  border: 1.5px solid rgba(255,255,255,.08);
  color: var(--text);
  border-radius: 12px;
  font-size: .92rem;
  font-weight: 600;
  font-family: inherit;
  outline: none;
}
html[data-theme="light"] .jj-input,
html[data-theme="light"] .jj-textarea {
  background: #f5f5f0;
  border-color: #cfcfc5;
}
.jj-input:focus,
.jj-textarea:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(255,204,0,.10);
}
.jj-textarea {
  min-height: 80px;
  resize: vertical;
  line-height: 1.4;
}
.jj-textarea-tall { min-height: 110px; }
.jj-input::placeholder,
.jj-textarea::placeholder {
  color: var(--sub);
  font-weight: 500;
}

.jj-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  gap: 8px;
  margin-top: 4px;
}
.jj-photo-add {
  aspect-ratio: 1;
  background: rgba(255,255,255,.03);
  border: 2px dashed rgba(255,255,255,.15);
  color: var(--sub);
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  cursor: pointer;
}
.jj-photo-add:hover { border-color: var(--gold); color: var(--gold); }
.jj-photo-add-icon { font-size: 1.5rem; font-weight: 300; line-height: 1; }
.jj-photo-add-label {
  font-size: .58rem;
  font-weight: 1000;
  letter-spacing: .5px;
  text-transform: uppercase;
}
.jj-photo-thumb {
  position: relative;
  aspect-ratio: 1;
  background: #222;
  border-radius: 12px;
  overflow: hidden;
}
.jj-photo-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
}
.jj-photo-remove {
  position: absolute;
  top: 4px; right: 4px;
  width: 22px; height: 22px;
  background: rgba(0,0,0,.7);
  border: none;
  color: #fff;
  font-size: .7rem;
  font-weight: 1000;
  border-radius: 50%;
  cursor: pointer;
}

.jj-modal-footer {
  margin-top: 6px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.06);
}
.jj-modal-submit {
  width: 100%;
  padding: 14px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  border: none;
  border-radius: 12px;
  color: #000;
  font-size: .95rem;
  font-weight: 1000;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(255,204,0,.3);
}

/* ─── END P9 JOB JOURNAL ─── */


/* ===== P1 Chapter cards polish ===== */
#p1 .card[onclick*="p1_startExam"]:active{
  transform:scale(.985);
  border-color:var(--gold) !important;
}
#p1 .card[onclick*="p1_startExam"]:hover{
  border-color:rgba(255,204,0,.35) !important;
}
/* Make progress bar visible when there's any progress */
#p1 [id^="p1-prog-"]{
  min-width:3px;
}
#p1-screen-home button.card{
  -webkit-tap-highlight-color:rgba(255,204,0,.10);
}

/* v4_9 fix: P1 exam text was running smaller than the rest of the app. The exam
   screen uses inline font-size declarations, so we override with !important. */
#p1-screen-exam #p1-q-text{ font-size:1.25rem !important; line-height:1.5 !important; }
#p1-screen-exam #p1-q-number{ font-size:.82rem !important; }
#p1-screen-exam #p1-answers button{ font-size:1.08rem !important; padding:16px 18px !important; }
#p1-screen-exam #p1-answers button > span:last-child{ font-size:1.08rem !important; }
#p1-screen-exam #p1-hint-t1,
#p1-screen-exam #p1-hint-t2{ font-size:1.02rem !important; line-height:1.5 !important; }
#p1-screen-exam #p1-explain-text{ font-size:1.05rem !important; line-height:1.6 !important; }
#p1-screen-exam #p1-nec-ref{ font-size:.82rem !important; }
#p1-screen-exam #p1-btn-prev,
#p1-screen-exam #p1-hint-btn{ font-size:.95rem !important; }
#p1-screen-exam #p1-ai-toggle-btn{ font-size:1.05rem !important; }

/* ========== P6 FIELD HACKS (de-iframed) ========== */
#p6 * {box-sizing:border-box}#p6 .page {max-width:1120px;margin:0 auto;padding:20px 24px 28px;min-height:100vh;animation:fadeIn .24s ease-out;touch-action:pan-y}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}#p6 .header-row {margin:0 0 14px 0;padding-top:0;text-align:left;position:relative;z-index:2}#p6 .header-row h1 {margin:0;font-size:1.1em;color:var(--gold);font-weight:1000;letter-spacing:1px;text-transform:uppercase;border-left:3px solid var(--gold);padding-left:10px}#p6 .card, #p6 .subcard {background:var(--card);border:1px solid var(--stroke);border-radius:var(--radius);box-shadow:var(--shadow)}#p6 .card {padding:18px;margin-top:14px;overflow:hidden}#p6 .subcard {background:var(--card2);padding:14px;margin-top:12px}#p6 h2, #p6 h3 {margin:0 0 10px 0;color:var(--text);font-weight:1000;letter-spacing:-.2px}
#p6 h2 {font-size:1.05rem}
#p6 h3 {font-size:.95rem;color:var(--subCard)}#p6 .top-nav {
  position:relative;
  z-index:1;
  display:flex;
  gap:10px;
  margin-top:0;
  margin-bottom:12px;
  padding:0 10px 10px;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom:1px solid rgba(255,255,255,.06);
  box-shadow:none;
}#p6 html[data-theme="light"] .top-nav {
  background:rgba(239,239,239,.86);
}#p6 .top-nav .nav-btn:first-child {margin-left:0}#p6 .top-nav .nav-btn:last-child {margin-right:8px}#p6 .top-nav::-webkit-scrollbar {display:none}#p6 .nav-btn, #p6 .small-tab-btn, #p6 .snap-btn, #p6 .copy-btn, #p6 .main-btn, #p6 .dark-btn, #p6 .green-btn {border:none;border-radius:14px;font-weight:900;cursor:pointer;transition:transform .16s ease, opacity .16s ease, box-shadow .18s ease, background-color .18s ease; -webkit-tap-highlight-color:transparent}#p6 .nav-btn:hover, #p6 .small-tab-btn:hover, #p6 .snap-btn:hover, #p6 .copy-btn:hover, #p6 .main-btn:hover, #p6 .dark-btn:hover, #p6 .green-btn:hover {transform:translateY(-1px)}#p6 .nav-btn {
  flex:0 0 auto;
  min-width:170px;
  padding:10px 16px;
  background:var(--card);
  color:var(--text);
  border:1px solid var(--stroke2);
  box-shadow:var(--shadow);
  font-size:13px;
  white-space:nowrap;
  position:relative;
}#p6 .nav-btn.active, #p6 .small-tab-btn.active, #p6 .snap-btn.active, #p6 .main-btn {background:var(--gold);color:#111;box-shadow:0 8px 18px rgba(255,204,0,.12)}#p6 .nav-btn.active::after {
  content:"";
  position:absolute;
  left:20px;
  right:20px;
  bottom:-5px;
  height:2px;
  border-radius:999px;
  background:rgba(255,204,0,.92);
}#p6 .section {display:none;opacity:0;transform:translateX(14px);will-change:transform,opacity}#p6 .section.active {display:block;animation:sectionSlide .22s cubic-bezier(.22,.9,.25,1) both}
@keyframes sectionSlide{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}#p6 label {display:block;margin-top:12px;font-size:14px;font-weight:900;color:var(--subCard)}#p6 input, #p6 select, #p6 textarea {width:100%;min-width:0;margin-top:8px;padding:14px;border-radius:14px;border:1px solid var(--stroke2);background:var(--input-bg);color:var(--text);font-size:16px;outline:none;transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease}#p6 textarea {min-height:90px;resize:vertical}#p6 .main-btn, #p6 .dark-btn, #p6 .green-btn {width:100%;padding:14px;margin-top:10px}#p6 input:focus, #p6 select:focus, #p6 textarea:focus {border-color:rgba(255,204,0,.65);box-shadow:0 0 0 4px rgba(255,204,0,.10)}#p6 .nav-btn:active, #p6 .small-tab-btn:active, #p6 .snap-btn:active, #p6 .copy-btn:active, #p6 .main-btn:active, #p6 .dark-btn:active, #p6 .green-btn:active {transform:scale(.985)}#p6 .card {backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}#p6 .dark-btn, #p6 .small-tab-btn, #p6 .snap-btn, #p6 .copy-btn {background:var(--card2);color:var(--text);border:1px solid var(--stroke2)}#p6 .green-btn {background:var(--green);color:#08140d}#p6 .result {margin-top:12px;padding:14px;border-radius:14px;background:var(--resBg);border:1px solid var(--resStroke)}#p6 .big {font-size:28px;font-weight:1000;color:var(--green);word-break:break-word}#p6 .sub {margin-top:6px;color:var(--subCard);font-size:16px;word-break:break-word}#p6 .note {margin-top:10px;color:var(--subCard);font-size:14px;line-height:1.45}#p6 .warning {color:var(--red);margin-top:10px;font-weight:900;min-height:20px;line-height:1.4}#p6 .grid-2 {display:grid;grid-template-columns:1fr 1fr;gap:10px}#p6 .grid-3 {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}#p6 .row {display:flex;gap:8px}#p6 .row>* {flex:1}#p6 .small-tabs {display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}#p6 .small-tab-btn {flex:1;min-width:120px;padding:12px}#p6 .small-panel {display:none}#p6 .small-panel.active {display:block}#p6 .copy-btn {width:auto;margin-top:0;padding:8px 12px;font-size:12px}#p6 .actions {display:flex;gap:8px;margin-top:12px}#p6 .actions button {flex:1}#p6 .switch-container {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}#p6 .switch {position:relative;display:inline-block;width:54px;height:30px}#p6 .switch input {opacity:0;width:0;height:0;position:absolute}#p6 .slider {position:absolute;inset:0;background:#333;border-radius:999px;transition:.2s;border:1px solid var(--stroke2)}#p6 .slider:before {content:"";position:absolute;width:22px;height:22px;left:4px;top:3px;background:#fff;border-radius:50%;transition:.2s}#p6 .switch input:checked + .slider {background:var(--gold)}#p6 .switch input:checked + .slider:before {transform:translateX(24px)}#p6 #upm-map {height:420px;border-radius:16px;margin-top:10px;border:1px solid var(--stroke2)}#p6 .pin {background:var(--card2);border:1px solid var(--stroke2);border-radius:12px;margin-top:10px;overflow:hidden}#p6 .pin-head {padding:12px;display:flex;justify-content:space-between;gap:10px;cursor:pointer}#p6 .pin-title {font-weight:900}#p6 .pin-sub {color:var(--subCard);font-size:13px;margin-top:4px}#p6 .pin-.pin.open .pin-.pin img {width:100%;border-radius:10px;margin-top:8px}#p6 .pin-actions {display:flex;gap:8px;margin-top:10px}#p6 .pin-actions button {flex:1;padding:10px;border:none;border-radius:10px;font-weight:900;cursor:pointer}#p6 .find-btn, #p6 .delete-btn {background:var(--card);color:var(--text);border:1px solid var(--stroke2)}#p6 .find-btn.active {background:var(--red);color:#fff}#p6 .badge {display:inline-block;padding:4px 8px;border-radius:999px;font-size:12px;font-weight:900}#p6 .badge-red {background:var(--red);color:#fff}#p6 .pulse-wrap {position:relative;width:24px;height:24px}#p6 .pulse-dot {position:absolute;left:50%;top:50%;width:14px;height:14px;background:#ff5a5f;border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 8px rgba(255,90,95,.45)}#p6 .pulse-ring {position:absolute;left:50%;top:50%;width:14px;height:14px;border:2px solid rgba(255,90,95,.85);border-radius:50%;transform:translate(-50%,-50%);animation:pulseMarker 1.7s infinite ease-out}@keyframes pulseMarker{0%{width:14px;height:14px;opacity:.9}100%{width:34px;height:34px;opacity:0}}#p6 .result-card {margin-top:14px;padding:18px;border-radius:16px;background:var(--card);border:1px solid var(--stroke);box-shadow:var(--shadow)}#p6 .result-label {color:var(--subCard);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}#p6 .result-big {margin-top:6px;font-size:42px;line-height:1;font-weight:1000}#p6 .result-unit {font-size:18px;color:var(--subCard);margin-left:6px;font-weight:700}#p6 .bar-wrap {margin-top:16px}#p6 .bar-head {display:flex;justify-content:space-between;gap:10px;color:var(--subCard);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}#p6 .bar-track {width:100%;height:18px;background:#111;border:1px solid var(--stroke2);border-radius:999px;overflow:hidden}#p6 .bar-fill {height:100%;width:0%;background:linear-gradient(90deg,var(--green),var(--gold),var(--red));border-radius:999px;transition:width .25s ease}#p6 .result-grid {display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}#p6 .stat-box {background:var(--card2);border:1px solid var(--stroke2);border-radius:14px;padding:12px}#p6 .stat-title {color:var(--subCard);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}#p6 .stat-value {margin-top:6px;font-size:22px;font-weight:1000}#p6 .math-note {margin-top:14px;color:var(--subCard);font-size:.86rem;line-height:1.45}#p6 .warning-box {margin-top:14px;padding:12px;border-radius:12px;background:rgba(255,68,68,.10);border:1px solid rgba(255,68,68,.4);color:var(--red);font-size:.9rem;font-weight:900;line-height:1.4}#p6 .delta-wrap {margin-top:12px;padding:14px;border-radius:14px;background:var(--card2);border:1px solid var(--stroke2)}#p6 .delta-big {font-size:28px;font-weight:1000}#p6 .delta-direction {margin-top:8px;font-size:18px;font-weight:1000}#p6 .midpoint-box {margin-top:12px;padding:12px;border-radius:12px;background:var(--card);border:1px solid var(--stroke2)}#p6 .midpoint-label {color:var(--subCard);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}#p6 .midpoint-value {margin-top:6px;font-size:24px;font-weight:1000;color:var(--gold)}#p6 .abbr-list {margin-top:12px;display:grid;gap:10px}#p6 .abbr-item {background:var(--card2);border:1px solid var(--stroke2);border-radius:14px;padding:12px}#p6 .abbr-top {display:flex;justify-content:space-between;align-items:center;gap:12px}#p6 .abbr-code {font-size:20px;font-weight:1000;color:var(--gold)}#p6 .abbr-meaning {margin-top:6px;color:var(--text);font-size:15px;font-weight:700}#p6 .copy-status {margin-top:10px;color:var(--green);font-size:14px;font-weight:700;min-height:20px}#p6 .snap-row {display:flex;gap:8px;margin-top:10px}#p6 .snap-btn {flex:1;padding:12px}#p6 .panel-sheet {background:#fff;color:#111;border-radius:14px;padding:14px}#p6 .panel-sheet-header {display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}#p6 .panel-sheet-title {font-size:22px;font-weight:1000}#p6 .panel-meta {font-size:14px;font-weight:700}#p6 .panel-table {width:100%;border-collapse:collapse;margin-top:10px}#p6 .panel-table th, #p6 .panel-table td {border:1px solid #c9ced6;padding:8px;text-align:left;vertical-align:middle}#p6 .panel-table th {background:#eef2f7;font-size:12px;text-transform:uppercase;letter-spacing:.04em}#p6 .panel-table .breaker-col {width:64px;font-weight:1000}#p6 .panel-table .poles-col {width:88px}#p6 .panel-table .desc-col {min-width:180px}#p6 .panel-table .side-head {text-align:center;background:#dde5ef;font-size:11px}#p6 .panel-table input, #p6 .panel-table select {margin-top:0;background:#fff;color:#111;border:1px solid #c9ced6;padding:10px;border-radius:8px;font-size:14px}#p6 .po-occupied {background:#f3f4f6!important;color:#6b7280!important}
@media (max-width:700px){
  .grid-2,.result-grid,.grid-3{grid-template-columns:1fr}
  .row,.small-tabs,.actions,.snap-row{flex-direction:column}
  .result-big{font-size:34px}
  .big{font-size:24px}
  .header-row{padding-top:0}
  .top-nav{gap:8px;padding-top:0;padding-bottom:10px}
  .nav-btn{min-width:148px;padding:10px 14px;font-size:12.5px}
}

/* P6 map sizing (needed since we stripped :root) */
#p6 #upm-map{
  height: 460px;
  border-radius: 12px;
  overflow: hidden;
  background: var(--card2);
}
#p6 .pulse-wrap{ position:relative; width:24px; height:24px; }
#p6 .pulse-ring{ position:absolute; inset:0; border-radius:50%; border:2px solid #ff5a5f; animation: p6Pulse 1.5s ease-out infinite; }
#p6 .pulse-dot{ position:absolute; inset:7px; background:#ff5a5f; border-radius:50%; }
@keyframes p6Pulse{ 0%{transform:scale(.6);opacity:1;} 100%{transform:scale(2);opacity:0;} }

/* P6 tool-tile grid (new - matches P4 style) */
#p6 .p6-tilegrid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:8px;
  margin:6px 0 16px;
}
#p6 .p6-tile{
  all:unset;
  box-sizing:border-box;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-height:62px;
  padding:10px 6px;
  border-radius:14px;
  background:var(--card);
  border:1px solid var(--stroke);
  text-align:center;
  transition:transform .14s ease, background .18s ease, box-shadow .18s ease;
  box-shadow:0 4px 10px rgba(0,0,0,.06);
}
#p6 .p6-tile:active{ transform:scale(.97); }
#p6 .p6-tile-ico{
  font-size:.95rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1;
  letter-spacing:.3px;
  text-transform:uppercase;
  opacity:.85;
}
#p6 .p6-tile-lbl{
  font-size:.66rem;
  font-weight:1000;
  letter-spacing:.3px;
  color:var(--text);
  line-height:1.1;
}
#p6 .p6-tile.active{
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  border-color:transparent;
  box-shadow:0 6px 14px rgba(255,204,0,.14), 0 0 0 1px rgba(255,204,0,.20) inset;
  transform:translateY(-1px);
}
#p6 .p6-tile.active .p6-tile-ico,
#p6 .p6-tile.active .p6-tile-lbl{
  color:#1a1200;
}
html[data-theme="light"] #p6 .p6-tile{
  box-shadow:0 8px 16px rgba(15,23,42,.06);
}

/* Hide the original top-nav since we use tile grid instead */
#p6 .top-nav{ display:none !important; }

/* P6 Tier 1 polish - empty states */
#p6 .upm-empty{
  text-align:center;
  padding:20px 12px;
  color:var(--subCard);
}
#p6 .upm-empty-ico{
  font-size:2.2rem;
  line-height:1;
  opacity:.55;
  margin-bottom:8px;
}
#p6 .upm-empty-title{
  font-size:1rem;
  font-weight:1000;
  color:var(--text);
  margin-bottom:4px;
  letter-spacing:-.2px;
}
#p6 .upm-empty-sub{
  font-size:.85rem;
  color:var(--subCard);
  line-height:1.4;
  max-width:320px;
  margin:0 auto;
}
#p6 .upm-empty-sub b{ color:var(--text); font-weight:1000; }

/* P6 Tier 1 polish - styled file input trigger */
#p6 .p6-file-trigger{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  padding:14px;
  margin-top:8px;
  background:var(--card2);
  border:1px dashed var(--stroke2);
  border-radius:14px;
  cursor:pointer;
  transition:border-color .16s ease, background .16s ease, transform .16s ease;
  -webkit-tap-highlight-color:transparent;
}
#p6 .p6-file-trigger:hover{
  border-color:rgba(255,204,0,.55);
  background:var(--card);
}
#p6 .p6-file-trigger:active{ transform:scale(.99); }
#p6 .p6-file-ico{
  font-size:1.4rem;
  line-height:1;
  flex:0 0 auto;
}
#p6 .p6-file-text{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
  flex:1;
}
#p6 .p6-file-main{
  font-size:.92rem;
  font-weight:1000;
  color:var(--text);
  line-height:1.2;
}
#p6 .p6-file-sub{
  font-size:.78rem;
  font-weight:700;
  color:var(--subCard);
  line-height:1.2;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* P6 Tier 2 - collapsible disclosure for fine-print help */
#p6 .p6-disclosure{
  margin-top:12px;
  border:1px solid var(--stroke2);
  border-radius:12px;
  background:var(--card2);
  overflow:hidden;
}
#p6 .p6-disclosure > summary{
  cursor:pointer;
  padding:12px 14px;
  font-size:.82rem;
  font-weight:1000;
  color:var(--subCard);
  list-style:none;
  position:relative;
  padding-right:38px;
  -webkit-tap-highlight-color:transparent;
}
#p6 .p6-disclosure > summary::-webkit-details-marker{ display:none; }
#p6 .p6-disclosure > summary::after{
  content:"+";
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  font-size:1.1rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1;
}
#p6 .p6-disclosure[open] > summary::after{ content:"\2212"; }
#p6 .p6-disclosure[open] > summary{ color:var(--text); border-bottom:1px solid var(--stroke2); }
#p6 .p6-disclosure-body{
  padding:12px 14px;
  font-size:.82rem;
  line-height:1.45;
  color:var(--subCard);
}

/* ============ P7 Tier 2 polish ============ */
/* Collapsible disclosure (same pattern as P6) */
#p7 .p7-disclosure{
  margin-top:12px;
  border:1px solid var(--stroke2);
  border-radius:12px;
  background:var(--card2);
  overflow:hidden;
}
#p7 .p7-disclosure > summary{
  cursor:pointer;
  padding:12px 14px;
  font-size:.82rem;
  font-weight:1000;
  color:var(--subCard);
  list-style:none;
  position:relative;
  padding-right:38px;
  -webkit-tap-highlight-color:transparent;
}
#p7 .p7-disclosure > summary::-webkit-details-marker{ display:none; }
#p7 .p7-disclosure > summary::after{
  content:"+";
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  font-size:1.1rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1;
}
#p7 .p7-disclosure[open] > summary::after{ content:"\2212"; }
#p7 .p7-disclosure[open] > summary{ color:var(--text); border-bottom:1px solid var(--stroke2); }
#p7 .p7-disclosure-body{
  padding:12px 14px;
  font-size:.82rem;
  line-height:1.45;
  color:var(--subCard);
}

/* Result card (mirrors P6 big output) */
#p7 .p7-result-card{
  margin-top:14px;
  padding:18px;
  border-radius:16px;
  background:var(--card);
  border:1px solid var(--stroke);
  box-shadow:var(--shadow);
}
#p7 .p7-result-label{
  color:var(--subCard);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#p7 .p7-result-big{
  margin-top:6px;
  font-size:38px;
  line-height:1.05;
  font-weight:1000;
  word-break:break-word;
}
#p7 .p7-result-unit{
  font-size:18px;
  color:var(--subCard);
  margin-left:6px;
  font-weight:700;
}
#p7 .p7-result-note{
  margin-top:14px;
  color:var(--subCard);
  font-size:.86rem;
  line-height:1.45;
}
#p7 .p7-result-rule{
  margin-top:10px;
  padding:10px 12px;
  border-radius:10px;
  background:rgba(255,204,0,0.08);
  border:1px solid rgba(255,204,0,0.28);
  color:var(--gold);
  font-size:.88rem;
  font-weight:700;
  line-height:1.4;
}
#p7 .p7-result-error{
  margin-top:10px;
  padding:12px;
  border-radius:12px;
  background:rgba(255,68,68,.10);
  border:1px solid rgba(255,68,68,.4);
  color:var(--red);
  font-size:.9rem;
  font-weight:900;
  line-height:1.4;
}

/* NEC reference badge */
#p7 .p7-nec-ref{
  display:inline-block;
  margin-top:12px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,204,0,0.10);
  border:1px solid rgba(255,204,0,0.32);
  color:var(--gold);
  font-size:.72rem;
  font-weight:1000;
  letter-spacing:.04em;
  text-transform:uppercase;
}

/* Empty state for result boxes before first calc */
#p7 .p7-empty{
  text-align:center;
  padding:20px;
  color:var(--subCard);
}
#p7 .p7-empty-ico{ font-size:28px; opacity:.5; }
#p7 .p7-empty-title{ margin-top:6px; font-weight:900; color:var(--text); }
#p7 .p7-empty-sub{ margin-top:4px; font-size:.86rem; line-height:1.4; }

/* Status pill for pass/fail outcomes (Ground Rod) */
#p7 .p7-status-pill{
  display:inline-block;
  margin-top:8px;
  padding:6px 14px;
  border-radius:999px;
  font-size:.82rem;
  font-weight:1000;
  letter-spacing:.04em;
  text-transform:uppercase;
}
#p7 .p7-status-pass{
  background:rgba(46,204,113,0.12);
  border:1px solid rgba(46,204,113,0.5);
  color:var(--green);
}
#p7 .p7-status-fail{
  background:rgba(255,68,68,0.10);
  border:1px solid rgba(255,68,68,0.5);
  color:var(--red);
}

/* Stat pair (for rod: measured + rule) */
#p7 .p7-stat-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:14px;
}
#p7 .p7-stat-box{
  background:var(--card2);
  border:1px solid var(--stroke2);
  border-radius:14px;
  padding:12px;
}
#p7 .p7-stat-title{
  color:var(--subCard);
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}
#p7 .p7-stat-value{
  margin-top:6px;
  font-size:20px;
  font-weight:1000;
  word-break:break-word;
}

/* P7 hero tile grid (mirrors P6 pattern) */
#p7 .p7-tilegrid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:8px;
  margin:6px 0 16px;
}
#p7 .p7-tile{
  all:unset;
  box-sizing:border-box;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-height:62px;
  padding:10px 6px;
  border-radius:14px;
  background:var(--card);
  border:1px solid var(--stroke);
  text-align:center;
  transition:transform .14s ease, background .18s ease, box-shadow .18s ease;
  box-shadow:0 4px 10px rgba(0,0,0,.06);
}
#p7 .p7-tile:active{ transform:scale(.97); }
#p7 .p7-tile-ico{
  font-size:.95rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1;
  letter-spacing:.3px;
  text-transform:uppercase;
  opacity:.85;
}
#p7 .p7-tile-lbl{
  font-size:.66rem;
  font-weight:1000;
  letter-spacing:.3px;
  color:var(--text);
  line-height:1.1;
}
#p7 .p7-tile.active{
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  border-color:transparent;
  box-shadow:0 6px 14px rgba(255,204,0,.14), 0 0 0 1px rgba(255,204,0,.20) inset;
  transform:translateY(-1px);
}
#p7 .p7-tile.active .p7-tile-ico,
#p7 .p7-tile.active .p7-tile-lbl{
  color:#1a1200;
}
html[data-theme="light"] #p7 .p7-tile{
  box-shadow:0 8px 16px rgba(15,23,42,.06);
}
/* Hide original pill tabs - the new tile grid replaces them */
#p7 .calc-tabs{ display:none !important; }

/* ============ P8 Tier 2 polish ============ */
/* Category tile grid (2 tiles - Terminations / Bolts) */
#p8 .p8-tilegrid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:8px;
  margin:6px 0 16px;
}
#p8 .p8-tile{
  all:unset;
  box-sizing:border-box;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-height:62px;
  padding:10px 6px;
  border-radius:14px;
  background:var(--card);
  border:1px solid var(--stroke);
  text-align:center;
  transition:transform .14s ease, background .18s ease, box-shadow .18s ease;
  box-shadow:0 4px 10px rgba(0,0,0,.06);
}
#p8 .p8-tile:active{ transform:scale(.97); }
#p8 .p8-tile-ico{
  font-size:.95rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1;
  letter-spacing:.3px;
  text-transform:uppercase;
  opacity:.85;
}
#p8 .p8-tile-lbl{
  font-size:.66rem;
  font-weight:1000;
  letter-spacing:.3px;
  color:var(--text);
  line-height:1.1;
}
#p8 .p8-tile.active{
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  border-color:transparent;
  box-shadow:0 6px 14px rgba(255,204,0,.14), 0 0 0 1px rgba(255,204,0,.20) inset;
  transform:translateY(-1px);
}
#p8 .p8-tile.active .p8-tile-ico,
#p8 .p8-tile.active .p8-tile-lbl{
  color:#1a1200;
}
html[data-theme="light"] #p8 .p8-tile{
  box-shadow:0 8px 16px rgba(15,23,42,.06);
}

/* Disclosure (same pattern as P6/P7) */
#p8 .p8-disclosure{
  margin-top:12px;
  border:1px solid var(--stroke2);
  border-radius:12px;
  background:var(--card2);
  overflow:hidden;
}
#p8 .p8-disclosure > summary{
  cursor:pointer;
  padding:12px 14px;
  font-size:.82rem;
  font-weight:1000;
  color:var(--subCard);
  list-style:none;
  position:relative;
  padding-right:38px;
  -webkit-tap-highlight-color:transparent;
}
#p8 .p8-disclosure > summary::-webkit-details-marker{ display:none; }
#p8 .p8-disclosure > summary::after{
  content:"+";
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  font-size:1.1rem;
  font-weight:1000;
  color:var(--gold);
  line-height:1;
}
#p8 .p8-disclosure[open] > summary::after{ content:"\2212"; }
#p8 .p8-disclosure[open] > summary{ color:var(--text); border-bottom:1px solid var(--stroke2); }
#p8 .p8-disclosure-body{
  padding:12px 14px;
  font-size:.82rem;
  line-height:1.45;
  color:var(--subCard);
}

/* NEC reference badge */
#p8 .p8-nec-ref{
  display:inline-block;
  margin-top:12px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,204,0,0.10);
  border:1px solid rgba(255,204,0,0.32);
  color:var(--gold);
  font-size:.72rem;
  font-weight:1000;
  letter-spacing:.04em;
  text-transform:uppercase;
}

/* Empty state for torque result */
#p8 .p8-empty{
  text-align:center;
  padding:20px;
  color:var(--subCard);
}
#p8 .p8-empty-ico{ font-size:28px; opacity:.5; }
#p8 .p8-empty-title{ margin-top:6px; font-weight:900; color:var(--text); }
#p8 .p8-empty-sub{ margin-top:4px; font-size:.86rem; line-height:1.4; }

/* ============ P9 Arc Flash / NFPA 70E ============ */
#p9 .af-search-wrap{
  position:relative;
  margin-bottom:14px;
}
#p9 .af-search{
  width:100%;
  padding:13px 16px 13px 42px;
  background:var(--card);
  border:1.5px solid var(--stroke2);
  border-radius:14px;
  color:var(--text);
  font-size:.95rem;
  font-weight:700;
  outline:none;
  transition:border-color .2s, box-shadow .2s;
}
#p9 .af-search:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(255,204,0,.10);
}
#p9 .af-search::placeholder{ color:var(--sub); font-weight:600; }
#p9 .af-search-icon{
  position:absolute;
  left:14px; top:50%;
  transform:translateY(-50%);
  font-size:1rem;
  pointer-events:none;
  opacity:.5;
}
#p9 .af-tabs{
  display:flex;
  gap:6px;
  margin-bottom:14px;
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:14px;
  padding:4px;
}
#p9 .af-tab{
  flex:1;
  padding:10px 6px;
  border:none;
  border-radius:11px;
  background:transparent;
  color:var(--sub);
  font-size:.72rem;
  font-weight:1000;
  letter-spacing:.5px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all .18s;
  line-height:1.2;
  text-align:center;
}
#p9 .af-tab.active{
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  color:#000;
  box-shadow:0 4px 12px rgba(255,204,0,.22);
}
#p9 .af-result-card{
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:16px;
  overflow:hidden;
  margin-bottom:10px;
  box-shadow:var(--shadow);
  cursor:pointer;
  transition:border-color .18s, transform .12s;
}
#p9 .af-result-card:active{ transform:scale(.99); }
#p9 .af-result-card.expanded{ border-color:rgba(255,204,0,.35); }
#p9 .af-card-head{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
}
#p9 .af-ppe-badge{
  flex-shrink:0;
  width:44px; height:44px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.8rem;
  font-weight:1000;
  letter-spacing:.5px;
  text-transform:uppercase;
}
#p9 .af-ppe-badge.cat0{ background:rgba(46,204,113,.15); color:#2ecc71; border:1.5px solid rgba(46,204,113,.3); }
#p9 .af-ppe-badge.cat1{ background:rgba(255,204,0,.12); color:var(--gold); border:1.5px solid rgba(255,204,0,.3); }
#p9 .af-ppe-badge.cat2{ background:rgba(255,153,0,.12); color:var(--gold2); border:1.5px solid rgba(255,153,0,.3); }
#p9 .af-ppe-badge.cat3{ background:rgba(255,100,0,.12); color:#ff6400; border:1.5px solid rgba(255,100,0,.3); }
#p9 .af-ppe-badge.cat4{ background:rgba(255,68,68,.12); color:var(--red); border:1.5px solid rgba(255,68,68,.3); }
#p9 .af-card-title{
  flex:1;
  font-size:.9rem;
  font-weight:1000;
  color:var(--text);
  line-height:1.25;
}
#p9 .af-card-sub{
  font-size:.72rem;
  color:var(--sub);
  font-weight:700;
  margin-top:2px;
}
#p9 .af-card-chevron{
  color:var(--sub);
  font-size:.8rem;
  transition:transform .2s;
  flex-shrink:0;
}
#p9 .af-result-card.expanded .af-card-chevron{ transform:rotate(90deg); }
#p9 .af-card-body{
  display:none;
  padding:0 16px 16px;
  border-top:1px solid var(--stroke2);
  margin-top:0;
}
#p9 .af-result-card.expanded .af-card-body{ display:block; }
#p9 .af-ppe-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:14px 0 12px;
}
#p9 .af-ppe-item{
  background:var(--card2);
  border:1px solid var(--stroke);
  border-radius:12px;
  padding:12px;
}
#p9 .af-ppe-item-label{
  font-size:.65rem;
  font-weight:1000;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--sub);
  margin-bottom:4px;
}
#p9 .af-ppe-item-val{
  font-size:.88rem;
  font-weight:900;
  color:var(--text);
  line-height:1.3;
}
#p9 .af-ref-pill{
  display:inline-block;
  margin-top:8px;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(255,204,0,.08);
  border:1px solid rgba(255,204,0,.2);
  color:var(--gold);
  font-size:.65rem;
  font-weight:1000;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#p9 .af-warning-box{
  background:rgba(255,68,68,.06);
  border:1px solid rgba(255,68,68,.25);
  border-radius:12px;
  padding:12px 14px;
  margin-top:10px;
  font-size:.78rem;
  color:var(--subCard);
  line-height:1.5;
}
#p9 .af-warning-box strong{ color:var(--red); }
#p9 .af-disclaimer{
  margin-top:16px;
  padding:12px 14px;
  border-radius:12px;
  background:var(--card2);
  border:1px dashed var(--stroke2);
  color:var(--sub);
  font-size:.7rem;
  line-height:1.5;
  text-align:center;
}
#p9 .af-empty{
  text-align:center;
  padding:40px 20px;
  color:var(--sub);
  font-size:.88rem;
  font-weight:700;
}
#p9 .af-count-chip{
  display:inline-block;
  padding:3px 10px;
  border-radius:999px;
  background:rgba(255,204,0,.08);
  border:1px solid rgba(255,204,0,.15);
  color:var(--gold);
  font-size:.68rem;
  font-weight:1000;
  letter-spacing:.5px;
  text-transform:uppercase;
  margin-bottom:12px;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 3/35: anonymous-2 */
/* ───────────────────────────────────────────────────────────────────── */
    /* v4.44.4 F1: comment sheet must overlay everything including dock */
    #busbar-comment-sheet{
      position:fixed !important;
      inset:0 !important;
      z-index:10100 !important;
      display:none;
    }
    #busbar-comment-sheet.show{display:block !important;}
    #busbar-comment-sheet .v413-mask{
      position:absolute;inset:0;z-index:1;
    }
    #busbar-comment-sheet .v413-inner{
      position:absolute;left:50%;transform:translateX(-50%);z-index:2;
      bottom:calc(env(safe-area-inset-bottom) + 24px);
      width:min(720px, calc(100% - 22px - env(safe-area-inset-left) - env(safe-area-inset-right)));
      max-height:min(82vh, 760px);
      background:linear-gradient(180deg,#17181d 0%, #111216 100%);
      border:1px solid rgba(255,255,255,.08);
      border-radius:24px;
      box-shadow:0 24px 60px rgba(0,0,0,.45);
      padding:18px;
      display:flex;flex-direction:column;gap:14px;
      box-sizing:border-box;
    }
    #busbar-comment-sheet .v413-head{
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      flex-shrink:0;
    }
    #busbar-comment-sheet .v413-title{
      font-weight:1000;font-size:1.05rem;color:#fff;
    }
    #busbar-comment-sheet .v413-close{
      width:44px;height:44px;border-radius:14px;
      border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);
      color:#fff;font-size:1.1rem;flex-shrink:0;cursor:pointer;
      display:flex;align-items:center;justify-content:center;
      padding:0;
    }
    #busbar-comment-sheet .v413-list{
      flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;
      min-height:80px;max-height:38vh;
      padding:4px 0;display:flex;flex-direction:column;gap:10px;
    }
    #busbar-comment-sheet .v413-empty{
      color:#888;font-size:.92rem;text-align:center;padding:40px 16px;
      background:rgba(255,255,255,.02);border-radius:12px;border:1px solid rgba(255,255,255,.05);
    }
    #busbar-comment-sheet .v413-row{
      display:flex;flex-direction:column;gap:6px;
      padding:12px;border-radius:12px;background:rgba(255,255,255,.03);
      border:1px solid rgba(255,255,255,.06);
      position:relative;
    }
    #busbar-comment-sheet .v413-row-head{
      display:flex;align-items:center;justify-content:space-between;gap:8px;
    }
    #busbar-comment-sheet .v413-row .v413-name{
      font-weight:900;font-size:.85rem;color:#fff;
    }
    #busbar-comment-sheet .v413-row .v413-body{
      font-size:.94rem;color:#d9d9df;line-height:1.45;white-space:pre-wrap;word-break:break-word;
    }
    #busbar-comment-sheet .v413-row .v413-time{
      font-size:.7rem;color:#888;
    }
    #busbar-comment-sheet .v413-row .v413-del{
      background:transparent;border:1px solid rgba(255,80,80,.3);
      color:#ff7676;padding:3px 8px;border-radius:8px;
      font-size:.65rem;font-weight:800;cursor:pointer;
    }
    #busbar-comment-sheet .v413-compose{
      flex-shrink:0;
      display:flex;flex-direction:column;gap:8px;
      padding-top:12px;border-top:1px solid rgba(255,255,255,.06);
    }
    #busbar-comment-sheet .v413-input{
      width:100%;box-sizing:border-box;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.10);
      border-radius:12px;
      padding:12px 14px;
      color:#fff;font-size:.95rem;
      resize:none;min-height:60px;max-height:120px;
      font-family:inherit;line-height:1.4;
      pointer-events:auto !important;
      -webkit-user-select:text !important;user-select:text !important;
      touch-action:manipulation !important;
    }
    #busbar-comment-sheet .v413-input:focus{
      outline:none;border-color:rgba(255,204,0,.5);
    }
    #busbar-comment-sheet .v413-compose-row{
      display:flex;align-items:center;justify-content:space-between;gap:12px;
    }
    #busbar-comment-sheet .v413-cap{
      font-size:.75rem;color:#888;
    }
    #busbar-comment-sheet .v413-send{
      background:linear-gradient(135deg,#ffcc00,#e6b800);color:#000;
      border:none;border-radius:12px;
      padding:11px 22px;
      font-weight:1000;font-size:.88rem;cursor:pointer;
      flex-shrink:0;
    }
    #busbar-comment-sheet .v413-send:disabled{
      opacity:.5;cursor:not-allowed;
    }
  

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 4/35: anonymous-3 */
/* ───────────────────────────────────────────────────────────────────── */
    #busbar-dm-sheet.show{display:block !important;}
    #busbar-dm-sheet .v422-mask{
      position:absolute;inset:0;z-index:1;
    }
    #busbar-dm-sheet .v422-inner{
      position:absolute;left:50%;transform:translateX(-50%);z-index:2;
      bottom:calc(env(safe-area-inset-bottom) + 24px);
      width:min(720px, calc(100% - 22px - env(safe-area-inset-left) - env(safe-area-inset-right)));
      max-height:min(82vh, 760px);
      background:linear-gradient(180deg,#17181d 0%, #111216 100%);
      border:1px solid rgba(255,255,255,.08);
      border-radius:24px;
      box-shadow:0 24px 60px rgba(0,0,0,.45);
      padding:18px;
      display:flex;flex-direction:column;gap:14px;
      box-sizing:border-box;
    }
    #busbar-dm-sheet .v422-head{
      display:flex;align-items:center;gap:12px;flex-shrink:0;
    }
    #busbar-dm-sheet .v422-avatar{
      width:44px;height:44px;border-radius:50%;
      background:linear-gradient(135deg,#ffcc00,#e6b800);
      color:#000;font-weight:1000;font-size:.95rem;
      display:flex;align-items:center;justify-content:center;
      flex-shrink:0;background-color:#1a1a1a;
    }
    #busbar-dm-sheet .v422-meta{
      flex:1;min-width:0;
    }
    #busbar-dm-sheet .v422-name{
      font-weight:1000;font-size:1rem;color:#fff;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
    #busbar-dm-sheet .v422-handle{
      font-size:.72rem;color:#888;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
    #busbar-dm-sheet .v422-status{
      font-size:.65rem;color:#22c55e;
      margin-top:2px;
    }
    #busbar-dm-sheet .v422-close{
      width:44px;height:44px;border-radius:14px;
      border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);
      color:#fff;font-size:1.1rem;flex-shrink:0;cursor:pointer;
      display:flex;align-items:center;justify-content:center;padding:0;
    }
    #busbar-dm-sheet .v422-thread{
      flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;
      min-height:120px;max-height:50vh;
      padding:4px 0;display:flex;flex-direction:column;gap:8px;
    }
    #busbar-dm-sheet .v422-empty{
      color:#888;font-size:.92rem;text-align:center;padding:40px 16px;
      background:rgba(255,255,255,.02);border-radius:12px;
      border:1px solid rgba(255,255,255,.05);
    }
    #busbar-dm-sheet .busbar-msg-thread{
      display:flex;flex-direction:column;gap:8px;
    }
    #busbar-dm-sheet .busbar-msg-row{
      display:flex;
    }
    #busbar-dm-sheet .busbar-msg-row.in{ justify-content:flex-start; }
    #busbar-dm-sheet .busbar-msg-row.out{ justify-content:flex-end; }
    #busbar-dm-sheet .busbar-msg-bubble{
      max-width:78%;padding:10px 14px;border-radius:16px;
      font-size:.92rem;line-height:1.4;word-break:break-word;
    }
    #busbar-dm-sheet .busbar-msg-bubble.out{
      background:linear-gradient(135deg,#ffcc00,#e6b800);color:#000;
      border-bottom-right-radius:4px;
    }
    #busbar-dm-sheet .busbar-msg-bubble.in{
      background:rgba(255,255,255,.06);color:#fff;
      border:1px solid rgba(255,255,255,.08);
      border-bottom-left-radius:4px;
    }
    #busbar-dm-sheet .busbar-msg-meta{
      font-size:.62rem;opacity:.65;margin-top:3px;
    }
    #busbar-dm-sheet .v422-compose{
      flex-shrink:0;display:flex;align-items:center;gap:8px;
      padding-top:12px;border-top:1px solid rgba(255,255,255,.06);
    }
    #busbar-dm-sheet .v422-input{
      flex:1;background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.10);border-radius:12px;
      padding:11px 14px;color:#fff;font-size:.95rem;
      font-family:inherit;
      pointer-events:auto !important;
      -webkit-user-select:text !important;user-select:text !important;
      touch-action:manipulation !important;
    }
    #busbar-dm-sheet .v422-input:focus{
      outline:none;border-color:rgba(255,204,0,.5);
    }
    #busbar-dm-sheet .v422-send{
      background:linear-gradient(135deg,#ffcc00,#e6b800);color:#000;
      border:none;border-radius:12px;
      padding:11px 18px;font-weight:1000;font-size:.88rem;cursor:pointer;
      flex-shrink:0;
    }
  

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 5/35: anonymous-4 */
/* ───────────────────────────────────────────────────────────────────── */
    #busbar-profile-preview-sheet.show{display:block !important;}
    #busbar-profile-preview-sheet .busbar-profile-preview-inner{
      position:absolute;left:50%;transform:translateX(-50%);
      /* v4_14: was 96px+70vh which clipped the X on iPhone. Match comment sheet (24px+88vh). */
      bottom:calc(env(safe-area-inset-bottom) + 24px);
      width:min(720px, calc(100% - 22px - env(safe-area-inset-left) - env(safe-area-inset-right)));
      max-height:88vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
      background:linear-gradient(180deg,#17181d 0%, #111216 100%);
      border:1px solid rgba(255,255,255,.08);
      border-radius:24px;box-shadow:0 24px 60px rgba(0,0,0,.45);
      padding:18px;box-sizing:border-box;
    }
    /* v4_14: tablet/desktop keep more breathing room from bottom */
    @media (min-width:768px){
      #busbar-profile-preview-sheet .busbar-profile-preview-inner{
        bottom:calc(env(safe-area-inset-bottom) + 96px);
        max-height:min(70vh, 720px);
      }
    }
    #busbar-profile-preview-sheet .busbar-profile-preview-head{
      display:flex;align-items:center;justify-content:flex-end;margin-bottom:8px;
    }
    #busbar-profile-preview-sheet .busbar-comment-close{
      width:44px;height:44px;border-radius:14px;
      border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);
      color:#fff;font-size:1.1rem;cursor:pointer;
    }
  

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 6/35: anonymous-5 */
/* ───────────────────────────────────────────────────────────────────── */
    #busbar-user-work-sheet.show{display:block !important;}
    #busbar-user-work-sheet .busbar-uws-mask{
      position:absolute;inset:0;z-index:1;
    }
    #busbar-user-work-sheet .busbar-uws-inner{
      position:absolute;left:50%;transform:translateX(-50%);z-index:2;
      bottom:calc(env(safe-area-inset-bottom) + 24px);
      width:min(720px, calc(100% - 22px - env(safe-area-inset-left) - env(safe-area-inset-right)));
      max-height:88vh;
      background:linear-gradient(180deg,#17181d 0%, #111216 100%);
      border:1px solid rgba(255,255,255,.08);
      border-radius:24px;box-shadow:0 24px 60px rgba(0,0,0,.45);
      box-sizing:border-box;
      display:flex;flex-direction:column;overflow:hidden;
    }
    @media (min-width:768px){
      #busbar-user-work-sheet .busbar-uws-inner{
        bottom:calc(env(safe-area-inset-bottom) + 96px);
        max-height:min(76vh, 760px);
      }
    }
    /* Sticky header — close X always visible, never scrolls away. */
    #busbar-user-work-sheet .busbar-uws-head{
      flex:0 0 auto;
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      padding:14px 16px;
      background:linear-gradient(180deg,#1a1b21 0%, #15161b 100%);
      border-bottom:1px solid rgba(255,255,255,.08);
      border-radius:24px 24px 0 0;
    }
    #busbar-user-work-sheet .busbar-uws-title{
      font-size:1.05rem;font-weight:900;color:#fff;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      flex:1 1 auto;min-width:0;
    }
    #busbar-user-work-sheet .busbar-uws-count{
      flex:0 0 auto;font-size:.78rem;color:#a8a9b0;
      background:rgba(255,255,255,.06);
      padding:4px 10px;border-radius:999px;
    }
    #busbar-user-work-sheet .busbar-uws-close{
      flex:0 0 auto;
      width:44px;height:44px;border-radius:14px;
      border:1px solid rgba(255,255,255,.10);
      background:rgba(255,255,255,.06);
      color:#fff;font-size:1.1rem;cursor:pointer;
      display:flex;align-items:center;justify-content:center;
    }
    #busbar-user-work-sheet .busbar-uws-close:active{transform:scale(.95);}
    /* Scrollable body */
    #busbar-user-work-sheet .busbar-uws-body{
      flex:1 1 auto;
      overflow-y:auto;-webkit-overflow-scrolling:touch;
      padding:14px 14px calc(env(safe-area-inset-bottom) + 14px);
    }
    #busbar-user-work-sheet .busbar-uws-empty{
      text-align:center;padding:60px 20px;color:#9ea0a8;
    }
    #busbar-user-work-sheet .busbar-uws-empty-icon{
      font-size:3rem;margin-bottom:14px;opacity:.6;
    }
    #busbar-user-work-sheet .busbar-uws-empty-title{
      font-size:1.05rem;font-weight:800;color:#cfd0d6;margin-bottom:6px;
    }
    #busbar-user-work-sheet .busbar-uws-empty-sub{
      font-size:.9rem;color:#80828a;
    }
    #busbar-user-work-sheet .busbar-uws-card{
      background:#16171c;border:1px solid rgba(255,255,255,.06);
      border-radius:16px;padding:14px;margin-bottom:12px;
    }
    #busbar-user-work-sheet .busbar-uws-card:last-child{margin-bottom:0;}
    #busbar-user-work-sheet .busbar-uws-card-meta{
      font-size:.78rem;color:#80828a;margin-bottom:8px;
    }
    #busbar-user-work-sheet .busbar-uws-card-caption{
      font-size:.95rem;color:#e6e7eb;line-height:1.45;
      word-wrap:break-word;
    }
    #busbar-user-work-sheet .busbar-uws-card-photo{
      margin-top:10px;border-radius:12px;overflow:hidden;
      background:#0d0e12;
    }
    #busbar-user-work-sheet .busbar-uws-card-photo img{
      display:block;width:100%;height:auto;max-height:360px;object-fit:cover;
    }
    #busbar-user-work-sheet .busbar-uws-card-stats{
      margin-top:10px;display:flex;gap:14px;
      font-size:.82rem;color:#a8a9b0;
    }
  

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 7/35: anonymous-6 */
/* ───────────────────────────────────────────────────────────────────── */
    #busbar-thread-sheet.show{display:block !important;}
    #busbar-thread-sheet .busbar-thread-mask{position:absolute;inset:0;z-index:1;}
    #busbar-thread-sheet .busbar-thread-inner{
      position:absolute;left:50%;transform:translateX(-50%);z-index:2;
      bottom:calc(env(safe-area-inset-bottom) + 24px);
      width:min(720px, calc(100% - 22px - env(safe-area-inset-left) - env(safe-area-inset-right)));
      max-height:88vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
      background:linear-gradient(180deg,#17181d 0%, #111216 100%);
      border:1px solid rgba(255,255,255,.08);
      border-radius:24px;box-shadow:0 24px 60px rgba(0,0,0,.45);
      padding:18px;box-sizing:border-box;
    }
    #busbar-thread-sheet .busbar-thread-head-row{
      display:flex;align-items:center;justify-content:flex-end;margin-bottom:8px;
    }
    #busbar-thread-sheet .busbar-thread-close{
      width:44px;height:44px;border-radius:14px;
      border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);
      color:#fff;font-size:1.1rem;cursor:pointer;
    }
    #busbar-thread-sheet #busbar-thread-list{padding:0;}
    #busbar-thread-sheet .busbar-thread-input{
      width:100%;background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.08);border-radius:12px;
      padding:10px 12px;color:#fff;font-size:.95rem;
      resize:none;min-height:60px;font-family:inherit;box-sizing:border-box;
      pointer-events:auto !important;-webkit-user-select:text !important;user-select:text !important;
    }
    #busbar-thread-sheet .busbar-thread-input:focus{outline:none;border-color:rgba(255,204,0,.5);}
    #busbar-thread-sheet .busbar-thread-send{
      background:linear-gradient(135deg,#ffcc00,#e6b800);color:#000;
      border:none;border-radius:12px;padding:10px 16px;
      font-weight:1000;font-size:.85rem;cursor:pointer;margin-top:8px;
    }
  

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 8/35: anonymous-7 */
/* ───────────────────────────────────────────────────────────────────── */
    #busbar-saved-sheet.show{display:block !important;}
    #busbar-saved-sheet .busbar-saved-mask{position:absolute;inset:0;z-index:1;}
    #busbar-saved-sheet .busbar-saved-inner{
      position:absolute;left:50%;transform:translateX(-50%);z-index:2;
      bottom:calc(env(safe-area-inset-bottom) + 24px);
      width:min(720px, calc(100% - 22px - env(safe-area-inset-left) - env(safe-area-inset-right)));
      max-height:88vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
      background:linear-gradient(180deg,#17181d 0%, #111216 100%);
      border:1px solid rgba(255,255,255,.08);
      border-radius:24px;box-shadow:0 24px 60px rgba(0,0,0,.45);
      padding:18px;box-sizing:border-box;
    }
    #busbar-saved-sheet .busbar-saved-head{
      display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;
    }
    #busbar-saved-sheet .busbar-saved-title{
      font-weight:1000;font-size:1.1rem;color:#fff;
    }
    #busbar-saved-sheet .busbar-saved-close{
      width:44px;height:44px;border-radius:14px;
      border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);
      color:#fff;font-size:1.1rem;cursor:pointer;
    }
  

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 9/35: anonymous-8 */
/* ───────────────────────────────────────────────────────────────────── */
.jj-photo-lightbox{
  position:fixed; inset:0; z-index:9999;
  background:rgba(0,0,0,.92);
  display:none;
  align-items:center; justify-content:center;
  padding:20px;
  -webkit-tap-highlight-color:transparent;
}
.jj-photo-lightbox.show{ display:flex; }
.jj-photo-lightbox img{
  max-width:100%; max-height:100%;
  border-radius:12px;
  box-shadow:0 30px 80px rgba(0,0,0,.5);
}
.jj-photo-lightbox-close{
  position:absolute; top:16px; right:16px;
  width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  color:#fff; font-size:1.2rem; font-weight:900;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  z-index:1;
}
.jj-photo-lightbox-close:active{ transform:scale(.94); }
/* Make journal-rendered photos look tappable */
#p9 .jj-entry-photo{ cursor:pointer; }
#p9 .jj-entry-photo img{ pointer-events:none; }

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 10/35: ampstack-v4_17-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ─────────────────────────────────────────────────────────────
   A1. COMPOSER (Create Feed Post) — fix top clipping under URL bar
   The five stacked "ULTRA COMPACT" overrides in v4_16 (lines 6671,
   6770, 6859, 6949, 7046) all set the top padding too low to clear
   iOS Safari's status bar + URL bar. We add safe-area-top padding
   here as the final word.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  #p11 .busbar-post-modal{
    padding-top: calc(env(safe-area-inset-top) + 14px) !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding-bottom: calc(env(safe-area-inset-bottom) + 16px) !important;
  }
  /* The header/title is the first thing inside the sheet. Make sure it
     never gets eaten by sticky sub-headers above it. */
  #p11 .busbar-post-modal .busbar-post-title,
  #p11 .busbar-post-modal #busbar-composer-title{
    padding-top: 4px !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   A2. EDIT PROFILE MODAL — full-screen on iPhone, bottom sheet on iPad
   v4_16 set bottom:24px + max-height:88vh which left a strip at top.
   On iPhone we lift the sheet to fill the screen; on iPad we keep
   the polished bottom-sheet feel.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  #p11 #busbar-profile-modal .busbar-post-sheet{
    /* Stretch to fit screen with safe-area awareness */
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    max-height: none !important;
    height: auto !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   A3. MINI PROFILE PREVIEW (busbar-user-profile-sheet) — same fix
   v4_16 anchored this at bottom:140px which produced the small
   floating box you screenshotted with the page bleeding through.
   On iPhone, take the full screen.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  #busbar-user-profile-sheet .busbar-user-profile-panel,
  #p11 #busbar-user-profile-sheet .busbar-user-profile-panel{
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    max-height: none !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
  }
  /* Inner content area should fill remaining space and scroll */
  #busbar-user-profile-sheet .busbar-user-profile-content{
    flex: 1 1 auto !important;
    max-height: none !important;
  }
}
/* Mini-profile preview sheet (the smaller one with Send DM button) */
@media (max-width: 430px){
  #busbar-profile-preview-sheet,
  #p11 #busbar-profile-preview-sheet{
    /* If this is the v4_16 floating preview — make it sit higher */
    align-items: center !important;
  }
  #busbar-profile-preview-sheet .busbar-post-sheet,
  #busbar-profile-preview-sheet > div:not(.busbar-post-mask):not(.busbar-thread-mask){
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    max-height: none !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   A4. SHOP TALK THREAD SHEET — full screen on iPhone
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  #busbar-thread-sheet .busbar-thread-inner{
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    transform: none !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
  }
  #busbar-thread-sheet #busbar-thread-list{
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   A5. SAVED POSTS SHEET — full screen on iPhone
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  #busbar-saved-sheet .busbar-saved-inner{
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    transform: none !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
  }
  #busbar-saved-sheet #busbar-saved-sheet-list{
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   A6. COMMENT SHEET — keep as bottom sheet (intentional for keyboard
   pop-up) but make sure it doesn't go under the dock and has enough
   headroom on iPhone. The v413- prefixed comment sheet at line 16440
   is correctly designed; we just nudge dimensions on iPhone.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  #busbar-comment-sheet .v413-inner{
    bottom: calc(env(safe-area-inset-bottom) + 14px) !important;
    width: calc(100% - 16px) !important;
    max-height: min(75vh, 640px) !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   D. VIDEOS COMING SOON pill in composer
   ───────────────────────────────────────────────────────────── */
.v17-videos-soon-pill{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  border: 1px dashed rgba(255,255,255,.18);
  color: var(--sub, #888);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .3px;
  text-transform: uppercase;
  cursor: default;
  user-select: none;
}
html[data-theme="light"] .v17-videos-soon-pill,
.light-mode .v17-videos-soon-pill{
  background: rgba(0,0,0,.03);
  border-color: rgba(0,0,0,.18);
  color: #6b7280;
}

/* ─────────────────────────────────────────────────────────────
   E. LIGHTBOX trigger on feed photos — small zoom button overlay
   The existing JJ_openPhoto lightbox is reused. We add a 🔍 button
   in the top-right of feed photos that opens the current image.
   ───────────────────────────────────────────────────────────── */
.v17-feed-zoom-btn{
  position: absolute;
  top: 10px;
  right: 10px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(0,0,0,.55);
  color: #fff;
  font-size: 1rem;
  z-index: 6;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.v17-feed-zoom-btn:active{ transform: scale(.94); }

/* ─────────────────────────────────────────────────────────────
   C. PROFILE PHOTO LATER tile — make it look tappable now that it works
   The "SOON" pill is repurposed into a "CHANGE" pill (yellow).
   ───────────────────────────────────────────────────────────── */
.p11-coming-soon.v17-active{
  background: linear-gradient(180deg,#ffd84d 0%, #f4be00 100%) !important;
  color: #000 !important;
  border: none !important;
  font-weight: 1000 !important;
  cursor: pointer !important;
}
.p11-setting-row.v17-clickable{
  cursor: pointer;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 11/35: ampstack-v4_18-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ─────────────────────────────────────────────────────────────
   1A. COMPOSER — force true edge-to-edge full-screen on iPhone
       Prefix with `body` to beat the inline `<style>` in markup,
       and target both the modal AND the inner sheet so the gap
       at the bottom (where AmpStack splash leaks through) is closed.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  body #p11 .busbar-post-modal{
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100svh !important;
    max-height: 100svh !important;
    padding: calc(env(safe-area-inset-top) + 10px) 8px calc(env(safe-area-inset-bottom) + 8px) !important;
    background: rgba(13,13,13,.98) !important;
    align-items: stretch !important;
    overflow-y: auto !important;
  }
  /* Force the inner sheet to span available height — no max-height fight */
  body #p11 .busbar-post-modal .busbar-post-sheet{
    width: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 14px !important;
    border-radius: 18px !important;
    box-sizing: border-box !important;
  }
  /* Submit button: keep it pinned at bottom of sheet so user can post
     without scrolling down past trade tags + photo box. */
  body #p11 .busbar-post-modal .busbar-modal-submit{
    position: sticky !important;
    bottom: 0 !important;
    margin-top: 14px !important;
    z-index: 10 !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   2. MINI PROFILE PREVIEW — TRUE class is .busbar-profile-preview-inner
       (v4_17 targeted .busbar-user-profile-panel which is a different
       sheet entirely). Beat inline <style> with body prefix.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  body #busbar-profile-preview-sheet .busbar-profile-preview-inner{
    position: fixed !important;
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    max-height: none !important;
    height: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   3. SHOP TALK THREAD — beat inline <style> at line 16613.
       The inline rule sets bottom:24px, max-height:88vh, etc.
       `body` prefix gives us higher specificity.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  body #busbar-thread-sheet .busbar-thread-inner{
    position: fixed !important;
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    max-height: none !important;
    height: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   4. SAVED POSTS SHEET — same fix as thread
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  body #busbar-saved-sheet .busbar-saved-inner{
    position: fixed !important;
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    max-height: none !important;
    height: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  /* Saved card itself — make sure it doesn't overflow horizontally */
  body #busbar-saved-sheet .busbar-feed-card{
    width: auto !important;
    max-width: 100% !important;
    margin: 0 0 12px 0 !important;
    box-sizing: border-box !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   5. EDIT PROFILE MODAL — same body-prefix fix
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  body #p11 #busbar-profile-modal .busbar-post-sheet{
    position: fixed !important;
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    max-height: none !important;
    height: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   6. USER PROFILE SHEET (the bigger one — busbar-user-profile-sheet)
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  body #busbar-user-profile-sheet .busbar-user-profile-panel{
    position: fixed !important;
    top: calc(env(safe-area-inset-top) + 10px) !important;
    bottom: calc(env(safe-area-inset-bottom) + 10px) !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    max-height: none !important;
    height: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   7. "Back to Saved Posts" pill — sticky styling
       (No timer-removal anymore — the JS below handles that)
   ───────────────────────────────────────────────────────────── */
#v17-back-to-saved.v18-sticky{
  /* No additional styling needed — handled inline in v4_17. The
     v18 JS below just disables the auto-hide timer. */
}

/* ═══════════════════════════════════════════════════════════════
   v4_19 ADDITIONS BELOW
   ═══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────
   v4_19 #1. RIGHT-SIDE CUT-OFF — universal clamp
       Force every modal sheet's inner content + every feed card
       to box-sizing:border-box and max-width:100%. Adds left+right
       padding INSIDE the panel so cards have breathing room and
       can't bleed past the panel edge.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 430px){
  /* Tighten inside-panel padding so cards don't hug edges */
  body #busbar-profile-preview-sheet .busbar-profile-preview-inner,
  body #busbar-thread-sheet .busbar-thread-inner,
  body #busbar-saved-sheet .busbar-saved-inner,
  body #busbar-user-profile-sheet .busbar-user-profile-panel,
  body #p11 #busbar-profile-modal .busbar-post-sheet{
    padding: 14px !important;
    box-sizing: border-box !important;
  }

  /* Universal box-sizing + width clamp on cards inside panels */
  body #busbar-profile-preview-sheet .busbar-user-hero,
  body #busbar-thread-sheet .busbar-feed-card,
  body #busbar-thread-sheet > * > *,
  body #busbar-saved-sheet .busbar-feed-card,
  body #busbar-user-profile-sheet .busbar-feed-card{
    box-sizing: border-box !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Stop horizontal overflow at every level — hide any rogue
     content that tries to peek past the panel edge */
  body #busbar-profile-preview-sheet .busbar-profile-preview-inner,
  body #busbar-thread-sheet .busbar-thread-inner,
  body #busbar-saved-sheet .busbar-saved-inner,
  body #busbar-user-profile-sheet .busbar-user-profile-panel,
  body #p11 #busbar-profile-modal .busbar-post-sheet{
    overflow-x: hidden !important;
  }

  /* Feed cards on the actual P11 page (not in a modal). The
     image 1 screenshot showed a feed card extending right past
     the visible area. Force it inside the page padding. */
  body #p11 #busbar-feed-list,
  body #p11 #busbar-feed-list > *{
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  body #p11 #busbar-feed-list .busbar-feed-card{
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow: hidden !important;
  }

  /* Same belt-and-braces for shop talk cards on the page */
  body #p11 #busbar-discussion-list .busbar-talk-card,
  body #p11 #busbar-dispatch-list .busbar-job-card{
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   v4_19 #2. DOCK FLAT TO BOTTOM
       Currently dock floats 60px above the bottom (line 4125).
       Move it to the bottom edge with only safe-area-inset-bottom
       padding so feed posts are visible behind it as user scrolls.
       Also dial the bottom padding on #p11 so the last feed card
       isn't hidden behind the dock.
   ───────────────────────────────────────────────────────────── */
body #p11 .busbar-bottom-nav.busbar-dock{
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  transform: none !important;
  border-radius: 24px 24px 0 0 !important;
  margin: 0 !important;
  padding-top: 8px !important;
  padding-bottom: calc(env(safe-area-inset-bottom) + 8px) !important;
}
@media (max-width: 700px){
  body #p11 .busbar-bottom-nav.busbar-dock{
    bottom: 0 !important;
    width: 100% !important;
    border-radius: 18px 18px 0 0 !important;
  }
}

/* Adjust page bottom padding so last post isn't trapped under dock */
body #p11{
  padding-bottom: calc(env(safe-area-inset-bottom) + 130px) !important;
}

/* Floating Create button hovers above the now-flat dock. Pull
   it down a bit since the dock no longer sits 60px up. */
body #p11 .busbar-dock-create{
  margin-top: -42px !important;
}
@media (max-width: 430px){
  body #p11 .busbar-dock-create{
    margin-top: -36px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   v4_20 / v4_21 ROOT-CAUSE FIX
   ───────────────────────────────────────────────────────────────
   Diagnosis:
     - .page has `padding: 20px` with the default `box-sizing: content-box`
     - That makes #p11 effectively 40px WIDER than the viewport
     - body has `overflow-x: hidden` which clips the visible overflow
     - But on iOS Safari, position:fixed elements (the dock, modals)
       resolve their `right: 0` against the LAYOUT VIEWPORT — which
       includes that 40px overflow — making them appear shifted right
       (clipped on the right edge)
   Fix:
     - Force #p11 to box-sizing: border-box AND clamp width to 100vw
     - Add a global box-sizing reset for safety
     - Ensure html/body don't allow horizontal scroll
   ═══════════════════════════════════════════════════════════════ */

/* Universal box-sizing reset — narrow scope to inside #p11 so we
   don't change the rest of the app's layout */
html, body{
  width: 100% !important;
  max-width: 100vw !important;
  overflow-x: hidden !important;
}

#p11, #p11 *{
  box-sizing: border-box !important;
}

#p11{
  width: 100vw !important;
  max-width: 100vw !important;
  overflow-x: hidden !important;
}

/* Fixed-position elements inside #p11 explicitly use 100vw not 100% */
body #p11 .busbar-bottom-nav.busbar-dock{
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  max-width: 100vw !important;
}

@media (max-width: 430px){
  /* Modal panels — re-anchor with vw units instead of percentage
     so they're calibrated against the actual viewport, not the
     overflowing #p11 container */
  html body #busbar-profile-preview-sheet .busbar-profile-preview-inner,
  html body #busbar-thread-sheet .busbar-thread-inner,
  html body #busbar-saved-sheet .busbar-saved-inner,
  html body #busbar-user-profile-sheet .busbar-user-profile-panel,
  html body #p11 #busbar-profile-modal .busbar-post-sheet{
    left: calc(env(safe-area-inset-left) + 12px) !important;
    right: auto !important;
    width: calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right)) !important;
    max-width: calc(100vw - 24px) !important;
    box-sizing: border-box !important;
    padding: 12px !important;
  }

  html body #p11 .busbar-post-modal{
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }

  html body #p11 .busbar-post-modal .busbar-post-sheet{
    margin-left: auto !important;
    margin-right: auto !important;
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    box-sizing: border-box !important;
  }

  /* Inner cards take full width of their container */
  html body #busbar-profile-preview-sheet .busbar-user-hero,
  html body #busbar-thread-sheet .busbar-feed-card,
  html body #busbar-saved-sheet .busbar-feed-card,
  html body #busbar-user-profile-sheet .busbar-feed-card{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43.15 — Composer modal: full-screen takeover + close
 *                        button visible + scroll-behind locked
 *
 * What v4.43.14 left broken:
 *   1. ✕ close button hid behind the dynamic island / status bar.
 *      → It was absolutely positioned at top:14px relative to the sheet,
 *        which now starts at y=0 of the viewport.
 *   2. Bottom feed still bled through under "Post to Feed".
 *      → The sheet was being height-fit-to-content because the modal's
 *        align-items:stretch fought with overflow:auto on the modal AND
 *        sheet. When sheet content was shorter than viewport, it didn't
 *        stretch reliably.
 *   3. The page behind the modal could still scroll.
 *      → The v4.43.11 scroll-lock observer doesn't watch
 *        #busbar-post-modal — it's not in its SHEET_IDS list. That's
 *        fixed in JS below.
 *
 * v4.43.15 fix: stop relying on the modal as a flex container at all
 * on iPhone. Pin the SHEET itself with position:fixed; inset:0 so it
 * IS the viewport. The mask becomes irrelevant under it. The sheet
 * becomes the scroll container, and the close button gets pushed
 * below the safe-area inset so the notch can't cover it.
 * ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 430px){
  /* Kill the translucent mask — fully opaque so even if the sheet
     somehow doesn't cover, the layer below it is solid. */
  html body #p11 #busbar-post-modal .busbar-post-mask{
    background: #0d0d0d !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  /* Solid modal backdrop, no padding. We override v4_18's padding
     so the sheet can truly span edge-to-edge. */
  html body #p11 #busbar-post-modal.busbar-post-modal{
    background: #0d0d0d !important;
    padding: 0 !important;
    overflow: hidden !important;       /* sheet handles its own scroll */
  }
  html[data-theme="light"] body #p11 #busbar-post-modal.busbar-post-modal,
  html[data-theme="light"] body #p11 #busbar-post-modal .busbar-post-mask{
    background: #ffffff !important;
  }

  /* Pin the sheet directly to the viewport. This is the bulletproof
     fix — the sheet IS the screen, no flex math, no margin gap. */
  html body #p11 #busbar-post-modal .busbar-post-sheet{
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    margin: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100svh !important;
    max-height: 100svh !important;
    min-height: 100svh !important;
    border-radius: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding:
      calc(env(safe-area-inset-top) + 56px)   /* room for ✕ button */
      16px
      calc(env(safe-area-inset-bottom) + 14px) !important;
  }

  /* Push the ✕ close button below the dynamic island / status bar.
     Without this it sits at y=14px and gets covered by the notch. */
  html body #p11 #busbar-post-modal .busbar-composer-close{
    top: calc(env(safe-area-inset-top) + 12px) !important;
    right: 14px !important;
    z-index: 10 !important;
  }

  /* The drag handle is meaningless on a full-screen takeover —
     hide it so it doesn't take vertical space below the close btn. */
  html body #p11 #busbar-post-modal .busbar-composer-handle{
    display: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43.18 — Work sheet click + scroll restoration (iPhone)
 *
 * On iPhone, taps inside the user work sheet were being eaten — posts
 * rendered but nothing scrolled or tapped. Defensive fix: explicitly
 * mark every work-sheet descendant as touch-interactive and restore
 * vertical pan-y scrolling on the body.
 *
 *   • `pointer-events: auto` un-blocks input — no-op if nothing was
 *     blocking, restores it if something was.
 *   • `touch-action: pan-y` allows native vertical scroll inside the
 *     scroll container without affecting taps.
 *   • All scoped to #busbar-user-work-sheet — no impact on the
 *     composer or any other sheet.
 * ═══════════════════════════════════════════════════════════════════════ */
html body #p11 #busbar-user-work-sheet,
html body #p11 #busbar-user-work-sheet *,
html body #p11 #busbar-user-work-sheet .busbar-uws-inner,
html body #p11 #busbar-user-work-sheet .busbar-uws-head,
html body #p11 #busbar-user-work-sheet .busbar-uws-body,
html body #p11 #busbar-user-work-sheet .busbar-uws-close,
html body #p11 #busbar-user-work-sheet .busbar-uws-mask{
  pointer-events: auto !important;
}

/* The body is the scroll container — give it pan-y so iOS Safari
   knows vertical scroll is allowed even if html/body have
   touch-action:none from the v4.43.11 scroll lock. */
html body #p11 #busbar-user-work-sheet .busbar-uws-body{
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
  overflow-y: auto !important;
}

/* The mask is the click-outside-to-close layer; keep it interactive. */
html body #p11 #busbar-user-work-sheet .busbar-uws-mask{
  touch-action: auto !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 12/35: ampstack-v4_26-styles */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.26 — Safe-area top inset for all pages
 *
 * Problem:
 *   The viewport meta has viewport-fit=cover, which means the app draws
 *   under the iPhone Dynamic Island / notch. Body has margin:0 and .page
 *   has flat 20px padding. On iPhones with Dynamic Island the safe-area-
 *   inset-top is ~59px, so HOME buttons and page titles get clipped.
 *   The Busbar (p11) was already fixed in v4.23 with its own topbar
 *   inset rule, but every other page (p1-p10, p12) needs the same fix.
 *
 * Solution:
 *   Add safe-area-inset-top to the top padding of every .page wrapper
 *   AND to the home page header. Keep the existing 20px baseline so the
 *   layout doesn't get cramped on devices without a notch (where the
 *   inset is 0 and the rule resolves to 20px — same as before).
 *
 * Notes:
 *   - We use a more-specific selector than the original 20px rule so
 *     this overrides without !important. CSS source-order wins ties.
 *   - The Busbar (p11) already has its own min-height rule for its
 *     topbar (line ~5064) that includes safe-area-inset-top — we don't
 *     touch that. p11's outer .page padding-top is fine because its
 *     topbar floats with its own inset already.
 * ═══════════════════════════════════════════════════════════════════════ */
.page {
  padding-top: calc(20px + env(safe-area-inset-top, 0px));
}

/* Home page header sits above the .page padding rule (it's a child of
   p11's home content, NOT inside a .page wrapper that has the new
   inset). Add a smaller inset to the home header so the "11-in-1 AppOS"
   title clears the notch. */
.home-header {
  padding-top: calc(28px + env(safe-area-inset-top, 0px));
}

/* Bottom-left back/HOME pills on individual pages currently sit at the
   very top of the .page wrapper. After the inset is applied the .page
   itself moves down, but if any page-level back button is positioned
   absolutely (rather than being a flow child) it bypasses the padding.
   Belt-and-suspenders: nudge any .btn-back that is the first inline
   element down a bit too. Harmless on devices without a notch because
   the inset resolves to 0. */
.page > .btn-back:first-child,
.page .btn-back[onclick*="showPage('home')"] {
  margin-top: 0; /* the .page padding handles it now */
}

/* v4.26.1 — theme toggle safe-area fix.
   The .theme-toggle is absolutely positioned at top:10px relative to the
   .home-header. After v4.26 added safe-area-inset-top padding to the
   home-header, the toggle stayed glued to 10px from the top of the
   padded box, which on Dynamic Island devices puts it back under the
   notch. Push it down by the inset so it clears. */
.theme-toggle {
  top: calc(10px + env(safe-area-inset-top, 0px)) !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 13/35: ampstack-v4_31-nec-exam-text */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.31 — NEC Exam (p1) Chapter Card Text Bump
 *
 * Why: The chapter cards on p1 (NEC Exam Trainer) use inline-styled font
 * sizes that read smaller than the rest of the app's content blocks
 * (compare to p2 Phase Mapper, p3 Calculations, etc). The user reported
 * the chapter titles + subtitles + "X / 100 completed" text all looked
 * cramped vs neighboring pages.
 *
 * The fix:
 * Override the inline styles with !important rules. We target the
 * chapter buttons specifically (everything inside the .card buttons
 * with onclick="p1_startExam(...)") so we don't accidentally restyle
 * any other .card elements elsewhere in the app.
 *
 * Old → New sizes:
 *   Chapter title:   .88rem  → 1.05rem  (+19%)
 *   Subtitle:        .67rem  → .85rem   (+27%)
 *   "X completed":   .65rem  → .78rem   (+20%)
 *   LIVE badge:      .63rem  → .72rem   (+14%)
 *   Icon:            1.1rem  → 1.35rem  (+23%)
 *
 * The card padding is bumped slightly too (14px → 16px vertical) so
 * the larger text doesn't feel cramped against the borders.
 *
 * Scoped: only #p1 .card buttons that trigger p1_startExam. Everything
 * else in the app is untouched.
 * ═══════════════════════════════════════════════════════════════════════ */

/* The chapter cards are <button class="card"> elements with
   onclick="p1_startExam(...)". Target them precisely. */
#p1 button.card[onclick*="p1_startExam"] {
  padding: 16px 18px !important;
}

/* Chapter icon (📖, 🔌, 💡, etc) — bigger so it visually anchors the row */
#p1 button.card[onclick*="p1_startExam"] > div:first-child > div:first-child > span:first-child {
  font-size: 1.35rem !important;
}

/* Chapter title ("Ch.1 — General Rules") */
#p1 button.card[onclick*="p1_startExam"] > div:first-child > div:first-child > div > div:first-child {
  font-size: 1.05rem !important;
  line-height: 1.25 !important;
}

/* Chapter subtitle ("Art. 90, 100, 110 · 100 Qs") */
#p1 button.card[onclick*="p1_startExam"] > div:first-child > div:first-child > div > div:nth-child(2) {
  font-size: 0.85rem !important;
  line-height: 1.3 !important;
  margin-top: 2px !important;
}

/* LIVE badge (top-right) — slightly bigger so it doesn't look puny next
   to the new title size */
#p1 button.card[onclick*="p1_startExam"] > div:first-child > div:last-child {
  font-size: 0.72rem !important;
  padding: 4px 10px !important;
}

/* "0 / 100 completed" progress text under the bar */
#p1 button.card[onclick*="p1_startExam"] > div[id^="p1-prog-"][id$="-txt"],
#p1 button.card[onclick*="p1_startExam"] [id^="p1-prog-"][id$="-txt"] {
  font-size: 0.78rem !important;
  margin-top: 6px !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 14/35: ampstack-v4_38-topbar-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.38 — Busbar Top Chrome (CSS)
 *
 * Three coordinated changes:
 *   #1 Home button replaces Back (HTML changed at line ~16060 — this
 *      block only adds .busbar-topbar-home polish styling).
 *   #2 Smaller top dock — reduce vertical padding ~30%, slightly
 *      smaller title font.
 *   #3 Smart-hide on scroll — adds a transition + the .busbar-topbar
 *      --hidden class that the v4.38 JS block toggles.
 *
 * Targets only #p11 (Busbar). NEC Exam, Profile, etc. are untouched.
 * ═══════════════════════════════════════════════════════════════════════ */

/* #2: Smaller / tighter topbar */
#p11 .busbar-topbar-clean,
#p11 .busbar-topbar{
  padding: 6px 0 8px !important;       /* was 8px 0 14px → tighter */
  margin-bottom: 10px !important;      /* was 16px → tighter */
}
#p11 .busbar-topbar-title{
  font-size: 1.45rem !important;       /* was 1.65–1.9rem → smaller */
  letter-spacing: -.03em !important;
  line-height: 1.05 !important;
}
/* The eyebrow under the title ("AMPSTACK NETWORK") is inline-styled at
   .72rem; bump it down a hair. */
#p11 .busbar-topbar-title > div{
  font-size: .64rem !important;
  margin-top: 4px !important;
}

/* #1: Home button — preserves btn-back styling but a touch tighter */
#p11 .busbar-topbar-home{
  font-size: .82rem !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
  padding: 8px 12px !important;
}

/* #3: Smart-hide transitions
   ─────────────────────────────────────────────────────────────────────
   v4.38.1: Switched from position:sticky to position:fixed. iOS Safari
   has a known WebKit bug where sticky + transform interacts badly: the
   element transforms out fine, but subsequent class changes that should
   reverse the transform don't repaint until something else nudges the
   layout. Symptom: bar hides on scroll-down, never reveals on scroll-up.
   Fixed positioning avoids the entire issue.
   ───────────────────────────────────────────────────────────────────── */

/* Override the existing position:sticky from line ~3220. */
#p11 .busbar-topbar-clean,
#p11 .busbar-topbar{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  /* Padding includes the iOS safe-area top inset (Dynamic Island clearance). */
  padding-top: calc(env(safe-area-inset-top) + 6px) !important;
  padding-bottom: 8px !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  margin-bottom: 0 !important;
  z-index: 90;
  box-sizing: border-box;
  transform: translateY(0);
  transition: transform 220ms cubic-bezier(.22,.61,.36,1),
              opacity   220ms cubic-bezier(.22,.61,.36,1);
  will-change: transform;
}

/* Compensate for the topbar leaving the document flow:
   add top padding to busbar-shell equal to the topbar's expected height
   so the feed doesn't slide up underneath it on first paint. */
#p11 .busbar-shell{
  padding-top: calc(env(safe-area-inset-top) + 64px) !important;
}

#p11 .busbar-topbar-clean.busbar-topbar--hidden,
#p11 .busbar-topbar.busbar-topbar--hidden{
  /* Slide fully off-screen (fixed positioning makes this clean). */
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
}

/* ─────────────────────────────────────────────────────────────────────
   v4.38.2 — Wider feed cards
   ─────────────────────────────────────────────────────────────────────
   The .page container has a global 20px horizontal padding, which means
   every Busbar feed card had 40px of "wasted" gutter eating into the
   screen. Reclaim most of it inside #p11 specifically. Other pages keep
   their 20px gutter — this is Busbar-only.
   Also tightens card internal padding and softens the corner radius so
   cards look proportional at the new narrower margins.
   ───────────────────────────────────────────────────────────────────── */
#p11.page{
  padding-left: 6px !important;
  padding-right: 6px !important;
}

#p11 .busbar-feed-card{
  padding: 14px !important;             /* was 16 → tighter */
  border-radius: 20px !important;       /* was 26 → looks right at narrower margins */
}

/* Keep Home button + topbar layout aligned with new tighter gutter. The
   topbar uses position:fixed with explicit padding-left/right of 20px;
   bring those down to match. */
#p11 .busbar-topbar-clean,
#p11 .busbar-topbar{
  padding-left: 12px !important;
  padding-right: 12px !important;
}

/* Channel hub (Dispatch tab top) keeps its own internal padding so tiles
   don't kiss the edge. Slight nudge up so it still feels framed. */
#p11 .busbar-channel-hub{
  margin-left: 6px !important;
  margin-right: 6px !important;
}

/* When dock returns, give it a faint downward shadow to signal it's
   floating over content. */
#p11 .busbar-topbar-clean:not(.busbar-topbar--hidden){
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 15/35: ampstack-v4_39-photo-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.39 — Feed photos: full-bleed + zoom + fullscreen
 *
 * Three coordinated upgrades to feed card photos:
 *   1. Full-bleed (edge-to-card): photo escapes the 14px card padding
 *      with negative margins, taking the full width inside the card.
 *      Card's border-radius + overflow:hidden already clip it cleanly.
 *   2. Double-tap zoom enhancement: existing double-tap-to-amp gets a
 *      brief 1.08x scale-pop alongside the heart burst (Instagram feel).
 *   3. Long-press fullscreen: opens a fullscreen modal with the photo,
 *      pinch-zoom + pan inside, tap or swipe-down to dismiss.
 * ═══════════════════════════════════════════════════════════════════════ */

/* ─── 1. FULL-BLEED PHOTO ─────────────────────────────────────────────── */
#p11 .busbar-feed-photo{
  /* Escape the card's 14px internal padding on left/right.
     Top stays at 12px so there's a small breathing gap from the head row. */
  margin-left: -14px !important;
  margin-right: -14px !important;
  margin-top: 12px !important;
  margin-bottom: 0 !important;
  border-radius: 0 !important;     /* card's border-radius clips it */
  border: 0 !important;             /* no inner border at the seam */
  /* v4.39.3: significantly taller default photo height.
     - aspect-ratio 4/5 (Instagram's tall portrait standard) so photos
       default to a 4:5 box even when the source image's natural aspect
       would render shorter. Image inside uses object-fit: cover.
     - min-height 480 ensures even narrow viewports still get a tall card.
     - max-height 88vh caps very tall portraits so card never exceeds
       most of the screen. */
  aspect-ratio: 4 / 5 !important;
  min-height: 480px !important;
  max-height: 88vh;
}
/* Caption needs a touch more breathing room since photo now goes full width. */
#p11 .busbar-feed-caption{
  margin-top: 12px !important;
}
/* Inside the photo, the carousel + image fill 100%. No change needed
   to .busbar-feed-track or its slides — they already stretch. */

/* The shimmer-gradient pseudo on the photo can stay, but trim it slightly
   so the bottom darkening doesn't overpower the larger photo. */
#p11 .busbar-feed-photo::before{
  background:
    radial-gradient(circle at top right, rgba(255,255,255,.08), transparent 32%),
    linear-gradient(to top, rgba(0,0,0,.42), rgba(0,0,0,0) 38%) !important;
}

/* ─── 2. DOUBLE-TAP ZOOM POP ──────────────────────────────────────────── */
/* Triggered alongside the existing heart burst. Adds a brief 1.08x scale
   on the photo container itself for a satisfying "tap" feel. */
#p11 .busbar-feed-photo.v4_39-pop{
  animation: v4_39PhotoPop 360ms cubic-bezier(.22,.61,.36,1);
}
@keyframes v4_39PhotoPop {
  0%   { transform: scale(1); }
  35%  { transform: scale(1.08); }
  100% { transform: scale(1); }
}

/* ─── 3. FULLSCREEN VIEWER ────────────────────────────────────────────── */
#v4_39-photo-viewer{
  position: fixed;
  inset: 0;
  z-index: 11000;             /* above topbar (90), bottom nav, sheets (10100) */
  background: rgba(0,0,0,.96);
  display: none;
  align-items: center;
  justify-content: center;
  touch-action: none;          /* we handle all touch ourselves */
  overscroll-behavior: contain;
}
#v4_39-photo-viewer.show{ display: flex; }

#v4_39-photo-viewer .v4_39-stage{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
}
#v4_39-photo-viewer .v4_39-img{
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  transform-origin: 0 0;       /* matrix transform handles all positioning */
  transform: matrix(1, 0, 0, 1, 0, 0);
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;        /* gestures handled on the viewer itself */
}
#v4_39-photo-viewer .v4_39-close{
  position: absolute;
  /* v4.39.1: was env(safe-area-inset-top) + 12px — too tight, the X
     overlapped the iPhone status bar (signal/wifi/battery row). Bump
     to +28px so the button sits visibly below the status bar. */
  top: calc(env(safe-area-inset-top) + 28px);
  right: 14px;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(0,0,0,.45);
  color: #fff;
  font-size: 1.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 1;
}
#v4_39-photo-viewer .v4_39-close:active{ transform: scale(.96); }
#v4_39-photo-viewer .v4_39-hint{
  position: absolute;
  bottom: calc(env(safe-area-inset-bottom) + 16px);
  left: 50%;
  transform: translateX(-50%);
  font-size: .78rem;
  color: rgba(255,255,255,.55);
  letter-spacing: .04em;
  text-transform: uppercase;
  pointer-events: none;
  text-align: center;
  z-index: 1;
}

/* ─── v4.39.4: tighter bottom dock ──────────────────────────────────────
   v4.39.6 update: the previous rule didn't match selector specificity
   of the winning rule at line ~30338 (`body #p11 .busbar-bottom-nav
   .busbar-dock`). Use the same selector pattern here.
   The winning rule was setting:
     bottom: 0 (dock flush with screen bottom)
     padding-bottom: safe-area-inset-bottom + 8px (~42px on iPhone)
   The +8px on top of safe-area was the wasted space. Drop the +8.
   ──────────────────────────────────────────────────────────────────── */
body #p11 .busbar-bottom-nav.busbar-dock{
  /* Trim INTERNAL padding-bottom of the dock so buttons sit close to
     the home indicator. safe-area alone, no extra padding. */
  padding-bottom: env(safe-area-inset-bottom) !important;
  padding-top: 6px !important;
}
#p11 .busbar-nav-btn{
  min-height: 50px !important;
  padding: 6px 6px !important;
}
/* The labels under each icon ("FEED", "SHOP TALK", etc.) get a hair tighter
   so the button doesn't feel cramped at the new height. */
#p11 .busbar-nav-btn > .nav-label,
#p11 .busbar-nav-btn .nav-label{
  margin-top: 2px !important;
  font-size: .68rem !important;
  letter-spacing: .04em !important;
}
/* The page bottom-padding (line ~3458) compensated for the tall dock;
   reduce so the feed extends closer to the dock edge.
   v4.39.5: bumped from 78 → 130. The Create FAB has margin-top: -46px
   which pushes it ABOVE the dock's top edge, so the page padding has to
   account for the dock height (~62px) PLUS the FAB protrusion (~46px)
   PLUS bottom offset (~38px) = ~146px total clearance needed. 78 was
   too tight and stats pills got covered.
   v4.39.6: keep at 130 — confirmed in v4.39.5 that this clears the FAB. */
body #p11{
  padding-bottom: calc(env(safe-area-inset-bottom) + 110px) !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 16/35: ampstack-v4_40-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.40 — Shop Talk + Dispatch upgrades
 *   #14 composer "posting to" badge
 *   #15 sort Shop Talk by most replies
 *   #16 Shop Talk keyword search
 *   #17 Dispatch keyword search
 *   #18 Dispatch city/state filter (manual entry)
 * ═══════════════════════════════════════════════════════════════════════ */

/* ── Composer mode badge (#14) ──────────────────────────────────────── */
.ampstack-v440-mode-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:6px;
  padding:4px 10px;
  border-radius:999px;
  font-size:.62rem;
  font-weight:1000;
  letter-spacing:.6px;
  text-transform:uppercase;
  border:1px solid transparent;
  white-space:nowrap;
}
.ampstack-v440-mode-badge .ampstack-v440-mode-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  display:inline-block;
}
.ampstack-v440-mode-badge[data-mode="feed"]{
  background:rgba(34,197,94,.12);
  border-color:rgba(34,197,94,.35);
  color:#22c55e;
}
.ampstack-v440-mode-badge[data-mode="feed"] .ampstack-v440-mode-dot{
  background:#22c55e;
  box-shadow:0 0 8px rgba(34,197,94,.6);
}
.ampstack-v440-mode-badge[data-mode="discussion"]{
  background:rgba(255,204,0,.12);
  border-color:rgba(255,204,0,.35);
  color:var(--gold,#ffcc00);
}
.ampstack-v440-mode-badge[data-mode="discussion"] .ampstack-v440-mode-dot{
  background:var(--gold,#ffcc00);
  box-shadow:0 0 8px rgba(255,204,0,.6);
}
.ampstack-v440-mode-badge[data-mode="dispatch"]{
  background:rgba(99,179,237,.12);
  border-color:rgba(99,179,237,.35);
  color:#63b3ed;
}
.ampstack-v440-mode-badge[data-mode="dispatch"] .ampstack-v440-mode-dot{
  background:#63b3ed;
  box-shadow:0 0 8px rgba(99,179,237,.6);
}

/* ── Search / filter / sort toolbar (#15-#18) ───────────────────────── */
.ampstack-v440-toolbar{
  margin:0 10px 10px;
  padding:10px;
  background:var(--card,#1a1a1f);
  border:1px solid var(--stroke,rgba(255,255,255,.08));
  border-radius:14px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.ampstack-v440-search-row{
  position:relative;
  display:flex;
  align-items:center;
}
.ampstack-v440-search-icon{
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  font-size:.85rem;
  color:var(--sub,#a8abb6);
  pointer-events:none;
}
.ampstack-v440-search-input{
  width:100%;
  background:rgba(255,255,255,.04);
  border:1px solid var(--stroke,rgba(255,255,255,.08));
  border-radius:10px;
  padding:9px 34px 9px 32px;
  color:var(--text,#fff);
  font-size:.88rem;
  font-family:inherit;
  -webkit-appearance:none;
  appearance:none;
}
.ampstack-v440-search-input:focus{
  outline:none;
  border-color:var(--gold,#ffcc00);
  background:rgba(255,255,255,.06);
}
.ampstack-v440-search-input::placeholder{
  color:var(--sub,#a8abb6);
}
.ampstack-v440-search-clear{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  background:rgba(255,255,255,.08);
  border:none;
  color:var(--text,#fff);
  width:22px;
  height:22px;
  border-radius:50%;
  font-size:.7rem;
  font-weight:900;
  cursor:pointer;
  display:none;
  align-items:center;
  justify-content:center;
  padding:0;
  line-height:1;
}
.ampstack-v440-search-clear.show{
  display:flex;
}
.ampstack-v440-controls-row{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.ampstack-v440-sort-group,
.ampstack-v440-filter-group{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.ampstack-v440-sort-label,
.ampstack-v440-filter-label{
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:var(--sub,#a8abb6);
  align-self:center;
  margin-right:2px;
}
.ampstack-v440-sort-btn{
  background:rgba(255,255,255,.04);
  border:1px solid var(--stroke,rgba(255,255,255,.08));
  color:var(--sub,#a8abb6);
  padding:5px 10px;
  border-radius:999px;
  font-size:.7rem;
  font-weight:800;
  cursor:pointer;
  font-family:inherit;
  -webkit-appearance:none;
  appearance:none;
}
.ampstack-v440-sort-btn.active{
  background:rgba(255,204,0,.15);
  border-color:rgba(255,204,0,.4);
  color:var(--gold,#ffcc00);
}
.ampstack-v440-filter-input{
  flex:1;
  min-width:140px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--stroke,rgba(255,255,255,.08));
  border-radius:10px;
  padding:7px 10px;
  color:var(--text,#fff);
  font-size:.8rem;
  font-family:inherit;
  -webkit-appearance:none;
  appearance:none;
}
.ampstack-v440-filter-input:focus{
  outline:none;
  border-color:var(--gold,#ffcc00);
}
.ampstack-v440-filter-input::placeholder{
  color:var(--sub,#a8abb6);
}
.ampstack-v440-empty-search{
  padding:24px 16px;
  text-align:center;
  color:var(--sub,#a8abb6);
  font-size:.85rem;
  margin:0 10px;
}
.ampstack-v440-empty-search strong{
  color:var(--text,#fff);
  display:block;
  margin-bottom:4px;
  font-size:.92rem;
}
.ampstack-v440-result-count{
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:var(--sub,#a8abb6);
  align-self:center;
  margin-left:auto;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 17/35: ampstack-v4_40_1-slim-dock */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.40.1 — Slimmer bottom dock
 *
 * Dock was eating ~90px of vertical real estate because:
 *   1. Each nav button: min-height 50px + 12px padding = ~62px
 *   2. Create FAB circle: 84×84px (76 on <700px) with margin-top -54
 *      (-48 small) pushing the whole thing up another ~30px visually
 *   3. Page padding-bottom: 110px to clear the protruding FAB
 *
 * v4.40.1 trims each piece while keeping the FAB-protrusion design:
 *   • Nav button min-height: 50 → 40px, padding 6px → 3px
 *   • Icon font-size shrunk; label margin-top tightened
 *   • Create FAB circle: 84 → 64px (76 → 58 on small)
 *   • Create FAB margin-top: -54 → -34px (-48 → -28 small)
 *   • Create FAB min-height: 92 → 70px (88 → 64 small)
 *   • Page padding-bottom: 110 → 88px (recaptures ~22px for content)
 *
 * Selector pattern: `body #p11 ...` matches the specificity of the v4.39.6
 * winning rule at line ~30338 — anything weaker gets overridden by older
 * layers. !important on every property because the older v4_38 / v4_39
 * rules also use !important.
 * ═══════════════════════════════════════════════════════════════════════ */

/* ── Nav buttons (Feed / Shop Talk / Notifications / Profile) ────────── */
body #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn{
  min-height: 40px !important;
  padding: 3px 6px !important;
}
body #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn .busbar-dock-icon{
  font-size: 1.05rem !important;
  line-height: 1 !important;
  margin-bottom: 0 !important;
}
body #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn .busbar-dock-label{
  margin-top: 1px !important;
  font-size: .62rem !important;
  letter-spacing: .03em !important;
  line-height: 1.1 !important;
}

/* ── Dock container — keep the v4.39.6 padding fix, slim the top ──── */
body #p11 .busbar-bottom-nav.busbar-dock{
  padding-top: 4px !important;
  padding-bottom: env(safe-area-inset-bottom) !important;
}

/* ── Create FAB — smaller circle, smaller protrusion ─────────────── */
body #p11 .busbar-dock-create{
  min-height: 70px !important;
  margin-top: -34px !important;
}
body #p11 .busbar-dock-create-circle{
  width: 64px !important;
  height: 64px !important;
  font-size: 1.6rem !important;
  box-shadow:
    0 14px 22px rgba(35,110,255,.32),
    inset 0 1px 0 rgba(255,255,255,.24) !important;
}
body #p11 .busbar-dock-create .busbar-dock-label{
  margin-top: 4px !important;
  font-size: .62rem !important;
  letter-spacing: .03em !important;
}

/* ── Notification badge sits on a smaller icon now ──────────────── */
body #p11 .busbar-bottom-nav.busbar-dock .busbar-dock-badge{
  font-size: .58rem !important;
  min-width: 14px !important;
  height: 14px !important;
  padding: 0 4px !important;
}

/* ── Small-screen overrides (matches the existing @media at line ~4582) */
@media (max-width:700px){
  body #p11 .busbar-dock-create{
    min-height: 64px !important;
    margin-top: -28px !important;
  }
  body #p11 .busbar-dock-create-circle{
    width: 58px !important;
    height: 58px !important;
    font-size: 1.5rem !important;
  }
}

/* ── Page bottom padding: less dock = less needed clearance ────── */
/* Old v4.39.6 value was 110. New FAB protrudes ~30px above the dock
   instead of ~46px, dock itself is ~46px tall instead of ~62px, so:
   46 (dock) + 30 (FAB) + 12 (breathing) = ~88px clearance. */
body #p11{
  padding-bottom: calc(env(safe-area-inset-bottom) + 88px) !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 18/35: ampstack-v4_40_2-polish */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.40.2 — Dock polish
 *
 * Two surgical fixes confirmed against the v4.40.1 deploy screenshot:
 *
 *  1. "SHOP TALK" was wrapping to two lines while every other label
 *     stayed on one. Force single-line + tighter letter-spacing on
 *     dock labels so all five buttons line up.
 *
 *  2. Notification badge was showing "0" inside a red dot. Root cause:
 *     a CSS rule at line ~4713 sets `.busbar-dock-badge { display:
 *     inline-flex }`. The HTML's inline `style="display:none"` is fine
 *     until a painter (v4.24, v4.36, or v4.37) runs `el.style.display
 *     = ''` to show it for n>0, then later code sets text to "0"
 *     without re-hiding. The empty string strips the inline style,
 *     so the CSS rule wins and an empty "0" appears.
 *     Fix: hide the badge whenever its text content is "0" or empty
 *     using attr selector + :empty fallback. !important to beat the
 *     unsuffixed display:inline-flex rule.
 * ═══════════════════════════════════════════════════════════════════════ */

/* ── #1: Single-line dock labels (kills SHOP TALK wrap) ─────────── */
body #p11 .busbar-bottom-nav.busbar-dock .busbar-nav-btn .busbar-dock-label,
body #p11 .busbar-bottom-nav.busbar-dock .busbar-dock-create .busbar-dock-label{
  white-space: nowrap !important;
  letter-spacing: .015em !important;
  font-size: .58rem !important;
}

/* ── #2: Hide the "0" notification badge ────────────────────────── */
/* Approach A: attribute-data driven (works when JS sets data-count). */
body #p11 .busbar-dock-badge[data-count="0"]{
  display: none !important;
}
/* Approach B: text-content-based via :empty for cleared badges. */
body #p11 .busbar-dock-badge:empty{
  display: none !important;
}
/* Approach C: belt-and-suspenders — a JS-set class always wins. */
body #p11 .busbar-dock-badge.ampstack-v440-badge-zero{
  display: none !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 19/35: ampstack-v4_40_3-hide-magnify */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.40.3 — Remove redundant magnifying glass overlay
 *
 * v4.18's `v17_addZoomButtons` injects a 🔍 button onto every feed photo
 * via MutationObserver. Since v4.39 added long-press fullscreen with
 * pinch-zoom + pan, this overlay is redundant — and visually busy.
 *
 * Can't remove the JS without editing the v4.18 layer (which would
 * break the override-stack pattern). Cheaper fix: hide via CSS. The
 * observer keeps adding invisible buttons; they have zero visual or
 * interaction footprint. pointer-events:none ensures they don't
 * intercept taps even in edge cases.
 * ═══════════════════════════════════════════════════════════════════════ */
.v17-feed-zoom-btn,
.busbar-photo-magnify{
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 20/35: ampstack-v4_41-profile-hub-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.41 — Profile Hub (#19) + badge counter fix
 * ═══════════════════════════════════════════════════════════════════════ */

/* ── Hide the legacy Recent Work card — replaced by the hub ────────── */
body #p11 .p11-profile-workstrip{
  display: none !important;
}

/* ── Profile hub container ─────────────────────────────────────────── */
.ampstack-v441-hub{
  margin: 14px 0 0;
  padding: 16px;
  background: var(--card, #1a1a1f);
  border: 1px solid var(--stroke, rgba(255,255,255,.08));
  border-radius: 14px;
}
.ampstack-v441-hub-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom: 12px;
}
.ampstack-v441-hub-title{
  font-size:.95rem;
  font-weight:1000;
  color: var(--text, #fff);
  letter-spacing:.02em;
}
.ampstack-v441-hub-sub{
  font-size:.7rem;
  color: var(--sub, #a8abb6);
  margin-top:2px;
}

/* ── Hub tabs ──────────────────────────────────────────────────────── */
.ampstack-v441-tabs{
  display:flex;
  gap:6px;
  margin-bottom:12px;
  background: rgba(255,255,255,.03);
  border: 1px solid var(--stroke, rgba(255,255,255,.06));
  border-radius:10px;
  padding:4px;
}
.ampstack-v441-tab{
  flex:1;
  padding:8px 10px;
  background: transparent;
  border: none;
  color: var(--sub, #a8abb6);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  border-radius:7px;
  cursor:pointer;
  font-family:inherit;
  -webkit-appearance:none;
  appearance:none;
  text-align:center;
  white-space:nowrap;
}
.ampstack-v441-tab.active{
  background: linear-gradient(135deg, #ffcc00, #e6b800);
  color:#000;
}
.ampstack-v441-tab-count{
  display:inline-block;
  margin-left:4px;
  font-weight:1000;
  opacity:.85;
}

/* ── List + rows ───────────────────────────────────────────────────── */
.ampstack-v441-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.ampstack-v441-row{
  display:flex;
  gap:10px;
  padding:10px;
  background: rgba(255,255,255,.025);
  border: 1px solid var(--stroke, rgba(255,255,255,.06));
  border-radius:12px;
  align-items:flex-start;
}
.ampstack-v441-thumb{
  flex:none;
  width:64px;
  height:64px;
  border-radius:10px;
  background: #000;
  background-size: cover;
  background-position: center;
  border: 1px solid var(--stroke, rgba(255,255,255,.06));
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.2rem;
  color: var(--sub, #a8abb6);
}
.ampstack-v441-thumb.discussion{
  background: linear-gradient(135deg, rgba(255,204,0,.10), rgba(255,204,0,.04));
}
.ampstack-v441-thumb.dispatch{
  background: linear-gradient(135deg, rgba(99,179,237,.10), rgba(99,179,237,.04));
}
.ampstack-v441-body{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.ampstack-v441-title{
  font-size:.86rem;
  font-weight:900;
  color: var(--text, #fff);
  line-height:1.25;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  word-break:break-word;
}
.ampstack-v441-meta{
  font-size:.66rem;
  color: var(--sub, #a8abb6);
  letter-spacing:.02em;
}
.ampstack-v441-actions{
  display:flex;
  gap:6px;
  margin-top:6px;
}
.ampstack-v441-btn{
  background: rgba(255,255,255,.05);
  border: 1px solid var(--stroke, rgba(255,255,255,.10));
  color: var(--text, #fff);
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  padding: 6px 10px;
  border-radius:8px;
  cursor:pointer;
  font-family:inherit;
  -webkit-appearance:none;
  appearance:none;
}
.ampstack-v441-btn.repost{
  background: rgba(255,204,0,.12);
  border-color: rgba(255,204,0,.30);
  color: var(--gold, #ffcc00);
}
.ampstack-v441-btn.delete{
  background: transparent;
  border-color: rgba(255,80,80,.30);
  color:#ff7676;
}
.ampstack-v441-btn:active{
  transform: scale(.96);
}

/* ── Empty state ───────────────────────────────────────────────────── */
.ampstack-v441-empty{
  padding: 28px 16px;
  text-align:center;
}
.ampstack-v441-empty-icon{
  font-size: 1.8rem;
  margin-bottom: 6px;
  opacity: .7;
}
.ampstack-v441-empty-title{
  font-weight:900;
  color: var(--text, #fff);
  font-size:.88rem;
  margin-bottom: 3px;
}
.ampstack-v441-empty-sub{
  color: var(--sub, #a8abb6);
  font-size:.74rem;
  line-height:1.4;
}

/* ── Badge counter fix ────────────────────────────────────────────────
   The "27" was clipping because the ring is only 86×86 with both the
   earned number AND the "/27" stacked inside, line-height:1 with the
   number at 1.45rem leaves no room. Make the ring slightly bigger,
   stack vertically with breathing room, and bump small font-size. */
body #p11 .badges-progress-ring{
  width: 96px !important;
  height: 96px !important;
}
body #p11 .badges-progress-num{
  padding: 0 6px !important;
}
body #p11 .badges-progress-num span{
  font-size: 1.55rem !important;
  line-height: 1 !important;
  display: block !important;
}
body #p11 .badges-progress-num small{
  display: block !important;
  font-size: .58rem !important;
  font-weight: 800 !important;
  margin-top: 3px !important;
  letter-spacing: .08em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 21/35: ampstack-v4_41_1-geo-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.41.1 — Dispatch geolocation
 *
 * Adds a "📍 Use my location" button next to the CITY input in the
 * dispatch composer. Auto-fills city/state from the device GPS via
 * the OpenStreetMap Nominatim reverse-geocoding API (free, no API
 * key required). Manual entry still works — this is a shortcut.
 * ═══════════════════════════════════════════════════════════════════════ */

.ampstack-v441-geo-row{
  display:flex;
  gap:6px;
  align-items:stretch;
  width:100%;
}
.ampstack-v441-geo-row > input{
  flex:1;
  min-width:0;
}
.ampstack-v441-geo-btn{
  flex:none;
  background: rgba(99,179,237,.10);
  border: 1px solid rgba(99,179,237,.30);
  color: #63b3ed;
  font-weight:900;
  font-size:.72rem;
  letter-spacing:.04em;
  padding: 0 12px;
  border-radius:10px;
  cursor:pointer;
  font-family:inherit;
  -webkit-appearance:none;
  appearance:none;
  white-space:nowrap;
  display:flex;
  align-items:center;
  gap:4px;
  transition: opacity .15s ease, transform .1s ease;
}
.ampstack-v441-geo-btn:active{
  transform: scale(.96);
}
.ampstack-v441-geo-btn[disabled]{
  opacity: .55;
  cursor: wait;
}
.ampstack-v441-geo-btn .ampstack-v441-geo-spin{
  display:inline-block;
  animation: ampstack-v441-spin 1s linear infinite;
}
@keyframes ampstack-v441-spin{
  to { transform: rotate(360deg); }
}
.ampstack-v441-geo-hint{
  font-size:.62rem;
  color: var(--sub, #a8abb6);
  margin-top:4px;
  letter-spacing:.02em;
}
.ampstack-v441-geo-hint.error{
  color:#ff8b8b;
}
.ampstack-v441-geo-hint.success{
  color:#63d49d;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 22/35: ampstack-v4_41_3-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.41.3 — GPS button redesign
 *
 * v4.41.1 put the GPS button inline next to the City input, but the
 * field is half-width inside a 1fr/1fr grid (City | Pay). On smaller
 * iPhones the button squeezed into ~30px and was hard to spot.
 *
 * Fix: relocate the GPS button to its own full-width, prominently
 * styled row BELOW the City/Pay grid. Makes it impossible to miss.
 * ═══════════════════════════════════════════════════════════════════════ */

#ampstack-v441-geo-fullrow{
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

#ampstack-v441-geo-fullrow .ampstack-v441-geo-btn-big{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  background: linear-gradient(135deg, rgba(255,107,107,.18), rgba(255,107,107,.08));
  border: 1px solid rgba(255,107,107,.45);
  color: #ff8b8b;
  font-weight: 1000;
  font-size: .82rem;
  letter-spacing: .04em;
  padding: 11px 14px;
  border-radius: 12px;
  cursor: pointer;
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity .15s ease, transform .1s ease;
  text-transform: uppercase;
}
#ampstack-v441-geo-fullrow .ampstack-v441-geo-btn-big:active{
  transform: scale(.98);
}
#ampstack-v441-geo-fullrow .ampstack-v441-geo-btn-big[disabled]{
  opacity: .55;
  cursor: wait;
}
#ampstack-v441-geo-fullrow .ampstack-v441-geo-pin{
  font-size: 1.05rem;
}
#ampstack-v441-geo-fullrow .ampstack-v441-geo-spin{
  display: inline-block;
  animation: ampstack-v441-spin 1s linear infinite;
}

/* The old inline button (if v4.41.1 had wired it) gets hidden so we
   don't show two GPS buttons at once. */
.ampstack-v441-geo-row > .ampstack-v441-geo-btn{
  display: none !important;
}
.ampstack-v441-geo-row{
  display: contents !important; /* unwrap the flex row so layout is normal */
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 23/35: ampstack-v4_41_4-gallery-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.41.4 — Fullscreen multi-photo gallery
 *
 * Replaces v4.39's single-image viewer with a swipeable fullscreen
 * gallery: long-press any photo → fullscreen opens at that photo,
 * swipe to browse all post photos, pinch to zoom, X to close.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Hide v4.39's old single-image viewer — we replace it with our own */
#v4_39-photo-viewer{
  display: none !important;
}

/* ── Fullscreen container ─────────────────────────────────────────── */
#ampstack-v441_4-gallery{
  position: fixed;
  inset: 0;
  background: #000;
  z-index: 99999;
  display: none;
  flex-direction: column;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
#ampstack-v441_4-gallery.show{
  display: flex;
}

/* ── Top bar (counter + close) ────────────────────────────────────── */
.v441_4-topbar{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: calc(env(safe-area-inset-top, 0px) + 12px) 14px 12px;
  z-index: 2;
  background: linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,0));
  pointer-events: none; /* let pinch/swipe pass through except on buttons */
}
.v441_4-counter{
  color: #fff;
  font-weight: 900;
  font-size: .85rem;
  letter-spacing: .04em;
  background: rgba(0,0,0,.45);
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.15);
  pointer-events: auto;
}
.v441_4-close{
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
  font-size: 1.05rem;
  font-weight: 900;
  cursor: pointer;
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
}
.v441_4-close:active{
  transform: scale(.94);
}

/* ── Pager track (horizontal swipe between photos) ─────────────────── */
.v441_4-track{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: row;
  width: 100%;
  height: 100%;
  will-change: transform;
}
.v441_4-track.animating{
  transition: transform 280ms cubic-bezier(.2,.8,.2,1);
}

/* ── Each slide is one photo, full viewport ───────────────────────── */
.v441_4-slide{
  flex: 0 0 100%;
  width: 100vw;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.v441_4-img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  transform-origin: center center;
  will-change: transform;
  user-drag: none;
  -webkit-user-drag: none;
  pointer-events: auto;
}

/* ── Bottom hint ──────────────────────────────────────────────────── */
.v441_4-hint{
  position: absolute;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 14px);
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255,255,255,.7);
  font-size: .68rem;
  letter-spacing: .04em;
  background: rgba(0,0,0,.4);
  padding: 5px 10px;
  border-radius: 999px;
  pointer-events: none;
  z-index: 2;
  white-space: nowrap;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 24/35: ampstack-v4_42-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.42 — Fullscreen "See Their Work" + Dispatch search GPS
 *
 * Two visual fixes:
 *   1. The user-profile sheet (See Their Work) was capped at 74vh and
 *      sat at bottom:140px, leaving the feed peeking through behind
 *      the dock. Promote it to a true fullscreen modal — top to bottom,
 *      bottom dock NOT visible, X to close.
 *
 *   2. v4.41.3's GPS button is in the dispatch COMPOSER. The user is
 *      asking for one on the dispatch SEARCH/LIST VIEW too, so they
 *      can fill the city filter to find jobs near them. Adds a small
 *      pin button next to the v4.40 City/State filter input.
 * ═══════════════════════════════════════════════════════════════════════ */

/* ── 1) Fullscreen "See Their Work" sheet ─────────────────────────── */
/* Override the v4.34 layer that capped this at bottom:140px / 74vh. */
body #busbar-user-profile-sheet.show{
  display: block !important;
  background: #000 !important;        /* solid black, no peek-through */
}
body #busbar-user-profile-sheet .busbar-user-profile-panel{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  max-height: 100vh !important;
  height: 100vh !important;
  border-radius: 0 !important;
  border: none !important;
  background: linear-gradient(180deg,#0c0d11 0%, #111216 100%) !important;
  box-shadow: none !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  padding-top: env(safe-area-inset-top, 0px) !important;
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
}

/* Make sure the sheet covers the bottom dock */
body #busbar-user-profile-sheet.show ~ #p11 .busbar-bottom-nav.busbar-dock,
body #p11 #busbar-user-profile-sheet.show ~ .busbar-bottom-nav.busbar-dock{
  /* belt-and-suspenders — the z-index at 99999 should already win */
}

/* Sticky header inside the fullscreen so X stays accessible while scrolling */
body #busbar-user-profile-sheet .busbar-comment-head{
  position: sticky !important;
  top: 0 !important;
  background: linear-gradient(180deg,#0c0d11 0%, rgba(12,13,17,.96) 100%) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  z-index: 5 !important;
  padding: calc(env(safe-area-inset-top, 0px) + 14px) 18px 14px !important;
}

/* ── 2) GPS button on Dispatch SEARCH/LIST view ───────────────────── */
.ampstack-v442-search-geo-btn{
  flex: none;
  background: linear-gradient(135deg, rgba(255,107,107,.18), rgba(255,107,107,.08));
  border: 1px solid rgba(255,107,107,.45);
  color: #ff8b8b;
  font-weight: 1000;
  font-size: .68rem;
  letter-spacing: .04em;
  padding: 0 12px;
  border-radius: 10px;
  cursor: pointer;
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  transition: opacity .15s ease, transform .1s ease;
}
.ampstack-v442-search-geo-btn:active{
  transform: scale(.96);
}
.ampstack-v442-search-geo-btn[disabled]{
  opacity: .55;
  cursor: wait;
}
.ampstack-v442-search-geo-spin{
  display: inline-block;
  animation: ampstack-v441-spin 1s linear infinite;
}
.ampstack-v442-search-geo-hint{
  font-size: .62rem;
  letter-spacing: .02em;
  margin-top: 4px;
  display: none;
}
.ampstack-v442-search-geo-hint.show{
  display: block;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 25/35: ampstack-v4_42_1-fullscreen-fix */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.42.1 — See Their Work fullscreen specificity fix
 *
 * v4.42's rule lost on iPhones (max-width: 430px) because v4.19's rule
 * at line ~30234 / ~30423 uses `html body #busbar-user-profile-sheet`
 * inside a `@media (max-width: 430px)` block. That selector is
 * (0,1,0,2) vs our (0,1,0,1) — they win.
 *
 * Fix: match their specificity AND wrap in the same media query so
 * we're in the same cascade tier. We use html body … #id and place
 * later in source order. Belt-and-suspenders: also set !important on
 * every property to bury anything else.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Desktop / tablet — no media query needed, our v4.42 rule wins */
html body #busbar-user-profile-sheet.show{
  display: block !important;
  background: #000 !important;
}
html body #busbar-user-profile-sheet .busbar-user-profile-panel{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  transform: none !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  max-height: 100vh !important;
  border-radius: 0 !important;
  border: none !important;
  background: linear-gradient(180deg,#0c0d11 0%, #111216 100%) !important;
  box-shadow: none !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  padding: 0 !important;
  padding-top: env(safe-area-inset-top, 0px) !important;
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  margin: 0 !important;
}

/* iPhone — same rules under same media query so we beat v4.19's
   `html body #busbar-user-profile-sheet .busbar-user-profile-panel`
   inside `@media (max-width: 430px)` */
@media (max-width: 430px){
  html body #busbar-user-profile-sheet.show{
    display: block !important;
    background: #000 !important;
  }
  html body #busbar-user-profile-sheet .busbar-user-profile-panel{
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    transform: none !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    height: 100vh !important;
    max-height: 100vh !important;
    min-height: 100vh !important;
    border-radius: 0 !important;
    border: none !important;
    background: linear-gradient(180deg,#0c0d11 0%, #111216 100%) !important;
    box-shadow: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 0 !important;
    padding-top: env(safe-area-inset-top, 0px) !important;
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
    margin: 0 !important;
  }

  /* Inner content needs side padding back since we cleared panel padding */
  html body #busbar-user-profile-sheet .busbar-user-profile-content,
  html body #busbar-user-profile-sheet .busbar-user-hero,
  html body #busbar-user-profile-sheet .busbar-user-work-section{
    padding-left: 14px !important;
    padding-right: 14px !important;
    box-sizing: border-box !important;
  }
}

/* Sticky header inside the fullscreen so X stays accessible while scrolling */
html body #busbar-user-profile-sheet .busbar-comment-head{
  position: sticky !important;
  top: 0 !important;
  background: linear-gradient(180deg,#0c0d11 0%, rgba(12,13,17,.96) 100%) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  z-index: 5 !important;
  padding: 14px 18px !important;
  margin: 0 !important;
}
@media (max-width: 430px){
  html body #busbar-user-profile-sheet .busbar-comment-head{
    padding: 14px 14px !important;
  }
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 26/35: ampstack-v4_42_2-correct-sheet-fullscreen */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.42.2 — Fullscreen "See Their Work" (FOR REAL THIS TIME)
 *
 * Detective work: v4.42 and v4.42.1 styled #busbar-user-profile-sheet,
 * which is the OLD sheet element from before v4.35. The current sheet
 * that actually opens is #busbar-user-work-sheet (rebuilt in v4.35,
 * line 16798) with inner class .busbar-uws-inner.
 *
 * The .busbar-uws-inner panel is positioned at:
 *   bottom: env(safe-area-inset-bottom) + 24px
 *   max-height: 88vh
 *   border-radius: 24px
 *   width: min(720px, ...)
 *
 * Which is exactly the "floating panel with feed peeking" look the
 * user is seeing. We promote it to true fullscreen.
 *
 * The CSS rules for this sheet are inline in a <style> tag right after
 * the element (line ~16800), with no html-body specificity. Our
 * `body #busbar-user-work-sheet` selector + !important wins by source
 * order alone.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Backdrop layer: solid black so nothing peeks through edges */
body #busbar-user-work-sheet{
  background: #000 !important;
  z-index: 99999 !important;
}
body #busbar-user-work-sheet.show{
  display: block !important;
}

/* Mask: full-screen, no backdrop tint */
body #busbar-user-work-sheet .busbar-uws-mask{
  position: absolute !important;
  inset: 0 !important;
  background: transparent !important;
}

/* Inner panel: fill the viewport */
body #busbar-user-work-sheet .busbar-uws-inner{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  transform: none !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-width: 0 !important;
  height: 100vh !important;
  max-height: 100vh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: linear-gradient(180deg,#0c0d11 0%, #111216 100%) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* Header: respect safe area at top, no rounded corners now */
body #busbar-user-work-sheet .busbar-uws-head{
  border-radius: 0 !important;
  padding: calc(env(safe-area-inset-top, 0px) + 14px) 16px 14px !important;
  flex: 0 0 auto !important;
}

/* Body: scrollable area takes whatever's left */
body #busbar-user-work-sheet .busbar-uws-body{
  flex: 1 1 auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  padding: 14px 14px calc(env(safe-area-inset-bottom, 0px) + 14px) !important;
}

/* Larger screens — same fullscreen treatment, override v4.35's
   tablet rule that pushed bottom to 96px */
@media (min-width: 768px){
  body #busbar-user-work-sheet .busbar-uws-inner{
    bottom: 0 !important;
    max-height: 100vh !important;
  }
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 27/35: ampstack-v4_42_3-keep-dock-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.42.3 — Keep dock visible inside "See Their Work"
 *
 * v4.35 calls Busbar_hideDockGlobal() when the sheet opens. Two issues:
 *   1. The hide-then-show animation is the "shake" the user noticed.
 *   2. Hiding the dock loses the Instagram-style nav-still-available
 *      pattern.
 *
 * Fix:
 *   - JS: wrap Busbar_openUserProfileWork to immediately re-call
 *     Busbar_showDockGlobal after the open. The sheet still calls
 *     hide internally but we counter it.
 *   - CSS: ensure the dock z-index beats the sheet z-index, AND add
 *     bottom padding to the sheet body so post cards don't hide
 *     behind the dock.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Dock must sit ABOVE the user-work-sheet (sheet z-index is 99999) */
body #p11 .busbar-bottom-nav.busbar-dock{
  z-index: 100000 !important;
}

/* Add room at the bottom of the scrollable body for the dock to sit
   over. Dock height is ~46px + safe-area + FAB protrusion ~30px = ~88px. */
body #busbar-user-work-sheet .busbar-uws-body{
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 100px) !important;
}

/* Make sure the sheet's inner container leaves room for the dock too —
   shrink height by dock space so internal flexbox layout knows. */
body #busbar-user-work-sheet .busbar-uws-inner{
  bottom: 0 !important;
  /* height stays 100vh; dock overlaps the bottom 88px which the body
     padding-bottom already accounts for — net effect: list scrolls
     up to but never under the dock visually. */
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 28/35: ampstack-v4_43-profile-grid-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43 — Instagram-style profile grid
 *
 * "See Their Work" becomes a public profile page:
 *   • Header: avatar, handle, post count
 *   • Body: 3-column square thumbnail grid of all their posts
 *   • Tap a thumbnail: opens the post's photos in v4.41.4 fullscreen gallery
 *
 * No stats, no activity tabs, no engagement metrics — just their work.
 * ═══════════════════════════════════════════════════════════════════════ */

/* ── Profile header (replaces v4.35's title + post-count row) ──────── */
.ampstack-v443-profile-head{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 24px 16px 18px;
  border-bottom: 1px solid var(--stroke, rgba(255,255,255,.08));
  margin-bottom: 0;
}
.ampstack-v443-avatar{
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ffcc00, #e6b800);
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 1000;
  font-size: 2rem;
  letter-spacing: -.02em;
  border: 2px solid rgba(255,255,255,.10);
  background-size: cover;
  background-position: center;
  margin-bottom: 12px;
  flex: none;
}
.ampstack-v443-avatar.has-photo{
  background-color: #000;
  color: transparent;
}
.ampstack-v443-name{
  font-size: 1.1rem;
  font-weight: 1000;
  color: var(--text, #fff);
  letter-spacing: .01em;
  margin-bottom: 2px;
}
.ampstack-v443-handle{
  font-size: .82rem;
  color: var(--sub, #a8abb6);
  margin-bottom: 12px;
}
.ampstack-v443-postcount{
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 18px;
  background: rgba(255,255,255,.03);
  border: 1px solid var(--stroke, rgba(255,255,255,.08));
  border-radius: 12px;
}
.ampstack-v443-postcount-num{
  font-size: 1.3rem;
  font-weight: 1000;
  color: var(--text, #fff);
  line-height: 1;
}
.ampstack-v443-postcount-label{
  font-size: .62rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sub, #a8abb6);
  font-weight: 800;
  margin-top: 4px;
}

/* ── Grid: 3 columns, square cells, 2px gutters (Instagram default) ── */
.ampstack-v443-grid{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2px;
  padding: 2px;
  background: var(--bg, #0c0d11);
}
.ampstack-v443-tile{
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #1a1a1f;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.ampstack-v443-tile:active{
  opacity: .85;
}
.ampstack-v443-tile img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.ampstack-v443-tile-placeholder{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(255,204,0,.08), rgba(255,204,0,.02));
  color: rgba(255,255,255,.35);
  font-size: 1.4rem;
  padding: 8px;
  text-align: center;
  font-weight: 800;
  font-size: .68rem;
  letter-spacing: .05em;
}
/* Multi-photo indicator badge */
.ampstack-v443-tile-multi{
  position: absolute;
  top: 6px;
  right: 6px;
  background: rgba(0,0,0,.55);
  color: #fff;
  font-size: .62rem;
  font-weight: 900;
  padding: 3px 7px;
  border-radius: 999px;
  pointer-events: none;
  display: flex;
  align-items: center;
  gap: 3px;
  letter-spacing: .04em;
}

/* ── Empty state ───────────────────────────────────────────────────── */
.ampstack-v443-empty{
  padding: 48px 24px;
  text-align: center;
  color: var(--sub, #a8abb6);
}
.ampstack-v443-empty-icon{
  font-size: 2.4rem;
  opacity: .6;
  margin-bottom: 10px;
}
.ampstack-v443-empty-title{
  font-weight: 900;
  color: var(--text, #fff);
  font-size: .98rem;
  margin-bottom: 4px;
}
.ampstack-v443-empty-sub{
  font-size: .82rem;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 29/35: ampstack-v4_43_4-iphone-safety-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43.4 — iPhone safety layer + carousel stacking-context fix
 *
 * Targets two long-standing bugs from the handoff:
 *
 * BUG #2 (iPhone rendering): The codebase has 37 `@media (max-width:430px)`
 *   rules but ZERO breakpoints for the smaller iPhone viewports
 *   (375 SE, 393 14/15, 414 Plus). 405 flex containers, only 44 with
 *   `min-width: 0`. Result: flex children with long text/buttons can
 *   overflow horizontally on narrow iPhones, pushing content off-screen
 *   or causing the page to scroll sideways.
 *
 *   Fix: a defensive iPhone-safety layer at <= 393px that:
 *     - Forces every flex/grid descendant of #p11 to honor min-width:0
 *       so children can shrink instead of overflow
 *     - Prevents any single element from forcing horizontal scroll
 *     - Snug-fits common modal panels to avoid edge clipping
 *     - Wraps long words instead of letting them push past viewport
 *
 * BUG #3 (carousel snap-back on long-press): Even after v4.41.2/v4.41.3
 *   tagged the active slide and re-synced after long-press, iOS Safari
 *   still occasionally reverts the carousel transform to slide 0 because
 *   v4.39's `filter: brightness()` on the parent .busbar-feed-photo
 *   creates a new stacking context that resets the inner track's
 *   transform.
 *
 *   Fix: promote .busbar-feed-track to its own compositor layer with
 *   `will-change: transform` and `translate3d()`. A 3D-transformed
 *   element gets its own GPU layer and is invariant to ancestor
 *   stacking-context changes — the track keeps its translate value
 *   even when the parent gets a filter applied.
 *
 * Pure CSS layer. No JS. No edits to existing rules. Inserted after
 * all v4.X overrides so it wins specificity by source order.
 * ═══════════════════════════════════════════════════════════════════════ */

/* ─── BUG #3 — carousel transform stays put under stacking-context churn ─ */
body #p11 .busbar-feed-track {
  will-change: transform !important;
  /* Force GPU compositor layer — invariant to ancestor stacking contexts */
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
}
body #p11 .busbar-feed-photo {
  /* Containment without creating a new stacking context that resets
     the inner track. `contain: layout` is enough for press feedback
     without breaking the carousel transform. */
  contain: layout style;
}
/* Belt-and-suspenders: when the photo wrap has a long-press filter
   applied, ensure the track keeps its position via its own layer. */
body #p11 .busbar-feed-photo .busbar-feed-track {
  position: relative;
  z-index: 1;
}

/* ─── BUG #2 — narrow-iPhone safety net (393px and below) ─────────────── */
@media (max-width: 393px) {
  /* Prevent the page itself from scrolling sideways */
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
  /* p11 root container: hard cap to viewport */
  body #p11 {
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }
  /* All direct flex/grid descendants of p11 cards: shrink-friendly */
  body #p11 .busbar-feed-card,
  body #p11 .busbar-dispatch-card,
  body #p11 .busbar-thread-card,
  body #p11 .busbar-notification-card,
  body #p11 .busbar-dm-inbox-card,
  body #p11 .busbar-uws-card,
  body #p11 .card {
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  /* Common flex-row containers — let children shrink */
  body #p11 .busbar-feed-card > *,
  body #p11 .busbar-dispatch-card > *,
  body #p11 .busbar-thread-card > *,
  body #p11 .busbar-notification-card > *,
  body #p11 .busbar-dm-inbox-card > * {
    min-width: 0 !important;
  }
  /* Long single words (URLs, hashes) don't push past viewport */
  body #p11 .busbar-feed-card,
  body #p11 .busbar-dispatch-card,
  body #p11 .busbar-thread-card,
  body #p11 .busbar-notification-card,
  body #p11 .busbar-notification-title,
  body #p11 .busbar-notification-copy,
  body #p11 .busbar-dm-inbox-name,
  body #p11 .busbar-dm-inbox-preview,
  body #p11 .busbar-feed-caption,
  body #p11 .busbar-thread-title,
  body #p11 .busbar-job-title {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }
  /* Modal sheets: snug to viewport with safe-area respect */
  body #p11 .busbar-modal,
  body #p11 .busbar-comment-panel,
  body #p11 #busbar-comment-sheet .busbar-comment-panel,
  body #p11 #busbar-thread-sheet .busbar-comment-panel,
  body #p11 #busbar-job-sheet .busbar-comment-panel,
  body #p11 #busbar-message-sheet .busbar-comment-panel,
  body #p11 #busbar-dm-sheet .busbar-comment-panel {
    width: calc(100vw - 12px - env(safe-area-inset-left) - env(safe-area-inset-right)) !important;
    max-width: calc(100vw - 12px - env(safe-area-inset-left) - env(safe-area-inset-right)) !important;
    box-sizing: border-box !important;
  }
  /* Composer (post create) modal — fits comfortably on iPhone SE 375 */
  body #p11 #busbar-composer-modal .busbar-modal-card,
  body #p11 #busbar-modal-busbar-composer .busbar-modal-card {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    box-sizing: border-box !important;
  }
  /* Composer textarea + inputs: shrink to fit */
  body #p11 .busbar-modal input,
  body #p11 .busbar-modal textarea,
  body #p11 .busbar-modal select {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Notification tab strips: keep within viewport */
  body #p11 .busbar-notif-tabs,
  body #p11 .v4_43_2-notif-tabs {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Profile grid tiles: never wider than 1/3 viewport */
  body #p11 .ampstack-v443-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  body #p11 .ampstack-v443-tile {
    min-width: 0 !important;
  }
  /* Bottom dock: respect safe-area */
  body #p11 .busbar-bottom-nav,
  body #p11 .busbar-bottom-nav.busbar-dock {
    max-width: 100vw !important;
    box-sizing: border-box !important;
    padding-bottom: max(8px, env(safe-area-inset-bottom)) !important;
  }
  /* Carousel slides: shrink to card width — never push the card wider */
  body #p11 .busbar-feed-slide {
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

/* ─── Extra-narrow safety (iPhone SE 375 and smaller) ──────────────────── */
@media (max-width: 375px) {
  /* Tighter padding on cards so content doesn't get cramped */
  body #p11 .busbar-feed-card,
  body #p11 .busbar-dispatch-card,
  body #p11 .busbar-thread-card,
  body #p11 .busbar-notification-card {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  /* Notification tabs: smaller text on SE */
  body #p11 .v4_43_2-notif-tab {
    font-size: .58rem !important;
    padding: 8px 2px !important;
    letter-spacing: 0 !important;
  }
  /* Composer modal: even tighter */
  body #p11 #busbar-composer-modal .busbar-modal-card,
  body #p11 #busbar-modal-busbar-composer .busbar-modal-card {
    width: calc(100vw - 8px) !important;
    max-width: calc(100vw - 8px) !important;
  }
}

/* ─── Landscape iPhone safety (height-constrained) ─────────────────────── */
@media (max-width: 932px) and (max-height: 430px) and (orientation: landscape) {
  /* Modal sheets shouldn't be taller than viewport in landscape */
  body #p11 .busbar-modal,
  body #p11 .busbar-comment-panel {
    max-height: calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px) !important;
  }
  /* Bottom dock smaller in landscape */
  body #p11 .busbar-bottom-nav.busbar-dock {
    padding-top: 4px !important;
    padding-bottom: max(4px, env(safe-area-inset-bottom)) !important;
  }
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 30/35: ampstack-v4_43_6-unified-profile-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43.6 — Unified profile sheet
 *
 * Consolidates the two-popup flow (preview card → "See Their Work" →
 * grid) into a single rich profile page. Tapping an avatar now lands
 * directly on the work sheet with badge + bio + Send DM button + grid.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Profile metadata strip (badge + bio) sits between header and grid */
body #p11 .ampstack-v446-meta {
  padding: 0 16px 4px !important;
  text-align: center !important;
}

body #p11 .ampstack-v446-chips {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  justify-content: center !important;
  margin-bottom: 12px !important;
}

body #p11 .ampstack-v446-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 6px 12px !important;
  background: rgba(255, 204, 0, .12) !important;
  border: 1px solid rgba(255, 204, 0, .3) !important;
  border-radius: 999px !important;
  color: var(--gold) !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  letter-spacing: .2px !important;
  white-space: nowrap !important;
}

body #p11 .ampstack-v446-bio {
  color: var(--sub) !important;
  font-size: .85rem !important;
  line-height: 1.4 !important;
  margin: 0 auto 14px !important;
  max-width: 480px !important;
}

body #p11 .ampstack-v446-dm-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 11px 28px !important;
  background: linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  border: none !important;
  border-radius: 12px !important;
  color: #000 !important;
  font-size: .85rem !important;
  font-weight: 1000 !important;
  letter-spacing: .3px !important;
  cursor: pointer !important;
  box-shadow: 0 4px 14px rgba(255, 204, 0, .25) !important;
  transition: transform .12s, box-shadow .12s !important;
  margin-bottom: 16px !important;
}

body #p11 .ampstack-v446-dm-btn:active {
  transform: scale(.97) !important;
  box-shadow: 0 2px 8px rgba(255, 204, 0, .2) !important;
}

body #p11 .ampstack-v446-dm-btn:disabled {
  opacity: .55 !important;
  cursor: default !important;
}

/* Tighter on iPhone SE */
@media (max-width: 375px) {
  body #p11 .ampstack-v446-chip {
    font-size: .66rem !important;
    padding: 5px 10px !important;
  }
  body #p11 .ampstack-v446-bio {
    font-size: .8rem !important;
  }
  body #p11 .ampstack-v446-dm-btn {
    padding: 10px 22px !important;
    font-size: .8rem !important;
  }
}

/* Hard-hide the legacy preview popup so it can never appear again. */
body #busbar-profile-preview-sheet {
  display: none !important;
}
body #busbar-profile-preview-sheet.show {
  display: none !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 31/35: ampstack-v4_43_7-polish-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43.7 — Profile sheet polish (3 small fixes)
 *
 *   1. DM panel: bump `bottom` so the input bar clears the dock + FAB
 *      and respects iPhone safe-area. Old 118px was tight on iPhone.
 *   2. Work sheet header: hide the "1 post" pill next to the X button —
 *      we already show the post count in the body card.
 *   3. Avatar/name dedup: remove the name + handle under the avatar
 *      since the header already says "<Name>'s Work". One name only.
 *
 * Pure CSS layer — wins via source order + !important.
 * ═══════════════════════════════════════════════════════════════════════ */

/* ─── Fix 1: DM panel clears the dock ─────────────────────────────────── */
body #p11 #busbar-dm-sheet .busbar-comment-panel {
  bottom: calc(118px + env(safe-area-inset-bottom)) !important;
}
/* On smaller iPhones, give a touch more headroom so the send button
   sits visibly above the dock + FAB even when the keyboard is closed. */
@media (max-width: 430px) {
  body #p11 #busbar-dm-sheet .busbar-comment-panel {
    bottom: calc(132px + env(safe-area-inset-bottom)) !important;
  }
}
/* Same treatment for the message sheet (Dispatch threads) for consistency */
body #p11 #busbar-message-sheet .busbar-comment-panel {
  bottom: calc(118px + env(safe-area-inset-bottom)) !important;
}
@media (max-width: 430px) {
  body #p11 #busbar-message-sheet .busbar-comment-panel {
    bottom: calc(132px + env(safe-area-inset-bottom)) !important;
  }
}

/* ─── Fix 2: hide redundant "1 post" pill in the work sheet header ────── */
body #p11 #busbar-user-work-sheet #busbar-uws-count {
  display: none !important;
}

/* ─── Fix 3: hide duplicate name + handle under avatar ────────────────── */
/* Header already shows "<Name>'s Work" — the name + handle directly under
   the avatar are redundant. Keep the avatar and post count tile.        */
body #p11 #busbar-uws-body .ampstack-v443-profile-head .ampstack-v443-name,
body #p11 #busbar-uws-body .ampstack-v443-profile-head .ampstack-v443-handle {
  display: none !important;
}
/* Tighten spacing now that name/handle are gone — avatar should sit
   nicely above the post count tile without a big gap. */
body #p11 #busbar-uws-body .ampstack-v443-profile-head .ampstack-v443-avatar {
  margin-bottom: 16px !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 32/35: ampstack-v4_43_8-profile-redesign-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43.8 — Profile sheet redesign + DM panel real fix
 *
 *   1. DM panel: previous fix (v4.43.7) hit a less-specific rule. The
 *      actual rule that wins on iPhone is at line 9587 with !important
 *      (height:90vh, min-height:90vh). We override with even-higher
 *      specificity to leave dock space below.
 *   2. Profile sheet header: change "<Name>'s Work" → "@username"
 *      (handled in v4.43.8 JS by overwriting the title element).
 *   3. Bigger avatar (88 → 120px), then divider, then a NEW horizontal
 *      row showing post count tile on the left + Send DM button on the
 *      right. Hides v4.43.5's postcount tile and v4.43.6's standalone
 *      Send DM button (we'll re-render them in the new row via JS).
 * ═══════════════════════════════════════════════════════════════════════ */

/* ─── Fix 1: DM panel height — leave room for the dock ─────────────── */
@media (max-width: 430px) {
  body #p11 #busbar-dm-sheet .busbar-comment-panel {
    height: calc(100vh - 110px - env(safe-area-inset-bottom)) !important;
    min-height: calc(100vh - 110px - env(safe-area-inset-bottom)) !important;
    max-height: calc(100vh - 110px - env(safe-area-inset-bottom)) !important;
    bottom: calc(100px + env(safe-area-inset-bottom)) !important;
  }
  body #p11 #busbar-message-sheet .busbar-comment-panel {
    height: calc(100vh - 110px - env(safe-area-inset-bottom)) !important;
    min-height: calc(100vh - 110px - env(safe-area-inset-bottom)) !important;
    max-height: calc(100vh - 110px - env(safe-area-inset-bottom)) !important;
    bottom: calc(100px + env(safe-area-inset-bottom)) !important;
  }
}

/* ─── Fix 2 + 3: Profile sheet redesign ───────────────────────────── */

/* Bigger avatar */
body #p11 #busbar-uws-body .ampstack-v443-profile-head .ampstack-v443-avatar {
  width: 120px !important;
  height: 120px !important;
  font-size: 2.6rem !important;
  margin-bottom: 18px !important;
  border-width: 3px !important;
}

/* Hide v4.43.5's standalone postcount tile (we'll render it in the
   new horizontal row inside the meta strip). */
body #p11 #busbar-uws-body .ampstack-v443-profile-head .ampstack-v443-postcount {
  display: none !important;
}

/* Hide v4.43.6's standalone Send DM button (we'll re-render it in the
   horizontal row). */
body #p11 #busbar-uws-body .ampstack-v446-meta .ampstack-v446-dm-btn {
  display: none !important;
}

/* New horizontal row: postcount-left + Send DM-right */
body #p11 .ampstack-v448-actionrow {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 14px 18px 6px !important;
  max-width: 480px !important;
  margin: 0 auto !important;
}

body #p11 .ampstack-v448-postcount {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  padding: 10px 22px !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid var(--stroke, rgba(255,255,255,.08)) !important;
  border-radius: 12px !important;
  flex: 0 0 auto !important;
}
body #p11 .ampstack-v448-postcount-num {
  font-size: 1.3rem !important;
  font-weight: 1000 !important;
  color: var(--text, #fff) !important;
  line-height: 1 !important;
}
body #p11 .ampstack-v448-postcount-label {
  font-size: .62rem !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: var(--sub, #a8abb6) !important;
  font-weight: 800 !important;
  margin-top: 4px !important;
}

body #p11 .ampstack-v448-dm-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 12px 24px !important;
  background: linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  border: none !important;
  border-radius: 14px !important;
  color: #000 !important;
  font-size: .85rem !important;
  font-weight: 1000 !important;
  letter-spacing: .3px !important;
  cursor: pointer !important;
  box-shadow: 0 4px 14px rgba(255, 204, 0, .25) !important;
  transition: transform .12s, box-shadow .12s !important;
  flex: 0 0 auto !important;
}
body #p11 .ampstack-v448-dm-btn:active {
  transform: scale(.97) !important;
  box-shadow: 0 2px 8px rgba(255, 204, 0, .2) !important;
}

/* Center the @username title in the work sheet header */
body #p11 #busbar-user-work-sheet #busbar-uws-title {
  text-align: center !important;
  width: 100% !important;
  font-weight: 1000 !important;
  letter-spacing: .01em !important;
}

/* iPhone SE tightening */
@media (max-width: 375px) {
  body #p11 #busbar-uws-body .ampstack-v443-profile-head .ampstack-v443-avatar {
    width: 104px !important;
    height: 104px !important;
    font-size: 2.2rem !important;
  }
  body #p11 .ampstack-v448-actionrow {
    padding: 12px 14px 4px !important;
  }
  body #p11 .ampstack-v448-dm-btn {
    padding: 11px 18px !important;
    font-size: .8rem !important;
  }
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 33/35: ampstack-v4_43_10-dm-panel-real-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43.10 — DM panel REAL fix + handle from Supabase
 *
 * REAL ROOT CAUSE for the DM bug: I have been styling
 *   `#busbar-dm-sheet .busbar-comment-panel`
 * for the last 3 versions. But the actual rendered DM panel uses
 *   `#busbar-dm-sheet .v422-inner`
 * (defined inline at line ~16618 in the DM sheet's own <style> block).
 *
 * `.v422-inner` has `bottom: calc(env(safe-area-inset-bottom) + 24px)`
 * which puts it almost flush with the viewport bottom — sitting at
 * dock level. `.busbar-comment-panel` doesn't even exist on the DM
 * sheet, so all my prior CSS was a no-op.
 *
 * FIX: target .v422-inner and bump bottom so it clears the dock.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Lift the DM panel above the dock. Dock is roughly 88px + safe area
   in v4.40.1's slim-dock layout. We want ~100px clearance plus safe-area
   so the input bar sits visibly above the FAB. */
body #p11 #busbar-dm-sheet .v422-inner {
  bottom: calc(env(safe-area-inset-bottom) + 110px) !important;
}

/* On smaller iPhones (<= 430px), give a bit more clearance so the
   input row is comfortably away from the dock visually. */
@media (max-width: 430px) {
  body #p11 #busbar-dm-sheet .v422-inner {
    bottom: calc(env(safe-area-inset-bottom) + 120px) !important;
    /* Also slightly reduce max-height so panel doesn't get pushed off-top */
    max-height: min(76vh, 720px) !important;
  }
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 34/35: ampstack-v4_43_11-scroll-lock-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43.11 — Scroll lock that doesn't break the dock + handle
 *                       resolution via DM/profile cache + nuke v4.43.9's
 *                       position:fixed lock (which untethered the dock)
 *
 * BUG: v4.43.9's scroll lock set body to `position:fixed; top:-Ypx`. On
 *   iOS this works for stopping bleed-through but it ALSO breaks
 *   `position:fixed` descendants (the dock) which can get a different
 *   containing block under iOS WebKit's layout when body is fixed. The
 *   dock visually "scrolls with the content" instead of staying glued.
 *
 * FIX: replace with `overflow:hidden` on <html> and <body>. Modern iOS
 *   Safari (14+) honors this without breaking fixed children. We also
 *   set `touch-action:none` on the body to block scroll-bubbling on
 *   touch devices.
 * ═══════════════════════════════════════════════════════════════════════ */

html.v4_43_11-locked,
html.v4_43_11-locked body {
  overflow: hidden !important;
  height: 100% !important;
  /* Don't set position:fixed — that's what broke the dock in v4.43.9 */
  touch-action: none !important;
}

/* Make sure the dock stays glued to the viewport bottom — this was
   already the design intent but iOS sometimes recomputes containing
   blocks after layer changes. Hard-pin with !important. */
body #p11 .busbar-bottom-nav,
body #p11 .busbar-bottom-nav.busbar-dock {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 100000 !important;
  transform: translateZ(0) !important;
}

/* ───────────────────────────────────────────────────────────────────── */
/* SECTION 35/35: ampstack-v4_43_12-polish-css */
/* ───────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack v4.43.12 — Title centering + iOS image action menu block
 *
 *   1. Block the iOS image action menu (Share/Save to Photos/Copy/Look
 *      Up) on feed photos. v4.39's JS contextmenu handler doesn't catch
 *      this — it's a separate iOS-only "image action" menu triggered
 *      by long-press on <img>. Only CSS `-webkit-touch-callout: none`
 *      can block it.
 *
 *   2. TRULY center the work-sheet title. v4.43.8's `text-align:center`
 *      centered text inside a flex element that takes the LEFT portion
 *      (X button is on the right) — making text appear left-of-center.
 *      Fix: position absolute, left:50%, translate(-50%) to center it
 *      relative to the entire header bar.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Block iOS image actions on feed photos and gallery */
body #p11 .busbar-feed-photo img,
body #p11 .busbar-feed-photo,
body #p11 .ampstack-v443-tile img,
body #p11 .ampstack-v443-tile,
body #p11 #v4_39-photo-viewer img,
body .ampstack-gallery img {
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  -khtml-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
  -webkit-tap-highlight-color: rgba(0,0,0,0) !important;
}

/* Allow text selection still in inputs and text fields */
body #p11 input,
body #p11 textarea,
body #p11 [contenteditable="true"] {
  -webkit-user-select: text !important;
  user-select: text !important;
  -webkit-touch-callout: default !important;
}

/* Center the work-sheet title relative to the entire header bar */
body #p11 #busbar-user-work-sheet .busbar-uws-head {
  position: relative !important;
}
body #p11 #busbar-user-work-sheet #busbar-uws-title {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  text-align: center !important;
  width: auto !important;
  max-width: calc(100% - 120px) !important; /* leave room for close btn */
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex: 0 0 auto !important;
  pointer-events: none !important; /* don't block clicks on header */
}




/* ═══════════════════════════════════════════════════════════════════════
 * ⚡ AmpStack Busbar — clean rebuild stylesheet (bb-feed.css)
 * v1.0 (2026-05-14)
 *
 * Scoped under #bb-root to guarantee zero collision with legacy busbar.
 * ═══════════════════════════════════════════════════════════════════════ */

#bb-root.bb-root {
  display: block;
  background: #0a0a0b;
  color: #e8e8ea;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI',
               Roboto, sans-serif;
  font-size: 15px;
  line-height: 1.4;
  min-height: 100%;
  padding-bottom: calc(110px + env(safe-area-inset-bottom, 0px));
  padding-top: env(safe-area-inset-top, 0px);
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
}

#bb-root * { box-sizing: border-box; }

/* ─── Header ──────────────────────────────────────────────────────────── */
#bb-root .bb-feed-header {
  position: sticky;
  top: 0;
  z-index: 5;
  background: rgba(10, 10, 11, 0.92);
  backdrop-filter: saturate(150%) blur(12px);
  -webkit-backdrop-filter: saturate(150%) blur(12px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding: 14px 16px calc(14px + env(safe-area-inset-top, 0px)) 16px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
#bb-root .bb-feed-title {
  font-size: 1.35rem;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: #ffcc00;
}
#bb-root .bb-feed-sub {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #8d8e92;
}

/* ─── Feed list ───────────────────────────────────────────────────────── */
#bb-root .bb-feed-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px 0;
}

/* ─── Card ────────────────────────────────────────────────────────────── */
#bb-root .bb-card {
  background: #131316;
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  padding: 14px 0 12px 0;
}

#bb-root .bb-card-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 16px 12px 16px;
}

#bb-root .bb-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2a2a30, #1a1a1f);
  border: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffcc00;
  font-weight: 900;
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
}
#bb-root .bb-avatar.bb-avatar-photo {
  color: transparent;
}

#bb-root .bb-card-who {
  flex: 1;
  min-width: 0;
}

#bb-root .bb-card-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

#bb-root .bb-card-name {
  font-weight: 800;
  font-size: 0.95rem;
  color: #f5f5f7;
}

#bb-root .bb-card-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 2px;
  font-size: 0.78rem;
  color: #8d8e92;
}
#bb-root .bb-card-handle { color: #a0a0a5; }
#bb-root .bb-card-tag {
  color: #ffcc00;
  font-weight: 700;
}
#bb-root .bb-card-time { color: #6f7075; }
#bb-root .bb-card-dot-sep { color: #4a4b50; }

/* ─── Badges ──────────────────────────────────────────────────────────── */
#bb-root .bb-card-badges {
  display: inline-flex;
  gap: 6px;
}
#bb-root .bb-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
#bb-root .bb-badge-founder {
  background: rgba(255, 204, 0, 0.15);
  color: #ffcc00;
  border: 1px solid rgba(255, 204, 0, 0.35);
}
#bb-root .bb-badge-pro {
  background: rgba(80, 160, 255, 0.15);
  color: #6cb6ff;
  border: 1px solid rgba(80, 160, 255, 0.35);
}

/* ─── Photo carousel ──────────────────────────────────────────────────── */
#bb-root .bb-card-photo {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #0d0d0f;
  overflow: hidden;
}

#bb-root .bb-card-track {
  display: flex;
  height: 100%;
  width: 100%;
  transition: transform 220ms cubic-bezier(0.2, 0.7, 0.2, 1);
  will-change: transform;
}

#bb-root .bb-card-slide {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0d0d0f;
}

#bb-root .bb-card-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
  -webkit-user-drag: none;
  user-select: none;
}

#bb-root .bb-card-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 1.3rem;
  font-weight: 900;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  z-index: 2;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
#bb-root .bb-card-nav:active {
  background: rgba(255, 204, 0, 0.5);
}
#bb-root .bb-card-nav-prev { left: 10px; }
#bb-root .bb-card-nav-next { right: 10px; }

#bb-root .bb-card-dots {
  position: absolute;
  bottom: 10px;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  z-index: 2;
  pointer-events: none;
}
#bb-root .bb-card-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.35);
  transition: background 200ms, transform 200ms;
}
#bb-root .bb-card-dot.is-active {
  background: #ffcc00;
  transform: scale(1.25);
}

/* ─── Caption + stats ─────────────────────────────────────────────────── */
#bb-root .bb-card-caption {
  padding: 12px 16px 8px 16px;
  font-size: 0.92rem;
  color: #d5d5d8;
  white-space: pre-wrap;
  word-wrap: break-word;
  line-height: 1.45;
}

#bb-root .bb-card-stats {
  display: flex;
  gap: 14px;
  padding: 4px 16px 0 16px;
}
#bb-root .bb-stat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.85rem;
  font-weight: 700;
  color: #b3b3b7;
}
#bb-root .bb-stat-icon { font-size: 1rem; }
#bb-root .bb-stat-val { color: #f0f0f2; }

/* ─── Loading / empty / error states ──────────────────────────────────── */
#bb-root .bb-loading,
#bb-root .bb-empty,
#bb-root .bb-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 64px 24px;
  gap: 10px;
  color: #8d8e92;
}
#bb-root .bb-loading-spinner {
  font-size: 2.4rem;
  color: #ffcc00;
  animation: bb-spin 1.2s linear infinite;
}
@keyframes bb-spin {
  to { transform: rotate(360deg); }
}
#bb-root .bb-loading-text {
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
#bb-root .bb-empty-icon,
#bb-root .bb-error-icon {
  font-size: 2.4rem;
}
#bb-root .bb-empty-title,
#bb-root .bb-error-title {
  font-size: 1.05rem;
  font-weight: 900;
  color: #f0f0f2;
  margin-top: 6px;
}
#bb-root .bb-empty-sub,
#bb-root .bb-error-sub {
  font-size: 0.88rem;
  max-width: 320px;
  line-height: 1.45;
}

/* ─── Buttons ─────────────────────────────────────────────────────────── */
#bb-root .bb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 22px;
  border-radius: 999px;
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  cursor: pointer;
  border: 1px solid transparent;
  background: rgba(255, 255, 255, 0.06);
  color: #f0f0f2;
  margin-top: 12px;
  -webkit-tap-highlight-color: transparent;
}
#bb-root .bb-btn:active {
  transform: scale(0.97);
}
#bb-root .bb-btn-primary {
  background: #ffcc00;
  color: #000;
  font-weight: 900;
}
#bb-root .bb-btn-primary:active {
  background: #ffd633;
}

/* ─── Light theme override ────────────────────────────────────────────── */
html[data-theme="light"] #bb-root.bb-root {
  background: #f5f5f7;
  color: #1c1c1e;
}
html[data-theme="light"] #bb-root .bb-feed-header {
  background: rgba(245, 245, 247, 0.92);
  border-bottom-color: rgba(0, 0, 0, 0.08);
}
html[data-theme="light"] #bb-root .bb-card {
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.06);
}
html[data-theme="light"] #bb-root .bb-card-name { color: #1c1c1e; }
html[data-theme="light"] #bb-root .bb-card-caption { color: #2c2c2e; }
html[data-theme="light"] #bb-root .bb-stat-val { color: #1c1c1e; }
html[data-theme="light"] #bb-root .bb-empty-title,
html[data-theme="light"] #bb-root .bb-error-title { color: #1c1c1e; }

/* When the clean BB rebuild has mounted, hide the legacy busbar shell.
 * The .bb-root class is added by BB.mount() on success. */
#p11 #bb-root.bb-root + .busbar-shell {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
 * Busbar composer styles (bb-composer.css) v1.1
 * ═══════════════════════════════════════════════════════════════════════ */

/* ─── FAB ─────────────────────────────────────────────────────────────── */
.bb-fab {
  position: fixed;
  right: 18px;
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #ffcc00;
  color: #000;
  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 200;
  box-shadow: 0 10px 28px rgba(255, 204, 0, 0.4),
              0 2px 6px rgba(0, 0, 0, 0.3);
  transition: transform 120ms ease;
  -webkit-tap-highlight-color: transparent;
}
.bb-fab:active { transform: scale(0.92); }

/* ─── Sheet ───────────────────────────────────────────────────────────── */
.bb-composer-sheet {
  position: fixed;
  inset: 0;
  z-index: 10100;
  display: none;
  align-items: flex-end;
  justify-content: center;
}
.bb-composer-sheet.is-open { display: flex; }

.bb-composer-mask {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}

.bb-composer-panel {
  position: relative;
  width: 100%;
  max-width: 720px;
  height: 100vh;
  height: 100dvh;
  background: #0e0e10;
  color: #f0f0f2;
  display: flex;
  flex-direction: column;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', sans-serif;
  animation: bb-slide-up 280ms cubic-bezier(0.2, 0.7, 0.2, 1);
}
@keyframes bb-slide-up {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}

/* ─── Head ────────────────────────────────────────────────────────────── */
.bb-composer-head {
  display: grid;
  grid-template-columns: 44px 1fr 88px;
  align-items: center;
  gap: 8px;
  padding: 14px 14px calc(14px + env(safe-area-inset-top, 0px)) 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  flex-shrink: 0;
  padding-top: calc(14px + env(safe-area-inset-top, 0px));
}

.bb-composer-close {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.06);
  color: #f0f0f2;
  font-size: 1.4rem;
  font-weight: 800;
  line-height: 1;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}
.bb-composer-close:active { background: rgba(255, 255, 255, 0.12); }

.bb-composer-title {
  font-weight: 900;
  font-size: 1rem;
  text-align: center;
  letter-spacing: -0.01em;
}

.bb-composer-post {
  height: 36px;
  padding: 0 18px;
  border-radius: 999px;
  background: #ffcc00;
  color: #000;
  font-size: 0.92rem;
  font-weight: 900;
  border: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.bb-composer-post:disabled {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.3);
  cursor: not-allowed;
}
.bb-composer-post:not(:disabled):active { background: #ffd633; }

/* ─── Body ────────────────────────────────────────────────────────────── */
.bb-composer-body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 16px 16px calc(40px + env(safe-area-inset-bottom, 0px)) 16px;
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.bb-composer-section { display: flex; flex-direction: column; gap: 8px; }

.bb-composer-label {
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8d8e92;
}

/* ─── Trade chips ─────────────────────────────────────────────────────── */
.bb-composer-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bb-chip {
  padding: 9px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.10);
  color: #d5d5d8;
  font-size: 0.86rem;
  font-weight: 700;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background 140ms, color 140ms, border-color 140ms;
}
.bb-chip:active { transform: scale(0.96); }
.bb-chip.is-active {
  background: rgba(255, 204, 0, 0.18);
  border-color: rgba(255, 204, 0, 0.65);
  color: #ffcc00;
}

/* ─── Textarea ────────────────────────────────────────────────────────── */
.bb-composer-textarea {
  width: 100%;
  min-height: 120px;
  max-height: 50vh;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 14px 16px;
  color: #f0f0f2;
  font-size: 1rem;
  font-family: inherit;
  line-height: 1.45;
  resize: vertical;
  outline: none;
  -webkit-appearance: none;
}
.bb-composer-textarea:focus {
  border-color: rgba(255, 204, 0, 0.45);
  background: rgba(255, 255, 255, 0.06);
}
.bb-composer-textarea::placeholder { color: #6f7075; }

.bb-composer-counter {
  align-self: flex-end;
  font-size: 0.74rem;
  font-weight: 800;
  color: #6f7075;
  letter-spacing: 0.04em;
}

/* ─── Photos grid ─────────────────────────────────────────────────────── */
.bb-composer-photos {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}

.bb-thumb {
  position: relative;
  aspect-ratio: 1 / 1;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
}
.bb-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.bb-thumb-x {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  border: none;
  font-size: 0.95rem;
  font-weight: 900;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}
.bb-thumb-add {
  border-style: dashed;
  border-color: rgba(255, 204, 0, 0.4);
  color: #ffcc00;
  font-size: 1.6rem;
  font-weight: 900;
  background: rgba(255, 204, 0, 0.04);
}
.bb-thumb-add:active { background: rgba(255, 204, 0, 0.1); }

/* ─── Light theme ─────────────────────────────────────────────────────── */
html[data-theme="light"] .bb-composer-panel {
  background: #ffffff;
  color: #1c1c1e;
}
html[data-theme="light"] .bb-composer-head {
  border-bottom-color: rgba(0, 0, 0, 0.08);
}
html[data-theme="light"] .bb-composer-close {
  background: rgba(0, 0, 0, 0.05);
  color: #1c1c1e;
}
html[data-theme="light"] .bb-composer-textarea {
  background: rgba(0, 0, 0, 0.03);
  border-color: rgba(0, 0, 0, 0.1);
  color: #1c1c1e;
}
html[data-theme="light"] .bb-chip {
  background: rgba(0, 0, 0, 0.04);
  border-color: rgba(0, 0, 0, 0.08);
  color: #1c1c1e;
}
html[data-theme="light"] .bb-thumb {
  background: rgba(0, 0, 0, 0.04);
  border-color: rgba(0, 0, 0, 0.08);
}

/* v4.44.2 visible version pill — confirms fresh code is loaded */
#bb-root .bb-version-pill {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255, 204, 0, 0.18);
  color: #ffcc00;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  vertical-align: middle;
  border: 1px solid rgba(255, 204, 0, 0.45);
}


/* ═══════════════════════════════════════════════════════════════════════
 * v4.44.4 — social pill states
 * ═══════════════════════════════════════════════════════════════════════ */

#p11 .busbar-stat-pill.amped,
#p11 .busbar-stat-pill.saved {
  background: rgba(255, 204, 0, 0.18) !important;
  border-color: rgba(255, 204, 0, 0.65) !important;
  color: var(--gold, #ffcc00) !important;
}
#p11 .busbar-stat-pill.amped > span,
#p11 .busbar-stat-pill.saved > span {
  color: var(--gold, #ffcc00) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
 * v4.44.6 — high-contrast pill states. Make active state unmistakable.
 * Inactive: muted/dark. Active (amped/saved): solid gold fill, dark text.
 * ═══════════════════════════════════════════════════════════════════════ */

/* Inactive pills — clearly "off" */
#p11 .busbar-stat-pill.interactive.live:not(.amped):not(.saved){
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,204,0,0.20) !important;
  color: rgba(255,204,0,0.70) !important;
  box-shadow: none !important;
}
#p11 .busbar-stat-pill.interactive.live:not(.amped):not(.saved) > span{
  color: rgba(255,204,0,0.70) !important;
}

/* Active pills — solid gold fill, near-black text. Override the v4.44.4 rule. */
#p11 .busbar-stat-pill.amped,
#p11 .busbar-stat-pill.saved{
  background: var(--gold, #ffcc00) !important;
  border-color: var(--gold, #ffcc00) !important;
  color: #111 !important;
  box-shadow: 0 6px 16px rgba(255,204,0,0.35) !important;
}
#p11 .busbar-stat-pill.amped > span,
#p11 .busbar-stat-pill.saved > span{
  color: #111 !important;
  font-weight: 800 !important;
}