:root{
  --ground:#F4F3EF; --surface:#FFFFFF; --sunk:#EAE8E2; --ink:#1E2423; --muted:#5F6866; --line:#D9D6CE;
  --accent:#1F6B5C; --accent-ink:#FFFFFF; --accent-soft:#DCEBE5; --pop:#E0663F; --pop-soft:#FBE3D9;
  --ochre:#A8741F; --ochre-soft:#F4E7CF; --alert:#B0434A; --alert-soft:#F6DEDF; --ok:#2F7A4F; --ok-soft:#DDEFE3; --info:#3E5F9A; --info-soft:#DFE7F5;
  --display:"Young Serif",Georgia,serif; --body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif; --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --nav-h:64px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  color-scheme:dark; --ground:#141817; --surface:#1C2120; --sunk:#252B29; --ink:#E7ECEA; --muted:#9DA9A5; --line:#313937;
  --accent:#6FBFAB; --accent-ink:#0F1B19; --accent-soft:#1F3833; --pop:#F08A66; --pop-soft:#3D271F;
  --ochre:#E0AE5C; --ochre-soft:#3A2F1C; --alert:#E57C82; --alert-soft:#3D2225; --ok:#7CCB98; --ok-soft:#1D3527; --info:#8FB0E8; --info-soft:#1E2A40;
}}
:root[data-theme="dark"]{
  color-scheme:dark; --ground:#141817; --surface:#1C2120; --sunk:#252B29; --ink:#E7ECEA; --muted:#9DA9A5; --line:#313937;
  --accent:#6FBFAB; --accent-ink:#0F1B19; --accent-soft:#1F3833; --pop:#F08A66; --pop-soft:#3D271F;
  --ochre:#E0AE5C; --ochre-soft:#3A2F1C; --alert:#E57C82; --alert-soft:#3D2225; --ok:#7CCB98; --ok-soft:#1D3527; --info:#8FB0E8; --info-soft:#1E2A40;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--ground);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;-webkit-tap-highlight-color:transparent;padding-top:env(safe-area-inset-top,0px)}
h1,h2,h3{font-family:var(--display);font-weight:400;margin:0;line-height:1.15;text-wrap:balance}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
[hidden]{display:none!important}
.wrap{max-width:1100px;margin-inline:auto;padding-inline:16px;padding-block:0 calc(var(--nav-h) + 28px + env(safe-area-inset-bottom,0px))}
/* topo */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:color-mix(in srgb,var(--ground) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .in{max-width:1100px;margin-inline:auto;padding:10px 16px;display:flex;align-items:center;gap:10px}
.logo{font-family:var(--display);font-size:22px;color:var(--ink);text-decoration:none}
.logo b{color:var(--pop);font-weight:400}
.top .who{margin-left:auto;display:flex;align-items:center;gap:8px;min-width:0}
.top select{border:1px solid var(--line);background:var(--surface);border-radius:9px;padding:6px 8px;max-width:48vw}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-weight:700;font-size:13px;border:0;flex:none}
/* navegação inferior (celular) / lateral (desktop) */
.nav{position:fixed;left:0;right:0;bottom:0;z-index:10;background:var(--surface);border-top:1px solid var(--line);display:flex;justify-content:space-around;padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px))}
.nav a{flex:1;display:grid;justify-items:center;gap:2px;text-decoration:none;color:var(--muted);font-size:11px;font-weight:600;padding:4px 0;border-radius:10px;position:relative}
.nav a svg{width:22px;height:22px}
.nav a[aria-current=page]{color:var(--accent)}
.nav .dot{position:absolute;top:0;right:calc(50% - 20px);min-width:18px;height:18px;border-radius:9px;background:var(--pop);color:#fff;font-size:10.5px;display:grid;place-items:center;padding:0 4px}
@media (min-width:900px){
  .nav{top:62px;bottom:auto;left:max(16px,calc(50vw - 550px));right:auto;flex-direction:column;justify-content:flex-start;gap:4px;width:170px;border:0;background:transparent;padding:16px 0}
  .nav a{grid-template-columns:24px 1fr;justify-items:start;align-items:center;font-size:14px;padding:9px 12px}
  .nav a[aria-current=page]{background:var(--accent-soft)}
  .nav .dot{position:static;margin-left:auto}
  .wrap.has-nav{padding-left:max(200px,calc(50vw - 550px + 200px));max-width:none;padding-right:max(16px,calc(50vw - 550px))}
}
/* blocos */
.page{display:grid;gap:14px;padding-top:16px}
.head{display:grid;gap:4px;padding-block:6px}
.head h1{font-size:clamp(24px,5vw,32px)}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px}
.stack{display:grid;gap:12px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spacer{flex:1}
.muted{color:var(--muted)} .small{font-size:12.5px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:760px){.grid2{grid-template-columns:1fr}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:11px;padding:11px 16px;font-weight:600;background:var(--accent);color:var(--accent-ink);min-height:44px;text-decoration:none}
.btn.sec{background:var(--surface);color:var(--ink);border:1px solid var(--line)}
.btn.pop{background:var(--pop);color:#fff}
.btn.warn{background:var(--alert);color:#fff}
.btn.ok{background:var(--ok);color:#fff}
.btn.small{min-height:34px;padding:6px 12px;font-size:13.5px}
.btn.block{width:100%}
.btn[disabled]{opacity:.5;cursor:default}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--sunk);color:var(--ink);white-space:nowrap;border:0}
.chip i{width:7px;height:7px;border-radius:50%;background:currentColor;display:block}
button.chip{min-height:30px;padding:4px 12px}
.st-rascunho{color:var(--muted)} .st-aprovacao{color:var(--ochre);background:var(--ochre-soft)} .st-ajustes{color:var(--alert);background:var(--alert-soft)}
.st-aprovado{color:var(--ok);background:var(--ok-soft)} .st-agendado{color:var(--info);background:var(--info-soft)} .st-publicado{color:var(--ink);background:var(--line)}
.sev-alta{color:var(--alert);background:var(--alert-soft)} .sev-media{color:var(--ochre);background:var(--ochre-soft)} .sev-baixa{color:var(--muted)}
.note{background:var(--sunk);border-radius:12px;padding:12px 14px;font-size:13.5px}
.note.pop{background:var(--pop-soft)} .note.ok{background:var(--ok-soft)} .note.err{background:var(--alert-soft)}
.err{color:var(--alert)}
.empty{padding:28px;text-align:center;color:var(--muted)}
/* formulários */
.fld{display:grid;gap:5px}
.fld>label,.lbl{font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--muted);text-transform:uppercase}
.fld input,.fld select,.fld textarea,.input{border:1px solid var(--line);background:var(--ground);border-radius:10px;padding:10px 12px;width:100%;min-height:44px}
.fld textarea{resize:vertical;min-height:80px}
.hint{font-size:12px;color:var(--muted)}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}
.form .full{grid-column:1/-1}
@media (max-width:640px){.form{grid-template-columns:1fr}}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips .opt{border:1px solid var(--line);background:var(--ground);border-radius:999px;padding:6px 12px;font-size:13px;min-height:36px}
.chips .opt[aria-pressed=true]{background:var(--accent-soft);border-color:var(--accent);font-weight:600}
/* login */
.auth{min-height:100dvh;display:grid;place-items:center;padding:24px 16px}
.auth .card{width:min(420px,100%);padding:26px;display:grid;gap:14px}
.auth .brand{font-family:var(--display);font-size:44px;line-height:1}
.auth .brand b{color:var(--pop);font-weight:400}
/* tabelas e gráficos */
.scroll{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--line)}
.tbl td{padding:8px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl td.n{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.hbar{height:8px;border-radius:4px;background:var(--accent);min-width:2px}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media (max-width:720px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi{background:var(--sunk);border-radius:12px;padding:12px}
.kpi b{display:block;font-family:var(--display);font-size:24px;font-variant-numeric:tabular-nums}
.kpi span{font-size:12px;color:var(--muted)}
.find{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;padding:10px 0;border-bottom:1px solid var(--line)}
.find:last-child{border-bottom:0}
.find p{grid-column:2;margin:0;color:var(--muted);font-size:13.5px}
.bar-row{display:grid;grid-template-columns:110px 1fr 64px;gap:10px;align-items:center;font-size:13px;padding-block:4px}
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:640px){.cmp{grid-template-columns:1fr}}
.cmp pre{white-space:pre-wrap;font-family:var(--body);margin:0;background:var(--sunk);border-radius:10px;padding:12px;font-size:13.5px}
.cmp .new pre{background:var(--ok-soft)}
/* clientes (agência) */
.clients{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.client{display:grid;gap:8px;text-decoration:none;color:inherit}
.client h3{font-size:20px}
/* calendário */
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:11px;overflow:hidden}
.seg button{border:0;background:var(--surface);padding:8px 12px;font-size:13px;min-height:38px}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--ground)}
.igrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;max-width:560px;margin-inline:auto;width:100%}
.igrid .cell{position:relative;aspect-ratio:3/4;overflow:hidden;border:0;padding:0;background:var(--sunk);display:block}
.igrid .cell .art{position:absolute;inset:0}
.igrid .cell .over{position:absolute;left:4px;bottom:4px;z-index:2}
.igrid .cell .over .chip{font-size:10px;padding:1px 6px}
.igrid .wk{grid-column:1/-1;font-size:11px;color:var(--muted);padding:8px 2px 3px;font-family:var(--mono)}
.list{display:grid;gap:8px}
.week{font-family:var(--mono);font-size:12px;color:var(--muted);margin-top:8px}
.item{display:grid;grid-template-columns:60px 1fr auto;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:8px;text-decoration:none;color:inherit}
.item .thumb{width:60px;aspect-ratio:4/5;border-radius:8px;overflow:hidden;position:relative;display:block}
.item .thumb .art{position:absolute;inset:0}
.item .t{font-weight:600;line-height:1.3;display:block}
.item .m{font-size:12px;color:var(--muted)}
@media (max-width:420px){.item{grid-template-columns:52px 1fr}.item>.chip{grid-column:2;justify-self:start}}
/* editor */
.editor{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:860px){.editor{grid-template-columns:1fr}}
.preview{display:grid;gap:10px}
@media (min-width:861px){.preview{position:sticky;top:76px}}
.actions{position:sticky;bottom:calc(var(--nav-h) + env(safe-area-inset-bottom,0px));z-index:5;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:10px;display:flex;gap:8px;flex-wrap:wrap;box-shadow:0 8px 24px rgba(0,0,0,.08)}
@media (min-width:900px){.actions{bottom:16px}}
.actions .btn{flex:1 1 auto}
.slide{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:start;background:var(--sunk);border-radius:10px;padding:8px}
.slide .no{font-family:var(--mono);font-size:12px;color:var(--muted);padding-top:10px}
.slide input,.slide textarea{background:var(--surface)}
.x{border:0;background:transparent;color:var(--muted);font-size:20px;line-height:1;padding:6px;min-width:36px;min-height:36px}
.comment{background:var(--sunk);border-radius:10px;padding:8px 10px;font-size:13.5px}
.hellena{border:1.5px solid var(--accent);background:var(--accent-soft);border-radius:14px;padding:12px;display:grid;gap:8px}
.hellena .who{font-family:var(--display);font-size:17px}
/* fotos */
.meter{height:6px;border-radius:3px;background:var(--sunk);overflow:hidden}
.meter i{display:block;height:100%;background:var(--accent)}
.meter.done i{background:var(--ok)}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:6px}
.ph{position:relative;border-radius:10px;overflow:hidden;background:var(--sunk);aspect-ratio:4/5}
.ph img,.ph video{width:100%;height:100%;object-fit:cover;display:block}
.ph .bar{position:absolute;inset:auto 0 0 0;display:flex;gap:4px;padding:4px;background:linear-gradient(transparent,rgba(0,0,0,.6))}
.ph .bar select{font-size:11px;border-radius:6px;border:0;padding:3px;flex:1;min-width:0;background:rgba(255,255,255,.92);color:#1e2423}
.ph .bar button{font-size:11px;border:0;border-radius:6px;padding:3px 7px;background:rgba(255,255,255,.92);color:#b0434a}
.upl{border:1.5px dashed var(--line);border-radius:14px;padding:16px;display:grid;gap:10px}
.upl.over{border-color:var(--accent);background:var(--accent-soft)}
.pickgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}
.pickgrid button{border:2px solid transparent;border-radius:8px;padding:0;overflow:hidden;aspect-ratio:4/5;background:var(--sunk)}
.pickgrid button[aria-pressed=true]{border-color:var(--pop)}
.pickgrid img,.pickgrid video{width:100%;height:100%;object-fit:cover;display:block}
/* cadastro */
.steps{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}
.steps a{white-space:nowrap;text-decoration:none;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:7px 12px;font-size:13px;font-weight:600;background:var(--surface)}
.steps a[aria-current=page]{background:var(--ink);color:var(--ground);border-color:var(--ink)}
.steps a .ok{color:var(--ok)}
.swatches{display:flex;gap:8px;flex-wrap:wrap}
.swatch{display:grid;gap:4px;justify-items:center;font-size:11px}
.swatch input[type=color]{width:48px;height:48px;border:1px solid var(--line);border-radius:10px;padding:2px;background:var(--surface)}
.kitgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.kitfile{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface);font-size:12px}
.kitfile img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;background:var(--sunk)}
.kitfile .t{padding:6px 8px;display:flex;gap:6px;align-items:center}
.secret{font-family:var(--mono);font-size:18px;letter-spacing:.06em;background:var(--ochre-soft);padding:10px 14px;border-radius:10px;user-select:all}
.toast{position:fixed;left:50%;bottom:calc(var(--nav-h) + 16px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--ground);padding:11px 16px;border-radius:11px;font-size:14px;z-index:30;max-width:calc(100% - 32px);box-shadow:0 8px 24px rgba(0,0,0,.2)}
.skel{aspect-ratio:4/5;border-radius:10px;background:linear-gradient(100deg,var(--sunk) 30%,var(--surface) 50%,var(--sunk) 70%);background-size:300% 100%;animation:sh 1.6s linear infinite}
@keyframes sh{to{background-position:-150% 0}}
@media (prefers-reduced-motion:reduce){.skel{animation:none}}
/* ---- arte dos posts (cores/fontes/fundo vêm do kit do cliente) ---- */
.art{aspect-ratio:4/5;container-type:inline-size;position:relative;overflow:hidden;background:var(--a-bg) var(--a-img,none) center/cover no-repeat;color:var(--a-ink);font-family:var(--a-body);border-radius:inherit}
.art .in{position:absolute;inset:0;padding:7cqw 7.5cqw 6cqw;display:flex;flex-direction:column;gap:3cqw}
.art .sig{text-align:center;font-size:2.7cqw;letter-spacing:.04em;text-transform:uppercase;opacity:.92}
.art .sig b{font-weight:700}
.art .badge{position:absolute;width:10cqw;height:10cqw;border-radius:50%;overflow:hidden;box-shadow:0 .6cqw 2cqw rgba(0,0,0,.18)}
.art .badge img{width:100%;height:100%;object-fit:cover;display:block}
.art h3{font-family:var(--a-display);font-weight:400;font-size:8cqw;line-height:1.02;color:var(--a-ink);text-transform:var(--a-case,none);text-wrap:balance}
.art .hl{color:var(--a-acc)}
.art .scr{font-family:var(--a-script);color:var(--a-scr);text-transform:none;letter-spacing:0}
.art h3 .scr{font-size:1.4em;line-height:.85}
.art .tx{font-size:3.9cqw;line-height:1.38}
.art .ft{margin-top:auto;font-size:2.7cqw;display:flex;justify-content:space-between;align-items:flex-end;gap:2cqw;opacity:.9}
.art .kind{position:absolute;top:3.4cqw;right:3.4cqw;font-size:2.3cqw;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:var(--a-ink);color:var(--a-bg);padding:.5cqw 1.8cqw;border-radius:99px;opacity:.85;z-index:1}
.art .list{list-style:none;padding:0;margin:0;display:grid;gap:2.2cqw}
.art .list li{display:grid;grid-template-columns:5.6cqw 1fr;gap:2.4cqw;font-size:4cqw;line-height:1.28;font-weight:600}
.art .list li::before{content:"✓";width:5.2cqw;height:5.2cqw;border-radius:1.2cqw;background:var(--a-acc);color:var(--a-bg);display:grid;place-items:center;font-size:3cqw;font-weight:700}
.art .n{font-size:2.8cqw;opacity:.7;letter-spacing:.08em}
.art .photo{border-radius:3cqw;overflow:hidden;flex:1;min-height:0;background:rgba(0,0,0,.08) center/cover no-repeat;display:grid;place-items:center;font-size:3.2cqw;text-align:center;padding:4cqw;border:.5cqw dashed currentColor}
.art .photo.has{border:0}
.art .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:14cqw;height:14cqw;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;display:grid;place-items:center;font-size:6cqw;z-index:1}
.art .arrow{position:absolute;right:3cqw;top:50%;transform:translateY(-50%);width:9cqw;height:9cqw;border-radius:50%;border:0;background:var(--a-acc);color:var(--a-bg);font-size:4.5cqw;display:grid;place-items:center;z-index:2}
.art .arrow.l{left:3cqw;right:auto}
.dots{position:absolute;bottom:2.2cqw;left:0;right:0;display:flex;justify-content:center;gap:1.2cqw}
.dots i{width:1.5cqw;height:1.5cqw;border-radius:50%;background:var(--a-ink);opacity:.25;display:block}
.dots i.on{opacity:.9}
/* palco invisível onde as artes são renderizadas em tamanho real para exportar */
.export-stage{position:fixed;left:-20000px;top:0;width:1080px;height:1350px;pointer-events:none}
.export-stage .art{width:1080px;height:1350px;border-radius:0}
.export-stage .kind,.export-stage .arrow,.export-stage .dots{display:none}
/* calendário mensal */
.mcal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.mhead{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:center;padding:4px 0}
.mday{min-height:118px;background:var(--ground);border:1px solid var(--line);border-radius:10px;padding:5px;display:flex;flex-direction:column;gap:4px;min-width:0}
.mday.out{background:transparent;border-color:transparent}
.mday.today{border-color:var(--pop);box-shadow:inset 0 0 0 1px var(--pop)}
.mnum{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:700;color:var(--muted)}
.mday.today .mnum span{color:var(--pop)}
.madd{border:0;background:transparent;color:var(--muted);font-size:16px;line-height:1;width:22px;height:22px;border-radius:6px;opacity:0}
.mday:hover .madd,.madd:focus-visible{opacity:1;background:var(--sunk)}
.mpost{display:grid;gap:3px;text-decoration:none;color:inherit;border-radius:8px;border:2px solid var(--line);overflow:hidden;background:var(--surface)}
.mthumb{display:block;position:relative;aspect-ratio:4/5}
.mthumb .art{position:absolute;inset:0}
.mtit{font-size:11px;line-height:1.25;padding:0 5px 4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.st-b-rascunho{border-color:var(--line)} .st-b-aprovacao{border-color:var(--ochre)} .st-b-ajustes{border-color:var(--alert)}
.st-b-aprovado{border-color:var(--ok)} .st-b-agendado{border-color:var(--info)} .st-b-publicado{border-color:var(--muted)}
.lg{display:inline-block;width:12px;height:12px;border-radius:4px;border:3px solid;margin-left:8px;vertical-align:-2px}
@media (max-width:640px){
  .mcal{gap:2px}.mday{min-height:64px;padding:2px;border-radius:7px}.mnum{font-size:10.5px}
  .mtit,.madd{display:none}.mpost{border-width:2px;border-radius:5px}
}

/* exemplos nos campos vazios: clarinhos e somem quando o campo recebe o clique */
input::placeholder, textarea::placeholder { color: var(--muted, #8a8580); opacity: .55; font-style: italic; }
input:focus::placeholder, textarea:focus::placeholder { color: transparent; }


/* mídia dos posts (foto ou vídeo) com zoom e enquadramento */
.art .photo{position:relative}
.art .mid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.art .fundo-mid{position:absolute;inset:0;overflow:hidden}
.art .hdr{display:flex;align-items:center;gap:2.4cqw}
.art .hdr .sig{flex:1;text-align:left}
.art .lg{width:8cqw;height:8cqw;border-radius:50%;overflow:hidden;flex:none;box-shadow:0 .5cqw 1.6cqw rgba(0,0,0,.18)}
.art .lg img{width:100%;height:100%;object-fit:cover;display:block}

/* edição direto na arte */
.preview .art .in{pointer-events:none}
.preview .art [data-el]{pointer-events:auto;cursor:grab;outline:1px dashed transparent;outline-offset:.6cqw;transition:outline-color .15s}
.preview .art [data-el]:hover{outline-color:rgba(127,127,127,.6)}
.preview .art [data-el].sel{outline:2px solid var(--pop,#e0663f);touch-action:none}
.preview .art [data-el].editando-texto{cursor:text;outline:2px solid var(--pop,#e0663f);background:rgba(255,255,255,.12)}


/* alças do elemento selecionado, por cima da arte */
.preview{position:relative}
.preview .art.tem-sel{touch-action:none}
.sel-ui{position:absolute;pointer-events:none;z-index:4}
.sel-ui .h-menu{pointer-events:auto;position:absolute;top:-14px;right:-14px;width:28px;height:28px;min-height:0;border-radius:50%;border:2px solid #fff;background:var(--pop,#e0663f);color:#fff;font:700 16px/1 system-ui;display:grid;place-items:center;padding:0;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.sel-ui .h-res{pointer-events:auto;position:absolute;right:-9px;bottom:-9px;width:18px;height:18px;border-radius:4px;border:2px solid #fff;background:var(--pop,#e0663f);cursor:nwse-resize;touch-action:none;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.sel-menu{pointer-events:auto;position:absolute;top:18px;right:-14px;min-width:220px;display:grid;padding:6px;border-radius:12px;background:var(--surface);border:1px solid var(--line);box-shadow:0 10px 30px rgba(0,0,0,.25);font-size:13px;z-index:5}
.sel-menu b{padding:6px 10px 4px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.sel-menu button{text-align:left;border:0;background:none;color:var(--ink);font:inherit;padding:9px 10px;border-radius:8px;cursor:pointer;min-height:0}
.sel-menu button:hover{background:var(--sunk)}
@media (pointer:coarse){.sel-ui .h-menu{width:34px;height:34px;top:-17px;right:-17px}.sel-ui .h-res{width:24px;height:24px;right:-12px;bottom:-12px}}

/* balão de estilo ao selecionar palavras na arte */
.fmt-bolha{position:absolute;z-index:6;display:flex;gap:4px;padding:5px;border-radius:12px;background:var(--surface);border:1px solid var(--line);box-shadow:0 8px 24px rgba(0,0,0,.25)}
.fmt-bolha button{border:0;border-radius:8px;background:var(--sunk);color:var(--ink);font:600 13px/1 system-ui;padding:9px 11px;cursor:pointer;min-height:0}
.fmt-bolha button[data-fmt=scr]{font-size:17px;font-weight:400}

/* onde publicar */
.destinos{display:grid;gap:8px}
.dest-opcoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}
.dest-op{display:grid;gap:3px;text-align:left;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;cursor:pointer;min-height:0}
.dest-op b{font-size:15px}
.dest-op span{font-size:12px;color:var(--muted);line-height:1.3}
.dest-op[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}
.dest-op[aria-pressed=true] b::before{content:"✓ ";color:var(--accent)}
.ver-como{align-items:center}
.tela916{aspect-ratio:9/16;display:flex;align-items:center;border-radius:16px;overflow:hidden;container-type:inline-size;max-width:420px;margin-inline:auto;width:100%}
.tela916 .art{width:100%;border-radius:0}
.export-stage .tela916-exp{width:1080px;height:1920px;display:flex;align-items:center}
.export-stage .tela916-exp .art{width:1080px;height:1350px;flex:none}
.baixar{flex-wrap:wrap;gap:6px}
/* selo de destino nas miniaturas */
.dests{position:absolute;left:3px;bottom:3px;display:flex;gap:2px;z-index:2}
.dests i{font-style:normal;font-size:9px;font-weight:700;line-height:1;padding:3px 4px;border-radius:4px;background:rgba(0,0,0,.62);color:#fff}
.dests i.d-reels{background:#7b3fe4}
.dests i.d-stories{background:#e0663f}
.thumb{position:relative}

/* fonte e cor no menu do elemento */
.sel-menu .lbl-menu{padding:6px 10px 2px;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.fontes-menu{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:2px 6px 6px}
.fontes-menu button{display:grid;justify-items:center;gap:2px;padding:6px 4px!important;border:1.5px solid var(--line)!important;font-size:20px!important;line-height:1}
.fontes-menu button small{font:11px/1.1 system-ui;color:var(--muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fontes-menu button[aria-pressed=true],.cores-menu button[aria-pressed=true]{border-color:var(--accent)!important;box-shadow:0 0 0 2px var(--accent-soft)}
.cores-menu{display:flex;flex-wrap:wrap;gap:6px;padding:2px 10px 8px;align-items:center}
.cores-menu button{width:26px;height:26px;padding:0!important;border-radius:50%!important;border:2px solid var(--line)!important}
.cores-menu .cor-padrao{width:auto;height:26px;border-radius:13px!important;padding:0 10px!important;font-size:12px!important;background:var(--sunk)}

/* arte vertical (Stories/Reels 9:16): margens de segurança do Instagram em cima e embaixo */
.art.v916{aspect-ratio:9/16;max-width:420px;margin-inline:auto;width:100%}
.art.v916 .in{padding:17cqw 7.5cqw 26cqw;gap:4cqw}
.art.v916 h3{font-size:9.5cqw}
.export-stage .art.v916{width:1080px;height:1920px;max-width:none}

/* mídia do post: só a escolhida + botão; galeria em janela */
.midia-atual{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.mthumb2{width:52px;aspect-ratio:4/5;border-radius:8px;overflow:hidden;background:var(--sunk);flex:none;display:block}
.mthumb2 img,.mthumb2 video{width:100%;height:100%;object-fit:cover;display:block}
.mthumb2.grande{width:140px;justify-self:center}
.janela{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.45);display:grid;place-items:end center;padding-top:env(safe-area-inset-top,0px)}
.janela-in{width:min(720px,100%);max-height:86vh;overflow:auto;background:var(--ground);border-radius:18px 18px 0 0;padding:14px 16px calc(16px + env(safe-area-inset-bottom,0px));display:grid;gap:10px}
@media (min-width:760px){.janela{place-items:center}.janela-in{border-radius:18px}}
.galeria-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:6px}
.galeria-grade button{position:relative;border:2px solid transparent;border-radius:10px;padding:0;overflow:hidden;aspect-ratio:4/5;background:var(--sunk);cursor:pointer}
.galeria-grade button[aria-pressed=true]{border-color:var(--pop)}
.galeria-grade img,.galeria-grade video{width:100%;height:100%;object-fit:cover;display:block}
.play-mini{position:absolute;right:5px;bottom:5px;font-size:11px;background:rgba(0,0,0,.6);color:#fff;border-radius:6px;padding:1px 5px}
.aviso-grade{padding:12px;border-radius:14px;background:var(--pop-soft)}
/* post de texto com foto de fundo: véu escuro para o texto continuar legível */
.art.com-foto .veu{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.6));pointer-events:none}
.art.com-foto .in{z-index:1}

/* conexão do número do Psiu */
.whats-conexao{padding:10px;border:1px dashed var(--line);border-radius:12px}
.qr-whats{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.qr-whats img{width:220px;height:220px;background:#fff;padding:8px;border-radius:12px}
.qr-whats ol{margin:0;padding-left:18px;display:grid;gap:4px;max-width:320px}