/* v3 moving-print direction, scoped to the two existing local games.
   OFL font files are shared with Ogniwo; no changes to its UI or assets. */
@font-face { font-family: PartyBodoni; src: url('../assets/ogniwo/bodoni.ttf') format('truetype'); font-weight: 400 900; font-display: swap; }
@font-face { font-family: PartySource; src: url('../assets/ogniwo/source-sans.ttf') format('truetype'); font-weight: 200 900; font-display: swap; }
.party-classic { --game-blue: #1758a6; --game-pink: #e6b9c8; --game-yellow: #f4d34e; --game-ink: #161616; }
.party-classic .tool-main { padding-top: 1rem; }
.party-classic .tool-head { margin-block: 1.5rem 2rem; }
.party-classic .tool-head h1 { font: 800 clamp(2.4rem, 5.5vw, 4.8rem)/1.06 PartyBodoni, Georgia, serif; letter-spacing: -.035em; max-width: 20ch; text-wrap: balance; }
.party-classic .tool-head p { font: 400 1.2rem/1.45 PartySource, sans-serif; max-width: 55ch; margin-top: .75rem; }
.party-classic .tool-head .tool-tile, .party-classic .tool-head .tile { display: none; }
.party-classic .panel {
  --text: #161616; --text-secondary: #505050; --text-muted: #505050;
  --bg: #fff; --surface: #fff; --surface-2: #f2f2f2; --border: #bababa;
  --primary: #1758a6; --primary-soft: #e5eef9;
  color-scheme: light; color: #161616; background: #fff; border: 0; border-top: 8px solid var(--game-blue);
  border-radius: 0; box-shadow: none; padding: clamp(1.2rem, 3vw, 2.5rem);
  font: 400 1.125rem/1.5 PartySource, sans-serif;
}
.charades-page .panel { border-top-color: var(--game-pink); }
.party-classic .panel input, .party-classic .panel select, .party-classic .panel textarea, .party-classic .panel button { font-family: PartySource, sans-serif; font-size: 1.125rem; }
.party-classic .panel input:not([type=checkbox]):not([type=radio]), .party-classic .panel select, .party-classic .panel textarea { background: #fff; color: #161616; border: 1px solid #777; border-radius: 2px; min-height: 48px; padding: .6rem .8rem; }
.party-classic .panel label, .party-classic .panel legend { color: #161616; font-size: 1rem; font-weight: 600; }
.party-classic .panel .hint { color: #505050; font-size: .95rem; line-height: 1.5; }
.party-classic .panel .field { margin-bottom: .85rem; min-width: 0; }
.party-classic .panel [hidden] { display: none !important; }
.party-classic .panel :focus-visible { outline: 3px solid #1758a6; outline-offset: 4px; }
.party-classic .panel .btn { border-radius: 2px; min-height: 48px; padding: .65rem 1.25rem; white-space: normal; background: #fff; color: #161616; border: 1px solid #777; box-shadow: none; }
.party-classic .panel .btn-primary { background: #1758a6; color: #fff; border-color: #1758a6; font-weight: 700; }
.party-classic .panel .btn:hover:not(:disabled) { filter: brightness(.94); transform: none; }
.party-classic .panel .btn:disabled { opacity: .55; cursor: default; }
.party-classic .game-setup-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1rem 2rem; align-items: start; }
.party-classic .select-row:has(input[name=mode]) { display: flex; flex-wrap: wrap; gap: .5rem; }
.party-classic .select-row:has(input[name=mode]) label { display: flex; align-items: center; gap: .5rem; padding: .65rem .8rem; border: 1px solid #aaa; min-height: 48px; cursor: pointer; }
.party-classic .select-row:has(input[name=mode]) label:has(:checked) { background: #f4d34e; border-color: #161616; }
.party-classic input[type=radio], .party-classic input[type=checkbox] { accent-color: #1758a6; width: 1.1rem; height: 1.1rem; }
.party-classic .game-coop-hint, .party-classic .game-team-hint { display: none; }
.party-classic #quiz-setup:has([value=coop]:checked) .game-coop-hint,
.party-classic #quiz-setup:has([value=teams]:checked) .game-team-hint { display: block; }
.party-classic .game-settings-preview { margin: .25rem 0 1rem; font-size: 1rem; color: #505050; }
.party-classic .game-start { margin: .5rem 0 1.5rem; }
.party-classic .game-start .btn { min-width: min(100%, 15rem); }
.party-classic .game-options { border-top: 1px solid #aaa; margin: 0; padding: 0; }
.party-classic .game-options summary { cursor: pointer; padding: 1rem 0; font-weight: 600; min-height: 48px; color: #161616; }
.party-classic .game-options-body { padding: .5rem 0 0; }
.party-classic #quiz-players .list-item { background: #f2f2f2; color: #161616; border-radius: 0; }
.party-classic #quiz-play { background: #1758a6; border-top-color: #f4d34e; color: #fff; }
.party-classic #quiz-play .hint, .party-classic #quiz-progress, .party-classic #quiz-source { color: #fff; }
.party-classic #quiz-turn-player { background: none; color: #fff; border: 0; padding: 0; font-size: 1.3rem; font-weight: 600; }
.party-classic .quiz-question { position: relative; isolation: isolate; color: #161616; padding: 1.1rem 1.25rem; font: 600 clamp(1.6rem, 3.3vw, 2.8rem)/1.22 PartySource, sans-serif; margin: 1.5rem 0 2rem; max-width: 35ch; overflow-wrap: anywhere; }
.party-classic .quiz-question::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #fff; transform: skewY(-1.5deg); }
.party-classic #quiz-question:focus-visible { outline-color: #f4d34e; }
.party-classic .answer-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.party-classic .answer-btn { background: #fff; color: #161616; border: 3px solid #fff; border-radius: 2px; min-height: 76px; font-size: 1.25rem; padding: .85rem 1rem; transition: none; overflow-wrap: anywhere; }
.party-classic .answer-btn:hover:not(:disabled) { background: #f4d34e; border-color: #f4d34e; }
.party-classic .answer-letter { background: #161616; color: #fff; display: grid; place-items: center; width: 2rem; height: 2rem; flex: 0 0 2rem; border-radius: 0; font-weight: 700; }
.party-classic .answer-btn:disabled { opacity: 1; }
.party-classic .answer-btn.correct { background: #d5efdd; border-color: #176036; color: #123b22; }
.party-classic .answer-btn.wrong { background: #f8d8dc; border-color: #8a202b; color: #671520; }
.party-classic #quiz-feedback { background: #fff; color: #161616; border: 0; border-left: 8px solid #f4d34e; border-radius: 0; padding: 1rem; font-size: 1.2rem; }
.party-classic #quiz-timer { background: #f4d34e; color: #161616; border: 0; border-radius: 0; font-size: 1.4rem; animation: none; }
.party-classic #quiz-play .btn-primary { background: #f4d34e; color: #161616; border-color: #f4d34e; }
.party-classic #quiz-play :focus-visible { outline-color: #f4d34e; }
.party-classic #quiz-results { border-top-color: #161616; background: #f4d34e; }
.party-classic #quiz-results h2, .party-classic #ch-result-title { font: 800 clamp(2rem, 4vw, 3rem)/1.1 PartyBodoni, Georgia, serif; }
.party-classic .score-card { background: transparent; color: #161616; border: 1px solid #161616; border-radius: 0; box-shadow: none; }
.party-classic .score-card .value { color: #161616; font: 800 3.5rem/1 PartyBodoni, Georgia, serif; }
.party-classic .score-card .caption { color: #333; }
.party-classic .charades-card { min-height: 30vh; background: #e6b9c8; color: #161616; border: 0; border-radius: 0; padding: clamp(1rem, 4vw, 3rem); }
.party-classic #ch-word { font: 600 clamp(2rem, 5vw, 4.5rem)/1.12 PartySource, sans-serif; overflow-wrap: anywhere; }
.party-classic #ch-heading { font: 800 clamp(1.6rem, 3vw, 2.5rem)/1.2 PartyBodoni, Georgia, serif; margin-top: 0; }
.party-classic .charades-stats { align-items: center; padding: .5rem 0; }
.party-classic #ch-time { font-size: 2.2rem; background: #f4d34e; padding: 0 .5rem; }
.party-classic .charades-actions .btn { min-height: 60px; font-size: 1.2rem; }
.party-classic #ch-correct { background: #1758a6; color: #fff; flex-grow: 2; }
.party-classic #ch-pause { flex: 0 1 auto; }
.party-classic #ch-scores { font-size: 1.4rem; }
.party-classic #ch-winner { font-weight: 700; font-size: 1.5rem; }
.party-classic .charades-card.charades-correct { background: #d5efdd; color: #123b22; }
.party-classic .charades-card.charades-skip { background: #f4d34e; color: #161616; }
.party-classic:has(#quiz-play:not(.hidden)) .tool-head,
.party-classic:has(#quiz-results:not(.hidden)) .tool-head,
.party-classic:has(#ch-form[hidden]) .tool-head,
.party-classic:has(#quiz-play:not(.hidden)) .breadcrumbs,
.party-classic:has(#quiz-results:not(.hidden)) .breadcrumbs,
.party-classic:has(#ch-form[hidden]) .breadcrumbs { display: none; }
.party-classic:has(#quiz-play:not(.hidden)) .tool-guide,
.party-classic:has(#quiz-results:not(.hidden)) .tool-guide,
.party-classic:has(#ch-form[hidden]) .tool-guide,
.party-classic:has(#ch-form[hidden]) .charades-app > .hint { display: none; }
.party-classic:has(#quiz-play:not(.hidden)) .seasonal-tools,
.party-classic:has(#quiz-results:not(.hidden)) .seasonal-tools,
.party-classic:has(#ch-form[hidden]) .seasonal-tools,
.party-classic:has(#quiz-play:not(.hidden)) .site-footer,
.party-classic:has(#quiz-results:not(.hidden)) .site-footer,
.party-classic:has(#ch-form[hidden]) .site-footer { display: none; }
@media (max-width: 600px) {
  .party-classic .tool-main { padding-top: .5rem; }
  .party-classic .breadcrumbs { font-size: .8rem; margin-block: .6rem; }
  .party-classic .tool-head { margin-block: 1rem; }
  .party-classic .tool-head h1 { font-size: 2.2rem; }
  .party-classic .tool-head p { font-size: 1rem; }
  .party-classic .game-setup-grid, .party-classic .answer-list { grid-template-columns: minmax(0, 1fr); gap: .65rem; }
  .party-classic .panel { padding: 1rem; }
  .party-classic .game-start .btn { width: 100%; }
  .party-classic .quiz-question { margin-block: 1rem 1.5rem; }
  .party-classic .answer-btn { min-height: 64px; font-size: 1.125rem; }
  .party-classic .charades-card { min-height: 25vh; }
  .party-classic .charades-stats { font-size: 1rem; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .party-classic .charades-immersive { padding: .4rem .6rem; }
  .party-classic .charades-immersive #ch-heading { font-size: 1rem; margin-bottom: .2rem; }
  .party-classic .charades-immersive .hint { font-size: .8rem; margin-block: .2rem; }
  .party-classic .charades-immersive .charades-card { min-height: 5rem; padding: .5rem; margin: .3rem 0; }
  .party-classic .charades-immersive #ch-word { font-size: clamp(1.7rem, 5vw, 3rem); }
  .party-classic .charades-immersive .charades-actions .btn { min-height: 48px; }
  .party-classic .charades-immersive .charades-stats { padding: 0; }
  .party-classic .charades-immersive #ch-time { font-size: 1.4rem; }
}

/* Second composition pass: a photographic opening and a centred paper stage.
   Alignment follows the content: titles/choices centre; longer guidance justifies. */
.party-classic .game-portrait { position: relative; height: 220px; margin: 1rem 0 0; overflow: hidden; background: #1758a6; }
.party-classic .game-portrait img { display: block; width: 100%; height: 100%; object-fit: cover; }
.quiz-page .game-portrait { background: #161616; }
.quiz-page .game-portrait img { object-fit: contain; transform: scale(1.45); }
.charades-page .game-portrait { width: min(100%, 680px); height: 180px; margin-inline: auto; clip-path: polygon(3% 0, 100% 4%, 97% 100%, 0 96%); }
.charades-page .game-portrait img { object-position: center top; }
.party-classic .game-portrait figcaption { position: absolute; right: .6rem; bottom: .5rem; padding: .15rem .4rem; background: #161616; font: 12px PartySource, sans-serif; }
.party-classic .game-portrait figcaption a { color: white; }
.charades-page .game-portrait figcaption { top: .35rem; left: 2rem; right: auto; bottom: auto; }
.party-classic .tool-head { display: block; position: relative; max-width: 880px; width: calc(100% - 4rem); margin: -60px auto 1.5rem; padding: 1rem 1.5rem; background: #fff; color: #161616; text-align: center; }
.party-classic .tool-head h1 { margin: 0 auto; max-width: 22ch; font-size: clamp(2.4rem, 5vw, 4.5rem); color: #161616; }
.party-classic .tool-head p { max-width: 58ch; margin: .6rem auto 0; color: #505050; }
.party-classic .game-setup-grid { grid-template-columns: 1fr; justify-items: center; gap: .5rem; }
.party-classic .game-setup-grid > .field { width: min(100%, 40rem); }
.party-classic .game-setup-grid > .field > label { display: block; text-align: center; }
.party-classic .select-row:has(input[name=mode]) { justify-content: center; }
.party-classic .game-start, .party-classic .game-settings-preview { text-align: center; }
.party-classic .quiz-bank-count { text-align: center; color: #505050; font-size: .95rem; margin: 0 0 .5rem; }
.party-classic .game-setup, .party-classic .charades-app:has(#ch-form:not([hidden])) { padding-block: 1.5rem; }
.party-classic .game-options { max-width: 52rem; margin-inline: auto; }
.party-classic #ch-team-settings { max-width: 40rem; margin-inline: auto; }
.party-classic #ch-team-settings > .field > label { display: block; text-align: center; }
.party-classic .game-start .btn { min-width: min(100%, 20rem); }
.party-classic .quiz-question { margin-inline: auto; text-align: center; }
.party-classic .answer-btn { justify-content: center; }
.party-classic .answer-btn > span:last-child { flex: 1; text-align: center; }
.party-classic #quiz-results, .party-classic #ch-heading { text-align: center; }
.party-classic #quiz-results .field { text-align: left; }
.party-classic #ch-results { max-width: 52rem; margin-inline: auto; }
.party-classic #ch-results > :is(h2,p,h3) { text-align: center; }
.party-classic .game-options p, .party-classic .teacher-intro { text-align: justify; hyphens: auto; }
.party-classic:has(#quiz-play:not(.hidden)) .game-portrait,
.party-classic:has(#quiz-results:not(.hidden)) .game-portrait,
.party-classic:has(#ch-form[hidden]) .game-portrait { display: none; }
.party-classic .teacher-panel { margin: 1rem auto 0; max-width: 60rem; padding: 1rem 1.5rem; background: #e5eef9; border-top: 3px solid #1758a6; }
.party-classic .teacher-panel > summary { text-align: center; font: 700 1.65rem PartyBodoni, Georgia, serif; cursor: pointer; padding: .4rem; }
.party-classic .teacher-downloads { display: flex; justify-content: center; flex-wrap: wrap; gap: .75rem; margin: 1rem 0; }
.party-classic .teacher-file { display: block; max-width: 38rem; margin: 1rem auto; text-align: center; }
.party-classic .teacher-file input { display: block; margin-top: .5rem; width: 100%; }
.party-classic .teacher-key { display: flex; gap: .6rem; align-items: center; min-height: 48px; }
.party-classic #teacher-preview { max-height: 20rem; overflow: auto; }
.party-classic #teacher-preview li { margin-bottom: .75rem; }
.party-classic #teacher-preview small { display: block; }
.party-classic .teacher-contract code { display: block; white-space: normal; overflow-wrap: anywhere; padding: .75rem; background: #fff; font-size: .9rem; }
.party-classic #teacher-status:not(:empty) { padding: .75rem; border-left: 4px solid #1758a6; background: white; }
.party-classic #teacher-errors { color: #8a202b; }
.party-classic #quiz-imported-note { text-align: center; }
#quiz-print { display: none; }
@media (min-width: 800px) {
  .charades-page #ch-form > .game-setup-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 48rem; margin-inline: auto; }
  .party-classic .game-options summary { text-align: center; }
  .party-classic .teacher-contract p, .party-classic .teacher-panel > .hint,
  .party-classic .tool-guide > p { text-align: justify; hyphens: auto; }
}
@media (max-width: 600px) {
  .party-classic .game-portrait { height: 130px; margin-top: .5rem; }
  .party-classic .tool-head { width: calc(100% - 1rem); margin-top: -30px; padding: .65rem .75rem; margin-bottom: .8rem; }
  .party-classic .tool-head h1 { font-size: 2.1rem; }
  .party-classic .tool-head p { font-size: .95rem; line-height: 1.3; }
  .party-classic .teacher-panel { padding: .75rem; }
  .party-classic .game-options p, .party-classic .teacher-intro { text-align: left; }
  .party-classic .select-row:has(input[name=mode]) { gap: .3rem; }
  .party-classic .select-row:has(input[name=mode]) label { padding: .5rem; }
  .party-classic .breadcrumbs .current { display: none; }
  .party-classic .game-setup, .party-classic .charades-app:has(#ch-form:not([hidden])) { padding-block: .8rem; }
  .charades-page .game-portrait { height: 90px; }
  .charades-page .tool-head { padding-block: .5rem; }
  .charades-page #ch-teams-hint { font-size: .8rem; line-height: 1.25; margin-block: .35rem; }
}
@media print {
  html.quiz-printing { color-scheme: light !important; }
  html.quiz-printing, html.quiz-printing body { background: #fff !important; color: #000 !important; }
  html.quiz-printing #quiz-print { page: quiz-test; }
  html.quiz-printing body > :not(#quiz-print) { display: none !important; }
  html.quiz-printing #quiz-print { display: block !important; background: white; color: black; font: 12pt/1.4 Georgia, serif; }
  #quiz-print h1 { font-size: 20pt; text-align: center; }
  #quiz-print h2 { font-size: 12pt; font-weight: 600; }
  #quiz-print > ol > li { break-inside: avoid; margin-bottom: 1.2em; }
  #quiz-print .teacher-answer-key { break-before: page; }
  #quiz-print ol ol { list-style-type: upper-alpha; }
}
@page quiz-test { size: A4; margin: 16mm; background: white; }