/* ==========================================================================
   ListenRadio ラジオ局ポータル — app.css（管理コンソール）への追加分
   サイドバーを持たない1カラム構成。管理コンソールの画面・メニューへの導線は持たない。
   ========================================================================== */

.app--station {
  grid-template-columns: minmax(0, 1fr);
  max-width: 1120px;
}

/* --- ヘッダー ------------------------------------------------------------- */

.stbar {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: var(--topbar-h);
  padding: 0 26px;
  background: color-mix(in srgb, var(--bg) 85%, transparent);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.stbar__brand { display: flex; flex-direction: column; gap: 3px; flex-shrink: 0; }
.stbar__brand .rail__logo { width: 116px; height: auto; }
.stbar__sub { font-family: var(--mono); font-size: 9px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fg-3); }
.stbar__spacer { flex: 1; }
.stbar__stations { display: flex; align-items: center; gap: 6px; min-width: 0; }
.stbar__station {
  max-width: 220px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 99px;
  background: var(--bg-2);
  font-size: 11.5px; font-weight: 700; color: var(--fg-2);
}
.stbar__user { display: flex; align-items: center; gap: 9px; min-width: 0; }
.stbar__name { font-size: 12px; font-weight: 700; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.stcanvas { max-width: 100%; }

/* --- 件数 ------------------------------------------------------------------ */

.ststats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.ststat {
  display: grid; gap: 6px; text-align: left;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--bg-2);
  box-shadow: var(--shadow);
  cursor: pointer;
  font: inherit; color: inherit;
  transition: border-color 0.12s, background 0.12s;
}
.ststat:hover { border-color: var(--fg-3); }
.ststat.is-active { border-color: var(--signal); background: var(--signal-dim); }
.ststat:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }
.ststat__label { font-size: 11.5px; font-weight: 700; color: var(--fg-2); display: flex; align-items: center; gap: 7px; }
.ststat__value { font-family: var(--mono); font-size: 26px; font-weight: 600; letter-spacing: -0.05em; line-height: 1; font-variant-numeric: tabular-nums; }
.ststat__unit { margin-left: 3px; font-size: 11px; color: var(--fg-3); font-weight: 500; letter-spacing: 0; }

/* --- 申請一覧（表ではなく行カード。狭い幅では縦に積む） ------------------------- */

.stlist { display: grid; }
.strow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px 18px;
  padding: 15px 18px;
  border-top: 1px solid var(--line-soft);
  color: inherit;
  transition: background 0.1s;
}
.strow:first-child { border-top: 0; }
.strow:hover { background: var(--bg-3); }
.strow:focus-visible { outline: 2px solid var(--signal); outline-offset: -2px; }
.strow__title { font-size: 13.5px; font-weight: 700; line-height: 1.5; word-break: break-word; }
.strow__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin-top: 3px; font-size: 11.5px; color: var(--fg-3); }
.strow__meta .mono { font-size: 11px; }
.strow__side { display: flex; align-items: center; gap: 12px; }
.strow__chev { width: 14px; height: 14px; stroke: var(--fg-3); fill: none; stroke-width: 2; flex: none; }

/* --- フォーム補助 ------------------------------------------------------------ */

.stcount { font-family: var(--mono); font-size: 11px; color: var(--fg-3); }
.stfieldgroup { display: grid; gap: 14px; }
.stkv { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 6px 16px; padding: 12px 0; border-top: 1px solid var(--line-soft); font-size: 13px; line-height: 1.8; }
.stkv:first-child { border-top: 0; padding-top: 0; }
.stkv dt { font-size: 12px; font-weight: 700; color: var(--fg-2); }
.stkv dd { word-break: break-word; }
.stkv a { color: var(--info); border-bottom: 1px solid var(--line); }

.stblocked { max-width: 520px; margin: 12vh auto 0; padding: 0 20px; text-align: center; }

@media (max-width: 760px) {
  .stbar { padding: 0 16px; gap: 10px; }
  .stbar__name, .stbar__stations { display: none; }
  .ststats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .strow { grid-template-columns: minmax(0, 1fr); padding: 14px 16px; }
  .strow__side { justify-content: space-between; }
  .stkv { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .pagehead__actions { width: 100%; }
  .pagehead__actions .btn { flex: 1; justify-content: center; }
}