:root {
  --appsw-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --appsw-ink: #14233b;
  --appsw-muted: #5d6b7e;
  --appsw-navy: #102a43;
  --appsw-blue: #155e75;
  --appsw-cyan: #0891b2;
  --appsw-cyan-soft: #ecfeff;
  --appsw-border: #d8e1ea;
  --appsw-panel: #ffffff;
  --appsw-bg: #f4f7fa;
  --appsw-focus: #f59e0b;
  --release-green: #166534;
  --release-green-soft: #f0fdf4;
  --comment-amber: #9a5800;
  --comment-amber-soft: #fff8e6;
  --module-violet: #5b3ea6;
  --module-violet-soft: #f5f3ff;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--appsw-bg);
  color: var(--appsw-ink);
  font-family: var(--appsw-font);
  line-height: 1.62;
}

#header,
#content,
#footer {
  box-sizing: border-box;
  max-width: 78rem;
  margin-left: auto;
  margin-right: auto;
}

#header {
  position: relative;
  display: flex;
  min-height: 19rem;
  flex-direction: column;
  justify-content: center;
  margin-top: 1.25rem;
  padding: 2.5rem clamp(24rem, 43vw, 33rem) 2.5rem clamp(1.5rem, 4vw, 3.5rem);
  overflow: hidden;
  color: var(--appsw-navy);
  background:
    radial-gradient(ellipse at 12% 0%, rgba(255, 255, 255, 0.62), transparent 65%),
    linear-gradient(115deg, #e3edf2 0%, #c5e2e6 52%, #65b7c2 100%);
  border-radius: 1.1rem;
  box-shadow: 0 1rem 2.4rem rgba(16, 42, 67, 0.2);
}

#header::after {
  content: "";
  position: absolute;
  top: 50%;
  right: clamp(1.2rem, 3vw, 2.5rem);
  width: min(35vw, 25rem);
  aspect-ratio: 1607 / 979;
  background: url("./images/appsw-itc-logo.png") center / contain no-repeat;
  /* Clip the white surround while preserving the original raster artwork. */
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1607 979'%3E%3Cpath fill='white' d='M220 84H596C639 84 655 88 679 113C696 134 698 138 735 138H1408C1504 138 1554 183 1554 268V698C1554 828 1496 879 1395 879H214C110 879 50 829 50 718V254C50 148 124 84 220 84Z'/%3E%3C/svg%3E");
  mask-size: 100% 100%;
  mask-repeat: no-repeat;
  transform: translateY(-50%);
}

#header h1 {
  max-width: 52rem;
  margin: 0;
  color: var(--appsw-navy);
  font-size: clamp(2rem, 5vw, 3.45rem);
  line-height: 1.08;
  letter-spacing: -0.035em;
}

#header .details {
  margin-top: 1rem;
  color: #355568;
}

#content {
  padding: 1.5rem clamp(0.9rem, 3vw, 2rem) 4rem;
}

a {
  color: #0e6f8a;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.16em;
}

a:hover,
a:focus {
  color: #0b4f66;
}

a:focus-visible {
  outline: 3px solid var(--appsw-focus);
  outline-offset: 3px;
  border-radius: 0.15rem;
}

.lead {
  max-width: 66rem;
  margin: 1.5rem auto;
  color: #263b55;
  font-size: clamp(1.15rem, 2.1vw, 1.45rem);
  line-height: 1.55;
}

.quick-links > .content > .ulist > ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
  margin: 1.5rem 0;
  padding: 0;
  list-style: none;
}

.quick-links li {
  min-height: 5.1rem;
  margin: 0;
  padding: 1rem 1.1rem;
  color: var(--appsw-muted);
  background: var(--appsw-panel);
  border: 1px solid var(--appsw-border);
  border-radius: 0.7rem;
  box-shadow: 0 0.25rem 0.8rem rgba(20, 35, 59, 0.05);
}

.quick-links li:hover {
  border-color: #86c9d8;
  box-shadow: 0 0.5rem 1.15rem rgba(20, 35, 59, 0.09);
  transform: translateY(-1px);
}

