/* PSS Plasma — Nesting Studio on a phone.
 *
 * Two causes fixed here.
 *
 * 1. The bottom bar (.pss-st-mob) is position:fixed but sits inside .pss-st, which carries
 *    an entrance animation on `transform`. Any transform on an ancestor makes a fixed child
 *    position against that ancestor instead of the viewport, so the bar floated at the
 *    bottom of the studio CARD -- mid-page, on top of the Upload / Shape library / Type it
 *    controls -- and no amount of page padding could clear it. The phone does not need the
 *    entrance animation, so dropping it there makes the bar genuinely fixed.
 *
 * 2. Everything that has to clear the bar reads one variable, --st-dock, rather than
 *    carrying its own number: page padding, the height of the open pane, the inner
 *    scrollers, and the floating column's floor (assets/css/site/80-touch.css).
 *    The variable sits on <body> so every part of the page can see it.
 */
@media (max-width:860px){
  body:has(.pss-studio){--st-dock:90px}       /* bar 69 + 10 bottom + 11 clearance */
  .pss-st{animation:none}                      /* see 1: no transformed ancestor */
  .pss-studio-page{padding:6px 6px var(--st-dock,90px)}

  /* the open pane ENDS above the bar, rather than merely sitting on a padded page */
  .pss-st[data-pane="add"] .pss-st-add,
  .pss-st[data-pane="main"] .pss-st-main{
    height:calc(100dvh - 318px - var(--st-dock,90px));
    min-height:min(400px,calc(100dvh - 318px - var(--st-dock,90px)));
  }
  /* and the inner scrollers end clear of it even when the pane is forced taller */
  .pss-st-add__body,.pss-st-parts,.pss-st-job{padding-bottom:calc(var(--st-dock,90px) + 8px)}

  /* The studio carries its own Assistant tab, so the floating launcher is a duplicate
     here -- and on a phone it lands on top of the "Say it" button. Hiding it inside the
     studio removes both the duplicate and the overlap; --pss-fab-s2 collapses with it so
     the rest of the floating column closes the gap. */
  body:has(.pss-studio){--pss-fab-s2:0px}
  body:has(.pss-studio) .pss-ag-launch{display:none}

  /* readable text, no iOS zoom on focus */
  .pss-st-name{font-size:16px;min-height:40px}
  .pss-jb-badge,.pss-jb-badge span{font-size:12px}
  .pss-st-mob button,.pss-st-mob button span{font-size:12px}
}
@media (max-width:860px) and (pointer:coarse){
  .pss-st-mob button{min-height:44px}
  .pss-st-icon,.pss-st-top__tools button{min-width:44px;min-height:44px}
}

/* The empty state has to fit the pane on a phone, or its last two choices ("Type it",
   "Say it") fall past the bottom of the scroller and read as missing. Smaller art, a
   tighter copy block and a 2x2 action grid bring it from ~520px to ~380px. */
@media (max-width:700px){
  .pss-st-empty{padding:14px 12px;gap:8px}
  .pss-st-empty h2{font-size:1.5rem}
  .pss-st-empty p{font-size:.95rem;max-width:34ch}
  .pss-st-empty__art{width:120px;height:74px;margin-bottom:2px}
  .pss-st-empty__art span:nth-child(1){left:0;top:13px;width:60px;height:47px}
  .pss-st-empty__art span:nth-child(2){left:67px;top:0;width:47px;height:47px}
  .pss-st-empty__art span:nth-child(3){left:64px;top:52px;width:56px;height:20px}
  .pss-st-empty__acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
  /* Labels WRAP rather than clip. The buttons are .pss-btn--lg with overflow:hidden and
     nowrap, so "Upload drawings" lost its last letters in a half-width cell -- and would
     again in any language with a longer word. Wrapping cannot clip at any font size. */
  .pss-st-empty__acts>*{width:100%;min-width:0;white-space:normal;height:auto;
    padding-left:10px;padding-right:10px;line-height:1.2;text-align:center}
}

/* ---------- the phone feature layer ---------- */
/* a part card held under the finger: its actions open and stay open */
.pss-st-pcard.is-pressed{outline:2px solid var(--orange);outline-offset:2px}
.pss-st-pacts.is-open{display:flex!important;flex-wrap:wrap;gap:6px}

/* the setup sheet, read at arm's length at the machine */
.pss-st-setup--phone .pss-st-modal__panel{max-width:520px}
.pss-st-setup__job{color:var(--muted);margin:.2em 0 1em;font-weight:600}
.pss-st-setup__list{list-style:none;margin:0;padding:0;display:grid;gap:8px;counter-reset:mark}
.pss-st-setup__list li{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:4px 12px;
  padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}
.pss-st-setup__list b{font-size:1.15rem;font-family:var(--f-mono);letter-spacing:.02em}
.pss-st-setup__list span{font-weight:800;font-size:1.05rem;white-space:nowrap}
.pss-st-setup__list small{grid-column:1/-1;color:var(--muted);font-size:12px}
.pss-st-setup__note{color:var(--muted);font-size:12px;margin-top:14px}

/* the keep-awake switch shows its state */
.pss-st-icon.is-on,.pss-st-top__tools button.is-on{background:var(--grad-brand);color:#fff;border-color:transparent}