/* ALOKE — THE UNIFIED OWNER PANEL. The frame is console-shell.css's (the
   sidebar, the top bar, the drawer); this file is only what the panel adds:
   three frames that fill the column, and the subscription panes the shell
   draws itself. */
.pl-main { min-width: 0; display: flex; flex-direction: column; min-height: calc(100vh - var(--cs-top)); }
/* AN EXPLICIT HEIGHT, NOT A MIN-HEIGHT: Safari does not honour min-height on
   a replaced element that is a flex child, and a frame with no height is
   150px tall — the register's pairing card cut off after one line
   (founder's screenshot, 2026-09-06). panel.js also sizes the frames in
   pixels on load and resize, so the editor is tall on every engine. */
.pl-frame { display: block; width: 100%; flex: 1 1 auto; height: calc(100vh - var(--cs-top)); min-height: 480px; border: 0; background: var(--bg); }
.pl-own { padding: var(--s5); max-width: 1000px; width: 100%; margin: 0 auto; }
.pl-empty { margin: var(--s5) auto; max-width: 640px; }
.pl-link { display: inline-block; text-decoration: none; margin-top: var(--s3); }
#plErr { margin: var(--s3) var(--s4) 0; }
#plErr:empty { display: none; }
.pl-facts { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s3); font-size: 13px; color: var(--muted); unicode-bidi: plaintext; margin: var(--s2) 0; align-items: center; }
.pl-facts > span:empty { display: none; }
.pl-chips { display: flex; flex-wrap: wrap; gap: var(--s2); margin: var(--s2) 0; align-items: center; }
.pl-chips label { display: inline-flex; align-items: center; gap: var(--s1); font-size: 14px; cursor: pointer; }
.pl-hint { margin: var(--s2) 0 0; font-size: 12.5px; color: var(--muted); line-height: 1.8; unicode-bidi: plaintext; }
.pl-hint:empty { display: none; }
.pl-box { border: 1px solid var(--line); border-radius: var(--r-card); background: var(--surface); padding: var(--s4); margin-top: var(--s3); }
.pl-box > h4 { margin: 0 0 var(--s2); font-size: 14px; }
.pl-grid { display: grid; gap: var(--s2) var(--s3); grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.pl-wide { grid-column: 1 / -1; }
.pl-actions { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s3); align-items: center; }
.pl-code {
  font-family: Inter, system-ui, sans-serif; font-size: 30px; font-weight: 700; letter-spacing: .1em;
  unicode-bidi: isolate; direction: ltr; text-align: center; padding: var(--s5);
  border: 1.5px dashed var(--accent); border-radius: var(--r-card); background: var(--accent-weak); color: var(--accent-press);
}
.pl-row {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--s2);
  border: 1px solid var(--line); border-radius: var(--r-btn); padding: var(--s3) var(--s4);
  margin-top: var(--s2); background: var(--surface);
}
.pl-row .main { flex: 1 1 200px; min-width: 0; }
.pl-row .name { font-size: 14px; font-weight: 700; unicode-bidi: plaintext; }
.pl-row .meta { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; unicode-bidi: plaintext; }
.pl-row .chip, .pl-row button { flex: 0 0 auto; }
.pl-off { opacity: .6; }
.pl-scroll { overflow-x: auto; }
.pl-t { border-collapse: collapse; width: 100%; font-size: 13px; }
.pl-t th, .pl-t td { border-bottom: 1px solid var(--line); padding: var(--s2) var(--s2); text-align: start; vertical-align: top; }
.pl-t .n { unicode-bidi: isolate; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pl-tot { display: flex; justify-content: space-between; gap: var(--s3); padding: var(--s1) 0; font-size: 14px; unicode-bidi: plaintext; }
.pl-tot.big { border-top: 2px solid var(--line); margin-top: var(--s2); padding-top: var(--s2); font-weight: 700; font-size: 16px; }
.bnum { unicode-bidi: isolate; font-variant-numeric: tabular-nums; }
.pl-stuck { text-decoration: none; font-size: 12.5px; min-height: 36px; }
@media (max-width: 1023px) {
  .pl-frame { height: calc(100vh - var(--cs-top)); }
  .pl-own { padding: var(--s4); }
}