
/* =========================================
   Practice Pack — scoped base styles
   Only affects the Practice Pack UI/PDF
========================================= */

:is(#ghpp-dialog, #ghpp-stage) {
  font: 14px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: #111;
}

:is(#ghpp-dialog, #ghpp-stage) main {
  max-width: 900px;
  margin: 24px auto;
  padding: 0 16px;
}

:is(#ghpp-dialog, #ghpp-stage) h1 {
  font-size: 22px;
  margin: 8px 0 16px;
}

:is(#ghpp-dialog, #ghpp-stage) form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

:is(#ghpp-dialog, #ghpp-stage) label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

:is(#ghpp-dialog, #ghpp-stage) input,
:is(#ghpp-dialog, #ghpp-stage) select,
:is(#ghpp-dialog, #ghpp-stage) textarea {
  padding: 9px;
  border: 1px solid #e8e8e8;
  border-radius: 10px;
}

:is(#ghpp-dialog, #ghpp-stage) textarea {
  min-height: 100px;
}

:is(#ghpp-dialog, #ghpp-stage) .full {
  grid-column: 1 / -1;
}

:is(#ghpp-dialog, #ghpp-stage) .row {
  display: flex;
  gap: 8px;
  align-items: center;
}

:is(#ghpp-dialog, #ghpp-stage) .tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

:is(#ghpp-dialog, #ghpp-stage) .tag {
  background: #f0f3f8;
  border: 1px solid #e1e8f5;
  border-radius: 999px;
  padding: 5px 8px;
  font-size: 12px;
}

:is(#ghpp-dialog, #ghpp-stage) .actions {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}

:is(#ghpp-dialog, #ghpp-stage) .muted {
  color: #666;
}
      

  #questions-editor { display:grid; gap:12px; }
  .q-card {
    border:1px solid #ddd;
    border-radius:12px;
    padding:12px;
    background:#fff;
  }
  .q-grid {
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:10px;
  }
  .q-grid .full { grid-column: 1 / -1; }
  .q-card input[type="text"],
  .q-card input[type="number"],
  .q-card textarea {
    width:100%;
    box-sizing:border-box;
  }
  .q-preview {
    max-width: 100%;
    max-height: 100%;
    border-radius:8px;
    display:block;
    margin-top:8px;
    border:1px solid #ddd;
  }

      
      .q-card-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:10px;
}

.q-delete {
  border:1px solid #f0caca;
  background:#fff5f5;
  color:#a32020;
  border-radius:8px;
  padding:6px 10px;
  cursor:pointer;
  font-size:12px;
}

.q-delete:hover {
  background:#fde8e8;
}

/* =========================================
   Practice Pack controls
========================================= */
.btn-print-pack {
  border:1px solid #cec9ff;
  background:linear-gradient(135deg,#5b4cf0,#7b68ee);
  color:#fff;
  border-radius:10px;
  padding:9px 14px;
  font-weight:750;
  cursor:pointer;
  box-shadow:0 7px 18px rgba(91,76,240,.18);
}

.btn-print-pack:hover {
  filter:brightness(.98);
  transform:translateY(-1px);
}

.btn-print-pack:disabled {
  cursor:wait;
  opacity:.65;
  transform:none;
}

.pack-dialog {
  width:min(560px,calc(100vw - 32px));
  border:0;
  border-radius:18px;
  padding:0;
  color:#172033;
  box-shadow:0 24px 80px rgba(23,32,51,.28);
}

.pack-dialog::backdrop {
  background:rgba(15,23,42,.58);
  backdrop-filter:blur(3px);
}

.pack-dialog-head {
  padding:22px 24px 16px;
  border-bottom:1px solid #eceef4;
  background:linear-gradient(135deg,#f8f7ff,#fff);
}

.pack-dialog-head h2 {
  margin:0 0 5px;
  font-size:20px;
}

.pack-dialog-body {
  display:grid;
  gap:15px;
  padding:20px 24px;
}

.pack-dialog-body label {
  gap:7px;
  font-weight:650;
}

.pack-check {
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start;
  gap:10px !important;
  font-weight:500 !important;
}

.pack-check input {
  margin-top:3px;
}

.pack-dialog-actions {
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:16px 24px 22px;
  border-top:1px solid #eceef4;
}

.pack-dialog-actions button {
  border-radius:10px;
  padding:9px 14px;
  cursor:pointer;
}

.pack-dialog-actions .secondary {
  border:1px solid #d9dce5;
  background:#fff;
  color:#2a3347;
}

.pack-dialog-actions .primary {
  border:1px solid #5b4cf0;
  background:#5b4cf0;
  color:#fff;
  font-weight:750;
}

#pdf-pack-stage {
  position:absolute;
  left:-100000px;
  top:0;
  z-index:-1;
}

/* =========================================
   PDF-only Practice Pack design
========================================= */
.pdf-pack {
  --pack-ink:#592525;
  --pack-muted:#667085;
  --pack-accent:#f06262;
  --pack-accent-soft:#e29595;
  --pack-line:#dfe3eb;
  width:8.5in;
  box-sizing:border-box;
  padding:.5in .55in .72in;
  background:#fff;
  color:var(--pack-ink);
  font-family:Arial,"Noto Sans",Tahoma,sans-serif;
  font-size:11pt;
  line-height:1.42;
}

.pdf-pack * {
  box-sizing:border-box;
}

.pdf-pack[dir="rtl"] {
  font-family:Tahoma,Arial,"Noto Sans Arabic",sans-serif;
}

.gamehutFont {
  display: inline-block;
  white-space: nowrap;
  font-family: "baudot", sans-serif;
  font-weight: 900;
  font-style: normal;
    text-transform: lowercase;
}
.gamehut-wordmark-image {
  display:inline-block;
  vertical-align:middle;
  flex:0 0 auto;
  max-width:none;
  object-fit:contain;
}

.pack-top-rule {
  height:6px;
  margin:-.5in -.55in .28in;
  background:linear-gradient(90deg,var(--pack-accent),#998ef3 65%,#d8d3ff);
}

.pack-brand-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  direction: ltr;

  width: calc(100% + .85in);

  gap: 18px;
  margin-bottom: .23in;
}
.pack-brand {
  display:flex;
  align-items:center;
  gap:9px;
}

.pack-brand .gamehutFont {
  font-size:21pt;
  line-height:1;
  letter-spacing:-.35px;
}

.pack-logo-die {
  position:relative;
  width:27px;
  height:27px;
  flex:0 0 27px;
  border-radius:8px;
  background:var(--pack-accent);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.1);
    display: none;
}

.pack-logo-die::before,
.pack-logo-die::after {
  content:"";
  position:absolute;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#fff;
  top:6px;
}

.pack-logo-die::before { left:6px; box-shadow:10px 10px 0 #fff; }
.pack-logo-die::after  { right:6px; box-shadow:-10px 10px 0 #fff; }

.pack-product-pill,
.pack-teacher-pill {
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:6px 10px;
  font-size:8.5pt;
  font-weight:800;
  letter-spacing:0px;
  text-transform:none;
    display: none;
}

.pack-product-pill {
  color:var(--pack-accent);
  background:var(--pack-accent-soft);
}

.pack-teacher-pill {
  color:#7a4512;
  background:#fff3d8;
}

.pack-title-block {
  padding:.22in .24in;
  border:1px solid #e5e2ff;
  border-radius:16px;
  background:linear-gradient(135deg,#faf9ff,#f1efff);
  break-inside:avoid;
  page-break-inside:avoid;
}

.pack-eyebrow {
  margin-bottom:5px;
  color:var(--pack-accent);
  font-size:8.5pt;
  font-weight:800;
  letter-spacing:1.2px;
  text-transform:none;
    display: none;
}

.pack-title {
  margin:0;
  font-size:23pt;
  line-height:1.12;
  letter-spacing:-.6px;
}

.pack-summary {
  margin-top:8px;
  color:#4b5568;
  font-size:10pt;
}

.pack-meta-row {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:12px;
}

.pack-meta-chip {
  border:1px solid #dcd8ff;
  border-radius:999px;
  padding:4px 8px;
  background:#fff;
  color:#4b4678;
  font-size:8.5pt;
  font-weight:700;
}

.pack-student-lines {
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:18px;
  margin:.24in 0 .18in;
}

.pack-line-field {
  display:flex;
  align-items:flex-end;
  gap:8px;
  min-width:0;
  font-size:9.5pt;
  font-weight:700;
}

.pack-line-field span:last-child {
  flex:1;
  min-width:30px;
  border-bottom:1px solid #667085;
  transform:translateY(-2px);
}

.pack-instructions {
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin-bottom:.19in;
  padding:10px 12px;
  border-left:4px solid var(--pack-accent);
  border-radius:0 10px 10px 0;
  background:#f7f7fb;
  color:#475067;
  font-size:9.5pt;
}

/* English/LTR directions */
#ghpp-stage .pack-instructions[dir="ltr"] {
  direction: ltr;
  text-align: left;

  border-left: 4px solid var(--pack-accent);
  border-right: 0;

  border-radius: 0 10px 10px 0;
}


/* Arabic/RTL directions */
#ghpp-stage .pack-instructions[dir="rtl"] {
  direction: rtl;
  text-align: right;

  border-left: 0;
  border-right: 4px solid var(--pack-accent);

  border-radius: 10px 0 0 10px;
}
.pack-instructions strong {
  color:var(--pack-ink);
}

.pack-questions {
  display:grid;
  gap:12px;
}

.pack-question {
  display:grid;
  grid-template-columns:34px 1fr;
  gap:11px;
  padding:13px 14px;
  border:1px solid var(--pack-line);
  border-radius:13px;
  background:#fff;
  break-inside:avoid;
  page-break-inside:avoid;
}

.pdf-pack[dir="rtl"] .pack-question {
  grid-template-columns:1fr 34px;
}

.pack-q-number {
  display:grid;
  place-items:center;
  align-self:start;
  width:31px;
  height:31px;
  border-radius:10px;
  background:#f8dddd;
  border:1.5px solid var(--pack-accent);
  color:#592525;
  font-weight:850;
}

.pdf-pack.dicekrush-pack[dir="rtl"]
.pack-question > .pack-q-number {
  grid-column: 2;
}
.pdf-pack[dir="rtl"] .pack-q-content {
  grid-column:1;
  grid-row:1;
}

.pack-question-text {
  margin-bottom:9px;
  font-weight:750;
  font-size:11pt;
}

.pack-options {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px 14px;
}

.pack-option {
  display:flex;
  align-items:flex-start;
  gap:7px;
  min-width:0;
  color:#30384a;
  font-size:10pt;
}

.pack-choice-bubble {
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  flex:0 0 20px;
  border:1.4px solid #aab1c0;
  border-radius:50%;
  color:#596174;
  font-size:8pt;
  font-weight:800;
}

.pack-answer-bank {
  margin-bottom:.18in;
  padding:12px 14px;
  border:1.5px solid #d6d0ff;
  border-radius:13px;
  background:#faf9ff;
  break-inside:avoid;
  page-break-inside:avoid;
}
.pack-answer-bank-title {
  margin-bottom:9px;
  color:var(--pack-ink);
  font-size:8.5pt;
  font-weight:850;
  letter-spacing:.8px;
  text-transform:none;
}

.pack-bank-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px 14px;
}

.pack-bank-item {
  display:flex;
  align-items:flex-start;
  gap:7px;
  min-width:0;
  color:#30384a;
  font-size:9.5pt;
}

.pack-bank-letter {
  display:grid;
  place-items:center;
  width:21px;
  height:21px;
  flex:0 0 21px;
  border-radius:7px;
  background:#f8dddd;
  border:1.5px solid var(--pack-accent);
  color:var(--pack-ink);
  font-size:8pt;
  font-weight:850;
}
      
.pack-word-chip {
  display:inline-flex;
  align-items:center;
  min-height:23px;
  border:1px solid #ddd9ff;
  border-radius:999px;
  padding:3px 9px;
  background:#fff;
  color:#3f3a6f;
  font-size:9pt;
  font-weight:700;
}
.pack-match-list,
.pack-fill-list {
  display:grid;
  gap:10px;
}

/* Default matching layout */
.pack-match-row {
  display:grid;
  grid-template-columns:31px 38px 1fr;
  gap:10px;
  align-items:center;
  padding:12px 13px;
  border:1px solid var(--pack-line);
  border-radius:12px;
  background:#fff;
  break-inside:avoid;
  page-break-inside:avoid;
}

.pack-match-blank {
  height:27px;
  border-bottom:1.5px solid #70798c;
}

.pack-match-text,
.pack-fill-text {
  padding-top:4px;
  font-size:10.5pt;
  font-weight:700;
}


/* =========================================
   RTL matching layout
   Physical order:
   blank | Arabic text | number
========================================= */

.pdf-pack[dir="rtl"] .pack-match-row {
  grid-template-columns:70px minmax(0,1fr) 31px;
  gap:12px;
  direction:ltr;
  align-items:center;
}

/* Number goes on the far right */
.pdf-pack.dicekrush-pack[dir="rtl"]
.pack-match-row > .pack-q-number {
  grid-column: 3;
  grid-row: 1;
}
/* Arabic prompt gets the large middle column */
.pdf-pack[dir="rtl"] .pack-match-text {
  grid-column:2;
  grid-row:1;
  direction:rtl;
  text-align:right;
  padding-top:0;
  line-height:1.45;
  min-width:0;
}

/* Matching blank stays short on the left */
.pdf-pack[dir="rtl"] .pack-match-blank {
  grid-column:1;
  grid-row:1;
  width:70px;
  height:24px;
  justify-self:stretch;
}
.pdf-pack[dir="rtl"] .pack-match-text {
  padding-top:0;
  text-align:right;
  line-height:1.45;
}

.pack-match-text,
.pack-fill-text {
  padding-top:4px;
  font-size:10.5pt;
  font-weight:700;
}

.pack-fill-row {
  display:grid;
  grid-template-columns:31px 1fr;
  gap:11px;
  padding:12px 13px 14px;
  border:1px solid var(--pack-line);
  border-radius:12px;
  background:#fff;
  break-inside:avoid;
  page-break-inside:avoid;
}

/* Arabic / RTL fill-in layout */
.pdf-pack[dir="rtl"] .pack-fill-row {
  grid-template-columns:minmax(0, 1fr) 31px;
  gap:11px;
  direction:ltr;
  align-items:start;
}

.pdf-pack[dir="rtl"] .pack-fill-row > .pack-q-number {
  grid-column:2;
  grid-row:1;
}

.pdf-pack[dir="rtl"] .pack-fill-row > .pack-fill-text {
  grid-column:1;
  grid-row:1;
  direction:rtl;
  text-align:right;
  min-width:0;
  padding-top:4px;
  line-height:1.55;
}

.pack-inline-blank {
  display:inline-block;
  width:1.55in;
  min-width:90px;
  height:1em;
  margin:0 4px;
  border-bottom:1.5px solid #5f687b;
  vertical-align:baseline;
}

.pdf-pack[dir="rtl"] .pack-inline-blank {
  direction:ltr;
  margin:0 6px;
}

.pack-response-line {
  display:flex;
  align-items:flex-end;
  gap:8px;
  margin-top:13px;
  color:#667085;
  font-size:8.5pt;
  font-weight:700;
}

.pack-response-line::after {
  content:"";
  flex:1;
  min-width:1.6in;
  border-bottom:1.2px solid #7d8595;
}

.pack-tagline {
  margin-top:.16in;
  color:#98a2b3;
  font-size:7.5pt;
  font-weight:500;
  letter-spacing:.1px;
  text-align:right;
}

.pdf-pack[dir="rtl"] .pack-tagline {
  text-align:left;
}
.answer-key-section {
  padding-top:.5in;
  break-before:page;
  page-break-before:always;
}

.answer-key-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  margin-bottom:.2in;
}

.answer-key-title {
  margin:4px 0 0;
  font-size:22pt;
  line-height:1.1;
}

.answer-key-note {
  color:var(--pack-muted);
  font-size:9.5pt;
}

.answer-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}

.answer-row {
  display:grid;
  grid-template-columns:31px 1fr;
  gap:9px;
  padding:10px;
  border:1px solid var(--pack-line);
  border-radius:11px;
  break-inside:avoid;
  page-break-inside:avoid;
}

.answer-number {
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:9px;
  background:#f1efff;
  border:1.5px solid #998ef3;
  color:#3f3a6f;
  font-weight:850;
}

.answer-value {
  font-weight:800;
  color:#20283a;
}

.answer-question {
  margin-top:2px;
  color:var(--pack-muted);
  font-size:8.5pt;
}

.pack-end-note {
  white-space:nowrap;
  margin-top:.24in;
  padding-top:11px;
  border-top:1px solid var(--pack-line);
  color:var(--pack-muted);
  font-size:1.5rem;
  text-align:center;
}


/* =========================================
   Vocabee Practice Pack layouts
========================================= */
.pdf-pack.vocabee-pack {
  --pack-ink:#3e2f16;
  --pack-muted:#746a58;
  --pack-accent:#c98200;
  --pack-accent-soft:#fff1c9;
  --pack-line:#eadfca;
}

.vocab-study-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px 12px;
}

.vocab-study-item,
.vocab-activity-row,
.vocab-sentence-row {
  break-inside:avoid;
  page-break-inside:avoid;
  border:1px solid var(--pack-line);
  border-radius:12px;
  background:#fff;
}

.vocab-study-item {
  display:grid;
  grid-template-columns:30px 1fr;
  gap:9px;
  align-items:center;
  padding:10px 12px;
}

.vocab-study-number,
.vocab-row-number {
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  border-radius:9px;
  background:var(--pack-accent-soft);
  color:var(--pack-accent);
  font-size:8.5pt;
  font-weight:850;
}

.vocab-study-word {
  font-size:11pt;
  font-weight:750;
  overflow-wrap:anywhere;
}

.vocab-activity-list,
.vocab-sentence-list {
  display:grid;
  gap:10px;
}

.vocab-activity-row {
  display:grid;
  grid-template-columns:30px minmax(0,1fr) minmax(1.25in,.7fr);
  gap:10px;
  align-items:center;
  padding:11px 12px;
}

.vocab-activity-row.vocab-match-row {
  grid-template-columns:30px 36px minmax(0,1fr);
}

.vocab-match-blank {
  height:25px;
  border-bottom:1.5px solid #766b58;
}

.vocab-clue {
  min-width:0;
  font-size:11pt;
  font-weight:750;
  letter-spacing:.4px;
  overflow-wrap:anywhere;
}

.vocab-answer-line {
  min-width:1in;
  height:26px;
  border-bottom:1.3px solid #827866;
}

.vocab-letter-pattern {
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  gap:4px;
  min-height:27px;
}

.vocab-letter-slot {
  display:inline-grid;
  place-items:center;
  min-width:18px;
  height:24px;
  padding:0 2px;
  border-bottom:1.4px solid #766b58;
  font-size:10.5pt;
  font-weight:750;
}

.vocab-letter-slot.is-space {
  min-width:10px;
  border-bottom:0;
}

.vocab-sentence-row {
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:10px;
  padding:12px 13px 14px;
}

.vocab-sentence-word {
  display:inline-flex;
  align-items:center;
  min-height:25px;
  margin-bottom:8px;
  border:1px solid #ead8ae;
  border-radius:999px;
  padding:3px 10px;
  background:#fff8e7;
  color:#6f4700;
  font-size:10pt;
  font-weight:800;
}

.vocab-writing-lines {
  display:grid;
  gap:13px;
  margin-top:5px;
}

.vocab-writing-lines span {
  display:block;
  height:16px;
  border-bottom:1px solid #a59b89;
}

/* =========================================
   Buzzrs printable activities
========================================= */
.pdf-pack.buzzrs-pack {
  --pack-ink:#17324d;
  --pack-muted:#66788a;
  --pack-accent:#1677c8;
  --pack-accent-soft:#e8f4ff;
  --pack-line:#d9e5ef;
}

.buzz-category-section {
  margin-bottom:.22in;
  break-inside:auto;
  page-break-inside:auto;
}

.buzz-category-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
  padding:8px 11px;
  border-radius:11px;
  background:var(--pack-accent-soft);
  color:var(--pack-accent);
  break-after:avoid;
  page-break-after:avoid;
}

.buzz-category-title {
  font-size:11pt;
  font-weight:850;
}

.buzz-category-count {
  color:#55718a;
  font-size:8.5pt;
  font-weight:700;
}

.buzz-review-list,
.buzz-short-list,
.buzz-study-list {
  display:grid;
  gap:9px;
}

.buzz-review-row,
.buzz-short-row,
.buzz-study-row {
  display:grid;
  grid-template-columns:31px minmax(0,1fr);
  gap:10px;
  padding:11px 12px 13px;
  border:1px solid var(--pack-line);
  border-radius:12px;
  background:#fff;
  break-inside:avoid;
  page-break-inside:avoid;
}

.buzz-question-meta {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin-bottom:5px;
  color:var(--pack-muted);
  font-size:8pt;
  font-weight:750;
}

.buzz-meta-pill,
.buzz-dd-pill {
  display:inline-flex;
  align-items:center;
  min-height:20px;
  border-radius:999px;
  padding:2px 7px;
}

.buzz-meta-pill {
  border:1px solid #cfe0ed;
  background:#f8fbfd;
}

.buzz-dd-pill {
  border:1px solid #e9c46a;
  background:#fff6d8;
  color:#8a5b00;
}

.buzz-question-text {
  font-size:10.5pt;
  font-weight:750;
}

.buzz-question-image {
  display:block;
  width:auto;
  max-width:100%;
  max-height:1.55in;
  margin:8px 0 2px;
  border:1px solid var(--pack-line);
  border-radius:9px;
  object-fit:contain;
}

.buzz-response-lines {
  display:grid;
  gap:10px;
  margin-top:11px;
}

.buzz-response-lines span {
  display:block;
  height:15px;
  border-bottom:1px solid #8998a8;
}

.buzz-match-list {
  display:grid;
  gap:9px;
}

.buzz-match-row {
  display:grid;
  grid-template-columns:31px 38px minmax(0,1fr);
  gap:9px;
  align-items:start;
  padding:11px 12px;
  border:1px solid var(--pack-line);
  border-radius:12px;
  background:#fff;
  break-inside:avoid;
  page-break-inside:avoid;
}

.buzz-match-blank {
  height:27px;
  border-bottom:1.5px solid #6e8092;
}

.buzz-cards-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.buzz-card {
  position:relative;
  min-height:2.25in;
  padding:13px 14px 15px;
  border:1.4px dashed #8ca9bf;
  border-radius:12px;
  background:#fff;
  break-inside:avoid;
  page-break-inside:avoid;
}

.buzz-card::after {
  content:"Cut card";
  position:absolute;
  right:9px;
  bottom:6px;
  color:#a0aeb9;
  font-size:6.8pt;
  letter-spacing:.3px;
}

.buzz-card-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
  margin-bottom:10px;
  padding-bottom:7px;
  border-bottom:1px solid var(--pack-line);
}

