/* THE PROMPT SLOT (PKT:wf-prompt-slot-martinex): one place, one look, for every "near something" prompt (src/app/prompt-slot.js).
   The slot's position is set from JS (it measures the HUD), never from here; this file is the card, the pill and the buttons.
   Look = the new HUD's: --hv-raised glass, --hv-edge border, 16px corners, system sans. Falls back to the old HUD's navy when the
   new HUD vars are not there. Ticket UI re-shapes the buttons (tickets.css lists .pslot-btn). */

.pslot{position:absolute;z-index:12;left:0;top:0;width:max-content;max-width:420px;display:flex;flex-direction:column;gap:6px;
  align-items:stretch;pointer-events:none;box-sizing:border-box}
.pslot[hidden]{display:none}
.pslot-strip{display:flex;flex-direction:column;gap:6px;align-items:center}
.pslot-strip:empty,.pslot-well:empty{display:none}
.pslot-well{display:flex;flex-direction:column;align-items:stretch}
.pslot [data-pslot-wait]{display:none!important}
.pslot-card[hidden],.pslot-pill[hidden]{display:none}

/* the card: a calm glass tile, text left, the key / action right */
.pslot-card{pointer-events:auto;position:static;transform:none;display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;box-sizing:border-box;
  width:100%;min-height:52px;margin:0;padding:8px 12px;border:1px solid var(--hv-edge,#2a3f6e);border-radius:16px;
  background:var(--hv-raised,#0b1634f2);color:var(--ink,#eaf2ff);font:600 14px/1.25 var(--sans,system-ui,sans-serif);text-align:left;
  box-shadow:var(--hv-shadow,0 8px 24px #01030cb3);white-space:normal;cursor:default}
button.pslot-card{cursor:pointer;text-align:left}
button.pslot-card:hover,button.pslot-card:focus-visible{border-color:var(--hot,#ff4fc3);outline:none}
.pslot-card:focus-visible{outline:2px solid var(--cyan,#35e0e0);outline-offset:2px}
.pslot-text{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1 1 auto}
.pslot-title{margin:0;color:#fff;font:700 14px/1.25 var(--sans,system-ui,sans-serif);letter-spacing:0;overflow-wrap:anywhere}
.pslot-sub{color:var(--sub,#9fb4d8);font:500 12px/1.3 var(--sans,system-ui,sans-serif);letter-spacing:0;overflow-wrap:anywhere}
.pslot-card kbd,.pslot-btn kbd{display:inline-block;min-width:18px;padding:1px 6px;border:1px solid #3a4f80;border-radius:6px;background:var(--hv-well,#0d1631);
  color:#dbe6ff;font:600 12px/1.4 var(--mono,monospace);text-align:center}
.pslot-actions{display:flex;flex:1 1 100%;gap:8px;flex-wrap:wrap;justify-content:stretch}

/* buttons: thumb-sized everywhere (>= 44px), keyboard hint inline */
.pslot-btn{flex:1 1 130px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 14px;
  border:1px solid var(--hv-edge,#2a3f6e);border-radius:14px;background:var(--hv-well,#0d1631);color:var(--ink,#eaf2ff);
  font:700 13px/1.2 var(--sans,system-ui,sans-serif);letter-spacing:0;text-transform:none;white-space:nowrap;cursor:pointer}
.pslot-btn:hover,.pslot-btn:focus-visible{border-color:var(--hot,#ff4fc3);outline:none}
.pslot-btn:disabled{opacity:.55;cursor:default}
.pslot-btn.pslot-primary{background:var(--hot,#ff4fc3);border-color:var(--hot,#ff4fc3);color:#fff}
.pslot-btn.pslot-yes{background:#16a37a;border-color:#5dffc7;color:#04140e}

/* a status pill: one quiet line above the card */
.pslot-pill{pointer-events:auto;position:static;transform:none;display:inline-flex;align-items:center;gap:10px;box-sizing:border-box;max-width:100%;
  min-height:44px;padding:6px 14px;border:1px solid var(--hv-edge,#2a3f6e);border-radius:999px;background:var(--hv-glass,#07102ad9);
  color:var(--ink,#eaf2ff);font:600 12.5px/1.25 var(--sans,system-ui,sans-serif);letter-spacing:0;text-transform:none;white-space:normal;
  text-align:center;box-shadow:none;cursor:pointer}
.pslot-pill button{min-height:44px}

/* tight (the window is nearly full of HUD): the second lines go */
.pslot-tight .pslot-sub{display:none}
.pslot-tight .vigil-card .shop-wallet{display:none}   /* squeezed (360x800 + More moves open): the wallet bar goes with the second line (PKT:wf-shop-balance-groot x wf-prompt-slot-martinex) */
.pslot-tight .pslot-card{min-height:44px;padding:4px 10px}

/* no keyboard on a phone: the card IS the button, the key chip is noise */
@media (pointer:coarse){.pslot kbd{display:none}}
@media (max-width:700px){.pslot{max-width:min(360px,calc(100vw - 16px))}.pslot-btn{flex-basis:120px}}

/* each prompt's own body inside the shared card */
.vigil-card{flex-direction:column;align-items:stretch;gap:4px;padding:8px 10px 6px}
.vigil-card .pslot-sub{text-align:center}
.vigil-card .pslot-actions{flex:none;flex-wrap:nowrap}
.vigil-card .pslot-btn{flex:1 1 0;min-width:0;padding:8px 10px;border-color:#7a4a63;background:#2a1a2ae0;color:#ffe9f1;font-size:13px;white-space:normal;text-align:center}
.vigil-card .pslot-btn{white-space:nowrap}
@media (max-width:430px){.vigil-card .pslot-actions{flex-wrap:wrap}.vigil-card .pslot-btn{flex:1 1 100%}}
.vigil-card .pslot-btn.pslot-primary{background:#3b2233;border-color:#d68aa3;color:#fff}
.vigil-card .pslot-btn:hover,.vigil-card .pslot-btn:focus-visible{border-color:#ffb8c8}
.pslot-card.interact-prompt{display:grid;grid-template-columns:1fr auto;gap:8px 12px;align-items:center}
.pslot-card.interact-prompt[data-kind="trinket-gift"]{width:min(330px,100%)}
.pslot-card.mg-called{display:grid;gap:4px;border-color:#ff4fd8}
.pslot-card.interact-prompt .interact-buttons{grid-column:1/-1;display:flex;gap:8px}
.pslot-card.interact-prompt .interact-buttons button{flex:1}
.pslot-card.chill-prompt,.pslot-card.mosh-join-prompt{flex-wrap:nowrap;gap:12px}
.pslot-card.chill-prompt b{color:#fff;letter-spacing:0}
.pslot-pill.mg-pill{display:inline-flex;padding:4px 6px 4px 14px;border-color:var(--cyan,#35e0e0)}
.pslot-pill.mg-pill button{min-height:44px}

/* tight: the big gift card sheds its art and its banner so it fits above the moves card on a phone */
.pslot-tight .interact-prompt{padding:6px 10px;gap:4px 10px;min-height:0}
.pslot-tight .interact-prompt .interact-text{font:600 13px/1.3 var(--sans,system-ui,sans-serif)}
.pslot-tight .interact-prompt[data-kind="trinket-gift"]{padding:6px 10px;gap:4px 10px}
.pslot-tight .interact-prompt[data-kind="trinket-gift"]::before,.pslot-tight .interact-gift-art{display:none}
.pslot-tight .interact-prompt[data-kind="trinket-gift"] .interact-text{margin-bottom:0}
