@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--bg-color:#f0f4f8;--bg-gradient:linear-gradient(135deg, #f0f4f8 0%, #e2e8f0 100%);--text-color:#1a202c;--glass-bg:#fff9;--glass-border:#ffffff4d;--glass-shadow:0 8px 32px 0 #1f268712;--primary-color:#4f46e5;--primary-hover:#4338ca;--border-color:#cbd5e1;--toolbar-bg:#ffffffd9;--code-bg:#f8fafc;--scroll-thumb:#cbd5e1}[data-theme=dark]{--bg-color:#0b1329;--bg-gradient:radial-gradient(circle at 85% 15%, #1d2a4a 0%, #0b1329 100%);--text-color:#f1f5f9;--glass-bg:#1e2940b8;--glass-border:#ffffff38;--glass-shadow:0 8px 32px 0 #00000073, 0 0 16px 0 #6366f11f;--primary-color:#6366f1;--primary-hover:#818cf8;--border-color:#ffffff2e;--toolbar-bg:#2d3c5cbf;--code-bg:#0f172aa6;--scroll-thumb:#475569}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-gradient);color:var(--text-color);background-attachment:fixed;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;transition:background .3s,color .3s;overflow:hidden}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow)}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(8px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:12px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}.app-container{flex-direction:column;gap:16px;height:100vh;padding:16px;display:flex}.header{z-index:10;border-radius:12px;justify-content:space-between;align-items:center;padding:12px 24px;display:flex}.header-title{align-items:center;gap:8px;font-size:1.25rem;font-weight:700;display:flex}.header-actions{align-items:center;gap:12px;display:flex}.btn{border-radius:8px;align-items:center;gap:8px;padding:8px 16px;font-size:.875rem;font-weight:500;transition:all .2s;display:flex}.btn-primary{background:var(--primary-color);color:#fff}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-1px)}.btn-icon{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-color);border-radius:8px;padding:8px}.btn-icon:hover{background:var(--toolbar-bg)}.main-content{flex:1;gap:16px;min-height:0;display:flex}.pane{flex-direction:column;flex:1;display:flex;overflow:hidden}.pane-header{border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;padding:12px 16px;font-weight:600;display:flex}.toolbar{gap:4px;display:flex}.toolbar-btn{color:var(--text-color);opacity:.7;border-radius:6px;padding:6px;transition:all .2s}.toolbar-btn:hover{opacity:1;background:var(--glass-border)}.format-selector{white-space:nowrap;flex-wrap:nowrap;align-items:center;gap:8px;display:flex}.format-label{color:var(--text-color);opacity:.95;white-space:nowrap;flex-shrink:0;font-size:.85rem;font-weight:700}.format-btn-group{border:1px solid var(--glass-border);background:#0000001f;border-radius:10px;gap:6px;padding:4px;display:flex}[data-theme=dark] .format-btn-group{background:#0f172a80;border:1px solid #fff3}.format-btn{color:var(--text-color);opacity:.75;border-radius:8px;padding:6px 14px;font-size:.85rem;font-weight:600;transition:all .2s}.format-btn:hover{opacity:1;background:var(--glass-border)}.format-btn.active{opacity:1;background:var(--primary-color);color:#fff;box-shadow:0 4px 12px #6366f166}.editor-textarea{resize:none;width:100%;color:var(--text-color);background:0 0;border:none;outline:none;flex:1;padding:20px;font-family:JetBrains Mono,Fira Code,monospace;font-size:.9375rem;line-height:1.6}[data-theme=dark] .main-area .glass-panel,[data-theme=dark] .main-area .header{-webkit-backdrop-filter:blur(16px);background:#1e2a44d1;border:1px solid #ffffff38;box-shadow:0 8px 32px #0006,inset 0 1px 1px #ffffff26}[data-theme=dark] .main-area .pane-header{background:#ffffff0a;border-bottom:1px solid #ffffff2e}[data-theme=dark] .editor-textarea{color:#f8fafc;background:#0f172a40}.preview-content{background:0 0;flex:1;overflow-y:auto}.markdown-body{color:var(--text-color);word-wrap:break-word;font-size:1rem;line-height:1.6}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6{margin-top:24px;margin-bottom:16px;font-weight:600;line-height:1.25}.markdown-body h1{border-bottom:1px solid var(--glass-border);padding-bottom:.3em;font-size:2em}.markdown-body h2{border-bottom:1px solid var(--glass-border);padding-bottom:.3em;font-size:1.5em}.markdown-body h3{font-size:1.25em}.markdown-body p,.markdown-body blockquote,.markdown-body ul,.markdown-body ol,.markdown-body dl,.markdown-body table,.markdown-body pre,.markdown-body details{margin-top:0;margin-bottom:16px}.markdown-body ul,.markdown-body ol{padding-left:2em}.markdown-body blockquote{color:#6a737d;border-left:.25em solid var(--glass-border);padding:0 1em}.markdown-body code{background-color:var(--code-bg);border-radius:6px;margin:0;padding:.2em .4em;font-family:JetBrains Mono,Fira Code,monospace;font-size:85%}.markdown-body pre{background-color:var(--code-bg);border-radius:6px;padding:16px;font-size:85%;line-height:1.45;overflow:auto}.markdown-body pre code{max-width:auto;line-height:inherit;word-wrap:normal;background-color:#0000;border:0;margin:0;padding:0;display:inline;overflow:visible}.markdown-body table{width:100%;display:block;overflow:auto}.markdown-body table th{font-weight:600}.markdown-body table th,.markdown-body table td{border:1px solid var(--glass-border);padding:6px 13px}.markdown-body table tr{border-top:1px solid var(--glass-border);background-color:#0000}.markdown-body table tr:nth-child(2n){background-color:var(--glass-border)}.markdown-body img{box-sizing:content-box;border-radius:8px;max-width:100%}.layout-container{gap:16px;height:100vh;padding:16px;display:flex;overflow:hidden}.sidebar{border-radius:12px;flex-direction:column;width:330px;padding:20px;display:flex;overflow-y:auto}.sidebar-header{border-bottom:1px solid var(--glass-border);white-space:nowrap;align-items:center;gap:12px;margin-bottom:24px;padding-bottom:14px;transition:all .3s;display:flex}.sidebar-header-icon{width:42px;height:42px;color:var(--primary-color);background:linear-gradient(135deg,#6366f126 0%,#38bdf826 100%);border:1px solid #6366f159;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;transition:all .3s;display:flex;box-shadow:0 4px 14px #6366f133}[data-theme=dark] .sidebar-header-icon{color:#38bdf8;background:linear-gradient(135deg,#6366f140 0%,#38bdf840 100%);border-color:#38bdf880;box-shadow:0 0 16px #38bdf859}.sidebar-header:hover .sidebar-header-icon{transform:rotate(180deg)scale(1.05)}.sidebar-header-text{flex-direction:column;gap:2px;display:flex}.sidebar-header h2{white-space:nowrap;letter-spacing:.5px;font-size:1.25rem;font-weight:800}[data-theme=dark] .sidebar-header h2{background:linear-gradient(135deg,#fff 10%,#c7d2fe 50%,#38bdf8 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 8px #6366f159);-webkit-background-clip:text}.sidebar-header-sub{letter-spacing:2.5px;color:var(--primary-color);opacity:.85;text-transform:uppercase;font-size:.65rem;font-weight:700}.sidebar-nav{flex-direction:column;gap:12px;display:flex}.nav-group-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-color);opacity:.6;margin-bottom:4px;padding-left:4px;font-size:.75rem;font-weight:700}.mt-4{margin-top:12px}.nav-btn{color:var(--text-color);opacity:.95;text-align:left;background:var(--glass-bg);border:1px solid var(--border-color);border-radius:10px;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 14px;transition:all .2s;display:flex;box-shadow:0 2px 6px #00000008}.nav-btn-title{align-items:center;gap:8px;font-size:.95rem;font-weight:600;display:flex}.nav-btn-desc{opacity:.75;margin-left:26px;font-size:.75rem;line-height:1.3}.nav-btn:hover{opacity:1;background:var(--toolbar-bg);border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.nav-btn.active{opacity:1;background:var(--primary-color);color:#fff;border-color:var(--primary-hover);box-shadow:0 4px 14px #4f46e559}.nav-btn.active .nav-btn-desc{opacity:.9;color:#ffffffd9}.sidebar-guide{background:var(--glass-bg);border:1px solid var(--border-color);border-radius:10px;margin-top:24px;padding:14px;font-size:.78rem;line-height:1.5;box-shadow:0 2px 6px #00000008}.sidebar-guide-title{color:var(--primary-color);align-items:center;gap:6px;margin-bottom:8px;font-size:.82rem;font-weight:700;display:flex}.sidebar-guide ol{margin:0;padding-left:18px}.sidebar-guide li{margin-bottom:4px}.landing-container{flex-direction:column;gap:32px;max-width:1200px;height:100vh;margin:0 auto;padding:24px 40px;animation:.4s ease-out fadeIn;display:flex;overflow-y:auto}.landing-top-bar{justify-content:space-between;align-items:center;display:flex}.landing-brand{align-items:center;gap:10px;font-size:1.25rem;font-weight:700;display:flex}.landing-hero{text-align:center;border-radius:20px;flex-direction:column;align-items:center;gap:20px;padding:48px;display:flex}.hero-badge{color:var(--primary-color);background:#4f46e51a;border-radius:20px;align-items:center;gap:6px;padding:6px 16px;font-size:.85rem;font-weight:600;display:inline-flex}.hero-title{background:linear-gradient(135deg, var(--text-color) 30%, var(--primary-color) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:3rem;font-weight:800;line-height:1.2}.hero-subtitle{opacity:.8;max-width:680px;font-size:1.1rem;line-height:1.7}.enter-btn{background:var(--primary-color);color:#fff;border-radius:14px;align-items:center;gap:12px;margin-top:12px;padding:16px 36px;font-size:1.1rem;font-weight:600;transition:all .3s;display:flex;box-shadow:0 8px 24px #4f46e566}.enter-btn:hover{background:var(--primary-hover);transform:translateY(-3px)scale(1.02);box-shadow:0 12px 30px #4f46e580}.landing-features{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-bottom:24px;display:grid}.feature-card{border-radius:16px;flex-direction:column;gap:12px;padding:24px;transition:all .2s;display:flex}.feature-card:hover{transform:translateY(-4px)}.feature-icon{width:48px;height:48px;color:var(--primary-color);background:#4f46e51a;border-radius:12px;justify-content:center;align-items:center;display:flex}.feature-card h3{font-size:1.1rem;font-weight:700}.feature-card p{opacity:.75;font-size:.875rem;line-height:1.6}.main-area{flex-direction:column;flex:1;animation:.3s fadeIn;display:flex;overflow:hidden}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.app-container{animation:.5s ease-out fadeIn}