:root{color-scheme:light;--canvas: #e8e9ec;--canvas-dot: rgb(0 0 0 / .07);--text: #1d1d1f;--muted: #86868b;--faint: rgb(0 0 0 / .045);--faint-hover: rgb(0 0 0 / .075);--hairline: rgb(0 0 0 / .08);--accent: #0a84ff;--accent-soft: rgb(10 132 255 / .12);--danger: #ff3b30;--glass: rgb(255 255 255 / .62);--glass-strong: rgb(255 255 255 / .8);--glass-solid: rgb(250 250 252 / .9);--glass-edge: rgb(255 255 255 / .75);--glass-shadow: 0 0 0 .5px rgb(0 0 0 / .08), 0 10px 30px -8px rgb(0 0 0 / .14), 0 2px 6px -2px rgb(0 0 0 / .06);--radius: 18px;font-family:system-ui,-apple-system,SF Pro Text,Segoe UI,sans-serif;font-size:12px;letter-spacing:-.005em;color:var(--text);-webkit-font-smoothing:antialiased}@media(prefers-color-scheme:dark){:root{color-scheme:dark;--canvas: #141416;--canvas-dot: rgb(255 255 255 / .06);--text: #f5f5f7;--muted: #8e8e93;--faint: rgb(255 255 255 / .06);--faint-hover: rgb(255 255 255 / .1);--hairline: rgb(255 255 255 / .08);--accent: #0a84ff;--accent-soft: rgb(10 132 255 / .22);--glass: rgb(38 38 42 / .55);--glass-strong: rgb(44 44 48 / .82);--glass-solid: rgb(36 36 40 / .9);--glass-edge: rgb(255 255 255 / .1);--glass-shadow: 0 0 0 .5px rgb(0 0 0 / .6), 0 12px 36px -8px rgb(0 0 0 / .55), 0 2px 6px -2px rgb(0 0 0 / .35)}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;overflow:hidden;background:var(--canvas)}button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.glass{background:var(--glass);backdrop-filter:blur(28px) saturate(180%);-webkit-backdrop-filter:blur(28px) saturate(180%);border:.5px solid var(--glass-edge);box-shadow:inset 0 1px 0 0 var(--glass-edge),var(--glass-shadow);border-radius:var(--radius)}button{background:none;border:none;border-radius:8px;padding:5px 9px;cursor:default;display:inline-flex;align-items:center;gap:6px;transition:background-color .12s,opacity .12s}button:hover:not(:disabled){background:var(--faint-hover)}button:disabled{opacity:.3}button.icon{width:32px;height:32px;padding:0;justify-content:center;border-radius:10px}button.active{background:var(--accent-soft);color:var(--accent)}button.primary{background:var(--accent);color:#fff;font-weight:500;box-shadow:inset 0 1px #ffffff40,0 4px 14px -4px #0a84ff99}button.primary:hover:not(:disabled){background:color-mix(in srgb,var(--accent) 88%,white)}button.pill{height:36px;padding:0 14px;border-radius:999px}button.danger{color:var(--danger)}input,select,textarea{background:var(--faint);border:1px solid transparent;border-radius:7px;padding:4px 7px;min-width:0;outline:none;transition:background-color .12s,border-color .12s}input:hover,select:hover,textarea:hover{background:var(--faint-hover)}input:focus,select:focus,textarea:focus{background:transparent;border-color:var(--accent)}input[type=number]::-webkit-inner-spin-button{display:none}textarea{resize:vertical;line-height:1.4}.muted{color:var(--muted)}.app{position:relative;height:100%}.canvas-wrap{position:absolute;inset:0;background-color:var(--canvas);background-image:radial-gradient(var(--canvas-dot) 1px,transparent 1px);background-size:20px 20px}.canvas{display:block;width:100%;height:100%;touch-action:none;-webkit-user-select:none;user-select:none}.canvas.panning{cursor:grab}.canvas .handle{fill:#fff;stroke:var(--accent)}.handle-nw,.handle-se{cursor:nwse-resize}.handle-ne,.handle-sw{cursor:nesw-resize}.handle-n,.handle-s{cursor:ns-resize}.handle-e,.handle-w{cursor:ew-resize}.marquee{fill:#0a84ff14;stroke:var(--accent);pointer-events:none}.chrome-top-left{position:absolute;top:12px;left:12px;padding:4px;border-radius:14px;z-index:2}.brand{font-weight:650;font-size:13px;letter-spacing:-.01em;padding-left:4px}.chrome-top-left .menu-trigger{width:auto;padding:0 8px 0 6px}.chrome-top-right{position:absolute;top:12px;right:12px;z-index:2}.dock{position:absolute;bottom:16px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:2px;padding:5px;border-radius:16px;z-index:2}.dock .menu-trigger{width:auto;padding:0 6px 0 8px;gap:2px}.sep{width:1px;height:18px;margin:0 5px;background:var(--hairline)}.zoom-controls{position:absolute;right:12px;bottom:16px;display:flex;align-items:center;padding:3px;border-radius:13px;z-index:2}.zoom-controls button.icon{width:28px;height:28px;border-radius:9px}.zoom-value{min-width:48px;height:28px;justify-content:center;font-variant-numeric:tabular-nums}.menu{position:relative}.popover{position:absolute;top:calc(100% + 8px);left:0;min-width:200px;padding:5px;display:flex;flex-direction:column;background:var(--glass-strong);border-radius:13px;animation:pop .14s ease-out}.popover.up{top:auto;bottom:calc(100% + 10px)}.popover button{justify-content:space-between;padding:6px 9px;border-radius:8px;text-align:left}.popover button:hover{background:var(--accent);color:#fff}.popover button:hover .muted{color:#fffc}@keyframes pop{0%{opacity:0;transform:scale(.97)}}.panel{position:absolute;top:60px;max-height:calc(100% - 136px);overflow-y:auto;padding:10px 0;z-index:1;scrollbar-width:thin}.panel h2{font-size:11px;font-weight:600;color:var(--muted);margin:2px 14px 8px}.layers{left:12px;width:236px}.props{right:12px;width:256px;padding:10px 12px}.props h2{margin-left:2px}.layer{display:flex;align-items:center;gap:7px;height:28px;margin:0 6px;padding-right:4px;border-radius:8px;-webkit-user-select:none;user-select:none}.layer:hover{background:var(--faint)}.layer.selected{background:var(--accent-soft)}.layer.top .layer-name{font-weight:600}.layer.hidden .layer-name,.layer.hidden .layer-type{opacity:.35}.layer-type{display:inline-flex;color:var(--muted);flex:none}.layer.selected .layer-type{color:var(--accent)}.layer-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-eye{width:22px;height:22px;padding:0;justify-content:center;color:var(--muted);opacity:0}.layer:hover .layer-eye,.layer.hidden .layer-eye{opacity:1}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.field>span{font-size:11px;color:var(--muted)}.field input:not([type=color]),.field select,.field textarea{width:100%}.field.paint{display:grid;grid-template-columns:minmax(0,1fr) 26px minmax(0,118px);align-items:center;gap:6px}.field.paint input[type=color]{width:26px;height:26px;padding:0;border-radius:7px;overflow:hidden;background:none}.field.paint input[type=color]::-webkit-color-swatch-wrapper{padding:0}.field.paint input[type=color]::-webkit-color-swatch{border:.5px solid var(--hairline);border-radius:7px}.grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px;margin-bottom:10px}.grid .field{margin-bottom:0}.num{display:flex;align-items:center;height:28px;border-radius:7px;background:var(--faint);border:1px solid transparent;transition:background-color .12s,border-color .12s}.num:hover{background:var(--faint-hover)}.num:focus-within{background:transparent;border-color:var(--accent)}.num span{padding-left:8px;color:var(--muted);font-size:11px;flex:none;max-width:48px;overflow:hidden}.num input{flex:1;width:100%;height:100%;background:none!important;border:none!important;padding:0 8px 0 6px;font-variant-numeric:tabular-nums}.arrange{display:flex;flex-wrap:wrap;gap:2px;margin:0 -4px 10px;padding-bottom:10px;border-bottom:.5px solid var(--hairline)}.arrange button{padding:4px 7px;font-size:11.5px}.export-dialog{color:var(--text);width:min(420px,calc(100vw - 32px));padding:20px;background:var(--glass-solid);border-radius:22px}.export-dialog[open]{animation:pop .16s ease-out}.export-dialog::backdrop{background:#0000002e;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.export-dialog h2{margin:0 0 14px;font-size:15px;font-weight:650}.export-dialog fieldset{border:none;padding:0;margin:0 0 16px}.export-dialog legend{font-size:11px;font-weight:600;color:var(--muted);margin-bottom:8px}.frame-list{max-height:180px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}.check{display:flex;align-items:center;gap:8px;padding:4px 2px}.check input{accent-color:var(--accent);margin:0}.segmented{display:inline-flex;padding:2px;border-radius:9px;background:var(--faint);margin:0 8px 8px 0}.segmented button{padding:4px 12px;border-radius:7px}.segmented button.active{background:var(--glass-strong);color:var(--text);box-shadow:0 1px 3px #0000001f,0 0 0 .5px #0000000f}.hint{margin:0}.error{color:var(--danger)}.dialog-actions{display:flex;align-items:center;gap:6px}.dialog-actions .muted{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dialog-actions button:not(.primary){background:var(--faint)}.dialog-actions button.primary{padding:6px 14px}@media(max-width:900px){.layers{width:180px}.props{width:220px}}.chrome-top-left{display:flex;align-items:center;gap:4px}.view-switch{display:flex;padding:2px;border-radius:10px;background:var(--faint)}.view-switch button{height:28px;padding:0 11px;border-radius:8px;color:var(--muted)}.view-switch button.on{background:var(--glass-strong);color:var(--text);box-shadow:0 1px 3px #0000001a,0 0 0 .5px #0000000d}.references{position:absolute;inset:0;overflow-y:auto;background-color:var(--canvas);background-image:radial-gradient(60% 45% at 15% 0%,rgb(10 132 255 / .1),transparent 70%),radial-gradient(50% 40% at 90% 20%,rgb(255 90 31 / .08),transparent 70%),radial-gradient(var(--canvas-dot) 1px,transparent 1px);background-size:auto,auto,20px 20px;background-attachment:fixed}.ref-column{max-width:920px;margin:0 auto;padding:88px 24px 64px;display:flex;flex-direction:column;gap:16px}.ref-title h1{margin:0 0 4px;font-size:28px;font-weight:700;letter-spacing:-.02em}.ref-title p{margin:0 0 8px;font-size:13px}.ref-section{padding:18px 20px 20px;border-radius:22px}.ref-section>header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}.ref-section h2{margin:0 0 2px;font-size:15px;font-weight:650;letter-spacing:-.01em}.ref-section header p{margin:0}.ref-section h3{margin:0 0 8px;font-size:11px;font-weight:600;color:var(--muted)}button.add{flex:none;background:var(--faint);padding:6px 11px 6px 8px;border-radius:999px;gap:4px}button.remove{width:22px;height:22px;padding:0;justify-content:center;border-radius:999px;color:var(--muted);font-size:15px;line-height:1}button.remove:hover{color:var(--danger)}button.empty{width:100%;justify-content:center;padding:28px;border:1px dashed var(--hairline);border-radius:14px;color:var(--muted)}.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.swatch{display:flex;flex-direction:column;gap:6px}.swatch-color{position:relative;height:76px;border-radius:14px;box-shadow:inset 0 0 0 .5px #0000001f,inset 0 1px #ffffff40;cursor:pointer}.swatch-color input{position:absolute;inset:0;opacity:0;cursor:pointer}.swatch-name{font-weight:600;background:none!important;padding:2px 4px;border:1px solid transparent}.swatch-name:focus{border-color:var(--accent)}.swatch-meta{display:flex;align-items:center;gap:6px;padding-left:4px}.swatch-meta .hex{width:74px;padding:2px 5px;font-family:ui-monospace,SF Mono,monospace;font-size:11px;text-transform:uppercase}.swatch-meta .muted{flex:1;font-size:11px}.type-list{display:flex;flex-direction:column}.type-row{padding:14px 0;border-top:.5px solid var(--hairline)}.type-row:first-child{border-top:none;padding-top:0}.type-preview{margin-bottom:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.type-fields{display:grid;grid-template-columns:110px minmax(0,1fr) 72px 92px 92px 22px;gap:6px;align-items:center}.type-fields .role{font-weight:600}.type-fields input,.type-fields select{height:28px}.scale+.scale{margin-top:16px}.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 4px 0 10px;border-radius:999px;background:var(--faint);font-variant-numeric:tabular-nums}.chip .remove{width:20px;height:20px;font-size:13px}.chip-add{width:64px;height:30px;border-radius:999px!important;text-align:center}.viz-space{display:inline-block;height:8px;min-width:2px;border-radius:2px;background:var(--accent);opacity:.7}.viz-radius{display:inline-block;width:14px;height:14px;border-top:2px solid var(--accent);border-left:2px solid var(--accent)}.viz-stroke{display:inline-block;width:18px;min-height:1px;background:var(--text);border-radius:1px}.icon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}.icon-tile{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 8px 8px;border-radius:14px;background:var(--faint)}.icon-tile img{width:40px;height:40px;object-fit:contain}@media(prefers-color-scheme:dark){.icon-tile img{filter:invert(1)}}.icon-name{width:100%;text-align:center;background:none!important;font-size:11px;padding:2px}.tile-actions{display:flex;align-items:center;gap:2px;opacity:0;transition:opacity .12s}.icon-tile:hover .tile-actions,.icon-tile:focus-within .tile-actions{opacity:1}.tile-actions button:not(.remove){padding:3px 10px;border-radius:999px;background:var(--accent);color:#fff}.ref-grid{columns:3 220px;column-gap:12px}.ref-image{position:relative;margin:0 0 12px;break-inside:avoid;border-radius:14px;overflow:hidden;background:var(--faint)}.ref-image img{display:block;width:100%}.ref-image textarea{display:block;width:100%;border-radius:0;background:none;font-size:11.5px;resize:none;padding:8px 10px}.remove.floating{position:absolute;top:8px;right:8px;background:#00000073;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0}.ref-image:hover .remove.floating{opacity:1}.rules{width:100%;font-size:13px;line-height:1.55;padding:10px 12px;border-radius:12px}@media(max-width:700px){.type-fields{grid-template-columns:1fr 1fr 1fr}}.splash,.screen{position:absolute;inset:0;overflow-y:auto;background-color:var(--canvas);background-image:radial-gradient(60% 45% at 15% 0%,rgb(10 132 255 / .12),transparent 70%),radial-gradient(50% 40% at 90% 30%,rgb(255 90 31 / .1),transparent 70%),radial-gradient(var(--canvas-dot) 1px,transparent 1px);background-size:auto,auto,20px 20px}.auth-screen{display:grid;place-items:center;padding:24px}.auth-card{width:min(360px,100%);padding:28px;border-radius:26px;display:flex;flex-direction:column;gap:12px}.auth-mark{width:40px;height:40px;border-radius:12px;background:conic-gradient(from 200deg,#0a84ff,#ff5a1f,#fc0,#0a84ff);box-shadow:inset 0 1px #ffffff80,0 6px 18px -6px #0a84ff99}.auth-card h1{margin:4px 0 0;font-size:22px;letter-spacing:-.02em}.auth-card>p{margin:0 0 6px}.auth-field{display:flex;flex-direction:column;gap:5px;margin-bottom:4px}.auth-field>span{font-size:11px;font-weight:600;color:var(--muted)}.auth-field input{height:34px;padding:0 10px;font-size:13px;border-radius:9px}button.wide{justify-content:center;height:36px;border-radius:10px;margin-top:4px}button.link{background:none!important;color:var(--accent);padding:2px 0;justify-content:center}.button-like{display:inline-flex;align-items:center;padding:5px 10px;border-radius:8px;cursor:default}.button-like:hover{background:var(--faint-hover)}.projects-screen{padding:40px max(24px,calc(50% - 480px))}.projects-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.projects-header h1{margin:0;font-size:28px;letter-spacing:-.02em}.projects-actions{display:flex;align-items:center;gap:4px}.projects-actions .muted{margin-right:8px}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.project-card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;height:140px;padding:16px;border-radius:20px;text-align:left;cursor:default;transition:transform .15s ease}.project-card:hover{transform:translateY(-2px)}.project-card.new{align-items:center;justify-content:center;color:var(--accent);font-weight:500}.project-name{font-size:14px;font-weight:600}.project-card:hover .remove.floating{opacity:1}.project-title{display:inline-flex;align-items:center;gap:7px;max-width:220px}.project-title .brand{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.save-state{width:6px;height:6px;border-radius:50%;flex:none;background:#34c759;transition:background-color .2s}.save-state.saving,.save-state.loading{background:#fc0}.save-state.error{background:var(--danger)}.popover hr{border:none;border-top:.5px solid var(--hairline);margin:4px 6px}.panel-tabs{display:flex;padding:2px;margin:0 0 12px;border-radius:10px;background:var(--faint)}.panel-tabs button{flex:1;justify-content:center;height:26px;border-radius:8px;color:var(--muted)}.panel-tabs button.on{background:var(--glass-strong);color:var(--text);box-shadow:0 1px 3px #0000001a,0 0 0 .5px #0000000d}.props.chat-mode{bottom:76px;width:300px;display:flex;flex-direction:column;overflow:hidden}.dock .ai-button{color:var(--accent)}.chat{flex:1;min-height:0;display:flex;flex-direction:column}.chat-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:2px 2px 12px}.chat-empty{display:flex;flex-direction:column;gap:6px}.chat-empty p{margin:0 0 6px;line-height:1.45}.suggestion{justify-content:flex-start;background:var(--faint);border-radius:10px;padding:7px 10px;text-align:left}.bubble{max-width:88%;padding:8px 11px;border-radius:14px;line-height:1.45;white-space:pre-wrap;word-wrap:break-word}.bubble.user{align-self:flex-end;background:var(--accent);color:#fff;border-bottom-right-radius:5px}.bubble.assistant{align-self:flex-start;background:var(--faint);border-bottom-left-radius:5px}.bubble.error{color:var(--danger)}.bubble-meta{display:flex;align-items:center;gap:8px;margin-top:5px;font-size:11px;color:var(--muted)}.bubble-meta .link{padding:0;font-size:11px}.typing{display:flex;gap:4px;padding:11px 12px}.typing i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:blink 1.2s infinite ease-in-out}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}@keyframes blink{0%,80%,to{opacity:.25}40%{opacity:1}}.chat-input{position:relative;border-top:.5px solid var(--hairline);padding-top:10px}.chat-target{font-size:11px;margin-bottom:6px}.chat-input textarea{width:100%;resize:none;padding:8px 10px 36px;border-radius:12px;font-size:12.5px}.chat-input .send{position:absolute;right:6px;bottom:8px;height:26px;padding:0 12px;border-radius:999px}.settings p{margin:0 0 14px;line-height:1.45}.settings .auth-field{margin-bottom:12px}.styles{display:flex;flex-direction:column;margin:0 -4px}.styles .intro{margin:0 4px 10px;line-height:1.45}.style-section{border-top:.5px solid var(--hairline);padding:4px 0 8px}.style-section:first-of-type{border-top:none}.style-section>summary{display:flex;align-items:center;justify-content:space-between;height:30px;padding:0 4px;list-style:none;font-size:11px;font-weight:600;cursor:default}.style-section>summary::-webkit-details-marker{display:none}.style-section:not([open])>summary{color:var(--muted)}button.icon.mini{width:24px;height:24px;border-radius:7px}.style-row{display:flex;align-items:center;gap:8px;height:30px;padding:0 4px;border-radius:8px}.style-row:hover{background:var(--faint)}.style-row .remove{opacity:0}.style-row:hover .remove{opacity:1}.dot{position:relative;flex:none;width:18px;height:18px;border-radius:6px;box-shadow:inset 0 0 0 .5px #00000026}.dot input{position:absolute;inset:0;opacity:0}input.bare{background:none!important;border-color:transparent;padding:2px 4px;min-width:0}input.bare:focus{border-color:var(--accent)}.color-row .name{flex:1}.color-row .hex{width:72px;font-family:ui-monospace,SF Mono,monospace;font-size:10.5px;color:var(--muted);text-transform:uppercase}.type-style>summary{list-style:none;cursor:default}.type-style>summary::-webkit-details-marker{display:none}.type-style .aa{width:22px;text-align:center;font-size:14px}.type-style .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.type-style .meta{font-size:11px;font-variant-numeric:tabular-nums}.type-edit{display:flex;flex-direction:column;gap:6px;padding:6px 4px 10px 34px}.type-edit .grid{margin:0}.scale-row{display:flex;align-items:flex-start;gap:8px;padding:4px}.scale-row>.muted{width:52px;flex:none;padding-top:5px;font-size:11px}.scale-row .chips{gap:4px}.scale-row .chip{height:24px;padding:0 8px;font-size:11px}.scale-row .chip:hover{background:color-mix(in srgb,var(--danger) 14%,transparent);color:var(--danger);text-decoration:line-through}.scale-row .chip-add{width:40px;height:24px;font-size:11px}.icon-grid.compact{grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:4px;padding:0 4px}.icon-grid.compact .icon-tile{position:relative;padding:0;border-radius:9px}.icon-use{width:100%;aspect-ratio:1;justify-content:center;padding:8px}.icon-grid.compact .icon-tile img{width:100%;height:100%}.icon-grid.compact .remove.floating{top:-4px;right:-4px;width:16px;height:16px;font-size:11px}.icon-tile:hover .remove.floating{opacity:1}.styles .rules{margin:0 4px;width:calc(100% - 8px);font-size:12px;padding:8px 10px}.styles .hint{margin:0 4px}.settings .segmented{flex-wrap:wrap}.local-setup{display:flex;flex-direction:column;gap:8px;padding:12px 14px;margin-bottom:14px;border-radius:14px;background:var(--faint);line-height:1.5}.local-setup p{margin:0}.local-setup .ok{color:#248a3d}@media(prefers-color-scheme:dark){.local-setup .ok{color:#30d158}}.local-setup code{font-family:ui-monospace,SF Mono,monospace;font-size:11px;padding:1px 5px;border-radius:5px;background:var(--faint-hover);-webkit-user-select:all;user-select:all}.local-setup .link{align-self:flex-start}.downloads{display:flex;gap:6px}.downloads .button-like{background:var(--faint-hover);text-decoration:none;color:var(--text)}.downloads .primary-link{background:var(--accent);color:#fff}.install-command{display:flex;align-items:center;gap:6px;padding:6px 6px 6px 10px;border-radius:10px;background:var(--faint-hover)}.install-command code{flex:1;background:none!important;padding:0!important;overflow-x:auto;white-space:nowrap}.install-command button{padding:4px 10px;border-radius:7px}.website-dialog{width:min(560px,calc(100vw - 32px))}.website-dialog .hint{margin-bottom:12px}.website-url input{width:100%;height:34px;padding:0 11px;border-radius:10px;font-size:13px}.website-progress{display:flex;flex-direction:column;gap:6px;margin-top:12px}.website-bar{height:3px;border-radius:3px;background:var(--faint-hover);overflow:hidden;position:relative}.website-bar:after{content:"";position:absolute;inset:0 auto 0 0;width:30%;border-radius:3px;background:var(--accent);animation:website-slide 1.2s ease-in-out infinite}@keyframes website-slide{0%{transform:translate(-100%)}to{transform:translate(340%)}}.website-dialog .website-note{margin:8px 0 0}.website-dialog .error{margin:10px 0 0}.website-dialog form .dialog-actions{margin-top:16px}.website-source{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.website-dialog legend{display:flex;align-items:center;gap:6px}.website-dialog legend button.link{padding:0 4px;font-size:11px}.website-sections{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-height:300px;overflow-y:auto;padding:2px}.website-section{display:flex;flex-direction:column;gap:4px;min-width:0}.website-section img{width:100%;height:96px;object-fit:cover;object-position:top;border-radius:8px;box-shadow:0 0 0 1px var(--hairline);opacity:.45;transition:opacity .12s,box-shadow .12s}.website-section.on img{opacity:1;box-shadow:0 0 0 2px var(--accent)}.website-section-name{display:flex;align-items:center;gap:5px;min-width:0;font-size:11px}.website-section-name input{accent-color:var(--accent);margin:0;flex:none}.website-section-name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.website-styles{display:flex;flex-direction:column;gap:4px;transition:opacity .12s}.website-styles.off{opacity:.35}.website-swatches{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:4px}.website-swatch{width:22px;height:22px;border-radius:7px;box-shadow:inset 0 0 0 1px var(--hairline)}.website-font{display:flex;gap:8px;min-width:0}.website-font>span:first-child{width:64px;flex:none}.website-font .muted{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.canvas.drawing:not(.panning){cursor:crosshair}.canvas .guide{stroke:#ff2d75;pointer-events:none}.dock button.icon.tool-on{background:var(--accent);color:#fff}.layout-section{margin:4px 0 12px;padding-top:10px;border-top:.5px solid var(--hairline)}.add-layout{padding:4px 8px;margin-left:-6px;color:var(--muted)}.layout-head{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:600;margin-bottom:8px}.layout-grid{display:flex;align-items:center;gap:10px;margin-bottom:8px}.segmented.small{margin:0}.segmented.small button{padding:3px 10px}.align-grid{display:grid;grid-template-columns:repeat(3,14px);gap:4px;padding:6px;border-radius:8px;background:var(--faint)}.align-cell{width:14px;height:14px;padding:0;border-radius:3px;justify-content:center}.align-cell:after{content:"";width:4px;height:4px;border-radius:50%;background:var(--muted)}.align-cell.on{background:var(--accent-soft)}.align-cell.on:after{width:8px;height:8px;border-radius:2px;background:var(--accent)}.check-field{flex-direction:row;align-items:center;gap:6px}.check-field input{accent-color:var(--accent);margin:0}.check-field span{font-size:11px}.extract-section{margin:4px 0 12px;padding-top:10px;border-top:.5px solid var(--hairline)}.extract-styles{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;margin-left:-6px;color:var(--muted)}.extract-styles:not(:disabled):hover{color:var(--text)}.extract-styles svg{width:14px;height:14px}.styles-added{display:flex;flex-direction:column;gap:4px;margin-top:8px;font-size:11px}.added-color,.added-font{display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.added-color .dot{width:14px;height:14px;border-radius:4px}.added-font b{flex:none;width:14px;font-size:12px;text-align:center}
