.artifact-preview{margin:20px 0;border:1px solid var(--line,#343430);border-radius:12px;overflow:hidden;background:var(--surface,#20201e);color:var(--text,#efeee9);box-shadow:none;isolation:isolate}
.artifact-preview__header{display:flex;align-items:center;gap:10px;padding:14px 16px;background:#ffffff04;border-bottom:1px solid #ffffff0d;flex-wrap:wrap}
.artifact-preview__header strong{font:600 12px/1.4 "Cascadia Code",Consolas,monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.artifact-preview__mark{color:var(--accent,#d6c5a6);font-size:18px}
.artifact-preview__actions{margin-left:auto;display:flex;gap:5px;flex-wrap:wrap}
.artifact-preview button,.artifact-preview-dialog>button{border:1px solid transparent;border-radius:7px;background:transparent;color:var(--muted,#aaa89f);padding:7px 10px;font:12px/1.4 "Public Sans","Segoe UI",sans-serif;cursor:pointer;transition:background .18s,color .18s}
.artifact-preview button:hover,.artifact-preview button[aria-pressed=true],.artifact-preview-dialog>button:hover{background:var(--hover,#30302c);color:var(--text,#efeee9)}
.artifact-preview button:focus-visible,.artifact-preview-dialog>button:focus-visible{outline:2px solid var(--accent,#d6c5a6);outline-offset:2px}
.artifact-preview button:disabled{opacity:.4;cursor:default}
.artifact-preview__panel{height:clamp(400px,60vh,640px);position:relative;overflow:hidden}
.artifact-preview__view,.artifact-preview__code{height:100%;margin:0!important;width:100%;box-sizing:border-box}
.artifact-preview [hidden]{display:none!important}
.artifact-preview__code{overflow:auto;overflow-anchor:none;overscroll-behavior:contain;padding:22px!important;border:0!important;border-radius:0!important;box-shadow:none!important;font:12px/1.7 ui-monospace,monospace;white-space:pre;background:var(--panel,#181817)!important;color:var(--text,#efeee9)}
.artifact-preview[data-view=code] .artifact-preview__panel{height:auto}
.artifact-preview[data-view=code] .artifact-preview__code{height:auto;max-height:clamp(240px,55vh,600px);padding:18px 20px!important;font:13px/1.65 "Cascadia Code","SFMono-Regular",Consolas,monospace;tab-size:4}
.artifact-preview[data-view=code][data-state=ready] .artifact-preview__status{display:none}
.artifact-preview__prose[hidden]{display:none}
.artifact-preview__code .hljs-comment,.code-block .hljs-comment{color:#9b9b8e;font-style:italic}
.artifact-preview__code .hljs-keyword,.code-block .hljs-keyword,.artifact-preview__code .hljs-selector-tag,.code-block .hljs-selector-tag{color:#e8a58d}
.artifact-preview__code .hljs-string,.code-block .hljs-string,.artifact-preview__code .hljs-regexp,.code-block .hljs-regexp{color:#b6cd9c}
.artifact-preview__code .hljs-number,.code-block .hljs-number,.artifact-preview__code .hljs-literal,.code-block .hljs-literal{color:#dfb582}
.artifact-preview__code .hljs-title,.code-block .hljs-title,.artifact-preview__code .hljs-built_in,.code-block .hljs-built_in{color:#e5cd94}
.artifact-preview__code .hljs-attr,.code-block .hljs-attr,.artifact-preview__code .hljs-type,.code-block .hljs-type,.artifact-preview__code .hljs-selector-class,.code-block .hljs-selector-class{color:#cbb8e0}
.artifact-preview__code .hljs-name,.code-block .hljs-name,.artifact-preview__code .hljs-tag,.code-block .hljs-tag{color:#98c8c0}
.artifact-preview__code .hljs-variable,.code-block .hljs-variable,.artifact-preview__code .hljs-property,.code-block .hljs-property{color:#dfcec0}
.artifact-preview__code .hljs-meta,.code-block .hljs-meta{color:#b5b7a1}
html[data-theme=light] .artifact-preview__code .hljs-comment,html[data-theme=light] .code-block .hljs-comment{color:#68705e}
html[data-theme=light] .artifact-preview__code :is(.hljs-keyword,.hljs-selector-tag),html[data-theme=light] .code-block :is(.hljs-keyword,.hljs-selector-tag){color:#99412c}
html[data-theme=light] .artifact-preview__code :is(.hljs-string,.hljs-regexp),html[data-theme=light] .code-block :is(.hljs-string,.hljs-regexp){color:#426628}
html[data-theme=light] .artifact-preview__code :is(.hljs-number,.hljs-literal,.hljs-title,.hljs-built_in),html[data-theme=light] .code-block :is(.hljs-number,.hljs-literal,.hljs-title,.hljs-built_in){color:#825819}
html[data-theme=light] .artifact-preview__code :is(.hljs-attr,.hljs-type,.hljs-selector-class),html[data-theme=light] .code-block :is(.hljs-attr,.hljs-type,.hljs-selector-class){color:#725395}
html[data-theme=light] .artifact-preview__code :is(.hljs-name,.hljs-tag),html[data-theme=light] .code-block :is(.hljs-name,.hljs-tag){color:#286b62}
html[data-theme=light] .artifact-preview__code :is(.hljs-variable,.hljs-property,.hljs-meta),html[data-theme=light] .code-block :is(.hljs-variable,.hljs-property,.hljs-meta){color:#63553e}
.artifact-preview__fresh{animation:preview-code-ink .22s ease-out both}
.artifact-preview[data-state=generating] .artifact-preview__code:after{content:"";display:inline-block;width:5px;height:14px;margin-left:3px;vertical-align:text-bottom;background:var(--accent,#d6c5a6);border-radius:1px;opacity:.6}
.artifact-preview iframe{width:100%;height:100%;border:0;background:white}
.artifact-preview__status{padding:11px 16px;border-top:1px solid #ffffff0b;color:#92929e;font-size:11px}
.artifact-preview__skeleton{height:100%;position:relative;overflow:hidden;padding:44px 32px;box-sizing:border-box;background:var(--panel,#181817)}
.artifact-preview__orb{display:none}
.artifact-preview__line,.artifact-preview__tile{position:relative;display:block;background:linear-gradient(100deg,#ffffff05 25%,#ffffff10 48%,#ffffff05 70%);background-size:240% 100%;animation:preview-shimmer 2s linear infinite;animation-delay:var(--preview-phase);border-radius:9px;height:13px;width:45%;margin:15px 0}
.artifact-preview__line:nth-of-type(3){width:70%}.artifact-preview__tile{height:180px;width:100%;margin-top:32px;border:1px solid #ffffff05}
.artifact-preview-dialog{width:calc(100vw - 32px);max-width:none;height:calc(100dvh - 32px);max-height:calc(100dvh - 32px);box-sizing:border-box;padding:12px;border:1px solid #ffffff20;border-radius:16px;background:var(--panel,#181817);color:var(--text,#efeee9);box-shadow:0 24px 120px #0009;overflow:hidden}
.artifact-preview-dialog[open]{display:flex;flex-direction:column;gap:8px}
.artifact-preview-dialog::backdrop{background:#0009;backdrop-filter:blur(8px)}
.artifact-preview-dialog>button{display:block;margin-left:auto;flex-shrink:0}.artifact-preview-dialog .artifact-preview{margin:0;flex:1;min-height:0;display:flex;flex-direction:column}.artifact-preview-dialog .artifact-preview__panel{height:auto;flex:1;min-height:0}.artifact-preview-dialog .artifact-preview__header,.artifact-preview-dialog .artifact-preview__status{flex-shrink:0}
@keyframes preview-drift{50%{transform:translate(30%,10%) scale(1.15)}}
@keyframes preview-shimmer{to{background-position:-140% 0}}
@keyframes preview-code-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes preview-code-ink{from{opacity:.35}to{opacity:1}}
@keyframes preview-cursor{50%{opacity:.3}}
@media(prefers-reduced-motion:reduce){.artifact-preview *,.artifact-preview *::after{animation:none!important;transition:none!important}}
@media(max-width:600px){.artifact-preview__header{padding:12px}.artifact-preview__actions{width:100%;margin-left:0}.artifact-preview__panel{height:330px}.artifact-preview__header strong{max-width:85%}}