@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Lora:wght@400;500;600;700&family=Source+Sans+3:wght@400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;overflow:hidden}body{background:var(--mv-bg-primary, #06060a);color:var(--mv-text-primary, #e0e0e8);font-family:var(--mv-font-body, "Inter", -apple-system, BlinkMacSystemFont, sans-serif);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{--mv-accent: #7c6ef0;--mv-accent-dim: #7c6ef018;--mv-accent-border: #7c6ef030;--mv-section-color: #e8b84a;--mv-cursor-color: #7c6ef0;--mv-gradient-start: #7c6ef0;--mv-gradient-end: #e8b84a;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:auto 1fr;grid-template-areas:"header header" "sidebar editor" "status status";height:100%;overflow:hidden}.app-header{grid-area:header;display:flex;align-items:center;gap:16px;padding:12px 24px;border-bottom:1px solid var(--mv-border-subtle, #ffffff0a);background:linear-gradient(135deg,var(--mv-bg-primary, #06060a) 0%,var(--mv-bg-header-end, #0e0e18) 100%);flex-shrink:0;z-index:10}.header-brand{display:flex;align-items:baseline;gap:12px;flex-shrink:0}.header-brand h1{font-size:18px;font-weight:700;letter-spacing:3px;text-transform:uppercase;font-family:var(--mv-font-heading, "Inter", sans-serif);background:linear-gradient(135deg,var(--mv-gradient-start) 0%,var(--mv-gradient-end) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-divider{width:1px;height:24px;background:var(--mv-border-medium, #ffffff12);flex-shrink:0}.project-title-input{background:transparent;border:1px solid transparent;color:var(--mv-text-primary, #e0e0e8);font-family:var(--mv-font-body, "Inter", sans-serif);font-size:14px;font-weight:500;padding:4px 8px;border-radius:4px;outline:none;min-width:120px;max-width:300px;transition:border-color .2s}.project-title-input:hover{border-color:var(--mv-border-hover, #ffffff15)}.project-title-input:focus{border-color:var(--mv-accent);background:var(--mv-bg-hover-subtle, #ffffff06)}.header-spacer{flex:1}.sidebar-toggle{background:transparent;border:1px solid var(--mv-border-medium, #ffffff12);color:var(--mv-text-muted, #888);font-size:18px;cursor:pointer;padding:4px 10px;border-radius:6px;transition:all .2s;line-height:1}.sidebar-toggle:hover{color:var(--mv-text-primary, #e0e0e8);border-color:var(--mv-accent);background:var(--mv-accent-dim)}.sidebar{grid-area:sidebar;width:0;overflow:hidden;background:var(--mv-bg-sidebar, #08080d);border-right:1px solid var(--mv-border-faint, #ffffff08);transition:width .25s ease;display:flex;flex-direction:column}.sidebar.open{width:260px}.sidebar-inner{width:260px;padding:16px;display:flex;flex-direction:column;height:100%;gap:12px}.sidebar-new-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;background:var(--mv-accent-dim);border:1px solid var(--mv-accent-border);color:var(--mv-accent);border-radius:var(--mv-border-radius-base, 8px);font-family:var(--mv-font-body, "Inter", sans-serif);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.sidebar-new-btn:hover{background:var(--mv-accent);color:#fff}.project-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:2px}.project-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:6px;cursor:pointer;transition:background .15s;border:1px solid transparent}.project-item:hover{background:var(--mv-bg-hover-subtle, #ffffff08)}.project-item.active{background:var(--mv-accent-dim);border-color:var(--mv-accent-border)}.project-item-title{flex:1;font-size:13px;color:var(--mv-text-secondary, #ccc);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.project-item.active .project-item-title{color:var(--mv-text-primary, #e0e0e8)}.project-item-date{font-size:10px;color:var(--mv-text-faint, #555);flex-shrink:0}.project-item-delete{background:transparent;border:none;color:var(--mv-text-faint, #555);cursor:pointer;font-size:14px;padding:2px 4px;border-radius:4px;opacity:0;transition:all .15s}.project-item:hover .project-item-delete{opacity:1}.project-item-delete:hover{color:var(--mv-danger, #e05050);background:var(--mv-danger-dim, #e0505015)}.editor-container{grid-area:editor;overflow:auto;background:var(--mv-editor-bg, #0a0a0f)}.editor-container .cm-editor{height:100%}.editor-container .cm-scroller{overflow:auto}.editor-empty{grid-area:editor;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:var(--mv-text-ghost, #444);font-size:14px}.editor-empty-icon{font-size:48px;opacity:.3}.editor-empty-btn{padding:8px 20px;background:var(--mv-accent-dim);border:1px solid var(--mv-accent-border);color:var(--mv-accent);border-radius:6px;font-family:var(--mv-font-body, "Inter", sans-serif);font-size:13px;cursor:pointer;transition:all .2s}.editor-empty-btn:hover{background:var(--mv-accent);color:#fff}.status-bar{grid-area:status;display:flex;align-items:center;gap:20px;padding:6px 24px;border-top:1px solid var(--mv-border-faint, #ffffff08);background:var(--mv-bg-primary, #06060a);font-size:11px;color:var(--mv-text-faint, #555);flex-shrink:0}.status-item{display:flex;align-items:center;gap:5px}.status-item.accent{color:var(--mv-accent)}.status-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.status-dot.saved{background:var(--mv-success, #4caf50)}.status-dot.saving{background:var(--mv-warning, #ff9800)}.status-dot.unsaved{background:var(--mv-text-faint, #555)}.status-spacer{flex:1}.genre-selector{display:flex;align-items:center;gap:4px}.genre-pill{display:flex;align-items:center;gap:5px;padding:4px 10px;background:transparent;border:1px solid var(--mv-border-light, #ffffff10);border-radius:20px;color:var(--mv-text-muted, #888);font-family:var(--mv-font-body, "Inter", sans-serif);font-size:11px;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.genre-pill:hover{border-color:var(--mv-border-active, #ffffff25);color:var(--mv-text-secondary, #ccc)}.genre-pill.active{border-color:var(--mv-accent);color:var(--mv-accent);background:var(--mv-accent-dim)}.genre-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.theme-switcher{display:flex;align-items:center;margin-left:8px}.theme-select{appearance:none;-webkit-appearance:none;background:var(--mv-bg-hover-subtle, #ffffff06);border:1px solid var(--mv-border-light, #ffffff10);color:var(--mv-text-secondary, #ccc);font-family:var(--mv-font-body, "Inter", sans-serif);font-size:11px;font-weight:500;padding:5px 28px 5px 10px;border-radius:6px;cursor:pointer;outline:none;transition:all .2s;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 5l3 3 3-3' fill='none' stroke='%23888' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center}.theme-select:hover{border-color:var(--mv-border-hover, #ffffff15);color:var(--mv-text-primary, #e0e0e8)}.theme-select:focus{border-color:var(--mv-accent)}.theme-select option{background:var(--mv-bg-card, #12121a);color:var(--mv-text-primary, #e0e0e8)}.onboarding-overlay{position:fixed;inset:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.onboarding-card{background:var(--mv-bg-card, #12121a);border:1px solid var(--mv-border-medium, #ffffff12);border-radius:16px;padding:40px 48px;max-width:520px;width:90%;animation:slideUp .35s ease;box-shadow:var(--mv-shadow-card, none)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.onboarding-card h2{font-size:24px;font-weight:700;letter-spacing:2px;text-transform:uppercase;font-family:var(--mv-font-heading, "Inter", sans-serif);background:linear-gradient(135deg,var(--mv-gradient-start) 0%,var(--mv-gradient-end) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px}.onboarding-card .subtitle{font-size:13px;color:var(--mv-text-dim, #666);margin-bottom:28px}.onboarding-tips{display:flex;flex-direction:column;gap:16px;margin-bottom:32px}.onboarding-tip{display:flex;gap:14px;align-items:flex-start}.onboarding-tip-icon{font-size:20px;flex-shrink:0;width:32px;text-align:center}.onboarding-tip-text{font-size:13px;color:var(--mv-text-body, #aaa);line-height:1.6}.onboarding-tip-text strong{color:var(--mv-text-primary, #e0e0e8);font-weight:600}.onboarding-tip-text code{background:var(--mv-border-subtle, #ffffff0a);padding:1px 6px;border-radius:4px;font-family:var(--mv-font-mono, "JetBrains Mono", monospace);font-size:12px;color:var(--mv-accent)}.onboarding-start-btn{width:100%;padding:12px;background:linear-gradient(135deg,var(--mv-gradient-start) 0%,var(--mv-gradient-end) 100%);border:none;border-radius:8px;color:#fff;font-family:var(--mv-font-body, "Inter", sans-serif);font-size:14px;font-weight:600;letter-spacing:1px;cursor:pointer;transition:opacity .2s}.onboarding-start-btn:hover{opacity:.9}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--mv-scrollbar-thumb, #ffffff15);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--mv-scrollbar-thumb-hover, #ffffff25)}