:root{
  --bg:#FAF8F7;
  --card:#FFFFFF;
  --border:#EBE3E8;
  --text:#2E2433;
  --muted:#8A7C8E;
  --track:#EFEAF0;
  --accent:#F7D6E0;
  --accent2:#D8CFEA;
  --accent3:#FBE0C4;
  --gold:#E8C77E;
  --plum:#4A3A55;
  --mono-bg:#F6F1F7;
}
body[data-channel="eat-train-evolve"]{
  --accent:#A8E6CF;
  --accent2:#4A90D9;
  --accent3:#EAF6FF;
  --gold:#FF6B6B;
  --plum:#2B2D42;
  --mono-bg:#F1F8FA;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  line-height:1.5;
}

/* ---------- Top bar ---------- */
.topbar{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;
  padding:14px 24px;background:rgba(250,248,247,0.92);backdrop-filter:blur(6px);
  border-bottom:1px solid var(--border);
}
.topbar-group{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}

/* Segmented control (Ant Design style) */
.segmented{
  display:inline-flex;background:var(--track);border-radius:10px;padding:3px;gap:2px;
}
.segmented button{
  border:none;background:transparent;padding:6px 14px;font-size:13px;font-weight:600;
  color:var(--muted);border-radius:8px;cursor:pointer;white-space:nowrap;
  transition:background .15s ease,color .15s ease,box-shadow .15s ease;
  font-family:inherit;
}
.segmented button:hover{color:var(--text);}
.segmented button.active{
  background:var(--card);color:var(--plum);box-shadow:0 1px 3px rgba(0,0,0,0.12);
}
.week-switch{max-width:60vw;overflow-x:auto;}

/* ---------- Layout ---------- */
main{max-width:980px;margin:0 auto;padding:28px 24px 90px;}
.page-title{font-size:24px;margin:0 0 4px;color:var(--plum);}
.page-sub{color:var(--muted);margin:0 0 24px;font-size:14px;}

/* ---------- Legend ---------- */
.legend{
  background:linear-gradient(135deg,var(--accent),var(--accent2) 60%,var(--accent3));
  border-radius:16px;padding:18px 22px;margin-bottom:26px;color:var(--plum);
}
.legend h2{margin:0 0 10px;font-size:13px;text-transform:uppercase;letter-spacing:.05em;}
.legend ul{margin:0;padding-left:20px;font-size:14px;}
.legend li{margin-bottom:6px;}

