:root{--bg: #09090b;--glass: rgba(21, 23, 28, .55);--glass-strong: rgba(25, 27, 33, .8);--hairline: rgba(245, 245, 241, .08);--hairline-strong: rgba(245, 245, 241, .16);--ink: #f5f5f1;--ink-dim: rgba(245, 245, 241, .44);--accent: #8ad8ff;--accent-2: #b9a3ff;--accent-soft: rgba(138, 216, 255, .22);--radius: 14px;--radius-sm: 9px;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Inter,system-ui,sans-serif;font-size:12px;color-scheme:dark}*{box-sizing:border-box;user-select:none;-webkit-user-select:none}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden}body{background:var(--bg);color:var(--ink)}.app{position:fixed;inset:0}.glass{position:relative;background:var(--glass);backdrop-filter:blur(26px) saturate(1.6);-webkit-backdrop-filter:blur(26px) saturate(1.6);border:1px solid var(--hairline);border-radius:var(--radius);box-shadow:0 14px 44px #00000080,inset 0 1px #ffffff0e,inset 0 0 0 .5px #ffffff05}.glass:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}.tip{position:fixed;z-index:200;transform:translate(-50%);pointer-events:none;padding:3.5px 8px;font-size:10.5px;letter-spacing:.02em;color:var(--ink);background:var(--glass-strong);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border:1px solid var(--hairline);border-radius:7px;box-shadow:0 6px 20px #00000073;white-space:nowrap;animation:tip-in .14s ease-out}@keyframes tip-in{0%{opacity:0;translate:0 2px}to{opacity:1;translate:0 0}}.mark-btn{position:absolute;top:14px;left:14px;width:40px;height:40px;display:grid;place-items:center;cursor:pointer;z-index:21;padding:0;transition:border-color .15s}.mark-btn img{width:22px;height:22px;display:block}.mark-btn:hover{border-color:var(--hairline-strong)}.canvas-wrap{position:absolute;inset:0;overflow:hidden;background:radial-gradient(1200px 800px at 70% -10%,rgba(110,168,255,.05),transparent 60%),var(--bg);touch-action:none}.canvas-wrap.cur-grab{cursor:grab}.canvas-wrap.cur-cross{cursor:crosshair}.artboard{position:absolute;left:0;top:0;transform-origin:0 0}.checker{position:absolute;inset:0;background:conic-gradient(rgba(255,255,255,.055) 90deg,transparent 90deg 180deg,rgba(255,255,255,.055) 180deg 270deg,transparent 270deg) 0 0 / 24px 24px;border-radius:1px;outline:1px solid var(--hairline-strong)}.overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.overlay .sel-handle,.overlay .pen-pt{pointer-events:all}.sel-box{fill:none;stroke:var(--accent);stroke-width:1}.sel-handle{fill:#fff;stroke:var(--accent);stroke-width:1;rx:2}.sel-handle.rotate{cursor:grab}.marquee{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1;opacity:.5}.pen-pt{fill:#fff;stroke:var(--accent);stroke-width:1.2;cursor:pointer}.pen-preview{fill:none;stroke:var(--accent);stroke-width:1;stroke-dasharray:4 3;opacity:.8}.text-editor{position:fixed;z-index:50;padding:6px 10px;font-size:13px;color:var(--ink);outline:none;min-width:160px}.toolbar{position:absolute;top:14px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:2px;padding:5px;z-index:20}.tb-group{display:flex;gap:2px}.tb-sep{width:1px;height:18px;background:var(--hairline-strong);margin:0 6px}.ibtn{appearance:none;border:0;background:transparent;width:30px;height:30px;display:grid;place-items:center;border-radius:var(--radius-sm);color:var(--ink-dim);cursor:pointer;transition:background .12s,color .12s}.ibtn:hover{background:#ffffff12;color:var(--ink)}.ibtn.active{background:var(--accent-soft);color:var(--accent)}.ibtn.danger:hover{color:#ff7878}.layers{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:196px;max-height:64vh;display:flex;flex-direction:column;z-index:18;overflow:hidden}.layers-list{overflow-y:auto;padding:5px}.layer-row{display:flex;align-items:center;gap:7px;height:27px;padding:0 6px;border-radius:var(--radius-sm);color:var(--ink-dim);cursor:default;font-size:11.5px}.layer-row:hover{background:#ffffff0d;color:var(--ink)}.layer-row.selected{background:var(--accent-soft);color:var(--ink)}.layer-row.hidden-node{opacity:.38}.layer-icon{display:grid;place-items:center;opacity:.75;flex:0 0 auto}.layer-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-rename{flex:1;min-width:0;background:#0000004d;border:1px solid var(--hairline-strong);border-radius:5px;color:var(--ink);font-size:11.5px;padding:2px 5px;outline:none}.layer-acts{display:none;gap:1px}.layer-row:hover .layer-acts,.layer-row.selected .layer-acts{display:flex}.layers-foot{display:flex;gap:2px;padding:4px 7px;border-top:1px solid var(--hairline)}.micro{appearance:none;border:0;background:transparent;width:22px;height:22px;display:grid;place-items:center;border-radius:6px;color:var(--ink-dim);cursor:pointer;font-size:12px;padding:0}.micro:hover{background:#ffffff14;color:var(--ink)}.micro.on,.micro.has{color:var(--accent)}.micro svg{width:13px;height:13px}.inspector{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:252px;max-height:78vh;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:7px;z-index:18}.row{display:flex;align-items:center;gap:6px}.hr{height:1px;background:var(--hairline);margin:2px -10px}.field{background:#00000052;border:1px solid var(--hairline);border-radius:7px;color:var(--ink);font:inherit;padding:4px 7px;min-width:0;outline:none;transition:border-color .12s}.field:focus{border-color:var(--accent)}.field.num{width:62px;text-align:center}.field.num::-webkit-inner-spin-button{display:none}.field.sel{flex:1;appearance:none;padding-right:20px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' fill='none'%3E%3Cpath d='m1 1 3 3 3-3' stroke='%23f5f5f1' stroke-opacity='.45' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 7px center}.field.sel.tiny{flex:0 0 66px}.fld{position:relative;display:inline-flex}.fld-tag{position:absolute;left:8px;top:50%;transform:translateY(-50%);font-size:9px;letter-spacing:.04em;color:var(--ink-dim);pointer-events:none;font-family:SF Mono,ui-monospace,monospace;z-index:1}.fld.tagged .field.num{padding-left:18px;text-align:right;padding-right:9px}.slider-val{width:24px;flex:0 0 auto;text-align:right;font-size:9.5px;font-family:SF Mono,ui-monospace,monospace;color:var(--ink-dim)}.field.hex{width:86px;font-family:SF Mono,ui-monospace,monospace;font-size:11px}.field.grow{flex:1}.tiny-num{width:46px!important}.dim{color:var(--ink-dim)}.grow{flex:1}.slider{appearance:none;height:3px;border-radius:2px;background:#ffffff24;outline:none;min-width:0}.slider::-webkit-slider-thumb{appearance:none;width:13px;height:13px;border-radius:50%;background:#fff;border:1px solid rgba(0,0,0,.25);box-shadow:0 1px 4px #0006;cursor:pointer}.mini-ico{width:18px;height:16px;display:grid;place-items:center;color:var(--ink-dim);font-size:9.5px;letter-spacing:.02em;flex:0 0 auto}.mini-ico svg{width:13px;height:13px}.shadow-toggle svg{width:13px;height:13px}.paint-ctl{position:relative}.swatch{appearance:none;width:26px;height:26px;border-radius:7px;border:1px solid var(--hairline-strong);cursor:pointer;background:conic-gradient(rgba(255,255,255,.18) 90deg,transparent 90deg 180deg,rgba(255,255,255,.18) 180deg 270deg,transparent 270deg) 0 0 / 10px 10px}.swatch.none{position:relative;overflow:hidden}.swatch.none:after{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:1.5px;background:#f55;transform:rotate(-45deg)}.popover{position:absolute;z-index:40;padding:10px;background:var(--glass-strong)}.paint-popover{position:fixed;z-index:60;width:252px;display:flex;flex-direction:column;gap:8px;max-height:calc(100vh - 16px);overflow-y:auto}.doc-popover{position:absolute;top:56px;left:50%;transform:translate(-50%);width:230px;display:flex;flex-direction:column;gap:8px;z-index:30}.seg{display:flex;gap:3px;background:#0000004d;padding:3px;border-radius:8px}.seg button{appearance:none;border:0;flex:1;height:24px;border-radius:6px;background:transparent;cursor:pointer;display:grid;place-items:center;color:var(--ink-dim)}.seg button.on{background:#ffffff1f;color:var(--ink)}.none-chip,.solid-chip,.grad-chip{width:14px;height:14px;border-radius:4px;display:block}.none-chip{border:1px solid var(--ink-dim);position:relative;overflow:hidden}.none-chip:after{content:"";position:absolute;border-left:1.5px solid #ff5555;transform:rotate(-45deg);inset:-2px -2px -2px 50%}.solid-chip{background:#f5f5f1}.action{appearance:none;border:1px solid var(--hairline);background:#ffffff0d;border-radius:8px;color:var(--ink);flex:1;height:28px;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;font:inherit;font-size:11px;letter-spacing:.02em}.action:hover{background:#ffffff1a}.action svg{width:13px;height:13px}.cpicker{display:flex;flex-direction:column;gap:8px}.cp-area{position:relative;height:140px;border-radius:9px;overflow:hidden;border:1px solid var(--hairline);background:conic-gradient(rgba(255,255,255,.1) 90deg,transparent 90deg 180deg,rgba(255,255,255,.1) 180deg 270deg,transparent 270deg) 0 0 / 12px 12px,#111;cursor:crosshair}.cp-area canvas{width:100%;height:100%;display:block}.cp-cursor{position:absolute;width:13px;height:13px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #00000080,0 1px 5px #0006;transform:translate(-50%,-50%);pointer-events:none}.cp-rail{position:relative;height:12px;border-radius:6px;overflow:hidden;border:1px solid var(--hairline);cursor:ew-resize}.cp-rail canvas{width:100%;height:100%;display:block}.cp-rail.alpha{background:conic-gradient(rgba(255,255,255,.2) 90deg,transparent 90deg 180deg,rgba(255,255,255,.2) 180deg 270deg,transparent 270deg) 0 0 / 10px 10px,#111}.cp-alpha-grad{position:absolute;inset:0}.cp-thumb{position:absolute;top:0;bottom:0;width:4px;background:#fff;border-radius:2px;transform:translate(-50%);box-shadow:0 0 0 1px #00000073;pointer-events:none}.cp-foot{display:flex;align-items:center;gap:6px}.cp-oklch{flex:1;font-family:SF Mono,ui-monospace,monospace;font-size:9.5px;color:var(--ink-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.grad-editor{display:flex;flex-direction:column;gap:8px}.grad-rail{position:relative;height:22px;border-radius:7px;border:1px solid var(--hairline-strong);cursor:copy}.grad-stop{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #0000008c;transform:translate(-50%,-50%);cursor:ew-resize}.grad-stop.on{box-shadow:0 0 0 2px var(--accent)}.dither-row{gap:8px}.timeline{position:absolute;left:50%;bottom:14px;transform:translate(-50%);width:min(820px,calc(100vw - 460px));z-index:18;padding:8px 10px;display:flex;flex-direction:column;gap:6px}.tl-head{display:flex;align-items:center;gap:8px}.tl-time{font-family:SF Mono,ui-monospace,monospace;font-size:10.5px;color:var(--ink-dim);width:44px}.tl-props{display:flex;gap:2px;margin-left:auto}.tl-props .prop{font-family:SF Mono,ui-monospace,monospace;font-size:10px;width:19px;height:19px}.tl-body{display:flex;flex-direction:column;gap:3px}.tl-rail{position:relative;height:16px;border-radius:5px;background:#0000004d;cursor:ew-resize}.tl-tick{position:absolute;top:4px;bottom:4px;width:1px;background:var(--hairline-strong)}.tl-playhead{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--accent);border-radius:1px;box-shadow:0 0 8px var(--accent-soft);pointer-events:none;z-index:2}.tl-row{display:flex;align-items:center;gap:8px;height:18px}.tl-row-name{width:90px;flex:0 0 auto;font-size:10.5px;color:var(--ink-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tl-row-track{position:relative;flex:1;height:100%;border-radius:4px;background:#ffffff0a}.tl-smil{position:absolute;inset:3px;border-radius:3px;background:repeating-linear-gradient(45deg,var(--accent-soft) 0 6px,transparent 6px 12px);opacity:.7}.tl-key{position:absolute;top:50%;width:9px;height:9px;background:#fff;border:1px solid var(--accent);transform:translate(-50%,-50%) rotate(45deg);border-radius:2px;cursor:ew-resize;z-index:1}.tl-key:hover{background:var(--accent)}.gallery-veil{position:fixed;inset:0;z-index:100;background:#0505078c;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:grid;place-items:center;animation:tip-in .16s ease-out}.gallery{width:min(1060px,calc(100vw - 56px));height:min(680px,calc(100vh - 56px));display:flex;overflow:hidden;background:var(--glass-strong)}.gal-rail{flex:0 0 148px;border-right:1px solid var(--hairline);padding:10px 7px;display:flex;flex-direction:column;gap:2px;overflow-y:auto}.gal-rail-gap{flex:1}.gal-folder{appearance:none;border:0;background:transparent;display:flex;align-items:center;gap:8px;height:28px;padding:0 9px;border-radius:var(--radius-sm);color:var(--ink-dim);font:inherit;font-size:11.5px;cursor:pointer;text-align:left}.gal-folder svg{width:13px;height:13px;flex:0 0 auto}.gal-folder span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gal-folder:hover{background:#ffffff0d;color:var(--ink)}.gal-folder.on{background:var(--accent-soft);color:var(--ink)}.gal-folder.add{color:var(--ink-dim);opacity:.7}.gal-main{flex:1;display:flex;flex-direction:column;min-width:0}.gal-head{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--hairline)}.gal-head .micro{width:26px;height:26px}.gal-grid{flex:1;overflow-y:auto;padding:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px;align-content:start}.gal-card{border:1px solid var(--hairline);border-radius:11px;overflow:hidden;background:#00000040;transition:border-color .14s,translate .14s}.gal-card:hover{border-color:var(--hairline-strong);translate:0 -1px}.gal-thumb{aspect-ratio:4 / 3;display:grid;place-items:center;cursor:pointer;background:conic-gradient(rgba(255,255,255,.05) 90deg,transparent 90deg 180deg,rgba(255,255,255,.05) 180deg 270deg,transparent 270deg) 0 0 / 16px 16px;overflow:hidden}.gal-thumb img{max-width:84%;max-height:84%}.gal-meta{display:flex;align-items:baseline;gap:6px;padding:7px 9px 5px}.gal-name{flex:1;font-size:11.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gal-dim{font-size:9.5px;color:var(--ink-dim);font-family:SF Mono,ui-monospace,monospace}.gal-rename{flex:1;min-width:0;background:#00000059;border:1px solid var(--hairline-strong);border-radius:5px;color:var(--ink);font-size:11.5px;padding:1px 5px;outline:none}.gal-acts{display:flex;align-items:center;gap:1px;padding:0 6px 7px;opacity:0;transition:opacity .14s}.gal-card:hover .gal-acts{opacity:1}.gal-move-wrap{position:relative;display:grid;place-items:center;width:22px;height:22px;border-radius:6px;color:var(--ink-dim)}.gal-move-wrap:hover{background:#ffffff14;color:var(--ink)}.gal-move-wrap svg{width:13px;height:13px}.gal-move{position:absolute;inset:0;appearance:none;opacity:0;border:0;cursor:pointer}.tl-dur{width:56px!important}.gal-card.lib .gal-meta{padding-bottom:9px}.gal-empty{grid-column:1 / -1;display:grid;place-items:center;min-height:180px;color:var(--ink-dim);font-size:12px;letter-spacing:.02em}.micro.danger:hover{color:#ff8585}.cap-notice{position:absolute;left:14px;bottom:14px;z-index:30;max-width:300px;padding:10px 12px;background:var(--glass-strong);display:grid;grid-template-columns:1fr auto;gap:2px 8px;animation:tip-in .18s ease-out}.cap-title{font-size:11px;letter-spacing:.03em;color:var(--ink)}.cap-notice ul{grid-column:1;margin:4px 0 0;padding:0 0 0 14px;font-size:10.5px;line-height:1.6;color:var(--ink-dim)}.cap-notice .micro{grid-column:2;grid-row:1}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:4px}::-webkit-scrollbar-track{background:transparent}