.buzz-card-category {
  color:var(--pack-accent);
  font-size:9pt;
  font-weight:850;
}

.buzz-card-points {
  flex:0 0 auto;
  color:#536b80;
  font-size:8.5pt;
  font-weight:800;
}

.buzz-card-question {
  font-size:10.5pt;
  font-weight:750;
}

.buzz-card .buzz-question-image {
  max-height:1.05in;
}

.buzz-study-answer {
  margin-top:9px;
  padding:8px 10px;
  border-left:4px solid var(--pack-accent);
  border-radius:0 8px 8px 0;
  background:#f6fbff;
  color:#27445f;
  font-size:9.5pt;
}

.pdf-pack[dir="rtl"] .buzz-study-answer {
  border-left:0;
  border-right:4px solid var(--pack-accent);
  border-radius:8px 0 0 8px;
}

.pack-field-help {
  color:#667085;
  font-size:12px;
  font-weight:500;
}

@media (max-width:700px) {
  #ghpp-dialog .actions,
  #ghpp-stage .actions {
    flex-wrap: wrap;
  }

  #ghpp-dialog .pack-dialog-actions {
    flex-wrap: wrap;
  }
}
    

#ghpp-stage {
  position: absolute;
  left: -100000px;
  top: 0;
  z-index: -1;
}





