/* Zynapse, carvão acromático; a cor pertence ao componente, nunca ao fundo. */
:root{
  --bg:#121212;--canvas:#0B0B0B;--surface:#1C1C1C;--elevated:#242424;--hover:#2E2E2E;--topbar:#0F0F0F;
  --border:rgba(255,255,255,.12);--border-strong:rgba(255,255,255,.3);
  --text:#F5F5F5;--muted:#A3A3A3;--faint:#8A8A8A;
  --violet:#A855F7;--magenta:#EC4899;--blue:#3B82F6;--teal:#2DD4BF;--green:#22C55E;--amber:#FACC15;--orange:#F97316;--danger:#F43F5E;--cyan:#00E5FF;
  --gradient:linear-gradient(135deg,var(--violet),var(--magenta));
  --ui:"Segoe UI Variable Text","Segoe UI",Inter,system-ui,-apple-system,"Helvetica Neue","Noto Sans",sans-serif;
  --mono:"Cascadia Mono","JetBrains Mono","IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,"DejaVu Sans Mono",monospace;
  --left-w:334px;--right-w:312px;--topbar-h:56px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--text);font:13px/1.45 var(--ui);overflow:hidden;-webkit-font-smoothing:antialiased}
html.is-booting body{overflow:hidden}
#app{height:100%;display:flex;flex-direction:column;padding-bottom:env(safe-area-inset-bottom)}
[hidden]{display:none!important}
button{font:inherit;color:inherit}
h1,h2,h3,p{margin:0}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.skip-link{position:absolute;left:8px;top:-60px;background:var(--surface);padding:8px 12px;border-radius:8px;z-index:100}
.skip-link:focus{top:8px}
.spacer{flex:1}
.muted{color:var(--muted)}
.center{text-align:center}

/* ---------- botões e campos ---------- */
.btn{background:transparent;border:1px solid var(--border-strong);border-radius:10px;padding:7px 16px;cursor:pointer;font-weight:600;font-size:12px;
  letter-spacing:.04em;transition:background .13s,color .13s,border-color .13s;white-space:nowrap}
