/* Exact approved preview styles, isolated from the shared public shell. */
@font-face{
  font-family: Inter;
  src: url("assets/fonts/test-series-inter/Inter-Variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
#detailsPage{
  --navy: #0f285f;
  --blue: #1769ff;
  --muted: #475467;
  --border: #dce5f2;
  --bg: #f5f7fb;
}
#detailsPage *{ box-sizing: border-box; }
#detailsPage{
  margin: 0; background: var(--bg); color: #344054;
  font-family: Inter, Arial, sans-serif; font-size: 14px;
  font-weight: 400; line-height: 1.5; font-optical-sizing: auto;
}
#detailsPage button, #detailsPage input, #detailsPage select{ font: inherit; }
#detailsPage button, #detailsPage a, #detailsPage input, #detailsPage select, #detailsPage summary{ -webkit-tap-highlight-color: transparent; }
#detailsPage button, #detailsPage a{ transition: background .15s, color .15s; }
#detailsPage button{ cursor: pointer; }
#detailsPage button:disabled{ cursor: default; }
#detailsPage a{ color: inherit; text-decoration: none; }
#detailsPage button:focus-visible, #detailsPage a:focus-visible, #detailsPage input:focus-visible, #detailsPage select:focus-visible, #detailsPage summary:focus-visible{ outline: 3px solid #93b7ff; outline-offset: 3px; }
#detailsPage .preview-label{ background: #edf3ff; color: var(--blue); border: 1px solid var(--border); border-radius: 6px; padding: 5px 12px; font-size: 12px; }
#detailsPage{ max-width: 1280px; margin: auto; padding: 0 24px; }
#detailsPage .breadcrumb{ font-size: 12px; color: #66758f; margin: 25px 0 18px; }
#detailsPage .breadcrumb span{ padding: 0 10px; color: #9cabc0; }
#detailsPage .hero{ display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 22px; }
#detailsPage .hero-content, #detailsPage .purchase, #detailsPage .panel{ background: white; border: 1px solid var(--border); border-radius: 12px; }
#detailsPage .hero-content{ --hero-logo-size: 56px; --hero-title-gap: 12px; padding: 32px 20px; }
#detailsPage .eyebrow{ font-size: 11px; letter-spacing: .45px; font-weight: 700; color: var(--blue); margin: 0 0 12px; }
#detailsPage .hero-badges{ display: flex; flex-wrap: wrap; align-items: center; gap: 4px 20px; margin: 3px 0 0; }
#detailsPage .hero-badges .eyebrow{ margin: 0; font-size: 11.5px; font-weight: 600; letter-spacing: 0; color: #475467; line-height: 18px; }
#detailsPage .tag{ letter-spacing: 0; background: #ecfbf2; color: #09833d; border-radius: 20px; padding: 5px 8px; font-size: 12px; font-weight: 700; }
#detailsPage .hero-badges .tag, #detailsPage .pattern-badge{ display: inline-flex; align-items: center; gap: 5px; min-height: 28px; padding: 4px 9px; border-radius: 6px; font-size: 11.5px; font-weight: 600; line-height: 18px; white-space: nowrap; }
#detailsPage .hero-badges .tag{ background: #edf9f2; color: #08783e; }
#detailsPage .pattern-badge{ background: #f2f4f7; color: #475467; }
#detailsPage .hero-updated{ display: inline-flex; align-items: center; gap: 6px; color: #667085; font-size: 11.5px; font-weight: 400; line-height: 18px; white-space: nowrap; }
#detailsPage .hero-updated i{ font-size: 11px; }
#detailsPage .hero-heading{ display: grid; grid-template-columns: var(--hero-logo-size) minmax(0,1fr); gap: var(--hero-title-gap); align-items: center; margin: 0 0 18px; }
#detailsPage .hero-identity{ min-width: 0; }
#detailsPage .hero-logo{ display: block; width: var(--hero-logo-size); height: var(--hero-logo-size); object-fit: contain; }
#detailsPage h1{ font-size: 24px; font-weight: 700; line-height: 1.3; letter-spacing: -.025em; margin: 0; color: var(--navy); }
#detailsPage .hero-title{ min-width: 0; max-width: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scrollbar-color: #b6c7e5 transparent; overscroll-behavior-x: contain; }
#detailsPage .hero-title h1{ width: max-content; max-width: none; white-space: nowrap; font-size: 26px; line-height: 1.2; letter-spacing: -.2px; }
#detailsPage .hero-title:focus-visible{ outline: 3px solid #93b7ff; outline-offset: 3px; }
#detailsPage h2{ font-size: 21px; font-weight: 700; line-height: 1.35; letter-spacing: -.02em; margin: 0; color: var(--navy); }
#detailsPage h3{ font-size: 16px; font-weight: 600; margin: 0 0 18px; color: var(--navy); }
#detailsPage .intro{ font-size: 14px; color: #344054; line-height: 1.65; max-width: 100%; margin: 0 0 15px; text-wrap: pretty; overflow-wrap: anywhere; }
#detailsPage .meta{ display: flex; flex-wrap: wrap; gap: 12px 20px; color: #344054; font-size: 12.5px; font-weight: 600; }
#detailsPage .meta span{ display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
#detailsPage .meta i{ color: var(--blue); font-size: 14px; }
#detailsPage .hero-inclusions{ margin: 18px 0 26px; padding-top: 14px; border-top: 1px solid var(--border); }
#detailsPage .hero-inclusions-heading{ display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
#detailsPage .hero-inclusions-heading h2{ font-size: 18px; font-weight: 600; line-height: 1.4; letter-spacing: -.15px; }
#detailsPage .hero-inclusions-heading h2 strong{ font-weight: 700; }
#detailsPage .hero-free-badge{ display: inline-flex; align-items: center; gap: 5px; padding: 3px 8px; border-radius: 5px; background: #07833f; color: #fff; font-size: 11.5px; font-weight: 600; line-height: 18px; white-space: nowrap; }
#detailsPage .hero-free-badge i{ font-size: 12px; }
#detailsPage .hero-inclusions-list{ display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 20px; list-style: none; margin: 10px 0 8px; padding: 0; }
#detailsPage .hero-inclusions-list li{ display: flex; align-items: baseline; gap: 8px; min-width: 0; padding: 4px 0; color: #344054; font-size: 14px; line-height: 1.5; }
#detailsPage .hero-inclusions-list li:nth-child(odd){ border-right: 1px solid var(--border); padding-right: 20px; }
#detailsPage .hero-inclusions-list li > span{ min-width: 0; overflow-wrap: anywhere; }
#detailsPage .hero-inclusions-list i, #detailsPage .hero-stage-summary i{ flex: 0 0 auto; color: #119653; font-size: 15px; }
#detailsPage .hero-inclusions-list strong{ margin-right: 3px; color: var(--navy); font-size: inherit; font-weight: 600; font-variant-numeric: tabular-nums; }
#detailsPage .hero-stage-summary{ display: flex; align-items: center; gap: 10px; margin: 0; padding-top: 13px; border-top: 1px solid var(--border); color: #344054; font-size: 13px; font-weight: 500; line-height: 1.6; }
#detailsPage .hero-content{ container: hero-summary / inline-size; }
@container hero-summary (max-width: 560px){
  #detailsPage .hero-inclusions-list{ grid-template-columns: 1fr; }
  #detailsPage .hero-inclusions-list li:nth-child(odd){ border-right: 0; padding-right: 0; }
  #detailsPage .hero-stage-summary{ font-size: 13px; }
}
@media(max-width: 700px){
  #detailsPage .hero-inclusions-heading{ gap: 8px 12px; }
}
@media(max-width: 440px){
  #detailsPage .hero-inclusions-list{ grid-template-columns: 1fr; gap: 0; }
  #detailsPage .hero-inclusions-list li:nth-child(odd){ border-right: 0; padding-right: 0; }
}
#detailsPage .hero-actions{ display: flex; gap: 12px; align-items: center; }
@media (min-width: 701px){
  #detailsPage .hero-actions{ padding-top: 12px; }
}
#detailsPage .primary, #detailsPage .secondary{ border-radius: 6px; padding: 11px 18px; font-weight: 700; text-align: center; display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 13px; }
#detailsPage .primary{ border: 1px solid var(--blue); background: var(--blue); color: white; }
#detailsPage .primary:hover{ background: #1058de; }
#detailsPage .secondary{ border: 1px solid #bdcde9; background: white; color: var(--navy); }
#detailsPage .secondary:hover{ background: #eef4ff; }
#detailsPage .small-note{ font-size: 11px; color: #66758f; margin: 13px 0 0; line-height: 1.6; }
#detailsPage .centered{ text-align: center; }
#detailsPage .purchase{ padding: 20px; }
#detailsPage .purchase .eyebrow{ color: #15803d; }
#detailsPage .purchase h2{ font-size: 18px; }
#detailsPage .price{ display: flex; align-items: baseline; gap: 10px; margin-top: 15px; }
#detailsPage .price strong{ font-size: 28px; font-weight: 700; line-height: 1.4; letter-spacing: -.03em; color: #071b4d; }
#detailsPage .price del{ color: #66758f; font-size: 12px; }
#detailsPage .saving{ font-size: 10px; color: #b42318; background: #fff3f3; border: 1px solid #ffc9c9; border-radius: 20px; padding: 2px 7px; font-weight: 700; }
#detailsPage .muted{ color: var(--muted); margin: 8px 0; font-size: 13px; }
#detailsPage .plans{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 18px 0; }
#detailsPage .plans button{ border: 1px solid var(--border); background: white; border-radius: 9px; padding: 12px 3px; color: #475467; font-size: 12px; font-weight: 700; }
#detailsPage .plans span{ display: block; font-size: 14px; font-weight: 700; color: var(--navy); margin-top: 5px; }
#detailsPage .plans button[aria-pressed=true]{ border-color: var(--blue); background: #eef6ff; color: #344054; }
#detailsPage .plans button[aria-pressed=true] span{ color: #155eef; }
#detailsPage .included{ padding-left: 19px; color: #344054; font-size: 12px; line-height: 2.1; margin: 0 0 18px; }
#detailsPage .included li::marker{ color: #16a34a; }
#detailsPage .full{ width: 100%; }
#detailsPage .benefits-strip{ display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); background: #fff; border: 1px solid var(--border); border-radius: 10px; margin-top: 18px; padding: 17px 0; }
#detailsPage .benefits-strip > div{ display: flex; align-items: center; gap: 12px; padding: 0 19px; border-right: 1px solid #e7edf5; }
#detailsPage .benefits-strip > div:last-child{ border: 0; }
#detailsPage .benefit-icon{ display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: #eef4ff; color: var(--blue); font-size: 14px; flex: 0 0 auto; }
#detailsPage .benefits-strip p{ margin: 0; min-width: 0; }
#detailsPage .benefits-strip strong{ display: block; font-size: 12.5px; font-weight: 600; color: #08245c; margin-bottom: 3px; }
#detailsPage .benefits-strip p > span{ display: block; font-size: 11px; color: #586b89; line-height: 1.45; }
#detailsPage .page-nav{ display: flex; gap: 30px; border-bottom: 1px solid var(--border); margin-top: 28px; overflow: auto; }
#detailsPage .page-nav a{ white-space: nowrap; padding: 13px 0; border-bottom: 2px solid transparent; font-size: 13px; font-weight: 600; color: #344054; }
#detailsPage .page-nav a:hover, #detailsPage .page-nav a.active{ color: var(--blue); border-color: var(--blue); }
#detailsPage .section{ margin-top: 34px; }
#detailsPage .section-heading{ display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 18px; }
#detailsPage .section-heading .eyebrow{ margin-bottom: 5px; }
#detailsPage .free-section{ margin-top: 28px; }
#detailsPage .free-section .section-heading{ margin-bottom: 14px; }
#detailsPage .free-section h2{ font-size: 19px; }
#detailsPage .free-section-count{ font-size: 12px; font-weight: 600; color: #09833d; white-space: nowrap; }
#detailsPage .free-section-controls{ display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
#detailsPage .free-test-navigation{ display: flex; gap: 6px; }
#detailsPage .free-nav-button{ display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 1px solid var(--border); border-radius: 8px; background: white; color: var(--blue); font-size: 12px; }
#detailsPage .free-nav-button:hover:not(:disabled){ background: #edf3ff; border-color: #a7c2ff; }
#detailsPage .free-nav-button:disabled{ color: #98a2b3; background: #f8fafc; }
#detailsPage .free-test-grid{ display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 36px) / 4); gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
#detailsPage .free-test-grid::-webkit-scrollbar{ display: none; }
#detailsPage .free-test-card{ display: flex; flex-direction: column; min-width: 0; min-height: 154px; padding: 16px; border: 1px solid var(--border); border-radius: 10px; background: white; scroll-snap-align: start; }
#detailsPage .free-card-top{ display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 8px; }
#detailsPage .free-stage{ font-size: 11px; color: #66758f; font-weight: 600; }
#detailsPage .free-test-card h3{ font-size: 14px; font-weight: 600; line-height: 1.35; color: #08245c; margin: 0 0 8px; overflow-wrap: anywhere; }
#detailsPage .free-test-card .test-meta{ font-size: 11.5px; gap: 6px 10px; margin-top: auto; }
#detailsPage .free-test-card .primary{ align-self: flex-start; height: 32px; padding: 0 12px; margin-top: 14px; font-size: 12px; font-weight: 600; }
#detailsPage .total-label{ color: var(--muted); font-size: 12px; white-space: nowrap; }
/* Keep the library compact on the left and useful preparation guidance alongside. */
#detailsPage .test-library-layout{ display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 22px; align-items: start; }
#detailsPage .test-library-layout > .library{ min-width: 0; }
#detailsPage .practice-sidebar{ min-width: 0; position: sticky; top: 100px; }
#detailsPage .practice-guide{ background: #fff; border: 1px solid var(--border); border-top: 3px solid var(--blue); border-radius: 12px; padding: 20px; }
#detailsPage .practice-guide-heading{ display: flex; align-items: center; gap: 10px; margin-bottom: 22px; }
#detailsPage .practice-guide-icon{ display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; flex-shrink: 0; color: #155eef; background: #edf3ff; border-radius: 9px; font-size: 17px; }
#detailsPage .practice-guide-kicker{ margin: 0 0 4px; font-size: 10px; font-weight: 700; letter-spacing: .5px; color: #155eef; }
#detailsPage .practice-guide h3{ margin: 0; font-size: 15px; line-height: 1.4; font-weight: 600; color: var(--navy); }
#detailsPage .practice-routine{ display: grid; gap: 18px; margin: 0; padding: 0; list-style: none; }
#detailsPage .practice-routine li{ display: flex; align-items: flex-start; gap: 10px; }
#detailsPage .practice-step{ display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; flex-shrink: 0; border: 1px solid #c7d7ef; border-radius: 50%; color: #155eef; font-size: 11px; font-weight: 700; }
#detailsPage .practice-routine h4{ margin: 1px 0 4px; font-size: 13px; line-height: 1.4; font-weight: 600; color: #17325f; }
#detailsPage .practice-routine p{ margin: 0; font-size: 12px; line-height: 1.6; color: #475467; }
#detailsPage .practice-resources{ border-top: 1px solid var(--border); margin-top: 22px; padding-top: 16px; }
#detailsPage .practice-resources-label{ margin: 0 0 6px; color: #475467; font-size: 10px; font-weight: 700; letter-spacing: .4px; }
#detailsPage .practice-resource{ display: flex; align-items: center; gap: 9px; min-height: 44px; padding: 9px 0; border-radius: 5px; color: #153c7c; font-size: 12px; font-weight: 500; }
#detailsPage .practice-resource[hidden]{ display: none; }
#detailsPage .practice-resource > span{ flex: 1; }
#detailsPage .practice-resource > i:first-child{ width: 17px; color: #155eef; font-size: 13px; text-align: center; }
#detailsPage .practice-resource > i:last-child{ font-size: 11px; color: #475467; }
#detailsPage .practice-resource:hover{ background: #f2f6ff; color: #155eef; }
@media(max-width:1100px){
  #detailsPage .test-library-layout{ grid-template-columns: minmax(0,1fr); }
  #detailsPage .practice-sidebar{ position: static; }
  #detailsPage .practice-guide{ display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: 28px; }
  #detailsPage .practice-guide-heading{ grid-column: 1 / -1; }
  #detailsPage .practice-resources{ border-top: 0; border-left: 1px solid var(--border); margin-top: 0; padding: 0 0 0 24px; }
}
@media(max-width:700px){
  #detailsPage .practice-guide{ display: block; }
  #detailsPage .practice-resources{ border-left: 0; border-top: 1px solid var(--border); margin-top: 22px; padding: 16px 0 0; }
}
@media(max-height:570px){
  #detailsPage .practice-sidebar{ position: static; }
}
#detailsPage .library{ overflow: hidden; }
#detailsPage .format-tabs{ display: flex; gap: 6px; padding: 18px 20px; border-bottom: 1px solid var(--border); overflow: auto; }
#detailsPage .format-tabs button{ border: 1px solid var(--border); background: white; border-radius: 6px; color: #344054; padding: 8px 13px; white-space: nowrap; font-size: 13px; font-weight: 500; }
#detailsPage .format-tabs button[aria-pressed=true]{ background: var(--blue); color: white; border-color: var(--blue); font-weight: 600; }
#detailsPage .format-tabs span{ opacity: .85; margin-left: 7px; }
#detailsPage .toolbar{ display: flex; justify-content: space-between; gap: 18px; padding: 20px 24px 12px; }
#detailsPage .stage-toggle{ display: flex; background: #f2f5fa; border-radius: 6px; padding: 3px; align-self: center; }
#detailsPage .stage-toggle button{ border: 0; background: transparent; color: var(--muted); padding: 7px 21px; border-radius: 4px; font-size: 13px; font-weight: 600; }
#detailsPage .stage-toggle button[aria-pressed=true]{ background: white; color: var(--blue); box-shadow: 0 1px 4px #10254d15; }
#detailsPage .search input{ width: 275px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 6px; font-size: 12.5px; color: var(--navy); }
#detailsPage .subject-tabs{ display: flex; gap: 22px; margin: 0 24px; border-bottom: 1px solid var(--border); overflow: auto; }
#detailsPage .subject-tabs button{ white-space: nowrap; border: 0; border-bottom: 2px solid transparent; padding: 10px 0; background: transparent; color: #344054; font-size: 13px; font-weight: 500; }
#detailsPage .subject-tabs button[aria-pressed=true]{ color: var(--blue); border-color: var(--blue); font-weight: 600; }
#detailsPage .results-bar{ display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background: #fafbfe; font-size: 12px; color: var(--muted); }
#detailsPage .results-bar p{ margin: 0; }
#detailsPage select{ border: 1px solid var(--border); padding: 6px 8px; background: white; color: var(--navy); border-radius: 5px; font-size: 12px; }
#detailsPage .results-bar select{ margin-left: 6px; }
#detailsPage .test-row{ display: grid; grid-template-columns: 42px minmax(0, 1fr) 112px; align-items: center; gap: 13px; padding: 22px 20px; border-top: 1px solid #e5ebf4; }
#detailsPage .test-info{ min-width: 0; }
#detailsPage .test-icon{ width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; background: #f4f6f9; color: #5d6b82; border-radius: 10px; font-size: 14px; }
#detailsPage .test-icon.free{ background: #edf4ff; color: var(--blue); }
#detailsPage .test-heading{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 8px; }
#detailsPage .test-title{ font-size: 14px; font-weight: 600; color: #08245c; line-height: 1.35; letter-spacing: -.01em; margin: 0; }
#detailsPage .type-badge, #detailsPage .free-badge, #detailsPage .soon-badge{ padding: 2px 8px; border-radius: 20px; font-size: 9.5px; font-weight: 700; line-height: 1.5; white-space: nowrap; }
#detailsPage .type-badge{ background: #edf3ff; color: #155eef; border: 1px solid #d5e3ff; }
#detailsPage .free-badge{ background: #ecfbf2; color: #09833d; }
#detailsPage .soon-badge{ background: #f2f4f7; color: #667085; }
#detailsPage .test-meta{ display: flex; flex-wrap: wrap; gap: 8px 12px; color: #17325f; font-size: 11.5px; font-weight: 400; }
#detailsPage .test-meta span{ display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
#detailsPage .test-meta i{ font-size: 11.5px; color: #475467; }
#detailsPage .test-row .primary, #detailsPage .test-row .secondary, #detailsPage .unavailable{ padding: 0 12px; width: 112px; height: 40px; font-size: 13px; font-weight: 500; }
#detailsPage .test-row .primary{ font-weight: 600; }
#detailsPage .test-row .secondary i{ font-size: 12px; color: #344054; }
#detailsPage .unavailable{ border: 1px solid var(--border); border-radius: 6px; background: #f7f8fb; color: #8794a9; }
#detailsPage .empty{ padding: 40px 24px; text-align: center; color: var(--muted); font-size: 13px; }
#detailsPage .report-label{ font-size: 11px; font-weight: 600; padding: 5px 10px; color: #586b89; background: #edf2f9; border-radius: 5px; white-space: nowrap; }
#detailsPage .insight-grid{ display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
#detailsPage .insight-card{ display: flex; flex-direction: column; align-items: flex-start; text-align: left; background: #fff; color: #344054; border: 1px solid var(--border); border-radius: 10px; padding: 18px; }
#detailsPage .insight-card .benefit-icon{ width: 32px; height: 32px; border-radius: 8px; margin-bottom: 12px; font-size: 13px; }
#detailsPage .insight-card strong{ display: block; font-size: 13px; font-weight: 600; color: #08245c; margin-bottom: 7px; }
#detailsPage .insight-card > span:last-child{ display: block; font-size: 12px; line-height: 1.6; color: #586b89; }
#detailsPage .insight-card:hover{ border-color: #aec9fc; background: #fafcff; }
#detailsPage .insight-card[aria-pressed=true]{ background: #f7faff; border-color: #1769ff; box-shadow: inset 0 0 0 1px #1769ff; }
#detailsPage .insight-report{ background: #fff; border: 1px solid var(--border); border-radius: 10px; margin-top: 14px; overflow: hidden; }
#detailsPage .report-body{ display: grid; grid-template-columns: 1fr 1.15fr; gap: 28px; align-items: center; padding: 22px; }
#detailsPage .report-test{ font-size: 11px; color: #66758f; margin: 0 0 7px; }
#detailsPage .report-copy h3{ font-size: 14px; font-weight: 600; line-height: 1.4; margin: 0 0 6px; }
#detailsPage .report-copy > p:last-child{ font-size: 12px; line-height: 1.6; color: #586b89; margin: 0; }
#detailsPage .report-body dl{ display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 0; }
#detailsPage .report-body dl > div{ padding-left: 14px; border-left: 1px solid #e6edf7; }
#detailsPage .report-body dt{ font-size: 10.5px; color: #66758f; margin-bottom: 8px; line-height: 1.4; }
#detailsPage .report-body dd{ margin: 0; font-size: 17px; font-weight: 600; line-height: 1.4; color: #08245c; }
#detailsPage .report-next{ margin: 0; display: flex; align-items: flex-start; gap: 9px; border-top: 1px solid #e6edf7; background: #f8faff; padding: 13px 22px; font-size: 12px; line-height: 1.6; color: #344054; }
#detailsPage .report-next i{ color: var(--blue); margin-top: 4px; font-size: 11px; }
#detailsPage .faq-layout{ display: grid; grid-template-columns: minmax(0,1fr) 285px; gap: 22px; align-items: start; }
#detailsPage .plan-help{ border: 1px solid var(--border); border-radius: 12px; background: white; text-align: center; padding: 24px 20px; }
#detailsPage .plan-help .benefit-icon{ margin-bottom: 15px; }
#detailsPage .plan-help h3{ font-size: 14px; font-weight: 600; margin: 0 0 8px; }
#detailsPage .plan-help p{ font-size: 12px; line-height: 1.6; color: #586b89; margin: 0 0 18px; }
#detailsPage .plan-help .secondary{ height: 38px; font-size: 12px; font-weight: 600; }
#detailsPage .overview-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
#detailsPage .panel:not(.library){ padding: 24px; }
#detailsPage .breakdown-row, #detailsPage .breakdown-total{ display: flex; justify-content: space-between; padding: 8px 0; margin: 0; font-size: 13px; }
#detailsPage .breakdown-row{ color: #344054; }
#detailsPage .breakdown-total{ border-top: 1px solid var(--border); margin-top: 8px; padding-top: 13px; color: var(--navy); }
#detailsPage .stage-card{ display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 6px; padding: 12px 15px; margin-top: 13px; gap: 3px; }
#detailsPage .stage-card strong{ font-size: 14px; font-weight: 600; color: var(--navy); }
#detailsPage .stage-card span{ font-size: 12.5px; color: var(--muted); }
#detailsPage table{ width: 100%; border-collapse: collapse; font-size: 13px; color: #344054; }
#detailsPage th{ text-align: left; background: #f3f6fb; font-size: 12px; font-weight: 600; color: var(--navy); }
#detailsPage th, #detailsPage td{ padding: 13px 16px; border-bottom: 1px solid var(--border); }
#detailsPage th:not(:first-child), #detailsPage td:not(:first-child){ text-align: center; }
#detailsPage tr.total{ font-weight: 600; color: var(--navy); }
#detailsPage .table-wrap{ overflow: auto; }
#detailsPage .accordions details{ border-bottom: 1px solid var(--border); }
#detailsPage .accordions details:last-child{ border: 0; }
#detailsPage .accordions summary{ cursor: pointer; font-size: 14px; font-weight: 600; padding: 15px 0; color: var(--navy); }
#detailsPage .accordions p{ color: var(--muted); font-size: 13px; line-height: 1.65; margin: 0 0 16px; max-width: 850px; }
#detailsPlanGuide{ max-width: 470px; width: calc(100% - 32px); border: 1px solid var(--border); border-radius: 12px; padding: 30px; color: var(--navy); box-shadow: 0 20px 80px #10254d30; }
#detailsPlanGuide::backdrop{ background: #10254d65; }
#detailsPlanGuide p{ color: var(--muted); font-size: 14px; }
#detailsPlanGuide .eyebrow{ color: var(--blue); font-size: 11px; }
#detailsPage .close{ position: absolute; right: 14px; top: 8px; border: 0; background: none; font-size: 26px; color: var(--muted); }
#detailsPlanGuide .primary{ margin-top: 18px; }
#detailsPage .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; }
@media (max-width: 1100px){
#detailsPage .free-test-grid{ grid-auto-columns: calc((100% - 24px) / 3); }
}
@media (max-width: 900px){
#detailsPage .free-test-grid{ grid-auto-columns: calc((100% - 12px) / 2); }
#detailsPage .hero{ grid-template-columns: 1.3fr 1fr; }
#detailsPage .hero-content{ padding: 24px; }
#detailsPage .purchase{ padding: 22px; }
#detailsPage .benefits-strip{ grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 0; }
#detailsPage .benefits-strip > div:nth-child(2){ border: 0; }
#detailsPage .insight-grid{ grid-template-columns: repeat(2,minmax(0,1fr)); }
#detailsPage .report-body{ grid-template-columns: 1fr; gap: 18px; }
#detailsPage .report-body dl > div:first-child{ border: 0; padding-left: 0; }
#detailsPage .faq-layout{ grid-template-columns: minmax(0,1fr) 255px; gap: 16px; }
}
@media (max-width: 700px){
#detailsPage{ padding: 0 16px; }
#detailsPage .breadcrumb{ margin: 18px 0; font-size: 11px; }
#detailsPage .hero{ grid-template-columns: 1fr; gap: 16px; }
#detailsPage .hero-content{ --hero-logo-size: 52px; --hero-title-gap: 14px; padding: 24px 20px; }
#detailsPage .hero-heading{ align-items: start; }
#detailsPage .hero-title{ overflow: visible; }
#detailsPage .hero-title h1{ width: auto; max-width: 100%; white-space: normal; overflow-wrap: anywhere; font-size: 22px; line-height: 1.3; }
#detailsPage .hero-badges{ gap: 4px 8px; }
#detailsPage .free-test-grid{ grid-auto-columns: 100%; }
#detailsPage .free-section .section-heading{ flex-wrap: wrap; gap: 10px; }
#detailsPage .free-section-controls{ width: 100%; justify-content: space-between; }
#detailsPage h1{ font-size: 21px; }
#detailsPage .intro{ font-size: 13px; }
#detailsPage .meta{ font-size: 12px; gap: 12px 16px; }
#detailsPage .meta i{ font-size: 13px; }
#detailsPage .eyebrow{ font-size: 10px; }
#detailsPage .tag{ font-size: 11px; }
#detailsPage .hero-actions > *{ flex: 1; padding: 10px 8px; font-size: 12px; }
#detailsPage .purchase{ padding: 24px; }
#detailsPage .page-nav{ gap: 23px; margin-top: 18px; }
#detailsPage .page-nav a{ font-size: 12px; }
#detailsPage .section{ margin-top: 28px; }
#detailsPage .section-heading{ align-items: flex-start; }
#detailsPage .section-heading h2{ font-size: 20px; }
#detailsPage .total-label{ display: none; }
#detailsPage .format-tabs{ padding: 15px; }
#detailsPage .format-tabs button{ font-size: 12px; }
#detailsPage .toolbar{ padding: 16px; flex-direction: column; gap: 12px; }
#detailsPage .stage-toggle{ align-self: flex-start; }
#detailsPage .search input{ width: 100%; }
#detailsPage .subject-tabs{ margin: 0 16px; gap: 18px; }
#detailsPage .results-bar{ padding: 12px 16px; font-size: 11px; gap: 8px; }
#detailsPage .results-bar label{ white-space: nowrap; }
#detailsPage .results-bar select{ max-width: 125px; font-size: 11px; }
#detailsPage .test-row{ grid-template-columns: 36px minmax(0,1fr); gap: 12px; padding: 18px 16px; }
#detailsPage .test-icon{ width: 36px; height: 36px; align-self: start; }
#detailsPage .test-row > button{ grid-column: 2; justify-self: end; }
#detailsPage .test-title{ font-size: 14px; }
#detailsPage .test-meta{ font-size: 11.5px; gap: 7px 10px; }
#detailsPage .overview-grid{ grid-template-columns: 1fr; gap: 16px; }
#detailsPage .benefits-strip{ padding: 15px 0; gap: 16px 0; }
#detailsPage .benefits-strip > div{ padding: 0 12px; gap: 8px; align-items: flex-start; }
#detailsPage .benefits-strip .benefit-icon{ width: 30px; height: 30px; border-radius: 8px; font-size: 12px; }
#detailsPage .benefits-strip strong{ font-size: 11px; }
#detailsPage .benefits-strip p > span{ font-size: 10.5px; }
#detailsPage .insight-grid{ gap: 10px; }
#detailsPage .insight-card{ padding: 14px; }
#detailsPage .insight-card strong{ font-size: 12px; }
#detailsPage .insight-card > span:last-child{ font-size: 11px; }
#detailsPage .report-body{ padding: 18px; }
#detailsPage .report-body dd{ font-size: 15px; }
#detailsPage .report-body dt{ font-size: 10px; }
#detailsPage .report-body dl{ gap: 8px; }
#detailsPage .report-body dl > div{ padding-left: 9px; }
#detailsPage .report-next{ padding: 13px 18px; font-size: 11.5px; }
#detailsPage .faq-layout{ grid-template-columns: 1fr; }
#detailsPage .panel:not(.library){ padding: 20px; }
#detailsPage th, #detailsPage td{ padding: 11px 9px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce){
#detailsPage *{ transition: none !important; }
}

