:root{--primary:#1976D2;--primary-dark:#1565C0;--primary-darker:#0D47A1;--primary-light:#42A5F5;--primary-bg:#E3F2FD;--primary-bg-subtle:#F5F9FF;--surface:#ffffff;--surface-hover:#f0f4f8;--bg:#EEF2F7;--text:#1a1a2e;--text-secondary:#5a6a7e;--text-muted:#8896a6;--border:#d0d9e4;--border-light:#e4eaf0;--shadow-sm:0 1px 3px rgba(25, 118, 210, 0.08);--shadow-md:0 4px 12px rgba(25, 118, 210, 0.1);--shadow-lg:0 8px 24px rgba(25, 118, 210, 0.12);--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--font-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-mono:'JetBrains Mono','Fira Code','Cascadia Code',monospace;--header-h:52px;--toolbar-h:44px;--statusbar-h:32px;--divider-w:6px;--sidebar-ad-w:160px;--transition-fast:0.15s ease;--transition-normal:0.25s ease}*,::after,::before{margin:0;padding:0;box-sizing:border-box}body,html{height:100%;overflow:hidden;font-family:var(--font-sans);font-size:14px;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}body{display:flex;flex-direction:column}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:rgba(25,118,210,.2);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:rgba(25,118,210,.35)}.btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border:none;border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:13px;font-weight:500;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.btn--browse{background:var(--primary);color:#fff;box-shadow:var(--shadow-sm)}.btn--browse:hover{background:var(--primary-dark);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn--browse:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.header{display:flex;align-items:center;gap:12px;height:var(--header-h);padding:0 16px;background:var(--surface);border-bottom:1px solid var(--border-light);box-shadow:var(--shadow-sm);z-index:10;flex-shrink:0}.header__ad{flex:0 0 160px;display:flex;align-items:center;justify-content:center;padding:0 10px}.logo-link{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);transition:all var(--transition-fast);cursor:pointer;text-decoration:none;background:0 0}.logo-link:hover{background:var(--surface-hover);box-shadow:var(--shadow-sm);transform:scale(1.05)}.logo{height:40px;border-radius:var(--radius-sm);object-fit:contain;display:block}.header__file{flex:1;display:flex;align-items:center;gap:10px;min-width:0}.header__filepath{flex:1;padding:6px 12px;background:var(--primary-bg-subtle);border:1px solid var(--border-light);border-radius:var(--radius-sm);font-size:12px;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--font-mono)}.ad-placeholder{display:flex;align-items:center;justify-content:center;height:36px;background:linear-gradient(135deg,var(--primary-bg) 0,#dce8f5 100%);border:1px dashed var(--border);border-radius:var(--radius-sm);font-size:11px;color:var(--text-muted);font-weight:500;letter-spacing:1px;text-transform:uppercase}.ad-placeholder--vertical{height:100%;width:100%;writing-mode:vertical-rl;text-orientation:mixed}.toolbar{display:flex;align-items:center;gap:2px;height:var(--toolbar-h);padding:0 12px;background:linear-gradient(135deg,var(--primary-dark) 0,var(--primary) 100%);box-shadow:var(--shadow-md);z-index:9;flex-shrink:0}.toolbar__btn{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border:none;border-radius:var(--radius-sm);background:0 0;color:rgba(255,255,255,.85);font-family:var(--font-sans);font-size:12.5px;font-weight:500;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.toolbar__btn:hover{background:rgba(255,255,255,.15);color:#fff;transform:translateY(-1px)}.toolbar__btn:active{background:rgba(255,255,255,.1);transform:translateY(0)}.toolbar__btn--toggle.active{background:rgba(255,255,255,.2);color:#fff}.toolbar__separator{width:1px;height:22px;margin:0 4px;background:rgba(255,255,255,.2)}.main{flex:1;display:flex;overflow:hidden;background:var(--bg)}.panel{display:flex;flex-direction:column;min-width:120px;background:var(--surface);border-radius:var(--radius-md);margin:8px 0 8px 8px;box-shadow:var(--shadow-md);overflow:hidden;transition:flex var(--transition-normal),margin var(--transition-normal),opacity var(--transition-normal)}.panel--editor{flex:1}.panel--preview{flex:1;margin-right:0}.panel.hidden{flex:0!important;min-width:0!important;width:0!important;margin:0!important;padding:0!important;overflow:hidden!important;opacity:0;pointer-events:none}.panel__header{display:flex;align-items:center;padding:8px 14px;background:var(--primary-bg);border-bottom:1px solid var(--border-light);flex-shrink:0}.panel__label{font-size:12px;font-weight:600;color:var(--primary-dark);text-transform:uppercase;letter-spacing:.5px}.editor{flex:1;width:100%;padding:16px;border:none;outline:0;resize:none;font-family:var(--font-mono);font-size:13.5px;line-height:1.7;color:var(--text);background:var(--surface);tab-size:2}.editor::placeholder{color:var(--text-muted)}.preview{flex:1;padding:20px 24px;overflow-y:auto;line-height:1.7;color:var(--text)}.preview h1{font-size:1.8em;font-weight:700;margin:.6em 0 .4em;padding-bottom:.3em;border-bottom:2px solid var(--primary-bg);color:var(--primary-darker)}.preview h2{font-size:1.45em;font-weight:600;margin:.8em 0 .3em;padding-bottom:.2em;border-bottom:1px solid var(--border-light);color:var(--primary-dark)}.preview h3{font-size:1.2em;font-weight:600;margin:.7em 0 .25em;color:var(--primary)}.preview h4{font-size:1.05em;font-weight:600;margin:.6em 0 .2em}.preview p{margin:.5em 0}.preview a{color:var(--primary);text-decoration:none;border-bottom:1px solid transparent;transition:border-color var(--transition-fast)}.preview a:hover{border-bottom-color:var(--primary)}.preview ol,.preview ul{padding-left:1.8em;margin:.4em 0}.preview li{margin:.2em 0}.preview blockquote{margin:.6em 0;padding:10px 16px;border-left:4px solid var(--primary);background:var(--primary-bg-subtle);border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:var(--text-secondary)}.preview code{padding:2px 6px;background:var(--primary-bg);border-radius:4px;font-family:var(--font-mono);font-size:.88em;color:var(--primary-dark)}.preview pre{margin:.6em 0;padding:14px 18px;background:#0d1117;border-radius:var(--radius-md);overflow-x:auto;box-shadow:var(--shadow-sm)}.preview pre code{padding:0;background:0 0;color:#e6edf3;font-size:13px;line-height:1.6}.preview table{width:100%;border-collapse:collapse;margin:.6em 0;font-size:13px}.preview td,.preview th{padding:8px 12px;border:1px solid var(--border-light);text-align:left}.preview th{background:var(--primary-bg);font-weight:600;color:var(--primary-dark)}.preview tr:nth-child(2n){background:var(--primary-bg-subtle)}.preview img{max-width:100%;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);margin:.5em 0}.preview hr{border:none;height:2px;background:linear-gradient(90deg,var(--primary-bg),var(--border-light),var(--primary-bg));margin:1.2em 0}.divider{flex:0 0 var(--divider-w);display:flex;align-items:center;justify-content:center;cursor:col-resize;user-select:none;z-index:5;transition:background var(--transition-fast)}.divider.dragging,.divider:hover{background:rgba(25,118,210,.08)}.divider__line{width:3px;height:40px;border-radius:2px;background:var(--border);transition:all var(--transition-fast)}.divider.dragging .divider__line,.divider:hover .divider__line{background:var(--primary);height:56px;width:4px}.divider.hidden{display:none}.folder-menu{display:none;flex-direction:column;width:100%;overflow:hidden}.folder-menu.active{display:flex}.folder-menu__header{display:flex;align-items:center;gap:6px;padding:10px 12px;font-size:12px;font-weight:600;color:var(--primary-dark);text-transform:uppercase;letter-spacing:.5px;background:var(--primary-bg);border-bottom:1px solid var(--border-light);flex-shrink:0}.folder-menu__list{list-style:none;padding:6px 0;margin:0;overflow-y:auto;flex:1}.folder-menu__item{margin:0}.folder-menu__link{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:12.5px;font-weight:500;color:var(--text-secondary);text-decoration:none;border-left:3px solid transparent;transition:all var(--transition-fast);cursor:pointer;word-break:break-word}.folder-menu__link:hover{background:var(--surface-hover);color:var(--primary);border-left-color:var(--primary-light)}.folder-menu__link.active{background:var(--primary-bg);color:var(--primary-dark);border-left-color:var(--primary);font-weight:600}.folder-menu__icon{flex-shrink:0;font-size:14px}.sidebar-ad.has-menu{flex:0 0 200px;display:flex;flex-direction:column;background:var(--surface);border-radius:var(--radius-md);margin:8px 8px 8px 0;box-shadow:var(--shadow-md);overflow:hidden}.sidebar-ad.has-menu .ad-placeholder--vertical{display:none}.sidebar-ad{flex:0 0 var(--sidebar-ad-w);padding:8px 8px 8px 0}.statusbar{display:flex;align-items:center;justify-content:space-between;height:var(--statusbar-h);padding:0 16px;background:var(--primary-darker);color:rgba(255,255,255,.8);font-size:11.5px;flex-shrink:0}.statusbar__info{font-weight:500}.statusbar__copyright a{color:rgba(255,255,255,.85);text-decoration:none;font-weight:600;transition:color var(--transition-fast)}.statusbar__copyright a:hover{color:#fff}@media (max-width:1024px){.header__ad,.sidebar-ad:not(.has-menu){display:none}:root{--sidebar-ad-w:0px}}@media (max-width:768px){.header{height:auto;padding:8px 10px;flex-wrap:wrap}.header__file{order:-1;width:100%;flex:none}.toolbar{height:auto;padding:6px 8px;flex-wrap:wrap;gap:4px}.toolbar__btn span{display:none}.toolbar__btn{padding:8px 10px}.main{flex-direction:column}.panel{margin:4px 4px 0 4px;min-height:120px}.panel--preview{margin-right:4px}.divider{flex:0 0 var(--divider-w);cursor:row-resize;width:100%}.divider__line{width:40px;height:3px}.divider.dragging .divider__line,.divider:hover .divider__line{width:56px;height:4px}}@media (max-width:480px){.statusbar{font-size:10px;padding:0 8px}}@media print{.divider,.header,.panel--editor,.sidebar-ad,.statusbar,.toolbar{display:none!important}.main{display:block;overflow:visible}.panel--preview{margin:0;box-shadow:none;border-radius:0}.preview{padding:0}}@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.panel{animation:fadeIn .3s ease}