/* ==========================================================================
   ALIVE admin 専用スタイルシート (Phase2: デザイントークン + 共通コンポーネント)

   役割:
   - 管理画面だけが読み込む (公開HP/会員ページは styles.css のみ。ここは絶対に読まない)。
   - ここの :root トークンが管理画面の色/余白/角丸/文字サイズの唯一の定義元。
     新しい admin UI は必ずトークンと .a-* コンポーネント class を使うこと。
     styles.css 末尾のパッチ層 (リデザインPhase1〜3, !important 230個) は今後
     段階的にこのファイルへ畳み込み、最終的に styles.css から admin 規則を撤去する。
   - 色は公開HP (styles.css) の値へ収束させる方針 (黒 #111 / 黄 #ffe36e=HP --yellow /
     罫線 #cfcfcf=HP --line / カード白)。集客の顔である HP を正とし admin を寄せる。
     変えるときはここのトークンを変える。
   ========================================================================== */

:root {
  /* Hajime Family foundation (light web surface + graphite chrome). */
  --hf-surface-canvas: #eef3f8;
  --hf-surface-raised: #feffff;
  --hf-surface-inset: #eaf1f8;
  --hf-surface-dialog: #ffffff;
  --hf-control: #fbfdff;
  --hf-control-hover: #f2f7fc;
  --hf-line: #d7e1ea;
  --hf-line-soft: #e2e8ef;
  --hf-line-subtle: #e8eef4;
  --hf-control-stroke: #d6e1eb;
  --hf-text: #111827;
  --hf-text-muted: #4e5b6b;
  --hf-text-faint: #8492a6;
  --hf-selection: #d8ecff;
  --hf-selection-stroke: #7ab8f6;
  --hf-row-hover: #eaf3fc;
  --hf-chrome: #303539;
  --hf-chrome-text: #f2f3f5;
  --hf-chrome-muted: #b4b7be;
  --hf-success: #3ba55c;
  --hf-warning: #e5a50a;
  --hf-danger: #e5484d;
  --hf-info: #3b82f6;
  --hf-scrim: rgb(0 0 0 / 40%);
  --hf-font-sans: "SF Pro Text", Inter, Aptos, "Yu Gothic UI", Meiryo, "Segoe UI Variable Text", "Segoe UI", "Hiragino Sans", "Noto Sans CJK JP", system-ui, sans-serif;
  --hf-font-display: "SF Pro Display", "Inter Display", "Aptos Display", Aptos, "Yu Gothic UI", Meiryo, "Segoe UI", "Hiragino Sans", "Noto Sans CJK JP", system-ui, sans-serif;

  /* ALIVE identity is an extension, never a structural neutral. */
  --a-brand-ink: var(--black);
  --a-brand-display: Oswald, var(--hf-font-display);
  --a-font: var(--hf-font-sans);
  --a-font-display: var(--hf-font-display);
  --a-ink: var(--hf-text);
  --a-ink-soft: var(--hf-text-muted);
  --a-text: var(--hf-text);
  --a-text-muted: var(--hf-text-muted);
  --a-text-faint: var(--hf-text-faint);
  --a-surface: var(--hf-surface-raised);
  --a-surface-2: var(--hf-control-hover);
  --a-control: var(--hf-control);
  --a-bg: var(--hf-surface-canvas);
  --a-inset: var(--hf-surface-inset);
  --a-dialog: var(--hf-surface-dialog);
  --a-line: var(--hf-line);
  --a-line-soft: var(--hf-line-soft);
  --a-line-subtle: var(--hf-line-subtle);
  --a-control-stroke: var(--hf-control-stroke);
  --a-border: var(--a-line);
  --a-selection: var(--hf-selection);
  --a-selection-stroke: var(--hf-selection-stroke);
  --a-row-hover: var(--hf-row-hover);
  --a-chrome: var(--hf-chrome);
  --a-chrome-text: var(--hf-chrome-text);
  --a-chrome-muted: var(--hf-chrome-muted);
  --a-scrim: var(--hf-scrim);
  --a-accent: var(--yellow);
  --a-accent-ink: var(--hf-text);
  --a-danger: var(--hf-danger);
  --a-danger-bg: color-mix(in srgb, var(--a-danger) 10%, var(--a-surface));
  --a-ok: var(--hf-success);
  --a-ok-bg: color-mix(in srgb, var(--a-ok) 10%, var(--a-surface));
  --a-warn: var(--hf-warning);
  --a-warning: var(--a-warn);
  --a-warn-bg: color-mix(in srgb, var(--a-warn) 12%, var(--a-surface));
  --a-info: var(--hf-info);
  --a-info-bg: color-mix(in srgb, var(--a-info) 9%, var(--a-surface));

  /* Family spacing: 2 / 4 / 6 / 8 / 12 / 16 / 24px. */
  --a-gap-0: 2px;
  --a-gap-1: 4px;
  --a-gap-1-5: 6px;
  --a-gap-2: 8px;
  --a-gap-3: 12px;
  --a-gap-4: 16px;
  --a-gap-5: calc(var(--a-gap-2) + var(--a-gap-3));
  --a-gap-6: 24px;

  /* Family shape scale. */
  --a-radius-xs: 1px;
  --a-radius-control-sm: 4px;
  --a-radius-control: 6px;
  --a-radius-card: 8px;
  --a-radius-xl: 10px;
  --a-radius-float: 16px;
  --a-radius: var(--a-radius-card);
  --a-radius-sm: var(--a-radius-control);
  --a-radius-pill: 999px;
  --a-radius-glass: var(--a-radius-card);
  --a-radius-glass-sm: var(--a-radius-control);

  /* Family type scale. Keep legacy lg at 16px; explicit titles use --a-fs-title. */
  --a-fs-xs: 11px;
  --a-fs-sm: 12px;
  --a-fs-md: 14px;
  --a-fs-lg: 16px;
  --a-fs-subtitle: 15px;
  --a-fs-title: 20px;
  --a-fs-display: 24px;

  /* コンポーネント寸法 */
  --a-control-height: 32px;
  --a-control-padding: var(--a-gap-1-5) var(--a-gap-3);
  --a-card-padding: var(--a-gap-4);
  --a-state-padding: var(--a-gap-6);
  --a-table-cell-padding: var(--a-gap-2);
  --a-table-compact-cell-padding: var(--a-gap-1) var(--a-gap-2);
  --a-table-empty-padding: var(--a-gap-4) var(--a-gap-2);

  /* 影 / 重なり */
  --a-shadow: 0 16px 40px rgb(17 24 39 / 18%);
  --a-z-header: 100;
  --a-z-drawer: 400;
  --a-z-scrim: 300;
  --a-z-sheet: 500;
  --a-z-dialog: 600;
  --a-z-toast: 700;

  /* レイアウト */
  --a-header-offset: 78px;  /* sticky ヘッダー高さ (左索引の sticky top 等の基準) */
  --a-content-max: 1280px;  /* コンテンツ最大幅 (会員ページ新UIで中央寄せ。将来は全ページ展開) */

  /* フォーカス (キーボード操作の可視リング。WCAG 2.4.7 / アクセシビリティの基本) */
  --a-focus: var(--a-selection-stroke);
  --a-focus-ring: 0 0 0 3px color-mix(in srgb, var(--a-focus) 42%, transparent);

  /* レスポンシブ ブレークポイント (px値を1か所に集約。各ページの @media と揃える基準) */
  --a-bp-sm: 600px;   /* スマホ */
  --a-bp-md: 900px;   /* タブレット (2カラム→1カラムの境界に多用) */
  --a-bp-lg: 1101px;  /* PC (左索引2カラムが立つ境界) */

  /* ガラスUI (グラスモーフィズム) トークン — 2026-06-27 導入。
     モック画像のクリーム地ヘッダー + 磨りガラス質感を再現。ブランド黄(--a-accent)は
     ガラス化せず不透明維持(可読性死守)。blur は構造面(ヘッダー/.a-glass外枠/モーダル/
     フロート)限定で、密なテーブル・カレンダーには絶対に乗せない(sticky見出し破壊と性能のため)。
     progressive enhancement: デフォルトは *-solid 不透明、@supports で半透明+blur に昇格。 */
  /* レイヤードフラット (2026-07-04 リデザイン): ガラス(半透明/blur)を廃し、不透明面 +
     可視罫線 + 境界を示す控えめな影に置換。旧 --a-glass-* トークン名は各所の参照を保つため
     残置し、値だけをソリッド/高コントラストに差し替える(名前互換で全画面が同時に改善)。 */
  --a-bg-gradient: none;                          /* 背景グラデ廃止。--a-bg のフラット地に統一 */
  --a-glass-header: var(--a-surface);            /* ヘッダー地 (不透明白。旧クリーム半透明を廃止) */
  --a-glass-header-solid: var(--a-surface);      /* ヘッダー フォールバック(=白) */
  --a-glass-header-border: var(--a-line);        /* ヘッダー下端 可視罫線 */
  --a-glass-header-ink: var(--a-text);           /* 白地の文字 (約14:1 AAA) */
  --a-glass-card: var(--a-surface);              /* カード 不透明白 */
  --a-glass-card-solid: var(--a-surface);        /* カード フォールバック(=白) */
  --a-glass-border: var(--a-line);               /* カード/モーダル 可視罫線 (旧 白半透明→--a-line) */
  --a-glass-border-soft: color-mix(in srgb, var(--a-line) 70%, transparent); /* 補助hairline */
  --a-glass-modal: var(--a-surface);             /* モーダル 不透明白 */
  --a-glass-modal-solid: var(--a-surface);       /* モーダル フォールバック */
  --a-glass-float: var(--a-surface);             /* フロート 不透明白 */
  --a-glass-float-solid: var(--a-surface);       /* フロート フォールバック */
  --a-glass-highlight: none;                     /* 内側ハイライト廃止(フラット化。立体は境界と影で表現) */
  --a-glass-shadow-card: 0 1px 2px rgba(17, 17, 17, 0.04), 0 2px 8px rgba(17, 17, 17, 0.06); /* カード境界を示す控えめな影 */
  --a-glass-shadow-modal: 0 12px 40px rgba(17, 17, 17, 0.2), 0 2px 8px rgba(17, 17, 17, 0.12); /* モーダルは前面なので強め */
  --a-glass-overlay: rgba(17, 17, 17, 0.42);     /* モーダル背面の暗幕 (フラット化で少し濃く=前面を際立てる) */
  --a-blur-header: 0px;   /* blur 廃止 */
  --a-blur-card: 0px;     /* blur 廃止 */
  --a-blur-modal: 0px;    /* blur 廃止 */
  --a-blur-float: 0px;    /* blur 廃止 */
  --a-blur-sat: 100%;     /* saturate なし */
}

/* キーボードフォーカスの可視リング (マウスclickでは出さず :focus-visible のみ)。
   操作可能要素 (.a-btn / タブ / 入力 / リンク / モジュール内の裸 button) に共通で当てる。
   WCAG 2.4.7 準拠の土台。裸 button(各 .admin-*-actions の操作ボタン等)もキーボード
   フォーカスでリングが見えるよう .admin-module-panel button を対象に含める。 */
.admin-page .a-btn:focus-visible,
.admin-page .a-tab:focus-visible,
.admin-page .sales-v2-tabs button:focus-visible,
.admin-page .management-quick-action:focus-visible,
.admin-page .store-hub-card:focus-visible,
.admin-page .admin-module-panel button:focus-visible,
.admin-page input:focus-visible,
.admin-page select:focus-visible,
.admin-page textarea:focus-visible {
  outline: 2px solid var(--a-focus) !important;
  outline-offset: 1px;
  box-shadow: var(--a-focus-ring);
}

/* --------------------------------------------------------------------------
   admin 見出し階層 (2026-06-13 一箇所に集約)。styles.css 側の散在した h2/h3/h4 調整に
   カスケード順で勝つよう .admin-spa-shell スコープで定義。視覚階層をここで一元管理する。
   -------------------------------------------------------------------------- */
.admin-spa-shell .admin-module-panel h3 {
  font-size: var(--a-fs-lg);
  font-weight: 700;
  color: var(--a-text);
  margin: 0;
  line-height: 1.3;
}
.admin-spa-shell .admin-module-panel h4,
.admin-spa-shell .admin-module-panel .admin-subhead {
  font-size: var(--a-fs-md);
  font-weight: 700;
  color: var(--a-text);
  line-height: 1.3;
}
.admin-spa-shell .admin-module-panel .admin-card-note {
  font-size: var(--a-fs-sm);
  color: var(--a-text-muted);
  line-height: 1.5;
}

/* --------------------------------------------------------------------------
   ボタン: .a-btn (基本) + 修飾 (.a-btn-primary / .a-btn-danger / .a-btn-ghost)
   Phase4 で既存ボタンを順次この語彙へ移行する。
   -------------------------------------------------------------------------- */
/* .admin-page .admin-module-panel まで前置 + !important で styles.css の黒ベタ button
   救済セレクタに勝たせ、.a-btn 本来の見た目 (白地+黒枠の押せるボタン) を保証する
   (救済に負けて黒ベタ化していた = .sales-v2-tabs 等と同じ specificity 対策)。 */
.a-btn,
.admin-page .admin-module-panel .a-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--a-gap-1);
  padding: 6px 12px;
  font-size: var(--a-fs-sm);
  font-weight: 600;
  line-height: 1.2;
  border: 1px solid var(--a-ink) !important;
  border-radius: var(--a-radius-sm);
  background: var(--a-surface) !important;
  color: var(--a-ink) !important;
  cursor: pointer;
  transition: filter 0.12s ease, background 0.12s ease;
}
.a-btn:hover, .admin-page .admin-module-panel .a-btn:hover { filter: brightness(0.96); }
.a-btn:active, .admin-page .admin-module-panel .a-btn:active { filter: brightness(0.9); } /* 押下 */
.a-btn:disabled, .a-btn.is-busy { opacity: 0.55; cursor: not-allowed; }
.a-btn-primary, .admin-page .admin-module-panel .a-btn-primary { background: var(--a-accent) !important; color: var(--a-accent-ink) !important; border-color: var(--a-accent) !important; }
.a-btn-danger, .admin-page .admin-module-panel .a-btn-danger { background: var(--a-surface) !important; border-color: var(--a-danger) !important; color: var(--a-danger) !important; }
.a-btn-danger:hover, .admin-page .admin-module-panel .a-btn-danger:hover { background: var(--a-danger-bg) !important; }
.a-btn-ghost, .admin-page .admin-module-panel .a-btn-ghost { border-color: var(--a-line) !important; color: var(--a-text-muted) !important; }
/* 行内アクション等の小サイズ修飾 (予約リストの「カルテ」「会員登録」が実適用第一号) */
.a-btn-xs { padding: 2px 8px; font-size: var(--a-fs-xs); }
.a-link-button,
.admin-page .admin-module-panel button.a-link-button {
  appearance: none !important;
  display: inline !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  color: var(--a-text) !important;
  font: inherit;
  font-size: var(--a-fs-md);
  font-weight: 600;
  text-align: inherit;
  text-decoration: underline;
  cursor: pointer;
  box-shadow: none !important;
}
.a-link-button:hover,
.admin-page .admin-module-panel button.a-link-button:hover { text-decoration: none; }
.a-link-button-xs,
.admin-page .admin-module-panel button.a-link-button-xs {
  padding-top: var(--a-gap-1) !important;
  color: var(--a-ink) !important;
  font-size: var(--a-fs-xs);
  font-weight: 700;
}

/* 説明文は通常時に画面へ出さず、近くの ? から必要時だけ読む。 */
.admin-help {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin-left: 3px;
  vertical-align: middle;
  z-index: 20;
}
.admin-page .admin-help-trigger,
.admin-page .admin-module-panel .admin-help-trigger {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto !important;
  width: 13px !important;
  min-width: 13px !important;
  height: 13px !important;
  min-height: 13px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid currentColor !important;
  border-radius: var(--a-radius-pill) !important;
  background: transparent !important;
  color: var(--a-text-muted) !important;
  font-family: inherit;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  cursor: help;
  box-shadow: none !important;
  opacity: 0.72;
}
.admin-page .admin-help-trigger:hover,
.admin-help.is-open .admin-help-trigger {
  color: var(--a-ink) !important;
  background: transparent !important;
  opacity: 1;
}
.admin-page .admin-help-trigger:focus-visible {
  color: var(--a-ink) !important;
  background: transparent !important;
  opacity: 1;
  outline: 2px solid var(--a-ink);
  outline-offset: 2px;
  box-shadow: var(--a-focus-ring) !important;
}
.admin-help-popover {
  position: absolute;
  top: calc(100% + var(--a-gap-1));
  left: 0;
  width: max-content;
  max-width: min(320px, calc(100vw - 24px));
  padding: var(--a-gap-2) var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-text);
  box-shadow: var(--a-shadow);
  font-family: inherit;
  font-size: var(--a-fs-sm);
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0;
  text-align: left;
  white-space: normal;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-2px);
  transition: opacity .12s ease, transform .12s ease, visibility .12s ease;
}
.admin-help.is-flipped .admin-help-popover {
  right: 0;
  left: auto;
}
.admin-help:hover .admin-help-popover,
.admin-help:focus-within .admin-help-popover,
.admin-help.is-open .admin-help-popover {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

/* Admin modal action footer: body直下の <dialog> は .admin-module-panel 外なので、
   古い .dialog-actions の2カラム灰色ボタンをここで admin の役割別ボタンへ統一する。 */
.admin-page.admin-spa-shell dialog .dialog-actions {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--a-gap-2);
  margin-top: var(--a-gap-6) !important;
  padding-top: var(--a-gap-3);
  border-top: 1px solid var(--a-line);
}
.admin-page.admin-spa-shell dialog .dialog-actions button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: var(--a-gap-1);
  flex: 0 0 auto;
  width: auto !important;
  min-width: 104px;
  min-height: 34px;
  margin: 0 !important;
  padding: var(--a-gap-2) var(--a-gap-4);
  border: 1px solid var(--a-line) !important;
  border-radius: var(--a-radius-sm);
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  font-family: inherit;
  font-size: var(--a-fs-sm);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
  cursor: pointer;
  transition: filter 0.12s ease, background 0.12s ease, border-color 0.12s ease;
}
.admin-page.admin-spa-shell dialog .dialog-actions button:hover {
  filter: brightness(0.96);
}
.admin-page.admin-spa-shell dialog .dialog-actions button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  filter: none;
}
.admin-page.admin-spa-shell dialog .dialog-actions button[hidden] {
  display: none !important;
}
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-danger {
  border-color: var(--a-danger) !important;
  background: var(--a-surface) !important;
  color: var(--a-danger) !important;
}
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-danger:hover {
  background: var(--a-danger-bg) !important;
  filter: none;
}

/* --------------------------------------------------------------------------
   2026-06-14 ボタン統一: admin パネル内の汎用 <button> を1つのトークン基準の見た目へ。
   styles.css に散在する黒/黄グラデ/最小幅128px 等のバラバラな button 規則を、
   admin.css が後勝ちするカスケード順で上書きして「黒プライマリ」に統一する。
   - 既に .a-btn 系を付けたボタン (列設定/チケット/削除等) は除外 (:not) して二重定義を避ける。
   - カレンダー (schedule) は独自コントロール群のため対象外。
   - 破壊操作 (.a-btn-danger) とトグル類 (.is-active) は各自の見た目を保つ。
   -------------------------------------------------------------------------- */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) button:not([class*="a-btn"]):not(.a-link-button):not(.a-tab):not(.admin-toggle):not(.admin-help-trigger):not([data-admin-tab]) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--a-gap-1);
  width: auto;
  min-width: 0;
  min-height: 32px;
  padding: 6px 14px;
  font-size: var(--a-fs-sm);
  font-weight: 600;
  line-height: 1.2;
  border: 1px solid var(--a-ink);
  border-radius: var(--a-radius-sm);
  background: var(--a-ink);
  color: var(--a-surface);
  cursor: pointer;
  transition: filter 0.12s ease, background 0.12s ease;
  letter-spacing: normal;
}
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) button:not([class*="a-btn"]):not(.a-link-button):not(.a-tab):not(.admin-toggle):not(.admin-help-trigger):not([data-admin-tab]):hover {
  filter: brightness(1.15);
  background: var(--a-ink);
}
.admin-spa-shell .admin-module-panel button:not([class*="a-btn"]):disabled {
  opacity: 0.45;
  cursor: not-allowed;
  filter: none;
}
/* 予約リスト行末のアクション列 (中身が無い行もあるため列幅は最小に) */
.admin-row-action-col { width: 1%; }
.admin-row-action-cell { white-space: nowrap; text-align: right; }

/* --------------------------------------------------------------------------
   予約リスト 列カスタマイズ (SRパリティ A6): 列設定ポップオーバー / 並び替え /
   枠ブロック灰色行。既定状態 (設定なし) では従来と見た目が変わらないこと。
   -------------------------------------------------------------------------- */
.admin-list-tools { display: flex; align-items: center; gap: var(--a-gap-2); }
.admin-list-config { position: relative; }
.admin-list-config-pop {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 30;
  min-width: 200px;
  padding: var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface);
  box-shadow: var(--a-shadow);
  text-align: left;
}
.admin-list-config-title {
  margin: 0 0 var(--a-gap-2);
  font-size: var(--a-fs-xs);
  font-weight: 700;
  color: var(--a-text-muted);
}
.admin-list-config-item {
  display: flex;
  align-items: center;
  gap: var(--a-gap-2);
  padding: 2px 0;
  font-size: var(--a-fs-sm);
  color: var(--a-text);
  cursor: pointer;
  user-select: none;
}
.admin-list-config-item input[type="checkbox"] { margin: 0; }
.admin-list-config-sep {
  margin: var(--a-gap-2) 0;
  border: 0;
  border-top: 1px solid var(--a-line);
}
.admin-list-config-note {
  margin: var(--a-gap-2) 0 0;
  font-size: var(--a-fs-xs);
  color: var(--a-text-muted);
}
/* 並び替え可能ヘッダ: クリック可の手がかりはカーソルのみ (既定の見た目を変えない) */
.admin-table th[data-list-sort] { cursor: pointer; user-select: none; }
.admin-sort-mark { margin-left: 2px; font-size: var(--a-fs-xs); }
/* 枠ブロック/SRロックの灰色行 (showBlocks ON のときのみ出現) */
.admin-table .admin-row-block td { background: var(--a-bg); color: var(--a-text-muted); }
.admin-block-status { font-size: var(--a-fs-xs); color: var(--a-text-muted); }

/* 予約編集ダイアログのフッター行アクション (カルテ/会員登録) */
.schedule-edit-customer-action { display: flex; justify-content: flex-end; margin-top: var(--a-gap-2); }

/* 会員登録ダイアログの「予約から作成」コンテキスト表示 */
.customer-create-context {
  margin: var(--a-gap-2) 0 0;
  padding: 4px 8px;
  font-size: var(--a-fs-sm);
  color: var(--a-text-muted);
  background: var(--a-bg);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
}

/* 会員 詳細検索 (SRパリティ B2): 既存フィルタ行の下の折りたたみ。既定は閉。 */
.customer-advanced-search {
  margin: 0 0 var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
}
.customer-advanced-search > summary {
  display: flex;
  align-items: center;
  gap: var(--a-gap-2);
  padding: 6px 10px;
  font-size: var(--a-fs-sm);
  font-weight: 600;
  color: var(--a-text-muted);
  cursor: pointer;
  user-select: none;
}
.customer-advanced-search[open] > summary {
  color: var(--a-text);
  border-bottom: 1px dashed var(--a-line);
}
.customer-advanced-badge {
  display: inline-flex;
  align-items: center;
  padding: 1px 8px;
  border-radius: var(--a-radius-pill);
  background: var(--a-accent);
  color: var(--a-accent-ink);
  font-size: var(--a-fs-xs);
  font-weight: 700;
}
.customer-advanced-body {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--a-gap-3);
  padding: var(--a-gap-2) 10px;
}
.customer-advanced-field {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-2);
  font-size: var(--a-fs-sm);
  font-weight: 600;
  color: var(--a-text);
  white-space: nowrap;
}
.customer-advanced-field select,
.customer-advanced-field input[type="date"] {
  min-height: 32px;
  padding: 0 8px;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  font-size: var(--a-fs-sm);
  font-weight: 600;
}
.customer-advanced-tilde { color: var(--a-text-muted); }

/* 処理中スピナー (saveRemote が .is-busy を付ける) */
.a-btn.is-busy::after {
  content: "";
  width: 11px;
  height: 11px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: a-spin 0.7s linear infinite;
}
@keyframes a-spin { to { transform: rotate(360deg); } }

/* --------------------------------------------------------------------------
   フィールド / フォーム
   -------------------------------------------------------------------------- */
.a-field,
.admin-page .admin-module-panel .a-field {
  display: grid;
  gap: var(--a-gap-1);
  min-width: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  font-weight: 600;
  line-height: 1.4;
}
.a-field > span,
.a-field-label,
.admin-page .admin-module-panel .a-field > span,
.admin-page .admin-module-panel .a-field-label {
  color: var(--a-text);
  font-size: var(--a-fs-xs);
  font-weight: 800;
  line-height: 1.4;
}
.a-control,
.a-field .a-control,
.admin-page .admin-module-panel .a-control,
.admin-page .admin-module-panel .a-field .a-control {
  width: 100%;
  min-height: var(--a-control-height);
  box-sizing: border-box;
  padding: var(--a-control-padding);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-ink);
  font: inherit;
}
textarea.a-control,
.a-field textarea.a-control {
  min-height: calc(var(--a-control-height) * 2);
  resize: vertical;
}
.a-control:disabled,
.admin-page .admin-module-panel .a-control:disabled {
  background: var(--a-surface-2);
  color: var(--a-text-muted);
  cursor: not-allowed;
}
.a-field-grid,
.admin-page .admin-module-panel .a-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--a-gap-3);
}
.a-field-wide,
.admin-page .admin-module-panel .a-field-wide {
  grid-column: 1 / -1;
}
.a-field-check,
.admin-page .admin-module-panel .a-field-check {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-2);
  min-width: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  font-weight: 600;
  line-height: 1.4;
}
.a-field-help {
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.5;
}
.a-field-error,
.admin-page .form-error {
  grid-column: 1 / -1;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  color: var(--a-danger);
  font-size: var(--a-fs-xs);
  font-weight: 700;
  line-height: 1.5;
}
.a-field-error:empty,
.admin-page .form-error:empty {
  display: none;
}
.admin-page .admin-login-card .a-field {
  gap: var(--a-gap-1);
  font-family: inherit;
  font-size: var(--a-fs-sm);
  font-weight: 700;
  color: var(--a-text-muted);
}
.admin-page .admin-login-card .a-field > span {
  color: var(--a-text);
  font-size: var(--a-fs-xs);
  font-weight: 800;
}
.admin-page .admin-login-card .a-control {
  width: 100%;
  min-height: var(--a-control-height);
  padding: var(--a-control-padding);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-ink);
}
.admin-page .admin-login-card .a-btn {
  display: inline-flex;
  width: 100%;
  min-height: var(--a-control-height);
  padding: var(--a-control-padding);
  border-radius: var(--a-radius-sm);
  font-weight: 800;
}
.admin-page .modal-check-form .a-field {
  gap: var(--a-gap-1);
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  font-weight: 700;
  line-height: 1.4;
}
.admin-page .modal-check-form .a-field > span {
  color: var(--a-text);
  font-size: var(--a-fs-xs);
  font-weight: 800;
}
.admin-page .modal-check-form .a-control {
  width: 100%;
  min-height: var(--a-control-height);
  box-sizing: border-box;
  padding: var(--a-control-padding);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-ink);
  font: inherit;
  outline: none;
}
.admin-page .modal-check-form .a-field-grid {
  gap: var(--a-gap-3);
}

@media (max-width: 640px) {
  .a-field-grid,
  .admin-page .admin-module-panel .a-field-grid {
    grid-template-columns: 1fr;
  }
}

/* --------------------------------------------------------------------------
   カード / 空状態 / バッジ
   -------------------------------------------------------------------------- */
.a-card {
  background: var(--a-surface);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  padding: var(--a-card-padding);
}

.a-state {
  margin: 0;
  padding: var(--a-gap-3);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface-2);
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  line-height: 1.5;
}
.a-state-empty,
.a-empty {
  padding: var(--a-state-padding);
  text-align: center;
  color: var(--a-text-muted);
  font-size: var(--a-fs-md);
  background: transparent;
}
.a-state-compact {
  padding: var(--a-gap-3);
  font-size: var(--a-fs-sm);
}
.a-state small {
  display: block;
  margin-top: var(--a-gap-1);
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.5;
}
.a-state-loading { color: var(--a-text-muted); }
.a-state-error {
  background: var(--a-danger-bg);
  color: var(--a-danger);
}
/* 状態メッセージに「再読み込み」等のインラインボタンを横並びにするときの行レイアウト。
   旧 .customer-photo-empty が担っていた flex 配置を共有 state 語彙へ移したもの。 */
.a-state-inline {
  display: flex;
  align-items: center;
  gap: var(--a-gap-2);
  flex-wrap: wrap;
}
.a-state-warning {
  background: var(--a-warn-bg);
  color: var(--a-warn);
}
.a-state-success {
  background: var(--a-ok-bg);
  color: var(--a-ok);
}
.a-table-wrap {
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
}
.a-table {
  width: 100%;
  border-collapse: collapse;
}
.a-table th,
.a-table td {
  padding: var(--a-table-cell-padding);
  border-bottom: 1px solid var(--a-line);
  text-align: left;
  font-weight: 800;
}
.a-table th {
  background: var(--a-ink);
  color: var(--a-surface);
  position: sticky;
  top: 0;
  z-index: 1;
}
.a-table select {
  min-height: var(--a-control-height);
  border: 1px solid var(--a-line);
  font-weight: 900;
}
.a-table input {
  min-height: var(--a-control-height);
  border: 1px solid var(--a-line);
  padding: 0 var(--a-gap-2);
  font-weight: 800;
}
.a-table th[data-list-sort] {
  cursor: pointer;
  user-select: none;
}
.a-table-compact th,
.a-table-compact td {
  padding: var(--a-table-compact-cell-padding);
  font-size: var(--a-fs-xs);
}
.admin-page .admin-module-panel .a-table-empty,
.admin-page .admin-module-panel .admin-empty-row {
  padding: var(--a-table-empty-padding);
  text-align: center;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  line-height: 1.5;
}
.admin-page .admin-module-panel .a-table-note-row,
.admin-page .admin-module-panel .admin-body-empty {
  padding: var(--a-table-empty-padding);
  text-align: center;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  line-height: 1.5;
}
.admin-page .admin-module-panel .a-table-note-row {
  background: var(--a-surface-2);
  font-size: var(--a-fs-xs);
}

/* --------------------------------------------------------------------------
   2026-06-14 カード洗練化: styles.css の .admin-card は重い拡散シャドウ
   (0 18px 52px) で浮いた印象。細い罫線 + 控えめなシャドウ + トークン角丸の
   「締まった」カードに統一 (全ページ共通)。
   -------------------------------------------------------------------------- */
.admin-spa-shell .admin-card {
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 1px rgba(0, 0, 0, 0.04);
}
/* DESIGN.md L110: avoid nested cards. v2 feature-layout パネルの外側ラッパー
   .admin-card は、内側に枠付きの featurev2-summary aside / customer-v2-card タイルを
   抱える「レイアウト帯」にすぎない。外側1段だけ脱枠して surface-on-surface の二重枠を解消し、
   内側カードの枠だけを残す(.admin-payment-card と同じ手筋)。padding は内側 .admin-feature-layout
   の grid gap が内部余白を供給するため除去。:has() は admin.css:642 に既存前例あり。 */
.admin-spa-shell .admin-card:has(> .admin-feature-layout) {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0 !important;
}
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) .admin-card:has(> .admin-feature-layout) {
  padding: 0 !important;
}
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) .admin-card:has(> .admin-feature-layout) > .admin-feature-layout {
  margin-top: 0 !important;
}
/* ダッシュボードの KPI カード (admin-stats article) も同じトーンに */
.admin-spa-shell .admin-stats article {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
}
/* カード内ラベルの極太 (font-weight:900) を程よい太さに (可読性・洗練) */
.admin-spa-shell .admin-card label { font-weight: 600; }
.a-badge,
.admin-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 1px 8px;
  border-radius: var(--a-radius-pill);
  font-size: var(--a-fs-xs);
  font-weight: 600;
  vertical-align: middle;
}
.a-badge-pending,
.admin-status-badge.is-pending {
  background: var(--a-warn-bg);
  color: var(--a-warn);
  border: 1px solid currentColor;
}
.a-badge-ok,
.a-badge-active,
.admin-status-badge.is-ok,
.admin-status-badge.is-active {
  background: var(--a-ok-bg);
  color: var(--a-ok);
  border: 1px solid currentColor;
}
.a-badge-error,
.admin-status-badge.is-error {
  background: var(--a-danger-bg);
  color: var(--a-danger);
  border: 1px solid currentColor;
}
.a-badge-muted,
.a-badge-readonly,
.admin-status-badge.is-readonly {
  background: var(--a-surface-2);
  color: var(--a-text-muted);
  border: 1px solid currentColor;
}

/* --------------------------------------------------------------------------
   チケット回数券 (SRパリティ D2): 売上>チケット + カルテ残数
   -------------------------------------------------------------------------- */
.admin-subhead { margin: var(--a-gap-4) 0 var(--a-gap-2); font-size: var(--a-fs-md); }
.admin-table tr.admin-row-muted td { opacity: 0.55; }
.customer-ticket-section { margin-top: var(--a-gap-3); }
.customer-ticket-section h4 { display: flex; align-items: center; gap: var(--a-gap-2); flex-wrap: wrap; }
.customer-ticket-history article {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px 0;
  border-bottom: 1px solid var(--a-border);
  font-size: var(--a-fs-sm);
}
.customer-ticket-history article span { color: var(--a-text-muted); }

/* --------------------------------------------------------------------------
   共通シェルヘッダー (Phase3a: 現在地ラベル / 独立通知ベル / ナビ視認性)
   admin.css は styles.css より後に読むため、同詳細度ならこちらが勝つ。
   -------------------------------------------------------------------------- */
/* (現在地ラベルはオーナー指定で撤去 — 現在地はタブタイトルとナビ強調で示す。2026-06-11) */
/* 通知ベル: ログイン名の左側に置く。右側ユーザー操作群と同じ中心線で揃える。 */
.admin-shell-bell {
  flex: 0 0 auto;
  margin-left: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--a-gap-1);
  height: 34px;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid color-mix(in srgb, var(--a-surface) 38%, transparent);
  border-radius: var(--a-radius-pill);
  background: transparent;
  color: var(--a-surface);
  font-size: var(--a-fs-sm);
  cursor: pointer;
}
.admin-shell-bell:hover { background: color-mix(in srgb, var(--a-surface) 12%, transparent); }
.admin-shell-bell-count {
  min-width: 18px;
  padding: 0 5px;
  border-radius: var(--a-radius-pill);
  background: var(--a-danger);
  color: var(--a-surface);
  font-size: var(--a-fs-xs);
  font-weight: 700;
  text-align: center;
}
.admin-header-status { display: inline-flex; align-items: center; gap: var(--a-gap-2); }
.admin-header-location {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-1);
  margin-left: var(--a-gap-3);
  padding: 3px var(--a-gap-2);
  border-left: 1px solid color-mix(in srgb, var(--a-surface) 28%, transparent);
  color: color-mix(in srgb, var(--a-surface) 82%, transparent);
  font-size: var(--a-fs-sm);
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.2;
  white-space: nowrap;
}
/* 共通ヘッダー: ロゴと縦幅を少し抑え、ナビは通常1行・増えたら自然に2行へ。 */
.admin-spa-shell .admin-shell-header {
  gap: 8px;
  min-height: 72px;
  padding: 7px 14px;
  flex-wrap: nowrap;
  align-items: center;
}
.admin-spa-shell .admin-shell-header > .brand,
.admin-spa-shell .admin-shell-header > .member-brand,
.admin-spa-shell .admin-shell-header > .admin-global-nav,
.admin-spa-shell .admin-shell-header > .admin-header-status {
  align-self: center;
}
.admin-spa-shell .admin-shell-header .brand,
.admin-spa-shell .admin-shell-header .member-brand {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex: 0 0 104px;
  min-width: 104px;
  line-height: 0;
}
.admin-spa-shell .admin-shell-header .brand img,
.admin-spa-shell .admin-shell-header .member-brand img {
  height: 50px;
  max-width: 104px;
  object-fit: contain;
}
.admin-spa-shell .admin-shell-header .admin-header-status {
  flex: 0 0 auto;
  gap: 8px;
  min-height: 34px;
  align-items: center;
}
.admin-spa-shell .admin-shell-header .admin-header-status p {
  max-width: 148px;
  margin: 0;
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.admin-spa-shell .admin-shell-header .admin-header-status strong {
  display: inline-flex;
  align-items: center;
  font-size: var(--a-fs-xs);
  line-height: 1.2;
}
.admin-spa-shell .admin-shell-header .admin-header-logout,
.admin-spa-shell .admin-shell-header .member-logout {
  height: 34px;
  min-height: 34px;
  padding: 0 10px;
  font-size: var(--a-fs-xs);
  line-height: 1.2;
}
/* ナビ視認性: 10px の極小チップをやめ、読めるサイズ + グループ見出しの可視化 */
/* 2026-06-13 ナビ洗練化: 黒は維持。項目に少し余裕を持たせ、グループ間はグレーの
   極小ラベルではなく控えめな縦区切り線で分ける (ラベルの文字ノイズを排除し読みやすく)。 */
.admin-spa-shell .admin-global-nav {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
  row-gap: 4px;
  min-width: 280px;
}
.admin-spa-shell .admin-global-nav a {
  font-size: var(--a-fs-sm);
  min-height: 30px;
  padding: 5px 9px;
  color: color-mix(in srgb, var(--a-surface) 82%, transparent);
  transition: background 0.12s ease, color 0.12s ease;
}
.admin-spa-shell .admin-global-nav a:hover {
  color: var(--a-surface);
  background: color-mix(in srgb, var(--a-surface) 12%, transparent);
}
.admin-nav-group { display: inline-flex; align-items: center; gap: 1px; }
/* グループ見出しテキスト (::before) は廃止し、グループ間に縦区切り線を置く */
.admin-nav-group + .admin-nav-group {
  margin-left: 4px;
  padding-left: 5px;
  border-left: 1px solid color-mix(in srgb, var(--a-surface) 18%, transparent);
}
body:not([data-feature-build-mode="dev"]) #admin-global-nav [data-feature-release="v2"] {
  display: none !important;
}
.admin-spa-shell .admin-nav-break { display: none !important; }
.admin-nav-group[data-nav-group]::before { content: none; }  /* 旧グレーラベル無効化 */