.quick-links li a:first-child {
  color: var(--appsw-navy);
  font-size: 1.02rem;
}

#toc {
  margin: 2rem 0 2.7rem;
  padding: 1.2rem 1.4rem;
  background: #fff;
  border: 1px solid var(--appsw-border);
  border-radius: 0.75rem;
}

#toc .title {
  color: var(--appsw-navy);
  font-size: 1.1rem;
  font-weight: 700;
}

#toc ul {
  columns: 2;
  column-gap: 2rem;
}

#toc li {
  break-inside: avoid;
}

.sect1 {
  margin-top: 3.2rem;
}

h2,
h3 {
  color: var(--appsw-navy);
  letter-spacing: -0.018em;
}

h2 {
  padding-bottom: 0.45rem;
  border-bottom: 2px solid #dcecf1;
}

table.tableblock {
  width: 100%;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--appsw-border);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 0.7rem;
  box-shadow: 0 0.2rem 0.7rem rgba(20, 35, 59, 0.04);
}

table.tableblock thead {
  color: #fff;
  background: var(--appsw-navy);
}

table.tableblock th,
table.tableblock td {
  padding: 0.78rem 0.85rem;
  vertical-align: top;
  border-color: var(--appsw-border);
}

table.tableblock tbody tr:nth-child(even) {
  background: #f8fafc;
}

