@charset "UTF-8";
/**
 * SALUTO 登録不要デモ画面（制作側管理画面 ＆ クライアントマイページ）専用スタイルシート
 * css/demo-portal.css
 */

:root {
  --demo-banner-height: 60px;
  --admin-topbar-height: 56px;
  --portal-nav-height: 52px;
  --inpage-nav-height: 48px;
}

/* ── 背景スクロールロック（サイドバーまたはモーダル展開時） ── */
body.sidebar-scroll-lock {
  overflow: hidden !important;
}

/* ── 共通：デモモード最上部スイッチャーバー ── */
.sl-demo-banner {
  position: sticky;
  top: 0;
  z-index: 9999;
  background: linear-gradient(90deg, #0f172a 0%, #1e1b4b 55%, #0f172a 100%);
  color: #f8fafc;
  border-bottom: 2px solid #4f46e5;
  padding: 8px 16px;
  font-family: 'Noto Sans JP', 'Inter', sans-serif;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.35);
  display: flex;
  align-items: center;
  box-sizing: border-box;
}
.sl-demo-banner-inner {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 12px;
  flex-wrap: wrap;
}
.sl-demo-left {
  display: flex;
  align-items: center;
  gap: 8px 10px;
  flex-wrap: wrap;
  min-width: 0;
}
.sl-demo-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(245, 158, 11, 0.18);
  border: 1px solid rgba(245, 158, 11, 0.55);
  color: #fde68a;
  font-size: 0.72rem;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 999px;
  letter-spacing: 0.03em;
  white-space: nowrap;
}
.sl-demo-role-switcher {
  display: inline-flex;
  align-items: center;
  background: rgba(15, 23, 42, 0.75);
  border: 1px solid rgba(148, 163, 184, 0.3);
  padding: 3px;
  border-radius: 999px;
  gap: 4px;
  max-width: 100%;
}
.sl-role-btn {
  border: none;
  background: transparent;
  color: #cbd5e1;
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.18s ease;
  white-space: nowrap;
}
.sl-role-btn:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
}
.sl-role-btn.active {
  background: linear-gradient(135deg, #4f46e5 0%, #2563eb 100%);
  color: #ffffff;
  box-shadow: 0 2px 10px rgba(79, 70, 229, 0.45);
}
.sl-role-btn .sl-role-tag {
  font-size: 0.65rem;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.2);
  font-weight: 800;
}
.sl-demo-note {
  font-size: 0.75rem;
  color: #cbd5e1;
  display: flex;
  align-items: center;
  gap: 4px;
}
.sl-demo-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.sl-demo-btn-back {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  color: #e2e8f0;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.2);
  text-decoration: none !important;
  transition: all 0.2s;
  white-space: nowrap;
}
.sl-demo-btn-back:hover {
  background: rgba(255, 255, 255, 0.16);
  color: #ffffff;
}
.sl-demo-btn-signup {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 16px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  color: #ffffff !important;
  background: linear-gradient(135deg, #10b981 0%, #059669 100%);
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.35);
  text-decoration: none !important;
  transition: all 0.2s;
  white-space: nowrap;
}
.sl-demo-btn-signup:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(16, 185, 129, 0.5);
}

/* ── 管理画面側のサイドバー・トップバー位置調整（上部デモバー実測値連動） ── */
#demo-admin-root .sidebar {
  top: var(--demo-banner-height);
  height: calc(100vh - var(--demo-banner-height));
}
#demo-admin-root .sidebar-close-btn {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 4px;
  margin-left: auto;
  padding: 5px 10px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(15, 23, 42, 0.65);
  color: #f8fafc;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  line-height: 1;
}
#demo-admin-root .sidebar-close-btn:hover {
  background: rgba(239, 68, 68, 0.85);
  border-color: #f87171;
}
#demo-admin-root .sidebar-overlay {
  display: none;
  position: fixed;
  top: var(--demo-banner-height);
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(15, 23, 42, 0.5);
  backdrop-filter: blur(2px);
  z-index: 9994;
}
#demo-admin-root .sidebar-overlay.show {
  display: block;
}

/* 管理側トップバー（PCでは1行、スマホでは1行目：メニュー＋タイトル / 2行目：デモ説明・視点切替） */
#demo-admin-root .topbar {
  top: var(--demo-banner-height);
  height: auto;
  min-height: 56px;
  padding: 8px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  flex-wrap: wrap;
  z-index: 95;
}
#demo-admin-root .topbar-main-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1 1 auto;
}
#demo-admin-root .topbar-main-row .page-title {
  margin: 0;
  font-size: 1.08rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.35;
  min-width: 0;
  word-break: normal;
  overflow-wrap: break-word;
}
#demo-admin-root .topbar-sub-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-left: auto;
}
#demo-admin-root .topbar-demo-badge {
  font-size: 0.74rem;
  font-weight: 700;
  color: #475569;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  padding: 4px 10px;
  border-radius: 999px;
  white-space: nowrap;
}
#demo-admin-root .topbar-guide-btn {
  cursor: pointer;
  background: #eef2ff;
  color: #4f46e5;
  border: 1px solid #c7d2fe;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 0.78rem;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* ── 1024px以下（タブレット・スマホ）：管理側サイドバーをドロワー収納式に統一 ── */
@media (max-width: 1024px) {
  .sl-demo-note {
    display: none;
  }
  #demo-admin-root .sidebar {
    transform: translateX(-100%);
    z-index: 9995;
    width: 260px;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.45);
  }
  #demo-admin-root .sidebar.open {
    transform: translateX(0);
  }
  #demo-admin-root .sidebar-close-btn {
    display: inline-flex;
  }
  #demo-admin-root .sidebar-plan-badge {
    display: none;
  }
  #demo-admin-root .main-content {
    margin-left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  #demo-admin-root .sidebar-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
}

@media (max-width: 768px) {
  .sl-demo-banner {
    padding: 6px 10px;
  }
  .sl-demo-banner-inner {
    gap: 6px 8px;
  }
  .sl-role-btn {
    font-size: 0.73rem;
    padding: 5px 10px;
    min-height: 36px !important;
  }
  .sl-role-btn .sl-role-tag {
    display: none;
  }
  .sl-demo-btn-back,
  .sl-demo-btn-signup {
    font-size: 0.72rem;
    padding: 5px 11px;
    min-height: 34px !important;
  }
  /* スマホでは1行目：メニューボタン＋タイトル、2行目：デモ説明＋視点切替 */
  #demo-admin-root .topbar {
    flex-direction: column;
    align-items: stretch;
    padding: 8px 12px;
    gap: 6px;
  }
  #demo-admin-root .topbar-main-row {
    width: 100%;
  }
  #demo-admin-root .topbar-main-row .page-title {
    font-size: 0.96rem;
    flex: 1;
  }
  #demo-admin-root .topbar-sub-row {
    width: 100%;
    margin-left: 0;
    justify-content: space-between;
    padding-top: 4px;
    border-top: 1px dashed #e2e8f0;
    gap: 6px;
  }
  #demo-admin-root .topbar-demo-badge {
    font-size: 0.68rem;
    padding: 3px 8px;
  }
  #demo-admin-root .topbar-guide-btn {
    font-size: 0.72rem;
    padding: 5px 10px;
    min-height: 36px !important;
  }
}

/* ── 管理画面デモ内 スクリーン切り替え ── */
.admin-demo-screen {
  display: none;
  animation: demoFadeIn 0.18s ease-out;
}
.admin-demo-screen.active {
  display: block;
}
.client-demo-screen {
  display: none;
  animation: demoFadeIn 0.18s ease-out;
}
.client-demo-screen.active {
  display: block;
}
@keyframes demoFadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── タスクボード (action_board.php) 専用スタイル補完 ── */
.ab-summary-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.ab-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  background: #fff;
  border: 1px solid #e2e8f0;
  color: #334155;
  cursor: pointer;
  transition: all 0.15s;
}
.ab-pill:hover, .ab-pill.active {
  border-color: #4f46e5;
  background: #eef2ff;
  color: #4f46e5;
}
.ab-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
  gap: 14px;
}
.ab-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform 0.15s, box-shadow 0.15s;
}
.ab-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.07);
}
.ab-card.urg-high { border-left: 4px solid #ef4444; }
.ab-card.urg-mid  { border-left: 4px solid #f59e0b; }
.ab-card.urg-low  { border-left: 4px solid #3b82f6; }

/* ── 横スクロール専用領域の視覚インジケーター ── */
.scroll-hint-bar {
  display: none;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  font-size: 0.72rem;
  font-weight: 700;
  color: #475569;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-bottom: none;
  border-radius: 10px 10px 0 0;
  padding: 5px 12px;
}
@media (max-width: 1024px) {
  .scroll-hint-bar {
    display: flex;
  }
}

/* ── クロスガント・プロジェクトガント (gantt.php / workload.php) ── */
.demo-gantt-wrap {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  position: relative;
}
.scroll-hint-bar + .demo-gantt-wrap {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.demo-gantt-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  font-size: 0.8rem;
}
.demo-gantt-table th, .demo-gantt-table td {
  border-bottom: 1px solid #f1f5f9;
  border-right: 1px solid #f1f5f9;
  padding: 8px 10px;
  vertical-align: middle;
}
.demo-gantt-table thead th {
  background: #f8fafc;
  color: #475569;
  font-weight: 700;
  text-align: center;
  font-size: 0.72rem;
}
/* ガントの案件名・タスク名列（第1列）を横スクロール時に左固定 */
.demo-gantt-table th.gantt-sticky-col,
.demo-gantt-table td.gantt-sticky-col {
  position: sticky;
  left: 0;
  z-index: 3;
  background: #ffffff;
  box-shadow: 2px 0 5px -2px rgba(15, 23, 42, 0.12);
}
.demo-gantt-table thead th.gantt-sticky-col {
  background: #f8fafc;
  z-index: 4;
}
@media (max-width: 640px) {
  .demo-gantt-table th.gantt-sticky-col,
  .demo-gantt-table td.gantt-sticky-col {
    width: 165px !important;
    min-width: 150px !important;
    max-width: 175px !important;
    font-size: 0.74rem;
  }
}
.demo-gantt-bar-track {
  position: relative;
  height: 26px;
  background: repeating-linear-gradient(90deg, transparent, transparent 27px, #f8fafc 27px, #f8fafc 28px);
  border-radius: 6px;
}
.demo-gantt-bar {
  position: absolute;
  top: 3px;
  height: 20px;
  border-radius: 5px;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  padding: 0 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: 0 2px 5px rgba(0,0,0,0.12);
  cursor: pointer;
}

/* 管理側請求書一覧：タブレット(641px〜1024px)では枠内横スクロール(約816px)、スマホ(<=640px)ではカード表示 */
@media (min-width: 641px) {
  #admin-invoices-table {
    min-width: 816px;
  }
}

/* ── 読み取り専用トースト＆モーダル ── */
#sl-demo-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(120%);
  z-index: 10000;
  background: #0f172a;
  color: #f8fafc;
  border: 1px solid #3b82f6;
  border-radius: 12px;
  padding: 12px 18px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.45);
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: min(620px, 92vw);
  font-size: 0.82rem;
  line-height: 1.45;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
#sl-demo-toast.show {
  transform: translateX(-50%) translateY(0);
}
.sl-toast-cta {
  background: #2563eb;
  color: #fff !important;
  font-weight: 700;
  font-size: 0.75rem;
  padding: 6px 12px;
  border-radius: 8px;
  text-decoration: none !important;
  white-space: nowrap;
  flex-shrink: 0;
}

/* ── デモ内モーダル ── */
.sl-demo-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  z-index: 10001;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 12px;
}
.sl-demo-modal-backdrop.open {
  display: flex;
}
.sl-demo-modal {
  background: #fff;
  border-radius: 14px;
  max-width: 680px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
  border: 1px solid #e2e8f0;
  transition: max-width 0.2s ease;
}
.sl-demo-modal.is-a4-preview {
  max-width: 920px;
  background: #e8ecf1;
}
.sl-demo-modal.is-a4-preview .sl-demo-modal-body {
  padding: 14px 14px 24px;
  background: #e8ecf1;
}
.sl-demo-modal-head {
  padding: 12px 16px;
  border-bottom: 1px solid #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-weight: 800;
  font-size: 0.94rem;
  color: #0f172a;
  background: #fff;
  position: sticky;
  top: 0;
  z-index: 20;
}
.sl-demo-modal-body {
  padding: 18px;
  font-size: 0.86rem;
  color: #334155;
  line-height: 1.65;
}
.sl-demo-modal-foot {
  padding: 12px 16px;
  border-top: 1px solid #f1f5f9;
  background: #f8fafc;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  border-radius: 0 0 14px 14px;
}