.admin-local-login-note {
  margin: var(--a-gap-1) 0 0;
  padding: var(--a-gap-2) var(--a-gap-3);
  border: 1px solid color-mix(in srgb, var(--a-danger) 35%, transparent);
  border-radius: var(--a-radius-sm);
  background: color-mix(in srgb, var(--a-danger-bg) 70%, var(--a-surface));
  color: var(--a-danger);
  font-size: var(--a-fs-sm);
  line-height: 1.5;
}

/* --------------------------------------------------------------------------
   Phase4-1: 画面の自己説明性と移動コスト
   -------------------------------------------------------------------------- */
/* ヘッダー sticky 化: styles.css:10331 が position:relative に戻しており、
   長いページ (特に16セクションの設定ハブ) でスクロールするとナビが消えて
   モジュール間移動の戻りコストが大きかった。sticky なら fixed と違い
   コンテンツ重なりも起きない。背景は .admin-simple-header の黒(0.94)を継承 */
.admin-spa-shell .member-simple-header { position: sticky; top: 0; z-index: 320; }

/* モジュール見出しは表示しない (デザイン統一 2026-06: 上部余白をページ間で均一化)。
   従来は styles.css:10312 の display:none を後勝ちで復活させ「ナビ名=画面見出し」の
   一致を小見出しで示していたが、見出しがマークアップに有るページ(body/site/settings 等)と
   無いページ(schedule/customers/logs)で上部余白が 18px〜32px とバラつく原因になっていた。
   現在地はヘッダーのグローバルナビ強調 (.admin-global-nav a.is-active) で示すため、
   小見出しは出さず全ページを「見出しなし基準」に揃える。styles.css:10312 の
   display:none を最終勝者にする (この復活ブロックを撤去)。 */

/* 設定/スタッフ等の幅広テーブル (.admin-config-table min-width:1180px) が
   1.25倍率ノートPC幅で隣要素と重なる実測崩れの修正: 親ブロックを横スクロールに */
.admin-section-block:has(.admin-config-table) { overflow-x: auto; }
.admin-page.admin-spa-shell .admin-module-panel .admin-section-block > .admin-table-wrap + .admin-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: var(--a-gap-2);
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  margin-top: var(--a-gap-3);
}

/* --------------------------------------------------------------------------
   Phase4-3: カレンダー勤怠柱/チップ文字の可読性 (オーナー指摘)
   -------------------------------------------------------------------------- */
/* 時間ラベル: 旧実装は absolute + rotate(90deg) + 固定オフセット (top:32px) で、
   テキストが長いと回転ボックスの上半分が柱の上端からはみ出て先頭が欠けていた
   (例「10:00-20:00」が「:00-20:00」に見える)。名前の下に縦書きで自然に積む配置へ変更。
   柱は grid (name auto / time auto / 余白 1fr) なので衝突も切れも起きない */
/* 柱を flex 縦積みにして名前と時間の重なりを構造的に不可能にする
   (旧実装は名前 strong が position:absolute; top:2px の白背景チップで柱上端に固定され、
   下の時間ラベルの先頭文字を覆い隠していた — 実測で確認) */
.admin-attendance-pillar {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}
/* styles.css:10621 の最終パッチが .admin-spa-shell 詳細度 + !important で
   strong を absolute 固定しているため、同詳細度 + !important で中和する。
   relative なのは: 通常フロー (flex縦積みで時間と重ならない) を保ちつつ、
   absolute な色ライン (::before) より上に描画する z-index を効かせるため */
.admin-spa-shell .admin-attendance-pillar strong,
.admin-attendance-pillar strong {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  /* margin-top 0: ラインの一番上は名前。上に隙間があるとラインが覗く */
  margin: 0 auto !important;
  z-index: 2 !important;
  flex: 0 0 auto;
}
.admin-spa-shell .admin-attendance-time,
.admin-attendance-time {
  position: relative; /* 通常フロー + 色ライン(::before)より上に乗せる */
  top: auto !important; /* パッチ層 (.admin-spa-shell 詳細度) の top:44px !important を中和 */
  left: auto;
  transform: none;
  z-index: 2;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  margin: 4px auto 0;
  /* 対称パディング。ピクセル実測 (work/measure-ink.js) で回転数字のインクは
     対称パディング時に軸との差 0.1px 未満 = 補正不要と確認済み */
  padding: 3px 1px;
  font-size: 11px;
  background: var(--a-surface); /* 不透明: 半透明だと背後の色ラインが透けて文字が見にくい */
  border-radius: 3px;
  flex: 0 0 auto;
  align-self: center;
}
/* 名前チップも不透明に (ラインの透け対策)。
   パディング非対称はピクセル実測値による補正: upright 縦書きの漢字インクは
   軸より +2.1px 右に出る (DPR 3 / 1.25 とも同値) ため、右パディングを4px厚くして
   インク重心を軸に戻す */
.admin-spa-shell .admin-attendance-pillar strong,
.admin-attendance-pillar strong {
  background: var(--a-surface) !important;
  align-self: center;
  padding: 2px 5px 2px 1px !important;
  border-radius: 3px;
}
/* 色ラインの正準実装: ::before (絶対配置・left:50%補正) は廃止し、
   共有レンダラーが出力する実子要素 .admin-attendance-line に一本化。
   名前/時間チップと同じ flex の align-items:center で揃うため、
   「ラインと文字の軸ずれ」がどの環境 (DPRやズーム差含む) でも構造的に起こらない */
.admin-spa-shell .admin-attendance-pillar::before,
.admin-attendance-pillar::before {
  content: none !important;
}
.admin-attendance-line {
  flex: 1 1 auto;
  width: 7px;
  min-height: 6px;
  margin-top: 4px;
  background: var(--attendance-color, var(--a-ok));
  border-radius: 0 0 3px 3px;
}
/* (フチ取りはオーナー確認の結果ボツ — ぼやけて逆効果のため撤去。2026-06-11) */

/* --------------------------------------------------------------------------
   トースト (AliveShared.toast)
   保存3原則の「業務データ=即時保存+トースト」のフィードバック面。
   -------------------------------------------------------------------------- */
#a-toast-host {
  position: fixed;
  right: var(--a-gap-4);
  bottom: var(--a-gap-4);
  display: grid;
  gap: var(--a-gap-2);
  z-index: var(--a-z-toast);
}
.a-toast {
  display: flex;
  align-items: center;
  gap: var(--a-gap-2);
  max-width: 360px;
  padding: 10px 14px;
  border-radius: var(--a-radius);
  background: var(--a-ink);
  color: var(--a-surface);
  font-size: var(--a-fs-md);
  box-shadow: var(--a-shadow);
  animation: a-toast-in 0.18s ease;
}
.a-toast.is-success { background: var(--a-ok); }
.a-toast.is-error { background: var(--a-danger); }
@keyframes a-toast-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* --------------------------------------------------------------------------
   共通確認ダイアログ (AliveShared.confirmDialog)
   削除確認は今後これ1種に統一する (native confirm / 確認なし即削除の廃止)。
   -------------------------------------------------------------------------- */
.a-confirm {
  border: none;
  border-radius: var(--a-radius);
  padding: 0 !important;
  max-width: 420px;
  width: calc(100vw - 48px);
  box-shadow: var(--a-shadow);
}
.a-confirm::backdrop { background: rgba(0, 0, 0, 0.45); }
.a-confirm-body { padding: var(--a-gap-6) var(--a-gap-6) var(--a-gap-4); }
.a-confirm-body h2 { margin: 0 0 var(--a-gap-2); font-size: var(--a-fs-lg); color: var(--a-text); }
.a-confirm-body p { margin: 0; font-size: var(--a-fs-md); color: var(--a-text-muted); white-space: pre-wrap; }
.a-confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--a-gap-2);
  padding: 0 var(--a-gap-6) var(--a-gap-6);
}

/* --------------------------------------------------------------------------
   ホームのカレンダー (共有レンダラーの readonly 2日版)
   構造・クラスはカレンダーページと同一 (renderCalendarGrid)。ホームはカード内に
   収めるため、スロット高さだけ少しコンパクトにする (styles.css は触らない方針)。
   -------------------------------------------------------------------------- */
.admin-schedule.is-dashboard {
  --calendar-slot-height: 64px;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-view-tabs button.is-active {
  border-color: var(--a-accent) !important;
  background: var(--a-accent) !important;
  color: var(--a-accent-ink) !important;
}

/* --------------------------------------------------------------------------
   枠ブロック (type:"block") / SRロック枠の灰色チップ
   斜線パターンで「塞がっている」感を出し、トレーナー色は左ボーダーに薄く残す。
   共有レンダラー (admin-schedule-rules.js renderReservationEvent) が出力する。
   -------------------------------------------------------------------------- */
.admin-event.is-block {
  border-left-color: var(--trainer-color, var(--a-text-muted));
  border-left-color: color-mix(in srgb, var(--trainer-color, var(--a-text-muted)) 45%, var(--a-surface));
  background: repeating-linear-gradient(
    -45deg,
    var(--a-line),
    var(--a-line) 4px,
    var(--a-surface-2) 4px,
    var(--a-surface-2) 8px
  );
  box-shadow: none;
}
.admin-event.is-block span,
.admin-event.is-block small {
  color: var(--a-text-muted);
}
/* ロック枠 (SR同期が正本) は操作対象外 — つかめる見た目にしない */
.admin-event.is-block.is-lock {
  cursor: default;
}

/* --------------------------------------------------------------------------
   勤怠ダイアログの種別トグル (勤怠 / 予約 / 枠ブロック)
   -------------------------------------------------------------------------- */
/* 勤怠ダイアログの登録種別は共有セグメント部品(.a-segment / .a-segment-button)に
   一本化した。ボタンのベース/ホバー/選択中(黒地)は共有ルールが担う。ここでは
   ダイアログ内で3択を等幅に並べたいレイアウト差分だけを残す(共有 .a-segment の
   inline-flex を上書きするため dialog スコープと同等の詳細度に揃える)。 */
.admin-page.admin-spa-shell dialog .attendance-kind-toggle.a-segment {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--a-gap-1);
}
.attendance-block-fields {
  display: grid;
  gap: var(--a-gap-2);
}

/* --------------------------------------------------------------------------
   予約種別 (繰り返し予約 / SRパリティ A17) のフォーム部品とプレビュー
   -------------------------------------------------------------------------- */
.attendance-resv-repeat-toggle {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  cursor: pointer;
}
.attendance-resv-repeat-toggle input {
  width: auto;
  margin: 0;
}
.attendance-resv-repeat-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--a-gap-2);
}
/* 位置/余白/背景の基礎は styles.css の共通ダイアログ群 (.attendance-dialog 等と同じ) */
.recurring-preview-dialog {
  width: min(480px, calc(100% - 28px));
  border-radius: var(--a-radius);
}
.recurring-preview-summary {
  margin: 4px 0 10px;
  font-size: var(--a-fs-md);
  font-weight: 900;
}
.recurring-preview-list {
  display: grid;
  gap: 4px;
  max-height: 320px;
  overflow-y: auto;
  margin: 0 0 12px;
  padding: 0;
  list-style: none;
}
.recurring-preview-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 10px;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  font-size: var(--a-fs-sm);
}
.recurring-preview-list li.is-conflict {
  border-color: var(--a-danger);
  background: var(--a-danger-bg);
}
.recurring-preview-date {
  font-weight: 900;
  white-space: nowrap;
}
.recurring-preview-ok {
  color: var(--a-text-muted);
  white-space: nowrap;
}
.recurring-preview-conflict {
  color: var(--a-danger);
  font-weight: 900;
  text-align: right;
}
.recurring-preview-skip-label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-weight: 700;
  cursor: pointer;
}
.recurring-preview-skip-label input {
  width: auto;
  margin: 0;
}
.recurring-preview-dialog .dialog-actions button[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}
/* 編集ダイアログのシリーズ一括削除ボタン (recurrenceId 持ちのみ表示) */
.schedule-edit-delete-series {
  width: 100%;
  margin: 2px 0 6px;
  min-height: 36px;
  border: 1px solid var(--a-danger);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-danger);
  font-weight: 900;
  cursor: pointer;
}

/* --------------------------------------------------------------------------
   セルフチェックイン (キオスク) モード — SRパリティ B12 (reception.html?mode=self)
   受付ボードの上に全画面で重ねる。大きな文字/ボタンでタブレット運用向け。
   色/余白/角丸は admin.css トークン語彙を使う (reception.html は admin.css を読込済み)。
   -------------------------------------------------------------------------- */
.reception-selfmode-toggle {
  padding: 8px 14px;
  font-size: var(--a-fs-md);
  font-weight: 700;
  border: 1px solid var(--a-accent);
  border-radius: var(--a-radius-sm);
  background: var(--a-accent);
  color: var(--a-accent-ink);
  cursor: pointer;
}
.reception-selfmode-toggle:hover { filter: brightness(0.96); }

.reception-kiosk-active { overflow: hidden; }

.reception-kiosk {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--a-gap-6);
  padding: var(--a-gap-6);
  background: var(--a-ink);
  color: var(--a-surface);
  text-align: center;
}
.reception-kiosk[hidden] { display: none; }

.reception-kiosk-main {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--a-gap-4);
  max-width: 560px;
  width: 100%;
}
.reception-kiosk-title {
  margin: 0;
  font-size: 36px;
  font-weight: 900;
  letter-spacing: 0.04em;
  color: var(--a-accent);
}
.reception-kiosk-camera {
  width: min(70vw, 360px);
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 4px solid var(--a-accent);
  border-radius: var(--a-radius);
  background: var(--a-ink-soft);
}
.reception-kiosk-camera video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.reception-kiosk-camera-note {
  margin: 0;
  font-size: var(--a-fs-lg);
  font-weight: 700;
  color: var(--a-accent);
}
.reception-kiosk-phone {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--a-gap-3);
  width: 100%;
  padding-top: var(--a-gap-4);
  border-top: 1px solid color-mix(in srgb, var(--a-surface) 25%, transparent);
}
.reception-kiosk-phone-label {
  margin: 0;
  font-size: var(--a-fs-lg);
  font-weight: 700;
  opacity: 0.9;
}
.reception-kiosk-phone-display {
  min-width: 280px;
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: 0.08em;
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-text);
}
.reception-kiosk-phone-display.is-empty { color: var(--a-text-muted); font-size: var(--a-fs-lg); letter-spacing: 0; }
.reception-kiosk-keypad {
  display: grid;
  grid-template-columns: repeat(3, 88px);
  gap: var(--a-gap-2);
}
.reception-kiosk-keypad button {
  min-height: 64px;
  font-size: 26px;
  font-weight: 800;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-text);
  cursor: pointer;
}
.reception-kiosk-keypad button:active { filter: brightness(0.92); }
.reception-kiosk-submit {
  min-width: 280px;
  min-height: 60px;
  font-size: 22px;
  font-weight: 900;
  border: none;
  border-radius: var(--a-radius-sm);
  background: var(--a-accent);
  color: var(--a-accent-ink);
  cursor: pointer;
}
.reception-kiosk-submit:disabled { opacity: 0.45; cursor: not-allowed; }

.reception-kiosk-result {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--a-gap-4);
  padding: var(--a-gap-6);
}
.reception-kiosk-result[hidden] { display: none; }
.reception-kiosk-result-message {
  margin: 0;
  font-size: 44px;
  font-weight: 900;
  color: var(--a-warn-bg);
}
.reception-kiosk-result.is-ok .reception-kiosk-result-message { color: var(--a-accent); }
.reception-kiosk-result-sub {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: var(--a-surface);
  opacity: 0.92;
}

/* 解除はスタッフ向けに右下へ小さく (会員の誤タッチ配慮で低コントラスト + confirm) */
.reception-kiosk-exit {
  position: absolute;
  right: var(--a-gap-3);
  bottom: var(--a-gap-3);
  padding: 6px 10px;
  font-size: var(--a-fs-xs);
  border: 1px solid color-mix(in srgb, var(--a-surface) 25%, transparent);
  border-radius: var(--a-radius-sm);
  background: transparent;
  color: color-mix(in srgb, var(--a-surface) 45%, transparent);
  cursor: pointer;
}
.reception-kiosk-exit:hover { color: var(--a-surface); }

/* ============================================================
   エラー会員の整理 (SRパリティ B10 の現時点実装可能分)
   検出は提案のみ — 削除/変更は明示操作 + 確認ダイアログ経由。
   ============================================================ */
.customer-error-dialog {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(760px, 94vw);
  max-height: 88vh;
  overflow-y: auto;
  padding: 20px 22px 16px;
  border: none;
  border-radius: var(--a-radius);
  background: var(--a-surface);
  box-shadow: var(--a-shadow);
}
.customer-error-dialog::backdrop { background: rgba(15, 15, 15, 0.46); }
.customer-error-help {
  font-size: var(--a-fs-sm);
  color: var(--a-text-muted);
  margin: 0 0 12px;
  line-height: 1.6;
}
.customer-error-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--a-gap-3);
  margin-bottom: var(--a-gap-3);
}
.customer-error-dormant {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-2);
  font-size: var(--a-fs-sm);
  color: var(--a-text-muted);
}
.customer-error-dormant select {
  padding: 4px 8px;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  font-size: var(--a-fs-sm);
}
.customer-error-list table { width: 100%; }
.customer-error-list table thead { background: var(--a-bg); }
.customer-error-list table th,
.customer-error-list table td {
  font-size: var(--a-fs-sm);
  padding: 6px 8px;
  border-bottom: 1px solid var(--a-line);
  vertical-align: top;
}
.customer-error-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--a-radius-pill);
  font-size: var(--a-fs-xs);
  white-space: nowrap;
  border: 1px solid var(--a-line);
  color: var(--a-text-muted);
  background: var(--a-bg);
}
.customer-error-badge.is-invalid-email { color: var(--a-danger); background: var(--a-danger-bg); border-color: var(--a-danger); }
.customer-error-badge.is-no-contact { color: var(--a-warn); background: var(--a-warn-bg); border-color: var(--a-warn); }
.customer-error-badge.is-withdrawn-future { color: var(--a-danger); background: var(--a-danger-bg); border-color: var(--a-danger); }
.customer-error-future-note { color: var(--a-warn); }
.customer-error-bulk {
  display: flex;
  flex-wrap: wrap;
  gap: var(--a-gap-2);
  margin-top: var(--a-gap-3);
}
.customer-error-note {
  font-size: var(--a-fs-xs);
  color: var(--a-text-muted);
  margin: 12px 0 0;
  line-height: 1.6;
}

/* ============================================================
   カルテ写真 (SRパリティ B4)
   画像本体は認証ゲート付き /api/customer-photos/:id/file のみで配信。
   追加/削除ボタンは manageCustomers のみ描画 (01.js 側でゲート)。
   ============================================================ */
.customer-photo-section {
  margin-top: var(--a-gap-4);
  padding: var(--a-gap-3);
  border: 1px dashed var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-bg);
}
.customer-photo-section h4 {
  margin: 0 0 var(--a-gap-2);
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: var(--a-gap-2);
}
.customer-photo-section h4 small {
  font-size: var(--a-fs-sm);
  color: var(--a-text-muted);
  font-weight: 400;
}
.customer-photo-add-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--a-gap-2);
  margin-bottom: var(--a-gap-3);
}
.customer-photo-caption-input {
  flex: 1 1 180px;
  font: inherit;
  font-size: var(--a-fs-sm);
  padding: 6px 8px;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
}
.customer-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: var(--a-gap-2);
}
.customer-photo-item {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--a-gap-1);
}
.customer-photo-thumb {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  padding: 0;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  overflow: hidden;
  cursor: zoom-in;
}
.customer-photo-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.customer-photo-item figcaption {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: var(--a-fs-xs);
  color: var(--a-text-muted);
}
.customer-photo-item figcaption .a-btn { align-self: flex-start; }
.customer-photo-caption-line {
  color: var(--a-text);
  word-break: break-all;
}
.customer-photo-empty {
  font-size: var(--a-fs-sm);
  color: var(--a-text-muted);
  margin: 0;
  display: flex;
  align-items: center;
  gap: var(--a-gap-2);
  flex-wrap: wrap;
}
.customer-photo-lightbox {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: min(960px, 94vw);
  padding: var(--a-gap-3);
  border: none;
  border-radius: var(--a-radius);
  background: var(--a-surface);
  box-shadow: var(--a-shadow);
  text-align: center;
}
.customer-photo-lightbox::backdrop { background: rgba(15, 15, 15, 0.62); }
.customer-photo-lightbox img {
  max-width: 100%;
  max-height: 72vh;
  border-radius: var(--a-radius-sm);
}
.customer-photo-lightbox-caption {
  font-size: var(--a-fs-sm);
  color: var(--a-text-muted);
  margin: var(--a-gap-2) 0 0;
  word-break: break-all;
}
.customer-photo-lightbox .dialog-actions {
  justify-content: center;
  margin-top: var(--a-gap-2);
}

/* ---- 店舗・決済: 設定対象を「プロフィール / 通知 / 決済 / 接続確認」の順に見せる ---- */
.admin-store-info {
  display: grid;
  gap: var(--a-gap-4);
}
.admin-store-payment-guide,
.admin-payment-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--a-gap-2);
  padding: var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface-2);
}
.admin-store-payment-step,
.admin-payment-flow-step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: var(--a-gap-2);
  row-gap: 2px;
  align-items: center;
  min-width: 0;
}
.admin-store-payment-step > span,
.admin-payment-flow-step > span,
.admin-payment-panel-head > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-pill);
  background: var(--a-surface);
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 800;
}
.admin-store-payment-step > strong,
.admin-payment-flow-step > strong {
  min-width: 0;
  font-size: var(--a-fs-sm);
}
.admin-store-payment-step > small,
.admin-payment-flow-step > small {
  grid-column: 2;
  min-width: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
}
.admin-store-info-layout {
  display: grid;
  gap: var(--a-gap-3);
}
.admin-store-info-group {
  display: grid;
  gap: var(--a-gap-3);
  padding: var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface);
}
.admin-store-group-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--a-gap-2);
}
.admin-store-group-head h4,
.admin-store-group-head p {
  margin: 0;
}
.admin-store-group-head p {
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
}
.admin-store-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--a-gap-3);
}
.admin-store-grid label,
.admin-payment-field-grid label {
  display: flex;
  flex-direction: column;
  gap: var(--a-gap-1);
  min-width: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  font-weight: 700;
}
.admin-store-grid input,
.admin-store-grid textarea,
.admin-payment-field-grid input {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  padding: var(--a-gap-2);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-ink);
}
.admin-store-grid textarea {
  resize: vertical;
}
.admin-store-wide,
.admin-payment-wide {
  grid-column: 1 / -1;
}

/* ---- 決済基盤 (SRパリティ D1): 設定>決済 のプロバイダカード + 売上>請求・入金 ---- */
.admin-payment-settings {
  display: grid;
  gap: var(--a-gap-3);
}
/* DESIGN.md: avoid nested cards. The provider list sits inside the settings
   .admin-card, so each provider is a flat row separated by a hairline — not a
   framed surface-on-surface card. */
.admin-payment-card {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: var(--a-gap-4) 0;
  display: grid;
  gap: var(--a-gap-3);
}
.admin-payment-flow + .admin-payment-card {
  padding-top: 0;
}
.admin-payment-card + .admin-payment-card {
  border-top: 1px solid var(--a-line);
}
.admin-payment-card:first-child { padding-top: 0; }
.admin-payment-card:last-child { padding-bottom: 0; }
.admin-payment-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--a-gap-3);
}
.admin-payment-card-head h4 {
  margin: 0;
  font-size: var(--a-fs-lg);
  display: flex;
  align-items: center;
  gap: var(--a-gap-2);
}
.admin-payment-provider-title {
  display: grid;
  gap: var(--a-gap-1);
  min-width: min(100%, 420px);
}
.admin-payment-provider-title p,
.admin-payment-provider-title small {
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  line-height: 1.5;
}
.admin-payment-state {
  display: flex;
  justify-content: flex-end;
  min-width: 120px;
}
.admin-payment-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-2);
  font-size: var(--a-fs-md);
  cursor: pointer;
}
.admin-payment-provider-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: var(--a-gap-3);
  align-items: start;
}
.admin-payment-panel {
  display: grid;
  gap: var(--a-gap-3);
  min-width: 0;
  padding: var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface);
}
.admin-payment-panel-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--a-gap-2);
  align-items: start;
}
.admin-payment-panel-head strong {
  display: block;
}
.admin-payment-panel-head small {
  display: block;
  margin-top: 2px;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.5;
}
.admin-payment-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--a-gap-3);
}
.admin-payment-check {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-2);
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
}
.admin-payment-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: var(--a-gap-2);
}
.admin-payment-test-result {
  margin: 0;
  font-size: var(--a-fs-sm);
  color: var(--a-text-muted);
  min-height: 1.2em;
}
.admin-payment-test-result.is-ok { color: var(--a-ok); }
.admin-payment-test-result.is-error { color: var(--a-danger); }
.admin-payment-webhook {
  display: grid;
  gap: var(--a-gap-2);
  font-size: var(--a-fs-sm);
}
.admin-payment-webhook-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--a-gap-2);
}
.admin-payment-webhook code {
  word-break: break-all;
  font-size: var(--a-fs-sm);
  background: var(--a-bg);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  padding: var(--a-gap-1) var(--a-gap-2);
}
.admin-payment-webhook small { color: var(--a-text-muted); }
.admin-payment-empty {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--a-gap-2);
  padding: var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface-2);
  color: var(--a-text-muted);
}
.admin-payment-empty strong {
  color: var(--a-text);
}
@media (max-width: 900px) {
  .admin-store-payment-guide,
  .admin-payment-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-payment-provider-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .admin-store-payment-guide,
  .admin-payment-flow,
  .admin-store-grid,
  .admin-payment-field-grid {
    grid-template-columns: 1fr;
  }
}

/* ---- 店舗・決済: 入力対象と決済手順の階層を揃える ---- */
.admin-section-kicker {
  display: block;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 800;
  letter-spacing: 0;
}
.admin-store-info {
  gap: var(--a-gap-3);
}
.admin-payment-overview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--a-gap-4);
  align-items: start;
  padding: var(--a-gap-4);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface-2);
}
.admin-payment-overview-main {
  display: grid;
  gap: var(--a-gap-1);
  min-width: 0;
}
.admin-payment-overview-main h4 {
  margin: 0;
  color: var(--a-text);
  font-size: var(--a-fs-lg);
  line-height: 1.5;
}
.admin-payment-overview-main p {
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  line-height: 1.6;
}
.admin-payment-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(92px, 1fr));
  gap: var(--a-gap-2);
  margin: 0;
}
.admin-payment-summary > div {
  display: grid;
  gap: var(--a-gap-1);
  min-width: 0;
  padding: var(--a-gap-2) var(--a-gap-3);
  border-left: 1px solid var(--a-line);
}
.admin-payment-summary dt {
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 700;
}
.admin-payment-summary dd {
  margin: 0;
  color: var(--a-ink);
  font-size: var(--a-fs-lg);
  font-weight: 800;
}
.admin-store-info-layout {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: var(--a-gap-4);
}
.admin-store-info-group {
  padding: var(--a-gap-3) 0 0;
  border: 0;
  border-top: 1px solid var(--a-line);
  border-radius: 0;
  background: transparent;
}
.admin-store-group-head {
  display: grid;
  gap: var(--a-gap-1);
  align-items: start;
}
.admin-store-group-head h4 {
  margin: 0;
  color: var(--a-text);
  font-size: var(--a-fs-lg);
}
.admin-store-group-head p {
  margin: 0;
  max-width: 52em;
  line-height: 1.6;
}
.admin-store-grid {
  gap: var(--a-gap-2);
}
.admin-store-grid label,
.admin-payment-field-grid label {
  gap: var(--a-gap-1);
  color: var(--a-text-muted);
}
.admin-store-grid label > span,
.admin-payment-field-grid label > span {
  color: var(--a-text);
  font-size: var(--a-fs-xs);
  font-weight: 800;
}
.admin-store-grid input,
.admin-store-grid textarea,
.admin-payment-field-grid input {
  min-height: calc(var(--a-gap-6) + var(--a-gap-4));
  background: var(--a-surface);
}
.admin-payment-settings {
  gap: var(--a-gap-4);
}
.admin-payment-route {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--a-gap-3);
  padding: var(--a-gap-3) 0;
  border-top: 1px solid var(--a-line);
  border-bottom: 1px solid var(--a-line);
}
.admin-payment-route > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: var(--a-gap-2);
  row-gap: var(--a-gap-1);
  min-width: 0;
}
.admin-payment-route > div > span,
.admin-payment-panel-head > span {
  width: calc(var(--a-gap-6) + var(--a-gap-1));
  height: calc(var(--a-gap-6) + var(--a-gap-1));
  border-color: var(--a-line);
  background: var(--a-surface);
  color: var(--a-ink);
}
.admin-payment-route strong {
  min-width: 0;
  color: var(--a-text);
  font-size: var(--a-fs-sm);
}
.admin-payment-route small {
  grid-column: 2;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.5;
}
.admin-payment-card {
  gap: var(--a-gap-3);
  padding: var(--a-gap-4);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface);
}
.admin-payment-route + .admin-payment-card {
  margin-top: var(--a-gap-1);
}
.admin-payment-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: var(--a-gap-3);
  padding-bottom: var(--a-gap-3);
  border-bottom: 1px solid var(--a-line);
}
.admin-payment-provider-title {
  min-width: 0;
}
.admin-payment-card-head h4 {
  line-height: 1.45;
}
.admin-payment-state {
  display: grid;
  gap: var(--a-gap-1);
  justify-items: end;
  min-width: 0;
}
.admin-payment-state-label {
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 800;
}
.admin-payment-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--a-gap-2) var(--a-gap-4);
  padding-bottom: var(--a-gap-3);
  border-bottom: 1px solid var(--a-line);
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
}
.admin-payment-meta span {
  display: inline-flex;
  gap: var(--a-gap-1);
  min-width: 0;
}
.admin-payment-meta strong {
  color: var(--a-text);
}
.admin-payment-provider-layout {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--a-gap-4);
}
.admin-payment-panel {
  gap: var(--a-gap-3);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.admin-payment-panel[data-payment-panel="webhook"] {
  padding-left: var(--a-gap-4);
  border-left: 1px solid var(--a-line);
  background: transparent;
}
.admin-payment-panel-head {
  align-items: center;
}
.admin-payment-panel-head strong {
  color: var(--a-text);
}
.admin-payment-field-grid {
  gap: var(--a-gap-2);
}
.admin-payment-actions {
  justify-content: flex-start;
}
.admin-payment-webhook code {
  display: block;
  max-width: 100%;
}
.admin-payment-empty {
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface-2);
}
@media (max-width: 900px) {
  .admin-payment-overview {
    grid-template-columns: 1fr;
  }
  .admin-payment-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-store-info-layout,
  .admin-payment-provider-layout {
    grid-template-columns: 1fr;
  }
  .admin-payment-panel[data-payment-panel="webhook"] {
    padding-top: var(--a-gap-3);
    padding-left: 0;
    border-top: 1px solid var(--a-line);
    border-left: 0;
  }
  .admin-payment-route {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .admin-payment-summary,
  .admin-payment-route {
    grid-template-columns: 1fr;
  }
  .admin-store-grid,
  .admin-payment-field-grid,
  .admin-payment-card-head {
    grid-template-columns: 1fr;
  }
  .admin-payment-state {
    justify-items: start;
  }
}
.admin-invoice-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--a-gap-1);
}

/* ===== 機能管理 (フィーチャーフラグ・feature-flags-design.md) ===== */
/* .admin-status-badge.is-active は共通バッジ定義に集約済み。 */
/* ===== 機能管理: コンパクト化 (2026-06-13 オーナー指示・狭い領域で表現) ===== */
.admin-feature-build-mode {
  border: 1px solid var(--a-border);
  border-radius: var(--a-radius);
  padding: 6px 10px;
  margin-bottom: 10px;
  background: var(--a-surface-2);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 14px;
}
.admin-feature-build-mode-head { display: flex; align-items: center; gap: 6px; margin: 0; }
.admin-feature-build-mode .admin-card-note { margin: 0; font-size: 0.78em; flex: 1 1 260px; }
.admin-feature-build-mode .admin-actions { margin: 0; }
.admin-page .admin-module-panel #feature-build-mode-toggle {
  background: var(--a-warn-bg) !important;
  border-color: var(--a-warn) !important;
  color: var(--a-warn) !important;
}
.admin-page .admin-module-panel #feature-build-mode-toggle:hover {
  background: color-mix(in srgb, var(--a-warn-bg) 72%, var(--a-surface)) !important;
  filter: none !important;
}
.admin-feature-flag-group { margin-bottom: 10px; }
.admin-feature-flag-group .admin-subsection-head { margin: 0 0 2px; }
.admin-subsection-head.is-spaced { margin-top: var(--a-gap-6); }
.admin-feature-flag-group .admin-card-note { font-size: 0.76em; margin: 0 0 4px; }
.admin-feature-flag-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 4px;
}
/* カードを1行ピル化: 名前+バッジを左、トグルを右 (縦2段→1段でコンパクト) */
.admin-feature-flag-card {
  border: 1px solid var(--a-border);
  border-radius: 6px;
  padding: 3px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  font-size: 0.85em;
}
.admin-feature-flag-card.is-locked { opacity: 0.55; background: var(--a-surface-2); }
.admin-feature-flag-main {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}
.admin-feature-flag-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-feature-flag-main .admin-status-badge { font-size: 0.72em; padding: 0 5px; }
/* 1行化したのでトグルのテキストは隠し、チェックボックスのみ (省スペース) */
.admin-feature-flag-toggle { display: flex; align-items: center; cursor: pointer; }
.admin-feature-flag-toggle span { display: none; }
.admin-feature-flag-card.is-locked .admin-feature-flag-toggle { cursor: not-allowed; }

/* ===== 会員カルテ: トレーニング情報 (スプレッドシート移行の運用列) ===== */
.customer-detail-karte { grid-column: 1 / -1; }
.customer-karte-fields {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 4px 12px;
  margin-top: 4px;
}
.customer-karte-fields > div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.85em;
  padding: 2px 0;
  border-bottom: 1px dotted var(--a-border);
}
.customer-karte-fields em { color: var(--a-text-muted); font-style: normal; }
.customer-karte-fields b { font-weight: 600; text-align: right; }

/* サイトサブナビ: 内部セクションリンクと外部リンクの区切り線 (2026-06-13 サブナビ縦並び統一) */
.admin-feature-nav-divider {
  display: block;
  height: 1px;
  margin: 8px 0;
  background: var(--a-border);
}

/* ==========================================================================
   会員ページ 新UI (memberUiV2, 2026-06-14 再設計)
   左=高密度リスト(360px) / 右=固定ヘッダ+タブ詳細。リスト⇔全幅テーブル切替。
   旧UI(フラグOFF)には [data-customer-view] が付かないので一切影響しない。
   ========================================================================== */

/* ==========================================================================
   全ページ共通: コンテンツ最大幅 1280px・中央寄せ (2026-06-14 会員ページから全ページ展開)。
   黒トップバー/ナビ (body 直下の .admin-shell-header) は full-bleed のまま。
   各ページの本文 <main> (ホーム=.admin-management-main / 予約admin・日報=.admin-shell) を中央寄せ。
   ========================================================================== */
.admin-spa-shell .admin-spa-page > .admin-shell,
.admin-spa-shell .admin-spa-page > .admin-management-main {
  max-width: var(--a-content-max);
  margin-inline: auto;
  width: 100%;
}
.admin-spa-shell .admin-spa-page[data-spa-page="management"] > .admin-management-main {
  max-width: var(--a-content-max) !important;
}
.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-panel {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding: var(--a-gap-3) clamp(12px, 3vw, 40px) 72px !important;
}
.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard {
  grid-template-columns: minmax(220px, 0.48fr) minmax(0, 2.7fr) !important;
}
.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-stack {
  min-width: 0 !important;
}
.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-today-card {
  min-width: 0 !important;
}
/* 会員パネルは内側 #customer-list-view も中央寄せ (workspace の grid 基準を揃える) */
.admin-spa-shell .admin-module-panel[data-module-panel="customers"] #customer-list-view {
  max-width: var(--a-content-max);
  margin-inline: auto;
}

/* レイアウト: 左リスト360px + 右詳細1fr (旧の 1fr|320-400 を上書き) */
.admin-module-panel .customer-workspace[data-customer-view="list"] {
  grid-template-columns: 360px minmax(0, 1fr);
  gap: var(--a-gap-4);
}
.admin-module-panel .customer-workspace[data-customer-view="table"] {
  display: block;
}
.customer-workspace[data-customer-view="table"] .customer-detail-aside { display: none; }
.customer-workspace[data-customer-view="table"] .customer-table-wrap { max-height: none; }

/* 表示切替トグル */
.customer-view-toggle { margin-left: auto; }

/* v2 のテーブルは旧3列前提の固定幅/最小幅をリセット (列数が違うため)。
   styles.css 末尾パッチが table-layout/width を !important で固定しているので、こちらも !important で上書き。 */
.admin-spa-shell .customer-workspace[data-customer-view] .customer-table {
  min-width: 0 !important; table-layout: auto !important; width: 100% !important;
}
.admin-spa-shell .customer-workspace[data-customer-view] .customer-table th,
.admin-spa-shell .customer-workspace[data-customer-view] .customer-table td,
.admin-spa-shell .customer-workspace[data-customer-view] .customer-table th:first-child,
.admin-spa-shell .customer-workspace[data-customer-view] .customer-table td:first-child,
.admin-spa-shell .customer-workspace[data-customer-view] .customer-table th:nth-child(2),
.admin-spa-shell .customer-workspace[data-customer-view] .customer-table td:nth-child(2),
.admin-spa-shell .customer-workspace[data-customer-view] .customer-table th:nth-child(3),
.admin-spa-shell .customer-workspace[data-customer-view] .customer-table td:nth-child(3) {
  width: auto !important; min-width: 0 !important; vertical-align: middle;
}
.admin-spa-shell .customer-workspace[data-customer-view="table"] .customer-col-num { text-align: right; }
/* 全幅テーブルの行高・ヘッダ・罫線を締める */
.customer-workspace[data-customer-view="table"] .customer-table th {
  text-align: left; font-size: var(--a-fs-sm); color: var(--a-text-muted);
  font-weight: 600; padding: var(--a-gap-2) var(--a-gap-3); border-bottom: 1px solid var(--a-line);
}
.customer-workspace[data-customer-view="table"] .customer-table td {
  padding: var(--a-gap-2) var(--a-gap-3); border-bottom: 1px solid var(--a-line); font-size: var(--a-fs-md);
}
.customer-workspace[data-customer-view="table"] .customer-table tbody tr { cursor: pointer; }
.customer-workspace[data-customer-view="table"] .customer-table tbody tr:hover td { background: var(--a-surface-2); }
.customer-workspace[data-customer-view="table"] .customer-table tr.is-selected td { background: color-mix(in srgb, var(--a-accent) 22%, var(--a-surface)); }
.customer-workspace[data-customer-view="table"] .customer-table .customer-name { font-weight: 700; }
.customer-workspace[data-customer-view="table"] .customer-table .customer-id { display: block; font-size: var(--a-fs-xs); color: var(--a-text-muted); }
/* 単一列リストもヘッダ無し・行高を行内CSSに委ねる */
.customer-workspace[data-customer-view="list"] .customer-table { min-width: 0; }

