/* CREATIVE_CENTER_V1 — Creative Center page. Dark Launcher chrome (framed trays, real headings); the email canvas stays light.
   Desktop-first (1100–1680 px), never a sideways scroll: fixed-layout table, ellipsis, the editor grid shrinks its side panels. */
.cc-wrap{max-width:1640px}
.cc-app{display:grid;gap:22px;min-width:0}
.cc-head{padding-left:16px}
.cc-head .sb-group{flex:0 1 auto}
.cc-danger:not(:disabled){color:#ff9aa0}
.cc-ico{min-width:44px;justify-content:center;font-size:17px!important}
.cc-seg{display:flex;gap:4px}
.cc-seg .sb-btn{min-height:36px!important;padding:0 12px!important;font-size:13px!important}
.cc-seg .sb-btn.on{border-color:rgba(77,224,255,.7);background:rgba(77,224,255,.12);color:#fff}
.cc-name{font-weight:650;color:#f4f7ff;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:32ch}
.cc-pill{display:inline-flex;align-items:center;min-height:22px;padding:0 9px;border-radius:999px;font-size:11.5px;font-weight:650;letter-spacing:.02em;border:1px solid rgba(154,166,194,.3);color:#9ca9c4;white-space:nowrap}
.cc-pill:empty{display:none}
.cc-pill.dirty{border-color:rgba(255,196,107,.55);color:#ffc46b}.cc-pill.saved{border-color:rgba(100,231,181,.5);color:#64e7b5}
/* library */
.cc-t{width:100%;table-layout:fixed;border-collapse:collapse;font-size:13.5px}
.cc-t th{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:10px 12px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8d9bbb;font-weight:600;border-bottom:1px solid rgba(154,166,194,.16);text-align:left}
.cc-t td{text-align:left;padding:11px 12px;border-bottom:1px solid rgba(139,118,255,.08);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.cc-t .r{text-align:right}
.cc-t col.w-name{width:21%}.cc-t col.w-subj{width:24%}.cc-t col.w-pre{width:auto}.cc-t col.w-upd{width:150px}.cc-t col.w-used{width:92px}.cc-t col.w-pl{width:150px}
.cc-t tbody tr{cursor:pointer}
.cc-t tbody tr:hover td{background:rgba(255,255,255,.025)}
.cc-t tbody tr.sel td{background:rgba(77,224,255,.08)}
.cc-t tbody tr.sel td:first-child{box-shadow:inset 3px 0 0 #4de0ff}
.cc-t .nm{font-weight:650;color:#f4f7ff}
.cc-t .mut{color:#9ca9c4}
.cc-ok{color:#64e7b5}.cc-warn{color:#ffc46b}
.cc-empty{text-align:center!important;color:#8d9bbb;padding:22px 16px!important}
/* meta fields + tokens */
.cc-meta{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.5fr) minmax(0,.8fr) 140px;gap:10px 12px;padding:0 16px 10px}
.cc-f{display:grid;gap:5px;min-width:0}
.cc-f span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8d9bbb;font-weight:600}
.cc-f input,.cc-f select{width:100%;min-height:40px;padding:0 12px;border-radius:10px;border:1px solid rgba(154,166,194,.3);background:rgba(255,255,255,.035);color:var(--text);font:inherit;box-sizing:border-box;min-width:0}
.cc-f select{background:#0f1730}
.cc-f input:focus,.cc-f select:focus,.cc-html textarea:focus{outline:2px solid rgba(77,224,255,.6);outline-offset:1px}
.cc-tokens{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:0 16px 12px}
.cc-tk-l{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8d9bbb;font-weight:600;margin-right:4px}
.cc-tk{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:8px;border:1px solid rgba(139,118,255,.35);background:rgba(139,118,255,.1);color:#dcd4ff;font:600 12.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;cursor:pointer;white-space:nowrap}
.cc-tk:hover{border-color:rgba(77,224,255,.6)}
.cc-tk-n{font-size:12px;color:#8d9bbb;flex:1 1 100%}
/* editor */
.cc-ed{display:grid;grid-template-columns:200px minmax(0,1fr) 270px;height:max(640px,calc(100vh - 150px));border-top:1px solid rgba(139,118,255,.16);min-width:0}
.cc-side{min-width:0;overflow-y:auto;overflow-x:hidden;background:rgba(7,11,24,.55)}
.cc-left{border-right:1px solid rgba(139,118,255,.16);padding:12px 10px}
.cc-right{border-left:1px solid rgba(139,118,255,.16);display:flex;flex-direction:column}
.cc-sh{margin:0 4px 2px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:#c8d3ef}
.cc-hint{margin:0 4px 10px;color:#8d9bbb;font-size:12.5px;line-height:1.45}
.cc-center{position:relative;min-width:0;background:#e9edf4}
#gjs{position:absolute;inset:0;border:0}
.cc-center.htmlmode #gjs{visibility:hidden}
.cc-html{position:absolute;inset:0;display:flex;flex-direction:column;background:#0b1226}
.cc-html[hidden]{display:none}
.cc-html-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;padding:10px 12px;border-bottom:1px solid rgba(139,118,255,.16)}
.cc-html-bar .cc-hint{margin:0;flex:1 1 260px}
.cc-html textarea{flex:1 1 auto;width:100%;resize:none;border:0;background:#0b1226;color:#dfe6fb;font:12.5px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;padding:12px 14px;box-sizing:border-box;white-space:pre;overflow:auto;tab-size:2}
.cc-rtabs{display:flex;gap:4px;padding:10px 10px 6px;border-bottom:1px solid rgba(139,118,255,.12)}
.cc-rtabs button{flex:1 1 0;min-height:34px;border-radius:9px;border:1px solid rgba(154,166,194,.25);background:rgba(255,255,255,.03);color:#c8d3ef;font:600 12.5px/1 Inter,system-ui,sans-serif;cursor:pointer}
.cc-rtabs button.on{border-color:rgba(77,224,255,.7);background:rgba(77,224,255,.12);color:#fff}
.cc-rpane{padding:10px 6px;overflow-y:auto;overflow-x:hidden;flex:1 1 auto;min-height:0}
.cc-rpane[hidden]{display:none}
.cc-end{height:calc(var(--ml-corner, 0px) + 72px)}
/* GrapesJS, restyled to the Launcher */
#gjs .gjs-pn-panel{display:none}
#ccSel{display:none}
.gjs-one-bg{background-color:transparent}
.gjs-two-color{color:#c8d3ef}
.gjs-three-bg{background-color:#4de0ff;color:#07122a}
.gjs-four-color,.gjs-four-color-h:hover{color:#4de0ff}
.gjs-editor{font-family:Inter,system-ui,sans-serif}
.gjs-cv-canvas{width:100%;height:100%;top:0;background:#e9edf4}
.gjs-blocks-c{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0}
.gjs-block-categories{min-width:0}
.gjs-block-category .gjs-title{background:transparent;border:0;color:#9ca9c4;font:600 11px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:12px 4px 8px}
.gjs-block-category{border:0}
.gjs-block{width:auto;min-height:74px;margin:0;padding:10px 6px;border-radius:11px;border:1px solid rgba(154,166,194,.25);background:rgba(255,255,255,.035);color:#dfe6fb;box-shadow:none;font:600 12px/1.25 Inter,system-ui,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;transition:border-color .12s,background .12s}
.gjs-block:hover{border-color:rgba(77,224,255,.6);background:rgba(77,224,255,.08);color:#fff}
.gjs-block svg{width:28px;height:28px;fill:none;stroke:#4de0ff;stroke-width:1.6}
.gjs-block-label{font-size:12px}
.gjs-sm-sectors,.gjs-trt-traits,.gjs-layers{background:transparent}
.gjs-sm-sector{border-bottom:1px solid rgba(139,118,255,.12)}
.gjs-sm-sector .gjs-sm-sector-title,.gjs-sm-sector-title{background:transparent;border:0;color:#c8d3ef;font:600 11.5px/1 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:12px 6px}
.gjs-sm-properties{padding:4px 2px 10px}
.gjs-sm-label,.gjs-label,.gjs-trt-trait .gjs-label-wrp{color:#9ca9c4;font-size:12px}
.gjs-field{background:rgba(255,255,255,.05);border:1px solid rgba(154,166,194,.25);border-radius:8px;color:#f4f7ff}
.gjs-field input,.gjs-field select,.gjs-field textarea{color:#f4f7ff}
.gjs-field select option{background:#0f1730}
.gjs-clm-tags{padding:0 4px 8px}
.gjs-layer{background:transparent;color:#c8d3ef}
.gjs-layer.gjs-selected .gjs-layer-item{background:rgba(77,224,255,.12)}
.gjs-layer-item{border-bottom:1px solid rgba(139,118,255,.08)}
.gjs-mdl-dialog{background:#101834;color:#f4f7ff;border:1px solid rgba(77,224,255,.3);border-radius:16px}
.gjs-mdl-header{border-bottom:1px solid rgba(139,118,255,.16)}
.gjs-am-assets-cont,.gjs-am-add-asset .gjs-field{background:rgba(255,255,255,.04)}
.gjs-am-add-asset button,.gjs-btn-prim{background:linear-gradient(135deg,#4de0ff,#64e7b5);color:#07122a;border-radius:9px;font-weight:650}
.gjs-rte-toolbar{background:#101834;border:1px solid rgba(77,224,255,.3);border-radius:10px}
.gjs-rte-action{color:#dfe6fb;border-right-color:rgba(139,118,255,.2)}
.gjs-toolbar{background:#1f6feb;border-radius:6px}
.gjs-badge{background:#1f6feb}
.gjs-selected{outline:2px solid #1f6feb!important}
/* dialog */
.cc-modal{position:fixed;inset:0;z-index:2147483100;display:grid;place-items:center;background:rgba(3,6,16,.72);padding:16px}
.cc-modal[hidden]{display:none}
.cc-box{width:min(520px,100%);border:1px solid rgba(77,224,255,.3);border-radius:18px;background:linear-gradient(160deg,#131c3a,#0d1428);box-shadow:0 24px 60px rgba(0,0,0,.55);padding:20px 22px;display:grid;gap:10px;box-sizing:border-box}
.cc-eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;background:linear-gradient(90deg,#4de0ff,#6be3a5);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:700}
.cc-box h3{margin:0;font-size:19px;overflow-wrap:anywhere}
.cc-dsub{margin:0;color:#9ca9c4;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.cc-dsub:empty{display:none}
.cc-box input[type=text]{width:100%;min-height:42px;border-radius:10px;border:1px solid rgba(154,166,194,.35);background:rgba(255,255,255,.04);color:#fff;padding:0 12px;font:14px Inter,system-ui,sans-serif;box-sizing:border-box}
.cc-err{margin:0;min-height:18px;color:#ff8a8a;font-size:12.5px}
.cc-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}
.cc-foot .sb-btn{flex:0 0 auto}
.cc-foot .btn.danger{background:linear-gradient(135deg,#ff8087,#ffb86b)}
@media (max-width:1280px){.cc-ed{grid-template-columns:184px minmax(0,1fr) 244px}.cc-t col.w-upd{width:130px}.cc-t col.w-pl{width:128px}}
@media (max-width:1100px){.cc-meta{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (max-width:860px){.cc-ed{grid-template-columns:minmax(0,1fr);height:auto}.cc-center{height:70vh}.cc-left,.cc-right{max-height:360px}
  .cc-t col.w-pre,.cc-t col.w-used{width:0}.cc-t th:nth-child(3),.cc-t td:nth-child(3),.cc-t th:nth-child(5),.cc-t td:nth-child(5){display:none}}
@media (max-width:620px){.cc-meta{grid-template-columns:1fr}.cc-t th:nth-child(2),.cc-t td:nth-child(2){display:none}}
/* CC_LIBRARY_V1 — Library grid: filters tray + cards with a scaled, sandboxed thumbnail of the real email. Never a sideways scroll:
   the grid wraps (auto-fill), every text line ellipsises, the thumbnail iframe is scaled to its box (transform), never wider. */
.cl-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 12px;padding:0 16px 14px;min-width:0}
.cl-f{display:grid;gap:5px;min-width:0;flex:0 1 180px}
.cl-f.cl-q{flex:1 1 260px;max-width:420px}
.cl-f span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8d9bbb;font-weight:600}
.cl-f input,.cl-f select{width:100%;min-height:40px;padding:0 12px;border-radius:10px;border:1px solid rgba(154,166,194,.3);background:rgba(255,255,255,.035);color:var(--text);font:inherit;box-sizing:border-box;min-width:0}
.cl-f select{background:#0f1730}
.cl-f input:focus,.cl-f select:focus{outline:2px solid rgba(77,224,255,.6);outline-offset:1px}
.cl-chk{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 12px;border-radius:10px;border:1px solid rgba(154,166,194,.3);background:rgba(255,255,255,.035);color:#dfe6fb;font-size:13.5px;cursor:pointer;white-space:nowrap}
.cl-chk input{width:16px;height:16px;accent-color:#4de0ff;margin:0}
.cl-clear{min-height:40px!important}
.cl-count{margin-left:auto;align-self:center;color:#9ca9c4;font-size:13px;white-space:nowrap}
.cl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(236px,1fr));gap:14px;padding:0 16px 16px;min-width:0}
.cl-grid>.cc-empty{grid-column:1/-1;margin:0}
.cl-card{display:flex;flex-direction:column;min-width:0;border:1px solid rgba(154,166,194,.2);border-radius:14px;background:rgba(255,255,255,.025);overflow:hidden;transition:border-color .12s}
.cl-card:hover{border-color:rgba(77,224,255,.45)}
.cl-card.open{border-color:rgba(77,224,255,.8);box-shadow:0 0 0 1px rgba(77,224,255,.35)}
.cl-thumb{--s:.4;position:relative;height:210px;overflow:hidden;background:#eef1f6;border-bottom:1px solid rgba(154,166,194,.2)}
.cl-frame{position:absolute;left:0;top:0;width:600px;height:calc(210px / var(--s));border:0;transform:scale(var(--s));transform-origin:0 0;pointer-events:none;background:#fff}
.cl-noprev{position:absolute;inset:0;padding:18px 16px;color:#5b6b8c;font:13px/1.55 Arial,Helvetica,sans-serif;overflow:hidden;background:repeating-linear-gradient(135deg,#f3f5f9 0 12px,#eef1f6 12px 24px)}
.cl-lang{position:absolute;right:8px;top:8px;padding:2px 8px;border-radius:999px;background:rgba(7,11,24,.82);color:#fff;font:700 11px/1.5 Inter,system-ui,sans-serif;letter-spacing:.06em}
.cl-opened{position:absolute;left:8px;top:8px;padding:2px 8px;border-radius:999px;background:#4de0ff;color:#07122a;font:700 11px/1.5 Inter,system-ui,sans-serif}
.cl-body{display:grid;gap:4px;padding:11px 13px 8px;min-width:0;flex:1 1 auto;align-content:start}
.cl-body>*{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cl-name{font-size:15px;font-weight:650;color:#f4f7ff}
.cl-subj{font-size:13px;color:#dfe6fb}
.cl-src,.cl-where,.cl-use,.cl-mut{font-size:12px;color:#9ca9c4}
.cl-tags{display:flex;gap:6px;flex-wrap:wrap;white-space:normal;min-width:0}
.cl-tag{display:inline-block;max-width:100%;box-sizing:border-box;min-height:20px;line-height:18px;padding:0 8px;border-radius:999px;border:1px solid rgba(154,166,194,.35);color:#c8d3ef;font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-tag.warn{border-color:rgba(255,196,107,.55);color:#ffc46b}
.cl-grade{font-size:12px;font-weight:650;color:#c8d3ef}
.cl-grade.lv-excellent{color:#8ff5c9}.cl-grade.lv-good{color:#64e7b5}.cl-grade.lv-ok{color:#ffd76b}.cl-grade.lv-bad{color:#ff9aa0}.cl-grade.lv-worst{color:#ff6f7a}
.cl-acts{display:flex;flex-wrap:wrap;gap:6px;padding:8px 13px 13px;border-top:1px solid rgba(139,118,255,.1)}
.cl-acts .sb-btn,.cl-acts .btn{min-height:32px!important;padding:0 10px!important;font-size:12.5px!important;flex:0 1 auto}
.cl-acts .btn[data-a="open"],.cl-acts .btn[data-a="add"]{flex:1 1 100%;justify-content:center}
.cl-body>.cl-where{display:flex;gap:5px;align-items:baseline}
.cl-wl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cl-where b{flex:none;color:#dfe6fb;font-weight:650}

/* CC_TEMPLATES_V1 — Show + Category chips (the site's framed-chip style), template cards, preview window, Category field */
.cc-chiprows{display:grid;gap:8px;justify-items:start;margin:0 0 12px}.cc-chiprows .tld-bar{margin:0 16px;flex-wrap:wrap;row-gap:4px}
.tld-bar .cc-chip{min-height:32px;padding:5px 12px;border-radius:9px;border:1px solid transparent;background:transparent;color:#c8d3ef;font:650 13px Inter,system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.tld-bar .cc-chip b{margin-left:4px;color:var(--muted,#8d9bbb);font-weight:600}.tld-bar .cc-chip.on{border-color:rgba(77,224,255,.6);background:rgba(77,224,255,.1);color:#fff}.tld-bar .cc-chip:focus-visible{outline:2px solid var(--cyan,#4de0ff);outline-offset:2px}
.cl-filters.st-mode .cl-f:not(.cl-q),.cl-filters.st-mode .cl-chk{display:none}
.cl-acts .btn[data-a="use"]{flex:1 1 auto;justify-content:center}
.cl-st .cl-name{white-space:normal;overflow-wrap:anywhere}
.cc-meta{grid-template-columns:minmax(0,1.3fr) minmax(0,1.5fr) minmax(0,.8fr) 130px 150px}
@media (max-width:1100px){.cc-meta{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (max-width:620px){.cc-meta{grid-template-columns:1fr}}
.cc-box.cc-pvbox{width:min(700px,100%);max-height:calc(100vh - 32px);grid-template-rows:auto auto minmax(0,1fr) auto}
.cc-pvhd{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;min-width:0}.cc-pvhd>div{min-width:0}.cc-pvhd .cc-dsub{margin:4px 0 0;overflow-wrap:anywhere}
.cc-pvfr{display:flex;justify-content:center;min-height:0;height:62vh;background:#e9edf3;border-radius:12px;overflow:hidden}
.cc-pvfr iframe{width:600px;max-width:100%;height:100%;border:0;background:#fff}

/* ADDRESS_TOKEN_V1 */
.cc-addr-note{margin:0;padding:0 16px 10px;color:#8d9bbb;font-size:12.5px}.cc-pvhd .cc-addr-note{padding:0;margin-top:4px}