/* =========================================
   Buzzrs Practice Pack
   Scoped ONLY to generated pack stage
========================================= */

#ghpp-stage .pdf-pack.buzzrs-pack {
  --pack-ink: #17324d;
  --pack-muted: #66788a;
  --pack-accent: #1677c8;
  --pack-accent-soft: #e8f4ff;
  --pack-line: #d9e5ef;
}


/* Categories */

#ghpp-stage .buzz-category-section {
  margin-bottom: 0.22in;
  break-inside: auto;
  page-break-inside: auto;
}

#ghpp-stage .buzz-category-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  margin-bottom: 8px;
  padding: 8px 11px;

  border-radius: 11px;

  background: var(--pack-accent-soft);
  color: var(--pack-accent);

  break-after: avoid;
  page-break-after: avoid;
}

#ghpp-stage .buzz-category-title {
  font-size: 11pt;
  font-weight: 850;
}

#ghpp-stage .buzz-category-count {
  color: #55718a;
  font-size: 8.5pt;
  font-weight: 700;
}


/* Lists */

#ghpp-stage .buzz-review-list,
#ghpp-stage .buzz-short-list,
#ghpp-stage .buzz-study-list {
  display: grid;
  gap: 9px;
}


/* Standard question rows */

#ghpp-stage .buzz-review-row,
#ghpp-stage .buzz-short-row,
#ghpp-stage .buzz-study-row {
  display: grid;

  grid-template-columns:
    31px minmax(0, 1fr);

  gap: 10px;

  padding:
    11px 12px 13px;

  border:
    1px solid
    var(--pack-line);

  border-radius: 12px;

  background: #fff;

  break-inside: avoid;
  page-break-inside: avoid;
}


