/* The writing paper is light; the surrounding studio keeps HQ's chosen green. */
.cp-root { --cp-green:#0a5f4b; --cp-ink:#17332b; --cp-muted:#586c64; color:var(--cp-ink); }
.cp-root p,.cp-root h1,.cp-root h2,.cp-root h3,.cp-root h4,.cp-root label { text-wrap:pretty; }
.cp-root .ptitle,.cp-root>.page-head { color:var(--cv-ink); }
.cp-root h2 { font-size:26px; letter-spacing:-.6px; line-height:1.15; margin:0 0 10px; }
.cp-root h3 { font-size:18px; margin:0 0 16px; }
.cp-root h4 { font-size:15px; margin:24px 0 10px; }
.cp-header { display:flex; align-items:center; gap:20px; justify-content:space-between; padding:24px 0; color:#eef6f1; }
.cp-header .cp-hint { color:#adbbb4; }
.cp-hint { font-size:13px; line-height:1.55; color:var(--cp-muted); margin:6px 0 12px; text-wrap:pretty; }
.cp-actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.cp-root .cp-button,.cp-copy-dialog .cp-button { border:1px solid #c9d6ce; background:#fff; color:#17332b; padding:10px 14px; border-radius:8px; font:inherit; font-size:13px; font-weight:650; cursor:pointer; min-height:40px; white-space:normal; }
.cp-root .cp-button:hover { background:#eef5ef; }
.cp-root .cp-primary { background:#0a5f4b; color:#fff; border-color:#0a5f4b; }
.cp-root .cp-primary:hover { background:#074b3b; }
.cp-root button:disabled { opacity:.5; cursor:default; }
.cp-root :is(button,input,textarea,select,a,summary):focus-visible { outline:3px solid #60b798; outline-offset:3px; }
.cp-workspace { min-width:0; margin-top:24px; }
.cp-library { min-width:0; }
.cp-root input:not([type=checkbox]),.cp-root textarea,.cp-root select { display:block; box-sizing:border-box; width:100%; min-width:0; border:1px solid #c7d2cc; border-radius:7px; background:#fff; color:#17332b; padding:11px 12px; font:inherit; font-size:15px; line-height:1.5; }
.cp-root textarea { resize:vertical; }
.cp-root select { appearance:none; padding-right:27px; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='12'%3E%3Cpath d='m3 4 4 4 4-4' stroke='%23586c64' fill='none'/%3E%3C/svg%3E") no-repeat right 10px center; }
.cp-field { display:block; min-width:0; margin-bottom:18px; }
.cp-label { display:block; font-size:12px; font-weight:650; margin-bottom:6px; color:#42594e; }
/* Posts home follows the Videos board; a card opens the separate writing surface. */
.cp-library-filters { display:flex; align-items:center; gap:16px; margin-bottom:22px; flex-wrap:wrap; }
.cp-root .cp-library-filters .cp-search { width:280px; max-width:100%; }
.cp-library-filters .cp-field { display:flex; align-items:center; gap:10px; margin:0; }
.cp-library-filters .cp-label { margin:0; color:#adbbb4; white-space:nowrap; }
.cp-library-filters select { width:175px; }
.cp-archive-filter { display:flex; align-items:center; gap:8px; font-size:13px; color:#adbbb4; }
.cp-archive-filter input { accent-color:#3ee091; }
.cp-board { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; overflow-x:auto; padding:4px 3px 12px; align-items:start; scroll-snap-type:x proximity; }
.cp-column { min-width:0; padding:12px; background:var(--cv-col); border-radius:14px; scroll-snap-align:start; }
.cp-root .cp-column-heading { display:flex; align-items:center; gap:9px; margin:0; padding:4px 2px 16px; color:var(--cv-soft); font-size:13px; font-weight:700; }
.cp-column-count { margin-left:auto; font-size:12px; font-variant-numeric:tabular-nums; }
.cp-stage-dot { height:8px; width:8px; border-radius:50%; background:#9baea5; flex-shrink:0; }
.cp-column[data-stage=draft] .cp-stage-dot { background:#dbb26a; }
.cp-column[data-stage=ready] .cp-stage-dot { background:#59c5c4; }
.cp-column[data-stage=posted] .cp-stage-dot { background:#3ee091; }
.cp-cards { display:grid; gap:12px; }
.cp-empty-column { border:1px dashed var(--cv-line); border-radius:10px; color:var(--cv-soft); font-size:12px; text-align:center; padding:28px 8px; margin:0; }
.cp-workspace>.cp-hint,.cp-post-list>.cp-hint,.cp-pagination .cp-hint { color:var(--cv-soft); }
.cp-pagination { margin-top:16px; }
.cp-post-card { all:unset; display:flex; box-sizing:border-box; width:100%; flex-direction:column; gap:14px; padding:18px; cursor:pointer; background:var(--cv-card); color:var(--cv-ink); border:1px solid var(--cv-line); border-radius:12px; overflow-wrap:anywhere; transition:border-color .15s,transform .15s; }
.cp-post-card:hover { border-color:#3b6350; transform:translateY(-2px); }
.cp-card-platform { font-size:11px; color:var(--cv-accent); font-weight:700; }
.cp-post-card strong { font-size:17px; line-height:1.4; text-wrap:pretty; }
.cp-card-meta { display:flex; gap:8px; justify-content:space-between; font-size:11px; color:var(--cv-soft); border-top:1px solid var(--cv-line); padding-top:12px; }
.cp-card-hook { font-size:13px; line-height:1.6; color:var(--cv-soft); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.cp-editor { min-width:0; background:#fff; border-radius:12px; padding:24px; }
.cp-editor-top { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:20px; }
.cp-editor-top>.cp-button:first-child { margin-right:auto; }
.cp-save-state { font-size:12px; color:#586c64; max-width:480px; text-wrap:pretty; }
.cp-error { color:#a62d30; font-size:13px; line-height:1.5; }
.cp-meta { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.cp-meta select,.cp-meta input { font-size:13px; padding:9px 10px; }
.cp-meta select { padding-right:26px; }
.cp-panes { display:flex; gap:6px; border-bottom:1px solid #dce3dd; padding-bottom:12px; margin:6px 0 24px; flex-wrap:wrap; }
.cp-panes .cp-button { border:0; }
.cp-panes [aria-pressed=true] { background:#e6f1e9; color:#0a5f4b; }
.cp-writing { display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,.85fr); gap:28px; align-items:start; }
.cp-writing-fields { min-width:0; }
.cp-brief { background:#f2f6f2; border-radius:8px; padding:14px; margin-bottom:24px; }
.cp-brief summary { font-size:13px; font-weight:650; cursor:pointer; }
.cp-brief[open] summary { margin-bottom:18px; }
.cp-preview { position:sticky; top:24px; min-width:0; }
.cp-preview h3 { font-size:12px; color:#586c64; font-weight:600; }
.cp-paper { padding:20px; background:#fafcf9; border:1px solid #dce3dd; border-radius:10px; }
.cp-author { display:flex; align-items:center; gap:10px; margin-bottom:22px; }
.cp-author strong { font-size:13px; }
.cp-author .cp-hint { margin:2px 0 0; font-size:11px; }
.cp-avatar { background:#e0eae3; border-radius:50%; width:38px; height:38px; display:grid; place-items:center; font-size:13px; font-weight:700; flex-shrink:0; }
.cp-post-text,.cp-kit-text { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.7; font-size:14px; }
.cp-character-count { margin-top:12px; color:#586c64; font-size:12px; }
.cp-media-note { border-top:1px solid #dce3dd; margin-top:20px; padding-top:16px; color:#586c64; font-size:12px; }
.cp-assets { display:grid; gap:8px; }
.cp-asset { display:flex; align-items:center; gap:12px; justify-content:space-between; background:#f2f6f2; padding:10px 14px; border-radius:8px; }
.cp-link { display:block; color:#0a5f4b; overflow-wrap:anywhere; font-size:14px; margin:10px 0; }
.cp-add-media { display:grid; grid-template-columns:1fr 2fr auto; gap:10px; margin:16px 0; }
.cp-add-media .cp-error { grid-column:1/-1; }
.cp-file-picker { max-height:280px; overflow:auto; display:grid; gap:6px; margin:16px 0; }
.cp-file-picker .cp-button { text-align:left; }
.cp-pane>.cp-field:last-child { margin-top:24px; }
.cp-kit-text { background:#f7faf6; padding:22px; border-radius:8px; margin:20px 0; }
.cp-after { border-top:1px solid #dce3dd; padding-top:4px; margin-top:32px; }
.cp-bottom { border-top:1px solid #dce3dd; padding-top:20px; margin-top:20px; }
.cp-conflict { background:#fff2e6; padding:16px; border-radius:8px; margin-bottom:20px; }
.cp-conflict[hidden] { display:none; }
.cp-copy-dialog { padding:24px; border:1px solid #c7d2cc; border-radius:12px; max-width:600px; width:90vw; }
.cp-copy-dialog textarea { width:100%; box-sizing:border-box; padding:12px; font:inherit; margin-bottom:16px; }
@media(max-width:1200px) { .cp-writing { grid-template-columns:1fr; } .cp-preview { position:static; } .cp-meta { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(min-width:801px) and (max-width:1100px) { .cp-board { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:800px) { .cp-header { align-items:flex-start; flex-direction:column; } .cp-board { grid-template-columns:1fr; } .cp-library-filters { gap:12px; } .cp-root .cp-library-filters .cp-search { width:100%; } .cp-root input:not([type=checkbox]),.cp-root textarea,.cp-root select { font-size:16px; } .cp-editor { padding:20px; } .cp-meta { grid-template-columns:repeat(2,minmax(0,1fr)); } .cp-add-media { grid-template-columns:1fr; } .cp-header h2 { font-size:23px; } .cp-root .cc-tabs { flex-wrap:wrap; } }
@media(prefers-reduced-motion:reduce) { .cp-root * { scroll-behavior:auto; transition:none; } .cp-post-card:hover { transform:none; } }

.cv-look-e .cp-root :is(textarea,select,input:not([type=checkbox])) { background-color:#fff; color:#17332b; border-color:#c7d2cc; }
.cv-look-e .cp-root :is(textarea,input)::placeholder { color:#71847a; opacity:1; }

.cp-post-card strong,.cp-card-hook,.cp-root .cp-hint { text-wrap:balance; }

/* Media and drafting live beside the words, within the existing writing surface. */
.cp-root .cp-writer,.cp-root .cp-upload-box { padding:18px;border:1px solid #b8d4ca;border-radius:12px;background:#eff7f2;margin:18px 0;color:#17372e }
.cp-root .cp-writer h4,.cp-root .cp-upload-box h4,.cp-root .cp-suggestion h4 { color:#17372e;margin:0 0 8px }
.cp-root .cp-writer .cp-hint,.cp-root .cp-upload-box .cp-hint {color:#4c655c}
.cp-root .cp-suggestion {border-top:1px solid #b8d4ca;margin-top:18px;padding-top:16px;overflow-wrap:anywhere}
.cp-root .cp-suggestion .cp-kit-text {max-height:340px;overflow:auto;font-size:14px;margin:12px 0}
.cp-root .cp-check-note {padding:12px;background:#fff3d7;border-radius:8px;color:#695016;font-size:13px;text-wrap:pretty}
.cp-root .cp-suggestion-comment {white-space:pre-wrap;font-size:14px;color:#17372e}
.cp-root .cp-previous-draft {margin-top:14px;font-size:14px}
.cp-root .cp-upload-label {display:block;font-weight:600;color:#17372e}
.cp-root .cp-upload-label input {display:block;margin-top:8px;width:100%;font-size:16px}
.cp-root .cp-dragging {outline:3px solid #16836b}
.cp-root .cp-uploaded {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:12px;margin-bottom:18px}
.cp-root .cp-upload-card,.cp-root .cp-upload-progress {padding:12px;border:1px solid #d5e0db;border-radius:10px;display:flex;flex-direction:column;gap:8px;min-width:0;color:#17372e;background:#f8faf9;overflow-wrap:anywhere}
.cp-root .cp-upload-card img {width:100%;height:140px;object-fit:contain;background:#e7eee9;border-radius:6px}
.cp-root .cp-file-type {height:100px;display:grid;place-items:center;background:#e7eee9;font-size:24px;font-weight:700}
.cp-root .cp-upload-card a {overflow-wrap:anywhere}

.cp-root .cp-post-text,.cp-root .cp-kit-text {text-wrap:balance}
.cp-root .cp-title-tail {white-space:nowrap}
