@font-face{font-family:Source Sans;src:url('assets/fonts/SourceSans3-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:Source Sans;src:url('assets/fonts/SourceSans3-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{color-scheme:dark;--bg:#0a0a0c;--panel:#131418;--raised:#1c1e24;--border:#2b2e36;--text:#e9ebf0;--muted:#a1a6b3;--accent:#2dd4bf;--workspace:#202229;--ruler:#17191f;--input:#0e1014;--danger:#fb7185;--hover:#242830;font-family:'Source Sans',system-ui,sans-serif;font-size:13px}
*{box-sizing:border-box}body{margin:0;overflow:hidden;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}button{color:inherit;cursor:pointer;background:none;border:1px solid transparent;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:30px;padding:5px 9px;transition:background .12s}button:hover{background:var(--hover)}button:disabled{opacity:.35;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.primary{background:var(--accent);color:#072f2b;font-weight:700}button.primary:hover{background:#5ae1d0}button.secondary{border-color:var(--border);background:var(--raised)}button.danger{color:var(--danger)}button.icon{width:32px;padding:5px}svg.icon{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}input,select,textarea{color:var(--text);background:var(--input);border:1px solid var(--border);border-radius:5px;padding:7px 9px;min-width:0}input[type=checkbox]{accent-color:var(--accent);width:15px;height:15px}input[type=color]{height:32px;padding:3px;width:100%}input[type=number]{appearance:textfield}input::-webkit-inner-spin-button{appearance:none}select{padding-right:24px}textarea{resize:vertical}label{color:var(--muted);font-size:12px;display:grid;gap:5px}.check{display:flex;align-items:center;gap:8px;color:var(--text)}.hint{color:var(--muted);font-size:12px;line-height:1.5}.muted{color:var(--muted)}.mono{font-variant-numeric:tabular-nums}.eyebrow{color:var(--muted);font-size:10px;letter-spacing:1.7px;font-weight:700;text-transform:uppercase}
#app{height:100dvh;display:grid;grid-template-rows:49px 49px minmax(0,1fr) 30px;min-width:740px}.topbar{display:flex;align-items:center;padding:0 16px;gap:16px;border-bottom:1px solid var(--border);background:var(--bg);z-index:5}.brand{display:flex;gap:10px;align-items:center;font-size:12px;font-weight:700;letter-spacing:1.3px;white-space:nowrap}.brand-mark{color:var(--accent);border:1px solid var(--accent);width:27px;height:27px;display:grid;place-content:center;font-size:11px;letter-spacing:-.5px}.topbar nav{display:flex;gap:0}.menu{position:relative}.menu summary{list-style:none;cursor:pointer;padding:7px 9px;color:var(--muted);border-radius:5px}.menu summary::-webkit-details-marker{display:none}.menu[open] summary,.menu summary:hover{color:var(--text);background:var(--hover)}.menu-popover{position:absolute;top:38px;left:0;background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:5px;min-width:235px;box-shadow:0 16px 50px #0007;z-index:50}.menu-popover button{display:flex;justify-content:space-between;text-align:left;width:100%;border-radius:4px;gap:25px;font-size:13px;white-space:nowrap}.menu-popover kbd{color:var(--muted);font-size:10px;font-family:inherit}.document-name{flex:1;text-align:center;overflow:hidden;text-overflow:ellipsis;color:var(--text);font-weight:700;font-size:13px;white-space:nowrap;min-width:90px}.save-state{color:var(--muted);font-size:11px;white-space:nowrap;display:flex;align-items:center;gap:6px}.save-dot{width:5px;height:5px;background:var(--accent);border-radius:50%}.top-actions{display:flex;gap:7px}.top-actions .primary{padding:7px 14px}.contextbar{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border);background:var(--panel);padding:7px 16px;height:49px}.context-label{display:flex;align-items:center;gap:8px;color:var(--muted);width:145px;font-size:12px;white-space:nowrap}.contextbar .field{display:flex;align-items:center;gap:6px}.contextbar .field label{font-size:10px}.contextbar input{width:67px;padding:5px 6px;height:29px;font-size:12px;font-variant-numeric:tabular-nums}.contextbar select{height:29px;padding:4px 25px 4px 8px;font-size:12px;max-width:150px}.divider{width:1px;height:24px;background:var(--border);margin:0 5px}.contextbar .grow{flex:1}.workspace-row{display:grid;grid-template-columns:49px 189px minmax(0,1fr) 294px;min-height:0}.toolbox{border-right:1px solid var(--border);background:var(--bg);padding:12px 6px;display:flex;flex-direction:column;align-items:center;gap:5px}.toolbox button{height:34px;width:34px;color:var(--muted);border-radius:6px}.toolbox button.active{background:#2dd4bf1c;color:var(--accent);border:1px solid #2dd4bf3c}.toolbox .separator{height:1px;width:24px;background:var(--border);margin:8px 0}.toolbox .bottom{margin-top:auto}.pages-sidebar{background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden}.panel-heading{display:flex;justify-content:space-between;align-items:center;padding:13px 14px;border-bottom:1px solid var(--border);font-weight:700;font-size:13px}.panel-heading .count{font-size:10px;color:var(--muted);border:1px solid var(--border);border-radius:4px;padding:1px 5px;margin-left:8px}.pages-list{padding:16px 12px;overflow:auto;flex:1;scrollbar-width:thin}.page-card{width:100%;display:flex;flex-direction:column;gap:9px;margin-bottom:16px;padding:9px 6px;border:1px solid transparent;border-radius:7px;color:var(--muted);position:relative}.page-card:hover{background:var(--raised)}.page-card.active{background:#2dd4bf09;border-color:#2dd4bf50;color:var(--text)}.page-thumbnail{height:120px;width:86px;background:#fff;color:#111;box-shadow:0 3px 10px #0004;position:relative;overflow:hidden;border:1px solid #ffffff40}.page-thumbnail canvas{display:block;width:100%;height:100%}.page-caption{display:flex;align-items:center;gap:7px;font-size:11px}.page-caption .master-label{font-size:9px;color:var(--accent);border:1px solid #2dd4bf40;border-radius:3px;padding:0 4px}.page-tools{padding:8px;display:flex;align-items:center;border-top:1px solid var(--border);justify-content:center;gap:2px}.sidebar-footer{padding:12px 16px;border-top:1px solid var(--border);font-size:11px;color:var(--muted);display:flex;align-items:center;justify-content:space-between}.viewport{position:relative;overflow:hidden;background:var(--workspace);touch-action:none;outline:none}.viewport canvas{position:absolute;inset:0;width:100%;height:100%}.viewport #overlay{cursor:default}.viewport[data-tool=text] #overlay{cursor:crosshair}.viewport[data-tool=hand] #overlay{cursor:grab}.viewport[data-tool=hand]:active #overlay{cursor:grabbing}.viewport[data-tool=shape] #overlay,.viewport[data-tool=image] #overlay,.viewport[data-tool=ellipse] #overlay,.viewport[data-tool=polygon] #overlay,.viewport[data-tool=line] #overlay,.viewport[data-tool=pen] #overlay{cursor:crosshair}.viewport[data-tool=zoom] #overlay{cursor:zoom-in}.canvas-label{position:absolute;bottom:18px;left:40px;color:#b6bbc9;font-size:10px;letter-spacing:1px;pointer-events:none;background:#15171e9c;border:1px solid #ffffff0a;border-radius:5px;padding:7px 10px;display:flex;gap:10px}.canvas-label span:first-child{color:var(--accent)}.dock{border-left:1px solid var(--border);background:var(--panel);min-width:0;display:flex;flex-direction:column}.dock-tabs{display:flex;flex-wrap:wrap;gap:2px;border-bottom:1px solid var(--border);padding:8px 9px}.dock-tabs button{min-height:27px;padding:5px 7px;font-size:11px;color:var(--muted)}.dock-tabs button.active{color:var(--accent);background:#2dd4bf12}.dock-content{overflow:auto;padding:16px;flex:1;scrollbar-width:thin}.panel-section{margin-bottom:22px}.section-title{font-weight:700;font-size:12px;margin:0 0 12px;display:flex;align-items:center;justify-content:space-between}.fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fields .wide{grid-column:1/-1}.fields input,.fields select{width:100%;font-size:12px}.fields .field-row{display:flex;gap:6px;align-items:center}.fields .field-row>*{flex:1}.color-field{display:flex;gap:7px;align-items:center}.color-chip{height:17px;width:17px;flex:none;display:inline-block;border:1px solid #ffffff44;border-radius:3px;background:var(--chip,#111)}.color-none{background:repeating-linear-gradient(135deg,#fb7185 0 1px,transparent 1px 7px)}.fill-preview{height:42px;border-radius:6px;border:1px solid var(--border);background:var(--chip)}.swatch-row,.style-row,.layer-row,.history-row,.link-row{display:flex;align-items:center;gap:9px;padding:9px 8px;border-bottom:1px solid var(--border);width:100%;text-align:left;justify-content:flex-start;font-size:12px}.swatch-row small,.style-row small,.link-row small{color:var(--muted);font-size:10px;margin-left:auto}.layer-row.active,.history-row.active,.style-row.active{background:#2dd4bf0e;color:var(--accent)}.layer-row .layer-name{flex:1}.object-tree{padding-left:17px;border-left:1px solid var(--border);margin-left:13px}.object-row{display:flex;align-items:center;justify-content:flex-start;gap:7px;width:100%;font-size:11px;color:var(--muted);text-align:left;padding:7px 6px}.object-row.active{color:var(--accent);background:#2dd4bf0a}.empty-state{color:var(--muted);text-align:center;line-height:1.7;font-size:12px;padding:25px 8px}.empty-state svg{width:28px;height:28px;margin-bottom:10px}.align-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.align-grid button{padding:5px;width:31px;background:var(--raised);border-color:var(--border)}.issue{padding:11px 9px;border:1px solid var(--border);border-radius:6px;margin-bottom:8px;display:flex;gap:9px;align-items:flex-start;text-align:left;justify-content:flex-start;width:100%}.issue .issue-icon{color:#fbbf24}.issue.error .issue-icon{color:var(--danger)}.issue-text{flex:1;display:grid;gap:4px;font-size:12px}.issue-text small{font-size:10px;color:var(--muted)}.ok-state{display:flex;align-items:center;gap:8px;color:var(--accent);padding:12px;background:#2dd4bf0d;border:1px solid #2dd4bf25;border-radius:6px}.panel-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:13px}.panel-actions button{font-size:11px}.statusbar{display:flex;align-items:center;background:var(--bg);border-top:1px solid var(--border);padding:0 10px;gap:13px;font-size:11px;color:var(--muted)}.statusbar button{font-size:11px;padding:2px 6px;min-height:23px}.statusbar .grow{flex:1}.statusbar .status-preflight{color:var(--accent)}.statusbar .status-preflight.warning{color:#fbbf24}.statusbar .status-preflight.error{color:var(--danger)}.statusbar input{width:58px;font-size:11px;padding:2px 5px;border:none;background:none;color:var(--text);text-align:center}.statusbar .zoom-controls{display:flex;align-items:center;gap:2px}.statusbar svg{width:13px;height:13px}.hidden-panels .workspace-row{grid-template-columns:49px 0 minmax(0,1fr) 0}.hidden-panels .pages-sidebar,.hidden-panels .dock{visibility:hidden}.hide-pages .workspace-row{grid-template-columns:49px 0 minmax(0,1fr) 294px}.hide-pages .pages-sidebar{visibility:hidden}
dialog{background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:12px;max-width:min(800px,95vw);width:550px;padding:0;box-shadow:0 20px 100px #0009;max-height:90vh}dialog::backdrop{background:#050609b3;backdrop-filter:blur(4px)}.dialog-heading{padding:19px 22px 14px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:10px}.dialog-heading h2{margin:0;font-size:19px;letter-spacing:-.2px}.dialog-body{padding:21px 22px;max-height:65vh;overflow:auto}.dialog-body .fields{gap:15px}.dialog-footer{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid var(--border);padding:13px 22px}.template-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 22px}.template-option{padding:11px 5px;border:1px solid var(--border);display:flex;flex-direction:column;font-size:11px;min-height:73px;gap:9px}.template-option.active{border-color:var(--accent);background:#2dd4bf12;color:var(--accent)}.template-option svg{width:24px;height:24px}.story-dialog{width:760px}.story-toolbar{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;align-items:center}.story-toolbar select{max-width:180px}.story-text{width:100%;height:350px;resize:vertical;font-size:16px;line-height:1.6;padding:16px;tab-size:4}.story-metrics{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:7px}.palette-search{padding:17px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px}.palette-search input{width:100%;background:transparent;border:none;font-size:17px;outline:none}.palette-results{padding:7px;max-height:400px;overflow:auto}.palette-results button{display:flex;justify-content:space-between;width:100%;text-align:left;font-size:13px;padding:9px 13px}.palette-results button.active{background:var(--hover);color:var(--accent)}.palette-results kbd{font-family:inherit;font-size:11px;color:var(--muted)}.context-menu{position:fixed;z-index:80;background:var(--panel);border:1px solid var(--border);border-radius:8px;box-shadow:0 10px 30px #0007;padding:5px;min-width:210px}.context-menu button{display:flex;justify-content:space-between;width:100%;text-align:left;font-size:12px}.context-menu kbd{font-size:10px;color:var(--muted)}#notifications{position:fixed;bottom:48px;left:50%;transform:translateX(-50%);z-index:100;pointer-events:none;display:grid;gap:6px}.notification{background:var(--raised);border:1px solid var(--border);border-radius:7px;padding:11px 18px;box-shadow:0 5px 25px #0007;font-size:13px;max-width:600px}.notification.error{border-color:#fb718577;color:var(--danger)}.progress{width:100%;height:6px;accent-color:var(--accent)}.recent-list{margin-top:18px;border-top:1px solid var(--border);padding-top:14px}.recent-list button{width:100%;display:flex;justify-content:space-between;padding:8px 5px}.light{color-scheme:light;--bg:#f8f9fb;--panel:#fff;--raised:#f0f2f5;--border:#d4d8e1;--text:#191d28;--muted:#555e70;--accent:#007c70;--workspace:#d9dce3;--ruler:#edf0f5;--input:#f8f9fc;--hover:#e9edf2;--danger:#be123c}.light .primary{color:#fff;background:#007c70}.light .canvas-label{color:#fff}.light .color-chip{border-color:#1114}.light .menu-popover,.light dialog{box-shadow:0 15px 60px #27304825}
@media(max-width:1150px){.workspace-row{grid-template-columns:46px 145px minmax(0,1fr) 260px}.context-label{width:104px}.topbar{gap:8px;padding:0 10px}.save-state{display:none}.brand{letter-spacing:.5px}.contextbar{gap:6px;padding:7px 10px}.contextbar input{width:58px}.dock-content{padding:13px}.hide-pages .workspace-row{grid-template-columns:46px 0 minmax(0,1fr) 260px}}
@media(max-width:900px){.workspace-row{grid-template-columns:44px 0 minmax(0,1fr) 248px}.pages-sidebar{visibility:hidden}.brand span:last-child{display:none}.topbar nav{gap:0}.context-label{display:none}.contextbar .optional{display:none}.top-actions button.secondary{display:none}.canvas-label{display:none}.document-name{font-size:11px}.statusbar{gap:6px}.statusbar .optional{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media(prefers-contrast:more){:root{--muted:#c8ccd7;--border:#666d7d}.light{--muted:#333c50;--border:#687387}button{border-color:var(--border)}}

.hidden-text { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 140px; overflow: auto; font-size: 12px; color: var(--muted); padding: 12px; border: 1px solid var(--border); border-radius: 8px; }
