/* Local story preview: live public shell with a proposed product demonstration. */
.story-hero { grid-template-columns:1fr 1fr; gap:44px; align-items:center; padding-bottom:36px; }
html[data-brand="mockrn"] .story-hero h1 { font-size:clamp(36px,3.7vw,49px); line-height:1.08; }
.story-hero .ab-deck { font-size:16px; max-width:455px; }
.story-hero .ab-browse { font-size:13px; }
/* Keep the same two-column workspace through recording, feedback and signup. */
.story-hero { align-items:start; }
.story-hero .ab-intro { position:sticky; top:100px; padding-top:40px; }
@media(max-width:760px) { .story-hero .ab-intro { position:static; padding-top:0; } }
/* Explicit ink: the card mounts inside the signed-in setup screen too, whose lockup region is white-on-green;
   without its own color the header wordmark and the recognition line inherit white on cream (owner, 2026-09-23). */
.story-product { background:#fffcf7; color:#303534; border:1px solid #d5d9cf; border-radius:14px; box-shadow:0 10px 28px #283b3110; overflow:hidden; }
.product-top { padding:15px 20px; border-bottom:1px solid #e4e3da; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.product-top strong { display:flex; align-items:center; font-size:20px; letter-spacing:-.5px; }
.product-top strong img { margin-right:8px; }
.product-top strong > span { color:#df816b; }
.product-top > span { font-size:10px; color:#606b64; }
.product-tabs { display:flex; padding:10px 14px; background:#f4f1e9; gap:6px; }
.product-tabs button { flex:1; color:#56635b; border:1px solid transparent; background:transparent; padding:10px 6px; font:600 11px/1.4 Geist,sans-serif; font-family:inherit; border-radius:6px; cursor:pointer; }
.product-tabs button[aria-pressed="true"] { background:#fffcf7; border-color:#d8ddd3; color:#315956; box-shadow:0 1px 3px #00000008; }
.product-stage { padding:23px 24px 0; }
.product-stage > div { min-height:327px; }
.product-stage [hidden] { display:none; }
.product-meta { display:flex; justify-content:space-between; gap:10px; color:#627169; font-size:10px; line-height:1.5; }
.product-progress { height:3px; margin:12px 0 22px; border-radius:3px; background:#e9ece3; }
.product-progress i { display:block; width:25%; background:#315956; height:3px; }
html[data-brand="mockrn"] .story-product h2 { font-size:24px; line-height:1.3; letter-spacing:-.02em; margin:0 0 16px; color:#303c35; }
.practice-hint { color:#626b63; font-size:13px; line-height:1.55; margin:0 0 17px; }
.product-voice { display:flex; align-items:center; justify-content:center; gap:16px; border:1px solid #d4ddd3; background:#eff2e9; border-radius:8px; height:48px; color:#315956; font-size:12px; }
.voice-bars { display:flex; align-items:center; gap:3px; height:24px; }
.voice-bars i { background:#55786a; width:3px; height:8px; border-radius:3px; }
.voice-bars i:nth-child(3n) { height:23px; }.voice-bars i:nth-child(2n) { height:16px; }
.demo-next { display:flex; justify-content:space-between; gap:12px; width:100%; border:none; background:transparent; padding:18px 0 10px; color:#315956; font:600 12px/1.5 Geist,sans-serif; cursor:pointer; text-align:left; text-decoration:underline; text-underline-offset:4px; }
.product-label { font-size:10px; line-height:1.5; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:#586c5f; margin:15px 0 8px; }
.product-stage blockquote { font-size:14px; line-height:1.6; margin:0; color:#4d5a50; }
.product-feedback { padding:14px 16px; background:#edf1e7; border-radius:8px; margin-top:16px; }
.product-feedback .product-label { margin:0 0 8px; }
.product-feedback > p:last-child { font-size:13px; line-height:1.6; margin:0; color:#435c4b; }
.product-caption { margin:0; padding:12px 20px 14px; font-size:9px; line-height:1.5; color:#657066; text-align:center; }
.story-product button:focus-visible, .story-product a:focus-visible { outline:2px solid #315956; outline-offset:2px; }
.story-guide { border-top:1px solid #cfd5ca; padding-top:29px; scroll-margin-top:83px; }
.guide-heading { display:flex; gap:44px; align-items:center; justify-content:space-between; margin-bottom:20px; }
html[data-brand="mockrn"] .guide-heading h2 { font-size:27px; line-height:1.25; letter-spacing:-.025em; margin:0; }
.guide-heading h2 span { color:#315956; }
.guide-heading > p { margin:0; max-width:440px; font-size:14px; line-height:1.6; color:#626960; }
.story-guide .guide-expander { scroll-margin-top:83px; }
.story-guide .guide-expanded-body { max-width:850px; }
.story-guide .guide-expanded-body .kv { margin-top:20px; }
.story-guide .guide-expanded-body .comp-def { margin-top:0; }
.story-close { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:48px; margin:32px 0 8px; padding:30px; border-radius:14px; background:#e5e9de; }
html[data-brand="mockrn"] .story-close h2 { font-size:28px; line-height:1.2; margin:0 0 22px; color:#315956; letter-spacing:-.025em; }
.story-close .ab-kicker { font-size:9px; }
.story-close .ab-reassurance { margin-bottom:0; }
.story-complete { border-left:1px solid #c7d0c3; padding-left:30px; }
.story-complete .product-label { margin-top:0; }
.story-complete > p:not(.product-label):not(.complete-note):not(.complete-price) { font-size:14px; line-height:1.6; color:#4c5f50; }
.complete-price { font-size:12px; color:#4c5f50; margin:18px 0 12px; }.complete-price strong { font-size:28px; color:#315956; margin-right:5px; }
.story-complete > a { color:#315956; font-size:13px; font-weight:600; text-underline-offset:4px; }
.complete-note { font-size:10px; color:#626d63; margin:12px 0 0; line-height:1.5; }
@media(max-width:760px) {
 .story-hero { grid-template-columns:1fr; gap:24px; padding-bottom:28px; }
 html[data-brand="mockrn"] .story-hero h1 { font-size:35px; }
 .story-hero .ab-deck { font-size:15px; }
 .product-top { padding:12px 16px; }.product-stage { padding:19px 18px 0; }
 .product-stage > div { min-height:355px; }
 html[data-brand="mockrn"] .story-product h2 { font-size:23px; }
 .product-tabs { padding:8px; }.product-tabs button { font-size:10px; }
 .product-caption { font-size:8px; padding:10px 12px 12px; }
 .guide-heading { display:block; }.guide-heading > p { margin-top:12px; }
 html[data-brand="mockrn"] .guide-heading h2 { font-size:25px; }
 .story-guide .guide-expanded-body .kv { grid-template-columns:1fr; gap:6px; }
 .story-close { grid-template-columns:1fr; gap:22px; padding:23px 20px; }
 html[data-brand="mockrn"] .story-close h2 { font-size:25px; }
 .story-complete { border-left:none; padding:22px 0 0; border-top:1px solid #c7d0c3; }
}
/* Proposed live-practice journey. All recordings/results are explicitly simulated. */
.practice-preview { min-width:0; }
.review-controls { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; font-size:10px; color:#677168; margin:0 2px 10px; }
.review-controls label { display:flex; align-items:center; gap:6px; }
.review-controls select { max-width:175px; font:inherit; border:1px solid #cbd3c7; border-radius:5px; padding:5px; background:#f7f5ed; color:#315956; }
#try-question { scroll-margin-top:82px; }
.practice-content { padding:23px 24px 8px; }
.practice-content > .product-label:first-child { margin-top:0; }
.practice-content .practice-hint { margin:15px 0 20px; font-size:14px; }
a.practice-primary { text-decoration:none; box-sizing:border-box; }
.practice-primary { display:flex; align-items:center; justify-content:space-between; gap:14px; width:100%; border:none; padding:15px 17px; border-radius:8px; background:#315956; color:#fffaf1; font:600 14px/1.4 Geist,sans-serif; text-align:left; cursor:pointer; min-height:50px; }
.practice-primary:hover { background:#264b48; }
.practice-secondary { display:block; margin:0; padding:15px 0 4px; background:none; border:none; font:500 12px/1.5 Geist,sans-serif; color:#315956; text-decoration:underline; text-underline-offset:4px; cursor:pointer; text-align:left; }
.mic-note,.offer-note { font-size:10px; line-height:1.6; color:#677168; margin:10px 0 4px; }
.practice-content h3 { color:#315956; font-size:13px; line-height:1.4; margin:0 0 6px; }
.feedback-point p { font-size:14px; line-height:1.55; color:#536253; margin:0; }
.practice-content .product-feedback { margin:14px 0; }
.practice-content .product-feedback p { font-size:14px; line-height:1.55; }
.practice-transcript { margin:8px 0 15px; }
.practice-transcript summary { cursor:pointer; display:flex; justify-content:space-between; gap:14px; font-size:11px; line-height:1.5; color:#61705f; padding:8px 0; list-style:none; }
.practice-transcript summary::-webkit-details-marker { display:none; }
.practice-transcript[open] summary span { transform:rotate(45deg); }
.practice-transcript blockquote { font-size:13px; line-height:1.6; margin:6px 0 12px; color:#596857; }
.recording-status { display:flex; align-items:center; gap:10px; background:#f4e7de; border:1px solid #e4cbbd; border-radius:8px; padding:18px; font-size:13px; margin-top:22px; }
.recording-status > span:last-child { margin-left:auto; font-variant-numeric:tabular-nums; }
.record-dot { width:8px; height:8px; background:#c16c55; border-radius:50%; }
.retry-reminder { border-left:3px solid #8ca28a; padding:0 0 0 15px; margin:22px 0; font-size:13px; color:#4c6251; }
.retry-reminder p { line-height:1.55; margin:7px 0 0; }
.processing-line { height:4px; background:linear-gradient(90deg,#315956 40%,#e3e9dc 40%); border-radius:4px; margin:30px 0; }
.answer-change { display:grid; grid-template-columns:1fr 1.5fr; border:1px solid #dce2d6; border-radius:8px; overflow:hidden; margin:18px 0 14px; }
.answer-change > div { padding:13px; background:#f2f1e9; }
.answer-change > div+div { background:#e8efdf; }
.answer-change span { display:block; font-size:10px; font-weight:650; color:#65755e; margin-bottom:8px; }
.answer-change blockquote { margin:0; font-size:14px; line-height:1.5; color:#385541; }
.change-meaning,.remaining-focus { font-size:13px; line-height:1.6; color:#50644f; margin:12px 0; }
.remaining-focus { color:#6b6f5b; }
.both-transcripts { display:flex; gap:20px; }
.both-transcripts details { flex:1; }
.panel-invite { border-top:1px solid #dce2d6; padding-top:14px; margin-top:16px; }
a.practice-link { text-align:center; }
.practice-link { display:block; width:100%; margin-top:10px; border:0; background:none; padding:6px 0; font:500 12px/1.5 Geist,sans-serif; color:#315956; text-decoration:underline; text-underline-offset:3px; cursor:pointer; text-align:left; }
.panel-invite > h3 { font-size:17px; letter-spacing:-.02em; }
.panel-invite > p { font-size:12px; line-height:1.6; color:#60705b; margin:8px 0 14px; }
.panel-invite > .offer-note { font-size:10px; margin-bottom:0; }
.embedded-handoff { font-size:13px; line-height:1.55; color:#50644f; margin:0 0 12px; }
.free-panel-card { padding:17px; background:#edf1e7; border-radius:8px; margin:20px 0; }
.free-panel-card > span { font-size:10px; color:#64755d; }.free-panel-card h3 { font-size:17px; margin:8px 0; }
.free-panel-card p { font-size:13px; line-height:1.6; color:#52654d; margin:0; }
.paid-context { padding-top:18px; margin-top:15px; border-top:1px solid #dce2d6; font-size:12px; color:#50644f; }
.paid-context p { line-height:1.6; margin:7px 0; }.paid-context a { color:#315956; font-size:11px; text-underline-offset:4px; }
.preview-explanation { padding:12px; border:1px dashed #acbba2; border-radius:6px; font-size:12px; line-height:1.5; color:#617159; }
@media(max-width:760px) {
 .practice-content { padding:20px 18px 8px; }
 .practice-primary { font-size:13px; padding:14px; }
 .answer-change { grid-template-columns:1fr; }
 .answer-change > div { padding:12px 14px; }
 .both-transcripts { display:block; }.both-transcripts details { margin-bottom:0; }
}
.auth-divider { display:flex; align-items:center; gap:10px; font-size:10px; color:#7a8276; margin:17px 0; }
.auth-divider::before,.auth-divider::after { content:''; height:1px; flex:1; background:#dfe4d8; }
.mock-auth-fields { display:grid; gap:12px; margin-bottom:17px; }
.mock-auth-fields label { display:block; color:#50634f; font-size:11px; }
.mock-auth-fields input { box-sizing:border-box; width:100%; display:block; margin-top:6px; padding:11px 13px; border:1px solid #d3dbcb; border-radius:7px; background:#f8f8f1; color:#8a9183; font:13px/1.4 Geist,sans-serif; }
.practice-preview { scroll-margin-top:82px; }
.practice-content h2:focus { outline:none; }

/* Make the in-page interview the hero's single primary invitation. */
.practice-launch { background:#e5826b; color:#253b33; font-size:15px; min-height:56px; }
.practice-launch:hover { background:#ee937e; }
.practice-launch > span:first-of-type { flex:1; }
.practice-launch svg { flex-shrink:0; }
@media(max-width:760px) { .practice-launch { font-size:14px; } }
/* One continuation section: reference questions alongside the next practice options. */
.story-next { padding-top:29px; margin-bottom:35px; }
html[data-brand="mockrn"] .next-heading h2 { margin:0 0 12px; font-size:32px; line-height:1.2; letter-spacing:-.03em; color:#315956; }
.next-heading > p { margin:0; max-width:710px; font-size:15px; line-height:1.6; color:#626960; }
.preparation-layout { display:grid; grid-template-columns:1.35fr 1fr; gap:44px; margin-top:28px; align-items:start; }
.question-library > h3 { font-size:13px; color:#4c6254; margin:0 0 15px; font-weight:650; }
.preparation-next { background:#f6f5ec; border:1px solid #d7dece; border-radius:12px; padding:23px; }
.preparation-next h3 { font-size:22px; line-height:1.22; letter-spacing:-.025em; color:#315956; margin:0 0 12px; }
.preparation-next .product-label { margin:0 0 10px; font-size:9px; }
.preparation-next p:not(.product-label):not(.offer-note):not(.complete-price) { font-size:13px; line-height:1.6; color:#5b6a55; margin:0 0 17px; }
.preparation-next .next-panel-button { min-height:46px; padding:12px 15px; font-size:13px; }
.next-complete { margin-top:22px; border-top:1px solid #d1dac9; padding-top:21px; }
.preparation-next .next-complete h3 { font-size:19px; }
.next-complete .complete-price { margin:0 0 10px; }.next-complete .complete-price strong { font-size:25px; }
.next-complete > a { font-size:12px; color:#315956; text-underline-offset:4px; font-weight:600; }
.story-next .guide-expander summary { padding:15px 0; font-size:14px; }
@media(max-width:760px) {
 html[data-brand="mockrn"] .next-heading h2 { font-size:27px; }
 .next-heading > p { font-size:14px; }
 .preparation-layout { grid-template-columns:1fr; gap:24px; margin-top:24px; }
 .preparation-next { padding:21px; }
}
/* Live interview conventions from app.html + Warm Stone brand: speaker, bubble, mic dock. */
.story-product.interview-surface { background:linear-gradient(155deg,#335e5a 0%,#294b49 58%,#244340 100%); border-color:#456b66; box-shadow:0 20px 45px #294b4930; }
.interview-surface .product-top { background:rgba(28,59,57,.72); border-color:#ffffff1a; color:#fffaf4; }
.interview-surface .product-top > span { color:#bdd2cb; font-size:9px; }
.interview-surface .practice-content { padding:0; }
.embedded-feed { padding:16px 20px; }
.story-product .embedded-speaker { margin:0 0 8px; color:#c3d8cf; font-size:12px; font-weight:500; }
.embedded-question { padding:14px; color:#fffaf4; font-size:18px; line-height:1.45; font-weight:400; background:rgba(31,66,63,.78); border:1px solid #ffffff1f; border-radius:4px 16px 16px; box-shadow:0 12px 28px #19363420; }
.embedded-question:focus { outline:none; }
.embedded-dock { padding:14px 20px; border-top:1px solid #ffffff1a; background:rgba(28,59,57,.72); }
.story-product .embedded-status { color:#ccded6; font-size:12px; text-align:center; margin:0 0 12px; }
.embedded-mic { display:flex; align-items:center; justify-content:center; gap:12px; min-height:52px; min-width:220px; max-width:100%; margin:0 auto; border:0; border-radius:999px; padding:10px 22px; background:#e5826b; color:#303534; box-shadow:0 10px 25px #e5826b22; cursor:pointer; font:600 15px/1.4 Geist,sans-serif; }
.embedded-mic:hover { background:#ee937e; }
.embedded-mic svg { width:26px; height:26px; flex-shrink:0; }
.embedded-mic.recording { background:#edaf9c; }
.embedded-timer { font-size:12px; font-variant-numeric:tabular-nums; }
.answer-mode-actions { display:flex; align-items:center; justify-content:center; gap:9px; width:100%; max-width:380px; margin:0 auto; }
.answer-mode-actions .embedded-mic { flex:1 1 auto; width:auto; min-width:0; max-width:none; margin:0; }
.embedded-type { flex:0 0 auto; min-height:42px; padding:9px 12px; border:1px solid #ffffff38; border-radius:999px; background:transparent; color:#d8e7e1; font:600 11px/1.3 Geist,sans-serif; white-space:nowrap; cursor:pointer; }
.embedded-type:hover { border-color:#ffffff66; background:#ffffff0d; color:#fffaf4; }
.embedded-type:disabled { opacity:.5; cursor:default; }
.embedded-dock .practice-secondary { margin:8px auto 0; color:#b9cec4; font-size:10px; padding:10px 0 3px; }
.interview-surface .product-caption { background:rgba(28,59,57,.72); color:#a9c2b8; padding-top:3px; }
.story-product .embedded-focus { font-size:12px; line-height:1.6; color:#c9ded2; margin:17px 0 0; }
@media(max-width:760px) {
 .interview-surface .product-top { gap:10px; }.interview-surface .product-top > span { max-width:150px; text-align:right; line-height:1.5; }
 .embedded-feed { padding:14px 16px; }.embedded-question { padding:12px; font-size:17px; }
 .embedded-dock { padding:12px 16px; }.embedded-mic { min-width:220px; font-size:14px; }
}

.embedded-mic:disabled { opacity:.55; cursor:default; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
/* Typed-answer alternative (flagged: INLINE_TEXT_ANSWERS) on the dark embedded dock. */
.embedded-dock .practice-link { color:#bdd2cb; text-align:center; }
.inline-type-form { display:grid; gap:10px; }
.inline-type-form textarea { box-sizing:border-box; width:100%; min-height:120px; padding:12px 14px; border:1px solid rgba(52,73,71,.22); border-radius:8px; background:#f5ede4; color:#303534; caret-color:#315956; box-shadow:inset 0 1px 2px #1936340d; font:14px/1.5 Geist,sans-serif; resize:vertical; }
.inline-type-form textarea::placeholder { color:#69716e; opacity:1; }
.inline-type-form textarea:focus { border-color:#e5826b; outline:2px solid #f1ab95; outline-offset:2px; }
@media(max-width:760px) {
 .inline-type-form textarea { min-height:100px; }
}
.inline-account-lead { font-size:14px; line-height:1.5; color:#4c5f50; margin:8px 0 16px; }
.inline-account-form { display:grid; gap:12px; margin:0; }
.inline-account-form label { display:grid; gap:5px; }
.inline-account-form label > span { font-size:12px; font-weight:600; color:#303c36; }
.inline-account-form input { box-sizing:border-box; width:100%; padding:10px 12px; border:1px solid #c9d4ca; border-radius:8px; background:#fff; color:#303c36; font:14px/1.4 Geist,sans-serif; min-height:40px; }
.inline-account-form input:focus { outline:2px solid #315c56; outline-offset:2px; }
.inline-account-form small { font-size:11px; line-height:1.45; color:#6b7770; }
.inline-account-form .practice-primary { margin-top:4px; }
.inline-gbtn + .auth-divider { margin:14px 0; }
.inline-gbtn { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; box-sizing:border-box; padding:11px 14px; min-height:44px; border:1px solid #c9d4ca; border-radius:8px; background:#fff; color:#303c36; font:500 14px/1.4 Geist,sans-serif; text-decoration:none; cursor:pointer; }
.inline-gbtn:hover { border-color:#315956; }
.inline-gbtn svg { display:block; flex:0 0 auto; }
.inline-account-links { display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; margin:14px 0 0; }
.inline-account-links .practice-secondary { padding:2px 0; font-size:12px; }
.inline-account-dot { color:#9aa59e; font-size:12px; }
.inline-promo-price { display:flex; align-items:baseline; flex-wrap:wrap; gap:9px; margin:10px 0 7px; color:#315956; }
.inline-promo-price s { color:#7b837d; font-size:14px; }
.inline-promo-price strong { font-size:23px; }
.inline-panel-link { display:table; }

.practice-level-line,.level-picker { display:flex; align-items:center; gap:12px; margin:0 0 14px; color:#d8e7e1; font-size:12px; }
.practice-level-line strong { font-size:14px; color:#fffaf4; font-weight:600; }
/* Same cfg2 control geometry and Warm Stone colors as the standard interview setup. */
.level-picker .cfg2-label { flex-shrink:0; font-size:10px; letter-spacing:.1em; text-transform:uppercase; font-weight:600; }
.level-control { position:relative; width:220px; max-width:100%; min-width:0; }
.level-picker .cfg2-dd { box-sizing:border-box; width:100%; display:flex; align-items:center; justify-content:space-between; min-height:32px; padding:5px 10px; border:.5px solid rgba(52,73,71,.16); border-radius:8px; font:400 13px/1.4 Geist,sans-serif; background:#f5ede4; color:#49504e; cursor:pointer; text-align:left; }
.level-picker .cfg2-chev { color:#69716e; font-size:11px; flex:0 0 auto; padding-left:8px; }
.level-picker .cfg2-panel { position:absolute; z-index:5; top:calc(100% + 4px); left:0; right:0; border:.5px solid rgba(52,73,71,.16); border-radius:8px; padding:5px; display:flex; flex-direction:column; gap:1px; background:#f5ede4; box-shadow:0 10px 24px #19363426; }
.level-picker .cfg2-panel[hidden] { display:none; }
.level-picker .cfg2-opt { display:flex; align-items:center; justify-content:space-between; gap:9px; padding:9px; min-height:36px; border:0; font:400 13px/1.4 Geist,sans-serif; color:#69716e; cursor:pointer; border-radius:6px; background:transparent; text-align:left; }
.level-picker .cfg2-opt:hover,.level-picker .cfg2-opt:focus-visible { background:rgba(70,126,120,.07); color:#303534; }
.level-picker .cfg2-opt.on { font-weight:500; color:#303534; }
.level-picker .cfg2-opt .ck { color:#467e78; font-size:13px; }
.level-picker .cfg2-dd:focus-visible { outline:2px solid #f1ab95; outline-offset:3px; }
.level-picker .cfg2-dd:disabled { cursor:default; opacity:.7; }
.embedded-dock .practice-transcript { margin:4px 0 0; }
.embedded-dock .practice-transcript summary { justify-content:center; color:#d8e7e1; padding:6px 0; text-decoration:underline; text-underline-offset:3px; }
.embedded-dock .practice-transcript[open] { margin-bottom:10px; }
.embedded-dock .offer-note { margin:6px 0 0; color:#bdd2cb; text-align:center; }
.embedded-status:empty { display:none; }
/* Facebook/Instagram in-app browser: note under the button from the start, quiet last-resort
   line if the escape-to-browser tap doesn't leave the page. Styled to read as a warning
   (coral, the pane's own accent color) rather than blend in with the rest of the dock. */
.embedded-inapp-note { margin:12px 0 4px; padding:10px 12px; border-radius:8px; border-left:3px solid #e5826b; background:rgba(229,130,107,.18); color:#f6e2da; font-size:13px; line-height:1.5; text-align:left; }
.embedded-inapp-fallback { margin:12px 0 0; }
.embedded-inapp-fallback .practice-hint { color:#d8e7e1; }
.embedded-inapp-fallback .practice-link { min-height:44px; margin-top:4px; }
.embedded-inapp-fallback [role="status"]:empty { display:none; }
.feedback-scope { font-size:13px; line-height:1.5; color:#536253; }
.feedback-evidence { list-style:none; padding:0; margin:18px 0; }
.feedback-evidence li { border-left:2px solid #afc1ae; padding-left:12px; margin:16px 0; }
.feedback-evidence blockquote { margin:6px 0 0; font-size:13px; line-height:1.55; color:#536253; }
#practice-content .pq-sr.neutral { background:#f5f4f2; }
#practice-content .pq-sr.neutral .pq-sk,
#practice-content .pq-sr.neutral .pq-sv { color:var(--dim); }
#practice-content details.pq-explanation { border:0; border-radius:0; margin:0; padding:0; background:none; }
#practice-content details.pq-explanation > summary { display:block; padding:0; font:inherit; color:inherit; cursor:pointer; list-style:none; }
#practice-content details.pq-explanation > summary::-webkit-details-marker { display:none; }
#practice-content details.pq-explanation[open] > summary { border:0; margin:0 0 8px; }
#practice-content .pq-excerpt { display:block; cursor:text; }
#practice-content .pq-expand,
#practice-content .pq-collapse { color:#315956; text-decoration:underline; text-underline-offset:3px; font-size:12px; font-weight:500; }
#practice-content .pq-expand { display:inline-block; margin-top:8px; }
#practice-content .pq-collapse { display:none; }
#practice-content .pq-explanation[open] .pq-excerpt,
#practice-content .pq-explanation[open] .pq-expand { display:none; }
#practice-content .pq-explanation[open] .pq-collapse { display:inline; }
#practice-content details.pq-explanation > summary:focus-visible { outline:2px solid #315956; outline-offset:5px; border-radius:3px; }
.story-product .embedded-status { display:flex; align-items:center; justify-content:center; gap:12px; min-height:30px; }
.listening-bars { display:flex; align-items:center; gap:3px; height:28px; }
.listening-bars i { display:block; width:3px; height:3px; background:#c3d8cf; border-radius:3px; transition:height 80ms linear; }
@media(prefers-reduced-motion:reduce) { .listening-bars i { transition:none; } }
.embedded-mic-hint { margin:-4px 0 12px; color:#edaf9c; font-size:12px; text-align:center; }

.processing-dots { display:inline-flex; width:1em; margin-left:.05em; }
.processing-dots > span { animation:feedback-dot 1.2s ease-in-out infinite; }
.processing-dots > span:nth-child(2) { animation-delay:.15s; }
.processing-dots > span:nth-child(3) { animation-delay:.3s; }
@keyframes feedback-dot { 0%,60%,100% { opacity:.3; transform:translateY(0); } 30% { opacity:1; transform:translateY(-2px); } }
@media(prefers-reduced-motion:reduce) { .processing-dots > span { animation:none; opacity:1; transform:none; } }

/* Startup failures belong beside the microphone, with readable contrast. */
.practice-error { margin:0 0 12px; padding:12px 14px; border:1px solid #dfaa97; border-radius:8px; background:#fff0e9; color:#723b2b; font-size:13px; line-height:1.5; }
/* Feedback vote, same thumbs as the panel debrief card. */
.inline-vote { margin:14px 0 4px; }
.inline-vote-row { display:flex; align-items:center; justify-content:flex-end; gap:4px; font-size:12px; color:#626b63; }
.inline-vote-row > span { margin-right:4px; }
.inline-vote-btn { width:28px; height:26px; display:inline-flex; align-items:center; justify-content:center; padding:0; border:1px solid transparent; border-radius:7px; background:none; color:#737b78; cursor:pointer; }
.inline-vote-btn svg { width:15px; height:15px; fill:currentColor; }
.inline-vote-btn.down svg { transform:rotate(180deg); }
.inline-vote-btn:hover { color:#3f716c; background:rgba(70,126,120,.08); }
.inline-vote-btn[aria-pressed="true"] { color:#355f5b; background:rgba(70,126,120,.1); border-color:rgba(70,126,120,.2); }
.inline-vote-btn.down[aria-pressed="true"] { color:#bd624f; background:rgba(229,130,107,.1); border-color:rgba(229,130,107,.2); }
.inline-vote-form { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:8px; font-size:12px; color:#626b63; }
.inline-vote-form input { flex:1 1 180px; min-width:0; padding:7px 9px; border:1px solid rgba(52,73,71,.22); border-radius:7px; font:400 13px/1.4 Geist,sans-serif; color:#303534; caret-color:#315956; background:#f5ede4; }
.inline-vote-form input:focus { border-color:#e5826b; outline:2px solid #f1ab95; outline-offset:2px; }
.inline-vote-form .practice-secondary { padding:0; }
.inline-vote-thanks { margin:6px 0 0; text-align:right; font-size:12px; color:#626b63; }

/* Progressive reveal: frame first, text typed in as each guarded section lands. */
.fx-frame{animation:fxin .35s ease-out}@keyframes fxin{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.sk{display:block;height:.85em;margin:.4em 0;border-radius:6px;background:linear-gradient(90deg,rgba(0,0,0,.07),rgba(0,0,0,.12),rgba(0,0,0,.07));background-size:200% 100%;animation:skm 1.3s linear infinite}
.sk-h{height:1.5em;width:72%}.sk-l{width:100%}.sk-l.short{width:56%}.sample-row.pending .sample-after .sk{width:80%}
@keyframes skm{0%{background-position:200% 0}100%{background-position:-200% 0}}
.fx-in{animation:fxin .3s ease-out}.fx-steps{list-style:none;display:flex;gap:1.2em;padding:0;margin:.8em 0 0;font-size:.85em;opacity:.75}.fx-steps li::before{content:'○ ';}.fx-steps li.now::before{content:'◔ ';}.fx-steps li.done::before{content:'● ';}.fx-steps li.now{font-weight:600;opacity:1}

/* Keep native consent-link ink when the practice card sits inside an article. */
.story-product .embedded-dock .offer-note a { color:inherit; }

/* Compact value reminder on signup, independent of authentication form behavior. */
.free-account-benefits{margin:0 0 20px;text-align:left;font-size:13px;line-height:1.55;color:#49504e}
.free-account-benefits p{margin:0 0 10px}
.free-account-benefits ul{margin:0 0 12px;padding-left:19px}
.free-account-benefits li{margin:0 0 6px}
.free-account-benefits[hidden],.free-account-benefits.hidden{display:none!important}