/* ---- 高密度リスト行 ---- */
.customer-mrow { cursor: pointer; }
.customer-mrow td { padding: var(--a-gap-2) var(--a-gap-3); border-bottom: 1px solid var(--a-line); vertical-align: top; }
.customer-mrow.is-selected td { background: color-mix(in srgb, var(--a-accent) 22%, var(--a-surface)); box-shadow: inset 3px 0 0 var(--a-accent); }
.customer-mrow:hover td { background: var(--a-surface-2); }
.customer-mrow-top { display: flex; align-items: center; gap: var(--a-gap-2); flex-wrap: wrap; }
.customer-mrow-top .customer-name { font-size: var(--a-fs-md); font-weight: 700; }
.customer-mrow-ticket { margin-left: auto; font-size: var(--a-fs-xs); font-weight: 700; color: var(--a-ok); white-space: nowrap; }
.customer-mrow-ticket.is-low { color: var(--a-danger); }
.customer-mrow-sub { display: flex; gap: var(--a-gap-2); flex-wrap: wrap; font-size: var(--a-fs-sm); color: var(--a-text-muted); margin-top: 2px; }
.customer-mrow-meta { font-size: var(--a-fs-xs); color: var(--a-text-muted); margin-top: 2px; }
.customer-mrow-warn { color: var(--a-warn); font-weight: 700; }

/* paused (一旦停止) の在籍タグ色 (休会と同系の黄) */
.customer-status-tag.customer-status-paused { color: var(--a-warn); background: var(--a-warn-bg); }

/* ---- 詳細パネル: 固定サマリーヘッダ ---- */
.customer-detail-aside .customer-v2-header {
  position: sticky; top: 0; z-index: 2; background: var(--a-surface);
  border-bottom: 1px solid var(--a-line); padding-bottom: var(--a-gap-3); margin-bottom: var(--a-gap-3);
}
.customer-v2-id { display: flex; align-items: center; gap: var(--a-gap-3); }
.customer-v2-avatar {
  width: 44px; height: 44px; border-radius: 50%; background: var(--a-ink); color: var(--a-accent);
  display: grid; place-items: center; font-weight: 800; font-size: 18px; flex: none;
}
.customer-v2-name h3 { display: flex; align-items: center; gap: var(--a-gap-2); margin: 0; font-size: var(--a-fs-lg); }
.customer-v2-name p { margin: 2px 0 0; font-size: var(--a-fs-sm); color: var(--a-text-muted); }
.customer-v2-keystats {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: var(--a-gap-1) var(--a-gap-4);
  margin: var(--a-gap-3) 0 0;
}
.customer-v2-keystats > div { padding: 0; margin: 0; }
.customer-v2-keystats dt { font-size: var(--a-fs-xs); color: var(--a-text-muted); }
.customer-v2-keystats dd { margin: 1px 0 0; font-size: var(--a-fs-md); font-weight: 700; display: flex; align-items: center; gap: var(--a-gap-2); }
.customer-v2-ticketstat dd { gap: var(--a-gap-2); }
.customer-ticket-ring { flex: none; }
.customer-ticket-ring-num { font-size: 13px; font-weight: 800; fill: var(--a-ink); }
.customer-v2-ticket-meta { display: flex; flex-direction: column; line-height: 1.2; }
.customer-v2-ticket-meta small { font-weight: 400; font-size: var(--a-fs-xs); color: var(--a-text-muted); }
.customer-v2-muted { color: var(--a-text-muted); font-weight: 400; }

/* ---- タブ本文: カードグリッド ---- */
.customer-v2-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--a-gap-3); }
.customer-v2-card {
  background: var(--a-surface); border: 1px solid var(--a-line); border-radius: var(--a-radius);
  padding: var(--a-gap-3); margin-bottom: var(--a-gap-3);
}
.customer-v2-grid > .customer-v2-card { margin-bottom: 0; }
.customer-v2-card h4 { margin: 0 0 var(--a-gap-2); font-size: var(--a-fs-md); }
.customer-v2-cardhead { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--a-gap-2); }
.customer-v2-cardhead h4 { margin: 0; }
.customer-v2-cardhead .a-btn { flex: 0 0 auto; }
.customer-v2-fields { display: grid; gap: var(--a-gap-1); margin: 0; }
.customer-v2-fields > div { display: grid; grid-template-columns: 92px 1fr; gap: var(--a-gap-2); font-size: var(--a-fs-md); }
.customer-v2-fields dt { color: var(--a-text-muted); }
.customer-v2-fields dd { margin: 0; font-weight: 600; }
.customer-v2-edit { display: grid; gap: var(--a-gap-2); }
.customer-v2-note { margin: 0; font-size: var(--a-fs-md); white-space: pre-wrap; }
.customer-v2-warn { margin: 0; font-size: var(--a-fs-md); color: var(--a-warn); }
.customer-v2-warn-badge {
  display: inline-block; font-size: var(--a-fs-xs); font-weight: 700; color: var(--a-warn);
  background: var(--a-warn-bg); border-radius: var(--a-radius-pill); padding: 1px 8px; margin-right: 4px;
}
.customer-v2-history h4 { margin-bottom: var(--a-gap-2); }

/* ---- カルテ記録タブ: 最新測定 + 前回比 + スパークライン ---- */
.customer-karte-latest { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: var(--a-gap-2); }
.customer-karte-metric { background: var(--a-surface-2); border-radius: var(--a-radius-sm); padding: var(--a-gap-2) var(--a-gap-3); }
.customer-karte-metric dt { font-size: var(--a-fs-xs); color: var(--a-text-muted); }
.customer-karte-metric dd { margin: 2px 0 0; font-size: 20px; font-weight: 800; }
.customer-karte-metric dd small { font-size: var(--a-fs-sm); font-weight: 600; }
.customer-karte-delta { font-size: var(--a-fs-xs); font-weight: 700; }
.customer-karte-delta.is-good { color: var(--a-ok); }
.customer-karte-delta.is-bad { color: var(--a-danger); }
.customer-karte-spark { display: flex; align-items: center; gap: var(--a-gap-3); flex-wrap: wrap; margin-top: var(--a-gap-3); }
.customer-spark { display: block; }

/* ---- 全幅テーブルの数値列 ---- */
.customer-col-num { text-align: right; }
.customer-num-low { color: var(--a-danger); font-weight: 700; }

/* 詳細パネルの空状態 */
.customer-detail-empty { padding: var(--a-gap-6); color: var(--a-text-muted); font-size: var(--a-fs-md); text-align: center; }

/* 狭い画面ではリストを上、詳細を下に縦積み */
@media (max-width: 960px) {
  .admin-module-panel .customer-workspace[data-customer-view="list"] { grid-template-columns: 1fr; }
  .customer-detail-aside .customer-v2-header { position: static; }
}

