.brand-assets-app {
  --ba-blue: #1a73e8;
  --ba-blue-dark: #174ea6;
  --ba-blue-soft: #e8f0fe;
  --ba-red: #d93025;
  --ba-red-soft: #fce8e6;
  --ba-green: #188038;
  --ba-green-soft: #e6f4ea;
  --ba-yellow: #f9ab00;
  --ba-yellow-soft: #fef7e0;
  --ba-ink: #202124;
  --ba-muted: #5f6368;
  --ba-subtle: #80868b;
  --ba-line: #dadce0;
  --ba-line-soft: #edf0f2;
  --ba-soft: #f8fafd;
  --ba-paper: #ffffff;
  --ba-hero: linear-gradient(135deg, #ffffff 0%, #f8fbff 72%, #eef5ff 100%);
  --ba-shadow: 0 1px 2px rgba(60, 64, 67, .12), 0 1px 3px 1px rgba(60, 64, 67, .06);
  color: var(--ba-ink);
  display: grid;
  font: 13px/1.55 "Google Sans", Roboto, "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  gap: 16px;
  margin: 0 auto 42px;
  max-width: 1480px;
  min-width: 0;
  width: 100%;
}

.brand-assets-app * { box-sizing: border-box; }

.ba-hero {
  background: var(--ba-hero);
  border: 1px solid var(--ba-line);
  border-radius: 16px 16px 0 0;
  color: var(--ba-ink);
  display: grid;
  gap: 22px;
  overflow: hidden;
  padding: 32px 36px 30px;
  position: relative;
}

.ba-hero::before {
  background: linear-gradient(90deg, #4285f4 0 25%, #ea4335 25% 50%, #fbbc04 50% 75%, #34a853 75% 100%);
  border-radius: 0 0 4px 4px;
  content: "";
  height: 4px;
  left: 36px;
  position: absolute;
  top: 0;
  width: 168px;
}

.ba-hero::after {
  border: 1px solid rgba(26, 115, 232, .11);
  border-radius: 50%;
  content: "";
  height: 260px;
  position: absolute;
  right: -76px;
  top: -144px;
  width: 260px;
}

.ba-hero-copy,
.ba-purpose,
.ba-hero-meter { position: relative; z-index: 1; }

.ba-kicker,
.ba-section-head span,
.ba-panel > header span {
  color: var(--ba-blue);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
}

.ba-hero-copy h2 {
  font-size: 34px;
  font-weight: 600;
  letter-spacing: -.035em;
  line-height: 1.16;
  margin: 8px 0 10px;
}

.ba-hero-copy p {
  color: var(--ba-muted);
  font-size: 14px;
  line-height: 1.75;
  margin: 0;
  max-width: 760px;
}

.ba-hero-values {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  position: relative;
  z-index: 1;
}

.ba-hero-values span {
  background: var(--ba-paper);
  border: 1px solid var(--ba-line);
  border-radius: 999px;
  color: var(--ba-muted);
  font-size: 10px;
  font-weight: 700;
  padding: 7px 11px;
}

.ba-hero-values span:first-child {
  background: var(--ba-blue-soft);
  border-color: #aecbfa;
  color: var(--ba-blue-dark);
}

.ba-purpose {
  align-items: stretch;
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr auto 1fr auto 1fr;
}

.ba-purpose article {
  background: var(--ba-paper);
  border: 1px solid var(--ba-line);
  border-radius: 12px;
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 17px 18px;
}

.ba-purpose article:nth-of-type(1) { border-top: 3px solid #4285f4; }
.ba-purpose article:nth-of-type(2) { border-top: 3px solid #34a853; }
.ba-purpose article:nth-of-type(3) { border-top: 3px solid #fbbc04; }

.ba-purpose article small {
  color: var(--ba-blue);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
}

.ba-purpose article:nth-of-type(2) small { color: var(--ba-green); }
.ba-purpose article:nth-of-type(3) small { color: #b06000; }

.ba-purpose article strong {
  font-size: 17px;
  font-weight: 650;
  letter-spacing: -.015em;
}

.ba-purpose article span { color: var(--ba-muted); font-size: 10px; }
.ba-purpose > i { align-self: center; color: #9aa0a6; font-style: normal; }
.ba-hero-meter { display: grid; gap: 8px; }
.ba-hero-meter > div:first-child { align-items: end; display: flex; justify-content: space-between; }
.ba-hero-meter span,
.ba-hero-meter small { color: var(--ba-muted); font-size: 10px; }
.ba-hero-meter strong { color: var(--ba-blue-dark); font-size: 20px; }
.ba-meter { background: #e8eaed; border-radius: 999px; height: 6px; overflow: hidden; }
.ba-meter i { background: var(--ba-blue); border-radius: inherit; display: block; height: 100%; }

.ba-tabs {
  background: var(--ba-paper);
  border: 1px solid var(--ba-line);
  border-radius: 0 0 12px 12px;
  display: flex;
  gap: 4px;
  margin-top: -16px;
  overflow-x: auto;
  padding: 8px 12px;
}

.ba-tabs button,
.ba-filter-row button,
.ba-archive-toolbar > div button {
  background: transparent;
  border: 0;
  border-radius: 9px;
  color: var(--ba-muted);
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 750;
  padding: 9px 14px;
  white-space: nowrap;
}

.ba-tabs button:hover,
.ba-filter-row button:hover,
.ba-archive-toolbar > div button:hover,
.ba-tabs button.active,
.ba-filter-row button.active,
.ba-archive-toolbar > div button.active {
  background: var(--ba-blue-soft);
  color: var(--ba-blue-dark);
}

.ba-overview,
.ba-brand-core,
.ba-identity-page,
.ba-culture-page,
.ba-expression-page,
.ba-timeline-page,
.ba-archive-page,
.ba-experience-page,
.ba-direction-page {
  display: grid;
  gap: 16px;
  min-width: 0;
  width: 100%;
}

.ba-section-head {
  align-items: end;
  display: flex;
  gap: 24px;
  justify-content: space-between;
  padding: 6px 2px 2px;
}

.ba-section-head[data-ba-section-header] {
  justify-self: stretch;
  min-width: 0;
  width: 100%;
}

.ba-section-head > div:first-child { display: grid; gap: 4px; }
.ba-section-head h3 { font-size: 20px; letter-spacing: -.02em; margin: 0; }
.ba-section-head p { color: var(--ba-muted); font-size: 11px; line-height: 1.7; margin: 0; max-width: 560px; text-align: right; }
.ba-section-head.compact { align-items: center; padding: 0; }
.ba-section-head.compact h3 { font-size: 17px; }

.ba-culture-article {
  background: var(--ba-paper);
  border: 1px solid var(--ba-line);
  border-radius: 14px;
  box-shadow: var(--ba-shadow);
  display: grid;
  gap: 30px;
  padding: 30px;
}

.ba-culture-article > section { display: grid; gap: 12px; }
.ba-culture-article > section + section { border-top: 1px solid var(--ba-line-soft); padding-top: 30px; }
.ba-culture-article h4 { font-size: 22px; letter-spacing: -.025em; line-height: 1.35; margin: 0 0 4px; }
.ba-culture-article h5 { color: var(--ba-blue-dark); font-size: 15px; letter-spacing: -.01em; line-height: 1.5; margin: 16px 0 0; }
.ba-culture-article p { color: var(--ba-muted); font-size: 12px; line-height: 1.9; margin: 0; }
.ba-culture-article li { color: var(--ba-muted); font-size: 12px; line-height: 1.8; padding-left: 3px; }
.ba-culture-article ul,
.ba-culture-article ol { display: grid; gap: 5px; margin: 0; padding-left: 22px; }
.ba-culture-article a { color: var(--ba-blue); font-weight: 700; text-decoration: none; }
.ba-culture-article a:hover { text-decoration: underline; }
.ba-culture-article blockquote {
  background: var(--ba-blue-soft);
  border-left: 4px solid var(--ba-blue);
  border-radius: 4px 11px 11px 4px;
  margin: 2px 0;
  padding: 16px 18px;
}
.ba-culture-article blockquote p { color: var(--ba-blue-dark); font-size: 14px; font-weight: 650; line-height: 1.75; }
.ba-culture-table-wrap { border: 1px solid var(--ba-line); border-radius: 11px; overflow-x: auto; }
.ba-culture-table-wrap table { border-collapse: collapse; min-width: 720px; width: 100%; }
.ba-culture-table-wrap th,
.ba-culture-table-wrap td { border-bottom: 1px solid var(--ba-line-soft); font-size: 11px; line-height: 1.7; padding: 13px 14px; text-align: left; vertical-align: top; }
.ba-culture-table-wrap th { background: var(--ba-blue-soft); color: var(--ba-blue-dark); font-size: 10px; font-weight: 800; letter-spacing: .03em; }
.ba-culture-table-wrap td { color: var(--ba-muted); }
.ba-culture-table-wrap tbody tr:last-child td { border-bottom: 0; }
.ba-culture-table-wrap tbody tr:last-child { background: var(--ba-soft); }
.ba-culture-chain { align-items: center; background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 11px; display: flex; flex-wrap: wrap; gap: 7px; padding: 14px; }
.ba-culture-chain span,
.ba-culture-chain strong { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 999px; color: var(--ba-muted); font-size: 10px; padding: 7px 10px; }
.ba-culture-chain strong { background: var(--ba-blue-soft); border-color: #aecbfa; color: var(--ba-blue-dark); }
.ba-culture-chain i { color: var(--ba-subtle); font-style: normal; }
.ba-culture-hypotheses { counter-reset: culture-hypothesis; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; padding: 0 !important; }
.ba-culture-hypotheses li { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 11px; display: grid; gap: 5px; padding: 15px; }
.ba-culture-hypotheses li::before { align-items: center; background: var(--ba-blue-soft); border-radius: 50%; color: var(--ba-blue-dark); content: counter(culture-hypothesis, decimal-leading-zero); counter-increment: culture-hypothesis; display: flex; font-size: 8px; font-weight: 800; height: 25px; justify-content: center; width: 25px; }
.ba-culture-hypotheses strong { color: var(--ba-ink); font-size: 13px; }
.ba-culture-hypotheses p { font-size: 10px; }
.ba-culture-criteria { grid-template-columns: repeat(5, minmax(0, 1fr)); list-style: none; padding: 0 !important; }
.ba-culture-criteria li { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 9px; display: grid; gap: 4px; padding: 12px; }
.ba-culture-criteria strong { color: var(--ba-blue-dark); }
.ba-culture-conclusion { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 12px; padding: 22px; }

.ba-strategy-basis {
  background: var(--ba-paper);
  border: 1px solid var(--ba-line);
  border-radius: 14px;
  display: grid;
  gap: 18px;
  padding: 21px;
}

.ba-strategy-basis-grid { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ba-strategy-basis-grid article { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 11px; display: grid; gap: 7px; min-height: 174px; padding: 16px; }
.ba-strategy-basis-grid article:nth-child(1) { border-top: 3px solid #4285f4; }
.ba-strategy-basis-grid article:nth-child(2) { border-top: 3px solid #34a853; }
.ba-strategy-basis-grid article:nth-child(3) { border-top: 3px solid #fbbc04; }
.ba-strategy-basis-grid header { align-items: center; display: flex; gap: 8px; }
.ba-strategy-basis-grid header i { align-items: center; background: var(--ba-blue-soft); border-radius: 50%; color: var(--ba-blue-dark); display: flex; font-size: 8px; font-style: normal; font-weight: 800; height: 24px; justify-content: center; width: 24px; }
.ba-strategy-basis-grid article:nth-child(2) header i { background: var(--ba-green-soft); color: var(--ba-green); }
.ba-strategy-basis-grid article:nth-child(3) header i { background: var(--ba-yellow-soft); color: #7a4d00; }
.ba-strategy-basis-grid header span { color: var(--ba-muted); font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.ba-strategy-basis-grid small { color: var(--ba-blue); font-size: 9px; font-weight: 800; margin-top: 3px; }
.ba-strategy-basis-grid h4 { font-size: 14px; letter-spacing: -.01em; line-height: 1.65; margin: 0; }
.ba-strategy-basis-grid p { border-top: 1px solid var(--ba-line-soft); color: var(--ba-muted); font-size: 9px; line-height: 1.65; margin: auto 0 0; padding-top: 10px; }

.ba-positioning-clarity {
  background: var(--ba-paper);
  border: 1px solid var(--ba-line);
  border-radius: 14px;
  display: grid;
  gap: 14px;
  padding: 21px;
}

.ba-positioning-clarity > .ba-section-head > b { background: var(--ba-blue-soft); border-radius: 999px; color: var(--ba-blue-dark); font-size: 9px; padding: 6px 10px; white-space: nowrap; }
.ba-positioning-verdict { align-items: start; background: var(--ba-blue-soft); border: 1px solid #aecbfa; border-radius: 11px; display: grid; gap: 7px; grid-template-columns: auto minmax(0, 1fr); padding: 15px 17px; }
.ba-positioning-verdict > span { background: var(--ba-blue); border-radius: 999px; color: #fff; font-size: 8px; font-weight: 800; padding: 5px 8px; }
.ba-positioning-verdict strong { align-self: center; color: var(--ba-blue-dark); font-size: 13px; line-height: 1.65; }
.ba-positioning-verdict p { color: var(--ba-muted); font-size: 9px; grid-column: 2; line-height: 1.65; margin: 0; }
.ba-positioning-reasons { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ba-positioning-reasons article { border: 1px solid var(--ba-line-soft); border-radius: 11px; overflow: hidden; }
.ba-positioning-reasons header { background: var(--ba-soft); border-bottom: 1px solid var(--ba-line-soft); display: grid; gap: 3px; padding: 13px 15px; }
.ba-positioning-reasons header span { color: var(--ba-green); font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.ba-positioning-reasons .is-cannot header span { color: var(--ba-red); }
.ba-positioning-reasons h4 { font-size: 12px; margin: 0; }
.ba-positioning-reasons ul { display: grid; gap: 10px; list-style: none; margin: 0; padding: 15px; }
.ba-positioning-reasons li { color: var(--ba-muted); font-size: 9px; line-height: 1.65; padding-left: 16px; position: relative; }
.ba-positioning-reasons li::before { align-items: center; background: var(--ba-green-soft); border-radius: 50%; color: var(--ba-green); content: "✓"; display: flex; font-size: 7px; font-weight: 900; height: 12px; justify-content: center; left: 0; position: absolute; top: 2px; width: 12px; }
.ba-positioning-reasons .is-cannot li::before { background: var(--ba-red-soft); color: var(--ba-red); content: "!"; }
.ba-positioning-layers { display: grid; gap: 9px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ba-positioning-layers article { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 10px; display: grid; gap: 5px; padding: 14px; }
.ba-positioning-layers i { align-items: center; background: var(--ba-blue-soft); border-radius: 50%; color: var(--ba-blue-dark); display: flex; font-size: 8px; font-style: normal; font-weight: 800; height: 24px; justify-content: center; width: 24px; }
.ba-positioning-layers span { color: var(--ba-blue); font-size: 8px; font-weight: 800; letter-spacing: .09em; }
.ba-positioning-layers small { color: var(--ba-muted); font-size: 8px; font-weight: 750; }
.ba-positioning-layers p { font-size: 10px; font-weight: 600; line-height: 1.65; margin: 2px 0 0; }
.ba-positioning-clarity blockquote { align-items: center; background: var(--ba-blue-soft); border-left: 4px solid var(--ba-blue); border-radius: 4px 10px 10px 4px; display: grid; gap: 4px; margin: 0; padding: 13px 15px; }
.ba-positioning-clarity blockquote span { color: var(--ba-blue); font-size: 8px; font-weight: 800; letter-spacing: .09em; }
.ba-positioning-clarity blockquote p { color: var(--ba-blue-dark); font-size: 12px; font-weight: 650; line-height: 1.65; margin: 0; }

.ba-identity-vm { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ba-identity-statement { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; display: grid; gap: 10px; overflow: hidden; padding: 24px; position: relative; }
.ba-identity-statement::before { background: #4285f4; content: ""; inset: 0 auto 0 0; position: absolute; width: 4px; }
.ba-identity-statement.is-mission::before { background: #34a853; }
.ba-identity-statement > header { align-items: center; display: flex; justify-content: space-between; }
.ba-identity-statement > header span { color: var(--ba-blue); font-size: 9px; font-weight: 800; letter-spacing: .14em; }
.ba-identity-statement.is-mission > header span { color: var(--ba-green); }
.ba-identity-statement > header b { background: var(--ba-blue-soft); border-radius: 999px; color: var(--ba-blue-dark); font-size: 9px; padding: 5px 9px; }
.ba-identity-statement.is-mission > header b { background: var(--ba-green-soft); color: var(--ba-green); }
.ba-identity-statement > small { color: var(--ba-muted); font-size: 9px; font-weight: 700; }
.ba-identity-statement h4 { font-size: 19px; letter-spacing: -.02em; line-height: 1.65; margin: 2px 0 4px; }
.ba-identity-statement p { border-top: 1px solid var(--ba-line-soft); color: var(--ba-muted); font-size: 10px; line-height: 1.75; margin: 0; padding-top: 13px; }

.ba-values-system { display: grid; gap: 14px; }
.ba-value-list { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; overflow: hidden; }
.ba-value-list > article { align-items: stretch; border-top: 1px solid var(--ba-line); display: grid; grid-template-columns: 170px repeat(3, minmax(0, 1fr)); }
.ba-value-list > article:first-child { border-top: 0; }
.ba-value-list > article > div { display: grid; gap: 6px; padding: 16px 18px; }
.ba-value-list > article > div + div { border-left: 1px solid var(--ba-line-soft); }
.ba-value-list > article > div > span { color: var(--ba-blue); font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.ba-value-list > article > div > p { color: var(--ba-muted); font-size: 9px; line-height: 1.65; margin: 0; }
.ba-value-title { align-items: center; background: var(--ba-soft); grid-template-columns: 34px 1fr; }
.ba-value-title i { align-items: center; background: var(--ba-blue-soft); border-radius: 50%; color: var(--ba-blue-dark); display: flex; font-size: 9px; font-style: normal; font-weight: 800; height: 30px; justify-content: center; width: 30px; }
.ba-value-title > div { display: grid; gap: 3px; }
.ba-value-title span { color: var(--ba-muted); font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.ba-value-title h4 { font-size: 12px; margin: 0; }
.ba-value-list .is-boundary { background: var(--ba-red-soft); }
.ba-value-list .is-boundary > span { color: var(--ba-red); }
.ba-value-list .is-boundary > p { color: #7f302b; }

.ba-decision-use { display: grid; gap: 18px; }
.ba-decision-use > div:last-child { display: grid; gap: 9px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ba-decision-use article { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 10px; display: grid; gap: 6px; padding: 14px; }
.ba-decision-use article i { color: var(--ba-blue); font-size: 9px; font-style: normal; font-weight: 800; }
.ba-decision-use article strong { font-size: 11px; }
.ba-decision-use article p { color: var(--ba-muted); font-size: 9px; line-height: 1.65; margin: 0; }

.ba-vm-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ba-vm-card { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; display: grid; gap: 8px; min-height: 180px; overflow: hidden; padding: 24px; position: relative; }
.ba-vm-card::before { background: #4285f4; content: ""; inset: 0 auto 0 0; position: absolute; width: 4px; }
.ba-vm-card.is-mission::before { background: #34a853; }
.ba-vm-card > span { color: var(--ba-blue); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.ba-vm-card.is-mission > span { color: var(--ba-green); }
.ba-vm-card h4 { font-size: 13px; margin: 2px 0 0; }
.ba-vm-card p { font-size: 17px; font-weight: 600; letter-spacing: -.015em; line-height: 1.7; margin: auto 0 0; max-width: 620px; }

.ba-values { display: grid; gap: 18px; }
.ba-values-grid { display: grid; gap: 9px; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ba-values-grid article { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 10px; display: grid; gap: 7px; min-height: 146px; padding: 14px; }
.ba-values-grid i { color: var(--ba-blue); font-size: 9px; font-style: normal; font-weight: 800; }
.ba-values-grid strong { font-size: 11px; }
.ba-values-grid p { color: var(--ba-muted); font-size: 9px; line-height: 1.65; margin: 0; }
.ba-values-grid article:nth-child(2) i { color: var(--ba-green); }
.ba-values-grid article:nth-child(3) i { color: #b06000; }
.ba-values-grid article:nth-child(4) i { color: var(--ba-red); }

.ba-manifesto {
  background: var(--ba-paper);
  border: 1px solid var(--ba-line);
  border-radius: 14px;
  overflow: hidden;
}

.ba-manifesto > header {
  align-items: center;
  background: var(--ba-soft);
  border-bottom: 1px solid var(--ba-line);
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 18px 22px;
}

.ba-manifesto > header div { display: grid; gap: 4px; }
.ba-manifesto > header span { color: var(--ba-blue); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.ba-manifesto > header h4 { font-size: 17px; margin: 0; }
.ba-manifesto > header b { background: var(--ba-blue-soft); border-radius: 999px; color: var(--ba-blue-dark); font-size: 10px; padding: 6px 10px; }

.ba-manifesto-copy { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ba-manifesto-copy article { display: grid; gap: 14px; grid-template-columns: 34px minmax(0, 1fr); min-height: 168px; padding: 26px 28px; }
.ba-manifesto-copy article:nth-child(even) { border-left: 1px solid var(--ba-line); }
.ba-manifesto-copy article:nth-child(n+3) { border-top: 1px solid var(--ba-line); }
.ba-manifesto-index { align-items: center; background: var(--ba-blue-soft); border-radius: 10px; color: var(--ba-blue-dark); display: flex; font-size: 10px; font-weight: 800; height: 34px; justify-content: center; width: 34px; }
.ba-manifesto-copy article:nth-child(2) .ba-manifesto-index { background: var(--ba-green-soft); color: var(--ba-green); }
.ba-manifesto-copy article:nth-child(3) .ba-manifesto-index { background: var(--ba-yellow-soft); color: #7a4d00; }
.ba-manifesto-copy article:nth-child(4) .ba-manifesto-index { background: var(--ba-red-soft); color: var(--ba-red); }
.ba-manifesto-copy article > div { display: grid; gap: 8px; }
.ba-manifesto-copy small { color: var(--ba-muted); font-size: 10px; font-weight: 750; }
.ba-manifesto-copy p { font-size: 16px; font-weight: 550; letter-spacing: -.01em; line-height: 1.75; margin: 0; }
.ba-manifesto > footer { align-items: center; background: var(--ba-soft); border-top: 1px solid var(--ba-line); display: flex; flex-wrap: wrap; gap: 7px; padding: 13px 22px; }
.ba-manifesto > footer strong { font-size: 10px; margin-right: 5px; }
.ba-manifesto > footer span { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 999px; color: var(--ba-muted); font-size: 9px; padding: 5px 9px; }

.ba-core-grid { display: grid; gap: 16px; grid-template-columns: 1.15fr .85fr; }
.ba-commitments > div { display: grid; }
.ba-commitments article { align-items: start; border-top: 1px solid var(--ba-line-soft); display: grid; gap: 12px; grid-template-columns: 34px minmax(0, 1fr); padding: 15px 0; }
.ba-commitments article:first-child { border-top: 0; padding-top: 0; }
.ba-commitments article:last-child { padding-bottom: 0; }
.ba-commitments article i { align-items: center; background: var(--ba-blue-soft); border-radius: 50%; color: var(--ba-blue-dark); display: flex; font-size: 9px; font-style: normal; font-weight: 800; height: 30px; justify-content: center; width: 30px; }
.ba-commitments article div { display: grid; gap: 4px; }
.ba-commitments article strong { font-size: 12px; }
.ba-commitments article p { color: var(--ba-muted); font-size: 10px; line-height: 1.65; margin: 0; }

.ba-language-grid { display: grid; gap: 12px; }
.ba-language-grid section { border: 1px solid var(--ba-line-soft); border-radius: 10px; display: grid; gap: 9px; padding: 13px; }
.ba-language-grid section > span { font-size: 9px; font-weight: 800; }
.ba-language-grid section > div { display: flex; flex-wrap: wrap; gap: 6px; }
.ba-language-grid b { border-radius: 999px; font-size: 9px; font-weight: 700; padding: 5px 8px; }
.ba-language-grid .is-use { background: var(--ba-green-soft); }
.ba-language-grid .is-use > span { color: #137333; }
.ba-language-grid .is-use b { background: var(--ba-paper); color: #137333; }
.ba-language-grid .is-avoid { background: var(--ba-red-soft); }
.ba-language-grid .is-avoid > span { color: var(--ba-red); }
.ba-language-grid .is-avoid b { background: var(--ba-paper); color: var(--ba-red); text-decoration: line-through; text-decoration-color: rgba(217, 48, 37, .4); }
.ba-language-panel > p { background: var(--ba-yellow-soft); border-left: 3px solid var(--ba-yellow); border-radius: 4px 9px 9px 4px; color: #5f4b16; font-size: 10px; line-height: 1.65; margin: 14px 0 0; padding: 11px 12px; }

.ba-standard-check { display: grid; gap: 18px; }
.ba-standard-grid { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ba-standard-grid article { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 10px; display: grid; gap: 6px; padding: 15px; }
.ba-standard-grid i { color: var(--ba-blue); font-size: 9px; font-style: normal; font-weight: 800; }
.ba-standard-grid strong { font-size: 11px; }
.ba-standard-grid p { color: var(--ba-muted); font-size: 9px; line-height: 1.65; margin: 0; }

.ba-kpis { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ba-kpis article { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; display: grid; gap: 4px; padding: 17px 18px; }
.ba-kpis article span { color: var(--ba-muted); font-size: 10px; font-weight: 700; }
.ba-kpis article strong { color: var(--ba-blue-dark); font-size: 27px; line-height: 1.2; }
.ba-kpis article small { color: var(--ba-subtle); font-size: 9px; }
.ba-kpis article.warn { background: var(--ba-red-soft); border-color: #f6aea8; }
.ba-kpis article.warn strong { color: var(--ba-red); }

.ba-overview-grid,
.ba-future-grid { display: grid; gap: 16px; grid-template-columns: 1.5fr 1fr; }
.ba-panel { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; padding: 21px; }
.ba-panel > header { align-items: center; display: flex; gap: 12px; justify-content: space-between; margin-bottom: 16px; }
.ba-panel > header div { display: grid; gap: 4px; }
.ba-panel > header h4 { font-size: 15px; margin: 0; }
.ba-panel > header b { align-items: center; background: var(--ba-blue-soft); border-radius: 999px; color: var(--ba-blue-dark); display: flex; font-size: 11px; height: 32px; justify-content: center; min-width: 32px; padding: 0 9px; }
.ba-link { background: transparent; border: 0; color: #1967d2; cursor: pointer; font: inherit; font-size: 10px; font-weight: 750; }
.ba-link:hover { color: var(--ba-blue-dark); text-decoration: underline; }

.ba-family-grid { display: grid; gap: 9px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ba-family-grid button { align-items: center; background: var(--ba-soft); border: 1px solid transparent; border-radius: 10px; color: var(--ba-ink); cursor: pointer; display: grid; grid-template-columns: auto 1fr auto; padding: 14px; text-align: left; }
.ba-family-grid button:hover { background: var(--ba-blue-soft); border-color: #aecbfa; }
.ba-family-grid i { align-items: center; background: var(--ba-blue-soft); border-radius: 50%; color: var(--ba-blue-dark); display: flex; font-size: 8px; font-style: normal; height: 26px; justify-content: center; margin-right: 10px; width: 26px; }
.ba-family-grid strong { font-size: 11px; }
.ba-family-grid span { color: var(--ba-muted); font-size: 9px; }

.ba-priority-list { display: grid; }
.ba-priority-list button,
.ba-gap-board > div > button { align-items: start; background: transparent; border: 0; border-top: 1px solid var(--ba-line-soft); color: var(--ba-ink); cursor: pointer; display: grid; gap: 10px; grid-template-columns: 48px 1fr auto; padding: 13px 0; text-align: left; }
.ba-priority-list button:first-child,
.ba-gap-board > div > button:first-child { border-top: 0; padding-top: 2px; }
.ba-priority-list button > span,
.ba-gap-board button > span { color: var(--ba-blue); font-size: 9px; font-weight: 800; }
.ba-priority-list button div { display: grid; gap: 4px; }
.ba-priority-list strong,
.ba-gap-board button strong { font-size: 10px; }
.ba-priority-list small,
.ba-gap-board button small { color: var(--ba-muted); font-size: 9px; line-height: 1.5; }
.ba-priority-list button > i { color: var(--ba-blue); font-style: normal; }

.ba-method { display: grid; gap: 18px; }
.ba-principles { display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ba-principles article { border-left: 3px solid #aecbfa; display: grid; gap: 5px; padding: 4px 14px; }
.ba-principles i { color: var(--ba-blue); font-size: 9px; font-style: normal; }
.ba-principles strong { font-size: 11px; }
.ba-principles p { color: var(--ba-muted); font-size: 9px; line-height: 1.55; margin: 0; }
.ba-method > footer { align-items: center; background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 10px; display: flex; gap: 10px; padding: 12px 16px; }
.ba-method > footer strong { font-size: 10px; margin-right: auto; }
.ba-method > footer span { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 999px; color: var(--ba-muted); font-size: 9px; padding: 5px 9px; }
.ba-method > footer i { color: #9aa0a6; font-size: 9px; font-style: normal; }

.ba-filter-row { display: flex; gap: 5px; overflow-x: auto; }
.ba-filter-row button { background: var(--ba-paper); border: 1px solid var(--ba-line); }
.ba-filter-row button.active { border-color: #aecbfa; }
.ba-timeline { display: grid; padding: 8px 0; }
.ba-timeline-item { display: grid; grid-template-columns: 125px 24px 1fr; position: relative; }
.ba-timeline-item::before { background: var(--ba-line); bottom: -1px; content: ""; left: 136px; position: absolute; top: 0; width: 1px; }
.ba-timeline-item:first-child::before { top: 22px; }
.ba-timeline-item:last-child::before { bottom: calc(100% - 22px); }
.ba-time { display: grid; gap: 3px; padding: 16px 14px 0 0; text-align: right; }
.ba-time strong { color: var(--ba-blue-dark); font-size: 16px; }
.ba-time span { color: var(--ba-muted); font-size: 9px; }
.ba-dot { background: var(--ba-blue); border: 5px solid var(--ba-paper); border-radius: 50%; height: 11px; margin: 18px auto 0; position: relative; width: 11px; z-index: 1; }
.ba-timeline-item.is-gap .ba-dot { background: var(--ba-red); }
.ba-timeline-card { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; color: var(--ba-ink); cursor: pointer; display: grid; gap: 9px; margin: 0 0 12px 14px; padding: 17px 19px; text-align: left; transition: border-color .16s ease, box-shadow .16s ease; }
.ba-timeline-card:hover { border-color: #aecbfa; box-shadow: var(--ba-shadow); }
.ba-timeline-card header,
.ba-archive-card header { align-items: center; display: flex; gap: 12px; justify-content: space-between; }
.ba-timeline-card header > span,
.ba-archive-card header > span { color: var(--ba-blue); font-size: 9px; font-weight: 800; }
.ba-timeline-card header b,
.ba-archive-card header b,
.ba-detail-status b { border-radius: 999px; font-size: 8px; padding: 5px 8px; }
.ba-timeline-card h4,
.ba-archive-card h4 { font-size: 14px; margin: 0; }
.ba-timeline-card p,
.ba-archive-card p { color: var(--ba-muted); font-size: 10px; line-height: 1.65; margin: 0; }
.ba-timeline-card footer { align-items: end; border-top: 1px solid var(--ba-line-soft); display: flex; gap: 20px; justify-content: space-between; padding-top: 10px; }
.ba-timeline-card footer span { color: var(--ba-muted); font-size: 9px; line-height: 1.5; }
.ba-timeline-card footer i,
.ba-archive-card footer i { color: var(--ba-blue); font-size: 9px; font-style: normal; white-space: nowrap; }

.is-good { background: var(--ba-green-soft) !important; color: #137333 !important; }
.is-progress { background: var(--ba-blue-soft) !important; color: var(--ba-blue-dark) !important; }
.is-gap { background: var(--ba-red-soft) !important; color: var(--ba-red) !important; }

.ba-head-actions { display: flex; gap: 8px; }
.ba-button { background: var(--ba-blue); border: 1px solid var(--ba-blue); border-radius: 9px; color: #ffffff; cursor: pointer; font: inherit; font-size: 10px; font-weight: 750; min-height: 36px; padding: 8px 14px; }
.ba-button:hover { background: #185abc; border-color: #185abc; box-shadow: 0 1px 2px rgba(60, 64, 67, .3); }
.ba-button.secondary { background: var(--ba-paper); border-color: var(--ba-line); color: #1967d2; }
.ba-button.secondary:hover { background: var(--ba-blue-soft); border-color: #aecbfa; box-shadow: none; }
.ba-button.danger { background: var(--ba-paper); border-color: #f6aea8; color: var(--ba-red); }

.ba-archive-toolbar { align-items: center; background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; display: grid; gap: 12px; grid-template-columns: minmax(260px, .7fr) 1.3fr; padding: 10px; }
.ba-archive-toolbar label { align-items: center; background: var(--ba-soft); border: 1px solid transparent; border-radius: 9px; display: flex; gap: 7px; padding: 0 12px; }
.ba-archive-toolbar label:focus-within { background: var(--ba-paper); border-color: var(--ba-blue); }
.ba-archive-toolbar label span { color: var(--ba-muted); }
.ba-archive-toolbar input { background: transparent; border: 0; color: var(--ba-ink); font: inherit; font-size: 10px; min-height: 38px; outline: 0; padding: 9px 0; width: 100%; }
.ba-archive-toolbar > div { display: flex; gap: 3px; justify-content: flex-end; overflow-x: auto; }
.ba-archive-toolbar > div button { padding: 9px 10px; }
.ba-archive-summary { align-items: center; color: var(--ba-muted); display: flex; font-size: 9px; justify-content: space-between; padding: 0 3px; }
.ba-archive-summary span:last-child { align-items: center; display: flex; gap: 6px; }
.ba-archive-summary i { border-radius: 50%; display: inline-block; height: 7px; width: 7px; }
.ba-archive-grid { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ba-archive-card { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; color: var(--ba-ink); cursor: pointer; display: grid; gap: 9px; min-height: 230px; padding: 18px; text-align: left; transition: border-color .16s ease, box-shadow .16s ease; }
.ba-archive-card:hover { border-color: #aecbfa; box-shadow: var(--ba-shadow); }
.ba-card-year { color: var(--ba-blue-dark); font-size: 18px; font-weight: 650; }
.ba-archive-card p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.ba-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: auto; }
.ba-tags span { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 999px; color: var(--ba-muted); font-size: 8px; padding: 4px 7px; }
.ba-archive-card footer { align-items: center; border-top: 1px solid var(--ba-line-soft); display: flex; justify-content: space-between; padding-top: 10px; }
.ba-archive-card footer > span { color: var(--ba-muted); font-size: 8px; }

.ba-strategy-triad { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ba-strategy-triad article { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; display: grid; gap: 5px; padding: 21px; position: relative; }
.ba-strategy-triad article::before { background: #4285f4; border-radius: 14px 14px 0 0; content: ""; height: 3px; inset: -1px -1px auto; position: absolute; }
.ba-strategy-triad article:nth-child(2)::before { background: #34a853; }
.ba-strategy-triad article:nth-child(3)::before { background: #fbbc04; }
.ba-strategy-triad i { color: var(--ba-blue); font-size: 9px; font-style: normal; }
.ba-strategy-triad article:nth-child(2) i { color: var(--ba-green); }
.ba-strategy-triad article:nth-child(3) i { color: #b06000; }
.ba-strategy-triad span { color: var(--ba-muted); font-size: 9px; }
.ba-strategy-triad strong { font-size: 18px; font-weight: 650; }
.ba-strategy-triad p { color: var(--ba-muted); font-size: 10px; line-height: 1.6; margin: 3px 0 0; }

.ba-touchpoints { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; overflow: hidden; }
.ba-touchpoints > article { align-items: center; border-top: 1px solid var(--ba-line-soft); display: grid; gap: 18px; grid-template-columns: 46px 1.3fr 1fr .8fr; padding: 18px 20px; }
.ba-touchpoints > article:first-child { border-top: 0; }
.ba-touchpoints > article:hover { background: var(--ba-soft); }
.ba-touch-index { align-items: center; background: var(--ba-blue-soft); border-radius: 50%; color: var(--ba-blue-dark); display: flex; font-size: 10px; font-weight: 800; height: 32px; justify-content: center; width: 32px; }
.ba-touch-main { display: grid; gap: 7px; }
.ba-touch-main header { align-items: start; display: flex; gap: 12px; justify-content: space-between; }
.ba-touch-main header div { display: grid; gap: 2px; }
.ba-touch-main header span,
.ba-touch-proof span,
.ba-touch-measure span { color: var(--ba-blue); font-size: 8px; font-weight: 800; }
.ba-touch-main h4 { font-size: 12px; margin: 0; }
.ba-touch-main header b { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 999px; color: var(--ba-muted); font-size: 8px; padding: 5px 8px; }
.ba-touch-main p { color: var(--ba-muted); font-size: 9px; line-height: 1.55; margin: 0; }
.ba-touch-proof,
.ba-touch-measure { border-left: 1px solid var(--ba-line); display: grid; gap: 5px; padding-left: 18px; }
.ba-touch-proof strong,
.ba-touch-measure strong { font-size: 9px; line-height: 1.5; }
.ba-touch-proof small { color: var(--ba-muted); font-size: 8px; }

.ba-direction-grid { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ba-direction-grid article { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 14px; display: grid; gap: 8px; min-height: 220px; padding: 19px; }
.ba-direction-grid article:hover { border-color: #aecbfa; box-shadow: var(--ba-shadow); }
.ba-direction-grid article > i { align-items: center; background: var(--ba-blue-soft); border-radius: 10px; color: var(--ba-blue-dark); display: flex; font-size: 13px; font-style: normal; font-weight: 800; height: 34px; justify-content: center; width: 34px; }
.ba-direction-grid article > span { color: var(--ba-blue); font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.ba-direction-grid h4 { font-size: 13px; line-height: 1.5; margin: 0; }
.ba-direction-grid p { color: var(--ba-muted); font-size: 9px; line-height: 1.65; margin: 0; }
.ba-direction-grid footer { border-top: 1px solid var(--ba-line-soft); color: var(--ba-muted); font-size: 8px; margin-top: auto; padding-top: 10px; }

.ba-sprint ol { display: grid; gap: 4px; list-style: none; margin: 0; padding: 0; }
.ba-sprint li { align-items: start; border-top: 1px solid var(--ba-line-soft); display: grid; gap: 13px; grid-template-columns: 56px 1fr; padding: 12px 0; }
.ba-sprint li:first-child { border-top: 0; padding-top: 0; }
.ba-sprint li > i { color: var(--ba-blue); font-size: 9px; font-style: normal; font-weight: 800; }
.ba-sprint li div { display: grid; gap: 3px; }
.ba-sprint li strong { font-size: 10px; }
.ba-sprint li p,
.ba-gap-board > footer p { color: var(--ba-muted); font-size: 9px; line-height: 1.55; margin: 0; }
.ba-gap-board > div { display: grid; }
.ba-gap-board > div > button { grid-template-columns: 48px 1fr; }
.ba-gap-board > div > button small { grid-column: 2; }
.ba-gap-board > footer { background: var(--ba-yellow-soft); border: 1px solid #f8d77b; border-radius: 10px; display: grid; gap: 4px; margin-top: 14px; padding: 13px; }
.ba-gap-board > footer strong { color: #7a4d00; font-size: 9px; }
.ba-empty { color: var(--ba-muted); font-size: 10px; padding: 28px; text-align: center; }

.ba-modal-backdrop { align-items: center; background: rgba(32, 33, 36, .48); display: flex; inset: 0; justify-content: center; padding: 24px; position: fixed; z-index: 1200; }
.ba-modal { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 16px; box-shadow: 0 12px 44px rgba(32, 33, 36, .28); max-height: 90vh; overflow: auto; width: min(820px, 100%); }
.ba-modal > header { align-items: start; border-bottom: 1px solid var(--ba-line); display: flex; gap: 16px; justify-content: space-between; padding: 20px 22px; }
.ba-modal > header div { display: grid; gap: 4px; }
.ba-modal > header span { color: var(--ba-blue); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.ba-modal > header h3 { font-size: 19px; margin: 0; }
.ba-modal > header > button { background: transparent; border: 0; border-radius: 50%; color: var(--ba-muted); cursor: pointer; font-size: 22px; height: 34px; width: 34px; }
.ba-modal > header > button:hover { background: var(--ba-soft); }
.ba-detail-modal { padding-bottom: 20px; }
.ba-detail-status { display: flex; flex-wrap: wrap; gap: 7px; padding: 18px 24px 0; }
.ba-detail-status span { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 999px; color: var(--ba-muted); font-size: 8px; padding: 5px 8px; }
.ba-detail-lead { display: grid; gap: 6px; padding: 20px 24px; }
.ba-detail-lead span,
.ba-detail-grid span,
.ba-record-sheet span,
.ba-next-action span { color: var(--ba-blue); font-size: 8px; font-weight: 800; }
.ba-detail-lead p { font-size: 16px; line-height: 1.7; margin: 0; }
.ba-detail-grid { display: grid; gap: 10px; grid-template-columns: 1fr 1fr; padding: 0 24px 18px; }
.ba-detail-grid article { background: var(--ba-soft); border: 1px solid var(--ba-line-soft); border-radius: 10px; display: grid; gap: 6px; padding: 14px; }
.ba-detail-grid p { font-size: 10px; line-height: 1.65; margin: 0; }
.ba-record-sheet { border-bottom: 1px solid var(--ba-line); border-top: 1px solid var(--ba-line); display: grid; grid-template-columns: 1fr 1fr; margin: 0 24px; }
.ba-record-sheet div { display: grid; gap: 4px; padding: 13px 10px; }
.ba-record-sheet div:nth-child(even) { border-left: 1px solid var(--ba-line); }
.ba-record-sheet div:nth-child(n+3) { border-top: 1px solid var(--ba-line); }
.ba-record-sheet strong { font-size: 9px; font-weight: 600; line-height: 1.5; }
.ba-next-action { background: var(--ba-yellow-soft); border: 1px solid #f8d77b; border-radius: 10px; display: grid; gap: 5px; margin: 18px 24px; padding: 13px; }
.ba-next-action span { color: #7a4d00; }
.ba-next-action strong { font-size: 10px; line-height: 1.55; }
.ba-detail-modal > footer { align-items: center; display: flex; justify-content: space-between; padding: 0 24px; }
.ba-detail-modal > footer > div { display: flex; gap: 8px; }
.ba-form-modal form { display: grid; }
.ba-form-grid { display: grid; gap: 13px; grid-template-columns: 1fr 1fr; padding: 20px 24px; }
.ba-form-grid label { display: grid; gap: 6px; }
.ba-form-grid label.wide { grid-column: 1 / -1; }
.ba-form-grid label > span { color: var(--ba-muted); font-size: 9px; font-weight: 700; }
.ba-form-grid input,
.ba-form-grid select,
.ba-form-grid textarea { background: var(--ba-paper); border: 1px solid var(--ba-line); border-radius: 8px; color: var(--ba-ink); font: inherit; font-size: 10px; padding: 10px 11px; }
.ba-form-grid input:focus,
.ba-form-grid select:focus,
.ba-form-grid textarea:focus { border-color: var(--ba-blue); box-shadow: 0 0 0 1px var(--ba-blue); outline: 0; }
.ba-form-grid textarea { line-height: 1.55; min-height: 70px; resize: vertical; }
.ba-form-modal form > footer { background: var(--ba-soft); border-top: 1px solid var(--ba-line); display: flex; gap: 8px; justify-content: flex-end; padding: 15px 24px; }

.brand-assets-app button:focus-visible,
.brand-assets-app input:focus-visible,
.brand-assets-app select:focus-visible,
.brand-assets-app textarea:focus-visible { outline: 2px solid #8ab4f8; outline-offset: 2px; }

body[data-theme="dark"] .brand-assets-app,
body[data-palette="midnight"] .brand-assets-app {
  --ba-ink: #e8eaed;
  --ba-muted: #bdc1c6;
  --ba-subtle: #9aa0a6;
  --ba-line: #3c4043;
  --ba-line-soft: #303134;
  --ba-soft: #292a2d;
  --ba-paper: #202124;
  --ba-blue-soft: #263c5e;
  --ba-green-soft: #193c27;
  --ba-red-soft: #4b2524;
  --ba-yellow-soft: #473b1d;
  --ba-hero: linear-gradient(135deg, #202124 0%, #23272f 100%);
}

body[data-theme="dark"] .ba-meter,
body[data-palette="midnight"] .ba-meter { background: #3c4043; }
body[data-theme="dark"] .ba-purpose article:nth-of-type(3) small,
body[data-theme="dark"] .ba-gap-board > footer strong,
body[data-theme="dark"] .ba-next-action span,
body[data-palette="midnight"] .ba-purpose article:nth-of-type(3) small,
body[data-palette="midnight"] .ba-gap-board > footer strong,
body[data-palette="midnight"] .ba-next-action span { color: #fdd663; }
body[data-theme="dark"] .ba-language-panel > p,
body[data-palette="midnight"] .ba-language-panel > p { color: #fdd663; }

@media (max-width: 1050px) {
  .ba-overview-grid,
  .ba-future-grid,
  .ba-core-grid { grid-template-columns: 1fr; }
  .ba-direction-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ba-archive-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ba-touchpoints > article { grid-template-columns: 38px 1fr 1fr; }
  .ba-touch-measure { grid-column: 2 / -1; }
  .ba-values-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ba-value-list > article { grid-template-columns: 170px repeat(2, minmax(0, 1fr)); }
  .ba-value-list > article .is-boundary { border-left: 0; border-top: 1px solid var(--ba-line-soft); grid-column: 2 / -1; }
  .ba-decision-use > div:last-child { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ba-strategy-basis-grid { grid-template-columns: 1fr; }
  .ba-strategy-basis-grid article { min-height: 0; }
  .ba-positioning-layers { grid-template-columns: 1fr; }
  .ba-culture-criteria { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .brand-assets-app { gap: 12px; }
  .ba-hero { border-radius: 14px 14px 0 0; padding: 26px 18px 22px; }
  .ba-hero::before { left: 18px; }
  .ba-hero-copy h2 { font-size: 27px; }
  .ba-purpose { grid-template-columns: 1fr; }
  .ba-purpose > i { display: none; }
  .ba-tabs { margin-top: -12px; }
  .ba-kpis,
  .ba-strategy-triad { grid-template-columns: 1fr 1fr; }
  .ba-manifesto-copy { grid-template-columns: 1fr; }
  .ba-manifesto-copy article { min-height: 0; padding: 20px 18px; }
  .ba-manifesto-copy article:nth-child(even) { border-left: 0; }
  .ba-manifesto-copy article:nth-child(n+2) { border-top: 1px solid var(--ba-line); }
  .ba-standard-grid { grid-template-columns: 1fr; }
  .ba-vm-grid { grid-template-columns: 1fr; }
  .ba-vm-card { min-height: 0; }
  .ba-values-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ba-identity-vm { grid-template-columns: 1fr; }
  .ba-value-list > article { grid-template-columns: 1fr; }
  .ba-value-list > article > div + div { border-left: 0; border-top: 1px solid var(--ba-line-soft); }
  .ba-value-list > article .is-boundary { grid-column: auto; }
  .ba-value-title { grid-template-columns: 34px 1fr; }
  .ba-decision-use > div:last-child { grid-template-columns: 1fr; }
  .ba-overview-grid { gap: 12px; }
  .ba-panel { padding: 17px; }
  .ba-family-grid { grid-template-columns: 1fr 1fr; }
  .ba-section-head { align-items: start; display: grid; gap: 8px; }
  .ba-section-head p { text-align: left; }
  .ba-strategy-basis { padding: 17px; }
  .ba-positioning-clarity { padding: 17px; }
  .ba-positioning-clarity > .ba-section-head { grid-template-columns: 1fr; }
  .ba-positioning-clarity > .ba-section-head > b { justify-self: start; }
  .ba-positioning-verdict { grid-template-columns: 1fr; }
  .ba-positioning-verdict p { grid-column: auto; }
  .ba-positioning-reasons { grid-template-columns: 1fr; }
  .ba-culture-article { gap: 24px; padding: 17px; }
  .ba-culture-article > section + section { padding-top: 24px; }
  .ba-culture-article h4 { font-size: 19px; }
  .ba-culture-article blockquote { padding: 14px; }
  .ba-culture-hypotheses,
  .ba-culture-criteria { grid-template-columns: 1fr; }
  .ba-culture-conclusion { padding: 17px; }
  .ba-archive-toolbar { grid-template-columns: 1fr; }
  .ba-archive-toolbar > div { justify-content: flex-start; }
  .ba-archive-grid { grid-template-columns: 1fr; }
  .ba-timeline-item { grid-template-columns: 72px 18px 1fr; }
  .ba-timeline-item::before { left: 80px; }
  .ba-time strong { font-size: 12px; }
  .ba-timeline-card { margin-left: 8px; }
  .ba-touchpoints > article { align-items: start; grid-template-columns: 28px 1fr; }
  .ba-touch-proof,
  .ba-touch-measure { border-left: 0; border-top: 1px solid var(--ba-line); grid-column: 2; padding: 10px 0 0; }
  .ba-direction-grid { grid-template-columns: 1fr; }
  .ba-record-sheet,
  .ba-detail-grid,
  .ba-form-grid { grid-template-columns: 1fr; }
  .ba-record-sheet div:nth-child(even) { border-left: 0; }
  .ba-record-sheet div:nth-child(n+2) { border-top: 1px solid var(--ba-line); }
  .ba-form-grid label.wide { grid-column: auto; }
  .ba-detail-modal > footer { align-items: stretch; flex-direction: column; gap: 8px; }
  .ba-detail-modal > footer > div { display: grid; grid-template-columns: 1fr 1fr; }
  .ba-modal-backdrop { padding: 10px; }
  .ba-modal { max-height: 95vh; }
  .ba-principles { grid-template-columns: 1fr; }
  .ba-method > footer { align-items: flex-start; flex-wrap: wrap; }
  .ba-method > footer strong { flex-basis: 100%; margin-right: 0; }
  .ba-archive-summary { align-items: start; flex-direction: column; gap: 8px; }
}

@media (max-width: 480px) {
  .ba-kpis,
  .ba-strategy-triad,
  .ba-family-grid { grid-template-columns: 1fr; }
  .ba-head-actions { align-items: stretch; display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .ba-section-head:has(.ba-head-actions) { width: 100%; }
  .ba-values-grid { grid-template-columns: 1fr; }
}