*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}.app.dark{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-tertiary: #0f3460;--text-primary: #eaeaea;--text-secondary: #a0a0a0;--accent: #e94560;--accent-hover: #ff6b6b;--border: #2a2a4a;--input-bg: #1a1a2e;--success: #4ade80;--error: #f87171}.app.light{--bg-primary: #ffffff;--bg-secondary: #f5f5f5;--bg-tertiary: #e8e8e8;--text-primary: #1a1a2e;--text-secondary: #666666;--accent: #e94560;--accent-hover: #d63850;--border: #ddd;--input-bg: #ffffff;--success: #22c55e;--error: #ef4444}.app{min-height:100vh;background:var(--bg-primary);color:var(--text-primary);display:flex;flex-direction:column}.home-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center}.home-container h1{font-size:2.5rem;margin-bottom:.5rem;background:linear-gradient(135deg,var(--accent),#ff9a9e);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tagline{color:var(--text-secondary);margin-bottom:2rem;font-size:1.1rem}.home-actions{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:400px}.divider{color:var(--text-secondary);position:relative;text-align:center;margin:.5rem 0}.divider:before,.divider:after{content:"";position:absolute;top:50%;width:40%;height:1px;background:var(--border)}.divider:before{left:0}.divider:after{right:0}.access-form{display:flex;gap:.5rem}.access-form input{flex:1}.auth-container{max-width:400px;margin:auto;padding:2rem;text-align:center}.auth-container h2{margin-bottom:.5rem}.subtitle{color:var(--text-secondary);margin-bottom:1.5rem}.subtitle code{background:var(--bg-tertiary);padding:.2rem .5rem;border-radius:4px;font-family:monospace}.form-group{margin-bottom:1rem;text-align:left}.form-group label{display:block;margin-bottom:.5rem;font-weight:500}input{width:100%;padding:.75rem 1rem;border:1px solid var(--border);border-radius:8px;background:var(--input-bg);color:var(--text-primary);font-size:1rem;box-sizing:border-box}input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #e9456033}.primary-btn{width:100%;padding:.75rem 1.5rem;background:var(--accent);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:background .2s,transform .1s}.primary-btn:hover:not(:disabled){background:var(--accent-hover)}.primary-btn:active{transform:scale(.98)}.primary-btn:disabled{opacity:.6;cursor:not-allowed}.primary-btn.large{padding:1rem 2rem;font-size:1.1rem}.secondary-btn{padding:.75rem 1.5rem;background:transparent;color:var(--text-primary);border:1px solid var(--border);border-radius:8px;font-size:1rem;cursor:pointer;transition:border-color .2s,background .2s;margin-top:1rem}.secondary-btn:hover:not(:disabled){border-color:var(--accent);background:#e945601a}.secondary-btn:disabled{opacity:.5;cursor:not-allowed}.icon-btn{padding:.5rem .75rem;background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border);border-radius:6px;cursor:pointer;transition:background .2s;font-size:.875rem}.icon-btn:hover{background:var(--bg-tertiary)}.back-btn{padding:.5rem 1rem;background:transparent;color:var(--text-primary);border:1px solid var(--border);border-radius:6px;cursor:pointer}.back-btn:hover{background:var(--bg-secondary)}.back-link{position:absolute;top:1rem;left:1rem;background:transparent;border:none;color:var(--text-secondary);cursor:pointer;font-size:.9rem}.back-link:hover{color:var(--text-primary)}.theme-toggle{position:fixed;bottom:1rem;right:1rem;width:40px;height:40px;border-radius:50%;background:var(--bg-secondary);border:1px solid var(--border);cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:transform .2s}.theme-toggle:hover{transform:scale(1.1)}.error{color:var(--error);background:#f871711a;padding:.75rem;border-radius:6px;margin-bottom:1rem;font-size:.9rem}.editor-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-wrap:wrap;gap:.5rem}.header-left,.header-center,.header-right{display:flex;align-items:center;gap:.75rem}.doc-id{font-family:monospace;font-size:.875rem;color:var(--text-secondary)}.save-status{font-size:.75rem;padding:.25rem .5rem;border-radius:4px}.save-status.saving{color:#fbbf24}.save-status.saved{color:var(--success)}.language-select{padding:.5rem;background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border);border-radius:6px;cursor:pointer}.last-updated{font-size:.75rem;color:var(--text-secondary)}.editor-container{flex:1;overflow:auto}.editor-container .cm-editor{height:100%;font-size:14px}.editor-container .cm-scroller{min-height:calc(100vh - 60px)}@media(max-width:768px){.home-container h1{font-size:1.8rem}.editor-header{flex-direction:column;align-items:stretch}.header-left,.header-center,.header-right{justify-content:center;flex-wrap:wrap}.last-updated{display:none}.access-form{flex-direction:column}}.expiry-tabs{display:flex;background:var(--bg-secondary);border-radius:8px;padding:4px;gap:4px}.expiry-tabs .tab{flex:1;padding:.5rem .75rem;background:transparent;color:var(--text-secondary);border:none;border-radius:6px;cursor:pointer;font-size:.85rem;font-weight:500;transition:all .2s}.expiry-tabs .tab:hover{color:var(--text-primary)}.expiry-tabs .tab.active{background:var(--accent);color:#fff}.option-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}.option-chips .chip{padding:.4rem .75rem;background:var(--bg-secondary);color:var(--text-secondary);border:1px solid var(--border);border-radius:20px;cursor:pointer;font-size:.8rem;transition:all .2s}.option-chips .chip:hover{border-color:var(--accent);color:var(--text-primary)}.option-chips .chip.active{background:var(--accent);border-color:var(--accent);color:#fff}.storage-note{margin-top:1rem;font-size:.75rem;color:var(--text-secondary);text-align:center}.create-doc{max-width:360px}.create-doc h2{margin-bottom:1.5rem}.expiry-badge{font-size:.75rem;padding:.25rem .5rem;border-radius:4px;font-weight:500}.expiry-badge.time{background:#fbbf2433;color:#fbbf24}.expiry-badge.views{background:#9333ea33;color:#a855f7}.expired-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center}.expired-icon{font-size:4rem;margin-bottom:1rem}.expired-container h2{margin-bottom:.5rem;color:var(--error)}.expired-container p{color:var(--text-secondary);margin-bottom:1.5rem}.expired-container .primary-btn{width:auto;padding:.75rem 2rem}.mode-toggle{display:flex;background:var(--bg-primary);border:1px solid var(--border);border-radius:6px;overflow:hidden}.mode-btn{padding:.4rem .75rem;background:transparent;color:var(--text-secondary);border:none;cursor:pointer;font-size:.875rem;transition:all .2s}.mode-btn.active{background:var(--accent);color:#fff}.mode-btn:hover:not(.active){background:var(--bg-tertiary)}.auto-detect-badge{font-size:.65rem;padding:.15rem .4rem;background:var(--bg-tertiary);color:var(--text-secondary);border-radius:4px;text-transform:uppercase}.preview-content{flex:1;overflow:auto;padding:2rem;background:var(--bg-primary)}.markdown-preview{max-width:800px;margin:0 auto;line-height:1.7}.markdown-preview h1,.markdown-preview h2,.markdown-preview h3,.markdown-preview h4,.markdown-preview h5,.markdown-preview h6{margin-top:1.5em;margin-bottom:.5em;font-weight:600;line-height:1.3}.markdown-preview h1{font-size:2em;border-bottom:1px solid var(--border);padding-bottom:.3em}.markdown-preview h2{font-size:1.5em;border-bottom:1px solid var(--border);padding-bottom:.3em}.markdown-preview h3{font-size:1.25em}.markdown-preview p{margin:1em 0}.markdown-preview a{color:var(--accent);text-decoration:none}.markdown-preview a:hover{text-decoration:underline}.markdown-preview code{background:var(--bg-tertiary);padding:.2em .4em;border-radius:4px;font-family:Fira Code,Consolas,monospace;font-size:.9em}.markdown-preview pre{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;padding:1rem;overflow-x:auto;margin:1em 0}.markdown-preview pre code{background:none;padding:0;font-size:.875em}.markdown-preview blockquote{border-left:4px solid var(--accent);margin:1em 0;padding:.5em 1em;background:var(--bg-secondary);color:var(--text-secondary)}.markdown-preview ul,.markdown-preview ol{margin:1em 0;padding-left:2em}.markdown-preview li{margin:.5em 0}.markdown-preview table{width:100%;border-collapse:collapse;margin:1em 0}.markdown-preview th,.markdown-preview td{border:1px solid var(--border);padding:.5em 1em;text-align:left}.markdown-preview th{background:var(--bg-secondary);font-weight:600}.markdown-preview hr{border:none;border-top:1px solid var(--border);margin:2em 0}.markdown-preview img{max-width:100%;height:auto;border-radius:8px}.html-preview{padding:0;height:calc(100vh - 60px)}.code-preview{font-family:Fira Code,Consolas,monospace}.code-preview pre{margin:0;white-space:pre-wrap;word-wrap:break-word}.code-preview code{font-size:14px;line-height:1.6}