/* ── 本番 admin/invoices/print.php & client/print_invoice.php 完全準拠：MISOCA風 A4縦 固定幅帳票プレビュー ── */
.sl-a4-toolbar {
  max-width: 794px;
  margin: 0 auto 12px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  background: #fff;
  padding: 10px 14px;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
  border: 1px solid #dbe2ea;
}
.sl-a4-toolbar .btn-doc-action {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 13px;
  border: none;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.15s;
  font-family: inherit;
  white-space: nowrap;
}
.sl-a4-toolbar .btn-doc-print { background: #1e3a5f; color: #fff; }
.sl-a4-toolbar .btn-doc-print:hover { background: #15294a; }
.sl-a4-toolbar .btn-doc-pdf { background: #0d9488; color: #fff; }
.sl-a4-toolbar .btn-doc-pdf:hover { background: #0f766e; }
.sl-a4-toolbar .btn-doc-tab { background: #4f46e5; color: #fff; }
.sl-a4-toolbar .btn-doc-tab:hover { background: #4338ca; }
.sl-a4-zoom-group {
  display: inline-flex;
  align-items: center;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 2px;
  gap: 2px;
}
.sl-a4-zoom-btn {
  border: none;
  background: transparent;
  color: #475569;
  font-size: 11.5px;
  font-weight: 700;
  padding: 5px 10px;
  border-radius: 6px;
  cursor: pointer;
  white-space: nowrap;
  font-family: inherit;
}
.sl-a4-zoom-btn.active {
  background: #ffffff;
  color: #1e3a5f;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12);
}
.sl-a4-toolbar .doc-type-switch {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #475569;
  font-weight: 700;
  flex-wrap: wrap;
}
.sl-a4-toolbar .doc-type-switch select {
  padding: 5px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #1e3a5f;
  background: #f8fafc;
  cursor: pointer;
}

/* A4帳票ビューポート（縮小全体表示 ⇄ 100%拡大横スクロール表示） */
.sl-a4-viewport {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
.sl-a4-viewport.is-actual-mode {
  justify-content: flex-start;
  padding-bottom: 8px;
}
.sl-a4-scale-stage {
  position: relative;
  width: 794px;
  margin: 0 auto;
  flex: 0 0 auto;
}

/* A4原稿本体：端末幅に左右されない固定幅 (794px = 210mm @ 96dpi) */
.sl-a4-sheet {
  width: 794px !important;
  min-width: 794px !important;
  max-width: 794px !important;
  box-sizing: border-box !important;
  margin: 0;
  background: #fff;
  padding: 32px 40px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
  border-radius: 3px;
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
  color: #1a1a2e;
  font-size: 12.5px;
  line-height: 1.55;
  transform-origin: top left;
}
.sl-a4-sheet .doc-title {
  text-align: center;
  font-size: 23px;
  font-weight: 800;
  letter-spacing: 0.35em;
  color: #1e3a5f;
  padding: 6px 0 10px;
  margin-bottom: 14px;
  border-top: 3px solid #1e3a5f;
  border-bottom: 1px solid #1e3a5f;
}
.sl-a4-sheet .meta-row {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}
.sl-a4-sheet .meta-table {
  font-size: 12px;
  border-collapse: collapse;
}
.sl-a4-sheet .meta-table td {
  padding: 2px 8px;
}
.sl-a4-sheet .meta-table .meta-label {
  color: #666;
  text-align: right;
  font-weight: 500;
}
.sl-a4-sheet .meta-table .meta-value {
  font-weight: 700;
  color: #1a1a2e;
}
.sl-a4-sheet .header-columns {
  display: flex;
  flex-direction: row !important;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  margin-bottom: 14px;
}
.sl-a4-sheet .billing-to {
  flex: 1.2;
  min-width: 0;
}
.sl-a4-sheet .client-name {
  font-size: 17px;
  font-weight: 800;
  border-bottom: 2px solid #1a1a2e;
  padding-bottom: 5px;
  margin-bottom: 7px;
  color: #0f172a;
}
.sl-a4-sheet .client-name .honorific {
  font-size: 14px;
  font-weight: 500;
  margin-left: 8px;
}
.sl-a4-sheet .client-detail {
  font-size: 11.5px;
  color: #555;
  line-height: 1.6;
}
.sl-a4-sheet .greeting {
  font-size: 11.5px;
  color: #444;
  margin-top: 8px;
}
.sl-a4-sheet .issuer-block {
  flex: 1;
  position: relative;
  padding: 11px 14px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  font-size: 11px;
  line-height: 1.7;
  min-height: 112px;
}
.sl-a4-sheet .issuer-inner {
  position: relative;
  padding-right: 72px;
}
.sl-a4-sheet .issuer-block .company-name {
  font-size: 13px;
  font-weight: 800;
  color: #1e3a5f;
  margin-bottom: 3px;
}
.sl-a4-sheet .issuer-block .registration-no {
  font-size: 11px;
  color: #475569;
  font-family: 'Inter', monospace;
  background: #eef2ff;
  padding: 1px 6px;
  border-radius: 3px;
  display: inline-block;
  margin-top: 2px;
  font-weight: 700;
}
.sl-a4-sheet .company-seal {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 64px;
  height: 64px;
  opacity: 0.85;
  pointer-events: none;
}
.sl-a4-sheet .subject-line {
  background: #f1f5f9;
  padding: 6px 12px;
  border-left: 4px solid #1e3a5f;
  margin-bottom: 8px;
  font-size: 12.5px;
}
.sl-a4-sheet .subject-line strong {
  color: #1e3a5f;
}
.sl-a4-sheet .due-date-line {
  display: inline-block;
  background: #fef3c7;
  color: #92400e;
  padding: 4px 12px;
  border-radius: 4px;
  font-size: 11.5px;
  font-weight: 700;
  margin-bottom: 10px;
}
.sl-a4-sheet .grand-total-box {
  display: flex;
  flex-direction: row !important;
  align-items: baseline;
  justify-content: space-between;
  background: linear-gradient(135deg, #1e3a5f 0%, #2d5a8e 100%);
  color: #fff;
  padding: 10px 20px;
  border-radius: 6px;
  margin-bottom: 14px;
}
.sl-a4-sheet .grand-total-label {
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.sl-a4-sheet .grand-total-amount {
  font-size: 23px;
  font-weight: 800;
  letter-spacing: 0.02em;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
}
.sl-a4-sheet .grand-total-tax-note {
  font-size: 11px;
  opacity: 0.85;
  margin-left: 6px;
  font-weight: 500;
}
.sl-a4-sheet .items-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 14px;
  font-size: 12px;
  table-layout: fixed;
}
.sl-a4-sheet .items-table thead th {
  background: #1e3a5f;
  color: #fff;
  padding: 6px 9px;
  font-weight: 700;
  font-size: 11.5px;
  text-align: left;
}
.sl-a4-sheet .items-table thead th.r { text-align: right; }
.sl-a4-sheet .items-table thead th.c { text-align: center; }
.sl-a4-sheet .items-table tbody td {
  padding: 6px 9px;
  border-bottom: 1px solid #e2e8f0;
  color: #1e293b;
  word-break: normal;
  overflow-wrap: break-word;
}
.sl-a4-sheet .items-table tbody tr:nth-child(even) {
  background: #f8fafc;
}
.sl-a4-sheet .items-table tbody td.r {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.sl-a4-sheet .items-table tbody td.c {
  text-align: center;
  white-space: nowrap;
}
.sl-a4-sheet .totals-area {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}
.sl-a4-sheet .totals-table {
  width: 280px;
  border-collapse: collapse;
  font-size: 12px;
}
.sl-a4-sheet .totals-table td {
  padding: 4px 10px;
  border-bottom: 1px solid #e2e8f0;
}
.sl-a4-sheet .totals-table .label {
  color: #555;
  font-weight: 600;
}
.sl-a4-sheet .totals-table .val {
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.sl-a4-sheet .totals-table .total-final td {
  border-top: 2px solid #1e3a5f;
  border-bottom: 2px solid #1e3a5f;
  font-size: 13.5px;
  font-weight: 800;
  color: #1e3a5f;
  padding: 6px 10px;
  background: #f0f4ff;
}
.sl-a4-sheet .notes-section,
.sl-a4-sheet .bank-section {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 9px 12px;
  margin-bottom: 10px;
  font-size: 11px;
  page-break-inside: avoid;
  break-inside: avoid;
}
.sl-a4-sheet .section-heading {
  font-weight: 800;
  color: #1e3a5f;
  margin-bottom: 4px;
  font-size: 11px;
  border-bottom: 1px solid #cbd5e1;
  padding-bottom: 2px;
}
.sl-a4-sheet .invoice-footer {
  margin-top: 12px;
  padding-top: 6px;
  border-top: 1px solid #e2e8f0;
  font-size: 10px;
  color: #94a3b8;
  text-align: center;
}
@media print {
  @page { size: A4 portrait; margin: 8mm; }
  body > *:not(#sl-demo-modal-backdrop) { display: none !important; }
  #sl-demo-modal-backdrop {
    position: static !important;
    background: #fff !important;
    padding: 0 !important;
    display: block !important;
  }
  .sl-demo-modal {
    max-width: 100% !important;
    max-height: none !important;
    overflow: visible !important;
    box-shadow: none !important;
    border: none !important;
    background: #fff !important;
  }
  .sl-demo-modal-head,
  .sl-demo-modal-foot,
  .sl-a4-toolbar {
    display: none !important;
  }
  .sl-demo-modal-body {
    padding: 0 !important;
    background: #fff !important;
  }
  .sl-a4-viewport,
  .sl-a4-scale-stage {
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
  }
  .sl-a4-sheet {
    transform: none !important;
    box-shadow: none !important;
    padding: 6mm 8mm !important;
    width: 194mm !important;
    min-width: 194mm !important;
    max-width: 194mm !important;
    margin: 0 auto !important;
  }
}

/* ── クライアントマイページ（本番 src/views/client/portal_header.php ＆ client/index.php 完全準拠） ── */
#demo-client-root .site-header .header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  flex-wrap: wrap;
}
#demo-client-root .header-client {
  display: flex;
  align-items: center;
  gap: 0.75rem 1rem;
  flex-wrap: wrap;
  margin-left: auto;
}
#demo-client-root .header-client-info {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}
#demo-client-root .header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  max-width: none !important;
  overflow: visible !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}
#demo-client-root .header-user-badge {
  font-size: 0.75rem;
  color: var(--c-text-light);
  background: var(--c-bg);
  padding: 0.3rem 0.65rem;
  border-radius: 6px;
  border: 1px solid var(--c-border);
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
#demo-client-root .header-logout-link {
  font-size: 0.75rem;
  color: var(--c-muted);
  text-decoration: none;
  padding: 0.3rem 0.65rem;
  border-radius: 6px;
  border: 1px solid var(--c-border);
  background: #fff;
  transition: all 0.2s;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
#demo-client-root .header-role-switch-btn {
  font-size: 0.75rem;
  font-weight: 700;
  color: #4f46e5;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  padding: 0.3rem 0.75rem;
  border-radius: 6px;
  cursor: pointer;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
@media (max-width: 768px) {
  #demo-client-root .site-header .header-inner {
    padding: 0.6rem 0.85rem;
    gap: 0.5rem;
  }
  #demo-client-root .header-client {
    width: 100%;
    margin-left: 0;
    justify-content: space-between;
    gap: 0.45rem;
  }
  #demo-client-root .header-actions {
    width: 100%;
    justify-content: flex-start;
    padding-top: 0.35rem !important;
    border-top: 1px dashed var(--c-border) !important;
    gap: 0.4rem;
  }
  #demo-client-root .header-user-badge,
  #demo-client-root .header-logout-link,
  #demo-client-root .header-role-switch-btn {
    font-size: 0.72rem;
    padding: 0.32rem 0.6rem;
    min-height: 36px !important;
  }
}

/* 顧客側ナビゲーション（文字重なり防止・横スクロール・視覚ヒント） */
#demo-client-root .portal-nav {
  position: sticky;
  top: var(--demo-banner-height);
  z-index: 100;
  background: #fff;
  border-bottom: 2px solid var(--c-border);
}
#demo-client-root .portal-nav::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 32px;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.96) 85%);
  opacity: 0;
  transition: opacity 0.2s;
}
#demo-client-root .portal-nav.has-more-right::after {
  opacity: 1;
}
#demo-client-root .portal-nav-inner {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
#demo-client-root .portal-nav-link {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center;
  gap: 0.4rem;
}

