/* BreakoutVids workspace: one cobalt palette + "your stuff first" dashboard (10 Nov 2026).
   Loaded after friendly.css. Neutral greys and warm white everywhere; cobalt only for actions,
   links and the active page; colour otherwise only for video status. */
:root{--bv-ink:#172236;--bv-muted:#5d6676;--bv-soft:#8a91a0;--bv-line:#e4e3de;--bv-cobalt:#254edb;--bv-cobalt-ink:#1b3caf;--bv-tint:#eaefff;--bv-ready:#1f8a4c;--bv-ready-tint:#e5f4ea;--bv-making:#a35f00;--bv-making-tint:#fdf1dc;--bv-wait:#4b5563;--bv-wait-tint:#eef0f3;--bv-fail:#b42318;--bv-fail-tint:#fdecea}

/* Palette fixes across the workspace */
::selection{background:#d6defc;color:var(--bv-ink)}
#app-screen a:hover{color:var(--bv-cobalt-ink)}
#app-screen .text-button{color:var(--bv-cobalt)}
#app-screen header{border-color:var(--bv-line)}
#app-screen .pill{background:var(--bv-tint);color:var(--bv-cobalt-ink);border-color:#d6defc}
#app-screen aside{border-color:var(--bv-line)}
#app-screen aside .workspace{color:var(--bv-soft)}
#app-screen nav a{color:var(--bv-muted)}
#app-screen nav a:hover{background:#f3f4f7;color:var(--bv-ink)}
#owner-nav{color:var(--bv-muted);background:none}
.aside-bottom{border-color:var(--bv-line)}
.aside-bottom #sidebar-name{color:var(--bv-ink);font-weight:600}
.aside-bottom #sidebar-role{color:var(--bv-soft)}
.section-title h2 span{color:var(--bv-ink)}
.section-title>a{color:var(--bv-cobalt);font-weight:600}
.project-card{border-color:var(--bv-line);box-shadow:none}
.template-card:hover,.project-card:hover{box-shadow:0 10px 26px #17223612}
.project-card-actions{border-color:#eef0f3}
.project-placeholder,.empty-icon{background:var(--bv-tint);color:var(--bv-cobalt)}
.plan-disclaimer{color:var(--bv-soft)}

/* Sidebar credits card (replaces the old promo card; still hidden for guests) */
#app-screen .sidebar-free-badge{background:var(--bv-tint);background-image:none;border:0;border-radius:12px;padding:14px 16px;color:var(--bv-muted);font-size:12px;line-height:1.5;box-shadow:none}
#app-screen .sidebar-free-badge small{display:block;color:var(--bv-muted);font-size:12px}
#app-screen .sidebar-free-badge strong{display:block;font-size:26px;line-height:1.2;color:var(--bv-cobalt-ink);letter-spacing:-.5px;margin:2px 0}
#app-screen .sidebar-free-badge a{display:inline-block;margin-top:8px;color:var(--bv-cobalt);font-weight:600;font-size:12px}

/* Dashboard */
.dash-top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:6px 0 4px}
.dash-top h1{margin:4px 0 0}
.dash-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.credit-chip{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--bv-line);border-radius:99px;padding:9px 14px;font-size:13px;font-weight:600;color:var(--bv-ink);text-decoration:none;min-height:44px}
.credit-chip em{font-style:normal;font-weight:500;color:var(--bv-soft)}
.credit-chip .dot{width:8px;height:8px;border-radius:50%;background:var(--bv-cobalt)}
.dash-make{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 20px;border-radius:12px;background:var(--bv-cobalt);color:#fff;font-weight:600;font-size:14px;text-decoration:none}
#app-screen .dash-make:hover{color:#fff;background:var(--bv-cobalt-ink)}
#dash-active{display:grid;gap:10px;margin-top:20px}
.dash-strip{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--bv-line);border-radius:14px;padding:12px 14px}
.dash-strip .strip-thumb{width:48px;aspect-ratio:4/5;border-radius:8px;background:var(--bv-wait-tint) center/cover no-repeat;flex:none}
.dash-strip .strip-text{flex:1;min-width:0}
.dash-strip .strip-text strong{display:block;font-size:14px;color:var(--bv-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-strip .strip-text small{display:block;color:var(--bv-muted);font-size:12px;line-height:1.5}
.strip-bar{height:6px;border-radius:9px;background:var(--bv-wait-tint);margin-top:8px;overflow:hidden;position:relative}
.strip-bar span{position:absolute;top:0;bottom:0;width:35%;border-radius:9px;background:var(--bv-making);animation:bv-slide 1.6s ease-in-out infinite}
.strip-bar.waiting span{background:var(--bv-soft)}
@keyframes bv-slide{0%{left:-35%}100%{left:100%}}
@media(prefers-reduced-motion:reduce){.strip-bar span{animation:none;left:0;width:100%;opacity:.5}}
.dash-section{margin-top:32px}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.vcard{background:#fff;border:1px solid var(--bv-line);border-radius:14px;overflow:hidden;min-width:0;display:flex;flex-direction:column}
.vthumb{position:relative;aspect-ratio:4/5;background:var(--bv-wait-tint) center/cover no-repeat}
.vthumb video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.vbadge{position:absolute;top:10px;left:10px;font-size:11px;font-weight:700;padding:4px 9px;border-radius:99px;z-index:1}
.vbadge.ready{background:var(--bv-ready-tint);color:var(--bv-ready)}
.vbadge.making{background:var(--bv-making-tint);color:var(--bv-making)}
.vbadge.wait{background:var(--bv-wait-tint);color:var(--bv-wait)}
.vbadge.fail{background:var(--bv-fail-tint);color:var(--bv-fail)}
.vplay{position:absolute;right:10px;bottom:10px;width:44px;height:44px;border-radius:50%;border:0;background:#ffffffee;color:var(--bv-ink);font-size:14px;display:grid;place-items:center;box-shadow:0 2px 8px #0002;cursor:pointer}
.vmeta{padding:10px 12px 12px;display:flex;flex-direction:column;gap:2px;flex:1}
.vmeta strong{font-size:14px;color:var(--bv-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vmeta small{color:var(--bv-soft);font-size:12px}
.vmeta p{margin:6px 0 0;font-size:12px;line-height:1.5;color:var(--bv-muted)}
.vacts{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:auto;padding-top:8px}
.vacts a,.vacts button{background:none;border:0;padding:0;min-height:36px;display:inline-flex;align-items:center;font:inherit;font-size:13px;font-weight:600;color:var(--bv-cobalt);cursor:pointer;text-decoration:none}
.dash-welcome{background:#fff;border:1px solid var(--bv-line);border-radius:14px;padding:22px 24px;grid-column:1/-1}
.dash-welcome h3{margin:0 0 6px;font-size:18px;color:var(--bv-ink)}
.dash-welcome p{margin:0 0 14px;color:var(--bv-muted)}
.frame-chips{display:flex;flex-wrap:wrap;gap:10px}
.frame-chips button,.frame-chips a{display:inline-flex;align-items:center;min-height:44px;padding:9px 16px;border-radius:99px;border:1px solid var(--bv-line);background:#fff;color:var(--bv-ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none}
.frame-chips button:hover,.frame-chips a:hover{border-color:#c9d4ff;background:var(--bv-tint)}
#recent-projects.project-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
@media(max-width:800px){
 .dash-top{align-items:stretch}.dash-actions{width:100%}.dash-actions .credit-chip{flex:1;justify-content:center}.dash-make{flex:1}
 .vgrid{grid-template-columns:1fr 1fr;gap:12px}
 #recent-projects.project-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:360px){.vgrid,#recent-projects.project-grid{grid-template-columns:1fr}}
/* Fixes from the private-copy check */
.dash-strip .vbadge{position:static;flex:none}
.dash-top h1{font-size:clamp(28px,3vw,36px);line-height:1.15;letter-spacing:-1px;margin:4px 0 0}
.project-open{background:#f3f4f7}
.project-title-link{color:var(--bv-ink)}
#toast{background:var(--bv-ink);color:#fff;border-color:var(--bv-ink);box-shadow:0 12px 40px #17223633}
.credit-chip{white-space:nowrap}
.project-card-actions{gap:2px 16px}
@media(max-width:800px){
 .dash-actions{display:grid;grid-template-columns:1fr;gap:8px}
 .dash-actions .dash-make{order:-1;width:100%}
 .dash-actions .credit-chip{justify-content:center}
 #app-screen .project-card-actions .text-button{min-height:40px}
}

/* Share button on ready videos */
.vacts .vshare{color:#fff;background:var(--bv-cobalt);border-radius:8px;padding:0 12px;min-height:34px}
.vacts .vshare:disabled{opacity:.7;cursor:progress}

/* Launch week nudge on the dashboard (hidden automatically after 17 Nov) */
.launch-nudge{display:block;background:var(--bv-tint);color:var(--bv-cobalt-ink);border:1px solid #d5defb;border-radius:12px;padding:12px 16px;margin:0 0 18px;font-size:14px;font-weight:600;text-decoration:none}
.launch-nudge:hover{background:#dfe7ff}
.plan-card s,.plan s{opacity:.55;font-weight:400}

/* BreakoutVids mark (direction A) */
.brand .mark-img{display:block;width:34px;height:34px;flex:none}
.brand{letter-spacing:-.2px}
.brand .ai{margin-left:0}