.btn:hover:not(:disabled){background:var(--text);color:#0B0B0B;border-color:var(--text)}
.btn:disabled{opacity:.4;cursor:default}
.btn.primary{border:none;background:var(--gradient);color:#fff;border-radius:999px;padding:8px 20px}
.btn.primary:hover:not(:disabled){background:var(--gradient);filter:brightness(1.12);color:#fff}
.btn.glow{box-shadow:0 0 26px rgba(236,72,153,.4)}
.btn.quiet{border-color:var(--border);color:var(--muted)}
.btn.quiet:hover:not(:disabled){background:var(--hover);color:var(--text);border-color:var(--border-strong)}
.btn.danger{border-color:rgba(244,63,94,.6);color:var(--danger)}
.btn.danger:hover:not(:disabled){background:var(--danger);border-color:var(--danger);color:#fff}
.btn.block{display:block;width:100%;margin-top:6px}
.icon-btn{background:none;border:none;color:var(--muted);cursor:pointer;width:32px;height:32px;border-radius:8px;font-size:18px;line-height:1}
.icon-btn:hover{background:var(--hover);color:var(--text)}
.field,.global-search,.note-title,.note-summary,.note-content{font:inherit;color:var(--text)}
.field{width:100%;background:var(--topbar);border:1px solid var(--border);border-radius:8px;padding:7px 12px;min-width:0}
.field:hover{border-color:var(--border-strong)}
.field:focus{outline:none;border-color:var(--teal);background:var(--bg)}
select.field{cursor:pointer}
textarea.field{resize:vertical}
::selection{background:var(--violet);color:#fff}
.check{display:inline-flex;align-items:center;gap:7px;cursor:pointer;color:var(--muted);font-size:12px;user-select:none}
.check input{accent-color:var(--violet);width:15px;height:15px}
.idea-check input{accent-color:var(--cyan)}.idea-check{color:var(--cyan)}

/* ---------- barra superior ---------- */
.topbar{display:flex;align-items:center;gap:16px;height:var(--topbar-h);padding:8px 12px 8px 16px;background:var(--topbar);
    border-bottom:1px solid var(--border);flex:none}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-logo{width:32px;height:32px;flex:none;user-select:none}
.brand-text{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.brand-mark{overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
.brand-sub{font-size:10px;letter-spacing:.12em;color:var(--faint);white-space:nowrap}
.segmented{display:flex;gap:2px;padding:2px;background:var(--surface);border:1px solid var(--border);border-radius:10px;
    overflow-x:auto;scrollbar-width:none}
.segment{background:transparent;border:1px solid transparent;border-radius:8px;color:var(--muted);padding:5px 14px;font-size:11px;
    font-weight:700;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.segment:hover{background:var(--hover);color:var(--text)}
.segment.active{background:var(--canvas);color:var(--text);border-color:var(--text)}
.global-search{width:210px;background:var(--canvas);border:1px solid var(--border);border-radius:999px;padding:7px 16px;min-width:0}
.global-search:focus{outline:none;border-color:var(--teal)}

/* ---------- corpo e painéis ---------- */
.body{flex:1;min-height:0;display:flex;position:relative}
.stack{flex:1;min-width:0;position:relative;background:var(--canvas)}
.page{position:absolute;inset:0;display:flex;flex-direction:column;min-height:0;min-width:0}
.panel{flex:none;background:var(--surface);overflow:hidden;transition:width .2s ease,border-color .2s;width:var(--left-w);z-index:20}
.panel-left{border-right:1px solid var(--border)}
.panel-right{width:var(--right-w);border-left:1px solid var(--border)}
.panel.collapsed{width:0;border-color:transparent}
.panel-inner{width:var(--left-w);height:100%;display:flex;flex-direction:column;padding:12px 12px 8px 16px;gap:12px}
.panel-right .panel-inner{width:var(--right-w)}
.panel-header{display:flex;align-items:center;gap:8px}
.panel-title{font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.panel-count,.panel-footer{color:var(--faint);font-size:11px;letter-spacing:.06em}
.panel-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;margin-right:-6px;padding-right:6px}
.edge-handle{width:18px;flex:none;background:var(--surface);border:none;border-right:1px solid var(--border);color:var(--muted);cursor:pointer}
.edge-handle:hover{background:var(--hover);color:var(--text)}
.panel-backdrop{display:none}
.chip-group{display:flex;flex-wrap:wrap;gap:4px}
.chip{background:transparent;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:10px;font-weight:700;
    letter-spacing:.05em;padding:4px 7px;cursor:pointer}
.chip:hover{color:var(--text);border-color:var(--border-strong)}
.chip.active{color:var(--text);border-color:var(--text);background:var(--canvas)}
.empty-hint{color:var(--faint);font-size:12px;line-height:1.5}
.empty-title{font-size:17px;font-weight:700;margin-bottom:6px}

/* biblioteca */
.library-list{list-style:none;margin:0;padding:0}
.library-row{position:relative;display:flex;align-items:center;gap:10px;width:100%;height:46px;background:none;border:none;
    border-radius:8px;padding:0 10px 0 3px;text-align:left;cursor:pointer;color:inherit}
.library-row:hover{background:var(--elevated)}
.library-row.selected{background:var(--hover)}
.lib-marker{width:3px;align-self:stretch;margin:8px 0;opacity:.68;flex:none}
.library-row:hover .lib-marker,.library-row.selected .lib-marker{opacity:1}
.lib-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.lib-title{font-size:13px;color:#DCE5F5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.library-row.selected .lib-title{font-weight:600;color:var(--text)}
.lib-sub{font-size:11px;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lib-idea{width:9px;height:9px;border:1.4px solid var(--cyan);border-radius:50%;flex:none}
.lib-fav{width:6px;height:6px;background:var(--teal);flex:none}

/* inspetor */
.inspector-body{display:flex;flex-direction:column;gap:20px;padding-bottom:16px}
.inspector-header{display:flex;flex-direction:column;gap:6px}
.idea-badge{align-self:flex-start;color:var(--cyan);border:1px solid var(--cyan);border-radius:999px;font-size:9px;
    font-weight:700;letter-spacing:.14em;padding:2px 8px}
.note-name{font-size:20px;font-weight:700;letter-spacing:-.2px;overflow-wrap:anywhere}
.note-name.idea{color:var(--cyan)}
.note-meta{color:var(--muted);font-size:12px;overflow-wrap:anywhere}
.note-stamp{color:var(--faint);font-size:11px}
.section-divider{border:none;border-top:1px solid var(--border);margin:0;width:100%}
.section-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.section-title{font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.section-count{color:var(--teal);font-size:10px;font-weight:700}
.section-body{display:flex;flex-direction:column;gap:2px}
.row-item{display:flex;align-items:center;border-radius:8px}
.row-item:hover,.row-item.selected,.row-item:focus-within{background:var(--elevated)}
.row-item.selected{background:var(--hover)}
.row-main{flex:1;min-width:0;display:flex;align-items:stretch;gap:8px;background:none;border:none;text-align:left;padding:6px 8px;cursor:pointer}
.row-marker{width:2px;border-radius:1px;flex:none}
.row-text{display:flex;flex-direction:column;gap:1px;min-width:0}
.row-title{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row-sub{font-size:11px;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row-actions{display:none;gap:2px;padding-right:4px;flex:none}
.row-item:hover .row-actions,.row-item.selected .row-actions,.row-item:focus-within .row-actions{display:flex}
.row-action{background:none;border:none;color:var(--muted);font-size:11px;padding:4px 6px;border-radius:6px;cursor:pointer}
.row-action:hover{background:var(--hover);color:var(--text)}
@media (hover:none){.row-actions{display:flex}.row-action.more{opacity:1}}

/* ---------- grafo ---------- */
.page-graph{overflow:hidden}
.graph-host{position:absolute;inset:0}
.graph-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline-offset:-2px}
.graph-canvas.panning{cursor:grabbing}.graph-canvas.grabbing-node{cursor:grabbing}
.graph-tooltip{position:absolute;max-width:320px;background:rgba(12,12,12,.96);border:1px solid var(--border-strong);
    border-radius:8px;padding:7px 10px;font-size:12px;white-space:pre-wrap;pointer-events:none;z-index:5}
.canvas-controls{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:4px;max-width:calc(100% - 32px);
    overflow-x:auto;padding:4px 8px;background:rgba(28,28,28,.92);border:1px solid var(--border);border-radius:12px;
    backdrop-filter:blur(8px);z-index:6;scrollbar-width:none}
.ctl-btn{background:none;border:none;color:var(--muted);cursor:pointer;padding:5px 9px;border-radius:7px;font-size:12px;white-space:nowrap}
.ctl-btn:hover{background:var(--hover);color:var(--text)}
.ctl-btn.has-menu::after{content:" ▾";font-size:9px}
.ctl-sep{width:1px;height:16px;background:var(--border);margin:0 4px;flex:none}
.zoom-readout{font:11px var(--mono);color:var(--muted);min-width:42px;text-align:center}
.graph-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    text-align:center;padding:24px;pointer-events:none}
.graph-empty>*{pointer-events:auto}
.graph-empty .empty-hint{max-width:420px;margin-bottom:14px}
.empty-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}

/* ---------- editor ---------- */
.page-editor{overflow:auto;background:var(--bg)}
.editor-page{flex:1;display:flex;justify-content:center;min-height:0}
.editor-column{width:100%;max-width:760px;padding:24px;display:flex;flex-direction:column;gap:16px;min-height:0}
.editor-page.empty .editor-column{display:none}
.editor-empty{display:none;margin:auto;text-align:center;flex-direction:column;align-items:center;gap:8px;padding:24px}
.editor-page.empty .editor-empty{display:flex}
.note-title{background:none;border:none;border-bottom:2px solid var(--border);padding:8px 2px;font-size:22px;font-weight:700;width:100%}
.note-title:focus{outline:none;border-bottom-color:var(--teal)}
.editor-meta{display:flex;gap:12px 20px;flex-wrap:wrap;align-items:center}
.editor-meta-fields{display:flex;gap:12px;flex:1;min-width:260px}
.editor-meta-fields .field:first-child{flex:1}.editor-meta-fields .field:nth-of-type(2){flex:2}
.editor-checks{display:flex;gap:14px;flex-wrap:wrap}
.note-summary{background:none;border:none;color:var(--muted);padding:2px;width:100%;font-size:13px}
.note-summary:focus{outline:none;color:var(--text)}
.note-content{flex:1;min-height:260px;background:none;border:none;resize:none;font-size:15px;line-height:1.65;padding:0;width:100%}
.note-content:focus{outline:none}
.editor-footer{display:flex;gap:12px;color:var(--faint);font-size:11px}

/* ---------- quadros (tarefas, temas) ---------- */
.board-page{flex:1;overflow-y:auto;display:flex;justify-content:center;background:var(--bg);min-height:0}
.board-column{width:100%;max-width:860px;padding:20px 24px 12px;display:flex;flex-direction:column;gap:14px;min-height:min-content}
.board-head{display:flex;align-items:center;gap:16px}
.board-head-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.board-title-row{display:flex;gap:10px;align-items:center}
.board-title{font-size:17px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.board-subtitle,.row-meta{color:var(--faint);font-size:11px}
.late-badge{color:var(--danger);border:1px solid rgba(244,63,94,.55);border-radius:999px;font-size:9px;font-weight:700;
    letter-spacing:.12em;padding:2px 8px}
.progress-ring{width:64px;height:64px;flex:none}
.pr-track{fill:none;stroke:rgba(255,255,255,.16);stroke-width:4}
.pr-arc{fill:none;stroke-width:4;stroke-linecap:round;transition:stroke-dashoffset .3s ease,opacity .2s}
.pr-text{font:11px var(--mono);fill:var(--muted)}.pr-text.on{fill:var(--text)}
.dot-trail{display:flex;gap:5px;flex-wrap:wrap;min-height:13px}
.trail-dot{width:13px;height:13px;border-radius:50%;border:1.6px solid rgba(255,255,255,.28)}
.trail-dot.doing{border-color:var(--amber);background:radial-gradient(circle,var(--amber) 0 30%,transparent 34%)}
.trail-dot.done{background:var(--green);border-color:var(--green)}
.trail-more{font:11px var(--mono);color:var(--muted)}
.segmented-bar{position:relative;height:8px;border-radius:4px;background:rgba(255,255,255,.09);overflow:hidden}
.sb-fill{position:absolute;left:0;top:0;bottom:0;border-radius:4px;transition:width .3s ease}
.sb-fill.doing{background:var(--amber)}.sb-fill.done{background:var(--green)}
.status-dot{width:24px;height:24px;flex:none;padding:0;background:none;border:none;border-radius:50%;cursor:pointer}
.status-dot svg{width:24px;height:24px;display:block}
.sd-track{fill:none;stroke:rgba(255,255,255,.23);stroke-width:2}
.status-dot:hover .sd-track{stroke:rgba(255,255,255,.38)}
.sd-arc{fill:none;stroke-width:2.4;stroke-linecap:round;transition:stroke-dashoffset .17s ease,opacity .17s}
.sd-core{transition:r .17s ease,opacity .17s}
.focus-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:12px 16px;display:flex;flex-direction:column;gap:8px}
.focus-head{display:flex;gap:8px;align-items:center}
.focus-tag{color:var(--violet);font-size:10px;font-weight:700;letter-spacing:.2em}
.focus-chip{border:1px solid var(--border);border-radius:999px;font-size:9px;font-weight:700;letter-spacing:.1em;padding:2px 9px}
.focus-chip:empty{display:none}
.focus-body{display:flex;gap:12px;align-items:center}
.focus-text{min-width:0;display:flex;flex-direction:column;gap:2px}
.focus-title{font-size:17px;font-weight:600;overflow-wrap:anywhere}
.focus-actions{display:flex;gap:8px;flex-wrap:wrap}
.capture-row{display:flex;gap:8px;flex-wrap:wrap}
.capture-row .board-input{flex:1;min-width:180px}
.due-select{width:140px}.due-date{width:150px}.priority-select{width:104px}.area-input{width:170px}
.board-scroll{flex:1;min-height:80px}
.board-list{display:flex;flex-direction:column;gap:2px}
.group-header{font-size:9px;font-weight:700;letter-spacing:.12em;padding:12px 2px 4px}
.board-row{position:relative;display:flex;align-items:center;gap:12px;padding:8px 14px 8px 12px;border-radius:10px}
.board-row::after{content:"";position:absolute;right:3px;top:10px;bottom:10px;width:2.5px;border-radius:1px;
    background:var(--accent,transparent);opacity:.85}
.board-row:hover{background:var(--surface)}
.board-row-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.board-row-title{font-size:14px;overflow-wrap:anywhere}
.board-row.done .board-row-title{text-decoration:line-through;color:var(--faint)}
.due-chip{border:1px solid;border-radius:999px;font-size:10px;font-weight:600;padding:3px 9px;white-space:nowrap}
.board-footer{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:4px}
.board-footer .panel-footer{flex:1}

/* ---------- reuniões ---------- */
.meetings-page{flex:1;display:flex;flex-direction:column;min-height:0;min-width:0}
.meetings-head{display:flex;align-items:center;gap:12px;padding:8px 16px;background:var(--bg);border-bottom:1px solid var(--border);flex-wrap:wrap}
.meetings-head-text{flex:1;display:flex;flex-direction:column;gap:1px;min-width:160px}
.meeting-search{width:240px}
.meetings-body{flex:1;display:flex;min-height:0;position:relative}
.meeting-board{flex:1;position:relative;min-width:0;background:var(--canvas)}
.meeting-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:default}
.meeting-canvas.panning{cursor:grabbing}
.inline-capture{position:absolute;z-index:4;box-shadow:0 8px 28px rgba(0,0,0,.6);border-color:var(--teal)}
.notebook-panel{width:384px;flex:none;background:var(--surface);border-left:1px solid var(--border);padding:12px 12px 8px 16px;
    display:flex;flex-direction:column;gap:12px;min-height:0}
.notebook-head{display:flex;align-items:flex-start;gap:4px}
.notebook-head-text{flex:1;min-width:0}
.notebook-title{font-size:15px;font-weight:700;overflow-wrap:anywhere}
.capture-legend{display:flex;gap:18px;color:var(--faint);font:11px var(--mono)}
.notebook-list{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:2px}
.notebook-item{display:flex;gap:8px;align-items:flex-start;padding:5px 8px;border-radius:8px}
.notebook-item:hover{background:var(--elevated)}
.item-mark{width:14px;text-align:center;font-weight:700;font-size:13px;flex:none}
.item-body{flex:1;min-width:0;display:flex;flex-direction:column}
.item-text{font-size:13px;overflow-wrap:anywhere;white-space:pre-wrap}
.notebook-item.resolved .item-text{text-decoration:line-through;color:var(--faint)}

/* ---------- status ---------- */
.statusbar{flex:none;display:flex;align-items:center;gap:6px;height:28px;padding:0 10px;background:var(--topbar);
    border-top:1px solid var(--border);font-size:11px;color:var(--muted)}
.status-text{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.collapse-handle{background:none;border:none;color:var(--faint);cursor:pointer;font-size:11px;padding:3px 8px;border-radius:6px}
.collapse-handle:hover{color:var(--text);background:var(--hover)}

/* ---------- menu e diálogos ---------- */
.menu{position:fixed;z-index:1000;min-width:210px;max-width:min(340px,94vw);background:var(--surface);
    border:1px solid var(--border-strong);border-radius:10px;padding:4px;box-shadow:0 16px 48px rgba(0,0,0,.6);outline:none;
    max-height:calc(100vh - 16px);overflow-y:auto}
.menu-item{display:flex;align-items:center;gap:8px;width:100%;background:none;border:none;border-radius:7px;padding:7px 10px;
    text-align:left;cursor:pointer;font-size:13px}
.menu-item:hover:not(:disabled),.menu-item:focus-visible,.menu-item.open{background:var(--hover);outline:none}
.menu-item.danger{color:var(--danger)}
.menu-item:disabled{opacity:.4;cursor:default}
.menu-check{width:14px;color:var(--teal);flex:none}
.menu-label{flex:1}
.menu-shortcut{color:var(--faint);font-size:11px}
.menu-arrow{color:var(--faint)}
.menu-sep{height:1px;background:var(--border);margin:4px 6px}
dialog.modal{background:var(--surface);color:var(--text);border:1px solid var(--border-strong);border-radius:14px;padding:0;
    width:min(var(--modal-width,480px),calc(100vw - 24px));max-height:calc(100vh - 32px);box-shadow:0 24px 80px rgba(0,0,0,.7)}
dialog.modal::backdrop{background:rgba(0,0,0,.62);backdrop-filter:blur(2px)}
dialog.modal[open]{display:flex;flex-direction:column}
.modal-head{padding:18px 24px 0}
.modal-title{font-size:15px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.modal-body{padding:14px 24px;display:flex;flex-direction:column;gap:12px;overflow-y:auto;min-height:0}
.modal-text{font-size:13px;line-height:1.5}
.modal-hint{padding:0 24px;color:var(--faint);font-size:11px}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;padding:12px 24px 18px;flex-wrap:wrap}
.form-row{display:flex;flex-direction:column;gap:5px}
.form-label{font-size:11px;color:var(--muted);letter-spacing:.04em}
.form-error{color:var(--danger);font-size:12px}
.form-checks{display:flex;gap:18px;flex-wrap:wrap}
.criteria-row{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.suggestion-list{display:flex;flex-direction:column;gap:8px;max-height:46vh;overflow-y:auto}
.suggestion-row{display:flex;align-items:center;gap:12px;padding:8px 12px;border:1px solid var(--border);border-radius:10px}
.suggestion-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.item-title{font-size:13px;overflow-wrap:anywhere}.item-meta{font-size:11px;color:var(--faint)}
.suggestion-type{width:176px;flex:none}
.strength{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;flex:none}
.strength-forte{color:var(--green)}.strength-media{color:var(--amber)}.strength-fraca{color:var(--faint)}

.install-btn{font-size:11px;padding:6px 12px}
.install-steps{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px;font-size:13px;line-height:1.5}

/* ---------- telas estreitas ---------- */
@media (max-width:900px){
  .topbar{flex-wrap:wrap;height:auto;gap:8px 10px;padding:8px 10px}
  .brand-sub,.install-btn{display:none}
  .segmented{order:5;flex:1 1 100%}
  .segment{flex:1;padding:6px 8px;letter-spacing:.06em}
  .global-search{width:130px;flex:1}
  .spacer{display:none}
  .brand{flex:1}
  .panel{position:absolute;top:0;bottom:0;z-index:30;box-shadow:0 0 40px rgba(0,0,0,.6);width:min(var(--left-w),88vw)}
  .panel-left{left:0}.panel-right{right:0;width:min(var(--right-w),88vw)}
  .panel.collapsed{width:0;box-shadow:none}
  .panel-inner,.panel-right .panel-inner{width:min(var(--left-w),88vw)}
  .panel-backdrop{display:block;position:absolute;inset:0;background:rgba(0,0,0,.5);z-index:25}
  .editor-column{padding:16px}
  .board-column{padding:16px 14px 10px}
  .meetings-body{flex-direction:column}
  .notebook-panel{width:100%;max-height:48%;border-left:none;border-top:1px solid var(--border)}
  .suggestion-row{flex-wrap:wrap}.suggestion-type{width:100%}
  .canvas-controls{left:8px;bottom:8px;max-width:calc(100% - 16px)}
}
@media (max-width:560px){.global-search{order:6;flex:1 1 100%;width:auto}.brand-mark{letter-spacing:.1em;
    font-size:11px}.brand-text{min-width:0}.btn.glow{padding:8px 14px}.board-title{font-size:15px}.due-select,.due-date,.priority-select,.area-input{flex:1;
    width:auto}}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01s!important;animation-duration:.01s!important}}

/* Artigos e Projetos: linha clicável, janela de detalhes */
.board-row-open{background:none;border:0;padding:0;text-align:left;color:inherit;font:inherit;cursor:pointer}
.board-row-open:focus-visible{outline:2px solid var(--text);outline-offset:3px;border-radius:6px}
.row-snippet{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row-badge{flex:none;font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:2px 8px}
.detail-modal{--modal-width:720px}
.detail-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.detail-hint{padding:0}
@media (max-width:640px){.detail-grid{grid-template-columns:1fr}.detail-grid>*{grid-column:auto!important}}
.segment{padding-left:9px;padding-right:9px;letter-spacing:.09em}
.segmented{flex:none;max-width:100%}
.brand-text{min-width:0}

/* Sobre: pasta sobre a mesa */
dialog.about{background:transparent;border:0;padding:0;margin:auto;overflow:visible;color:var(--text);max-height:none;
  width:min(780px,calc(100vw - 28px))}
dialog.about::backdrop{background:rgba(6,6,9,.7);backdrop-filter:blur(7px)}
.about-folder{position:relative;isolation:isolate;margin-top:34px;display:flex;flex-direction:column;max-height:calc(100vh - 92px);
  border-radius:4px 16px 16px 16px;background:rgba(26,26,29,.7);backdrop-filter:blur(18px) saturate(1.25);
  border:1px solid rgba(255,255,255,.16);box-shadow:0 34px 90px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.08)}
.about-folder::before,.about-folder::after{content:"";position:absolute;z-index:-1;border-radius:12px;border:1px solid rgba(255,255,255,.1);
  background:rgba(236,236,236,.07)}
.about-folder::before{inset:9px 5px -8px 11px;transform:rotate(-1.1deg)}
.about-folder::after{inset:14px 12px -13px 4px;transform:rotate(.9deg);background:rgba(236,236,236,.045)}
.about-tabs{position:absolute;z-index:5;left:-1px;top:-29px;display:flex;gap:3px;align-items:flex-end}
.about-tab{position:relative;height:29px;padding:0 20px;display:flex;align-items:center;gap:9px;border-radius:12px 12px 0 0;cursor:pointer;
  background:rgba(26,26,29,.7);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.16);border-bottom:0;
  font:700 10px/1 var(--mono,ui-monospace,Menlo,Consolas,monospace);letter-spacing:.28em;text-transform:uppercase;color:var(--muted);
  transition:transform .18s ease,color .18s,background .18s}
.about-tab:not(.is-active){height:26px;color:#9A9AA2}
.about-tab:not(.is-active):hover{transform:translateY(-2px);color:var(--text)}
.about-tab.is-active{color:var(--text)}
.about-tab:focus-visible{outline:2px solid #FACC15;outline-offset:2px}
.about-update{letter-spacing:.2em;background:linear-gradient(180deg,#FACC15,#E3B912);border-color:rgba(250,204,21,.8);color:#1A1500;backdrop-filter:none;
  animation:about-update-in .4s cubic-bezier(.2,.8,.3,1.2) both}
.about-update:not(.is-active){color:#1A1500}
.about-update:not(.is-active):hover{color:#000}
.about-update i{width:7px;height:7px;border-radius:50%;background:#1A1500;animation:about-update-pulse 1.6s ease-in-out infinite}
.about-update.is-active i{animation:none}
@keyframes about-update-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes about-update-pulse{50%{opacity:.25}}
.about-folder{transition:border-color .25s ease}
.about-folder[data-view=update]{border-color:rgba(250,204,21,.55)}
.about-pages{display:grid;grid-template-rows:minmax(0,1fr);min-height:0;flex:1 1 auto}
.about-panel{grid-area:1/1;display:flex;flex-direction:column;min-height:0}
.about-panel.is-off{display:none}
.about-panel.is-in{animation:about-panel-in .26s cubic-bezier(.2,.7,.2,1) both}
@keyframes about-panel-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.update-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.update-list li{position:relative;padding-left:22px;font-size:14px;line-height:1.6;color:#E4E4E4}
.update-list li::before{content:"";position:absolute;left:2px;top:.62em;width:8px;height:8px;border-radius:50%;background:#FACC15}
.update-list .update-loading{color:var(--faint)}.update-list .update-loading::before{background:var(--faint)}
.update-note{margin:20px 0 6px;font-size:12px;color:var(--faint)}
.btn.update-go{background:#FACC15;border-color:#FACC15;color:#1A1500}
.btn.update-go:hover:not(:disabled){background:#FFD93D}
.about-card{position:absolute;z-index:-2;top:-62px;right:84px;width:150px;height:96px;padding:10px 12px;border-radius:5px;transform:rotate(5deg);
  background:#DAD5C8;color:#3B3A36;box-shadow:0 6px 18px rgba(0,0,0,.45);display:flex;flex-direction:column;gap:9px}
.about-card span{font:700 11px/1 var(--mono,ui-monospace,Menlo,Consolas,monospace);color:#B5483A;letter-spacing:.06em}
.about-card i{display:block;height:1px;background:rgba(70,90,150,.45)}.about-card i.short{width:60%}
.about-close{position:absolute;z-index:4;top:12px;right:14px;width:30px;height:30px;border-radius:50%;border:1px solid var(--border);
  background:rgba(0,0,0,.25);color:var(--muted);cursor:pointer;font-size:12px}
.about-close:hover{color:var(--text);border-color:var(--border-strong)}
.about-scroll{flex:1 1 auto;overflow-y:auto;min-height:0;padding:26px 32px 6px;scrollbar-width:thin}
.about-head{display:flex;align-items:center;gap:14px}
.about-logo{width:40px;height:40px;object-fit:contain}
.about-title{margin:0;font-size:19px;font-weight:700;letter-spacing:.22em;text-transform:uppercase}
.about-sub{margin:3px 0 0;color:var(--faint);font-size:11px;letter-spacing:.14em}
.about-sheet{position:relative;margin:26px 0 8px;padding:10px;border-radius:10px;background:rgba(11,11,11,.55);
  border:1px solid rgba(255,255,255,.12);transform:rotate(-.5deg);box-shadow:0 10px 26px rgba(0,0,0,.35)}
.about-art{display:block;width:100%;height:auto}
.about-clip{position:absolute;left:28px;top:-24px;width:30px;height:54px;transform:rotate(-7deg);filter:drop-shadow(0 2px 2px rgba(0,0,0,.55))}
.a-label{font:600 7.5px var(--mono,ui-monospace,Menlo,Consolas,monospace);fill:rgba(255,255,255,.55)}
.a-edge{animation:a-fade .7s ease both;animation-delay:calc(var(--i) * 14ms)}
.a-node{animation:a-pop .55s cubic-bezier(.2,.8,.3,1.2) both;animation-delay:calc(var(--i) * 16ms + 120ms);transform-box:fill-box;transform-origin:center}
@keyframes a-fade{from{opacity:0}to{opacity:1}}
@keyframes a-pop{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}
.about-section h2{margin:26px 0 10px;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.about-section p{margin:0 0 12px;max-width:66ch;font-size:14px;line-height:1.72;color:#E4E4E4}
.about-section em{color:#fff}
.about-reference p{font-size:11.5px;line-height:1.55;color:var(--faint)}
.about-actions{display:flex;justify-content:flex-end;gap:8px;padding:14px 32px 20px;border-top:1px solid var(--border);margin-top:10px}
.about-pen{position:absolute;z-index:3;left:-46px;bottom:22px;width:230px;height:auto;transform:rotate(13deg);pointer-events:none;
  filter:drop-shadow(0 9px 10px rgba(0,0,0,.55))}
@media (max-width:640px){
  .about-scroll{padding:22px 18px 4px}.about-actions{padding:12px 18px 16px}
  .about-card{display:none}.about-tab{padding:0 14px;letter-spacing:.16em}.about-update{letter-spacing:.12em}.about-pen{width:150px;left:-18px;bottom:14px}
  .about-section p{font-size:13.5px}
}
@media (prefers-reduced-motion:reduce){.a-edge,.a-node,.about-update,.about-update i,.about-panel.is-in{animation:none}}