/* Selected direction 09, Signature. Shell-only styling.
   Keep styles.css, all watchbox/search geometry, and runtime files unchanged. */
@font-face {
  font-family: 'Watchgrid Signature Roman';
  src: url('fonts/NimbusRoman-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Watchgrid Signature Palatino';
  src: url('fonts/P052-Roman.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Watchgrid Typewriter';
  src: url('fonts/NimbusMonoPS-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* The selected white surround does not change --paper or any shared token. */
body.signature-shell {
  background: #fdfcfa;
}
/* A quiet porcelain inset against the white surround. Workspace paint only:
   no shared tokens, descendant colours, or geometry change. */
body.signature-shell .workspace {
  background: #f5f4f2;
}
body.signature-shell > .masthead {
  height: 118px;
  border-bottom-color: #3c2d2635;
  padding-top: 21px;
  padding-bottom: 21px;
  row-gap: 6px;
}
/* Larger symbol with visible ink about twice the lettering height.
   Keep the approved masthead grid, optical offsets and page centring. */
body.signature-shell > .masthead .brand {
  align-items: center;
  gap: 6px;
}
body.signature-shell > .masthead .brand-icon {
  width: 26.8px;
  height: 26.8px;
  flex-basis: 26.8px;
  /* Visible SVG midpoint is y=633.135 in viewBox y=474..790. */
  transform: translateY(-0.3592%);
}
body.signature-shell > .masthead .brand-wordmark {
  /* Selected Signature Roman, 20% above the preceding compact wordmark. */
  font: 400 18.6px/1 'Watchgrid Signature Roman', 'Times New Roman', serif;
  letter-spacing: 2.7px;
  text-transform: uppercase;
  color: #3c2d26;
  /* Font ascent/descent 683/-317; WATCHGRID ink bounds -14..676.
     Move the visible capitals to the flex centre, not just the line box. */
  transform: translateY(0.148em);
}
body.signature-shell > .masthead .masthead-note {
  color: #6c5b51;
  font-size: 9px;
  font-weight: 400;
  letter-spacing: 1px;
}
body.signature-shell > .masthead .local-status {
  color: #80766e;
}

/* Collection title: restrained, readable menu-style typewriter lettering.
   The Signature Watchgrid wordmark above remains unchanged. */
body.signature-shell > main > .intro {
  justify-content: flex-start;
  padding: 28px 0 27px;
  text-align: left;
}
body.signature-shell > main > .intro h1 {
  font: 400 24px/1.3 'Watchgrid Typewriter', 'Courier New', monospace;
  letter-spacing: -0.5px;
  color: #594c43;
  margin: 0;
}
body.signature-shell > main > .intro .subtitle {
  margin: 10px 0 0;
  font-size: 10px;
  line-height: 1.6;
  font-weight: 400;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: #87796e;
  max-width: none;
}
body.signature-shell > main > .footer {
  color: #87796e;
  border-top-color: #3c2d2635;
}
@media (max-width: 700px) {
  body.signature-shell > .masthead {
    height: 126px;
    padding-top: 16px;
    padding-bottom: 16px;
    row-gap: 6px;
  }
  body.signature-shell > .masthead .brand-icon {
    width: 24.2px;
    height: 24.2px;
    flex-basis: 24.2px;
  }
  body.signature-shell > .masthead .brand-wordmark {
    /* Retain the selected font, with proportionate small-screen sizing. */
    font-size: 16.8px;
    letter-spacing: 2.1px;
  }
  body.signature-shell > .masthead .masthead-note {
    font-size: 8px;
  }
  body.signature-shell > main > .intro {
    padding: 24px 0 23px;
  }
  body.signature-shell > main > .intro h1 {
    font-size: 22px;
    letter-spacing: -0.4px;
  }
  body.signature-shell > main > .intro .subtitle {
    font-size: 9px;
    letter-spacing: 0.9px;
  }
}
@media (max-width: 390px) {
  body.signature-shell > .masthead .brand-icon {
    width: 21.6px;
    height: 21.6px;
    flex-basis: 21.6px;
  }
  body.signature-shell > .masthead .brand-wordmark {
    font-size: 15px;
    letter-spacing: 1.8px;
  }
}

/* Main header is identity only. The sole creator credit stays in the footer. */
body.signature-shell > .masthead { grid-template-rows: auto; }
body.signature-shell > .masthead .brand { align-self: center; }
body.signature-shell > .masthead .local-status { grid-row: 1; }
@media (max-width: 700px) {
  body.signature-shell > .masthead { grid-template-rows: auto auto; }
  body.signature-shell > .masthead .local-status { grid-row: 2; }
}
/* Position only: auto margins centre a fitting three-slot case, resolving to
   zero when wider than the scrollport so its left edge remains reachable.
   The direct parent prevents any effect in the full-screen scene/export. */
body.signature-shell .case-scroll > .watch-case[data-size="3"] {
  margin-left: auto;
  margin-right: auto;
}

/* Workspace breathing room: expand surround OUTWARD without changing grid content width. */
body.signature-shell .workspace {
  background: #f5f4f2;
  margin-inline: -24px;
  padding: 24px;
}
@media(max-width:1200px) {
  body.signature-shell .workspace {
    margin-inline: -16px;
    padding-inline: 16px;
  }
}
@media(max-width:700px) {
  body.signature-shell .workspace {
    margin-inline: -12px;
    padding: 16px 12px;
  }
}

/* Authorized header impact: lettering/tracking 1.5x, symbol 2x relative to v16.
   Original font, vector artwork, optical centering, line height and layout stay. */
body.signature-shell > .masthead .brand-icon {
  width: 53.6px;
  height: 53.6px;
  flex-basis: 53.6px;
}
body.signature-shell > .masthead .brand-wordmark {
  font-size: 27.9px;
  letter-spacing: 4.05px;
}
@media (max-width: 700px) {
  body.signature-shell > .masthead .brand-icon {
    width: 48.4px;
    height: 48.4px;
    flex-basis: 48.4px;
  }
  body.signature-shell > .masthead .brand-wordmark {
    font-size: 25.2px;
    letter-spacing: 3.15px;
  }
}
@media (max-width: 390px) {
  body.signature-shell > .masthead .brand-icon {
    width: 43.2px;
    height: 43.2px;
    flex-basis: 43.2px;
  }
  body.signature-shell > .masthead .brand-wordmark {
    font-size: 22.5px;
    letter-spacing: 2.7px;
  }
}

/* Watchgrids.net identity only. Restore the previous symmetric watch mark;
   retain Signature Roman, existing wordmark sizes and cap optical alignment. */
body.signature-shell > .masthead .brand-icon {
  transform: none;
}
body.signature-shell > .masthead .brand-wordmark {
  white-space: nowrap;
}
body.signature-shell > .masthead .brand-domain {
  font-size: 0.4em;
  letter-spacing: 0;
  text-transform: none;
}