/* Metadata */

#ghpp-stage .buzz-question-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;

  gap: 6px;

  margin-bottom: 5px;

  color:
    var(--pack-muted);

  font-size: 8pt;
  font-weight: 750;
}

#ghpp-stage .buzz-meta-pill,
#ghpp-stage .buzz-dd-pill {
  display: inline-flex;
  align-items: center;

  min-height: 20px;

  border-radius: 999px;

  padding: 2px 7px;
}

#ghpp-stage .buzz-meta-pill {
  border: 1px solid #cfe0ed;
  background: #f8fbfd;
}

#ghpp-stage .buzz-dd-pill {
  border: 1px solid #e9c46a;

  background: #fff6d8;

  color: #8a5b00;
}


/* Question */

#ghpp-stage .buzz-question-text {
  font-size: 10.5pt;
  font-weight: 750;
}


/* Images */

#ghpp-stage .buzz-question-image {
  display: block;

  width: auto;
  max-width: 100%;
  max-height: 1.55in;

  margin: 8px 0 2px;

  border:
    1px solid
    var(--pack-line);

  border-radius: 9px;

  object-fit: contain;
}


/* Response lines */

#ghpp-stage .buzz-response-lines {
  display: grid;

  gap: 10px;

  margin-top: 11px;
}

#ghpp-stage .buzz-response-lines span {
  display: block;

  height: 15px;

  border-bottom:
    1px solid
    #8998a8;
}


