@import url('./pages.css?v=2');
body { background: #f5f5f5; }
.app-main { max-width: 1280px; margin: 24px auto; padding: 0 20px; }.workspace { display: grid; grid-template-columns: 230px 1fr; min-height: calc(100vh - 110px); overflow: hidden; background: #fff; border: 1px solid #e8e8e8; border-radius: 10px; box-shadow: 0 2px 12px rgba(0,0,0,.04); }.sidebar { padding: 16px; background: #fafafa; border-right: 1px solid #eee; }.tabs { margin-top: 12px; }.note-tab { display: flex; align-items: center; gap: 7px; padding: 10px 8px; border-radius: 6px; cursor: pointer; }.note-tab:hover,.note-tab.active { background: #fef3c7; }.note-tab-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.note-tab button { border: 0; background: transparent; cursor: pointer; color: #777; }.editor { min-width: 0; display: flex; flex-direction: column; }.editor-header,.markdown-toolbar { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; padding: 10px 14px; border-bottom: 1px solid #eee; }.note-title { flex: 1; min-width: 180px; border: 0; font-size: 18px; font-weight: 600; }.mode { display: flex; border: 1px solid #ddd; border-radius: 6px; overflow: hidden; }.mode button,.markdown-toolbar button { height: 30px; padding: 0 8px; border: 0; background: #fff; cursor: pointer; }.mode button.active,.markdown-toolbar button:hover { background: #fef3c7; }.markdown-toolbar { background: #fffdf5; }.divider { width: 1px; height: 20px; background: #ddd; }.editor-content { flex: 1; min-height: 520px; padding: 18px; }.editable-preview { min-height: 480px; outline: none; line-height: 1.75; }.editable-preview img { max-width: 100%; }.editable-preview table { border-collapse: collapse; }.editable-preview th,.editable-preview td { border: 1px solid #ddd; padding: 6px; }.lines { width: 100%; min-height: 500px; resize: vertical; border: 0; outline: none; line-height: 1.75; }.status { color: #999; font-size: 13px; }.overlay { position: fixed; inset: 0; z-index: 20; display: grid; place-items: center; background: rgba(255,255,255,.45); }.overlay[hidden] { display: none; }.overlay div { padding: 12px 18px; background: #fff; border-radius: 9px; box-shadow: 0 10px 30px rgba(0,0,0,.16); }.dialog { position: fixed; z-index: 30; inset: 0; display: grid; place-items: center; background: rgba(0,0,0,.42); }.dialog[hidden] { display: none; }.dialog-card { width: min(420px,calc(100% - 32px)); padding: 24px; background: #fff; border-radius: 12px; }.dialog-card h2 { margin: 0 0 14px; }.dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; }.toast { position: fixed; right: 20px; bottom: 20px; z-index: 40; padding: 10px 14px; color: #fff; background: #333; border-radius: 7px; } @media(max-width:720px){.workspace{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid #eee}.editor-content{min-height:360px}.page-nav{padding:0 14px}.app-main{padding:0 10px}}
.editable-preview .task-list-item { list-style: none; margin-left: -20px; }.editable-preview .task-list-item input { margin-right: 8px; accent-color: #3b82f6; cursor: pointer; }
.tabs[aria-busy="true"] { pointer-events: none; }.tab-skeleton { height: 38px; margin: 7px 0; border-radius: 6px; background: linear-gradient(90deg,#eee 25%,#f8f8f8 37%,#eee 63%); background-size: 400% 100%; animation: shimmer 1.3s infinite; }.empty-action { display: grid; place-items: center; min-height: 420px; color: #777; text-align: center; }.empty-action p { margin: 8px 0 18px; }.status.saving { color: #b7791f; }.status.error { color: #dc2626; }.status.conflict { color: #c2410c; }.toast.success { background: #15803d; }.toast.error { background: #b91c1c; }.toast.info { background: #374151; } @keyframes shimmer { to { background-position: -400% 0; } } @media(max-width:720px){.page-actions span{display:none}.page-actions{gap:5px}.page-actions a,.page-actions button{padding:6px 8px}.markdown-toolbar{max-height:78px;overflow:auto}.note-title{font-size:16px}.editor-header{position:sticky;top:0;background:#fff;z-index:2}}

/* 主工作区细节优化 */
.app-main { margin-top: 28px; }.workspace { border-color: var(--line); border-radius: 14px; box-shadow: 0 10px 30px rgba(16,24,40,.05); }.sidebar { padding: 18px 12px; background: #fbfcfe; }.sidebar > .primary { width: 100%; }.tabs { margin-top: 16px; }.note-tab { gap: 8px; margin: 2px 0; padding: 10px; color: #475467; transition: background .16s ease, color .16s ease; }.note-tab:hover { background: #f2f4f7; }.note-tab.active { color: #3730a3; background: var(--primary-soft); font-weight: 600; }.note-tab button { opacity: 0; color: #667085; transition: opacity .16s ease, color .16s ease; }.note-tab:hover button, .note-tab.active button { opacity: 1; }.note-tab button:hover { color: var(--danger); }.editor-header { min-height: 64px; padding: 12px 20px; }.note-title { border-radius: 7px; }.note-title:focus { box-shadow: none; background: #f8faff; }.mode { border-color: var(--line); border-radius: 8px; }.mode button, .markdown-toolbar button { border-radius: 6px; color: #475467; font-weight: 500; }.mode button.active, .markdown-toolbar button:hover { color: #3730a3; background: var(--primary-soft); }.markdown-toolbar { gap: 5px; padding: 9px 20px; background: #fbfcfe; border-color: var(--line); }.divider { background: var(--line); }.editor-content { padding: 24px 28px; }.editable-preview { color: #263341; font-size: 15px; }.editable-preview h1,.editable-preview h2,.editable-preview h3,.editable-preview h4 { color: #182230; letter-spacing: -.25px; }.editable-preview blockquote { margin-left: 0; padding-left: 14px; color: #667085; border-left: 3px solid #c7d2fe; }.editable-preview pre { padding: 14px; border-radius: 8px; background: #f6f8fb; }.status { padding: 5px 8px; border-radius: 6px; background: #f2f4f7; }.overlay { backdrop-filter: blur(2px); }.overlay div { color: #344054; border: 1px solid var(--line); }.dialog-card { border: 1px solid var(--line); }.toast { border-radius: 9px; box-shadow: 0 8px 20px rgba(16,24,40,.18); }

body { min-height: 100vh; }.app-main { max-width: none; margin: 0; padding: 0; }.workspace { min-height: 100vh; border: 0; border-radius: 0; box-shadow: none; }.sidebar { position: relative; display: flex; flex-direction: column; min-height: 100vh; padding: 18px 12px; }.sidebar-brand { display: flex; align-items: center; gap: 8px; padding: 4px 6px 18px; color: var(--text); font-size: 17px; font-weight: 700; }.sidebar-brand img { border-radius: 7px; }.sidebar-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line); }.settings-button { display: flex; align-items: center; gap: 8px; width: 100%; padding: 10px; border: 0; border-radius: 8px; color: #475467; background: transparent; cursor: pointer; text-align: left; font-weight: 600; }.settings-button:hover { color: #3730a3; background: var(--primary-soft); }.settings-card { width: min(380px,calc(100% - 32px)); }.settings-heading { display: flex; align-items: center; gap: 12px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }.settings-heading h2 { margin: 0; font-size: 18px; }.settings-avatar { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 50%; color: #4338ca; background: var(--primary-soft); font-size: 22px; }.settings-links { display: grid; gap: 4px; padding: 16px 0; }.settings-links a { padding: 11px 10px; border-radius: 8px; color: #344054; text-decoration: none; font-weight: 600; }.settings-links a:hover { color: #3730a3; background: var(--primary-soft); }

.sidebar-footer { position: relative; }.settings-popover { position: absolute; right: 0; bottom: 58px; left: 0; z-index: 5; padding: 8px; border: 1px solid var(--line); border-radius: 11px; background: #fff; box-shadow: 0 14px 32px rgba(16,24,40,.16); }.settings-popover[hidden] { display: none; }.settings-user { display: flex; align-items: center; gap: 9px; padding: 8px 8px 11px; margin-bottom: 5px; border-bottom: 1px solid var(--line); color: #344054; font-size: 13px; font-weight: 700; }.settings-popover .settings-avatar { width: 28px; height: 28px; font-size: 15px; }.settings-popover button { width: 100%; padding: 9px 8px; border: 0; border-radius: 7px; color: #475467; background: transparent; cursor: pointer; text-align: left; font-weight: 600; }.settings-popover button:hover { color: #3730a3; background: var(--primary-soft); }.settings-popover .settings-logout { margin-top: 5px; color: var(--danger); border-top: 1px solid var(--line); }.workspace-panel { padding: 24px; }.workspace-panel-card { position: relative; width: min(1160px,100%); height: min(820px,calc(100vh - 48px)); overflow: hidden; border-radius: 14px; background: var(--bg); box-shadow: 0 24px 64px rgba(16,24,40,.28); }.workspace-panel iframe { width: 100%; height: 100%; border: 0; }.panel-close { position: absolute; z-index: 2; top: 12px; right: 12px; display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line); border-radius: 8px; color: #475467; background: rgba(255,255,255,.94); cursor: pointer; font-size: 20px; }.panel-close:hover { color: var(--danger); background: #fff1f2; } @media(max-width:720px){.workspace-panel{padding:0}.workspace-panel-card{width:100%;height:100vh;border-radius:0}.settings-popover{position:fixed;right:12px;bottom:64px;left:12px}.sidebar-footer{position:static}}

/* 安静、专注的主页画布 */
body { background: #f3f5f9; }.app-main { padding: 16px; }.workspace { grid-template-columns: 252px minmax(0,1fr); min-height: calc(100vh - 32px); overflow: hidden; border: 1px solid #e6e9f0; border-radius: 20px; background: #f8f9fc; box-shadow: 0 18px 50px rgba(16,24,40,.08); }.sidebar { min-height: calc(100vh - 32px); padding: 22px 14px 14px; background: #fff; border-right: 1px solid #edf0f5; }.sidebar-brand { padding: 2px 8px 26px; font-size: 18px; letter-spacing: -.35px; }.sidebar > .primary { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 42px; border-radius: 10px; font-size: 14px; box-shadow: 0 7px 14px rgba(79,70,229,.18); }.sidebar > .primary span { font-size: 19px; font-weight: 400; line-height: 1; }.sidebar-section-title { padding: 24px 8px 8px; color: #98a2b3; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.tabs { margin-top: 0; padding: 0 2px; }.note-tab { min-height: 42px; margin: 3px 0; padding: 10px 9px; border-radius: 9px; font-size: 14px; }.note-tab.active { box-shadow: inset 3px 0 0 var(--primary); }.note-tab-title { line-height: 1.2; }.sidebar-footer { padding: 14px 2px 0; }.settings-button { padding: 11px 9px; font-size: 14px; }.editor { background: #f8f9fc; }.editor-header { gap: 12px; min-height: 78px; padding: 18px clamp(24px,4vw,48px); border: 0; background: transparent; }.note-title { max-width: 620px; padding: 8px 10px; color: #182230; background: transparent; font-size: 22px; letter-spacing: -.45px; }.note-title:hover { background: #fff; }.note-title:focus { background: #fff; box-shadow: 0 0 0 4px rgba(79,70,229,.1); }.mode { margin-left: auto; background: #fff; box-shadow: 0 1px 2px rgba(16,24,40,.04); }.status { background: transparent; color: #98a2b3; font-size: 12px; }.markdown-toolbar { max-width: min(900px,calc(100% - 48px)); margin: 0 auto 10px; padding: 7px 10px; border: 1px solid #e7eaf0; border-radius: 10px; background: rgba(255,255,255,.78); box-shadow: 0 2px 6px rgba(16,24,40,.03); }.editor-content { display: flex; min-height: 0; padding: 10px clamp(24px,4vw,48px) 40px; overflow: auto; }.editor-content > .editable-preview, .editor-content > .lines, .editor-content > .empty-action { width: min(900px,100%); min-height: calc(100vh - 200px); margin: 0 auto; padding: clamp(26px,4vw,48px); border: 1px solid #e8ebf1; border-radius: 16px; background: #fff; box-shadow: 0 5px 18px rgba(16,24,40,.035); }.editor-content > .lines { color: #263341; font-size: 15px; }.editable-preview { font-size: 16px; line-height: 1.85; }.editable-preview h1,.editable-preview h2,.editable-preview h3,.editable-preview h4 { margin-top: 1.5em; }.editable-preview h1:first-child,.editable-preview h2:first-child { margin-top: 0; }.empty-action { display: grid; place-items: center; }.empty-action strong { color: #344054; font-size: 18px; }.empty-action .primary { margin-top: 6px; }.overlay { background: rgba(248,249,252,.62); } @media(max-width:720px){.app-main{padding:0}.workspace{grid-template-columns:1fr;min-height:100vh;border:0;border-radius:0}.sidebar{min-height:auto;padding:16px;border-bottom:1px solid #edf0f5}.sidebar-brand{padding-bottom:14px}.sidebar-section-title{padding-top:16px}.tabs{display:flex;overflow:auto}.note-tab{flex:0 0 150px}.sidebar-footer{display:none}.editor-header{min-height:64px;padding:12px 16px}.note-title{font-size:18px}.markdown-toolbar{max-width:calc(100% - 32px)}.editor-content{padding:6px 16px 24px}.editor-content > .editable-preview,.editor-content > .lines,.editor-content > .empty-action{min-height:calc(100vh - 260px);padding:24px 20px;border-radius:12px}}

/* Milkdown 编辑器宽度 */
.editor-content > .milkdown-container { width: calc(100% - 30px);height: calc(100% );margin: 0 auto; }
.editor-content > .milkdown-container .milkdown { width: calc(100% + 10px); }
.editor-content > .milkdown-container .milkdown-top-bar { max-width: 100%; }
