:root{--bg-app: #f5f5f7;--bg-panel: #ffffff;--bg-canvas: #e9e9ec;--bg-hover: rgba(0, 0, 0, .05);--bg-active: rgba(0, 0, 0, .09);--line: #e3e3e6;--line-strong: #c9c9ce;--text: #1a1a1c;--text-muted: #77777e;--accent: #0d99ff;--accent-text: #ffffff;--danger: #e2686a;--radius: 5px;--panel-width: 240px;--topbar-height: 44px;--font: 11px/1.4 "Inter", ui-sans-serif, system-ui, sans-serif;--color-scheme: light;--toolbar-bg: #2c2c2c;--toolbar-text: #e6e6e6;--toolbar-hover: rgba(255, 255, 255, .12);--shadow-float: 0 4px 16px rgba(0, 0, 0, .28)}:root[data-theme=dark]{--bg-app: #1e1e1e;--bg-panel: #2c2c2c;--bg-canvas: #1a1a1a;--bg-hover: rgba(255, 255, 255, .07);--bg-active: rgba(255, 255, 255, .12);--line: #383838;--line-strong: #4a4a4a;--text: #e6e6e6;--text-muted: #9b9b9b;--accent: #0d99ff;--accent-text: #ffffff;--danger: #e2686a;--color-scheme: dark}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg-app: #1e1e1e;--bg-panel: #2c2c2c;--bg-canvas: #1a1a1a;--bg-hover: rgba(255, 255, 255, .07);--bg-active: rgba(255, 255, 255, .12);--line: #383838;--line-strong: #4a4a4a;--text: #e6e6e6;--text-muted: #9b9b9b;--color-scheme: dark}}body{background:var(--bg-app);color:var(--text)}.shell{position:fixed;inset:0;display:grid;grid-template-columns:var(--panel-width) minmax(0,1fr) var(--panel-width);grid-template-rows:var(--topbar-height) minmax(0,1fr);grid-template-areas:"topbar topbar topbar" "left canvas right";background:var(--bg-app);color:var(--text);font:var(--font)}.shell-topbar{grid-area:topbar;display:flex;align-items:center;gap:8px;padding:0 8px;background:var(--bg-panel);border-bottom:1px solid var(--line);overflow:visible}.shell-panel{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;background:var(--bg-panel)}.shell-left{grid-area:left;border-right:1px solid var(--line)}.shell-right{grid-area:right;border-left:1px solid var(--line)}.shell-canvas{grid-area:canvas;position:relative;min-width:0;min-height:0;overflow:hidden;background:var(--bg-canvas)}.shell-canvas-host{position:absolute;inset:0}.topbar-left,.topbar-right{display:flex;align-items:center;gap:8px;flex:1 1 0;min-width:0}.topbar-right{justify-content:flex-end}.topbar-mark{display:flex;color:var(--text-muted);padding:0 2px}.topbar-file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.topbar-icon-button,.menu-button,.topbar-share{display:flex;align-items:center;gap:4px;border:0;border-radius:var(--radius);background:none;color:inherit;font:inherit;padding:4px 6px;cursor:pointer}.topbar-icon-button:hover,.menu-button:hover{background:var(--bg-hover)}.topbar-icon-button:active,.menu-button[aria-expanded=true]{background:var(--bg-active)}.topbar-zoom{display:flex;align-items:center;gap:2px}.topbar-zoom-menu{justify-content:space-between;min-width:56px;font-variant-numeric:tabular-nums}.topbar-people{display:flex;align-items:center;gap:4px}.topbar-avatar{width:24px;height:24px;border-radius:50%;border:2px solid var(--bg-panel);color:#fff;font-size:10px;font-weight:600;line-height:1;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer}.topbar-avatar:disabled{cursor:default}.topbar-avatar.is-following{border-color:currentColor;box-shadow:0 0 0 1px var(--bg-panel)}.topbar-connection{font-size:11px;padding:3px 8px;border-radius:var(--radius);white-space:nowrap;color:var(--text-muted);border:1px solid var(--line)}.topbar-connection.is-offline,.topbar-connection.is-denied{color:var(--accent-text);background:#e5484d;border-color:transparent}.topbar-share{background:var(--accent);color:var(--accent-text);padding:5px 12px;font-weight:600}.topbar-share:hover{opacity:.88}.topbar-viewer{color:var(--text-muted);border:1px solid var(--line);border-radius:var(--radius);padding:4px 8px}.menu{position:relative;display:flex;min-width:0}.menu-backdrop{position:fixed;inset:0;z-index:20}.menu-popup{position:absolute;top:calc(100% + 4px);z-index:21;min-width:160px;padding:4px;background:var(--bg-panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-float)}.menu-popup-left{left:0}.menu-popup-right{right:0}.menu-title{padding:4px 8px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}.menu-item{display:flex;align-items:center;gap:6px;width:100%;padding:5px 8px;border:0;border-radius:var(--radius);background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}.menu-item:hover{background:var(--bg-hover)}.menu-item-check{display:flex;width:12px;color:var(--accent)}.toolbar{position:absolute;left:0;right:0;bottom:16px;width:fit-content;margin-inline:auto;display:flex;align-items:center;justify-content:center;gap:2px;padding:6px;border-radius:999px;background:var(--toolbar-bg);color:var(--toolbar-text);box-shadow:var(--shadow-float);max-width:calc(100% - 16px);flex-wrap:wrap}.toolbar-button,.toolbar-separator{flex:0 0 auto}.toolbar-button{position:relative;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:0;border-radius:999px;background:none;color:inherit;cursor:pointer}.toolbar-button:hover{background:var(--toolbar-hover)}.toolbar-button[aria-pressed=true]{background:var(--accent);color:var(--accent-text)}.toolbar-separator{width:1px;height:20px;margin:0 4px;background:var(--toolbar-hover)}.toolbar-button[data-tip]:hover:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:var(--radius);background:var(--toolbar-bg);color:var(--toolbar-text);box-shadow:var(--shadow-float);white-space:nowrap;pointer-events:none}.layers{display:flex;flex-direction:column;min-height:0;flex:1 1 auto}.layers-section{display:flex;flex-direction:column;min-height:0}.layers-pages{flex:0 0 auto;max-height:30%;border-bottom:1px solid var(--line)}.layers-tree{flex:1 1 auto}.layers-heading{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:8px 8px 4px 10px;color:var(--text-muted)}.layers-heading h2{margin:0;font:inherit;font-weight:600}.layers-heading-button{display:flex;padding:2px;border:0;border-radius:var(--radius);background:none;color:inherit;cursor:pointer}.layers-heading-button:hover:not(:disabled){background:var(--bg-hover)}.layers-heading-button:disabled{opacity:.4;cursor:default}.pages-list,.layers-list{list-style:none;margin:0;padding:0 0 6px;overflow-y:auto;min-height:0;flex:1 1 auto}.page-row,.layer-row{display:flex;align-items:center;gap:4px;height:24px;padding-right:6px;cursor:default;white-space:nowrap}.page-row{padding-left:10px}.page-row:hover,.layer-row:hover{background:var(--bg-hover)}.page-row.selected,.layer-row.selected{background:var(--bg-active)}.layer-row.hidden-layer{color:var(--text-muted)}.layer-icon{display:flex;flex:0 0 auto;color:var(--text-muted)}.layer-row.selected .layer-icon{color:inherit}.layers-list .disclosure{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:14px;height:100%;margin-left:4px;padding:0;border:0;background:none;color:var(--text-muted);cursor:pointer}.layers-list .disclosure[hidden]{display:flex;visibility:hidden;pointer-events:none}.pages-list .name,.layers-list .name{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis}.layers-list .name-input{flex:1 1 auto;width:0;padding:0 2px;font:inherit;color:var(--text);background:var(--bg-panel);border:1px solid var(--accent);border-radius:2px}.layers-list .name-input:focus{outline:none}.layers-list .visibility,.layers-list .lock{display:flex;flex:0 0 auto;padding:2px;border:0;border-radius:var(--radius);background:none;color:inherit;cursor:pointer;opacity:0}.layer-row:hover .visibility,.layer-row:hover .lock,.layers-list .visibility[aria-pressed=false],.layers-list .lock[aria-pressed=true]{opacity:1}.layers-list .visibility:hover,.layers-list .lock:hover{background:var(--bg-hover)}.layer-row.drop-before{box-shadow:inset 0 2px 0 var(--accent)}.layer-row.drop-after{box-shadow:inset 0 -2px 0 var(--accent)}.layer-row.drop-inside{outline:2px solid var(--accent);outline-offset:-2px}.layer-row:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.layers.readonly .disclosure,.layers.readonly .layer-row{cursor:default}.shell-canvas-host>#status{position:absolute;left:12px;bottom:12px;padding:4px 8px;background:var(--bg-panel);color:var(--text-muted);border:1px solid var(--line);border-radius:var(--radius);font:var(--font)}:where(.versions,.restore-banner) button{border:0;border-radius:var(--radius);font:inherit;color:inherit;cursor:pointer}.versions-add button,.versions-restore,.versions-viewing button{height:24px;padding:0 8px;border:1px solid var(--line-strong);background:none}.versions-add button:hover,.versions-restore:hover{background:var(--bg-hover)}.versions-add form{display:flex;flex-direction:column;gap:6px}.versions-add input{height:24px;padding:0 6px;border:1px solid var(--line-strong);border-radius:var(--radius);background:none;color:inherit;font:inherit}.versions-add input:focus{outline:none;border-color:var(--accent)}.versions-open:hover{background:var(--bg-hover)}.versions{display:flex;flex-direction:column;height:100%;overflow:hidden}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;font-weight:600;border-bottom:1px solid var(--line)}.panel-close{background:none;color:var(--text-muted);padding:2px 6px}.versions-add{padding:8px 10px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:6px}.versions-add input{width:100%;box-sizing:border-box}.versions-add-actions{display:flex;gap:6px}.versions-viewing{display:flex;flex-direction:column;gap:6px;padding:8px 10px;background:var(--accent);color:var(--accent-text);font-size:11px}.versions-list{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1}.versions-day{padding:8px 10px 4px;font-size:11px;color:var(--text-muted)}.versions-item{display:flex;align-items:center;gap:4px;padding:0 6px}.versions-item.is-selected{background:var(--bg-hover, rgba(127, 127, 127, .15))}.versions-open{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:2px;background:none;text-align:left;padding:6px 4px}.versions-meta,.versions-description{font-size:11px;color:var(--text-muted)}.versions-restore{font-size:11px;padding:3px 6px}.versions-empty{padding:12px 10px;font-size:11px;color:var(--text-muted)}.restore-banner{position:absolute;top:12px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:var(--radius);background:var(--accent);color:var(--accent-text);font-size:12px;box-shadow:0 4px 16px #00000040;z-index:5}.restore-banner button{background:#fff3;color:var(--accent-text);padding:3px 8px}.inspector{display:flex;flex-direction:column;min-height:0;flex:1 1 auto}.inspector-tabs{display:flex;gap:2px;flex:0 0 auto;padding:4px 8px 0;border-bottom:1px solid var(--line)}.inspector-tabs button{padding:6px 8px;border:0;border-bottom:2px solid transparent;background:none;color:var(--text-muted);font:inherit;cursor:pointer}.inspector-tabs button[aria-selected=true]{color:var(--text);border-bottom-color:var(--text)}.inspector-tabs button:disabled{opacity:.4;cursor:default}.inspector-selection{display:flex;align-items:center;gap:6px;flex:0 0 auto;height:32px;padding:0 10px;border-bottom:1px solid var(--line);white-space:nowrap}.inspector-selection-icon{display:flex;flex:0 0 auto;color:var(--text-muted)}.inspector-selection-name{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;font-weight:600}.inspector-selection-type{flex:0 0 auto;color:var(--text-muted)}.inspector-body{flex:1 1 auto;min-height:0;overflow-y:auto}.inspector-section{display:flex;flex-direction:column;gap:6px;padding:8px 10px 10px;border-bottom:1px solid var(--line)}.inspector-section-head{display:flex;align-items:center;justify-content:space-between;height:20px}.inspector-section-head h3{margin:0;font:inherit;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted)}.inspector-head-button{display:flex;padding:2px;border:0;border-radius:var(--radius);background:none;color:var(--text-muted);cursor:pointer}.inspector-head-button:hover:not(:disabled){background:var(--bg-hover)}.inspector-head-button:disabled{opacity:.4;cursor:default}.inspector-row{display:flex;align-items:center;gap:6px;min-width:0}.inspector-pair,.inspector-padding{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px}.inspector-field{display:flex;align-items:center;gap:4px;min-width:0;flex:1 1 auto;padding:0 4px;border:1px solid transparent;border-radius:var(--radius);background:var(--bg-hover)}.inspector-field:focus-within{border-color:var(--accent)}.inspector-field.disabled{opacity:.5}.inspector-field-label{flex:0 1 auto;min-width:14px;max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-muted);user-select:none}.inspector-scrub{cursor:ew-resize;touch-action:none}.inspector-field.disabled .inspector-scrub{cursor:default}.inspector-input,.inspector-select{flex:1 1 auto;width:0;min-width:0;height:22px;padding:0;border:0;background:none;color:inherit;font:inherit}.inspector-input:focus,.inspector-select:focus{outline:none}.inspector-input::-webkit-outer-spin-button,.inspector-input::-webkit-inner-spin-button{appearance:none;margin:0}.inspector-input{appearance:textfield}.inspector-select{cursor:pointer}.inspector-input::placeholder,.inspector-hex::placeholder{color:var(--text-muted)}.inspector-range input[type=range]{flex:1 1 auto;width:0;min-width:0;accent-color:var(--accent)}.inspector-range-value{flex:0 0 auto;min-width:34px;text-align:right;color:var(--text-muted)}.inspector-color{display:flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;padding:0 4px;border:1px solid transparent;border-radius:var(--radius);background:var(--bg-hover)}.inspector-color:focus-within{border-color:var(--accent)}.inspector-color.disabled{opacity:.5}.inspector-swatch{display:block;position:relative;flex:0 0 auto;width:14px;height:14px;overflow:hidden;border:1px solid var(--line-strong);border-radius:2px}.inspector-swatch input[type=color]{position:absolute;inset:-4px;width:calc(100% + 8px);height:calc(100% + 8px);padding:0;border:0;background:none;cursor:pointer}.inspector-swatch-static{display:block;width:100%;height:100%}.inspector-swatch.mixed:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 45%,var(--line-strong) 45%,var(--line-strong) 55%,transparent 55%);pointer-events:none}.inspector-hex{flex:1 1 auto;width:0;min-width:0;height:22px;padding:0;border:0;background:none;color:inherit;font:inherit;text-transform:uppercase}.inspector-hex:focus{outline:none}.inspector-alpha{flex:0 0 auto;width:38px;height:22px;padding:0;border:0;background:none;color:var(--text-muted);font:inherit;text-align:right}.inspector-checkbox{display:flex;align-items:center;gap:6px;cursor:pointer}.inspector-checkbox input{accent-color:var(--accent);margin:0}.inspector-group{display:flex;gap:2px;flex:1 1 auto;min-width:0}.inspector-group button{display:flex;align-items:center;justify-content:center;gap:4px;flex:1 1 0;min-width:0;height:24px;border:0;border-radius:var(--radius);background:var(--bg-hover);color:inherit;font:inherit;cursor:pointer}.inspector-group button:hover:not(:disabled){background:var(--bg-active)}.inspector-group button[aria-pressed=true]{background:var(--accent);color:var(--accent-text)}.inspector-group button:disabled{opacity:.4;cursor:default}.inspector-style{display:flex;align-items:center;gap:6px;min-width:0}.inspector-button{flex:0 0 auto;height:24px;padding:0 8px;border:1px solid var(--line-strong);border-radius:var(--radius);background:none;color:inherit;font:inherit;cursor:pointer}.inspector-button:hover{background:var(--bg-hover)}.inspector-note{color:var(--text-muted)}.inspector :focus-visible{outline:2px solid var(--accent);outline-offset:1px}.inspector.readonly input,.inspector.readonly select,.inspector.readonly button{pointer-events:none}.inspector.readonly .inspector-scrub{cursor:default;pointer-events:none}#auth,#browser{position:fixed;inset:0;z-index:10;background:var(--bg-app);color:var(--text);font:var(--font);font-size:13px}#auth[hidden],#browser[hidden]{display:none}#auth{display:flex;align-items:center;justify-content:center;padding:24px}#auth-form{display:flex;flex-direction:column;gap:10px;width:300px;padding:24px;background:var(--bg-panel);border:1px solid var(--line);border-radius:calc(var(--radius) * 2);box-shadow:var(--shadow-float)}#auth-form h1{margin:0 0 6px;font-size:16px;font-weight:600}#auth-form input[type=email],#auth-form input[type=text],#auth-form input[type=password],#auth-form select{box-sizing:border-box;width:100%;padding:7px 8px;font:inherit;color:var(--text);background:var(--bg-app);border:1px solid var(--line-strong);border-radius:var(--radius)}#auth-form input:focus,#auth-form select:focus{outline:none;border-color:var(--accent)}#auth-form button[type=submit]{padding:8px 12px;font:inherit;font-weight:600;color:var(--accent-text);background:var(--accent);border:0;border-radius:var(--radius);cursor:pointer}#auth-form button[type=submit]:hover{opacity:.88}#auth-consent-row{display:flex;align-items:flex-start;gap:6px;color:var(--text-muted);line-height:1.4}#auth-consent-row[hidden]{display:none}#auth-error{min-height:1.4em;color:var(--danger)}#browser{display:grid;grid-template-columns:var(--panel-width) minmax(0,1fr)}#browser-side{display:flex;flex-direction:column;gap:4px;min-height:0;padding:12px 8px;background:var(--bg-panel);border-right:1px solid var(--line)}#browser-side h2,#browser-head h2{margin:0;font:inherit;font-weight:600}#browser-side h2{padding:4px 8px;color:var(--text-muted)}#browser-projects{list-style:none;margin:0;padding:0;overflow-y:auto;min-height:0;flex:1 1 auto}#browser-projects button{display:block;width:100%;padding:6px 8px;font:inherit;text-align:left;color:inherit;background:none;border:0;border-radius:var(--radius);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#browser-projects button:hover{background:var(--bg-hover)}#browser-projects button[aria-current=true]{background:var(--bg-active);font-weight:600}#browser-side>button{margin-top:4px;padding:6px 8px;font:inherit;text-align:left;color:var(--text-muted);background:none;border:1px solid var(--line);border-radius:var(--radius);cursor:pointer}#browser-side>button:hover{background:var(--bg-hover);color:var(--text)}#browser-main{display:flex;flex-direction:column;min-width:0;min-height:0;padding:20px 24px;overflow-y:auto}#browser-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}#browser-head h2{font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#browser-new-file{flex:0 0 auto;padding:6px 12px;font:inherit;font-weight:600;color:var(--accent-text);background:var(--accent);border:0;border-radius:var(--radius);cursor:pointer}#browser-new-file:hover{opacity:.88}#browser-new-file[hidden]{display:none}#browser-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;align-content:start}.file-card{display:flex;flex-direction:column;gap:4px;width:100%;padding:12px;font:inherit;text-align:left;color:inherit;background:var(--bg-panel);border:1px solid var(--line);border-radius:calc(var(--radius) * 2);cursor:pointer}.file-card:hover{border-color:var(--accent)}.file-card .name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-card .updated{color:var(--text-muted)}.browser-empty{grid-column:1 / -1;color:var(--text-muted)}#browser-side>#browser-import{margin-top:6px}.import-dialog{box-sizing:border-box;width:min(480px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:0;overflow:hidden;color-scheme:var(--color-scheme);accent-color:var(--accent);background:var(--bg-panel);color:var(--text);font:var(--font);font-size:13px;border:1px solid var(--line);border-radius:calc(var(--radius) * 2);box-shadow:var(--shadow-float)}.import-dialog[open]{display:flex;flex-direction:column}.import-dialog::backdrop{background:#0006}.import-dialog h2{flex:0 0 auto;margin:0;padding:14px 16px 10px;font-size:16px;font-weight:600}.import-body{flex:1 1 auto;min-height:0;padding:0 16px;overflow-y:auto}.import-status p{margin:0 0 8px}.import-pages,.import-losses,.import-files{list-style:none;margin:0 0 12px;padding:0}.import-pages{max-height:280px;overflow-y:auto;padding:4px;background:var(--bg-app);border:1px solid var(--line);border-radius:var(--radius)}.import-pages label{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;padding:4px 6px;border-radius:var(--radius);cursor:pointer}.import-pages label:hover{background:var(--bg-hover)}.import-pages input{flex:0 0 auto;margin:0;align-self:center}.import-count,.import-fonts{color:var(--text-muted)}.import-count{margin-left:auto;flex:0 0 auto;font-variant-numeric:tabular-nums}.import-hint{flex:0 0 auto;color:var(--accent);font-size:11px}@media (max-width: 480px){.import-hint{flex-basis:100%;text-align:right}}.import-losses li{padding:2px 0;color:var(--text-muted)}.import-files li+li{margin-top:4px}.import-error{color:var(--danger)}.import-dialog button{padding:6px 12px;font:inherit;color:var(--text);background:none;border:1px solid var(--line-strong);border-radius:var(--radius);cursor:pointer}.import-dialog button:hover{background:var(--bg-hover)}.import-dialog button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.import-files button{display:block;width:100%;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.import-dialog .import-start{display:block;margin:0 0 16px auto;font-weight:600;color:var(--accent-text);background:var(--accent);border-color:var(--accent)}.import-dialog .import-start:hover{background:var(--accent);opacity:.88}.import-close{flex:0 0 auto;align-self:flex-end;margin:0 16px 16px}
