: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:Fighting Spirit;src:url(/fonts/Fighting%20Spirit%202.otf) format("opentype");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:Space Age;src:url(/fonts/space%20age.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}.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}.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}.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%}.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%;max-width:100%;line-height:1;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;text-shadow:3px 3px 0 rgba(24,11,36,.75),0 10px 24px rgba(0,0,0,.35);pointer-events:none}.resize-handle{position:absolute;right:-18px;bottom:-18px;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}.resize-handle:before{content:"";width:12px;height:12px;display:block;margin:auto;border-right:3px solid white;border-bottom:3px solid white}.is-exporting .canvas-layer.is-selected{outline:none}.is-exporting .resize-handle,.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}.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}.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{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{right:-26px;bottom:-26px;width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;border-width:3px!important}.resize-handle:before{width:16px;height:16px;border-right-width:4px;border-bottom-width:4px}.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}.layer-text{text-shadow:2px 2px 0 rgba(24,11,36,.75),0 8px 18px rgba(0,0,0,.3)}}