<!-- PLAYA · part 15 -->
pan class="ic">◌</span>Hide</button>
      <button class="btn" data-act="delete"><span class="ic">🗑</span>Delete</button>
    </div>
  </div>

  <!-- STUDIO frame -->
  <div id="studio-only">
    <div id="s-top" class="panel studio-only">
      <h1>THE CREATOR STUDIO<small>v1</small></h1>
      <div id="tabs">
        <button class="btn" data-act="tab" data-arg="build"><span class="ic">▣</span>BUILD</button>
        <button class="btn" data-act="tab" data-arg="sculpt"><span class="ic">✋</span>SCULPT</button>
        <button class="btn" data-act="tab" data-arg="materials"><span class="ic">◉</span>MATERIALS</button>
        <button class="btn" data-act="tab" data-arg="lighting"><span class="ic">☀</span>LIGHTING</button>
        <button class="btn" data-act="tab" data-arg="animation"><span class="ic">↻</span>ANIMATION</button>
        <button class="btn" data-act="tab" data-arg="fx"><span class="ic">✦</span>FX</button>
        <button class="btn" data-act="tab" data-arg="export"><span class="ic">⇪</span>EXPORT</button>
      </div>
      <div class="ur">
        <button class="btn" data-act="undo"><span class="ic">↶</span>Undo</button>
        <button class="btn" data-act="redo"><span class="ic">↷</span>Redo</button>
      </div>
    </div>
    <div id="s-left" class="panel scroll studio-only"></div>
    <div id="s-right" class="panel scroll studio-only"></div>
    <div id="s-bottom" class="studio-only">
      <div id="sb-1" class="panel scroll"></div>
      <div id="sb-2" class="panel scroll"></div>
      <div id="sb-3" class="panel scroll"></div>
      <div id="sb-4" class="panel scroll"></div>
    </div>
    <div id="s-foot" class="panel studio-only">
      <span class="proj">PROJECT · Playa Creator</span>
      <button class="btn" data-act="savescene"><span class="ic">💾</span>Save scene</button>
      <button class="btn" data-act="loadscene"><span class="ic">📂</span>Load scene</button>
      <span></span>
      <button id="s-export" class="btn gold" data-act="openexport"><span class="ic" style="color:#140f04">⇪</span>RENDER &amp; EXPORT (PNG, OBJ)</button>
    </div>
  </div>
</div>

<!-- PHONE frame -->
<div id="p-top" class="phone-only"><h1>THE CREATOR <small>v1</small></h1><div id="p-status" class="status"></div></div>
<div id="rail" class="phone-only scroll">
  <button class="btn" data-act="sheet" data-arg="primitives"><span class="ic">⬢</span>Mesh<br>Primitives</button>
  <button class="btn" data-act="sheet" data-arg="brushes"><span class="ic">◉</span>Surface<br>Brushes</button>
  <button class="btn" data-act="sheet" data-arg="clay"><span class="ic">✋</span>Digital<br>Clay</button>
  <button class="btn" data-act="sheet" data-arg="tools"><span class="ic">▦</span>Creator<br>Tools</button>
  <button class="btn" data-act="sheet" data-arg="color"><span class="ic">🎨</span>Color</button>
  <button class="btn" data-act="undo"><span class="ic">↶</span>Undo</button>
  <button class="btn" data-act="redo"><span class="ic">↷</span>Redo</button>
  <button class="btn" data-act="tool" data-arg="select"><span class="ic">➚</span>Select</button>
  <button class="btn" data-act="tool" data-arg="move"><span class="ic">✥</span>Move</button>
  <button class="btn" data-act="tool" data-arg="rotate"><span class="ic">⟳</span>Rotate</button>
  <button class="btn" data-act="tool" data-arg="scale"><span class="ic">⤢</span>Scale</button>
  <button class="btn" data-act="sheet" data-arg="precision"><span class="ic">⌖</span>Precision<br>Align</button>
  <button class="btn" data-act="sheet" data-arg="linework"><span class="ic">▤</span>Linework</button>
</div>
<button id="card" class="phone-only" data-act="sheet" data-arg="precision"></button>
<div id="sheet" class="phone-only">
  <div id="sheet-head"><span id="sheet-title"></span><button class="btn" data-act="closesheet" aria-label="Close">✕</button></div>
  <div id="sheet-body" class="scroll"></div>
</div>
<div id="shelf" class="phone-only">
  <div class="ttl">ACTIONS SHELF</div>
  <div class="acts">
    <button class="btn" data-act="sheet" data-arg="lightfx"><span class="ic">☀</span>Lighting<br>&amp; FX</button>
    <button class="btn" data-act="sheet" data-arg="library"><span class="ic">💼</span>Add to<br>Library</button>
    <button class="btn" data-act="sheet" data-arg="layers"><span class="ic">≣</span>Manage<br>Layers</button>
  </div>
  <button id="bigexport" class="btn gold" data-act="sheet" data-arg="export"><span class="ic" style="color:#140f04;margin-right:8px">⇪</span>RENDER &amp; EXPORT (PNG, OBJ)</button>
</div>

<!-- Sections: defined once, placed by layout. -->
<div id="store">
  <div class="sec" id="sec-blocks">
    <h3>Mesh Primitives · Block Picker</h3>
    <div class="grid gauto" id="blocklist"></div>
    <p class="note">Tap a block to place it in front of you. It becomes the shape for Create mode.</p>
  </div>
  <div class="sec" id="sec-modes">
    <h3>Place &amp; Remove</h3>
    <div class="grid g3">
      <button class="btn" data-ac