/* Matching */

#ghpp-stage .buzz-match-list {
  display: grid;
  gap: 9px;
}

#ghpp-stage .buzz-match-row {
  display: grid;

  grid-template-columns:
    31px 38px minmax(0, 1fr);

  gap: 9px;

  align-items: start;

  padding: 11px 12px;

  border:
    1px solid
    var(--pack-line);

  border-radius: 12px;

  background: #fff;

  break-inside: avoid;
  page-break-inside: avoid;
}

#ghpp-stage .buzz-match-blank {
  height: 27px;

  border-bottom:
    1.5px solid
    #6e8092;
}


/* Offline cards */

#ghpp-stage .buzz-cards-grid {
  display: grid;

  grid-template-columns:
    repeat(
      2,
      minmax(0, 1fr)
    );

  gap: 12px;
}

#ghpp-stage .buzz-card {
  position: relative;

  min-height: 2.25in;

  padding: 13px 14px 15px;

  border:
    1.4px dashed
    #8ca9bf;

  border-radius: 12px;

  background: #fff;

  break-inside: avoid;
  page-break-inside: avoid;
}

#ghpp-stage .buzz-card::after {
  content: "Cut card";

  position: absolute;

  right: 9px;
  bottom: 6px;

  color: #a0aeb9;

  font-size: 6.8pt;

  letter-spacing:
    0.3px;
}

