:root{--bg: #120b24;--panel: rgba(22, 17, 45, .9);--panel-soft: rgba(255, 255, 255, .075);--panel-border: rgba(255, 255, 255, .16);--text: #fff7ed;--muted: #d7c9ee;--accent: #ff7a18;--accent-2: #29d3ff;--accent-3: #ff4fb8;--ink: #180b24}@font-face{font-family:Chicken Pie;src:url(/fonts/CHICKEN%20Pie.ttf) format("truetype");font-display:swap}@font-face{font-family:Chicken Pie Height;src:url(/fonts/CHICKEN%20Pie%20Height.ttf) format("truetype");font-display:swap}@font-face{font-family:Caveat;src:url(/fonts/Caveat-Regular.ttf) format("truetype");font-display:swap}@font-face{font-family:Conthrax;src:url(/fonts/Conthrax-SemiBold.otf) format("opentype");font-display:swap}@font-face{font-family:Fantasm and Secrets;src:url(/fonts/Fantasm%20and%20Secrets.ttf) format("truetype");font-display:swap}@font-face{font-family:Fighting Spirit;src:url(/fonts/Fighting%20Spirit%202.otf) format("opentype");font-display:swap}@font-face{font-family:Flowers Kingdom;src:url(/fonts/Flowers%20Kingdom.ttf) format("truetype");font-display:swap}@font-face{font-family:JetBrains Mono;src:url(/fonts/JetBrainsMono-Regular.ttf) format("truetype");font-display:swap}@font-face{font-family:Kalufira;src:url(/fonts/Kalufira.otf) format("opentype");font-display:swap}@font-face{font-family:Motterdam;src:url(/fonts/Motterdam.ttf) format("truetype");font-display:swap}@font-face{font-family:"Press Start 2P";src:url(/fonts/PressStart2P.ttf) format("truetype");font-display:swap}@font-face{font-family:Pacifico;src:url(/fonts/Pacifico-Regular.ttf) format("truetype");font-display:swap}@font-face{font-family:Comic Neue;src:url(/fonts/ComicNeue-Regular.ttf) format("truetype");font-display:swap}@font-face{font-family:Rune;src:url(/fonts/RUNE.TTF) format("truetype");font-display:swap}@font-face{font-family:Smooch Sans;src:url(/fonts/SmoochSans-Black.ttf) format("truetype");font-display:swap}@font-face{font-family:Space Age;src:url(/fonts/space%20age.ttf) format("truetype");font-display:swap}@font-face{font-family:"Super Mario 256";src:url(/fonts/SuperMario256.ttf) format("truetype");font-display:swap}@font-face{font-family:Tambyon;src:url(/fonts/Tambyon.otf) format("opentype");font-display:swap}@font-face{font-family:White Pigeon;src:url(/fonts/WhitePigeon.ttf) format("truetype");font-display:swap}@font-face{font-family:akaPosse;src:url(/fonts/akaPosse.ttf) format("truetype");font-display:swap}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Comic Neue,Inter,Segoe UI,Arial,sans-serif;background:linear-gradient(135deg,rgba(255,122,24,.18),transparent 34%),linear-gradient(225deg,rgba(41,211,255,.18),transparent 36%),var(--bg);color:var(--text);overscroll-behavior:none}.studio-shell{display:grid;grid-template-columns:minmax(300px,1fr) 360px;width:100vw;height:100vh;min-height:0;overflow:hidden}.studio-canvas{position:relative;min-width:0;min-height:0;border-right:1px solid var(--panel-border);overflow:hidden;touch-action:none}.stage-overlay{position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none}.canvas-light-control{position:absolute;left:16px;bottom:16px;z-index:7;width:174px;padding:.62rem;border:1px solid rgba(15,23,42,.14);border-radius:8px;background:#fff8edf0;color:#180b24;box-shadow:0 18px 42px #0f172a38;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none}.canvas-light-control__head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.45rem;font-size:.74rem;font-weight:900}.canvas-light-control__head strong{font-size:.68rem;color:#5b2a6f}.canvas-light-pad{position:relative;height:118px;border:1px solid rgba(24,11,36,.2);border-radius:8px;background:radial-gradient(circle at center,rgba(255,255,255,.82),transparent 34%),linear-gradient(135deg,#29d3ff47,#ff4fb838);overflow:hidden;cursor:crosshair}.canvas-light-pad:before,.canvas-light-pad:after{content:"";position:absolute;background:#180b2438}.canvas-light-pad:before{left:50%;top:0;width:1px;height:100%}.canvas-light-pad:after{left:0;top:50%;width:100%;height:1px}.canvas-light-pad span{position:absolute;z-index:1;width:26px;height:26px;border:2px solid #180b24;border-radius:999px;transform:translate(-50%,-50%)}.canvas-light-control label{margin:.5rem 0 0;color:#5b2a6f;font-size:.72rem;font-weight:900}.canvas-light-control input[type=range]{width:100%}.studio-canvas>canvas{width:100%!important;height:100%!important;display:block}.studio-overlay{position:relative;min-width:0;min-height:0;background:var(--panel);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-left:1px solid var(--panel-border);padding:.95rem;overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:.8rem;box-shadow:-18px 0 44px #0000003d;scrollbar-width:thin}.studio-header,.panel,.mode-row{background:var(--panel-soft);border:1px solid var(--panel-border);border-radius:8px;padding:.75rem}.studio-header h1{margin:0;font-family:Fighting Spirit,Comic Neue,sans-serif;font-size:1.45rem;letter-spacing:0;color:#fff0d5;text-shadow:2px 2px 0 rgba(255,79,184,.45)}.brand-line{display:flex;align-items:center;gap:.55rem;min-width:0}.brand-line img{width:34px;height:34px;flex:0 0 34px;border-radius:8px;object-fit:cover}.studio-header p{margin:.25rem 0 0;color:var(--muted);font-size:.9rem;line-height:1.3}.mode-row{display:grid;grid-template-columns:repeat(4,1fr);gap:.45rem}.compact-modes{grid-template-columns:repeat(3,minmax(0,1fr))}.mode-row button,.panel button,.object-actions button,.content-actions button,.segment-row button{border:1px solid var(--panel-border);background:#ffffff1a;color:var(--text);border-radius:8px;padding:.52rem .62rem;cursor:pointer;font:inherit;font-weight:800;min-height:38px;transition:transform .12s ease,border-color .12s ease,background .12s ease}.mode-row button:hover,.panel button:hover,.object-actions button:hover,.content-actions button:hover,.segment-row button:hover{border-color:#29d3ff8c;transform:translateY(-1px)}button.active,button:focus-visible,.mode-row button:focus-visible,.panel button:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}button.active{background:linear-gradient(135deg,#ff7a18d1,#ff4fb8c2);border-color:#ffffff4d;color:#fff}button:disabled{opacity:.45;cursor:not-allowed}.panel h2{margin:0;font-size:.98rem;color:#fff0d5}.collapsible-panel .collapsible-panel__summary h2{flex:1 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.collapsible-panel{display:block;padding:0;overflow:visible}.collapsible-panel .collapsible-panel__summary{display:flex;align-items:center;justify-content:space-between;gap:.75rem;width:100%;min-height:46px;padding:.75rem;border:0;border-radius:8px;background:transparent;color:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;text-align:left}.collapsible-panel .collapsible-panel__summary:after{content:"+";display:grid;place-items:center;width:24px;height:24px;flex:0 0 24px;border-radius:999px;background:#29d3ff2e;color:#fff7ed;font-weight:900}.collapsible-panel[data-open=true] .collapsible-panel__summary:after{content:"-";background:#ff7a186b}.panel-body{display:flex;flex-direction:column;gap:.6rem;padding:0 .75rem .75rem}.panel-compact{display:flex;flex-direction:column;gap:.6rem}.object-actions,.content-actions,.segment-row,.quick-actions{display:flex;flex-wrap:wrap;gap:.4rem}.object-list,.layer-list{display:flex;flex-wrap:wrap;gap:.3rem}.chip{border-radius:8px;border:1px solid var(--panel-border);padding:.35rem .65rem;background:transparent;color:var(--text);cursor:pointer}.chip.active{background:#29d3ff33;border-color:#29d3ffb3}label{display:flex;flex-direction:column;gap:.35rem;font-size:.82rem;color:var(--muted);margin-bottom:.45rem}label input,label select{border-radius:8px;border:1px solid var(--panel-border);padding:.45rem .55rem;background:#120b24b8;color:var(--text);font:inherit;min-height:40px}label input[type=color]{height:40px;padding:.2rem}.panel input[type=range]{width:100%}.empty{color:#93a3c8;font-size:.8rem}.transform-panel{display:flex;flex-direction:column;gap:.55rem}.transform-mode-panel{display:flex;flex-direction:column;gap:.65rem}.readout-grid{display:grid;gap:.45rem}.readout-grid span{display:grid;gap:.18rem;padding:.55rem .65rem;border:1px solid var(--panel-border);border-radius:8px;background:#120b2473}.readout-grid small{color:var(--muted);font-size:.75rem}.readout-grid strong{color:var(--text);font-size:.9rem;font-weight:600}.quick-actions button{flex:1 1 96px}.object-toolbar{display:inline-flex;gap:6px;padding:6px;width:max-content;min-width:132px;border:1px solid rgba(15,23,42,.12);border-radius:999px;background:#fff8edf0;box-shadow:0 10px 26px #0f172a29;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:auto}.object-toolbar button{display:grid;place-items:center;width:34px!important;height:34px!important;min-width:34px;min-height:34px;flex:0 0 34px;padding:0;border:1px solid transparent;border-radius:999px;background:transparent;color:#0f172a;cursor:pointer}.object-toolbar button:hover,.object-toolbar button:focus-visible{border-color:#0ea5e973;background:#0ea5e91f;outline:none}.object-toolbar button.active{border-color:#ff7a18bf;background:#ff7a18;color:#fff}.object-toolbar svg{width:18px!important;height:18px!important;min-width:18px;min-height:18px;flex:0 0 18px;fill:currentColor}.panel-footer{margin-top:auto;display:flex;flex-wrap:wrap;gap:.5rem}.color-pair{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}.fx-preset-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.4rem}.canvas-layer{position:absolute;display:grid;place-items:center;min-width:40px;min-height:34px;transform-origin:center;cursor:grab;pointer-events:auto;-webkit-user-select:none;user-select:none;touch-action:none;max-width:88%;max-height:88%;--layer-inverse-scale: 1}.canvas-layer:active{cursor:grabbing}.canvas-layer.is-selected{outline:2px solid rgba(41,211,255,.92);outline-offset:5px}.layer-image{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;filter:drop-shadow(0 12px 18px rgba(0,0,0,.25))}.layer-text{width:100%;height:100%;display:flex;align-items:center;justify-content:center;max-width:100%;line-height:1;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;paint-order:stroke fill;pointer-events:none}.text-measure{position:fixed;left:-9999px;top:-9999px;z-index:-1;line-height:1;text-align:center;display:block;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;visibility:hidden;pointer-events:none}.resize-handle{position:absolute;width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;padding:0!important;border-radius:50%!important;border:2px solid #180b24!important;background:linear-gradient(135deg,var(--accent),var(--accent-2))!important;cursor:nwse-resize!important;pointer-events:auto;transform:scale(var(--layer-inverse-scale))}.resize-handle-x{right:-18px;top:50%;transform:translateY(-50%) scale(var(--layer-inverse-scale));cursor:ew-resize!important}.resize-handle-y{left:50%;bottom:-18px;transform:translate(-50%) scale(var(--layer-inverse-scale));cursor:ns-resize!important}.resize-handle-both{right:-18px;bottom:-18px}.resize-handle:before{content:"";width:12px;height:12px;display:block;margin:auto;border-right:3px solid white;border-bottom:3px solid white}.rotate-handle{position:absolute;left:50%;top:-58px;display:grid;place-items:center;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;padding:0!important;border:2px solid #180b24!important;border-radius:999px!important;background:linear-gradient(135deg,#fef3c7,var(--accent-3))!important;color:#180b24!important;cursor:grab!important;pointer-events:auto;transform:translate(-50%) scale(var(--layer-inverse-scale))}.rotate-handle svg{width:18px;height:18px;fill:currentColor}.perspective-handle{position:absolute;display:grid;place-items:center;width:24px!important;height:24px!important;min-width:24px!important;min-height:24px!important;padding:0!important;border:2px solid #180b24!important;border-radius:8px!important;background:linear-gradient(135deg,#ffffff,var(--accent-2))!important;box-shadow:0 8px 18px #0f172a38;cursor:move!important;pointer-events:auto;transform:scale(var(--layer-inverse-scale))}.perspective-handle:before{content:"";width:8px;height:8px;border-radius:50%;background:#180b24}.perspective-handle-tl{left:-14px;top:-14px}.perspective-handle-tr{right:-14px;top:-14px}.perspective-handle-br{right:-14px;bottom:-14px}.perspective-handle-bl{left:-14px;bottom:-14px}.layer-mini-toolbar{position:absolute;left:50%;top:-108px;display:inline-flex;gap:6px;width:max-content;padding:6px;border:1px solid rgba(15,23,42,.14);border-radius:999px;background:#fff8edf5;box-shadow:0 12px 28px #0f172a33;pointer-events:auto;transform:translate(-50%) scale(var(--layer-inverse-scale))}.layer-mini-toolbar button{display:grid;place-items:center;width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;padding:0!important;border:1px solid transparent!important;border-radius:999px!important;background:transparent!important;color:#180b24!important}.layer-mini-toolbar button:hover,.layer-mini-toolbar button:focus-visible{border-color:#29d3ff8c!important;background:#29d3ff24!important;outline:none}.layer-mini-toolbar svg{width:18px;height:18px;fill:currentColor}.preset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.42rem}.compact-segments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.panel-subhead{margin-top:.2rem;color:#fff0d5;font-size:.82rem;font-weight:900}.light-position-pad{position:relative;height:92px;border:1px solid var(--panel-border);border-radius:8px;background:radial-gradient(circle at center,rgba(255,255,255,.12),transparent 34%),linear-gradient(135deg,#29d3ff29,#ff4fb821);overflow:hidden}.light-position-pad:before,.light-position-pad:after{content:"";position:absolute;background:#ffffff2e}.light-position-pad:before{left:50%;top:0;width:1px;height:100%}.light-position-pad:after{left:0;top:50%;width:100%;height:1px}.light-position-pad span{position:absolute;z-index:1;width:24px;height:24px;border:2px solid #180b24;border-radius:999px;transform:translate(-50%,-50%)}.light-orb-label{padding:.18rem .45rem;border:1px solid;border-radius:999px;background:#fff8ede6;color:#180b24;font-size:.7rem;font-weight:900;pointer-events:none;white-space:nowrap;box-shadow:0 10px 22px #0f172a2e}.is-exporting .canvas-layer.is-selected{outline:none}.is-exporting .resize-handle,.is-exporting .rotate-handle,.is-exporting .perspective-handle,.is-exporting .layer-mini-toolbar,.is-exporting .light-orb-label,.is-exporting .canvas-light-control,.is-exporting .object-toolbar{display:none!important}@media(max-width:1000px){.studio-shell{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;height:100dvh}.studio-canvas{border-right:none;min-height:0}.canvas-light-control{left:10px;bottom:10px;width:146px;padding:.5rem}.canvas-light-control__head{gap:.35rem;margin-bottom:.35rem;font-size:.68rem}.canvas-light-control__head strong{font-size:.62rem}.canvas-light-pad{height:92px}.canvas-light-pad span{width:22px;height:22px}.canvas-light-control label{margin-top:.38rem;font-size:.66rem}.studio-overlay{border-left:none;border-top:1px solid var(--panel-border);max-height:min(45dvh,390px);padding:.72rem .72rem calc(.72rem + env(safe-area-inset-bottom));border-radius:16px 16px 0 0;box-shadow:0 -18px 42px #00000057;gap:.58rem}.studio-header,.panel,.mode-row{padding:.62rem}.collapsible-panel{padding:0}.collapsible-panel .collapsible-panel__summary{min-height:48px;padding:.62rem}.panel-body{padding:0 .62rem .62rem}.studio-header{position:sticky;top:0;z-index:2;background:#241947f5;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.studio-header h1{font-size:1.18rem}.brand-line img{width:30px;height:30px;flex-basis:30px}.studio-header p{display:none}.panel h2{font-size:.9rem}.mode-row button,.panel button,.object-actions button,.content-actions button,.segment-row button,.chip{min-height:44px;padding:.58rem .72rem;font-size:.95rem}label{font-size:.85rem;margin-bottom:.35rem}label input,label select{min-height:46px;font-size:16px}.object-actions,.content-actions,.segment-row,.quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.segment-row,.fx-preset-row{grid-template-columns:repeat(3,minmax(0,1fr))}.object-list,.layer-list{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.2rem;scroll-snap-type:x proximity}.object-list .chip,.layer-list .chip{flex:0 0 auto;scroll-snap-align:start}.readout-grid{grid-template-columns:1fr}.readout-grid span{padding:.45rem .55rem}.color-pair{gap:.42rem}.canvas-layer{min-width:54px;min-height:46px}.canvas-layer.is-selected{outline-width:3px;outline-offset:7px}.resize-handle{width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;border-width:3px!important}.resize-handle-x{right:-26px}.resize-handle-y{bottom:-26px}.resize-handle-both{right:-26px;bottom:-26px}.resize-handle:before{width:16px;height:16px;border-right-width:4px;border-bottom-width:4px}.rotate-handle{top:-72px;width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important}.rotate-handle svg{width:22px;height:22px}.perspective-handle{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;border-radius:12px!important}.perspective-handle-tl{left:-22px;top:-22px}.perspective-handle-tr{right:-22px;top:-22px}.perspective-handle-br{right:-22px;bottom:-22px}.perspective-handle-bl{left:-22px;bottom:-22px}.layer-mini-toolbar{top:-132px;gap:8px;padding:8px}.layer-mini-toolbar button{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important}.layer-mini-toolbar svg{width:22px;height:22px}.object-toolbar{gap:8px;padding:8px;min-width:168px}.object-toolbar button{width:44px!important;height:44px!important;min-width:44px;min-height:44px;flex-basis:44px}.object-toolbar svg{width:22px!important;height:22px!important;min-width:22px;min-height:22px}.panel-footer{display:grid;grid-template-columns:1fr 1fr;margin-top:0}}@media(max-width:520px){.studio-overlay{max-height:min(42dvh,340px);padding-inline:.58rem}.studio-header,.panel,.mode-row{border-radius:7px}.studio-header h1{font-size:1.05rem}.panel-compact,.transform-panel{gap:.48rem}.readout-grid strong{font-size:.82rem}}
