/* FOX Social — superfícies escuras, conteúdo primeiro, confortável ao toque. */
:root {
  color-scheme: dark;
  --bg:#08090b; --surface:#111215; --surface-2:#181a1e; --surface-3:#22252a;
  --border:#34373d; --border-soft:#25282e; --text:#f2f3f5; --muted:#b9bdc6; --faint:#a1a7b2;
  --accent:#b9e580; --accent-2:#b9e580; --accent-soft:#24272c; --lime:#b9e580;
  --ok:#a5ddb0; --ok-soft:#233a2b; --warn:#f0cc86; --warn-soft:#392f1d;
  --err:#ffb5ad; --err-soft:#402a28; --info:#bec4cf; --info-soft:#24282f;
  --radius:14px; --radius-sm:9px; --shadow:0 12px 36px rgba(0,0,0,.38);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
html { scroll-padding-top:90px; -webkit-text-size-adjust:100%; }
body { font-family:var(--font); font-size:15px; line-height:1.55; background:var(--bg); color:var(--text); }
::selection { background:var(--lime); color:#183223; }
* { scrollbar-width:thin; scrollbar-color:#50555f transparent; }
button,input,textarea,select { font:inherit; }
button,a,input,textarea,select,summary { -webkit-tap-highlight-color:transparent; }
button,a,summary { touch-action:manipulation; }
input,textarea { caret-color:var(--accent); }
img,svg { max-width:100%; }
[hidden],[x-cloak] { display:none !important; }
a { color:var(--accent); text-underline-offset:4px; }
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline:3px solid #8fbb72; outline-offset:3px; }
h1,h2,h3,h4 { color:var(--text); font-family:var(--font); }
h1 { font-size:30px; letter-spacing:-.03em; line-height:1.2; font-weight:700; }
h2 { font-size:22px; letter-spacing:-.025em; line-height:1.3; }
h3 { font-size:15px; letter-spacing:-.015em; font-weight:650; }
p { max-width:72ch; }
.small { font-size:13px; }.tiny { font-size:12px; }.ui-icon { display:inline-block; flex-shrink:0; vertical-align:middle; }
.skip-link { position:fixed; top:-100px; left:20px; z-index:2000; background:var(--accent); color:var(--text); padding:12px 20px; border-radius:8px; }
.skip-link:focus { top:12px; }
.app { display:block; min-height:100dvh; }
.sidebar { width:224px; position:fixed; inset:0 auto 0 0; height:100dvh; display:flex; flex-direction:column; background:var(--surface); border-right:1px solid var(--border); padding:30px 16px 20px; z-index:80; }
.brand { display:flex; gap:10px; align-items:center; padding:0 10px; margin:0 0 38px; font-size:24px; font-weight:400; letter-spacing:-.04em; color:var(--text); white-space:nowrap; }
.brand:hover { text-decoration:none; }.brand b { font-weight:800; }.brand-mark { width:31px; height:35px; color:var(--accent); }
.nav { display:flex; flex-direction:column; gap:5px; }
.nav .nav-link { min-height:46px; padding:11px 13px; border-radius:9px; gap:12px; color:var(--muted); font-size:14px; line-height:1.35; font-weight:500; }
.nav .nav-link.ativo { background:var(--accent-soft); color:var(--accent); font-weight:650; }
.nav .nav-link:hover { background:var(--surface-3); color:var(--text); }
.nav-divider { height:1px; background:var(--border-soft); margin:15px 13px; }
.sidebar-foot { margin-top:auto; padding-top:36px; }
.sidebar-foot p { color:var(--faint); font-size:11px; padding:0 12px; margin:15px 0 0; }
.install-link { display:flex; align-items:center; gap:10px; min-height:47px; padding:10px 12px; border:1px solid var(--border); border-radius:9px; font-size:13px; font-weight:550; }
.install-link span { flex:1; }.install-link:hover { background:var(--surface-2); text-decoration:none; }
.workspace { margin-left:224px; min-width:0; }
.topbar { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 36px; border-bottom:1px solid var(--border); }
.workspace-label { display:flex; gap:10px; align-items:center; font-size:12px; color:var(--text); }
.workspace-monogram { width:28px; height:28px; border:1px solid var(--border); background:var(--surface); display:grid; place-items:center; font-weight:750; border-radius:8px; }
.topbar-actions { display:flex; align-items:center; gap:6px; }.network-state { display:flex; align-items:center; gap:7px; font-size:11px; color:var(--muted); margin-right:14px; }
.network-state.is-offline { color:var(--warn); }.network-state.is-offline .dotmark { background:var(--warn); }
.icon-button { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; padding:8px; border:0; background:transparent; color:var(--muted); border-radius:10px; cursor:pointer; }
.icon-button:hover { background:var(--surface-3); text-decoration:none; }.mobile-brand,.bottom-nav { display:none; }
.main { max-width:1320px; width:100%; padding:34px 36px 64px; margin:auto; min-width:0; }
.page-head { margin-bottom:26px; align-items:center; gap:16px; }
.page-head h1 { margin:0; }.page-head .sub { font-size:14px; color:var(--muted); margin-top:7px; max-width:65ch; }
.card { background:var(--surface); border:1px solid var(--border); box-shadow:none; padding:24px; border-radius:var(--radius); margin-bottom:20px; min-width:0; }
.card.tight { padding:18px; }.card-head { margin-bottom:18px; gap:12px; }.card-head h3 { font-size:16px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.settings-disclosure > summary { display:flex; align-items:center; gap:10px; list-style:none; font-size:14px; font-weight:600; }
.settings-disclosure > summary::after { content:'+'; margin-left:auto; font-size:20px; font-weight:400; color:var(--faint); }
.settings-disclosure[open] > summary::after { content:'−'; }.settings-disclosure > summary::-webkit-details-marker { display:none; }
.settings-disclosure .disclosure-content { padding-top:22px; }.settings-disclosure .disclosure-content > .card-head { display:none; }
.card h3 { margin-bottom:14px; }.card-head h3 { margin:0; }
.grid { gap:20px; min-width:0; }.grid > * { min-width:0; }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }.grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.row { gap:10px; }.row > * { min-width:0; }
.btn { min-height:42px; justify-content:center; gap:8px; padding:10px 16px; font-size:13px; font-weight:600; border:1px solid var(--border); background:var(--surface); color:var(--text); box-shadow:none; transition:background 150ms,border-color 150ms,transform 120ms; line-height:1.35; white-space:normal; text-align:center; }
.btn:active,.icon-button:active,.bottom-item:active { transform:scale(.98); }
.btn:hover { background:var(--surface-3); border-color:var(--border); }
.btn-primary,.btn-primary:hover { background:var(--accent); color:var(--text); border-color:var(--accent); filter:none; }
.btn-primary:hover { background:#1a3b29; }.btn-primary:disabled { background:#30343a; border-color:#30343a; color:#a1a7b2; opacity:1; }
.btn:disabled { cursor:not-allowed; opacity:.55; }.btn-primary:disabled { opacity:1; }
.btn-danger { color:var(--err); background:var(--err-soft); border-color:#72413d; }.btn-danger:hover { background:var(--err-soft); }
.btn-ghost { background:transparent; border-color:transparent; color:var(--muted); }.btn-sm { font-size:12px; padding:8px 12px; min-height:36px; }.btn-lg { padding:15px 24px; min-height:49px; font-size:15px; }
.btn-block { width:100%; }
label { color:var(--text); font-size:13px; font-weight:550; margin-bottom:7px; }
input[type=text],input[type=password],input[type=number],input[type=datetime-local],input[type=time],input[type=date],input[type=url],input[type=email],select,textarea {
  width:100%; background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:9px; padding:12px; min-height:46px; box-shadow:none; font-size:15px; max-width:100%;
}
input:focus,select:focus,textarea:focus { border-color:#8fbb72; box-shadow:0 0 0 3px var(--accent-soft); }
input::placeholder,textarea::placeholder { color:var(--faint); opacity:1; }
textarea { line-height:1.6; min-height:112px; }
input[type=checkbox],input[type=radio] { accent-color:var(--accent); width:18px; height:18px; flex-shrink:0; }
.field { margin-bottom:18px; }.help { font-size:12px; line-height:1.6; color:var(--faint); margin-top:7px; }
.inline-form { gap:14px; }.inline-form > div { min-width:150px; }
table { font-size:13px; table-layout:auto; }
th { text-transform:none; letter-spacing:0; font-weight:550; color:var(--muted); font-size:12px; background:transparent; padding:12px 10px; border-bottom:1px solid var(--border); }
td { padding:16px 10px; border-color:var(--border-soft); overflow-wrap:anywhere; }
tbody tr:hover { background:var(--surface-2); }.right { text-align:right; }
.badge { font-size:11px; line-height:1.5; padding:4px 8px; border-radius:6px; font-weight:550; background:var(--surface-3); color:var(--muted); gap:5px; }
.badge-ok { background:var(--ok-soft); color:var(--ok); }.badge-info { background:var(--info-soft); color:var(--info); }.badge-warn { background:var(--warn-soft); color:var(--warn); }.badge-err { background:var(--err-soft); color:var(--err); }.badge-accent { color:var(--accent); background:var(--accent-soft); }
.dotmark { width:6px; height:6px; margin-right:1px; flex-shrink:0; }
.alert,.banner,.connection-banner { border:1px solid #695632; background:var(--warn-soft); color:var(--warn); border-radius:10px; padding:14px 16px; font-size:13px; line-height:1.65; margin-bottom:20px; }
.banner,.connection-banner { display:flex; align-items:center; gap:12px; }
.alert-info { background:var(--info-soft); border-color:var(--border); color:var(--muted); }.alert-ok { background:var(--ok-soft); border-color:var(--border); color:var(--ok); }.alert-err { background:var(--err-soft); border-color:#72413d; color:var(--err); }
.empty { background:var(--surface-2); border:0; padding:36px 22px; color:var(--muted); }
.empty .big { display:none; }
.tabs { gap:6px; border:0; padding:0; overflow-x:auto; flex-wrap:nowrap; padding-bottom:4px; }
.tabs a { border:1px solid transparent; border-radius:8px; color:var(--muted); min-height:40px; white-space:nowrap; padding:9px 14px; font-size:13px; }
.tabs a.ativo,.tabs a.active { background:var(--accent-soft); color:var(--accent); border-color:#555b65; }
details > summary { cursor:pointer; min-height:44px; }
details.avancado > summary { color:var(--text); font-weight:550; padding:13px 0; min-height:44px; }
details.avancado > summary::before { content:''; display:inline-block; width:7px; height:7px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(-45deg); margin:0 12px 2px 2px; }
details.avancado[open] > summary::before { transform:rotate(45deg); }
.kbd { background:var(--surface-2); border-color:var(--border); color:var(--text); }
.alvo { padding:18px 0; margin:0; border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent; gap:12px; min-width:0; }
.alvo:last-child { border-bottom:0; }.alvo .who { min-width:130px; }.alvo .msg { font-size:12px; }.alvo .st { min-width:90px; }
.alvo .nome { font-size:14px; overflow-wrap:anywhere; }.alvo .nome > .small { font-size:12px; }
.alvo .nome .badge { margin-top:6px; }.alvo .tiny { margin-top:5px; }
#lista-contas .alvo { align-items:center; }.account-avatar { flex-shrink:0; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:17px; font-weight:750; }
.account-actions { flex-shrink:0; }.account-actions > .btn-primary { background:var(--surface); color:var(--text); border-color:var(--border); }
details[id^=menu-login] > .card { box-shadow:var(--shadow) !important; z-index:100 !important; padding:18px; }
details[id^=menu-login] summary { min-width:40px; }
.composer-layout { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:24px; align-items:start; }
.composer-work { min-width:0; background:var(--surface); border:1px solid var(--border); border-radius:14px; }
.composer-work > .card,.composer-work > form > .card { border:0; border-bottom:1px solid var(--border-soft); border-radius:0; margin:0; padding:22px 24px; }
.composer-work > .card:first-child { border-radius:14px 14px 0 0; }
.composer-work .card-head h3 { font-size:14px; }.composer-work .card-head { margin-bottom:16px; }
.composer-work #form-post { margin:0; }.composer-work .inline-note { font-size:12px; color:var(--faint); margin:8px 0 0; }
.composer-preview { position:sticky; top:22px; min-width:0; }
.mobile-preview-toggle { display:none; }
.composer-preview > .card { padding:20px; }.composer-preview h3 { font-size:14px; }
.dropzone { background:var(--surface-2); border:1px dashed var(--border); padding:27px 16px; color:var(--text); min-height:180px; display:flex; align-items:center; flex-direction:column; justify-content:center; gap:5px; border-radius:10px; font-weight:400; }
.dropzone .dz-ico { width:39px; height:39px; display:grid; place-items:center; margin:0 0 5px; color:var(--faint); opacity:1; }
.dropzone:hover,.dropzone.arrastando { background:var(--accent-soft); border-color:#8fbb72; }
.dropzone .tiny { font-size:12px; }.dropzone b { font-size:14px; font-weight:600; }
.dropzone:focus-within { outline:3px solid #8fbb72; outline-offset:3px; }
.dropzone input[type=file] { position:absolute; width:1px; height:1px; opacity:0; display:block; overflow:hidden; }
.preview-atual { border:0; padding:12px 0 0; background:transparent; }.preview-atual img { width:56px; height:56px; background:var(--surface-2); }
.format-switch { display:flex; gap:5px; background:var(--surface-2); border-radius:9px; padding:4px; }
.format-switch label { flex:1; margin:0; position:relative; cursor:pointer; min-height:42px; display:flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; border-radius:7px; font-size:13px; }
.format-switch label:has(input:checked) { background:var(--surface); border-color:#555b65; color:var(--accent); }
.format-switch label:has(input:focus-visible) { outline:2px solid #8fbb72; }.format-switch input { position:absolute; opacity:0; width:1px; height:1px; margin:0; pointer-events:none; }
.lista-contas { gap:8px; max-height:none; padding:0; overflow:visible; }
.item-conta { display:flex; align-items:center; gap:12px; border:1px solid var(--border); border-radius:9px; background:var(--surface); padding:12px; margin:0; min-width:0; }
.item-conta:hover { border-color:#555b65; }.item-conta.marcado,.item-conta:has(input:checked) { background:var(--accent-soft); border-color:#555b65; }
.item-conta .nome { font-size:13px; font-weight:550; overflow-wrap:anywhere; line-height:1.45; }.item-conta .meta { font-size:11px; color:var(--faint); margin-top:2px; }
.item-conta .meta .badge { font-size:11px; padding:0; border:0; background:transparent; }
.item-conta .account-avatar { width:30px; height:30px; font-size:13px; background:var(--surface-3); }
.account-caption { padding:0 0 0 41px; margin-top:-5px; }
.account-caption summary { font-size:11px; color:var(--faint); min-height:30px; padding:5px 0; }
.account-caption textarea { font-size:13px; min-height:70px; margin:0 0 8px; }
.composer-caption textarea { min-height:120px; }
.composer-caption .help { max-width:65ch; }.caption-options { margin-top:10px; }
.composer-optional { border:0; border-bottom:1px solid var(--border-soft); padding:0 24px 12px; }
.composer-optional summary { display:flex; align-items:center; gap:9px; list-style:none; min-height:52px; font-size:13px; font-weight:550; }
.composer-optional summary::-webkit-details-marker { display:none; }.composer-optional summary::after { content:'+'; margin-left:auto; color:var(--faint); font-size:18px; font-weight:400; }
.composer-optional[open] summary::after { content:'−'; }.composer-optional label { min-height:42px; }
.composer-submit-bar { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:20px 24px; border-top:1px solid var(--border-soft); border-radius:0 0 14px 14px; background:var(--surface); }
.composer-submit-note { color:var(--faint); font-size:12px; }.composer-submit-bar .btn { min-width:190px; }
.composer-progress { background:var(--surface); border:1px solid var(--border); box-shadow:0 10px 45px #0000001f; backdrop-filter:none; }
.composer-progress-kicker { display:none; }.composer-progress-bar { margin-bottom:12px; }.composer-progress-head strong { font-size:15px; }
.barra > div,.barra-fill { background:var(--ok); }.barra { background:var(--surface-2); }
.preview-card { max-width:100%; border:1px solid var(--border); background:var(--surface); border-radius:10px; }
.preview-head { padding:12px; gap:9px; }.preview-avatar { width:30px; height:30px; background:var(--accent); color:#b9e580; font-size:13px; font-weight:700; }
.preview-user { font-size:12px; }.preview-local { font-size:11px; }.preview-img-placeholder { min-height:240px; padding:30px; background:var(--surface-2); text-align:center; font-size:12px; }
.preview-actions { padding:12px; gap:13px; }.preview-caption { font-size:12px; padding:0 12px 14px; }.preview-meta { padding:0 12px 12px; font-size:11px; }
.preview-img-ig { max-height:420px; background:var(--surface-2); }.preview-card-story { background:#111215; }.preview-card-story .preview-meta { color:#d8e5d1; }
.story-options,.story-editor-tools { border-color:var(--border); background:var(--surface-2); }.story-model-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.story-model-choice { border-width:1px; background:var(--surface); padding:7px; }.story-model-choice img { height:125px !important; max-height:125px !important; }.story-drag-handle { background:var(--accent); }
.media-grid { grid-template-columns:repeat(auto-fill,minmax(145px,1fr)); gap:14px; }
.media-card { background:var(--surface-2); border-radius:10px; border:1px solid var(--border); }
.media-card img { background:var(--surface-2); }.media-card .info { font-size:11px; padding:9px 10px; }.media-card .x { min-width:30px; min-height:30px; }
.composer-work .media-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; max-height:300px; overflow:auto; padding:3px; }
.stats-row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-bottom:1px solid var(--border); padding:5px 0 24px; margin:0 0 28px; gap:20px; }
.stats-row .stat { border:0; border-radius:0; padding:0; background:transparent; }
.stat .label { font-size:12px; text-transform:none; letter-spacing:0; color:var(--muted); }
.stat .value { font-size:28px; font-weight:600; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }.stat .hint { font-size:11px; color:var(--faint); }
.overview-layout { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:24px; align-items:start; }
.section-head { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:18px; }.section-head h2 { font-size:19px; margin:0; }
.post-list { display:flex; flex-direction:column; }.post-list-row { padding:16px 0; display:flex; align-items:center; gap:16px; border-bottom:1px solid var(--border); color:var(--text); }
.post-list-row:hover { text-decoration:none; }.post-thumbnail { width:62px; height:70px; object-fit:cover; border-radius:8px; background:var(--surface-2); }.post-list-copy { flex:1; min-width:0; }.post-list-copy strong { display:block; font-size:14px; font-weight:600; margin-bottom:5px; overflow-wrap:anywhere; }.post-list-copy p { font-size:12px; color:var(--muted); margin:0; }
.overview-quick { background:var(--accent-soft); border:0; padding:25px; border-radius:14px; margin-bottom:22px; }.overview-quick h2 { font-size:23px; margin:0 0 10px; }.overview-quick p { color:var(--muted); font-size:13px; margin-bottom:22px; }
.agendado-item { background:var(--surface); border:0; border-bottom:1px solid var(--border); border-radius:0; padding:15px 0; flex-wrap:wrap; }.agendado-hora { color:var(--accent); font-size:12px; min-width:0; }.agendado-titulo { flex-basis:100%; }.agendado-contas .badge { font-size:11px !important; }
.barras { height:150px; padding:8px 0 0; }.barra-fundo { background:var(--surface-2); border-radius:5px; }.barra-fill { border-radius:5px 5px 0 0; min-height:0; }.barra-label { font-size:11px; }
.cal { border-color:var(--border); }.cal .dia { min-width:0; background:var(--surface); border-color:var(--border); }.cal .dia.hoje { background:var(--accent-soft); }.cal .cab { color:var(--muted); background:var(--surface-2); font-weight:550; }.cal .num { color:var(--text); }.cal .chip { background:var(--accent-soft); color:var(--accent); white-space:normal; font-size:11px; }
dialog.modal { border:0; box-shadow:var(--shadow); }.modal::backdrop,.mobile-menu::backdrop { background:#000000a6; }
.mobile-menu { border:0; color:var(--text); background:var(--surface); width:min(440px,calc(100% - 24px)); padding:20px; border-radius:18px; max-height:calc(100dvh - 50px); box-shadow:var(--shadow); }
.mobile-menu-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }.mobile-menu-head h2 { margin:0; font-size:20px; }.mobile-menu .nav-divider { margin:10px; }.mobile-menu .install-link { margin-top:20px; }
.toast-wrap { bottom:24px; right:24px; max-width:calc(100vw - 32px); }.toast { background:var(--surface); color:var(--text); border:1px solid var(--border); box-shadow:var(--shadow); font-size:13px; }.toast.ok,.toast.err,.toast.warn { border-left-width:1px; }.toast.err { background:var(--err-soft); }.toast.warn { background:var(--warn-soft); }
.app-update { position:fixed; z-index:300; bottom:22px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:20px; padding:14px 18px; background:var(--text); color:var(--surface); border-radius:10px; box-shadow:var(--shadow); font-size:13px; max-width:calc(100vw - 32px); }.app-update button { border:0; border-radius:6px; background:var(--lime); color:var(--text); padding:8px 12px; font-weight:650; cursor:pointer; }
.install-layout { display:grid; grid-template-columns:minmax(250px,.7fr) 1fr; gap:60px; align-items:start; }.install-intro { padding:20px 0; }.install-intro img { border-radius:22px; margin-bottom:28px; }.install-intro h2 { font-size:28px; }.install-intro p { font-size:15px; color:var(--muted); margin:12px 0 24px; }.install-intro .btn { margin-top:18px; }.install-ready { display:flex; align-items:center; gap:10px; color:var(--ok); font-size:13px; }.install-instructions { padding:28px; }.install-instructions h2 { font-size:19px; }.install-steps { list-style:none; counter-reset:step; padding:0; margin:26px 0 0; }.install-steps li { counter-increment:step; display:flex; gap:16px; padding-bottom:24px; }.install-steps li::before { content:counter(step); flex-shrink:0; width:30px; height:30px; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; border-radius:50%; font-size:13px; font-weight:650; }.install-steps h3 { margin:1px 0 6px; font-size:14px; }.install-steps p { margin:0 0 8px; font-size:13px; color:var(--muted); }.install-note { display:flex; gap:14px; border-top:1px solid var(--border); padding-top:24px; margin-top:24px; color:var(--muted); font-size:13px; }.install-note p { margin:4px 0 0; }
@media (hover:hover) { .media-card:hover { border-color:#555b65; }.post-list-row:hover strong { color:var(--accent); } }
@media (max-width:1200px) {
  .sidebar { width:206px; padding-inline:12px; }.workspace { margin-left:206px; }.main { padding:28px 24px 60px; }.topbar { padding-inline:24px; }
  .composer-layout,.overview-layout { grid-template-columns:minmax(0,1fr) 290px; gap:20px; }.composer-work > .card,.composer-work > form > .card { padding:20px; }.composer-preview > .card { padding:16px; }
}
@media (max-width:1000px) {
  .sidebar { width:190px; padding-inline:10px; }.workspace { margin-left:190px; }.brand { font-size:21px; }.nav .nav-link { font-size:13px; padding-inline:10px; }
  .composer-layout { grid-template-columns:minmax(0,1fr); }.composer-preview { position:static; max-width:480px; width:100%; margin:auto; }.overview-layout { grid-template-columns:minmax(0,1fr); }.overview-side { display:grid; grid-template-columns:1fr 1fr; gap:20px; }.workspace-label .faint { display:none; }.install-layout { gap:28px; }
}
@media (max-width:760px) {
  html { scroll-padding-top:80px; }.sidebar { display:none; }.workspace { margin-left:0; }.workspace-label { display:none; }.mobile-brand { display:block; }.mobile-brand .brand { margin:0; padding:0; font-size:21px; gap:7px; }.mobile-brand .brand-mark { width:25px; height:29px; }
  .topbar { min-height:66px; padding:10px 20px; padding-top:max(10px,env(safe-area-inset-top)); background:var(--surface); gap:8px; position:sticky; top:0; z-index:60; }.network-state { display:none; }.topbar-actions { gap:0; }.topbar-actions .icon-button { width:38px; height:40px; }
  .main { padding:26px 20px calc(110px + env(safe-area-inset-bottom)); max-width:none; }.page-head { margin-bottom:23px; gap:14px; }.page-head h1 { font-size:27px; }.page-head .sub { font-size:13px; line-height:1.6; margin-top:7px; }
  .page-head .row { gap:6px; }.page-head .btn { min-height:40px; font-size:12px; }.card { padding:20px; margin-bottom:18px; }.card-head { margin-bottom:16px; }.card-head h3 { font-size:15px; }
  .bottom-nav { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); align-items:start; position:fixed; z-index:90; inset:auto 0 0; padding:8px max(8px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); min-height:72px; background:var(--surface); border-top:1px solid var(--border); }
  .bottom-item { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; border:0; background:transparent; color:var(--muted); font:500 11px/1.2 var(--font); min-height:50px; padding:5px 2px; border-radius:9px; cursor:pointer; }.bottom-item .ui-icon { width:21px; height:21px; }.bottom-item.ativo { background:var(--accent-soft); color:var(--accent); font-weight:700; }.bottom-item:hover { text-decoration:none; }
  .grid-2,.grid-3 { grid-template-columns:minmax(0,1fr); }.grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .grid[style*='grid-template-columns'] { grid-template-columns:minmax(0,1fr) !important; }
  input[type=text],input[type=password],input[type=number],input[type=datetime-local],input[type=time],input[type=date],input[type=url],input[type=email],select,textarea { font-size:16px; min-height:48px; padding:12px; }
  input[type=checkbox],input[type=radio] { width:20px; height:20px; }.btn { min-height:44px; }.btn-sm { min-height:40px; }
  .inline-form { display:grid; grid-template-columns:minmax(0,1fr); width:100%; }.inline-form > div { min-width:0; width:100%; }.inline-form > button { width:100%; }
  .composer-layout { display:block; }.composer-work { border-radius:12px; }.composer-work > .card,.composer-work > form > .card { padding:20px 17px; }.composer-work .card-head { gap:10px; }.composer-work .card-head .row { gap:2px; }.composer-work .card-head .btn-sm { padding:7px 8px; font-size:11px; min-height:34px; }
  .composer-work .dropzone { min-height:175px; padding:24px 12px; }.composer-work .dropzone b { font-size:14px; }.dropzone .tiny { font-size:11px; }.composer-work .media-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .item-conta { padding:12px 10px; gap:9px; }.item-conta .nome { font-size:12px; }.item-conta .account-avatar { width:28px; height:28px; }.item-conta .meta { font-size:11px; }.account-caption { padding-left:39px; }.account-caption textarea { font-size:16px; }
  .composer-optional { padding-inline:17px; }.composer-optional summary { min-height:54px; }.composer-submit-bar { position:sticky; bottom:calc(71px + env(safe-area-inset-bottom)); z-index:50; padding:14px 17px; gap:10px; border-top:1px solid var(--border); border-radius:0 0 12px 12px; box-shadow:0 -4px 16px #00000009; }.composer-submit-bar .btn { flex:1; min-width:0; min-height:48px; font-size:13px; }.composer-submit-note { font-size:11px; max-width:90px; }
  .mobile-preview-toggle { display:flex; width:100%; margin-top:20px; }
  .composer-preview { display:none; margin-top:18px; max-width:100%; }.composer-preview.is-visible { display:block; }.composer-preview .preview-card { max-width:340px; margin:0 auto; }.composer-preview > .card { padding:18px; }.story-model-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.story-model-choice img { height:145px !important; max-height:145px !important; }
  #lista-contas .alvo,.account-row { display:grid; grid-template-columns:36px minmax(0,1fr); align-items:start; gap:10px 12px; padding:20px 0; }
  .account-row > .account-avatar { width:36px; height:36px; font-size:15px; }
  .account-row .account-identity { grid-column:2; min-width:0 !important; }
  .account-row .nome { font-size:14px; line-height:1.7; overflow-wrap:anywhere; }
  .account-row .nome .small { display:none; }
  .account-row > .st { grid-column:2; margin:0; min-width:0; }
  .account-row .account-actions { grid-column:2; display:flex; flex-wrap:wrap; margin:0; gap:8px !important; }
  .account-row .account-actions > .btn-primary { display:inline-flex; }
  .account-row .account-actions .btn { min-height:44px; font-size:12px; padding:9px 12px; }
  .alvo .who { min-width:0; flex-basis:100%; }.alvo .msg { flex-basis:100%; }.alvo .st + .msg { margin-left:0; }
  details[id^=menu-login] > .card { position:fixed !important; inset:auto 12px calc(90px + env(safe-area-inset-bottom)) !important; width:auto !important; max-height:65dvh; overflow-y:auto; box-shadow:0 8px 60px #00000030 !important; }
  .stats-row { gap:24px 16px; grid-template-columns:repeat(2,minmax(0,1fr)); }.stat .value { font-size:27px; }.overview-side { display:block; }.overview-quick { padding:22px; }.post-list-row { gap:12px; }.post-thumbnail { width:50px; height:62px; }.post-list-copy strong { font-size:13px; }.post-list-copy p { font-size:11px; }.post-list-row > .badge { font-size:11px; }
  table,thead,tbody,tr,td { display:block; width:100%; }thead { display:none; }tbody tr { position:relative; padding:15px 0; border-bottom:1px solid var(--border); }tbody tr:last-child { border:0; }td { border:0; padding:4px 0; display:flex; gap:14px; justify-content:space-between; align-items:center; font-size:12px; }td:first-child { font-size:14px; margin-bottom:7px; display:block; }td:first-child::before { display:none; }td[data-label]::before { content:attr(data-label); font-size:11px; color:var(--faint); flex-shrink:0; }td.right { justify-content:flex-end; margin-top:8px; }
  .cal { gap:0; }.cal .dia { min-height:82px; padding:5px 3px; }.cal .cab { padding:8px 0; font-size:11px; }.cal .num { font-size:11px; }.cal .chip { padding:3px; font-size:11px; overflow:hidden; line-height:1.4; max-height:40px; }.cal .dia.vazio { opacity:.35; }
  .media-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.media-card .info { font-size:11px; }.media-card .x { width:32px; height:32px; }
  .toast-wrap { bottom:calc(90px + env(safe-area-inset-bottom)); right:16px; left:16px; }.toast { max-width:100%; }.composer-progress { bottom:calc(88px + env(safe-area-inset-bottom)); width:calc(100vw - 24px); padding:16px; }.app-update { bottom:calc(90px + env(safe-area-inset-bottom)); font-size:12px; width:calc(100% - 32px); }
  .install-layout { grid-template-columns:minmax(0,1fr); gap:16px; }.install-intro { padding:0; }.install-intro img { width:72px; height:72px; border-radius:18px; margin-bottom:20px; }.install-intro h2 { font-size:23px; }.install-intro p { font-size:14px; }.install-instructions { padding:20px; }.install-steps li { gap:12px; }.install-note { margin-top:12px; }
  pre { max-width:100%; overflow:auto; }.banner,.alert { padding:12px 14px; font-size:12px; }canvas { max-width:100%; }
}
@media (max-width:374px) { .main { padding-inline:12px; }.topbar { padding-inline:14px; }.page-head h1 { font-size:25px; }.composer-work > .card,.composer-work > form > .card { padding-inline:14px; }.item-conta .account-avatar { display:none; }.item-conta .nome { font-size:12px; }.account-caption { padding-left:30px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; } }

/* Dark-theme action contrast and independently layered controls. */
.btn-primary,.btn-primary:hover { background:var(--accent); border-color:var(--accent); color:#142111; }
.btn-primary:hover { background:#c8eea1; }
.btn-primary:disabled { background:#30343a; border-color:#30343a; color:#a1a7b2; }
.skip-link { color:#142111; }
.preview-avatar { background:var(--accent-soft); color:var(--accent); }
.app-update { background:var(--surface-3); color:var(--text); }
.app-update button { color:#142111; }
input:focus,select:focus,textarea:focus { box-shadow:none; }
.account-actions > .btn-primary { background:var(--surface-2); color:var(--text); border-color:var(--border); }