/* Channel setup — banner, post-payment block and the full-screen setup panel (js/channel-setup.js). */
.chs-banner { display:flex; align-items:center; gap:14px; margin:0 0 18px; padding:14px 16px; border-radius:12px;
  background:var(--heat-wash, #FBF0E1); border:1px solid #efd3a9; }
.chs-banner[hidden] { display:none; }
.chs-banner-ic { width:34px; height:34px; border-radius:50%; background:var(--heat, #B45309); color:#fff; display:grid; place-items:center; font-weight:800; flex:none; }
.chs-banner-tx { flex:1; min-width:0; }
.chs-banner-tx b { display:block; font-weight:700; }
.chs-banner-tx small { display:block; color:#7a3a07; font-size:.82rem; }
.chs-go { font-family:'Archivo',sans-serif; font-weight:700; font-size:.88rem; background:var(--signal, #2B7A17); color:#fff; border:0;
  border-radius:8px; padding:11px 18px; cursor:pointer; flex:none; }
.chs-go:hover { filter:brightness(1.08); }
.chs-go-big { font-size:1rem; padding:14px 24px; }

.chs-paid { margin-top:22px; text-align:center; }
.chs-paid-note { color:var(--steel, #5B6470); font-size:.84rem; margin:10px 0 18px; }

.chs-discord { display:flex; align-items:center; gap:14px; text-align:left; margin-top:16px; padding:14px 16px; border-radius:12px;
  background:var(--surface, #fff); border:1px solid var(--rule, #CCD3C6); }
.chs-discord > div { flex:1; min-width:0; }
.chs-discord b { display:block; }
.chs-discord span { display:block; color:var(--steel, #5B6470); font-size:.84rem; }
.chs-discord-btn { display:inline-flex; align-items:center; gap:9px; flex:none; background:#5865F2; color:#fff !important; text-decoration:none;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:.88rem; padding:11px 16px; border-radius:8px; }
.chs-discord-btn svg { width:20px; height:20px; }
.chs-discord-btn:hover { filter:brightness(1.1); }

.chs-overlay { position:fixed; inset:0; z-index:1000; background:var(--panel, #EEF0EB); overflow-y:auto; padding:24px 16px 80px; }
.chs-overlay[hidden] { display:none; }
body.chs-lock { overflow:hidden; }
.chs-panel { max-width:760px; margin:0 auto; position:relative; }
.chs-close { position:absolute; top:-6px; right:0; width:38px; height:38px; border-radius:50%; border:1px solid var(--rule, #CCD3C6);
  background:var(--surface, #fff); font-size:1.4rem; line-height:1; cursor:pointer; color:var(--ink, #0E1116); }
.chs-eyebrow { font:600 11px/1 'IBM Plex Mono',monospace; letter-spacing:.08em; text-transform:uppercase; color:var(--steel, #5B6470); padding-top:8px; }
.chs-h { font-family:'Archivo',sans-serif; font-size:1.8rem; letter-spacing:-.02em; margin:8px 0 6px; }
.chs-lead { color:var(--ink-2, #2B333D); margin:0 0 18px; }
.chs-charge { background:var(--signal-wash, #E3F1D9); border:1px solid #bcd9ad; color:var(--signal-ink, #1E4A12); border-radius:10px;
  padding:12px 14px; font-size:.9rem; margin-bottom:18px; }
.chs-set-h { font-weight:700; margin:22px 0 8px; }
.chs-prog { display:flex; align-items:center; gap:12px; margin:0 0 16px; }
.chs-bar { flex:1; height:8px; background:var(--rule-soft, #E0E6DB); border-radius:99px; overflow:hidden; }
.chs-bar i { display:block; height:100%; background:var(--signal, #2B7A17); border-radius:99px; transition:width .3s; }
.chs-prog span { font-size:.82rem; color:var(--steel, #5B6470); white-space:nowrap; }

.chs-card { background:var(--surface, #fff); border:1px solid var(--rule, #CCD3C6); border-radius:12px; margin-bottom:12px; overflow:hidden;
  box-shadow:0 2px 4px rgba(14,17,22,.05); }
.chs-head { display:flex; align-items:center; gap:12px; padding:14px 16px; }
.chs-ico { width:38px; height:38px; border-radius:10px; flex:none; object-fit:cover; display:block; }
.chs-yt { background:#E02424; } .chs-tt { background:#111; } .chs-sc { background:#F2C200; color:#111; }
.chs-ig { background:linear-gradient(135deg,#F58529,#DD2A7B 55%,#8134AF); }
.chs-name { font-weight:650; }
.chs-sub { color:var(--steel, #5B6470); font-size:.84rem; }
.chs-badge { margin-left:auto; font-size:.75rem; font-weight:600; padding:4px 9px; border-radius:99px; white-space:nowrap; display:inline-flex; align-items:center; }
.chs-b-todo { background:#FBF0E1; color:#B45309; } .chs-b-ok { background:#E3F1D9; color:#1E4A12; }
.chs-b-wait { background:#E8EEF8; color:#2B4C86; } .chs-b-bad { background:#FDECEA; color:#B42318; }
.chs-b-skip, .chs-b-ours { background:#E0E6DB; color:#2B333D; }
.chs-pulse { width:9px; height:9px; border-radius:50%; background:#2B4C86; margin-right:7px; animation:chsp 1.2s infinite; }
@keyframes chsp { 50% { opacity:.25; } }
.chs-body { border-top:1px solid var(--rule-soft, #E0E6DB); padding:14px 16px; background:var(--panel-2, #F7F9F4); }
.chs-body p { margin:0 0 10px; }
.chs-row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.chs-btn { font-family:'Archivo',sans-serif; font-weight:700; font-size:.84rem; background:var(--ink, #0E1116); color:var(--white, #fff); border:1px solid var(--ink, #0E1116);
  border-radius:8px; padding:9px 14px; cursor:pointer; }
.chs-alt { background:var(--white, #fff); color:var(--ink, #0E1116); border-color:var(--rule, #CCD3C6); }
.chs-link { background:none; border:0; color:var(--steel, #5B6470); text-decoration:underline; font-weight:500; padding:9px 4px; }
.chs-guide { margin:12px 0 0; padding:0; list-style:none; counter-reset:chs; }
.chs-guide li { counter-increment:chs; padding:6px 0 6px 32px; position:relative; font-size:.88rem; }
.chs-guide li::before { content:counter(chs); position:absolute; left:0; top:6px; width:22px; height:22px; border-radius:50%; background:var(--ink, #0E1116);
  color:var(--white, #fff); font-size:.72rem; display:grid; place-items:center; }
.chs-tip { background:#FBF0E1; border:1px solid #efd3a9; color:#7a3a07; border-radius:8px; padding:9px 12px; font-size:.82rem; margin-top:12px; }
.chs-final { margin-top:18px; background:var(--surface, #fff); border:1px solid var(--rule, #CCD3C6); border-radius:12px; padding:16px; }
.chs-final h3 { margin:0 0 4px; font-size:1.05rem; } .chs-final p { margin:0; color:var(--steel, #5B6470); font-size:.88rem; }

.chs-go, .chs-discord-btn, .chs-card, .chs-discord, .chs-banner { box-sizing:border-box; }
@media (max-width:640px) {
  .chs-banner, .chs-discord { flex-wrap:wrap; }
  .chs-go, .chs-discord-btn { width:100%; justify-content:center; text-align:center; }
}

/* "Your channels" cards on the dashboard that open the setup panel. */
.chan-card.chs-click { cursor:pointer; transition:border-color .12s, transform .12s; }
.chan-card.chs-click:hover, .chan-card.chs-click:focus-visible { border-color:var(--signal, #2B7A17); transform:translateY(-1px); outline:none; }
.chs-cta { color:var(--signal, #2B7A17); font-weight:700; }
.chan-card:not(.chs-click) .chs-cta { color:var(--steel, #5B6470); font-weight:500; }

/* Setup block at the top of the dashboard (replaces the old banner + full-screen step). */
.chs-inline { margin:0 0 22px; padding:20px 20px 8px; border-radius:14px; background:var(--surface, #fff);
  border:1px solid #efd3a9; box-shadow:0 2px 6px rgba(14,17,22,.06); box-sizing:border-box; }
.chs-inline .chs-eyebrow { padding-top:0; color:#B45309; }
.chs-inline-h { font-family:'Archivo',sans-serif; font-size:1.35rem; letter-spacing:-.02em; margin:6px 0 4px; }
.chs-inline .chs-lead { margin:0 0 14px; }
.chs-inline .chs-discord { margin:6px 0 14px; }
.chs-flash { animation:chsflash 1.4s ease; }
@keyframes chsflash { 0%,60% { box-shadow:0 0 0 3px var(--signal, #2B7A17); } 100% { box-shadow:0 2px 4px rgba(14,17,22,.05); } }

/* Dashboard block: the four channels side by side on a wide screen (2 on a tablet, 1 on a phone). */
.chs-inline .chs-grid { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; margin-bottom:14px; }
.chs-inline .chs-grid .chs-card { margin:0; display:flex; flex-direction:column; }
.chs-inline .chs-head { flex-wrap:wrap; align-items:center; padding:14px; }
.chs-inline .chs-head > div { order:3; flex:1 0 100%; margin-top:4px; }
.chs-inline .chs-badge { margin-left:auto; }
.chs-inline .chs-body { flex:1; padding:12px 14px 14px; }
.chs-inline .chs-row { flex-direction:column; align-items:stretch; gap:8px; }
.chs-inline .chs-row .chs-btn { width:100%; text-align:center; box-sizing:border-box; }
.chs-inline .chs-row .chs-link { padding:4px; }
.chs-inline .chs-prog { margin-bottom:14px; }
@media (max-width:1000px) { .chs-inline .chs-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:560px) { .chs-inline .chs-grid { grid-template-columns:1fr; } }

/* "Is this your channel?" - handle field and preview. */
.chs-lbl { display:block; font-size:.78rem; font-weight:600; color:var(--steel, #5B6470); margin:0 0 6px; }
.chs-find { display:flex; gap:8px; margin-bottom:10px; }
.chs-input { flex:1; min-width:0; box-sizing:border-box; font:inherit; font-size:.9rem; padding:9px 11px; border:1px solid var(--rule, #CCD3C6); border-radius:8px; background:var(--white, #fff); color:var(--ink, #0E1116); }
.chs-input:focus { outline:2px solid var(--signal, #2B7A17); outline-offset:0; border-color:transparent; }
.chs-find .chs-btn { flex:none; }
.chs-found { display:flex; align-items:center; gap:10px; padding:8px 0 0; }
.chs-found img, .chs-found-ph { width:44px; height:44px; border-radius:50%; object-fit:cover; flex:none; background:var(--rule-soft, #E0E6DB); }
.chs-found b { display:block; font-size:.92rem; } .chs-found small { color:var(--steel, #5B6470); font-size:.78rem; }
.chs-warn { color:#B42318; font-size:.84rem; margin:6px 0 8px; }
.chs-look { margin:6px 0 8px; }
.chs-inline .chs-find .chs-btn { width:auto; }

/* ── Row of four channels (Homepage block + post-payment) ── */
.chs-tiles { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; margin:0 0 12px; }
.chs-tile { padding:22px 12px 16px !important; gap:6px !important; min-width:0; box-sizing:border-box; }
.chs-tile .chs-state { display:flex; flex-direction:column; gap:2px; align-items:center; font-size:.82rem; min-height:2.7em; justify-content:center; }
.chs-at { font-family:'IBM Plex Mono', monospace; font-size:.76rem; color:var(--steel, #5B6470); word-break:break-all; }
.chs-ok { color:var(--chs-done-ink); font-weight:700; } .chs-ours { font-weight:600; } .chs-todo, .chs-skip { color:var(--steel, #5B6470); }
.chs-wait { color:#2B4C86; font-weight:600; display:inline-flex; align-items:center; } .chs-bad { color:#B42318; font-weight:700; }
.chs-acts { display:flex; flex-direction:column; gap:6px; width:100%; margin-top:6px; }
.chs-acts .chs-btn { width:100%; box-sizing:border-box; text-align:center; }
/* Connected channels are blue (Romain, 2026-10-29): green stays for "go" actions, blue says "this one is done". */
:root { --chs-done-bg:#E8F0FB; --chs-done-line:#9DBBE8; --chs-done-ink:#1D4E9E; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --chs-done-bg:#12233D; --chs-done-line:#2F5A99; --chs-done-ink:#8DB6F0; } }
:root[data-theme="dark"] { --chs-done-bg:#12233D; --chs-done-line:#2F5A99; --chs-done-ink:#8DB6F0; }
.chs-tile.chs-t-connected { border-color:var(--chs-done-line); background:var(--chs-done-bg); }
.chs-foot { font-size:.82rem; color:var(--steel, #5B6470); margin:2px 0 14px; }
.chs-foot a { color:inherit; }
.chs-paid-h { font-family:'Archivo', sans-serif; font-size:1.15rem; margin:0 0 4px; }
.chs-paid .chs-tiles { grid-template-columns:repeat(2, minmax(0, 1fr)); text-align:left; }
@media (max-width:900px) { .chs-tiles { grid-template-columns:repeat(2, minmax(0, 1fr)); } }

/* ── The guide (central modal) ── */
.chw { position:fixed; inset:0; z-index:1100; background:rgba(14,17,22,.62); display:flex; align-items:center; justify-content:center; padding:20px; overflow-y:auto; box-sizing:border-box; }
.chw[hidden] { display:none; }
.chw-card { position:relative; background:var(--surface, #fff); border-radius:16px; max-width:700px; width:100%; max-height:calc(100vh - 40px); display:flex; flex-direction:column; box-shadow:0 20px 60px rgba(0,0,0,.35); overflow:hidden; }
.chw-x { position:absolute; top:12px; right:14px; width:34px; height:34px; border-radius:50%; border:1px solid var(--rule, #CCD3C6); background:var(--surface, #fff); font-size:1.3rem; line-height:1; cursor:pointer; color:var(--ink, #0E1116); z-index:1; }
.chw-head { display:flex; gap:12px; align-items:center; padding:20px 56px 4px 22px; }
.chw-eyebrow { font:600 11px/1.2 'IBM Plex Mono', monospace; letter-spacing:.06em; text-transform:uppercase; color:var(--steel, #5B6470); }
.chw-h { font-family:'Archivo', sans-serif; font-size:1.35rem; letter-spacing:-.02em; margin:4px 0 0; }
.chw-dots { display:flex; gap:5px; padding:10px 22px 0; }
.chw-dots i { flex:1; height:4px; border-radius:4px; background:var(--rule-soft, #E0E6DB); }
.chw-dots i.d { background:#9ccb85; } .chw-dots i.on { background:var(--signal, #2B7A17); }
.chw-body { padding:14px 22px 10px; overflow-y:auto; flex:1; }
.chw-body p { margin:0 0 12px; }
.chw-fig { margin:12px 0 4px; }
.chw-fig img { width:100%; max-height:44vh; object-fit:contain; border-radius:10px; border:1px solid var(--rule, #CCD3C6); background:#14161a; display:block; }
.chw-foot { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:14px 22px; border-top:1px solid var(--rule-soft, #E0E6DB); background:var(--panel-2, #F7F9F4); }
.chw-right { display:flex; gap:10px; align-items:center; margin-left:auto; }
.chw-choice { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 0 12px; }
.chw-opt { text-align:left; border:2px solid var(--rule, #CCD3C6); border-radius:12px; background:var(--white, #fff); padding:12px 14px; cursor:pointer; font:inherit; color:inherit; }
.chw-opt b { display:block; font-size:.92rem; } .chw-opt small { color:var(--steel, #5B6470); font-size:.78rem; }
.chw-opt:hover { border-color:var(--signal, #2B7A17); } .chw-opt.on { border-color:var(--signal, #2B7A17); background:var(--signal-wash, #E3F1D9); }
.chw-win { text-align:center; padding:14px 0 6px; } .chw-win h3 { margin:6px 0 4px; font-size:1.2rem; } .chw-win p { color:var(--steel, #5B6470); }
.chw-win-pfp { width:88px; height:88px; border-radius:50%; margin:0 auto 8px; position:relative; overflow:hidden; background:var(--rule-soft, #E0E6DB); display:grid; place-items:center; color:#9aa3ab; }
.chw-win-pfp svg { width:46px; height:46px; } .chw-win-pfp img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.chs-pulse-big { width:16px; height:16px; margin:0 auto 6px; display:block; }
.chs-a { display:inline-block; text-decoration:none; }
.chs-inl { padding:0 !important; text-decoration:underline; }
@media (max-width:560px) {
  .chw { padding:0; align-items:stretch; }
  .chw-card { max-height:none; min-height:100vh; border-radius:0; }
  .chw-choice { grid-template-columns:1fr; }
  .chw-fig img { max-height:36vh; }
}

.chs-paid-next { display:flex; flex-direction:column; gap:4px; text-align:left; margin:18px 0 0; padding:14px 16px; border-radius:12px; background:var(--signal-wash, #E3F1D9); border:1px solid var(--signal, #bcd9ad); }
.chs-paid-next b { font-family:'Archivo', sans-serif; color:var(--signal-ink, #1E4A12); }
.chs-paid-next span { font-size:.88rem; color:var(--ink-2, #2B333D); }

/* "Change channel" links */
.chs-chg { font-size:.78rem !important; padding:4px !important; }
.chs-chg-link { font-size:.74rem; color:var(--steel, #5B6470); text-decoration:underline; cursor:pointer; margin-top:2px; }
.chs-chg-link:hover { color:var(--ink, #0E1116); }

/* A new account the client has not announced: "Is this yours?" */
.chs-sug { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:12px; margin:0 0 14px; border-radius:12px; background:var(--heat-wash, #FBF0E1); border:1px solid var(--heat, #efd3a9); }
.chs-sug img, .chs-sug .chs-found-ph { width:40px; height:40px; border-radius:50%; object-fit:cover; flex:none; }
.chs-sug > div { flex:1; min-width:160px; } .chs-sug b { display:block; font-size:.9rem; } .chs-sug small { color:var(--steel, #5B6470); }

.chs-sug.chs-conf { background:#FDECEA; border-color:#f3b8b2; }
.chs-sug.chs-conf small a { color:inherit; }

/* An order that is over: the offer at the top, and no production / cycle / pace strips. */
.wd-cta { display:flex; align-items:center; gap:18px; margin:0 0 20px; padding:18px 20px; border-radius:14px;
  background:var(--signal-wash, #E3F1D9); border:1px solid var(--signal, #2B7A17); box-sizing:border-box; }
.wd-tx { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.wd-eb { font:600 11px/1 'IBM Plex Mono', monospace; letter-spacing:.08em; text-transform:uppercase; color:var(--signal-ink, #1E4A12); }
.wd-tx b { font-family:'Archivo', sans-serif; font-size:1.3rem; letter-spacing:-.02em; color:var(--ink, #0E1116); }
.wd-tx span:last-child { font-size:.92rem; color:var(--ink-2, #2B333D); }
.wd-go { font-family:'Archivo', sans-serif; font-weight:700; font-size:.95rem; background:var(--signal, #2B7A17); color:#fff; border:0;
  border-radius:10px; padding:13px 22px; cursor:pointer; flex:none; }
.wd-go:hover { filter:brightness(1.08); }
#home-root.winddown .sch-hero { display:none; }
@media (max-width:640px) { .wd-cta { flex-direction:column; align-items:stretch; } .wd-go { width:100%; } }

/* Instagram: an initial on the brand gradient when its picture cannot be read. */
.chs-ig-av { position:absolute; inset:0; display:grid; place-items:center; color:#fff; font:700 1.7rem/1 'Archivo', sans-serif;
  background:linear-gradient(135deg, #F58529, #DD2A7B 55%, #8134AF); }
