@layer base,skam-kanbun,playground,skam-overrides;@layer base{*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}}@layer playground{:root{--editor-primary: #4285f4;--editor-primary-hover: #1a73e8;--editor-primary-light: #e8f0fe;--editor-bg: #ffffff;--editor-bg-secondary: #f8f9fa;--editor-bg-tertiary: #f1f3f4;--editor-text: #202124;--editor-text-secondary: #5f6368;--editor-border: #dadce0;--editor-border-focus: #4285f4;--editor-error: #d93025;--editor-error-bg: #fce8e6;--editor-error-border: #f5c6cb;--editor-warning: #f59e0b;--editor-warning-bg: #fef3c7;--editor-success: #1e8e3e;--editor-success-bg: #e6f4ea;--font-mono: "SF Mono", "Monaco", "Inconsolata", "Fira Code", "Source Code Pro", "Consolas", monospace;--font-sans: "Noto Sans JP", "Hiragino Sans", system-ui, sans-serif;--font-serif: "Noto Serif JP", "Yu Mincho", "Source Han Serif JP", serif;--radius: 8px;--radius-sm: 4px;--shadow: 0 2px 4px rgba(0, 0, 0, .1);--shadow-lg: 0 4px 16px rgba(0, 0, 0, .12);--divider-width: 6px;--header-height: auto;--transition-fast: .15s ease;--transition-normal: .2s ease;--color-bg: var(--editor-bg-secondary);--color-surface: var(--editor-bg);--color-text: var(--editor-text);--color-text-secondary: var(--editor-text-secondary);--color-border: var(--editor-border);--color-primary: var(--editor-primary);--color-primary-hover: var(--editor-primary-hover);--color-error: var(--editor-error);--color-error-bg: var(--editor-error-bg)}html{font-size:16px;font-family:var(--font-sans);color:var(--editor-text);background-color:var(--editor-bg-secondary)}body{min-height:100vh;display:flex;flex-direction:column}.header{padding:1rem 1.5rem;background-color:var(--editor-bg);border-bottom:1px solid var(--editor-border);text-align:center}.header-title{display:flex;justify-content:center;align-items:center;gap:.75rem;margin-bottom:.25rem}.header h1{font-size:1.25rem;font-weight:700;color:var(--editor-text)}.github-link{display:flex;align-items:center;color:var(--editor-text-secondary);transition:color var(--transition-normal)}.github-link:hover{color:var(--editor-text)}.header .description{color:var(--editor-text-secondary);font-size:.75rem}.main{flex:1;padding:1rem;display:flex;flex-direction:column;gap:1rem;min-height:0}.editor-container{display:flex;flex-direction:column;flex:1;min-height:500px;background-color:var(--editor-bg);border:1px solid var(--editor-border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.panes-container{display:flex;flex:1;min-height:0;overflow:hidden}.xml-pane{flex:1;min-width:300px;display:flex;flex-direction:column;overflow:hidden}.editor-container>.toolbar{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;border-bottom:1px solid var(--editor-border);background-color:var(--editor-bg-secondary);flex-shrink:0}.editor-container>.toolbar h2{font-size:.875rem;font-weight:600;color:var(--editor-text-secondary);text-transform:uppercase;letter-spacing:.05em}.toolbar-actions{display:flex;align-items:center;gap:.75rem}.toolbar-btn{padding:.25rem .75rem;font-size:.75rem;background-color:var(--editor-bg-secondary);border:1px solid var(--editor-border);border-radius:var(--radius-sm);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.toolbar-btn:hover{background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.toolbar-btn:focus{outline:2px solid var(--editor-primary);outline-offset:2px}.samples{display:flex;align-items:center;gap:.5rem}.samples label{font-size:.75rem;color:var(--editor-text-secondary)}.samples select{font-size:.75rem;padding:.25rem .5rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg);color:var(--editor-text);cursor:pointer}.samples select:focus{outline:2px solid var(--editor-primary);outline-offset:2px}.xml-pane.drag-over{outline:2px dashed var(--editor-primary);outline-offset:-2px}.xml-editor-wrapper{flex:1;display:flex;overflow:hidden}.xml-editor-wrapper textarea{flex:1;border:none;padding:1rem;font-family:var(--font-mono);font-size:14px;line-height:1.5;color:var(--editor-text);background-color:var(--editor-bg);resize:none;outline:none}.action-bar{padding:.75rem 1rem;border-top:1px solid var(--editor-border);background-color:var(--editor-bg-secondary)}.action-bar button{padding:.5rem 1rem;background-color:var(--editor-primary);color:#fff;border:none;border-radius:var(--radius);font-size:.875rem;font-weight:600;cursor:pointer;transition:background-color var(--transition-fast)}.action-bar button:hover{background-color:var(--editor-primary-hover)}.action-bar button:focus{outline:2px solid var(--editor-primary);outline-offset:2px}.error-panel{display:none;background-color:var(--editor-error-bg);border-top:1px solid var(--editor-error);max-height:150px;overflow-y:auto;font-size:.875rem;font-family:var(--font-mono)}.error-panel.visible{display:block}.error-item{padding:8px 12px;cursor:pointer;display:flex;align-items:flex-start;gap:.5rem;color:var(--editor-error);transition:background-color var(--transition-fast)}.error-item:hover{background-color:#d930251a}.error-icon{flex-shrink:0;color:var(--editor-warning)}.error-location{flex-shrink:0;font-weight:600;white-space:nowrap;color:var(--editor-error)}.error-message{flex:1;word-break:break-word;color:var(--editor-error)}.divider{width:var(--divider-width);background-color:var(--editor-border);cursor:col-resize;flex-shrink:0;transition:background-color var(--transition-normal);position:relative}.divider:hover,.divider.dragging{background-color:var(--editor-primary)}.divider:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2px;height:40px;background-color:var(--editor-text-secondary);border-radius:1px;opacity:.3}.divider:hover:before,.divider.dragging:before{background-color:#fff;opacity:.8}.preview-pane{flex:1;min-width:300px;display:flex;flex-direction:column;overflow:hidden;font-family:var(--font-serif)}.preview-toolbar{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;border-bottom:1px solid var(--editor-border);background-color:var(--editor-bg-secondary);flex-wrap:wrap;gap:.5rem;font-family:var(--font-sans)}.preview-toolbar h2{font-size:.875rem;font-weight:600;color:var(--editor-text-secondary);text-transform:uppercase;letter-spacing:.05em}.render-options{display:flex;flex-wrap:wrap;gap:1rem;font-size:.75rem;align-items:center;color:var(--editor-text)}.render-options label{display:flex;align-items:center;gap:.25rem;cursor:pointer}.horizontal-notice,.canvas-notice{width:100%;font-size:.6875rem;color:var(--editor-warning)}.preview-content>.skam-document,.preview-content canvas{border:2px dashed var(--editor-border);border-radius:4px}.preview-content .inline-demo{border:1px solid color-mix(in srgb,var(--editor-border) 50%,transparent);border-radius:4px;padding:1rem}.preview-content canvas{flex-shrink:0}.preview-pane.canvas-mode .selection-panel,.preview-pane.canvas-mode .html-only-option{display:none}.render-options select{font-size:.75rem;padding:.25rem .5rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg);color:var(--editor-text);cursor:pointer}.render-options select:focus{outline:2px solid var(--editor-primary);outline-offset:2px}.settings-panel{width:100%;font-size:.75rem;color:var(--editor-text)}.settings-panel summary{cursor:pointer;color:var(--editor-primary);padding:.25rem 0;-webkit-user-select:none;user-select:none;list-style:none;display:flex;align-items:center;gap:.5rem}.settings-panel summary::-webkit-details-marker{display:none}.settings-panel summary:before{content:"▶";font-size:.5rem;transition:transform var(--transition-normal)}.settings-panel[open] summary:before{transform:rotate(90deg)}.settings-panel summary:hover{text-decoration:underline}.settings-sections{display:flex;flex-direction:column;gap:0;margin-top:.25rem}.settings-section{border:none;padding:.5rem 0;margin:0}.settings-section+.settings-section{border-top:1px solid var(--editor-border)}.settings-section legend{font-size:.6875rem;font-weight:600;color:var(--editor-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.375rem}.settings-section-content{display:flex;gap:1rem;align-items:center}.settings-section-content label{display:flex;align-items:center;gap:.25rem;cursor:pointer}.profile-checkboxes{display:grid;grid-template-columns:repeat(3,1fr);gap:.25rem .5rem;padding:.5rem;background-color:var(--editor-bg);border:1px solid var(--editor-border);border-radius:var(--radius-sm);margin-top:.25rem}.profile-checkboxes label{display:flex;align-items:center;gap:.25rem;cursor:pointer;font-size:.7rem;white-space:nowrap}.profile-checkboxes label:hover{color:var(--editor-primary)}.profile-checkboxes input[type=checkbox]{margin:0;cursor:pointer}.preview-main{flex:1;display:flex;overflow:hidden;min-height:0}.preview-content{flex:1;padding:2rem;overflow:auto;display:flex;justify-content:safe center;align-items:flex-start;background-color:var(--editor-bg);user-select:none;-webkit-user-select:none;resize:vertical}.selection-panel{width:200px;flex-shrink:0;border-left:1px solid var(--editor-border);background-color:var(--editor-bg-secondary);display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;font-family:var(--font-sans)}.selection-panel h3{padding:.75rem 1rem;margin:0;font-size:.75rem;font-weight:600;color:var(--editor-text-secondary);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--editor-border);background-color:var(--editor-bg-tertiary)}.selection-info{flex:1;padding:.75rem;font-size:.8125rem;color:var(--editor-text)}.selection-empty{color:var(--editor-text-secondary);font-size:.75rem;text-align:center;padding:1rem .5rem}.selection-summary{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--editor-border)}.selection-count{font-weight:600;font-size:.75rem;color:var(--editor-text-secondary);white-space:nowrap}.selection-chars{font-family:var(--font-serif);font-size:1.125rem;font-weight:600;color:var(--editor-text);letter-spacing:.05em}.selection-actions{padding:.75rem;border-top:1px solid var(--editor-border)}.selection-action-group{margin-bottom:.75rem}.selection-action-group:last-child{margin-bottom:0}.selection-action-label{display:block;font-size:.6875rem;font-weight:600;color:var(--editor-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.375rem}.selection-kaeri-buttons{display:flex;flex-wrap:wrap;gap:.375rem;align-items:center}.selection-kaeri-group{display:flex;gap:.125rem}.selection-kaeri-group:not(:first-child):before{content:"";width:1px;height:1.25rem;background-color:var(--editor-border);margin-right:.25rem}.selection-kaeri-btn{min-width:1.75rem;height:1.75rem;padding:0 .375rem;font-size:.8125rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.selection-kaeri-btn:hover{background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.selection-kaeri-btn.active{background-color:var(--editor-primary);border-color:var(--editor-primary);color:#fff}.selection-kaeri-btn--clear{color:var(--editor-error);border-color:var(--editor-error)}.selection-kaeri-btn--clear:hover{background-color:var(--editor-error-bg)}.selection-kaeri-disabled-msg,.selection-kaeri-multi-hint{font-size:.6875rem;color:var(--editor-text-secondary);font-style:italic}.selection-saidoku-reread{margin-top:.375rem}.selection-saidoku-reread-label{display:block;font-size:.6875rem;color:var(--editor-text-secondary);margin-bottom:.25rem}.selection-tateten-row{display:flex;gap:.25rem}.selection-tateten-btn{flex:1;padding:.375rem .5rem;font-size:.75rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg-secondary);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.selection-tateten-btn:hover:not(:disabled){background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.selection-tateten-btn:disabled{opacity:.5;cursor:not-allowed}.selection-tateten-btn.active{background-color:var(--editor-primary);border-color:var(--editor-primary);color:#fff}.selection-tateten-btn.active:hover:not(:disabled){background-color:var(--editor-primary-hover)}.selection-emphasis-row{display:flex;gap:.25rem}.selection-emphasis-btn{flex:1;padding:.375rem .5rem;font-size:.75rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg-secondary);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.selection-emphasis-btn:hover:not(:disabled){background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.selection-emphasis-btn:disabled{opacity:.5;cursor:not-allowed}.selection-emphasis-btn.active{background-color:var(--editor-primary);border-color:var(--editor-primary);color:#fff}.selection-emphasis-btn.active:hover:not(:disabled){background-color:var(--editor-primary-hover)}.selection-emphasis-styles{display:flex;gap:.25rem;margin-bottom:.375rem}.selection-emphasis-style-btn{flex:1;padding:.25rem;font-size:.875rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg-secondary);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.selection-emphasis-style-btn:hover{background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.selection-emphasis-style-btn.active{background-color:var(--editor-primary);border-color:var(--editor-primary);color:#fff}.selection-underline-styles{display:flex;gap:.25rem;margin-bottom:.375rem}.selection-underline-style-btn{flex:1;padding:.25rem;font-size:.875rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg-secondary);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.selection-underline-style-btn:hover{background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.selection-underline-style-btn.active{background-color:var(--editor-primary);border-color:var(--editor-primary);color:#fff}.selection-underline-ref-row{display:flex;gap:.25rem;margin-bottom:.375rem}.selection-underline-ref-input{flex:1;min-width:0;padding:.25rem .5rem;font-size:.75rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg);color:var(--editor-text)}.selection-underline-ref-input:focus{outline:none;border-color:var(--editor-primary)}.selection-underline-format-select{flex:1;min-width:0;padding:.25rem;font-size:.6875rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg);color:var(--editor-text);cursor:pointer}.selection-underline-format-select:focus{outline:none;border-color:var(--editor-primary)}.selection-underline-row{display:flex;gap:.25rem}.selection-underline-btn{flex:1;padding:.375rem .5rem;font-size:.75rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg-secondary);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.selection-underline-btn:hover:not(:disabled){background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.selection-underline-btn:disabled{opacity:.5;cursor:not-allowed}.selection-underline-btn.active{background-color:var(--editor-primary);border-color:var(--editor-primary);color:#fff}.selection-underline-btn.active:hover:not(:disabled){background-color:var(--editor-primary-hover)}.selection-kana-types{display:flex;gap:.25rem;margin-bottom:.375rem}.selection-kana-type-btn{flex:1;padding:.25rem;font-size:.75rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg-secondary);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.selection-kana-type-btn:hover:not(:disabled){background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.selection-kana-type-btn:disabled{opacity:.5;cursor:not-allowed}.selection-kana-type-btn.active{background-color:var(--editor-primary);border-color:var(--editor-primary);color:#fff}.selection-kana-type-btn.has-value:not(.active){border-color:var(--success);background-color:var(--success-bg)}.selection-kana-row{display:flex;gap:.25rem;align-items:center}.selection-kana-input{flex:1;min-width:0;padding:.25rem .5rem;font-size:.8125rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg);color:var(--editor-text)}.selection-kana-input:focus{outline:none;border-color:var(--editor-primary)}.selection-btn-apply{padding:.25rem .5rem;font-size:.75rem;border:1px solid var(--editor-primary);border-radius:var(--radius-sm);background-color:var(--editor-primary);color:#fff;cursor:pointer;transition:background-color var(--transition-fast)}.selection-btn-apply:hover:not(:disabled){background-color:var(--editor-primary-hover)}.selection-btn-apply:disabled{opacity:.5;cursor:not-allowed}.marks-list-panel{border-top:1px solid var(--editor-border)}.marks-list-panel>summary{padding:.5rem .75rem;font-size:.6875rem;font-weight:600;color:var(--editor-text-secondary);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;-webkit-user-select:none;user-select:none}.marks-list-panel>summary:hover{background-color:var(--editor-bg-secondary)}.marks-list-panel[open]>summary{border-bottom:1px solid var(--editor-border)}.marks-list{font-size:.75rem;max-height:200px;overflow-y:auto;padding:.5rem .75rem}.marks-list-empty{color:var(--editor-text-secondary);font-style:italic;margin:0}.marks-list-item{display:flex;align-items:center;gap:.375rem;padding:.25rem 0;border-bottom:1px dashed var(--editor-border)}.marks-list-item:last-child{border-bottom:none}.marks-list-anchor{font-family:var(--font-serif);color:var(--editor-text);font-weight:500}.marks-list-type{font-size:.625rem;color:var(--editor-text-secondary);background-color:var(--editor-bg-secondary);padding:.125rem .25rem;border-radius:var(--radius-sm);white-space:nowrap}.marks-list-value{font-family:var(--font-serif);color:var(--editor-primary);margin-left:auto}.preview-content .inline-demo{font-family:var(--font-serif);font-size:1.125rem;line-height:2;text-align:left;color:var(--editor-text)}.preview-content .inline-demo--vertical{writing-mode:vertical-rl;text-orientation:mixed;height:100%}.customize-options{padding:.75rem 1rem;background-color:var(--editor-bg-secondary);display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end}.customize-group{display:flex;gap:1rem}.customize-group label{display:flex;flex-direction:column;gap:.25rem;font-size:.75rem;color:var(--editor-text-secondary)}.customize-group label:has(input[type=range]){flex-direction:row;align-items:center;gap:.5rem}.customize-group input[type=color]{width:2rem;height:1.5rem;padding:0;border:1px solid var(--editor-border);border-radius:var(--radius-sm);cursor:pointer}.customize-group select{font-size:.75rem;padding:.25rem .5rem;border:1px solid var(--editor-border);border-radius:var(--radius-sm);background-color:var(--editor-bg);color:var(--editor-text);cursor:pointer}.customize-group input[type=range]{width:80px;cursor:pointer}.customize-group span{font-size:.625rem;color:var(--editor-text-secondary);min-width:3em;text-align:right}.reset-btn{padding:.25rem .75rem;font-size:.75rem;background-color:var(--editor-bg-secondary);border:1px solid var(--editor-border);border-radius:var(--radius-sm);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.reset-btn:hover{background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.reset-btn:focus{outline:2px solid var(--editor-primary);outline-offset:2px}.details-panel{background-color:var(--editor-bg);border:1px solid var(--editor-border);border-radius:var(--radius);box-shadow:var(--shadow)}.details-panel summary{padding:.75rem 1rem;font-size:.875rem;font-weight:600;color:var(--editor-text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;list-style:none;display:flex;align-items:center;gap:.5rem}.details-panel summary::-webkit-details-marker{display:none}.details-panel summary:before{content:"▶";font-size:.625rem;transition:transform var(--transition-normal)}.details-panel[open] summary:before{transform:rotate(90deg)}.details-panel summary:hover{background-color:var(--editor-bg-secondary)}.details-panel .panel{border:none;border-radius:0 0 var(--radius) var(--radius);box-shadow:none;border-top:1px solid var(--editor-border)}.details-panel .panel-header{border-radius:0}.panel{background-color:var(--editor-bg);border:1px solid var(--editor-border);border-radius:var(--radius);box-shadow:var(--shadow);display:flex;flex-direction:column}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;border-bottom:1px solid var(--editor-border);background-color:var(--editor-bg-secondary);border-radius:var(--radius) var(--radius) 0 0}.panel-header h2{font-size:.875rem;font-weight:600;color:var(--editor-text-secondary);text-transform:uppercase;letter-spacing:.05em}.json-panel pre,.html-panel pre{flex:1;margin:0;padding:1rem;overflow:auto;font-family:var(--font-mono);font-size:12px;line-height:1.5;background-color:var(--editor-bg-secondary);color:var(--editor-text);max-height:400px}.json-panel code,.html-panel code{font-family:inherit}.copy-btn{padding:.25rem .75rem;font-size:.75rem;background-color:var(--editor-bg-secondary);border:1px solid var(--editor-border);border-radius:var(--radius-sm);color:var(--editor-text);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.copy-btn:hover{background-color:var(--editor-primary-light);border-color:var(--editor-primary)}.copy-btn:focus{outline:2px solid var(--editor-primary);outline-offset:2px}.footer{padding:1rem;text-align:center;font-size:.75rem;color:var(--editor-text-secondary);background-color:var(--editor-bg);border-top:1px solid var(--editor-border)}.footer a{color:var(--editor-primary);text-decoration:none}.footer a:hover{text-decoration:underline}.compact-tab-bar{display:none}.overlay-backdrop{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0006;z-index:99}.overlay-backdrop.visible{display:block}.bottom-sheet-backdrop{z-index:199}.touch-range-hint{font-size:.6875rem;color:var(--editor-primary);padding:.375rem .75rem;text-align:center;background-color:var(--editor-primary-light);border-bottom:1px solid var(--editor-border)}@media(max-width:768px){.editor-container{min-height:auto}.panes-container{flex-direction:column;flex:1;min-height:0}.xml-pane,.preview-pane{min-width:0}.editor-container>.toolbar h2{display:none}.editor-container>.toolbar{flex-wrap:wrap;gap:.5rem}.compact-tab-bar{display:flex;border-bottom:1px solid var(--editor-border);background-color:var(--editor-bg-secondary);flex-shrink:0}.compact-tab{flex:1;padding:.625rem 1rem;font-size:.875rem;font-weight:600;border:none;background:none;color:var(--editor-text-secondary);cursor:pointer;transition:color var(--transition-fast),border-color var(--transition-fast);border-bottom:2px solid transparent}.compact-tab.active{color:var(--editor-primary);border-bottom-color:var(--editor-primary)}.compact-tab:hover:not(.active){color:var(--editor-text)}.editor-container[data-active-tab=editor] .preview-pane,.editor-container[data-active-tab=preview] .xml-pane{display:none}.editor-container[data-active-tab=editor] .xml-pane,.editor-container[data-active-tab=preview] .preview-pane{flex:1;min-height:0}.divider{display:none}.preview-toolbar{flex-direction:column;align-items:flex-start}.settings-panel[open]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background-color:var(--editor-bg);overflow-y:auto;padding:0 1rem 1rem;margin:0}.settings-panel[open]>summary{position:sticky;top:0;z-index:1;background-color:var(--editor-bg);padding:1rem 0;border-bottom:1px solid var(--editor-border);font-size:1rem}.preview-main{display:block;flex:1;overflow:hidden;min-height:0}.preview-content{width:100%;height:100%;overflow:auto}.selection-panel{position:fixed;bottom:0;left:0;right:0;width:auto;max-height:70vh;border-left:none;border-top:none;border-radius:12px 12px 0 0;box-shadow:0 -4px 16px #00000026;transform:translateY(100%);transition:transform .3s ease;z-index:200;overflow-y:auto;overscroll-behavior:contain;padding-bottom:env(safe-area-inset-bottom,0)}.selection-panel.open{transform:translateY(0)}.selection-panel.peek{transform:translateY(calc(100% - 1.75rem))}.customize-options{flex-direction:column}.customize-group{flex-wrap:wrap}}body.resizing{-webkit-user-select:none;user-select:none;cursor:col-resize}@media(max-width:768px){body.resizing{cursor:row-resize}}.xml-editor{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0;font-family:var(--font-mono)}.xml-editor__area{display:flex;flex:1;overflow:hidden;min-height:0}.xml-editor__line-numbers{padding:1rem .5rem 1rem .75rem;background-color:var(--editor-bg-tertiary);border-right:1px solid var(--editor-border);font-family:var(--font-mono);font-size:14px;line-height:1.5;color:var(--editor-text-secondary);text-align:right;-webkit-user-select:none;user-select:none;overflow:hidden;flex-shrink:0;min-width:3rem}.xml-editor__line-numbers span{display:block}.xml-editor__content{position:relative;flex:1;overflow:hidden;min-width:0}.xml-editor__textarea,.xml-editor__highlight{margin:0;padding:1rem;font-family:var(--font-mono);font-size:14px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word}.xml-editor__textarea{position:absolute;top:0;left:0;width:100%;height:100%;border:none;resize:none;outline:none;background-color:transparent;color:transparent;caret-color:var(--editor-text);z-index:1;overflow:auto}.xml-editor__highlight{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:auto;background-color:var(--editor-bg);color:var(--editor-text)}.xml-editor__highlight code{font-family:inherit;font-size:inherit;line-height:inherit}.xml-editor .token.tag{color:#22863a}.xml-editor .token.attr-name{color:#6f42c1}.xml-editor .token.attr-value{color:#032f62}.xml-editor .token.punctuation{color:#24292e}.xml-editor .token.comment{color:#6a737d;font-style:italic}.xml-editor .token.prolog,.xml-editor .token.doctype,.xml-editor .token.cdata{color:#6a737d}.xml-editor .token.entity{color:#e36209}.xml-editor__textarea::placeholder{color:var(--editor-text-secondary);opacity:.6}.xml-editor__textarea::selection{background-color:#4285f44d}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}}