/* Kundaily stays a single portrait column on every screen. Its board and input
   elements are the same engine UI used by the full game. */
.kundailyHeader[hidden], .kundailyHeading[hidden], .kundailyViewportEdge[hidden] { display: none !important; }
html.kundailyDocument, html.kundailyDocument body { overflow: hidden; height: 100%; background: #f5efcf; }
html.kundailyDocument body { background: #f5efcf; }
html.kundailyDocument body.kundailyMode .kundailyViewportEdge {
  /* WebKit switches its native scroll-edge blur to a solid color when it sees
     painted fixed content at the viewport edge (the menu backdrop does this).
     Cover only the safe area and the shell's 8px top padding. Keep this above
     the absolute shell for edge sampling, below dialogs, and out of hit testing.
     https://results.webkit.org/commit?uuid=175056451300 */
  position: fixed; top: 0; left: 0; right: 0;
  height: calc(var(--app-viewport-top, env(safe-area-inset-top, 0px)) + 8px);
  z-index: 1; pointer-events: none;
  background-color: #f5efcf;
  background-image: linear-gradient(var(--bg), var(--bg));
  background-repeat: no-repeat;
  background-size: min(var(--app-width, 100vw), 520px) 8px;
  background-position: calc(var(--app-viewport-left, env(safe-area-inset-left, 0px)) + max(0px, (var(--app-width, 100vw) - 520px) / 2)) bottom;
}
html.kundailyDocument body.kundailyMode .appShell {
  /* Keep painting and touch targets in document coordinates. A fixed scrolling
     shell can retain a different hit-test offset after an iOS rotation. */
  position: absolute; inset: auto; top: var(--app-viewport-top, env(safe-area-inset-top, 0px));
  left: calc(var(--app-viewport-left, env(safe-area-inset-left, 0px)) + max(0px, (var(--app-width, 100vw) - 520px) / 2));
  display: flex; flex-direction: column; gap: 0; width: min(var(--app-width, 100vw), 520px); height: var(--app-height, 100dvh);
  min-height: 0; margin: 0; padding: 8px 14px 4px; overflow: hidden; overscroll-behavior: none;
  opacity: 1; visibility: visible; pointer-events: auto;
  background: var(--bg, #edf2f0); box-shadow: 0 0 100px #9C8F5E7F;
}
html.kundailyDocument body.kundailyMode .playSurface {
  display: flex; flex-direction: column; align-items: stretch; flex: 1 1 0; width: 100%; height: auto;
  min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: none; margin: 0; gap: 2px;
}
html.kundailyDocument body.kundailyMode .playSurface > * { flex-shrink: 0; }
body.kundailyMode .gameTopRegion, body.kundailyMode .sidePanel,
body.kundailyMode .menuTileField, body.kundailyMode .attractMenuButton,
body.kundailyMode .indexMenuButton { display: none !important; }
.kundailyHeader { text-align: center; width: 100%; }
html.kundailyDocument body.kundailyMode .kundailyHeading h1 { font-size: 25px; line-height: 1.3; margin: 0; color: #3e603c; letter-spacing: -.04em; white-space: nowrap; }
.kundailyHeading { display: grid; flex: none; grid-template-columns: 32px auto auto minmax(0, 1fr); align-items: center; gap: 7px; background: var(--bg); isolation: isolate; }
html.kundailyDocument body.kundailyMode .kundailyMenuToggle { position: static; display: flex; flex-direction: column; justify-content: center; grid-column: 1; grid-row: 1; width: 32px; min-width: 32px; height: 32px; min-height: 32px; padding: 6px; }
.kundailyHeading h1 { grid-column: 2; grid-row: 1; text-align: left; }
.kundailyPlayerButton { grid-column: 4; grid-row: 1; justify-self: end; max-width: min(180px, 100%); min-height: 32px; padding: 4px 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
html.kundailyDocument body.kundailyMode .kundailyMenuToggle span { flex: 0 0 2px; margin: 2px auto; }
.kundailyDate { grid-column: 3; grid-row: 1; display: flex; flex-direction: column; margin: 0; color: #787162; font-size: 11px; line-height: 14px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kundailyTabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; border-bottom: 1px solid #889b80; margin: 6px 0 4px; padding: 0 2px; }
.kundailyTabGroup { display: flex; align-items: center; gap: 2px; padding: 1px 4px; margin-bottom: -1px; border: 1px solid transparent; border-bottom-color: #889b80; border-radius: 9px 9px 0 0; }
.kundailyTabGroup:has([aria-selected="true"]) { background: #f7f7ec; border-color: #889b80; border-top-color: #648251; border-bottom-color: #f7f7ec; box-shadow: inset 0 1px #648251; }
.kundailyTabGroup [role="tab"] { background: transparent; border: 0; box-shadow: none; flex: 1; min-width: 0; min-height: 28px; padding: 5px 0 3px; font-size: 13px; color: #283c25; border-radius: 0; }
.kundailyTabGroup [aria-selected="true"] { font-weight: 750; }
.kundailyInfoPill { flex: 0 0 22px; width: 22px; height: 22px; min-height: 22px; padding: 0; border: 0; background: transparent; box-shadow: none; font-size: 16px; }
.kundailyAttemptBoard { position: relative; display: grid; grid-template-columns: 1fr; grid-template-rows: repeat(5, minmax(26px, auto)); gap: 2px; list-style: none; padding: 0; margin: 0; text-align: left; }
.kundailyAttemptSlot { --kundaily-attempt-bg: #e9e8da; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 4px; border-radius: 6px; background: var(--kundaily-attempt-bg); padding: 2px 6px; }
.kundailyAttemptSlot[role="button"] { cursor: pointer; touch-action: manipulation; }
.kundailyAttemptSlot[role="button"]:focus-visible { outline: 2px solid #246b9a; outline-offset: 1px; }
.kundailyEmptySlot { border: 1px dashed #c8c6b6; background: transparent; color: #b0ab98; }
.kundailyTargetSlot { border: 1px dashed #789365; background: #f2f5e9; color: #48623a; font-size: 11px; font-weight: 600; }
.kundailyAttemptWords, .kundailySecondaryWords { display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-start; gap: 4px; min-width: 0; }
.kundailyAttemptWords { position: relative; flex: 0 1 auto; overflow: hidden; white-space: nowrap; padding-bottom: 1px; }
.kundailyAttemptWords[data-truncated="true"]::after { content: "…"; position: absolute; top: 0; right: 0; bottom: 0; width: 13px; display: flex; align-items: flex-end; justify-content: flex-end; background: var(--kundaily-attempt-bg); pointer-events: none; }
.kundailySecondaryWords { flex: none; }
.kundailySecondaryWords:empty { display: none; }
.kundailyAttemptWord { display: inline-flex; flex: none; gap: 1px; }
.kundailyWordPlus { font-size: 12px; }
.kundailyWordTile { display: inline-flex; position: relative; align-items: center; justify-content: center; width: 20px; height: 20px;
  min-width: 0; border: 1px solid #b8924f; border-radius: 3px; background: var(--tile, #ead093); box-shadow: 0 1px 0 #8e6b36;
  color: #2d2922; font-family: "Hammersmith One", sans-serif; font-size: 16px; line-height: 1; box-sizing: border-box; }
.kundailyAttemptScore { flex: 0 0 auto; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; }
.kundailyAttemptScore[data-band] { border-radius: 12px; padding: 3px 7px; color: white; background: #707670; }
.kundailyAttemptScore[data-band="red"] { background: #c52b32; }
.kundailyAttemptScore[data-band="orange"] { background: #d26727; }
.kundailyAttemptScore[data-band="yellow"] { background: #f5d04e; color: #171710; }
.kundailyAttemptScore[data-band="green"] { background: #23854b; }
.kundailyRevealedSlot { --kundaily-attempt-bg: #d6d8d7; box-shadow: inset 0 0 0 1px #a3a8a5; }
.kundailyAttemptMark { flex: 0 0 auto; font-size: 11px; white-space: nowrap; }
.kundailyAttemptMark:empty { display: none; }
.kundailyWinningSlot { --kundaily-attempt-bg: #e3ebd1; box-shadow: inset 0 0 0 1px #92ad72; }
.kundailyBestPartialSlot { --kundaily-attempt-bg: #e0eff8; box-shadow: inset 0 0 0 1px #73a7c6; }
.kundailyDroppedAttempt { position: absolute; z-index: 2; bottom: 0; left: 0; right: 0; min-height: 26px; box-shadow: 0 0 0 2px #f7f7ec; }
.kundailyFlyingTile { position: fixed; z-index: 10000; pointer-events: none; transform-origin: top left; }
.kundailyPageFeedback { margin: 5px 0 0; font-size: 12px; color: #864934; }
.kundailyPageFeedback:empty, .kundailyRecovery:empty { display: none; }
.kundailyRecovery { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 20px 0; }
html.kundailyDocument body.kundailyMode .gameStatusRegion { width: 100%; height: auto; min-height: 16px; padding: 0; margin: 0; display: block; }
html.kundailyDocument body.kundailyMode #statusLine { display: block; width: 100%; min-height: 0; height: auto; max-height: none; margin: 0; padding: 0 8px; font-size: 11px; text-align: center; white-space: normal; overflow: visible; }
html.kundailyDocument body.kundailyMode .boardWrap {
  --board-visual-width: 100%; --board-grid-gap: 1px; --board-grid-padding: 3.5px;
  position: relative;
  width: min(69.23%, 410px); height: auto; margin: 0 auto; flex: none; align-self: center; justify-self: auto; overflow: visible;
}
html.kundailyDocument body.kundailyMode .board {
  width: 100%; height: auto; max-height: none; border: 1px solid #805939; border-radius: 8px; padding: var(--board-grid-padding);
  background: #9e704a; box-shadow: 0 4px 10px #47372322; aspect-ratio: 1;
}
/* Siblings share the board's stacking level; dialogs and drag layers stay above
   both. Percentage sizing keeps the sprite inside the side gutter on phones. */
html.kundailyDocument body.kundailyMode .board,
html.kundailyDocument body.kundailyMode .kundailyPet { z-index: auto; }
.kundailyPet {
  position: absolute; bottom: 0; width: min(56px, 20%); aspect-ratio: 1;
  pointer-events: none; user-select: none; -webkit-user-select: none;
  image-rendering: pixelated;
}
.kundailyPet[data-side="left"] { right: 100%; }
.kundailyPet[data-side="right"] { left: 100%; }
.kundailyPet img { display: block; width: 100%; height: 100%; }
.kundailyPet[hidden], .kundailyPet img[hidden],
body:not(.kundailyMode) .kundailyPet { display: none !important; }
html.kundailyDocument body.kundailyMode .rackBand { width: min(80%, 455px); height: auto; margin: 3px auto 0; padding: 0; }
html.kundailyDocument body.kundailyCompleted .rackBand { display: none !important; }
.kundailyCompletion { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; width: 100%; margin: 6px 0 3px; container-type: inline-size; }
.kundailyCompletion[hidden], .kundailySupportLink[hidden] { display: none !important; }
.kundailyCompletion.hasCombinedShare { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr) minmax(0, 1fr); }
.kundailyCompletion > button[hidden] { display: none; }
/* Match a rack tile: capped 80% rack width, with 42px reserved between slots. */
.kundailyCompletion > button { height: calc((min(80cqw, 455px) - 42px) / 7); min-height: 0; min-width: 0; padding: 2px 4px; font-size: 13px; white-space: nowrap; }
.kundailyCompletion.hasCombinedShare > button { min-height: 32px; font-size: clamp(10px, 2.7cqw, 13px); line-height: 1.1; white-space: normal; }
.kundailyCompletion > .kundailyShareButton { background: var(--green); color: #fff; border-color: var(--green); font-weight: 700; }
.kundailyCompletion > .kundailyMainGameButton { background: var(--tile); color: #000; font-weight: 700; }
.kundailyCompletionPreview { display: flex; grid-column: 1 / -1; gap: 6px; }
.kundailyCompletionPreview:empty { display: none; }
.kundailyCompletionPreview button { flex: 1; }
.kundailySupportLink {
  display: block; flex: none; text-align: center; margin: 10px 0 6px; padding: 8px 12px;
  color: #3e603c; font-size: 15.6px; font-weight: 700; text-decoration: none;
  background: transparent; border: 1px solid #3e603c; border-radius: 7px;
  box-shadow: inset 1px 1px 0 rgb(255 255 255 / 60%), inset -1px -1px 0 rgb(62 96 60 / 18%);
}
.mainMenuActions .kundailySupportMenuLink { display: block; padding: 10px; text-align: center; color: inherit; background: #fff7d6; border: 1px solid #b9c2bd; border-radius: 7px; text-decoration: none; }
html.kundailyDocument body.kundailyMode #rackTiles { width: 100%; display: flex; justify-content: center; gap: 6px; }
html.kundailyDocument body.kundailyMode #rackTiles .rackTile { flex: 0 0 calc((100% - 42px) / 7); width: auto; height: auto; aspect-ratio: 1; }
html.kundailyDocument body.kundailyMode .gameControlRegion { display: block; width: 100%; height: auto; padding: 0; margin: 2px 0 0; }
html.kundailyDocument body.kundailyMode .gameControls { display: grid; width: 100%; max-width: none; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-template-rows: auto; gap: 5px; margin: 0; }
html.kundailyDocument body.kundailyMode:not(.kundailyReviewMode) #swapSkipButton { order: 0; }
html.kundailyDocument body.kundailyMode:not(.kundailyReviewMode) #gameLogButton { order: 1; }
html.kundailyDocument body.kundailyMode:not(.kundailyReviewMode) #clearButton { order: 2; }
html.kundailyDocument body.kundailyMode:not(.kundailyReviewMode) #shuffleButton { order: 3; }
html.kundailyDocument body.kundailyMode:not(.kundailyReviewMode) #applyButton { order: 4; }
html.kundailyDocument body.kundailyMode .gameControls button { min-height: 52px; height: auto; aspect-ratio: auto; padding: 8px 4px; border-radius: 10px; }
html.kundailyDocument body.kundailyMode #gameLogButton { grid-column: auto; min-height: 52px; }
html.kundailyDocument body.kundailyMode #applyButton { grid-column: auto; min-height: 52px; background: #3e603c; color: white; border-color: #3e603c; }
html.kundailyDocument body.kundailyMode #applyButton .controlLabel { color: white; }
html.kundailyDocument body.kundailyMode:not(.kundailyReviewMode) #applyButton[data-kundaily-unavailable="true"] { background: #92978e; border-color: #92978e; color: #fff; }
html.kundailyDocument body.kundailyMode .controlIcon { font-size: 20px; }
html.kundailyDocument body.kundailyMode .controlLabel { display: block; font-size: 11px; }
html.kundailyDocument body.kundailyMode .controlLabel::before { content: none; }
body.kundailyEmpty .boardWrap, body.kundailyEmpty .rackBand, body.kundailyEmpty .gameControlRegion, body.kundailyEmpty .gameStatusRegion { display: none !important; }
body.kundailyEmpty .kundailyAttemptBoard { display: none; }
body.kundailyReviewPage .kundailyChallengePanel { display: none; }
.kundailyArchiveDialog { padding: 0; overflow: hidden; }
.kundailyArchiveDialog[open] { display: flex; flex-direction: column; }
.kundailyArchiveDialog > .kundailyDialogTitleBar { flex: none; margin: 0; }
.kundailyArchiveBody { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px 22px 22px; }
.kundailyArchiveList { display: grid; gap: 10px; margin-bottom: 16px; }
.kundailyArchiveList section { padding: 10px; background: #eeeddf; border-radius: 8px; }
.kundailyArchiveList h3 { margin: 0 0 8px; font-size: 14px; }
.kundailyPageDialog p { line-height: 1.5; }
.kundailyResult textarea { user-select: text; -webkit-user-select: text; }
.kundailyPublicResult { width: min(92vw, 430px); }
.kundailyPublicResult .kundailyExpectedPlay { margin: 0 0 14px; }
.kundailyPublicResult textarea { min-height: 130px; margin: 0 0 10px; }
.kundailyPublicResult button { width: 100%; min-height: 44px; margin: 4px 0; }
.kundailyNextChallenges > p { margin: 12px 0 4px; text-align: center; }
.kundailyChallengeChoices { display: flex; gap: 8px; }
.kundailyChallengeChoices button { flex: 1 1 0; min-width: 0; }
.kundailyMainGameLink { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 8px 0 0; }
.kundailyResult .kundailyMainGameLink button { width: auto; margin: 0; }
.kundailyPublicResult .kundailyExpectedPlay h3 { margin-top: 0; }
.kundailyDialogTitleBar { display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 1px solid #b8bea8; margin: -22px -22px 16px; padding: 12px 16px; background: #e5e9d9; }
.kundailyResult .kundailyDialogTitleBar h2 { margin: 0; font-size: 18px; }
.kundailyResult .kundailyDialogTitleBar button { flex: 0 0 32px; width: 32px; height: 32px; min-height: 32px; margin: 0; padding: 0; font-size: 25px; line-height: 1; background: transparent; border: 0; box-shadow: none; }
.kundailyRulesDialog { width: min(94vw, 580px); }
.kundailyRulesViewport { display: block; width: 100%; height: 245px; max-height: min(65dvh, 560px); border: 0; }
.kundailySharePanel { position: relative; border: 1px solid #c9c7b9; border-radius: 8px; padding: 36px 12px 14px; margin-bottom: 12px; background: #fff; cursor: pointer; text-align: left; }
.kundailySharePanel:focus-visible { outline: 2px solid #4e7852; outline-offset: 3px; }
.kundailyShareText { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; font: inherit; line-height: 1.65; user-select: text; -webkit-user-select: text; }
.kundailyCopyHint { position: absolute; top: 8px; right: 12px; min-width: 8em; text-align: right; font-size: 12px; line-height: 18px; color: #45683c; }
.kundailyCopyFallback { position: fixed; width: 1px; height: 1px; min-height: 0 !important; opacity: 0; padding: 0; border: 0; pointer-events: none; }
.kundailyNoticeDialog { width: min(92vw, 430px); }
.kundailyStatsGroup { padding: 10px; margin: 8px 0; background: #f1f0e4; border-radius: 8px; }
.kundailyStatsGroup h4, .kundailyStatsGroup p { margin: 0 0 8px; }
.kundailyStatsGroup li { margin-bottom: 6px; }
@media (max-width: 360px) {
  html.kundailyDocument body.kundailyMode .kundailyHeading h1 { font-size: 19px; }
  .kundailyTabGroup { gap: 2px; padding: 1px 3px; }
  .kundailyTabGroup [role="tab"] { font-size: 11px; }
  html.kundailyDocument body.kundailyMode .gameControls button { padding-inline: 1px; }
  html.kundailyDocument body.kundailyMode .controlLabel { font-size: 10px; white-space: nowrap; letter-spacing: -.02em; }
}
@media (min-width: 361px) and (max-width: 430px) {
  html.kundailyDocument body.kundailyMode .kundailyHeading h1 { font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .kundailyFlyingTile, .kundailyAttemptSlot { animation: none !important; transition: none !important; }
}
@media (max-width: 980px) and (max-height: 560px) and (orientation: landscape) and (pointer: coarse) {
  html.kundailyDocument.physical-landscape:not(.text-entry-active) .kundailyResult[open],
  html.kundailyDocument.physical-landscape:not(.text-entry-active) .kundailyResult::backdrop { display: none !important; }
}
