.mesa, .mesa-composer, .mesa-confirm {
  --mesa-bg: var(--vscode-editor-background, var(--bg-secondary, #171b29));
  --mesa-text: var(--vscode-editor-foreground, var(--text-primary, #f4f4fa));
  --mesa-muted: var(--vscode-descriptionForeground, var(--text-secondary, #a0a0ba));
  --mesa-accent: var(--vscode-focusBorder, var(--accent-1, #8b5cf6));
  --mesa-border: color-mix(in srgb, var(--mesa-text) 16%, transparent);
  color: var(--mesa-text); background: var(--mesa-bg); font: 13px/1.5 var(--font, system-ui); box-sizing: border-box;
}
.mesa *, .mesa-composer *, .mesa-confirm * { box-sizing: border-box; }
.mesa [hidden], .mesa-composer [hidden] { display: none !important; }
.mesa[hidden] { display: none !important; }
.mesa { position: fixed; z-index: 950; inset: 78px 16px 16px auto; width: min(1010px, calc(100vw - 32px)); display: flex; flex-direction: column; border: 1px solid var(--mesa-border); border-radius: 20px; box-shadow: 0 20px 70px #0006; overflow: hidden; }
.mesa-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 22px 24px 16px; }
.mesa-eyebrow { font-size: 10px; font-weight: 700; letter-spacing: .13em; color: var(--mesa-muted); }
.mesa-heading h2 { margin: 3px 0 0; font-size: 26px; font-weight: 650; letter-spacing: -.04em; }
.mesa-heading h2 span { margin-left: 12px; color: var(--mesa-muted); font-size: 12px; font-weight: 400; letter-spacing: 0; }
.mesa-heading-actions { display: flex; gap: 6px; }
.mesa button, .mesa-composer button, .mesa-confirm button { color: inherit; background: transparent; border: 1px solid var(--mesa-border); border-radius: 9px; padding: 7px 11px; cursor: pointer; font: inherit; }
.mesa button:hover, .mesa-composer button:hover { background: color-mix(in srgb, var(--mesa-accent) 12%, transparent); }
.mesa button:disabled, .mesa-composer button:disabled { opacity: .5; cursor: default; }
.mesa button:focus-visible, .mesa input:focus-visible, .mesa textarea:focus-visible, .mesa-composer :focus-visible, .mesa-confirm :focus-visible { outline: 2px solid var(--mesa-accent); outline-offset: 2px; }
.mesa .mesa-primary, .mesa-composer .mesa-primary { background: var(--mesa-accent); color: #fff; border-color: transparent; }
.mesa-tabs { display: flex; gap: 8px; border-bottom: 1px solid var(--mesa-border); padding: 0 24px 12px; }
.mesa-tabs button { border-color: transparent; font-weight: 600; }
.mesa-tabs button[aria-pressed=true] { color: var(--mesa-text); background: color-mix(in srgb, var(--mesa-accent) 16%, transparent); }
.mesa-tabs button span { font-size: 10px; font-weight: 400; margin-left: 6px; color: var(--mesa-muted); }
.mesa-toolbar { display: flex; gap: 8px; padding: 16px 24px 0; align-items: center; flex-wrap: wrap; }
.mesa input:not([type=checkbox]), .mesa textarea, .mesa-composer input, .mesa-composer textarea, .mesa-composer select { background: color-mix(in srgb, var(--mesa-text) 4%, var(--mesa-bg)); color: var(--mesa-text); border: 1px solid var(--mesa-border); border-radius: 8px; padding: 9px 11px; font: inherit; min-width: 0; }
.mesa input::placeholder, .mesa textarea::placeholder, .mesa-composer input::placeholder, .mesa-composer textarea::placeholder { color: var(--mesa-muted); opacity: .85; }
.mesa-toolbar > input { flex: 1; min-width: 140px !important; }
.mesa-history { color: var(--mesa-muted); font-size: 11px; display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.mesa input[type=checkbox] { accent-color: var(--mesa-accent); width: 14px; height: 14px; min-width: 14px; flex: 0 0 14px; padding: 0; margin: 0; }
.mesa select { min-width: 0; max-width: 100%; border: 1px solid var(--mesa-border); border-radius: 8px; padding: 8px; background: var(--mesa-bg); color: inherit; font: inherit; }
.mesa [data-new-format] { max-width: 170px; }
.mesa-editor label:has(> [data-format]) { display: flex; align-items: center; gap: 10px; }
.mesa-editor [data-format] { flex: 1; }
.mesa-editor [data-body].mesa-body-context { flex: 0 0 auto; min-height: 70px; height: 90px; }
.mesa-code-editor { min-width: 0; }.mesa-code-controls { display: flex; gap: 7px; align-items: end; flex-wrap: wrap; }.mesa-code-controls label { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 130px; font-size: 11px; color: var(--mesa-muted); }.mesa-code-controls button { font-size: 11px; }
.mesa textarea[data-code] { display: block; width: 100%; min-height: 180px; margin: 8px 0; font: 12px/1.65 Consolas, 'Cascadia Code', monospace; tab-size: 2; white-space: pre; overflow: auto; resize: vertical; }
.mesa-code-preview { overflow: auto; max-height: 300px; border: 1px solid var(--mesa-border); border-radius: 8px; padding: 10px; }.mesa-code-preview pre { overflow: auto; }.mesa-code-preview code { font: 12px/1.65 Consolas, monospace; }
.mesa-checklist-progress { font-size: 11px; color: var(--mesa-muted); margin: 0 0 8px; }.mesa-task { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; }.mesa-task [data-task-text] { width: 0; flex: 1; }.mesa-task.is-done [data-task-text] { text-decoration: line-through; color: var(--mesa-muted); }.mesa-task button { padding: 4px 8px; }.mesa-checklist > button { font-size: 12px; }
.mesa-note-files { border: 1px dashed var(--mesa-border); border-radius: 9px; padding: 11px; margin: 3px 0; }.mesa-files-heading { display: flex; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 8px; font-size: 12px; }.mesa-files-heading button { font-size: 11px; }
.mesa-dragover { outline: 2px dashed var(--mesa-accent); outline-offset: -5px; background: color-mix(in srgb, var(--mesa-accent) 8%, transparent); }
.mesa-attachments { min-width: 0; }.mesa-attachment { display: flex; gap: 8px; border-top: 1px solid var(--mesa-border); margin-top: 8px; padding-top: 9px; align-items: center; }.mesa-attachment > div:first-of-type { min-width: 0; flex: 1; }.mesa-attachment strong { display: block; font-size: 11px; overflow-wrap: anywhere; }.mesa-attachment small { display: block; color: var(--mesa-muted); font-size: 10px; }.mesa-file-actions { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }.mesa-file-actions button { font-size: 10px; padding: 5px 7px; }.mesa-file-status { margin: 6px 0 0; color: var(--mesa-muted); font-size: 11px; }
.mesa-attachment-selection { border: 1px solid var(--mesa-border); border-radius: 9px; margin: 12px 0; padding: 12px; }.mesa-attachment-selection legend { font-size: 12px; }.mesa-composer .mesa-attachment-selection label { flex-direction: row; align-items: center; gap: 8px; margin-bottom: 8px; overflow-wrap: anywhere; }.mesa-composer .mesa-attachment-selection input { width: 14px; flex: 0 0 14px; padding: 0; margin: 0; }.mesa-preview-files { font-size: 12px; font-weight: 600; }
.mesa-file-preview { margin: auto; max-width: min(850px, 94vw); max-height: 90vh; overflow: auto; border: 1px solid #8886; border-radius: 14px; padding: 18px; background: var(--vscode-editor-background, var(--bg-secondary, #171b29)); color: var(--vscode-editor-foreground, var(--text-primary, #eee)); }.mesa-file-preview::backdrop { background: #000a; }.mesa-file-preview h3 { font: 14px system-ui; overflow-wrap: anywhere; }.mesa-file-preview img { display: block; max-width: 100%; max-height: 70vh; object-fit: contain; margin-top: 10px; }.mesa-file-preview button { color: inherit; background: transparent; border: 1px solid #8888; padding: 6px 10px; border-radius: 7px; cursor: pointer; }
.mesa-status { color: var(--mesa-muted); min-height: 20px; margin: 5px 24px; font-size: 12px; }
.mesa-workspace { flex: 1; min-height: 0; display: flex; overflow: hidden; }
.mesa-collection { flex: 1; min-width: 0; overflow: auto; padding: 10px 24px 24px; }
.mesa-note-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; align-content: start; }
.mesa button.mesa-note-card { position: relative; display: flex; flex-direction: column; text-align: left; padding: 17px; min-height: 180px; gap: 10px; background: color-mix(in srgb, var(--mesa-text) 3%, var(--mesa-bg)); border-radius: 13px; overflow-wrap: anywhere; }
.mesa-note-card::before { content: ''; height: 3px; border-radius: 3px; background: color-mix(in srgb, var(--mesa-accent) 65%, #d6b96f); width: 28px; }
.mesa-note-card.is-selected { border-color: var(--mesa-accent); }
.mesa-note-card strong { font-size: 15px; }
.mesa-note-meta, .mesa-note-card small { font-size: 10px; color: var(--mesa-muted); }
.mesa-note-excerpt { white-space: pre-wrap; color: var(--mesa-muted); font-size: 12px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.mesa-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: auto; }
.mesa-tags span { background: color-mix(in srgb, var(--mesa-accent) 10%, transparent); padding: 2px 7px; border-radius: 5px; font-size: 10px; }
.mesa-empty { text-align: center; max-width: 330px; margin: 50px auto; color: var(--mesa-muted); }
.mesa-empty > span { display: block; color: var(--mesa-accent); font-size: 46px; }
.mesa-empty h3 { color: var(--mesa-text); font-size: 19px; font-weight: 600; margin: 12px 0; }
.mesa-editor { display: flex; flex-direction: column; flex: 0 0 48%; min-width: 0; padding: 15px 24px 20px; border-left: 1px solid var(--mesa-border); overflow: auto; gap: 10px; }
.mesa-editor-top { display: flex; justify-content: space-between; align-items: center; font-size: 10px; color: var(--mesa-muted); letter-spacing: .06em; position: sticky; top: 0; z-index: 2; background: var(--mesa-bg); padding: 3px 0; }
.mesa-editor [data-title] { font-size: 18px !important; font-weight: 600 !important; }
.mesa-editor [data-body] { width: 100%; min-height: 170px; flex: 1; resize: vertical; line-height: 1.7; }
.mesa-editor label input:not([type=checkbox]) { width: 100%; display: block; margin-top: 5px; }
.mesa-pin { display: flex; align-items: center; gap: 8px; }
.mesa-note-status { color: var(--mesa-muted); font-size: 11px; margin: 0; }
.mesa-editor-actions, .mesa-conflict { display: flex; gap: 6px; flex-wrap: wrap; }
.mesa-editor-actions button { font-size: 11px; }
.mesa-hint { color: var(--mesa-muted); font-size: 11px; margin: 0; }
.mesa-footer { padding: 10px 24px; border-top: 1px solid var(--mesa-border); color: var(--mesa-muted); font-size: 10px; }
.mesa-post-list { display: grid; gap: 16px; max-width: 720px; margin: auto; }
.mesa-post { border: 1px solid var(--mesa-border); border-left: 3px solid var(--mesa-accent); padding: 20px; border-radius: 12px; overflow-wrap: anywhere; background: color-mix(in srgb, var(--mesa-text) 2%, var(--mesa-bg)); }
.mesa-kind-pedido { border-left-color: #d3a348; }.mesa-kind-novidade { border-left-color: #36b797; }
.mesa-post-top { display: flex; justify-content: space-between; gap: 10px; font-size: 11px; color: var(--mesa-muted); }
.mesa-kind { color: var(--mesa-text); font-weight: 600; }
.mesa-post h3 { margin: 13px 0 8px; font-size: 19px; line-height: 1.3; }
.mesa-post-body, .mesa-publication-preview { line-height: 1.65; }
.mesa-post-body p { margin: 8px 0; }
.mesa-post-body pre, .mesa-publication-preview pre { max-width: 100%; overflow: auto; background: #0002; padding: 12px; border-radius: 6px; }
.mesa-post-body a, .mesa-publication-preview a { color: var(--mesa-accent); }
.mesa-post-meta, .mesa-deadline { font-size: 11px; color: var(--mesa-muted); margin: 12px 0; }
.mesa-post-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 16px; }
.mesa-post-actions button { font-size: 11px; }
.mesa-post-actions [aria-pressed=true] { background: color-mix(in srgb, var(--mesa-accent) 22%, transparent); border-color: var(--mesa-accent); }
.mesa-responses { font-size: 11px; color: var(--mesa-muted); margin-top: 12px; }.mesa-responses summary { cursor: pointer; }
.mesa-post.is-expired { opacity: .72; border-left-color: var(--mesa-muted); }
.mesa-docked { width: min(430px, calc(100vw - 24px)); }.mesa-docked .mesa-workspace { flex-direction: column; }.mesa-docked.mesa-has-editor .mesa-collection { display: none; }.mesa-docked .mesa-editor { flex: 1; border-left: 0; }.mesa-docked .mesa-heading h2 span { display: none; }
.mesa-composer, .mesa-confirm { margin: auto; width: min(580px, calc(100vw - 24px)); max-height: 90vh; overflow: auto; border: 1px solid var(--mesa-border); border-radius: 16px; padding: 22px; box-shadow: 0 20px 80px #0007; }
.mesa-composer::backdrop, .mesa-confirm::backdrop { background: #0009; }.mesa-composer .mesa-heading { padding: 0 0 16px; }.mesa-composer .mesa-heading h2 { font-size: 22px; }
.mesa-composer label { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; font-size: 12px; }.mesa-composer textarea { resize: vertical; }.mesa-compose-fields { display: flex; gap: 12px; }.mesa-compose-fields label { flex: 1; min-width: 0; }.mesa-compose-status { font-size: 12px; color: var(--mesa-muted); }.mesa-compose-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 15px; }.mesa-publication-preview { border: 1px solid var(--mesa-border); border-radius: 10px; padding: 14px; margin-top: 14px; overflow-wrap: anywhere; }.mesa-confirm button { margin: 4px 8px 0 0; }
@media (max-width: 620px) {
  .mesa { inset: 8px; width: auto; border-radius: 14px; }.mesa-heading { padding: 16px; }.mesa-heading h2 span { display: none; }.mesa-tabs { padding: 0 12px 10px; gap: 2px; }.mesa-tabs button { padding: 7px 8px; font-size: 12px; }.mesa-toolbar { padding: 12px 14px 0; }.mesa-status { margin: 5px 14px; }.mesa-workspace { flex-direction: column; }.mesa-has-editor .mesa-collection { display: none; }.mesa-editor { flex: 1; border-left: 0; padding: 10px 16px 16px; }.mesa-collection { padding: 10px 14px 14px; }.mesa-post { padding: 15px; }.mesa-footer { padding: 8px 14px; }.mesa-history { order: 4; width: 100%; }.mesa-composer { padding: 16px; }.mesa-compose-fields { flex-direction: column; gap: 0; }
}