#ghpp-stage .buzz-card-head {
  display: flex;

  align-items: flex-start;

  justify-content:
    space-between;

  gap: 8px;

  margin-bottom: 10px;

  padding-bottom: 7px;

  border-bottom:
    1px solid
    var(--pack-line);
}

#ghpp-stage .buzz-card-category {
  color:
    var(--pack-accent);

  font-size: 9pt;
  font-weight: 850;
}

#ghpp-stage .buzz-card-points {
  flex: 0 0 auto;

  color: #536b80;

  font-size: 8.5pt;
  font-weight: 800;
}

#ghpp-stage .buzz-card-question {
  font-size: 10.5pt;
  font-weight: 750;
}

#ghpp-stage .buzz-card .buzz-question-image {
  max-height: 1.05in;
}


/* Study guide answer */

#ghpp-stage .buzz-study-answer {
  margin-top: 9px;

  padding: 8px 10px;

  border-left:
    4px solid
    var(--pack-accent);

  border-radius:
    0 8px 8px 0;

  background: #f6fbff;

  color: #27445f;

  font-size: 9.5pt;
}

#ghpp-stage
.pdf-pack[dir="rtl"]
.buzz-study-answer {
  border-left: 0;

  border-right:
    4px solid
    var(--pack-accent);

  border-radius:
    8px 0 0 8px;
}