table.release-switchboard {
  display: block;
  margin: 1.6rem 0;
  overflow: visible;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

table.release-switchboard colgroup {
  display: none;
}

table.release-switchboard tbody {
  display: block;
}

table.release-switchboard tr {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

table.release-switchboard td {
  display: block;
  min-height: 12.5rem;
  padding: 1.25rem 1.3rem;
  background: #fff;
  border: 1px solid var(--appsw-border);
  border-top-width: 0.42rem;
  border-radius: 0.8rem;
  box-shadow: 0 0.4rem 1rem rgba(20, 35, 59, 0.07);
}

table.release-switchboard td:nth-child(1) {
  background: linear-gradient(180deg, var(--release-green-soft), #fff 56%);
  border-top-color: var(--release-green);
}

table.release-switchboard td:nth-child(2) {
  background: linear-gradient(180deg, var(--module-violet-soft), #fff 56%);
  border-top-color: var(--module-violet);
}

.release-label,
.status-chip {
  display: inline-block;
  margin-bottom: 0.65rem;
  padding: 0.25rem 0.58rem;
  font-size: 0.74rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.065em;
  border: 1px solid currentColor;
  border-radius: 999px;
}

.authoritative-label,
.authoritative-chip {
  color: var(--release-green);
  background: #dcfce7;
}

.comment-label,
.comment-chip {
  color: var(--comment-amber);
  background: #fef3c7;
}

.module-label,
.module-chip {
  color: var(--module-violet);
  background: #ede9fe;
}

.classification-note > .content {
  padding: 1rem 1.25rem;
  background: #fff;
  border: 1px solid var(--appsw-border);
  border-left: 0.38rem solid var(--appsw-blue);
  border-radius: 0.7rem;
}

.release-section > .sectionbody {
  padding: 1.25rem 1.4rem 1.5rem;
  background: #fff;
  border: 1px solid var(--appsw-border);
  border-radius: 0 0 0.85rem 0.85rem;
  box-shadow: 0 0.35rem 1rem rgba(20, 35, 59, 0.055);
}

.release-section > h2 {
  margin-bottom: 0;
  padding: 0.85rem 1.2rem;
  color: #fff;
  border: 0;
  border-radius: 0.85rem 0.85rem 0 0;
}

.authoritative-section > h2 {
  background: linear-gradient(135deg, #14532d, var(--release-green));
}

.public-comment-section > h2 {
  background: linear-gradient(135deg, #78350f, var(--comment-amber));
}

.module-review-section > h2 {
  background: linear-gradient(135deg, #44308a, var(--module-violet));
}

.release-section > h2 a,
.release-section > h2 a:hover,
.release-section > h2 a:focus {
  color: #fff;
}

.architecture-list > ol {
  counter-reset: architecture;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.3rem 0;
  padding: 0;
  list-style: none;
}

.architecture-list > ol > li {
  position: relative;
  min-height: 5rem;
  margin: 0;
  padding: 1.1rem 1.15rem 1.1rem 3.7rem;
  background: #fff;
  border: 1px solid var(--appsw-border);
  border-radius: 0.75rem;
}

.architecture-list > ol > li::before {
  counter-increment: architecture;
  content: counter(architecture);
  position: absolute;
  top: 1rem;
  left: 1rem;
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  color: #fff;
  font-weight: 800;
  background: var(--appsw-blue);
  border-radius: 999px;
}

.page-note {
  margin-top: 3rem;
  padding: 1rem 1.2rem;
  color: var(--appsw-muted);
  background: #eef3f7;
  border-radius: 0.65rem;
}

#footer {
  padding: 1.2rem 2rem 2.5rem;
  color: var(--appsw-muted);
  background: transparent;
}

@media (max-width: 52rem) {
  #header {
    display: block;
    min-height: 0;
    margin-top: 0;
    padding: 2.25rem 1.35rem 1.5rem;
    border-radius: 0 0 1rem 1rem;
  }

  #header::after {
    position: relative;
    top: auto;
    right: auto;
    display: block;
    width: min(100%, 26rem);
    margin: 1.25rem auto 0;
    transform: none;
  }

  .quick-links > .content > .ulist > ul,
  .architecture-list > ol {
    grid-template-columns: 1fr;
  }

  table.release-switchboard tr {
    grid-template-columns: 1fr;
  }

  table.release-switchboard td {
    min-height: 0;
  }

  #toc ul {
    columns: 1;
  }

  table.tableblock {
    display: block;
    overflow-x: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .quick-links li {
    transition: none;
  }
}

/* AppSW page details; the shared layout follows the DBMS-iTC website. */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
#header { width: calc(100% - 2rem); }
#toc a, h2 a { text-decoration: none; }
#toc a:hover, h2 a:hover { text-decoration: underline; }
h2, h3, [id] { scroll-margin-top: 1.25rem; }
h2 .anchor { display: none; }
p { margin: 0 0 1rem; }
li p { margin: 0; }
li + li { margin-top: 0.35rem; }
dt { font-weight: 700; }
dd { margin: 0.2rem 0 0.8rem; }
table caption { text-align: left; margin: 1rem 0 0.6rem; font-weight: 600; }
table th { text-align: left; }
td p:last-child { margin-bottom: 0; }
table:not(.release-switchboard) td { overflow-wrap: anywhere; }
table:not(.release-switchboard) td:last-child a { white-space: nowrap; }
.sect1 > h2 { font-size: clamp(1.45rem, 2.8vw, 1.8rem); line-height: 1.3; }
.release-section > .sectionbody > .dlist dl {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) 2fr;
  gap: 0.35rem 1rem;
  margin: 1rem 0 1.5rem;
}
.release-section > .sectionbody > .dlist dd { margin: 0; }
.release-section > .sectionbody > .dlist dd p { margin: 0; }
@media (max-width: 52rem) {
  #header { width: 100%; }
  #header::after { width: min(100%, 24rem); max-height: none; }
  .release-section > .sectionbody { padding: 1rem; }
  .release-section > .sectionbody > .dlist dl { display: block; }
  .release-section > .sectionbody > .dlist dd { margin: 0.2rem 0 0.8rem; }
  table:not(.release-switchboard) { font-size: 0.94rem; }
}
@media print {
  body { background: white; color: black; }
  #header { background: white; box-shadow: none; min-height: 0; padding: 1rem 0; }
  #header h1, #header .details { color: black; }
  #header::after { display: none; }
  #content { padding: 0; }
  table.tableblock { display: table; overflow: visible; box-shadow: none; }
  table.release-switchboard { display: block; }
  .release-section > h2, table.tableblock thead { color: black; background: #eee; }
  .release-section > h2 a { color: black; }
  .release-section > .sectionbody { box-shadow: none; }
}