/* ページ内移動ナビゲーション（上部デモバー＋ポータルナビ実測値に追従） */
#demo-client-root .dashboard-inpage-nav {
  position: sticky;
  top: calc(var(--demo-banner-height) + var(--portal-nav-height) + 6px);
  z-index: 80;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid var(--c-border);
  border-radius: 30px;
  padding: 0.4rem 0.6rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
  overflow-x: auto;
  white-space: nowrap;
  scrollbar-width: none;
}
#demo-client-root .dashboard-inpage-nav::-webkit-scrollbar { display: none; }
#demo-client-root .inpage-nav-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 0.85rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--c-muted);
  background: transparent;
  border: none;
  border-radius: 20px;
  cursor: pointer;
  transition: all 0.2s ease;
  text-decoration: none;
}
#demo-client-root .inpage-nav-btn:hover {
  color: var(--c-brand);
  background: rgba(37, 99, 235, 0.06);
}
#demo-client-root .inpage-nav-btn.active {
  color: #fff;
  background: var(--c-brand);
  box-shadow: 0 2px 6px rgba(37, 99, 235, 0.25);
}
@media (max-width: 768px) {
  #demo-client-root .dashboard-inpage-nav {
    border-radius: 12px;
    margin-bottom: 1rem;
    padding: 0.35rem 0.5rem;
  }
  #demo-client-root .inpage-nav-btn {
    padding: 0.35rem 0.7rem;
    font-size: 0.72rem;
  }
}

/* アンカー移動先の見出しが固定バーに隠れないよう scroll-margin-top を一貫指定 */
#overview-sec,
#site-monitor-sec,
#news-sec,
#analytics-sec,
#ai-strategy-container,
#maintenance-records-sec,
#recent-requests-sec,
#contracts-invoices-sec,
#contracts-domains,
#client-estimate-detail-panel,
#client-invoice-detail-panel {
  scroll-margin-top: calc(var(--demo-banner-height) + var(--portal-nav-height) + var(--inpage-nav-height) + 18px);
}

/* お知らせ（スマホでは本文を上段全幅、日付・確認ボタンを下段へ配置し縦長潰れを完全解消） */
#demo-client-root .notif-card {
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 1.5rem;
  border: 1px solid #cbd5e1;
  background: #fff;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .04);
}
#demo-client-root .notif-header {
  background: linear-gradient(135deg, #1e3a5f 0%, #0f172a 100%);
  color: #fff;
  padding: .65rem 1.25rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: none;
}
#demo-client-root .notif-header h2 {
  font-size: .88rem;
  font-weight: 800;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #fff;
}
#demo-client-root .notif-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: .7rem 1.15rem;
  cursor: pointer;
  transition: background .15s;
  gap: .65rem;
}
#demo-client-root .notif-row:not(:last-child) { border-bottom: 1px solid #f1f5f9; }
#demo-client-root .notif-row:hover { background: #f8fafc; }
#demo-client-root .notif-row.unread { background: #f0f9ff; }
#demo-client-root .notif-icon {
  font-size: .95rem;
  flex-shrink: 0;
  line-height: 1;
}
#demo-client-root .notif-title {
  flex: 1 1 auto;
  font-size: .83rem;
  font-weight: 700;
  color: #1e293b;
  line-height: 1.5;
  word-break: normal;
  overflow-wrap: break-word;
  min-width: 0;
}
#demo-client-root .notif-date {
  font-size: .72rem;
  color: #64748b;
  flex-shrink: 0;
  white-space: nowrap;
}
#demo-client-root .notif-new-badge {
  background: #ef4444;
  color: #fff;
  font-size: .62rem;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 4px;
  flex-shrink: 0;
  line-height: 1.1;
}
#demo-client-root .notif-btn-link {
  font-size: .74rem;
  font-weight: 800;
  color: #2563eb;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  padding: 4px 10px;
  border-radius: 6px;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: all .15s;
}
#demo-client-root .notif-btn-link:hover {
  background: #2563eb;
  color: #fff;
}
#demo-client-root .notif-dismiss-btn {
  background: none;
  border: none;
  color: #94a3b8;
  font-size: .8rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
  flex-shrink: 0;
  line-height: 1;
}
#demo-client-root .notif-dismiss-btn:hover {
  background: #e2e8f0;
  color: #334155;
}
@media (max-width: 640px) {
  #demo-client-root .notif-row {
    flex-wrap: wrap;
    align-items: flex-start;
    padding: 0.75rem 0.9rem;
    gap: 0.45rem 0.5rem;
    position: relative;
  }
  #demo-client-root .notif-icon {
    order: 1;
    margin-top: 2px;
  }
  #demo-client-root .notif-new-badge {
    order: 2;
    margin-top: 2px;
  }
  #demo-client-root .notif-dismiss-btn {
    order: 3;
    margin-left: auto;
    min-height: 32px !important;
    min-width: 32px !important;
    padding: 4px !important;
  }
  #demo-client-root .notif-title {
    order: 4;
    flex: 1 1 100%;
    width: 100%;
    font-size: 0.84rem;
    line-height: 1.55;
    word-break: normal;
    overflow-wrap: break-word;
  }
  #demo-client-root .notif-date {
    order: 5;
    font-size: 0.74rem;
    align-self: center;
  }
  #demo-client-root .notif-btn-link {
    order: 6;
    margin-left: auto;
    min-height: 36px !important;
    padding: 4px 12px !important;
  }
}

/* アクセス解析12ヶ月推移グラフの専用枠内横スクロール (最小幅480px維持) ＆ グリッド子要素のmin-width:0徹底 */
#demo-client-root,
#demo-client-root .main-wrapper,
#demo-client-root .section-inner,
#demo-client-root .client-demo-screen,
#demo-client-root .dash-section,
#demo-client-root .dash-section-body,
#demo-client-root .a-block,
#demo-client-root .a-block-body,
#demo-client-root .two-col,
#demo-client-root .two-col > *,
#demo-client-root #analytics-sec,
#demo-client-root .analytics-site-content {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
#demo-client-root .dual-bars-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 6px;
}
#demo-client-root .dual-bars-wrap .dual-bars,
#demo-client-root .dual-bars-wrap .dual-labels,
#demo-client-root .dual-bars-wrap .dual-values {
  min-width: 480px;
}

