:root{color-scheme:light;font-family:IBM Plex Sans,Segoe UI,sans-serif;line-height:1.5;font-weight:400;--bg: #f6efe4;--panel: rgba(255, 252, 245, .82);--panel-strong: #fffdf8;--panel-border: rgba(69, 45, 19, .14);--text: #2f2418;--muted: #7c6856;--accent: #c95b2f;--accent-deep: #8d3413;--accent-soft: rgba(201, 91, 47, .12);--shadow: 0 24px 70px rgba(104, 67, 23, .12);--grid: linear-gradient( rgba(82, 54, 20, .045) 1px, transparent 1px ), linear-gradient(90deg, rgba(82, 54, 20, .045) 1px, transparent 1px)}:root[data-theme=light]{--bg: #eef3f7;--panel: rgba(255, 255, 255, .84);--panel-strong: #ffffff;--panel-border: rgba(28, 56, 84, .12);--text: #18283a;--muted: #57708a;--accent: #2274a5;--accent-deep: #164d70;--accent-soft: rgba(34, 116, 165, .12);--shadow: 0 24px 70px rgba(36, 68, 99, .12);--grid: linear-gradient( rgba(20, 54, 92, .045) 1px, transparent 1px ), linear-gradient(90deg, rgba(20, 54, 92, .045) 1px, transparent 1px)}:root[data-theme=dark]{color-scheme:dark;--bg: #10161d;--panel: rgba(24, 33, 43, .88);--panel-strong: #1b2430;--panel-border: rgba(167, 194, 212, .14);--text: #edf3f8;--muted: #9eb4c6;--accent: #ff8c42;--accent-deep: #ffc48c;--accent-soft: rgba(255, 140, 66, .12);--shadow: 0 24px 70px rgba(0, 0, 0, .32);--grid: linear-gradient( rgba(214, 230, 243, .04) 1px, transparent 1px ), linear-gradient(90deg, rgba(214, 230, 243, .04) 1px, transparent 1px)}*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;color:var(--text);background:radial-gradient(circle at top right,color-mix(in srgb,var(--accent) 24%,transparent),transparent 30%),radial-gradient(circle at left center,color-mix(in srgb,var(--accent-deep) 16%,transparent),transparent 28%),var(--bg)}body:before{position:fixed;inset:0;background-image:var(--grid);background-size:28px 28px;content:"";opacity:.55;pointer-events:none}body.is-dragging-file{cursor:copy}body.is-resizing,body.is-resizing *{cursor:col-resize!important;-webkit-user-select:none!important;user-select:none!important}button,textarea,input{font:inherit}[hidden]{display:none!important}.app-shell{position:relative;width:min(1440px,calc(100vw - 32px));margin:0 auto;padding:28px 0 32px}.panel-kicker{margin:0 0 8px;color:var(--accent-deep);font-size:.82rem;letter-spacing:.12em;text-transform:uppercase}.app-brand h1,.panel-head h2{margin:0;font-family:Space Grotesk,IBM Plex Sans,sans-serif;font-weight:700;letter-spacing:-.03em}.app-header{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:18px;padding:16px 18px;border:1px solid var(--panel-border);border-radius:22px;background:#fffcf5bd;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--shadow)}.app-brand{display:grid;gap:4px}.app-brand h1{font-size:1.2rem;line-height:1.1}.app-brand p{margin:0;color:var(--muted);font-size:.95rem}.app-summary,.app-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.panel{border:1px solid var(--panel-border);border-radius:28px;background:var(--panel);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--shadow)}.workspace{--editor-width: 43%;display:grid;grid-template-columns:minmax(320px,var(--editor-width)) 16px minmax(420px,1fr);gap:0;align-items:stretch;min-height:calc(100vh - 112px)}.panel{display:flex;flex-direction:column;min-height:0;overflow:hidden}.panel:fullscreen{width:100vw;height:100vh;border-radius:0;border:0;margin:0;background:#fffdf8}.panel:fullscreen .panel-head{padding:18px 24px 14px;background:#fffdf8f5}.panel:fullscreen .preview-toolbar{padding-inline:24px}.panel:fullscreen .preview-layout{min-height:0;height:100%}.panel-head{display:flex;justify-content:space-between;gap:12px;align-items:start;padding:20px 22px 16px;border-bottom:1px solid rgba(69,45,19,.08)}.panel-actions,.preview-meta,.diagram-tools,.search-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}button{appearance:none;border:0;border-radius:999px;padding:10px 14px;background:var(--accent);color:#fffaf5;cursor:pointer;transition:transform .16s ease,background .16s ease,opacity .16s ease}button:hover{transform:translateY(-1px);background:#ab4720}button.ghost,.diagram-tools button,.outline-link{background:#452d1314;color:var(--text)}button.ghost:hover,.diagram-tools button:hover,.outline-link:hover{background:#452d1324}#render-status,#save-status,#search-status,#performance-status{padding:8px 12px;border-radius:999px;background:#2f241812;color:var(--muted);font-size:.9rem}.app-summary>span{padding:8px 12px;border-radius:999px;background:#2f241812;color:var(--muted);font-size:.9rem}#render-status[data-state=error]{background:#a124241a;color:#8a2121}#save-status[data-state=saving]{background:#c95b2f1a;color:var(--accent-deep)}.drop-zone{margin:18px 22px 0;padding:14px 16px;border:1px dashed rgba(69,45,19,.24);border-radius:18px;background:#fffdf899;color:var(--muted);transition:border-color .16s ease,background .16s ease,transform .16s ease}.drop-zone.is-active{border-color:var(--accent);background:#c95b2f14;transform:scale(.995)}.drop-zone p{margin:0}.editor-meta{display:flex;justify-content:space-between;gap:12px;padding:14px 22px 0;color:var(--muted);flex-wrap:wrap}.recent-panel{margin:16px 22px 0;padding:16px;border:1px solid rgba(69,45,19,.1);border-radius:20px;background:#fffdf88f}.recent-head{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:12px}.recent-list{display:grid;gap:8px}.recent-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:stretch}.recent-open{display:grid;gap:4px;justify-items:start;padding:12px 14px;border-radius:16px;background:#452d1314;color:var(--text);text-align:left}.recent-open span{color:var(--muted);font-size:.88rem}.recent-remove{align-self:center}.recent-empty{margin:0;color:var(--muted)}#markdown-input{flex:1;min-height:460px;padding:18px 22px 22px;border:0;background:transparent;color:var(--text);resize:none;outline:none;font-family:IBM Plex Mono,Cascadia Code,monospace;font-size:.97rem;line-height:1.65}.panel-resizer{display:flex;align-items:center;justify-content:center;cursor:col-resize}.panel-resizer span{width:6px;height:86px;border-radius:999px;background:#452d1324;transition:background .16s ease}.panel-resizer:hover span,body.is-resizing .panel-resizer span{background:#c95b2f8f}.preview-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px 18px;border-bottom:1px solid rgba(69,45,19,.08)}.search-box{display:grid;gap:6px;flex:1;min-width:0;color:var(--muted)}.search-box input{width:100%;min-width:0;padding:11px 14px;border:1px solid rgba(69,45,19,.16);border-radius:16px;background:#fffdf8bf;outline:none}.search-box input:focus{border-color:#c95b2f6b;box-shadow:0 0 0 3px #c95b2f14}.preview-layout{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:0;flex:1}.outline-panel{border-right:1px solid rgba(69,45,19,.08);padding:12px 12px 14px;overflow:auto;background:#fffdf880}.outline-head{display:flex;justify-content:space-between;gap:8px;align-items:center;position:sticky;top:0;z-index:1;margin-bottom:10px;padding:4px 2px 10px;background:linear-gradient(180deg,#fffdf8f5,#fffdf8cc);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.outline-title-group{display:flex;gap:8px;align-items:center}.outline-count{min-width:28px;padding:4px 8px;border-radius:999px;background:#452d1314;color:var(--muted);text-align:center;font-size:.82rem}.outline-nav{display:flex;flex-direction:column;gap:6px}.outline-link{width:100%;padding:0;border-radius:16px;text-align:left;font-size:.94rem;overflow:hidden}.outline-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px}.outline-serial{color:var(--muted);font-size:.8rem;font-variant-numeric:tabular-nums}.outline-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.outline-level-tag{padding:2px 8px;border-radius:999px;background:#452d1314;color:var(--muted);font-size:.74rem}.outline-link[data-level="2"]{margin-left:10px}.outline-link[data-level="3"],.outline-link[data-level="4"]{margin-left:22px}.outline-link.is-active{background:var(--accent-soft);color:var(--text);box-shadow:inset 3px 0 0 var(--accent)}.outline-link.is-active .outline-serial,.outline-link.is-active .outline-level-tag{color:var(--accent-deep)}.outline-empty{margin:0;padding:8px 4px;color:var(--muted)}.markdown-preview{min-height:0;overflow:auto;padding:22px}.markdown-preview>:first-child{margin-top:0}.markdown-preview h1,.markdown-preview h2,.markdown-preview h3{font-family:Space Grotesk,IBM Plex Sans,sans-serif;line-height:1.1}.markdown-preview p,.markdown-preview li{color:color-mix(in srgb,var(--text) 88%,transparent)}.markdown-preview code{padding:.18rem .38rem;border-radius:8px;background:#452d1314;font-family:IBM Plex Mono,Cascadia Code,monospace}.markdown-preview pre{overflow:auto;padding:16px;border-radius:20px;background:#452d1312}.markdown-preview pre code{padding:0;background:transparent}.search-hit{padding:.08em .2em;border-radius:.3em;background:#e9bc3673}.search-hit.is-active{background:#c95b2f4d;box-shadow:0 0 0 1px #c95b2f47}.diagram-card{margin:20px 0;border:1px solid rgba(69,45,19,.12);border-radius:24px;background:var(--panel-strong);overflow:hidden}.diagram-card:fullscreen{width:100vw;height:100vh;margin:0;border-radius:0}.diagram-toolbar{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px 16px;border-bottom:1px solid rgba(69,45,19,.08);background:#faf5ecf2}.diagram-title{font-weight:600}.diagram-tools{justify-content:flex-end}.diagram-stage{position:relative;height:min(62vh,560px);overflow:hidden;user-select:none;-webkit-user-select:none;background:linear-gradient(rgba(69,45,19,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(69,45,19,.06) 1px,transparent 1px),linear-gradient(180deg,#fffdf8,#f7f0e8);background-size:28px 28px,28px 28px,100% 100%}.diagram-placeholder{display:grid;place-items:center;gap:8px;height:100%;padding:24px;text-align:center;color:var(--muted)}.diagram-placeholder strong{color:var(--text)}.diagram-placeholder p{margin:0;max-width:34ch}.diagram-card:fullscreen .diagram-stage{height:calc(100vh - 58px)}.diagram-stage svg{width:100%;height:100%;cursor:grab;user-select:none;-webkit-user-select:none}.diagram-stage svg:active{cursor:grabbing}.diagram-stage .svg-pan-zoom_viewport{transition:transform .12s ease}.diagram-error,.empty-state{padding:26px;border-radius:24px;background:#452d130d;color:var(--muted)}.diagram-error pre,.empty-state pre{margin-top:12px}.zoom-indicator{min-width:54px;text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}.shortcuts-dialog{width:min(560px,calc(100vw - 24px));border:1px solid var(--panel-border);border-radius:24px;background:var(--panel-strong);color:var(--text);box-shadow:var(--shadow);padding:0}.shortcuts-dialog::backdrop{background:#10161d61;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.shortcuts-head{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:18px 20px 12px;border-bottom:1px solid rgba(69,45,19,.08)}.shortcuts-head h2{margin:0;font-family:Space Grotesk,IBM Plex Sans,sans-serif}.shortcuts-list{display:grid;gap:10px;padding:18px 20px 20px}.shortcuts-list div{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 12px;border-radius:16px;background:#452d130f}kbd{display:inline-flex;align-items:center;min-height:32px;padding:0 10px;border:1px solid rgba(69,45,19,.14);border-bottom-width:3px;border-radius:10px;background:#fffdf8cc;font-family:IBM Plex Mono,Cascadia Code,monospace;font-size:.86rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}body.is-panning-diagram,body.is-panning-diagram *{user-select:none!important;-webkit-user-select:none!important}@media(max-width:1180px){.preview-layout{grid-template-columns:200px minmax(0,1fr)}.app-header,.app-summary,.app-actions{justify-content:flex-start}}@media(max-width:980px){.app-shell{width:min(100vw - 20px,1440px);padding-top:18px}.app-header,.workspace{display:grid}.app-header{gap:12px}.workspace{min-height:auto}.panel-resizer{display:none}.preview-layout{grid-template-columns:1fr}.outline-panel{border-right:0;border-bottom:1px solid rgba(69,45,19,.08);max-height:220px}#markdown-input{min-height:320px}.preview-toolbar,.editor-meta{flex-direction:column;align-items:stretch}.recent-item{grid-template-columns:1fr}.shortcuts-list div{flex-direction:column;align-items:stretch}.diagram-stage{height:420px}}
