:root{--bg:#fff;--bg-subtle:#f7f7f5;--surface:#fff;--surface-hover:#f1f1ef;--border:#e8e8e4;--border-strong:#d8d8d2;--text:#1a1a1a;--text-muted:#6b6b66;--text-faint:#9a9a94;--accent:#2f6fed;--accent-hover:#245ad0;--accent-soft:#eaf1ff;--danger:#d64545;--radius:10px;--radius-sm:6px;--shadow-sm:0 1px 2px #0000000a;--shadow-md:0 4px 16px #00000014;--sidebar-w:260px}@media (prefers-color-scheme:dark){:root{--bg:#1a1a19;--bg-subtle:#202020;--surface:#242423;--surface-hover:#2e2e2c;--border:#34342f;--border-strong:#414139;--text:#ededea;--text-muted:#a3a39c;--text-faint:#6f6f68;--accent:#5b8dff;--accent-hover:#6f9bff;--accent-soft:#23324f;--danger:#ff6b6b;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 6px 20px #00000073}}*{box-sizing:border-box}html,body,#root{height:100%}body{color:var(--text);background:var(--bg-subtle);-webkit-font-smoothing:antialiased;margin:0;font-family:system-ui,-apple-system,Segoe UI,Hiragino Kaku Gothic ProN,Noto Sans JP,sans-serif;line-height:1.6}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:none}a{color:inherit;text-decoration:none}.btn{border-radius:var(--radius-sm);border:1px solid var(--border-strong);background:var(--surface);color:var(--text);align-items:center;gap:.5rem;padding:.5rem .9rem;font-size:.9rem;font-weight:500;transition:background .12s,border-color .12s,transform 50ms;display:inline-flex}.btn:hover{background:var(--surface-hover)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.55;cursor:default}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-ghost{color:var(--text-muted);background:0 0;border-color:#0000}.btn-ghost:hover{background:var(--surface-hover);color:var(--text)}.app-shell{grid-template-columns:var(--sidebar-w) 1fr;min-height:100%;display:grid}.sidebar{border-right:1px solid var(--border);background:var(--bg);flex-direction:column;gap:1.25rem;padding:1.25rem .75rem;display:flex}.brand{letter-spacing:.02em;align-items:center;gap:.55rem;padding:.25rem .5rem;font-size:1.05rem;font-weight:700;display:flex}.brand-mark{background:var(--accent);color:#fff;border-radius:7px;place-items:center;width:26px;height:26px;font-size:.85rem;font-weight:700;display:grid}.nav-list{flex-direction:column;gap:.15rem;display:flex}.nav-label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-faint);margin-bottom:.35rem;padding:0 .6rem;font-size:.72rem}.nav-item{border-radius:var(--radius-sm);color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:.55rem;padding:.4rem .6rem;font-size:.9rem;display:flex;overflow:hidden}.nav-item:hover{background:var(--surface-hover);color:var(--text)}.nav-item .dot{background:var(--text-faint);border-radius:50%;flex-shrink:0;width:6px;height:6px}.content{width:100%;max-width:860px;padding:3rem clamp(1.25rem,5vw,4rem)}.page-head{margin-bottom:2rem}.page-head h1{letter-spacing:-.01em;margin:0 0 .4rem;font-size:1.9rem}.page-head p{color:var(--text-muted);margin:0}.toolbar-row{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.section-title{text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);font-size:.8rem;font-weight:600}.doc-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.9rem;display:grid}.doc-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow-sm);flex-direction:column;gap:.65rem;padding:1rem;transition:border-color .12s,box-shadow .12s,transform 80ms;display:flex}.doc-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px)}.doc-card-icon{background:var(--accent-soft);width:34px;height:34px;color:var(--accent);border-radius:8px;place-items:center;font-size:1rem;display:grid}.doc-card-title{text-overflow:ellipsis;white-space:nowrap;font-size:.95rem;font-weight:600;overflow:hidden}.doc-card-meta{color:var(--text-faint);font-size:.8rem}.empty{border:1px dashed var(--border-strong);border-radius:var(--radius);text-align:center;color:var(--text-muted);background:var(--bg);padding:2.5rem 1.5rem}.empty-emoji{margin-bottom:.5rem;font-size:1.8rem}.alert{border-radius:var(--radius-sm);background:color-mix(in srgb, var(--danger) 12%, transparent);color:var(--danger);margin-top:1rem;padding:.6rem .8rem;font-size:.88rem}.editor-shell{background:var(--bg);flex-direction:column;min-height:100%;display:flex}.editor-bar{z-index:5;border-bottom:1px solid var(--border);background:color-mix(in srgb, var(--bg) 85%, transparent);-webkit-backdrop-filter:saturate(180%)blur(8px);backdrop-filter:saturate(180%)blur(8px);justify-content:space-between;align-items:center;gap:1rem;padding:.7rem clamp(1rem,4vw,2rem);display:flex;position:sticky;top:0}.editor-bar-left,.editor-bar-right{align-items:center;gap:.75rem;display:flex}.back-link{color:var(--text-muted);border-radius:var(--radius-sm);align-items:center;gap:.35rem;padding:.35rem .5rem;font-size:.9rem;display:inline-flex}.back-link:hover{background:var(--surface-hover);color:var(--text)}.presence{color:var(--text-muted);align-items:center;gap:.45rem;font-size:.85rem;display:flex}.presence-avatars{display:flex}.presence-avatars .avatar{border:2px solid var(--bg);color:#fff;border-radius:50%;place-items:center;width:22px;height:22px;margin-left:-7px;font-size:.65rem;font-weight:600;display:grid}.presence-avatars .avatar:first-child{margin-left:0}.live-badge{align-items:center;gap:.35rem;display:inline-flex}.live-dot{background:#37c871;border-radius:50%;width:7px;height:7px;animation:2s infinite pulse;box-shadow:0 0 #37c87199}@keyframes pulse{0%{box-shadow:0 0 #37c8718c}70%{box-shadow:0 0 0 6px #37c87100}to{box-shadow:0 0 #37c87100}}.editor-canvas{flex:1;width:100%;max-width:780px;margin:0 auto;padding:2.5rem clamp(1rem,4vw,2rem) 4rem}.editor-canvas .cm-editor{outline:none;font-size:1.02rem;line-height:1.75}.editor-canvas .cm-editor.cm-focused{outline:none}.editor-canvas .cm-gutters{color:var(--text-faint);background:0 0;border:none}.editor-canvas .cm-content{caret-color:var(--accent);font-family:SFMono-Regular,Menlo,Consolas,ui-monospace,monospace}.toast{color:var(--text-muted);font-size:.85rem}@media (width<=720px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.content{padding:2rem 1.25rem}}