/* Joy Luck entry presentation only. No report, print or saved-reading dialog rules. */
@media screen {
  .quick-start-hero .entry-mobile-copy {display:none}
  @media(max-width:700px){
    .quick-start-hero .entry-desktop-copy {display:none}
    .quick-start-hero .entry-mobile-copy {display:inline}
    .quick-start-hero .entry-benefits {display:none!important}
    .quick-start-hero .quick-start-invitation {display:flex;flex-direction:column;align-items:stretch}
    .quick-start-hero .quick-start-invitation>p:first-child {order:0;margin-bottom:22px}
    .quick-start-hero .landing-cta {order:1}
    .quick-start-hero .quick-start-trust {order:2}
    .quick-start-hero .entry-about {order:3;margin:10px 0 0}
    .quick-start-hero h1 {max-width:17ch}
  }
}
@media screen {
  .quick-start-hero .entry-benefits {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:16px 0;margin:18px 0 6px;border-block:1px solid #d8cfc3;color:#6d4135;font:500 13px/1.45 Arial,Helvetica,sans-serif}
  .quick-start-hero .entry-benefits span+span {border-left:1px solid #d8cfc3;padding-left:14px}
  .quick-start-hero .entry-about {padding:0;margin:0 0 18px;background:none;border:0}
  .quick-start-hero .entry-about summary {font:400 14px/1.5 Arial,Helvetica,sans-serif;color:#62635b;min-height:44px;align-content:center;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
  .quick-start-hero .entry-about p {font:400 15px/1.65 Arial,Helvetica,sans-serif;margin:8px 0 18px;color:#62635b}
  @media(max-width:700px){.quick-start-hero .entry-benefits{font-size:12px;gap:10px;padding:14px 0}.quick-start-hero .entry-benefits span+span{padding-left:10px}}
}
@media screen {
  body:has(.quick-start-shell):not([data-report-view="report"]):not(:has(main.reveal-report)) {
    --entry-paper: #f4eee4;
    --entry-card: #fffaf3;
    --entry-ink: #252923;
    --entry-muted: #62635b;
    --entry-line: #d8cfc3;
    --entry-accent: #a83f30;
    background: var(--entry-paper);
    color: var(--entry-ink);
    font-family: Arial, Helvetica, sans-serif;
  }
  body:has(.quick-start-shell):not([data-report-view="report"]):not(:has(main.reveal-report)) :is(.site-header,.header-inner,.saved-readings-toolbar) {
    background: var(--entry-paper);
  }
  body:has(.quick-start-shell):not([data-report-view="report"]):not(:has(main.reveal-report)) .site-header {
    border-bottom: 1px solid var(--entry-line);
    box-shadow: none;
  }
  body:has(.quick-start-shell):not([data-report-view="report"]):not(:has(main.reveal-report)) .saved-readings-toolbar {
    max-width: 1230px;
    margin: 0 auto;
    padding: 8px 24px 0;
  }
  body:has(.quick-start-shell):not([data-report-view="report"]):not(:has(main.reveal-report)) .saved-readings-toolbar .saved-secondary {
    min-height: 40px;
    padding: 8px 0;
    border: 0;
    border-radius: 0;
    color: var(--entry-muted);
    background: transparent;
    font: 400 13px/1.5 Arial, Helvetica, sans-serif;
    text-decoration: underline;
    text-underline-offset: 4px;
  }
  body:has(.quick-start-shell):not([data-report-view="report"]):not(:has(main.reveal-report)) .jld-guides-link {
    color: var(--entry-ink);
    font: 500 14px/1.5 Arial, Helvetica, sans-serif;
    text-decoration: underline;
    text-underline-offset: 4px;
  }
  body:has(.quick-start-shell):not([data-report-view="report"]):not(:has(main.reveal-report)) .relationship-mode-link {
    color: var(--entry-ink);
    border-color: var(--entry-line);
    background: var(--entry-card);
    font: 500 14px/1.5 Arial, Helvetica, sans-serif;
  }
  body:has(.quick-start-shell):not([data-report-view="report"]):not(:has(main.reveal-report)) :is(.jld-guides-link,.saved-readings-toolbar .saved-secondary):hover {
    color: var(--entry-accent);
    text-decoration: underline;
  }
  .quick-start-shell .quick-start-hero {padding: 40px 0; gap: 48px; border-color: var(--entry-line)}
  .quick-start-shell .quick-start-invitation > p {font: 400 16px/1.7 Arial, Helvetica, sans-serif; color: var(--entry-muted)}
  .quick-start-shell .quick-start-invitation .quick-start-trust {font-size: 13px}
  .quick-start-shell :is(.landing-cta,.calculate-button) {
    min-height: 48px;
    border: 1px solid var(--entry-accent);
    border-radius: 999px;
    background: var(--entry-accent);
    color: #fffaf3;
    box-shadow: none;
    font: 600 14px/1.5 Arial, Helvetica, sans-serif;
    letter-spacing: 0;
    white-space: normal;
    text-align: center;
    justify-content: center;
    padding: 13px 22px;
  }
  .quick-start-shell :is(.landing-cta,.calculate-button):hover {background: #8f3327; border-color: #8f3327}
  .quick-start-shell #calculator :is(.birth-card,.reading-card) {
    border: 1px solid var(--entry-line);
    border-radius: 16px;
    background: var(--entry-card)!important;
    box-shadow: none;
  }
  .quick-start-shell #calculator .birth-card {padding: clamp(20px,3vw,32px)}
  .quick-start-shell #calculator .birth-card :is(label,h2,h3,summary,button,input,select) {font-family: Arial, Helvetica, sans-serif}
  .quick-start-shell #calculator .birth-card :is(label,h2,h3) {color: var(--entry-ink); font-size: 15px; font-weight: 600; line-height: 1.5; letter-spacing: 0}
  .quick-start-shell #calculator .birth-card .card-heading h2 {font-size: 20px; margin: 0 0 6px}
  .quick-start-shell #calculator .birth-card :is(p,small,.field-help) {font: 400 14px/1.65 Arial, Helvetica, sans-serif; color: var(--entry-muted)}
  .quick-start-shell #calculator .birth-card :is(input:not([type="checkbox"]),select) {
    min-height: 48px;
    border: 1px solid #c7bcaf;
    border-radius: 10px;
    background: #fffdf9;
    color: var(--entry-ink);
    font: 400 16px/1.5 Arial, Helvetica, sans-serif;
  }
  .quick-start-shell #calculator .connection-selector {padding-bottom: 24px; border-color: var(--entry-line)}
  .quick-start-shell #calculator .jl-preview-privacy {margin: 0 0 28px; padding: 20px; border: 1px solid var(--entry-line); border-radius: 12px; background: #eee7dc}
  .quick-start-shell #calculator .jl-preview-privacy p {margin: 0 0 12px}
  .quick-start-shell #calculator .birth-card summary {font-size: 14px; font-weight: 500; min-height: 44px; align-content: center; color: var(--entry-ink); text-underline-offset: 4px}
  .quick-start-shell #calculator .card-heading {gap: 12px; margin-bottom: 24px}
  .quick-start-shell #calculator .card-heading > svg {color: var(--entry-accent); margin-top: 5px}
  .quick-start-shell #calculator .relationship-context {padding: 0; border: 0; background: transparent; margin: 0 0 28px}
  .quick-start-shell #calculator .birth-card .field-stack {gap: 8px}
  .quick-start-shell #calculator .birth-card :is(input,select,button,summary):focus-visible,
  .quick-start-shell a:focus-visible {outline: 3px solid #a83f30; outline-offset: 3px}
  .quick-start-shell #calculator .birth-card .form-error {color: #963629}
  @media(max-width:700px) {
    .quick-start-shell .quick-start-hero {padding: 24px 0 30px; gap: 20px}
    .quick-start-shell .quick-start-invitation > p {font-size: 15px}
    .quick-start-shell .landing-cta {width: 100%}
    .quick-start-shell #calculator .jl-preview-privacy {padding: 16px}
  }
}

/* A warmer invitation, with compact copy on small screens. Entry only. */
@media screen {
  .quick-start-shell .quick-start-invitation {
    padding: 28px;
    border: 1px solid var(--entry-line);
    border-radius: 20px;
    background: var(--entry-card);
  }
  .quick-start-shell .entry-invitation-title {
    margin: 0 0 12px;
    max-width: 22ch;
    font: 400 clamp(25px,2.4vw,32px)/1.15 Georgia, 'Times New Roman', serif;
    letter-spacing: -.025em;
    color: var(--entry-ink);
  }
  .quick-start-shell .quick-start-invitation .entry-invitation-intro {margin: 0; font-size: 15px; line-height: 1.6}
  .quick-start-shell .entry-benefits {gap: 16px; padding: 22px 0; margin: 22px 0 16px; border-color: #e3d9cc}
  .quick-start-shell .entry-benefits > div {min-width: 0}
  .quick-start-shell .entry-benefit-number {display:block; color: var(--entry-accent); font: 500 11px/1.4 Arial, sans-serif; letter-spacing: .08em; margin: 0 0 8px}
  .quick-start-shell .entry-benefits strong {display:block; color: var(--entry-ink); font: 600 14px/1.35 Arial, sans-serif; margin-bottom: 6px}
  .quick-start-shell .entry-benefits small {display:block; color: var(--entry-muted); font: 400 12px/1.5 Arial, sans-serif}
  .quick-start-shell .entry-about {margin: 0 0 14px}
  .quick-start-shell .entry-about summary {font-size: 13px; color: var(--entry-muted); text-decoration: none}
  .quick-start-shell .entry-about summary:hover {color: var(--entry-accent); text-decoration: underline}
  .quick-start-shell .quick-start-invitation .landing-cta {display:flex; width:100%; min-height:52px}
  .quick-start-shell .quick-start-invitation .quick-start-trust {margin:12px 0 0; text-align:center; font-size:12px}
  @media(max-width:700px) {
    .quick-start-shell .quick-start-invitation {padding:20px; border-radius:16px}
    .quick-start-shell .entry-invitation-title {order:0; font-size:25px; margin-bottom:10px; max-width:21ch}
    .quick-start-shell .quick-start-invitation .entry-invitation-intro {order:0; font-size:14px; line-height:1.5; margin:0 0 18px}
    .quick-start-shell .quick-start-invitation .entry-about {margin:12px 0 0; order:3}
    .quick-start-shell .entry-about summary {min-height:44px}
  }
}

@media screen {
  .quick-start-shell .entry-connection-mark {width:160px; height:80px; margin-bottom:18px; flex:none; order:-1}
  .quick-start-shell .entry-connection-mark img {display:block; width:100%;height:100%;object-fit:contain}
  .quick-start-shell .quick-start-invitation .entry-invitation-prompt {margin:0 0 8px; color:var(--entry-accent); font:600 15px/1.5 Arial,Helvetica,sans-serif; order:0}
  @media(max-width:700px) {
    .quick-start-shell .entry-connection-mark {width:140px;height:70px;margin-bottom:14px}
    .quick-start-shell .quick-start-invitation .entry-invitation-prompt {font-size:14px;line-height:1.45;margin-bottom:8px}
  }
}