/* Planning (owner's brief 2026-11-11, round 2): the week grid as the planning home — today's column highlighted, a summary under
   each day, a soft peak-time band, "Plan here" slots, cards tinted by platform with a status chip; list rows like a delivery hub;
   the composer preview inside a phone frame. Scoped to .in-app. Reduced motion at the end. */

/* platform colours for cards */
.in-app .cv-card{--pc:var(--brand)}
.in-app .cv-card[data-platform=instagram]{--pc:#E4405F}.in-app .cv-card[data-platform=facebook]{--pc:#0866FF}.in-app .cv-card[data-platform=youtube]{--pc:#FF0000}
.in-app .cv-card[data-platform=telegram]{--pc:#26A5E4}.in-app .cv-card[data-platform=tiktok]{--pc:#111827}.in-app .cv-card[data-platform=linkedin]{--pc:#0A66C2}.in-app .cv-card[data-platform=x]{--pc:#111}

/* week grid frame */
.in-app .cv-scroll{border-radius:18px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow-1)}
.in-app .tg-corner,.in-app .tg-dh{background:rgba(250,249,255,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.in-app .tg-dbtn{gap:.1rem;padding:.4rem .25rem .45rem}
.in-app .tg-dbtn>span:first-child{text-transform:uppercase;font-size:.68rem;letter-spacing:.06em}
.in-app .tg-sum{display:block;font-size:.68rem;font-weight:600;color:var(--muted);letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.in-app .tg-today{font-style:normal;font-size:.6rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:var(--ink);border-radius:6px;padding:.05rem .4rem;margin:.1rem 0}
.in-app .tg-dh.today{background:linear-gradient(180deg,#16133a,#2a2366)}
.in-app .tg-dh.today .tg-dbtn,.in-app .tg-dh.today .tg-sum{color:rgba(255,255,255,.75)}
.in-app .tg-dh.today .tg-dbtn b{background:#fff;color:var(--ink)}
.in-app .tg-dh.today .tg-today{background:var(--brand);}
.in-app .tg-dh.today button.tg-dbtn:hover{background:rgba(255,255,255,.08)}
.in-app .tcol.today{background:linear-gradient(180deg,color-mix(in srgb,var(--brand) 6%,#fff),color-mix(in srgb,var(--brand) 3%,#fff))}

/* peak-time band */
.in-app .tg-peak{position:absolute;left:0;right:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(239,68,68,.07),rgba(239,68,68,.04));border-top:1px dashed rgba(239,68,68,.35);border-bottom:1px dashed rgba(239,68,68,.25);animation:fade .5s var(--ease) .2s both}
.in-app .tg-hl.peak{color:#dc2626;font-weight:700}
.in-app .tg-hl.peak em{display:block;font-style:normal;font-size:.58rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:#ef4444;border-radius:4px;padding:0 .3rem;margin:.1rem 0 0 auto;width:max-content}

/* "Plan here" slot */
.in-app .tg-slot{position:absolute;left:4px;right:4px;z-index:2;display:flex;align-items:center;justify-content:center;gap:.35rem;border:1.5px dashed color-mix(in srgb,var(--brand) 55%,transparent);border-radius:10px;background:color-mix(in srgb,var(--brand) 6%,#fff);color:var(--brand-d);font-size:.74rem;font-weight:650;text-decoration:none;animation:slotIn .18s var(--ease) both}
.in-app .tg-slot .ico{width:14px;height:14px}.in-app .tg-slot:hover{background:var(--brand-l);text-decoration:none}
body.is-dragging .tg-slot{display:none}
@keyframes slotIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}

/* cards: white, platform-tinted mark, status as a chip */
.in-app .cv-card.d-grid{background:#fff;border-radius:10px;box-shadow:0 1px 2px rgba(36,22,92,.08),0 6px 14px -10px rgba(36,22,92,.35);transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.in-app .cv-card.d-grid:hover{transform:translateY(-1px);box-shadow:0 2px 4px rgba(36,22,92,.1),0 12px 24px -12px rgba(36,22,92,.45);z-index:5}
.in-app .cv-card .cv-top .pmark{flex:none;box-sizing:content-box;padding:2px;border-radius:6px;background:color-mix(in srgb,var(--pc) 12%,#fff)}
.in-app .cv-card.d-grid .cv-st{align-self:flex-start;padding:.05rem .45rem;border-radius:99px;background:color-mix(in srgb,var(--st) 13%,#fff);margin-top:.1rem}
.in-app .cv-card.d-grid.tall .cv-st{position:absolute;top:4px;right:4px;margin:0}

/* list view: rows like a delivery hub (thumbnail, caption, channel, time, status) */
.in-app .cv-lrows{display:grid;gap:.5rem}
.in-app .cv-card.d-list{background:#fff;border:1px solid var(--line);border-radius:16px;padding:.5rem;min-height:76px;box-shadow:var(--shadow-1);transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease),border-color var(--t-fast);animation:rise .38s var(--ease) both}
.in-app .cv-card.d-list:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--pc) 35%,var(--line));box-shadow:var(--shadow-2)}
.in-app .cv-card.d-list .cv-st{padding:.15rem .6rem;border-radius:99px;background:color-mix(in srgb,var(--st) 13%,#fff);width:max-content}

/* composer: preview in a phone frame, destinations as chips */
.in-app .composer .side .preview-stage{background:linear-gradient(180deg,#f6f3ff,#efeafe);padding:1.25rem .75rem}
.in-app .composer .side .preview-stage>*:not(.sim-tag){position:relative;width:min(100%,290px);max-width:290px;min-height:480px;border-radius:30px;border:8px solid #16133a;box-shadow:0 0 0 1px #2b2560,0 30px 60px -24px rgba(36,22,92,.55);overflow:hidden;background:#fff}
.in-app .composer .side .preview-stage>*:not(.sim-tag)::before{content:"";display:block;width:90px;height:18px;margin:0 auto 4px;border-radius:0 0 12px 12px;background:#16133a}
.in-app .dest{border-radius:14px;min-height:52px}
.in-app .dest:has(input:checked){box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 14%,transparent)}

@media(prefers-reduced-motion:reduce){.in-app .tg-peak,.in-app .tg-slot,.in-app .cv-card.d-list{animation:none!important}.in-app .cv-card.d-grid:hover,.in-app .cv-card.d-list:hover{transform:none}}