:root {
  color-scheme: light;
  --bg: #edf6fb;
  --surface: rgba(255, 255, 255, .84);
  --surface-solid: #fff;
  --panel: #f7fbfd;
  --text: #20323c;
  --muted: #73828a;
  --line: rgba(48, 91, 111, .12);
  --accent: #347e9b;
  --accent-2: #71b4c4;
  --soft: #e1f1f6;
  --shadow: 0 24px 70px rgba(50, 93, 112, .14);
}

html[data-theme="jade"] { --bg:#eef7f2; --surface:rgba(255,255,255,.86); --panel:#f6fbf8; --text:#20372f; --muted:#72847c; --line:rgba(34,103,76,.12); --accent:#2d8666; --accent-2:#73baa0; --soft:#def2e9; --shadow:0 24px 70px rgba(44,101,79,.13); }
html[data-theme="sunset"] { --bg:#fff3eb; --surface:rgba(255,255,255,.87); --panel:#fffaf6; --text:#49312c; --muted:#937b72; --line:rgba(140,72,50,.12); --accent:#c46449; --accent-2:#dc9b73; --soft:#fae5d8; --shadow:0 24px 70px rgba(145,76,53,.13); }
html[data-theme="graphite"] { color-scheme:dark; --bg:#17191d; --surface:rgba(35,38,44,.9); --surface-solid:#25282e; --panel:#202329; --text:#edf0f2; --muted:#a0a8ad; --line:rgba(255,255,255,.1); --accent:#76b8cc; --accent-2:#9bcbd6; --soft:#293d45; --shadow:0 28px 80px rgba(0,0,0,.4); }

* { box-sizing: border-box; }
body { margin:0; min-width:0; min-height:100vh; overflow-x:hidden; background:var(--bg); color:var(--text); font-family:"Segoe UI","Microsoft YaHei",system-ui,sans-serif; transition:background .25s,color .25s; }
button,textarea { font:inherit; }
button { color:inherit; }
.ambient { position:fixed; width:520px; height:520px; border-radius:50%; filter:blur(80px); opacity:.3; pointer-events:none; }
.ambient-one { left:-220px; top:-240px; background:var(--accent-2); }
.ambient-two { right:-260px; bottom:-310px; background:var(--accent); opacity:.17; }
.app-shell { width:min(1480px,calc(100% - 40px)); height:calc(100vh - 40px); min-height:680px; margin:20px auto; background:var(--surface); border:1px solid rgba(255,255,255,.48); border-radius:24px; box-shadow:var(--shadow); backdrop-filter:blur(24px); overflow:hidden; position:relative; }
.topbar { height:72px; display:flex; align-items:center; justify-content:space-between; padding:0 24px; border-bottom:1px solid var(--line); }
.brand { display:flex; gap:11px; align-items:center; text-decoration:none; color:inherit; }
.brand-mark { width:38px; height:38px; border-radius:12px; display:grid; place-items:center; color:white; background:linear-gradient(145deg,var(--accent),var(--accent-2)); box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 25%,transparent); }
.brand-mark svg { width:27px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.brand b { display:block; font-size:16px; letter-spacing:.02em; }
.brand small { display:block; color:var(--muted); margin-top:1px; font-size:11px; }
.top-actions { display:flex; gap:9px; align-items:center; }
.privacy-pill { font-size:12px; color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:7px 11px; background:color-mix(in srgb,var(--surface-solid) 65%,transparent); }
.privacy-pill i { display:inline-block; width:7px; height:7px; border-radius:50%; background:#4aa276; margin-right:6px; box-shadow:0 0 0 3px rgba(74,162,118,.12); }
.icon-button,.theme-button { height:36px; border:1px solid var(--line); background:var(--surface-solid); border-radius:10px; cursor:pointer; }
.icon-button { width:36px; padding:8px; }
.icon-button svg { width:19px; fill:none; stroke:currentColor; stroke-width:1.7; }
.theme-wrap { position:relative; }
.theme-button { display:flex; align-items:center; gap:7px; padding:0 10px; font-size:12px; }
.theme-button svg { width:14px; fill:none; stroke:currentColor; stroke-width:1.8; }
.theme-dot { width:10px; height:10px; background:var(--accent); border-radius:50%; box-shadow:0 0 0 3px var(--soft); }
.theme-menu { position:absolute; z-index:10; top:44px; right:0; width:184px; padding:7px; border:1px solid var(--line); border-radius:14px; background:var(--surface-solid); box-shadow:0 18px 46px rgba(20,30,35,.18); }
.theme-menu[hidden] { display:none; }
.theme-menu button { width:100%; border:0; background:transparent; border-radius:9px; display:flex; align-items:center; gap:10px; padding:9px; text-align:left; cursor:pointer; }
.theme-menu button:hover { background:var(--soft); }
.theme-menu b,.theme-menu small { display:block; }
.theme-menu b { font-size:12px; }.theme-menu small { font-size:10px; color:var(--muted); margin-top:2px; }
.swatch { width:24px; height:24px; border-radius:8px; box-shadow:inset 0 0 0 1px rgba(0,0,0,.06); }.swatch.sky{background:#cde8f2}.swatch.jade{background:#d0eadc}.swatch.sunset{background:#f4d6c6}.swatch.graphite{background:#17191d}
.workspace { height:calc(100% - 72px); display:grid; grid-template-columns:220px minmax(360px,1fr) minmax(390px,500px); }
.note-rail { border-right:1px solid var(--line); padding:24px 16px; background:color-mix(in srgb,var(--panel) 75%,transparent); display:flex; flex-direction:column; }
.rail-heading { display:flex; justify-content:space-between; align-items:center; padding:0 8px 14px; color:var(--muted); font-size:12px; letter-spacing:.08em; }
.rail-heading button,.chat-actions button { border:0; background:transparent; cursor:pointer; color:var(--muted); font-size:19px; }
.note-link { width:100%; border:0; background:transparent; border-radius:13px; padding:10px 9px; display:flex; gap:10px; align-items:center; text-align:left; cursor:pointer; margin-bottom:4px; }
.note-link.active { background:var(--surface-solid); box-shadow:0 6px 18px color-mix(in srgb,var(--accent) 8%,transparent); }
.note-link:hover { background:var(--soft); }
.note-link b,.note-link small { display:block; }.note-link b { font-size:13px; font-weight:600; }.note-link small { color:var(--muted); margin-top:4px; font-size:10px; }
.note-icon { width:31px; height:31px; display:grid; place-items:center; flex:none; border-radius:9px; color:#397993; background:#d9edf4; font-family:serif; }.note-icon.violet{background:#ece5f5;color:#775e96}.note-icon.amber{background:#faead5;color:#9b7042}
.rail-quote { margin:auto 8px 4px; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font:12px/1.8 Georgia,"Songti SC",serif; }
.note-canvas { padding:48px clamp(34px,5vw,78px); overflow:auto; }
.note-meta { display:flex; gap:12px; color:var(--muted); font-size:11px; }.note-meta span:first-child { color:var(--accent); background:var(--soft); border-radius:999px; padding:4px 9px; }
.note-canvas h1 { font:600 clamp(30px,3vw,44px)/1.2 Georgia,"Songti SC",serif; margin:22px 0 24px; letter-spacing:.02em; }
.note-canvas h2 { margin:36px 0 14px; font:600 20px Georgia,"Songti SC",serif; }
.note-canvas p { font:15px/2 Georgia,"Songti SC",serif; color:color-mix(in srgb,var(--text) 86%,var(--muted)); max-width:680px; }
.note-canvas .lead { font-size:17px; line-height:2.1; }
.note-canvas blockquote { margin:28px 0; padding:10px 0 10px 22px; border-left:2px solid var(--accent-2); color:var(--accent); font:italic 16px/1.8 Georgia,"Songti SC",serif; }
.note-tags { display:flex; gap:8px; margin-top:30px; }.note-tags span { padding:5px 9px; background:var(--soft); color:var(--accent); border-radius:7px; font-size:11px; }
.chat-panel { border-left:1px solid var(--line); background:var(--panel); display:flex; flex-direction:column; min-height:0; }
.chat-head { height:78px; display:flex; justify-content:space-between; align-items:center; padding:0 20px; border-bottom:1px solid var(--line); }
.chat-head small { color:var(--muted); font-size:10px; letter-spacing:.08em; }.chat-head h2 { margin:3px 0 0; font:600 18px Georgia,"Songti SC",serif; }
.chat-actions { display:flex; gap:5px; }.chat-actions button { width:31px; height:31px; border-radius:9px; }.chat-actions button:hover { background:var(--soft); }
.context-line { margin:12px 16px 0; padding:9px 11px; border:1px solid var(--line); background:var(--surface-solid); border-radius:10px; font-size:11px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.context-line b { color:var(--text); font-weight:500; }.context-line button { float:right; border:0; background:transparent; color:var(--accent); font-size:11px; cursor:pointer; }.pulse { display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--accent-2); margin-right:6px; }
.messages { padding:22px 18px; overflow:auto; flex:1; }
.message { font-size:13px; line-height:1.75; margin-bottom:20px; }.message p { margin:0 0 8px; }
.message.user { margin-left:44px; padding:12px 15px; border-radius:14px 14px 4px 14px; background:var(--soft); }
.message.assistant { display:grid; grid-template-columns:28px 1fr; gap:10px; }.muse-avatar { width:28px; height:28px; border-radius:9px; display:grid; place-items:center; background:linear-gradient(145deg,var(--accent),var(--accent-2)); color:#fff; font:13px serif; }
.message ol { padding-left:20px; margin:7px 0 9px; }.message li { margin:4px 0; }.proposal { border:1px solid var(--line); background:var(--surface-solid); border-radius:10px; padding:9px 10px; cursor:pointer; color:var(--accent); box-shadow:0 5px 13px rgba(20,50,60,.05); }.proposal small { color:var(--muted); margin-left:7px; }
.composer-wrap { margin:0 15px 15px; border:1px solid var(--line); border-radius:15px; background:var(--surface-solid); box-shadow:0 9px 28px color-mix(in srgb,var(--accent) 8%,transparent); }.chips { padding:9px 10px 0; display:flex; gap:5px; }.chips button { border:0; background:var(--soft); color:var(--accent); border-radius:7px; padding:5px 7px; font-size:10px; cursor:pointer; }.chips button:last-child { background:transparent; color:var(--muted); }
.composer { display:flex; align-items:flex-end; padding:6px 8px; }.composer textarea { width:100%; resize:none; border:0; outline:0; background:transparent; color:var(--text); padding:8px; line-height:1.5; }.composer textarea::placeholder{color:var(--muted)}.composer>button { width:34px; height:34px; border:0; border-radius:10px; background:var(--accent); color:white; display:grid; place-items:center; cursor:pointer; }.composer svg { width:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.composer-meta { display:flex; justify-content:space-between; padding:0 12px 9px; font-size:9px; color:var(--muted); }
dialog { width:min(480px,calc(100% - 32px)); border:1px solid var(--line); border-radius:18px; padding:28px; background:var(--surface-solid); color:var(--text); box-shadow:0 30px 90px rgba(0,0,0,.25); }dialog::backdrop{background:rgba(18,25,28,.42);backdrop-filter:blur(4px)}.modal-close{position:absolute;right:15px;top:12px;border:0;background:transparent;color:var(--muted);font-size:24px;cursor:pointer}dialog h3{font:600 22px Georgia,"Songti SC",serif;margin:0 0 14px}dialog p{color:var(--muted);font-size:13px;line-height:1.75}.diff{margin-top:14px;border:1px solid var(--line);border-radius:11px;overflow:hidden;font:12px/1.65 ui-monospace,monospace}.diff div{padding:5px 10px}.diff .minus{background:rgba(190,79,70,.1);color:#b05850}.diff .plus{background:rgba(57,145,99,.12);color:#398a60}
.toast { position:fixed; left:50%; bottom:30px; transform:translateX(-50%); background:var(--text); color:var(--bg); border-radius:999px; padding:10px 16px; font-size:12px; box-shadow:var(--shadow); z-index:30; }
@media (max-width:1050px){.workspace{grid-template-columns:190px 1fr 410px}.note-canvas{padding:42px 28px}.note-canvas .lead{font-size:15px}}
@media (max-width:820px){.app-shell{width:100%;height:100vh;min-height:0;margin:0;border-radius:0;border:0}.workspace{grid-template-columns:1fr}.note-rail,.note-canvas{display:none}.chat-panel{border:0}.privacy-pill{display:none}.topbar{height:64px;padding:0 14px}.workspace{height:calc(100% - 64px)}.theme-label{display:none}.theme-button{padding:0 9px}.messages{padding-top:18px}.message.user{margin-left:26px}}
@media (max-width:420px){.icon-button{display:none}.theme-menu{position:fixed;right:12px;top:58px}.context-line{margin-inline:11px}.messages{padding-inline:12px}.composer-wrap{margin:0 10px 10px}.composer-meta span:last-child{display:none}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}