/* 管理画面ダッシュボード上部アラートカードのモバイル折り返し最適化 */
#demo-admin-root .ur-alert-text {
  display: block !important;
  flex: 1 1 0%;
  min-width: 0;
  word-break: normal;
  overflow-wrap: break-word;
  line-height: 1.5;
}
@media (max-width: 640px) {
  #demo-admin-root .ur-alert-card {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 12px 14px;
  }
  #demo-admin-root .ur-alert-left {
    width: 100%;
    align-items: flex-start;
  }
  #demo-admin-root .ur-alert-link {
    align-self: flex-end;
  }
}

#demo-client-root .analytics-tab:hover {
  border-color: var(--c-brand) !important;
  color: var(--c-brand) !important;
}
#demo-client-root .analytics-tab.active {
  background: var(--c-brand) !important;
  color: #fff !important;
  border-color: var(--c-brand) !important;
}
#demo-client-root .ai-advisor-site-tab:hover {
  border-color: #4f46e5 !important;
  color: #4f46e5 !important;
}
#demo-client-root .ai-advisor-site-tab.active {
  background: #4f46e5 !important;
  color: #fff !important;
  border-color: #4f46e5 !important;
}

/* ============================================================
   インライン style 属性から外部化したユーティリティ・コンポーネントスタイル
   ============================================================ */
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-001 { font-size:0.62rem;font-weight:800;padding:2px 7px;border-radius:999px;background:rgba(99,102,241,0.3);color:#c7d2fe;border:1px solid rgba(165,180,252,0.35);margin-left:auto; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-002 { background:rgba(239,68,68,.12);border-left:3px solid #ef4444; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-003 { font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-004 { margin-left:auto;background:#ef4444;color:#fff;font-size:.66rem;font-weight:800;padding:1px 6px;border-radius:999px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-005 { border:1px dashed rgba(99,102,241,0.45);background:rgba(79,70,229,0.12);margin-top:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-006 { color:#e0e7ff;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-007 { background:rgba(79,70,229,0.18);border:1px solid rgba(129,140,248,0.35);border-radius:10px;padding:10px 12px;margin-bottom:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-008 { font-size:0.74rem;font-weight:800;color:#e0e7ff;margin-bottom:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-009 { font-size:0.68rem;color:#cbd5e1;line-height:1.4;margin-bottom:8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-010 { display:block;text-align:center;background:#4f46e5;color:#fff;font-size:0.75rem;font-weight:800;padding:6px 10px;border-radius:6px;text-decoration:none; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-011 { background:linear-gradient(90deg,#eef2ff 0%,#f8fafc 100%);border:1px solid #c7d2fe;border-left:4px solid #4f46e5;border-radius:12px;padding:12px 16px;margin-bottom:1.25rem;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-012 { display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;flex:1 1 240px;min-width:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-013 { background:#4f46e5;color:#fff;font-size:0.72rem;font-weight:800;padding:3px 9px;border-radius:999px;white-space:nowrap;flex-shrink:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-014 { font-size:0.85rem;font-weight:700;color:#1e293b;flex:1 1 200px;min-width:0;line-height:1.5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-015 { border-color:#c7d2fe;background:#eef2ff;color:#4f46e5;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-016 { font-size:0.9rem;font-weight:700;margin-left:2px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-017 { font-size:0.75rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-018 { font-size:0.8rem;font-weight:700;margin-left:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-019 { font-size:0.85rem;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-020 { display:inline-block;width:9px;height:9px;border-radius:50%;background:#4ade80;box-shadow:0 0 8px #4ade80; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-021 { background:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-022 { background:#0ea5e9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-023 { width:68%;background:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-024 { width:78%;background:#0ea5e9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-025 { width:60%;background:#10b981; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-026 { margin-bottom:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-027 { width:50%;background:#f59e0b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-028 { margin-top:12px;padding-top:10px;border-top:1px dashed #e2e8f0;display:flex;justify-content:space-between;align-items:center;font-size:0.76rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-029 { color:#64748b;font-weight:600; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-030 { color:#15803d;font-weight:800;background:#dcfce7;padding:2px 8px;border-radius:999px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-031 { font-size:0.82rem;color:#64748b;margin-top:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-032 { display:flex;gap:8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-033 { color:#ef4444; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-034 { color:#d97706; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-035 { color:#2563eb; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-036 { display:flex;justify-content:space-between;align-items:center; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-037 { font-size:0.74rem;color:#dc2626;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-038 { font-weight:800;font-size:0.95rem;color:#0f172a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-039 { font-size:0.8rem;color:#475569; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-040 { margin-top:auto;padding-top:10px;border-top:1px solid #f1f5f9;display:flex;justify-content:space-between;align-items:center; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-041 { font-size:0.75rem;color:#ef4444;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-042 { display:flex;gap:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-043 { font-size:0.75rem;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-044 { font-size:0.74rem;color:#d97706;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-045 { font-size:0.74rem;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-046 { font-size:0.75rem;color:#2563eb; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-047 { font-size:0.74rem;color:#475569; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-048 { font-size:0.75rem;color:#15803d;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-049 { display:flex;gap:8px;flex-wrap:wrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-050 { --pm-project-color:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-051 { display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-052 { background:#eef2ff;color:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-053 { font-size:0.75rem;font-weight:800;color:#15803d;background:#dcfce7;padding:2px 8px;border-radius:999px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-054 { color:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-055 { width:75%;background:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-056 { margin-top:14px;padding-top:10px;border-top:1px solid #f1f5f9;display:flex;justify-content:space-between;align-items:center; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-057 { display:flex;gap:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-058 { background:#10b981; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-059 { font-size:0.78rem;font-weight:700;color:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-060 { --pm-project-color:#0ea5e9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-061 { background:#e0f2fe;color:#0284c7; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-062 { color:#0ea5e9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-063 { width:62%;background:#0ea5e9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-064 { font-size:0.78rem;font-weight:700;color:#0284c7; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-065 { --pm-project-color:#f59e0b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-066 { background:#fef3c7;color:#b45309; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-067 { font-size:0.75rem;font-weight:800;color:#b45309;background:#fef3c7;padding:2px 8px;border-radius:999px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-068 { width:88%;background:#f59e0b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-069 { background:#f59e0b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-070 { font-size:0.78rem;font-weight:700;color:#d97706; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-071 { --pm-project-color:#10b981; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-072 { background:#dcfce7;color:#15803d; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-073 { color:#10b981; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-074 { width:35%;background:#10b981; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-075 { font-size:0.78rem;font-weight:700;color:#15803d; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-076 { display:none; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-077 { margin-bottom:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-078 { background:linear-gradient(135deg,#f8fafc 0%,#eef2ff 100%);border:1px solid #c7d2fe;border-radius:12px;padding:16px 20px;margin-bottom:20px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-079 { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:12px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-080 { font-weight:800;font-size:0.95rem;color:#1e1b4b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-081 { background:#16a34a;color:#fff;font-size:0.76rem;font-weight:800;padding:4px 12px;border-radius:999px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-082 { display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-083 { background:#fff;padding:12px;border-radius:8px;border:1px solid #e2e8f0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-084 { font-size:0.72rem;color:#64748b;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-085 { font-size:1.3rem;font-weight:900;color:#0f172a;margin-top:2px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-086 { font-size:1.3rem;font-weight:900;color:#2563eb;margin-top:2px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-087 { font-size:0.8rem;color:#64748b;font-weight:600; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-088 { background:#fff;padding:12px;border-radius:8px;border:1px solid #bbf7d0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-089 { font-size:0.72rem;color:#15803d;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-090 { font-size:1.3rem;font-weight:900;color:#15803d;margin-top:2px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-091 { font-size:0.78rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-092 { font-size:1.3rem;font-weight:900;color:#4f46e5;margin-top:2px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-093 { color:#16a34a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-094 { background:#eef2ff;border:1px solid #c7d2fe;border-radius:10px;padding:10px 14px;margin-bottom:14px;font-size:0.8rem;color:#1e1b4b;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-095 { font-size:0.7rem;color:#6366f1;font-weight:700;margin-bottom:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-096 { display:flex; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-097 { min-height:32px;height:32px;font-size:0.76rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-098 { font-size:0.7rem;color:#0284c7;font-weight:700;margin-bottom:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-099 { color:#7c3aed; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-100 { width:240px;text-align:left; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-101 { width:90px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-102 { width:65px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-103 { background:#f8fafc;font-weight:800; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-104 { background:#f8fafc;color:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-105 { text-align:center; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-106 { text-align:center;color:#16a34a;font-weight:800; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-107 { left:2%;width:20%;background:#10b981; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-108 { left:20%;width:26%;background:#0ea5e9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-109 { text-align:center;color:#2563eb;font-weight:800; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-110 { left:42%;width:36%;background:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-111 { text-align:center;color:#d97706;font-weight:800; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-112 { left:75%;width:22%;background:#f59e0b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-113 { background:#f8fafc;color:#0284c7; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-114 { color:#0284c7; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-115 { left:32%;width:24%;background:#0ea5e9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-116 { left:54%;width:32%;background:#3b82f6; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-117 { width:210px;text-align:left; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-118 { font-weight:800;color:#0f172a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-119 { font-size:0.72rem;color:#16a34a;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-120 { height:52px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-121 { top:3px;left:2%;width:45%;background:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-122 { top:27px;left:48%;width:46%;background:#10b981; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-123 { font-size:0.72rem;color:#d97706;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-124 { top:3px;left:0%;width:38%;background:#0ea5e9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-125 { top:27px;left:35%;width:58%;background:#8b5cf6; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-126 { top:3px;left:5%;width:60%;background:#4f46e5; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-127 { top:27px;left:50%;width:40%;background:#0284c7; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-128 { font-size:0.72rem;color:#2563eb;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-129 { height:30px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-130 { top:5px;left:4%;width:42%;background:#f59e0b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-131 { text-align:right; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-132 { margin-left:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-133 { font-size:0.8rem;font-weight:700;color:#475569; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-134 { color:#dc2626; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-135 { display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-136 { background:#eef2ff;color:#4f46e5;border:1px solid #c7d2fe; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-137 { background:#dcfce7;color:#15803d;border:1px solid #bbf7d0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-138 { background:#fef3c7;color:#92400e;border:1px solid #fde68a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-139 { font-size:1rem;color:#0f172a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-140 { font-size:0.78rem;color:#64748b;margin-left:8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-141 { margin:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-142 { font-size:0.78rem;color:#4f46e5;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-143 { background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:12px 16px;margin-bottom:16px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-144 { display:flex;flex-wrap:wrap;gap:14px;font-size:0.8rem;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-145 { color:#16a34a;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-146 { font-size:0.72rem;color:#64748b;margin-left:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-147 { font-size:0.72rem;color:#d97706;font-weight:700;margin-left:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-148 { color:#d97706;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-149 { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-150 { display:flex;gap:8px;flex-wrap:wrap;align-items:center; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-151 { width:auto;padding:5px 10px;font-size:0.8rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-152 { padding:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-153 { white-space:nowrap;font-family:monospace;font-size:0.78rem;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-154 { font-size:0.65rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-155 { text-decoration:none;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-156 { color:#4f46e5;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-157 { font-family:monospace;font-size:0.76rem;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-158 { margin-top:2rem;background:linear-gradient(135deg,#1e1b4b 0%,#312e81 100%);border-radius:16px;padding:24px 28px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;box-shadow:0 10px 25px rgba(30,27,75,0.2); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-159 { display:inline-block;background:rgba(16,185,129,0.2);border:1px solid #34d399;color:#6ee7b7;font-size:0.72rem;font-weight:800;padding:3px 10px;border-radius:999px;margin-bottom:8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-160 { font-size:1.2rem;font-weight:800;margin:0 0 6px;color:#fff; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-161 { font-size:0.84rem;color:#cbd5e1;margin:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-162 { display:flex;gap:10px;flex-wrap:wrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-163 { background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.3);color:#fff;font-weight:700;font-size:0.85rem;padding:11px 18px;border-radius:999px;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-164 { background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#fff;font-weight:800;font-size:0.88rem;padding:11px 22px;border-radius:999px;text-decoration:none;box-shadow:0 4px 14px rgba(16,185,129,0.4); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-165 { text-decoration:none; color:inherit; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-166 { width:28px;height:28px;object-fit:contain;margin-right:.3rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-167 { font-weight:900;letter-spacing:.08em;font-family:'Inter',sans-serif; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-168 { font-size:.65rem;opacity:.55;font-weight:500;margin-left:.3rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-169 { font-size:.9rem;flex-shrink:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-170 { background:none;border:none;color:#94a3b8;font-size:.75rem;cursor:pointer;padding:2px 6px;border-radius:4px;flex-shrink:0;line-height:1; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-171 { text-decoration:none;color:inherit;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-172 { font-size:1.3rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-173 { margin-top: 1.25rem; margin-bottom: 1.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-174 { font-size:.65rem;color:var(--c-muted); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-175 { overflow-x:auto; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-176 { width:100%; border-collapse:collapse; font-size:.82rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-177 { background:#f8fafc; border-bottom:1px solid var(--c-border); text-align:left; color:var(--c-muted); font-size:.72rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-178 { padding:.6rem 1rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-179 { border-bottom:1px solid #f1f5f9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-180 { padding:.75rem 1rem; font-weight:700; color:var(--c-navy); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-181 { color:var(--c-brand);text-decoration:none; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-182 { padding:.75rem 1rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-183 { color:#16a34a; font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-184 { font-size:.65rem; color:#94a3b8; margin-left:.3rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-185 { display:flex; align-items:center; gap:.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-186 { width:80px; height:8px; background:#e2e8f0; border-radius:4px; overflow:hidden; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-187 { width:28%; height:100%; background:#16a34a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-188 { font-size:.75rem; font-weight:600; color:var(--c-text); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-189 { font-size:.65rem; color:#94a3b8; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-190 { width:41%; height:100%; background:#16a34a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-191 { width:19%; height:100%; background:#16a34a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-192 { padding:.6rem 1.25rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-193 { margin-bottom: 1rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-194 { font-size: 0.85rem; font-weight: 700; color: var(--c-navy); margin-bottom: 0.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-195 { display: block; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-196 { cursor:pointer;border:none;font-family:inherit; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-197 { display: none; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-198 { margin-bottom: 1rem; padding-bottom: 0.75rem; border-bottom: 1px dashed var(--c-border); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-199 { font-size: 0.78rem; font-weight: 700; color: var(--c-muted); margin-bottom: 0.4rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-200 { margin-bottom:.75rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-201 { color:#d97706; font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-202 { background: #f8fafc; border: 1px solid #cbd5e1; border-left: 4px solid var(--c-brand); border-radius: 6px; padding: 0.75rem 1rem; margin-bottom: 1rem; font-size: 0.8rem; color: #334155; line-height: 1.6; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-203 { font-weight: 700; color: var(--c-navy); margin-bottom: 0.2rem; display: flex; align-items: center; gap: 0.4rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-204 { display:inline-block; font-size:0.7rem; font-weight:700; border:1px solid #cbd5e1; background:#fff; color:#64748b; padding:1px 6px; border-radius:4px; margin:0 2px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-205 { margin-top:1.5rem; margin-bottom:1.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-206 { font-size:0.7rem; color:var(--c-brand); font-weight:700; margin-left:0.5rem; background:var(--c-brand-lt); padding:2px 8px; border-radius:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-207 { padding: 1.25rem 1.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-208 { display:flex; flex-direction:column; gap:1.25rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-209 { background:#fff; border:1px solid var(--c-border); border-radius:12px; padding:1.25rem; box-shadow:var(--sh-sm); border-left:4px solid var(--c-brand); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-210 { display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:0.5rem; margin-bottom:0.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-211 { font-size:0.75rem; color:var(--c-muted); font-weight:600; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-212 { display:inline-flex; align-items:center; background:#ecfdf5; border:1px solid #a7f3d0; border-radius:20px; padding:0.2rem 0.65rem; font-size:0.75rem; color:#065f46; font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-213 { text-decoration:line-through; opacity:0.6; margin-left:0.25rem; font-weight:500; font-family:'Inter',sans-serif; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-214 { margin:0 0.25rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-215 { font-family:'Inter',sans-serif; font-size:0.8rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-216 { font-size:0.95rem; font-weight:800; color:var(--c-navy); margin:0 0 0.5rem 0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-217 { font-size:0.83rem; color:var(--c-text-light); margin:0; line-height:1.6; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-218 { margin-top: 1.25rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-219 { height: 100%; margin-bottom: 0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-220 { flex: 1; min-width: 0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-221 { margin-top: 0.75rem; display: flex; flex-wrap: wrap; gap: 0.4rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-222 { display:flex;align-items:center;gap:0.3rem;max-width:100%; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-223 { flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-224 { display:inline-block;background:#ef4444;color:#fff;font-size:.6rem;font-weight:800;padding:.12rem .4rem;border-radius:999px;flex-shrink:0;white-space:nowrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-225 { display:flex;align-items:center;gap:.5rem;flex-shrink:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-226 { font-size:.7rem;color:var(--c-brand);font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-227 { margin-bottom:1rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-228 { font-weight:800;font-size:.82rem;color:var(--c-brand);margin-bottom:.5rem;padding-bottom:.3rem;border-bottom:2px solid var(--c-brand); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-229 { display:flex;align-items:center;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--c-border); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-230 { font-size:.9rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-231 { flex:1;min-width:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-232 { font-weight:600;font-size:.82rem;white-space:normal;word-break:break-all; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-233 { font-size:.7rem;color:var(--c-muted); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-234 { text-align:right;white-space:nowrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-235 { font-weight:800;font-size:.85rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-236 { display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem;justify-content:flex-end; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-237 { padding:.4rem .75rem;background:var(--c-brand);color:#fff;border-radius:6px;font-size:.78rem;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-238 { font-size:.65rem;opacity:.8; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-239 { padding:.4rem .75rem;background:#f59e0b;color:#fff;border-radius:6px;font-size:.78rem;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-240 { font-weight:800;font-size:.82rem;color:#64748b;margin-bottom:.4rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-241 { display:flex;align-items:center;gap:.6rem;padding:.4rem 0;border-bottom:1px solid var(--c-border); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-242 { flex:1; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-243 { font-size:.6rem;font-weight:800;padding:.15rem .4rem;border-radius:4px;background:#e2e8f0;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-244 { font-weight:800;font-size:.82rem;color:#64748b;margin-bottom:.6rem;padding-bottom:.3rem;border-bottom:2px solid #cbd5e1; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-245 { padding:.65rem 0;border-bottom:1px solid var(--c-border); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-246 { font-size:0.75rem;color:var(--c-brand);font-weight:700;margin-bottom:0.25rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-247 { display:flex;align-items:center;gap:.6rem;margin-left:0.5rem;margin-bottom:0.25rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-248 { font-size:.85rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-249 { font-weight:600;font-size:.82rem;display:flex;align-items:center;gap:0.3rem;max-width:100%; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-250 { flex:1;min-width:0;white-space:normal;word-break:break-all; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-251 { font-size:.65rem;color:#6c3ce0;background:#f3e8ff;padding:1px 6px;border-radius:4px;font-weight:700;flex-shrink:0;white-space:nowrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-252 { font-size:.7rem;color:var(--c-muted);display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.15rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-253 { background:#f48120;color:#fff;font-size:.58rem;font-weight:800;padding:.12rem .35rem;border-radius:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-254 { display:flex;align-items:center;gap:.6rem;margin-left:0.5rem;margin-top:0.25rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-255 { font-size:.65rem;color:#0d9488;background:#ccfbf1;padding:1px 6px;border-radius:4px;font-weight:700;flex-shrink:0;white-space:nowrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-256 { display:flex;align-items:center;gap:.75rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-257 { font-size:.65rem;padding:.2rem .5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-258 { margin-bottom:1.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-259 { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-260 { margin-top:.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-261 { margin-bottom:1.75rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-262 { display:flex;flex-direction:column; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-263 { font-size:.75rem;font-weight:800;color:#64748b;margin-bottom:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-264 { padding:1rem 1.75rem 1.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-265 { width:100%;justify-content:center;padding:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-266 { background:#dbeafe;color:#1e40af;font-weight:800;font-size:.8rem;text-align:center;padding:10px;border-radius:8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-267 { font-size:.75rem;font-weight:800;color:#7c3aed;margin-bottom:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-268 { margin-bottom:1.25rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-269 { font-size:.74rem;color:#059669;font-weight:700;background:#ecfdf5;padding:3px 10px;border-radius:999px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-270 { max-width:740px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-271 { display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-272 { border:2px solid var(--c-brand);background:#eff6ff;border-radius:8px;padding:10px 12px;font-size:.8rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-273 { border:1px solid #cbd5e1;background:#fff;border-radius:8px;padding:10px 12px;font-size:.8rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-274 { border:2px dashed #cbd5e1;border-radius:10px;padding:18px;text-align:center;background:#f8fafc;cursor:pointer;color:#64748b;font-size:.82rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-275 { display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-276 { background:var(--c-brand);color:#fff;border:none;padding:12px 26px;border-radius:8px;font-weight:800;font-size:0.9rem;cursor:pointer;box-shadow:0 4px 12px rgba(37,99,235,0.25); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-277 { display:flex;gap:8px;flex-wrap:wrap;margin-bottom:1rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-278 { cursor:pointer;border:1px solid var(--c-brand);background:var(--c-brand);color:#fff; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-279 { cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-280 { display:flex;flex-direction:column;gap:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-281 { border:2px solid #f59e0b;background:#fffbeb;border-radius:10px;padding:14px 16px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;cursor:pointer;transition:all .15s; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-282 { display:flex;align-items:center;gap:8px;flex-wrap:wrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-283 { font-size:.78rem;font-weight:700;color:#475569; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-284 { background:#ef4444;color:#fff;font-size:.65rem;font-weight:800;padding:1px 7px;border-radius:999px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-285 { font-weight:800;font-size:0.96rem;color:#0f172a;margin-top:5px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-286 { font-size:0.78rem;color:#64748b;margin-top:2px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-287 { display:flex;gap:8px;align-items:center; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-288 { cursor:pointer;background:#fff;border:1px solid #cbd5e1; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-289 { background:#2563eb;color:#fff;border:none;padding:8px 14px;border-radius:8px;font-weight:700;font-size:0.8rem;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-290 { border:1px solid #e2e8f0;background:#fff;border-radius:10px;padding:14px 16px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;cursor:pointer;transition:all .15s; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-291 { color:#059669; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-292 { border:2px solid var(--c-brand); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-293 { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:12px;font-size:.82rem;color:#475569; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-294 { height:12px;background:#e2e8f0;border-radius:999px;overflow:hidden;margin-bottom:20px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-295 { width:75%;height:100%;background:linear-gradient(90deg,#2563eb,#10b981); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-296 { width:100%;border-collapse:collapse;font-size:.82rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-297 { background:#f8fafc;border-bottom:2px solid #e2e8f0;text-align:left;color:#475569; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-298 { padding:10px 12px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-299 { padding:10px 12px;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-300 { padding:10px 12px;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-301 { padding:10px 12px;font-weight:800;color:#16a34a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-302 { border-bottom:1px solid #f1f5f9;background:#f0f9ff; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-303 { padding:10px 12px;font-weight:800;color:var(--c-navy); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-304 { padding:10px 12px;color:#334155;font-weight:600; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-305 { padding:10px 12px;font-weight:800;color:#2563eb; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-306 { padding:10px 12px;font-weight:800;color:#d97706; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-307 { cursor:pointer;background:#f8fafc; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-308 { flex-wrap:wrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-309 { font-size:.7rem;color:#64748b;font-weight:600; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-310 { cursor:pointer;padding:6px 12px;font-size:.78rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-311 { display:flex;flex-direction:column;gap:12px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-312 { border:1px solid #e2e8f0;border-radius:10px;padding:14px 16px;background:#fff; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-313 { display:flex;justify-content:space-between;align-items:center;margin-bottom:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-314 { font-size:.92rem;color:#0f172a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-315 { font-size:.78rem;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-316 { font-size:.74rem;color:#334155;margin-top:6px;display:flex;gap:8px;flex-wrap:wrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-317 { background:#f1f5f9;padding:2px 8px;border-radius:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-318 { background:#dcfce7;color:#166534;font-weight:700;padding:2px 8px;border-radius:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-319 { font-size:.8rem;color:#475569;margin-bottom:12px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-320 { font-size:.78rem;font-weight:700;display:block;margin-bottom:3px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-321 { width:100%;padding:9px 12px;border:1px solid #cbd5e1;border-radius:8px;font-size:.84rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-322 { margin-top:6px;background:var(--c-brand);color:#fff;border:none;padding:10px 18px;border-radius:8px;font-weight:800;font-size:.84rem;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-323 { margin-bottom:0.75rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-324 { color:#4f46e5;font-weight:700;text-decoration:underline;margin:0 0.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-325 { color:#475569;text-decoration:underline;margin:0 0.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-326 { color:#10b981;font-weight:800;text-decoration:underline;margin:0 0.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-327 { border:none;background:none;font-size:1.2rem;cursor:pointer;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-328 { padding:7px 14px;border-radius:8px;border:1px solid #cbd5e1;background:#fff;font-weight:700;font-size:0.8rem;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-329 { padding:7px 16px;border-radius:8px;background:#4f46e5;color:#fff;font-weight:800;font-size:0.8rem;text-decoration:none; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-330 { text-align:right;font-size:.7rem;color:#94a3b8;margin-bottom:.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-331 { background:var(--c-brand); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-332 { margin-top: 2rem; margin-bottom: 0.75rem; display: flex; justify-content: space-between; align-items: flex-end; border-bottom: 2px solid var(--c-border); padding-bottom: 0.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-333 { font-size: 0.95rem; font-weight: 800; color: var(--c-navy); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-334 { font-size: 0.78rem; font-weight: 700; color: var(--c-muted); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-335 { flex-direction:column; align-items:stretch; height:auto; padding-top:0.6rem; padding-bottom:0.6rem; border-bottom:1px solid #f1f5f9; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-336 { display:flex; width:100%; min-width:0; align-items:center; gap:0.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-337 { flex-shrink:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-338 { display:block; flex:1; min-width:0; font-size:0.82rem; font-weight:700; white-space:normal; word-break:break-all; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-339 { color:var(--c-brand,#6c3ce0);text-decoration:none;font-weight:700;border-bottom:1px dotted var(--c-brand,#6c3ce0); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-340 { flex-shrink:0; margin-left:auto; font-weight:700; color:var(--c-navy); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-341 { font-size:0.7rem; color:var(--c-muted,#6b7280); padding-left:1.8rem; margin-top:0.3rem; display:flex; gap:0.8rem; flex-wrap:wrap; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-342 { color:#334155; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-343 { margin-bottom: 1.5rem; border-bottom: 1px dashed var(--c-border); padding-bottom: 1rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-344 { display:flex; align-items:center; gap:0.5rem; width:100%; min-width:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-345 { display:block; font-weight: 700; font-size: 0.82rem; color: var(--c-navy); flex:1; min-width:0; white-space:normal; word-break:break-all; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-346 { font-weight: 700; font-size: 0.82rem; color: var(--c-brand); flex-shrink:0; margin-left:auto; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-347 { height: 8px; background: var(--c-border); border-radius: 4px; overflow: hidden; margin: 0.4rem 0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-348 { font-size: 0.72rem; color: var(--c-muted); font-weight: 600; margin-top: 0.2rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-349 { font-size: 0.72rem; background: var(--c-bg); border-radius: 8px; padding: 0.5rem 0.75rem; margin-top: 0.5rem; border: 1px solid var(--c-border); line-height: 1.6; color: var(--c-text-light); word-break: break-all; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-350 { font-weight: 700; color: var(--c-navy); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-351 { color:var(--c-text); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-352 { background:#3B82F6; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-353 { background:#EC4899; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-354 { background:#94A3B8; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-355 { margin-bottom:.5rem; border:1px solid #fde047; border-radius:8px; overflow:hidden; background:#fffdf5; box-shadow: 0 1px 3px rgba(0,0,0,0.02); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-356 { padding:.6rem 1rem; border-bottom:1px solid #fef08a; display:flex; justify-content:space-between; align-items:center; background:#fef9c3; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-357 { font-weight:700; color:#a16207; font-size:.82rem; display:flex; align-items:center; flex-wrap:wrap; gap:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-358 { font-size:.65rem; background:#ffffff; color:#b45309; padding:.1rem .3rem; border-radius:4px; border:1px solid #fef08a; font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-359 { display:flex; align-items:center; gap:0.5rem; flex-shrink:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-360 { font-size:.65rem; color:#a16207; font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-361 { cursor:pointer; font-size:.62rem; font-weight:700; border:1px solid #eab308; background:#ffffff; color:#a16207; padding:2px 6px; border-radius:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-362 { padding:1rem 1.25rem; font-size:.84rem; line-height:1.7; color:#451a03; background:#ffffff; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-363 { text-align:center;padding:2rem;color:var(--c-muted);font-size:.85rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-364 { margin-bottom:.5rem; border:1px solid var(--c-border); border-radius:8px; overflow:hidden; background:#ffffff; box-shadow: 0 1px 3px rgba(0,0,0,0.02); transition: all 0.2s ease; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-365 { display:flex; align-items:center; gap:.5rem; font-weight:700; color:var(--c-navy); font-size:.82rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-366 { font-size:.6rem; color:var(--c-muted); margin-right:.2rem; display:inline-block; width:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-367 { background:var(--c-danger); color:#fff; font-size:.55rem; padding:.1rem .3rem; border-radius:10px; font-weight:800; margin-left:.3rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-368 { font-size:.92rem; font-weight:700; color:var(--c-navy); margin-bottom:.75rem; line-height:1.6; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-369 { font-size:.85rem; padding:.6rem .9rem; background:#f0f9ff; border-radius:6px; border-left:3px solid #4a8bc2; margin-bottom:.6rem; color:#334155; line-height:1.8; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-370 { color:#4a8bc2; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-371 { font-size:.85rem; padding:.6rem .9rem; background:#f0fdf4; border-radius:6px; border-left:3px solid var(--c-success); margin-bottom:.6rem; color:#334155; line-height:1.8; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-372 { color:var(--c-success); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-373 { margin-top:.75rem; border-top:1px dashed var(--c-border); padding-top:.75rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-374 { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:.2rem; width:100%; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-375 { font-size:.8rem; color:var(--c-navy); flex-grow:1; min-width:150px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-376 { color:#334155; display:block; padding-left:.75rem; border-left:3px solid var(--c-border); font-size:.85rem; line-height:1.8; margin-top:.3rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-377 { margin-bottom:.75rem; padding:.5rem .75rem; background:#f0fdf4; border-radius:6px; border-left:3px solid #059669; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-378 { display:block; font-size:.78rem; color:#059669; margin-bottom:.3rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-379 { font-size:.84rem; margin-bottom:.4rem; line-height:1.8; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-380 { color:#475569; padding-left:.5rem; display:inline-block; font-size:.78rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-381 { border-top:1px dashed var(--c-border); padding-top:.5rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-382 { display:block; font-size:.78rem; color:#7c3aed; margin-bottom:.3rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-383 { font-size:.84rem; padding:.6rem .8rem; background:#f5f3ff; border:1px solid #ddd6fe; border-radius:6px; margin-bottom:.5rem; color:#5b21b6; line-height:1.8; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-384 { color:#6d28d9; font-size:.78rem; display:block; margin-top:.2rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-385 { font-size:.85rem; font-weight:800; color:var(--c-brand); margin-bottom:.6rem; border-bottom: 2px solid var(--c-brand-lt); padding-bottom: .3rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-386 { padding:.6rem .8rem; background:#f0fdf4; border-radius:6px; color:#166534; margin-bottom:.5rem; font-size:.84rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-387 { margin:.3rem 0 0 1.2rem; padding:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-388 { padding:.6rem .8rem; background:#fff1f2; border-radius:6px; color:#991b1b; margin-bottom:.5rem; font-size:.84rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-389 { font-size:.88rem; color:#334155; margin-bottom:.75rem; padding:.6rem .8rem; background:#fafafa; border-radius:6px; border-left:3px solid #64748b; line-height:1.8; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-390 { font-size:.84rem; margin-bottom:.4rem; padding-left:.75rem; border-left:3px solid #7c3aed; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-391 { font-size:.78rem; color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-392 { width:38px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-393 { width:58px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-394 { width:52px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-395 { width:105px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-396 { width:115px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-397 { display:flex;flex-wrap:wrap;gap:18px;line-height:1.7; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-398 { white-space:pre-line;line-height:1.65;color:#334155; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-399 { color:#1e3a5f; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-400 { border-bottom:1px solid #e2e8f0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-401 { padding:7px 8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-402 { padding:7px 8px;text-align:center; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-403 { padding:7px 8px;text-align:right;font-weight:700; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-404 { display:flex;justify-content:space-between;margin-bottom:4px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-405 { color:#0f172a; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-406 { font-size:0.72rem;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-407 { white-space:pre-line;color:#334155;line-height:1.65; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-408 { background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:14px;margin-bottom:14px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-409 { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-410 { font-size:0.76rem;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-411 { font-weight:800;font-size:0.96rem;color:#0f172a;margin-bottom:6px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-412 { font-size:0.82rem;color:#334155;margin-bottom:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-413 { font-size:1rem;color:#2563eb; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-414 { width:100%;border-collapse:collapse;font-size:0.78rem;background:#fff;border:1px solid #e2e8f0;border-radius:6px;overflow:hidden;margin-bottom:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-415 { background:#1e3a5f;color:#fff; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-416 { padding:6px 8px;text-align:left; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-417 { padding:6px 8px;width:64px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-418 { padding:6px 8px;width:95px;text-align:right; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-419 { background:#1e3a5f;color:#fff;border:none;padding:7px 14px;border-radius:6px;font-weight:700;font-size:0.78rem;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-420 { background:#eef2ff;color:#4f46e5;border:1px solid #c7d2fe;padding:7px 14px;border-radius:6px;font-weight:700;font-size:0.78rem;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-421 { font-weight:800;font-size:0.84rem;margin-bottom:8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-422 { margin-top:10px;display:flex;gap:8px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-423 { flex:1;padding:8px 10px;border:1px solid #cbd5e1;border-radius:6px;font-size:0.8rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-424 { background:#4f46e5;color:#fff;border:none;padding:8px 14px;border-radius:6px;font-weight:700;font-size:0.8rem;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-425 { font-size:0.82rem;color:#1e293b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-426 { font-size:0.83rem;line-height:1.9;padding-left:18px;list-style:disc;color:#334155; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-427 { display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:6px;margin-bottom:18px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-428 { text-align:center;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-429 { font-weight:600; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-430 { font-weight:800; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-431 { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:4px;margin-bottom:4px;font-size:.76rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-432 { color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-433 { font-size:.83rem;color:#1e293b;line-height:1.7;white-space:pre-line; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-434 { background:#fffbeb;border:2px solid #f59e0b;border-radius:12px;padding:16px;margin-bottom:18px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-435 { font-weight:800;color:#92400e;font-size:.92rem; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-436 { font-size:.78rem;color:#78350f;margin-top:2px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-437 { margin-top:0; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-438 { margin-bottom:16px;display:flex;justify-content:flex-end; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-439 { background:#f8fafc; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-440 { margin-bottom:14px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-441 { font-size:.76rem;color:#64748b; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-442 { font-size:1.05rem;font-weight:800;color:#0f172a;margin:4px 0 10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-443 { width:42px;text-align:center; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-444 { width:80px;text-align:center; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-445 { width:110px;text-align:right; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-446 { width:120px;text-align:right; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-447 { color:var(--c-brand); }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-448 { margin-top:18px;padding-top:16px;border-top:1px dashed #cbd5e1; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-449 { font-size:.9rem;font-weight:800;color:var(--c-navy);margin:0 0 10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-450 { display:flex;gap:8px;flex-wrap:wrap;margin-top:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-451 { flex:1;min-width:200px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-452 { background:var(--c-brand);color:#fff;border:none;padding:10px 18px;border-radius:8px;font-weight:800;font-size:.84rem;cursor:pointer; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-453 { flex-wrap:wrap;gap:10px; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-454 { font-size:.75rem;opacity:.8; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-455 { cursor:pointer;background:#fff; }
:is(#_dp1#_dp2#_dp3, :root) .dp-inl-456 { background:#e8ecf1;padding:16px; }

/* ============================================================
   動的テンプレート用コンポーネントクラス
   ============================================================ */
:is(#_dp1#_dp2#_dp3, :root) .ai-note-head {
  padding: .6rem 1rem;
  background: #ffffff;
  border-bottom: 1px solid var(--c-border);
  cursor: pointer;
  user-select: none;
  transition: background 0.2s ease;
}
:is(#_dp1#_dp2#_dp3, :root) .ai-note-head.is-open {
  background: #f1f5f9;
}
:is(#_dp1#_dp2#_dp3, :root) .ai-note-type-lbl {
  margin-right: .3rem;
  color: var(--c-brand);
}
:is(#_dp1#_dp2#_dp3, :root) .ai-note-type-lbl.type-seo { color: #059669; }
:is(#_dp1#_dp2#_dp3, :root) .ai-note-type-lbl.type-weekly { color: #4a8bc2; }
:is(#_dp1#_dp2#_dp3, :root) .ai-note-type-lbl.type-monthly { color: #7c3aed; }
:is(#_dp1#_dp2#_dp3, :root) .ai-note-type-lbl.type-competitor { color: #f59e0b; }

:is(#_dp1#_dp2#_dp3, :root) .ai-note-body {
  padding: 1.25rem 1.5rem;
  display: none;
  border-left: 4px solid var(--c-brand);
  background: #ffffff;
  line-height: 1.6;
  border-top: 1px solid #f1f5f9;
}
:is(#_dp1#_dp2#_dp3, :root) .ai-note-body.is-open {
  display: block;
}
:is(#_dp1#_dp2#_dp3, :root) .ai-note-body.type-seo { border-left-color: #059669; }
:is(#_dp1#_dp2#_dp3, :root) .ai-note-body.type-weekly { border-left-color: #4a8bc2; }
:is(#_dp1#_dp2#_dp3, :root) .ai-note-body.type-monthly { border-left-color: #7c3aed; }
:is(#_dp1#_dp2#_dp3, :root) .ai-note-body.type-competitor { border-left-color: #f59e0b; }

:is(#_dp1#_dp2#_dp3, :root) .ai-advice-row {
  font-size: .78rem;
  margin-bottom: .6rem;
  padding-bottom: .6rem;
}
:is(#_dp1#_dp2#_dp3, :root) .ai-advice-row.has-divider {
  border-bottom: 1px dashed #f1f5f9;
}
:is(#_dp1#_dp2#_dp3, :root) .ai-star-btn {
  cursor: pointer;
  font-size: .7rem;
  font-weight: 700;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #64748b;
  padding: 3px 8px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
:is(#_dp1#_dp2#_dp3, :root) .ai-star-btn.is-starred {
  border-color: #eab308;
  background: #fef9c3;
  color: #a16207;
}

:is(#_dp1#_dp2#_dp3, :root) .modal-chat-item {
  border-left: 3px solid #4f46e5;
  background: #f8fafc;
  padding: 10px 12px;
  border-radius: 0 8px 8px 0;
  margin-bottom: 10px;
  font-size: 0.81rem;
}
:is(#_dp1#_dp2#_dp3, :root) .modal-chat-item.is-client {
  border-left-color: #0ea5e9;
  background: #f0f9ff;
}

:is(#_dp1#_dp2#_dp3, :root) .wp-diag-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  padding: 14px 16px;
  border-radius: 10px;
  margin-bottom: 14px;
}
:is(#_dp1#_dp2#_dp3, :root) .wp-diag-banner.theme-warn {
  background: #fffbeb;
  border-color: #fde68a;
}
:is(#_dp1#_dp2#_dp3, :root) .wp-diag-score {
  font-size: 1.6rem;
  font-weight: 900;
  color: #15803d;
  white-space: nowrap;
}
:is(#_dp1#_dp2#_dp3, :root) .wp-diag-score.theme-warn {
  color: #b45309;
}

:is(#_dp1#_dp2#_dp3, :root) .est-step-pill {
  text-align: center;
  padding: 8px 6px;
  border-radius: 8px;
  font-size: .74rem;
  font-weight: 800;
  background: #f1f5f9;
  color: #64748b;
}
:is(#_dp1#_dp2#_dp3, :root) .est-step-pill.is-done {
  background: #dcfce7;
  color: #15803d;
}
:is(#_dp1#_dp2#_dp3, :root) .est-step-pill.is-current {
  background: #2563eb;
  color: #ffffff;
}

:is(#_dp1#_dp2#_dp3, :root) .client-chat-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 10px;
}
:is(#_dp1#_dp2#_dp3, :root) .client-chat-card.is-client {
  background: #eff6ff;
  border-color: #bfdbfe;
}
:is(#_dp1#_dp2#_dp3, :root) .client-chat-sender {
  color: #0f172a;
}
:is(#_dp1#_dp2#_dp3, :root) .client-chat-sender.is-client {
  color: #1d4ed8;
}

/* ============================================================
   GTM noscript ＆ アクセス解析チャート共通クラス
   ============================================================ */
.gtm-noscript-iframe {
  display: none;
  visibility: hidden;
}
:is(#_dp1#_dp2#_dp3, :root) .dual-bar.is-pv {
  background: var(--c-brand);
}
:is(#_dp1#_dp2#_dp3, :root) .dual-bar.is-uu {
  background: #f59e0b;
}
:is(#_dp1#_dp2#_dp3, :root) .region-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--c-brand), var(--c-indigo));
  border-radius: 4px;
}

/* ============================================================
   2026-10-25 モバイルUI全面再構成（iPhone実機不具合対応）
   原因：
   (a) 旧 admin.css / client.css の html,body / ラッパー要素への overflow-x:hidden が
       position:sticky のスクロールコンテナを本文側に変えてしまい、
       top: var(--demo-banner-height) 分だけトップバー・ページ内ナビが下方へ押し出されていた
       （＝デモバー直下の巨大な空白・ページ内ナビが本文に重なる現象）
   (b) スマホでデモバー(約130px)＋トップバー(約108px)／ポータルナビ＋ページ内ナビを
       すべて固定していたため、画面の約3割が固定要素で占有されていた
   対策：
   - sticky 祖先の overflow を visible に戻し、sticky を本来のビューポート基準に戻す
   - スマホ(<=768px)ではデモバーを非固定（スクロールで流れる）に変更し、2行のコンパクト構成へ
   - 管理側トップバーは1行化し top:0 で固定、クライアント側はポータルナビのみ top:0 で固定
   - ページ内ナビはスマホでは非固定（本文を覆わない）
   ============================================================ */

/* (a) sticky 破綻の根本原因を解除（overflow-x:hidden による隠蔽ではなく、スクロールコンテナ化を解除） */
html,
body.ui-refresh {
  overflow-x: visible;
  max-width: 100%;
}
#demo-admin-root,
#demo-admin-root .app-layout,
#demo-admin-root .main-content,
#demo-admin-root .content-body,
#demo-client-root,
#demo-client-root .main-wrapper,
#demo-client-root .section-inner {
  overflow: visible;
}

/* 読み取り専用トーストを iPhone のホームバー領域に重ねない */
#sl-demo-toast {
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}

/* AIアドバイザーのタブ固定位置（PC/タブレット：デモバー＋ポータルナビ＋ページ内ナビの実測値） */
#demo-client-root .ai-tabs {
  top: calc(var(--demo-banner-height) + var(--portal-nav-height) + var(--inpage-nav-height) + 8px);
}

@media (max-width: 768px) {
  /* ── 共通デモバー：非固定・2行（1行目：視点切替 / 2行目：トップへ・無料登録） ── */
  .sl-demo-banner {
    position: relative;
    top: auto;
    z-index: 120;
    padding: 8px 10px;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.25);
  }
  .sl-demo-banner-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
  .sl-demo-left,
  .sl-demo-actions {
    display: contents;
  }
  .sl-demo-pill,
  .sl-demo-note {
    display: none;
  }
  .sl-demo-role-switcher {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    box-sizing: border-box;
  }
  .sl-role-btn,
  .sl-demo-btn-back,
  .sl-demo-btn-signup {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 40px !important;
    padding: 6px 8px;
    font-size: 0.76rem;
    line-height: 1.25;
    text-align: center;
    white-space: normal;
    box-sizing: border-box;
  }
  .sl-demo-btn-back,
  .sl-demo-btn-signup {
    width: 100%;
  }
  .sl-role-btn .sl-role-tag {
    display: none;
  }

  /* ── 制作側：トップバー1行化（☰＋画面タイトル）・画面最上部に固定 ── */
  #demo-admin-root .topbar {
    position: sticky;
    top: 0;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    min-height: 52px;
    padding: 6px 12px;
    gap: 8px;
  }
  #demo-admin-root .topbar-main-row {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }
  #demo-admin-root .topbar-main-row .page-title {
    font-size: 0.95rem;
    line-height: 1.3;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  /* 2行目（デモ表示バッジ・視点切替）は直上のデモバーと重複するため非表示 */
  #demo-admin-root .topbar-sub-row {
    display: none;
  }
  #demo-admin-root .sidebar {
    top: 0;
    height: 100vh;
    height: 100dvh;
  }
  #demo-admin-root .sidebar-overlay {
    top: 0;
  }
  #demo-admin-root .content-body {
    padding: 12px 10px calc(24px + env(safe-area-inset-bottom, 0px));
  }

  /* ── クライアント側：ヘッダー整理（ロゴ行 / 会社名 / 操作ボタン） ── */
  #demo-client-root .site-header .header-inner {
    padding: 10px 12px;
    gap: 8px;
  }
  #demo-client-root .header-client {
    width: 100%;
    margin-left: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  #demo-client-root .header-client-info {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 2px 6px;
    width: 100%;
    max-width: none;
    background: none;
    border: none;
    padding: 0;
    white-space: normal;
    overflow: visible;
  }
  #demo-client-root .header-client-info strong {
    font-size: 0.92rem;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
  #demo-client-root .header-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    width: 100%;
    padding-top: 8px !important;
  }
  #demo-client-root .header-user-badge,
  #demo-client-root .header-logout-link,
  #demo-client-root .header-role-switch-btn {
    justify-content: center;
    min-height: 40px !important;
    font-size: 0.76rem;
    padding: 6px 8px;
    white-space: normal;
    text-align: center;
    box-sizing: border-box;
  }
  #demo-client-root .header-role-switch-btn {
    grid-column: 1 / -1;
  }

  /* ポータルナビ（上部タブ＝画面切替）のみ最上部に固定 */
  #demo-client-root .portal-nav {
    top: 0;
  }
  /* ページ内ナビ（ダッシュボード内の見出しジャンプ）はスマホでは固定しない＝本文を覆わない */
  #demo-client-root .dashboard-inpage-nav {
    position: relative;
    top: auto;
    margin-bottom: 1rem;
  }
  #demo-client-root .ai-tabs {
    top: var(--portal-nav-height);
  }
  #demo-client-root .site-footer {
    padding-bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px));
  }
}

