/* ============================================================
   Sistema 1×10 · Home — Central de Seleção (Flow Curto / Longo)
   Identidade ORIGINAL sistema1x10: creme/vermelho, Lufga, arredondado.
   Tokens semânticos em :root — nunca hardcode cor/tamanho fora daqui.
   Portado do protótipo aprovado mockup-home-AC-merge.html.
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#F5EFE8;--surface:#FFFCF8;--text:#1A1008;--muted:#7A6A58;--border:#E8E0D4;--accent:#E74041;
  --wlc:#2D6BBF;--wlb:#E8852A;--wlh:#D6589F;--outras:#5E6B7A;
  --apr:#5f9e6e;--grv:#d6a24a;--pub:#E74041;
  --font:'Lufga',system-ui,sans-serif;--r:16px;--shadow:0 8px 32px rgba(26,16,8,.08);--dw:34px}
body{font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh}

/* topbar — identidade do site */
.topbar{position:sticky;top:0;z-index:200;height:56px;background:rgba(255,252,248,.95);border-bottom:1px solid var(--border);backdrop-filter:blur(12px);display:flex;align-items:center;padding:0 24px;gap:12px}
.topbar-logo{font-size:14px;font-weight:800}.topbar-logo span{color:var(--accent)}
.topbar-sub{font-size:11px;color:var(--muted);font-weight:600}.topbar-spacer{flex:1}
.topbar-tag{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);opacity:.6;border:1px solid var(--border);padding:5px 10px;border-radius:999px}

.wrap{max-width:1440px;margin:0 auto;padding:24px 24px 80px}

