/* Keyring designer: the shared southern palette, with true material previews. */
:root {
  --ash-bg: #f3f7f3;
  --ash-panel: #fff;
  --ash-ink: #142e28;
  --ash-muted: #52685e;
  --ash-line: #ccdbd0;
  --ash-accent: #126557;
  --ash-accent-2: #126557;
  --ash-shadow: 0 8px 28px rgb(15 51 43 / 6%);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
.ash-app-header { background: #0b2523; color: #f1faf4; border-bottom: 1px solid #36584c; box-shadow: 0 -2px 0 #b5f4d4 inset; }
.ash-app-logo { color: #f1faf4; text-decoration: none; }
.ash-app-logo img { background: #fff; padding: 3px; border-radius: 3px; flex-shrink: 0; }
.ash-app-logo__sub { color: #b5cfc2; }
.ash-app-nav-dropdown { background: #123630; border-color: #36584c; }
.ash-app-nav a:hover,.ash-app-nav-item__toggle:hover { background: #245545; }
.ash-app-menu-toggle { border-color: #5c7e70; border-radius: 3px; }
.ash-keyring-main { padding-top: 28px; }
.ash-keyring-hero {
  background: radial-gradient(ellipse at 100% 100%,#316e58,transparent 65%),#0c3029;
  padding: 28px; border: 1px solid #325b49; border-radius: 5px; align-items: center;
}
.ash-keyring-hero h1 { font-family: inherit; color: #eafff1; font-size: clamp(32px,4.2vw,52px); font-weight: 600; line-height: 1.06; letter-spacing: -.045em; text-wrap: balance; }
.ash-keyring-hero .ash-keyring-eyebrow { margin: 0 0 12px; color: #b9f5d8; font-size: 11px; letter-spacing: .14em; }
.ash-keyring-hero p { color: #c6ddd3; font-size: 14px; }
.ash-keyring-price { min-width: 135px; border-radius: 3px; background: #e6faec; box-shadow: none; }
.ash-keyring-side { border-radius: 5px; }
.ash-keyring-side__header { background: #f9fcf9; }
.ash-keyring-side__header h2 { font-weight: 650; letter-spacing: .08em; font-size: 15px; }
.ash-keyring-preview-wrap { background: radial-gradient(ellipse at 50% 0,#fff,#e7eee7); }
.ash-keyring-add { border-radius: 3px; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible { outline: 3px solid #168572; outline-offset: 3px; }
@media (max-width: 1080px) {
  .ash-app-nav { background: #0b2523; color: #f1faf4; border-color: #36584c; }
  .ash-app-menu-toggle { grid-column: 3; justify-self: end; }
}
@media (max-width: 760px) {
  .ash-keyring-hero { padding: 22px; }
  .ash-keyring-price { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .ash-keyring-price[hidden] { display: none; }
  .ash-keyring-price strong { margin: 0; }
  .ash-keyring-side__header { gap: 12px; }
  .ash-keyring-side__header span { font-size: 12px; }
}