/* Scoped to the new private TEST pages. Existing v8 styles and routes are untouched. */
.commerce-page { background:#08161f; }
.commerce-page [hidden] { display:none!important; }
.commerce-page .commerce-test-notice { text-align:center; font-size:11px; line-height:1.6; color:#d9c5a4; }
.commerce-main { max-width:1172px; margin:0 auto; padding:0 32px 44px; }
.commerce-intro { max-width:770px; padding:58px 0 38px; }
.commerce-intro .eyebrow { color:#c8d1ca; margin-bottom:20px; }
.commerce-intro h1 { font-size:clamp(40px,5vw,66px); line-height:1.08; margin-bottom:22px; }
.commerce-intro>p:not(.eyebrow) { max-width:650px; font-size:16px; line-height:1.75; color:#c8d2cf; }
.commerce-intro>p.commerce-small { font-size:13px; margin-top:14px; }
.commerce-intro .text-link { margin-top:20px; }
.commerce-panel { padding:32px; background:#112630; border:1px solid #d6c4a33d; border-radius:24px; margin-bottom:28px; }
.commerce-panel h2,.commerce-section h2,.commerce-help-link h2 { font-size:clamp(29px,3.2vw,38px); line-height:1.15; letter-spacing:-.035em; margin:8px 0 18px; }
.commerce-panel p,.commerce-book-card p,.commerce-purchase-card p,.commerce-help-link p { font-size:15px; line-height:1.75; color:#cad3cf; }
.commerce-panel p.eyebrow,.commerce-book-card p.eyebrow,.commerce-purchase-card p.eyebrow { font-size:10px; line-height:1.7; color:#c5cfc8; }
.commerce-panel p.commerce-small,.commerce-small { font-size:12px; line-height:1.7; color:#b9c7c4; }
.commerce-session { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:40px; }
.commerce-session-actions { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:10px; }
.commerce-session .commerce-status,.commerce-session #rotation-note { grid-column:1/-1; margin-top:18px; }
.commerce-status { font-size:14px; line-height:1.7; color:#d6dcd5; min-height:24px; }
.commerce-status[data-tone="error"] { color:#efd3b2; }
.commerce-status:empty { display:none; }
.commerce-return-note { border-left:2px solid #ccb18a; padding-left:16px; margin-top:24px; }
.commerce-page .button { min-height:50px; font-size:13px; line-height:1.5; gap:18px; touch-action:manipulation; text-align:left; }
.commerce-page button:disabled { opacity:.5; cursor:not-allowed; transform:none; }
.commerce-page .button:disabled:hover { background:var(--paper); }
.commerce-quiet-button { min-height:48px; padding:10px 0; border:0; background:none; color:#e4d0ac; font-size:13px; line-height:1.5; text-align:left; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px; }
.commerce-quiet-button span { margin-left:12px; font-size:18px; }
.commerce-outline-button { background:transparent; border:1px solid #cdb7927d; color:#f2efe6; }
.commerce-outline-button:hover { background:#ffffff0c; }
.commerce-inline-actions { display:flex; flex-wrap:wrap; gap:12px; margin:20px 0 14px; }
.commerce-code-panel { background:#203439; border-color:#d6c4a37a; }
.commerce-recovery-code { display:block; background:#08161f; color:#f1e8d2; padding:20px; border-radius:12px; margin:20px 0 0; font-size:clamp(15px,2vw,19px); line-height:1.7; overflow-wrap:anywhere; user-select:all; }
.commerce-section { margin:44px 0; }
.commerce-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:28px; margin-bottom:18px; }
.commerce-section-heading h2 { margin-bottom:0; }
.commerce-section-heading .eyebrow { color:#c5cfc8; }
.commerce-section>.commerce-small { margin-top:18px; max-width:720px; }
.commerce-purchase-list { display:grid; gap:18px; margin-top:20px; }
.commerce-purchase-card { padding:26px 30px; border:1px solid #d6c4a343; border-radius:20px; background:#112630; }
.commerce-purchase-card h3 { font-size:30px; line-height:1.2; margin:10px 0 12px; }
.commerce-purchase-card .commerce-version { font-size:12px; color:#b9c7c4; margin-bottom:16px; }
.commerce-format-actions { display:flex; gap:12px; flex-wrap:wrap; margin:20px 0 12px; }
.commerce-download-links { display:flex; flex-wrap:wrap; gap:16px; margin-top:16px; }
.commerce-download-links .text-link { font-size:14px; }
.commerce-book-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:22px; }
.commerce-book-card { padding:26px; border-radius:22px; border:1px solid #d6c4a33d; background:#112630; display:flex; align-items:flex-start; flex-direction:column; }
.commerce-book-card h3 { font-size:31px; line-height:1.15; margin:16px 0 22px; }
.commerce-book-card .text-link { margin-top:auto; font-size:12px; }
.commerce-book-card .button { width:100%; margin-top:22px; }
.commerce-recover-panel { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.85fr); gap:26px 42px; }
.commerce-recover-panel form { display:grid; gap:12px; align-content:start; }
.commerce-recover-panel label { font-size:13px; line-height:1.5; }
.commerce-recover-panel input { width:100%; min-width:0; min-height:52px; padding:14px; font:inherit; font-size:16px; color:#f2efe6; background:#08161f; border:1px solid #a9b8ae8a; border-radius:8px; }
.commerce-recover-panel input:focus-visible { outline:3px solid var(--copper); outline-offset:3px; }
.commerce-recover-panel input:disabled { opacity:.5; }
.commerce-recover-panel .commerce-status { grid-column:1/-1; }
.commerce-help-link { display:flex; gap:24px; align-items:flex-start; border-top:1px solid #d6c4a343; padding:30px 0 10px; margin-top:38px; }
.commerce-help-link>span { color:#d5b582; font-size:27px; margin-top:6px; }
.commerce-help-link h2 { font-size:30px; margin-top:0; }
.commerce-help-link .text-link { margin-top:12px; }
.reading-main { max-width:1000px; }
.reading-main .commerce-intro { max-width:720px; }
.reading-panel { padding:34px 38px; }
.reading-panel>p { max-width:760px; margin-bottom:16px; }
.reading-panel>.button { margin-top:8px; }
.reading-steps { margin:24px 0 20px; padding-left:24px; max-width:760px; }
.reading-steps li { padding-left:10px; font-size:16px; line-height:1.8; color:#d3dcd6; margin:14px 0; }
.reading-steps li::marker { color:#dec49e; font-family:var(--serif); font-size:23px; }
.reading-source-links { display:flex; flex-wrap:wrap; column-gap:28px; row-gap:8px; }
.reading-source-links .text-link { font-size:12px; }
.reading-inline-link { color:#f2dfbb; text-decoration:underline; text-underline-offset:4px; }
@media(max-width:1000px) { .commerce-book-grid { gap:14px; } .commerce-book-card { padding:22px; } .commerce-book-card h3 { font-size:28px; } .commerce-session { grid-template-columns:1fr; } .commerce-session-actions { margin-top:22px; } }
@media(max-width:740px) {
  .commerce-main { padding:0 20px 24px; }
  .commerce-intro { padding:36px 4px 28px; }
  .commerce-intro h1 { font-size:40px; }
  .commerce-intro>p:not(.eyebrow) { font-size:16px; }
  .commerce-panel,.reading-panel { padding:26px 24px; border-radius:22px; margin-bottom:24px; }
  .commerce-session,.commerce-recover-panel { display:block; }
  .commerce-panel h2,.commerce-section h2 { font-size:30px; }
  .commerce-session-actions { margin-top:22px; }
  .commerce-session-actions .button { width:100%; }
  .commerce-section { margin:34px 0; }
  .commerce-section-heading { display:block; }
  .commerce-section-heading>.commerce-small { margin-top:16px; }
  .commerce-section-heading .commerce-quiet-button { margin-top:10px; }
  .commerce-book-grid { grid-template-columns:1fr; gap:16px; }
  .commerce-book-card { padding:26px 24px; }
  .commerce-book-card h3 { font-size:31px; }
  .commerce-purchase-card { padding:26px 24px; }
  .commerce-format-actions { flex-direction:column; }
  .commerce-format-actions .button { width:100%; }
  .commerce-inline-actions { flex-direction:column; }
  .commerce-inline-actions .button { width:100%; }
  .commerce-download-links { flex-direction:column; align-items:flex-start; }
  .commerce-recovery-code { padding:16px; }
  .commerce-recover-panel form { margin-top:24px; }
  .commerce-recover-panel .commerce-status { margin-top:18px; }
  .commerce-help-link { gap:16px; padding-top:26px; }
  .commerce-help-link h2 { font-size:28px; }
  .reading-steps { padding-left:21px; }
  .reading-steps li { padding-left:6px; }
}
@media(max-width:359px) { .commerce-main { padding-left:16px; padding-right:16px; } .commerce-panel,.reading-panel,.commerce-purchase-card,.commerce-book-card { padding-left:20px; padding-right:20px; } .commerce-intro h1 { font-size:36px; } }
@media(prefers-reduced-motion:reduce) { .commerce-page .button { transition:none; } .commerce-page .button:hover { transform:none; } }
