:root { --ink:#2a1a12; --berry:#9d3153; --paper:#fffdfa; --cream:#fff4dc; --gold:#e9ae42; --line:#e3d5c7; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:linear-gradient(180deg,#fff8e9,#f4eadf); font-family:Arial,"PingFang SC",sans-serif; }
.pdf-app { width:min(1040px,calc(100% - 28px)); margin:0 auto; padding:24px 0 64px; }
.back a { color:#704d3d; }
.hero { padding:30px clamp(20px,5vw,58px); border-radius:28px; background:radial-gradient(circle at 92% 15%,#ffd56d 0 9%,transparent 9.5%),linear-gradient(135deg,#fffdf7,#ffe6ab); border:1px solid #f1cb80; box-shadow:0 18px 45px #8d69451d; }
.pdf-app .hero h1 { color:var(--ink); text-shadow:none; margin:.18em 0; font-size:clamp(2rem,6vw,4rem); line-height:1; }
.pdf-app .hero p:last-child { color:#594638; max-width:720px; line-height:1.65; }
.eyebrow { margin:0; color:var(--berry); font-weight:800; letter-spacing:.12em; font-size:.78rem; }
.maker,.paper-list-section,.ready-packs,.notes { margin-top:22px; background:#fffdf9; border:1px solid var(--line); border-radius:22px; padding:clamp(18px,4vw,32px); box-shadow:0 12px 35px #6f554217; }
h2 { margin-top:0; }
.fields { display:grid; grid-template-columns:2fr 1fr; gap:18px; }
label { display:grid; gap:7px; font-weight:800; }
input,select { width:100%; padding:13px 14px; border:1px solid #bca99b; border-radius:12px; background:white; color:var(--ink); font:inherit; font-weight:600; }
label small { font-weight:400; color:#6f625a; line-height:1.4; }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
button { min-height:44px; border:0; border-radius:999px; padding:10px 18px; background:#2b7a6b; color:white; font:700 .98rem Arial,sans-serif; cursor:pointer; }
button.berry { background:var(--berry); }
button.ghost { color:var(--ink); background:#f2e8df; }
button:disabled { opacity:.45; cursor:not-allowed; }
.download-link { display:inline-flex; align-items:center; min-height:44px; border-radius:999px; padding:10px 18px; color:white; background:#2b7a6b; font-weight:800; text-decoration:none; }
.download-link.answer-pack { background:var(--berry); }
.status { margin-top:18px; min-height:24px; line-height:1.5; color:#5d5149; }
.status[data-kind="error"] { color:#a52323; font-weight:700; }
progress { width:100%; height:10px; margin-top:10px; accent-color:var(--berry); }
.download-ready { margin-top:14px; padding:14px 16px; border:2px solid #2b7a6b; border-radius:14px; background:#edf9f4; line-height:1.5; }
.download-ready strong,.download-ready span { display:block; }
.download-ready a { display:inline-flex; max-width:100%; margin-top:8px; min-height:42px; align-items:center; border-radius:999px; padding:8px 16px; background:#2b7a6b; color:white; font-weight:800; overflow-wrap:anywhere; word-break:break-all; white-space:normal; text-decoration:none; }
.list-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.paper-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px; }
.paper-card { padding:15px; border-radius:15px; border:1px solid #dfd2c5; background:#fffaf0; }
.paper-card strong { display:block; font-size:1.1rem; }
.paper-card code { display:block; margin-top:5px; color:#725746; word-break:break-all; }
.paper-card span { display:block; margin-top:8px; color:#6d615a; font-size:.88rem; }
.empty { color:#786a61; }
.archive-note { color:#6f625a; line-height:1.5; }
.notes p { line-height:1.6; }
.pdf-render-root { position:fixed; left:-12000px; top:0; width:794px; pointer-events:none; }

/* These pages are rendered to pixels before insertion into the PDF. */
.pdf-page { position:relative; width:794px; height:1123px; overflow:hidden; background:white; color:#1e1a17; font-family:Arial,"PingFang SC",sans-serif; }
.pdf-page-inner { position:absolute; inset:38px 42px 44px; }
.pdf-page-header { display:flex; justify-content:space-between; align-items:center; height:30px; padding-bottom:8px; border-bottom:2px solid #37261d; font-size:13px; font-weight:700; }
.pdf-page-footer { position:absolute; left:42px; right:42px; bottom:18px; display:flex; justify-content:space-between; color:#6b5f58; font-size:11px; }
.pdf-cover { background:linear-gradient(145deg,#fffdfa 0 68%,#f6e3a9 68%); }
.pdf-cover .pdf-page-inner { display:flex; flex-direction:column; }
.pdf-cover-mark { margin-top:96px; color:#983452; font-size:16px; font-weight:800; letter-spacing:.18em; }
.pdf-cover h1 { margin:18px 0 8px; font-size:52px; line-height:1.02; }
.pdf-cover .sub { font-size:23px; color:#5f5148; }
.identity { display:grid; grid-template-columns:2fr 1fr; gap:28px; margin-top:54px; }
.identity div { border-bottom:2px solid #48362c; padding:14px 2px 8px; color:#64564f; font-weight:700; }
.paper-number { margin-top:35px; padding:18px 20px; border:2px solid #9d3153; border-radius:16px; background:#fff9; font-size:22px; font-weight:800; }
.rule-box { margin-top:auto; margin-bottom:52px; padding:22px 25px; border:1px solid #d0b983; border-radius:18px; background:#fffdf3e8; line-height:1.55; }
.rule-box strong { display:block; margin-bottom:7px; font-size:19px; }
.questions-area { display:grid; grid-template-rows:1fr; height:985px; padding-top:10px; }
.question-card { min-height:0; padding:10px 12px 8px; border:1px solid #cfc4ba; border-radius:10px; overflow:hidden; }
.question-meta { display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:13px; font-weight:800; color:#8e2d4b; }
.question-body { transform-origin:top left; }
.question-stem { margin:6px 0 7px; font-size:16px; line-height:1.28; font-weight:700; }
.question-figure { display:flex; justify-content:center; align-items:center; min-height:0; max-height:520px; overflow:hidden; margin:12px 0 18px; }
.question-figure:empty { display:none; }
.question-figure > svg,.question-figure > img { display:block!important; width:min(100%,650px)!important; height:auto!important; max-width:100%!important; max-height:510px!important; }
.choices { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; }
.choice { display:flex; min-width:0; min-height:82px; gap:5px; align-items:center; justify-content:center; border:1px solid #a99d93; border-radius:7px; padding:6px; overflow:hidden; font-size:15px; text-align:center; }
.choice-letter { flex:none; align-self:flex-start; display:grid; place-items:center; width:20px; height:20px; border:1.5px solid #54463e; border-radius:50%; font-size:11px; font-weight:800; }
.choice-content { min-width:0; max-width:100%; }
.choice-content svg,.choice-content img { display:block; width:100%!important; height:auto!important; max-width:150px!important; max-height:170px!important; margin:auto; }
.source-text { margin-top:6px; color:#796b62; font-size:9px; overflow-wrap:anywhere; }
.answer-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px 18px; margin-top:25px; }
.answer-row { display:grid; grid-template-columns:38px repeat(5,minmax(0,1fr)); align-items:center; height:62px; padding:0 5px; border:1px solid #ded6cf; border-radius:8px; font-size:13px; }
.answer-row strong { font-size:15px; }
.bubble { width:27px; height:27px; border:1.4px solid #42362f; border-radius:50%; display:grid; place-items:center; margin:auto; font-size:11px; }
.answer-card-page h1,.answer-page h1 { margin:18px 0 4px; font-size:31px; }
.answer-card-page .instructions,.answer-page .instructions { margin:0 0 16px; color:#655951; }
.answer-items { display:grid; grid-template-rows:repeat(4,1fr); height:925px; gap:11px; padding-top:14px; }
.answer-item { padding:15px 17px; border:1px solid #d6cbc0; border-left:7px solid #9d3153; border-radius:10px; overflow:hidden; }
.answer-item h2 { display:flex; justify-content:space-between; gap:15px; margin:0 0 10px; font-size:19px; }
.answer-item p { margin:6px 0; font-size:14px; line-height:1.42; }
.answer-item .answer-value { color:#8e2d4b; font-weight:800; }
.answer-item .answer-source { color:#786a61; font-size:10px; overflow-wrap:anywhere; }

@media (max-width:650px) {
  .fields { grid-template-columns:1fr; }
  .actions button { width:100%; }
  .hero { border-radius:20px; }
}
