:root {
  --bg: #eef5f7;
  --card: #fffdf8;
  --ink: #1d2430;
  --muted: #637082;
  --blue: #336699;
  --blue-dark: #244e77;
  --gold: #f3ce70;
  --green: #dff4dc;
  --red: #d74b4b;
  --line: #cbd8e6;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background:
    radial-gradient(circle at top left, rgba(51,102,153,.22), transparent 28rem),
    linear-gradient(180deg, #ffffff, var(--bg));
}
.site-header {
  width: min(1180px, 100%);
  margin: 0 auto;
  padding: 18px 14px 10px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.brand-mark {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: var(--blue);
  color: #fff;
  font: 800 34px Georgia, serif;
  box-shadow: 0 12px 28px rgba(20,52,86,.18);
}
h1 { margin: 0; font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1; letter-spacing: -.04em; }
.site-header p { margin: 6px 0 0; color: var(--muted); }
.page-shell { width: min(1180px, 100%); margin: 0 auto 48px; padding: 0 12px; }
.game-card, .instructions, .custom-card {
  background: rgba(255,253,248,.96);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(32,60,92,.13);
  padding: 14px;
  margin-bottom: 16px;
}
.toolbar {
  display: flex;
  gap: 12px;
  align-items: end;
  justify-content: space-between;
  flex-wrap: wrap;
}
.toolbar label { display: grid; gap: 4px; color: var(--muted); font-weight: 700; }
select, input, textarea {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  padding: 9px 10px;
  font: inherit;
}
#dailySelect { min-width: min(420px, calc(100vw - 48px)); }
.toolbar-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
button, .file-label {
  min-height: 40px;
  border-radius: 999px;
  border: 1px solid #1f5a88;
  background: linear-gradient(#3f80b9, var(--blue));
  color: white;
  font-weight: 800;
  padding: 8px 14px;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(31,90,136,.16);
}
button.secondary { background: #fff; color: var(--blue); }
button:disabled { opacity: .55; cursor: not-allowed; }
.file-label input { display: none; }
.check {
  display: inline-flex !important;
  grid-auto-flow: column;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  background: #fff;
  color: var(--ink) !important;
  font-weight: 700 !important;
}
.status {
  margin: 12px 0;
  padding: 10px 12px;
  border-radius: 12px;
  background: #eef6ff;
  border: 1px solid #c8dcf0;
  font-weight: 700;
}
.letterbar {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 8px;
  margin-bottom: 12px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: #f7fbff;
  position: sticky;
  top: 0;
  z-index: 10;
}
.letterbar button {
  width: 34px;
  min-height: 34px;
  padding: 0;
  border-radius: 8px;
  background: #fff;
  color: var(--blue-dark);
  border-color: #bdd0e4;
  box-shadow: none;
}
.puzzle-layout {
  display: grid;
  grid-template-columns: minmax(360px, .95fr) minmax(380px, 1.05fr);
  gap: 14px;
  align-items: start;
}
.clue-panel, .quote-panel {
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
}
.panel-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  padding: 10px 12px;
  background: #f2f7fb;
  border-bottom: 1px solid var(--line);
}
.panel-head h2 { margin: 0; font-size: 1.15rem; }
.panel-head span { color: var(--muted); font-size: .9rem; }
.clues {
  max-height: min(72vh, 760px);
  overflow: auto;
  padding: 10px;
}
.clue {
  border: 1px solid #e0e8f0;
  border-radius: 12px;
  padding: 10px;
  margin-bottom: 10px;
  background: #fffdf8;
}
.clue.active { outline: 3px solid rgba(243,206,112,.9); }
.clue-text { margin-bottom: 7px; color: #1e2b38; font-weight: 650; }
.answer-row { display: flex; flex-wrap: wrap; gap: 3px; align-items: center; }
.key-letter {
  width: 24px;
  height: 24px;
  border-radius: 7px;
  display: inline-grid;
  place-items: center;
  background: var(--blue);
  color: #fff;
  font-weight: 900;
  margin-right: 4px;
}
.cell {
  width: 29px;
  height: 32px;
  border: 1px solid #9db2c8;
  border-radius: 7px;
  background: #fff;
  display: inline-grid;
  place-items: center;
  font-weight: 800;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
}
.cell.active {
  outline: 3px solid var(--gold);
  border-color: #996d00;
}
.cell.linked {
  background: #fff7d8;
}
.cell.wrong {
  background: #ffe8e8;
  border-color: var(--red);
}
.cell.correct {
  background: #e7f8e2;
  border-color: #70a464;
}
.cell.fixed {
  border-color: transparent;
  background: transparent;
  cursor: default;
  width: auto;
  min-width: 12px;
}
.cell.punct { font-weight: 700; color: #445; }
.cell.space { width: 14px; }
.quote-grid {
  padding: 12px;
  line-height: 2.25;
}
.quote-word {
  display: inline-flex;
  gap: 3px;
  align-items: center;
  margin: 0 7px 8px 0;
  white-space: nowrap;
}
.quote-punct { display: inline-grid; place-items: center; min-width: 9px; color: #333; font-weight: 700; }
.hidden { display: none !important; }
.locked-custom {
  padding: 14px;
  color: var(--muted);
}
.custom-grid {
  display: grid;
  gap: 10px;
}
.custom-grid label { display: grid; gap: 5px; font-weight: 700; color: var(--muted); }
.custom-actions { padding: 10px 0; }
.small-note { color: var(--muted); font-size: .9rem; }
.instructions p { line-height: 1.55; color: #38475a; }
@media (max-width: 860px) {
  .puzzle-layout { grid-template-columns: 1fr; }
  .clues { max-height: none; }
  .site-header { align-items: flex-start; }
  .brand-mark { width: 46px; height: 46px; font-size: 28px; }
  .toolbar { align-items: stretch; }
  .toolbar > div { width: 100%; }
  #dailySelect { width: 100%; min-width: 0; }
  .toolbar-actions { width: 100%; }
  button, .file-label { flex: 1 1 auto; }
  .cell { width: 27px; height: 31px; }
}

/* v1.1 readability and clue-entry behavior */
.cell {
  color: #111;
  line-height: 1;
  vertical-align: top;
  font-size: 1rem;
  font-family: Arial, Helvetica, sans-serif;
}
button.cell {
  padding: 0;
  min-height: 32px;
  box-shadow: none;
  background-image: none;
}
.quote-grid .cell,
.answer-row .cell {
  color: #111;
}
.answer-row {
  align-items: flex-start;
}

/* v1.2 crostics polish */
button.cell,
.cell {
  -webkit-appearance: none;
  appearance: none;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0;
  color: #111 !important;
  line-height: 1 !important;
  vertical-align: middle !important;
  font-size: 1rem;
  font-family: Arial, Helvetica, sans-serif;
  text-align: center;
  box-shadow: none;
  background-image: none;
}
.quote-grid {
  line-height: 1.2;
}
.quote-word {
  align-items: center;
  vertical-align: top;
  line-height: 1;
}
.quote-punct {
  line-height: 1;
  align-self: center;
  padding: 0 2px;
}
.first-answer-letter,
.author-key-cell {
  color: #0b58a3 !important;
  border-color: #548bc2;
  background: #f7fbff;
}
.key-letter { display: none; }
.author-key-panel {
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
}
.author-key {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 12px;
}
.fireworks {
  position: fixed;
  inset: 0;
  pointer-events: auto;
  z-index: 9999;
  background: rgba(10, 20, 40, .08);
  overflow: hidden;
}
.fireworks i {
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: hsl(calc(var(--h, 40) * 1deg), 90%, 58%);
  animation: firework-pop 1.6s ease-out infinite;
}
.fireworks i:nth-child(5n+1) { background: #ff5252; }
.fireworks i:nth-child(5n+2) { background: #ffd740; }
.fireworks i:nth-child(5n+3) { background: #40c4ff; }
.fireworks i:nth-child(5n+4) { background: #69f0ae; }
.fireworks i:nth-child(5n+5) { background: #e040fb; }
@keyframes firework-pop {
  0% { transform: translate(0,0) scale(.2); opacity: 0; }
  20% { opacity: 1; }
  100% { transform: translate(var(--dx), var(--dy)) scale(1.1); opacity: 0; }
}
.panel-head.mini {
  border: 1px solid var(--line);
  border-radius: 12px 12px 0 0;
}
.panel-head.mini h3 { margin: 0; }
.custom-clue-builder {
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}
.custom-clue-rows {
  display: grid;
  gap: 8px;
  padding: 10px;
}
.custom-clue-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(120px, .45fr) auto;
  gap: 8px;
}
.remove-custom-clue {
  min-height: 38px;
  border-radius: 10px;
  padding: 0 12px;
  background: #fff;
  color: #9b1c1c;
  border-color: #ddb5b5;
}
@media (max-width: 700px) {
  .custom-clue-row { grid-template-columns: 1fr; }
}

/* v1.3 creator helper */
.creator-meter {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px;
  background: #f8fbff;
}
.remaining-letters {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 8px;
}
.remaining-pill {
  border: 1px solid #bcd1e6;
  background: #fff;
  color: var(--blue-dark);
  border-radius: 999px;
  padding: 4px 8px;
  font-weight: 800;
  font-size: .9rem;
}
.remaining-pill.over {
  border-color: #e8b5b5;
  background: #fff0f0;
  color: #9b1c1c;
}
.creator-key-rows {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px;
  background: #f7fbff;
  border-bottom: 1px solid var(--line);
}
.creator-key-button {
  min-height: 32px;
  padding: 4px 9px;
  border-radius: 8px;
  box-shadow: none;
}
.creator-row-key {
  width: 34px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--blue);
  color: #fff;
  font-weight: 900;
}
.custom-clue-row {
  grid-template-columns: auto minmax(180px, 1fr) minmax(120px, .45fr) auto;
}
.custom-clue-row.selected {
  outline: 3px solid rgba(243,206,112,.9);
  border-radius: 12px;
}
.suggestion-tool {
  border-top: 1px solid var(--line);
  padding: 10px;
  background: #fffdf8;
}
.suggestion-results {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
  max-height: 180px;
  overflow: auto;
}
.suggestion-word {
  min-height: 30px;
  border-radius: 8px;
  padding: 4px 8px;
  box-shadow: none;
  background: #fff;
  color: var(--blue-dark);
  border-color: #bdd0e4;
}
@media (max-width: 700px) {
  .custom-clue-row { grid-template-columns: 1fr; }
  .creator-row-key { width: 100%; }
}

/* v1.4 */
.button-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border-radius: 999px;
  border: 1px solid #1f5a88;
  background: linear-gradient(#3f80b9, var(--blue));
  color: white;
  font-weight: 800;
  padding: 8px 14px;
  text-decoration: none;
}
.button-link.small { min-height: 34px; padding: 6px 12px; font-size: .92rem; }
.creator-link-card p { color: var(--muted); }
.quote-preview-wrap {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px;
  background: #fff;
}
.quote-usage-preview {
  margin-top: 8px;
  white-space: pre-wrap;
  line-height: 1.55;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.05rem;
}
.quote-usage-preview .used { color: #a7aeb7; }
.quote-usage-preview .needed { color: #111; font-weight: 700; }
.creator-warning {
  border: 1px solid #e8b5b5;
  background: #fff0f0;
  color: #9b1c1c;
  border-radius: 12px;
  padding: 9px 10px;
  font-weight: 800;
}

/* v1.5 saved custom puzzles */
button:disabled {
  opacity: .5;
  cursor: not-allowed;
  filter: grayscale(.35);
}
button.danger {
  background: #fff;
  color: #9b1c1c;
  border-color: #d6aaaa;
}

/* v1.8 sharing and quote separators */
.quote-space-separator {
  display: inline-block;
  width: 16px;
  height: 30px;
  margin: 0 5px 8px 0;
  border-radius: 5px;
  background: #d9e1ea;
  vertical-align: top;
  box-shadow: inset 0 0 0 1px #c0cedb;
}
.share-result {
  margin-top: 10px;
  border: 1px solid #bcd1e6;
  background: #f7fbff;
  color: var(--blue-dark);
  border-radius: 12px;
  padding: 10px;
  font-weight: 700;
}
.share-result a {
  color: var(--blue-dark);
  word-break: break-all;
}

/* v1.11 share and creator polish */
.toolbar-actions button,
.toolbar-actions .file-label,
.toolbar-actions select {
  font-size: 0.95rem;
}
.file-label {
  font-size: 0.95rem;
}
.share-button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.share-button:not(:disabled) {
  background: linear-gradient(#25b86f, #10834c);
  border-color: #0b6d3f;
  color: #fff;
  box-shadow: 0 5px 14px rgba(16, 131, 76, .24);
}
.share-icon {
  display: inline-grid;
  place-items: center;
  width: 21px;
  height: 21px;
}
.share-icon svg {
  width: 21px;
  height: 21px;
  stroke: currentColor;
  stroke-width: 2.2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.share-url-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto;
  gap: 8px;
  margin: 10px 0;
}
.share-url-row input {
  min-height: 38px;
  font-size: .95rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.copy-share-button {
  min-height: 38px;
  border-radius: 10px;
  padding: 6px 12px;
  box-shadow: none;
}
.suggestion-tool > div:first-child {
  margin-bottom: 10px;
}
.suggestion-context {
  margin-left: 6px;
}
.suggestion-letter {
  display: inline-grid;
  place-items: center;
  min-width: 24px;
  min-height: 24px;
  padding: 1px 7px;
  border-radius: 999px;
  background: #f3ce70;
  color: #2d3748;
  font-weight: 900;
  border: 1px solid #d4a934;
}
@media (max-width: 700px) {
  .share-url-row {
    grid-template-columns: 1fr;
  }
}


/* v1.13 JGames standardization */
body{
  position:relative;
}
.jgames-home-badge{
  position:absolute;
  top:12px;
  right:12px;
  z-index:10000;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#fff;
  border:1px solid rgba(11,46,131,.18);
  box-shadow:0 8px 22px rgba(11,46,131,.18);
  transition:transform .12s ease, box-shadow .12s ease;
}
.jgames-home-badge img{
  width:32px;
  height:32px;
  display:block;
}
.jgames-home-badge:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 28px rgba(11,46,131,.22);
}
.site-header{
  padding-right:64px;
}
.footer{
  width:min(1180px, calc(100% - 24px));
  margin:0 auto 36px;
  padding:18px 18px 24px;
  background:rgba(255,253,248,.96);
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:0 20px 60px rgba(32,60,92,.13);
  text-align:center;
  font:14px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
.footer nav{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px 14px;
  margin-bottom:12px;
  font-weight:700;
}
.footer a{
  color:#0B2E83;
  text-decoration:none;
}
.footer a:hover{
  color:#D80D16;
  text-decoration:underline;
}
.footer p{
  margin:6px 0 0;
  color:#34445c;
}
@media(max-width:860px){
  .jgames-home-badge{
    width:40px;
    height:40px;
    border-radius:13px;
  }
  .jgames-home-badge img{
    width:29px;
    height:29px;
  }
  .site-header{
    padding-right:54px;
  }
  .footer{
    width:min(100% - 12px, 1180px);
    padding:14px 12px 18px;
    margin-bottom:24px;
  }
}


/* v1.15 answer autofill */
.creator-clue-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
  align-items:center;
}
#autoFillAnswersBtn:disabled{
  opacity:.45;
  cursor:not-allowed;
}
.autofill-overlay{
  position:fixed;
  inset:0;
  z-index:20000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(12,20,36,.55);
}
.autofill-dialog{
  width:min(560px,96vw);
  background:#fffdf8;
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:0 24px 70px rgba(0,0,0,.32);
  padding:22px;
}
.autofill-dialog h2{
  margin:0 0 8px;
  color:var(--blue-dark);
}
.autofill-dialog p{
  margin:0 0 12px;
  line-height:1.4;
}
.autofill-bar{
  height:14px;
  overflow:hidden;
  border-radius:999px;
  border:1px solid #b8cde2;
  background:#eef6ff;
}
#autofillBarFill{
  width:0%;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#3f80b9,var(--blue));
  transition:width .18s ease;
}
.autofill-detail{
  min-height:44px;
  margin-top:10px;
  color:var(--muted);
  font-size:.92rem;
}
.autofill-actions{
  display:flex;
  justify-content:flex-end;
  margin-top:12px;
}
@media(max-width:860px){
  .creator-clue-actions{
    width:100%;
    justify-content:stretch;
  }
  .creator-clue-actions button{
    flex:1 1 auto;
  }
}


/* v1.18 autofill elapsed time */
.autofill-title-row{
  display:flex;
  align-items:start;
  justify-content:space-between;
  gap:14px;
}
.autofill-title-row h2{
  margin:0 0 8px;
}
.autofill-elapsed{
  flex:0 0 auto;
  padding:5px 9px;
  border-radius:999px;
  background:#eef6ff;
  border:1px solid #c8dcf0;
  color:var(--blue-dark);
  font-size:.82rem;
  font-weight:800;
  white-space:nowrap;
}
@media(max-width:520px){
  .autofill-title-row{
    display:block;
  }
  .autofill-elapsed{
    display:inline-flex;
    margin-bottom:8px;
  }
}


/* v1.19 autofill dialog trail */
.autofill-detail{
  white-space:pre-line;
}


/* v1.23 creator guided steps */
.creator-step{
  position:relative;
  border:1px solid transparent;
  border-radius:16px;
  padding:12px;
  transition:background .16s ease, border-color .16s ease, opacity .16s ease, filter .16s ease;
}
.creator-step-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0 0 8px;
  padding:3px 8px;
  border-radius:999px;
  background:#eef6ff;
  color:var(--blue-dark);
  font-size:.78rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.creator-step.is-active{
  background:#e8f8e4;
  border-color:#80b874;
  box-shadow:0 0 0 3px rgba(128,184,116,.18);
}
.creator-step.is-locked{
  opacity:.48;
  filter:grayscale(.25);
  background:#f1f3f5;
  border-color:#d8dee6;
}
.creator-step.is-locked::after{
  content:"Complete the step above to unlock this section.";
  display:block;
  margin-top:8px;
  color:#637082;
  font-size:.88rem;
  font-weight:700;
}


/* v1.26 creator count labels */
.creator-label-note{
  color:var(--muted);
  font-weight:700;
  font-size:.92em;
}


/* v1.37 shared puzzle memory badges and poetry line-break separators */
.quote-line-separator {
  display: inline-grid;
  place-items: center;
  min-width: 38px;
  height: 30px;
  margin: 0 7px 8px 0;
  border-radius: 7px;
  background: #d9e1ea;
  color: #41556b;
  font-weight: 900;
  vertical-align: top;
  box-shadow: inset 0 0 0 1px #c0cedb;
}
.shared-puzzle-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: .78rem;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
  border: 1px solid transparent;
}
.shared-puzzle-badge-new {
  background: #eaf6ff;
  border-color: #b8d7ee;
  color: #245176;
}
.shared-puzzle-badge-started {
  background: #fff5d8;
  border-color: #dec46f;
  color: #745500;
}
.shared-puzzle-badge-solved {
  background: #e7f8e2;
  border-color: #8dc27e;
  color: #276221;
}


/* v1.38 creator SEO polish */
.creator-guide p {
  line-height: 1.65;
  margin: 0 0 12px;
}
.creator-guide p:last-child {
  margin-bottom: 0;
}


/* v1.40 victory gameplay stats */
.victory-stats-card {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(430px, calc(100vw - 34px));
  padding: 22px;
  border-radius: 24px;
  background: rgba(255, 253, 248, .97);
  border: 1px solid rgba(198, 215, 232, .95);
  box-shadow: 0 24px 80px rgba(10, 20, 40, .30);
  text-align: center;
  color: var(--ink);
  pointer-events: auto;
}
.victory-kicker {
  margin: 0 0 6px;
  color: var(--green);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .82rem;
}
.victory-stats-card h2 {
  margin: 0 0 16px;
  color: var(--blue-dark);
  font-size: clamp(1.6rem, 5vw, 2.3rem);
  line-height: 1;
  letter-spacing: -.04em;
}
.victory-stats-list {
  display: grid;
  gap: 9px;
  margin: 0 0 18px;
}
.victory-stats-list div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid #dce8f3;
  border-radius: 14px;
  background: #f7fbff;
}
.victory-stats-list dt {
  color: var(--muted);
  font-weight: 850;
}
.victory-stats-list dd {
  margin: 0;
  color: var(--ink);
  font-weight: 950;
  font-size: 1.08rem;
}
.victory-close {
  min-width: 120px;
}


/* v1.60 shared puzzle header */
.site-header.shared-site-header{
  align-items:center;
}
.shared-site-header .shared-header-copy{
  flex:1 1 auto;
  min-width:0;
}
.shared-site-header .shared-header-row{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:16px;
  flex-wrap:nowrap;
  min-width:0;
}
.shared-site-header .shared-header-row h1{
  flex:0 1 auto;
  white-space:nowrap;
  min-width:0;
  font-size:clamp(2rem,4.25vw,3.15rem);
}
.shared-site-header .shared-more-link,
.shared-site-header .button-link.small.shared-more-link{
  flex:0 0 auto;
  white-space:nowrap;
  min-height:34px;
  padding:6px 12px;
  font-size:clamp(.78rem,1.35vw,.96rem);
  line-height:1.15;
}
.shared-site-header .shared-header-copy > p{
  max-width:100%;
}
@media(max-width:940px){
  .shared-site-header .shared-header-row{
    display:block;
  }
  .shared-site-header .shared-more-link,
  .shared-site-header .button-link.small.shared-more-link{
    margin-top:10px;
  }
}


/* v1.62 mobile letter-cell sizing and wrap cue */
@media (max-width: 860px) {
  .answer-row .cell,
  .quote-grid .cell,
  .author-key .cell,
  .author-key-cell,
  button.cell {
    flex: 0 0 27px !important;
    width: 27px !important;
    min-width: 27px !important;
    max-width: 27px !important;
    height: 31px !important;
    min-height: 31px !important;
  }

  .answer-row,
  .author-key {
    justify-content: flex-start;
    align-items: flex-start;
  }
}

.cell.line-wrap-start {
  position: relative;
}

.cell.line-wrap-start::before {
  content: "↳";
  position: absolute;
  left: 1px;
  top: -10px;
  font-size: 12px;
  line-height: 1;
  color: #5a6c7f;
  font-weight: 900;
  pointer-events: none;
  transform: translate(-12px, 15px);
}

@media (max-width: 860px) {
  .cell.line-wrap-start::before {
    top: -9px;
    left: 1px;
  }
}

/* Mobile: let the Schnauser game use the full viewport width */
@media (max-width: 720px), (pointer: coarse) {
  .page-shell {
    padding-left: 0;
    padding-right: 0;
  }

  .game-card {
    border-left: 0;
    border-right: 0;
    border-radius: 0;
  }
}

