/* CRACK TOTAL 7.4 / GAME EXPERIENCE
   Shared, additive design layer. Loaded AFTER per-game CSS.
   Structure and protocol are owned by existing game engines.
   Never restyle Pasala Che .letter statuses or Wordle tile semantics.
*/
body[data-ct74="true"] {
  --ct74-bg: #101b1b;
  --ct74-panel: #1a3028;
  --ct74-panel-high: #234236;
  --ct74-cream: #f4f2e9;
  --ct74-ink: #172a21;
  --ct74-muted: #c4d2c6;
  --ct74-lime: #b5eb53;
  --ct74-copper: #d89b70;
  --ct74-line: rgba(211,234,211,.22);
  --ct74-line-dark: rgba(30,63,43,.20);
  --ct74-radius: 16px;
  --ct74-radius-sm: 10px;
  --ct74-ease: cubic-bezier(.2,.7,.2,1);
  font-family: "Manrope", system-ui, sans-serif;
  background-color: var(--ct74-bg);
  -webkit-font-smoothing: antialiased;
}
body[data-ct74="true"] *,body[data-ct74="true"] *::before,body[data-ct74="true"] *::after { box-sizing: border-box; }
body[data-ct74="true"] :is(button,input,textarea,select) { font-family: inherit; }
body[data-ct74="true"] :is(button,a,input,select,textarea,[tabindex]):focus-visible {
  outline: 3px solid var(--ct74-lime);
  outline-offset: 3px;
}
body[data-ct74="true"] :is(button,[role="button"]) { touch-action: manipulation; }
body[data-ct74="true"] :is(button,[role="button"]):disabled { cursor: not-allowed; }
body[data-ct74="true"] [hidden] { display: none !important; }
body[data-ct74="true"] :is(.ct7-layout,.ct7-tl-layout,.cx-grid,.lobby-grid,.top10-game-layout,.ct-quiz-stage,.ct-bluff-stage) > * {
  min-width: 0;
}
body[data-ct74="true"] :is(.ct7-button,.ct7-tl-primary,.cx-action,.cx-ghost,.arena-button,.home-button,.ct-button,.lobby-button,.primary-button,.secondary-button,.modal-button) {
  border-radius: var(--ct74-radius-sm);
  line-height: 1.25;
  text-decoration-thickness: 1px;
  transition: background-color .18s var(--ct74-ease),border-color .18s var(--ct74-ease),
    color .18s var(--ct74-ease),transform .18s var(--ct74-ease),box-shadow .18s var(--ct74-ease);
}
body[data-ct74="true"] :is(.ct7-button,.ct7-tl-primary,.cx-action,.arena-button,.lobby-button,.ct-button,.primary-button,.modal-button):not(:disabled):active {
  transform: translateY(1px) scale(.992);
}
body[data-ct74="true"] :is(.ct7-button,.ct7-tl-primary,.cx-action,.arena-button,.lobby-button,.ct-button,.primary-button,.modal-button):not(:disabled):hover {
  box-shadow: 0 8px 22px rgba(0,0,0,.12);
}
body[data-ct74="true"] :is(.ct7-button,.ct7-tl-primary,.cx-action,.arena-button,.lobby-button,.ct-button,.primary-button,.modal-button):disabled {
  box-shadow: none;
}
body[data-ct74="true"] :is(.ct7-board,.ct7-tl-board,.cx-stage,.top10-intro,.top10-play-panel,.top10-ranking-panel,.wordle-card,.ct-quiz-stage,.ct-bluff-stage) {
  border-radius: var(--ct74-radius);
}
body[data-ct74="true"] :is(.ct7-screen,.ct7-tl-screen,.cx-stage,.ct7-board,.ct7-tl-board) {
  overflow-wrap: break-word;
}

