/* The Trading Fly — additive first-glance candidate. Existing evidence/state owns content. */
#hero { grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); align-items: center; gap: clamp(24px, 5vw, 72px); padding: 32px 0 28px; }
#hero .hero__art { width: min(100%, 280px); margin: 0 auto; aspect-ratio: 540 / 1020; }
#hero .artslot--main { width: 100%; max-width: none; border: 0; box-shadow: none; }
#hero .hero__body { min-width: 0; }
#hero .hero__kicker { font-size: .75rem; letter-spacing: .15em; line-height: 1.5; margin-bottom: 14px; }
#hero .hero__id { display: block; }
#hero .hero__name { max-width: 13ch; font-size: clamp(2.8rem, 5.7vw, 5.5rem); line-height: .96; letter-spacing: -.065em; text-transform: none; text-wrap: balance; }
#hero .hero__name span { display: block; }
#hero .hero__mood { display: inline-block; margin-top: 16px; padding: 5px 9px; font-size: .7rem; letter-spacing: .1em; }
#hero .hero__lede { margin: 18px 0 0; max-width: 33ch; font-size: clamp(1.05rem, 1.6vw, 1.35rem); line-height: 1.4; color: var(--ink-2); }
#hero .hero__premise { max-width: 39ch; font-size: clamp(1rem, 1.6vw, 1.25rem); margin: 18px 0 8px; line-height: 1.4; }
#hero .hero__premise:empty { display: none; }
#hero .hero__equity { margin-top: 12px; padding-top: 14px; border-top: 1px solid #d9d9df; font-size: clamp(1.7rem, 3.4vw, 2.6rem); line-height: 1.2; }
#hero .hero__equity:before { content: 'Selected account'; display: block; color: var(--ink-2); font-size: .68rem; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 5px; }
#hero .hero__equity small { display: inline-block; font-size: .8rem; line-height: 1.4; }
#hero .hero__actions { margin-top: 16px; gap: 8px; }
#hero .hero-preview-tools { margin-top: 4px; max-width: 100%; }
#hero .hero-preview-tools summary { min-height: 44px; width: fit-content; max-width: 100%; padding: 10px 0; color: var(--ink-2); font-size: .8rem; cursor: pointer; text-underline-offset: 4px; }
#hero .hero-preview-tools[open] summary { color: var(--cobalt); }
#hero .hero-preview-tools #hero-preview { min-width: 0; min-height: 44px; }
#hero .fold--hero { margin-top: 10px; }
@media (max-width: 719px) {
  #hero { grid-template-columns: minmax(0, 1fr) minmax(96px, 32%); gap: 12px 16px; align-items: start; padding: 18px 0 20px; }
  #hero .hero__body { display: contents; }
  #hero .hero__kicker { grid-column: 1 / -1; grid-row: 1; margin: 0; font-size: .68rem; }
  #hero .hero__id { grid-column: 1; grid-row: 2; align-self: center; }
  #hero .hero__name { font-size: clamp(2.05rem, 7.9vw, 3.3rem); line-height: 1; letter-spacing: -.06em; max-width: 10ch; }
  #hero .hero__art { grid-column: 2; grid-row: 2; align-self: center; width: 100%; max-width: 146px; margin: 0; }
  #hero .hero__mood { margin-top: 12px; font-size: .65rem; max-width: 100%; }
  #hero .hero__lede, #hero .hero__premise, #hero .hero__equity, #hero .fold--hero, #hero .hero__actions, #hero .hero-preview-tools { grid-column: 1 / -1; margin-top: 0; }
  #hero .hero__lede { font-size: 1rem; max-width: none; margin-bottom: 0; }
  #hero .hero__premise { font-size: .95rem; margin-bottom: 0; }
  #hero .hero__equity { padding-top: 12px; }
  #hero .hero__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #hero .hero__actions .btn { min-width: 0; min-height: 44px; white-space: normal; }
  #hero .hero__actions #hero-make-card { grid-column: 1 / -1; }
  #hero .hero-preview-tools { margin-top: -6px; }
}
@media (prefers-reduced-motion: reduce) {
  #hero *, #hero *:before, #hero *:after { animation: none !important; transition: none !important; }
}

/* Secondary pages remain one tap away while the character owns the first screen. */
.explore-menu { position: relative; }
.explore-menu summary { list-style: none; }
.explore-menu summary::-webkit-details-marker { display: none; }
.explore-menu summary:after { content: ' +'; margin-left: 6px; }
.explore-menu[open] summary:after { content: ' −'; }
.explore-menu__links { position: absolute; z-index: 20; top: calc(100% + 6px); right: 0; width: 220px; padding: 8px; background: var(--paper); border: 2px solid var(--ink); box-shadow: 4px 4px 0 var(--ink); display: grid; gap: 4px; }
@media (max-width: 719px) {
  .masthead__nav { display: grid; grid-template-columns: .65fr 1.15fr 1.05fr .85fr; gap: 4px; }
  .masthead__nav > .btn, .explore-menu > summary { padding: 6px 3px; min-height: 44px; font-size: .68rem; letter-spacing: 0; width: 100%; white-space: normal; }
  .masthead__nav > .explore-menu { min-width: 0; }
  .modebar .chip { font-size: .7rem; }
}
@media (min-width: 720px) {
  #hero .hero__name { max-width: none; font-size: clamp(2.8rem, 4.5vw, 4.5rem); }
}
@media (min-width: 900px) {
  #fold-hero > summary { display: flex; }
  #fold-hero:not([open])::details-content { content-visibility: hidden; }
  #fold-hero[open]::details-content { content-visibility: visible; }
}
