:root{--designer-left:clamp(300px,24vw,390px);--designer-right:clamp(315px,25vw,410px);--panel-bg:rgba(8,11,20,.975);--line:rgba(255,255,255,.09)}html,body{height:100%;min-height:100%;margin:0;overflow:hidden;background:#05070d}body{overscroll-behavior:none}.designer-shell{height:100vh;height:100dvh;min-height:0;display:grid;grid-template-columns:var(--designer-left) minmax(340px,1fr) var(--designer-right);background:#05070d;color:#edf5ff;overflow:hidden}.designer-panel{min-width:0;min-height:0;height:100%;border-right:1px solid var(--line);background:var(--panel-bg);display:flex;flex-direction:column;overflow:hidden}.designer-panel-right{border-right:0;border-left:1px solid var(--line)}.designer-head{flex:0 0 auto;padding:13px 14px 10px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);background:#080b13;position:relative;z-index:3}.designer-head h1,.designer-head h2{font-size:18px;margin:2px 0;line-height:1.05}.designer-head h2{font-size:17px}.back-link{color:#84efff;text-decoration:none;font-size:12px;white-space:nowrap}.designer-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding:9px 12px max(42px,env(safe-area-inset-bottom));overscroll-behavior:contain;scrollbar-gutter:stable both-edges;scroll-behavior:smooth}.designer-scroll::-webkit-scrollbar{width:10px}.designer-scroll::-webkit-scrollbar-thumb{background:#78a0be47;border-radius:20px;border:2px solid transparent;background-clip:padding-box}.designer-scroll::-webkit-scrollbar-track{background:#ffffff06}.designer-section{padding:10px 0 12px;border-bottom:1px solid rgba(255,255,255,.075)}.designer-section:last-child{padding-bottom:42px}.example-grid,.random-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.random-grid{margin:8px 0}.random-grid button{min-height:31px}.designer-stage{position:relative;min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;background:#000;overflow:hidden}.designer-stage canvas{display:block;width:100%;height:100%;min-height:0;flex:1 1 auto}.designer-toolbar{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line);background:#080b13}.preview-title{display:flex;flex-direction:column;min-width:140px}.designer-toolbar span{font-size:10px;color:#8893a7}.toolbar-controls{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.toolbar-controls label{font-size:10px;display:flex;align-items:center;gap:4px}.toolbar-controls input{width:68px}.sound-lab{flex:0 0 auto;display:flex;gap:5px;align-items:center;flex-wrap:wrap;padding:6px 10px;background:#080b13;border-bottom:1px solid rgba(255,255,255,.08);max-height:88px;overflow-y:auto}.sound-lab>span{font-size:9px;letter-spacing:.12em;color:#6e7b91;margin-right:3px}.sound-lab button{padding:4px 7px;font-size:10px}.compact{font-size:10px;margin-left:4px}.designer-help{position:absolute;left:14px;bottom:14px;max-width:min(610px,calc(100% - 28px));padding:9px 11px;border:1px solid rgba(255,255,255,.15);border-radius:9px;background:#03050aad;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:11px;color:#b9c5d7;pointer-events:none;z-index:4}.designer-section textarea,.designer-section input[type=text],.designer-section input:not([type]),#d-json{width:100%;box-sizing:border-box;background:#0d1220;color:#eaf3ff;border:1px solid rgba(255,255,255,.14);border-radius:7px;padding:7px;font:inherit}.designer-section textarea{resize:vertical}#d-json{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;line-height:1.4;min-height:140px}.three-col{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.section-title{display:flex;align-items:center;gap:7px;font-size:12px}.section-title:after{content:"";height:1px;flex:1;background:#ffffff0f}button{transition:background .15s ease,border-color .15s ease,transform .12s ease}button:active{transform:translateY(1px)}.ai-lab-section{border:1px solid rgba(111,231,255,.12);border-radius:10px;padding:10px;margin-top:9px;background:linear-gradient(180deg,#10223057,#0a0c161f)}.ai-status-row{display:flex;align-items:center;gap:7px;font-size:11px;margin:5px 0 8px}.ai-status-row .mini{margin-left:auto;padding:3px 7px;font-size:10px}.ai-dot{width:8px;height:8px;border-radius:50%;background:#6d7480;box-shadow:0 0 0 2px #ffffff0a}.ai-dot.ready{background:#55e38b;box-shadow:0 0 10px #55e38ba6}.ai-dot.busy{background:#ffd45f;box-shadow:0 0 10px #ffd45fa6}.ai-dot.error{background:#ff6f78;box-shadow:0 0 10px #ff6f788c}.ai-meter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:8px 0}.ai-meter-grid>div{background:#0d1220;border:1px solid rgba(255,255,255,.08);border-radius:7px;padding:7px;min-width:0}.ai-meter-grid span{display:block;font-size:9px;color:#7f8da4;text-transform:uppercase;letter-spacing:.08em}.ai-meter-grid b{display:block;margin-top:3px;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-keywords{display:flex;flex-wrap:wrap;gap:5px;margin:7px 0}.ai-keyword{font-size:10px;padding:3px 7px;border:1px solid rgba(124,226,255,.2);border-radius:999px;background:#48a5c314;color:#c8f8ff}.ai-result{max-height:230px;overflow:auto;white-space:pre-wrap;word-break:break-word;background:#070b12;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:8px;font-size:10px;line-height:1.4;color:#bcd0e8}.ai-word-stage{position:absolute;inset:92px 10px 18px;pointer-events:none;overflow:hidden;z-index:3}.ai-word-float{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);font-weight:800;letter-spacing:.04em;text-shadow:0 0 12px currentColor,0 0 35px currentColor;animation:aiWordFloat 3.8s ease-out forwards;mix-blend-mode:screen;white-space:nowrap}@keyframes aiWordFloat{0%{opacity:0;transform:translate(-50%,-25%) scale(.55)}15%{opacity:.9}70%{opacity:.7}to{opacity:0;transform:translate(calc(-50% + var(--dx,0px)),calc(-130% + var(--dy,0px))) scale(2.15) rotate(var(--rot,0deg))}}@media(max-width:1280px){:root{--designer-left:290px;--designer-right:305px}.designer-head h1{font-size:16px}.designer-scroll{padding-left:9px;padding-right:9px}.three-col{grid-template-columns:1fr}.two-col{grid-template-columns:1fr 1fr}.designer-help{display:none}}@media(max-width:980px){html,body{height:auto;min-height:100%;overflow:auto;overscroll-behavior:auto}.designer-shell{height:auto;min-height:100vh;display:grid;grid-template-columns:1fr;overflow:visible}.designer-panel{height:auto;max-height:none;border:0;border-bottom:1px solid var(--line);overflow:visible}.designer-scroll{overflow:visible;max-height:none}.designer-stage{height:68vh;min-height:520px;order:2}.designer-panel-left{order:1}.designer-panel-right{order:3}.designer-head{position:sticky;top:0}.designer-help{position:static;display:block;margin:8px 12px 12px}.three-col{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:640px){.two-col,.three-col,.example-grid,.random-grid,.ai-meter-grid{grid-template-columns:1fr}.designer-stage{height:60vh;min-height:420px}.toolbar-controls{display:grid;grid-template-columns:1fr 1fr}.sound-lab{max-height:118px}}