/* status de carga dos dados (3 camadas) */
.dstatus{font-size:.72rem;font-weight:600;border-radius:10px;padding:8px 14px;margin-bottom:16px;display:none;align-items:center;gap:8px}
.dstatus.show{display:flex}
.dstatus.loading{background:var(--bg);color:var(--muted)}
.dstatus.seed{background:rgba(214,162,74,.14);color:#a9791f}
.dstatus.error{background:rgba(231,64,65,.1);color:#9c3b3b}
.dstatus .spin{width:12px;height:12px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* makers */
.makers{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:26px}
.maker{background:linear-gradient(135deg,#1A1008,#2b1a0e);color:#fff;border-radius:20px;padding:22px 24px;display:flex;gap:16px;align-items:center;text-decoration:none;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s;box-shadow:var(--shadow)}
.maker:hover:not(.locked){transform:translateY(-3px);box-shadow:0 14px 40px rgba(26,16,8,.22)}
.maker:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.maker.locked{opacity:.5;cursor:default;background:linear-gradient(135deg,#6b5d4d,#574a3c)}
.maker-emoji{font-size:34px}.maker-body{flex:1}.maker-title{font-size:1.1rem;font-weight:800;margin-bottom:3px}.maker-desc{font-size:.8rem;opacity:.7;line-height:1.4}
.maker-badge{position:absolute;top:14px;right:16px;font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:4px 9px;border-radius:999px}
.maker-badge.live{background:rgba(231,64,65,.9)}.maker-badge.soon{background:rgba(255,255,255,.18)}

/* tabs */
.tabs{display:flex;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--border)}
.tab{appearance:none;border:none;background:none;font-family:var(--font);font-size:.95rem;font-weight:700;color:var(--muted);padding:12px 18px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px}
.tab.active{color:var(--text);border-bottom-color:var(--accent)}
.tab:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:6px}
.panel{display:none}.panel.active{display:block}
.note{background:rgba(231,64,65,.07);border:1px solid rgba(231,64,65,.2);color:#9c3b3b;font-size:.8rem;font-weight:600;border-radius:12px;padding:10px 14px;margin-bottom:18px}

/* zonas */
.zone{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--r);padding:18px;margin-bottom:18px}
.zhead{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.ztag{font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:var(--text);padding:5px 11px;border-radius:8px}
.zsub{font-size:.74rem;color:var(--muted);font-weight:600}
.zcount{font-size:.72rem;font-weight:700;background:var(--bg);border-radius:999px;padding:2px 10px;color:var(--muted)}

/* filterbar */
.filterbar{margin-bottom:14px}
.fb-search{position:relative;margin-bottom:12px}
.fb-search input{width:100%;font-family:var(--font);font-size:.82rem;font-weight:600;border:1.5px solid var(--border);border-radius:999px;padding:9px 14px 9px 36px;background:var(--surface);color:var(--text);outline:none}
.fb-search input:focus{border-color:var(--accent)}
.fb-search .ico{position:absolute;left:13px;top:50%;transform:translateY(-50%);opacity:.5;pointer-events:none}
.fb-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.fb-group{display:flex;align-items:center;gap:8px}
.fb-label{font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);opacity:.7}
.chip{appearance:none;border:1.5px solid var(--border);background:var(--surface);font-family:var(--font);font-size:.74rem;font-weight:700;padding:6px 12px;border-radius:999px;cursor:pointer;color:var(--muted);height:30px;display:inline-flex;align-items:center;gap:6px}
.chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.chip.fast{background:#1A1008;color:#fff;border-color:#1A1008;font-weight:800}
.chip.fast.on{background:var(--accent);border-color:var(--accent);box-shadow:0 4px 14px rgba(231,64,65,.3)}
.chip.prio .pdot{width:8px;height:8px;border-radius:50%}
.chip.prio.alta .pdot{background:#d8453f}.chip.prio.media .pdot{background:#d6a24a}.chip.prio.baixa .pdot{background:#9b8c78}
.chip.prio.on.alta{background:#d8453f;color:#fff;border-color:transparent}.chip.prio.on.media{background:#d6a24a;color:#fff;border-color:transparent}.chip.prio.on.baixa{background:#9b8c78;color:#fff;border-color:transparent}
.chip.prio.on .pdot{background:#fff}
select{font-family:var(--font);font-size:.76rem;font-weight:600;border:1.5px solid var(--border);border-radius:999px;padding:7px 12px;background:var(--surface);color:var(--text);outline:none;cursor:pointer}
select:focus{border-color:var(--accent)}

/* empresabar (filtro de empresa global → aba ativa) */
.empresabar{display:flex;align-items:center;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.chip.empresa.on{background:var(--text);color:#fff;border-color:var(--text)}
.chip.empresa.on.m-wlc{background:var(--wlc);border-color:var(--wlc);color:#fff}
.chip.empresa.on.m-wlb{background:var(--wlb);border-color:var(--wlb);color:#fff}
.chip.empresa.on.m-wlh{background:var(--wlh);border-color:var(--wlh);color:#fff}

/* groupbar */
.groupbar{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.grp{appearance:none;border:1.5px solid var(--border);background:var(--surface);font-family:var(--font);font-size:.76rem;font-weight:700;color:var(--muted);padding:7px 14px;border-radius:999px;cursor:pointer}
.grp.on{background:var(--text);color:#fff;border-color:var(--text)}
.grp:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* board */
.board{display:flex;gap:14px;overflow-x:auto;padding-bottom:8px;align-items:flex-start}
.col{flex:0 0 290px;background:var(--bg);border-radius:14px;border:1px solid var(--border);display:flex;flex-direction:column}
/* sticky relativo ao .board (scroll-container por causa do overflow-x:auto):
   top:56px empurrava o header 56px p/ baixo e cobria a metade de cima do 1º card.
   top:0 mantém o header alinhado ao topo da coluna sem cortar o primeiro card. */
.col-head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:2px solid var(--cc,#ccc);position:sticky;top:0;background:var(--bg);border-radius:14px 14px 0 0;z-index:2}
.col-body>.bcard:first-child{scroll-margin-top:64px}
.col-head .cc-dot{width:11px;height:11px;border-radius:50%;background:var(--cc,#ccc)}
.col-head .cc-name{font-size:.82rem;font-weight:800;color:var(--text)}
.col-head .cc-count{margin-left:auto;font-size:.7rem;font-weight:700;color:var(--muted);background:var(--surface);border-radius:999px;padding:2px 9px}
.col-body{padding:10px;display:flex;flex-direction:column;gap:9px}
.col-empty{color:var(--muted);font-size:.76rem;text-align:center;padding:24px 8px;opacity:.6}
.seemore{border:1.5px dashed var(--border);background:none;color:var(--muted);font-family:var(--font);font-size:.74rem;font-weight:700;padding:8px;border-radius:10px;cursor:pointer}
.seemore:hover{border-color:var(--accent);color:var(--accent)}

/* board card */
.bcard{background:var(--surface);border:1.5px solid var(--border);border-radius:12px;padding:11px 12px;cursor:grab;transition:box-shadow .15s,transform .15s;position:relative}
.bcard:hover{box-shadow:var(--shadow);transform:translateY(-1px)}.bcard.dragging{opacity:.4}
.bcard.issel{border-color:var(--accent)}
.bc-top{display:flex;align-items:center;gap:6px;margin-bottom:7px;flex-wrap:wrap;padding-right:18px}
/* X excluir ideia (item 3) */
.bc-del{position:absolute;top:5px;right:6px;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--muted);font-size:11px;line-height:1;border-radius:50%;cursor:pointer;opacity:.35;z-index:3;transition:opacity .15s,background .15s,color .15s}
.bc-del:hover{opacity:1;background:rgba(231,64,65,.12);color:var(--accent)}
.bc-del:focus-visible{outline:2px solid var(--accent);outline-offset:1px;opacity:1}
/* prioridade editável (item 4): chip vira botão + menu */
.prio-chip.prio-edit{appearance:none;font-family:var(--font);border:1px solid transparent;cursor:pointer}
.prio-chip.prio-edit:hover{filter:brightness(.97);border-color:rgba(0,0,0,.08)}
.prio-chip.prio-edit:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.prio-chip .prio-caret{font-size:.7em;margin-left:1px;opacity:.7}
.prio-menu{position:absolute;top:30px;left:10px;z-index:10;background:var(--surface);border:1.5px solid var(--border);border-radius:10px;box-shadow:var(--shadow);padding:5px;display:flex;flex-direction:column;gap:2px;min-width:120px}
.prio-opt{appearance:none;border:none;background:none;font-family:var(--font);font-size:.7rem;font-weight:800;text-transform:uppercase;color:var(--text);display:flex;align-items:center;gap:7px;padding:6px 9px;border-radius:7px;cursor:pointer;text-align:left}
.prio-opt:hover,.prio-opt:focus-visible{background:var(--bg);outline:none}
.prio-opt .pdot{width:8px;height:8px;border-radius:50%}
.prio-opt.alta .pdot{background:#d8453f}.prio-opt.media .pdot{background:#d6a24a}.prio-opt.baixa .pdot{background:#9b8c78}.prio-opt.none .pdot{background:var(--border)}
.prio-opt.cur{background:var(--bg)}
.prio-opt.cur::after{content:'✓';margin-left:auto;color:var(--accent);font-size:.78rem}
.badge{font-size:.6rem;font-weight:800;color:#fff;padding:3px 7px;border-radius:6px;text-transform:uppercase;white-space:nowrap}
.prio-chip{display:inline-flex;align-items:center;gap:4px;font-size:.58rem;font-weight:800;padding:2px 7px;border-radius:6px;text-transform:uppercase}
.prio-chip .pdot{width:6px;height:6px;border-radius:50%}
.prio-chip.alta{background:rgba(216,69,63,.12);color:#c23d38}.prio-chip.alta .pdot{background:#d8453f}
.prio-chip.media{background:rgba(214,162,74,.16);color:#a9791f}.prio-chip.media .pdot{background:#d6a24a}
.prio-chip.baixa{background:rgba(155,140,120,.16);color:#7a6a58}.prio-chip.baixa .pdot{background:#9b8c78}
.prio-chip.none{background:var(--bg);color:var(--muted)}.prio-chip.none .pdot{background:var(--border)}
.bc-plat{margin-left:auto;font-size:.62rem;font-weight:700;color:var(--muted)}
.bc-title{font-size:.82rem;font-weight:700;line-height:1.32;margin-bottom:4px}
.bc-snip{font-size:.7rem;color:var(--muted);line-height:1.4;margin-bottom:7px;max-height:2.8em;overflow:hidden}
.bc-meta{font-size:.62rem;color:var(--muted);font-weight:600;display:flex;gap:6px;flex-wrap:wrap;margin-bottom:9px}
.bc-meta .mtag{background:var(--bg);padding:2px 6px;border-radius:5px}
.bc-add{width:100%;border:1.5px solid var(--accent);background:rgba(231,64,65,.06);color:var(--accent);font-family:var(--font);font-size:.72rem;font-weight:800;padding:7px;border-radius:8px;cursor:pointer}
.bc-add:hover{background:rgba(231,64,65,.14)}
.bc-add:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.bc-add.done{border-color:var(--apr);color:#3f7a52;background:rgba(95,158,110,.1);cursor:pointer}
.bc-add.done:hover{background:rgba(95,158,110,.18)}

/* zone2 sel rail */
.selrail{display:flex;gap:10px;overflow-x:auto;padding:6px 4px;min-height:78px;border:2px dashed var(--border);border-radius:12px}
.selrail.over{border-color:var(--accent);background:rgba(231,64,65,.05)}
.selrail .empty{color:var(--muted);font-size:.78rem;opacity:.6;margin:auto}
.scard{flex:0 0 220px;background:var(--surface);border:1.5px solid var(--border);border-radius:11px;padding:10px 11px;cursor:grab;position:relative}
.scard.dragging{opacity:.4}
.scard .sc-top{display:flex;align-items:center;gap:6px;margin-bottom:5px}
.scard .sc-title{font-size:.74rem;font-weight:700;line-height:1.3;max-height:2.6em;overflow:hidden}
.scard .sc-sched{font-size:.64rem;color:var(--muted);font-weight:600;margin-top:5px}
.scard .rm{position:absolute;top:7px;right:8px;width:18px;height:18px;border-radius:50%;border:none;background:var(--bg);color:var(--muted);font-size:12px;cursor:pointer}
.scard .rm:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* zone3 weeks */
.weeks{display:flex;gap:10px;overflow-x:auto;padding-bottom:8px;margin-bottom:6px}
.week{flex:0 0 150px;background:var(--bg);border:1.5px solid var(--border);border-radius:12px;padding:11px 12px;cursor:pointer;transition:all .15s;min-height:104px;display:flex;flex-direction:column;gap:6px}
.week.over{border-color:var(--accent);background:rgba(231,64,65,.06)}
.week.open{border-color:var(--text);box-shadow:0 4px 16px rgba(26,16,8,.12)}
.week.thisweek .wk-n{color:var(--accent)}
.week:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.wk-n{font-size:.72rem;font-weight:800}
.wk-range{font-size:.64rem;color:var(--muted);font-weight:600}
.wk-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:auto}
.wk-chip{width:18px;height:18px;border-radius:5px;font-size:.5rem;font-weight:800;color:#fff;display:flex;align-items:center;justify-content:center}
.wk-empty{font-size:.62rem;color:var(--muted);opacity:.5;margin-top:auto}
.wk-toggle{font-size:.6rem;font-weight:700;color:var(--muted)}

/* week panel = day timeline */
.weekpanel{margin-top:8px}
.wp-box{background:var(--bg);border:1.5px solid var(--border);border-radius:14px;padding:16px}
.legend{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:12px;font-size:.7rem;color:var(--muted);font-weight:600;align-items:center}
.legend span{display:inline-flex;align-items:center;gap:5px}
.lg-dot{width:11px;height:11px;border-radius:50%}.lg-apr{background:var(--apr)}.lg-grv{background:var(--grv)}.lg-pub{background:var(--pub)}
.lg-der{width:14px;height:8px;border-radius:3px;background:#cfc3b1}
.tlscroll{overflow-x:auto;overflow-y:visible;padding-bottom:6px}
.axis{display:flex;align-items:flex-end;border-bottom:1.5px solid var(--border);padding-bottom:5px;margin-bottom:4px;width:100%;min-width:calc(200px + var(--cols,7) * 28px)}
.axis .axis-head{width:200px;flex:0 0 auto;position:sticky;left:0;background:var(--bg);z-index:6;align-self:stretch}
.axis .tick{flex:1 1 0;min-width:28px;box-sizing:border-box;text-align:center;color:var(--muted);border-left:1px solid var(--border);padding-top:14px;position:relative}
.axis .tick.wk{border-left:2px solid #cdbfa9}
.axis .tick .tnum{display:block;font-size:.6rem;font-weight:700}
.axis .tick .tdow{display:block;font-size:.48rem;opacity:.7}
.axis .tick .tmon{position:absolute;top:0;left:3px;font-size:.5rem;font-weight:800;color:var(--text);text-transform:uppercase;white-space:nowrap}
.lane{display:flex;align-items:stretch;border-top:1px solid var(--border);padding:10px 0;min-height:60px;width:100%;min-width:calc(200px + var(--cols,7) * 28px)}
.lane:first-of-type{border-top:none}
.lane-head{width:200px;flex:0 0 auto;min-width:0;padding-right:12px;position:sticky;left:0;background:var(--bg);z-index:5;overflow:hidden}
.lane-head .badge{margin-bottom:5px;display:inline-block}
.lane-title{font-size:.76rem;font-weight:700;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.lane-actions{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
.lact{border:none;background:var(--surface);color:var(--muted);font-size:.62rem;font-weight:700;padding:3px 9px;border-radius:999px;cursor:pointer;font-family:var(--font)}
.lact:hover{background:#ece3d6}.lact.exp{color:var(--text)}.lact.rm-l{color:#b5564f}
.lact:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.track{flex:1 1 0;min-width:calc(var(--cols,7) * 28px);position:relative;background:repeating-linear-gradient(90deg,var(--border) 0 1px,transparent 1px calc(100%/var(--cols,7))),repeating-linear-gradient(90deg,#d3c5af 0 2px,transparent 2px calc(100%/var(--cols,7)*7));border-radius:8px;min-height:42px}
.track-line{position:absolute;top:50%;left:0;right:0;height:2px;background:var(--border)}
.node{position:absolute;top:50%;transform:translate(-50%,-50%);border-radius:999px;color:#fff;font-size:.6rem;font-weight:800;padding:5px 9px;cursor:grab;white-space:nowrap;box-shadow:0 2px 8px rgba(0,0,0,.16);user-select:none;z-index:3;touch-action:none}
.node:hover{filter:brightness(1.05)}
.node.dragging{cursor:grabbing;z-index:9;box-shadow:0 6px 18px rgba(0,0,0,.28)}
.node.apr{background:var(--apr)}.node.grv{background:var(--grv)}.node.pub{background:var(--pub)}
.node .nd{display:block;font-weight:600;font-size:.54rem;opacity:.9}
.sublane{display:flex;align-items:stretch;padding:4px 0;min-height:36px;background:rgba(122,106,88,.04);width:100%;min-width:calc(200px + var(--cols,7) * 28px)}
.sublane-head{width:200px;flex:0 0 auto;padding-right:12px;padding-left:14px;display:flex;align-items:center;gap:6px;position:sticky;left:0;background:#f1ebe1;z-index:5}
.sublane-head .sl-name{font-size:.7rem;font-weight:700}
.sublane-head .sl-type{font-size:.54rem;font-weight:700;color:var(--muted);background:var(--surface);padding:2px 5px;border-radius:5px}
.sublane-head .sl-edit{margin-left:auto;border:none;background:none;color:var(--muted);cursor:pointer;font-size:.7rem}
.track.sub{min-height:28px}
.node.sm{font-size:.53rem;padding:3px 6px;box-shadow:0 1px 5px rgba(0,0,0,.14)}.node.sm .nd{font-size:.48rem}
.wp-empty{color:var(--muted);font-size:.8rem;text-align:center;padding:26px;opacity:.65}

/* drawer */
.scrim{position:fixed;inset:0;background:rgba(26,16,8,.32);opacity:0;pointer-events:none;transition:opacity .25s;z-index:300}
.scrim.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100vh;width:430px;max-width:92vw;background:var(--surface);box-shadow:-12px 0 40px rgba(26,16,8,.18);transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);z-index:310;display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer-h{padding:20px 22px;border-bottom:1px solid var(--border);display:flex;align-items:flex-start;gap:10px}
.drawer-h .x{margin-left:auto;border:none;background:var(--bg);width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:16px;color:var(--muted)}
.drawer-h .x:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.drawer-body{padding:20px 22px;overflow-y:auto;flex:1}
.drawer-title{font-size:1rem;font-weight:800;line-height:1.3}
.drawer-kind{font-size:.7rem;font-weight:700;color:var(--muted);margin-top:4px}
.quick-label{font-size:.64rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.quick-row{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:6px}
.qbtn{border:1.5px solid var(--border);background:var(--surface);color:var(--text);font-family:var(--font);font-size:.72rem;font-weight:700;padding:7px 12px;border-radius:999px;cursor:pointer}
.qbtn:hover{border-color:var(--accent);color:var(--accent);background:rgba(231,64,65,.05)}
.qbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.qhint{font-size:.66rem;color:var(--muted);margin:4px 0 16px;line-height:1.4}
.field{margin-bottom:13px}
.field label{display:flex;align-items:center;gap:7px;font-size:.72rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.field label .swatch{width:12px;height:12px;border-radius:50%}
.field label .swatch.apr{background:var(--apr)}.field label .swatch.grv{background:var(--grv)}.field label .swatch.pub{background:var(--pub)}
.field input[type=date]{width:100%;font-family:var(--font);border:1.5px solid var(--border);border-radius:10px;padding:9px 11px;font-size:.85rem;background:var(--surface);color:var(--text)}
.field input[type=date]:focus{border-color:var(--accent);outline:none}
.dsec{margin-top:18px;padding-top:16px;border-top:1px solid var(--border)}
.dsec p{font-size:.76rem;color:var(--muted);line-height:1.5;margin-bottom:12px}
.btn-spread{width:100%;border:1.5px solid var(--accent);background:rgba(231,64,65,.06);color:var(--accent);font-family:var(--font);font-size:.78rem;font-weight:800;padding:11px;border-radius:10px;cursor:pointer}
.btn-spread:hover{background:rgba(231,64,65,.12)}
.derlist{margin-top:14px}
.derlink{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px dashed var(--border);cursor:pointer;font-size:.76rem;font-weight:700}
.derlink:hover{color:var(--accent)}
.derlink .mini{margin-left:auto;display:flex;gap:4px}
.mdot{width:9px;height:9px;border-radius:50%}.mdot.apr{background:var(--apr)}.mdot.grv{background:var(--grv)}.mdot.pub{background:var(--pub)}.mdot.off{background:var(--border)}
.toolbar{display:flex;justify-content:flex-end;margin-top:6px}
.btn-clear{appearance:none;border:1.5px solid var(--border);background:var(--surface);font-family:var(--font);font-size:.76rem;font-weight:700;color:var(--muted);padding:8px 16px;border-radius:999px;cursor:pointer}
.btn-clear:hover{border-color:var(--accent);color:var(--accent)}

/* ============================================================
   6-ABAS + PRODUÇÃO (Pipeline / Gravações / Publicações)
   ============================================================ */
/* tokens de etapa E0–E10 (espelham /flow) */
:root{
  --etapa-e0:#242258;--etapa-e1:#2164AE;--etapa-e2:#027071;--etapa-e3:#1D4E8C;--etapa-e4:#7C287B;
  --etapa-e5:#5A1D59;--etapa-e6:#EB6952;--etapa-e7:#E74041;--etapa-e8:#E8891A;--etapa-e9:#FCB415;--etapa-e10:#0F7A4E;
}
/* nav principal (6 abas) */
.mtabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.mtab{appearance:none;border:1.5px solid var(--border);background:var(--surface);font-family:var(--font);font-size:.86rem;font-weight:800;color:var(--muted);padding:9px 16px;border-radius:999px;cursor:pointer;transition:all .15s}
.mtab:hover{border-color:var(--muted);color:var(--text)}
.mtab.active{background:var(--text);color:#fff;border-color:var(--text)}
.mtab:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
/* flow sub-tabs */
.ftabs{display:flex;gap:8px;margin-bottom:18px;border-bottom:1px solid var(--border)}
.ftab{appearance:none;border:none;background:none;font-family:var(--font);font-size:.92rem;font-weight:700;color:var(--muted);padding:10px 16px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px}
.ftab.active{color:var(--text);border-bottom-color:var(--accent)}
.ftab:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:6px}
/* seções e flow panels */
.msec{display:none}.msec.active{display:block}
.fpanel{display:none}.fpanel.active{display:block}
/* Notion ↗ nos cards da Biblioteca */
.bc-notion{margin-left:auto;font-size:.62rem;font-weight:800;color:var(--wlc);text-decoration:none;border:1.5px solid var(--border);border-radius:999px;padding:2px 8px;white-space:nowrap}
.bc-notion:hover{border-color:var(--wlc)}
.bc-notion.off{color:var(--muted);opacity:.4;pointer-events:none}
/* status de produção + aviso rascunho */
.prodstatus{display:none}
.prodstatus.show{display:block;font-size:.78rem;font-weight:700;border-radius:10px;padding:8px 12px;margin-bottom:14px}
.prodstatus.seed{background:rgba(252,180,21,.14);color:#7A4A08;border:1px solid rgba(252,180,21,.4)}
.prod-draft{margin-left:auto;font-size:.68rem;font-weight:700;color:var(--muted);background:var(--bg);border:1px dashed var(--border);border-radius:999px;padding:3px 10px}
.gv-nav{margin-left:auto;display:flex;align-items:center;gap:8px}
.gv-label{font-size:.78rem;font-weight:800;min-width:160px;text-align:center}
.navmini{appearance:none;border:1.5px solid var(--border);background:var(--surface);font-family:var(--font);font-weight:800;color:var(--text);border-radius:8px;padding:5px 11px;cursor:pointer;font-size:.82rem}
.navmini:hover{border-color:var(--accent);color:var(--accent)}
/* card de produção (genérico) */
.pcard{border-radius:12px;padding:10px 12px;cursor:pointer;transition:transform .15s;position:relative;text-align:left}
.pcard:hover{transform:translateY(-2px)}
.pcard.nolink{cursor:default}.pcard.nolink:hover{transform:none}
.pc-top{display:flex;align-items:center;gap:6px;margin-bottom:6px}
.pbadge{font-size:.6rem;font-weight:900;color:#fff;padding:3px 7px;border-radius:6px;letter-spacing:.03em}
.pbadge.white{background:rgba(255,255,255,.92)!important;color:#1A1008}
.ptype{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;opacity:.92}
.pc-title{font-size:.78rem;font-weight:700;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.pc-notion{margin-left:auto;font-size:.58rem;font-weight:800;text-decoration:none;color:var(--wlc);border:1px solid var(--border);border-radius:999px;padding:2px 7px;white-space:nowrap}
.pc-notion.light{color:#fff;border-color:rgba(255,255,255,.55)}
.pc-notion.off{color:var(--muted);opacity:.4;pointer-events:none}
/* chip de origem do flow (distinto da marca e da cor por tipo) */
.flowchip{font-size:.58rem;font-weight:800;letter-spacing:.02em;padding:2px 7px;border-radius:999px;border:1.5px dashed var(--border);background:var(--surface);color:var(--text);white-space:nowrap}
.flowchip.curto{border-color:var(--grv);color:#7A4A08}
.flowchip.longo{border-color:var(--wlc);color:var(--wlc)}
.flowchip.light{background:rgba(255,255,255,.92);border-style:solid;border-color:rgba(255,255,255,.6)}
.flowchip.light.curto{color:#7A4A08}.flowchip.light.longo{color:var(--wlc)}
.pchip-fl{font-size:.6rem}
/* tema (Kanban): fundo claro + barra da marca */
.pcard.tema{background:var(--surface);border:1.5px solid var(--border);border-left:5px solid var(--mc)}
.pcard.tema .pc-notion{color:var(--wlc)}
/* derivado: cor por TIPO de conteúdo */
.pcard.deriv{color:#fff}
.pcard.deriv.k-carrossel{background:var(--wlh)}
.pcard.deriv.k-youtube{background:var(--accent)}
.pcard.deriv.k-reels{background:#6B4AD4}
.pcard.deriv.k-stories{background:#2E9E5B}
.pcard.deriv.k-outro{background:var(--outras)}
.pc-cover{width:100%;height:96px;border-radius:8px;overflow:hidden;margin-bottom:8px;background:rgba(255,255,255,.18)}
.pc-cover img{width:100%;height:100%;object-fit:cover;display:block}
.pc-cover.ph{display:flex;align-items:center;justify-content:center;font-size:28px;background:rgba(255,255,255,.18)}
/* Kanban */
.kanban{display:flex;gap:12px;overflow-x:auto;padding-bottom:10px;align-items:flex-start}
.kcol{flex:0 0 230px;background:var(--bg);border:1.5px solid var(--border);border-radius:14px;display:flex;flex-direction:column;max-height:600px}
.kcol-h{display:flex;align-items:center;gap:8px;padding:11px 13px;font-size:.78rem;font-weight:900;border-bottom:3px solid var(--ke,var(--border))}
.kcol-h .kdot{width:11px;height:11px;border-radius:50%;background:var(--ke,var(--muted))}
.kcol-h .kcount{margin-left:auto;font-size:.68rem;font-weight:800;background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:1px 8px}
.kcol-b{overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:9px}
.kempty{color:var(--muted);opacity:.5;text-align:center;font-size:.76rem;padding:14px 0}
.kcol.etapa-e0{--ke:var(--etapa-e0)}.kcol.etapa-e1{--ke:var(--etapa-e1)}.kcol.etapa-e2{--ke:var(--etapa-e2)}
.kcol.etapa-e3{--ke:var(--etapa-e3)}.kcol.etapa-e4{--ke:var(--etapa-e4)}.kcol.etapa-e5{--ke:var(--etapa-e5)}
.kcol.etapa-e6{--ke:var(--etapa-e6)}.kcol.etapa-e7{--ke:var(--etapa-e7)}.kcol.etapa-e8{--ke:var(--etapa-e8)}
.kcol.etapa-e9{--ke:var(--etapa-e9)}.kcol.etapa-e10{--ke:var(--etapa-e10)}
/* Gravações (semanal) */
.gravsem{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}
.gcol{background:var(--bg);border:1.5px solid var(--border);border-radius:12px;min-height:200px;display:flex;flex-direction:column;transition:background .15s,border-color .15s}
.gcol.today{border-color:var(--accent)}
.gcol.over{background:rgba(231,64,65,.06);border-color:var(--accent)}
.gcol-h{font-size:.72rem;font-weight:900;padding:9px 10px;border-bottom:2px solid var(--border)}
.gcol-h.red{color:var(--accent)}
.gcol-h .hoje{background:var(--accent);color:#fff;border-radius:999px;font-size:.58rem;padding:1px 7px;margin-left:4px}
.gcol-b{padding:8px;display:flex;flex-direction:column;gap:8px;flex:1}
.gempty{color:var(--muted);opacity:.45;text-align:center;font-size:.74rem;padding:10px 0}
/* Gravações (backlog "com copy pronta" à ESQUERDA + grade semanal) */
.grav-wrap{display:grid;grid-template-columns:240px 1fr;gap:16px;align-items:start}
.grav-backlog{border:1.5px solid var(--border);border-radius:14px;background:var(--bg);padding:12px;display:flex;flex-direction:column;gap:9px;max-height:640px;overflow-y:auto}
/* Publicações (backlog à ESQUERDA + mensal) */
.pub-wrap{display:grid;grid-template-columns:300px 1fr;gap:16px;align-items:start}
.pub-cal{border:1.5px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface)}
.pc-head{display:grid;grid-template-columns:repeat(7,1fr);background:var(--text)}
.pc-head div{color:#fff;font-size:.72rem;font-weight:900;padding:9px 8px;border-left:1px solid rgba(255,255,255,.1)}
.pc-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.pc-cell{min-height:92px;border-left:1px solid var(--border);border-top:1.5px solid var(--border);padding:5px 6px;display:flex;flex-direction:column;gap:4px;transition:background .15s}
.pc-cell.pad{background:var(--bg)}
.pc-cell.today{box-shadow:inset 0 0 0 2px var(--accent)}
.pc-cell.over{background:rgba(231,64,65,.08)}
.pc-cell .cn{font-size:.76rem;font-weight:800;color:var(--muted)}
.pc-cell.today .cn{color:var(--accent)}
.pchip{border-radius:6px;padding:2px 6px;font-size:.58rem;font-weight:800;color:#fff;cursor:grab;display:flex;align-items:center;gap:4px;text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;overflow:hidden}
.pchip .pchip-b{background:rgba(255,255,255,.9);color:#1A1008;border-radius:4px;padding:0 4px;font-size:.54rem}
.pchip.k-carrossel{background:var(--wlh)}.pchip.k-youtube{background:var(--accent)}.pchip.k-reels{background:#6B4AD4}.pchip.k-stories{background:#2E9E5B}.pchip.k-outro{background:var(--outras)}
.pchip.dragging{opacity:.4}
/* card compacto DENTRO do dia do calendário (mantém a preview da arte) */
.pevt{position:relative;border:2px solid var(--fc,var(--border));border-radius:9px;background:var(--surface);cursor:grab;display:flex;flex-direction:column;overflow:hidden;transition:transform .15s}
.pevt:hover{transform:translateY(-1px)}
.pevt.dragging{opacity:.4}
.pevt.k-carrossel{--fc:var(--wlh)}.pevt.k-youtube{--fc:var(--accent)}.pevt.k-reels{--fc:#6B4AD4}.pevt.k-stories{--fc:#2E9E5B}.pevt.k-outro{--fc:var(--outras)}
.pe-frame{width:100%;background:#efe8dd;overflow:hidden;display:flex;align-items:center;justify-content:center;max-height:120px;cursor:pointer}
.pe-frame img{width:100%;height:100%;object-fit:cover;display:block}
.pe-frame.ar-carrossel{aspect-ratio:4/5}
.pe-frame.ar-youtube{aspect-ratio:16/9}
.pe-frame.ar-reels{aspect-ratio:9/16;max-width:78px;margin:0 auto}
.pe-frame.ar-outro{aspect-ratio:1/1}
.pe-ph{color:var(--muted);font-size:.95rem;text-align:center;padding:6px}
.pe-meta{display:flex;align-items:center;gap:3px;padding:3px 5px;flex-wrap:wrap}
.pe-badge{font-size:.5rem;font-weight:900;color:#fff;padding:2px 5px;border-radius:5px;letter-spacing:.02em}
.pe-type{font-size:.5rem;font-weight:900;text-transform:uppercase;letter-spacing:.03em;color:var(--fc)}
.pe-fl{font-size:.62rem}
.pe-undo{position:absolute;top:3px;right:3px;z-index:4;appearance:none;border:none;background:rgba(26,16,8,.78);color:#fff;width:20px;height:20px;border-radius:6px;font-size:.74rem;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;padding:0}
.pe-undo:hover{background:var(--accent)}
.pe-undo:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pub-backlog.over{border-color:var(--accent);background:rgba(231,64,65,.08)}
.grav-backlog.over{border-color:var(--accent);background:rgba(231,64,65,.08)}
/* card de gravação no dia com ↩: reserva espaço p/ não cobrir o link Notion */
.pcard.deriv.has-undo .pc-top{padding-right:24px}
.pub-backlog{border:1.5px solid var(--border);border-radius:14px;background:var(--bg);padding:12px;display:flex;flex-direction:column;gap:9px;max-height:640px;overflow-y:auto}
.bl-h{font-size:.74rem;font-weight:900;display:flex;align-items:center;gap:8px}
.bl-h .bl-count{margin-left:auto;font-size:.68rem;background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:1px 8px}
.bl-empty{color:var(--muted);font-size:.76rem;opacity:.6;text-align:center;padding:16px 4px}
.pcard.deriv[draggable=true]{cursor:grab}
.pcard.dragging{opacity:.4}
/* card do backlog: moldura colorida por TIPO + preview no formato certo */
.pbcard{border:3px solid var(--fc,var(--border));border-radius:12px;background:var(--surface);padding:9px;cursor:grab;display:flex;flex-direction:column;gap:7px;transition:transform .15s}
.pbcard:hover{transform:translateY(-2px)}
.pbcard.dragging{opacity:.4}
.pbcard.nolink{cursor:grab}
.pbcard.k-carrossel{--fc:var(--wlh)}.pbcard.k-youtube{--fc:var(--accent)}.pbcard.k-reels{--fc:#6B4AD4}.pbcard.k-stories{--fc:#2E9E5B}.pbcard.k-outro{--fc:var(--outras)}
.pb-top{display:flex;align-items:center;gap:6px}
.pb-type{font-size:.56rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em;color:var(--fc)}
.pb-frame{width:100%;max-height:280px;background:#efe8dd;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center;margin:0 auto}
.pb-frame img{width:100%;height:100%;object-fit:cover;display:block}
.pb-frame.ar-carrossel{aspect-ratio:4/5}
.pb-frame.ar-youtube{aspect-ratio:16/9}
.pb-frame.ar-reels{aspect-ratio:9/16;max-width:170px}
.pb-frame.ar-stories{aspect-ratio:9/16;max-width:170px;border:2px dashed var(--fc);background:repeating-linear-gradient(135deg,#efe8dd,#efe8dd 8px,#e7ded0 8px,#e7ded0 16px)}
.pb-frame.ar-outro{aspect-ratio:1/1}
.pb-ph{color:var(--muted);font-size:.74rem;font-weight:800;text-align:center;padding:8px}
.pb-title{font-size:.72rem;font-weight:700;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pb-notion{font-size:.56rem;font-weight:800;text-decoration:none;color:var(--wlc);border:1px solid var(--border);border-radius:999px;padding:2px 7px;margin-left:auto;white-space:nowrap}
.pb-notion.off{color:var(--muted);opacity:.4;pointer-events:none}

/* ============================================================
   MENU LATERAL (sidebar) — substitui as abas do topo
   ============================================================ */
.shell{display:flex;align-items:flex-start}
.sidebar{position:sticky;top:56px;align-self:flex-start;flex:0 0 220px;width:220px;height:calc(100vh - 56px);overflow-y:auto;background:var(--surface);border-right:1.5px solid var(--border);padding:18px 12px;display:flex;flex-direction:column;gap:6px;z-index:120}
.side-nav{display:flex;flex-direction:column;gap:4px}
.side-makers{display:flex;flex-direction:column;gap:4px}
.side-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;appearance:none;border:1.5px solid transparent;background:none;font-family:var(--font);font-size:.86rem;font-weight:700;color:var(--muted);padding:10px 12px;border-radius:12px;cursor:pointer;text-decoration:none;transition:background .15s,color .15s}
.side-item:hover{background:var(--bg);color:var(--text)}
.side-item.active{background:var(--text);color:#fff;border-color:var(--text)}
.side-item:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.side-item .si-ico{font-size:1.05rem;width:22px;text-align:center;flex:0 0 auto}
.side-item .si-label{flex:1;min-width:0}
.side-sep{height:1.5px;width:auto;background:var(--border);border:none;margin:12px 6px}
.side-badge{font-size:.5rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:3px 7px;border-radius:999px;flex:0 0 auto}
.side-badge.live{background:var(--accent);color:#fff}
.side-badge.soon{background:var(--bg);color:var(--muted);border:1px solid var(--border)}
.maker-item.locked{opacity:.55;cursor:not-allowed}
.maker-item.locked:hover{background:none;color:var(--muted)}
.content{flex:1 1 auto;min-width:0}
.content.wrap{margin:0;max-width:none}
/* filtro de TIPO na Biblioteca unificada */
.chip.tipo.on{background:var(--text);color:#fff;border-color:var(--text)}
/* selo de tipo (⚡/🎬) no card da Biblioteca — reusa .flowchip */
.bcard .flowchip{cursor:default}
/* Gravações: a agenda preenche a tela até embaixo */
#msec-gravacoes .grav-wrap{min-height:calc(100vh - 210px);align-items:stretch}
#msec-gravacoes .grav-backlog{max-height:none}
#msec-gravacoes .gravsem{grid-auto-rows:minmax(200px,1fr)}
/* Publicações: o calendário mensal preenche a tela até embaixo */
#msec-publicacoes .pub-wrap{min-height:calc(100vh - 210px);align-items:stretch}
#msec-publicacoes .pub-backlog{max-height:none}
#msec-publicacoes .pub-cal{display:flex;flex-direction:column}
#msec-publicacoes .pc-grid{flex:1;grid-auto-rows:minmax(96px,1fr)}
#msec-publicacoes .pc-cell{overflow-y:auto}

@media(max-width:760px){
  .makers{grid-template-columns:1fr}.gravsem{grid-template-columns:repeat(2,1fr)}.pub-wrap{grid-template-columns:1fr}.grav-wrap{grid-template-columns:1fr}
  /* sidebar colapsa em barra horizontal (drawer/top-bar) abaixo da topbar */
  .shell{flex-direction:column}
  .sidebar{position:sticky;top:56px;flex:none;width:auto;height:auto;flex-direction:row;align-items:center;overflow-x:auto;overflow-y:visible;border-right:none;border-bottom:1.5px solid var(--border);padding:8px 12px;gap:8px;z-index:150}
  .side-nav{flex-direction:row;gap:6px}
  .side-makers{flex-direction:row;gap:6px}
  .side-sep{width:1.5px;height:24px;margin:0 4px;flex:0 0 auto}
  .side-item{white-space:nowrap;flex:0 0 auto;padding:8px 12px}
  #msec-gravacoes .grav-wrap{min-height:calc(100vh - 260px)}
  #msec-publicacoes .pub-wrap{min-height:calc(100vh - 260px)}
}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}