/* Identity + career: premium editorial game canvas. */
body[data-ct74="true"].ct7 .ct7-intro {
  gap: clamp(22px,4.5vw,64px);
  padding-block: clamp(38px,5.5vw,78px) clamp(28px,4vw,58px);
}
body[data-ct74="true"].ct7 .ct7-intro h1 { letter-spacing: -.075em; max-width: 12ch; text-wrap: balance; }
body[data-ct74="true"].ct7 .ct7-deck { max-width: 52ch; color: #cddbcf; line-height: 1.72; }
body[data-ct74="true"].ct7 .ct7-editorial { border-left-width: 3px; }
body[data-ct74="true"].ct7 .ct7-layout { gap: clamp(14px,2vw,26px); }
body[data-ct74="true"].ct7 .ct7-board {
  overflow: clip;
  border: 1px solid rgba(189,220,194,.35);
  border-top: 6px solid var(--ct74-lime);
  box-shadow: 0 28px 65px rgba(0,0,0,.18);
}
body[data-ct74="true"].ct7 .ct7-board-head {
  background: #e5e9dd;
  color: #284734;
  gap: 10px;
}
body[data-ct74="true"].ct7 .ct7-progress-track { height: 6px; background: #cad6c7; }
body[data-ct74="true"].ct7 .ct7-progress-track>span { background: #2f6342; }
body[data-ct74="true"].ct7 .ct7-screen { min-width: 0; }
body[data-ct74="true"].ct7 .ct7-screen>h2 { text-wrap: balance; }
body[data-ct74="true"].ct7 .ct7-clues {
  position: relative;
  gap: 11px;
  margin-block: 27px 25px;
}
body[data-ct74="true"].ct7 .ct7-clue {
  position: relative;
  border: 1px solid #d0d9ca;
  border-left: 4px solid #54785d;
  border-radius: 11px;
  background: #e9ede3;
  min-height: 72px;
  gap: 14px;
  padding: 15px 17px;
  transition: background .2s var(--ct74-ease),border-color .2s var(--ct74-ease);
}
body[data-ct74="true"].ct7 .ct7-clue-index {
  flex: 0 0 28px;
  font-variant-numeric: tabular-nums;
  color: #346043;
}
body[data-ct74="true"].ct7 .ct7-clue.is-hidden {
  color: #617263;
  border-left-color: #c2cbbf;
  background: #f0f1e9;
}
body[data-ct74="true"].ct7 .ct7-clue.is-revealed { animation: ct74-clue-in .24s var(--ct74-ease) both; }
body[data-ct74="true"].ct7 .ct7-clue-body { min-width: 0; }
body[data-ct74="true"].ct7 .ct7-club-marker {
  min-width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #d1dfce;
  border-color: #b1c5af;
  font-size: 13px;
}
body[data-ct74="true"].ct7[data-ct7-mode="career"] .ct7-clues { counter-reset: ct74-stop; }
body[data-ct74="true"].ct7[data-ct7-mode="career"] .ct7-clue {
  margin-left: 17px;
  padding-left: 25px;
}
body[data-ct74="true"].ct7[data-ct7-mode="career"] .ct7-clue::before {
  content: "";
  position: absolute;
  left: -25px;
  top: 50%;
  width: 14px;
  height: 14px;
  border-radius: 100%;
  border: 3px solid #b7cbb7;
  background: #f4f2e9;
  z-index: 1;
}
body[data-ct74="true"].ct7[data-ct7-mode="career"] .ct7-clue.is-revealed::before {
  border-color: #25563c;
  background: var(--ct74-lime);
}
body[data-ct74="true"].ct7[data-ct7-mode="career"] .ct7-clue:not(:last-child)::after {
  content: "";
  position: absolute;
  left: -19px;
  top: calc(50% + 7px);
  height: calc(100% + 13px);
  border-left: 2px solid #bacbbc;
}
body[data-ct74="true"].ct7 .ct7-guess {
  padding: clamp(16px,2.5vw,25px);
  background: #e6eade;
  border: 1px solid #cdd8cb;
  border-radius: 13px;
}
body[data-ct74="true"].ct7 .ct7-input-row input {
  min-width: 0;
  border: 1px solid #9fb4a3;
  border-radius: 9px;
  box-shadow: none;
  background: #fbfcf6;
}
body[data-ct74="true"].ct7 .ct7-button-primary {
  background: #1e422e; border-color: #1e422e; color: #f4f2e9;
}
body[data-ct74="true"].ct7 .ct7-button-primary:hover:not(:disabled) {
  background: var(--ct74-lime); color: #172a21; border-color: #244b30;
}
body[data-ct74="true"].ct7 .ct7-secondary { min-height: 44px; }
body[data-ct74="true"].ct7 .ct7-text-action { min-height: 44px; }
body[data-ct74="true"].ct7 .ct7-answer-portrait { margin-bottom: 26px; }
body[data-ct74="true"].ct7 .ct7-portrait-figure { border-radius: 13px; overflow: hidden; }
body[data-ct74="true"].ct7 .ct7-finish-numbers > * { border-radius: 10px; }
body[data-ct74="true"].ct7 .ct7-side-card { border-radius: 13px; }
body[data-ct74="true"].ct7 .ct7-mission-meter { overflow: hidden; }

/* Archive: movable timeline cards get a physical order and clear controls. */
body[data-ct74="true"].ct7-timeline .ct7-tl-intro { gap: clamp(20px,4vw,54px); }
body[data-ct74="true"].ct7-timeline .ct7-tl-board {
  border: 1px solid rgba(197,224,198,.34);
  border-top: 6px solid var(--ct74-lime);
  overflow: clip;
  box-shadow: 0 24px 60px rgba(0,0,0,.16);
}
body[data-ct74="true"].ct7-timeline .ct7-tl-boardtop { background: #e6eadf; color: #254330; }
body[data-ct74="true"].ct7-timeline .ct7-tl-card {
  min-width: 0;
  background: #e9ede4;
  border: 1px solid #d1dbcd;
  border-left: 4px solid #658668;
  border-radius: 12px;
  gap: 12px;
}
body[data-ct74="true"].ct7-timeline .ct7-tl-card-label { min-width: 0; line-height: 1.6; }
body[data-ct74="true"].ct7-timeline .ct7-tl-card-index {
  display: grid;
  place-items: center;
  flex: 0 0 34px;
  min-height: 34px;
  border-radius: 8px;
  background: #d5e1d3;
  color: #2f5940;
}
body[data-ct74="true"].ct7-timeline .ct7-tl-shift {
  min-width: 44px;
  min-height: 44px;
  border-radius: 8px;
  border: 1px solid #bacbb8;
}
body[data-ct74="true"].ct7-timeline .ct7-tl-shift:hover:not(:disabled) {
  background: #d5e8d3;
  border-color: #477b58;
}
body[data-ct74="true"].ct7-timeline .ct7-tl-primary { background: #244531; border-color: #244531; }
body[data-ct74="true"].ct7-timeline .ct7-tl-aside-panel { border-radius: 13px; }
body[data-ct74="true"].ct7-timeline .ct7-tl-screen h2 { text-wrap: balance; }

/* Connections: visible selection affordances and grouped success, without
   modifying the puzzle engine or group evaluation. */
body[data-ct74="true"].cx-page .cx-heading { padding-block: clamp(36px,5vw,68px) 26px; }
body[data-ct74="true"].cx-page .cx-heading h1 { text-wrap: balance; letter-spacing: -.075em; }
body[data-ct74="true"].cx-page .cx-grid { gap: clamp(14px,2.2vw,27px); }
body[data-ct74="true"].cx-page .cx-stage {
  border: 1px solid #476558;
  border-top: 5px solid var(--ct74-lime);
  padding: clamp(16px,3vw,36px);
  background: #172b24;
  box-shadow: 0 20px 50px rgba(0,0,0,.14);
}
body[data-ct74="true"].cx-page .cx-hud {
  gap: 8px;
  border-color: #4a6557;
  border-radius: 12px;
  padding: 14px;
  background: #20392e;
}
body[data-ct74="true"].cx-page .cx-hud>div { min-width: 0; }
body[data-ct74="true"].cx-page .cx-tiles { gap: clamp(7px,1vw,12px); }
body[data-ct74="true"].cx-page .cx-tile {
  position: relative;
  min-width: 0;
  min-height: 90px;
  border-radius: 12px;
  padding: 14px 9px;
  background: #2a4436;
  border: 1px solid #65816d;
  color: #f4f2e9;
  box-shadow: inset 0 -3px 0 rgba(0,0,0,.13);
  font-size: clamp(11px,1.1vw,15px);
  transition: background .17s var(--ct74-ease),color .17s var(--ct74-ease),
    border-color .17s var(--ct74-ease),transform .17s var(--ct74-ease);
}
body[data-ct74="true"].cx-page .cx-tile:hover:not(:disabled) { border-color: var(--ct74-lime); transform: translateY(-2px); }
body[data-ct74="true"].cx-page .cx-tile.is-selected,
body[data-ct74="true"].cx-page .cx-tile[aria-pressed="true"] {
  background: #d6f38f;
  color: #182820;
  border: 2px solid #b5eb53;
  box-shadow: inset 0 0 0 2px #234d38;
  transform: none;
}
body[data-ct74="true"].cx-page .cx-group {
  border-radius: 11px;
  animation: ct74-reveal .24s var(--ct74-ease) both;
}
body[data-ct74="true"].cx-page .cx-controls { gap: 11px; }
body[data-ct74="true"].cx-page .cx-action { font-size: 13px; }
body[data-ct74="true"].cx-page .cx-ghost {
  border: 1px solid #547265;
  background: #284638;
  color: #edf5e9;
}
body[data-ct74="true"].cx-page .cx-ghost:hover:not(:disabled) { background: #355b48; }
body[data-ct74="true"].cx-page .cx-feedback:not(:empty) { padding: 12px; border-radius: 8px; }
body[data-ct74="true"].cx-page .cx-side-card { border-radius: 12px; }

/* 6 existing games: polish framing and controls, never override answer-state
   colours or WebSocket engine-managed visibility. */
body[data-ct74="true"].game-body .game-header,
body[data-ct74="true"].qsm-1v1-body .game-header { border-bottom: 1px solid var(--ct74-line); }
body[data-ct74="true"].game-body :is(.question-card,.game-card,.lobby-card),
body[data-ct74="true"].qsm-1v1-body :is(.lobby-panel,.game-card) {
  border-radius: 14px;
  overflow-wrap: anywhere;
}
body[data-ct74="true"].game-body :is(.answer-input,.lobby-input,.modern-input),
body[data-ct74="true"].qsm-1v1-body .lobby-input {
  min-height: 48px;
  border-radius: 9px;
}
body[data-ct74="true"].mentiroso-body .ct-bluff-stage {
  border: 1px solid #496d55;
  border-top: 4px solid var(--ct74-copper);
}
body[data-ct74="true"].mentiroso-body .lobby-card { border: 1px solid #526b5c; }
body[data-ct74="true"].qsm-1v1-body .ct-quiz-stage {
  border: 1px solid #496e58;
  border-top: 4px solid var(--ct74-lime);
}
body[data-ct74="true"].qsm-1v1-body .ct-quiz-stage .option-btn {
  min-height: 66px;
  border-radius: 11px;
}
body[data-ct74="true"].qsm-1v1-body .ct-quiz-stage .option-btn:not(:disabled):hover:not(.correct):not(.incorrect) {
  border-color: var(--ct74-lime);
}
body[data-ct74="true"].top10-body .top10-intro,
body[data-ct74="true"].top10-body .top10-play-panel,
body[data-ct74="true"].top10-body .top10-ranking-panel {
  border-radius: 14px;
  overflow-wrap: anywhere;
}
body[data-ct74="true"].top10-body .top10-play-panel .top10-input {
  min-height: 50px;
  border-radius: 9px;
}
body[data-ct74="true"].wordle-body .wordle-header { border-radius: 16px 16px 0 0; }
body[data-ct74="true"].wordle-body .wordle-card { border-radius: 0 0 16px 16px; }
body[data-ct74="true"].wordle-body .wordle-controls button { min-height: 44px; }
body[data-ct74="true"] .arena-shell .mode-card { border-radius: 14px; overflow-wrap: anywhere; }
body[data-ct74="true"] .arena-shell .arena-button { min-height: 48px; }
body[data-ct74="true"] .arena-shell .question-side,
body[data-ct74="true"] .arena-shell .ring-side { border-radius: 14px; }
body[data-ct74="true"] .arena-shell .server-banner { border-radius: 12px; }

/* Catalogue + results + profile: keep layouts in the same visual family. */
body[data-ct74="true"].ct6-game-hub .home-game-card {
  border-radius: 15px;
  transition: transform .18s var(--ct74-ease),border-color .18s var(--ct74-ease),box-shadow .18s var(--ct74-ease);
}
body[data-ct74="true"].ct6-game-hub .home-game-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(0,0,0,.20);
}
body[data-ct74="true"].ct6-game-hub :is(.home-game-description,.home-game-facts) { line-height: 1.65; }
body[data-ct74="true"].ranking-page-body .ranking-container,
body[data-ct74="true"].profile-body :is(.ct7-profile,.profile-identity-card) {
  border-radius: 14px;
  overflow-wrap: anywhere;
}
body[data-ct74="true"].ranking-page-body .ranking-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
body[data-ct74="true"].ranking-page-body .ranking-container {
  max-width: min(100%,1200px);
  overflow-x: auto;
}
body[data-ct74="true"].ranking-page-body .ranking-table th,
body[data-ct74="true"].ranking-page-body .ranking-table td {
  padding: 14px 12px;
  line-height: 1.5;
}
body[data-ct74="true"].ranking-page-body .ranking-table tr:hover { background: rgba(181,235,83,.065); }
body[data-ct74="true"].profile-body .ct7-profile :is(button,a):focus-visible { outline-offset: 4px; }

/* Responsive guardrails: no clipping, readable controls, semantic state
   and all layouts aligned at 320 / 360 / 390 / 430 / tablet / desktop. */
@media (max-width: 820px) {
  body[data-ct74="true"].ct7 .ct7-layout,
  body[data-ct74="true"].ct7-timeline .ct7-tl-layout,
  body[data-ct74="true"].cx-page .cx-grid { grid-template-columns: minmax(0,1fr); }
  body[data-ct74="true"] .cx-hud { flex-wrap: wrap; }
}
@media (max-width: 600px) {
  body[data-ct74="true"].ct7 .ct7-intro h1 { font-size: clamp(46px,12vw,73px); }
  body[data-ct74="true"].ct7 .ct7-clue { min-height: 62px; padding: 12px; gap: 9px; }
  body[data-ct74="true"].ct7 .ct7-club-marker { min-width: 36px; height: 36px; font-size: 11px; }
  body[data-ct74="true"].ct7 .ct7-guess { padding: 13px; }
  body[data-ct74="true"].ct7 .ct7-board,
  body[data-ct74="true"].ct7-timeline .ct7-tl-board { box-shadow: none; }
  body[data-ct74="true"].ct7-timeline .ct7-tl-card { gap: 8px; padding: 12px 9px; }
  body[data-ct74="true"].ct7-timeline .ct7-tl-card-index { min-width: 29px; flex-basis: 29px; }
  body[data-ct74="true"].cx-page .cx-hud { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
  body[data-ct74="true"].cx-page .cx-tile { min-height: 78px; }
  body[data-ct74="true"].cx-page .cx-stage { padding: 14px; }
  body[data-ct74="true"].ranking-page-body .ranking-table { min-width: 440px; }
}
@media (max-width: 380px) {
  body[data-ct74="true"].ct7 .ct7-board-head { font-size: 10px; padding: 15px 11px; }
  body[data-ct74="true"].ct7 .ct7-clue-body { font-size: 12px; }
  body[data-ct74="true"].ct7[data-ct7-mode="career"] .ct7-clue { margin-left: 11px; padding-left: 14px; }
  body[data-ct74="true"].ct7[data-ct7-mode="career"] .ct7-clue::before { left: -19px; }
  body[data-ct74="true"].ct7[data-ct7-mode="career"] .ct7-clue:not(:last-child)::after { left: -13px; }
  body[data-ct74="true"].cx-page .cx-hud { gap: 5px; padding: 10px 7px; }
  body[data-ct74="true"].cx-page .cx-hud strong { font-size: 14px; }
  body[data-ct74="true"].cx-page .cx-hud span { font-size: 9px; }
  body[data-ct74="true"].cx-page .cx-tiles { gap: 7px; }
  body[data-ct74="true"].cx-page .cx-tile { min-height: 72px; padding: 9px 6px; }
}

/* There must be no continuous motion, nor motion for reduced-motion users. */
@keyframes ct74-clue-in {
  from { opacity: .65; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes ct74-reveal {
  from { opacity: .72; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  body[data-ct74="true"],body[data-ct74="true"] *,body[data-ct74="true"] *::before,body[data-ct74="true"] *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* CT7.5 — reviewed real club emblems (text fallback on load failure). */
body[data-ct74="true"].ct7 .ct7-verified-club-crest{display:block;max-width:100%;width:34px;height:34px;object-fit:contain;border:0;background:transparent}
@media(max-width:600px){body[data-ct74="true"].ct7 .ct7-verified-club-crest{width:29px;height:29px}}