/* Coolkee Daily (coolkee.fun/daily). Loaded only on the 8 daily pages, after site.css. Existing game assets only
   (daily-assets/: marbles, chalk HUD, popup80 card/ribbon/close, v7 buttons, star/trophy, power icons).
   CSP: no inline styles; JS sets only CSS custom properties / transforms through CSSOM. */

.daily-page { --cellbase: clamp(38px, min(calc((100vw - 32px - 16px - 88px) / 5), calc((100vh - 440px) / 7)), 60px);
  --cellbase: clamp(38px, min(calc((100vw - 32px - 16px - 88px) / 5), calc((100svh - 440px) / 7)), 60px);
  --cell: min(var(--cellbase), var(--cellfit, 60px)); --btn: 44px;
  --m0: #0ab6f2; --m1: #f1397d; --m2: #47c818; --m3: #ffb12f;
  --chalk: rgba(255, 255, 255, .62); --board: #3b3f45; --board-hi: #4a4f56;
  background: linear-gradient(180deg, #d4ecfb 0%, #e3f3fd 40%, var(--page) 100%); padding: 4px 0 28px; }
.daily-wrap { max-width: 520px; }
.daily-intro { text-align: center; margin: 0 0 8px; }
.daily-intro h1 { margin: 0; font-size: clamp(1.8rem, 1.5rem + 1.6vw, 2.4rem); line-height: 1.05; }
.daily-intro .daily-sub { margin: 0; font-weight: 700; color: var(--ink-soft); font-size: .875rem; line-height: 1.3; }

/* balloon lettering (game: Baloo ExtraBold, gradient fill, thick soft outline; balloon_text78.gd) */
.balloon { position: relative; display: inline-block; font-family: "Baloo Bhai 2", var(--display); font-weight: 800; letter-spacing: .01em;
  color: #0b5d86; -webkit-text-stroke: .2em #0b5d86; text-shadow: 0 .08em 0 #073a57, 0 .16em .22em rgba(6, 22, 41, .35); --fill: linear-gradient(180deg, #ffffff 0%, #fff7cf 40%, #ffcf4a 76%, #ffb12f 100%); }
.balloon::after { content: attr(data-text); position: absolute; left: 0; top: 0; right: 0; -webkit-text-stroke: 0; text-shadow: none; color: transparent;
  background: var(--fill); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; pointer-events: none; }
.balloon.is-teal { --fill: linear-gradient(180deg, #ffffff 0%, #e6fdff 38%, #7ee9f3 72%, #2fc6d6 100%); }
html[lang="ru"] .daily-page .balloon:not(.brand-text), html[lang="zh"] .daily-page .balloon:not(.brand-text),
html[lang="ja"] .daily-page .balloon:not(.brand-text), html[lang="ko"] .daily-page .balloon:not(.brand-text) { font-family: var(--display); font-weight: 800; }

/* ---------- the chalkboard card ---------- */
.daily-card { position: relative; background: var(--board) radial-gradient(120% 80% at 30% 15%, var(--board-hi) 0, #34383d 70%); color: #fff;
  border-radius: var(--r-l); box-shadow: var(--shadow); padding: 10px 8px 12px; --focus: var(--focus-dark); }
.daily-top { display: flex; flex-wrap: nowrap; align-items: center; gap: 6px; padding: 0 4px; min-height: 44px; }
.daily-id { margin: 0 auto 0 0; line-height: 1.1; min-width: 0; }
.daily-id strong { display: block; font: 800 1.25rem/1.1 "Baloo Bhai 2", var(--display); }
.daily-id time { display: block; font-size: .75rem; line-height: 1.2; color: #dbe5ee; overflow-wrap: break-word; }
.tries { display: flex; gap: 5px; align-items: center; flex: none; }
.try { width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .55); }
.try[data-tile="hit"] { border-color: #b8f59a; background: radial-gradient(circle at 35% 30%, #d8ffc4 0 18%, #47c818 55%, #2a8a0b 100%); }
.try[data-tile="close"] { border-color: #ffe39a; background: radial-gradient(circle at 35% 30%, #fff1c2 0 18%, #ffc23d 55%, #c98a00 100%); }
.try[data-tile="miss"] { border-color: rgba(255, 255, 255, .8); background: radial-gradient(circle at 35% 30%, #6b7480 0 18%, #20262e 60%, #0d1116 100%); }
.icon-btn { flex: none; width: 44px; height: 44px; border: 0; border-radius: 50%; padding: 0; background: transparent center / 40px 40px no-repeat; color: #fff; cursor: pointer; }
.help-btn { background-image: url("daily/chalk-help.webp"); }
.sym-btn, .share-btn { display: inline-flex; align-items: center; justify-content: center; border: 2px solid rgba(255, 255, 255, .62); width: 44px; height: 44px; }
.sym-btn svg, .share-btn svg { width: 24px; height: 24px; }
.sym-btn[aria-pressed="true"] { background: rgba(255, 211, 107, .22); border-color: #ffd36b; color: #ffd36b; }
.icon-btn:hover { filter: drop-shadow(0 0 8px rgba(255, 255, 255, .45)); }
/* header share toast (game toast style: white, light-blue rim, navy text) */
.daily-toast { position: absolute; z-index: 5; top: 54px; right: 8px; max-width: calc(100% - 16px); margin: 0; padding: 6px 14px;
  background: #fff; color: #0c2b47; border: 3px solid #5cc8f2; border-radius: 999px; box-shadow: 0 6px 14px rgba(6, 22, 41, .32);
  font: 800 .9375rem/1.25 var(--text); text-align: center; pointer-events: none; }
.daily-toast.is-long { border-radius: 14px; font-weight: 600; font-size: .8125rem; text-align: left; white-space: pre-line; overflow-wrap: anywhere;
  pointer-events: auto; user-select: text; -webkit-user-select: text; }
.daily-toast.is-in { animation: toast-in .32s var(--ease) both; }
@keyframes toast-in { 0% { opacity: 0; transform: translateY(-6px) scale(.86); } 60% { opacity: 1; transform: translateY(0) scale(1.04); } 100% { transform: none; } }
@media (prefers-reduced-motion: reduce) { .daily-toast.is-in { animation: none; } }
/* phones: the date gets its own full-width line under the header row (room for the share button, dates never cut) */
@media (max-width: 400px) {
  .daily-top { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto auto; column-gap: 6px; row-gap: 0; }
  .daily-id { display: contents; }
  .daily-id strong { grid-column: 1; grid-row: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .daily-id time { grid-column: 1 / -1; grid-row: 2; margin: -2px 0 2px; }
}

.goal { margin: 4px 2px 2px; padding: 6px 10px 7px; text-align: center; border: 14px solid transparent; border-image: url("daily/chalk-panel.webp") 56 / 16px stretch; }
.goal-text { margin: -8px 0 0; font: 700 1rem/1.28 var(--text); }
.goal .rule { margin: 3px 0 -8px; font-size: .75rem; line-height: 1.32; color: #d5dee7; }

/* ---------- board ---------- */
.board { position: relative; display: grid; justify-content: center; margin: 4px auto 0; user-select: none; -webkit-user-select: none;
  grid-template-columns: var(--btn) repeat(5, var(--cell)) var(--btn); grid-template-rows: var(--btn) repeat(7, var(--cell)) var(--btn); }
.field { position: relative; grid-column: 2 / span 5; grid-row: 2 / span 7; touch-action: none; cursor: grab; }
.board.is-busy .field { cursor: default; }
.dl-lane { position: absolute; top: -6px; bottom: -6px; width: calc(20% - 6px); border: 2px solid var(--chalk); border-radius: 18px; pointer-events: none; }
.dl-lane:nth-child(1) { left: 3px; } .dl-lane:nth-child(2) { left: calc(20% + 3px); } .dl-lane:nth-child(3) { left: calc(40% + 3px); }
.dl-lane:nth-child(4) { left: calc(60% + 3px); } .dl-lane:nth-child(5) { left: calc(80% + 3px); }
/* Middle row: larger outline that reaches past the vertical lane outlines (owner correction 2026-10-26). */
.midrow { position: absolute; left: -12px; right: -12px; top: calc(3 * var(--cell) - 6px); height: calc(var(--cell) + 12px); border: 3px solid #fff;
  border-radius: 16px; box-shadow: 0 0 0 3px rgba(255, 255, 255, .12), 0 0 16px rgba(255, 255, 255, .28), inset 0 0 14px rgba(255, 255, 255, .12); pointer-events: none; }
.marbles { position: absolute; inset: 0; overflow: hidden; border-radius: 6px; }
.fx { position: absolute; inset: -40px; pointer-events: none; z-index: 3; }
.mb { position: absolute; left: 0; top: 0; width: var(--cellpx, var(--cell)); height: var(--cellpx, var(--cell)); will-change: transform; }
.mb img { position: absolute; left: 5%; top: 5%; width: 90%; height: 90%; object-fit: contain; filter: drop-shadow(0 3px 2px rgba(0, 0, 0, .35)); pointer-events: none; }
.mb.snap { transition: translate .26s var(--spring); }
.mb .pw { left: 24%; top: 22%; width: 52%; height: 52%; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .55)); }
.mb.is-power::after { content: ""; position: absolute; inset: 4%; border-radius: 50%; border: 2.5px solid #fff2b3; box-shadow: 0 0 10px rgba(255, 228, 140, .8), inset 0 0 6px rgba(255, 228, 140, .6); }
.sym { position: absolute; left: 32%; top: 44%; width: 36%; height: 36%; display: none; filter: drop-shadow(0 0 1.5px rgba(0, 0, 0, .7)); pointer-events: none; }
.daily-sym .sym { display: block; }

.mv { display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0; border: 0; border-radius: 14px;
  background: transparent; color: rgba(255, 255, 255, .9); cursor: pointer; position: relative; transition: transform .25s var(--spring), color .2s; }
.mv svg { width: 26px; height: 26px; filter: drop-shadow(0 0 1px rgba(255, 255, 255, .5)); }
.mv:hover { color: #fff; transform: scale(1.12); }
.mv:active { transform: scale(.94); }
.mv[aria-disabled="true"] { color: rgba(255, 255, 255, .28); cursor: not-allowed; transform: none; }
.mv-mark { position: absolute; width: 10px; height: 10px; border-radius: 50%; right: 4px; top: 4px; display: none; }
.mv[data-used="close"] .mv-mark { display: block; background: #ffc23d; }
.mv[data-used="miss"] .mv-mark { display: block; background: #12171d; box-shadow: 0 0 0 2px rgba(255, 255, 255, .75); }
.mv[data-used="hit"] .mv-mark { display: block; background: #47c818; }
.mv.is-answer { color: #ffd36b; animation: answer 1s var(--ease) infinite alternate; }
.mv.nudge { animation: nudge .38s var(--ease); }
@keyframes nudge { 20% { transform: translateX(-4px); } 45% { transform: translateX(4px); } 70% { transform: translateX(-2px); } }
@keyframes answer { from { transform: scale(1); filter: drop-shadow(0 0 0 rgba(255, 211, 107, 0)); } to { transform: scale(1.18); filter: drop-shadow(0 0 10px rgba(255, 211, 107, .9)); } }

/* bursts: glass pops at full size (no shrinking first), flash + shards */
.burst { position: absolute; left: calc(40px + var(--x)); top: calc(40px + var(--y)); width: 0; height: 0; }
.burst .flash { position: absolute; left: calc(var(--cellpx) * -.6); top: calc(var(--cellpx) * -.6); width: calc(var(--cellpx) * 1.2); height: calc(var(--cellpx) * 1.2); border-radius: 50%;
  background: radial-gradient(closest-side, #fff 0, rgba(255, 255, 255, .9) 30%, rgba(255, 255, 255, 0) 100%); animation: flash .42s ease-out both; }
.burst .shard { position: absolute; left: -5px; top: -7px; width: 10px; height: 14px; border-radius: 3px 3px 6px 6px; opacity: 0;
  background: linear-gradient(160deg, #fff 0 18%, var(--sc, var(--m0)) 55%, rgba(0, 0, 0, .25) 100%); box-shadow: 0 0 6px rgba(255, 255, 255, .6); animation: shard .62s cubic-bezier(.15, .7, .3, 1) both; }
.burst[data-c="0"] { --sc: var(--m0); } .burst[data-c="1"] { --sc: var(--m1); } .burst[data-c="2"] { --sc: var(--m2); } .burst[data-c="3"] { --sc: var(--m3); }
.burst.is-power .flash { background: radial-gradient(closest-side, #fff 0, #fff3c2 40%, rgba(255, 210, 90, 0) 100%); transform: scale(1.6); }
@keyframes flash { 0% { opacity: 1; transform: scale(.85); } 100% { opacity: 0; transform: scale(1.7); } }
@keyframes shard { 0% { opacity: 1; transform: translate(0, 0) rotate(0) scale(1); } 100% { opacity: 0; transform: translate(var(--dx), var(--dy)) rotate(var(--r)) scale(.7); } }

/* score pop: balloon "+N" with the x-chain chip; inflate curve 0.30 -> 1.12 (40%) -> 0.96 (70%) -> 1.0 */
.pop { position: absolute; left: 50%; top: calc(40px + 3.5 * var(--cellpx, var(--cell)) - 1px); display: flex; align-items: center; gap: 6px;
  transform: translate(-50%, -50%); animation: pop-life 1.3s linear both; white-space: nowrap; gap: 18px; z-index: 4; }
.pop .balloon { font-size: clamp(2.1rem, 1.6rem + 2.4vw, 2.8rem); line-height: 1; animation: inflate .42s linear both; }
.pop .chip { display: inline-grid; place-items: center; min-width: 2.2em; height: 2.2em; padding: 0 .3em; border-radius: 999px; font: 800 1.6rem/1 "Baloo Bhai 2", var(--display);
  color: #5a2e00; background: radial-gradient(circle at 35% 28%, #fff6cc 0 14%, #ffd04a 45%, #f59a00 100%); box-shadow: 0 3px 0 #a85f00, 0 0 0 3px #fff, 0 6px 14px rgba(0, 0, 0, .35);
  animation: inflate .42s linear .08s both; }
@keyframes inflate { 0% { transform: scale(.3); opacity: 0; } 40% { transform: scale(1.12); opacity: 1; } 70% { transform: scale(.96); } 100% { transform: scale(1); } }
@keyframes pop-life { 0%, 78% { opacity: 1; } 100% { opacity: 0; margin-top: -14px; } }

.daily-msg { min-height: 2.7em; margin: 2px 6px 0; display: flex; align-items: center; justify-content: center; gap: 8px; text-align: center; font-weight: 700; font-size: .9875rem; line-height: 1.3; }
.daily-msg::before { content: ""; flex: none; width: 14px; height: 14px; border-radius: 50%; display: none; }
.daily-msg[data-kind="hit"]::before { display: block; background: #47c818; }
.daily-msg[data-kind="close"]::before { display: block; background: #ffc23d; }
.daily-msg[data-kind="miss"]::before { display: block; background: #12171d; box-shadow: 0 0 0 2px rgba(255, 255, 255, .75); }
.daily-msg[data-kind="info"] { color: #ffd36b; }

.daily-under { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 14px 0 0; }
.daily-note { text-align: center; font-size: .875rem; color: var(--ink-soft); margin: 12px 0 0; }
.daily-error { margin: 10px 0; padding: 16px; border-radius: var(--r-m); background: var(--white); box-shadow: var(--shadow); font-weight: 700; text-align: center; }
.daily-noscript { margin: 10px 0; padding: 16px; border-radius: var(--r-m); background: var(--white); text-align: center; }
html.no-js .daily-card, html.daily-failed .daily-card { display: none; }

/* game buttons (button-v7 nine-slice) */
.gbtn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; padding: 0 20px; border: 14px solid transparent;
  border-image: url("daily/btn-gold.webp") 44 fill / 18px stretch; background: none; font: 800 1.125rem/1 "Baloo Bhai 2", var(--display); color: #4a2600; cursor: pointer;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .55); transition: transform .3s var(--spring); }
.gbtn > * { margin: -12px 0; }
.gbtn:hover { transform: translateY(-2px); }
.gbtn:active { transform: translateY(1px) scale(.97); }
.gbtn.is-blue { border-image-source: url("daily/btn-blue.webp"); color: #fff; text-shadow: 0 1px 0 #063b6e, 0 0 3px #063b6e; }
html[lang="ru"] .gbtn, html[lang="zh"] .gbtn, html[lang="ja"] .gbtn, html[lang="ko"] .gbtn { font-family: var(--display); font-size: 1rem; }
.gbtn svg { width: 20px; height: 20px; }

/* ---------- popup80 dialogs ---------- */
.pop80 { position: fixed; width: min(440px, calc(100vw - 28px)); max-height: calc(100dvh - 60px); margin: auto; padding: 0; overflow: visible;
  border: 26px solid transparent; border-image: url("daily/card.webp") 120 fill / 56px stretch; background: none; color: var(--ink); --focus: var(--ink); }
.pop80::backdrop { background: rgba(8, 26, 46, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.pop80[open] { animation: card-in .5s var(--spring) both; }
.pop80 .pop-body { max-height: calc(100dvh - 112px); overflow: auto; padding: 36px 8px 6px; text-align: center; }
.ribbon { position: absolute; left: 50%; top: -58px; width: min(340px, 92%); aspect-ratio: 720 / 277; transform: translateX(-50%); background: url("daily/ribbon.webp") center / contain no-repeat; pointer-events: none; }
.ribbon svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ribbon text { font-family: "Baloo Bhai 2", var(--display); font-weight: 800; fill: #fff; stroke: #0a5f8f; stroke-width: 5px; paint-order: stroke fill; stroke-linejoin: round; }
html[lang="ru"] .ribbon text, html[lang="zh"] .ribbon text, html[lang="ja"] .ribbon text, html[lang="ko"] .ribbon text { font-family: var(--display); }
.close80 { position: absolute; top: -40px; right: -38px; width: 58px; height: 58px; border: 0; padding: 0; border-radius: 50%; cursor: pointer; z-index: 2;
  background: url("daily/close.webp") center / contain no-repeat; display: grid; place-items: center; transition: transform .3s var(--spring); }
.close80:hover { transform: scale(1.06); }
.close80 svg { width: 22px; height: 22px; filter: drop-shadow(0 1px 1px rgba(4, 40, 90, .6)); }
@keyframes card-in { 0% { opacity: 0; transform: scale(.82); } 60% { opacity: 1; transform: scale(1.03); } 100% { transform: none; } }
@media (max-width: 400px) { .close80 { right: -30px; } }

.help-list { text-align: left; margin: 4px 0 12px; padding: 0 0 0 1.2em; }
.help-list li { margin: 0 0 6px; line-height: 1.4; }
.help-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; margin-top: 12px; }
.check { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px; border-radius: 999px; border: 2px solid var(--line); background: var(--white); color: var(--ink); font: 700 .9375rem/1.2 var(--text); cursor: pointer; }
.check::before { content: ""; width: 18px; height: 18px; border-radius: 5px; border: 2px solid var(--ink-soft); }
.check[aria-pressed="true"]::before { background: var(--teal) center / 12px no-repeat; border-color: var(--teal); box-shadow: inset 0 0 0 3px #fff; }

/* mini demo: slide the middle column down, three blues meet in the middle row and pop (CSS loop, ~3.2 s) */
.mini { --mc: 40px; position: relative; display: grid; grid-template-columns: repeat(3, var(--mc)); gap: 10px; justify-content: center; margin: 4px auto 10px; padding: 14px 16px;
  width: max-content; background: var(--board) radial-gradient(120% 90% at 30% 20%, var(--board-hi) 0, #34383d 70%); border-radius: 22px; }
.mini::after { content: ""; position: absolute; left: 8px; right: 8px; top: calc(14px + var(--mc) - 4px); height: calc(var(--mc) + 8px); border: 2.5px solid #fff; border-radius: 12px; pointer-events: none; }
.mini-lane { position: relative; height: calc(3 * var(--mc)); overflow: hidden; border: 2px solid var(--chalk); border-radius: 12px; }
.mini-track { position: absolute; left: 0; right: 0; top: calc(-1 * var(--mc)); }
.mini-track img { display: block; width: var(--mc); height: var(--mc); padding: 3px; }
.mini-lane:nth-child(2) .mini-track { animation: mini-slide 3.2s var(--ease) infinite; }
.mini .is-hit { animation: mini-pop 3.2s linear infinite; }
.mini-finger { position: absolute; z-index: 2; width: 34px; left: calc(16px + 1.5 * var(--mc) + 10px - 8px); top: 6px; animation: mini-finger 3.2s var(--ease) infinite; pointer-events: none; }
.mini-arrow { display: none; position: absolute; left: calc(50% - 10px); top: 2px; width: 20px; height: 20px; color: #ffd36b; }
@keyframes mini-slide { 0%, 18% { transform: none; } 42%, 100% { transform: translateY(var(--mc)); } }
@keyframes mini-pop { 0%, 46% { opacity: 1; transform: scale(1); filter: none; } 52% { opacity: 1; transform: scale(1.12); filter: drop-shadow(0 0 8px #fff); } 60%, 92% { opacity: 0; transform: scale(1.2); } 100% { opacity: 1; transform: none; } }
@keyframes mini-finger { 0%, 10% { opacity: 0; transform: translateY(0); } 18% { opacity: 1; transform: translateY(0); } 42% { opacity: 1; transform: translateY(var(--mc)); } 52%, 100% { opacity: 0; transform: translateY(var(--mc)); } }
@media (prefers-reduced-motion: reduce) {
  .mini-lane:nth-child(2) .mini-track { animation: none; transform: none; } .mini .is-hit { animation: none; } .mini-finger { display: none; } .mini-arrow { display: block; }
  .pop .balloon, .pop .chip { animation: none; }
}

/* result */
.res-hero { width: 96px; height: auto; margin: 0 auto 2px; filter: drop-shadow(0 8px 10px rgba(11, 42, 69, .25)); }
.res-hero.is-dim { width: 80px; filter: grayscale(.35) drop-shadow(0 8px 10px rgba(11, 42, 69, .2)); }
.pop80.is-animated .res-hero { animation: inflate .5s linear .15s both; }
.res-title { margin: 0 0 6px; font-size: 1.9rem; }
.res-tiles { display: flex; justify-content: center; gap: 8px; margin: 0 0 6px; }
.res-tiles .try { width: 26px; height: 26px; border-color: rgba(12, 43, 71, .35); }
.res-answer { font-weight: 700; color: var(--teal); margin: 0 0 6px; }
.res-answer:empty { display: none; }
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin: 6px 0 8px; }
.stat-grid div { display: flex; flex-direction: column; align-items: center; }
.stat-grid b { font: 800 1.6rem/1 "Baloo Bhai 2", var(--display); color: var(--ink); }
.stat-grid span { font-size: .75rem; line-height: 1.2; color: var(--ink-soft); }
.dist { margin: 0 0 8px; text-align: left; }
.dist h3 { font: 700 .875rem/1.3 var(--text); margin: 0 0 4px; text-align: center; }
.dist-row { display: grid; grid-template-columns: 1.4em 1fr; align-items: center; gap: 6px; margin: 2px 0; font-weight: 700; font-size: .875rem; }
.bar { width: var(--w, 8%); min-width: 26px; height: 20px; border-radius: 6px; background: #7c96ad; color: #fff; display: flex; align-items: center; justify-content: flex-end; padding: 0 7px; font-size: .8125rem; }
.bar.is-today { background: var(--teal); }
.res-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 6px 0; }
.share-fallback { width: 100%; min-height: 4.4em; margin: 6px 0; padding: 8px; border-radius: 10px; border: 2px solid var(--line); font: 600 .9375rem/1.4 var(--text); color: var(--ink); resize: none; }
.res-next { font-weight: 700; margin: 6px 0 10px; font-variant-numeric: tabular-nums; }
.res-cta { border-top: 2px dashed rgba(12, 43, 71, .18); padding-top: 10px; }
.res-cta h3 { font-size: 1.2rem; margin: 0 0 4px; }
.res-cta p { font-size: .9375rem; margin: 0 0 8px; }
.res-cta .stores { justify-content: center; }
.res-cta .stores.official img[src*="appstore"] { height: 44px; }
.res-cta .stores.official img[src*="googleplay"] { height: 64px; }
.res-practice { font-weight: 700; color: var(--teal); }
@media (min-width: 768px) { .daily-card { padding: 12px 18px 12px; } }

.daily-page [hidden], .pop80 [hidden] { display: none !important; }

/* review V (2026-11-05): result card on phones - store badges right under "Enjoyed it?" and a tighter stats block,
   so the call to action is reachable without scrolling inside the card */
.res-cta { display: flex; flex-direction: column; align-items: center; }
.res-cta h3 { order: 0; }
.res-cta .stores { order: 1; margin: 2px 0 6px; }
.res-cta p { order: 2; }
@media (max-height: 900px) {
  .res-hero { width: 64px; }
  .res-hero.is-dim { width: 56px; }
  .res-title { font-size: 1.6rem; margin-bottom: 4px; }
  .stat-grid { margin: 4px 0 6px; }
  .stat-grid b { font-size: 1.35rem; }
  .dist-row { margin: 1px 0; }
  .bar { height: 17px; }
  .res-next { margin: 4px 0 8px; }
  .res-cta p { font-size: .875rem; line-height: 1.4; margin-bottom: 4px; }
}
@media (max-width: 400px) {
  .res-actions { flex-wrap: nowrap; gap: 6px; }
  .res-actions .gbtn { min-width: 0; padding: 0 4px; font-size: 1rem; white-space: nowrap; }
  .res-cta .stores { flex-wrap: nowrap; gap: 8px; }
  .res-cta .stores.official img[src*="appstore"] { height: 40px; }
  .res-cta .stores.official img[src*="googleplay"] { height: 58px; }
}

/* Coolkee Daily glyph subsets (fonts merged by family + unicode-range with the site subsets). */
@font-face { font-family:"Noto Sans SC"; src:url("daily/noto-daily-zh-9f23361ebf.woff2") format("woff2"); font-style:normal; font-weight:100 900; font-display:swap; unicode-range:U+505A,U+518C,U+5237,U+552F,U+5706,U+5708,U+5C16,U+6846,U+7EEA,U+7EFF,U+83F1,U+8C1C,U+8E2A,U+8FFD,U+90A3,U+9EC4; }
@font-face { font-family:"Noto Sans JP"; src:url("daily/noto-daily-ja-709ce097a1.woff2") format("woff2"); font-style:normal; font-weight:100 900; font-display:swap; unicode-range:U+4E38,U+56DB,U+5FF5,U+6B04,U+7DD1; }
@font-face { font-family:"Noto Sans KR"; src:url("daily/noto-daily-ko-ff5eceee6a.woff2") format("woff2"); font-style:normal; font-weight:100 900; font-display:swap; unicode-range:U+AE5D,U+B410,U+B531,U+C1E0,U+D64D; }