:root{--cx-canvas:#f8fbff;--cx-surface:#fff;--cx-surface-soft:#eef6fb;--cx-text:#07111f;--cx-text-muted:#53657b;--cx-brand-teal:#00a7a7;--cx-brand-blue:#276ef1;--cx-action:#215ed6;--cx-action-text:#fff;--cx-focus:#276ef1;--cx-border:#dce4ee;--cx-border-control:#7a899c;--cx-selected:#eaf2ff;--cx-notice-bg:#fff8e8;--cx-notice-text:#963c12;--cx-notice-border:#e0bd6d;--cx-danger:#b42318;--cx-code-bg:#101c2b;--cx-code-text:#d2e3f7;--cx-space-1:4px;--cx-space-2:8px;--cx-space-3:12px;--cx-space-4:16px;--cx-space-5:20px;--cx-space-6:24px;--cx-space-8:32px;--cx-radius-control:8px;--cx-radius-panel:8px;--cx-control-height:36px;--cx-row-height:40px;--cx-sidebar-width:224px;--cx-font-body:14px;--cx-font-small:12px;--cx-font-title:28px;--cx-icon-size:18px;--cx-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--cx-breakpoint-mobile:640px;--cx-breakpoint-tablet:1024px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark]{--cx-canvas:#101824;--cx-surface:#172333;--cx-surface-soft:#1d2c3e;--cx-text:#eff5fd;--cx-text-muted:#b7c6d9;--cx-brand-teal:#00a7a7;--cx-brand-blue:#276ef1;--cx-action:#9bc0ff;--cx-action-text:#0b2348;--cx-focus:#8fb9ff;--cx-border:#35465b;--cx-border-control:#8094ad;--cx-selected:#243c60;--cx-notice-bg:#32271b;--cx-notice-text:#ffd799;--cx-notice-border:#a27d42;--cx-danger:#ffb4aa;--cx-code-bg:#0d1520;--cx-code-text:#d2e3f7;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root{--cx-topbar-height:48px}cx-topbar:not(:defined){min-height:var(--cx-topbar-height);display:block}cx-topbar>[slot=signout]{align-items:center;margin:0;display:flex}cx-topbar>[slot=signout] button,cx-topbar>[slot=signout] a{min-height:var(--cx-control-height);min-width:36px;padding:0 var(--cx-space-3);border:1px solid var(--cx-border-control);border-radius:var(--cx-radius-control);background:var(--cx-surface);color:var(--cx-text);font:inherit;font-family:var(--cx-font-family);font-size:var(--cx-font-body);white-space:nowrap;cursor:pointer;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}cx-topbar>[slot=signout] button:hover,cx-topbar>[slot=signout] a:hover{background:var(--cx-surface-soft)}cx-topbar>[slot=signout] button:focus-visible,cx-topbar>[slot=signout] a:focus-visible{outline:2px solid var(--cx-focus);outline-offset:2px}@media (width<=639.98px){cx-topbar>[slot=signout] button,cx-topbar>[slot=signout] a{padding:0 var(--cx-space-2)}}*{box-sizing:border-box}body{background:var(--cx-canvas);color:var(--cx-text);font-family:var(--cx-font-family);font-size:var(--cx-font-body);margin:0}h1{margin:var(--cx-space-4) 0 var(--cx-space-2);font-size:20px}h2{font-size:var(--cx-font-body);margin:var(--cx-space-3) 0 var(--cx-space-2)}button,.button,select,input,textarea{font:inherit;color:var(--cx-text);background:var(--cx-surface);border:1px solid var(--cx-border-control);border-radius:var(--cx-radius-control);min-height:var(--cx-control-height);padding:0 var(--cx-space-3)}textarea{padding:var(--cx-space-2);width:100%;min-height:80px}button,.button{cursor:pointer;align-items:center;gap:var(--cx-space-2);display:inline-flex}button:disabled{opacity:.5;cursor:not-allowed}button[aria-pressed=true]{background:var(--cx-selected);border-color:var(--cx-action)}button.primary{background:var(--cx-action);color:var(--cx-action-text);border-color:var(--cx-action)}button.danger{color:var(--cx-danger);border-color:var(--cx-danger)}button.link{color:var(--cx-action);background:0 0;border:0;min-height:0;padding:0;text-decoration:underline}:focus-visible{outline:3px solid var(--cx-focus);outline-offset:2px}label{gap:var(--cx-space-1);margin-bottom:var(--cx-space-3);font-size:var(--cx-font-small);color:var(--cx-text-muted);flex-direction:column;display:flex}label>input,label>select,label>textarea{color:var(--cx-text);font-size:var(--cx-font-body)}.hint{color:var(--cx-text-muted);font-size:var(--cx-font-small)}.center{text-align:center;margin-top:20vh}.row{gap:var(--cx-space-2);flex-wrap:wrap;align-items:center;display:flex}.status{margin:var(--cx-space-2) var(--cx-space-4);padding:var(--cx-space-3);border-radius:var(--cx-radius-panel);border:1px solid var(--cx-border);background:var(--cx-surface)}.status-error{border-color:var(--cx-danger);color:var(--cx-danger)}.status-ok{border-color:var(--cx-brand-teal)}.status-busy{border-color:var(--cx-border)}.status ul{margin:var(--cx-space-2) 0 0;padding-left:var(--cx-space-5);color:var(--cx-text)}.signin{max-width:560px;padding:0 var(--cx-space-4);margin:10vh auto}.user-list{gap:var(--cx-space-2);padding:0;list-style:none;display:grid}.user-list button{justify-content:space-between;width:100%;min-height:48px}.topbar{align-items:center;gap:var(--cx-space-4);height:var(--cx-topbar-height,56px);padding:0 var(--cx-space-4);background:var(--cx-surface);border-bottom:1px solid var(--cx-border);display:flex}.topbar .hint{margin-left:auto}.home section{padding:0 var(--cx-space-4)}.section-head{justify-content:space-between;align-items:center;display:flex}.cards{gap:var(--cx-space-3);grid-template-columns:repeat(auto-fill,minmax(240px,1fr));padding:0;list-style:none;display:grid}.card{background:var(--cx-surface);border:1px solid var(--cx-border);border-radius:var(--cx-radius-panel);padding:var(--cx-space-4)}.card h2{margin-top:0}.editor{flex-direction:column;height:100vh;display:flex}.toolbar{align-items:center;gap:var(--cx-space-2);padding:var(--cx-space-2) var(--cx-space-4);background:var(--cx-surface);border-bottom:1px solid var(--cx-border);flex-wrap:wrap;display:flex}.toolbar .title{font-weight:600}.toolbar .mode{color:var(--cx-text-muted);font-size:var(--cx-font-small)}.toolbar .spacer{flex:1}.editor-body{flex:1;grid-template-columns:200px 1fr 280px;min-height:0;display:grid}.panel{background:var(--cx-surface);border-right:1px solid var(--cx-border);padding:var(--cx-space-3);overflow:auto}.inspector{border-right:0;border-left:1px solid var(--cx-border)}.stage-wrap{padding:var(--cx-space-4);background:var(--cx-surface-soft);overflow:auto}.canvas-holder{justify-content:center;width:100%;display:flex}.canvas-holder .konvajs-content{background:var(--cx-surface);box-shadow:0 1px 4px #07111f26}.pages{gap:var(--cx-space-1);flex-wrap:wrap;display:flex}.pages button{justify-content:center;min-width:36px}.layer-list{gap:var(--cx-space-1);margin:0;padding:0;list-style:none;display:grid}.layer-list button{justify-content:space-between;width:100%}.layer-list small{color:var(--cx-text-muted)}.thumb{border-radius:var(--cx-radius-control);border:1px solid var(--cx-border);max-width:100%;margin-bottom:var(--cx-space-2)}.color-field{margin-bottom:var(--cx-space-3);font-size:var(--cx-font-small);color:var(--cx-text-muted)}.swatches{gap:var(--cx-space-1);margin-top:var(--cx-space-1);flex-wrap:wrap;display:flex}.swatch{border:1px solid var(--cx-border-control);width:32px;min-height:32px;padding:0}.swatches input[type=color]{width:44px;padding:2px}.locks{border:1px solid var(--cx-border);border-radius:var(--cx-radius-panel);padding:var(--cx-space-3);margin:var(--cx-space-3) 0}.picker{border:1px solid var(--cx-border);border-radius:var(--cx-radius-panel);padding:var(--cx-space-4);background:var(--cx-surface);width:min(720px,92vw);max-height:85vh;color:var(--cx-text);overflow:auto}.picker header{justify-content:space-between;align-items:center;display:flex}.picker .grid{gap:var(--cx-space-2);grid-template-columns:repeat(auto-fill,minmax(140px,1fr));padding:0;list-style:none;display:grid}.picker .grid button{width:100%;padding:var(--cx-space-2);flex-direction:column;align-items:stretch}.picker .grid img{aspect-ratio:1;object-fit:cover;border-radius:var(--cx-radius-control);width:100%}@media (width<=767px){.editor-body{grid-template-columns:1fr;grid-auto-rows:min-content;overflow:auto}.panel{border:0;border-bottom:1px solid var(--cx-border)}.layers{order:2}.stage-wrap{order:1}.inspector{order:3}.editor{height:auto;min-height:100vh}}@media (width>=768px) and (width<=1100px){.editor-body{grid-template-columns:160px 1fr 240px}}.inspector select,.inspector input:not([type=color]),.inspector textarea{width:100%;min-width:0}.inspector fieldset{min-width:0}label.inline{flex-direction:row;align-items:center;margin:0}.status a{margin-left:var(--cx-space-2);color:var(--cx-action)}
