.web-artifact-card.is-open:has(.web-project-panel){width:min(950px,calc(100vw - 380px));max-width:none;margin:24px 0 24px calc((100% - min(950px,calc(100vw - 380px)))/2)}.web-project-panel{height:720px;max-height:80dvh;border-radius:38px}.web-project-panel header{height:72px;min-height:72px;padding:16px 26px;gap:10px}.web-project-panel h2{font-size:17px;min-width:100px;margin-right:14px}.web-project-panel .web-artifact-icon{width:32px;height:32px}.web-project-panel .web-artifact-tabs button{font-size:14px;padding:6px 13px}.web-project-panel .web-artifact-export{font-size:14px;padding:8px 13px}.web-project-panel .web-artifact-tabs{padding:3px}.web-project-panel .workspace-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:7px 14px;border-bottom:1px solid #333;font-size:11px}.web-project-panel .workspace-bar select{max-width:155px}.web-project-panel .workspace-bar [data-project-count]{margin-left:auto;color:#999;font-size:10px}.web-project-panel .workspace-edit-tools{display:flex;gap:4px;padding:4px 12px;border-bottom:1px solid #333;align-items:center;min-height:32px;flex-wrap:wrap}.workspace-edit-tools span{font-size:10px;color:#999;margin-left:auto}.web-project-panel .workspace-find{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:7px 12px;background:var(--web-panel-bg);border-bottom:1px solid #333;max-height:110px;overflow:auto}.workspace-find input{width:140px;padding:5px 7px;border:1px solid #555;background:transparent;color:inherit;border-radius:6px;font-size:12px}.workspace-find label,.workspace-find span{font-size:11px}.web-project-panel .workspace-body{min-height:100px;flex:1}.workspace-tree{width:150px;min-width:110px;max-width:24%;flex-shrink:0;overflow:auto;background:#191919;border-right:1px solid #333;padding:8px 4px}.web-project-panel .workspace-tree button{display:block;text-align:left;width:100%;font:11px/1.7 ui-monospace,monospace;padding:5px 7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.workspace-tree [aria-selected=true]{background:#ffffff12}.web-project-panel .web-artifact-editor{flex:1;min-width:0;width:auto}.workspace-output{position:relative;flex:1;min-width:0;overflow:auto;background:repeating-conic-gradient(#ececec 0 25%,#f5f5f5 0 50%) 50%/16px 16px;text-align:center}.web-project-panel .workspace-output iframe{display:block;margin:0 auto;min-width:var(--project-preview-width,100%);max-width:none;height:100%;background:#fff}.workspace-output .web-artifact-loading{min-width:100%;z-index:2}.web-project-panel footer{flex-wrap:wrap;min-height:28px;padding:5px 16px}.web-project-panel .workspace-logs{height:120px;max-height:25dvh;overflow:auto;background:#121212;border-top:1px solid #333;padding:5px}.web-project-panel .workspace-log{display:block;width:100%;text-align:left;white-space:pre-wrap;font:11px/1.6 ui-monospace,monospace;overflow-wrap:anywhere;padding:4px 8px}.workspace-log.error{color:#f18d8d}.workspace-log.warn{color:#d5ac62}.workspace-log.build{color:#83a2cf}.workspace-overlay{position:absolute;inset:0;z-index:7;background:var(--web-panel-bg);overflow:auto;padding:18px 22px;box-sizing:border-box;text-align:left}.workspace-overlay h3{font-size:15px;margin:0 0 14px}.workspace-overlay p{font-size:12px;line-height:1.8;color:#999}.web-project-panel .workspace-overlay button{border:1px solid #555;margin:4px}.workspace-diff{font:11px/1.8 ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere;max-height:none!important;background:transparent!important}.web-project-panel .web-artifact-export-menu{right:90px;top:63px}.web-project-panel .web-artifact-status.has-warning{color:#c57934}.web-project-panel [hidden]{display:none!important}.web-project-panel.web-artifact-fullscreen{border-radius:16px}.web-project-panel::backdrop{background:#0008;backdrop-filter:blur(4px)}.workspace-rendering{background:#faf9f8!important;overflow:hidden}.workspace-grid{position:absolute;inset:0;width:100%;height:100%;opacity:.65;mask-image:linear-gradient(transparent 30%,#000 68%,transparent 100%)}.workspace-grid line{stroke-width:.8;opacity:.45}.workspace-grid .color-line{stroke-width:1.3;stroke-dasharray:90 500;animation:project-ray 4s linear infinite;opacity:.9}.workspace-render-label{position:absolute;top:39%;left:0;width:100%;font-size:12px;color:#555;text-align:center;padding:0 20px;box-sizing:border-box}.workspace-render-label:after{content:"";display:block;width:70px;height:2px;margin:13px auto;background:linear-gradient(90deg,transparent,#a5a0bd,transparent);animation:project-breathe 2s ease-in-out infinite}@keyframes project-ray{to{stroke-dashoffset:-590}}@keyframes project-breathe{50%{opacity:.25;transform:scaleX(.55)}}html[data-theme=light] .web-project-panel .workspace-bar,html[data-theme=light] .web-project-panel .workspace-edit-tools,html[data-theme=light] .web-project-panel .workspace-find,html[data-theme=light] .web-project-panel .workspace-tree,html[data-theme=light] .web-project-panel .workspace-logs{border-color:#eee}html[data-theme=light] .web-project-panel .workspace-tree{background:#fafafa}html[data-theme=light] .web-project-panel .workspace-tree [aria-selected=true]{background:#eee}html[data-theme=light] .web-project-panel .workspace-logs{background:#fafafa}html[data-theme=light] .web-project-panel .workspace-overlay button,html[data-theme=light] .web-project-panel .workspace-find input{border-color:#ddd}html[data-theme=light] .web-project-panel .workspace-log.error{color:#b43e3e}html[data-theme=light] .web-project-panel .workspace-log.build{color:#536f9c}html:not([data-theme=light]) .workspace-rendering{background:#191919!important}html:not([data-theme=light]) .workspace-render-label{color:#bbb}@media(max-width:1100px){.web-artifact-card.is-open:has(.web-project-panel){width:100%;max-width:100%;margin:18px 0}.web-project-panel{height:660px;max-height:78dvh;border-radius:28px}.web-project-panel header{height:auto;min-height:64px;padding:12px 16px;gap:5px}.web-project-panel h2{font-size:14px;min-width:90px;flex-basis:120px}.web-project-panel .web-artifact-tabs button{font-size:12px;padding:5px 9px}.web-project-panel .web-artifact-export{font-size:12px;padding:6px 10px}.web-project-panel .web-artifact-icon{width:27px;height:27px}.web-project-panel .workspace-bar{padding:6px;gap:3px}.web-project-panel .workspace-bar select{max-width:120px;font-size:10px}.web-project-panel .workspace-bar button{font-size:10px;padding:5px}.web-project-panel .workspace-bar [data-project-count],.web-project-panel .workspace-tree,.web-project-panel .workspace-edit-tools span{display:none}.web-project-panel footer{padding:5px 8px}.web-project-panel .web-artifact-status{font-size:10px}.web-project-panel .web-artifact-export-menu{top:63px;right:14px}.web-project-panel.web-artifact-fullscreen{border-radius:0}}@media(prefers-reduced-motion:reduce){.workspace-grid .color-line,.workspace-render-label:after{animation:none!important}}.web-project-panel header .web-artifact-icon{width:36px;height:36px;padding:6px!important;border-radius:50%;color:#fff!important}.web-project-panel header .web-artifact-icon svg{width:24px;height:24px}.web-project-panel header .web-artifact-icon:hover:not(:disabled){background:#ffffff18}.web-project-panel header .web-artifact-export{display:inline-flex;align-items:center;gap:7px;color:#fff}.web-project-panel header .web-artifact-export>svg:not(.workspace-export-chevron){width:24px;height:24px}html[data-theme=light] .web-project-panel header .web-artifact-icon{color:#000!important}html[data-theme=light] .web-project-panel header .web-artifact-icon:hover:not(:disabled){background:#0000000f}html[data-theme=light] .web-project-panel header .web-artifact-export{color:#000}@media(max-width:1100px){.web-project-panel .workspace-tree{display:block;width:95px;min-width:80px;max-width:28%}}.web-artifact-type-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;color:#fff}.web-artifact-type-icon svg{width:24px;height:24px}html[data-theme=light] .web-artifact-type-icon{color:#000}.web-project-panel header .web-artifact-export>svg{width:24px;height:24px}.web-artifact-summary>button,.web-artifact-summary>button:hover{border-radius:999px;background:#fff;color:#000;border:1px solid #e5e5e5;padding:8px 16px}.workspace-rendering{background:radial-gradient(ellipse 38% 12% at 50% 41%,#ece8ffb3,transparent),#faf9f8!important}html:not([data-theme=light]) .workspace-rendering{background:radial-gradient(ellipse 38% 13% at 50% 41%,#56528b55,transparent),#15161b!important}.workspace-rendering:before{content:"";position:absolute;left:50%;top:40%;width:42px;height:3px;transform:translate(-50%,-50%);border-radius:50%;background:#b8c5ff;box-shadow:0 0 16px 5px #a8adff66,0 0 65px 24px #a68fe52b;animation:workspace-horizon 3s ease-in-out infinite;pointer-events:none}.workspace-grid{opacity:.95;mask-image:linear-gradient(transparent 28%,#000 46%,#0009 90%,transparent)}.workspace-grid line{stroke-width:1;opacity:.34}.workspace-grid .color-line{stroke-width:2.2;opacity:1;filter:drop-shadow(0 0 4px currentColor) drop-shadow(0 0 9px currentColor);stroke-dasharray:165 695;animation:workspace-light-travel 2.8s linear infinite}.workspace-render-label{z-index:2;text-shadow:0 0 12px #8580cc22}@keyframes workspace-light-travel{to{stroke-dashoffset:-860}}@keyframes workspace-horizon{50%{opacity:.55;box-shadow:0 0 20px 8px #a8adff88,0 0 80px 30px #a68fe533}}.workspace-rendering.is-failed:before,.workspace-rendering.is-failed .workspace-grid,.workspace-rendering.is-failed .workspace-render-label:after{display:none}.workspace-rendering.is-failed .workspace-render-label{top:45%;color:inherit;text-shadow:none}@media(prefers-reduced-motion:reduce){.workspace-rendering:before,.workspace-grid .color-line,.workspace-render-label:after{animation:none!important}}.web-project-panel .workspace-repair{position:relative;z-index:4;flex:none;margin:16px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border:1px solid #ddd;border-radius:16px;background:#fff;color:#000;box-shadow:0 4px 20px #0001;font-size:13px;line-height:1.5}.web-project-panel .workspace-repair button{flex:none;border:0;border-radius:999px;padding:9px 16px;background:#000;color:#fff;cursor:pointer;font-size:14px}.web-project-panel .workspace-repair button:disabled{opacity:.5;cursor:wait}html[data-theme=dark] .web-project-panel .workspace-repair,body.dark .web-project-panel .workspace-repair{background:#242424;border-color:#444;color:#fff}@media(max-width:520px){.web-project-panel .workspace-repair{margin:8px;gap:8px;padding:12px;flex-wrap:wrap}}html:not([data-theme=light]) .web-project-panel .workspace-repair button{background:#fff;color:#000}.web-project-panel .workspace-output{display:flex;flex-direction:column}.web-project-panel .workspace-output iframe{flex:1;min-height:0}
