/* ==========================================================================
   Cherry Pickers — project.css
   Public / projected display screen (#projectView), shown full-bleed.
   ========================================================================== */

body.project-mode{ background:#0d1319; overflow:hidden; }
body.project-mode .shell{ max-width:none; margin:0; padding:0; }
body.project-mode .topbar, body.project-mode .bottom-nav, body.project-mode .auth-gate{ display:none!important; }
body.project-mode main{ padding:0; }

.project-view{
  display:none; min-height:100vh; padding:clamp(28px,4vw,70px) clamp(28px,5vw,96px); color:var(--ivory);
  background:radial-gradient(circle at 15% 0%, rgba(201,162,78,0.10), transparent 45%),
             radial-gradient(circle at 100% 100%, rgba(163,64,42,0.10), transparent 50%), #12191F;
}
.project-view.active{ display:block; }
.project-header{ display:flex; align-items:center; justify-content:space-between; gap:28px; border-bottom:1px solid var(--line); padding-bottom:24px; }
.project-kicker, .project-label{ margin:0 0 8px; color:var(--brass); font-size:11px; font-weight:800; letter-spacing:1.6px; }
.project-header h1{ font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:clamp(34px,5vw,68px); line-height:.98; margin:0 0 9px; }
.project-header p:last-child{ margin:0; color:var(--ivory-dim); font-size:clamp(14px,1.5vw,20px); }
.project-brand{ display:flex; align-items:center; gap:14px; color:var(--brass); font-family:'Big Shoulders Display',sans-serif; font-size:20px; font-weight:800; }
.project-brand img{ width:56px; height:56px; border-radius:var(--radius-s); object-fit:cover; }
.project-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:20px; margin-top:24px; }
.project-now, .project-queue, .project-board{ position:relative; border:1px solid var(--line); background:rgba(243,238,226,0.05); border-radius:var(--radius-l); padding:clamp(20px,2.5vw,34px); }
.project-now:before, .project-queue:before, .project-board:before{ content:''; position:absolute; inset:9px; border:1px dashed var(--saddle-line); border-radius:9px; pointer-events:none; }
.project-now{ grid-row:span 2; display:flex; flex-direction:column; justify-content:center; min-height:420px; }
.project-now h2{ font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:clamp(40px,6.5vw,88px); line-height:.96; margin:12px 0; max-width:850px; }
.project-now>p:not(.project-label){ color:var(--ivory-dim); font-size:clamp(16px,2vw,26px); margin:0; }
.project-next{ border-left:4px solid var(--sage); margin-top:48px; padding:14px 0 14px 18px; display:grid; gap:7px; }
.project-next span{ color:#a7c290; font-size:11px; font-weight:800; letter-spacing:1.4px; }
.project-next strong{ font-family:'Big Shoulders Display',sans-serif; font-size:clamp(24px,3vw,40px); font-weight:800; }
.project-next small{ color:var(--ivory-dim); font-size:14px; }
.project-section-title{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; border-bottom:1px solid var(--line); padding-bottom:12px; margin-bottom:4px; }
.project-section-title h2{ font-family:'Big Shoulders Display',sans-serif; font-size:clamp(22px,2.4vw,32px); font-weight:800; margin:0; }
.project-section-title>span{ color:#a7c290; font-size:12px; font-weight:700; }
.project-song{ display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:12px; align-items:center; padding:13px 0; border-bottom:1px solid var(--line); }
.project-song:last-child{ border-bottom:0; }
.project-song em{ font-style:normal; color:var(--brass); font-size:11px; font-weight:800; }
.project-song strong{ display:block; font-size:clamp(14px,1.35vw,19px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.project-song small{ display:block; color:var(--ivory-dim); font-size:11px; margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.project-song b{ font-size:12px; color:var(--brass); }
body:not(.can-view-vote-counts) .project-song b{ visibility:hidden; }
.project-empty{ color:var(--ivory-dim); font-size:13px; }
.project-feed{ display:grid; grid-template-columns:28px minmax(0,1fr); gap:10px; padding:12px 0; border-bottom:1px solid var(--line); }
.project-feed:last-child{ border-bottom:0; }
.project-feed-mark{ width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:var(--rust); color:#fbe3db; font-size:10px; font-weight:800; }
.project-feed strong{ font-size:13px; }
.project-feed p{ margin:4px 0 0; color:var(--ivory-dim); font-size:12px; line-height:1.35; }
.project-footer{ display:flex; align-items:center; justify-content:space-between; gap:24px; border-top:1px solid var(--line); margin-top:24px; padding-top:18px; }
.project-qr{ display:flex; align-items:center; gap:12px; }
.project-qr img{ width:70px; height:70px; background:var(--ivory); padding:5px; border-radius:var(--radius-s); }
.project-qr div{ display:grid; gap:5px; }
.project-qr strong{ font-size:16px; }
.project-qr span, .project-footer-event span{ color:var(--ivory-dim); font-size:12px; }
.project-footer-event{ display:grid; gap:5px; text-align:center; }
.project-footer-event strong{ font-family:'Big Shoulders Display',sans-serif; font-size:21px; font-weight:800; }
.project-clock{ color:var(--brass); font-size:16px; font-variant-numeric:tabular-nums; }

@media(max-width:850px){
  .project-grid{ grid-template-columns:1fr; }
  .project-now{ grid-row:auto; min-height:0; }
  .project-footer{ flex-wrap:wrap; }
  .project-brand{ display:none; }
}
@media(max-width:560px){
  body.project-mode{ overflow:auto; }
  .project-view{ padding:22px 18px; }
  .project-header h1{ font-size:34px; }
  .project-now h2{ font-size:44px; }
  .project-footer{ align-items:flex-start; }
  .project-clock{ margin-left:auto; }
}