/* =========================================
   FINAL PDF direction/alignment safeguards
========================================= */

/* LTR */
#ghpp-stage .pdf-pack[dir="ltr"],
#ghpp-stage .pdf-pack[dir="ltr"] .pack-title,
#ghpp-stage .pdf-pack[dir="ltr"] .pack-summary,
#ghpp-stage .pdf-pack[dir="ltr"] .pack-question-text,
#ghpp-stage .pdf-pack[dir="ltr"] .pack-option,
#ghpp-stage .pdf-pack[dir="ltr"] .pack-q-content {
  direction: ltr;
  text-align: left !important;
}


/* RTL */
#ghpp-stage .pdf-pack[dir="rtl"] {
  direction: rtl;
  text-align: right !important;

  /*
    Tahoma handles browser-rendered Arabic well.
    Do not put Arial ahead of it.
  */
  font-family: Tahoma, "Noto Sans Arabic", Arial, sans-serif;

  letter-spacing: normal;
  word-spacing: normal;
}


/* Arabic headings / titles */
#ghpp-stage .pdf-pack[dir="rtl"] .pack-title,
#ghpp-stage .pdf-pack[dir="rtl"] .pack-summary {
  direction: rtl;
  text-align: right !important;

  letter-spacing: normal;
  word-spacing: normal;
}


/* Arabic question content */
#ghpp-stage .pdf-pack[dir="rtl"] .pack-q-content,
#ghpp-stage .pdf-pack[dir="rtl"] .pack-question-text {
  direction: rtl;
  text-align: right !important;

  width: 100%;

  /*
    Important for Arabic mixed with punctuation,
    underscores, numbers, etc.
  */
unicode-bidi: isolate;

  letter-spacing: normal;
  word-spacing: normal;

  line-height: 1.7;

  /*
    Avoid synthetic 750-weight Arabic getting
    crushed by html2canvas.
  */
  font-weight: 600;
}


/* RTL multiple-choice answer grid */
#ghpp-stage .pdf-pack[dir="rtl"] .pack-options {
  direction: rtl;
}


/* Individual RTL answer */
#ghpp-stage .pdf-pack[dir="rtl"] .pack-option {
  direction: rtl;
  text-align: right !important;

  justify-content: flex-start;

  letter-spacing: normal;
  word-spacing: normal;

  line-height: 1.6;

unicode-bidi: isolate;
}


/* =========================================
   Arabic text inside generated PDFs
========================================= */

#ghpp-stage .pack-bidi-text {
  display: block;
  width: 100%;

  direction: rtl;
  unicode-bidi: isolate;

  text-align: right !important;

  font-family: Tahoma, Arial, sans-serif;
  font-weight: 600;

  letter-spacing: 0;
  word-spacing: normal;

  line-height: 1.65;

  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
}

