:root{--editor-primary: #8f9b6b;--editor-primary-hover: #6b7852;--editor-border: rgba(143, 155, 107, .25);--editor-text-light: #4b5563;--editor-text-muted: #6b7280;--editor-text-dark: #1a1a1a;--editor-placeholder: #9ca3af;--editor-container-bg: rgba(226, 220, 201, .25);--editor-panel-bg: rgba(255, 255, 255, .95);--editor-toolbar-bg: #f9fafb;--editor-content-bg: #ffffff;--editor-preview-bg: #fdfdfb;--editor-preview-title-bg: rgba(143, 155, 107, .12);--editor-code-bg: #282c34;--editor-code-text: #abb2bf;--editor-latex-bg: rgba(143, 155, 107, .08);--editor-inline-code-bg: rgba(143, 155, 107, .15);--editor-inline-code-border: rgba(143, 155, 107, .3);--editor-inline-code-text: #5a6b3d;--editor-button-gradient: linear-gradient(135deg, #8f9b6b 0%, #6b7852 100%);--editor-shadow-lg: 0 15px 40px rgba(0, 0, 0, .1);--editor-shadow-md: 0 8px 20px rgba(0, 0, 0, .07);--editor-shadow-button: 0 5px 20px rgba(143, 155, 107, .4);--editor-shadow-button-hover: 0 10px 30px rgba(143, 155, 107, .5);--editor-transition: all .3s cubic-bezier(.4, 0, .2, 1);--editor-transition-fast: all .2s ease;--editor-radius-lg: 16px;--editor-radius-md: 12px;--editor-radius-sm: 6px;--editor-font-sans: "Inter", "Helvetica", "Arial", sans-serif}.dark{--editor-primary: #a8b58a;--editor-primary-hover: #94a376;--editor-border: rgba(168, 181, 138, .2);--editor-text-light: #e5e7eb;--editor-text-muted: #9ca3af;--editor-text-dark: #f3f4f6;--editor-placeholder: rgba(163, 168, 143, .7);--editor-container-bg: #11140f;--editor-panel-bg: #1a1d17;--editor-toolbar-bg: #141612;--editor-content-bg: #242820;--editor-preview-bg: #141612;--editor-preview-title-bg: rgba(168, 181, 138, .15);--editor-code-bg: rgba(30, 34, 28, .7);--editor-code-text: #cbd5e1;--editor-latex-bg: rgba(168, 181, 138, .12);--editor-inline-code-bg: rgba(168, 181, 138, .2);--editor-inline-code-border: rgba(168, 181, 138, .35);--editor-inline-code-text: #a8b58a;--editor-shadow-lg: 0 12px 35px rgba(0, 0, 0, .6);--editor-shadow-md: 0 8px 20px rgba(0, 0, 0, .4);--editor-shadow-button: 0 8px 25px rgba(168, 181, 138, .35);--editor-shadow-button-hover: 0 12px 30px rgba(168, 181, 138, .45)}.add-section-container{max-width:1600px;margin:2rem auto;padding:2rem;background:var(--editor-container-bg);border-radius:var(--editor-radius-lg);box-shadow:var(--editor-shadow-lg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:var(--editor-transition);font-family:var(--editor-font-sans)}.add-section-container h1{font-size:2rem;margin-bottom:1.5rem;color:var(--editor-primary);text-align:center;font-weight:900;letter-spacing:.5px}.split-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;margin-bottom:20px}.editor-panel,.preview-panel{background:var(--editor-panel-bg);border-radius:var(--editor-radius-md);border:1px solid var(--editor-border);display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--editor-shadow-md);transition:var(--editor-transition)}.panel-header{background:var(--editor-preview-title-bg);padding:12px 16px;font-weight:700;border-bottom:1px solid var(--editor-border);font-size:.95rem;display:flex;align-items:center;gap:8px;color:var(--editor-text-light)}.panel-icon{font-size:1.2rem;color:var(--editor-primary)}.form-group{margin-bottom:1.5rem}.editor-panel label,.form-group label{display:block;font-weight:600;margin-bottom:.5rem;color:var(--editor-text-light);text-transform:uppercase;font-size:.75rem;letter-spacing:.5px;padding:0 4px}input[type=text]{width:100%;padding:.75rem 1rem;border-radius:var(--editor-radius-md);border:1px solid var(--editor-border);font-size:1rem;outline:none;transition:var(--editor-transition);background:var(--editor-content-bg);color:var(--editor-text-dark);margin-bottom:1rem}input[type=text]:focus{border-color:var(--editor-primary);box-shadow:0 0 0 3px #8f9b6b1a;transform:translateY(-1px)}.extra-toolbar{background:var(--editor-toolbar-bg);padding:10px 14px;border-bottom:1px solid var(--editor-border);border-radius:var(--editor-radius-sm);display:flex;flex-wrap:wrap;gap:8px;margin-bottom:0}.extra-toolbar button,.tool-btn{padding:6px 12px;background:var(--editor-panel-bg);border:1px solid var(--editor-border);border-radius:var(--editor-radius-sm);cursor:pointer;font-size:.85rem;font-weight:500;color:var(--editor-text-light);display:inline-flex;align-items:center;gap:6px;transition:var(--editor-transition);white-space:nowrap}.extra-toolbar button:hover,.tool-btn:hover{background:var(--editor-primary);color:#fff;border-color:var(--editor-primary-hover);transform:translateY(-1px);box-shadow:var(--editor-shadow-md)}.extra-toolbar button[style*="color:red"]:hover{background:#dc2626;border-color:#b91c1c}#toolbar,.ql-toolbar{background:var(--editor-toolbar-bg)!important;padding:10px 14px!important;border:1px solid var(--editor-border)!important;border-bottom:1px solid var(--editor-border)!important;border-radius:var(--editor-radius-sm) var(--editor-radius-sm) 0 0!important;display:flex;flex-wrap:wrap;gap:4px}.ql-toolbar .ql-formats{margin-right:12px}.editor-container,#editor{min-height:400px;max-height:550px;font-size:16px;background:var(--editor-content-bg);border:1px solid var(--editor-border)!important;border-top:none!important;border-radius:0 0 var(--editor-radius-sm) var(--editor-radius-sm);transition:var(--editor-transition);overflow:hidden}.ql-container{border:none!important;font-family:var(--editor-font-sans)}.ql-editor{min-height:380px;max-height:500px;overflow-y:auto;padding:16px;line-height:1.7;color:var(--editor-text-dark)!important;font-size:16px}.ql-editor p{color:var(--editor-text-dark);margin-bottom:.5em}.ql-editor.ql-blank:before{color:var(--editor-placeholder);font-style:italic;left:16px}.ql-editor code.ql-code-inline,#previewText code.ql-code-inline{display:inline;padding:3px 8px;margin:0 2px;background:var(--editor-inline-code-bg);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--editor-inline-code-border);border-radius:4px;font-size:.9em;font-family:ui-monospace,Fira Code,Courier New,monospace;font-weight:500;white-space:nowrap;color:var(--editor-inline-code-text);box-shadow:0 2px 6px #0000000f}.ql-syntax,pre.ql-syntax,.preview-text pre,.preview-content pre{background:var(--editor-code-bg)!important;color:var(--editor-code-text)!important;padding:14px!important;border-radius:var(--editor-radius-sm)!important;font-family:Fira Code,Courier New,monospace!important;font-size:.9rem!important;line-height:1.5;overflow-x:auto;margin:8px 0;border:1px solid var(--editor-border);transition:var(--editor-transition)}.ql-syntax:hover,pre.ql-syntax:hover,.preview-text pre:hover,.preview-content pre:hover{box-shadow:0 4px 15px #0000001a}.dark .ql-syntax,.dark pre.ql-syntax,.dark .preview-text pre,.dark .preview-content pre{background:var(--editor-code-bg)!important;color:var(--editor-code-text)!important;border:1px solid rgba(148,163,120,.2);box-shadow:0 4px 12px #0006}.ql-align-center{text-align:center}.ql-align-right{text-align:right}.ql-align-justify{text-align:justify}.stats-bar{display:flex;gap:15px;padding:10px 16px;background:var(--editor-toolbar-bg);border-top:1px solid var(--editor-border);font-size:.85rem;color:var(--editor-text-muted);align-items:center;border-radius:0 0 var(--editor-radius-sm) var(--editor-radius-sm);flex-wrap:wrap}.stats-bar span{display:flex;align-items:center;gap:4px}.stats-bar b{color:var(--editor-primary);font-weight:600}#saveStatus{margin-left:auto}.preview-panel{position:sticky;top:20px;max-height:calc(100vh - 40px)}.preview-panel h3{background:var(--editor-preview-title-bg);padding:12px 16px;font-weight:700;border-bottom:1px solid var(--editor-border);border-radius:var(--editor-radius-sm) var(--editor-radius-sm) 0 0;font-size:.95rem;margin:0;color:var(--editor-text-light)}.preview-content{padding:18px;flex-grow:1;overflow-y:auto;background:var(--editor-preview-bg);border:2px dashed var(--editor-border);border-radius:var(--editor-radius-sm);min-height:400px;transition:var(--editor-transition);font-size:1rem;line-height:1.7;color:var(--editor-text-light)}.preview-content h1,.preview-content h2,.preview-content h3,.preview-text h1,.preview-text h2,.preview-text h3{color:var(--editor-primary);margin-top:1.2rem;margin-bottom:.6rem;font-weight:700}.preview-content h1{font-size:1.8rem}.preview-content h2{font-size:1.5rem}.preview-content h3{font-size:1.3rem}.preview-content p,.preview-text p{margin-bottom:.8em;color:var(--editor-text-light)}.preview-content strong,.preview-text strong{font-weight:700}.preview-content em,.preview-text em{font-style:italic}.preview-content a,.preview-text a{color:var(--editor-primary);text-decoration:underline;transition:var(--editor-transition-fast)}.preview-content a:hover,.preview-text a:hover{color:var(--editor-primary-hover)}.preview-content ul,.preview-content ol,.preview-text ul,.preview-text ol{margin-left:20px;margin-bottom:10px}.ql-editor .ql-strike,.preview-content s,.preview-text s{text-decoration:line-through}.preview-content table,.preview-text table{width:100%;border-collapse:collapse;margin:12px 0;border-radius:var(--editor-radius-sm);overflow:hidden}.preview-content th,.preview-content td,.preview-text th,.preview-text td{border:1px solid var(--editor-border);padding:8px 12px;text-align:left}.preview-content th,.preview-text th{background:var(--editor-preview-title-bg);font-weight:600;color:var(--editor-text-light)}.preview-content blockquote,.preview-text blockquote{border-left:4px solid var(--editor-primary);padding-left:12px;margin:12px 0;font-style:italic;color:var(--editor-text-muted)}.latex-block{display:block;background:var(--editor-latex-bg);border-left:4px solid var(--editor-primary);padding:16px 18px;margin:18px 0;text-align:center;border-radius:var(--editor-radius-sm);font-weight:500}.latex-inline{background:var(--editor-latex-bg);padding:2px 6px;border-radius:var(--editor-radius-sm)}.preview-content .katex-display,.preview-text .katex-display{margin:1em 0;text-align:center}.preview-content .katex,.preview-text .katex{font-size:1.1em}.submit-btn{display:block;width:100%;max-width:400px;margin:2rem auto 0;padding:14px 24px;background:var(--editor-button-gradient);color:#fff;font-weight:700;border:none;border-radius:var(--editor-radius-md);cursor:pointer;transition:var(--editor-transition);text-transform:uppercase;letter-spacing:1px;font-size:1rem;box-shadow:var(--editor-shadow-button)}.submit-btn:hover{transform:translateY(-2px);box-shadow:var(--editor-shadow-button-hover);filter:brightness(1.05)}.submit-btn:active{transform:translateY(0);box-shadow:var(--editor-shadow-button)}body.editor-fullscreen{overflow:hidden}body.editor-fullscreen .add-section-container{position:fixed;top:0;left:0;width:100vw;height:100vh;margin:0;max-width:none;border-radius:0;z-index:9999;overflow-y:auto}@media(max-width:1024px){.split-layout{grid-template-columns:1fr}.preview-panel{position:relative;top:0;max-height:none}.extra-toolbar{justify-content:flex-start}.add-section-container{max-width:900px}}@media(max-width:768px){.add-section-container{padding:1.5rem;margin:1rem auto}.add-section-container h1{font-size:1.6rem}.editor-container,#editor{min-height:300px}.ql-editor{min-height:250px}.panel-header{flex-direction:column;align-items:flex-start;gap:8px}.extra-toolbar{gap:6px}.extra-toolbar button{font-size:.8rem;padding:5px 10px}.stats-bar{font-size:.75rem;gap:10px}}@media(max-width:480px){.add-section-container{padding:1rem}input[type=text]{font-size:.95rem}.submit-btn{font-size:.9rem;padding:12px 20px}}
