:root{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-tertiary: #0f0f1a;--text-primary: #eaeaea;--text-secondary: #a0a0a0;--accent: #4ecca3;--accent-dim: #3ba882;--warning: #f59e0b;--error: #ef4444;--success: #22c55e;--border: #2a2a4a;--paste-highlight: #f59e0b33;--delete-highlight: #ef444433;--sidebar-width-expanded: 280px;--sidebar-width-collapsed: 48px;--sidebar-transition: .3s ease}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:var(--bg-primary);color:var(--text-primary);min-height:100vh}.app-container{display:flex;height:100vh;overflow:hidden}.main-content{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.sidebar{width:var(--sidebar-width-expanded);height:100vh;background:var(--bg-secondary);border-right:1px solid var(--border);display:flex;flex-direction:column;transition:width var(--sidebar-transition);overflow:hidden;flex-shrink:0}.sidebar.collapsed{width:var(--sidebar-width-collapsed)}.sidebar.collapsed .sidebar-content,.sidebar.collapsed .sidebar-footer,.sidebar.collapsed .sidebar-title{opacity:0;visibility:hidden;pointer-events:none}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;border-bottom:1px solid var(--border);min-height:64px}.sidebar-title{font-size:1rem;font-weight:600;color:var(--text-primary);transition:opacity var(--sidebar-transition);white-space:nowrap;overflow:hidden;text-transform:uppercase;letter-spacing:.08em}.sidebar-header-actions{display:flex;align-items:center;gap:.25rem;flex-shrink:0}.sidebar-icon-btn,.sidebar-toggle-btn{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:color .2s,background .2s;flex-shrink:0}.sidebar-icon-btn:hover,.sidebar-toggle-btn:hover{color:var(--accent);background:#4ecca31a}.sidebar.collapsed .sidebar-header{justify-content:center;padding:1rem .5rem}.sidebar.collapsed .sidebar-icon-btn,.sidebar.collapsed .sidebar-title{display:none}.sidebar-content{flex:1;overflow-y:auto;transition:opacity var(--sidebar-transition)}.sidebar-footer{padding:1rem;border-top:1px solid var(--border);transition:opacity var(--sidebar-transition)}#btn-change-vault{text-transform:uppercase;letter-spacing:.06em}.vault-setup{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem;text-align:center;height:100%}.vault-setup-icon{margin-bottom:1rem;color:var(--text-secondary)}.vault-setup-text{color:var(--text-secondary);font-size:.875rem;margin-bottom:1rem}.vault-setup-hint{color:var(--text-secondary);font-size:.75rem;margin-top:.75rem;opacity:.7}.btn-primary{padding:.75rem 1.5rem;background:var(--accent);border:none;color:var(--bg-primary);border-radius:6px;cursor:pointer;font-size:.875rem;font-weight:500;transition:background .2s}.btn-primary:hover{background:var(--accent-dim)}.btn-secondary{padding:.5rem 1rem;background:transparent;border:1px solid var(--border);color:var(--text-secondary);border-radius:4px;cursor:pointer;font-size:.875rem;transition:all .2s;width:100%}.btn-secondary:hover{border-color:var(--accent);color:var(--text-primary)}.icon-btn{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:.25rem;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:color .2s}.icon-btn:hover{color:var(--accent)}.file-list-container{display:flex;flex-direction:column;height:100%}.file-list{list-style:none;padding:.5rem;overflow-y:auto;flex:1}.file-list-empty{padding:1.5rem 1rem;text-align:center;color:var(--text-secondary)}.file-list-empty p{margin-bottom:.5rem}.file-list-empty .hint{font-size:.75rem;opacity:.7}.file-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:6px;cursor:pointer;transition:background .2s}.file-item:hover{background:#4ecca31a}.file-item.active{background:#4ecca333;border-left:3px solid var(--accent);margin-left:-3px}.file-icon{color:var(--text-secondary);flex-shrink:0}.file-info{flex:1;min-width:0}.file-title{display:block;font-size:.875rem;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-date{display:block;font-size:.75rem;color:var(--text-secondary);margin-top:.25rem}.file-delete-btn{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:.35rem;border-radius:4px;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s,color .2s,background .2s;flex-shrink:0}.file-item:hover .file-delete-btn{opacity:1}.file-delete-btn:hover{color:var(--error);background:#ef44441a}.sidebar-loading,.sidebar-error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem;text-align:center;height:100%;gap:1rem}.sidebar-error{color:var(--error)}.spinner{width:24px;height:24px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.hidden{display:none!important}.header{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background:var(--bg-secondary);border-bottom:1px solid var(--border)}.header-left{display:flex;align-items:center;gap:1rem;flex:1;min-width:0}.header-right{display:flex;align-items:center;justify-content:flex-end;gap:1rem;flex:1;min-width:0}.logo{font-size:1.5rem;font-weight:600;color:var(--accent)}.nav{display:flex;gap:.5rem}.nav-btn{padding:.5rem 1.5rem;background:transparent;border:1px solid var(--border);color:var(--text-secondary);border-radius:4px;cursor:pointer;transition:all .2s;text-transform:uppercase;letter-spacing:.08em}.nav-btn:hover{border-color:var(--accent);color:var(--text-primary)}.nav-btn.active{background:var(--accent);border-color:var(--accent);color:var(--bg-primary)}.status-indicator{display:flex;flex-direction:row-reverse;align-items:center;gap:.6rem;font-size:.8rem;color:var(--text-secondary);position:relative;letter-spacing:.15em;font-weight:300;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif}.status-indicator:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--text-secondary);flex-shrink:0;display:none}.status-indicator.preserving:before{display:block}.status-indicator.preserving{color:var(--accent);animation:text-pulse 3s ease-in-out infinite}.status-indicator.preserving:before{background:var(--accent);box-shadow:0 0 6px var(--accent);animation:halo-pulse 3s ease-in-out infinite}@keyframes halo-pulse{0%,to{box-shadow:0 0 4px #4ecca366,0 0 10px #4ecca333;opacity:.7}50%{box-shadow:0 0 10px #4ecca3cc,0 0 20px #4ecca366,0 0 32px #4ecca326;opacity:1}}@keyframes text-pulse{0%,to{opacity:.6}50%{opacity:1}}.main{height:calc(100vh - 64px);overflow:hidden}.view{display:none;height:100%;flex-direction:column}.view.active{display:flex}.editor-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;background:var(--bg-tertiary);border-bottom:1px solid var(--border)}.doc-title-input{background:transparent;border:none;color:var(--text-primary);font-size:1.125rem;font-weight:500;outline:none;flex:1;max-width:400px}.doc-title-input::placeholder{color:var(--text-secondary);opacity:.3;text-transform:uppercase;letter-spacing:.15em;font-weight:300}.cm-placeholder{color:var(--text-secondary)!important;opacity:.25;letter-spacing:.15em;font-weight:300}.editor-container{display:flex;flex:1;overflow:hidden}#editor{flex:1;overflow:hidden;background:var(--bg-primary)}#editor .cm-editor{height:100%}#editor .cm-editor.cm-focused{outline:none}.cm-heading-1{font-size:1.8em;font-weight:600;line-height:1.3}.cm-heading-2{font-size:1.4em;font-weight:600;line-height:1.3}.cm-heading-3{font-size:1.2em;font-weight:600;line-height:1.3}.cm-heading-4,.cm-heading-5,.cm-heading-6{font-size:1.05em;font-weight:600;line-height:1.4}.cm-line.cm-list-bullet:before{content:"• ";color:var(--accent);font-weight:700}.cm-line.cm-list-ordered:before{content:"• ";color:var(--accent);font-weight:500}.editor-status-bar{display:flex;gap:2rem;padding:.5rem 1.5rem;background:var(--bg-tertiary);border-top:1px solid var(--border);font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em}.session-context-label{margin-left:auto;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600}.session-context-label.prior{color:var(--text-secondary);opacity:.6}.session-context-label.live{color:var(--accent)}.viewer-toolbar{display:flex;align-items:center;gap:1rem;padding:.75rem 1.5rem;background:var(--bg-tertiary);border-bottom:1px solid var(--border)}.verification-badge{padding:.25rem .75rem;border-radius:4px;font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em}.verification-badge.verified{background:var(--success);color:var(--bg-primary)}.verification-badge.invalid{background:var(--error);color:#fff}.viewer-toolbar-title{font-size:1rem;font-weight:500;color:var(--text-primary);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.viewer-empty{display:flex;align-items:center;justify-content:center;flex:1;color:var(--text-secondary)}.viewer-content{flex:1;display:flex;flex-direction:column;overflow:hidden;padding:1.5rem}.viewer-content.hidden{display:none}.stats-bar{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--bg-secondary);border-radius:6px;margin-bottom:.5rem}.stats-bar-primary{display:flex;align-items:center;gap:2rem}.stats-bar-metric{display:flex;align-items:baseline;gap:.4rem}.stats-bar-value{font-size:1.1rem;font-weight:600;color:var(--text-primary)}.stats-bar-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-secondary);font-weight:400}.stats-bar-toggle{display:flex;align-items:center;gap:.35rem;background:transparent;border:none;color:var(--text-secondary);cursor:pointer;font-size:.75rem;padding:.3rem .5rem;border-radius:4px;transition:color .2s,background .2s}.stats-bar-toggle:hover{color:var(--accent);background:#4ecca31a}.stats-bar-toggle.expanded svg{transform:rotate(180deg)}.stats-bar-toggle svg{transition:transform .2s}.stats-details{background:var(--bg-secondary);border-radius:6px;padding:.75rem 1rem;margin-bottom:.5rem}.stats-details.hidden{display:none}.stats-detail-summary{font-size:.85rem;color:var(--text-secondary);line-height:1.8;padding-bottom:.6rem;border-bottom:1px solid var(--border);margin-bottom:.6rem}.detail-stat{cursor:default}.detail-stat-value{color:var(--text-primary);font-weight:600}.detail-stat-sep{color:var(--text-secondary);opacity:.4}.stats-detail-sessions{max-height:calc(2.2rem * 3);overflow-y:auto;position:relative}.stats-detail-sessions.scrollable:after{content:"";position:sticky;bottom:0;left:0;right:0;display:block;height:1.5rem;background:linear-gradient(transparent,var(--bg-secondary));pointer-events:none}.session-row{display:flex;align-items:center;justify-content:space-between;padding:.35rem .5rem;border-radius:4px;font-size:.75rem;cursor:pointer;transition:background .15s}.session-row:hover{background:#4ecca31a}.session-row.active{background:#4ecca333}.session-row-label{font-weight:500;color:var(--text-primary)}.session-row-date{color:var(--text-secondary);flex:1;text-align:center}.session-row-duration{color:var(--text-secondary);min-width:3rem;text-align:right}.replay-container{flex:1;display:flex;flex-direction:column;overflow:hidden}.replay-controls{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-secondary);border-radius:6px;margin-bottom:1rem}.replay-icon-btn{width:34px;height:34px;background:var(--accent);border:none;color:var(--bg-primary);border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,opacity .2s;flex-shrink:0}.replay-icon-btn:hover{background:var(--accent-dim)}.replay-icon-btn:disabled{background:var(--border);color:var(--text-secondary);opacity:.5;cursor:not-allowed}.progress-container{flex:1;display:flex;align-items:center;gap:1rem}.progress-slider{flex:1;height:4px;-webkit-appearance:none;background:var(--border);border-radius:2px;outline:none}.progress-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;background:var(--accent);border-radius:50%;cursor:pointer}#replay-time{font-size:.875rem;color:var(--text-secondary);min-width:100px;text-align:right}.replay-display{flex:1;position:relative;background:var(--bg-secondary);border-radius:6px;overflow:hidden}.replay-editor{height:100%;padding:1.5rem;font-family:SF Mono,Fira Code,Monaco,monospace;font-size:14px;line-height:1.6;white-space:pre-wrap;overflow:auto}.replay-editor .imported-content{background:#4ecca31f;border-radius:2px;padding:0 1px}.replay-cursor-marker{display:inline-block;width:0;height:1em;vertical-align:text-bottom;pointer-events:none}.event-indicator{display:none}.event-toast{position:absolute;bottom:1rem;right:1rem;padding:.5rem 1rem;border-radius:4px;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap;pointer-events:none;animation:toast-float-fade 2.8s ease-out forwards}@keyframes toast-float-fade{0%{opacity:1;transform:translateY(0)}15%{opacity:1;transform:translateY(-4rem)}60%{opacity:.9;transform:translateY(-7rem)}to{opacity:0;transform:translateY(-11rem)}}.event-toast.paste{background:var(--warning);color:var(--bg-primary)}.event-toast.session{background:var(--accent);color:var(--bg-primary)}.event-toast.pause{background:#3b82f6;color:#fff}.modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:var(--bg-secondary);padding:2.5rem;border-radius:12px;max-width:480px;text-align:center;border:1px solid var(--border);box-shadow:0 20px 60px #00000080}.modal-icon{margin-bottom:1.5rem;color:var(--accent)}.modal-content h2{margin-bottom:1rem;color:var(--text-primary)}.modal-content p{color:var(--text-secondary);line-height:1.6;margin-bottom:1rem}.modal-hint{font-size:.875rem;opacity:.8}.modal-actions{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem}.modal-actions .btn-secondary{width:auto}.browser-warning{position:fixed;bottom:0;left:0;right:0;background:var(--warning);color:var(--bg-primary);z-index:999}.browser-warning-content{display:flex;align-items:center;justify-content:space-between;padding:.75rem 2rem;max-width:1200px;margin:0 auto}.browser-warning p{font-size:.875rem}.browser-warning .btn-secondary{width:auto;background:#0000001a;border-color:#0003;color:var(--bg-primary)}.browser-warning .btn-secondary:hover{background:#0003;border-color:#0000004d}@media (max-width: 768px){.sidebar{position:fixed;left:0;top:0;z-index:100;transform:translate(-100%)}.sidebar:not(.collapsed){transform:translate(0);width:100%;max-width:300px;box-shadow:4px 0 20px #0000004d}.replay-controls{flex-wrap:wrap}.progress-container{width:100%;order:10}.modal-content{margin:1rem;padding:1.5rem}.modal-actions{flex-direction:column}.browser-warning-content{flex-direction:column;gap:.75rem;text-align:center}}