#ghpp-stage .pack-question-text[dir="rtl"],
#ghpp-stage .pack-option-text[dir="rtl"] {
  direction: rtl;
  unicode-bidi: isolate;

  text-align: right !important;

  font-family: Tahoma, Arial, sans-serif;
  font-weight: 600;

  letter-spacing: 0;
  word-spacing: 0.06em;

  line-height: 1.7;
}


/* A real blank instead of RTL-unfriendly underscores */
#ghpp-stage .pack-rtl-blank {
  display: inline-block;

  width: 1.45in;
  min-width: 90px;

  height: 0.9em;

  margin-inline: 7px;

  border-bottom: 1.5px solid #5f687b;

  vertical-align: baseline;

  direction: ltr;
}

#ghpp-stage .pdf-pack[dir="rtl"] .pack-brand,
#ghpp-stage .pdf-pack[dir="rtl"] .pack-tagline,
#ghpp-stage .pdf-pack[dir="rtl"] .pack-end-note {
  direction: ltr !important;
  unicode-bidi: isolate;
}

#ghpp-stage .pdf-pack[dir="rtl"] .pack-end-note {
  text-align: center !important;
}

/* =========================================
   RTL DiceKrush answer choices
========================================= */

#ghpp-stage .pdf-pack[dir="rtl"] .pack-options {
  grid-template-columns: 1fr;
  direction: rtl;
  justify-items: stretch;
}

#ghpp-stage .pdf-pack[dir="rtl"] .pack-option {
  width: 100%;
  direction: rtl;
  text-align: right !important;
  justify-content: flex-start;
}

#ghpp-stage .pdf-pack[dir="rtl"] .pack-option-text {
  display: block;
  width: 100%;
  direction: rtl;
  text-align: right !important;
}




/* =========================================
   Arabic title using the same bidi engine
   as Arabic question text
========================================= */

#ghpp-stage .pack-title[dir="rtl"] {
  direction: rtl !important;
  text-align: right !important;

  font-family:
    Tahoma,
    "Noto Sans Arabic",
    Arial,
    sans-serif !important;

  letter-spacing: 0 !important;
  word-spacing: normal !important;
}

#ghpp-stage .pack-title[dir="rtl"] .pack-bidi-text {
  display: block;
  width: 100%;

  direction: rtl;
  unicode-bidi: isolate;

  text-align: right !important;

  font-family:
    Tahoma,
    "Noto Sans Arabic",
    Arial,
    sans-serif !important;

  font-size: inherit;
  font-weight: 700;

  line-height: 1.3;

  letter-spacing: 0 !important;
  word-spacing: normal !important;
}

/* =========================================
   Arabic pack title
   Completely separate from Latin .pack-title
========================================= */

#ghpp-stage .pack-title-ar {
  display: block;
  width: 100%;

  margin: 0;

  direction: rtl !important;
  unicode-bidi: plaintext;

  text-align: right !important;

  font-family:
    Tahoma,
    Arial,
    sans-serif !important;

  font-size: 23pt;
  font-weight: 600;

  line-height: 1.35;

  letter-spacing: normal !important;
  word-spacing: normal !important;

  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
}



/* =========================================
   Arabic worksheet body font
========================================= */

#ghpp-stage .pack-bidi-text,
#ghpp-stage .pack-question-text[dir="rtl"],
#ghpp-stage .pack-option-text[dir="rtl"],
#ghpp-stage .pack-match-text[dir="rtl"],
#ghpp-stage .pack-fill-text[dir="rtl"],
#ghpp-stage .buzz-question-text[dir="rtl"] {
  font-family:
    "Noto Naskh Arabic",
    sans-serif !important;
}


/* =========================================
   Question text direction
========================================= */

#ghpp-stage .pack-question-text[dir="ltr"] {
  direction: ltr !important;
  unicode-bidi: isolate;

  width: 100%;
  text-align: left !important;

  justify-self: stretch;
}

#ghpp-stage .pack-question-text[dir="rtl"] {
  direction: rtl !important;
  unicode-bidi: isolate;

  width: 100%;
  text-align: right !important;

  justify-self: stretch;
}

.pack-end-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;

  white-space: nowrap;

  margin-top: .12in;
  padding-top: 5px;

  border-top: 1px solid var(--pack-line);

  color: var(--pack-muted);
  font-size: 8.5pt;
  line-height: 1;

  text-align: center;
}

/* Keep the rasterized gamehut wordmark compact */
#ghpp-stage
.pack-end-note
.gamehut-wordmark-image {
  height: 11px !important;
  width: auto !important;

  margin: 0 !important;

  vertical-align: left;
  object-fit: contain;
}


