/* Case offers and local prototypes for checkout, news and feedback. */
.cover-prompter { background-image:url('/images/covers/prompter-grand-play-20261103.jpg'); }
#screen-landing .story-option { overflow:hidden; }
#screen-landing .tutorial-option { border-color:var(--amber); }
#screen-landing .story-number { max-width:calc(100% - 24px); box-sizing:border-box; color:#f0eae1; font-size:10px; letter-spacing:.65px; }
#screen-landing .story-offer { display:flex; flex-direction:column; justify-content:center; gap:5px; min-height:77px; box-sizing:border-box; margin-top:auto; margin-bottom:16px; padding:12px 14px; border:1px solid var(--border-dim); border-radius:8px; background:var(--bg-black); }
.story-offer > strong,.story-price-line strong { color:var(--paper); font:600 25px/1.2 var(--font-sans); }
.story-offer > span:last-child { color:var(--paper-dim); font:12px/1.45 var(--font-sans); }
.story-price-line { display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.story-price-line s { color:var(--paper-dim); font-size:15px; }
.story-discount { padding:3px 6px; border-radius:4px; background:var(--accent-soft); color:var(--amber); font:600 11px/1.3 var(--font-sans); }
#screen-landing .story-offer-upcoming > strong { color:var(--paper-dim); font-size:15px; }
#screen-landing .story-cta { margin-top:0; gap:8px; padding:13px 15px; }
.library-demo-note { margin:20px 0 0; color:var(--paper-dim); font:12px/1.5 var(--font-sans); }
.case-dialog { box-sizing:border-box; width:calc(100% - 32px); max-width:500px; max-height:calc(100dvh - 32px); margin:auto; padding:28px; overflow-y:auto; overscroll-behavior:contain; border:1px solid var(--border-dim); border-radius:14px; background:var(--bg-panel); color:var(--paper); box-shadow:var(--shadow); font:15px/1.6 var(--font-sans); }
.case-dialog::backdrop { background:#000a; backdrop-filter:blur(4px); }
.case-dialog-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px; }
.case-dialog .case-dialog-heading h2 { margin:0; color:var(--paper); font:600 28px/1.2 var(--font-sans); letter-spacing:-.7px; }
.case-dialog-close { flex-shrink:0; width:32px; height:32px; padding:0; border:1px solid var(--border-dim); border-radius:6px; background:transparent; color:var(--paper-dim); font:24px/1 var(--font-sans); }
.case-dialog p { margin:10px 0; }
.case-dialog .design-eyebrow { margin:0 0 6px; }
.demo-disclosure { color:var(--paper-dim); font-size:12px; }
.checkout-summary { margin:20px 0; padding:18px; border:1px solid var(--border-dim); border-radius:10px; background:var(--bg-black); }
.checkout-summary-title { display:block; font-size:18px; }
.checkout-total { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:12px; margin-top:12px; border-top:1px solid var(--border-dim); }
.checkout-total strong { font:600 30px/1 var(--font-sans); }
.case-dialog fieldset { min-width:0; margin:18px 0; padding:0; border:0; }
.case-dialog legend,.case-dialog form > label { display:block; margin-bottom:9px; color:var(--paper); font:600 14px/1.5 var(--font-sans); }
.payment-methods { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.payment-method { display:flex; align-items:center; gap:9px; min-height:66px; padding:12px; border:1px solid var(--border-dim); border-radius:9px; cursor:pointer; }
.payment-method:has(input:checked) { border-color:var(--amber); background:var(--accent-soft); }
.payment-method input { accent-color:var(--amber); }
.payment-method strong,.payment-method small { display:block; line-height:1.4; }
.payment-method small { color:var(--paper-dim); font-size:11px; }
.case-dialog .btn { width:100%; margin-top:12px; white-space:normal; }
.case-dialog input[type="email"],.case-dialog select,.case-dialog textarea { box-sizing:border-box; width:100%; padding:12px; border:1px solid var(--border-dim); border-radius:8px; background:var(--input-bg); color:var(--paper); font:15px/1.5 var(--font-sans); }
.case-dialog textarea { min-height:90px; resize:vertical; }
.survey-field { margin:18px 0; }
.survey-field > label { display:block; margin-bottom:9px; font-weight:600; }
.survey-ratings { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; }
.survey-rating { display:flex; align-items:center; justify-content:center; gap:5px; min-height:44px; border:1px solid var(--border-dim); border-radius:7px; cursor:pointer; }
.survey-rating:has(input:checked) { background:var(--accent-soft); border-color:var(--amber); }
.survey-rating input { accent-color:var(--amber); margin:0; }
.survey-scale { display:flex; justify-content:space-between; gap:10px; margin-top:6px; color:var(--paper-dim); font-size:12px; }
.coupon-code { display:block; margin:18px 0 8px; padding:17px; border:1px dashed var(--amber); border-radius:8px; background:var(--accent-soft); color:var(--paper); text-align:center; overflow-wrap:anywhere; font:600 24px/1.4 monospace; letter-spacing:1px; user-select:all; }
.case-aftercare { display:grid; gap:16px; margin-top:24px; }
.case-next-story,.case-survey-invite { padding:20px; border:1px solid var(--border-dim); border-radius:10px; background:var(--bg-black); }
.case-next-story { display:grid; grid-template-columns:96px minmax(0,1fr); gap:17px; align-items:start; }
.case-next-story img { display:block; width:96px; height:126px; border-radius:6px; object-fit:cover; }
.case-next-story h3,.case-survey-invite h3 { margin:0 0 8px; color:var(--paper); font:600 21px/1.25 var(--font-sans); letter-spacing:-.4px; }
.case-next-story p,.case-survey-invite p,.debrief-modal .case-aftercare p { margin:0 0 12px; color:var(--paper-dim); font:14px/1.6 var(--font-sans); }
.case-next-story .design-eyebrow { margin-bottom:7px; color:var(--amber); font-size:10px; }
.case-next-story .btn,.case-survey-invite .btn { max-width:100%; white-space:normal; }
.case-extras-status { display:block; color:var(--green-ok); font:13px/1.5 var(--font-sans); }
.case-next-story .demo-disclosure,.case-survey-invite .demo-disclosure { display:block; margin-top:7px; }
#tutorial-next-case { margin-top:20px; }
#tutorial-next-case .case-next-story { padding:16px; grid-template-columns:76px minmax(0,1fr); gap:14px; }
#tutorial-next-case img { width:76px; height:108px; }
#tutorial-next-case h3 { font-size:20px; }
/* The completed-case report leads; optional follow-up actions stay quiet. */
#debrief-modal .debrief-aftercare { gap:10px; margin-top:28px; padding-top:22px; border-top:1px solid var(--border-dim); }
#debrief-modal .case-next-story-compact { grid-template-columns:64px minmax(0,1fr) auto; align-items:center; gap:15px; padding:14px; background:transparent; }
#debrief-modal .case-next-story-compact img { width:64px; height:76px; border-radius:5px; }
#debrief-modal .case-next-story-compact .design-eyebrow { margin:0 0 5px; color:var(--paper-dim); font-size:10px; letter-spacing:1px; }
#debrief-modal .case-next-story-compact h3 { margin:0 0 5px; font:600 17px/1.25 var(--font-sans); letter-spacing:-.2px; }
#debrief-modal .case-next-story-compact p:not(.design-eyebrow) { margin:0; font:13px/1.5 var(--font-sans); }
#debrief-modal .case-next-story-compact .btn { width:auto; min-height:36px; margin:0; padding:7px 12px; font:600 12px/1.4 var(--font-sans); white-space:nowrap; }
#debrief-modal .case-survey-invite-compact { margin:0; padding:0; border:0; border-radius:0; background:none; }
#debrief-modal .case-feedback-link { width:auto; min-height:36px; margin:0; padding:6px 0; border:0; border-radius:0; background:none; box-shadow:none; color:var(--paper-dim); text-align:left; font:13px/1.5 var(--font-sans); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
#debrief-modal .case-feedback-link:hover { color:var(--amber); background:none; }
#debrief-modal .case-feedback-link:focus-visible { outline:2px solid var(--amber); outline-offset:3px; }
@media (max-width:640px) {
  .case-dialog { padding:22px; }
  .case-dialog .case-dialog-heading h2 { font-size:25px; }
  .case-next-story { grid-template-columns:76px minmax(0,1fr); gap:14px; padding:16px; }
  .case-next-story img { width:76px; height:110px; }
  .case-survey-invite { padding:16px; }
  .survey-rating { gap:3px; }
  #debrief-modal .case-next-story-compact { grid-template-columns:56px minmax(0,1fr); gap:11px; padding:12px; }
  #debrief-modal .case-next-story-compact img { grid-row:1 / span 2; width:56px; height:80px; }
  #debrief-modal .case-next-story-compact .btn { grid-column:2; justify-self:start; }
}