/* Generated artwork gives each destination a visual identity; facts remain in HTML. */
.module-art-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; }
.module-key-art { width: 144px; height: 144px; object-fit: contain; pointer-events: none; mask-image: radial-gradient(ellipse, #000 48%, transparent 75%); }
.chips-header.module-art-heading { grid-template-columns: minmax(0, 1fr) 124px auto; }
.chips-header .module-key-art { width: 124px; height: 124px; }
.login-story-copy { position: relative; z-index: 1; }
.login-key-art { display: block; width: min(100%, 360px); height: auto; max-height: 34vh; object-fit: contain; align-self: center; pointer-events: none; mask-image: radial-gradient(ellipse, #000 48%, transparent 76%); }
.login-story { gap: 20px; }
.interview-chip-drafts { margin: 18px 0; overflow: hidden; }
.interview-chip-drafts > summary { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 18px 22px; cursor: pointer; color: var(--gold-0); }
.interview-chip-drafts > summary small { color: var(--muted); }
.interview-chip-draft { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 0; border-top: 1px solid var(--line); }
.interview-chip-draft > div { min-width: 0; }
.interview-chip-draft h3 { margin: 0 0 8px; font-size: 15px; }
.interview-chip-draft p { margin: 0 0 8px; color: var(--paper); overflow-wrap: anywhere; line-height: 1.7; }
.interview-chip-draft small { color: var(--muted); }
.interview-chip-draft button { flex: 0 0 auto; }
.draft-actions { display: flex; flex-direction: column; flex: 0 0 auto; gap: 8px; }
.draft-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; margin: 14px 0; }
.draft-facts dt { color: var(--muted); font-size: 11px; }
.draft-facts dd { margin: 3px 0 0; color: var(--paper); font-size: 12px; overflow-wrap: anywhere; }
@media (max-width: 850px) {
  .login-story { min-height: auto; gap: 28px; }
  .login-key-art { position: absolute; width: 136px; right: 0; top: 122px; max-height: none; opacity: .72; }
  .login-story-copy { padding-right: 76px; }
  .login-intro { max-width: 280px; }
}
@media (max-width: 600px) {
  .module-key-art { width: 90px; height: 90px; }
  .chips-header.module-art-heading { grid-template-columns: minmax(0, 1fr) 90px; }
  .chips-header .module-key-art { width: 90px; height: 90px; }
  .chips-header #new-chip { grid-column: 1 / -1; justify-self: start; }
  .interview-chip-draft { align-items: flex-start; flex-direction: column; gap: 10px; }
}