/* ---------- Day card ---------- */
.day-card{
  background:var(--card);border:1px solid var(--border);border-radius:16px;
  padding:20px 22px;margin-bottom:20px;box-shadow:0 1px 3px rgba(74,58,85,0.06);position:relative;
}
.day-head{
  display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px;
  border-bottom:2px solid var(--border);padding-bottom:12px;margin-bottom:14px;
}
.day-head .date-day{font-size:18px;font-weight:700;color:var(--plum);}
.day-head .date-day .date{font-weight:400;color:var(--muted);font-size:13px;margin-left:8px;}
.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.02em;}
.badge-carousel{background:var(--accent3);color:#7A4A1E;}
.badge-single{background:var(--accent2);color:#3E3363;}
body[data-channel="eat-train-evolve"] .badge-single{color:#20486B;}
.badge-posted{background:#CFEFD8;color:#1F6B3A;margin-left:8px;}

/* Small icon-only copy button - sits on the specific piece of content it copies,
   never the whole card, so clicking it never drags along labels or neighboring text. */
.copy-mini{
  position:absolute;right:8px;bottom:8px;
  border:1px solid var(--border);background:#fff;color:var(--muted);
  width:26px;height:26px;border-radius:7px;font-size:13px;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;
  font-family:inherit;transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.copy-mini:hover{background:var(--accent3);color:var(--plum);}
.copy-mini.copied{background:#CFEFD8;color:#1F6B3A;border-color:#9FDBB2;}
.copy-mini.copy-inline{
  position:static;flex-shrink:0;width:22px;height:22px;font-size:12px;background:var(--mono-bg);
}

.platforms{font-size:12px;color:var(--muted);margin-top:2px;}
.platforms span{display:inline-block;background:var(--mono-bg);border-radius:6px;padding:2px 8px;margin-right:5px;margin-bottom:4px;}
.topic{font-size:15px;font-weight:600;color:var(--plum);margin:0 0 14px;}

.section-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;margin:16px 0 6px;}
.section-label:first-of-type{margin-top:0;}

.caption-block{position:relative;font-size:14px;margin-bottom:8px;padding:10px 44px 10px 12px;background:var(--mono-bg);border-radius:10px;}
.caption-block b{color:var(--plum);font-size:11px;text-transform:uppercase;letter-spacing:.03em;display:block;margin-bottom:3px;}

.slides-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:12px;margin-bottom:10px;}
.slide{border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:#FDFBFC;}
.slide .slide-num{font-size:11px;font-weight:700;color:#A9832E;text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px;}
.onimage-row{display:flex;align-items:flex-start;gap:8px;margin:4px 0 8px;}
.onimage-text{font-weight:700;color:var(--plum);font-size:13px;padding:4px 8px;
  background:linear-gradient(90deg,var(--accent3),var(--accent));border-radius:6px;display:inline-block;flex:1;}
.prompt-wrap{position:relative;}
.prompt{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px;
  background:#FFFFFF;border:1px dashed var(--border);border-radius:8px;padding:8px 44px 8px 10px;
  color:#43304E;white-space:pre-wrap;word-break:break-word;
}

.video-block{border:1px solid var(--gold);border-radius:10px;padding:12px 14px;background:#FFFBF0;margin-bottom:10px;}
.video-block .section-label{margin-top:0;color:#9C7A22;}
.video-block .prompt{background:#FFFFFF;}
.video-block .slide{background:#FFFFFF;}
.video-step-label{font-size:11px;font-weight:700;color:#9C7A22;text-transform:uppercase;letter-spacing:.04em;margin:10px 0 4px;}
.video-step-label:first-of-type{margin-top:0;}
.overlay-block{margin-top:4px;}
.overlay-row{align-items:center;}
.overlay-time{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px;color:#9C7A22;background:#FFF3D6;border-radius:5px;padding:2px 6px;flex-shrink:0;white-space:nowrap;}
.note-tiktok{font-size:13px;color:#9C7A22;background:#FFFBF0;border:1px solid var(--gold);border-radius:10px;padding:10px 14px;margin-bottom:10px;}

/* ---------- Distribution table ---------- */
.distribution{background:var(--mono-bg);border-radius:10px;padding:10px 14px 4px;margin-bottom:14px;}
.dist-row{display:grid;grid-template-columns:130px 1fr 150px;gap:10px;font-size:13px;padding:6px 0;border-bottom:1px solid var(--border);}
.dist-row:last-child{border-bottom:none;}
.dist-platform{font-weight:700;color:var(--plum);}
.dist-placement{color:var(--text);}
.dist-asset{color:var(--muted);font-size:12px;text-align:right;}
@media (max-width:640px){
  .dist-row{grid-template-columns:1fr;gap:2px;padding:8px 0;}
  .dist-asset{text-align:left;}
}

.footer-row{display:flex;gap:24px;flex-wrap:wrap;font-size:13px;margin-top:14px;padding-top:12px;border-top:1px solid var(--border);}
.footer-row .lbl{font-weight:700;color:var(--plum);margin-right:6px;}
.footer-row .notes{flex:1;min-width:220px;color:var(--muted);}

/* ---------- Concept view ---------- */
.concept-section{margin-bottom:22px;}
.concept-section h3{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--plum);
  border-bottom:2px solid var(--border);padding-bottom:6px;margin:0 0 10px;}
.concept-row{display:grid;grid-template-columns:200px 1fr;gap:14px;padding:8px 0;border-bottom:1px solid var(--border);font-size:14px;}
.concept-row:last-child{border-bottom:none;}
.concept-row .clabel{font-weight:700;color:var(--plum);}
.concept-row .cvalue{color:var(--text);}
.concept-handle{font-size:14px;color:var(--muted);margin:-14px 0 20px;}