.particle-studio .studio-layout{gap:var(--space-4);grid-template-columns:minmax(280px,360px) minmax(0,1fr);align-items:start;display:grid}.particle-studio .settings{top:var(--space-3);position:sticky}.particle-studio .preview-pane{top:calc(64px + var(--space-3));max-height:calc(100vh - 64px - var(--space-5));flex-direction:column;align-self:start;display:flex;position:sticky}.particle-studio .panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-4);margin-bottom:var(--space-3)}.particle-studio .panel-title{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text);margin:0 0 var(--space-3)}.particle-studio .field{margin-bottom:var(--space-3)}.particle-studio .field:last-child{margin-bottom:0}.particle-studio label{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text);margin-bottom:var(--space-2);display:block}.particle-studio input[type=text],.particle-studio select{width:100%;min-height:44px;padding:var(--space-2) var(--space-3);border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--bg);color:var(--text);font-size:var(--text-base);font-family:inherit}.particle-studio input[type=range]{width:100%;min-height:44px;accent-color:var(--accent-text)}.particle-studio .val,.particle-studio .output-meta,.particle-studio .hint{color:var(--text-muted);font-size:var(--text-xs);font-variant-numeric:tabular-nums}.particle-studio .hint{margin:var(--space-2) 0 0;line-height:var(--leading-body)}.particle-studio .sample-field{padding-bottom:var(--space-3);border-bottom:1px solid var(--border)}.particle-studio .sample-row,.particle-studio .segmented{gap:var(--space-1);flex-wrap:wrap;display:flex}.particle-studio .sample-btn,.particle-studio .seg-btn{border:1px solid var(--border-strong);background:var(--bg);color:var(--text);border-radius:var(--radius-sm);min-height:36px;padding:var(--space-1) var(--space-2);font-family:inherit;font-size:var(--text-sm);font-weight:var(--weight-semibold);cursor:pointer}.particle-studio .seg-btn{min-height:44px;padding-inline:var(--space-3)}.particle-studio .sample-btn:hover,.particle-studio .seg-btn:hover{background:var(--surface-2);border-color:var(--accent-text)}.particle-studio .seg-btn.is-active{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.particle-studio button.act{width:100%;min-height:44px;padding:var(--space-3);border-radius:var(--radius-md);background:var(--accent);color:var(--accent-ink);font-size:var(--text-base);font-weight:var(--weight-semibold);cursor:pointer;transition:background var(--transition);border:1px solid #0000;font-family:inherit;display:block}.particle-studio button.act:hover{background:var(--accent)}.particle-studio button.act:disabled{opacity:.5;cursor:not-allowed}.particle-studio .output-meta{line-height:var(--leading-body);margin:var(--space-2) 0 0}.particle-studio .preview-head{justify-content:space-between;align-items:flex-end;gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.particle-studio .preview-title{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text);margin:0}.particle-studio .preview-stats{justify-content:flex-end;gap:var(--space-2);color:var(--text-muted);font-size:var(--text-sm);font-variant-numeric:tabular-nums;flex-wrap:wrap;display:flex}.particle-studio .preview-stats span{border:1px solid var(--border);background:var(--surface);border-radius:var(--radius-sm);padding:var(--space-1) var(--space-2)}.particle-studio .stage-shell{height:clamp(520px,100vh - 160px,720px);min-height:0;padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);background:linear-gradient(90deg, var(--border) 1px, transparent 1px), linear-gradient(var(--border) 1px, transparent 1px), var(--surface);background-size:32px 32px;place-items:center;display:grid;overflow:hidden}.particle-studio .particle-stage{aspect-ratio:9/16;width:min(100%,40vh,420px);box-shadow:var(--shadow-md);isolation:isolate;transition:width var(--transition), border-radius var(--transition);border-radius:24px;position:relative;overflow:hidden}.particle-studio .particle-stage[data-ratio=square]{aspect-ratio:1;width:min(100%,58vh,560px)}.particle-studio .particle-stage[data-ratio=landscape]{aspect-ratio:16/9;border-radius:18px;width:min(100%,840px)}.particle-studio .particle-stage[data-ratio=poster]{aspect-ratio:4/5;width:min(100%,48vh,500px)}.particle-studio .particle-stage canvas{z-index:0}.particle-studio .scene-copy{z-index:1;place-content:center;gap:var(--space-3);text-align:center;pointer-events:none;min-height:100%;padding:clamp(24px,9%,64px);display:grid;position:relative}.particle-studio .scene-eyebrow,.particle-studio .scene-detail{color:var(--scene-muted);font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:0;text-transform:uppercase;margin:0}.particle-studio .scene-title{color:inherit;font-size:clamp(2rem,7vw,4.75rem);line-height:.98;font-weight:var(--weight-semibold);letter-spacing:0;text-wrap:balance;margin:0}@media (width<=980px){.particle-studio .studio-layout{grid-template-columns:1fr}.particle-studio .settings{position:static}.particle-studio .preview-pane{max-height:none;display:block;position:static}.particle-studio .preview-head{flex-direction:column;align-items:flex-start}.particle-studio .preview-stats{justify-content:flex-start}.particle-studio .stage-shell{height:auto;min-height:560px;padding:var(--space-3)}}@media (width<=560px){.particle-studio .stage-shell{min-height:440px;padding:var(--space-2);background-size:24px 24px}.particle-studio .particle-stage{border-radius:18px}.particle-studio .scene-title{font-size:clamp(2rem,14vw,3.5rem)}}
