*,:before,:after{box-sizing:border-box}:root{--editor-bg:#1e1e1e;--editor-text:#d4d4d4;--border:#333;--preview-bg:#f5f5f5}body{height:100vh;font-family:var(--fd-font);margin:0;overflow:hidden}#app{-webkit-user-select:none;user-select:none;background:var(--editor-bg);height:100vh;display:flex}.separator{cursor:col-resize;touch-action:none;background:0 0;flex:0 0 20px;position:relative}.separator:before{content:"";background:var(--border);width:1px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.separator:after{content:"";opacity:.6;background-image:url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 10H19M14 19L12 21L10 19M14 5L12 3L10 5M5 14H19' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:contain;width:24px;height:24px;transition:opacity .15s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(90deg)}.separator:hover:after,.separator:active:after{opacity:1}@media (width<=768px){.separator{cursor:row-resize;z-index:10;flex:0 0 1px;overflow:visible}.separator:before{width:auto;height:1px;inset:0 0 auto;transform:none}.separator:after{transform:translate(-50%,-50%)}}#file-tree-panel{border-right:1px solid var(--border);background:#252526;flex:0 0 200px;padding:8px 0;overflow-y:auto}.fd-tree,.fd-tree ul{margin:0;padding:0;list-style:none}.fd-tree-dir-label{color:var(--editor-text);opacity:.45;text-transform:uppercase;letter-spacing:.06em;-webkit-user-select:none;user-select:none;padding:6px 8px 2px;font-family:ui-monospace,Consolas,monospace;font-size:11px;display:block}.fd-tree-file-btn{text-align:left;cursor:pointer;width:100%;color:var(--editor-text);background:0 0;border:none;padding:3px 8px;font-family:ui-monospace,Consolas,monospace;font-size:12px;line-height:1.6;display:block}.fd-tree-file-btn:hover{background:#ffffff0f}.fd-tree-file.fd-tree-active .fd-tree-file-btn{color:#fff;background:#ffffff1f}#editor-panel{background:var(--editor-bg);border-right:1px solid var(--border);flex-direction:column;flex:1;min-width:0;display:flex}#editor-toolbar{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:8px;padding:6px 12px;display:flex}#editor-toolbar button{border:1px solid var(--border);color:var(--editor-text);cursor:pointer;background:0 0;border-radius:3px;padding:3px 8px;font-family:ui-monospace,Consolas,monospace;font-size:12px}#editor-toolbar button:hover{background:#ffffff14}#editor-toolbar button:disabled{opacity:.35;cursor:default}#current-file{color:var(--editor-text);opacity:.6;text-overflow:ellipsis;white-space:nowrap;flex:1;font-family:ui-monospace,Consolas,monospace;font-size:12px;overflow:hidden}#editor{width:100%;height:100%;color:var(--editor-text);resize:none;background:0 0;border:none;outline:none;flex:1;padding:24px;font-family:ui-monospace,Consolas,monospace;font-size:14px;line-height:1.6}#preview-panel{background:var(--preview-bg);flex:1;min-width:0;overflow-y:auto}#preview{padding:24px}@media (width<=768px){#app{flex-direction:column;height:100dvh}#file-tree-panel{border-right:none;border-bottom:1px solid var(--border);flex:0 0 160px}#editor-panel,#preview-panel{flex:1;min-width:100%;height:auto;min-height:0}}:root{--fd-color-blue:#3b82f6;--fd-color-red:#ef4444;--fd-color-green:#22c55e;--fd-color-yellow:#eab308;--fd-color-purple:#a855f7;--fd-color-gray:#6b7280;--fd-accent:var(--fd-color-blue);--fd-text:#111;--fd-text-muted:var(--fd-color-gray);--fd-border:#bbb;--fd-bg:#fff;--fd-radius:3px;--fd-font:system-ui, sans-serif;--fd-font-size:14px;--fd-control-size:16px;--fd-gap:12px;--fd-text-on-color:#fff;--fd-thumb:#fff;--fd-shadow:0 2px 8px #0000001f;--fd-backdrop:#0006}.fd-page{font-family:var(--fd-font);color:var(--fd-text);align-items:flex-start;gap:var(--fd-gap);flex-direction:column;display:flex}.fd-page.fd-dark{--fd-text:#e5e7eb;--fd-text-muted:#9ca3af;--fd-border:#374151;--fd-bg:#1f2937;--fd-shadow:0 2px 8px #0006;--fd-backdrop:#000000a6;color:var(--fd-text);background:#111827}.fd-page hr{border:none;border-top:1px solid var(--fd-border);width:100%;margin:0}.fd-centered{text-align:center;align-self:center;margin-left:auto;margin-right:auto}.fd-middle{flex-direction:column;justify-content:center;display:flex}.fd-row{gap:var(--fd-gap);flex-direction:row;align-self:stretch;width:100%;display:flex}.fd-row>*{flex:1}.fd-row>.fd-1-2{flex:0 0 calc(50% - var(--fd-gap) / 2)}.fd-row>.fd-1-3{flex:0 0 calc(33.333% - var(--fd-gap) * 2 / 3)}.fd-row>.fd-2-3{flex:0 0 calc(66.666% - var(--fd-gap) / 3)}.fd-row>.fd-1-4{flex:0 0 calc(25% - var(--fd-gap) * 3 / 4)}.fd-row>.fd-3-4{flex:0 0 calc(75% - var(--fd-gap) / 4)}.fd-row>.fd-full{flex:0 0 100%}.fd-sidebar{gap:var(--fd-gap);flex-direction:row;align-items:flex-start;width:100%;display:flex}.fd-sidebar-aside{flex:0 0 240px}.fd-sidebar.fd-1-4>.fd-sidebar-aside{flex:0 0 25%}.fd-sidebar.fd-1-3>.fd-sidebar-aside{flex:0 0 33.333%}.fd-sidebar.fd-1-2>.fd-sidebar-aside{flex:0 0 50%}.fd-sidebar.fd-2-3>.fd-sidebar-aside{flex:0 0 66.666%}.fd-sidebar.fd-3-4>.fd-sidebar-aside{flex:0 0 75%}.fd-sidebar-main{gap:var(--fd-gap);flex-direction:column;flex:1;min-width:0;display:flex}.fd-card{background:var(--fd-bg);border:1px solid var(--fd-border);border-radius:var(--fd-radius);gap:var(--fd-gap);flex-direction:column;width:100%;padding:16px;display:flex}.fd-hero{text-align:center;align-items:center;gap:var(--fd-gap);border:1px solid var(--fd-border);border-radius:var(--fd-radius);background:var(--fd-bg);flex-direction:column;width:100%;padding:48px 24px;display:flex}.fd-progress{flex-direction:column;gap:4px;width:100%;display:flex}.fd-progress-label{font-size:var(--fd-font-size);color:var(--fd-text)}.fd-progress-bar{appearance:none;border-radius:var(--fd-radius);border:none;width:100%;height:8px}.fd-progress-bar::-webkit-progress-bar{background:var(--fd-border);border-radius:var(--fd-radius)}.fd-progress-bar::-webkit-progress-value{background:var(--fd-progress-color,var(--fd-accent));border-radius:var(--fd-radius)}.fd-progress-bar::-moz-progress-bar{background:var(--fd-progress-color,var(--fd-accent));border-radius:var(--fd-radius)}.fd-progress.fd-blue{--fd-progress-color:var(--fd-color-blue)}.fd-progress.fd-red{--fd-progress-color:var(--fd-color-red)}.fd-progress.fd-green{--fd-progress-color:var(--fd-color-green)}.fd-progress.fd-yellow{--fd-progress-color:var(--fd-color-yellow)}.fd-progress.fd-purple{--fd-progress-color:var(--fd-color-purple)}.fd-progress.fd-gray{--fd-progress-color:var(--fd-color-gray)}.fd-alert{width:100%;padding:var(--fd-gap) 16px;border:1px solid var(--fd-border);border-radius:var(--fd-radius);font-size:var(--fd-font-size);color:var(--fd-text)}.fd-alert.fd-blue{border-color:var(--fd-color-blue);color:var(--fd-color-blue)}.fd-alert.fd-red{border-color:var(--fd-color-red);color:var(--fd-color-red)}.fd-alert.fd-green{border-color:var(--fd-color-green);color:var(--fd-color-green)}.fd-alert.fd-yellow{border-color:var(--fd-color-yellow);color:var(--fd-color-yellow)}.fd-alert.fd-purple{border-color:var(--fd-color-purple);color:var(--fd-color-purple)}.fd-alert.fd-gray{border-color:var(--fd-color-gray);color:var(--fd-color-gray)}.fd-nav,.fd-footer{padding:var(--fd-gap) 16px;background:var(--fd-bg);border:1px solid var(--fd-border);border-radius:var(--fd-radius);align-items:center;gap:24px;width:100%;display:flex}.fd-logo{color:var(--fd-text);font-size:16px;font-weight:700}.fd-nav .fd-logo,.fd-footer .fd-logo{margin-right:auto}.fd-link{font-size:var(--fd-font-size);color:var(--fd-text-muted);text-decoration:none}.fd-link:hover{color:var(--fd-text)}.fd-badge{background:var(--fd-border);color:var(--fd-text);white-space:nowrap;border-radius:99px;align-self:flex-start;align-items:center;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.fd-row>.fd-badge{flex:none}.fd-badge.fd-blue{background:var(--fd-color-blue);color:var(--fd-text-on-color)}.fd-badge.fd-red{background:var(--fd-color-red);color:var(--fd-text-on-color)}.fd-badge.fd-green{background:var(--fd-color-green);color:var(--fd-text-on-color)}.fd-badge.fd-yellow{background:var(--fd-color-yellow);color:var(--fd-text-on-color)}.fd-badge.fd-purple{background:var(--fd-color-purple);color:var(--fd-text-on-color)}.fd-badge.fd-gray{background:var(--fd-color-gray);color:var(--fd-text-on-color)}.fd-button{font-family:var(--fd-font);font-size:var(--fd-font-size);color:var(--fd-text);background:var(--fd-bg);border:1px solid var(--fd-border);border-radius:var(--fd-radius);cursor:pointer;align-items:center;gap:6px;padding:6px 14px;font-weight:500;line-height:1.4;text-decoration:none;display:inline-flex}.fd-button.fd-primary{background:var(--fd-accent);border-color:var(--fd-accent);color:var(--fd-text-on-color)}.fd-button.fd-outline{background:0 0;border-color:currentColor}.fd-button.fd-ghost{background:0 0;border-color:#0000}.fd-button.fd-danger{color:var(--fd-color-red);border-color:var(--fd-color-red)}.fd-button.fd-success{color:var(--fd-color-green);border-color:var(--fd-color-green)}.fd-button.fd-blue{color:var(--fd-color-blue);border-color:var(--fd-color-blue)}.fd-button.fd-red{color:var(--fd-color-red);border-color:var(--fd-color-red)}.fd-button.fd-green{color:var(--fd-color-green);border-color:var(--fd-color-green)}.fd-button.fd-yellow{color:var(--fd-color-yellow);border-color:var(--fd-color-yellow)}.fd-button.fd-purple{color:var(--fd-color-purple);border-color:var(--fd-color-purple)}.fd-button.fd-gray{color:var(--fd-color-gray);border-color:var(--fd-color-gray)}.fd-button.fd-blue.fd-primary{background:var(--fd-color-blue);border-color:var(--fd-color-blue);color:var(--fd-text-on-color)}.fd-button.fd-red.fd-primary{background:var(--fd-color-red);border-color:var(--fd-color-red);color:var(--fd-text-on-color)}.fd-button.fd-green.fd-primary{background:var(--fd-color-green);border-color:var(--fd-color-green);color:var(--fd-text-on-color)}.fd-button.fd-yellow.fd-primary{background:var(--fd-color-yellow);border-color:var(--fd-color-yellow);color:var(--fd-text-on-color)}.fd-button.fd-purple.fd-primary{background:var(--fd-color-purple);border-color:var(--fd-color-purple);color:var(--fd-text-on-color)}.fd-button.fd-small{padding:3px 10px;font-size:12px}.fd-button.fd-large{padding:10px 22px;font-size:16px}.fd-button.fd-full{justify-content:center;width:100%}.fd-button.fd-disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.fd-input,.fd-textarea,.fd-dropdown-select{font-family:var(--fd-font);font-size:var(--fd-font-size);background:var(--fd-bg);border:1px solid var(--fd-border);border-radius:var(--fd-radius);padding:6px 10px;display:block}.fd-input,.fd-textarea{color:var(--fd-text-muted);width:240px}.fd-input.fd-full,.fd-textarea.fd-full{width:100%}.fd-textarea{resize:vertical;min-height:80px}.fd-dropdown{flex-direction:column;gap:4px;width:240px;display:inline-flex}.fd-dropdown.fd-full{width:100%}.fd-dropdown-label{color:var(--fd-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:600}.fd-dropdown-select{color:var(--fd-text);cursor:pointer;width:100%}.fd-dropdown-select:has(option[value=""]:checked){color:var(--fd-text-muted)}.fd-title{font-size:2em;font-weight:700}.fd-subtitle{color:var(--fd-text-muted);font-size:1.17em}.fd-checkbox,.fd-radio{font-size:var(--fd-font-size);cursor:pointer;color:var(--fd-text);align-items:center;gap:8px;display:inline-flex}.fd-checkbox input[type=checkbox],.fd-radio input[type=radio]{width:var(--fd-control-size);height:var(--fd-control-size);cursor:pointer;accent-color:var(--fd-accent)}.fd-checkbox.fd-disabled,.fd-radio.fd-disabled{opacity:.45;cursor:not-allowed}.fd-checkbox.fd-disabled input[type=checkbox],.fd-radio.fd-disabled input[type=radio]{cursor:not-allowed}.fd-toggle{font-size:var(--fd-font-size);cursor:pointer;color:var(--fd-text);align-items:center;gap:8px;display:inline-flex}.fd-toggle input[type=checkbox]{opacity:0;width:0;height:0;position:absolute}.fd-toggle-track{background:var(--fd-border);border-radius:10px;flex-shrink:0;width:36px;height:20px;position:relative}.fd-toggle input[type=checkbox]:checked+.fd-toggle-track{background:var(--fd-accent)}.fd-toggle-thumb{width:var(--fd-control-size);height:var(--fd-control-size);background:var(--fd-thumb);border-radius:50%;position:absolute;top:2px;left:2px}.fd-toggle input[type=checkbox]:checked+.fd-toggle-track .fd-toggle-thumb{transform:translate(16px)}.fd-toggle.fd-disabled{opacity:.45;cursor:not-allowed}.fd-page table{border-collapse:collapse;width:100%;font-size:var(--fd-font-size);font-family:var(--fd-font)}.fd-page th,.fd-page td{border:1px solid var(--fd-border);text-align:left;padding:6px 12px}.fd-page th{background:var(--fd-bg);color:var(--fd-text-muted);text-transform:uppercase;letter-spacing:.04em;font-size:11px;font-weight:600}.fd-img{border-radius:var(--fd-radius);max-width:100%;height:auto;display:block}.fd-img.fd-full{width:100%}.fd-img-placeholder{background:var(--fd-border);width:100%;min-height:160px;color:var(--fd-text-muted);font-size:var(--fd-font-size);font-family:var(--fd-font);border-radius:var(--fd-radius);justify-content:center;align-items:center;display:flex}.fd-card.fd-has-bg,.fd-hero.fd-has-bg{background-position:50%;background-repeat:no-repeat;background-size:cover}.fd-breadcrumb-list{font-size:var(--fd-font-size);font-family:var(--fd-font);flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none;display:flex}.fd-breadcrumb-item+.fd-breadcrumb-item:before{content:"/";color:var(--fd-text-muted);margin:0 6px}.fd-breadcrumb-link{color:var(--fd-text-muted);text-decoration:none}.fd-breadcrumb-link:hover{text-decoration:underline}.fd-breadcrumb-current{color:var(--fd-text)}.fd-accordion{border:1px solid var(--fd-border);border-radius:var(--fd-radius);width:100%;overflow:hidden}.fd-accordion-item{border-bottom:1px solid var(--fd-border)}.fd-accordion-item:last-child{border-bottom:none}.fd-accordion-summary{padding:10px var(--fd-gap);cursor:pointer;font-size:var(--fd-font-size);font-family:var(--fd-font);color:var(--fd-text);-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;list-style:none;display:flex}.fd-accordion-summary::-webkit-details-marker{display:none}.fd-accordion-summary:after{content:"+";color:var(--fd-text-muted);flex-shrink:0;font-size:16px;line-height:1}.fd-accordion-item[open] .fd-accordion-summary:after{content:"−"}.fd-accordion-panel{padding:var(--fd-gap);border-top:1px solid var(--fd-border);gap:var(--fd-gap);font-size:var(--fd-font-size);font-family:var(--fd-font);flex-direction:column;display:flex}.fd-tooltip{align-items:center;display:inline-flex}.fd-tooltip-trigger{border:1px solid var(--fd-border);border-radius:var(--fd-radius);font-size:var(--fd-font-size);font-family:var(--fd-font);cursor:pointer;color:var(--fd-text-muted);background:0 0;padding:2px 8px}.fd-tooltip-content{border:1px solid var(--fd-border);border-radius:var(--fd-radius);padding:var(--fd-gap);background:var(--fd-bg);font-family:var(--fd-font);font-size:var(--fd-font-size);color:var(--fd-text);max-width:280px;box-shadow:var(--fd-shadow)}.fd-tooltip-content:popover-open{gap:var(--fd-gap);inset:unset;top:anchor(bottom);left:anchor(left);position-try-fallbacks:flip-block, flip-inline;flex-direction:column;margin-top:4px;display:flex}.fd-tabs-radio{display:none}.fd-tabs{border:1px solid var(--fd-border);border-radius:var(--fd-radius)}.fd-tabs-list{border-bottom:1px solid var(--fd-border);display:flex}.fd-tabs-tab{cursor:pointer;font-size:var(--fd-font-size);color:var(--fd-text-muted);-webkit-user-select:none;user-select:none;border-bottom:2px solid #0000;margin-bottom:-1px;padding:8px 16px}.fd-tabs-panel{padding:var(--fd-gap);gap:var(--fd-gap);flex-direction:column;display:none}:is(.fd-tabs:has(.fd-tabs-radio:first-of-type:checked) .fd-tabs-tab:first-of-type,.fd-tabs:has(.fd-tabs-radio:nth-of-type(2):checked) .fd-tabs-tab:nth-of-type(2),.fd-tabs:has(.fd-tabs-radio:nth-of-type(3):checked) .fd-tabs-tab:nth-of-type(3),.fd-tabs:has(.fd-tabs-radio:nth-of-type(4):checked) .fd-tabs-tab:nth-of-type(4),.fd-tabs:has(.fd-tabs-radio:nth-of-type(5):checked) .fd-tabs-tab:nth-of-type(5)){color:var(--fd-text);border-bottom-color:var(--fd-accent)}:is(.fd-tabs:has(.fd-tabs-radio:first-of-type:checked) .fd-tabs-panel:first-of-type,.fd-tabs:has(.fd-tabs-radio:nth-of-type(2):checked) .fd-tabs-panel:nth-of-type(2),.fd-tabs:has(.fd-tabs-radio:nth-of-type(3):checked) .fd-tabs-panel:nth-of-type(3),.fd-tabs:has(.fd-tabs-radio:nth-of-type(4):checked) .fd-tabs-panel:nth-of-type(4),.fd-tabs:has(.fd-tabs-radio:nth-of-type(5):checked) .fd-tabs-panel:nth-of-type(5)){display:flex}.fd-modal:not([open]){display:none}.fd-modal{border:1px solid var(--fd-border);border-radius:var(--fd-radius);background:var(--fd-bg);width:480px;max-width:calc(100vw - 48px);font-family:var(--fd-font);gap:var(--fd-gap);flex-direction:column;padding:24px;display:flex;position:relative}.fd-modal::backdrop{background:var(--fd-backdrop)}.fd-modal-close{top:var(--fd-gap);right:var(--fd-gap);cursor:pointer;color:var(--fd-text-muted);background:0 0;border:none;padding:4px;font-size:16px;line-height:1;position:absolute}.fd-radiogroup{border:none;flex-direction:column;gap:8px;margin:0;padding:0;display:flex}.fd-radiogroup-legend{color:var(--fd-text-muted);text-transform:uppercase;letter-spacing:.05em;float:none;width:100%;margin-bottom:4px;padding:0;font-size:11px;font-weight:600}