:root{color-scheme:light;--app-bg:#f8fafc;--surface:#fff;--surface-soft:#f7f9fc;--ink:#111827;--muted:#64748b;--border:#d6dce5;--border-strong:#b9c2cf;--blue:#2563eb;--blue-hover:#1d4ed8;--green:#16a34a;--red:#dc2626;--radius:8px;--font-ui:Inter , "Segoe UI" , Arial , sans-serif;--font-display:"Aptos Display" , "Segoe UI" , Arial , sans-serif;--font-mono:"Cascadia Code" , "SFMono-Regular" , Consolas , monospace}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{overflow:hidden;background:var(--app-bg);color:var(--ink);font-family: var(--font-ui);font-size:14px;-webkit-font-smoothing:antialiased}button,input,select,textarea{color:inherit;font:inherit}button,select,input[type="color"],input[type="range"],summary{cursor:pointer}button:focus-visible,select:focus-visible,textarea:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid rgba(37,99,235,.22);outline-offset:2px}.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}.app-shell{display:grid;grid-template-rows:68px minmax(0,1fr) 42px;width:100%;height:100vh;min-height:100vh;overflow:hidden;background:var(--surface)}.topbar{display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid var(--border);background:var(--surface)}.brand{display:inline-flex;align-items:center;gap:14px;color:var(--ink);font-family: var(--font-display);font-size:25px;font-weight:650;letter-spacing:-.035em;text-decoration:none}.brand-mark{display:grid;width:36px;height:32px;place-items:center}.brand-mark svg{width:100%;height:100%}.topbar-actions,.connection-status,.icon-text-button{display:flex;align-items:center}.topbar-actions{gap:23px}.connection-status{gap:9px;color:#334155;font-size:13px;font-weight:550}.status-dot{width:10px;height:10px;border-radius:50%;background:var(--green)}.connection-status.is-error .status-dot{background:var(--red)}.connection-status.is-busy .status-dot{background:#f59e0b;animation:pulse 1.1s ease-in-out infinite}.icon-text-button{gap:9px;padding:9px 0 9px 22px;border:0;border-left:1px solid var(--border);background:transparent;font-size:13px;font-weight:600}.icon-text-button:hover{color:var(--blue)}#aboutButton{margin-left:1px}.icon-text-button svg,.button svg,.advanced-css svg,.ai-assistant summary>svg,.ai-preset-button svg,.status-icon svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.icon-text-button svg{width:19px;height:19px}.about-dialog{width:min(540px,calc(100vw - 32px));max-height:min(720px,calc(100vh - 32px));margin:auto;padding:0;overflow:hidden;border:1px solid #d9e1eb;border-radius:12px;background:#fff;box-shadow:0 24px 70px rgba(15,23,42,.24);color:var(--text)}.about-dialog::backdrop{background:rgba(15,23,42,.48);backdrop-filter:blur(2px)}.about-dialog-header,.about-dialog-footer{display:flex;align-items:center;justify-content:space-between}.about-dialog-header{padding:22px 24px 18px;border-bottom:1px solid var(--border)}.about-heading{display:flex;align-items:center;gap:13px}.about-mark{display:grid;width:42px;height:38px;flex:0 0 auto;place-items:center}.about-mark svg{width:40px;height:32px}.about-heading h2{margin:0;font-family: var(--font-display);font-size:20px;letter-spacing:-.025em}.about-heading div>span{display:block;margin-top:3px;color:var(--muted);font-size:11px}.about-close{display:grid;width:36px;height:36px;padding:0;border:1px solid var(--border);border-radius:7px;background:#fff;color:#64748b;place-items:center}.about-close:hover{border-color:#bfdbfe;background:#eff6ff;color:var(--blue)}.about-close svg,.sponsor-icon svg,.profile-link svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.about-close svg{width:18px;height:18px}.about-dialog-body{display:grid;gap:16px;padding:22px 24px;overflow-y:auto}.about-dialog-body>p{margin:0;color:#475569;font-size:13px;line-height:1.65}.about-availability,.about-sponsor{display:grid;grid-template-columns:auto minmax(0,1fr);gap:13px;padding:14px;border-radius:8px}.about-availability{border:1px solid #fde68a;background:#fffbeb}.malaysia-mark,.sponsor-icon{display:grid;width:34px;height:34px;flex:0 0 auto;place-items:center}.malaysia-mark{border-radius:6px;background:#0f172a;color:#fff;font-size:10px;font-weight:850;letter-spacing:.08em}.about-availability h3,.about-sponsor h3{margin:0 0 4px;font-size:12px;font-weight:800}.about-availability p,.about-sponsor p{margin:0;color:#475569;font-size:11px;line-height:1.5}.about-sponsor{border:1px solid #bfdbfe;background:#f8fbff}.sponsor-icon{border-radius:6px;background:#dbeafe;color:#1d4ed8}.sponsor-icon svg{width:18px;height:18px}.about-sponsor a{color:#1d4ed8;font-weight:700}.about-sponsor a:hover{color:#1e40af}.profile-link{display:inline-flex;align-items:center;gap:5px;margin-top:9px;font-size:10px;text-decoration:none}.profile-link svg{width:13px;height:13px}.about-dialog-footer{gap:18px;padding:14px 24px;border-top:1px solid var(--border);background:#f8fafc}.about-dialog-footer>span{color:#64748b;font-size:10px;line-height:1.4}.about-dialog-footer .button{min-width:78px;min-height:36px}.workspace{display:grid;grid-template-columns:minmax(330px,31%) minmax(420px,1fr) minmax(330px,30%);min-height:0;background:var(--surface)}.panel{min-width:0;min-height:0}.editor-panel,.preview-panel{border-right:1px solid var(--border)}.editor-panel{display:grid;grid-template-rows:76px minmax(300px,1fr) auto}.preview-panel{display:grid;grid-template-rows:76px minmax(300px,1fr) 116px}.style-panel{overflow-y:auto;scrollbar-color:#cbd5e1 transparent}.panel-header{display:flex;align-items:center;justify-content:space-between;height:76px;padding:0 28px}.panel-header h1,.panel-header h2{margin:0;font-family: var(--font-display);font-size:16px;font-weight:700;letter-spacing:-.015em}.editor-header{gap:16px}.sample-field{margin-left:auto}.sample-field select{min-width:146px;height:38px;padding:0 36px 0 13px;border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);font-size:13px}.code-editor{display:grid;grid-template-columns:55px 1fr;min-height:0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:#fbfcfe;overflow:hidden}.line-numbers{overflow:hidden;padding:18px 14px 40px 0;border-right:1px solid #e2e8f0;color:#8a98aa;font-family: var(--font-mono);font-size:13px;line-height:24px;text-align:right;white-space:pre;user-select:none}#sourceEditor{width:100%;height:100%;min-height:300px;resize:none;padding:18px 18px 40px 17px;border:0;outline:none;background:transparent;color:#172554;font-family: var(--font-mono);font-size:13px;font-weight:500;line-height:24px;tab-size:2;white-space:pre}#sourceEditor:focus{box-shadow:inset 3px 0 var(--blue)}.editor-actions{display:grid;grid-template-columns:1fr 52px;gap:12px;padding:22px 28px 24px}.keyboard-tip{grid-column: 1 / -1;margin:1px 0 0;color:var(--muted);font-size:12px}kbd{font-family:inherit}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:42px;border:1px solid transparent;border-radius:var(--radius);background:transparent;font-size:13px;font-weight:700;transition:background-color .16s ease , border-color .16s ease , color .16s ease , transform .16s ease}.button:hover:not(:disabled) {transform:translateY(-1px)}.button:active:not(:disabled) {transform:translateY(0)}.button:disabled{cursor:not-allowed;opacity:.48}.button svg{width:20px;height:20px}.button-primary{border-color:var(--blue);background:var(--blue);color:#fff}.button-primary:hover:not(:disabled) {border-color:var(--blue-hover);background:var(--blue-hover)}.button-secondary,.button-icon,.zoom-value{border-color:var(--border-strong);background:var(--surface);color:#334155}.button-secondary:hover:not(:disabled),
.button-icon:hover:not(:disabled),
.zoom-value:hover {border-color:#94a3b8;background:var(--surface-soft);color:var(--ink)}.button-icon{width:52px;padding:0}.button-icon.compact{width:36px;min-height:36px}.generate-button svg{fill:currentColor;stroke:none}.preview-header{border-bottom:1px solid var(--border)}.zoom-controls{display:flex;gap:7px}.zoom-value{min-width:57px;height:36px;padding:0 8px;border-style:solid;border-width:1px;border-radius:var(--radius);font-size:12px}.preview-stage{position:relative;min-height:0;overflow:hidden;background-color:#fff;background-image:radial-gradient(#dfe5ec 1px,transparent 1px);background-size:24px 24px}.preview-stage[data-background="transparent"]{background-color:#fff;background-image:linear-gradient(45deg,#eef1f5 25%,transparent 25%) , linear-gradient(-45deg,#eef1f5 25%,transparent 25%) , linear-gradient(45deg,transparent 75%,#eef1f5 75%) , linear-gradient(-45deg,transparent 75%,#eef1f5 75%);background-position:0 0 , 0 8px , 8px -8px , -8px 0;background-size:16px 16px}.empty-state,.loading-state,.error-state{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center}.empty-state,.loading-state{flex-direction:column;text-align:center}.empty-state[hidden],.loading-state[hidden],.error-state[hidden],.diagram-viewport[hidden]{display:none}.empty-symbol{width:72px;color:#94a3b8}.empty-symbol svg{width:100%;fill:#fff;stroke:currentColor;stroke-width:1.5}.empty-state h3{margin:16px 0 6px;font-family: var(--font-display);font-size:16px}.empty-state p,.loading-state span,.error-state p{margin:0;color:var(--muted);font-size:13px}.loading-state{gap:9px;background:rgba(255,255,255,.86)}.spinner{width:30px;height:30px;margin-bottom:5px;border:3px solid #dbeafe;border-top-color:var(--blue);border-radius:50%;animation:spin .8s linear infinite}.error-state{gap:14px;padding:32px;background:#fff}.error-state>svg{flex:0 0 auto;width:30px;fill:none;stroke:var(--red);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.error-state strong{display:block;margin-bottom:5px;color:#991b1b}.error-state p{max-width:440px;line-height:1.5}.diagram-viewport{position:absolute;inset:0;display:grid;overflow:auto;place-items:center;padding:0}#diagramImage{display:block;max-width:calc(100% - 84px);max-height:calc(100% - 84px);transform:scale(var(--diagram-scale,1));transform-origin:center;transition:transform .18s ease}.export-bar{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:18px;padding:27px 36px;border-top:1px solid var(--border);background:var(--surface)}.export-button{position:relative;min-height:48px}.quality-tag{position:absolute;right:13px;padding:2px 5px;border:1px solid rgba(255,255,255,.55);border-radius:4px;font-size:10px;font-weight:800}.style-panel>.panel-header{height:54px;padding-bottom:0}#styleForm{padding:0 22px 16px}.control-section{min-width:0;margin:0;padding:11px 0;border:0;border-bottom:1px solid #e6eaf0}.control-section legend{margin-bottom:9px;padding:0;font-size:13px;font-weight:750}.theme-grid{display:grid;grid-template-columns:repeat(3,minmax(70px,1fr));gap:8px}.theme-option{position:relative;display:flex;min-width:0;flex-direction:column;align-items:center;gap:7px;cursor:pointer;color:#475569;font-size:10px;font-weight:650;text-align:center}.theme-option input{position:absolute;opacity:0;pointer-events:none}.theme-preview{position:relative;display:block;width:100%;height:52px;border:1px solid var(--border-strong);border-radius:7px;background:#fff}.theme-preview::before,.theme-preview::after{position:absolute;left:50%;width:1px;height:8px;background:#475569;content:""}.theme-preview::before{top:15px}.theme-preview::after{bottom:8px}.theme-preview i{position:absolute;left:50%;display:block;width:18px;height:10px;border:1px solid #475569;background:#f8fafc;transform:translateX(-50%)}.theme-preview i:first-child{top:5px}.theme-preview i:nth-child(2) {top:20px;width:14px;height:14px;transform:translateX(-50%) rotate(45deg)}.theme-preview i:last-child{bottom:4px}.theme-pastel i:first-child{background:#dbeafe}.theme-pastel i:nth-child(2) {background:#fce7f3}.theme-pastel i:last-child{background:#d1fae5}.theme-academic i:first-child{background:#dbeafe}.theme-academic i:nth-child(2) {background:#fef3c7}.theme-academic i:last-child{background:#bfdbfe}.theme-brutalism i{border-width:2px;border-color:#111}.theme-brutalism i:first-child,.theme-brutalism i:last-child{background:#111}.theme-neobrutalism i{border-width:2px;border-color:#111}.theme-neobrutalism i:first-child{background:#c7f464}.theme-neobrutalism i:nth-child(2) {background:#8b5cf6}.theme-neobrutalism i:last-child{background:#f97316}.theme-ocean i:first-child{background:#dbeafe;border-color:#0369a1}.theme-ocean i:nth-child(2) {background:#cffafe;border-color:#0369a1}.theme-ocean i:last-child{background:#e0e7ff;border-color:#0369a1}.theme-forest i:first-child{background:#dcfce7;border-color:#166534}.theme-forest i:nth-child(2) {background:#ecfccb;border-color:#166534}.theme-forest i:last-child{background:#fef3c7;border-color:#166534}.theme-sunset i:first-child{background:#ffedd5;border-color:#c2410c}.theme-sunset i:nth-child(2) {background:#fce7f3;border-color:#c2410c}.theme-sunset i:last-child{background:#fef3c7;border-color:#c2410c}.theme-custom{border-style:dashed;background-color:#f8fafc}.theme-custom i:first-child{background:#38bdf8;border-color:#0f172a}.theme-custom i:nth-child(2) {background:#f472b6;border-color:#0f172a}.theme-custom i:last-child{background:#a3e635;border-color:#0f172a}.theme-option input:checked+.theme-preview{border:2px solid var(--blue);box-shadow:0 0 0 2px rgba(37,99,235,.1)}.theme-option input:checked ~ span:last-child {color:var(--blue);font-weight:800}.theme-option input:focus-visible+.theme-preview{outline:3px solid rgba(37,99,235,.22);outline-offset:2px}.color-list{display:grid;gap:5px}.color-field{display:grid;grid-template-columns:84px 1fr;align-items:center;gap:12px;color:#334155;font-size:12px}.color-input-wrap,.custom-background{display:flex;align-items:center;gap:10px;min-height:30px;padding:2px 9px 2px 6px;border:1px solid var(--border-strong);border-radius:7px;background:var(--surface)}input[type="color"]{width:28px;height:23px;padding:0;border:0;border-radius:4px;background:none}input[type="color"]::-webkit-color-swatch-wrapper{padding:0}input[type="color"]::-webkit-color-swatch{border:1px solid #cbd5e1;border-radius:4px}.color-input-wrap output,.custom-background output{color:#475569;font-family: var(--font-mono);font-size:11px}.range-row{display:grid;grid-template-columns:1fr 66px;align-items:center;gap:14px}input[type="range"]{width:100%;accent-color:var(--blue)}.range-row output{padding:6px 7px;border:1px solid var(--border-strong);border-radius:7px;color:#334155;font-size:11px;font-weight:700;text-align:center}.segmented-control{display:grid;grid-template-columns:repeat(3,1fr)}.segmented-control label{position:relative;min-width:0}.segmented-control input{position:absolute;opacity:0;pointer-events:none}.segmented-control span{display:grid;min-height:32px;place-items:center;border:1px solid var(--border-strong);color:#475569;font-size:10px;font-weight:650}.segmented-control label:first-child span{border-radius:7px 0 0 7px}.segmented-control label+label span{border-left:0}.segmented-control label:last-child span{border-radius:0 7px 7px 0}.segmented-control input:checked+span{position:relative;z-index:1;border-color:var(--blue);background:#eff6ff;color:var(--blue)}.segmented-control input:focus-visible+span{outline:3px solid rgba(37,99,235,.22);outline-offset:2px}.custom-background{width:100%;margin-top:6px}.custom-background.is-inactive{opacity:.48}.advanced-css{padding:11px 0;border-bottom:1px solid #e6eaf0}.advanced-css summary{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:750;list-style:none}.advanced-css summary::-webkit-details-marker{display:none}.advanced-css summary svg{width:18px;transition:transform .16s ease}.advanced-css[open] summary svg{transform:rotate(180deg)}.advanced-css textarea{width:100%;height:60px;min-height:60px;margin-top:8px;resize:vertical;padding:10px 11px;border:1px solid var(--border-strong);border-radius:7px;background:#fbfcfe;font-family: var(--font-mono);font-size:11px;line-height:1.55}.advanced-css p{margin:5px 0 0;color:var(--muted);font-size:10px;line-height:1.4}.advanced-css code{font-family: var(--font-mono)}.ai-assistant{padding:12px 0;border-bottom:1px solid #e6eaf0}.ai-assistant summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;list-style:none}.ai-assistant summary::-webkit-details-marker{display:none}.ai-summary-title{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:13px;font-weight:750}.experimental-badge{padding:3px 6px;border:1px solid #f59e0b;border-radius:4px;background:#fffbeb;color:#92400e;font-size:8px;font-weight:800;letter-spacing:.05em;line-height:1;text-transform:uppercase}.ai-assistant summary>svg{width:18px;flex:0 0 auto;transition:transform .16s ease}.ai-assistant[open] summary>svg{transform:rotate(180deg)}.ai-assistant-body{display:grid;gap:10px;padding-top:10px}.ai-warning{margin:0;padding:8px 9px;border-left:3px solid #f59e0b;background:#fffbeb;color:#78350f;font-size:10px;line-height:1.45}.ai-key-card{padding:10px;border:1px solid var(--border);border-radius:7px;background:#fbfcfe}.ai-key-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.ai-key-heading strong,.ai-key-heading span{display:block}.ai-key-heading strong{color:#1e293b;font-size:11px}.ai-key-heading div>span,.ai-key-card>p{color:var(--muted);font-size:9px;line-height:1.4}.ai-key-status{flex:0 0 auto;color:#64748b;font-size:9px;font-weight:750}.ai-key-status.is-configured{color:#047857}.ai-key-status.is-error{color:#b91c1c}.ai-key-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-top:8px}.ai-key-controls input{width:100%;min-width:0;height:34px;padding:0 9px;border:1px solid var(--border-strong);border-radius:6px;background:#fff;color:#0f172a;font-family: var(--font-mono);font-size:10px}.ai-key-controls input:focus{border-color:var(--blue);outline:3px solid rgba(37,99,235,.14)}.ai-key-button{min-height:34px;padding:0 10px;color:var(--blue);font-size:10px}.ai-key-card>p{margin:6px 0 0}.ai-preset-group{min-width:0;margin:0;padding:0;border:0}.ai-preset-group legend{margin-bottom:7px;color:#475569;font-size:10px;font-weight:750}.ai-preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.ai-preset-button{display:flex;align-items:center;gap:7px;min-height:44px;padding:7px 8px;border:1px solid #cbd5e1;border-radius:7px;background:#fff;color:#334155;font:inherit;font-size:9px;font-weight:700;line-height:1.25;text-align:left}.ai-preset-button:hover:not(:disabled) {border-color:#93c5fd;background:#eff6ff;color:#1d4ed8}.ai-preset-button:focus-visible{outline:3px solid rgba(37,99,235,.22);outline-offset:1px}.ai-preset-button:disabled{cursor:not-allowed;opacity:.47}.ai-preset-button svg{width:17px;height:17px;flex:0 0 auto;stroke-width:1.7}.ai-preset-wide{grid-column: 1 / -1}.ai-feedback{min-height:30px;padding:7px 9px;border:1px solid #dbe3ed;border-radius:6px;background:#f8fafc;color:#475569;font-size:9px;line-height:1.4}.ai-feedback.is-working,.ai-feedback.is-success,.ai-feedback.is-error{padding-left:28px;position:relative}.ai-feedback.is-working::before{content:"";position:absolute;top:50%;left:9px;width:10px;height:10px;margin-top:-6px;border:2px solid #bfdbfe;border-top-color:#2563eb;border-radius:50%;animation:spin .75s linear infinite}.ai-feedback.is-success{border-color:#a7f3d0;background:#ecfdf5;color:#065f46}.ai-feedback.is-success::before,.ai-feedback.is-error::before{position:absolute;top:6px;left:9px;font-size:12px;font-weight:900}.ai-feedback.is-success::before{content:"✓"}.ai-feedback.is-error{border-color:#fecaca;background:#fef2f2;color:#991b1b}.ai-feedback.is-error::before{content:"!"}.ai-undo-button{width:100%;min-height:32px;color:#334155;font-size:10px}.ai-undo-button[hidden]{display:none}.ai-model{margin:-3px 0 0;color:#94a3b8;font-size:8px;text-align:center}.save-section{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;padding-top:8px}.save-section strong,.save-section span{display:block}.save-section strong{margin-bottom:3px;font-size:13px}.save-section>div>span{color:var(--muted);font-size:10px}.save-button{min-height:34px;padding:0 13px;color:var(--blue)}.save-button svg{width:17px;height:17px}.statusbar{display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-top:1px solid var(--border);background:var(--surface);color:#475569;font-size:12px}.status-message{display:flex;align-items:center;gap:9px}.status-icon{display:grid;width:20px;height:20px;place-items:center;border-radius:50%}.status-icon svg{width:20px;height:20px}.status-icon.is-ready{color:var(--green)}.status-icon.is-busy{color:#d97706;animation:pulse 1.1s ease-in-out infinite}.status-icon.is-error{color:var(--red)}.status-meta{color:#7c899b}.toast{position:fixed;z-index:20;right:24px;bottom:62px;max-width:min(360px,calc(100vw - 48px));padding:12px 15px;border:1px solid #bfdbfe;border-radius:var(--radius);background:#eff6ff;box-shadow:0 10px 30px rgba(15,23,42,.15);color:#1e40af;font-size:12px;font-weight:650}@keyframes spin {
    to { transform: rotate(360deg); }
}@keyframes pulse {
    50% { opacity: .45; }
}@media (max-width:1180px){.workspace{grid-template-columns:minmax(310px,37%) 1fr}.style-panel{grid-column: 1 / -1;border-top:1px solid var(--border)}#styleForm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px}.theme-section,.color-section{grid-row:span 2}.advanced-css,.ai-assistant,.save-section{align-self:start}}@media (max-width:760px){body{overflow:auto}.app-shell{display:block;height:auto;overflow:visible}.topbar{min-height:62px;padding:0 16px}.brand{gap:9px;font-size:20px}.brand-mark{width:30px;height:27px}.connection-status span:last-child,.icon-text-button span{display:none}.topbar-actions{gap:12px}.icon-text-button{padding-left:14px}.about-dialog{width:calc(100vw - 24px);max-height:calc(100vh - 24px)}.about-dialog-header,.about-dialog-body,.about-dialog-footer{padding-right:17px;padding-left:17px}.about-dialog-header{padding-top:17px;padding-bottom:14px}.about-dialog-body{gap:12px;padding-top:17px;padding-bottom:17px}.about-heading h2{font-size:18px}.about-dialog-footer{align-items:flex-start}.workspace{display:block}.editor-panel,.preview-panel{border-right:0;border-bottom:1px solid var(--border)}.editor-panel{grid-template-rows:auto 430px auto}.preview-panel{grid-template-rows:auto 520px auto}.panel-header{height:auto;min-height:68px;padding:14px 16px}.code-editor{grid-template-columns:44px 1fr}.line-numbers{padding-right:10px}.editor-actions,.export-bar{padding:18px 16px}.export-bar{grid-template-columns:1fr;gap:10px}#styleForm{display:block;padding:0 16px 24px}.theme-grid{gap:6px}.theme-preview{height:58px}.ai-preset-grid{grid-template-columns:1fr}.ai-preset-wide{grid-column:auto}.statusbar{min-height:42px;padding:0 16px}.status-meta{display:none}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}