/* 全ページ共通ヘッダー（せんデータの帯＋タイトル＋タブ）。新設法人ダッシュボードのヘッダーに合わせた作り */
:root { --sh-bg: var(--page, #f9f9f7); --sh-ink: var(--ink, #0b0b0b); --sh-ink2: var(--ink-2, #52514e); --sh-muted: var(--muted, #898781);
  --sh-line: var(--border, rgba(11,11,11,.10)); --sh-accent: #1a2a4a; --sh-sky: #e6edf6; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --sh-accent: #a5b1f5; --sh-sky: #141a2c; } }
:root[data-theme="dark"] { --sh-accent: #a5b1f5; --sh-sky: #141a2c; }
body { margin: 0; }

.sd-band { background: #1a2a4a; padding: 10px 20px; font-size: 13px; line-height: 1.5; }
.sd-band-in { max-width: 1240px; margin-inline: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; }
.sd-band a { color: rgba(255,255,255,.78); text-decoration: none; }
.sd-band a:hover { color: #fff; text-decoration: underline; }
.sd-home { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.sd-band a.sd-home { color: #fff; }
.sd-home img { width: 30px; height: auto; display: block; filter: brightness(0) invert(1); }
.sd-band nav { display: flex; gap: 4px 16px; flex-wrap: wrap; }
/* 他のダッシュボードへのメニュー（新設法人・小売外食と共通） */
.sd-band{position:relative;z-index:30}
.sd-dash{position:relative}
.sd-dash summary{list-style:none;cursor:pointer;color:rgba(255,255,255,.78)}
.sd-dash summary::-webkit-details-marker{display:none}
.sd-dash summary::after{content:"";display:inline-block;margin-left:6px;vertical-align:2px;border:4px solid transparent;border-top-color:currentColor;border-bottom:0}
.sd-dash summary:hover,.sd-dash[open] summary{color:#fff}
.sd-dash-menu{position:absolute;right:0;top:calc(100% + 10px);min-width:230px;background:#fff;border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.22);padding:6px;display:flex;flex-direction:column}
.sd-band .sd-dash-menu a{display:block;padding:8px 12px;border-radius:6px;color:#1a2a4a;font-size:13px;white-space:nowrap}
.sd-band .sd-dash-menu a:hover{background:#eef1f5;text-decoration:none}
.sd-band .sd-dash-menu a[aria-current="page"]{font-weight:700;background:#e6e9f7}
.sd-dash-menu a small{display:block;font-size:11px;color:#6b7385;font-weight:400}
@media (max-width:560px){.sd-band-in{position:relative}.sd-dash{position:static}.sd-dash-menu{left:0;right:0;top:calc(100% + 6px)}}

.mast { background: linear-gradient(180deg, var(--sh-sky) 0%, var(--sh-bg) 100%); border-bottom: 1px solid var(--sh-line); }
.mast-in { max-width: 1240px; margin: 0 auto; padding: 32px 20px 18px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 40%); grid-template-areas: "text art" "asof art"; gap: 10px 32px; align-items: end; }
.mast-text { grid-area: text; }
.mast .eyebrow { font-family: "IBM Plex Mono", ui-monospace, Consolas, monospace; font-size: 12px; letter-spacing: .14em; color: var(--sh-muted); margin: 0 0 10px; text-transform: uppercase; }
.mast .eyebrow a { color: inherit; text-decoration: none; font-weight: 700; }
.mast .eyebrow a:hover { color: var(--sh-ink); text-decoration: underline; }
.mast .brand { display: flex; align-items: center; gap: 14px; }
.mast .mast-title { margin: 0; font-size: clamp(24px, 3.4vw, 38px); font-weight: 900; line-height: 1.25; color: var(--sh-ink); letter-spacing: .02em; word-break: auto-phrase; text-wrap: balance; }
.mast .mast-title .badge { font-size: 11px; font-weight: 400; vertical-align: middle; }
.mast .mast-lead { margin: 12px 0 0; color: var(--sh-ink2); font-size: 13.5px; max-width: 60ch; word-break: auto-phrase; text-wrap: pretty; }
/* 画像スペース：ロゴ（assets/logo.png）とタイトル画像（assets/title-bg.jpg）。画像がないときは点線の枠 */
.mast .logo { flex: none; width: clamp(48px, 6vw, 64px); height: clamp(48px, 6vw, 64px); display: grid; place-items: center; border-radius: 12px; }
.mast .logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.mast .logo:empty { border: 2px dashed var(--sh-line); }
.mast-art { grid-area: art; align-self: center; aspect-ratio: 5 / 2; border-radius: 14px; overflow: hidden; position: relative; }
.mast-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.mast-art:empty { border: 2px dashed var(--sh-line); display: grid; place-items: center; }
.mast-art:empty::after { content: "画像スペース（assets/" attr(data-img) "）"; font-size: 12px; color: var(--sh-muted); }
.mast .asof { grid-area: asof; font-family: "IBM Plex Mono", ui-monospace, Consolas, monospace; font-size: 12px; color: var(--sh-ink2); }
.mast .asof b { display: inline-block; margin-left: 8px; font-size: 15px; color: var(--sh-ink); font-weight: 600; font-family: system-ui, sans-serif; }

/* タブはスクロールしても上に固定 */
.sitetabs { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--sh-bg) 92%, transparent); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--sh-line); }
.sitetabs-in { max-width: 1240px; margin: 0 auto; padding: 0 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; }
.sitetabs .tabs { display: flex; align-items: stretch; gap: 4px; overflow-x: auto; scrollbar-width: none; min-width: 0; }
/* ページのフィルター（国籍・期間など）を固定の行に入れる。app.js がページ内の .filters をここへ移す */
.sitefilters { margin-left: auto; min-width: 0; }
.sitefilters:empty { display: none; }
.sitefilters .filters { margin: 0; padding: 6px 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.sitefilters .filters label { flex-direction: row; align-items: center; gap: 6px; font-size: 12px; white-space: nowrap; }
.sitefilters select { padding: 4px 6px; font-size: 13px; max-width: 13em; }
.sitefilters { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.sitefilters .prefpick { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--sh-ink2); white-space: nowrap; }
.sitefilters .prefpick select { font-weight: 700; }
.sitetabs a[aria-current="page"] small { color: var(--sh-ink); font-weight: 700; font-size: 13px; }
.sitefilters .seg button { padding: 4px 10px; font-size: 12px; }
.sitetabs a.mini { font-weight: 900; color: var(--sh-ink); margin-right: 10px; padding-left: 0; padding-right: 6px; letter-spacing: .02em; }
.sitetabs a.mini:hover { background: none; text-decoration: underline; }
.sitetabs a { display: flex; align-items: baseline; gap: 6px; white-space: nowrap; padding: 10px 16px 9px; font-size: 15px; font-weight: 700; color: var(--sh-ink2); text-decoration: none; border-bottom: 3px solid transparent; }
.sitetabs a small { font-size: 11px; font-weight: 400; color: var(--sh-muted); }
.sitetabs a .ic { font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif; font-weight: 400; }
.sitetabs a:hover { color: var(--sh-ink); background: color-mix(in srgb, var(--sh-ink) 5%, transparent); }
.sitetabs a[aria-current="page"] { color: var(--sh-ink); border-bottom-color: var(--sh-accent); }

@media (max-width: 720px) {
  .sd-band { padding-inline: 16px; }
  .mast-in { padding: 22px 16px 14px; grid-template-columns: 1fr; grid-template-areas: "text" "art" "asof"; }
  .mast-art { aspect-ratio: 5 / 2; }
  .sitetabs-in { padding: 0 8px; gap: 0; }
  .sitetabs .tabs { flex: 1 1 100%; }
  .sitefilters { margin-left: 0; flex: 1 1 100%; overflow-x: auto; scrollbar-width: none; border-top: 1px solid var(--sh-line); }
  .sitefilters { flex-wrap: nowrap; }
  .sitefilters .filters { flex-wrap: nowrap; padding: 6px 4px; }
  .sitetabs a[aria-current="page"] small { display: inline; }
  .sitetabs a.mini { display: none; }
  .sitetabs a { padding: 10px 10px 9px; font-size: 14px; }
  .sitetabs a small { display: none; }
}

/* 共通フッター */
.sd-foot { background: #1a2a4a; color: rgba(255,255,255,.72); font-size: 12px; line-height: 1.8; margin-top: 32px; }
.sd-foot-in { max-width: 1240px; margin: 0 auto; padding: 18px 20px 22px; }
.sd-foot p { margin: 0 0 6px; }
.sd-foot a { color: #fff; text-decoration: none; }
.sd-foot a:hover { text-decoration: underline; }
/* 出典URLなど長い文字列をスマホ幅で折り返す */
footer, .note { overflow-wrap: anywhere; }