@media (max-width: 360px) {
  .sl-role-btn,
  .sl-demo-btn-back,
  .sl-demo-btn-signup {
    font-size: 0.7rem;
    padding: 6px 4px;
  }
  #demo-admin-root .topbar-main-row .page-title {
    font-size: 0.88rem;
  }
}

@media (max-width: 1024px) {
  /* 閉じているドロワーの影が画面左端に灰色の帯として見えないようにする */
  #demo-admin-root .sidebar:not(.open) {
    box-shadow: none;
  }
}
@media (max-width: 768px) {
  /* トップバーを画面幅いっぱいに（左右の余白・角丸を解除） */
  #demo-admin-root .topbar {
    margin-left: 0;
    margin-right: 0;
    width: auto;
    border-radius: 0;
  }
  #demo-client-root .header-logo-text {
    display: inline;
  }
}

@media (max-width: 768px) {
  /* main-content の左右パディング(約12.5px)がトップバー・本文を内側に寄せていたため解除し、本文側の余白に一本化 */
  #demo-admin-root .main-content {
    padding-left: 0;
    padding-right: 0;
  }
  /* お知らせ見出し：狭い画面で「アクティビテ／ィ」と不自然に折り返さないよう縮小・未読バッジは折り返さない */
  #demo-client-root .notif-header {
    padding: 0.6rem 0.9rem;
    gap: 8px;
  }
  #demo-client-root .notif-header h2 {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.82rem;
  }
  #demo-client-root .notif-header > :last-child {
    flex-shrink: 0;
    white-space: nowrap;
  }
}
@media (max-width: 360px) {
  #demo-client-root .notif-header h2 {
    font-size: 0.76rem;
  }
}
/* PC幅でもデモバーを1行に収める（説明文は十分な幅がある場合のみ表示） */
@media (max-width: 1366px) {
  .sl-demo-note {
    display: none;
  }
}

