/* 見本に同梱されたデジタル庁デザインシステムのトークン。 */

:root {
  --color-primitive-blue-50: #e8f1fe;
  --color-primitive-blue-100: #d9e6ff;
  --color-primitive-blue-200: #c5d7fb;
  --color-primitive-blue-300: #9db7f9;
  --color-primitive-blue-400: #7096f8;
  --color-primitive-blue-500: #4979f5;
  --color-primitive-blue-600: #3460fb;
  --color-primitive-blue-700: #264af4;
  --color-primitive-blue-800: #0031d8;
  --color-primitive-blue-900: #0017c1;
  --color-primitive-blue-1000: #00118f;
  --color-primitive-blue-1100: #000071;
  --color-primitive-blue-1200: #000060;
  --color-primitive-light-blue-50: #f0f9ff;
  --color-primitive-light-blue-100: #dcf0ff;
  --color-primitive-light-blue-200: #c0e4ff;
  --color-primitive-light-blue-300: #97d3ff;
  --color-primitive-light-blue-400: #57b8ff;
  --color-primitive-light-blue-500: #39abff;
  --color-primitive-light-blue-600: #008bf2;
  --color-primitive-light-blue-700: #0877d7;
  --color-primitive-light-blue-800: #0066be;
  --color-primitive-light-blue-900: #0055ad;
  --color-primitive-light-blue-1000: #00428c;
  --color-primitive-light-blue-1100: #00316a;
  --color-primitive-light-blue-1200: #00234b;
  --color-primitive-cyan-50: #e9f7f9;
  --color-primitive-cyan-100: #c8f8ff;
  --color-primitive-cyan-200: #99f2ff;
  --color-primitive-cyan-300: #79e2f2;
  --color-primitive-cyan-400: #2bc8e4;
  --color-primitive-cyan-500: #01b7d6;
  --color-primitive-cyan-600: #00a3bf;
  --color-primitive-cyan-700: #008da6;
  --color-primitive-cyan-800: #008299;
  --color-primitive-cyan-900: #006f83;
  --color-primitive-cyan-1000: #006173;
  --color-primitive-cyan-1100: #004c59;
  --color-primitive-cyan-1200: #003741;
  --color-primitive-green-50: #e6f5ec;
  --color-primitive-green-100: #c2e5d1;
  --color-primitive-green-200: #9bd4b5;
  --color-primitive-green-300: #71c598;
  --color-primitive-green-400: #51b883;
  --color-primitive-green-500: #2cac6e;
  --color-primitive-green-600: #259d63;
  --color-primitive-green-700: #1d8b56;
  --color-primitive-green-800: #197a4b;
  --color-primitive-green-900: #115a36;
  --color-primitive-green-1000: #0c472a;
  --color-primitive-green-1100: #08351f;
  --color-primitive-green-1200: #032213;
  --color-primitive-lime-50: #ebfad9;
  --color-primitive-lime-100: #d0f5a2;
  --color-primitive-lime-200: #c0f354;
  --color-primitive-lime-300: #ade830;
  --color-primitive-lime-400: #9ddd15;
  --color-primitive-lime-500: #8cc80c;
  --color-primitive-lime-600: #7eb40d;
  --color-primitive-lime-700: #6fa104;
  --color-primitive-lime-800: #618e00;
  --color-primitive-lime-900: #507500;
  --color-primitive-lime-1000: #3e5a00;
  --color-primitive-lime-1100: #2c4100;
  --color-primitive-lime-1200: #1e2d00;
  --color-primitive-yellow-50: #fbf5e0;
  --color-primitive-yellow-100: #fff0b3;
  --color-primitive-yellow-200: #ffe380;
  --color-primitive-yellow-300: #ffd43d;
  --color-primitive-yellow-400: #ffc700;
  --color-primitive-yellow-500: #ebb700;
  --color-primitive-yellow-600: #d2a400;
  --color-primitive-yellow-700: #b78f00;
  --color-primitive-yellow-800: #a58000;
  --color-primitive-yellow-900: #927200;
  --color-primitive-yellow-1000: #806300;
  --color-primitive-yellow-1100: #6e5600;
  --color-primitive-yellow-1200: #604b00;
  --color-primitive-orange-50: #ffeee2;
  --color-primitive-orange-100: #ffdfca;
  --color-primitive-orange-200: #ffc199;
  --color-primitive-orange-300: #ffa66d;
  --color-primitive-orange-400: #ff8d44;
  --color-primitive-orange-500: #ff7628;
  --color-primitive-orange-600: #fb5b01;
  --color-primitive-orange-700: #e25100;
  --color-primitive-orange-800: #c74700;
  --color-primitive-orange-900: #ac3e00;
  --color-primitive-orange-1000: #8b3200;
  --color-primitive-orange-1100: #6d2700;
  --color-primitive-orange-1200: #541e00;
  --color-primitive-red-50: #fdeeee;
  --color-primitive-red-100: #ffdada;
  --color-primitive-red-200: #ffbbbb;
  --color-primitive-red-300: #ff9696;
  --color-primitive-red-400: #ff7171;
  --color-primitive-red-500: #ff5454;
  --color-primitive-red-600: #fe3939;
  --color-primitive-red-700: #fa0000;
  --color-primitive-red-800: #ec0000;
  --color-primitive-red-900: #ce0000;
  --color-primitive-red-1000: #a90000;
  --color-primitive-red-1100: #850000;
  --color-primitive-red-1200: #620000;
  --color-primitive-magenta-50: #f3e5f4;
  --color-primitive-magenta-100: #ffd0ff;
  --color-primitive-magenta-200: #ffaeff;
  --color-primitive-magenta-300: #ff8eff;
  --color-primitive-magenta-400: #f661f6;
  --color-primitive-magenta-500: #f137f1;
  --color-primitive-magenta-600: #db00db;
  --color-primitive-magenta-700: #c000c0;
  --color-primitive-magenta-800: #aa00aa;
  --color-primitive-magenta-900: #8b008b;
  --color-primitive-magenta-1000: #6c006c;
  --color-primitive-magenta-1100: #500050;
  --color-primitive-magenta-1200: #3b003b;
  --color-primitive-purple-50: #f1eafa;
  --color-primitive-purple-100: #ecddff;
  --color-primitive-purple-200: #ddc2ff;
  --color-primitive-purple-300: #cda6ff;
  --color-primitive-purple-400: #bb87ff;
  --color-primitive-purple-500: #a565f8;
  --color-primitive-purple-600: #8843e1;
  --color-primitive-purple-700: #6f23d0;
  --color-primitive-purple-800: #5c10be;
  --color-primitive-purple-900: #5109ad;
  --color-primitive-purple-1000: #41048e;
  --color-primitive-purple-1100: #30016c;
  --color-primitive-purple-1200: #21004b;
  --color-neutral-white: #ffffff;
  --color-neutral-black: #000000;
  --color-neutral-solid-gray-50: #f2f2f2;
  --color-neutral-solid-gray-100: #e6e6e6;
  --color-neutral-solid-gray-200: #cccccc;
  --color-neutral-solid-gray-300: #b3b3b3;
  --color-neutral-solid-gray-400: #999999;
  --color-neutral-solid-gray-420: #949494;
  --color-neutral-solid-gray-500: #7f7f7f;
  --color-neutral-solid-gray-536: #767676;
  --color-neutral-solid-gray-600: #666666;
  --color-neutral-solid-gray-700: #4d4d4d;
  --color-neutral-solid-gray-800: #333333;
  --color-neutral-solid-gray-900: #1a1a1a;
  --color-neutral-opacity-gray-50: rgba(0, 0, 0, 0.05);
  --color-neutral-opacity-gray-100: rgba(0, 0, 0, 0.1);
  --color-neutral-opacity-gray-200: rgba(0, 0, 0, 0.2);
  --color-neutral-opacity-gray-300: rgba(0, 0, 0, 0.3);
  --color-neutral-opacity-gray-400: rgba(0, 0, 0, 0.4);
  --color-neutral-opacity-gray-420: rgba(0, 0, 0, 0.42);
  --color-neutral-opacity-gray-500: rgba(0, 0, 0, 0.5);
  --color-neutral-opacity-gray-536: rgba(0, 0, 0, 0.536);
  --color-neutral-opacity-gray-600: rgba(0, 0, 0, 0.6);
  --color-neutral-opacity-gray-700: rgba(0, 0, 0, 0.7);
  --color-neutral-opacity-gray-800: rgba(0, 0, 0, 0.8);
  --color-neutral-opacity-gray-900: rgba(0, 0, 0, 0.9);
  --font-weight-400: 400;
  --font-weight-700: 700;
  --font-family-sans: 'Noto Sans JP', sans-serif;
  --font-family-mono: 'Noto Sans Mono', monospace;
  --font-size-14: 0.875rem;
  --font-size-16: 1rem;
  --font-size-17: 1.0625rem;
  --font-size-18: 1.125rem;
  --font-size-20: 1.25rem;
  --font-size-22: 1.375rem;
  --font-size-24: 1.5rem;
  --font-size-26: 1.625rem;
  --font-size-28: 1.75rem;
  --font-size-32: 2rem;
  --font-size-36: 2.25rem;
  --font-size-45: 2.8125rem;
  --font-size-48: 3rem;
  --font-size-57: 3.5625rem;
  --font-size-64: 4rem;
  --line-height-100: 1;
  --line-height-120: 1.2;
  --line-height-130: 1.3;
  --line-height-140: 1.4;
  --line-height-150: 1.5;
  --line-height-160: 1.6;
  --line-height-170: 1.7;
  --line-height-175: 1.75;
  --border-radius-4: 0.25rem;
  --border-radius-6: 0.375rem;
  --border-radius-8: 0.5rem;
  --border-radius-12: 0.75rem;
  --border-radius-16: 1rem;
  --border-radius-24: 1.5rem;
  --border-radius-32: 2rem;
  --border-radius-full: 624.9375rem;
  --elevation-1: 0 2px 8px 1px rgba(0,0,0,0.1), 0 1px 5px 0 rgba(0,0,0,0.3);
  --elevation-2: 0 2px 12px 2px rgba(0,0,0,0.1), 0 1px 6px 0 rgba(0,0,0,0.3);
  --elevation-3: 0 4px 16px 3px rgba(0,0,0,0.1), 0 1px 6px 0 rgba(0,0,0,0.3);
  --elevation-4: 0 6px 20px 4px rgba(0,0,0,0.1), 0 2px 6px 0 rgba(0,0,0,0.3);
  --elevation-5: 0 8px 24px 5px rgba(0,0,0,0.1), 0 2px 10px 0 rgba(0,0,0,0.3);
  --elevation-6: 0 10px 30px 6px rgba(0,0,0,0.1), 0 3px 12px 0 rgba(0,0,0,0.3);
  --elevation-7: 0 12px 36px 7px rgba(0,0,0,0.1), 0 3px 14px 0 rgba(0,0,0,0.3);
  --elevation-8: 0 14px 40px 7px rgba(0,0,0,0.1), 0 3px 16px 0 rgba(0,0,0,0.3);
  --color-semantic-success-1: var(--color-primitive-green-600);
  --color-semantic-success-2: var(--color-primitive-green-800);
  --color-semantic-error-1: var(--color-primitive-red-800);
  --color-semantic-error-2: var(--color-primitive-red-900);
  --color-semantic-warning-yellow-1: var(--color-primitive-yellow-700);
  --color-semantic-warning-yellow-2: var(--color-primitive-yellow-900);
  --color-semantic-warning-orange-1: var(--color-primitive-orange-600);
  --color-semantic-warning-orange-2: var(--color-primitive-orange-800);
  --color-key-50: var(--color-primitive-blue-50);
  --color-key-100: var(--color-primitive-blue-100);
  --color-key-200: var(--color-primitive-blue-200);
  --color-key-300: var(--color-primitive-blue-300);
  --color-key-400: var(--color-primitive-blue-400);
  --color-key-500: var(--color-primitive-blue-500);
  --color-key-600: var(--color-primitive-blue-600);
  --color-key-700: var(--color-primitive-blue-700);
  --color-key-800: var(--color-primitive-blue-800);
  --color-key-900: var(--color-primitive-blue-900);
  --color-key-1000: var(--color-primitive-blue-1000);
  --color-key-1100: var(--color-primitive-blue-1100);
  --color-key-1200: var(--color-primitive-blue-1200);
}

