:root{font-family:Inter,system-ui,Arial,sans-serif;color:#f2f2f2;background:#111}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:1px solid #444;border-radius:5px;background:#292929;color:#eee;padding:9px 12px}button:hover{border-color:#ff5a00}.shell{min-height:100vh}header{height:64px;display:flex;align-items:center;gap:22px;padding:0 22px;background:#191919;border-bottom:1px solid #303030}header span{font-size:11px;color:#aaa}header b{margin:auto;font-size:12px;color:#ff5a00}header button{background:#ff5a00;color:#151515;border:0;font-weight:700}.logo{font-size:28px}main{display:grid;grid-template-columns:315px minmax(350px,1fr) 290px;min-height:calc(100vh - 64px)}aside{padding:20px;background:#191919}.library{border-right:1px solid #303030}.properties{border-left:1px solid #303030}h2{font-size:16px;margin:4px 0 18px}p{font-size:12px;color:#aaa;line-height:1.6}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.tile{padding:8px 5px;background:#242424;display:flex;flex-direction:column;align-items:center;gap:5px}.tile svg{width:68px;height:68px}.tile span{font-size:11px}.tile.selected{border-color:#ff5a00;background:#3a271e}.workspace{background:#232323;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.workspace-title{align-self:start;color:#aaa;font-size:12px}.artboard{width:min(100%,70vh,800px);aspect-ratio:1;box-shadow:0 16px 50px #0006}.artboard svg{display:block;width:100%;height:100%}.footer-controls{width:100%;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#999}.properties label{display:block;font-size:12px;margin:18px 0;color:#bbb}.properties output{float:right;color:#fff}.properties input[type=range]{display:block;width:100%;accent-color:#ff5a00;margin-top:12px}.properties input[type=color]{display:block;margin-top:10px}.seed-row{display:flex;gap:6px}.seed-row input{min-width:0;width:100%;background:#262626;border:1px solid #444;color:#fff;padding:8px}.note{margin-top:30px}@media(max-width:980px){main{grid-template-columns:1fr}.library,.properties{border:0}.tiles{grid-template-columns:repeat(6,1fr)}header{gap:8px}header span{display:none}}@media(max-width:550px){.tiles{grid-template-columns:repeat(3,1fr)}header b{font-size:10px}}.layers-panel{border-bottom:1px solid #444;padding-bottom:18px;margin-bottom:22px}.layers-head{display:flex;align-items:center;flex-wrap:wrap;gap:5px}.layers-head h2{width:100%}.layers-head button{font-size:11px}.layer-item{display:flex;gap:3px;align-items:center;margin:7px 0;padding:4px;border:1px solid #383838;border-radius:5px}.layer-item.current{border-color:#ff5a00}.layer-item button{font-size:11px;padding:5px}.layer-name{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-properties input:not([type=range]),.layer-properties select{display:block;width:100%;background:#222;border:1px solid #555;color:#fff;padding:6px;margin-top:5px}.layer-properties input[type=range]{width:100%;accent-color:#ff5a00}.layer-properties label{margin:10px 0}@media(max-width:550px){.layer-item{gap:2px}.layer-item button{padding:7px 5px}.workspace{padding:12px}}.view-switch{display:flex;gap:8px;align-self:start}.scene3d{width:100%;max-width:850px}.scene3d-canvas{width:100%;height:min(55vh,550px);min-height:300px;border:1px solid #444;border-radius:8px;overflow:hidden}.scene3d-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:10px 0}.scene3d-bar label{font-size:12px}.scene3d-bar input[type=file]{display:block;max-width:180px;font-size:11px}.scene3d-bar select{background:#242424;color:#eee;padding:8px}.scene3d p{font-size:12px}.pattern-controls{border:0;padding:0;margin:0;min-width:0}.pattern-controls:disabled{opacity:.45}.pattern-controls:disabled button{cursor:not-allowed}.timeline-panel{width:100%;border:1px solid #444;border-radius:8px;padding:12px;background:#1b1b1b}.timeline-panel>input[type=range]{width:100%;accent-color:#ff5a00}.timeline-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:7px 0;font-size:12px}.timeline-top label{display:flex;align-items:center;gap:5px}.timeline-top input[type=number]{width:52px;background:#292929;border:1px solid #555;color:#fff;padding:4px}.timeline-top button{font-size:12px}.project-import{display:inline-flex;align-items:center;cursor:pointer;border:1px solid #555;border-radius:5px;padding:6px 9px;font-size:12px}.project-import input{display:none}.variations-panel{border-top:1px solid #444;margin-top:14px;padding-top:12px}.variation-item{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:6px 0}.variation-item button:first-child{flex:1;text-align:left}.tile:disabled{opacity:.4;cursor:not-allowed}.artboard{position:relative;overflow:hidden;-webkit-user-select:none;user-select:none}.artboard-base,.artboard-ink{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.artboard-base svg{display:block;width:100%;height:100%}.artboard-ink{z-index:1}.konva-overlay{position:absolute;inset:0;z-index:2;width:100%;height:100%}.konva-overlay canvas{display:block}.shell.hide-library main{grid-template-columns:minmax(0,1fr) 290px}.shell.hide-properties main{grid-template-columns:315px minmax(0,1fr)}.shell.hide-library.hide-properties main{grid-template-columns:minmax(0,1fr)}.focus-mode .workspace{min-height:calc(100vh - 64px)}.focus-mode .artboard{width:min(100%,82vh,1000px)}.view-switch{flex-wrap:wrap}.view-switch button{font-size:12px;padding:7px 10px}.animation-presets{border-bottom:1px solid #444;margin-bottom:22px;padding-bottom:18px}.animation-presets label{margin:10px 0}.animation-presets select{display:block;width:100%;padding:8px;background:#242424;color:#fff;border:1px solid #555}.animation-presets button{font-size:11px;margin:5px 5px 5px 0}@media(max-width:980px){.shell.hide-library main,.shell.hide-properties main,.shell.hide-library.hide-properties main{grid-template-columns:minmax(0,1fr)}}.layer-properties textarea{display:block;width:100%;resize:vertical;min-height:72px;background:#222;border:1px solid #555;border-radius:5px;color:#fff;padding:8px;margin-top:5px;font:inherit}.layer-properties input[type=color]{height:38px;width:100%;padding:3px;background:#222;border:1px solid #555}.konva-text-overlay{position:absolute;inset:0;z-index:1;width:100%;height:100%;touch-action:none}.konva-text-overlay canvas{display:block}.overlay-3d{position:absolute;inset:0;z-index:1;pointer-events:none;width:100%;height:100%}.overlay-3d canvas{display:block;width:100%;height:100%}.konva-text-overlay{z-index:2}.konva-overlay{z-index:3}.overlay-controls{border-bottom:1px solid #444;padding-bottom:16px;margin-bottom:18px}.overlay-controls select{display:block;width:100%;background:#242424;color:#fff;padding:8px;border:1px solid #555}.overlay-controls label{margin:12px 0}.video-export{border:1px solid #444;border-radius:8px;padding:14px;margin:18px 0;display:flex;flex-wrap:wrap;align-items:center;gap:12px}.video-export h2{font-size:15px;margin:0}.video-export select{background:#242424;color:#fff;padding:7px;border:1px solid #555}.video-export .note{flex-basis:100%;margin:0}.lab-menubar{height:38px;background:#242426;display:flex;align-items:center;gap:2px;padding:0 12px;border-bottom:1px solid #3b3b3e;position:relative;z-index:30;font-size:12px}.lab-menubar>strong{font-size:18px;color:#ff6900;margin-right:18px}.lab-menubar details{position:relative}.lab-menubar summary{cursor:pointer;list-style:none;padding:9px 10px;border-radius:3px}.lab-menubar summary::-webkit-details-marker{display:none}.lab-menubar details[open]>summary,.lab-menubar summary:hover{background:#3c3c40}.lab-menu-popover{position:absolute;top:100%;left:0;min-width:225px;padding:8px;background:#29292c;border:1px solid #555;box-shadow:0 12px 28px #0009;display:flex;flex-direction:column;gap:4px;z-index:50}.lab-menu-popover button{text-align:left;background:transparent;border:0;font-size:12px;padding:9px}.lab-menu-popover button:hover{background:#46464a}.lab-menu-popover small{color:#bbb;padding:6px}.lab-menubar-spacer{flex:1}.lab-menubar-label{color:#ff6900;font-size:10px}.shell>header{height:auto;min-height:44px;padding:5px 12px;gap:9px;flex-wrap:wrap}.shell>header .logo,.shell>header>span,.shell>header>b{display:none}.shell>header button{padding:6px 10px;font-size:12px}.shell>header label{font-size:11px}.shell main{grid-template-columns:48px minmax(150px,220px) minmax(0,1fr) minmax(210px,260px);min-height:calc(100vh - 82px)}.lab-toolrail{background:#252528;border-right:1px solid #404044;display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 4px}.lab-toolrail button{width:38px;height:38px;padding:0;font-size:20px;background:transparent;border:1px solid transparent}.lab-toolrail button:hover,.lab-toolrail button[aria-pressed=true]{border-color:#ff6900;background:#463125}.shell .library{padding:12px;overflow:auto;min-width:0}.shell .tiles{gap:5px}.shell .tile{padding:5px 2px}.shell .tile svg{width:48px;height:48px}.shell .properties{padding:13px;min-width:0;overflow:auto;max-height:calc(100vh - 82px)}.shell .workspace{padding:12px;gap:12px;justify-content:flex-start;min-width:0}.shell .artboard{width:min(100%,75vh,960px)}.shell.hide-library main{grid-template-columns:48px minmax(0,1fr) minmax(210px,260px)}.shell.hide-properties main{grid-template-columns:48px minmax(150px,220px) minmax(0,1fr)}.shell.hide-library.hide-properties main{grid-template-columns:48px minmax(0,1fr)}.shell.focus-mode main{grid-template-columns:48px minmax(0,1fr)}.shell .view-switch{gap:5px}.shell .view-switch button{padding:6px 8px;font-size:11px}@media(max-width:1050px){.shell main,.shell.hide-library main,.shell.hide-properties main,.shell.hide-library.hide-properties main{grid-template-columns:48px minmax(0,1fr)}.shell .library,.shell .properties{grid-column:2;max-height:none}.shell .workspace{grid-column:2;grid-row:1}.lab-toolrail{grid-column:1;grid-row:1 / span 3}.lab-menubar{overflow-x:auto}.lab-menubar-label{display:none}}.lab-menubar .lab-brand-logo{width:30px;height:30px;object-fit:contain;flex:none;margin-right:3px}.lab-author-credit{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;padding:8px 12px;background:#222225;border-top:1px solid #444;color:#aaa;font-size:10px;text-align:center}.lab-author-credit span:first-child{color:#ff6900}@media(max-width:650px){.lab-author-credit{gap:4px;flex-direction:column}.lab-menubar .lab-brand-logo{width:25px;height:25px}}