body {margin:0;background:#f5f7fb;}
#detailsPage {box-sizing:border-box;margin:0 auto;padding-bottom:44px;}
#detailsPage .section {scroll-margin-top:100px;}
#detailsPage [hidden] {display:none!important;}
#detailsPage .exam-badge {display:flex;align-items:center;justify-content:center;background:transparent;color:#1769ff;font-weight:700;}
#detailsPage .exam-badge img {display:block;width:100%;height:100%;object-fit:contain;}
#detailsPage .verified-badge i {margin-right:3px;}
#detailsPage .plan-chip-card {border:1px solid var(--border);background:#fff;border-radius:9px;padding:12px 3px;color:#475467;font-size:12px;font-weight:700;text-align:center;cursor:pointer;}
#detailsPage .plan-chip-card.active {border-color:var(--blue);background:#eef6ff;color:#344054;}
#detailsPage .plans .plan-chip-months {display:block;font-size:12px;margin-top:0;text-transform:lowercase;color:#475467;}
#detailsPage .plans .active .plan-chip-months {color:#344054;}
#detailsPage .plan-chip-price {display:block;font-size:14px;font-weight:700;color:var(--navy);margin-top:5px;}
#detailsPage .plan-chip-card.active .plan-chip-price {color:#155eef;}
#detailsPage .plans .plan-chip-badge {display:none;}
#detailsPage .purchase-card-label {text-transform:uppercase;}
#detailsPage .plan-chip-card:focus-visible {outline:3px solid #93b7ff;outline-offset:3px;}
#detailsPage .primary:disabled {background:#8794a9;border-color:#8794a9;}
#detailsPage .pattern-summary-grid {display:none!important;}
#detailsPage .note-card {margin-top:16px;font-size:12px;color:var(--muted);}
#detailsPage .note-card h3 {font-size:12px;margin:0 0 5px;}
#detailsPage .note-card ul {padding-left:18px;margin:0;line-height:1.7;}
#detailsPage .total-row {font-weight:600;color:var(--navy);}
#detailsPage .syllabus-item, #detailsPage .faq-item {border-bottom:1px solid var(--border);}
#detailsPage .syllabus-item:last-child, #detailsPage .faq-item:last-child {border:0;}
#detailsPage .syllabus-trigger, #detailsPage .faq-question {display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:15px 0;border:0;background:transparent;text-align:left;font-size:14px;font-weight:600;color:var(--navy);}
#detailsPage .syllabus-title {flex:1;}
#detailsPage .syllabus-title b {font-weight:600;}
#detailsPage .syllabus-title i {display:none;}
#detailsPage .syllabus-count {font-size:11px;color:var(--muted);font-weight:400;}
#detailsPage .syllabus-chevron, #detailsPage .faq-question i {font-size:11px;color:#66758f;}
#detailsPage .syllabus-body, #detailsPage .faq-answer {display:none;color:var(--muted);font-size:13px;line-height:1.65;padding-bottom:16px;max-width:850px;}
#detailsPage .open > .syllabus-body, #detailsPage .open > .faq-answer {display:block;}
#detailsPage .syllabus-body {max-width:none;}
#detailsPage .syllabus-topic-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px 24px;margin:0;padding:0 0 0 16px;list-style:disc;}
#detailsPage .syllabus-topic-grid li {min-width:0;padding-left:2px;line-height:1.5;overflow-wrap:anywhere;}
#detailsPage .syllabus-topic-grid li::marker {color:#1769ff;font-size:10px;}
#detailsPage .syllabus-empty {margin:0;}
@media(max-width:1100px){#detailsPage .syllabus-topic-grid {grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:700px){#detailsPage .syllabus-topic-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px;}}
#detailsPage .help-button {border:0;color:#1769ff;background:transparent;font-size:12px;margin-top:12px;padding:4px;}
#detailsPage .series-data-empty {padding:24px;text-align:center;color:var(--muted);}
#detailsPage .series-data-empty h3 {margin:10px 0;font-size:14px;}
#detailsPage .pass-overview-preview {margin-top:22px;}
#detailsPage #packages .content-layout {display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:22px;}
#detailsPage #packages .content-card, #detailsPage #packages .side-card, #detailsPage .pass-overview-preview {background:#fff;border:1px solid var(--border);border-radius:12px;padding:24px;}
#detailsPage #packages .section-head, #detailsPage .pass-overview-preview .section-head {margin-bottom:18px;}
#detailsPage #packages h3, #detailsPage .pass-overview-preview h3 {margin-bottom:12px;}
#detailsPage .section-kicker, #detailsPage .mini-label {color:var(--blue);font-size:11px;font-weight:700;}
#detailsPage .section-heading .eyebrow {display:block;}
#detailsPage .included-packages-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
#detailsPage .included-pkg-item {border:1px solid var(--border);border-radius:8px;padding:16px;}
#detailsPage .included-pkg-top, #detailsPage .included-pkg-footer, #detailsPage .category-group-header {display:flex;align-items:center;justify-content:space-between;gap:12px;}
#detailsPage .included-pkg-info {flex:1;min-width:0;}
#detailsPage .included-pkg-info h4 {font-size:14px;color:var(--navy);margin:0 0 6px;}
#detailsPage .included-pkg-icon {color:var(--blue);}
#detailsPage .included-pkg-tag {font-size:11px;margin-right:8px;color:var(--muted);}
#detailsPage .included-pkg-footer {margin-top:14px;border-top:1px solid var(--border);padding-top:12px;}
#detailsPage .included-pkg-link, #detailsPage .text-button {color:var(--blue);font-size:12px;font-weight:600;}
#detailsPage .text-button {border:0;background:transparent;padding:10px 0;cursor:pointer;}
#detailsPage .category-group-block + .category-group-block {margin-top:22px;}
#detailsPage .mini-buy-button {border:1px solid var(--blue);border-radius:6px;background:var(--blue);color:white;width:100%;padding:11px 14px;font-weight:600;margin-top:14px;}
#detailsPage .mini-value-badge, #detailsPage .mini-secure-note {display:none;}
#detailsPage .mini-package-meta {font-size:12px;display:flex;flex-wrap:wrap;gap:10px;margin:12px 0;}
#detailsPage .mini-price strong {font-size:24px;color:var(--navy);}
#detailsPage .mini-validity {font-size:12px;color:var(--muted);margin-left:8px;}
#detailsPlanGuide {--border:#dce5f2;--navy:#0f285f;--muted:#475467;--blue:#1769ff;font-family:Inter,Arial,sans-serif;}
#detailsPlanGuide .details-guide-close {position:absolute;right:14px;top:8px;border:0;background:none;font-size:26px;color:#475467;cursor:pointer;}
#detailsPlanGuide .details-guide-done {border:1px solid #1769ff;border-radius:6px;background:#1769ff;color:white;padding:11px 18px;margin-top:18px;font-weight:600;cursor:pointer;}
#detailsGuideOptions p {padding:12px 16px;border:1px solid #dce5f2;border-radius:8px;font-size:13px;}
.toast {position:fixed;bottom:24px;left:50%;transform:translate(-50%,12px);max-width:calc(100vw - 32px);padding:13px 18px;border-radius:8px;background:#0f285f;color:#fff;z-index:11000;opacity:0;visibility:hidden;font:13px Inter,Arial,sans-serif;transition:opacity .2s,transform .2s;}
.toast.show {opacity:1;visibility:visible;transform:translate(-50%,0);}
.toast i {margin-right:6px;}
@media(max-width:700px){#detailsPage #packages .content-layout,#detailsPage .included-packages-grid{grid-template-columns:1fr;}#detailsPage .section-heading select{max-width:110px;}#detailsPage .free-section-count{font-size:11px;}#detailsPage .hero-heading{min-width:0;}}
@media(prefers-reduced-motion:reduce){.toast{transition:none;}}