/* ===== Admin final: customer page overall polish ===== */
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-toolbar {
  display: grid !important;
  grid-template-columns: auto minmax(430px, 1fr) !important;
  grid-template-areas: "actions filters";
  align-items: center !important;
  gap: 10px 12px !important;
  margin: 0 0 10px !important;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-summary {
  display: flex;
  align-items: baseline;
  gap: 4px;
  min-height: 40px !important;
  padding: 8px 12px !important;
  margin: 0 0 8px !important;
  color: var(--a-text-muted) !important;
  background: transparent !important;
  border: 1px solid transparent;
  border-left: 0;
  border-radius: var(--a-radius-sm);
  box-shadow: none;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-summary strong {
  color: var(--a-ink) !important;
  font-size: 20px !important;
  line-height: 1;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-summary span {
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-view-toggle {
  grid-area: switch;
  justify-self: start;
  margin-left: 0 !important;
  min-height: 38px;
  padding: 0 14px;
  white-space: nowrap;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-filter-row {
  grid-area: filters;
  justify-self: stretch;
  justify-content: flex-end;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-filter-row input[type="search"] {
  flex: 1 1 280px;
  width: auto !important;
  min-width: 240px;
  max-width: 390px;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 12px !important;
  box-sizing: border-box;
  font-size: var(--a-fs-md) !important;
  line-height: 1.2;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-filter-row select {
  flex: 0 0 188px;
  width: auto !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 10px !important;
  box-sizing: border-box;
  font-size: var(--a-fs-sm) !important;
  line-height: 1.2;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-filter-row .customer-group-filter {
  flex-basis: 200px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-noemail-toggle {
  flex: 0 0 auto;
  height: 46px;
  min-height: 46px;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 12px;
  box-sizing: border-box;
  color: var(--a-ink);
  background: var(--a-surface);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  font-size: var(--a-fs-sm) !important;
  font-weight: 700;
  white-space: nowrap;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-noemail-toggle input {
  width: 16px;
  height: 16px;
  margin: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-action-row {
  grid-area: actions;
  justify-content: flex-start;
  gap: 8px !important;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-action-row > button,
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-action-row .admin-overflow-toggle {
  min-height: 38px !important;
  padding: 0 13px !important;
  border-radius: var(--a-radius-sm);
  font-size: var(--a-fs-sm) !important;
  font-weight: 800;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-advanced-search {
  position: relative;
  flex: 0 0 auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-advanced-search[open] {
  z-index: 30;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-advanced-search > summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 46px;
  height: 46px;
  padding: 0 12px;
  box-sizing: border-box;
  color: var(--a-ink);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  cursor: pointer;
  font-weight: 800;
  list-style: none;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-advanced-search[open] > summary {
  background: var(--a-ink);
  color: var(--a-surface);
  border-bottom: 1px solid var(--a-ink);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-advanced-search > summary::-webkit-details-marker {
  display: none;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-advanced-body {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 31;
  width: min(620px, calc(100vw - 48px));
  padding: 12px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  background: var(--a-surface);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  box-shadow: var(--a-shadow);
}

.admin-page .admin-module-panel[data-module-panel="customers"] .customer-workspace[data-customer-view="list"] {
  grid-template-columns: minmax(340px, 390px) minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: start;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-list-pane {
  min-width: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-list-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 8px 0 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-table-wrap {
  max-height: min(68vh, 760px);
  background: var(--a-surface);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  overflow: auto;
  scrollbar-gutter: stable;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-kana-shortcuts {
  position: sticky;
  top: 0;
  z-index: 4;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 8px;
  background: var(--a-surface);
  border-bottom: 1px solid var(--a-line);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-kana-shortcuts .a-btn {
  width: 28px;
  height: 28px;
  padding: 0;
  color: var(--a-text) !important;
  background: var(--a-surface) !important;
  border: 1px solid var(--a-line) !important;
  border-radius: var(--a-radius-sm);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-kana-shortcuts .a-btn:not(:disabled):hover {
  background: var(--a-surface-2) !important;
  border-color: var(--a-text-muted) !important;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-kana-shortcuts .a-btn:disabled {
  color: var(--a-text-muted) !important;
  background: transparent !important;
  opacity: 0.35;
  cursor: default;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-workspace[data-customer-view="list"] .customer-table {
  border-collapse: separate;
  border-spacing: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-kana-section-row td {
  position: sticky;
  top: var(--customer-kana-stick-top, 44px);
  z-index: 3;
  padding: 0 !important;
  color: var(--a-ink);
  background: color-mix(in srgb, var(--a-surface) 94%, var(--a-accent));
  border-bottom: 1px solid var(--a-line);
  box-shadow: 0 1px 0 rgba(15, 15, 15, 0.04);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-kana-section-row span {
  display: block;
  padding: 5px 10px 4px;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-mrow td {
  padding: 8px 10px !important;
  background: var(--a-surface);
  border-bottom: 1px solid var(--a-line);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-mrow:hover td {
  background: var(--a-surface-2);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-mrow.is-selected td {
  background: color-mix(in srgb, var(--a-accent) 22%, var(--a-surface));
  box-shadow: inset 3px 0 0 var(--a-accent);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-mrow-top {
  gap: 6px;
  line-height: 1.25;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-mrow-top .customer-name {
  font-size: var(--a-fs-md);
  line-height: 1.25;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-mrow-sub {
  gap: 6px 9px;
  margin-top: 3px;
  line-height: 1.25;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-mrow-meta {
  margin-top: 3px;
  line-height: 1.25;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-mrow-warn {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 0 6px;
  color: var(--a-danger);
  background: var(--a-danger-bg);
  border-radius: var(--a-radius-pill);
}

.admin-page .admin-module-panel[data-module-panel="customers"] .customer-detail-aside {
  padding: 14px;
  background: var(--a-surface);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  box-shadow: none;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-detail-aside .customer-v2-header {
  position: static !important;
  z-index: auto;
  margin: 0 0 2px;
  padding: 0 0 10px;
  background: var(--a-surface);
  border-bottom: 1px solid var(--a-line);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-id {
  align-items: center;
  gap: 12px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-avatar {
  width: 58px;
  height: 58px;
  overflow: hidden;
  font-size: 22px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-name h3 {
  gap: 8px;
  flex-wrap: wrap;
  font-size: 20px;
  line-height: 1.25;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-name .customer-status-tag {
  padding: 2px 9px;
  font-size: 14px;
  line-height: 1.2;
  letter-spacing: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-keystats {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  margin-top: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--a-line);
  border-bottom: 1px solid var(--a-line);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-keystats dt {
  margin-bottom: 2px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-keystats dd {
  min-height: 22px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-keystats > div {
  min-width: 0;
  padding: 0 13px;
  border-left: 1px solid var(--a-line);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-keystats > div:first-child {
  padding-left: 0;
  border-left: 0;
}

/* 履歴書ブロック: 左に縦長の証明写真、右に氏名/keystats/連絡先/契約情報を統合。
   ヘッダとセカンドヘッダを1つにまとめ、重複していた情報をここへ集約する。 */
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-resume {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding-bottom: 10px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-resume-main {
  flex: 1 1 auto;
  min-width: 0;
  position: relative;
  display: flex;
  flex-direction: column;
}
/* 編集ボタンは履歴書ブロックの右上に固定 (名前の隣ではなく画面右)。 */
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-head-edit {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 64px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-name {
  min-height: 56px;
  padding-right: 86px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-name p {
  margin-top: 4px;
  color: var(--a-text-muted);
}
/* 履歴書の証明写真 (3:4 の縦長)。クリックでアップロード。写真が無ければ頭文字。
   :hover/:focus でカメララベルを浮かせて押せると示す。 */
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-photo {
  flex: none;
  width: 168px !important;
  min-width: 168px !important;
  height: 210px !important;
  border-radius: var(--a-radius);
  border: 0;
  background: var(--a-surface-2);
  color: var(--a-text-muted);
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 40px;
  padding: 0;
  position: relative;
  cursor: pointer;
  overflow: hidden;
}
.admin-spa-shell .admin-module-panel[data-module-panel="customers"] button.customer-v2-photo,
.admin-spa-shell .admin-module-panel[data-module-panel="customers"] .customer-v2-photo {
  width: 168px !important;
  min-width: 168px !important;
  height: 210px !important;
  padding: 0 !important;
  border: 0 !important;
  background: var(--a-surface-2) !important;
  color: var(--a-text-muted) !important;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-photo-placeholder {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--a-surface-2);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-photo-placeholder::before,
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-photo-placeholder::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background: color-mix(in srgb, var(--a-text-muted) 32%, var(--a-surface-2));
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-photo-placeholder::before {
  top: 22%;
  width: 31%;
  aspect-ratio: 1;
  border-radius: var(--a-radius-pill);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-photo-placeholder::after {
  bottom: 4%;
  width: 72%;
  height: 31%;
  border-radius: var(--a-radius-pill) var(--a-radius-pill) 0 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-avatar-photo {
  position: relative;
  cursor: pointer;
  overflow: hidden;
}
.admin-page .admin-module-panel[data-module-panel="customers"] button.customer-v2-avatar-photo:hover,
.admin-page .admin-module-panel[data-module-panel="customers"] button.customer-v2-avatar-photo:focus-visible {
  box-shadow: var(--a-focus-ring);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-avatar-cam {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 3px 0;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  color: var(--a-ink);
  background: color-mix(in srgb, var(--a-accent) 72%, var(--a-surface));
  opacity: 0;
  transition: opacity 0.12s ease;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-avatar-photo:not(.has-photo) .customer-v2-avatar-cam,
.admin-page .admin-module-panel[data-module-panel="customers"] button.customer-v2-avatar-photo:hover .customer-v2-avatar-cam,
.admin-page .admin-module-panel[data-module-panel="customers"] button.customer-v2-avatar-photo:focus-visible .customer-v2-avatar-cam {
  opacity: 1;
}
/* ヘッダに統合した連絡先・契約情報。用途別パネルで読み取り順を固定する。 */
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-resume-detail {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 10px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-info-panel {
  min-width: 0;
  padding: 11px 12px;
  background: var(--a-surface-2);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-info-panel.is-alert {
  background: color-mix(in srgb, var(--a-warn-bg) 42%, var(--a-surface));
  border-color: color-mix(in srgb, var(--a-warn) 34%, var(--a-line));
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-info-panel h4 {
  margin: 0 0 8px;
  font-size: var(--a-fs-sm);
  line-height: 1.25;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-info-list {
  gap: 5px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-contact-line,
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-profile-line {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  margin: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-contact-line > div,
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-profile-line > div {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-contact-line dt,
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-profile-line dt {
  font-size: var(--a-fs-xs);
  color: var(--a-text-muted);
  margin: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-contact-line dd,
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-profile-line dd {
  font-size: var(--a-fs-sm);
  font-weight: 600;
  margin: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-profile-line dd {
  font-weight: 400;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-contact-warn dd {
  font-weight: 400;
  color: var(--a-text-muted);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-fields.customer-v2-info-list > div {
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 8px;
  font-size: var(--a-fs-sm);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-fields.customer-v2-info-list dt {
  color: var(--a-text-muted);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-fields.customer-v2-info-list dd {
  min-width: 0;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-head-edit-form {
  margin-top: 10px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-head-edit-form h4 {
  margin: 8px 0 2px;
  padding-top: 8px;
  border-top: 1px solid var(--a-line);
  font-size: var(--a-fs-sm);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-head-edit-form h4:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
/* カルテ記録: 運用メモ、当日入力、直近記録を1つの作業面にまとめる。 */
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-card.customer-training-section {
  padding: 16px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-head {
  align-items: flex-start;
  gap: 12px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-head p {
  margin: 3px 0 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-layout {
  display: grid;
  grid-template-columns: minmax(190px, 0.42fr) minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-note-block {
  min-width: 0;
  margin: 0;
  padding: 10px;
  background: var(--a-surface-2);
  border: 1px solid var(--a-line);
  border-left: 4px solid var(--a-accent);
  border-radius: var(--a-radius-sm);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-note-editor-inline {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-note-editor-inline textarea {
  flex: 1 1 auto;
  min-height: 148px;
  resize: vertical;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-note-label {
  display: block;
  font-size: var(--a-fs-sm);
  font-weight: 800;
  color: var(--a-text-muted);
  margin-bottom: 6px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
  padding: 12px;
  background: var(--a-surface);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-form label {
  min-width: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-form label > span {
  display: block;
  margin-bottom: 5px;
  color: var(--a-ink);
  font-size: var(--a-fs-sm);
  font-weight: 800;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-form input,
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-form textarea {
  width: 100%;
  box-sizing: border-box;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-program {
  grid-column: span 2;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-note {
  grid-column: 1 / -1;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-records {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--a-line);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-list li {
  display: grid;
  grid-template-columns: 98px minmax(0, 1fr) auto;
  gap: 6px 12px;
  align-items: start;
  padding: 10px 0;
  border-top: 1px solid var(--a-line);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-list li:first-child {
  border-top: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-list strong {
  font-size: var(--a-fs-sm);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-program-line,
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-note-line {
  grid-column: 2 / 3;
  color: var(--a-text-muted);
  overflow-wrap: anywhere;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-karte-program dd {
  font-size: var(--a-fs-sm);
  line-height: 1.35;
}

.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-body {
  min-width: 0;
  margin-top: 0;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-card {
  padding: 14px 15px;
  border-radius: var(--a-radius-sm);
  box-shadow: none;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-grid > .customer-v2-card:empty {
  display: none;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-card h4 {
  line-height: 1.25;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-fields {
  gap: 7px;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-fields > div {
  grid-template-columns: 96px minmax(0, 1fr);
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-member-tools input[readonly][value=""] {
  display: none;
}
.admin-page .admin-module-panel[data-module-panel="customers"] .customer-member-tools p {
  margin: 6px 0 0;
}

@media (max-width: 1240px) {
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-toolbar {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "filters"
      "actions";
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-filter-row {
    justify-content: flex-start;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-filter-row input[type="search"] {
    max-width: none;
  }
}
@media (max-width: 960px) {
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-workspace[data-customer-view="list"] {
    grid-template-columns: 1fr !important;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-resume-detail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-toolbar {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "filters"
      "actions";
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-filter-row,
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-action-row,
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-list-actions {
    flex-wrap: wrap !important;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-filter-row input[type="search"],
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-filter-row select,
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-noemail-toggle {
    flex: 1 1 100%;
    min-width: 0;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-grid {
    grid-template-columns: 1fr !important;
  }
  /* 狭幅では履歴書ブロックを縦積み (写真の下に情報)。keystats は2カラムに緩める。 */
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-resume {
    flex-direction: column;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-photo {
    width: min(168px, 52vw) !important;
    min-width: min(168px, 52vw) !important;
    height: min(210px, 65vw) !important;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-name {
    min-height: 0;
    padding-right: 0;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-head-edit {
    position: static;
    align-self: flex-start;
    order: 3;
    margin-top: 8px;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-keystats {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px;
    padding: 10px 0 0;
    border-bottom: 0;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-keystats > div {
    padding: 0;
    border-left: 0;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-v2-resume-detail {
    grid-template-columns: 1fr;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-form {
    grid-template-columns: 1fr;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-program,
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-note,
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-actions {
    grid-column: 1 / -1;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-list li {
    grid-template-columns: 1fr;
  }
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-program-line,
  .admin-page .admin-module-panel[data-module-panel="customers"] .customer-training-note-line {
    grid-column: 1;
  }
}

/* ==========================================================================
   売上ページ 新UI (salesUiV2, 2026-06-14): KPIダッシュボード + 本物のタブ。
   会員ページ新UI(.customer-v2-card 等)と同じトークン・語彙で統一。
   ========================================================================== */

/* KPI 4枚 */
.sales-v2-head { margin-bottom: var(--a-gap-4); }
/* 2026-06: 売上/分析等のKPI帯は各ページの主役なので残すが、高さを詰めてコンパクト化
   (ホームのように廃止はしない。padding と値フォントを縮め、帯の縦を約90px→約60pxに)。 */
.sales-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: var(--a-gap-2); margin-bottom: var(--a-gap-3); }
.sales-kpi {
  background: var(--a-surface); border: 1px solid var(--a-line); border-radius: var(--a-radius);
  padding: var(--a-gap-2) var(--a-gap-3); display: flex; flex-direction: column; gap: 1px;
}
.sales-kpi > span { font-size: var(--a-fs-sm); color: var(--a-text-muted); }
.sales-kpi > strong { font-size: 19px; font-weight: 800; line-height: 1.15; }
.sales-kpi.is-alert { border-color: rgba(201, 42, 42, 0.4); background: var(--a-danger-bg); }
.sales-kpi.is-alert > strong { color: var(--a-danger); }
.sales-kpi-sub { font-size: var(--a-fs-xs); color: var(--a-danger); font-weight: 700; }
.sales-kpi-delta { font-size: var(--a-fs-xs); font-weight: 700; color: var(--a-text-muted); }
.sales-kpi-delta.is-up { color: var(--a-ok); }
.sales-kpi-delta.is-down { color: var(--a-danger); }

/* タブ列。下端の罫線がタブの「土台ライン」になり、各タブはその上に乗る。gap=0 で隣接させ
   タブらしい連続感を出す(ピルのような独立チップにしない)。 */
.sales-v2-tabs,
.a-tabs { display: flex; flex-wrap: wrap; gap: 0; border-bottom: 1px solid var(--a-line); }
/* 純粋な下線タブ。非選択=枠/背景なしの文字のみ / ホバー=文字を濃く+淡い下線 /
   選択中=黒文字+太い黄下線 (CLAUDE.md: 黄ライン=現在地)。ピル枠(border+radius+グレー地)は廃止。
   .admin-page .admin-module-panel まで前置して styles.css の黒ベタ button 救済セレクタに勝たせる。 */
.admin-page .admin-module-panel .sales-v2-tabs button,
.admin-page .admin-module-panel .a-tabs .a-tab {
  appearance: none;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;   /* 選択時の黄下線とベースラインを揃える */
  border-radius: 0 !important;
  margin-bottom: -1px;                                /* タブ列の border-bottom に下線を重ねる */
  padding: var(--a-gap-2) var(--a-gap-3);
  font-size: var(--a-fs-sm); font-weight: 700;
  background: transparent !important;
  color: var(--a-text-muted) !important;
  cursor: pointer;
  transition: color 0.12s ease, border-color 0.12s ease;
}
.admin-page .admin-module-panel .sales-v2-tabs button:hover,
.admin-page .admin-module-panel .a-tabs .a-tab:hover {
  color: var(--a-ink) !important;
  border-bottom-color: var(--a-line) !important;
}
/* 選択中タブ = 黒文字 + 太い黄下線。操作ボタンの黄ベタと役割を分ける(黄ベタ=押す / 黄ライン=今ここ)。 */
.admin-page .admin-module-panel .sales-v2-tabs button.is-active,
.admin-page .admin-module-panel .a-tabs .a-tab.is-active {
  color: var(--a-ink) !important;
  border-bottom-color: var(--a-accent) !important;
  font-weight: 800;
}
.a-segment,
.admin-page .admin-module-panel .a-segment,
.admin-page.admin-spa-shell dialog .a-segment {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--a-gap-1);
}
.admin-page .admin-module-panel .a-segment .a-segment-button,
.admin-page.admin-spa-shell dialog .a-segment .a-segment-button {
  min-height: var(--a-control-height);
  margin: 0 !important;
  padding: 0 var(--a-gap-3) !important;
  border: 1px solid var(--a-line) !important;
  border-radius: var(--a-radius-sm) !important;
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  font-size: var(--a-fs-sm);
  font-weight: 800;
  line-height: 1.2;
  cursor: pointer;
  filter: none !important;
}
.admin-page .admin-module-panel .a-segment .a-segment-button:not(.is-active):hover,
.admin-page.admin-spa-shell dialog .a-segment .a-segment-button:not(.is-active):hover {
  border-color: var(--a-ink) !important;
  color: var(--a-ink) !important;
}
.sales-tab-badge {
  font-size: var(--a-fs-xs); font-weight: 700; color: var(--a-danger); background: var(--a-danger-bg);
  border-radius: var(--a-radius-pill); padding: 0 7px; min-width: 18px; text-align: center;
}

/* 2026-06: 売上ページを左サマリー列+右タブに。上部KPI帯/概要タブ廃止。 */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="plans"] .admin-feature-layout {
  display: grid !important;
  grid-template-columns: minmax(190px, 220px) minmax(0, 1fr) !important;
  gap: var(--a-gap-4) !important;
  align-items: start;
}
[data-module-panel="plans"] .admin-feature-nav[data-sales-hidden] { display: none; }
[data-module-panel="plans"][data-sales-tab] .admin-section-block { display: none; }
[data-module-panel="plans"][data-sales-tab="invoice"] .admin-section-block[data-sales-pane="invoice"],
[data-module-panel="plans"][data-sales-tab="tickets"] .admin-section-block[data-sales-pane="tickets"],
[data-module-panel="plans"][data-sales-tab="revenue"] .admin-section-block[data-sales-pane="revenue"] { display: block; }
/* タブ表示では section-block の上罫線・余白を素直に */
[data-module-panel="plans"][data-sales-tab] .admin-section-block { border-top: none; padding-top: 0; margin-top: 0; }
@media (max-width: 900px) {
  .admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="plans"] .admin-feature-layout { grid-template-columns: 1fr !important; }
}
[data-module-panel="plans"]:not([data-sales-tab]) #sales-summary { display: none; }

/* 概要ダッシュボードのグリッド: 横幅を使い切る2列レイアウト (空白を残さない)。
   月次グラフ=左大(2fr)・担当別=右(1fr)、その下に 未回収・チケット を2列。 */
.sales-overview-grid { display: grid; grid-template-columns: 2fr 1fr; gap: var(--a-gap-3); align-items: start; }
.sales-overview-grid > .customer-v2-card { margin-bottom: 0; }
.sales-ov-wide { grid-column: auto; }
@media (max-width: 900px) { .sales-overview-grid { grid-template-columns: 1fr; } }

/* 月次積み上げ棒 */
.sales-bar-legend { display: flex; gap: var(--a-gap-4); font-size: var(--a-fs-xs); color: var(--a-text-muted); margin-bottom: var(--a-gap-2); }
.sales-bar-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: -1px; }
.sales-dot-ink { background: var(--a-ink); }
.sales-dot-accent { background: var(--a-accent); }
.sales-bars { display: flex; align-items: flex-end; gap: var(--a-gap-3); height: 110px; padding-top: var(--a-gap-2); }
.sales-bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; height: 100%; }
.sales-bar { width: 60%; max-width: 48px; border-radius: 3px 3px 0 0; overflow: hidden; display: flex; flex-direction: column; }
.sales-bar-purchase { background: var(--a-accent); width: 100%; }
.sales-bar-booking { background: var(--a-ink); width: 100%; }
.sales-bar-col.is-current .sales-bar { outline: 2px solid var(--a-accent); outline-offset: 1px; }
.sales-bar-label { font-size: var(--a-fs-xs); color: var(--a-text-muted); }

/* 概要のミニリスト (請求/残少) */
.sales-mini-list { display: flex; flex-direction: column; }
.sales-mini-row { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: var(--a-gap-2);
  padding: var(--a-gap-2) 0; border-bottom: 1px solid var(--a-line); }
.sales-mini-row:last-child { border-bottom: none; }
.sales-mini-row > div:first-child { min-width: 0; }
.sales-mini-row strong { display: block; font-size: var(--a-fs-md); font-weight: 700; }
.sales-mini-row span { display: block; font-size: var(--a-fs-xs); color: var(--a-text-muted); }
.sales-mini-amt { font-weight: 700; font-size: var(--a-fs-md); white-space: nowrap; }
.sales-mini-amt.is-low { color: var(--a-danger); }
.sales-mini-amt.is-zero { color: var(--a-danger); }

/* 担当別シェア横棒 */
.sales-share { display: flex; flex-direction: column; gap: var(--a-gap-2); }
.sales-share-row { display: grid; grid-template-columns: 64px 1fr auto; align-items: center; gap: var(--a-gap-2); }
.sales-share-name { font-size: var(--a-fs-sm); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sales-share-bar { height: 8px; background: var(--a-surface-2); border-radius: var(--a-radius-pill); overflow: hidden; }
.sales-share-bar > span { display: block; height: 100%; background: var(--a-ink); border-radius: var(--a-radius-pill); }
.sales-share-row:first-child .sales-share-bar > span { background: var(--a-accent); }
.sales-share-val { font-size: var(--a-fs-sm); font-weight: 700; white-space: nowrap; }
.sales-share-val small { font-weight: 400; color: var(--a-text-muted); margin-left: 4px; }

/* ==========================================================================
   分析ページ 新UI (reportsUiV2, 2026-06-14): 健康ゾーン(KPI+来店分布+気づき) + 掘り下げタブ。
   売上ページ(.sales-kpis/.sales-v2-tabs) の語彙を再利用しつつ分析固有の要素を追加。
   ========================================================================== */
.reports-v2-head { margin-bottom: var(--a-gap-4); }
.reports-kpis .sales-kpi > span small { font-weight: 400; color: var(--a-text-muted); font-size: var(--a-fs-xs); }
/* ミニゲージ (KPIカード内) */
.reports-gauge { display: block; height: 5px; background: var(--a-surface-2); border-radius: var(--a-radius-pill); overflow: hidden; margin-top: 4px; }
.reports-gauge > span { display: block; height: 100%; background: var(--a-ink); border-radius: var(--a-radius-pill); }

/* 2026-06: 分析ページを左サマリー列+右タブに。KPIは左へ集約、概要タブは右に残す。 */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="reports"] .admin-feature-layout {
  display: grid !important;
  grid-template-columns: minmax(190px, 220px) minmax(0, 1fr) !important;
  gap: var(--a-gap-4) !important;
  align-items: start;
}
@media (max-width: 900px) {
  .admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="reports"] .admin-feature-layout { grid-template-columns: 1fr !important; }
}
[data-module-panel="reports"]:not([data-reports-tab]) #reports-summary { display: none; }
/* サマリー内のゲージは値の下にフル幅 */
.featurev2-summary .reports-gauge { margin-top: 4px; }
/* タブで section-block を出し分け (旧索引navは隠す) */
[data-module-panel="reports"] .admin-feature-nav[data-reports-hidden] { display: none; }
[data-module-panel="reports"][data-reports-tab] .admin-section-block { display: none; }
[data-module-panel="reports"][data-reports-tab="overview"] .admin-section-block[data-report-pane="overview"],
[data-module-panel="reports"][data-reports-tab="utilization"] .admin-section-block[data-report-pane="utilization"],
[data-module-panel="reports"][data-reports-tab="arpu"] .admin-section-block[data-report-pane="arpu"],
[data-module-panel="reports"][data-reports-tab="trial"] .admin-section-block[data-report-pane="trial"],
[data-module-panel="reports"][data-reports-tab="staff"] .admin-section-block[data-report-pane="staff"],
[data-module-panel="reports"][data-reports-tab="cancel"] .admin-section-block[data-report-pane="cancel"],
[data-module-panel="reports"][data-reports-tab="sync"] .admin-section-block[data-report-pane="sync"] { display: block; }
[data-module-panel="reports"][data-reports-tab] .admin-section-block { border-top: none; padding-top: 0; margin-top: 0; }

/* 概要(健康ゾーン)のグリッド: 横幅を使い切る2列。来店分布(全幅) → 気づき|時間帯 → 客単価コンボ(全幅) */
.reports-overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--a-gap-3); align-items: start; }
.reports-overview-grid > .customer-v2-card { margin-bottom: 0; }
.reports-ov-wide { grid-column: 1 / -1; }
@media (max-width: 900px) { .reports-overview-grid { grid-template-columns: 1fr; } }

/* 来店分布の積み上げ横棒 */
.reports-stack { display: flex; height: 28px; border-radius: var(--a-radius-sm); overflow: hidden; background: var(--a-surface-2); }
.reports-stack-seg { display: flex; align-items: center; justify-content: center; color: var(--a-surface); font-size: var(--a-fs-xs); font-weight: 700; min-width: 2px; }
.reports-stack-seg.is-active { background: var(--a-ok); }
.reports-stack-seg.is-watch { background: var(--a-accent); color: var(--a-accent-ink); }
.reports-stack-seg.is-dormant { background: var(--a-warn); }
.reports-stack-seg.is-churn { background: var(--a-danger); }
.reports-stack-legend { display: flex; flex-wrap: wrap; gap: var(--a-gap-3); margin-top: var(--a-gap-2); font-size: var(--a-fs-sm); }
.reports-stack-legend span { display: inline-flex; align-items: baseline; gap: 4px; color: var(--a-text-muted); }
.reports-stack-legend b { color: var(--a-text); font-weight: 700; }
.reports-stack-legend small { color: var(--a-text-muted); }
.reports-stack-legend i { width: 9px; height: 9px; border-radius: 2px; align-self: center; }
.reports-stack-legend i.is-active { background: var(--a-ok); }
.reports-stack-legend i.is-watch { background: var(--a-accent); }
.reports-stack-legend i.is-dormant { background: var(--a-warn); }
.reports-stack-legend i.is-churn { background: var(--a-danger); }
.reports-stack-legend i.is-none { background: var(--a-line); }
.reports-stack-note { margin: var(--a-gap-2) 0 0; font-size: var(--a-fs-sm); }
.reports-stack-note b { color: var(--a-text); }

/* 気づき (自動インサイト) */
.reports-insight-list { display: flex; flex-direction: column; gap: var(--a-gap-2); }
.reports-insight { border-radius: var(--a-radius-sm); padding: var(--a-gap-2) var(--a-gap-3); border-left: 3px solid var(--a-line); background: var(--a-surface-2); }
.reports-insight.is-warn { border-left-color: var(--a-danger); background: var(--a-danger-bg); }
.reports-insight.is-good { border-left-color: var(--a-ok); background: var(--a-ok-bg); }
.reports-insight.is-info { border-left-color: var(--a-line); }
.reports-insight p { margin: 0; font-size: var(--a-fs-md); }
/* insight 本文内の drill-down は「アクションより静かなリンク」(DESIGN.md)。共通 .a-link-button を使い、
   枠付き主操作より静かな視覚階層にする。 */

/* 時間帯別 稼働率 横棒 */
.reports-hours { display: flex; flex-direction: column; gap: 5px; }
.reports-hour-row { display: grid; grid-template-columns: 52px 1fr 40px; align-items: center; gap: var(--a-gap-2); }
.reports-hour-label { font-size: var(--a-fs-xs); color: var(--a-text-muted); }
.reports-hour-bar { height: 10px; background: var(--a-surface-2); border-radius: var(--a-radius-pill); overflow: hidden; }
.reports-hour-bar > span { display: block; height: 100%; background: var(--a-ink); border-radius: var(--a-radius-pill); }
.reports-hour-bar > span.is-peak { background: var(--a-accent); }
.reports-hour-val { font-size: var(--a-fs-xs); font-weight: 700; text-align: right; }

/* 客単価×入会率 コンボ */
.reports-combo-legend { display: flex; gap: var(--a-gap-4); font-size: var(--a-fs-xs); color: var(--a-text-muted); margin-bottom: var(--a-gap-1); }
.reports-combo-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: -1px; }
.reports-combo-legend i.dot-ink { background: var(--a-ink); }
.reports-combo-legend i.dot-accent { background: var(--a-accent); }
.reports-combo-label { font-size: 10px; fill: var(--a-text-muted); }

/* ==========================================================================
   連絡(mail)ページ 新UI (2026-06): 左サマリー列 + 右タブコンテンツ。
   上部KPI帯と概要タブは廃止し、KPIは左サマリー(#mail-summary)へ two-tier 集約。
   ========================================================================== */
/* 2カラム grid: 左=サマリー(~280px) / 右=タブ+セクション。旧索引navは grid から除外(隠す)。
   styles.css:10134 の .admin-module-panel .admin-feature-layout(180-220px) に勝つよう
   .admin-module-panel を前置して詳細度を上げる。 */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="mail"] .admin-feature-layout {
  display: grid !important;
  grid-template-columns: minmax(190px, 220px) minmax(0, 1fr) !important;
  gap: var(--a-gap-4) !important;
  align-items: start;
}
[data-module-panel="mail"] .admin-feature-nav[data-mail-hidden] { display: none; }
[data-module-panel="mail"][data-mail-tab] .admin-section-block { display: none; }
[data-module-panel="mail"][data-mail-tab="templates"] .admin-section-block[data-mail-pane="templates"],
[data-module-panel="mail"][data-mail-tab="delivery"] .admin-section-block[data-mail-pane="delivery"],
[data-module-panel="mail"][data-mail-tab="settings"] .admin-section-block[data-mail-pane="settings"] { display: block; }
[data-module-panel="mail"][data-mail-tab] .admin-section-block { border-top: none; padding-top: 0; margin-top: 0; }
.mail-template-host { margin-top: var(--a-gap-3); }
.mail-template-workbench {
  display: grid;
  grid-template-columns: minmax(230px, 280px) minmax(0, 1fr);
  gap: var(--a-gap-3);
  align-items: start;
}
.mail-template-list {
  display: flex;
  flex-direction: column;
  gap: var(--a-gap-2);
  max-height: calc(100vh - 210px);
  overflow: auto;
  padding: var(--a-gap-2);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface-2);
}
.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .mail-template-item {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: var(--a-gap-1) !important;
  padding: 10px !important;
  border: 1px solid var(--a-line) !important;
  border-radius: var(--a-radius-sm) !important;
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  text-align: left !important;
  box-shadow: none !important;
}
.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .mail-template-item.is-selected {
  border-color: var(--a-ink) !important;
  box-shadow: inset 3px 0 0 var(--a-accent) !important;
}
.mail-template-item-top,
.mail-template-item-sub,
.mail-template-editor-head,
.mail-template-preview-head,
.mail-template-token-row {
  display: flex;
  align-items: center;
}
.mail-template-item-top,
.mail-template-editor-head,
.mail-template-preview-head { justify-content: space-between; gap: var(--a-gap-2); }
.mail-template-item-top strong,
.mail-template-editor h4 { min-width: 0; overflow-wrap: anywhere; }
.mail-template-item-sub {
  gap: var(--a-gap-2);
  min-width: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
}
.mail-template-item-sub span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail-template-item-body {
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.45;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.mail-template-state {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  border-radius: var(--a-radius-pill);
  border: 1px solid currentColor;
  font-size: var(--a-fs-xs);
  font-weight: 700;
}
.mail-template-state.is-on { background: var(--a-ok-bg); color: var(--a-ok); }
.mail-template-state.is-off { background: var(--a-surface-2); color: var(--a-text-muted); }
.mail-template-editor {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--a-gap-3);
  padding: var(--a-gap-4);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface);
}
.mail-template-editor-head {
  padding-bottom: var(--a-gap-3);
  border-bottom: 1px solid var(--a-line);
}
.mail-template-eyebrow {
  display: block;
  margin-bottom: 2px;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 700;
}
.mail-template-switch {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-1);
  padding: 5px 9px;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-pill);
  background: var(--a-surface-2);
  font-size: var(--a-fs-xs);
  font-weight: 700;
  white-space: nowrap;
}
.mail-template-switch input { width: 16px; height: 16px; accent-color: var(--a-accent); }
.mail-template-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--a-gap-3);
}
.mail-template-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  font-size: var(--a-fs-sm);
  font-weight: 700;
}
.mail-template-field.is-wide { grid-column: 1 / -1; }
.mail-template-input {
  width: 100%;
  min-height: 38px;
  box-sizing: border-box;
  padding: 8px 10px;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-text);
  font: inherit;
}
.mail-template-input:disabled { background: var(--a-surface-2); color: var(--a-text-muted); }
.mail-template-body-input {
  min-height: 180px;
  line-height: 1.55;
  resize: vertical;
}
.mail-template-preview {
  padding: var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface-2);
}
.mail-template-preview-head {
  margin-bottom: var(--a-gap-2);
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
}
.mail-template-preview-subject {
  margin-bottom: var(--a-gap-2);
  padding-bottom: var(--a-gap-2);
  border-bottom: 1px solid var(--a-line);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.mail-template-preview-body {
  min-height: 96px;
  padding: var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.mail-template-token {
  display: inline-flex;
  padding: 0 4px;
  border-radius: var(--a-radius-sm);
  background: var(--a-accent);
  color: var(--a-accent-ink);
  font-weight: 800;
}
.mail-template-token-row {
  flex-wrap: wrap;
  gap: var(--a-gap-1);
  margin-top: var(--a-gap-2);
}
.mail-template-token-row span {
  padding: 2px 7px;
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-pill);
  background: var(--a-surface);
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 700;
}
.mail-template-empty {
  display: flex;
  flex-direction: column;
  gap: var(--a-gap-1);
  padding: var(--a-gap-4);
  border: 1px dashed var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface-2);
  color: var(--a-text-muted);
}
.mail-template-empty strong { color: var(--a-text); }
@media (max-width: 900px) {
  .admin-module-panel[data-module-panel="mail"] .admin-feature-layout { grid-template-columns: 1fr !important; }
  .mail-template-workbench { grid-template-columns: 1fr; }
  .mail-template-list {
    max-height: none;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }
}
@media (max-width: 640px) {
  .mail-template-editor-head { align-items: flex-start; flex-direction: column; }
  .mail-template-form { grid-template-columns: 1fr; }
}

/* SMS本文カウンター: 数値の状態だけをCSSで表現し、JSの直書き色を避ける。 */
.admin-sms-note {
  color: var(--a-text-muted);
}
.admin-sms-note.is-over-limit {
  color: var(--a-danger);
  font-weight: 700;
}

/* ==========================================================================
   サイト(site)ページ 新UI (2026-06): 左サマリー列 + 右タブコンテンツ。
   上部KPI帯と概要タブは廃止し、KPIは左サマリー(#site-summary)へ two-tier 集約。
   ========================================================================== */
.site-kpi-link { color: var(--a-accent); text-decoration: none; font-weight: 700; }
.site-kpi-link:hover { text-decoration: underline; }

/* 連絡/サイトの左サマリーカード (.admin-card 付与で白地・罫線・角丸はトークン継承)。
   中身は renderMailV2/renderSiteV2 が .msum-* (ホーム two-tier) で描画。 */
.featurev2-summary { align-self: start; width: 100%; min-width: 0; }
/* サマリー列は狭い縦長なので、全項目を1列で縦に積む。
   stats 自体を縦flexにして tier(今月/配信基盤等)を縦に並べ、各 tier 内の grid も1列に。 */
.featurev2-kpi-stats {
  display: flex !important;
  flex-direction: column;
  gap: var(--a-gap-2);
  grid-template-columns: none !important;
}
.featurev2-summary .msum-grid,
.featurev2-summary .msum-grid-2,
.featurev2-summary .msum-grid-3 { grid-template-columns: 1fr; }
.featurev2-summary .msum-item { padding: 7px 9px; }
.featurev2-summary .msum-item .management-kpi-value { font-size: 17px; }

/* 2026-06: 店舗設定(store)/設定(settings)も左サマリー2カラムに。両者は settings パネルを共有し
   body[data-settings-view] で出し分けるため、styles.css:10401-10411 の 1fr強制(0,4,1 !important)に
   勝つよう [data-module-panel="settings"] を足して詳細度 0,4,2 にする。store-overview/system view は廃止。 */
@media (min-width: 1101px) {
  body.admin-spa-shell[data-settings-view="menus"] .admin-module-panel[data-module-panel="settings"] .admin-feature-layout,
  body.admin-spa-shell[data-settings-view="staff"] .admin-module-panel[data-module-panel="settings"] .admin-feature-layout,
  body.admin-spa-shell[data-settings-view="hours"] .admin-module-panel[data-module-panel="settings"] .admin-feature-layout,
  body.admin-spa-shell[data-settings-view="booking"] .admin-module-panel[data-module-panel="settings"] .admin-feature-layout,
  body.admin-spa-shell[data-settings-view="store-payment"] .admin-module-panel[data-module-panel="settings"] .admin-feature-layout,
  body.admin-spa-shell[data-settings-view="users-permission"] .admin-module-panel[data-module-panel="settings"] .admin-feature-layout,
  body.admin-spa-shell[data-settings-view="integration-ai"] .admin-module-panel[data-module-panel="settings"] .admin-feature-layout,
  body.admin-spa-shell[data-settings-view="data-audit"] .admin-module-panel[data-module-panel="settings"] .admin-feature-layout {
    grid-template-columns: minmax(190px, 220px) minmax(0, 1fr) !important;
    gap: var(--a-gap-4) !important;
    align-items: start;
  }
}
/* store/settings サマリーの出し分け: store系view では #store-summary、settings系view では #settings-summary。 */
#store-summary, #settings-summary { display: none; }
body[data-settings-view="menus"] #store-summary,
body[data-settings-view="staff"] #store-summary,
body[data-settings-view="hours"] #store-summary,
body[data-settings-view="booking"] #store-summary { display: block; }
body[data-settings-view="store-payment"] #settings-summary,
body[data-settings-view="users-permission"] #settings-summary,
body[data-settings-view="integration-ai"] #settings-summary,
body[data-settings-view="data-audit"] #settings-summary { display: block; }
/* v2 未起動(タブ属性なし)の時はサマリーを隠し空箱を出さない (ロールバック整合)。 */
[data-module-panel="mail"]:not([data-mail-tab]) #mail-summary,
[data-module-panel="site"]:not([data-site-tab]) #site-summary { display: none; }

/* 2カラム grid: 左=サマリー / 右=タブ+セクション。旧索引navは grid から除外(隠す)。
   styles.css:10134 のベース2カラム(180-220px)に勝つよう .admin-module-panel 前置 + !important。 */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="site"] .admin-feature-layout {
  display: grid !important;
  grid-template-columns: minmax(190px, 220px) minmax(0, 1fr) !important;
  gap: var(--a-gap-4) !important;
  align-items: start;
}
[data-module-panel="site"] .admin-feature-nav[data-site-hidden] { display: none; }
[data-module-panel="site"][data-site-tab] .admin-section-block { display: none; }
[data-module-panel="site"][data-site-tab="announcements"] .admin-section-block[data-site-pane="announcements"],
[data-module-panel="site"][data-site-tab="contacts"] .admin-section-block[data-site-pane="contacts"],
[data-module-panel="site"][data-site-tab="pages"] .admin-section-block[data-site-pane="pages"] { display: block; }
[data-module-panel="site"][data-site-tab] .admin-section-block { border-top: none; padding-top: 0; margin-top: 0; }
@media (max-width: 900px) {
  .admin-module-panel[data-module-panel="site"] .admin-feature-layout { grid-template-columns: 1fr !important; }
}
.admin-announcement-presets {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.admin-announcement-presets .admin-card-note {
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
}
/* お知らせ公開期間プリセットは「選択」コントロール(主アクションでも破壊操作でもない)。
   裸 button を黒ベタ化する救済セレクタ(admin.css:151 / styles.css:9744)に
   .admin-page .admin-module-panel 前置 + !important で勝たせ、segmented control 化する。
   未選択=ghost(白地+罫線)/ 選択中=黄ベタ。現在地タブ専用の黄ラインとは混同させない
   (CLAUDE.md rule 2.5/3)。前例: .attendance-kind-toggle button.is-active(admin.css:829)。 */
.admin-page .admin-module-panel .admin-announcement-presets button {
  appearance: none;
  border-radius: var(--a-radius-sm) !important;
  padding: 4px 10px;
  min-height: 28px;
  font-size: var(--a-fs-sm);
  font-weight: 600;
  cursor: pointer;
  /* 黒ベタ救済セレクタの transition(background 0.12s)が is-active 切替時の
     背景再計算を白で固着させる Chrome の不具合を回避するため、background を
     transition 対象から外す(枠色の変化のみアニメ)。 */
  transition: border-color 0.12s, color 0.12s !important;
}
/* 未選択=ghost。is-active と同時マッチしないよう :not(.is-active) で排他にし、
   background ショートハンドの !important 競合(同一要素での勝敗)を起こさない。 */
.admin-page .admin-module-panel .admin-announcement-presets button:not(.is-active) {
  background: var(--a-surface) !important;
  color: var(--a-text-muted) !important;
  border: 1px solid var(--a-line) !important;
}
.admin-page .admin-module-panel .admin-announcement-presets button:not(.is-active):hover {
  border-color: var(--a-accent) !important;
  color: var(--a-ink) !important;
}
/* 選択中=黄ベタ。 */
.admin-page .admin-module-panel .admin-announcement-presets button.is-active {
  background: var(--a-accent) !important;
  color: var(--a-accent-ink) !important;
  border: 1px solid var(--a-accent) !important;
}
/* =========================================================================
   admin の各アクション容器内の裸 button(黒ベタ救済 admin.css:151 / styles.css:9744
   に飲み込まれて黒ベタ化)を役割別の見た目に正す。タブ奥に隠れていた分を一掃。
   全規則 .admin-page .admin-module-panel 前置 + !important + --a-* トークンのみ。
   混在容器(保存+削除 等)は per-button/属性/ID で分離し、破壊操作を黄ベタにしない。
   既存実績パターン: announcement actions。
   ========================================================================= */
.admin-announcement-table-field {
  width: 100%;
  box-sizing: border-box;
}

/* 公開サイト導線カード (横並び) */
.site-link-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--a-gap-3); }
a.site-link-card {
  display: flex; flex-direction: column; gap: 2px; text-decoration: none;
  background: var(--a-surface); border: 1px solid var(--a-line); border-radius: var(--a-radius);
  padding: var(--a-gap-3); color: var(--a-text); transition: border-color .12s, background .12s;
}
a.site-link-card:hover { border-color: var(--a-accent); background: var(--a-surface-2); }
a.site-link-card > strong { font-size: var(--a-fs-md); font-weight: 700; }
a.site-link-card > span { font-size: var(--a-fs-xs); color: var(--a-text-muted); }

/* ==========================================================================
   店舗設定(store)統合ページ 新UI (storeUiV2, 2026-06-14): KPI帯 + 5タブ。
   4ビューを1ページに統合。sales/site の語彙を再利用。タブ出し分けは既存
   body[data-settings-view] 機構に乗る(styles.css に store-overview を1値追加)。
   ========================================================================== */
.store-v2-head { margin-bottom: var(--a-gap-4); }

/* 概要: 各設定への導線カード (押下でタブ切替) */
.store-overview-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--a-gap-3); align-items: start; }
/* 導線カード。.admin-page .admin-module-panel まで前置 + !important で styles.css の
   黒ベタ button 救済セレクタに勝たせる (.sales-v2-tabs と同じ specificity 対策)。
   白カードに罫線・hover で黄罫線。色は全てトークン参照。 */
.admin-page .admin-module-panel button.store-hub-card {
  appearance: none; text-align: left; cursor: pointer;
  display: flex; flex-direction: column; gap: 4px;
  background: var(--a-surface) !important;
  border: 1px solid var(--a-line) !important;
  border-radius: var(--a-radius) !important;
  padding: var(--a-gap-3); color: var(--a-text) !important;
  transition: border-color .12s, background .12s;
}
.admin-page .admin-module-panel button.store-hub-card:hover {
  border-color: var(--a-accent) !important;
  background: var(--a-surface-2) !important;
}
button.store-hub-card > strong { font-size: var(--a-fs-md); font-weight: 700; }
button.store-hub-card > span { font-size: var(--a-fs-xs); color: var(--a-text-muted); }

/* ==========================================================================
   ログ専用ページ (2026-06-14): 操作ログ (取消ボタン付き) + 取込ログ を2列横並び。
   ========================================================================== */
/* 操作ログ=縦長リストを広い左列、取込ログ=数行の表を狭い右列。狭幅では1列に折返し。 */
.logs-two-col {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  gap: var(--a-gap-3);
  align-items: start;
}
@media (max-width: 900px) {
  .logs-two-col { grid-template-columns: 1fr; }
}
.admin-log-list { display: flex; flex-direction: column; }
.admin-log-row {
  display: grid; grid-template-columns: 150px 1fr auto; align-items: center; gap: var(--a-gap-3);
  padding: var(--a-gap-2) var(--a-gap-1); border-bottom: 1px solid var(--a-line);
}
.admin-log-row:last-child { border-bottom: none; }
.admin-log-meta { display: flex; flex-direction: column; }
.admin-log-time { font-size: var(--a-fs-sm); color: var(--a-text); font-variant-numeric: tabular-nums; }
.admin-log-user { font-size: var(--a-fs-xs); color: var(--a-text-muted); }
.admin-log-body { display: flex; flex-direction: column; min-width: 0; }
.admin-log-body strong { font-size: var(--a-fs-md); font-weight: 700; }
.admin-log-body span { font-size: var(--a-fs-sm); color: var(--a-text-muted); }
.admin-log-action { display: flex; align-items: center; gap: var(--a-gap-2); justify-content: flex-end; white-space: nowrap; }

/* ==========================================================================
   ホーム 新UI (dashboardUiV2, 2026-06-14): 司令塔ダッシュボード。
   上段=KPI帯 / 中段=本日予定+通知/クイック(既存カードを並べ替え) / 下段=導線ハブ。
   売上・分析のKPI帯(.sales-kpi)と同じトークン・語彙で統一。
   ========================================================================== */
/* 上段: KPI帯 (4枚横並び、狭幅で自動折返し) */
.dashboard-v2-band-card { margin-bottom: var(--a-gap-3); }
.dashboard-v2-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--a-gap-3); }
.dashboard-v2-kpi {
  background: var(--a-surface); border: 1px solid var(--a-line); border-radius: var(--a-radius);
  padding: var(--a-gap-3); display: flex; flex-direction: column; gap: 2px;
}
.dashboard-v2-kpi-label { font-size: var(--a-fs-sm); color: var(--a-text-muted); }
.dashboard-v2-kpi-value { font-size: 24px; font-weight: 800; line-height: 1.1; }
.dashboard-v2-kpi-sub { font-size: var(--a-fs-xs); color: var(--a-text-muted); }

/* 左カラム末尾: 各ページへの導線ハブ (カードを敷き詰め、押下で当該ページへ)。
   コンテナは .dashboard-v2-hub-section、各リンクは a.dashboard-v2-hub-card (クラス名を分離)。 */
.dashboard-v2-hub { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: var(--a-gap-2); }
.dashboard-v2-hub-section .admin-card-head { margin-bottom: var(--a-gap-3); }
a.dashboard-v2-hub-card {
  display: flex; flex-direction: column; gap: 2px; text-decoration: none;
  background: var(--a-surface); border: 1px solid var(--a-line); border-radius: var(--a-radius);
  padding: var(--a-gap-3); color: var(--a-text); transition: border-color .12s, background .12s;
}
a.dashboard-v2-hub-card:hover { border-color: var(--a-accent); background: var(--a-surface-2); }
a.dashboard-v2-hub-card > strong { font-size: var(--a-fs-md); font-weight: 700; }
a.dashboard-v2-hub-card > span { font-size: var(--a-fs-xs); color: var(--a-text-muted); }

/* ==========================================================================
   styles.css からの移設 (a-4: admin パッチ層の段階的畳み込み)
   styles.css 末尾の admin 規則を「Admin:」区切り単位でここへ移し、
   最終的に styles.css から admin 規則を撤去する (冒頭の設計方針どおり)。
   ========================================================================== */

/* ----- Admin: ページ横スクロール撲滅 (旧 styles.css リデザインPhase1) -----
   広い設定テーブルは枠(.admin-table-wrap)内で横スクロールさせ、ページ自体には
   横スクロールを出さない。flex/grid 子の min-width:auto により枠が縮まずページが
   溢れるのを min-width:0 で解消。.admin-page 限定のため公開HPへの副作用は無い。 */
body.admin-page { overflow-x: hidden; }
.admin-page .admin-table-wrap { min-width: 0; max-width: 100%; overflow-x: auto; }
.admin-page .admin-module-panel,
.admin-page .admin-card,
.admin-page .admin-feature-layout,
.admin-page .admin-feature-layout > *,
.admin-page .admin-feature-sections,
.admin-page .admin-feature-sections > *,
.admin-page .customer-workspace,
.admin-page .customer-workspace > * { min-width: 0; }

/* ユーザー一覧のログインID セル: ID テキストと「ID変更」ボタンを横並び。 */
.admin-user-id { font-weight: 600; margin-right: var(--a-gap-2); }

/* ----- セクション見出しに右寄せアクション (例: テンプレート見出しの「テンプレ追加」) -----
   見出し(h3)と操作ボタンを同じ行に左右で並べる。ページ上部の浮いたアクションバーを
   廃し、操作はそのセクションの文脈内に置く方針 (上部余白のページ間ズレ防止)。 */
.admin-section-head-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--a-gap-3);
}
.admin-section-head-actions h3 { margin: 0; }
/* ----- 機能管理ページ内のデザインカタログ iframe (design-catalog.html を内包) -----
   正本は design-catalog.html。ここはそれを表示する枠だけ。高さは固定し内部スクロール。 */
.admin-design-catalog-frame {
  width: 100%;
  height: 70vh;
  min-height: 480px;
  margin-top: var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
  background: var(--a-surface);
}

/* ===== 設定 > ユーザー・権限: コンパクト化 (黒ベタ廃止/行詰め/列内容幅) 2026-06 =====
   styles.css の幅広・黒ベタ基準 (.admin-config-table min-width:1180px / 入力 min-width:220px /
   .permission-table 黒ベタ見出し・●18px・min-width:880px) を後勝ちで上書き。
   敵セレクタ .admin-module-panel:not([data-module-panel="schedule"]) (詳細度 0,2,1) に勝つよう
   #user-table / #permission-matrix の ID を挟む。admin.css は styles.css の後ロード=同点も後勝ち。
   色は全て --a-* トークン参照 (生hex追加なし)。JS/生成物は非接触で再ビルド不要。 */

/* --- アカウント表 #user-table: 列を内容幅にし行を詰める --- */
/* styles.css:10965 (@media min-width:1024px) の
   .admin-config-table { width:100% !important; table-layout:fixed !important } と
   10992 の input/select { width:100% !important } が均等割り・全幅入力の主因。
   #user-table (ID 詳細度 1,0,0) で同じ !important 土俵に乗り、fixed を剥がして内容幅に縮める。
   他の設定テーブル(営業時間/メニュー等)の fixed 均等割りには影響しない (#user-table 限定)。 */
.admin-spa-shell #user-table.admin-config-table {
  min-width: 0 !important;
  width: 100% !important;        /* 横並びカラム(1fr)の幅いっぱいに広げる */
  max-width: 100% !important;
  table-layout: auto !important;
}
/* 2026-06: 表を閲覧専用化(input撤去)したため、列構成は [有効][ID][姓][名][権限][操作]。
   姓・名(3,4列目)はテキスト表示。両列を同じ最小幅に揃えてバランスを取る(姓だけ広い不格好を防ぐ)。 */
.admin-spa-shell #user-table th:nth-child(3),
.admin-spa-shell #user-table td:nth-child(3),
.admin-spa-shell #user-table th:nth-child(4),
.admin-spa-shell #user-table td:nth-child(4) {
  min-width: 72px !important;
  white-space: nowrap !important;
}
/* 有効(1列目)・削除(7列目) は中身が小さいので最小幅・中央 */
.admin-spa-shell #user-table th:first-child,
.admin-spa-shell #user-table td:first-child,
.admin-spa-shell #user-table th:last-child,
.admin-spa-shell #user-table td:last-child {
  width: 1% !important;
  white-space: nowrap !important;
  text-align: center !important;
}
/* ログインID列: span + ID変更ボタンを折り返さず1行 */
.admin-spa-shell #user-table td:nth-child(2) {
  white-space: nowrap !important;
}
.admin-spa-shell #user-table th,
.admin-spa-shell #user-table td {
  padding: 2px 6px !important;
  vertical-align: middle !important;  /* 各セルの内容を上下センターに */
}
.admin-spa-shell #user-table th {
  height: 26px !important;
  font-size: 11px !important;
}
.admin-spa-shell #user-table input,
.admin-spa-shell #user-table select {
  min-height: 24px !important;
  padding: 0 5px !important;
  font-size: 12px !important;
}

/* --- Trainer edit dialog: compact checkbox controls ---
   DESIGN.md: inputs should stay quiet and dense. The generic modal input rule
   gives checkboxes a text-field height, so reset trainer choices to small,
   scannable row controls instead of oversized browser-default checks. */
.admin-page.admin-spa-shell #trainer-edit-dialog .trainer-edit-menus-fieldset {
  margin: 0;
  padding: var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
}
.admin-page.admin-spa-shell #trainer-edit-dialog .trainer-edit-menus-fieldset legend {
  padding: 0 var(--a-gap-1);
  color: var(--a-text);
  font-size: var(--a-fs-sm);
  font-weight: 700;
}
.admin-page.admin-spa-shell #trainer-edit-dialog .trainer-menu-checks {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--a-gap-2);
}
.admin-page.admin-spa-shell #trainer-edit-dialog .trainer-edit-order-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(88px, 0.48fr);
  gap: var(--a-gap-2);
  align-items: stretch;
}
.admin-page.admin-spa-shell #trainer-edit-dialog .trainer-menu-checks label,
.admin-page.admin-spa-shell #trainer-edit-dialog .user-edit-active-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  justify-content: flex-start;
  gap: var(--a-gap-2);
  min-height: 36px;
  margin: 0;
  padding: var(--a-gap-2) var(--a-gap-3);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-text);
  font-size: var(--a-fs-md);
  font-weight: 700;
  line-height: 1.25;
}
.admin-page.admin-spa-shell #trainer-edit-dialog .trainer-menu-checks input[type="checkbox"],
.admin-page.admin-spa-shell #trainer-edit-dialog .user-edit-active-row input[type="checkbox"] {
  flex: 0 0 16px;
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  margin: 0;
  padding: 0;
  border: 1px solid var(--a-text-muted);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  accent-color: var(--a-accent);
}
.admin-page.admin-spa-shell #trainer-edit-dialog .trainer-menu-checks label:has(input:checked),
.admin-page.admin-spa-shell #trainer-edit-dialog .user-edit-active-row:has(input:checked) {
  border-color: color-mix(in srgb, var(--a-accent) 70%, var(--a-line));
  background: color-mix(in srgb, var(--a-accent) 16%, var(--a-surface));
}
.admin-page.admin-spa-shell #trainer-edit-dialog .trainer-menu-checks span {
  min-width: 0;
}

@media (max-width: 600px) {
  .admin-page.admin-spa-shell #trainer-edit-dialog .trainer-menu-checks,
  .admin-page.admin-spa-shell #trainer-edit-dialog .trainer-edit-order-grid {
    grid-template-columns: 1fr;
  }
}

/* --- トレーナー表 #trainer-table: アカウント表と同方針(閲覧専用・全セル中央・内容幅) ---
   #user-table と同じく styles.css の .admin-config-table{width/table-layout:fixed !important}
   と min-width:1180px を ID 詳細度で剥がす。列構成は
   [1有効][2予約][3順][4氏名][5ログインID][6対応メニュー][7権限][8操作]。
   バッジ/番号/時刻は狭く、名前/メニューは内容幅。全セル上下左右センター(CLAUDE.md rule5)。 */
.admin-spa-shell #trainer-table.admin-config-table {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  table-layout: auto !important;
}
.admin-spa-shell #trainer-table th,
.admin-spa-shell #trainer-table td {
  padding: 4px 8px !important;
  text-align: center !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
.admin-spa-shell #trainer-table th {
  height: 30px !important;
  font-size: 11px !important;
}
.admin-spa-shell #trainer-table th:nth-child(1),
.admin-spa-shell #trainer-table td:nth-child(1),
.admin-spa-shell #trainer-table th:nth-child(2),
.admin-spa-shell #trainer-table td:nth-child(2),
.admin-spa-shell #trainer-table th:nth-child(3),
.admin-spa-shell #trainer-table td:nth-child(3),
.admin-spa-shell #trainer-table th:last-child,
.admin-spa-shell #trainer-table td:last-child {
  width: 1% !important;
}
.admin-spa-shell #trainer-table td:nth-child(6) {
  white-space: normal !important;
  line-height: 1.3 !important;
  min-width: 96px !important;
}

/* --- 兼務対応表 #trainer-dualrole-table: 同方針(閲覧専用・全セル中央・内容幅) --- */
.admin-spa-shell #trainer-dualrole-table.admin-config-table {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  table-layout: auto !important;
}
.admin-spa-shell #trainer-dualrole-table th,
.admin-spa-shell #trainer-dualrole-table td {
  padding: 4px 8px !important;
  text-align: center !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
.admin-spa-shell #trainer-dualrole-table th {
  height: 30px !important;
  font-size: 11px !important;
}

/* --- 権限表 #permission-matrix .permission-table: 黒ベタ廃止/●縮小/行詰め --- */
/* table-layout:fixed で役割6列を完全均等に。1列目(権限名)=22%, 役割列=均等13%×6。 */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) #permission-matrix .permission-table {
  min-width: 0;
  width: 100%;
  table-layout: fixed;
}
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) #permission-matrix .permission-table th,
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) #permission-matrix .permission-table td {
  padding: 2px 5px;
  font-weight: 700;
  font-size: 10px;       /* フォントをガツッと縮小 (旧 9px相当の継承→10pxで統一) */
  text-align: center;    /* 全セル左右センター(td の●・th の見出しとも) */
  vertical-align: middle;/* 全セル上下センター */
}
/* 黒ベタ見出し(役割行・権限名列) → 淡いグレー地。これで見出しが「面」として沈み巨大感が消える。 */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) #permission-matrix .permission-table thead th,
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) #permission-matrix .permission-table tbody th {
  background: var(--a-surface-2);
  color: var(--a-text);
}
/* 役割見出し(thead th=2列目以降): 全6列を均等幅(13%)に固定し、長い役割名は自然に2行折返し。
   word-break:break-word は「者」単独行など不格好な改行を生むため使わず、white-space:normal のみ。 */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) #permission-matrix .permission-table thead th {
  width: 14.6%;            /* 役割6列=87.6% / 権限名=12.4%。役割列を広げ長い役割名の改行を綺麗に */
  white-space: normal;
  line-height: 1.35;       /* 2行が窮屈に重ならないよう行間を緩める(旧 12px固定→相対) */
  vertical-align: middle;
  text-align: center;
  height: auto !important;            /* 2行折返しが見切れないよう高さ固定を解除 */
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}
/* ● を小さく緑トークンへ (旧 #0a8c4d 18px → --a-ok 10px) */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) #permission-matrix .permission-table td {
  color: var(--a-ok);
  font-size: 10px;
  line-height: 1;
  text-align: center;
}
/* 権限名(1列目=tbody th / thead th:first-child)。22%固定。役割列(13%×6=78%)と合わせ100%。
   テキストは上下左右センター(全セル共通方針)。 */
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) #permission-matrix .permission-table tbody th,
.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) #permission-matrix .permission-table thead th:first-child {
  text-align: center;
  white-space: nowrap;
  width: 12.4%;            /* 役割6列(14.6%×6=87.6%)の残り。権限名は短いので狭めてOK */
}

/* --- ユーザー・権限ビュー: アカウント表と権限一覧を横並び(左右1行)に ---
   styles.css:10355 の表示制御は .admin-feature-sections > .admin-section-block 直下を対象に
   グループ外を display:none する。HTML構造を変えると制御から外れるため、構造は触らず
   このビュー限定で親を flex 化して2ブロックを横に並べる(両テーブルが ~460px と狭いので収まる)。 */
/* レイアウト: 左カラム=アカウント表(上)+権限一覧(下・折りたたみ), 右カラム=ログイン設定。
   2カラム grid で列を明示配置(列1にアカウント→権限、列2にログイン設定)。 */
body.admin-spa-shell[data-settings-view="users-permission"] .admin-feature-sections {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: var(--a-gap-4);
}
/* タブnav は最上段に全幅で固定 (明示配置しないと grid の自動配置で最下段に回り「タブが下」になる)。 */
body.admin-spa-shell[data-settings-view="users-permission"] .admin-feature-sections > .settings-v2-tabs {
  grid-column: 1 / -1;
  grid-row: 1;
}
body.admin-spa-shell[data-settings-view="users-permission"] #user-section {
  grid-column: 1;
  grid-row: 2;
}
body.admin-spa-shell[data-settings-view="users-permission"] #permission-section {
  grid-column: 1;
  grid-row: 3;
}
/* ログイン設定は右カラムへ。アカウント+権限の高さに沿って上から並ぶ (タブの下の2段)。 */
body.admin-spa-shell[data-settings-view="users-permission"] #login-policy-section {
  grid-column: 2;
  grid-row: 2 / span 2;
}
/* 念のため、上記3つ以外がこのビューに混ざった場合は全幅で下段へ。 */
body.admin-spa-shell[data-settings-view="users-permission"] .admin-feature-sections > .admin-section-block:not(#user-section):not(#permission-section):not(#login-policy-section) {
  grid-column: 1 / -1;
}

/* 権限一覧の折りたたみ(details)の見出し。クリックで開閉、既定は閉じる。 */
body.admin-spa-shell[data-settings-view="users-permission"] .admin-permission-details > summary {
  display: flex;
  align-items: center;
  gap: var(--a-gap-2);
  cursor: pointer;
  list-style: none;
  padding: var(--a-gap-2) 0;
  font-weight: 800;
}
body.admin-spa-shell[data-settings-view="users-permission"] .admin-permission-details > summary::-webkit-details-marker {
  display: none;
}
/* 開閉の三角マーカー(トークン色の文字記号) */
body.admin-spa-shell[data-settings-view="users-permission"] .admin-permission-details > summary::before {
  content: "▸";
  color: var(--a-text-muted);
  transition: transform 0.15s;
}
body.admin-spa-shell[data-settings-view="users-permission"] .admin-permission-details[open] > summary::before {
  content: "▾";
}
body.admin-spa-shell[data-settings-view="users-permission"] .admin-permission-summary-title {
  font-size: var(--a-fs-md);
}

/* --------------------------------------------------------------------------
   Selected choice pattern
   黒地 + 黄色文字は「いま選ばれている選択肢」に限定する。
   対象: モード切替、タブ、プリセット、トレーナー/時間などの候補選択。
   対象外: 保存/登録などの実行ボタン、グローバルナビ、状態バッジ、破壊操作。
   -------------------------------------------------------------------------- */
.admin-page.admin-spa-shell .admin-module-panel .sales-v2-tabs,
.admin-page.admin-spa-shell .admin-module-panel .a-tabs {
  gap: var(--a-gap-1) !important;
  border-bottom: 0 !important;
}

.admin-page.admin-spa-shell .admin-module-panel .sales-v2-tabs button,
.admin-page.admin-spa-shell .admin-module-panel .a-tabs .a-tab {
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 var(--a-gap-3) !important;
  border: 1px solid var(--a-line) !important;
  border-radius: var(--a-radius-sm) !important;
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  font-weight: 800 !important;
}

.admin-page.admin-spa-shell .admin-module-panel .sales-v2-tabs button:not(.is-active):hover,
.admin-page.admin-spa-shell .admin-module-panel .a-tabs .a-tab:not(.is-active):hover {
  border-color: var(--a-ink) !important;
  color: var(--a-ink) !important;
  filter: none !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-calendar-segment button.is-active,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-view-tabs button.is-active,
.admin-page.admin-spa-shell .attendance-kind-toggle button.is-active,
.admin-page.admin-spa-shell .attendance-trainer-options button.is-selected,
.admin-page.admin-spa-shell .attendance-presets button.is-active,
.admin-page.admin-spa-shell .admin-module-panel .a-segment .a-segment-button.is-active,
.admin-page.admin-spa-shell .admin-module-panel .sales-v2-tabs button.is-active,
/* タブ選択中: 黒ベタ → 白地+黄の太い下線 (2026-06-27 ガラスUI/モック整合 + CLAUDE.md rule3
   「黄ライン=現在地タブの選択中表示」へ。黒ベタは軽やかなクリームトーンで浮くため廃止)。 */
.admin-page.admin-spa-shell .admin-module-panel .a-tabs .a-tab.is-active,
.admin-page.admin-spa-shell .admin-module-panel .sales-v2-tabs button.is-active,
.admin-page.admin-spa-shell .admin-module-panel .admin-announcement-presets button.is-active {
  border-color: var(--a-line) !important;
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  box-shadow: inset 0 -3px 0 var(--a-accent) !important;
  filter: none !important;
  font-weight: 700 !important;
}

/* ヘルプの ? は操作ボタンではなく、説明への小さな注釈アイコンとして見せる。 */
.admin-page.admin-spa-shell .admin-module-panel .admin-help > .admin-help-trigger,
.admin-page.admin-spa-shell .admin-help > .admin-help-trigger {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 13px !important;
  width: 13px !important;
  min-width: 13px !important;
  max-width: 13px !important;
  height: 13px !important;
  min-height: 13px !important;
  max-height: 13px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid currentColor !important;
  border-radius: var(--a-radius-pill) !important;
  background: transparent !important;
  color: var(--a-text-muted) !important;
  box-shadow: none !important;
  filter: none !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  cursor: help !important;
  opacity: 0.72;
}
.admin-page.admin-spa-shell .admin-module-panel .admin-help > .admin-help-trigger:hover,
.admin-page.admin-spa-shell .admin-module-panel .admin-help.is-open > .admin-help-trigger,
.admin-page.admin-spa-shell .admin-help > .admin-help-trigger:hover,
.admin-page.admin-spa-shell .admin-help.is-open > .admin-help-trigger {
  background: transparent !important;
  color: var(--a-ink) !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1;
}

.admin-page.admin-spa-shell .admin-module-panel .sales-v2-tabs button.is-active:hover,
.admin-page.admin-spa-shell .admin-module-panel .a-tabs .a-tab.is-active:hover,
.admin-page.admin-spa-shell .admin-module-panel .admin-announcement-presets button.is-active:hover {
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  box-shadow: inset 0 -3px 0 var(--a-accent) !important;
}

/* --------------------------------------------------------------------------
   Button semantics pattern
   黄色グラデーション = 保存/登録/追加/送信/反映などの重要決定。
   黄色単色はボタン背景として使わない。黒地+黄色文字は選択中だけに限定する。
   -------------------------------------------------------------------------- */
.admin-page.admin-spa-shell {
  --a-primary-gradient: linear-gradient(
    180deg,
    color-mix(in srgb, var(--a-accent) 88%, var(--a-surface)) 0%,
    var(--a-accent) 48%,
    color-mix(in srgb, var(--a-accent) 82%, var(--a-accent-ink)) 100%
  );
  --a-primary-gradient-hover: linear-gradient(
    180deg,
    color-mix(in srgb, var(--a-accent) 94%, var(--a-surface)) 0%,
    color-mix(in srgb, var(--a-accent) 96%, var(--a-accent-ink)) 100%
  );
  --a-primary-border: color-mix(in srgb, var(--a-accent) 72%, var(--a-accent-ink));
  --a-primary-shadow: inset 0 1px 0 color-mix(in srgb, var(--a-surface) 68%, transparent);
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"]) button:not([class*="a-btn"]):not(.a-link-button):not(.a-tab):not(.admin-toggle):not(.admin-help-trigger):not([data-admin-tab]):not(.store-hub-card):not(.mail-template-item):not(.customer-v2-photo):not(.customer-v2-avatar-photo):not(.is-active):not(.is-selected),
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-ghost,
.admin-page.admin-spa-shell .admin-header-logout,
.admin-page.admin-spa-shell #admin-shell-logout,
.admin-page.admin-spa-shell .admin-module-panel .a-btn-ghost {
  border: 1px solid var(--a-line) !important;
  border-radius: var(--a-radius-sm) !important;
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  box-shadow: none !important;
  filter: none;
}

.admin-page.admin-spa-shell .admin-module-panel .a-btn-primary,
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-primary {
  border: 1px solid var(--a-primary-border) !important;
  border-radius: var(--a-radius-sm) !important;
  background: var(--a-primary-gradient) !important;
  color: var(--a-accent-ink) !important;
  box-shadow: var(--a-primary-shadow) !important;
  font-weight: 800;
  filter: none;
}

.admin-page.admin-spa-shell .admin-module-panel .a-btn-primary:hover,
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-primary:hover {
  background: var(--a-primary-gradient-hover) !important;
  color: var(--a-accent-ink) !important;
  filter: none !important;
}

.admin-page.admin-spa-shell .admin-module-panel .a-btn-danger,
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-danger {
  border: 1px solid var(--a-danger) !important;
  border-radius: var(--a-radius-sm) !important;
  background: var(--a-surface) !important;
  color: var(--a-danger) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell .admin-module-panel .a-btn-danger:hover,
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-danger:hover {
  background: var(--a-danger-bg) !important;
  color: var(--a-danger) !important;
  filter: none !important;
}

/* fixed pages editor: always expanded; FAQ as stacked Q&A cards */
.admin-page .admin-module-panel .admin-static-pages-list { display: flex; flex-direction: column; gap: var(--a-gap-3); }
.admin-page .admin-module-panel .admin-static-page { border: 1px solid var(--a-line); border-radius: var(--a-radius-sm); background: var(--a-surface); padding: var(--a-gap-3); }
.admin-page .admin-module-panel .admin-static-page-head { margin-bottom: var(--a-gap-2); }
.admin-page .admin-module-panel .admin-static-page-head small { color: var(--a-text-muted); font-weight: 400; }
.admin-page .admin-module-panel .admin-static-page-edit { display: flex; flex-direction: column; gap: var(--a-gap-2); }
.admin-page .admin-module-panel .admin-faq-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--a-gap-2); }
.admin-page .admin-module-panel .admin-faq-card { border: 1px solid var(--a-line); border-radius: var(--a-radius-sm); background: var(--a-surface-2); padding: var(--a-gap-1) var(--a-gap-2); display: flex; flex-direction: column; gap: 2px; }
.admin-page .admin-module-panel .admin-faq-card-actions { display: flex; justify-content: flex-end; }

/* Non-core admin pages: dense operational rhythm.
   Home(dashboard), calendar(schedule), and members(customers) keep their current spacious layouts. */
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) {
  --admin-compact-gap: var(--a-gap-2);
  --admin-compact-gap-tight: var(--a-gap-1);
  --admin-compact-pad: var(--a-gap-2);
  --admin-compact-pad-wide: var(--a-gap-3);
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) > .admin-card:not(:has(> .admin-feature-layout)),
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-section-block,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .customer-v2-card,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-editor,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-preview,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-empty,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-static-page {
  padding: var(--admin-compact-pad-wide) !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-feature-layout {
  gap: var(--admin-compact-gap) !important;
  align-items: start;
}

@media (min-width: 901px) {
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-feature-layout {
    grid-template-columns: minmax(168px, 198px) minmax(0, 1fr) !important;
  }
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-feature-sections,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-feature-nav,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .sales-overview-grid,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .reports-overview-grid,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .store-overview-grid,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .logs-two-col,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .a-field-grid,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-workbench,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-form,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-static-pages-list,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-static-page-edit,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-faq-cards {
  gap: var(--admin-compact-gap) !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-section-block {
  margin-top: var(--admin-compact-gap) !important;
  padding-top: var(--admin-compact-gap) !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-section-block:first-child {
  margin-top: 0 !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-card-head,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-card-head-wrap,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-section-head,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-subsection-head,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .store-v2-head,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .settings-v2-head,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .sales-v2-head,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .reports-v2-head,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-v2-head,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .site-v2-head {
  gap: var(--admin-compact-gap-tight) var(--admin-compact-gap) !important;
  margin-bottom: var(--admin-compact-gap) !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) h3,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) h4 {
  line-height: 1.25;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-card-note,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-section-head small,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-card-head small {
  line-height: 1.35;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .featurev2-summary,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .store-hub-card,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-faq-card {
  padding: var(--admin-compact-pad) !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .featurev2-summary .msum-item,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .sales-kpi,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .customer-v2-keystats > div {
  padding: var(--admin-compact-gap-tight) var(--admin-compact-pad) !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .featurev2-summary .management-kpi-value,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .sales-kpi strong {
  font-size: var(--a-fs-lg) !important;
  line-height: 1.15;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-feature-link {
  min-height: 0 !important;
  padding: var(--admin-compact-pad) !important;
  gap: 2px !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-feature-link span {
  line-height: 1.25;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .sales-v2-tabs,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .a-tabs,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .a-segment,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-announcement-presets {
  gap: var(--admin-compact-gap-tight) !important;
  margin-bottom: var(--admin-compact-gap) !important;
  padding: var(--admin-compact-gap-tight) !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-feature-sections > .sales-v2-tabs,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-feature-sections > .a-tabs {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .sales-v2-tabs button,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .a-tabs .a-tab,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .a-segment .a-segment-button,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-announcement-presets button {
  min-height: 28px !important;
  padding: 4px 8px !important;
  font-size: var(--a-fs-xs) !important;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .a-control,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) input,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) select,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) textarea {
  min-height: 30px;
  padding: 5px 8px;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) textarea {
  line-height: 1.4;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-body-input,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-static-page textarea {
  min-height: 116px;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-preview-body {
  min-height: 72px;
  padding: var(--admin-compact-pad);
  line-height: 1.45;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-table th,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-table td,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .a-table th,
.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .a-table td {
  padding: var(--admin-compact-gap-tight) var(--admin-compact-pad) !important;
  line-height: 1.3;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-list {
  max-height: calc(100vh - 170px);
  padding: var(--admin-compact-pad);
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-item-body {
  -webkit-line-clamp: 1;
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .sales-bars {
  height: 86px;
  gap: var(--admin-compact-gap);
}

.admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .reports-stack {
  height: 22px;
}

@media (max-width: 700px) {
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) > .admin-card:not(:has(> .admin-feature-layout)),
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-section-block,
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .customer-v2-card,
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-editor,
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .mail-template-preview,
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="dashboard"]):not([data-module-panel="schedule"]):not([data-module-panel="customers"]) .admin-static-page {
    padding: var(--admin-compact-pad) !important;
  }
}

/* Mail delivery/settings panes need their own density pass: these forms are not built
   from the shared .a-field components, so compact them explicitly. */
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="delivery"] .admin-feature-sections,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="settings"] .admin-feature-sections {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--a-gap-2) !important;
  align-items: start;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="delivery"] #broadcast-section,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="settings"] #sender-section,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="settings"] #broadcast-history-section {
  grid-column: 1 / -1;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="delivery"] #step-mail-section {
  grid-column: 1 / span 7;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="delivery"] #sms-section {
  grid-column: 8 / -1;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #broadcast-section,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #step-mail-section,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #sms-section,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #sender-section,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #broadcast-history-section {
  padding: var(--a-gap-2) !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #broadcast-section .admin-section-head,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #step-mail-section .admin-section-head,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #sms-section .admin-section-head,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #sender-section .admin-section-head,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #broadcast-history-section .admin-section-head {
  margin-bottom: var(--a-gap-1) !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #broadcast-section .admin-section-head h3,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #step-mail-section .admin-section-head h3,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #sms-section .admin-section-head h3,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #sender-section .admin-section-head h3,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #broadcast-history-section .admin-section-head h3 {
  font-size: var(--a-fs-md);
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-grid,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-form,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-form,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sender-grid {
  gap: var(--a-gap-2) !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: end;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-panel {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--a-gap-2) !important;
  align-items: end;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-panel .admin-broadcast-grid,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-panel .admin-broadcast-message {
  grid-column: 1 / -1;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-panel .admin-broadcast-summary {
  grid-column: 1;
  align-self: center;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-panel .admin-broadcast-actions {
  grid-column: 2;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-form {
  display: grid !important;
  grid-template-columns: minmax(132px, 2fr) minmax(112px, 1.2fr) minmax(72px, 0.6fr) minmax(132px, 1.6fr) minmax(92px, 0.9fr) auto;
  align-items: end;
  margin-bottom: var(--a-gap-2) !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: end;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sender-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: end;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sender-wide {
  grid-column: auto !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-grid label,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-message,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-form label,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-form label,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sender-grid label {
  display: grid !important;
  gap: 2px !important;
  min-width: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs) !important;
  font-weight: 800;
  line-height: 1.2;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-message,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-message {
  grid-column: 1 / -1;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-grid input,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-grid select,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-grid textarea,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-panel textarea,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-form input,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-form select,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-form input,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-form select,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-form textarea,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sender-grid input {
  min-height: 28px !important;
  padding: 4px 7px !important;
  font-size: var(--a-fs-sm);
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-grid textarea,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-panel textarea,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-form textarea {
  height: 44px !important;
  min-height: 44px !important;
  max-height: 64px;
  resize: vertical;
  line-height: 1.3;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-summary,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-note,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sender-note {
  margin: var(--a-gap-1) 0 0 !important;
  font-size: var(--a-fs-xs);
  line-height: 1.35;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-actions,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-actions,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: end;
  margin: 0 !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-actions {
  align-self: end;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-actions {
  grid-column: 1 / -1;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-actions button,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-actions button,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-actions button {
  min-height: 30px !important;
  padding: 5px 10px !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #step-mail-section .admin-table-wrap,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #broadcast-history-section .admin-table-wrap {
  margin-top: var(--a-gap-1) !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #step-mail-section .admin-table th,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #step-mail-section .admin-table td,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #broadcast-history-section .admin-table th,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] #broadcast-history-section .admin-table td {
  padding: 4px 8px !important;
  line-height: 1.25;
}

@media (max-width: 1100px) {
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="delivery"] .admin-feature-sections,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="settings"] .admin-feature-sections,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-grid,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-form,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-form,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sender-grid {
    grid-template-columns: 1fr 1fr;
  }

  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="delivery"] #broadcast-section,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="delivery"] #step-mail-section,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="delivery"] #sms-section,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="settings"] #sender-section,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="settings"] #broadcast-history-section {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="delivery"] .admin-feature-sections,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"][data-mail-tab="settings"] .admin-feature-sections,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-broadcast-grid,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-step-mail-form,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sms-form,
  .admin-page.admin-spa-shell .admin-module-panel[data-module-panel="mail"] .admin-sender-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   ガラスUI (グラスモーフィズム) — 2026-06-27
   モック画像のクリーム地ヘッダー + 磨りガラス質感を admin 全ページへ。
   全規則 .admin-spa-shell スコープ = members/公開HP 非干渉。styles.css より後ロード
   なのでカスケードで勝つ(救済層の黒地/白文字ナビを上書き)。
   progressive enhancement: ここはデフォルト(不透明 *-solid)。半透明+blur は後段の
   @supports ブロックでのみ昇格。reduced-transparency では @media で *-solid へ戻す。
   ========================================================================== */

/* 背景: モック準拠の上部暖色クリーム→下白のグラデ。blur が映える素地。最外殻に当てる。 */
.admin-page.admin-spa-shell {
  background: var(--a-bg-gradient);
  background-attachment: fixed; /* スクロールでも暖色グローの位置を保つ */
}
/* 本文ラッパー .member-main は styles.css:2470 で --gray(#e8e8e8) ベタ塗り = admin の暖色
   グラデを覆っていた。admin スコープでのみ透明化し、下の最外殻グラデを透けさせる。
   会員ページ(.member-main 素体)のグレー背景には触れない。 */
.admin-page.admin-spa-shell .member-main,
.admin-page.admin-spa-shell .admin-management-main {
  background: transparent;
}

/* ヘッダー: 黒地 → クリームガラス (デフォルト不透明)。styles.css:3420 .admin-simple-header
   と :2422 .member-simple-header(黒地) を admin スコープ詳細度で上書き。member 素体は不変。 */
.admin-page.admin-spa-shell .admin-simple-header,
.admin-page.admin-spa-shell .member-simple-header {
  background: var(--a-glass-header-solid);
  position: sticky;
  top: 0;
  z-index: 200;
  border-bottom: 1px solid var(--a-glass-header-border);
  box-shadow: var(--a-glass-highlight), 0 2px 12px rgba(31, 28, 20, 0.06);
}

/* ヘッダー文字反転: 旧黒地前提の白文字/黄文字をクリーム地で可視な黒系へ。
   styles.css:3431 .admin-header-label(黄) / :3446 link / status strong / logout(白) を反転。 */
.admin-page.admin-spa-shell .admin-header-label,
.admin-page.admin-spa-shell .admin-header-status,
.admin-page.admin-spa-shell .admin-header-status strong,
.admin-page.admin-spa-shell .member-header-status,
.admin-page.admin-spa-shell .admin-header-link,
.admin-page.admin-spa-shell .admin-header-logout,
.admin-page.admin-spa-shell .member-logout {
  color: var(--a-glass-header-ink);
}
.admin-page.admin-spa-shell .admin-header-link {
  border-color: var(--a-glass-border-soft);
}

/* ナビ: クリーム地で黒系文字。styles.css:10498/10518 の白文字横ナビに後ロードで勝つ。
   モック準拠でアイコン+テキストを横並び(6px gap)。アイコンは currentColor 追従で
   idle黒(--a-text) / is-active黄pill上(--a-accent-ink) に自動で色が切り替わる。 */
.admin-page.admin-spa-shell .admin-global-nav a {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-1);
  color: var(--a-text);
}
.admin-page.admin-spa-shell .admin-global-nav a .admin-nav-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  color: currentColor;
  vertical-align: middle;
}
.admin-page.admin-spa-shell .admin-global-nav a:not(.is-active) .admin-nav-icon {
  opacity: 0;
}
.admin-page.admin-spa-shell .admin-global-nav a:hover {
  color: var(--a-text);
  background: color-mix(in srgb, var(--a-ink) 6%, transparent);
}
.admin-page.admin-spa-shell .admin-nav-group + .admin-nav-group {
  border-left-color: color-mix(in srgb, var(--a-ink) 12%, transparent);
}
/* 現在地: 既存の黄ベタ(styles.css:10475)を据えつつ、モックの「ホーム」=大きめ pill に。
   黄は不透明維持(ガラス化しない)。内側ハイライト+極薄影で押せる立体感。 */
.admin-page.admin-spa-shell .admin-global-nav a.is-active {
  background: var(--a-accent);
  color: var(--a-accent-ink);
  border-radius: var(--a-radius-pill);
  padding: var(--a-gap-2) var(--a-gap-3);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--a-surface) 50%, transparent), 0 1px 2px color-mix(in srgb, var(--a-accent-ink) 18%, transparent);
}

/* カードのガラス化は opt-in (.a-glass) のみ。一律 .admin-card には絶対に当てない:
   .admin-schedule-card(カレンダー外枠) / .a-table th(sticky見出し) を backdrop-filter の
   containing-block が破壊するため。上位構造カード(ホームの通知/サマリー/クイック操作の外枠)に
   HTML 側で class="a-glass" を付けて使う。デフォルトは不透明。 */
.admin-page.admin-spa-shell .a-glass {
  background: var(--a-glass-card-solid);
  border: 1px solid var(--a-glass-border);
  border-radius: var(--a-radius-glass);
  box-shadow: var(--a-glass-highlight), var(--a-glass-shadow-card);
}

/* モーダル: styles.css:6193 .admin-modal-card の 2px 黒枠 → 1px 白半透明 + 16px 角丸。
   透明ラッパー dialog.admin-modal-overlay には付けない(不可視)。デフォルト不透明。 */
.admin-page.admin-spa-shell .admin-modal-card {
  background: var(--a-glass-modal-solid);
  border: 1px solid var(--a-glass-border);
  border-radius: var(--a-radius-glass);
  box-shadow: var(--a-glass-highlight), var(--a-glass-shadow-modal);
}
.admin-page.admin-spa-shell dialog.admin-modal-overlay::backdrop {
  background: var(--a-glass-overlay);
}

/* フロート(通知/設定ドロップダウン) admin.css の .admin-list-config-pop。
   スクロールを内包しない外殻なので sticky 破壊リスクなし。デフォルト不透明。 */
.admin-page.admin-spa-shell .admin-list-config-pop {
  background: var(--a-glass-float-solid);
  border: 1px solid var(--a-glass-border);
}

/* クイック操作ボタン: モックの黄ベタ大角丸ボタン。styles.css:5935 は既に黄ベタ。
   角丸を 12px に、アイコン上+ラベル下の縦並びに(モック準拠)。 */
.admin-page.admin-spa-shell .management-quick-action {
  border-radius: var(--a-radius-glass-sm);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 12px 8px;
  min-height: 64px;
}
.admin-page.admin-spa-shell .management-quick-action .management-quick-icon {
  width: 22px;
  height: 22px;
  color: currentColor;
}
.admin-page.admin-spa-shell .management-quick-action .management-quick-label {
  font-size: var(--a-fs-sm);
  font-weight: 700;
  line-height: 1;
}

/* レイヤードフラット化 (2026-07-04): ガラスの @supports blur 昇格ブロックを撤去。
   全面が不透明白 + 可視罫線 + 境界影で描画される(半透明で背景が透ける視認性問題を解消)。
   backdrop-filter を使わないため prefers-reduced-transparency の打ち消しも不要になった。 */

/* Home texture pass: milky glass through tokens, without decorative blobs.
   The intent is material quality, not broad layout churn; table/calendar blur remains off. */
.admin-page.admin-spa-shell {
  --a-bg-gradient:
    linear-gradient(180deg, color-mix(in srgb, var(--a-bg) 58%, var(--a-surface-2)) 0%, color-mix(in srgb, var(--a-bg) 64%, var(--a-surface-2)) 28%, color-mix(in srgb, var(--a-bg) 84%, var(--a-surface-2)) 62%, color-mix(in srgb, var(--a-surface) 92%, var(--a-bg)) 100%);
  --a-glass-header: color-mix(in srgb, var(--a-surface) 74%, transparent);
  --a-glass-header-solid: color-mix(in srgb, var(--a-surface) 84%, var(--a-bg));
  --a-glass-header-border: color-mix(in srgb, var(--a-line) 18%, transparent);
  --a-glass-card: color-mix(in srgb, var(--a-surface) 64%, transparent);
  --a-glass-border: color-mix(in srgb, var(--a-surface) 78%, transparent);
  --a-glass-highlight: inset 0 1px 0 color-mix(in srgb, var(--a-surface) 84%, transparent), inset 0 -1px 0 color-mix(in srgb, var(--a-line) 13%, transparent);
  --a-blur-header: 18px;
  --a-blur-card: 16px;
  --a-home-glass:
    linear-gradient(145deg, color-mix(in srgb, var(--a-surface) 64%, transparent), color-mix(in srgb, var(--a-bg) 84%, transparent));
  --a-home-glass-row: linear-gradient(180deg, color-mix(in srgb, var(--a-surface) 82%, transparent), color-mix(in srgb, var(--a-bg) 88%, transparent));
  --a-home-glass-line: color-mix(in srgb, var(--a-line) 22%, transparent);
  --a-home-shadow: 0 18px 38px color-mix(in srgb, var(--a-ink) 4%, transparent), 0 3px 10px color-mix(in srgb, var(--a-ink) 3%, transparent);
  --a-home-row-shadow: 0 6px 14px color-mix(in srgb, var(--a-ink) 3%, transparent);
  --a-home-calendar-cell: color-mix(in srgb, var(--a-surface) 62%, var(--a-surface-2));
  --a-home-calendar-cell-alt: color-mix(in srgb, var(--a-surface) 94%, var(--a-bg));
  --a-home-bell-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M18 8a6 6 0 0 0-12 0c0 7-3 8-3 8h18s-3-1-3-8'/%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M13.73 21a2 2 0 0 1-3.46 0'/%3E%3C/svg%3E");
  --a-home-user-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm0 2c-4.42 0-8 2.24-8 5v1h16v-1c0-2.76-3.58-5-8-5Z'/%3E%3C/svg%3E");
}

.admin-page.admin-spa-shell .admin-shell-header {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--a-surface) 64%, transparent), color-mix(in srgb, var(--a-glass-header-solid) 82%, transparent));
  box-shadow: var(--a-glass-highlight), 0 9px 28px color-mix(in srgb, var(--a-ink) 6%, transparent);
}

.admin-page.admin-spa-shell .admin-shell-header .brand,
.admin-page.admin-spa-shell .admin-shell-header .member-brand {
  position: relative;
}

.admin-page.admin-spa-shell .admin-shell-header .brand img,
.admin-page.admin-spa-shell .admin-shell-header .member-brand img {
  filter: none;
  opacity: 0;
}

.admin-page.admin-spa-shell .admin-shell-header .brand::before,
.admin-page.admin-spa-shell .admin-shell-header .member-brand::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  width: 70px;
  height: 48px;
  pointer-events: none;
  background:
    linear-gradient(var(--a-accent), var(--a-accent)) 0 20px / 1px 8px no-repeat,
    linear-gradient(color-mix(in srgb, var(--a-accent) 84%, var(--a-danger)), color-mix(in srgb, var(--a-accent) 84%, var(--a-danger))) 6px 16px / 1px 14px no-repeat,
    linear-gradient(var(--a-accent), var(--a-accent)) 16px 6px / 3px 31px no-repeat,
    linear-gradient(color-mix(in srgb, var(--a-accent) 68%, var(--a-danger)), color-mix(in srgb, var(--a-accent) 68%, var(--a-danger))) 21px 3px / 3px 38px no-repeat,
    linear-gradient(var(--a-accent), var(--a-accent)) 27px 12px / 3px 21px no-repeat,
    linear-gradient(color-mix(in srgb, var(--a-accent) 56%, var(--a-danger)), color-mix(in srgb, var(--a-accent) 56%, var(--a-danger))) 33px 0 / 3px 44px no-repeat,
    linear-gradient(var(--a-accent), var(--a-accent)) 39px 9px / 3px 25px no-repeat,
    linear-gradient(color-mix(in srgb, var(--a-accent) 72%, var(--a-danger)), color-mix(in srgb, var(--a-accent) 72%, var(--a-danger))) 45px 4px / 3px 36px no-repeat,
    linear-gradient(var(--a-accent), var(--a-accent)) 50px 7px / 3px 29px no-repeat,
    linear-gradient(color-mix(in srgb, var(--a-accent) 66%, var(--a-danger)), color-mix(in srgb, var(--a-accent) 66%, var(--a-danger))) 56px 12px / 2px 22px no-repeat,
    linear-gradient(var(--a-accent), var(--a-accent)) 61px 16px / 2px 14px no-repeat,
    linear-gradient(color-mix(in srgb, var(--a-accent) 82%, var(--a-danger)), color-mix(in srgb, var(--a-accent) 82%, var(--a-danger))) 66px 20px / 2px 8px no-repeat;
  filter: drop-shadow(0 1px 2px color-mix(in srgb, var(--a-accent-ink) 10%, transparent));
  opacity: 0.88;
  z-index: 2;
}

.admin-page.admin-spa-shell .admin-shell-header .brand::after,
.admin-page.admin-spa-shell .admin-shell-header .member-brand::after {
  content: "A   L   I   V   E";
  position: absolute;
  top: 51px;
  left: 0;
  width: 92px;
  pointer-events: none;
  color: var(--a-ink);
  font-family: var(--a-font, system-ui);
  font-size: var(--a-fs-sm);
  font-weight: 400;
  line-height: 1;
  white-space: pre;
  z-index: 2;
}

.admin-page.admin-spa-shell .admin-shell-bell {
  height: 44px;
  min-height: 44px;
  min-width: 88px;
  padding: 0 var(--a-gap-4);
  border: 1px solid color-mix(in srgb, var(--a-line) 15%, transparent);
  border-radius: var(--a-radius-pill);
  background: color-mix(in srgb, color-mix(in srgb, var(--a-surface) 78%, var(--a-bg)) 95%, var(--a-accent));
  color: color-mix(in srgb, var(--a-text) 88%, var(--a-text-muted));
  box-shadow: var(--a-glass-highlight), 0 9px 21px color-mix(in srgb, var(--a-ink) 5%, transparent), 0 2px 5px color-mix(in srgb, var(--a-ink) 3%, transparent);
  font-size: var(--a-fs-lg);
}

.admin-page.admin-spa-shell .admin-shell-bell > span[aria-hidden="true"] {
  position: relative;
  display: inline-block;
  width: 17px;
  height: 18px;
  color: inherit;
  font-size: 0;
  transform: translate(var(--a-gap-2), var(--a-gap-1));
}

.admin-page.admin-spa-shell .admin-shell-bell > span[aria-hidden="true"]::before {
  content: "";
  position: absolute;
  inset: 1px;
  background: currentColor;
  -webkit-mask: var(--a-home-bell-mask) center / contain no-repeat;
  mask: var(--a-home-bell-mask) center / contain no-repeat;
}

.admin-page.admin-spa-shell .admin-shell-bell > span[aria-hidden="true"]::after {
  content: "";
  position: absolute;
  left: 7px;
  bottom: 1px;
  width: 5px;
  height: 5px;
  border-radius: var(--a-radius-pill);
  background: var(--a-accent);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--a-accent-ink) 12%, transparent);
}

.admin-page.admin-spa-shell .admin-shell-bell:hover,
.admin-page.admin-spa-shell .admin-shell-bell:focus-visible {
  background: color-mix(in srgb, color-mix(in srgb, var(--a-surface) 86%, var(--a-bg)) 95%, var(--a-accent));
}

.admin-page.admin-spa-shell .admin-nav-group + .admin-nav-group {
  border-left-color: transparent;
}

.admin-page.admin-spa-shell .admin-shell-bell-count {
  min-width: 19px;
  height: 18px;
  padding: 0 5px;
  display: inline-grid;
  place-items: center;
  color: var(--a-surface);
  transform: translate(18px, -1px);
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status p {
  min-width: 196px;
  max-width: none;
  transform: translateX(var(--a-gap-3));
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status {
  gap: var(--a-gap-2);
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status strong {
  color: color-mix(in srgb, var(--a-home-ink-soft) 82%, var(--a-text-muted));
  font-weight: 600;
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-logout,
.admin-page.admin-spa-shell .admin-shell-header .member-logout,
.admin-page.admin-spa-shell #admin-shell-logout {
  height: 44px;
  min-height: 44px;
  min-width: 96px;
  padding: 0 var(--a-gap-4);
  border-color: color-mix(in srgb, var(--a-line) 18%, transparent) !important;
  border-radius: var(--a-radius-pill) !important;
  background: color-mix(in srgb, color-mix(in srgb, var(--a-surface) 78%, var(--a-bg)) 95%, var(--a-accent)) !important;
  color: color-mix(in srgb, var(--a-text) 88%, var(--a-text-muted));
  box-shadow: var(--a-glass-highlight), 0 9px 21px color-mix(in srgb, var(--a-ink) 5%, transparent), 0 2px 5px color-mix(in srgb, var(--a-ink) 3%, transparent);
  font-size: var(--a-fs-sm);
  font-weight: 800;
  transform: translate(var(--a-gap-1), calc(var(--a-gap-1) / 2));
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status p::after {
  content: "";
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  margin-left: auto;
  border: 1px solid color-mix(in srgb, var(--a-text-muted) 48%, transparent);
  border-radius: var(--a-radius-pill);
  background: color-mix(in srgb, var(--a-text-muted) 54%, transparent);
  -webkit-mask: var(--a-home-user-mask) center / contain no-repeat;
  mask: var(--a-home-user-mask) center / contain no-repeat;
  opacity: 0.72;
  transform: translateX(calc(-1 * var(--a-gap-1)));
}

@media (max-width: 1099px) {
  .admin-page.admin-spa-shell .admin-shell-header {
    flex-wrap: wrap;
    row-gap: var(--a-gap-2);
  }

  .admin-page.admin-spa-shell .admin-shell-header .brand,
  .admin-page.admin-spa-shell .admin-shell-header .member-brand,
  .admin-page.admin-spa-shell .admin-shell-header .admin-header-status {
    order: 1;
  }

  .admin-page.admin-spa-shell .admin-shell-header .admin-header-status {
    flex: 1 1 calc(100% - 112px);
    min-width: 0;
    justify-content: flex-end;
    gap: var(--a-gap-1);
  }

  .admin-page.admin-spa-shell .admin-shell-header .admin-header-status p {
    display: none;
  }

  .admin-page.admin-spa-shell .admin-shell-bell {
    width: 44px;
    min-width: 44px;
    padding: 0;
  }

  .admin-page.admin-spa-shell .admin-shell-bell-count {
    transform: translate(12px, -1px);
  }

  .admin-page.admin-spa-shell .admin-shell-header .admin-header-logout,
  .admin-page.admin-spa-shell .admin-shell-header .member-logout,
  .admin-page.admin-spa-shell #admin-shell-logout {
    min-width: 44px;
    padding: 0 var(--a-gap-2);
  }

  .admin-page.admin-spa-shell .admin-global-nav {
    order: 2;
    flex: 1 0 100%;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    transform: none;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-content: center;
    gap: var(--a-gap-1);
    row-gap: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }

  .admin-page.admin-spa-shell .admin-global-nav::-webkit-scrollbar {
    display: none;
  }

  .admin-page.admin-spa-shell .admin-nav-group {
    flex: 0 0 auto;
  }

  .admin-page.admin-spa-shell .admin-nav-group + .admin-nav-group {
    margin-left: 0;
    padding-left: var(--a-gap-1);
  }

  .admin-page.admin-spa-shell .admin-global-nav a {
    flex: 0 0 auto;
    min-height: 34px;
    white-space: nowrap;
  }
}

@media (min-width: 1100px) {
  .admin-page.admin-spa-shell .admin-shell-header {
    min-height: 88px;
    padding-block: var(--a-gap-2);
    padding-inline: var(--a-gap-5);
  }

  .admin-page.admin-spa-shell .admin-shell-header .brand,
  .admin-page.admin-spa-shell .admin-shell-header .member-brand {
    flex-basis: 126px;
    min-width: 126px;
  }

  .admin-page.admin-spa-shell .admin-global-nav {
    flex: 0 1 890px;
    min-width: 0;
    transform: translate(27px, -5px);
  }

  .admin-page.admin-spa-shell .admin-global-nav a {
    padding-inline: var(--a-gap-1);
  }

  .admin-page.admin-spa-shell .admin-shell-header .brand img,
  .admin-page.admin-spa-shell .admin-shell-header .member-brand img {
    height: 66px;
    max-width: 126px;
  }

  .admin-page.admin-spa-shell .admin-shell-header .brand::before,
  .admin-page.admin-spa-shell .admin-shell-header .member-brand::before {
    top: 4px;
    left: 0;
    transform: none;
  }
}

@media (min-width: 1100px) {
  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-panel {
    padding: var(--a-gap-3) var(--a-gap-4) calc(var(--a-gap-6) * 3) !important;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard {
    gap: var(--a-gap-4);
    width: min(1282px, calc(100vw - 32px));
    max-width: none;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-stack {
    gap: var(--a-gap-4);
  }

  .admin-page.admin-spa-shell .admin-schedule.is-dashboard {
    --attendance-lane-width: 136px;
    --dashboard-day-width: 400px;
    --dashboard-calendar-width: 858px;
    height: 930px;
    overflow-y: auto;
    scrollbar-width: none;
  }

  .admin-page.admin-spa-shell .admin-schedule.is-dashboard::-webkit-scrollbar {
    display: none;
  }
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-card.a-glass {
  background: var(--a-home-glass);
  border-color: var(--a-home-glass-line);
  box-shadow: var(--a-glass-highlight), var(--a-home-shadow);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-notify-card {
  min-height: 321px;
}

@media (min-width: 1100px) {
  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-notify-card {
    height: 321px;
  }
}

.admin-page.admin-spa-shell .management-notify-card .management-notify-list {
  background: var(--a-home-glass-row) !important;
  border: 1px solid var(--a-home-glass-line);
  border-radius: var(--a-radius-glass-sm);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--a-surface) 76%, transparent), var(--a-home-row-shadow);
  overflow: hidden;
  padding: 0 !important;
}

.admin-page.admin-spa-shell .management-notify-card .management-notify-head {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 6px 0 2px !important;
}

.admin-page.admin-spa-shell .management-notify-head .management-notify-count {
  display: inline-grid;
  place-items: center;
  min-width: 17px;
  height: 14px;
  padding: 0 5px;
  border-radius: var(--a-radius-pill);
  font-size: var(--a-fs-xs);
  line-height: 1;
  transform: translate(2px, -6px);
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="dashboard"] .management-notify-card button.management-notify-head {
  border: 0 !important;
  background: transparent !important;
}

body.admin-page.admin-spa-shell button#management-notify-open.management-notify-head {
  border: 0 !important;
  background: transparent !important;
}

.admin-page.admin-spa-shell .management-notify-title {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-2);
  position: relative;
}

.admin-page.admin-spa-shell .management-notify-title::before {
  content: "";
  width: 20px;
  height: 20px;
  background: currentColor;
  -webkit-mask: var(--a-home-bell-mask) center / 17px 17px no-repeat;
  mask: var(--a-home-bell-mask) center / 17px 17px no-repeat;
}

.admin-page.admin-spa-shell .management-notify-title::after {
  content: "";
  position: absolute;
  left: 10px;
  bottom: 3px;
  width: 6px;
  height: 6px;
  border-radius: var(--a-radius-pill);
  background: var(--a-accent);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--a-accent-ink) 14%, transparent);
}

.admin-page.admin-spa-shell .management-notify-expand {
  width: 38px;
  height: 38px;
  border-radius: var(--a-radius-glass-sm);
  border: 1px solid color-mix(in srgb, var(--a-line) 14%, transparent);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--a-surface) 92%, transparent), color-mix(in srgb, var(--a-bg) 94%, transparent));
  color: var(--a-text);
  box-shadow: var(--a-glass-highlight), 0 6px 14px color-mix(in srgb, var(--a-ink) 3%, transparent);
  font-size: 0;
  position: relative;
  transform: translate(calc(-1 * var(--a-gap-1)), calc(-1 * var(--a-gap-1)));
}

.admin-page.admin-spa-shell .management-notify-expand::before {
  content: "";
  position: absolute;
  inset: 10px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M15 3h6v6M10 14 21 3M21 14v5a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M15 3h6v6M10 14 21 3M21 14v5a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: 0.84;
}

.admin-page.admin-spa-shell .management-notify-expand::after {
  content: none;
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-item {
  border: 0 !important;
  border-bottom: 1px solid var(--a-home-glass-line) !important;
  background: color-mix(in srgb, var(--a-surface) 48%, transparent) !important;
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-item:last-child {
  border-bottom: 0 !important;
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-link {
  grid-template-columns: 28px 1fr !important;
  gap: var(--a-gap-2) !important;
  padding: var(--a-gap-3) var(--a-gap-2) !important;
  background: transparent !important;
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-icon {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: var(--a-radius-pill);
  background: color-mix(in srgb, var(--a-accent) 42%, var(--a-surface));
  color: var(--a-accent-ink);
  font-size: 14px;
  font-weight: 900;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--a-surface) 74%, transparent);
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-item.is-error .management-notify-icon {
  background: color-mix(in srgb, var(--a-danger-bg) 72%, var(--a-surface));
  color: var(--a-danger);
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-item.is-ok .management-notify-icon {
  background: color-mix(in srgb, var(--a-ok-bg) 64%, var(--a-surface));
  color: var(--a-ok);
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-item.is-info .management-notify-icon {
  border-radius: var(--a-radius-pill);
  background: color-mix(in srgb, var(--a-info) 8%, var(--a-surface));
  color: color-mix(in srgb, var(--a-info) 88%, var(--a-text));
  font-family: var(--a-font, system-ui);
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-text strong {
  font-size: var(--a-fs-sm);
  line-height: 1.18;
  color: color-mix(in srgb, var(--a-text) 92%, var(--a-text-muted));
  font-weight: 700;
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-text small,
.admin-page.admin-spa-shell .management-notify-list .management-notify-time {
  color: color-mix(in srgb, var(--a-text-muted) 86%, var(--a-text));
  line-height: 1.28;
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-text small {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  padding-right: var(--a-gap-3);
}

.admin-page.admin-spa-shell .management-notify-list .management-notify-dismiss {
  flex-basis: 22px !important;
  width: 22px;
  background: transparent !important;
  color: color-mix(in srgb, var(--a-ink) 72%, transparent);
  font-family: var(--a-font, system-ui);
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
}

.admin-page.admin-spa-shell .management-quick-action {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--a-accent) 18%, var(--a-surface)), color-mix(in srgb, var(--a-accent) 34%, var(--a-surface)));
  color: var(--a-ink);
  border: 1px solid color-mix(in srgb, var(--a-accent) 22%, var(--a-surface));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--a-surface) 72%, transparent), var(--a-home-row-shadow);
}

.admin-page.admin-spa-shell .management-quick-action .management-quick-icon {
  width: 29px;
  height: 29px;
  filter:
    drop-shadow(2px 2px 0 color-mix(in srgb, var(--a-accent-ink) 30%, var(--a-accent)))
    drop-shadow(0 2px 0 color-mix(in srgb, var(--a-surface) 78%, transparent));
  overflow: visible;
}

.admin-page.admin-spa-shell .management-quick-action .management-quick-icon * {
  stroke-width: 1.45;
}

.admin-page.admin-spa-shell .management-quick-action .quick-icon-fill {
  fill: color-mix(in srgb, var(--a-accent) 82%, var(--a-warn));
  stroke: color-mix(in srgb, var(--a-ink) 84%, var(--a-accent-ink));
  stroke-linecap: round;
  stroke-linejoin: round;
}

.admin-page.admin-spa-shell .management-quick-action .quick-icon-line,
.admin-page.admin-spa-shell .management-quick-action .quick-icon-mark {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.admin-page.admin-spa-shell .management-quick-action .quick-icon-mark {
  stroke: color-mix(in srgb, var(--a-surface) 90%, var(--a-accent));
}

.admin-page.admin-spa-shell .management-kpi-stats .msum-item {
  padding-block: 8px;
  border-bottom-color: color-mix(in srgb, var(--a-home-glass-line) 70%, transparent);
}

.admin-page.admin-spa-shell .management-kpi-stats .management-kpi-label {
  color: color-mix(in srgb, var(--a-home-ink-softer) 82%, var(--a-surface));
  font-weight: 700;
}

.admin-page.admin-spa-shell .management-kpi-stats .management-kpi-value {
  color: color-mix(in srgb, var(--a-text) 92%, var(--a-text-muted));
  font-weight: 800;
}

.admin-page.admin-spa-shell .management-kpi-stats .management-kpi-sub {
  color: color-mix(in srgb, var(--a-text-muted) 86%, var(--a-text));
  font-weight: 600;
}

.admin-page.admin-spa-shell .management-kpi-stats .msum-tier {
  gap: 6px;
}

.admin-page.admin-spa-shell .management-kpi-stats .msum-tier-label {
  letter-spacing: 0;
}

.admin-page.admin-spa-shell .management-kpi-stats .msum-today .msum-tier-label {
  color: color-mix(in srgb, var(--a-accent-ink) 72%, var(--a-warn));
}

.admin-page.admin-spa-shell .management-kpi-stats .msum-total .msum-tier-label {
  color: color-mix(in srgb, var(--a-home-ink-soft) 35%, var(--a-surface));
}

.admin-page.admin-spa-shell .management-kpi-stats .msum-grid {
  gap: 8px;
}

.admin-page.admin-spa-shell .msum-item-live {
  border-left-color: var(--a-accent);
  background: linear-gradient(90deg, color-mix(in srgb, var(--a-accent) 3%, transparent), transparent 36%);
}

.admin-page.admin-spa-shell .management-quick-actions {
  gap: 8px;
  transform: translateY(calc(-1 * var(--a-gap-1)));
}

.admin-page.admin-spa-shell .management-side-stack > .management-side-card:has(#management-quick-actions) {
  min-height: 156px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--a-surface) 72%, transparent), color-mix(in srgb, var(--a-bg) 72%, transparent));
}

.admin-page.admin-spa-shell .management-quick-action {
  min-height: 82px;
}

.admin-page.admin-spa-shell .management-today-card .admin-schedule-wrap {
  background: color-mix(in srgb, var(--a-surface) 64%, transparent);
  box-shadow: var(--a-glass-highlight), var(--a-home-shadow);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard {
  --calendar-radius: var(--a-radius-glass);
  background: color-mix(in srgb, var(--a-surface) 68%, var(--a-bg));
  border-color: var(--a-home-glass-line);
  box-shadow: var(--a-glass-highlight), var(--a-home-shadow);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-corner,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head {
  background: linear-gradient(180deg, color-mix(in srgb, var(--a-surface) 78%, var(--a-surface-2)), color-mix(in srgb, var(--a-bg) 78%, var(--a-surface-2)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head.is-today strong {
  min-width: auto;
  height: auto;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--a-text);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head.is-saturday .admin-calendar-weekday {
  color: color-mix(in srgb, var(--a-accent) 78%, var(--a-danger));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head.is-sunday .admin-calendar-weekday {
  color: var(--a-danger);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-slot,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-time {
  background: var(--a-home-calendar-cell);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-slot.is-alt-row,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-time.is-alt-row {
  background: var(--a-home-calendar-cell-alt);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-slot.is-today {
  background: var(--a-home-calendar-cell);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-slot.is-today.is-alt-row {
  background: var(--a-home-calendar-cell-alt);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head::after,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-slot::after,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-lane-labels em + em {
  background: color-mix(in srgb, var(--a-line) 20%, transparent);
  border-left-color: color-mix(in srgb, var(--a-line) 20%, transparent);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-event {
  border-left-width: 3px;
  border-radius: var(--a-radius-sm);
  background: color-mix(in srgb, var(--a-surface) 82%, transparent);
  box-shadow: 0 4px 12px color-mix(in srgb, var(--a-accent-ink) 6%, transparent);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-attendance-line {
  border-radius: var(--a-radius-pill);
  opacity: 0.96;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--a-surface) 34%, transparent), 0 1px 3px color-mix(in srgb, var(--a-ink) 5%, transparent);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-event.is-unreg {
  outline: 0;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-event.is-block {
  background: color-mix(in srgb, var(--a-line) 34%, var(--a-surface));
  border-left-color: color-mix(in srgb, var(--a-line) 44%, var(--a-surface));
  box-shadow: none;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-event.is-block small {
  display: none;
}

/* Home material softening pass: reduce hard ink and grid contrast without
   changing dashboard layout or shared schedule behavior. */
.admin-page.admin-spa-shell {
  --a-home-ink-soft: color-mix(in srgb, var(--a-text) 82%, var(--a-text-muted));
  --a-home-ink-softer: color-mix(in srgb, var(--a-text-muted) 80%, var(--a-text));
  --a-home-soft-line: color-mix(in srgb, var(--a-line) 13%, transparent);
  --a-home-grid-line: color-mix(in srgb, var(--a-line) 18%, transparent);
  --a-home-day-divider: color-mix(in srgb, var(--a-line) 24%, transparent);
  --a-home-dash-line: color-mix(in srgb, var(--a-line) 38%, transparent);
  --a-home-calendar-cell: color-mix(in srgb, var(--a-bg) 20%, var(--a-surface));
  --a-home-calendar-cell-alt: color-mix(in srgb, var(--a-bg) 72%, var(--a-surface));
  --a-home-shadow: 0 20px 42px color-mix(in srgb, var(--a-ink) 5%, transparent), 0 4px 12px color-mix(in srgb, var(--a-ink) 3%, transparent);
  --a-home-row-shadow: 0 7px 15px color-mix(in srgb, var(--a-ink) 3%, transparent), 0 1px 3px color-mix(in srgb, var(--a-ink) 2%, transparent);
  --a-home-chip-shadow: 0 5px 13px color-mix(in srgb, var(--a-accent-ink) 5%, transparent), inset 0 1px 0 color-mix(in srgb, var(--a-surface) 74%, transparent);
}

.admin-page.admin-spa-shell .admin-shell-header {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, color-mix(in srgb, var(--a-surface) 88%, var(--a-bg)) 94%, var(--a-accent)),
      color-mix(in srgb, color-mix(in srgb, var(--a-surface) 74%, var(--a-bg)) 96%, var(--a-accent))
    );
}

.admin-page.admin-spa-shell .admin-global-nav a {
  color: color-mix(in srgb, var(--a-text-muted) 82%, var(--a-text));
  text-shadow: 0 1px 0 color-mix(in srgb, var(--a-surface) 68%, transparent);
}

.admin-page.admin-spa-shell .admin-global-nav a:not(.is-active) strong {
  color: inherit !important;
  font-weight: 600;
}

.admin-page.admin-spa-shell .admin-global-nav a.is-active {
  color: var(--a-accent-ink);
  text-shadow: none;
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status p {
  color: var(--a-home-ink-soft);
}

.admin-page.admin-spa-shell .management-notify-title,
.admin-page.admin-spa-shell .management-side-card h2,
.admin-page.admin-spa-shell .management-side-card h3 {
  color: var(--a-home-ink-soft);
  font-weight: 800;
}

.admin-page.admin-spa-shell .management-notify-title {
  color: color-mix(in srgb, var(--a-text-muted) 88%, var(--a-accent-ink));
  font-weight: 700;
}

.admin-page.admin-spa-shell .management-quick-action {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--a-accent) 38%, var(--a-surface)), color-mix(in srgb, var(--a-accent) 36%, var(--a-surface)));
  border-color: color-mix(in srgb, var(--a-accent) 25%, var(--a-surface));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--a-surface) 74%, transparent), 0 8px 16px color-mix(in srgb, var(--a-accent-ink) 4%, transparent), 0 1px 3px color-mix(in srgb, var(--a-ink) 2%, transparent);
  color: color-mix(in srgb, var(--a-ink) 76%, var(--a-accent-ink));
}

.admin-page.admin-spa-shell .management-quick-action .management-quick-icon {
  filter:
    drop-shadow(1px 1px 0 color-mix(in srgb, var(--a-accent-ink) 22%, var(--a-accent)))
    drop-shadow(0 1px 0 color-mix(in srgb, var(--a-surface) 82%, transparent));
  transform: none;
}

.admin-page.admin-spa-shell .management-quick-action .management-quick-icon * {
  stroke-width: 1.26;
}

.admin-page.admin-spa-shell .management-quick-action .quick-icon-fill {
  fill: color-mix(in srgb, var(--a-accent) 76%, var(--a-warn));
  stroke: color-mix(in srgb, var(--a-ink) 50%, var(--a-accent-ink));
}

.admin-page.admin-spa-shell .management-quick-action .quick-icon-line {
  stroke: color-mix(in srgb, var(--a-ink) 50%, var(--a-accent-ink));
}

.admin-page.admin-spa-shell .management-quick-action .management-quick-label {
  color: color-mix(in srgb, var(--a-text-muted) 86%, var(--a-accent-ink));
  font-size: var(--a-fs-sm);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  transform: translateY(calc(var(--a-gap-1) / 2));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard {
  border-color: var(--a-home-grid-line);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-corner,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head {
  background: linear-gradient(180deg, color-mix(in srgb, var(--a-bg) 88%, var(--a-surface)), color-mix(in srgb, var(--a-bg) 90%, var(--a-accent)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head.is-sunday {
  background: linear-gradient(180deg, color-mix(in srgb, var(--a-surface) 36%, var(--a-surface-2)), color-mix(in srgb, var(--a-surface) 48%, var(--a-surface-2)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-corner,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-time,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-slot {
  border-right-color: var(--a-home-soft-line) !important;
  border-bottom-color: var(--a-home-soft-line) !important;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head::after,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-slot::after {
  width: 1px;
  background: var(--a-home-day-divider);
  opacity: 0.7;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-slot::before {
  width: 1px;
  background-image: repeating-linear-gradient(to bottom, var(--a-home-dash-line) 0 1px, transparent 1px 7px);
  opacity: 0.82;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-worklane {
  border-left-color: var(--a-home-grid-line);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head strong,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-time {
  color: var(--a-home-ink-soft);
  font-weight: 800;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-time {
  color: color-mix(in srgb, var(--a-home-ink-soft) 82%, var(--a-surface));
  font-weight: 400;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-lane-labels {
  background: linear-gradient(180deg, color-mix(in srgb, var(--a-bg) 90%, var(--a-surface)), color-mix(in srgb, var(--a-bg) 92%, var(--a-accent)));
  border-top-color: var(--a-home-soft-line);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-head.is-sunday .admin-calendar-lane-labels {
  background: linear-gradient(180deg, color-mix(in srgb, var(--a-surface) 72%, var(--a-surface-2)), color-mix(in srgb, var(--a-surface) 66%, var(--a-surface-2)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-lane-labels em {
  color: color-mix(in srgb, var(--a-text-muted) 68%, var(--a-surface));
  font-weight: 600;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-lane-labels em + em {
  border-left-color: var(--a-home-soft-line);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-attendance-pillar::before {
  width: 6px;
  border-radius: var(--a-radius-pill);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--a-surface) 24%, transparent), 0 3px 8px color-mix(in srgb, var(--a-ink) 4%, transparent);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block {
  padding-block: 18px 38px;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-attendance-line {
  width: 5px;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-reservation-lane,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-worklane {
  transform: translateY(var(--a-gap-4));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="/ span 11"] {
  padding-block: 18px 18px;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="/ span 11"] .admin-attendance-line {
  margin-top: var(--a-gap-4);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="/ span 9"] {
  padding-block: 18px 0;
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="/ span 9"] .admin-attendance-line {
  margin-top: var(--a-gap-4);
  margin-bottom: calc(-1 * var(--a-gap-4));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="--attendance-lanes:4"][style*="--attendance-lane:0;"] {
  transform: translateX(calc(var(--attendance-lane, 0) * 100% + var(--a-gap-2)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="--attendance-lanes:4"][style*="--attendance-lane:1;"] {
  transform: translateX(calc(var(--attendance-lane, 0) * 100% + var(--a-gap-1)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="--attendance-lanes:4"][style*="--attendance-lane:2;"] {
  transform: translateX(calc(var(--attendance-lane, 0) * 100% - var(--a-gap-2)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="--attendance-lanes:4"][style*="--attendance-lane:3;"] {
  transform: translateX(calc(var(--attendance-lane, 0) * 100% - var(--a-gap-1)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="--attendance-lanes:3"][style*="--attendance-lane:0;"],
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="--attendance-lanes:3"][style*="--attendance-lane:1;"] {
  transform: translateX(calc(var(--attendance-lane, 0) * 100% - var(--a-gap-1)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-calendar-event-block[style*="--attendance-lanes:3"][style*="--attendance-lane:2;"] {
  transform: translateX(calc(var(--attendance-lane, 0) * 100% - var(--a-gap-3)));
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-attendance-pillar strong,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-attendance-time {
  font-weight: 800;
  text-shadow: 0 1px 0 color-mix(in srgb, var(--a-surface) 70%, transparent);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-attendance-time {
  background: color-mix(in srgb, var(--a-surface) 76%, transparent);
  color: var(--a-home-ink-soft);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-event {
  position: relative;
  border: 1px solid color-mix(in srgb, var(--a-line) 24%, transparent);
  border-left-width: 0;
  padding-left: var(--a-gap-2);
  color: var(--a-home-ink-soft);
  background: color-mix(in srgb, var(--a-surface) 97%, transparent);
  box-shadow: var(--a-home-chip-shadow);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-event:not(.is-block)::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  bottom: 3px;
  width: 3px;
  border-radius: var(--a-radius-pill);
  background: var(--a-info);
}

.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-event span,
.admin-page.admin-spa-shell .admin-schedule.is-dashboard .admin-event small {
  font-weight: 800;
}

/* Calendar page tone pass: share the home material language without putting
   backdrop-filter on the interactive calendar grid. */
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule-card {
  background: var(--a-home-glass);
  border-color: var(--a-home-glass-line);
  border-radius: var(--a-radius-glass);
  box-shadow: var(--a-glass-highlight), var(--a-home-shadow);
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-calendar-filters {
  background: var(--a-home-glass-row);
  border-color: var(--a-home-glass-line);
  border-radius: var(--a-radius);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--a-surface) 76%, transparent), var(--a-home-row-shadow);
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) {
  --calendar-radius: var(--a-radius);
  background: color-mix(in srgb, var(--a-surface) 70%, var(--a-bg));
  border-color: var(--a-home-grid-line);
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-corner,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-head {
  background: linear-gradient(180deg, color-mix(in srgb, var(--a-bg) 88%, var(--a-surface)), color-mix(in srgb, var(--a-bg) 90%, var(--a-accent)));
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-corner,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-head,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-time,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-slot {
  border-right-color: var(--a-home-soft-line) !important;
  border-bottom-color: var(--a-home-soft-line) !important;
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-slot,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-time {
  background: var(--a-home-calendar-cell);
}

.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-slot.is-alt-row,
.admin-page.admin-spa-shell .admin-module-panel[data-module-panel="schedule"] .admin-schedule:not(.is-dashboard) .admin-calendar-time.is-alt-row {
  background: var(--a-home-calendar-cell-alt);
}

/* ===========================================================================
   ALIVE HP compact unification — 2026-07-10

   公開HPの黒/白/グレー/黄、直線的なナビ、細い罫線を管理画面へ共有する。
   HPの大きな見出しと広い余白は持ち込まず、既存の13px基準・4px間隔を維持する。
   旧 glass/home トークンは参照互換のまま、ここで不透明な運用UIへ収束させる。
   ========================================================================== */

.admin-page.admin-spa-shell {
  --a-bg-gradient: none;
  --a-glass-header: var(--a-ink);
  --a-glass-header-solid: var(--a-ink);
  --a-glass-header-border: var(--a-accent);
  --a-glass-header-ink: var(--a-surface);
  --a-glass-card: var(--a-surface);
  --a-glass-card-solid: var(--a-surface);
  --a-glass-border: var(--a-line);
  --a-glass-border-soft: color-mix(in srgb, var(--a-surface) 34%, transparent);
  --a-glass-highlight: none;
  --a-glass-shadow-card: none;
  --a-home-glass: var(--a-surface);
  --a-home-glass-row: var(--a-surface-2);
  --a-home-glass-line: var(--a-line);
  --a-home-soft-line: color-mix(in srgb, var(--a-line) 68%, transparent);
  --a-home-grid-line: color-mix(in srgb, var(--a-line) 78%, transparent);
  --a-home-day-divider: var(--a-line);
  --a-home-dash-line: color-mix(in srgb, var(--a-line) 76%, transparent);
  --a-home-calendar-cell: var(--a-surface);
  --a-home-calendar-cell-alt: var(--a-surface-2);
  --a-home-shadow: none;
  --a-home-row-shadow: none;
  --a-home-chip-shadow: none;
  --a-primary-gradient: var(--a-ink);
  --a-primary-gradient-hover: var(--a-ink-soft);
  --a-primary-border: var(--a-ink);
  --a-primary-shadow: none;
  background: var(--a-bg) !important;
  color: var(--a-text);
}

.admin-page.admin-spa-shell .member-main,
.admin-page.admin-spa-shell .admin-management-main {
  background: var(--a-bg) !important;
}

/* Header / global navigation: compact version of the public HP black header. */
.admin-page.admin-spa-shell .admin-shell-header,
.admin-page.admin-spa-shell .admin-simple-header,
.admin-page.admin-spa-shell .member-simple-header {
  min-height: 64px;
  padding: 0 var(--a-gap-4) !important;
  gap: var(--a-gap-3);
  background: var(--a-ink) !important;
  color: var(--a-surface) !important;
  border-bottom: 3px solid var(--a-accent);
  box-shadow: none !important;
}

.admin-page.admin-spa-shell .admin-shell-header .brand,
.admin-page.admin-spa-shell .admin-shell-header .member-brand {
  flex: 0 0 96px;
  min-width: 96px;
  transform: none;
}

.admin-page.admin-spa-shell .admin-shell-header .brand img,
.admin-page.admin-spa-shell .admin-shell-header .member-brand img {
  width: auto;
  height: 48px !important;
  max-width: 96px !important;
  filter: none;
  opacity: 1;
}

.admin-page.admin-spa-shell .admin-shell-header .brand::before,
.admin-page.admin-spa-shell .admin-shell-header .brand::after,
.admin-page.admin-spa-shell .admin-shell-header .member-brand::before,
.admin-page.admin-spa-shell .admin-shell-header .member-brand::after {
  display: none;
}

.admin-page.admin-spa-shell .admin-global-nav {
  flex: 1 1 auto;
  min-width: 0;
  max-width: none;
  justify-content: center;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0;
  transform: none !important;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}

.admin-page.admin-spa-shell .admin-global-nav::-webkit-scrollbar {
  display: none;
}

.admin-page.admin-spa-shell .admin-nav-group {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: stretch;
  gap: 0;
  margin: 0 !important;
  padding: 0 !important;
}

.admin-page.admin-spa-shell .admin-nav-group + .admin-nav-group {
  margin-left: 0;
  padding-left: 0;
  border-left: 0;
}

.admin-page.admin-spa-shell .admin-global-nav a,
.admin-page.admin-spa-shell .admin-global-nav a.is-active {
  min-height: 61px;
  margin: 0;
  padding: 0 var(--a-gap-2) !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: color-mix(in srgb, var(--a-surface) 78%, transparent) !important;
  box-shadow: none !important;
  font-family: var(--a-font, system-ui);
  font-size: var(--a-fs-sm);
  font-weight: 800;
  line-height: 1;
  text-shadow: none;
}

.admin-page.admin-spa-shell .admin-global-nav a:not(.is-active) .admin-nav-icon {
  opacity: 0.56;
}

.admin-page.admin-spa-shell .admin-global-nav a:hover {
  background: color-mix(in srgb, var(--a-surface) 8%, transparent) !important;
  color: var(--a-surface) !important;
}

.admin-page.admin-spa-shell .admin-global-nav a.is-active,
.admin-page.admin-spa-shell .admin-global-nav a.is-active:hover {
  border-bottom-color: var(--a-accent) !important;
  background: transparent !important;
  color: var(--a-surface) !important;
}

.admin-page.admin-spa-shell .admin-global-nav a.is-active .admin-nav-icon {
  color: var(--a-accent);
  opacity: 1;
}

.admin-page.admin-spa-shell .admin-global-nav a strong {
  color: inherit !important;
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status,
.admin-page.admin-spa-shell .admin-shell-header .member-header-status {
  flex: 0 0 auto;
  gap: var(--a-gap-1);
  color: var(--a-surface) !important;
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status p {
  min-width: 0;
  max-width: 176px;
  margin: 0 var(--a-gap-1) 0 0;
  color: color-mix(in srgb, var(--a-surface) 74%, transparent) !important;
  font-size: var(--a-fs-xs);
  transform: none;
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status strong {
  color: var(--a-surface) !important;
  font-weight: 700;
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status p::after {
  display: none;
}

.admin-page.admin-spa-shell .admin-shell-bell,
.admin-page.admin-spa-shell .admin-shell-header .admin-header-logout,
.admin-page.admin-spa-shell .admin-shell-header .member-logout,
.admin-page.admin-spa-shell #admin-shell-logout {
  width: auto;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0 var(--a-gap-2);
  border: 1px solid color-mix(in srgb, var(--a-surface) 34%, transparent) !important;
  border-radius: var(--a-radius-sm) !important;
  background: color-mix(in srgb, var(--a-surface) 6%, transparent) !important;
  color: var(--a-surface) !important;
  box-shadow: none !important;
  font-size: var(--a-fs-xs);
  transform: none;
}

.admin-page.admin-spa-shell .admin-shell-bell:hover,
.admin-page.admin-spa-shell .admin-shell-header .admin-header-logout:hover,
.admin-page.admin-spa-shell #admin-shell-logout:hover {
  border-color: var(--a-surface) !important;
  background: var(--a-surface) !important;
  color: var(--a-ink) !important;
}

.admin-page.admin-spa-shell .admin-shell-bell > span[aria-hidden="true"] {
  transform: none;
}

.admin-page.admin-spa-shell .admin-shell-bell-count {
  transform: none;
}

/* Flat content surfaces: boundaries come from contrast and hairlines, not blur. */
.admin-page.admin-spa-shell .a-glass,
.admin-page.admin-spa-shell .management-side-card,
.admin-page.admin-spa-shell .management-today-card,
.admin-page.admin-spa-shell .admin-schedule-card,
.admin-page.admin-spa-shell .customer-v2-card,
.admin-page.admin-spa-shell .sales-kpi,
.admin-page.admin-spa-shell .store-hub-card,
.admin-page.admin-spa-shell .mail-template-editor,
.admin-page.admin-spa-shell .mail-template-preview,
.admin-page.admin-spa-shell .admin-static-page,
.admin-page.admin-spa-shell .admin-payment-provider-card {
  background: var(--a-surface) !important;
  border: 1px solid var(--a-line) !important;
  border-radius: var(--a-radius) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell .admin-card {
  box-shadow: none !important;
}

/* The home schedule already owns its inner boundary; avoid a nested card frame. */
.admin-page.admin-spa-shell .management-today-card {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

.admin-page.admin-spa-shell .admin-section-block {
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

body.admin-page.admin-spa-shell[data-settings-view="release"] .admin-module-panel[data-module-panel="settings"] .admin-feature-sections {
  grid-column: 1 / -1;
  width: 100%;
}

body.admin-page.admin-spa-shell[data-settings-view="release"] #feature-flags-section {
  width: min(100%, 760px);
}

/* LINE公式アカウント: 秘密値設定・接続状態・会員紐付けを既存の密度で扱う。
   設定内にカードを重ねず、罫線付きのフラットなセクションとして区切る。 */
.admin-page.admin-spa-shell .admin-line-settings {
  display: grid;
  gap: var(--a-gap-2);
  padding: var(--a-gap-3) 0;
  border-top: 1px solid var(--a-line);
  border-bottom: 1px solid var(--a-line);
  background: transparent;
}

.admin-page.admin-spa-shell .admin-line-settings-head,
.admin-page.admin-spa-shell .admin-line-actions,
.admin-page.admin-spa-shell .customer-line-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--a-gap-2);
  flex-wrap: wrap;
}

.admin-page.admin-spa-shell .admin-line-settings-head h4,
.admin-page.admin-spa-shell .admin-line-settings-head p {
  margin: 0;
}

.admin-page.admin-spa-shell .admin-line-settings-head h4 {
  font-size: var(--a-fs-md);
}

.admin-page.admin-spa-shell .admin-line-settings-head p {
  margin-top: var(--a-gap-1);
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
}

.admin-page.admin-spa-shell .admin-line-settings-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--a-gap-2) var(--a-gap-3);
}

.admin-page.admin-spa-shell .admin-line-secret-field,
.admin-page.admin-spa-shell .admin-line-webhook,
.admin-page.admin-spa-shell .customer-line-message {
  display: grid;
  gap: var(--a-gap-1);
  min-width: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 700;
}

.admin-page.admin-spa-shell .admin-line-secret-field input,
.admin-page.admin-spa-shell .admin-line-webhook input,
.admin-page.admin-spa-shell .customer-line-message textarea {
  width: 100%;
  min-width: 0;
  min-height: 34px;
  padding: var(--a-gap-2);
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-text);
  font: inherit;
}

.admin-page.admin-spa-shell .admin-line-secret-field small,
.admin-page.admin-spa-shell .admin-line-webhook small {
  color: var(--a-text-muted);
  font-weight: 400;
}

.admin-page.admin-spa-shell .admin-line-enable {
  display: inline-flex;
  grid-column: 1 / -1;
  align-items: center;
  gap: var(--a-gap-2);
  color: var(--a-text);
  font-size: var(--a-fs-sm);
  font-weight: 700;
}

.admin-page.admin-spa-shell .admin-line-summary {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--a-gap-2);
  margin: 0;
  padding: var(--a-gap-2) 0;
  border-top: 1px solid var(--a-line);
  border-bottom: 1px solid var(--a-line);
}

.admin-page.admin-spa-shell .admin-line-summary div,
.admin-page.admin-spa-shell .customer-line-account div {
  min-width: 0;
}

.admin-page.admin-spa-shell .admin-line-summary dt,
.admin-page.admin-spa-shell .customer-line-account dt {
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 700;
}

.admin-page.admin-spa-shell .admin-line-summary dd,
.admin-page.admin-spa-shell .customer-line-account dd {
  margin: var(--a-gap-1) 0 0;
  color: var(--a-text);
  font-size: var(--a-fs-sm);
  font-weight: 700;
}

.admin-page.admin-spa-shell .admin-line-webhook,
.admin-page.admin-spa-shell .admin-line-actions,
.admin-page.admin-spa-shell .admin-line-webhook-note,
.admin-page.admin-spa-shell .admin-line-result {
  grid-column: 1 / -1;
}

.admin-page.admin-spa-shell .logs-two-col #logs-line-section {
  grid-column: 1 / -1;
}

.admin-page.admin-spa-shell .admin-line-webhook-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--a-gap-1);
}

.admin-page.admin-spa-shell .admin-line-actions {
  justify-content: flex-end;
}

.admin-page.admin-spa-shell .admin-line-result,
.admin-page.admin-spa-shell .customer-line-result,
.admin-page.admin-spa-shell .admin-step-mail-feedback {
  min-height: 1.4em;
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
}

.admin-page.admin-spa-shell .admin-line-result.is-success,
.admin-page.admin-spa-shell .customer-line-result.is-success,
.admin-page.admin-spa-shell .admin-step-line-readiness.is-ready {
  color: var(--a-ok);
}

.admin-page.admin-spa-shell .admin-line-result.is-error,
.admin-page.admin-spa-shell .customer-line-result.is-error,
.admin-page.admin-spa-shell .admin-step-line-readiness.is-waiting {
  color: var(--a-danger);
}

.admin-page.admin-spa-shell .customer-line-account {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--a-gap-2);
  margin: 0 0 var(--a-gap-2);
}

.admin-page.admin-spa-shell .customer-line-guide {
  display: grid;
  gap: var(--a-gap-1);
  margin: 0 0 var(--a-gap-2);
  padding-left: var(--a-gap-4);
  color: var(--a-text);
  font-size: var(--a-fs-sm);
}

.admin-page.admin-spa-shell .customer-line-actions {
  justify-content: flex-start;
  margin-top: var(--a-gap-2);
}

.admin-page.admin-spa-shell .admin-step-line-readiness {
  margin: 0 0 var(--a-gap-2);
  font-size: var(--a-fs-xs);
  font-weight: 700;
}

@media (max-width: 700px) {
  .admin-page.admin-spa-shell .admin-line-settings-form,
  .admin-page.admin-spa-shell .admin-line-summary,
  .admin-page.admin-spa-shell .customer-line-account {
    grid-template-columns: 1fr;
  }
}

.admin-page.admin-spa-shell .management-notify-list,
.admin-page.admin-spa-shell .management-kpi-stats .msum-tier,
.admin-page.admin-spa-shell .management-kpi-stats .msum-item {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell .management-quick-action {
  min-height: 64px;
  padding: var(--a-gap-2);
  border: 1px solid var(--a-line) !important;
  border-top: 3px solid var(--a-accent) !important;
  border-radius: var(--a-radius-sm) !important;
  background: var(--a-surface) !important;
  color: var(--a-ink) !important;
  box-shadow: none !important;
  transform: none;
}

.admin-page.admin-spa-shell .management-quick-action:hover {
  border-color: var(--a-ink) !important;
  background: color-mix(in srgb, var(--a-accent) 24%, var(--a-surface)) !important;
}

.admin-page.admin-spa-shell .management-quick-action .management-quick-icon {
  filter: none;
}

/* Buttons: black is the decisive action; yellow remains current/focus state. */
.admin-page.admin-spa-shell .a-btn-primary,
.admin-page.admin-spa-shell .admin-module-panel .a-btn-primary,
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-primary {
  border-color: var(--a-ink) !important;
  background: var(--a-ink) !important;
  color: var(--a-surface) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell .a-btn-primary:hover,
.admin-page.admin-spa-shell .admin-module-panel .a-btn-primary:hover,
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-primary:hover {
  background: var(--a-ink-soft) !important;
  color: var(--a-surface) !important;
}

.admin-page.admin-spa-shell .a-btn,
.admin-page.admin-spa-shell .admin-module-panel button:not(.admin-toggle):not(.admin-help-trigger):not(.a-link-button) {
  box-shadow: none;
}

/* Inputs and tables use the same compact, high-contrast operational rhythm. */
.admin-page.admin-spa-shell .admin-module-panel input,
.admin-page.admin-spa-shell .admin-module-panel select,
.admin-page.admin-spa-shell .admin-module-panel textarea,
.admin-page.admin-spa-shell dialog input,
.admin-page.admin-spa-shell dialog select,
.admin-page.admin-spa-shell dialog textarea,
.admin-page.admin-spa-shell .admin-login-card input {
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius-sm);
  background: var(--a-surface);
  color: var(--a-text);
  box-shadow: none;
}

.admin-page.admin-spa-shell .admin-module-panel input:hover,
.admin-page.admin-spa-shell .admin-module-panel select:hover,
.admin-page.admin-spa-shell .admin-module-panel textarea:hover {
  border-color: var(--a-ink-soft);
}

.admin-page.admin-spa-shell .admin-table th,
.admin-page.admin-spa-shell .a-table th {
  background: var(--a-surface-2) !important;
  color: var(--a-ink) !important;
  border-bottom-color: var(--a-ink) !important;
  font-weight: 800;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell .admin-table td,
.admin-page.admin-spa-shell .a-table td {
  background: var(--a-surface);
  border-bottom-color: var(--a-line);
}

.admin-page.admin-spa-shell .admin-table tbody tr:hover td,
.admin-page.admin-spa-shell .a-table tbody tr:hover td {
  background: var(--a-surface-2);
}

.admin-page.admin-spa-shell .admin-table tbody tr:is([role="button"], [data-action], [data-customer-id], .customer-mrow):hover td,
.admin-page.admin-spa-shell .a-table tbody tr:is([role="button"], [data-action], [data-customer-id], .customer-mrow):hover td {
  background: color-mix(in srgb, var(--a-accent) 14%, var(--a-surface));
}

/* All tab systems share the HP-style baseline + yellow current underline. */
.admin-page.admin-spa-shell [role="tablist"] {
  gap: 0 !important;
  background: transparent !important;
  border-bottom: 1px solid var(--a-line);
  border-radius: 0 !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell [role="tablist"] [role="tab"] {
  min-height: 32px !important;
  margin: 0 0 -1px !important;
  padding: var(--a-gap-2) var(--a-gap-3) !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--a-text-muted) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell [role="tablist"] [role="tab"]:hover {
  color: var(--a-ink) !important;
  border-bottom-color: var(--a-line) !important;
}

.admin-page.admin-spa-shell [role="tablist"] [role="tab"][aria-selected="true"],
.admin-page.admin-spa-shell [role="tablist"] [role="tab"].is-active {
  color: var(--a-ink) !important;
  border-bottom-color: var(--a-accent) !important;
  font-weight: 800;
}

/* Legacy tab classes predate ARIA roles and carry higher-specificity !important rules. */
.admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(.a-tabs, .sales-v2-tabs, .admin-view-tabs) {
  gap: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--a-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(.a-tabs, .sales-v2-tabs, .admin-view-tabs) :is(.a-tab, button) {
  min-height: 32px !important;
  margin: 0 0 -1px !important;
  padding: var(--a-gap-2) var(--a-gap-3) !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--a-text-muted) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(.a-tabs, .sales-v2-tabs, .admin-view-tabs) :is(.a-tab, button):hover {
  color: var(--a-ink) !important;
  border-bottom-color: var(--a-line) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(.a-tabs, .sales-v2-tabs, .admin-view-tabs) :is(.a-tab, button).is-active,
.admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(.a-tabs, .sales-v2-tabs, .admin-view-tabs) :is(.a-tab, button)[aria-selected="true"] {
  background: transparent !important;
  color: var(--a-ink) !important;
  border-bottom-color: var(--a-accent) !important;
  box-shadow: none !important;
  font-weight: 800 !important;
}

/* Dialogs and floating tools stay clearly above the flat page without glass. */
.admin-page.admin-spa-shell .admin-modal-card,
.admin-page.admin-spa-shell .a-confirm,
.admin-page.admin-spa-shell .admin-list-config-pop {
  background: var(--a-surface) !important;
  border: 1px solid var(--a-line) !important;
  border-radius: var(--a-radius) !important;
  box-shadow: var(--a-shadow) !important;
}

.admin-page.admin-spa-shell :where(a, button, input, select, textarea, [role="button"]):focus-visible {
  outline: 2px solid var(--a-ink) !important;
  outline-offset: 2px;
  box-shadow: var(--a-focus-ring) !important;
}

.admin-page.admin-spa-shell .admin-shell-header :where(a, button):focus-visible {
  outline-color: var(--a-surface) !important;
  outline-offset: -2px;
}

/* Login keeps the HP color band, but uses admin-scale type and spacing. */
.admin-page.admin-spa-shell .management-login {
  gap: var(--a-gap-3);
  padding: var(--a-gap-6) var(--a-gap-3) calc(var(--a-gap-6) * 2);
}

.admin-page.admin-spa-shell .management-login .member-reserve-head,
.admin-page.admin-spa-shell .management-login .admin-login-card {
  width: min(100%, 440px);
  max-width: 440px;
}

.admin-page.admin-spa-shell .management-login .member-reserve-head h1 {
  margin: var(--a-gap-1) 0 0;
  font-size: 32px;
  line-height: 1.15;
}

.admin-page.admin-spa-shell .management-login .admin-login-card {
  gap: var(--a-gap-3);
  padding: var(--a-gap-4);
  border: 1px solid var(--a-ink);
  border-radius: var(--a-radius);
  box-shadow: none;
}

@media (min-width: 1100px) {
  .admin-page.admin-spa-shell .admin-shell-header {
    min-height: 64px;
    padding-block: 0 !important;
    flex-wrap: nowrap;
  }

  .admin-page.admin-spa-shell .admin-shell-header .brand,
  .admin-page.admin-spa-shell .admin-shell-header .member-brand {
    flex-basis: 96px;
    min-width: 96px;
  }

  .admin-page.admin-spa-shell .admin-global-nav {
    flex: 1 1 auto;
    transform: none;
  }
}

@media (max-width: 1099px) {
  .admin-page.admin-spa-shell .admin-shell-header {
    min-height: 86px;
    padding: var(--a-gap-1) var(--a-gap-3) 0 !important;
    row-gap: 0;
    flex-wrap: wrap;
  }

  .admin-page.admin-spa-shell .admin-shell-header .brand,
  .admin-page.admin-spa-shell .admin-shell-header .member-brand,
  .admin-page.admin-spa-shell .admin-shell-header .admin-header-status {
    order: 1;
  }

  .admin-page.admin-spa-shell .admin-shell-header .brand img,
  .admin-page.admin-spa-shell .admin-shell-header .member-brand img {
    height: 38px !important;
  }

  .admin-page.admin-spa-shell .admin-shell-header .admin-header-status {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    justify-content: flex-end;
  }

  .admin-page.admin-spa-shell .admin-shell-header .admin-header-status p {
    display: none;
  }

  .admin-page.admin-spa-shell .admin-global-nav {
    order: 2;
    flex: 1 0 100%;
    width: 100%;
    min-height: 40px;
    justify-content: flex-start;
    border-top: 1px solid color-mix(in srgb, var(--a-surface) 16%, transparent);
  }

  .admin-page.admin-spa-shell .admin-global-nav a,
  .admin-page.admin-spa-shell .admin-global-nav a.is-active {
    min-height: 40px;
  }
}

@media (max-width: 900px) {
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="plans"] .admin-feature-layout,
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="reports"] .admin-feature-layout,
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="mail"] .admin-feature-layout,
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="site"] .admin-feature-layout,
  .admin-page.admin-spa-shell .admin-module-panel:not([data-module-panel="schedule"])[data-module-panel="settings"] .admin-feature-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 1320px) and (min-width: 1100px) {
  .admin-page.admin-spa-shell .admin-shell-header .admin-header-status p {
    display: none;
  }
}

@media (max-width: 600px) {
  .admin-page.admin-spa-shell .admin-shell-header {
    padding-inline: var(--a-gap-2) !important;
  }

  .admin-page.admin-spa-shell .admin-global-nav a,
  .admin-page.admin-spa-shell .admin-global-nav a.is-active {
    padding-inline: var(--a-gap-2) !important;
    font-size: var(--a-fs-xs);
  }

  .admin-page.admin-spa-shell .admin-global-nav .admin-nav-icon {
    width: 14px;
    height: 14px;
  }

  .admin-page.admin-spa-shell .management-login {
    padding-top: var(--a-gap-4);
  }

  .admin-page.admin-spa-shell .management-login .member-reserve-head h1 {
    font-size: 28px;
  }
}

/* ===========================================================================
   Admin home sample — Apple design principles (2026-07-22)

   予定表は読み取りの主役として不透明な面に置き、サマリー・通知・クイック操作は
   ひとつの機能的な material layer にまとめる。静的な数値は無枠、操作だけを明確に
   押せる形にして、過去の home/glass/flat 上書きをこのスコープで一つに収束させる。
   ========================================================================== */
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] {
  --a-home-radius: calc(var(--a-radius) + var(--a-gap-2));
  --a-home-control-radius: calc(var(--a-radius-sm) + var(--a-gap-1));
  --a-home-side-min: calc(var(--a-gap-6) * 13);
  --a-home-panel-solid: color-mix(in srgb, var(--a-surface) 94%, var(--a-bg));
  --a-home-panel-glass: color-mix(in srgb, var(--a-surface) 78%, transparent);
  --a-home-hairline: color-mix(in srgb, var(--a-line) 74%, transparent);
  --a-home-hover: color-mix(in srgb, var(--a-ink) 4%, var(--a-surface));
  --a-home-accent-soft: color-mix(in srgb, var(--a-accent) 44%, var(--a-surface));
  --a-home-motion-fast: 100ms;
  --a-home-motion-base: 220ms;
  --a-home-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] > .admin-management-main {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--a-surface) 42%, var(--a-bg)) 0,
    var(--a-bg) calc(var(--a-gap-6) * 18)
  ) !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-panel {
  padding: clamp(var(--a-gap-4), 4vw, calc(var(--a-gap-6) * 2))
    clamp(var(--a-gap-3), 4vw, calc(var(--a-gap-6) * 2))
    calc(var(--a-gap-6) * 3) !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard-head {
  display: block !important;
  margin: 0 0 var(--a-gap-6) !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard-copy {
  display: grid;
  gap: var(--a-gap-1);
  width: 100%;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard-copy .eyebrow {
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard-copy h1 {
  margin: 0;
  color: var(--a-text);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: calc(var(--a-fs-lg) * 2.25);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard-lead {
  max-width: calc(var(--a-gap-6) * 24);
  margin: var(--a-gap-1) 0 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-md);
  line-height: 1.65;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard {
  display: grid !important;
  grid-template-columns: minmax(0, 1.7fr) minmax(var(--a-home-side-min), 0.82fr) !important;
  gap: var(--a-gap-4) !important;
  align-items: start;
}

/* Main schedule surface: solid and stable so dense calendar data remains crisp. */
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-primary-surface {
  order: 1 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid var(--a-home-hairline) !important;
  border-radius: var(--a-home-radius) !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-primary-surface > .admin-card-head {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: var(--a-gap-3);
  min-height: calc(var(--a-control-height) + var(--a-gap-6));
  margin: 0 !important;
  padding: var(--a-gap-3) var(--a-gap-4) !important;
  border-bottom: 1px solid var(--a-home-hairline);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] :is(.management-primary-surface, .management-side-card) h2,
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-notify-title {
  margin: 0;
  color: var(--a-text);
  font-size: var(--a-fs-lg);
  font-weight: 700;
  line-height: 1.3;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-card-link {
  display: inline-flex;
  align-items: center;
  gap: var(--a-gap-1);
  min-height: var(--a-control-height);
  padding: 0 var(--a-gap-3);
  border: 1px solid var(--a-home-hairline);
  border-radius: var(--a-radius-pill);
  background: var(--a-home-hover);
  color: var(--a-text);
  font-size: var(--a-fs-sm);
  font-weight: 700;
  text-decoration: none;
  transition:
    transform var(--a-home-motion-fast) ease-out,
    background var(--a-home-motion-base) var(--a-home-ease),
    border-color var(--a-home-motion-base) var(--a-home-ease);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-card-link:hover {
  border-color: var(--a-ink-soft);
  background: var(--a-surface-2);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-card-link:active {
  transform: scale(0.97);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-today-schedule,
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-primary-surface .admin-schedule-wrap {
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-primary-surface .admin-schedule.is-dashboard {
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
}

/* One functional material layer; child sections are intentionally unframed. */
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-stack {
  display: flex !important;
  flex-direction: column;
  order: 2 !important;
  align-self: start !important;
  gap: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  margin: 0;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid var(--a-home-hairline);
  border-radius: var(--a-home-radius);
  background: var(--a-home-panel-solid);
  box-shadow: none;
}

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-stack {
    background: var(--a-home-panel-glass);
    -webkit-backdrop-filter: saturate(118%) blur(calc(var(--a-gap-2) * 2));
    backdrop-filter: saturate(118%) blur(calc(var(--a-gap-2) * 2));
  }
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-card.a-glass {
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  flex: none !important;
  margin: 0 !important;
  padding: var(--a-gap-4) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-card + .management-side-card {
  border-top: 1px solid var(--a-home-hairline) !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-card > .admin-card-head {
  min-height: 0;
  margin: 0 0 var(--a-gap-3) !important;
  padding: 0 !important;
  border: 0;
  background: transparent !important;
}

/* Static metrics remain quiet: typography and spacing, without button-like frames. */
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-stats,
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-tier {
  display: grid;
  gap: var(--a-gap-3);
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-tier + .msum-tier {
  padding-top: var(--a-gap-3);
  border-top: 1px solid var(--a-home-hairline);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .msum-tier-label {
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: var(--a-gap-3) var(--a-gap-4) !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-today .msum-item:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-item {
  display: grid;
  gap: var(--a-gap-1);
  min-width: 0;
  margin: 0;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-item-live {
  padding-left: var(--a-gap-2) !important;
  border-left: 2px solid var(--a-accent) !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-label {
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.35;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-value {
  color: var(--a-text);
  font-size: calc(var(--a-fs-lg) + var(--a-gap-1));
  font-weight: 700;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-kpi-sub {
  overflow: hidden;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Notification heading is a full-width disclosure control, not a static card title. */
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] button#management-notify-open.management-notify-head {
  display: flex !important;
  width: 100%;
  min-height: var(--a-control-height) !important;
  margin: 0 0 var(--a-gap-2) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: var(--a-radius-sm) !important;
  background: transparent !important;
  color: var(--a-text) !important;
  box-shadow: none !important;
  transform: none;
  transition:
    transform var(--a-home-motion-fast) ease-out,
    opacity var(--a-home-motion-base) var(--a-home-ease);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] button#management-notify-open.management-notify-head:hover {
  opacity: 0.68;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] button#management-notify-open.management-notify-head:active {
  transform: scale(0.98);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-notify-count {
  min-width: calc(var(--a-gap-6) - var(--a-gap-1));
  height: calc(var(--a-gap-6) - var(--a-gap-1));
  padding: 0 var(--a-gap-1);
  border-radius: var(--a-radius-pill);
  background: var(--a-accent);
  color: var(--a-accent-ink);
  font-size: var(--a-fs-xs);
  font-weight: 800;
  line-height: calc(var(--a-gap-6) - var(--a-gap-1));
  text-align: center;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-notify-list {
  min-height: 0 !important;
  overflow: hidden;
  background: transparent !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-notify-item {
  border-top: 1px solid var(--a-home-hairline);
  background: transparent !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-notify-link {
  border-radius: var(--a-radius-sm);
  transition: background var(--a-home-motion-base) var(--a-home-ease);
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-notify-link:hover {
  background: var(--a-home-hover);
}

/* Quick actions are the strongest controls on the page. */
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-quick-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--a-gap-2) !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-quick-action {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: var(--a-gap-2) !important;
  min-width: 0;
  min-height: calc(var(--a-control-height) + var(--a-gap-4)) !important;
  padding: var(--a-gap-2) !important;
  border: 1px solid var(--a-home-hairline) !important;
  border-top: 1px solid var(--a-home-hairline) !important;
  border-radius: var(--a-home-control-radius) !important;
  background: color-mix(in srgb, var(--a-surface) 72%, transparent) !important;
  color: var(--a-text) !important;
  box-shadow: none !important;
  text-decoration: none;
  transform: scale(1);
  transition:
    transform var(--a-home-motion-fast) ease-out,
    background var(--a-home-motion-base) var(--a-home-ease),
    border-color var(--a-home-motion-base) var(--a-home-ease) !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-quick-action:hover {
  border-color: var(--a-ink-soft) !important;
  background: var(--a-surface) !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-quick-action:active {
  transform: scale(0.97) !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-quick-action .management-quick-icon {
  flex: 0 0 auto;
  width: calc(var(--a-gap-6) - var(--a-gap-1));
  height: calc(var(--a-gap-6) - var(--a-gap-1));
  padding: var(--a-gap-1);
  border-radius: var(--a-radius-pill);
  background: var(--a-home-accent-soft);
  color: var(--a-ink) !important;
  box-sizing: content-box;
  filter: none !important;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-quick-label {
  overflow: hidden;
  font-size: var(--a-fs-sm);
  font-weight: 700;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Calm entrance; all controls remain immediately interruptible. */
@keyframes alive-admin-home-enter {
  from {
    opacity: 0.01;
    transform: translateY(var(--a-gap-2));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-panel:not([hidden]) .management-dashboard-head,
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-panel:not([hidden]) .management-primary-surface,
.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-panel:not([hidden]) .management-side-stack {
  animation: alive-admin-home-enter var(--a-home-motion-base) var(--a-home-ease) both;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-panel:not([hidden]) .management-primary-surface {
  animation-delay: 40ms;
}

.admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-panel:not([hidden]) .management-side-stack {
  animation-delay: 80ms;
}

@media (max-width: 980px) {
  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-stack {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-summary-card {
    grid-column: 1 / -1;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-quick-card {
    border-top: 1px solid var(--a-home-hairline) !important;
    border-left: 1px solid var(--a-home-hairline) !important;
  }
}

@media (max-width: 600px) {
  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-panel {
    padding: var(--a-gap-4) var(--a-gap-2) calc(var(--a-gap-6) * 3) !important;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard-head {
    margin-bottom: var(--a-gap-4) !important;
    padding-inline: var(--a-gap-1) !important;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-dashboard {
    gap: var(--a-gap-3) !important;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-stack {
    display: flex !important;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-quick-card {
    border-left: 0 !important;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-card.a-glass {
    padding: var(--a-gap-3) !important;
  }

  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-primary-surface > .admin-card-head {
    padding-inline: var(--a-gap-3) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] :is(
    .management-dashboard-head,
    .management-primary-surface,
    .management-side-stack,
    .management-card-link,
    .management-notify-head,
    .management-quick-action
  ) {
    animation: none !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-side-stack,
  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] .management-quick-action {
    background: var(--a-surface) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

@media (prefers-contrast: more) {
  .admin-page.admin-spa-shell .admin-spa-page[data-spa-page="management"] :is(
    .management-primary-surface,
    .management-side-stack,
    .management-quick-action,
    .management-card-link
  ) {
    border-color: var(--a-ink) !important;
  }
}

/* ===========================================================================
   Admin-wide Apple refresh — 2026-07-22

   共通ヘッダーだけを機能的な translucent material とし、本文は読み取り性能を優先した
   不透明面にする。静的KPIは無枠、操作部品だけを押せる形にして、全22ルートの
   見出し・作業面・タブ・モーダルをホームと同じ階層へ収束させる。
   ========================================================================== */
.admin-page.admin-spa-shell {
  --a-refresh-radius: var(--a-radius);
  --a-refresh-control-radius: var(--a-radius-sm);
  --a-refresh-side-width: calc(var(--a-gap-6) * 10);
  --a-refresh-page-top: color-mix(in srgb, var(--a-surface) 54%, var(--a-bg));
  --a-refresh-material: color-mix(in srgb, var(--a-surface) 80%, transparent);
  --a-refresh-material-solid: color-mix(in srgb, var(--a-surface) 96%, var(--a-bg));
  --a-refresh-hairline: color-mix(in srgb, var(--a-line) 72%, transparent);
  --a-refresh-hover: color-mix(in srgb, var(--a-ink) 4%, var(--a-surface));
  --a-refresh-selected: color-mix(in srgb, var(--a-accent) 28%, var(--a-surface));
  --a-refresh-header: color-mix(in srgb, var(--a-ink) 90%, transparent);
  --a-refresh-motion-fast: 100ms;
  --a-refresh-motion-base: 220ms;
  --a-refresh-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  min-width: 0;
  background: var(--a-bg) !important;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Shell material: the only persistent translucent layer in the application. */
.admin-page.admin-spa-shell .admin-shell-header {
  position: sticky;
  top: 0;
  z-index: 900;
  border-bottom: 1px solid color-mix(in srgb, var(--a-surface) 16%, transparent) !important;
  background: var(--a-refresh-header) !important;
  -webkit-backdrop-filter: saturate(140%) blur(calc(var(--a-gap-2) * 2));
  backdrop-filter: saturate(140%) blur(calc(var(--a-gap-2) * 2));
}

.admin-page.admin-spa-shell .admin-shell-header .brand,
.admin-page.admin-spa-shell .admin-shell-header :is(.admin-shell-bell, .admin-header-logout, .member-logout),
.admin-page.admin-spa-shell .admin-global-nav a {
  transition:
    transform var(--a-refresh-motion-fast) ease-out,
    color var(--a-refresh-motion-base) var(--a-refresh-ease),
    background var(--a-refresh-motion-base) var(--a-refresh-ease),
    border-color var(--a-refresh-motion-base) var(--a-refresh-ease);
}

.admin-page.admin-spa-shell .admin-global-nav a {
  position: relative;
  isolation: isolate;
  font-weight: 700;
}

.admin-page.admin-spa-shell .admin-global-nav a::after {
  position: absolute;
  right: var(--a-gap-2);
  bottom: 0;
  left: var(--a-gap-2);
  height: var(--a-gap-1);
  border-radius: var(--a-radius-pill) var(--a-radius-pill) 0 0;
  background: var(--a-accent);
  content: "";
  opacity: 0;
  transform: scaleX(0.45);
  transform-origin: center;
  transition:
    opacity var(--a-refresh-motion-fast) ease-out,
    transform var(--a-refresh-motion-base) var(--a-refresh-ease);
}

.admin-page.admin-spa-shell .admin-global-nav a.is-active {
  border-bottom-color: transparent !important;
  background: color-mix(in srgb, var(--a-surface) 8%, transparent) !important;
}

.admin-page.admin-spa-shell .admin-global-nav a.is-active::after {
  opacity: 1;
  transform: scaleX(1);
}

.admin-page.admin-spa-shell :is(
  .admin-shell-header .brand,
  .admin-shell-header button,
  .admin-global-nav a,
  .a-btn,
  .a-tab,
  .a-segment-button,
  .admin-feature-link,
  .admin-overflow-toggle,
  .admin-card-head[role="button"],
  .management-card-link,
  .management-notify-head,
  .management-quick-action
):not(:disabled):active {
  transform: scale(0.97) !important;
  transition-duration: var(--a-refresh-motion-fast) !important;
}

/* Shared route context: direct wayfinding without framing static text as a card. */
.admin-page.admin-spa-shell .admin-route-context {
  position: relative;
  z-index: 1;
  background: linear-gradient(180deg, var(--a-refresh-page-top), var(--a-bg));
}

.admin-page.admin-spa-shell .admin-route-context-inner {
  display: grid;
  gap: var(--a-gap-1);
  width: min(100%, var(--a-content-max));
  margin-inline: auto;
  padding: calc(var(--a-gap-6) + var(--a-gap-2))
    clamp(var(--a-gap-3), 4vw, calc(var(--a-gap-6) * 2))
    var(--a-gap-6);
}

.admin-page.admin-spa-shell .admin-route-context .eyebrow {
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
}

.admin-page.admin-spa-shell .admin-route-context h1 {
  margin: 0;
  color: var(--a-text);
  font-size: calc(var(--a-fs-lg) * 2.25);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0;
}

.admin-page.admin-spa-shell .admin-route-description {
  max-width: calc(var(--a-gap-6) * 28);
  margin: var(--a-gap-1) 0 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-md);
  line-height: 1.65;
}

.admin-page.admin-spa-shell.admin-login-screen .admin-route-context {
  display: none;
}

/* The shared context replaces the three source-page headings inside the SPA. */
.admin-page.admin-spa-shell #admin-spa-outlet .management-dashboard-head,
.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="reservation"] > .admin-shell > .admin-head {
  display: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet {
  min-height: calc(100vh - var(--a-header-offset));
  overflow: clip;
  background: linear-gradient(180deg, var(--a-refresh-page-top), var(--a-bg) calc(var(--a-gap-6) * 18));
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page > :is(.admin-shell, .admin-management-main) {
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel,
.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="blog"] > .admin-shell > .admin-grid,
.admin-page.admin-spa-shell #admin-spa-outlet .management-panel {
  width: min(100%, var(--a-content-max)) !important;
  max-width: var(--a-content-max) !important;
  margin-inline: auto !important;
  padding: var(--a-gap-4) clamp(var(--a-gap-3), 4vw, calc(var(--a-gap-6) * 2)) calc(var(--a-gap-6) * 3) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-grid,
.admin-page.admin-spa-shell #admin-spa-outlet .admin-grid-wide {
  width: 100%;
  max-width: none;
  margin: 0;
  gap: var(--a-gap-4);
}

/* Stable top-level work surfaces. Nested groupings use dividers rather than cards. */
.admin-page.admin-spa-shell #admin-spa-outlet :is(
  .admin-schedule-card,
  [data-module-panel="customers"] #customers,
  [data-module-panel="logs"] > .admin-grid > .admin-card,
  [data-module-panel="body"] > .admin-grid > .admin-card,
  [data-spa-page="blog"] > .admin-shell > .admin-grid > .admin-card
) {
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid var(--a-refresh-hairline) !important;
  border-radius: var(--a-refresh-radius) !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-card:has(> .admin-feature-layout) {
  overflow: visible;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-card-head-wrap,
.admin-page.admin-spa-shell #admin-spa-outlet .admin-section-head,
.admin-page.admin-spa-shell #admin-spa-outlet .admin-subsection-head {
  gap: var(--a-gap-3) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(h2, h3, h4) {
  letter-spacing: 0;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-card-note {
  color: var(--a-text-muted);
  line-height: 1.55;
}

/* Inputs and actions: calm default state, explicit affordance, immediate press response. */
.admin-page.admin-spa-shell #admin-spa-outlet :is(input, select, textarea, .a-control),
.admin-page.admin-spa-shell dialog :is(input, select, textarea, .a-control) {
  min-width: 0;
  border-color: var(--a-refresh-hairline) !important;
  border-radius: var(--a-refresh-control-radius) !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
  transition:
    border-color var(--a-refresh-motion-fast) ease-out,
    background var(--a-refresh-motion-base) var(--a-refresh-ease),
    box-shadow var(--a-refresh-motion-fast) ease-out;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(input, select, textarea, .a-control):hover {
  border-color: var(--a-ink-soft) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(input, select, textarea, .a-control):focus,
.admin-page.admin-spa-shell dialog :is(input, select, textarea, .a-control):focus {
  border-color: var(--a-ink) !important;
  background: var(--a-surface) !important;
}

.admin-page.admin-spa-shell :is(.a-btn, .admin-overflow-toggle, .admin-modal-close) {
  border-radius: var(--a-refresh-control-radius) !important;
  transition:
    transform var(--a-refresh-motion-fast) ease-out,
    border-color var(--a-refresh-motion-base) var(--a-refresh-ease),
    background var(--a-refresh-motion-base) var(--a-refresh-ease),
    color var(--a-refresh-motion-base) var(--a-refresh-ease);
}

.admin-page.admin-spa-shell .a-btn-ghost {
  border-color: var(--a-refresh-hairline) !important;
  background: var(--a-refresh-hover) !important;
  color: var(--a-text) !important;
}

.admin-page.admin-spa-shell .a-btn-ghost:hover {
  border-color: var(--a-ink-soft) !important;
  background: var(--a-surface-2) !important;
}

/* Tables remain fully opaque; hover and selection communicate row interactivity. */
.admin-page.admin-spa-shell #admin-spa-outlet .admin-table-wrap {
  border: 1px solid var(--a-refresh-hairline);
  border-radius: var(--a-radius);
  background: var(--a-surface);
  scrollbar-gutter: stable;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(.admin-table, .a-table) {
  border-collapse: separate;
  border-spacing: 0;
  background: var(--a-surface);
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(.admin-table, .a-table) th {
  border-bottom: 1px solid var(--a-line) !important;
  background: var(--a-refresh-material-solid) !important;
  color: var(--a-text-muted) !important;
  font-size: var(--a-fs-xs);
  font-weight: 700;
  letter-spacing: 0.02em;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(.admin-table, .a-table) td {
  background: var(--a-surface) !important;
  border-bottom-color: var(--a-refresh-hairline) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(.admin-table, .a-table) tbody tr:is(
  [role="button"],
  [data-action],
  [data-customer-id],
  .customer-mrow
):hover td {
  background: var(--a-refresh-hover) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(.admin-table, .a-table) tbody tr.is-selected td,
.admin-page.admin-spa-shell #admin-spa-outlet .customer-mrow.is-selected td {
  background: var(--a-refresh-selected) !important;
}

/* Tabs become one coherent segmented material across all dynamically generated views. */
.admin-page.admin-spa-shell #admin-spa-outlet :is(
  [role="tablist"],
  .a-tabs,
  .sales-v2-tabs,
  .admin-view-tabs
) {
  display: flex;
  width: fit-content;
  max-width: 100%;
  gap: var(--a-gap-1) !important;
  margin-bottom: var(--a-gap-4) !important;
  padding: var(--a-gap-1) !important;
  overflow-x: auto;
  border: 1px solid var(--a-refresh-hairline) !important;
  border-radius: var(--a-refresh-control-radius) !important;
  background: var(--a-refresh-material-solid) !important;
  scrollbar-width: none;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(
  [role="tablist"],
  .a-tabs,
  .sales-v2-tabs,
  .admin-view-tabs
)::-webkit-scrollbar {
  display: none;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(
  [role="tablist"] [role="tab"],
  .a-tabs .a-tab,
  .sales-v2-tabs button,
  .admin-view-tabs button
) {
  flex: 0 0 auto;
  min-height: var(--a-control-height) !important;
  margin: 0 !important;
  padding: 0 var(--a-gap-3) !important;
  border: 0 !important;
  border-radius: var(--a-radius-sm) !important;
  background: transparent !important;
  color: var(--a-text-muted) !important;
  box-shadow: none !important;
  font-size: var(--a-fs-sm) !important;
  font-weight: 700 !important;
  transition:
    transform var(--a-refresh-motion-fast) ease-out,
    background var(--a-refresh-motion-base) var(--a-refresh-ease),
    color var(--a-refresh-motion-base) var(--a-refresh-ease);
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(
  [role="tablist"] [role="tab"],
  .a-tabs .a-tab,
  .sales-v2-tabs button,
  .admin-view-tabs button
):hover {
  background: var(--a-refresh-hover) !important;
  color: var(--a-text) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(
  [role="tablist"] [role="tab"][aria-selected="true"],
  [role="tablist"] [role="tab"].is-active,
  .a-tabs .a-tab.is-active,
  .sales-v2-tabs button.is-active,
  .admin-view-tabs button.is-active
) {
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  box-shadow: inset 0 calc(var(--a-gap-1) * -1) 0 var(--a-accent) !important;
}

/* Feature pages: one functional material summary beside one solid work surface. */
.admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(.admin-feature-layout) {
  display: grid !important;
  grid-template-columns: minmax(var(--a-refresh-side-width), calc(var(--a-refresh-side-width) + var(--a-gap-6))) minmax(0, 1fr) !important;
  gap: var(--a-gap-4) !important;
  align-items: start;
}

.admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary {
  position: sticky;
  top: calc(var(--a-header-offset) + var(--a-gap-4));
  align-self: start;
  margin: 0 !important;
  padding: var(--a-gap-4) !important;
  overflow: hidden;
  border: 1px solid var(--a-refresh-hairline) !important;
  border-radius: var(--a-refresh-radius) !important;
  background: var(--a-refresh-material) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: saturate(120%) blur(calc(var(--a-gap-2) * 2));
  backdrop-filter: saturate(120%) blur(calc(var(--a-gap-2) * 2));
}

.admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary :is(.msum-grid, .msum-grid-2, .msum-grid-3) {
  display: grid;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary .msum-item {
  margin: 0 !important;
  padding: var(--a-gap-3) 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--a-refresh-hairline) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary .msum-item:last-child {
  border-bottom: 0 !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary .management-kpi-value {
  font-size: calc(var(--a-fs-lg) * 1.25) !important;
  font-variant-numeric: tabular-nums;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-nav {
  padding: var(--a-gap-2);
  overflow: hidden;
  border: 1px solid var(--a-refresh-hairline);
  border-radius: var(--a-refresh-radius);
  background: var(--a-refresh-material-solid);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-link {
  border: 0 !important;
  border-radius: var(--a-radius) !important;
  background: transparent !important;
  box-shadow: none !important;
  transition:
    transform var(--a-refresh-motion-fast) ease-out,
    background var(--a-refresh-motion-base) var(--a-refresh-ease);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-link:hover {
  background: var(--a-refresh-hover) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-sections {
  min-width: 0;
  padding: var(--a-gap-4) !important;
  overflow: hidden;
  border: 1px solid var(--a-refresh-hairline) !important;
  border-radius: var(--a-refresh-radius) !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-sections > .admin-section-block {
  margin: 0 !important;
  padding: var(--a-gap-4) 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--a-refresh-hairline) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-sections > .admin-section-block:first-of-type {
  padding-top: 0 !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-sections > .admin-section-block:last-child {
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(.sales-kpi, .customer-v2-keystats > div) {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Calendar: filter controls are a material toolbar; the dense time grid stays solid. */
.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] .admin-calendar-filters {
  margin: 0 !important;
  padding: var(--a-gap-3) var(--a-gap-4) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--a-refresh-hairline) !important;
  border-radius: 0 !important;
  background: var(--a-refresh-material-solid) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] :is(
  .admin-calendar-view,
  .admin-schedule-wrap,
  .admin-schedule,
  .admin-list-view
) {
  margin: 0 !important;
  border-color: var(--a-refresh-hairline) !important;
  border-radius: 0 !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] .admin-calendar-view {
  padding: 0 !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] .admin-schedule-actions {
  min-width: max-content !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] .admin-view-tabs {
  width: auto !important;
  flex-wrap: nowrap !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] .admin-view-tabs button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] .admin-view-tabs button::before {
  display: inline-block !important;
  margin-right: var(--a-gap-1);
  font-size: var(--a-fs-md) !important;
  vertical-align: middle;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] .admin-grid {
  margin-top: var(--a-gap-4) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] .admin-grid > .admin-card {
  padding: var(--a-gap-4) !important;
  border: 1px solid var(--a-refresh-hairline) !important;
  border-radius: var(--a-refresh-radius) !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
}

/* Members: one master-detail work surface instead of nested floating cards. */
.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-toolbar {
  margin: 0 !important;
  padding: var(--a-gap-3) var(--a-gap-4) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--a-refresh-hairline) !important;
  border-radius: 0 !important;
  background: var(--a-refresh-material-solid) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-workspace {
  gap: 0 !important;
  background: var(--a-surface);
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-list-pane {
  min-width: 0;
  padding: var(--a-gap-3) !important;
  border-right: 1px solid var(--a-refresh-hairline);
  background: var(--a-surface);
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-detail-aside {
  min-width: 0;
  margin: 0 !important;
  padding: var(--a-gap-4) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-v2-header {
  margin: calc(var(--a-gap-4) * -1) calc(var(--a-gap-4) * -1) var(--a-gap-4) !important;
  padding: var(--a-gap-4) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--a-refresh-hairline) !important;
  border-radius: 0 !important;
  background: var(--a-refresh-material-solid) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-v2-card {
  margin: 0 !important;
  padding: var(--a-gap-4) 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--a-refresh-hairline) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Logs/body use sections as one continuous workspace. */
.admin-page.admin-spa-shell #admin-spa-outlet :is([data-module-panel="logs"], [data-module-panel="body"]) .admin-section-block {
  margin: 0 !important;
  padding: var(--a-gap-4) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--a-refresh-hairline) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is([data-module-panel="logs"], [data-module-panel="body"]) .admin-section-block:last-child {
  border-bottom: 0 !important;
}

/* Daily report: compact two-pane editor with the public preview kept as an action. */
.admin-page.admin-spa-shell #admin-spa-outlet [data-spa-page="blog"] > .admin-shell > .admin-grid > .admin-card {
  display: grid;
  grid-template-columns: minmax(calc(var(--a-gap-6) * 12), 0.8fr) minmax(0, 1.2fr);
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-spa-page="blog"] .admin-card-head-wrap {
  grid-column: 1 / -1;
  justify-content: flex-end;
  margin: 0 !important;
  padding: var(--a-gap-3) var(--a-gap-4) !important;
  border-bottom: 1px solid var(--a-refresh-hairline);
  background: var(--a-refresh-material-solid);
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-spa-page="blog"] .admin-card-head-wrap > div {
  display: none;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-spa-page="blog"] :is(#blog-form-section, #blog-list-section) {
  margin: 0 !important;
  padding: var(--a-gap-4) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--a-surface) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet [data-spa-page="blog"] #blog-form-section {
  border-right: 1px solid var(--a-refresh-hairline) !important;
}

/* Overlays may float; unlike page cards they need depth to express modality. */
.admin-page.admin-spa-shell dialog:not(.admin-modal-overlay) {
  max-width: min(calc(100vw - var(--a-gap-6) * 2), var(--a-content-max));
  max-height: calc(100vh - var(--a-gap-6) * 2);
  overflow: auto;
  border: 1px solid var(--a-refresh-hairline) !important;
  border-radius: var(--a-refresh-radius) !important;
  background: var(--a-surface) !important;
  color: var(--a-text);
  box-shadow: var(--a-shadow) !important;
}

.admin-page.admin-spa-shell dialog::backdrop {
  background: color-mix(in srgb, var(--a-ink) 46%, transparent);
  -webkit-backdrop-filter: blur(var(--a-gap-1));
  backdrop-filter: blur(var(--a-gap-1));
}

.admin-page.admin-spa-shell .admin-modal-card {
  overflow: hidden;
  border: 1px solid var(--a-refresh-hairline) !important;
  border-radius: var(--a-refresh-radius) !important;
  background: var(--a-surface) !important;
  box-shadow: var(--a-shadow) !important;
}

.admin-page.admin-spa-shell .admin-modal-head,
.admin-page.admin-spa-shell dialog .dialog-actions {
  border-color: var(--a-refresh-hairline) !important;
  background: var(--a-refresh-material-solid) !important;
}

.admin-page.admin-spa-shell .admin-save-bar {
  top: auto !important;
  right: var(--a-gap-4);
  bottom: var(--a-gap-4);
  left: var(--a-gap-4);
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: var(--a-gap-2) !important;
  width: fit-content;
  height: auto !important;
  min-height: 0 !important;
  max-width: calc(100% - var(--a-gap-6) * 2);
  margin-inline: auto;
  padding: var(--a-gap-2) var(--a-gap-3) !important;
  border: 1px solid color-mix(in srgb, var(--a-surface) 18%, transparent) !important;
  border-radius: var(--a-radius-pill) !important;
  background: var(--a-refresh-header) !important;
  color: var(--a-surface) !important;
  box-shadow: var(--a-shadow) !important;
  transform: none !important;
  -webkit-backdrop-filter: saturate(140%) blur(calc(var(--a-gap-2) * 2));
  backdrop-filter: saturate(140%) blur(calc(var(--a-gap-2) * 2));
}

.admin-page.admin-spa-shell .admin-save-bar[hidden] {
  display: none !important;
}

@media (max-width: 1099px) {
  .admin-page.admin-spa-shell .admin-route-context-inner {
    padding-top: var(--a-gap-6);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary {
    top: calc(var(--a-gap-6) * 4);
  }
}

@media (max-width: 900px) {
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel .admin-feature-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary {
    position: static;
    padding: var(--a-gap-3) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary :is(.msum-grid, .msum-grid-2, .msum-grid-3) {
    grid-template-columns: repeat(auto-fit, minmax(calc(var(--a-gap-6) * 6), 1fr)) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary .msum-item {
    padding: var(--a-gap-2) var(--a-gap-3) !important;
    border-right: 1px solid var(--a-refresh-hairline) !important;
    border-bottom: 0 !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary .msum-item:last-child {
    border-right: 0 !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-workspace[data-customer-view="list"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-list-pane {
    border-right: 0;
    border-bottom: 1px solid var(--a-refresh-hairline);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-spa-page="blog"] > .admin-shell > .admin-grid > .admin-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-spa-page="blog"] :is(.admin-card-head-wrap, #blog-form-section, #blog-list-section) {
    grid-column: 1;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-spa-page="blog"] #blog-form-section {
    border-right: 0 !important;
    border-bottom: 1px solid var(--a-refresh-hairline) !important;
  }
}

@media (max-width: 600px) {
  .admin-page.admin-spa-shell .admin-route-context-inner {
    padding: var(--a-gap-4) var(--a-gap-3);
  }

  .admin-page.admin-spa-shell .admin-route-context h1 {
    font-size: calc(var(--a-fs-lg) * 1.75);
  }

  .admin-page.admin-spa-shell .admin-route-description {
    font-size: var(--a-fs-sm);
    line-height: 1.55;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel,
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="blog"] > .admin-shell > .admin-grid,
  .admin-page.admin-spa-shell #admin-spa-outlet .management-panel {
    padding: var(--a-gap-3) var(--a-gap-2) calc(var(--a-gap-6) * 3) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet :is(
    .admin-schedule-card,
    [data-module-panel="customers"] #customers,
    [data-module-panel="logs"] > .admin-grid > .admin-card,
    [data-module-panel="body"] > .admin-grid > .admin-card,
    [data-spa-page="blog"] > .admin-shell > .admin-grid > .admin-card,
    .admin-feature-sections,
    .featurev2-summary
  ) {
    border-radius: var(--a-radius) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet :is(input, select, textarea, .a-control) {
    font-size: var(--a-fs-lg);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(
    .a-btn,
    .a-segment-button,
    .admin-overflow-toggle,
    [role="tab"]
  ),
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(
    .a-tabs,
    .sales-v2-tabs,
    .admin-view-tabs
  ) :is(.a-tab, button) {
    min-height: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea,
    .a-control
  ) {
    min-height: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
    font-size: var(--a-fs-lg) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel .admin-help-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
    min-height: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-sections,
  .admin-page.admin-spa-shell #admin-spa-outlet :is([data-module-panel="logs"], [data-module-panel="body"]) .admin-section-block,
  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-detail-aside,
  .admin-page.admin-spa-shell #admin-spa-outlet [data-spa-page="blog"] :is(#blog-form-section, #blog-list-section) {
    padding: var(--a-gap-3) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] .admin-calendar-filters,
  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-toolbar {
    padding: var(--a-gap-2) var(--a-gap-3) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="schedule"] :is(.admin-schedule-wrap, .admin-list-view),
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-table-wrap {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }

  .admin-page.admin-spa-shell .admin-save-bar {
    top: auto !important;
    right: var(--a-gap-2);
    bottom: var(--a-gap-2);
    left: var(--a-gap-2);
    width: auto;
    max-width: none;
    flex-wrap: nowrap;
    gap: var(--a-gap-1) !important;
    border-radius: var(--a-refresh-control-radius) !important;
    transform: none !important;
  }

  .admin-page.admin-spa-shell .admin-save-bar-text {
    min-width: 0;
    white-space: nowrap;
    font-size: var(--a-fs-xs);
  }

  .admin-page.admin-spa-shell .admin-save-bar .a-btn {
    min-height: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
  }

  .admin-page.admin-spa-shell .admin-shell-header :is(
    .admin-shell-bell,
    .admin-header-logout
  ) {
    min-height: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-page.admin-spa-shell *,
  .admin-page.admin-spa-shell *::before,
  .admin-page.admin-spa-shell *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .admin-page.admin-spa-shell .admin-shell-header {
    background: var(--a-ink) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary {
    background: var(--a-refresh-material-solid) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .admin-page.admin-spa-shell dialog::backdrop,
  .admin-page.admin-spa-shell .admin-save-bar {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .admin-page.admin-spa-shell .admin-save-bar {
    background: var(--a-ink) !important;
  }
}

@media (prefers-contrast: more) {
  .admin-page.admin-spa-shell .admin-route-context {
    background: var(--a-bg);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet :is(
    .admin-schedule-card,
    [data-module-panel="customers"] #customers,
    .featurev2-summary,
    .admin-feature-sections,
    .admin-table-wrap
  ) {
    border-color: var(--a-ink) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet :is(input, select, textarea, .a-control) {
    border-color: var(--a-ink) !important;
  }
}

/* ===========================================================================
   Admin home — Studio Daily Brief (2026-07-22)

   Home is an operational briefing board, not a collection of generic KPI cards.
   One ink day plate establishes identity; live data stays unframed, actions keep
   explicit affordance, and the schedule / attention queue form the work surface.
   ========================================================================== */
.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] {
  --a-home-font-display: Oswald, var(--a-font, system-ui), sans-serif;
  --a-home-rule: color-mix(in srgb, var(--a-line) 76%, transparent);
  --a-home-rule-soft: color-mix(in srgb, var(--a-line) 48%, transparent);
  --a-home-surface-soft: color-mix(in srgb, var(--a-surface) 74%, var(--a-bg));
  --a-home-surface-hover: color-mix(in srgb, var(--a-ink) 4%, var(--a-surface));
  --a-home-accent-soft: color-mix(in srgb, var(--a-accent) 36%, var(--a-surface));
  --a-home-danger-soft: color-mix(in srgb, var(--a-danger) 10%, var(--a-surface));
  --a-home-warning-soft: color-mix(in srgb, var(--a-warning) 12%, var(--a-surface));
  --a-home-radius: var(--a-radius);
  --a-home-control-radius: var(--a-radius-sm);
  --a-home-hit-target: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1));
  --a-home-weight-medium: 600;
  --a-home-weight-bold: 700;
  --a-home-tracking-kicker: 0.12em;
  --a-home-motion-fast: 100ms;
  --a-home-motion-base: 220ms;
  --a-home-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-panel {
  padding-top: var(--a-gap-3) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-dashboard {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: var(--a-gap-4) !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-section-kicker {
  display: block;
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: var(--a-home-weight-bold);
  line-height: 1.2;
  letter-spacing: var(--a-home-tracking-kicker);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-section-heading {
  display: grid;
  gap: var(--a-gap-1);
  min-width: 0;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-section-heading :is(h2, .management-notify-title) {
  margin: 0;
  color: var(--a-text);
  font-size: var(--a-fs-lg);
  font-weight: var(--a-home-weight-bold);
  line-height: 1.25;
  letter-spacing: 0;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-section-heading > p:last-child:not(.management-section-kicker) {
  margin: 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  line-height: 1.5;
}

/* A single continuous brief: identity, live status, then immediate actions. */
.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-briefing-board {
  display: grid;
  grid-template-columns:
    minmax(calc(var(--a-gap-6) * 7), 0.48fr)
    minmax(0, 1.45fr)
    minmax(calc(var(--a-gap-6) * 12), 0.95fr);
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--a-home-rule);
  border-radius: var(--a-home-radius);
  background: var(--a-surface);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-day-plate {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--a-gap-3);
  min-height: calc(var(--a-gap-6) * 7);
  padding: var(--a-gap-4);
  overflow: hidden;
  background: var(--a-ink);
  color: var(--a-surface);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-day-plate::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: var(--a-gap-1);
  background: var(--a-accent);
  content: "";
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-day-plate .management-section-kicker,
.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-day-plate > span:last-child {
  color: color-mix(in srgb, var(--a-surface) 72%, transparent);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-day-plate strong {
  font-family: var(--a-home-font-display);
  font-size: calc(var(--a-fs-lg) * 2.75);
  font-weight: var(--a-home-weight-bold);
  line-height: 0.96;
  letter-spacing: 0;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-day-plate > span:last-child {
  font-size: var(--a-fs-xs);
  font-weight: var(--a-home-weight-medium);
  letter-spacing: var(--a-home-tracking-kicker);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(.management-live-summary, .management-action-dock) {
  min-width: 0;
  padding: var(--a-gap-4);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-live-summary {
  display: grid;
  align-content: start;
  gap: var(--a-gap-4);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-action-dock {
  display: grid;
  align-content: start;
  gap: var(--a-gap-3);
  border-left: 1px solid var(--a-home-rule);
  background: var(--a-home-surface-soft);
}

/* Metrics are read-only data: hierarchy comes from type and rules, not buttons. */
.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats {
  display: grid !important;
  gap: var(--a-gap-3) !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-tier {
  display: grid !important;
  grid-template-columns: calc(var(--a-gap-6) * 2) minmax(0, 1fr);
  gap: var(--a-gap-3) !important;
  align-items: start;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-tier + .msum-tier {
  padding-top: var(--a-gap-3) !important;
  border-top: 1px solid var(--a-home-rule-soft) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .msum-tier-label {
  margin: var(--a-gap-1) 0 0;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  font-weight: var(--a-home-weight-bold);
  line-height: 1.2;
  letter-spacing: var(--a-home-tracking-kicker);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-grid {
  display: grid !important;
  gap: 0 !important;
  min-width: 0;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-grid-2 {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-grid-3 {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-today .msum-item:last-child {
  grid-column: auto !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-item {
  position: relative;
  display: grid;
  align-content: start;
  gap: var(--a-gap-1);
  min-width: 0;
  margin: 0;
  padding: 0 var(--a-gap-3) !important;
  border: 0 !important;
  border-left: 1px solid var(--a-home-rule-soft) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-item:first-child {
  padding-left: 0 !important;
  border-left: 0 !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-item-live::after {
  position: absolute;
  top: 0;
  right: var(--a-gap-2);
  width: var(--a-gap-2);
  height: var(--a-gap-2);
  border-radius: var(--a-radius-pill);
  background: var(--a-accent);
  content: "";
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-label {
  overflow: hidden;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-value {
  color: var(--a-text);
  font-size: calc(var(--a-fs-lg) + var(--a-gap-1));
  font-weight: var(--a-home-weight-bold);
  line-height: 1.08;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .msum-total .management-kpi-value {
  font-size: var(--a-fs-lg);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-sub {
  overflow: hidden;
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Immediate actions have the strongest affordance in the briefing surface. */
.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--a-gap-2) !important;
  min-width: 0;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-action {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: var(--a-gap-2) !important;
  min-width: 0;
  min-height: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
  padding: var(--a-gap-2) var(--a-gap-3) !important;
  border: 1px solid var(--a-home-rule) !important;
  border-radius: var(--a-home-control-radius) !important;
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  box-shadow: none !important;
  text-decoration: none;
  transform: scale(1);
  cursor: pointer;
  transition:
    transform var(--a-home-motion-fast) ease-out,
    border-color var(--a-home-motion-base) var(--a-home-ease),
    background var(--a-home-motion-base) var(--a-home-ease) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-action:hover {
  border-color: var(--a-ink-soft) !important;
  background: var(--a-home-surface-hover) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-action:active {
  transform: scale(0.97) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-action .management-quick-icon {
  flex: 0 0 auto;
  width: calc(var(--a-gap-6) - var(--a-gap-1));
  height: calc(var(--a-gap-6) - var(--a-gap-1));
  padding: var(--a-gap-1);
  border-radius: var(--a-radius-pill);
  background: var(--a-accent);
  color: var(--a-ink) !important;
  box-sizing: content-box;
  filter: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-action .quick-icon-fill {
  fill: color-mix(in srgb, var(--a-surface) 72%, transparent) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-action :is(.quick-icon-line, .quick-icon-mark) {
  fill: none !important;
  stroke: currentColor !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-label {
  overflow: hidden;
  font-size: var(--a-fs-sm);
  font-weight: var(--a-home-weight-bold);
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Schedule and attention are two peers, never cards nested inside cards. */
.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-grid {
  display: grid;
  grid-template-columns: minmax(calc(var(--a-gap-6) * 12), 0.36fr) minmax(0, 1fr);
  gap: var(--a-gap-4);
  align-items: start;
  min-width: 0;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(.management-primary-surface, .management-attention-panel) {
  min-width: 0;
  margin: 0 !important;
  overflow: hidden;
  border: 1px solid var(--a-home-rule) !important;
  border-radius: var(--a-home-radius) !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-primary-surface {
  grid-column: 2;
  order: 2 !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-head {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: var(--a-gap-4);
  min-height: calc(var(--a-gap-6) * 4);
  margin: 0 !important;
  padding: var(--a-gap-3) var(--a-gap-4) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--a-home-rule) !important;
  background: var(--a-surface) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-card-link {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: var(--a-gap-2);
  min-height: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1));
  padding: 0 var(--a-gap-3);
  border: 1px solid var(--a-ink) !important;
  border-radius: var(--a-home-control-radius) !important;
  background: var(--a-ink) !important;
  color: var(--a-surface) !important;
  font-size: var(--a-fs-sm);
  font-weight: var(--a-home-weight-bold);
  text-decoration: none;
  cursor: pointer;
  transition:
    transform var(--a-home-motion-fast) ease-out,
    opacity var(--a-home-motion-base) var(--a-home-ease) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-card-link:hover {
  opacity: 0.78;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-card-link:active {
  transform: scale(0.97);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-head h2 {
  position: relative;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-head .admin-help {
  position: relative;
  display: inline-block;
  width: calc(var(--a-gap-2) + var(--a-gap-1));
  height: calc(var(--a-gap-2) + var(--a-gap-1));
  margin-left: var(--a-gap-1);
  vertical-align: middle;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-head .admin-help-trigger {
  position: absolute;
  top: 50%;
  left: 50%;
  display: inline-grid !important;
  place-items: center;
  width: var(--a-home-hit-target) !important;
  min-width: var(--a-home-hit-target) !important;
  max-width: var(--a-home-hit-target) !important;
  height: var(--a-home-hit-target) !important;
  min-height: var(--a-home-hit-target) !important;
  max-height: var(--a-home-hit-target) !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--a-text-muted) !important;
  font-size: 0 !important;
  transform: translate(-50%, -50%);
  cursor: pointer;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-head .admin-help-trigger::before {
  display: inline-grid;
  place-items: center;
  width: calc(var(--a-gap-2) + var(--a-gap-1));
  height: calc(var(--a-gap-2) + var(--a-gap-1));
  border: 1px solid var(--a-home-rule);
  border-radius: var(--a-radius-pill);
  background: var(--a-surface);
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1;
  content: "?";
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-head .admin-help-trigger:active {
  transform: translate(-50%, -50%) scale(0.97) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(.management-today-schedule, .management-primary-surface .admin-schedule-wrap) {
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-primary-surface .admin-schedule-wrap {
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior-inline: contain;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .admin-schedule.is-dashboard {
  --dashboard-day-count: 2;
  --dashboard-time-column: calc(var(--a-gap-6) * 2);
  grid-template-columns:
    var(--dashboard-time-column)
    repeat(var(--dashboard-day-count), minmax(calc(var(--a-gap-6) * 12), 1fr)) !important;
  width: 100% !important;
  min-width: calc(var(--a-gap-6) * 27) !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
  scrollbar-width: auto !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .admin-schedule.is-dashboard::-webkit-scrollbar {
  display: initial !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-attention-panel {
  grid-column: 1;
  order: 1 !important;
  width: 100%;
  align-self: start;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] button#management-notify-open.management-attention-head {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: var(--a-gap-3);
  width: 100%;
  min-height: calc(var(--a-gap-6) * 4) !important;
  margin: 0 !important;
  padding: var(--a-gap-3) var(--a-gap-4) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--a-home-rule) !important;
  border-radius: 0 !important;
  background: var(--a-surface) !important;
  color: var(--a-text) !important;
  box-shadow: none !important;
  text-align: left;
  cursor: pointer;
  transition:
    transform var(--a-home-motion-fast) ease-out,
    background var(--a-home-motion-base) var(--a-home-ease) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] button#management-notify-open.management-attention-head:hover {
  background: var(--a-home-surface-hover) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] button#management-notify-open.management-attention-head:active {
  transform: scale(0.985) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-attention-control {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: var(--a-gap-2);
  color: var(--a-text-muted);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-count {
  display: inline-grid;
  place-items: center;
  min-width: calc(var(--a-gap-6) - var(--a-gap-1));
  height: calc(var(--a-gap-6) - var(--a-gap-1));
  padding: 0 var(--a-gap-1);
  border-radius: var(--a-radius-pill);
  background: var(--a-accent);
  color: var(--a-accent-ink);
  font-size: var(--a-fs-xs);
  font-weight: var(--a-home-weight-bold);
  line-height: 1;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-count[hidden] {
  display: none;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-attention-copy {
  margin: 0;
  padding: var(--a-gap-3) var(--a-gap-4);
  border-bottom: 1px solid var(--a-home-rule-soft);
  color: var(--a-text-muted);
  font-size: var(--a-fs-sm);
  line-height: 1.5;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-list {
  min-height: 0 !important;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: var(--a-surface) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-item {
  position: relative;
  display: flex !important;
  align-items: stretch !important;
  border: 0 !important;
  border-top: 1px solid var(--a-home-rule-soft) !important;
  background: var(--a-surface) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-item:first-child {
  border-top: 0 !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-item.is-error {
  background: var(--a-home-danger-soft) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-item.is-warn {
  background: var(--a-home-warning-soft) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-link {
  display: grid;
  flex: 1 1 auto !important;
  grid-template-columns: calc(var(--a-gap-6) - var(--a-gap-1)) minmax(0, 1fr);
  gap: var(--a-gap-2);
  min-width: 0;
  padding: var(--a-gap-3) !important;
  border-radius: 0 !important;
  color: var(--a-text);
  text-decoration: none;
  transition: background var(--a-home-motion-base) var(--a-home-ease);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-link:hover {
  background: var(--a-home-surface-hover);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-icon {
  display: inline-grid;
  place-items: center;
  width: calc(var(--a-gap-6) - var(--a-gap-1));
  height: calc(var(--a-gap-6) - var(--a-gap-1));
  border: 1px solid var(--a-home-rule);
  border-radius: var(--a-radius-pill);
  color: var(--a-text-muted);
  font-size: 0;
  font-weight: var(--a-home-weight-bold);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-icon::before {
  color: currentColor;
  font-size: var(--a-fs-xs);
  content: "i";
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(.management-notify-item.is-error, .management-notify-item.is-warn) .management-notify-icon::before {
  content: "!";
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-text {
  display: grid;
  gap: var(--a-gap-1);
  min-width: 0;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-text strong {
  color: var(--a-text);
  font-size: var(--a-fs-sm);
  line-height: 1.35;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-text :is(small, time) {
  color: var(--a-text-muted);
  font-size: var(--a-fs-xs);
  line-height: 1.4;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-dismiss {
  position: static;
  flex: 0 0 var(--a-control-height) !important;
  align-self: stretch;
  width: var(--a-control-height) !important;
  height: auto;
  min-height: var(--a-control-height);
  border-left: 1px solid var(--a-home-rule-soft);
  border-radius: 0;
  transform: none;
  cursor: pointer;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(
  .management-card-link,
  .management-notify-head,
  .management-quick-action,
  .management-notify-link,
  .management-notify-dismiss,
  .management-flow-head .admin-help-trigger
):focus-visible {
  outline: 3px solid var(--a-accent);
  outline-offset: 2px;
}

/* One restrained entrance sequence; interaction feedback remains immediate. */
@keyframes alive-studio-board-enter {
  from {
    opacity: 0.01;
    transform: translateY(var(--a-gap-2));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-panel:not([hidden]) :is(.management-briefing-board, .management-flow-grid) {
  animation: alive-studio-board-enter var(--a-home-motion-base) var(--a-home-ease) both;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-panel:not([hidden]) .management-flow-grid {
  animation-delay: 60ms;
}

@media (max-width: 1180px) {
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-briefing-board {
    grid-template-columns: minmax(calc(var(--a-gap-6) * 7), 0.42fr) minmax(0, 1.58fr);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-action-dock {
    grid-column: 1 / -1;
    grid-template-columns: minmax(calc(var(--a-gap-6) * 7), 0.42fr) minmax(0, 1.58fr);
    align-items: center;
    border-top: 1px solid var(--a-home-rule);
    border-left: 0;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-actions {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-grid {
    grid-template-columns: minmax(calc(var(--a-gap-6) * 11), 0.4fr) minmax(0, 1fr);
  }
}

@media (max-width: 900px) {
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-attention-panel {
    grid-column: 1;
    display: grid;
    grid-template-columns: minmax(calc(var(--a-gap-6) * 10), 0.7fr) minmax(0, 1.3fr);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-primary-surface {
    grid-column: 1;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(.management-attention-head, .management-attention-copy) {
    grid-column: 1;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-list {
    grid-column: 2;
    grid-row: 1 / span 2;
    border-left: 1px solid var(--a-home-rule);
  }
}

@media (max-width: 680px) {
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-panel {
    padding: var(--a-gap-2) var(--a-gap-2) calc(var(--a-gap-6) * 3) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-dashboard {
    gap: var(--a-gap-3) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-briefing-board {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-day-plate {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    min-height: 0;
    padding: var(--a-gap-4);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-day-plate strong {
    grid-row: 2;
    font-size: calc(var(--a-fs-lg) * 2.25);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-day-plate > span:last-child {
    grid-row: 2;
    text-align: right;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(.management-live-summary, .management-action-dock) {
    padding: var(--a-gap-3);
    border-top: 1px solid var(--a-home-rule);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-action-dock {
    grid-column: 1;
    grid-template-columns: minmax(0, 1fr);
    border-left: 0;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-tier {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--a-gap-2) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .msum-tier-label {
    margin-top: 0;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats :is(.msum-grid-2, .msum-grid-3) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-item {
    padding: var(--a-gap-2) !important;
    border-left: 0 !important;
    border-top: 1px solid var(--a-home-rule-soft) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-item:nth-child(3n + 1) {
    padding-left: 0 !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-item:not(:nth-child(3n + 1)) {
    border-left: 1px solid var(--a-home-rule-soft) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-kpi-stats .msum-today .msum-item:last-child {
    grid-column: auto;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Mobile priority: status → actions → attention → the one-day schedule. */
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-attention-panel {
    grid-column: 1;
    order: 1 !important;
    display: block;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-primary-surface {
    grid-column: 1;
    order: 2 !important;
    width: 100% !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-flow-head {
    align-items: stretch;
    flex-direction: column;
    min-height: 0;
    padding: var(--a-gap-3) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-card-link {
    width: 100%;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .admin-schedule.is-dashboard {
    --dashboard-day-count: 1;
    --dashboard-time-column: calc(var(--a-gap-6) * 2);
    grid-template-columns:
      var(--dashboard-time-column)
      minmax(calc(var(--a-gap-6) * 12), 1fr) !important;
    min-width: calc(var(--a-gap-6) * 14) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(
    .management-quick-action,
    .management-card-link,
    .management-attention-head,
    .management-notify-dismiss
  ) {
    min-height: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] .management-notify-dismiss {
    flex-basis: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
    width: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1)) !important;
    min-height: calc(var(--a-gap-6) + var(--a-gap-4) + var(--a-gap-1));
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(
    .management-briefing-board,
    .management-flow-grid,
    .management-quick-action,
    .management-card-link,
    .management-notify-head,
    .management-notify-link
  ) {
    animation: none !important;
    transform: none !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-contrast: more) {
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-spa-page[data-spa-page="management"] :is(
    .management-briefing-board,
    .management-primary-surface,
    .management-attention-panel,
    .management-quick-action
  ) {
    border-color: var(--a-ink) !important;
  }
}

/* ==========================================================================
   Hajime Family UI bridge — 2026-07-23

   ALIVE yellow and Oswald remain the local identity. Structure, type, surface,
   selection, control and responsive behavior follow the shared family spec.
   Glass is limited to persistent navigation chrome; work surfaces stay opaque.
   ========================================================================== */
.admin-page.admin-spa-shell {
  --a-header-offset: 64px;
  --a-refresh-page-top: var(--a-bg);
  --a-refresh-material: var(--a-surface);
  --a-refresh-material-solid: var(--a-surface);
  --a-refresh-hairline: var(--a-line-soft);
  --a-refresh-hover: var(--a-row-hover);
  --a-refresh-selected: var(--a-selection);
  --a-refresh-header: color-mix(in srgb, var(--a-chrome) 88%, transparent);
  --a-refresh-motion-fast: 120ms;
  --a-refresh-motion-base: 240ms;
  --a-refresh-ease: cubic-bezier(0.22, 1, 0.36, 1);
  max-width: 100%;
  overflow-x: clip;
  background: var(--a-bg) !important;
  color: var(--a-text);
  font-family: var(--a-font);
  font-size: var(--a-fs-md);
  font-optical-sizing: auto;
  text-rendering: optimizeLegibility;
}

.admin-page.admin-spa-shell :is(
  input,
  select,
  textarea,
  button
) {
  font-family: inherit;
}

.admin-page.admin-spa-shell .admin-shell-header {
  min-height: var(--a-header-offset);
  z-index: var(--a-z-header);
  border-bottom: 1px solid color-mix(in srgb, var(--a-chrome-text) 18%, transparent) !important;
  background: var(--a-refresh-header) !important;
  color: var(--a-chrome-text) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: saturate(135%) blur(var(--a-gap-4));
  backdrop-filter: saturate(135%) blur(var(--a-gap-4));
}

.admin-page.admin-spa-shell .admin-shell-header .brand {
  align-self: stretch;
}

.admin-page.admin-spa-shell .admin-shell-header .brand img {
  object-fit: contain;
}

.admin-page.admin-spa-shell .admin-global-nav a,
.admin-page.admin-spa-shell .admin-global-nav a.is-active {
  color: var(--a-chrome-muted) !important;
  font-family: var(--a-font);
  font-size: var(--a-fs-sm);
  font-weight: 600;
}

.admin-page.admin-spa-shell .admin-global-nav a:hover {
  background: color-mix(in srgb, var(--a-selection-stroke) 14%, transparent) !important;
  color: var(--a-chrome-text) !important;
}

.admin-page.admin-spa-shell .admin-global-nav a.is-active,
.admin-page.admin-spa-shell .admin-global-nav a.is-active:hover {
  background: color-mix(in srgb, var(--a-selection-stroke) 20%, transparent) !important;
  color: var(--a-chrome-text) !important;
}

.admin-page.admin-spa-shell .admin-global-nav a.is-active .admin-nav-icon {
  color: var(--a-accent);
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status,
.admin-page.admin-spa-shell .admin-shell-header .member-header-status,
.admin-page.admin-spa-shell .admin-shell-header .admin-header-status strong {
  color: var(--a-chrome-text) !important;
}

.admin-page.admin-spa-shell .admin-shell-header .admin-header-status p {
  color: var(--a-chrome-muted) !important;
}

.admin-page.admin-spa-shell .admin-shell-menu,
.admin-page.admin-spa-shell .admin-shell-drawer-close,
.admin-page.admin-spa-shell .admin-inspector-sheet-close,
.admin-page.admin-spa-shell .admin-shell-bell,
.admin-page.admin-spa-shell .admin-modal-close,
.admin-page.admin-spa-shell .admin-overflow-toggle {
  position: relative;
  align-items: center;
  justify-content: center;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.admin-page.admin-spa-shell .admin-shell-menu,
.admin-page.admin-spa-shell .admin-shell-drawer-close,
.admin-page.admin-spa-shell .admin-shell-bell {
  color: var(--a-chrome-text) !important;
}

.admin-page.admin-spa-shell .admin-shell-menu:hover,
.admin-page.admin-spa-shell .admin-shell-drawer-close:hover,
.admin-page.admin-spa-shell .admin-shell-bell:hover {
  background: color-mix(in srgb, var(--a-chrome-text) 12%, transparent) !important;
  color: var(--a-chrome-text) !important;
}

.admin-page.admin-spa-shell .admin-shell-bell > span[aria-hidden="true"] {
  display: inline-flex;
}

.admin-page.admin-spa-shell .admin-shell-menu {
  display: none;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: var(--a-radius-control) !important;
}

.admin-page.admin-spa-shell .admin-shell-drawer-head,
.admin-page.admin-spa-shell .admin-shell-local-section {
  display: none;
}

.admin-page.admin-spa-shell .admin-route-context {
  background: var(--a-bg) !important;
}

.admin-page.admin-spa-shell .admin-route-context-inner {
  gap: var(--a-gap-1);
}

.admin-page.admin-spa-shell .admin-route-context h1 {
  color: var(--a-text);
  font-family: var(--a-font-display);
  font-size: var(--a-fs-display);
  font-weight: 600;
  letter-spacing: 0;
}

.admin-page.admin-spa-shell .admin-route-description {
  color: var(--a-text-muted);
  font-size: var(--a-fs-md);
}

.admin-page.admin-spa-shell .admin-route-context .eyebrow {
  color: var(--a-text-faint);
  font-family: var(--a-brand-display);
  letter-spacing: 0.08em;
}

.admin-page.admin-spa-shell #admin-spa-outlet :is(
  .admin-card,
  .a-glass,
  .admin-schedule-card,
  .admin-feature-sections,
  .customer-workspace,
  .admin-static-page
) {
  border-color: var(--a-line-soft) !important;
  background-color: var(--a-surface) !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .featurev2-summary {
  border-color: var(--a-line-soft) !important;
  background: var(--a-surface) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-nav {
  border-color: var(--a-line-soft);
  background: var(--a-inset);
}

.admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-link:hover {
  background: var(--a-row-hover) !important;
}

.admin-page.admin-spa-shell :is(
  .a-btn,
  .admin-module-panel button:not(.a-btn-primary):not(.admin-toggle):not(.admin-help-trigger),
  dialog button:not(.a-btn-primary)
) {
  border-color: var(--a-control-stroke);
  background-color: var(--a-control);
  color: var(--a-text);
}

.admin-page.admin-spa-shell .a-btn-primary,
.admin-page.admin-spa-shell .admin-module-panel .a-btn-primary,
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-primary {
  min-height: 34px;
  border-color: var(--a-accent) !important;
  background: var(--a-accent) !important;
  color: var(--a-accent-ink) !important;
  box-shadow: none !important;
  font-weight: 600;
}

.admin-page.admin-spa-shell .a-btn-primary:hover,
.admin-page.admin-spa-shell .admin-module-panel .a-btn-primary:hover,
.admin-page.admin-spa-shell dialog .dialog-actions .a-btn-primary:hover {
  border-color: color-mix(in srgb, var(--a-accent) 78%, var(--a-text)) !important;
  background: color-mix(in srgb, var(--a-accent) 86%, var(--a-surface)) !important;
  color: var(--a-accent-ink) !important;
}

.admin-page.admin-spa-shell :is(
  .admin-module-panel input,
  .admin-module-panel select,
  .admin-module-panel textarea,
  dialog input,
  dialog select,
  dialog textarea,
  .admin-login-card input
) {
  border-color: var(--a-control-stroke);
  background: var(--a-control);
  color: var(--a-text);
}

.admin-page.admin-spa-shell :is(
  .admin-module-panel input,
  .admin-module-panel select,
  .admin-module-panel textarea
):hover {
  border-color: var(--a-selection-stroke);
}

.admin-page.admin-spa-shell .admin-table th,
.admin-page.admin-spa-shell .a-table th {
  border-bottom-color: var(--a-line) !important;
  background: var(--a-inset) !important;
  color: var(--a-text-muted) !important;
  font-weight: 600 !important;
}

.admin-page.admin-spa-shell .admin-table td,
.admin-page.admin-spa-shell .a-table td {
  border-bottom-color: var(--a-line-subtle);
  background: var(--a-surface);
  color: var(--a-text);
  font-weight: 400;
}

.admin-page.admin-spa-shell .admin-table tbody tr:hover td,
.admin-page.admin-spa-shell .a-table tbody tr:hover td {
  background: var(--a-row-hover) !important;
}

.admin-page.admin-spa-shell :is(.admin-table, .a-table) tbody tr:is(.is-selected, [aria-selected="true"]) td,
.admin-page.admin-spa-shell #admin-spa-outlet .customer-mrow.is-selected td {
  background: var(--a-selection) !important;
  box-shadow:
    inset 3px 0 0 var(--a-accent),
    inset 0 0 0 1px var(--a-selection-stroke) !important;
}

.admin-page.admin-spa-shell :is(.admin-table, .a-table) [data-customer-row]:focus-visible {
  position: relative;
  z-index: 1;
  outline: 2px solid var(--a-focus);
  outline-offset: -2px;
}

.admin-page.admin-spa-shell [role="tablist"] [role="tab"][aria-selected="true"],
.admin-page.admin-spa-shell [role="tablist"] [role="tab"].is-active,
.admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(
  .a-tabs,
  .sales-v2-tabs,
  .admin-view-tabs
) :is(.a-tab, button).is-active,
.admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(
  .a-tabs,
  .sales-v2-tabs,
  .admin-view-tabs
) :is(.a-tab, button)[aria-selected="true"] {
  border-bottom-color: var(--a-accent) !important;
  background: var(--a-selection) !important;
  color: var(--a-text) !important;
  box-shadow: inset 0 0 0 1px var(--a-selection-stroke) !important;
  font-weight: 600 !important;
}

.admin-page.admin-spa-shell dialog:not(.admin-modal-overlay),
.admin-page.admin-spa-shell .admin-modal-card,
.admin-page.admin-spa-shell .a-confirm,
.admin-page.admin-spa-shell .admin-list-config-pop {
  border-color: var(--a-line) !important;
  border-radius: var(--a-radius-float) !important;
  background: var(--a-dialog) !important;
  color: var(--a-text);
  box-shadow: var(--a-shadow) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.admin-page.admin-spa-shell dialog::backdrop {
  background: var(--a-scrim);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.admin-page.admin-spa-shell :where(a, button, input, select, textarea, [role="button"]):focus-visible {
  outline: 2px solid var(--a-focus) !important;
  outline-offset: 2px;
  box-shadow: var(--a-focus-ring) !important;
}

.admin-page.admin-spa-shell .admin-shell-header :where(a, button):focus-visible,
.admin-page.admin-spa-shell .admin-global-nav :where(a, button):focus-visible {
  outline-color: var(--a-accent) !important;
  outline-offset: -2px;
}

.admin-shell-scrim {
  position: fixed;
  inset: 0;
  z-index: var(--a-z-scrim);
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: var(--a-scrim);
  opacity: 0;
  cursor: default;
  animation: admin-shell-scrim-in var(--a-refresh-motion-base) var(--a-refresh-ease) forwards;
}

.admin-shell-scrim[hidden] {
  display: none !important;
}

@keyframes admin-shell-scrim-in {
  to { opacity: 1; }
}

body.admin-shell-layer-open {
  overflow: hidden;
  overscroll-behavior: none;
}

.admin-inspector-sheet-head {
  display: none;
}

@media (min-width: 901px) {
  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-detail-aside {
    position: sticky !important;
    top: calc(var(--a-header-offset) + var(--a-gap-3)) !important;
    align-self: start;
    max-height: calc(100dvh - var(--a-header-offset) - var(--a-gap-6)) !important;
    overflow: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }
}

@media (max-width: 900px) {
  .admin-page.admin-spa-shell {
    --a-header-offset: 56px;
  }

  .admin-page.admin-spa-shell .admin-shell-header {
    min-height: var(--a-header-offset);
    padding: var(--a-gap-1-5) var(--a-gap-2) !important;
    gap: var(--a-gap-1);
    flex-wrap: nowrap;
  }

  .admin-page.admin-spa-shell .admin-shell-header .brand,
  .admin-page.admin-spa-shell .admin-shell-header .member-brand {
    order: 1;
    flex: 0 1 88px;
    min-width: 68px;
    height: 44px;
  }

  .admin-page.admin-spa-shell .admin-shell-header .brand img,
  .admin-page.admin-spa-shell .admin-shell-header .member-brand img {
    max-width: 88px !important;
    height: 44px !important;
  }

  .admin-page.admin-spa-shell .admin-shell-menu:not([hidden]) {
    order: 2;
    display: inline-flex;
  }

  .admin-page.admin-spa-shell .admin-shell-header .admin-header-status,
  .admin-page.admin-spa-shell .admin-shell-header .member-header-status {
    order: 3;
    flex: 1 1 auto;
    justify-content: flex-end;
    min-width: 0;
  }

  .admin-page.admin-spa-shell .admin-shell-header .admin-header-status p {
    display: none;
  }

  .admin-page.admin-spa-shell .admin-shell-header :is(
    .admin-shell-bell,
    .admin-header-logout,
    .member-logout
  ) {
    min-height: 44px !important;
  }

  .admin-page.admin-spa-shell .admin-shell-header .admin-shell-bell {
    width: 44px;
    min-width: 44px;
    padding: 0 !important;
  }

  .admin-page.admin-spa-shell .admin-shell-header :is(.admin-header-logout, .member-logout) {
    padding-inline: var(--a-gap-2) !important;
  }

  .admin-page.admin-spa-shell .admin-global-nav {
    position: fixed !important;
    inset: 0 auto 0 0;
    order: initial;
    z-index: var(--a-z-drawer);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    width: min(88vw, 360px);
    max-width: 100%;
    height: 100dvh;
    min-height: 0;
    padding: 0 var(--a-gap-3) var(--a-gap-6) !important;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 0 !important;
    border-right: 1px solid color-mix(in srgb, var(--a-chrome-text) 18%, transparent) !important;
    background: color-mix(in srgb, var(--a-chrome) 92%, transparent) !important;
    box-shadow: var(--a-shadow) !important;
    transform: translateX(calc(-100% - var(--a-gap-2))) !important;
    transition:
      transform var(--a-refresh-motion-base) var(--a-refresh-ease),
      visibility 0s linear var(--a-refresh-motion-base);
    visibility: hidden;
    -webkit-backdrop-filter: saturate(130%) blur(var(--a-gap-4));
    backdrop-filter: saturate(130%) blur(var(--a-gap-4));
  }

  .admin-page.admin-spa-shell.admin-drawer-open .admin-global-nav,
  body.admin-page.admin-spa-shell.admin-drawer-open .admin-global-nav {
    transform: translateX(0) !important;
    transition-delay: 0s;
    visibility: visible;
  }

  .admin-page.admin-spa-shell .admin-shell-drawer-head {
    position: sticky;
    top: 0;
    z-index: 1;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    min-height: 64px;
    margin: 0 calc(var(--a-gap-3) * -1) var(--a-gap-2);
    padding: var(--a-gap-2) var(--a-gap-3);
    border-bottom: 1px solid color-mix(in srgb, var(--a-chrome-text) 16%, transparent);
    background: color-mix(in srgb, var(--a-chrome) 92%, transparent);
    color: var(--a-chrome-text);
    -webkit-backdrop-filter: saturate(130%) blur(var(--a-gap-4));
    backdrop-filter: saturate(130%) blur(var(--a-gap-4));
  }

  .admin-page.admin-spa-shell .admin-shell-drawer-head > strong {
    font-size: var(--a-fs-subtitle);
    font-weight: 600;
  }

  .admin-page.admin-spa-shell .admin-shell-drawer-close {
    display: inline-flex;
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: var(--a-radius-control) !important;
  }

  .admin-page.admin-spa-shell .admin-nav-group {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    padding: var(--a-gap-1) 0 var(--a-gap-2) !important;
  }

  .admin-page.admin-spa-shell .admin-nav-group::before {
    display: block;
    padding: var(--a-gap-2) var(--a-gap-2) var(--a-gap-1);
    color: var(--a-chrome-muted);
    content: attr(data-nav-group);
    font-size: var(--a-fs-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
  }

  .admin-page.admin-spa-shell .admin-nav-group + .admin-nav-group {
    border-top: 1px solid color-mix(in srgb, var(--a-chrome-text) 12%, transparent);
  }

  .admin-page.admin-spa-shell .admin-global-nav a,
  .admin-page.admin-spa-shell .admin-global-nav a.is-active {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-start;
    gap: var(--a-gap-2);
    width: 100%;
    min-height: 44px;
    padding: var(--a-gap-2) var(--a-gap-3) !important;
    border: 0 !important;
    border-radius: var(--a-radius-control) !important;
    line-height: 1.25;
  }

  .admin-page.admin-spa-shell .admin-global-nav a::after {
    top: var(--a-gap-1-5);
    right: auto;
    bottom: var(--a-gap-1-5);
    left: 0;
    width: 3px;
    height: auto;
    border-radius: 0 var(--a-radius-pill) var(--a-radius-pill) 0;
    transform: scaleY(0.45);
    transform-origin: center;
  }

  .admin-page.admin-spa-shell .admin-global-nav a.is-active::after {
    transform: scaleY(1);
  }

  .admin-page.admin-spa-shell .admin-global-nav a :is(strong, span) {
    min-width: 0;
  }

  .admin-page.admin-spa-shell .admin-global-nav a span {
    color: var(--a-chrome-muted);
    font-size: var(--a-fs-xs);
  }

  .admin-page.admin-spa-shell .admin-shell-local-section:not([hidden]) {
    display: grid;
    gap: var(--a-gap-1);
    margin-top: var(--a-gap-2);
    padding-top: var(--a-gap-3);
    border-top: 1px solid color-mix(in srgb, var(--a-chrome-text) 16%, transparent);
  }

  .admin-page.admin-spa-shell .admin-shell-local-section > p {
    margin: 0;
    padding: var(--a-gap-1) var(--a-gap-2);
    color: var(--a-chrome-muted);
    font-size: var(--a-fs-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
  }

  .admin-page.admin-spa-shell .admin-shell-local-nav {
    display: grid;
    gap: var(--a-gap-1);
  }

  .admin-page.admin-spa-shell .admin-shell-local-nav .admin-drawer-local-link {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--a-gap-0);
    min-height: 52px;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-feature-nav {
    display: none !important;
  }

  .admin-page.admin-spa-shell .admin-route-context-inner {
    padding-top: var(--a-gap-4);
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-workspace,
  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-workspace[data-customer-view="list"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-detail-aside {
    position: fixed !important;
    inset: auto max(var(--a-gap-2), calc((100vw - 680px) / 2)) 0;
    z-index: var(--a-z-sheet);
    display: block !important;
    width: auto !important;
    max-width: 680px;
    max-height: min(82dvh, 760px) !important;
    margin-inline: auto !important;
    padding: 0 var(--a-gap-4) var(--a-gap-6) !important;
    overflow: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    border: 1px solid var(--a-line) !important;
    border-bottom: 0 !important;
    border-radius: var(--a-radius-float) var(--a-radius-float) 0 0 !important;
    background: var(--a-dialog) !important;
    box-shadow: var(--a-shadow) !important;
    opacity: 0;
    pointer-events: none;
    transform: translateY(calc(100% + var(--a-gap-4))) !important;
    transition:
      transform var(--a-refresh-motion-base) var(--a-refresh-ease),
      opacity var(--a-refresh-motion-fast) ease-out,
      visibility 0s linear var(--a-refresh-motion-base);
    visibility: hidden;
  }

  .admin-page.admin-spa-shell.admin-inspector-open #admin-spa-outlet [data-module-panel="customers"] .customer-detail-aside,
  body.admin-page.admin-spa-shell.admin-inspector-open #admin-spa-outlet [data-module-panel="customers"] .customer-detail-aside {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) !important;
    transition-delay: 0s;
    visibility: visible;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .admin-inspector-sheet-head {
    position: sticky;
    top: 0;
    z-index: 3;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    align-items: center;
    min-height: 64px;
    margin: 0 calc(var(--a-gap-4) * -1) var(--a-gap-4);
    padding: var(--a-gap-1) var(--a-gap-2) var(--a-gap-1) var(--a-gap-4);
    border-bottom: 1px solid var(--a-line-soft);
    background: var(--a-dialog);
  }

  .admin-page.admin-spa-shell .admin-inspector-sheet-grabber {
    grid-column: 1 / -1;
    justify-self: center;
    width: 32px;
    height: 4px;
    margin-top: var(--a-gap-0);
    border-radius: var(--a-radius-pill);
    background: var(--a-line);
  }

  .admin-page.admin-spa-shell .admin-inspector-sheet-head > strong {
    font-size: var(--a-fs-subtitle);
    font-weight: 600;
  }

  .admin-page.admin-spa-shell .admin-inspector-sheet-close {
    display: inline-flex;
    flex: 0 0 44px;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    border-radius: var(--a-radius-control) !important;
    color: var(--a-text);
  }

  .admin-page.admin-spa-shell .admin-inspector-sheet-close:hover {
    background: var(--a-control-hover) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-v2-header {
    position: static !important;
    margin: 0 0 var(--a-gap-4) !important;
    padding: 0 0 var(--a-gap-4) !important;
    background: var(--a-dialog) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(
    .a-btn,
    .a-segment-button,
    .admin-overflow-toggle,
    [role="tab"],
    .admin-schedule-nav button
  ),
  .admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(
    .a-tabs,
    .sales-v2-tabs,
    .admin-view-tabs
  ) :is(.a-tab, button) {
    min-height: 44px !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet :is(
    .admin-calendar-nav-button,
    .admin-overflow-toggle
  ) {
    width: 44px !important;
    min-width: 44px !important;
    padding-inline: 0 !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-module-panel :is(
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea,
    .a-control
  ) {
    min-height: 44px !important;
    font-size: var(--a-fs-lg) !important;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet :is(
    label:has(input[type="checkbox"]),
    label:has(input[type="radio"])
  ) {
    min-height: 44px;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-toggle {
    position: relative;
  }

  .admin-page.admin-spa-shell #admin-spa-outlet .admin-toggle::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 44px;
    height: 44px;
    content: "";
    transform: translate(-50%, -50%);
  }
}

@media (max-width: 390px) {
  .admin-page.admin-spa-shell .admin-shell-header :is(.admin-header-logout, .member-logout) {
    max-width: 64px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-page.admin-spa-shell .admin-global-nav,
  .admin-page.admin-spa-shell #admin-spa-outlet [data-module-panel="customers"] .customer-detail-aside,
  .admin-shell-scrim {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .admin-page.admin-spa-shell .admin-shell-header,
  .admin-page.admin-spa-shell .admin-global-nav,
  .admin-page.admin-spa-shell .admin-shell-drawer-head {
    background: var(--a-chrome) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

@media (prefers-contrast: more) {
  .admin-page.admin-spa-shell :is(
    .admin-card,
    .admin-feature-sections,
    .featurev2-summary,
    dialog,
    .customer-detail-aside
  ) {
    border-color: var(--a-text) !important;
  }
}