:root {
  --ink: var(--color-neutral-solid-gray-900);
  --muted: var(--color-neutral-solid-gray-700);
  --line: var(--color-neutral-solid-gray-600);
  --control: var(--color-neutral-solid-gray-600);
  --orange: var(--color-primitive-orange-900);
  --soft-orange: var(--color-primitive-orange-50);
  --link: var(--color-primitive-blue-900);
  --error: var(--color-semantic-error-2);
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: #f6f6f2; color: var(--ink); font: 400 16px/1.75 var(--font-family-sans); }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 38px; line-height: 1.3; }
h2 { font-size: 23px; line-height: 1.4; }
h3 { font-size: 18px; line-height: 1.5; }
a { color: var(--link); text-underline-offset: 3px; }
button, input, select, textarea { font: inherit; color: inherit; }
button, select, input[type=checkbox] { cursor: pointer; }
:focus-visible { outline: 4px solid #000; outline-offset: 2px; box-shadow: 0 0 0 2px #ffd43d; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
[hidden] { display: none !important; }
.skip { position: fixed; z-index: 5; top: 8px; left: 12px; background: white; padding: 9px 14px; transform: translateY(-150%); }
.skip:focus { transform: none; }
.mast { background: var(--soft-orange); border-bottom: 2px solid var(--orange); }
.mast-inner, .wrap { width: min(100% - 72px, 1200px); margin-inline: auto; }
.mast-inner { display: flex; align-items: center; gap: 20px; min-height: 70px; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font-size: 19px; font-weight: 700; letter-spacing: .05em; color: var(--ink); white-space: nowrap; }
.product { font-size: 14px; font-weight: 700; color: var(--muted); border-left: 1px solid var(--control); padding-left: 20px; }
.about { margin-left: auto; font-size: 14px; font-weight: 700; white-space: nowrap; }
.wrap { padding: 36px 0 24px; }
.intro { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 23px; }
.workspace { color: var(--muted); font-size: 14px; font-weight: 700; margin-bottom: 4px; }
.description { margin-top: 8px; color: var(--muted); }
.sample { color: var(--muted); border: 1px solid var(--control); background: white; border-radius: 3px; padding: 3px 8px; font-size: 14px; white-space: nowrap; }
.summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 23px; }
.metric { display: grid; justify-items: start; gap: 2px; text-align: left; background: #fff; border: 1px solid var(--control); border-left-width: 4px; border-radius: 5px; padding: 12px 15px; }
.metric:hover { background: var(--soft-orange); }
.metric.late { border-left-color: var(--error); }
.metric.quiet { border-left-color: var(--orange); }
.metric.review { border-left-color: var(--link); }
.metric-label { font-size: 15px; font-weight: 700; }
.metric-label span { display: inline-block; width: 20px; text-align: center; }
.late .metric-label span { color: var(--error); }
.quiet .metric-label span { color: var(--orange); }
.review .metric-label span { color: var(--link); }
.metric-value { font-size: 14px; line-height: 1.25; }
.metric-value strong { font-size: 28px; font-variant-numeric: tabular-nums; }
.metric-note, .ledger-title p, .result, .sub, footer { color: var(--muted); font-size: 14px; }
.ledger { border: 1px solid var(--control); border-radius: 6px; background: #fff; }
.ledger-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 15px 18px 10px; }
.done-toggle { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.done-toggle input { width: 20px; height: 20px; accent-color: var(--orange); }
.turns { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--control); padding-inline: 15px; }
.turns button { min-height: 47px; padding: 5px 11px; background: white; border: 1px solid var(--control); font-size: 14px; font-weight: 700; }
.turns button:hover, .turns button[aria-selected=true] { background: var(--soft-orange); }
.turns button[aria-selected=true] { border-bottom: 4px solid var(--orange); }
.turns button span { color: var(--muted); font-weight: 400; }
.filters { display: flex; align-items: end; flex-wrap: wrap; gap: 10px 15px; padding: 13px 18px 15px; }
.filters label, .form-grid label, .review-log { display: grid; gap: 3px; font-size: 14px; font-weight: 700; }
select, input[type=date], textarea { min-height: 42px; max-width: 100%; padding: 6px 9px; border: 1px solid var(--control); border-radius: 3px; background: white; font-weight: 400; font-size: 16px; }
.result { margin-left: auto; white-space: nowrap; }
.table-scroll { max-width: 100%; overflow-x: auto; }
.table-scroll:focus-visible { outline-offset: -6px; }
table { width: 100%; min-width: 790px; border-collapse: collapse; }
thead { background: var(--color-neutral-solid-gray-100); }
th, td { padding: 9px 14px; border-top: 1px solid var(--line); text-align: left; vertical-align: top; font-size: 14px; }
thead th { white-space: nowrap; border-top-color: var(--control); }
tbody th { width: 27%; }
tbody tr:nth-child(even) { background: #fafaf8; }
tbody tr:hover { background: var(--soft-orange); }
.sub { display: block; font-weight: 400; }
.line-item { display: block; }
.line-item + .line-item { margin-top: 5px; }
.badge { display: inline-block; padding: 0 6px; margin: 0 4px 3px 0; border-radius: 3px; border: 1px solid var(--control); color: var(--ink); white-space: nowrap; }
.badge.late { background: var(--color-primitive-red-50); border-color: var(--error); }
.badge.quiet { background: var(--soft-orange); border-color: var(--orange); }
.empty { padding: 20px; }
footer { display: flex; justify-content: space-between; gap: 10px; margin-top: 16px; }
dialog { width: min(100% - 32px, 615px); max-height: calc(100% - 36px); overflow: auto; padding: 0; border: 1px solid var(--control); border-radius: 6px; color: var(--ink); }
dialog::backdrop { background: #0009; }
.dialog-body { padding: 22px; }
.evidence, .detail-item { margin: 14px 0; background: var(--color-neutral-solid-gray-100); border-left: 3px solid var(--control); padding: 10px 13px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 10px 0; }
.review-log textarea { width: 100%; }
.actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 15px; }
.primary, .secondary { padding: 6px 12px; min-height: 42px; border: 1px solid var(--orange); border-radius: 3px; font-size: 14px; font-weight: 700; }
.primary { background: var(--orange); color: #fff; }
.primary:hover { background: var(--color-primitive-orange-1000); }
.primary:active { background: var(--color-primitive-orange-1100); }
.secondary { background: white; color: var(--orange); }
.secondary:hover { background: var(--soft-orange); }
@media (max-width: 820px) { .mast-inner, .wrap { width: calc(100% - 40px); } }
@media (max-width: 560px) {
  .mast-inner, .wrap { width: calc(100% - 24px); }
  .mast-inner { min-height: 58px; }
  .wrap { padding-top: 21px; }
  .product { display: none; }
  .intro { flex-wrap: wrap; margin-bottom: 14px; }
  h1 { font-size: 31px; }
  h2 { font-size: 21px; }
  .summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 16px; }
  .metric { padding: 8px; }
  .metric.review { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .metric.review .metric-note { grid-column: 1 / -1; }
  .ledger-title, footer { flex-direction: column; align-items: flex-start; }
  .ledger-title, .filters { padding-inline: 11px; }
  .turns { padding-inline: 5px; gap: 1px; }
  .turns button { padding-inline: 6px; }
  .filters { display: grid; grid-template-columns: minmax(0, 1fr); }
  .result { margin-left: 0; }
  .dialog-body { padding: 15px; }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
}

.view-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0 15px;
  border-bottom: 1px solid var(--control);
  margin-bottom: 23px;
}
.view-nav a {
  padding: 7px 8px;
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  border: 1px solid var(--control);
}
.view-nav a[aria-current="page"] {
  color: var(--orange);
  border-bottom: 3px solid var(--orange);
  background: var(--soft-orange);
  text-decoration: none;
}
.registry-ledger .ledger-title {
  border-bottom: 1px solid var(--line);
  padding-bottom: 13px;
  align-items: flex-start;
}
.registry-filters {
  align-items: end;
  padding-bottom: 13px;
}
.registry-filters label:first-child { flex: 1 1 245px; max-width: 390px; }
.registry-filters input[type="search"] {
  min-height: 42px;
  min-width: 0;
  width: 100%;
  padding: 6px 9px;
  border: 1px solid var(--control);
  border-radius: 3px;
  background: white;
  font-weight: 400;
  font-size: 16px;
}
.column-settings {
  position: relative;
  align-self: flex-start;
}
.column-settings summary {
  border: 1px solid var(--orange);
  color: var(--orange);
  border-radius: 3px;
  padding: 6px 11px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.column-settings[open] summary, .column-settings summary:hover { background: var(--soft-orange); }
.column-settings fieldset {
  z-index: 5;
  position: absolute;
  right: 0;
  margin: 2px 0 0;
  padding: 8px 13px;
  width: max-content;
  border: 1px solid var(--control);
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 6px 18px #0002;
}
.column-settings legend {
  background: #fff;
  padding-inline: 4px;
  font-size: 14px;
  font-weight: 700;
}
.column-settings label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-block: 3px;
  font-size: 14px;
}
.column-settings input { accent-color: var(--orange); width: 18px; height: 18px; }
.registry-scroll { max-height: 535px; }
.registry-scroll-hint { padding: 0 18px 8px; color: var(--muted); font-size: 14px; }
.registry-table { min-width: 100%; border-collapse: separate; border-spacing: 0; }
.registry-table th, .registry-table td { padding: 9px 12px; }
.registry-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--color-neutral-solid-gray-100);
  box-shadow: 0 1px var(--control);
}
.registry-table .reg-name {
  position: sticky;
  left: 0;
  width: 190px;
  min-width: 172px;
  max-width: 210px;
  z-index: 1;
  border-right: 1px solid var(--control);
  overflow-wrap: anywhere;
}
.registry-table thead .reg-name { z-index: 3; }
.registry-table tbody .reg-name { background: #fff; }
.registry-table tbody tr:nth-child(even) .reg-name { background: #fafaf8; }
.registry-table tbody tr:hover .reg-name { background: var(--soft-orange); }
.registry-table .reg-customer { min-width: 127px; }
.registry-table .reg-status { min-width: 101px; }
.registry-table .reg-applications { min-width: 228px; }
.registry-table .reg-power { min-width: 112px; }
.registry-table .reg-connection, .registry-table .reg-updated {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.registry-application + .registry-application { border-top: 1px solid var(--line); margin-top: 6px; padding-top: 5px; }
@media (max-width: 560px) {
  .view-nav { margin-bottom: 14px; }
  .registry-scroll { max-height: 470px; }
  .registry-scroll-hint { padding-inline: 11px; }
  .registry-table .reg-name { min-width: 137px; width: 137px; max-width: 155px; }
  .registry-table th, .registry-table td { padding-inline: 8px; }
  .column-settings fieldset { left: 0; right: auto; }
}

.case-back { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 17px; font-size: 14px; font-weight: 700; }
.detail-intro { margin-bottom: 22px; }
.case-section { margin-bottom: 15px; }
.case-section > .ledger-title { border-bottom: 1px solid var(--line); padding-bottom: 12px; }
.case-section .ledger-title p { margin-top: 3px; }
.case-facts {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 11px 18px;
  margin: 0;
  padding: 15px 18px 18px;
}
.case-fact { min-width: 0; }
.case-fact dt { font-size: 14px; color: var(--muted); }
.case-fact dd { margin: 1px 0 0; font-weight: 700; overflow-wrap: anywhere; }
.case-applications { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 14px 18px 18px; }
.case-application { border: 1px solid var(--control); border-left: 3px solid var(--orange); border-radius: 3px; padding: 10px 12px; background: #fff; }
.case-app-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin: 8px 0 0; }
.case-progress { margin: 0; padding: 15px 18px; white-space: pre-wrap; overflow-wrap: anywhere; }
.case-history { margin: 0; padding: 0 18px; list-style: none; }
.case-history-entry { padding: 12px 0 16px; }
.case-history-entry + .case-history-entry { border-top: 1px solid var(--line); }
.history-meta { display: flex; flex-wrap: wrap; gap: 2px 13px; color: var(--muted); font-size: 14px; }
.history-meta time { font-variant-numeric: tabular-nums; }
.history-changes { list-style: none; padding: 0; margin: 9px 0 0; }
.history-change {
  display: grid;
  grid-template-columns: minmax(120px, 0.4fr) minmax(0, 1fr);
  align-items: start;
  gap: 7px 14px;
  padding: 8px 11px;
  border-left: 3px solid var(--orange);
  background: var(--soft-orange);
  font-size: 14px;
}
.history-change + .history-change { margin-top: 5px; }
.history-change dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 13px; margin: 0; }
@media (max-width: 820px) {
  .case-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .case-applications { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .case-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-inline: 11px; }
  .case-applications, .case-progress, .case-history { padding-inline: 11px; }
  .case-app-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .history-change { grid-template-columns: minmax(0, 1fr); }
}
/* 上部の注意書きは、全画面で見える共通領域に置く。 */
.demo-notice { border: 2px solid var(--control); background: #fff; padding: 14px 16px; margin-bottom: 24px; }
.demo-notice p { margin-top: 4px; }
.mast-inner { flex-wrap: wrap; padding-block: 12px; }
button, summary, .view-nav a, .about { min-height: 44px; }
.about { display: inline-flex; align-items: center; }
.filters label { min-width: 0; }
select { min-width: 0; width: 100%; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
footer { flex-wrap: wrap; }
@media (max-width: 560px) {
  .brand { font-size: 16px; letter-spacing: 0; gap: 8px; }
  .mast-inner { gap: 8px 12px; }
  .mast-inner .brand { white-space: normal; }
  .metric-label { overflow-wrap: anywhere; }
}