.attachment-tools{display:flex;align-items:center;gap:10px;margin:10px 0 8px}.attachment-tools button{height:28px;padding:0 9px;font-size:12px}.attachment-tools .muted{font-size:11px}.attachment-drop-active{outline:2px dashed var(--q2-accent);outline-offset:-5px;background:var(--q2-surface-hover)}.draft-attachments,.note-attachments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.draft-attachments:empty{display:none}.draft-attachment{position:relative;min-width:0}.attachment-preview{display:flex;flex-direction:column;width:100%;height:auto;padding:0;overflow:hidden;border:1px solid var(--q2-border);border-radius:var(--q2-radius-control);background:var(--q2-surface);text-align:left}.attachment-preview img{display:block;width:100%;height:82px;object-fit:contain;background:var(--q2-bg)}.attachment-preview span{width:100%;padding:5px 6px;font-size:10px;line-height:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachment-remove{position:absolute;right:4px;top:4px;display:grid;place-items:center;width:22px;height:22px;padding:0;border-radius:50%;background:var(--q2-surface);font-size:17px;line-height:1}.draft-attachment.failed .attachment-preview{border-color:var(--q2-danger)}.attachment-error{display:block;font-size:10px;color:var(--q2-danger);padding-top:4px;overflow-wrap:anywhere}.note-attachments{margin:10px 0}#attachment-dialog{width:min(1000px,94vw);max-height:92vh;padding:16px}#attachment-viewer-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}#attachment-viewer-image{display:block;max-width:100%;max-height:75vh;object-fit:contain;margin:0 auto}.attachment-count{font-size:11px;color:var(--q2-text-muted)}
@media(max-width:620px){body:not(.home-mode) .topbar{height:auto;min-height:60px;flex-wrap:wrap;padding:10px 12px}body:not(.home-mode) #editor-context{order:3;flex:0 0 100%;max-width:100%;margin-top:4px}#editor-context label{flex:1;min-width:0}#editor-context select{width:100%;max-width:100%!important}.transport{flex-wrap:wrap}.transport-right{margin-left:0}.attachment-preview img{height:76px}}

.note-author{display:inline-flex;align-items:center;gap:6px;margin-left:auto;min-width:0;max-width:52%;font-size:11px;color:var(--q2-text-secondary)}.note-author-avatar{display:grid;place-items:center;flex:none;width:20px;height:20px;border-radius:50%;background:var(--q2-surface-alt);color:var(--q2-text-secondary);font-size:10px}.note-author-id{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.note-time{flex:none}.note-previews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}.note-previews .attachment-preview{min-width:0}.note-frame-visual{height:82px;width:100%;display:grid;place-items:center;background:var(--q2-bg);overflow:hidden}.note-frame-fit{position:relative;max-width:100%;overflow:hidden}.note-frame-preview .note-frame-fit img{display:block;width:100%;height:100%;object-fit:contain}.note-frame-drawing{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.preview-unavailable{color:var(--q2-text-muted);font-size:10px}

.note-previews{grid-template-columns:repeat(auto-fill,72px);gap:6px;margin:8px 0}.note-previews .attachment-preview:not(.note-frame-preview) img{height:52px}.note-previews .note-frame-visual{height:52px}.note-previews .attachment-preview span{font-size:9px;line-height:14px;padding:3px 4px}.note-actions .note-reply-entry{margin-right:auto;padding-left:0}.note-actions .note-resolve-control,.note-resolve-control{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:26px;padding:0}.note-actions .note-resolve-control.is-resolved,.note-resolve-control.is-resolved{color:var(--q2-success)}.note-resolve-control svg{width:18px;height:18px}.note-row.resolved{opacity:1}.reply-item{display:grid;gap:4px}.reply-item .note-author{margin-left:0;max-width:100%}.reply-form{display:grid;gap:8px}.reply-form textarea{width:100%;min-height:56px;resize:vertical;font-size:12px}.reply-buttons{display:flex;justify-content:flex-end;gap:6px}.reply-buttons button{height:28px;padding:0 10px;font-size:11px}

.frame-inputs #pin-start,.frame-inputs #pin-end{display:grid;place-items:center;width:26px;height:26px;padding:4px;border:1px solid transparent;background:transparent;flex:none}.frame-inputs button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.frame-inputs button[aria-pressed=true]{border-color:var(--q2-accent);color:var(--q2-accent);background:var(--q2-accent-soft)}.frame-inputs label{gap:4px}.frame-inputs input{width:62px}.note-actions button:disabled{opacity:.38;cursor:not-allowed}
.timeline-mark{padding:0;overflow:visible;min-width:24px;touch-action:none}.timeline-mark.point{width:20px!important;height:20px;top:6px;transform:translateX(-10px);border:0;border-radius:0;background:transparent}.timeline-mark.point:hover,.timeline-mark.point.selected{background:transparent}.timeline-mark-body{display:block;width:100%;height:20px;padding:0 9px;border:0;border-radius:inherit;background:transparent;color:inherit;text-align:left;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:grab;touch-action:none}.timeline-resize-handle{position:absolute;top:0;width:8px;height:20px;padding:0;border:0;border-radius:2px;background:transparent;cursor:ew-resize;touch-action:none}.timeline-resize-handle.start{left:0}.timeline-resize-handle.end{right:0}.timeline-resize-handle:after{content:'';position:absolute;left:3px;top:4px;bottom:4px;width:2px;border-radius:1px;background:var(--mark-color);opacity:.65}.timeline-resize-handle:hover:after,.timeline-resize-handle:focus-visible:after{opacity:1}.timeline-mark.locked .timeline-mark-body{cursor:pointer}.timeline-mark.point .timeline-mark-body{padding:0}
.timeline-mark.point .timeline-resize-handle{display:none}.timeline-mark.point .timeline-mark-body{position:relative;overflow:visible}.timeline-mark.point .timeline-mark-body:after{content:"";position:absolute;left:4px;top:4px;width:12px;height:12px;border-radius:1px;background:var(--mark-color);transform:rotate(45deg);pointer-events:none}.timeline-mark.point .timeline-mark-body:hover,.timeline-mark.point .timeline-mark-body:active{background:transparent}.timeline-mark.point:hover .timeline-mark-body:after,.timeline-mark.point.selected .timeline-mark-body:after{box-shadow:0 0 0 2px color-mix(in srgb,var(--mark-color) 24%,transparent)}