.static-wrapper{height:100vh;background:var(--color-bg-base);display:flex;flex-direction:column;overflow-y:auto;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:var(--color-border-default) transparent}.static-wrapper::-webkit-scrollbar{width:6px}.static-wrapper::-webkit-scrollbar-track{background:transparent}.static-wrapper::-webkit-scrollbar-thumb{background:var(--color-border-default);border-radius:4px}.static-wrapper::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}.static-container{flex:1;min-height:0;max-width:1200px;width:100%;margin:0 auto;padding:var(--spacing-8) var(--spacing-6);padding-bottom:0;display:flex;flex-direction:column}.static-container:after{content:"";flex-shrink:0;height:var(--spacing-8)}.static-loading{display:flex;align-items:center;justify-content:center;height:100vh;font-family:var(--font-serif);color:var(--color-text-muted)}.static-header{flex-shrink:0}.static-header-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--spacing-4)}.static-back-link{display:inline-block;font-family:var(--font-serif);font-size:var(--font-size-sm);color:var(--color-text-secondary);text-decoration:none;letter-spacing:.02em}.static-back-link:hover{text-decoration:underline}.static-title{font-family:var(--font-serif);font-size:var(--font-size-2xl);font-weight:400;letter-spacing:-.02em;color:var(--color-text-primary);margin:0}.syntax-help-toggle{display:inline-flex;align-items:center;gap:var(--spacing-1);font-family:var(--font-serif);font-size:var(--font-size-sm);font-weight:400;color:var(--color-text-muted);background:none;border:none;padding:0;cursor:pointer;transition:color .3s ease;letter-spacing:.01em;margin-left:auto;outline:none}.syntax-help-toggle:hover{color:var(--color-accent)}.syntax-help-toggle:focus-visible{outline:1px solid var(--color-accent);outline-offset:2px}.syntax-help-icon{font-style:normal;font-weight:300;font-size:var(--font-size-base)}.syntax-help-wrapper{overflow:hidden;transition:max-height .4s cubic-bezier(.4,0,.2,1);border-bottom:1px solid var(--color-border-default);flex-shrink:0}.syntax-help-content{padding:var(--spacing-6);background:var(--color-bg-base);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-8)}.syntax-column{display:flex;flex-direction:column;gap:var(--spacing-6)}@media(max-width:768px){.syntax-help-content{grid-template-columns:1fr}}.syntax-category{display:flex;flex-direction:column;gap:var(--spacing-2)}.syntax-category-title{font-family:var(--font-serif);font-size:var(--font-size-base);font-weight:500;color:var(--color-accent);text-transform:lowercase;margin:0 0 var(--spacing-2) 0;padding-bottom:0;border-bottom:none;letter-spacing:.03em}.syntax-section{display:flex;flex-direction:column;gap:var(--spacing-1);margin-bottom:var(--spacing-3)}.syntax-label{font-family:var(--font-mono);font-size:.6875rem;font-weight:400;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em}.syntax-section pre{margin:0;padding:var(--spacing-3);background:transparent;border:1px solid var(--color-border-subtle);border-radius:3px;overflow-x:auto}@media(prefers-color-scheme:dark){.syntax-section pre{background:transparent;border-color:var(--color-border-default)}}.syntax-section code{display:block;font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--color-text-muted);white-space:pre-wrap;word-break:break-word;line-height:1.6}.directive-badges{display:flex;flex-wrap:wrap;gap:var(--spacing-2)}.badge{font-family:var(--font-mono);font-size:.6875rem;padding:var(--spacing-1) var(--spacing-2);border-radius:3px;font-weight:500;text-transform:lowercase}.badge-info{background:#3b82f61a;color:#3b82f6;border:1px solid rgba(59,130,246,.2)}.badge-warning{background:#f59e0b1a;color:#f59e0b;border:1px solid rgba(245,158,11,.2)}.badge-note{background:#8b5cf61a;color:#8b5cf6;border:1px solid rgba(139,92,246,.2)}.badge-tip{background:#22c55e1a;color:#22c55e;border:1px solid rgba(34,197,94,.2)}.static-panes-wrapper{position:relative;flex:1;min-height:800px;overflow:visible}.static-panes-wrapper:before,.static-panes-wrapper:after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--color-border-default);z-index:100}.static-panes-wrapper:before{top:0}.static-panes-wrapper:after{bottom:0}.static-panes{display:grid;grid-template-columns:1fr 1fr;height:100%;gap:0;overflow:hidden}.static-editor-pane{display:flex;flex-direction:column;border-right:1px solid var(--color-border-subtle);overflow:hidden;background:var(--color-bg-base)}.editor-container{flex:1;overflow:hidden;background:var(--color-bg-base)}.editor-container .cm-scroller::-webkit-scrollbar{width:6px;height:6px}.editor-container .cm-scroller::-webkit-scrollbar-track{background:transparent}.editor-container .cm-scroller::-webkit-scrollbar-thumb{background:var(--color-border-default);border-radius:4px}.editor-container .cm-scroller::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}.editor-container .cm-scroller{scrollbar-width:thin;scrollbar-color:var(--color-border-default) transparent}.cm-placeholder{color:var(--color-text-muted);font-style:italic}.static-preview-container{display:flex;flex-direction:column;height:100%;overflow:visible;background:var(--color-bg-base);position:relative}.static-preview-pane{flex:1;height:100%;overflow:hidden;background:var(--color-bg-base)}.static-preview-pane::-webkit-scrollbar{width:6px;height:6px}.static-preview-pane::-webkit-scrollbar-track{background:transparent}.static-preview-pane::-webkit-scrollbar-thumb{background:var(--color-border-default);border-radius:4px}.static-preview-pane::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}.static-preview-pane{scrollbar-width:thin;scrollbar-color:var(--color-border-default) transparent}.preview-iframe{width:100%;height:100%;border:none;background:var(--color-bg-base);display:block}.preview-metadata-overlay{position:absolute;inset:0 0 0 50%;pointer-events:none;z-index:200}.preview-metadata-title{position:absolute;top:.25rem;left:50%;transform:translate(-50%);font-family:var(--font-serif);font-size:.95rem;font-weight:400;color:var(--color-text-primary);opacity:.5;letter-spacing:.02em;text-align:center;max-width:80%;transition:opacity .2s ease}.preview-metadata-title:hover{opacity:1}.preview-metadata-date{position:absolute;top:0;right:1rem;transform:translateY(-50%);font-family:var(--font-serif);font-size:.75rem;font-weight:400;color:color-mix(in srgb,var(--color-text-primary) 70%,transparent);letter-spacing:.02em;background:var(--color-bg-base);padding:.25rem .5rem;line-height:1;z-index:201}.preview-metadata-tags{position:absolute;top:2rem;right:0;transform:translate(calc(100% + 1rem));display:flex;flex-direction:column;gap:.5rem;align-items:flex-start}.preview-metadata-tag{font-family:var(--font-mono);font-size:.625rem;color:var(--color-accent);opacity:.7;letter-spacing:.03em;white-space:nowrap;transition:opacity .2s ease}.preview-metadata-tag:hover{opacity:1}.static-error{display:flex;align-items:flex-start;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);background:#dc26261a;border-bottom:1px solid rgba(220,38,38,.3);font-family:var(--font-sans);flex-shrink:0}.error-icon{font-size:1.25rem;line-height:1}.error-content{flex:1}.error-message{font-size:var(--font-size-sm);color:#dc2626;font-weight:500;margin-bottom:var(--spacing-1)}.error-location{font-size:var(--font-size-xs);color:var(--color-text-muted);font-family:var(--font-mono)}@media(max-width:1280px){.preview-metadata-tags{display:none}}@media(max-width:1024px){.preview-metadata-title,.preview-metadata-date{opacity:.4}}@media(max-width:1024px){.static-panes{grid-template-columns:1fr;grid-template-rows:50vh 1fr}.static-editor-pane{border-right:none;border-bottom:1px solid var(--color-border-default)}.preview-metadata-overlay{left:0;top:50vh}.preview-metadata-tags{display:none}}.static-editor-pane .cm-editor{height:100%}.static-editor-pane .cm-scroller{font-family:var(--font-mono)}