/* タブレット幅(769〜1024px)もデモバーは非固定にし、固定領域をアプリ側ナビ1本に限定 */
@media (max-width: 1024px) {
  .sl-demo-banner {
    position: relative;
    top: auto;
    z-index: 120;
  }
}
@media (max-width: 1680px) {
  .sl-demo-note {
    display: none;
  }
}

/* 非表示時のトーストが画面下端に黒いバーとして覗いていた問題を解消（下端外へ完全退避＋visibility制御） */
#sl-demo-toast {
  transform: translateX(-50%) translateY(calc(100% + 48px));
  visibility: hidden;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s linear 0.25s;
}
#sl-demo-toast.show {
  transform: translateX(-50%) translateY(0);
  visibility: visible;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s;
}
@media (max-width: 768px) {
  #sl-demo-toast {
    left: 12px;
    right: 12px;
    max-width: none;
    transform: translateY(calc(100% + 48px));
    flex-wrap: wrap;
  }
  #sl-demo-toast.show {
    transform: translateY(0);
  }
  /* 上部タブ（画面切替）の文字サイズ・タップ領域を全スマホ幅で統一 */
  #demo-client-root .portal-nav-link {
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.8rem 0.85rem;
    min-height: 44px;
  }
}

@media (max-width: 768px) {
  /* 各タブ見出し・一覧見出しをスマホ向けサイズに統一 */
  #demo-client-root .section-title {
    font-size: 1.15rem;
    line-height: 1.45;
  }
  #demo-client-root .section-lead {
    font-size: 0.84rem;
    line-height: 1.7;
  }
  #demo-client-root .inv-list-header h2,
  #demo-client-root .dash-section-header h2 {
    font-size: 0.95rem;
    line-height: 1.5;
  }
  /* 請求書一覧の行：金額・ボタンを下段に回し本文の折り返しを自然に */
  #demo-client-root .inv-item {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  #demo-client-root .inv-item-right {
    justify-content: flex-start;
    gap: 8px;
  }
}