/* TOEFL with Mourad Platform: print stylesheet (A4).
   Linked with media="print" and loaded last, so it wins over the screen styles. Used for score reports,
   the Progress page and the Word Bank. Turn on "Background graphics" in the print dialog for colour bands. */
@page{
  size:A4;margin:16mm 13mm 18mm;
  @top-center{content:"TOEFLwithMOURAD";font:600 8pt "Fraunces",Georgia,serif;letter-spacing:.3em;color:#7A5A14}
  @bottom-center{content:"TOEFL with Mourad Platform  ·  practice bands, not official ETS scores  ·  page " counter(page);font:7.5pt "Inter",Arial,sans-serif;color:#667085}
}
@page :first{@top-center{content:none}}
*{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;animation:none!important;transition:none!important;
  box-shadow:none!important;text-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html,body{background:#fff!important;color:#14223A!important;overflow:visible!important}
body{font-size:10pt!important;line-height:1.45!important;font-feature-settings:"tnum" 1}
a{color:inherit!important;text-decoration:none!important}

/* chrome that never prints */
.site-header,.site-footer,.tabbar,.splash,.drawer,.overlay,.modal-root,.toast,.focus-exit,.skip-link,.no-print,
.timerbar,.nav-panel,.section-tabs,.mark-bar,.wb-pop,.welcome-card,.next-card,.continue-card,.script-toggle,.audio-player,
.record-box,.score-buttons,.flag-btn,.tip-note,.ar-toggle,.instr-ar{display:none!important}
.print-only{display:block!important}
.section-head.no-print,.panel.no-print,.no-print.section-head{display:none!important}

/* page frame */
.app-shell,.app-shell.is-test{width:auto!important;max-width:none!important;margin:0!important;padding:0!important;min-height:0!important}
.app-shell>*{opacity:1!important;transform:none!important}
.panel,.stat-card,.pb-block,.score-tile,.score-box,.callout,.trend-wrap,.table-wrap,.wb-list li,.nb-card,details.pb-panel,.stim,.question{
  break-inside:avoid;page-break-inside:avoid}
h1,h2,h3,h4{break-after:avoid;color:#102A4A!important}
.section-head{display:block!important;margin:14px 0 8px!important;padding:0!important;background:none!important;color:#14223A!important;border-radius:0!important}
.section-head h1,.section-head h2{font-size:14pt!important;color:#102A4A!important}
.section-head h1::after,.section-head h2::after{display:none!important}
.section-head p{color:#3D4A5C!important;margin:2px 0 0!important}
.section-head::before{display:none!important}
.kicker{color:#7A5A14!important}
.rule{display:none}

/* wordmark: centred at the top of the first page (later pages get it from the page margin box) */
.print-wordmark{display:block!important;text-align:center;margin:0 0 12px;padding:0 0 9px;position:relative;
  font:500 15pt "Fraunces",Georgia,serif;letter-spacing:.34em;color:#102A4A;line-height:1;text-transform:none}
.print-wordmark i{font-style:italic;font-weight:400;font-size:.78em;letter-spacing:.14em;color:#A97C25;margin:0 .06em}
.print-wordmark::after{content:"";position:absolute;left:50%;bottom:0;width:34mm;height:1.5px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#C3953B,transparent)}

/* branded print header (report, progress, word bank) */
.print-head{display:flex!important;align-items:center;gap:12px;padding:0 0 10px;margin:0 0 14px;border-bottom:2px solid #C3953B}
.print-head img{height:50px!important;width:auto}
.print-head .brand-name{font:500 17pt "Fraunces",Georgia,serif;color:#102A4A;line-height:1.05}
.print-head .brand-sub{font:600 6.5pt "Inter",Arial,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#7A5A14;margin-top:3px}
.ph-title{margin-left:auto;text-align:right;display:grid;gap:1px}
.ph-title b{font:500 13pt "Fraunces",Georgia,serif;color:#102A4A}
.ph-title span{font:500 7.5pt "JetBrains Mono",ui-monospace,monospace;color:#5E6773}

/* ---------- score report ---------- */
.panel.report-sheet{border:0!important;padding:0!important;margin:0!important;background:none!important;border-radius:0!important}
.report-sheet .report-banner.test-hero{display:block!important;padding:11px 16px!important;margin:0 0 12px;border-radius:6px!important;color:#102A4A!important;
  background:#F6F1E3!important;border:1px solid #D8CDAF;border-left:5px solid #C3953B}
.report-banner .test-hero-top{display:flex;align-items:center;justify-content:space-between}
.report-banner h1{color:#102A4A!important;font-size:19pt!important;margin:2px 0 0!important}
.report-banner p{color:#3D4A5C!important;margin:0!important}
.report-banner .kicker{color:#7A5A14!important}
.report-banner .big-numeral{font:italic 500 38pt/1 "Fraunces",Georgia,serif!important;color:#A97C25!important;-webkit-text-stroke:0!important}
.report-banner::after{display:none!important}
.score-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:8px!important;margin:0 0 12px!important}
.score-tile{--tc:#1B4F7F;border:0!important;border-radius:6px!important;padding:9px 12px 10px!important;color:#fff!important;position:relative;overflow:hidden;
  background:radial-gradient(120% 140% at 100% 0%,rgba(255,255,255,.22),transparent 58%),linear-gradient(145deg,var(--tc),color-mix(in srgb,var(--tc) 62%,#000))!important}
.score-tile.st-reading{--tc:#1B4F7F}
.score-tile.st-listening{--tc:#8A6416}
.score-tile.st-writing{--tc:#1F5A44}
.score-tile.st-speaking{--tc:#6B3F8C}
.score-tile::after{content:"";position:absolute;right:-14px;bottom:-14px;width:54px;height:54px;border-radius:50%;border:8px solid rgba(255,255,255,.14)}
.score-tile span{color:rgba(255,255,255,.92)!important;font-size:6.8pt!important}
.score-tile b{font:italic 500 26pt/1.1 "Fraunces",Georgia,serif!important;color:#fff!important}
.score-tile small{color:rgba(255,255,255,.9)!important;font-size:7.5pt!important}
.report-sheet .score-box{display:grid!important;grid-template-columns:auto 1fr!important;gap:16px!important;align-items:center;padding:10px 16px!important;margin:0 0 12px!important;
  background:#fff!important;color:#14223A!important;border:1px solid #D8CDAF!important;border-radius:6px!important}
.score-box h3{color:#102A4A!important;font-size:13pt!important}
.score-box p{color:#3D4A5C!important;font-family:"Inter",Arial,sans-serif!important}
.score-ring-svg .ring,.ring{width:76px!important;height:76px!important}
.score-ring-svg .ring-val,.ring-val{fill:#102A4A!important;font-size:24px!important}
.ring-bg{stroke:#E9E2CF!important}
.pb-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin:0 0 12px!important}
.pb-block{border:1px solid #E2DCCD!important;border-radius:5px!important;padding:8px 11px!important;margin:0!important;background:#fff!important}
.pb-block .kicker{font-size:6.5pt!important}
.pbar{grid-template-columns:34% 1fr auto!important;gap:8px!important;font-size:8pt!important}
.pb-t{height:6px!important;background:#E9E2CF!important}
.pb-t i{background:#C3953B!important}
.pb-v{color:#3D4A5C!important;font-size:7.5pt!important}
.callout,.callout.warn{background:#FBF1D8!important;border:1px solid #E8D6A4!important;border-left:4px solid #C3953B!important;border-radius:5px!important;color:#14223A!important;font-size:8.5pt!important;padding:8px 12px!important}
.report-foot{display:block!important;margin-top:12px;padding-top:6px;border-top:1px solid #C3953B;font-size:7pt!important;color:#5E6773!important}
.band-key{display:table!important;width:100%;border-collapse:collapse;margin:0 0 12px;font-size:8pt;break-inside:avoid}
.band-key caption{caption-side:top;text-align:left;font:600 6.5pt "Inter",Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#7A5A14;padding-bottom:4px}
.band-key th,.band-key td{border:1px solid #E2DCCD;padding:3px 2px;text-align:center;font-family:"JetBrains Mono",ui-monospace,monospace}
.band-key th{background:#F6F1E3!important;font-weight:600;color:#5E6773;font-size:7pt}
.band-key td{font-weight:700;color:#102A4A}

/* ---------- progress + tables ---------- */
.table-wrap{overflow:visible!important;border:1px solid #D8CDAF!important;border-radius:5px!important}
.progress-table{width:100%;font-size:9pt}
.progress-table th{background:#F6F1E3!important;color:#7A5A14!important;font-size:6.8pt!important;padding:7px 8px!important}
.progress-table td{padding:7px 8px!important;border-bottom:1px solid #E9E2CF!important}
.progress-table tr{break-inside:avoid}
.pt-main th:last-child,.pt-main td:last-child{display:none!important}
.band{font:italic 500 15pt/1.1 "Fraunces",Georgia,serif!important;color:#102A4A!important}
.progress-table small{color:#5E6773!important;font-size:7.5pt!important}
.trend-wrap{padding:10px 12px!important;border:1px solid #D8CDAF!important;border-radius:5px!important;background:#fff!important}
.trend{max-height:62mm!important;width:100%}
.trend-legend{color:#3D4A5C!important;font-size:8pt!important}
details.pb-panel{border:1px solid #D8CDAF!important;border-radius:5px!important;padding:8px 12px!important;margin:0 0 8px!important;background:#fff!important}
details.pb-panel summary{font:600 10pt "Fraunces",Georgia,serif!important;color:#102A4A!important;list-style:none}
details.pb-panel summary::-webkit-details-marker{display:none}
.panel{border:1px solid #D8CDAF!important;border-radius:5px!important;background:#fff!important;padding:10px 14px!important;margin:0 0 10px!important}

/* ---------- word bank ---------- */
.wb-head p{font-size:9pt}
.wb-list{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.wb-list li{border:1px solid #E2DCCD!important;border-radius:5px!important;padding:7px 10px!important;background:#fff!important}
.wb-list strong{font:600 11pt "Fraunces",Georgia,serif!important;color:#102A4A!important}
.wb-list p{font-size:8.5pt!important;margin:2px 0!important}

/* ---------- long pages (guide, tips, about, test papers) ---------- */
.split{display:block!important;margin:0 0 10px!important;border:1px solid #D8CDAF!important;border-radius:5px!important;background:#fff!important}
.split-head{background:#F6F1E3!important}
.split-body{display:block!important}
.split-body>.col{height:auto!important;min-height:0!important;overflow:visible!important;padding:10px 14px!important;background:#fff!important;border:0!important}
.tips-grid,.about-grid,.guide-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
.hero,.hero-main,.hero-side{display:none!important}
