/* Texas Grab-and-Go Substitute Packets — shared print + screen styles. US Letter, grayscale-safe, selectable text. One restrained accent per subject; meaning never depends on color alone (labels, borders, and patterns carry it too). */ :root{ --ink:#172033; --muted:#4a566c; --paper:#ffffff; --panel:#f4f6f9; --line:#c3ccda; --rla:#6b3fa0; --math:#0a5f8f; --science:#17745b; --social:#9a5b17; --accent:#17745b; /* set per subject on */ } body[data-subject="rla"] {--accent:var(--rla)} body[data-subject="math"] {--accent:var(--math)} body[data-subject="science"] {--accent:var(--science)} body[data-subject="social"] {--accent:var(--social)} *{box-sizing:border-box} html{-webkit-text-size-adjust:100%} body{margin:0;color:var(--ink);background:#e9edf3; font-family:"Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;line-height:1.5} /* On-screen page frame that mimics a US-Letter sheet */ .sheet{background:var(--paper);width:8.5in;max-width:100%;margin:18px auto;padding:0.6in 0.7in; box-shadow:0 6px 22px rgba(20,32,51,.14)} .toolbar{width:8.5in;max-width:100%;margin:14px auto 0;display:flex;gap:10px;flex-wrap:wrap} .btn{font:inherit;font-weight:700;cursor:pointer;text-decoration:none;border-radius:8px;padding:9px 15px; border:2px solid var(--accent);background:var(--accent);color:#fff;display:inline-flex;align-items:center;gap:7px} .btn.ghost{background:#fff;color:var(--accent)} .btn:focus-visible{outline:3px solid #0a5f8f;outline-offset:2px} /* Masthead */ .mast{border-bottom:3px solid var(--accent);padding-bottom:10px;margin-bottom:14px} .mast .kicker{font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--accent)} .mast h1{font-size:1.55rem;margin:4px 0 6px;line-height:1.1} .mast .facts{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.82rem;font-weight:700;color:var(--muted)} .mast .facts b{color:var(--ink)} .subjecttag{display:inline-block;font-size:.68rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase; color:#fff;background:var(--accent);border-radius:100px;padding:3px 11px} /* Name/date line */ .namebar{display:flex;flex-wrap:wrap;gap:14px;margin:12px 0;font-weight:700;font-size:.9rem} .namebar span{flex:1 1 auto;border-bottom:2px solid var(--ink);min-width:160px} .namebar span::before{content:attr(data-label);font-weight:800;color:var(--muted);margin-right:6px} /* Section headers with the Start/Build/Apply routine */ .part{margin:18px 0 0} .part>h2{display:flex;align-items:center;gap:10px;font-size:1.05rem;margin:0 0 8px; border-left:6px solid var(--accent);padding:6px 0 6px 10px;background:var(--panel)} .part>h2 .step{font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#fff; background:var(--accent);border-radius:6px;padding:2px 8px} .part>h2 .clock{margin-left:auto;font-size:.74rem;font-weight:700;color:var(--muted)} /* Boxes */ .box{border:2px solid var(--line);border-radius:10px;padding:12px 14px;margin:10px 0} .box.direction{border-color:var(--accent);border-left-width:6px;background:#fff} .box.reference{background:var(--panel)} .box.vocab dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px} .box.vocab dt{font-weight:800;color:var(--accent)} .box.vocab dd{margin:0} .box h3{margin:0 0 6px;font-size:.95rem} .box .cap{font-size:.78rem;font-weight:700;color:var(--muted);margin-top:6px} .hint{font-size:.82rem;color:var(--muted);font-weight:600} /* Questions + answer space */ .q{margin:12px 0} .q .stem{font-weight:600} .q .num{font-weight:800;color:var(--accent);margin-right:6px} .lines{--n:3;background-image:repeating-linear-gradient(#fff,#fff 27px,var(--line) 28px); height:calc(var(--n)*28px);border-bottom:1px solid var(--line);margin-top:6px} .answerbox{border:2px dashed var(--line);border-radius:8px;min-height:90px;margin-top:6px} .choices{margin:6px 0 0;padding-left:6px;list-style:none} .choices li{margin:3px 0} .choices li::before{content:attr(data-opt) " ";font-weight:800;color:var(--accent)} /* Data tables + figures (grayscale-safe) */ table.data{border-collapse:collapse;width:100%;font-size:.86rem;margin:8px 0} table.data th,table.data td{border:1px solid var(--ink);padding:6px 9px;text-align:left} table.data th{background:var(--panel);font-weight:800} figure{margin:10px 0;text-align:center} figure svg{max-width:100%;height:auto} figcaption{font-size:.78rem;color:var(--muted);font-weight:700;margin-top:5px} /* CER / ACE frames */ .cer,.ace{border:2px solid var(--accent);border-radius:10px;overflow:hidden;margin:12px 0} .cer>div,.ace>div{padding:9px 12px;border-top:1px solid var(--line)} .cer>div:first-child,.ace>div:first-child{border-top:0} .cer .lab,.ace .lab{font-weight:800;color:var(--accent);text-transform:uppercase;font-size:.72rem;letter-spacing:.05em} .stem-bank{font-size:.82rem;color:var(--muted);font-weight:600} /* Callouts */ .callout{border:2px solid var(--line);border-left-width:6px;border-radius:8px;padding:10px 12px;margin:10px 0;font-size:.9rem} .callout.early{border-left-color:#0a5f8f} .callout.turnin{border-left-color:var(--accent);background:var(--panel);font-weight:700} .callout .lab{font-weight:800;display:block;margin-bottom:2px} /* Answer-key look */ .key .q .ans{border:2px solid var(--accent);border-left-width:6px;border-radius:8px;background:var(--panel); padding:8px 11px;margin-top:5px;font-weight:600} .key .rubric{border-collapse:collapse;width:100%;font-size:.84rem;margin:6px 0} .key .rubric th,.key .rubric td{border:1px solid var(--ink);padding:6px 8px;vertical-align:top} .divider-page{border:3px dashed var(--ink);border-radius:12px;text-align:center;padding:40px 20px;margin:24px 0; font-weight:800;font-size:1.2rem} /* Footer on every page */ .pfoot{margin-top:16px;border-top:1px solid var(--line);padding-top:6px; display:flex;justify-content:space-between;font-size:.7rem;color:var(--muted);font-weight:700} /* Standards / alignment note (teacher-facing, never claims "TEKS-aligned" until reviewed) */ .standards{font-size:.8rem;color:var(--muted)} .standards .pending{color:#9a3412;font-weight:800} /* ---------- PRINT ---------- */ @page{size:Letter;margin:0.5in} @media print{ body{background:#fff} .toolbar,.noprint{display:none !important} .sheet{width:auto;margin:0;padding:0;box-shadow:none} .part{break-inside:avoid} .q,.box,.cer,.ace,figure{break-inside:avoid} .page-break{break-before:page} a[href]::after{content:""} /* no printed URLs on student pages */ }