:root{--font-sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--text-xs:11px;--text-sm:12px;--text-base:13px;--text-lg:15px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--radius-sm:5px;--radius-md:8px;--radius-lg:10px;--radius-xl:12px;--radius-island:12px;--radius-pill:9999px;--shell-offset:16px;--browser-notice-offset:0px;--toolbar-height:40px;--panel-gap:12px;--panel-width-inspector:260px;--color-bg:#e2e2e2;--color-surface:#fff;--color-surface-muted:#f1f1ef;--color-surface-recessed:#efeee9;--color-surface-glass:#fffffff5;--color-panel:#fcfcfc;--color-border:#37352f17;--color-border-strong:#37352f29;--color-text:#37352f;--color-text-secondary:#37352fa6;--color-text-muted:#37352f73;--color-icon:#5c5c5c;--color-blue:#60a5fa;--color-switch:var(--color-blue);--color-selection:var(--color-blue);--comment-blue:var(--color-blue);--color-accent:#8e8c88;--color-accent-hover:#6f6e69;--color-success:#0f7b6c;--color-warning:#d9730d;--color-on-primary:#37352f;--color-primary:#ecebe8;--color-primary-hover:#e3e2de;--shadow-island:0 2px 8px #37352f0f;--shadow-card:0 4px 16px #37352f14;--accent:var(--color-accent);--line:var(--color-border);--muted:var(--color-text-secondary);--hover:var(--color-surface-muted)}*,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:--theme(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:--theme(--default-font-feature-settings, normal);font-variation-settings:--theme(--default-font-variation-settings, normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:--theme(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:--theme(--default-mono-font-feature-settings, normal);font-variation-settings:--theme(--default-mono-font-variation-settings, normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}.btn{justify-content:center;align-items:center;gap:var(--space-2);height:32px;padding:0 var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-muted);font-size:var(--text-sm);white-space:nowrap;cursor:pointer;font-weight:600;transition:background .15s,border-color .15s,color .15s,transform .12s;display:inline-flex}.btn:disabled{cursor:default}.btn[hidden]{display:none!important}.btn:hover:not(:disabled){background:var(--color-surface);border-color:var(--color-border-strong)}.btn--primary{color:var(--color-on-primary);background:var(--color-primary);border-color:var(--color-primary)}.btn--primary:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.btn--accent{color:var(--color-on-primary);background:var(--color-accent);border-color:var(--color-accent)}.btn--accent:hover:not(:disabled){background:var(--color-accent-hover);border-color:var(--color-accent-hover)}.btn--ghost{background:0 0}.btn--danger{color:#fff;background:#e24c4c;border-color:#e24c4c}.btn--danger:hover:not(:disabled){background:#c93b3b;border-color:#c93b3b}.btn.is-pressed,.btn[aria-pressed=true]{background:color-mix(in srgb, var(--color-text) 8%, var(--color-surface));color:var(--color-icon);border-color:#0000}.btn.is-pressed:hover:not(:disabled),.btn[aria-pressed=true]:hover:not(:disabled){background:color-mix(in srgb, var(--color-text) 12%, var(--color-surface));color:var(--color-icon);border-color:#0000}.island .btn--icon.is-pressed,.island .btn--icon[aria-pressed=true]{background:color-mix(in srgb, var(--color-text) 8%, transparent);color:var(--color-icon)}.island .btn--icon.is-pressed:hover:not(:disabled),.island .btn--icon[aria-pressed=true]:hover:not(:disabled){background:color-mix(in srgb, var(--color-text) 12%, transparent);color:var(--color-icon)}#toggle-design-mode.is-pressed,#toggle-design-mode[aria-pressed=true]{background:var(--color-blue);color:#fff}#toggle-design-mode.is-pressed:hover:not(:disabled),#toggle-design-mode[aria-pressed=true]:hover:not(:disabled){background:color-mix(in srgb, var(--color-blue) 88%, #000);color:#fff}.thumb-up{border:1px solid var(--color-border);border-radius:var(--radius-island);background:var(--color-surface);cursor:pointer;justify-content:center;align-items:center;gap:6px;min-width:40px;height:40px;padding:0 10px 0 8px;display:inline-flex;box-shadow:0 1px 2px #37352f0f}.thumb-up[aria-pressed=false]{width:40px;padding:0}.thumb-up:hover:not(:disabled){background:var(--color-surface-muted)}.thumb-up:active:not(:disabled){transform:scale(.96)}.thumb-up__emoji{filter:grayscale();opacity:.55;transform-origin:50% 80%;-webkit-user-select:none;user-select:none;font-size:22px;line-height:1}.thumb-up[aria-pressed=true] .thumb-up__emoji{filter:none;opacity:1}.thumb-up__count{min-width:1ch;color:var(--color-text);font-size:var(--text-sm);font-variant-numeric:tabular-nums;font-weight:600;line-height:1}.thumb-up.is-pop .thumb-up__emoji{animation:.32s thumb-pop}@keyframes thumb-pop{0%{transform:scale(1)rotate(0)}40%{transform:scale(1.35)rotate(-14deg)}to{transform:scale(1)rotate(0)}}@media (prefers-reduced-motion:reduce){.thumb-up.is-pop .thumb-up__emoji{animation:none}}.btn--icon{width:32px;color:var(--color-icon);padding:0}.island .btn--icon{background:0 0;border:0}.island .btn--icon:hover:not(:disabled){background:color-mix(in srgb, var(--color-text) 6%, transparent)}.island .btn--icon:active:not(:disabled){background:color-mix(in srgb, var(--color-text) 12%, transparent);transform:scale(.96)}.btn svg{flex-shrink:0;width:16px;height:16px}:focus,:focus-visible{outline:none}.input{width:100%;height:36px;padding:0 var(--space-4);border-radius:var(--radius-md);background:var(--color-surface-recessed);font-size:var(--text-sm);border:1px solid #0000;outline:none;transition:border-color .15s,background .15s}.input:focus{border-color:var(--color-border-strong);background:var(--color-surface-muted)}.input::placeholder{color:var(--color-text-muted)}.toast{left:var(--shell-offset);bottom:var(--shell-offset);z-index:100;max-width:min(320px,100vw - 32px);padding:var(--space-2) var(--space-4);border-radius:var(--radius-lg);background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text);font-size:var(--text-xs);box-shadow:var(--shadow-island);position:fixed}@media (max-width:760px){.toast{left:var(--space-2);bottom:var(--space-2)}}.status{align-items:center;gap:var(--space-2);color:var(--color-text-secondary);font-size:var(--text-xs);white-space:nowrap;display:inline-flex}.status-dot{background:var(--color-text-muted);border-radius:50%;flex-shrink:0;width:6px;height:6px}.status.is-connected .status-dot{background:var(--color-success)}.status.is-dirty .status-dot{background:var(--color-warning)}.folder-drop{z-index:80;background:color-mix(in srgb, var(--color-bg) 78%, transparent);pointer-events:auto;place-items:center;display:grid;position:fixed;inset:0}.folder-drop[hidden]{display:none}.confirm-dialog{z-index:90;place-items:center;display:grid;position:fixed;inset:0}.confirm-dialog[hidden]{display:none}.confirm-dialog__backdrop{background:color-mix(in srgb, var(--color-bg) 72%, transparent);position:absolute;inset:0}.confirm-dialog__panel{z-index:1;width:min(360px,100vw - 48px);padding:var(--space-5);border:1px solid var(--color-border);border-radius:var(--radius-xl);background:var(--color-surface);box-shadow:var(--shadow-card);position:relative}.confirm-dialog__title{font-size:var(--text-lg);letter-spacing:-.02em;margin:0;font-weight:600}.confirm-dialog__message{margin:var(--space-3) 0 0;color:var(--color-text-secondary);font-size:var(--text-sm);line-height:1.45}.confirm-dialog__field{gap:var(--space-2);margin-top:var(--space-4);display:grid}.confirm-dialog__field[hidden]{display:none}.confirm-dialog__field-label{font-size:var(--text-xs);color:var(--color-text-secondary);font-weight:500}.confirm-dialog__input{height:32px;padding:0 var(--space-3);border-color:var(--color-border-strong);background:var(--color-surface)}.confirm-dialog__input:focus{border-color:var(--color-text-secondary);background:var(--color-surface)}.confirm-dialog__hint{color:var(--color-text-muted);font-size:var(--text-xs);min-height:1.4em;line-height:1.4}.confirm-dialog__error{margin:var(--space-3) 0 0;color:var(--color-warning);font-size:var(--text-xs);line-height:1.4}.confirm-dialog__error[hidden]{display:none}.confirm-dialog__location{gap:var(--space-2);margin-top:var(--space-4);display:grid}.confirm-dialog__location[hidden]{display:none}.confirm-dialog__location-row{gap:var(--space-2);align-items:center;min-width:0;display:flex}.confirm-dialog__path{min-width:0;height:32px;padding:0 var(--space-3);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);font-size:var(--text-sm);text-overflow:ellipsis;white-space:nowrap;flex:1;line-height:30px;overflow:hidden}.confirm-dialog__path.is-empty{color:var(--color-text-muted)}.confirm-dialog__browse{height:32px;padding:0 var(--space-3);font-size:var(--text-xs);flex-shrink:0;font-weight:500}.confirm-dialog__actions{justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-5);display:flex}.confirm-dialog__actions .btn--primary{color:#fff;background:var(--color-switch);border-color:var(--color-switch)}.confirm-dialog__actions .btn--primary:hover:not(:disabled){color:#fff;background:color-mix(in srgb, var(--color-switch) 82%, var(--color-text));border-color:color-mix(in srgb, var(--color-switch) 82%, var(--color-text))}.folder-drop__panel{min-width:min(280px,100vw - 48px);padding:var(--space-6);border:1px dashed var(--color-border-strong);border-radius:var(--radius-xl);background:var(--color-surface-glass);box-shadow:var(--shadow-island);text-align:center}.folder-drop__title{font-size:var(--text-lg);margin:0;font-weight:600}.folder-drop__hint{margin:var(--space-2) 0 0;color:var(--color-text-secondary);font-size:var(--text-sm)}html.is-folder-drag iframe{pointer-events:none}.island{z-index:20;border:1px solid var(--color-border);border-radius:var(--radius-island);background:var(--color-surface-glass);box-shadow:var(--shadow-island);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);position:fixed}.toolbar{top:var(--shell-offset);height:var(--toolbar-height);padding:var(--space-2);border-radius:var(--radius-island);align-items:center;gap:var(--space-2);display:flex}.toolbar--left{background:var(--color-surface);-webkit-backdrop-filter:none;backdrop-filter:none;gap:2px;width:max-content;max-width:min(280px,100vw - 200px);padding:4px;position:relative;top:auto;left:auto;box-shadow:0 1px 2px #37352f0f}.toolbar__actions{flex-shrink:0;align-items:center;gap:0;display:flex}.folder-select{flex:0 auto;min-width:120px;max-width:180px;position:relative}.folder-select__trigger{align-items:center;gap:var(--space-1);border-radius:var(--radius-sm);width:100%;min-width:0;height:32px;color:var(--color-text);font-size:var(--text-sm);appearance:none;cursor:pointer;background:0 0;border:0;padding:0 6px;font-weight:500;transition:background .15s;display:flex;overflow:hidden}.folder-select__trigger:hover,.folder-select__trigger[aria-expanded=true]{background:color-mix(in srgb, var(--color-text) 6%, transparent)}.folder-select__icon{width:14px;height:14px;color:var(--color-text-secondary);flex-shrink:0}.folder-select__label{text-overflow:ellipsis;white-space:nowrap;text-align:left;flex:auto;min-width:0;overflow:hidden}.folder-select__menu{top:calc(100% + var(--space-2));z-index:30;min-width:240px;max-width:min(320px,100vw - 48px);padding:var(--space-1);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-island);position:absolute;left:0}.folder-select__option{width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--color-text);font-size:var(--text-sm);text-align:left;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;background:0 0;border:0;overflow:hidden}.folder-select__option:hover:not(:disabled){background:color-mix(in srgb, var(--color-text) 6%, transparent)}.folder-select__section-label{margin:var(--space-2) var(--space-3) 2px;color:var(--color-text-muted);font-size:var(--text-xs);font-weight:500;line-height:1.4}.folder-select__section-label:first-child{margin-top:var(--space-1)}.folder-select__separator{height:1px;margin:var(--space-1) var(--space-2);background:var(--color-border)}.folder-select__hint{margin:var(--space-1) var(--space-3) var(--space-1);color:var(--color-text-muted);font-size:var(--text-xs);white-space:nowrap;line-height:1.4}.folder-select__option--current{color:var(--color-text-secondary);cursor:default;font-weight:600}.browser-notice{z-index:210;color:#fff;min-height:36px;font-size:var(--text-sm);text-align:center;background:#37352f;justify-content:center;align-items:center;margin:0;padding:8px 16px;font-weight:500;line-height:1.4;display:flex;position:fixed;top:0;left:0;right:0}.browser-notice[hidden]{display:none}.toolbar-cluster{z-index:20;top:calc(var(--shell-offset) + var(--browser-notice-offset));align-items:center;gap:var(--panel-gap);height:var(--toolbar-height);display:flex;position:fixed}.toolbar-cluster--left{left:var(--shell-offset);z-index:25;max-width:calc(100vw - var(--shell-offset) * 2 - 180px)}.toolbar-cluster--left .island{position:relative}.toolbar-cluster--right{right:var(--shell-offset)}.toolbar-cluster--right .island{position:relative}.toolbar--right{width:max-content;height:var(--toolbar-height);background:var(--color-surface);-webkit-backdrop-filter:none;backdrop-filter:none;padding:4px;position:relative;top:auto;right:auto;box-shadow:0 1px 2px #37352f0f}.toolbar-cluster--right #save,.token-changes__toggle{color:#fff;background:var(--color-switch);border-color:var(--color-switch);border-radius:var(--radius-lg);box-shadow:var(--shadow-island);font-weight:500}.toolbar-cluster--right #save:hover:not(:disabled),.token-changes__toggle:hover:not(:disabled),.token-changes__toggle[aria-expanded=true]:not(:disabled){background:color-mix(in srgb, var(--color-switch) 82%, var(--color-text));border-color:color-mix(in srgb, var(--color-switch) 82%, var(--color-text))}.token-changes__toggle:disabled{color:var(--color-accent);background:var(--color-surface-muted);border-color:var(--color-surface-muted);box-shadow:none}.token-changes__toggle:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}.token-changes__toggle{position:relative;overflow:visible}.token-changes__badge{z-index:1;min-width:16px;height:16px;color:var(--color-text);font-variant-numeric:tabular-nums;pointer-events:none;background:#fff;border-radius:999px;justify-content:center;align-items:center;padding:0 4px;font-size:10px;font-weight:600;line-height:1;display:inline-flex;position:absolute;top:0;left:0;transform:translate(-40%,-40%)}.token-changes__badge[hidden]{display:none!important}.token-changes{position:relative}.token-changes[hidden]{display:none!important}.token-changes__panel{z-index:30;border:1px solid var(--color-border);background:var(--color-surface);width:min(246px,100vw - 24px);box-shadow:var(--shadow-card);border-radius:14px;padding:12px;position:absolute;top:calc(100% + 8px);right:0}.token-changes__panel[hidden]{display:none!important}.token-changes__title{margin:0 0 8px;font-size:12px;font-weight:600}.token-changes__list{flex-direction:column;gap:2px;max-height:360px;margin:0;padding:0;list-style:none;display:flex;overflow:auto}.token-changes__item{flex-direction:column;gap:8px;min-width:0;display:flex}.token-changes__summary{border-radius:8px;flex-direction:column;gap:6px;width:100%;min-width:0;padding:6px 4px;display:flex}.token-changes__head{align-items:center;gap:4px;min-width:0;min-height:22px;display:flex}.token-changes__name{text-overflow:ellipsis;white-space:nowrap;flex:0 auto;min-width:0;font-size:12px;font-weight:550;overflow:hidden}.token-changes__diff{align-items:center;gap:6px;min-width:0;display:flex}.token-changes__chip{align-items:center;gap:6px;min-width:0;display:inline-flex}.token-changes__chip[hidden],.token-changes__arrow[hidden],.token-changes__swatch[hidden]{display:none!important}.token-changes__chip.is-editable{cursor:pointer;border-radius:7px;margin:-2px -4px -2px -2px;padding:2px 4px 2px 2px}.token-changes__chip.is-editable:hover{background:color-mix(in srgb, var(--color-text) 6%, transparent)}.token-changes__swatch{border:1px solid #0000001a;border-radius:4px;flex-shrink:0;width:16px;height:16px;position:relative}.token-changes__swatch input[type=color]{opacity:0;cursor:pointer;border:0;width:100%;height:100%;margin:0;padding:0;position:absolute;inset:0}.token-changes__hex{text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums;font-size:11px;overflow:hidden}.token-changes__hex.is-before,.token-changes__arrow{color:var(--color-text-secondary)}.token-changes__arrow{flex-shrink:0;font-size:11px}.token-changes__restore{border-radius:var(--radius-sm);width:22px;height:22px;color:var(--color-text-muted);cursor:pointer;background:0 0;border:0;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.token-changes__restore:hover{background:color-mix(in srgb, var(--color-text) 6%, transparent);color:var(--color-text)}.token-changes__restore:focus-visible{outline:2px solid color-mix(in srgb, var(--color-text) 28%, transparent);outline-offset:1px}.token-changes__restore svg{width:14px;height:14px}.token-changes__actions{gap:8px;margin-top:10px;display:flex}.token-changes__actions .btn{flex:1}.brand{flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.brand__logo{width:18px;height:auto;display:block}.toolbar-divider{width:1px;margin:var(--space-1) 0;background:var(--color-border);align-self:stretch}@media (max-width:760px){.toolbar-cluster--left{left:var(--space-2);max-width:calc(100vw - 180px)}.toolbar-cluster--right{right:var(--space-2)}}.inspector{top:calc(var(--shell-offset) + var(--browser-notice-offset) + var(--toolbar-height) + var(--panel-gap));right:var(--shell-offset);width:var(--panel-width-inspector);border-radius:var(--radius-lg);background:var(--color-panel);max-height:min(520px,100vh - 120px);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none;overflow:auto}.inspector::-webkit-scrollbar{width:0;height:0;display:none}html[data-boot=ready] .inspector{transition:transform .2s,opacity .2s}.inspector.hidden{transform:translateX(calc(100% + var(--space-6)));opacity:0;pointer-events:none}.inspector__chrome{z-index:2;background:var(--color-panel);position:sticky;top:0}.inspector__header{gap:var(--space-1);padding:var(--space-4);border-bottom:1px solid var(--color-border);flex-direction:column;display:flex}.inspector__title-row{justify-content:space-between;align-items:center;gap:var(--space-3);min-width:0;display:flex}.inspector__title{min-width:0;font-size:var(--text-sm);font-weight:600}.inspector__subtitle{color:var(--color-text-secondary);font-size:var(--text-xs)}.inspector__changed{color:var(--color-text-secondary);font-size:var(--text-xs);font-variant-numeric:tabular-nums;white-space:nowrap}.inspector__changed[hidden]{display:none!important}.inspector__actions{gap:var(--space-2);margin-top:var(--space-2);display:flex}.inspector__actions[hidden]{display:none!important}.inspector__actions .btn{flex:1}.inspector__discard,.inspector__save,.confirm-dialog__actions .btn{height:28px;padding:0 var(--space-2);font-size:var(--text-xs);font-weight:500}.inspector__discard{background:var(--color-surface);border-color:var(--color-border)}.btn.inspector__save{color:#fff;background:var(--color-switch);border-color:var(--color-switch)}.btn.inspector__save:hover:not(:disabled){color:#fff;background:color-mix(in srgb, var(--color-switch) 82%, var(--color-text));border-color:color-mix(in srgb, var(--color-switch) 82%, var(--color-text))}.preview-theme{border-radius:var(--radius-pill);background:color-mix(in srgb, var(--color-text) 6%, var(--color-surface));align-items:center;height:32px;padding:3px;display:inline-flex;position:relative}.preview-theme[hidden]{display:none!important}.preview-theme__thumb{z-index:0;border-radius:var(--radius-pill);background:var(--color-surface);pointer-events:none;width:calc(50% - 3px);height:calc(100% - 6px);transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 1px #37352f14}.preview-theme.is-dark .preview-theme__thumb{transform:translate(100%)}.preview-theme__option{z-index:1;border-radius:var(--radius-pill);width:52px;height:26px;color:var(--color-text-muted);font-family:inherit;font-size:var(--text-sm);cursor:pointer;background:0 0;border:0;padding:0;font-weight:550;line-height:1;transition:color .2s;position:relative}.preview-theme__option:hover:not(.is-active){color:var(--color-text-secondary)}.preview-theme__option.is-active,.preview-theme__option[aria-pressed=true]{color:var(--color-text)}.preview-theme__option:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}@media (prefers-reduced-motion:reduce){.preview-theme__thumb,.preview-theme__option{transition:none}}.inspector__section{padding:var(--space-4);border-bottom:1px solid var(--color-border)}.inspector__section:last-child{border-bottom:0}.inspector__section-title{margin:0 0 var(--space-3);font-size:var(--text-sm);letter-spacing:0;text-transform:none;color:var(--color-text-secondary);font-weight:500}.left-dock{left:var(--shell-offset);bottom:var(--shell-offset);z-index:22;pointer-events:none;flex-direction:column;align-items:flex-start;gap:10px;width:min(260px,100vw - 280px);max-height:calc(100vh - 96px);display:flex;position:fixed}@media (max-width:760px){.left-dock{left:var(--space-2);bottom:calc(var(--space-2) + 52px);width:min(260px,100vw - 24px)}}.comment-compose{z-index:40;border:1px solid var(--color-border);background:var(--color-surface);width:max-content;max-width:min(280px,100vw - 24px);box-shadow:var(--shadow-card);border-radius:14px;flex-direction:column;align-items:stretch;gap:10px;padding:12px 12px 8px;transition:width .2s,height .2s;display:flex;position:fixed}.comment-compose.is-resizing{overflow:hidden}.comment-compose[hidden]{display:none!important}.comment-mix{z-index:41;border:1px solid var(--color-border);background:var(--color-surface);width:max-content;max-width:min(280px,100vw - 24px);box-shadow:var(--shadow-card);border-radius:14px;padding:10px;position:fixed}.comment-mix[hidden]{display:none!important}.comment-compose.is-multiline{border-radius:14px}.comment-compose__head{flex-direction:column;gap:8px;min-width:0;padding:0 2px;display:flex}.comment-compose__head:has(.comment-compose__facts[hidden]){display:none}.comment-compose__label{display:none}.comment-compose.is-selection{gap:0;padding:12px}.comment-compose.is-selection .comment-compose__row,.comment-compose__comment{display:none}.comment-compose.is-selection .comment-compose__comment{width:-moz-fit-content;width:fit-content;color:var(--color-text-muted);font:inherit;cursor:pointer;background:0 0;border:0;align-items:baseline;gap:4px;margin:8px 0 0;padding:0 2px;font-size:12px;font-weight:450;line-height:1.3;display:inline-flex}.comment-compose.is-selection .comment-compose__comment:hover,.comment-compose.is-selection .comment-compose__comment:hover kbd{color:var(--color-text)}.comment-compose__comment kbd{font-family:inherit;font-size:inherit;color:var(--color-text-secondary);font-weight:550}.comment-fact.is-color{display:contents}.comment-fact__value.token-field{justify-content:flex-start;min-width:0}.comment-compose .color-field .token-field__restore,.comment-mix .color-field .token-field__restore,.token-changes .mix-stop .color-field .token-field__restore{z-index:2;width:16px;min-width:16px;height:16px;margin-left:2px;display:none;position:relative;top:auto;right:auto;transform:none}.comment-compose .token-field.is-dirty .color-field .token-field__restore,.comment-mix .mix-stop.is-dirty .color-field .token-field__restore,.token-changes .mix-stop.is-dirty .color-field .token-field__restore{opacity:.7;pointer-events:auto;display:inline-flex}.comment-mix .mix-stop.is-dirty .color-field .token-field__restore:hover,.token-changes .mix-stop.is-dirty .color-field .token-field__restore:hover{background:var(--color-surface-muted);color:var(--color-text);opacity:1}.comment-compose .color-field.is-preview,.comment-mix .color-field.is-preview{cursor:default}.comment-compose .color-field.is-mix{cursor:pointer}.comment-compose .color-field.is-mix.is-open{border-color:var(--color-border-strong);background:var(--color-surface-muted)}.comment-fact__value.token-field .color-field,.comment-mix .mix-stop .color-field,.token-changes .mix-stop .color-field{flex:0 auto;width:-moz-fit-content;width:fit-content;min-width:0;max-width:148px}.comment-compose .color-field output{flex:0 auto;width:auto;min-width:0;max-width:114px}.comment-mix .color-field output,.token-changes .color-field output{flex:0 auto;width:auto;min-width:0;max-width:100%}.comment-fact__mix{color:var(--color-text-secondary);font-size:var(--text-xs);line-height:1.3}.comment-fact__mix[hidden],.mix-editor[hidden]{display:none!important}.mix-editor{grid-template-columns:max-content auto;align-items:center;gap:6px;padding:4px 0 2px;display:grid}.mix-editor__slider.range-field{grid-column:1/-1;width:100%;min-width:0;display:block}.mix-editor__slider .range-field__slider{width:100%}.mix-stop{color:var(--color-text-secondary);font-size:var(--text-xs);margin:0;display:contents}.mix-stop .color-field{min-width:0}.mix-stop__plain{min-width:0;color:var(--color-text);align-items:center;gap:6px;font-size:12px;display:inline-flex}.mix-stop__name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.mix-stop__pct{min-width:36px;color:var(--color-text-secondary);font-variant-numeric:tabular-nums;text-align:right;flex-shrink:0;font-size:12px}.mix-stop input[type=color]{opacity:0;cursor:pointer;border:0;width:100%;height:100%;padding:0;position:absolute;inset:0}.comment-compose__facts{grid-template-columns:max-content max-content;align-items:center;gap:5px 8px;display:grid}.comment-compose__facts[hidden]{display:none!important}.comment-fact{display:contents}.comment-fact__name{color:var(--color-text-muted);font-size:12px;font-weight:450;line-height:1.3}.comment-fact__value{min-width:0;color:var(--color-text);font-variant-numeric:tabular-nums;align-items:center;gap:6px;font-size:12px;font-weight:550;line-height:1.3;display:flex}.comment-fact__text{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.comment-compose .comment-fact__text{max-width:148px;font-size:var(--text-xs);letter-spacing:.02em;font-weight:450}.comment-fact__swatch{border-radius:3px;flex-shrink:0;width:14px;height:14px;box-shadow:inset 0 0 0 1px #37352f2e}.comment-compose__row{align-items:flex-end;gap:8px;display:flex}.comment-compose__head:not(:has(.comment-compose__facts[hidden]))+.comment-compose__row{border-top:1px solid var(--color-border);padding-top:8px}.comment-compose__field{flex:1;align-items:center;min-width:0;min-height:32px;display:flex;position:relative}.comment-compose__status{color:var(--color-text);white-space:nowrap;opacity:0;pointer-events:none;align-items:center;margin:0;font-size:13px;font-weight:560;line-height:32px;display:flex;position:absolute;inset:0}.comment-compose__status[hidden]{display:none!important}.comment-compose.is-copied{pointer-events:none;animation:.22s 1.15s forwards comment-card-out}.comment-compose.is-copied .comment-compose__input{opacity:0;transition:opacity .16s}.comment-compose.is-copied .comment-compose__status{animation:.2s 80ms forwards comment-status-in;display:flex!important}.comment-compose.is-copied .comment-compose__submit{background:var(--color-text);color:var(--color-surface);animation:.32s comment-submit-pop}.comment-compose.is-invalid .comment-compose__row{animation:.28s comment-nudge}.comment-compose__submit-icon--check,.comment-compose.is-copied .comment-compose__submit-icon--send{display:none}.comment-compose.is-copied .comment-compose__submit-icon--check{display:block}@keyframes comment-submit-pop{0%{transform:scale(.92)}to{transform:scale(1)}}@keyframes comment-status-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}@keyframes comment-card-out{to{opacity:0}}@keyframes comment-nudge{0%,to{transform:translate(0)}30%{transform:translate(-3px)}70%{transform:translate(3px)}}@media (prefers-reduced-motion:reduce){.comment-compose{transition:none}.comment-compose.is-copied,.comment-compose.is-copied .comment-compose__submit,.comment-compose.is-copied .comment-compose__status{animation:none}.comment-compose.is-copied .comment-compose__status{opacity:1}}.comment-compose__input{min-width:0;max-height:120px;color:var(--color-text);font:inherit;resize:none;background:0 0;border:0;outline:none;flex:1;margin:0;padding:0;font-size:13px;line-height:1.4;overflow-y:auto}.comment-compose__input::placeholder{color:var(--color-text-muted)}.comment-compose__submit{background:var(--color-primary);width:32px;height:32px;color:var(--color-on-primary);cursor:pointer;border:0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.comment-compose__submit:hover{background:var(--color-primary-hover)}.comment-compose__submit svg{width:14px;height:14px}.token-field__label{min-width:0;color:var(--color-text)}.token-field.is-dirty .token-field__label{color:var(--color-warning)}.token-field__controls{align-items:center;gap:var(--space-1);flex-shrink:0;margin-left:auto;display:inline-flex}.token-field__restore{border-radius:var(--radius-sm);width:20px;min-width:20px;height:20px;color:var(--color-icon);opacity:0;pointer-events:none;cursor:pointer;background:0 0;border:0;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.token-field.is-dirty .token-field__restore{opacity:.7;pointer-events:auto}.token-field.is-dirty .token-field__restore:hover{background:var(--color-surface-muted);color:var(--color-text);opacity:1}.token-field.is-dirty .token-field__restore:focus-visible{outline:2px solid color-mix(in srgb, var(--color-text) 28%, transparent);outline-offset:1px;opacity:1}.token-field__restore svg{width:14px;height:14px}.range-field+.color-field-stack,.boolean-field-row+.color-field-stack,.color-field-stack+.range-field,.color-field-stack+.boolean-field-row{margin-top:var(--space-3)}.color-field-stack{align-items:center;column-gap:var(--space-2);row-gap:var(--space-3);grid-template-columns:minmax(0,1fr) max-content;display:grid}.color-field-stack .color-field-row{display:contents}.color-field-stack .token-field__controls{width:100%;margin-left:0}.color-field-stack .token-field__note{grid-column:1/-1}.color-field-stack .color-field{flex:1 0 auto}.color-field-row{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.token-field--error .color-field-row__label{color:var(--color-warning)}.token-field__note{font-size:var(--text-xs);color:var(--color-text-secondary);flex:100%;margin:0;line-height:1.4}.token-field__note--error{color:var(--color-warning)}.color-field__swatch--invalid{background:repeating-linear-gradient(45deg, var(--color-surface-muted), var(--color-surface-muted) 4px, var(--color-border) 4px, var(--color-border) 8px)!important}.color-field input[type=color]:disabled{cursor:not-allowed}.color-field-row+.color-field-row{margin-top:var(--space-3)}.color-field-row__label{min-width:0;font-size:var(--text-xs);flex:1}.color-field{align-items:center;gap:var(--space-1);min-width:0;padding:var(--space-1) var(--space-2) var(--space-1) var(--space-1);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);cursor:pointer;display:inline-flex;position:relative}.color-field__swatch{border:1px solid #00000014;border-radius:4px;flex-shrink:0;width:18px;height:18px}.color-field input[type=color]{z-index:1;opacity:0;cursor:pointer;border:0;width:100%;height:100%;padding:0;position:absolute;inset:0}.color-field output{text-overflow:ellipsis;white-space:nowrap;max-width:148px;font-size:var(--text-xs);color:var(--color-text);font-variant-numeric:tabular-nums;letter-spacing:.02em;pointer-events:none;overflow:hidden}.boolean-field-row{align-items:center;column-gap:var(--space-2);grid-template-columns:minmax(0,1fr) 20px 48px;display:grid}.boolean-field-row+.boolean-field-row,.range-field+.boolean-field-row,.boolean-field-row+.range-field{margin-top:12px}.boolean-field-row__label{min-width:0;font-size:var(--text-xs);text-overflow:ellipsis;white-space:nowrap;grid-column:1;line-height:1.3;overflow:hidden}.boolean-field-row .token-field__controls{display:contents}.boolean-field-row .token-field__restore{grid-area:1/2}.boolean-field-row .switch{grid-area:1/3;justify-self:end}.switch{cursor:pointer;flex-shrink:0;width:36px;height:20px;display:inline-flex;position:relative}.switch input{z-index:1;opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.switch__track{border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-surface-muted);transition:background .15s,border-color .15s;position:absolute;inset:0}.switch__track:after{content:"";background:var(--color-surface);border-radius:50%;width:14px;height:14px;transition:transform .15s,background .15s,box-shadow .15s;position:absolute;top:2px;left:2px;box-shadow:0 0 0 1px #37352f14}.switch input:checked+.switch__track{border-color:var(--color-switch);background:var(--color-switch)}.switch input:checked+.switch__track:after{background:var(--color-surface);box-shadow:none;transform:translate(16px)}.switch input:focus-visible+.switch__track{box-shadow:0 0 0 3px color-mix(in srgb, var(--color-switch) 35%, transparent)}.range-field{--range-track:color-mix(in srgb, var(--color-text) 10%, var(--color-surface));--range-fill:color-mix(in srgb, var(--color-text) 24%, var(--color-surface));--range-thumb:var(--color-surface);--range-size:12px;align-items:center;column-gap:var(--space-2);font-size:var(--text-xs);grid-template-columns:minmax(0,1fr) 20px 48px;row-gap:2px;display:grid}.range-field+.range-field{margin-top:12px}.range-field .token-field__label{text-overflow:ellipsis;white-space:nowrap;grid-area:1/1;line-height:1.3;overflow:hidden}.range-field__meta{display:contents}.range-field .token-field__restore{grid-area:1/2}.range-field output{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);width:48px;min-width:48px;height:22px;color:var(--color-text);font-variant-numeric:tabular-nums;grid-area:1/3;justify-content:flex-end;align-items:center;padding:0 6px;display:inline-flex}.range-field__slider{height:var(--range-size);grid-area:2/1/auto/-1;align-items:center;display:flex;position:relative}.range-field__slider:before{content:"";inset-inline:0;height:var(--range-size);border-radius:var(--radius-pill);background:linear-gradient(to right, var(--range-fill) 0, var(--range-fill) calc(var(--range-size) * .5 + (100% - var(--range-size)) * var(--range-progress,0)), var(--range-track) calc(var(--range-size) * .5 + (100% - var(--range-size)) * var(--range-progress,0)), var(--range-track) 100%);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.range-field input[type=range]{z-index:1;width:100%;height:var(--range-size);cursor:pointer;appearance:none;background:0 0;margin:0;position:relative}.range-field input[type=range]:focus{outline:none}.range-field input[type=range]:disabled{cursor:not-allowed;opacity:.45}.range-field input[type=range]::-webkit-slider-runnable-track{height:var(--range-size);background:0 0;border:0}.range-field input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:var(--range-size);height:var(--range-size);background:var(--range-thumb);border:0;border-radius:50%;margin-top:0;box-shadow:0 0 0 1px #37352f1f}.range-field input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px color-mix(in srgb, var(--color-text) 16%, transparent)}.range-field input[type=range]::-moz-range-track{height:var(--range-size);background:0 0;border:0}.range-field input[type=range]::-moz-range-progress{background:0 0}.range-field input[type=range]::-moz-range-thumb{width:var(--range-size);height:var(--range-size);background:var(--range-thumb);border:0;border-radius:50%;box-shadow:0 0 0 1px #37352f1f}.range-field input[type=range]:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px color-mix(in srgb, var(--color-text) 16%, transparent)}.inspector__empty{padding:var(--space-4);color:var(--color-text-secondary);font-size:var(--text-xs);margin:0}.vault-validation{border:1px solid var(--color-border);border-radius:var(--radius-island);background:var(--color-surface);pointer-events:auto;flex-direction:column;gap:6px;width:100%;max-height:min(220px,40vh);padding:10px 8px 10px 12px;display:flex;overflow:hidden;box-shadow:0 1px 2px #37352f0f}.vault-validation[hidden]{display:none!important}.vault-validation__header{align-items:center;gap:var(--space-2);min-width:0;display:flex}.vault-validation__mark{background:#e24c4c;border-radius:50%;flex-shrink:0;width:6px;height:6px}.vault-validation--warning .vault-validation__mark{background:var(--color-warning)}.vault-validation__title{min-width:0;font-size:var(--text-sm);color:var(--color-text);flex:1;font-weight:500}.vault-validation__copy{border-radius:var(--radius-sm);width:22px;height:22px;color:var(--color-text-muted);background:0 0;border:0;align-items:center;margin:-2px 0;padding:0;display:inline-flex;overflow:hidden}.vault-validation__copied{max-width:0;color:var(--color-text);font-size:var(--text-xs);white-space:nowrap;opacity:0;margin-right:0;font-weight:500;line-height:1;transition:max-width .18s,margin-right .18s,opacity .16s;overflow:hidden}.vault-validation__copy-glyph{flex-shrink:0;width:16px;height:16px;display:block;position:relative}.vault-validation__copy-icon,.vault-validation__badge{transition:opacity .16s;position:absolute;inset:0}.vault-validation__copy-icon{width:14px;height:14px;margin:auto}.vault-validation__badge{color:#fff;opacity:0;background:#37352f;border-radius:50%;place-items:center;display:grid}.vault-validation__badge svg{width:10px;height:10px}.vault-validation__copy:hover:not(.is-copied){color:var(--color-text);background:color-mix(in srgb, var(--color-text) 6%, transparent)}.vault-validation__copy.is-copied{width:auto;color:var(--color-text);background:0 0;padding-right:2px}.vault-validation__copy.is-copied .vault-validation__copied{opacity:1;max-width:64px;margin-right:6px}.vault-validation__copy.is-copied .vault-validation__copy-icon{opacity:0}.vault-validation__copy.is-copied .vault-validation__badge{opacity:1}@media (prefers-reduced-motion:reduce){.vault-validation__copied,.vault-validation__copy-icon,.vault-validation__badge{transition:none}}.vault-validation__list{overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none;flex:1;gap:8px;min-height:0;margin:0;padding:0 4px 0 14px;list-style:none;display:grid;overflow-y:auto}.vault-validation__list::-webkit-scrollbar{width:0;height:0;display:none}.vault-validation__item{font-size:var(--text-xs);-webkit-user-select:text;user-select:text;gap:1px;line-height:1.4;display:grid}.vault-validation__message{color:var(--color-text-secondary)}.vault-validation__detail{color:var(--color-text-muted);word-break:break-all}@media (max-width:760px){.inspector{right:var(--space-2)}}.viewport{inset:0;top:var(--browser-notice-offset);overscroll-behavior:none;cursor:grab;touch-action:none;background:var(--color-bg);position:fixed;overflow:hidden}.viewport.is-panning{cursor:grabbing}.viewport.is-loading-frames:before{content:none}.canvas-loading{z-index:200;background:var(--color-bg);pointer-events:auto;opacity:1;place-items:center;transition:opacity .22s;display:grid;position:fixed;inset:0}.canvas-loading.is-entering,.canvas-loading.is-leaving{opacity:0}.canvas-loading__spinner{border:2px solid color-mix(in srgb, var(--color-text) 16%, transparent);border-top-color:var(--color-text);border-radius:50%;width:20px;height:20px;animation:.7s linear infinite canvas-loading-spin}@keyframes canvas-loading-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.canvas-loading{transition:none}.canvas-loading.is-entering{opacity:1}.canvas-loading__spinner{border-top-color:color-mix(in srgb, var(--color-text) 16%, transparent);border-right-color:var(--color-text);animation:none}}.canvas{transform-origin:0 0;width:2200px;height:1700px;position:absolute;top:0;left:0}.canvas.is-transforming{will-change:transform}.file-card{contain:layout style;-webkit-user-select:none;user-select:none;background:0 0;flex-direction:column;align-items:flex-start;display:flex;position:absolute}.file-card__header{align-items:center;gap:var(--space-2);cursor:grab;-webkit-user-select:none;user-select:none;flex-shrink:0;width:max-content;max-width:100%;min-height:34px;margin-bottom:6px;display:flex}.viewport.is-card-dragging .file-card__header{cursor:grabbing}.file-card__title{letter-spacing:-.02em;min-width:0;color:var(--color-text-secondary);text-overflow:ellipsis;white-space:nowrap;font-size:28px;font-weight:600;line-height:1.1;overflow:hidden}.file-card__body{box-sizing:border-box;flex-shrink:0;position:relative;overflow:visible}.file-card__toolbar{z-index:6;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface-glass);height:32px;box-shadow:var(--shadow-island);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transform:translate(-50%, calc(-100% - 8px)) scale(calc(1 / var(--canvas-scale,1)));transform-origin:bottom;pointer-events:auto;align-items:center;gap:2px;padding:2px;display:none;position:absolute;top:0;left:50%}.file-card__body.is-selected .file-card__toolbar{display:inline-flex}.file-card__toolbar-btn{border-radius:var(--radius-md);width:28px;height:28px;color:var(--color-text-secondary);cursor:pointer;background:0 0;border:0;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:color .12s,background .12s;display:inline-flex}.file-card__toolbar-btn svg{width:14px;height:14px;display:block}.file-card__toolbar-btn:hover{color:var(--color-icon);background:color-mix(in srgb, var(--color-text) 10%, transparent)}.file-card__toolbar-btn--danger:hover{color:#e24c4c;background:#e24c4c1f}.file-card__toolbar-btn.is-active{color:var(--color-icon);background:color-mix(in srgb, var(--color-text) 12%, transparent)}.file-card__toolbar-btn:focus-visible{color:var(--color-icon);background:color-mix(in srgb, var(--color-text) 10%, transparent)}.file-card__toolbar-btn.is-busy{color:var(--color-icon);pointer-events:none}.file-card__toolbar-btn.is-busy svg{animation:.7s linear infinite file-card-reload-spin}.file-card__toolbar-divider{background:var(--color-border-strong);flex-shrink:0;width:1px;height:16px;margin:0 2px}@keyframes file-card-reload-spin{to{transform:rotate(360deg)}}.viewport.is-comment-mode .file-card__toolbar,.viewport.is-comment-mode .file-card__size{display:none!important}.file-card__body.is-selected{--selection-outline:calc(4px / var(--canvas-scale,1));--handle-size:calc(8px / var(--canvas-scale,1));--handle-half:calc(4px / var(--canvas-scale,1));--handle-border:calc(1px / var(--canvas-scale,1));outline:var(--selection-outline) solid var(--color-selection);outline-offset:0}.file-card__size{z-index:6;border-radius:var(--radius-sm);background:var(--color-selection);color:#fff;font-size:var(--text-xs);font-variant-numeric:tabular-nums;letter-spacing:-.01em;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;transform:translateY(calc(100% + 8px)) scale(calc(1 / var(--canvas-scale,1)));transform-origin:100% 0;padding:3px 6px;font-weight:500;line-height:1.2;display:none;position:absolute;bottom:0;right:0}.file-card__body.is-selected .file-card__size{display:block}.viewport.is-comment-mode,.viewport.is-comment-mode .file-card__header{cursor:crosshair}.viewport.is-comment-mode .file-card__handles{display:none!important}.viewport.is-comment-mode .file-card.is-comment-hover .file-card__body,.file-card__body.is-comment-flash{--comment-outline:calc(3px / var(--canvas-scale,1));outline:var(--comment-outline) solid var(--comment-blue);outline-offset:0}.file-card__comment-mark{width:calc(var(--comment-mark-size,22px) / var(--canvas-scale,1));height:calc(var(--comment-mark-size,22px) / var(--canvas-scale,1));background:var(--comment-blue);border:calc(2.5px / var(--canvas-scale,1)) solid #fff;box-shadow:0 0 0 0 color-mix(in srgb, var(--comment-blue) 80%, transparent), 0 0 calc(10px / var(--canvas-scale,1)) calc(2px / var(--canvas-scale,1)) color-mix(in srgb, var(--comment-blue) 55%, transparent);pointer-events:none;z-index:4;border-radius:50%;animation:1.35s ease-out infinite comment-mark-pulse;position:absolute;top:0;right:0;transform:translate(40%,-40%)}@keyframes comment-mark-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--comment-blue) 80%, transparent), 0 0 calc(10px / var(--canvas-scale,1)) calc(2px / var(--canvas-scale,1)) color-mix(in srgb, var(--comment-blue) 55%, transparent);transform:translate(40%,-40%)scale(1)}55%{box-shadow:0 0 0 calc(var(--comment-pulse,22px) / var(--canvas-scale,1)) transparent, 0 0 calc(14px / var(--canvas-scale,1)) calc(3px / var(--canvas-scale,1)) color-mix(in srgb, var(--comment-blue) 35%, transparent);transform:translate(40%,-40%)scale(1.12)}to{box-shadow:0 0 0 0 transparent, 0 0 calc(10px / var(--canvas-scale,1)) calc(2px / var(--canvas-scale,1)) color-mix(in srgb, var(--comment-blue) 55%, transparent);transform:translate(40%,-40%)scale(1)}}.file-card__clip{border-radius:var(--radius-sm);width:100%;height:100%;position:relative;overflow:hidden}.frame-loading{border-radius:inherit;background:linear-gradient(90deg, var(--color-surface-recessed) 0%, var(--color-surface-muted) 50%, var(--color-surface-recessed) 100%);background-size:200% 100%;animation:1.2s ease-in-out infinite frame-shimmer;position:absolute;inset:0}.file-card__clip.is-loading iframe{opacity:0}.file-card__clip.is-refreshing:after{content:"";z-index:2;pointer-events:none;border-radius:inherit;background:linear-gradient(90deg, transparent 0%, var(--color-accent) 40%, var(--color-accent) 60%, transparent 100%);background-size:200% 100%;height:2px;animation:1s ease-in-out infinite frame-shimmer;position:absolute;top:0;left:0;right:0}@keyframes frame-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.file-card__clip iframe{border-radius:inherit;vertical-align:top;background:0 0;border:0;width:100%;height:100%;display:block}.file-card__handles{pointer-events:none;display:none}.file-card__body.is-selected .file-card__handles{display:block}.file-card__handle{width:var(--handle-size,8px);height:var(--handle-size,8px);background:var(--color-selection);border:var(--handle-border,1px) solid var(--color-surface);border-radius:calc(2px / var(--canvas-scale,1));pointer-events:auto;z-index:3;position:absolute}.file-card__handle--nw{left:calc(var(--handle-half,4px) * -1);top:calc(var(--handle-half,4px) * -1);cursor:nwse-resize}.file-card__handle--n{left:calc(50% - var(--handle-half,4px));top:calc(var(--handle-half,4px) * -1);cursor:ns-resize}.file-card__handle--ne{right:calc(var(--handle-half,4px) * -1);top:calc(var(--handle-half,4px) * -1);cursor:nesw-resize}.file-card__handle--e{right:calc(var(--handle-half,4px) * -1);top:calc(50% - var(--handle-half,4px));cursor:ew-resize}.file-card__handle--se{right:calc(var(--handle-half,4px) * -1);bottom:calc(var(--handle-half,4px) * -1);cursor:nwse-resize}.file-card__handle--s{left:calc(50% - var(--handle-half,4px));bottom:calc(var(--handle-half,4px) * -1);cursor:ns-resize}.file-card__handle--sw{left:calc(var(--handle-half,4px) * -1);bottom:calc(var(--handle-half,4px) * -1);cursor:nesw-resize}.file-card__handle--w{left:calc(var(--handle-half,4px) * -1);top:calc(50% - var(--handle-half,4px));cursor:ew-resize}.page-bar{border-radius:var(--radius-island);background:var(--color-surface);-webkit-backdrop-filter:none;backdrop-filter:none;flex:0 auto;align-items:center;gap:2px;min-width:0;max-width:min(560px,100%);height:40px;padding:4px;display:flex;position:relative;top:auto;left:auto;box-shadow:0 1px 2px #37352f0f}.page-bar[hidden]{display:none}.page-bar__tabs{align-items:center;gap:2px;min-width:0;display:flex;overflow:hidden}.page-bar__tabs[hidden],.page-bar__label[hidden],.page-bar__overflow[hidden],.page-bar__tab[hidden],.page-bar__menu[hidden]{display:none}.page-bar__label{height:32px;color:var(--color-text);font-size:var(--text-sm);white-space:nowrap;flex-shrink:0;align-items:center;padding:0 10px;font-weight:500;display:flex}.page-bar__tab{border-radius:var(--radius-sm);min-width:0;max-width:148px;height:32px;color:var(--color-text-secondary);flex:0 auto;align-items:center;display:flex;position:relative}.page-bar__tab.is-active{background:color-mix(in srgb, var(--color-text) 8%, transparent);max-width:176px;color:var(--color-text)}.page-bar__tab:has(.page-bar__rename){flex:none;max-width:none}.page-bar__tab-hit,.page-bar__add,.page-bar__more{border-radius:var(--radius-sm);height:32px;color:inherit;font-size:var(--text-sm);cursor:pointer;background:0 0;border:0;padding:0 10px;font-weight:500}.page-bar__tab-hit{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;overflow:hidden}.page-bar__tabs--deletable .page-bar__tab-hit{padding-right:26px}.page-bar__add,.page-bar__more{width:32px;color:var(--color-text-secondary);flex-shrink:0;padding:0;font-size:18px;line-height:1}.page-bar__tab:hover,.page-bar__add:hover,.page-bar__more:hover,.page-bar__more[aria-expanded=true]{background:color-mix(in srgb, var(--color-text) 6%, transparent);color:var(--color-text)}.page-bar__tab-close{width:18px;height:18px;color:inherit;cursor:pointer;opacity:0;pointer-events:none;background:0 0;border:0;border-radius:4px;margin:0;padding:0;font-size:15px;line-height:1;transition:opacity .12s;position:absolute;top:50%;right:5px;transform:translateY(-50%)}.page-bar__tab.is-active:hover .page-bar__tab-close,.page-bar__tab.is-active:focus-within .page-bar__tab-close{opacity:.55;pointer-events:auto}.page-bar__tab-close:hover,.page-bar__tab-close:focus-visible{background:color-mix(in srgb, var(--color-text) 10%, transparent);opacity:1}.page-bar__overflow{flex-shrink:0;position:relative}.page-bar__menu{top:calc(100% + var(--space-2));z-index:30;min-width:180px;max-width:min(280px,100vw - 48px);max-height:min(280px,100vh - 80px);padding:var(--space-1);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-island);position:absolute;right:0;overflow:hidden auto}.page-bar__menu-item{width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--color-text);font-size:var(--text-sm);text-align:left;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;background:0 0;border:0;font-weight:500;display:block;overflow:hidden}.page-bar__menu-item:hover,.page-bar__menu-item:focus-visible{background:color-mix(in srgb, var(--color-text) 6%, transparent)}.page-bar__add[hidden],.page-bar__create[hidden]{display:none}.page-bar__create{align-items:center;gap:2px;display:flex}.page-bar__input{border-radius:var(--radius-sm);background:color-mix(in srgb, var(--color-text) 6%, transparent);width:120px;height:32px;color:var(--color-text);font-size:var(--text-sm);border:0;outline:none;padding:0 8px}.page-bar__rename-form{align-items:stretch;height:100%;display:flex}.page-bar__rename{box-sizing:border-box;border-radius:var(--radius-sm);min-width:72px;max-width:220px;height:32px;color:var(--color-text);font-size:var(--text-sm);background:0 0;border:0;outline:none;padding:0 8px;font-weight:500}.page-bar__cancel{border-radius:var(--radius-sm);width:32px;height:32px;color:var(--color-text-secondary);cursor:pointer;background:0 0;border:0;flex-shrink:0;padding:0;font-size:18px;line-height:1}.page-bar__cancel:hover{background:color-mix(in srgb, var(--color-text) 6%, transparent);color:var(--color-text)}.bottom-right{z-index:20;right:var(--shell-offset);bottom:var(--shell-offset);align-items:center;gap:var(--panel-gap);display:flex;position:fixed}.bottom-right .zoom-bar{position:relative;inset:auto}.zoom-bar{right:var(--shell-offset);bottom:var(--shell-offset);height:40px;padding:var(--space-1);border-radius:var(--radius-island);align-items:center;gap:var(--space-1);display:flex}.zoom-bar .btn{min-width:32px;color:var(--color-icon);background:0 0;border:0}.zoom-bar output{text-align:center;width:44px;font-size:var(--text-xs);color:var(--color-text-secondary)}.zoom-bar__divider{width:1px;height:18px;margin:0 var(--space-1);background:var(--color-border)}.frame-preview{z-index:50;background:var(--color-bg);cursor:default;place-items:center;display:grid;position:fixed;inset:0;overflow:hidden}.frame-preview:focus,.frame-preview:focus-visible{outline:none}.frame-preview[hidden]{display:none}.frame-preview__back{top:calc(var(--shell-offset) + var(--browser-notice-offset));left:var(--shell-offset);z-index:1;width:var(--toolbar-height);height:var(--toolbar-height);background:var(--color-surface);-webkit-backdrop-filter:none;backdrop-filter:none;justify-content:center;align-items:center;padding:4px;display:flex;box-shadow:0 1px 2px #37352f0f}.frame-preview__fit{border-radius:var(--radius-sm);overflow:hidden}.frame-preview__sizer{position:relative}.frame-preview__stage{transform-origin:0 0;border-radius:inherit;position:absolute;top:0;left:0;overflow:hidden}.frame-preview__stage iframe{background:0 0;border:0;width:100%;height:100%;display:block}