/* Loaded only by the Telegram build. Preserve the existing artwork and themes. */
:root.tg-mini-app body,
:root.tg-mini-app .shell { min-height:var(--iq-tg-height,100dvh); }
:root.tg-mini-app .shell {
  --iq-tg-gutter:28px;
  padding-top:max(env(safe-area-inset-top,0px),var(--iq-tg-inset-top,0px));
  padding-right:max(var(--iq-tg-gutter),env(safe-area-inset-right,0px),var(--iq-tg-inset-right,0px));
  padding-bottom:max(12px,env(safe-area-inset-bottom,0px),var(--iq-tg-inset-bottom,0px));
  padding-left:max(var(--iq-tg-gutter),env(safe-area-inset-left,0px),var(--iq-tg-inset-left,0px));
}
:root.tg-mini-app .toast { bottom:calc(20px + max(env(safe-area-inset-bottom,0px),var(--iq-tg-inset-bottom,0px))); }
/* Local records and achievements remain available; there is no Telegram ranking yet. */
body[data-platform='telegram'] [data-world-nav='leaderboard'],
body[data-platform='telegram'] :is(#leaderboard,#leaderboardOpen,#leaderboardLogin,#submitScore) { display:none!important; }
body[data-platform='telegram'] .world-bottom-nav { grid-template-columns:repeat(3,minmax(0,1fr)); }
body[data-platform='telegram'] .world-home-top #settings { margin-left:auto; }
body[data-platform='telegram'] .result-secondary { grid-template-columns:1fr; }
@media(max-width:700px) { :root.tg-mini-app .shell { --iq-tg-gutter:20px; } }
@media(max-width:380px) { :root.tg-mini-app .shell { --iq-tg-gutter:14px; } }

/* PNG fallback stays visible when this WebView cannot share local files. */
.png-export-dialog { box-sizing:border-box; position:fixed; inset:0; width:min(720px,calc(100% - 24px)); max-height:90dvh; margin:auto; overflow:auto; padding:20px; border:1px solid #e0e3f2; border-radius:24px; background:#fff; color:#17213b; box-shadow:0 24px 80px #17213b40; z-index:10000; }
.png-export-dialog::backdrop { background:#17213b80; }
.png-export-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.png-export-heading h2 { margin:0; font-size:20px; }
.png-export-dialog .share-help { font-size:14px; line-height:1.5; }
.png-export-actions { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.png-export-actions button { min-width:0; max-width:100%; padding:10px 14px; font-size:14px; }
.png-export-actions [hidden] { display:none; }
.png-export-image { max-height:55dvh; overflow:auto; overscroll-behavior:contain; border-radius:12px; background:#f0f3fe; }
.png-export-image img { display:block; width:auto; height:auto; max-width:100%; max-height:50dvh; margin:auto; -webkit-touch-callout:default; user-select:auto; }
.png-export-zoom img { width:1080px; max-width:none; max-height:none; }

/* Mobile Question UX v1: only Telegram gameplay. The question remains auto-height
   inside one scrollport; the existing single action bar has its own reserved row. */
@media(max-width:700px) {
  body[data-platform='telegram'].mind-active { min-height:0; overflow:hidden; }
  body[data-platform='telegram'].mind-active .topbar,
  body[data-platform='telegram'].mind-active .footer { display:none; }
  body[data-platform='telegram'].mind-active .shell {
    --iq-tg-gutter:12px;
    --question-bottom-safe:max(8px,env(safe-area-inset-bottom,0px),var(--iq-tg-inset-bottom,0px));
    height:100vh; height:100svh; height:min(100dvh,var(--iq-tg-height,100dvh));
    min-height:0; width:100%;
    padding-top:max(8px,env(safe-area-inset-top,0px),var(--iq-tg-inset-top,0px));
    padding-bottom:0;
  }
  body[data-platform='telegram'].mind-active #app { display:flex; flex-direction:column; min-height:0; }
  body[data-platform='telegram'] .mind-game {
    --question-action-space:0px;
    flex:1; width:100%; min-height:0; margin:0; padding-bottom:var(--question-action-space);
    display:flex; flex-direction:column;
  }
  body[data-platform='telegram'] .mind-game[data-answered='true'] { --question-action-space:calc(80px + var(--question-bottom-safe)); }
  body[data-platform='telegram'] .mind-game-header {
    display:grid; grid-template-columns:1fr auto 1fr; grid-template-rows:44px 4px;
    align-items:center; gap:4px 6px; flex:none; margin:0 0 8px; padding:2px 0 4px;
  }
  body[data-platform='telegram'] .mind-game .game-top { display:contents; }
  body[data-platform='telegram'] .mind-game :is(.mode-name,.mind-time-note) { display:none; }
  body[data-platform='telegram'] .mind-game #backHome { grid-column:1; grid-row:1; justify-self:start; padding:6px 0; min-height:44px; }
  body[data-platform='telegram'] .mind-game .question-counter { grid-column:2; grid-row:1; gap:5px; font-size:11px; white-space:nowrap; }
  body[data-platform='telegram'] .mind-game .question-counter strong { font-size:16px; letter-spacing:0; }
  body[data-platform='telegram'] .mind-game .question-counter small { font-size:12px; }
  body[data-platform='telegram'] .mind-game .quick-timer { grid-column:3; grid-row:1; justify-self:end; gap:4px; padding:6px 7px; font-size:14px; border-radius:9px; }
  body[data-platform='telegram'] .mind-game .quick-timer .icon { width:15px; height:15px; }
  body[data-platform='telegram'] .mind-game .progress-track { grid-column:1/-1; grid-row:2; height:4px; }
  body[data-platform='telegram'] .mind-game .game-card {
    flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch; scroll-padding-block:8px;
    padding:0 1px var(--question-bottom-safe);
  }
  body[data-platform='telegram'] .mind-game .question-panel { padding:clamp(10px,2vh,14px); border-radius:16px; box-shadow:none; }
  body[data-platform='telegram'] .mind-game .question-meta { gap:8px; flex-wrap:wrap; }
  body[data-platform='telegram'] .mind-game .question-title,
  body[data-platform='telegram'] .mind-game .question-title.question-long { font-size:clamp(16px,2.25vh,19px); line-height:1.42; letter-spacing:-.15px; margin:8px 0 0; }
  body[data-platform='telegram'] .mind-game :is(.visual-puzzle,.graphic-puzzle) { margin-top:10px; padding:6px; border-radius:11px; }
  body[data-platform='telegram'] .mind-game .puzzle-svg { width:100%; height:auto; max-height:clamp(156px,27vh,228px); }
  body[data-platform='telegram'] .mind-game .graphic-sequence { padding:3px; }
  body[data-platform='telegram'] .mind-game .puzzle-strip { gap:6px; padding:0; }
  body[data-platform='telegram'] .mind-game .puzzle-strip span { min-width:28px; min-height:36px; padding:5px 7px; font-size:18px; border-radius:8px; }
  body[data-platform='telegram'] .mind-game .number-matrix { width:min(100%,clamp(156px,27vh,216px)); gap:5px; margin:10px auto 0; }
  body[data-platform='telegram'] .mind-game .number-matrix-cell { font-size:23px; border-radius:9px; }
  body[data-platform='telegram'] .mind-game .table-puzzle { margin:10px 0 0; }
  body[data-platform='telegram'] .mind-game .puzzle-table { font-size:13px; line-height:1.45; }
  body[data-platform='telegram'] .mind-game .puzzle-table th { font-size:11px; }
  body[data-platform='telegram'] .mind-game .puzzle-table :is(th,td) { padding:6px 5px; }
  body[data-platform='telegram'] .mind-game .answers-heading { margin:10px 2px 6px; font-size:11px; }
  body[data-platform='telegram'] .mind-game :is(.answers,.answers.visual-answers) { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  body[data-platform='telegram'] .mind-game .answer { display:grid; grid-template-columns:20px minmax(0,1fr); gap:7px; min-height:52px; padding:8px; border-radius:12px; font-size:16px; line-height:1.4; }
  body[data-platform='telegram'] .mind-game .answer-label { position:static; width:20px; height:20px; }
  body[data-platform='telegram'] .mind-game .answer.answer-short { font-size:22px; }
  body[data-platform='telegram'] .mind-game .answer.answer-long { font-size:15px; }
  body[data-platform='telegram'] .mind-game .visual-answer { min-height:76px; }
  body[data-platform='telegram'] .mind-game .choice-svg { width:clamp(54px,10vh,80px); height:auto; margin:auto; }
  body[data-platform='telegram'] .mind-game .hint-card { margin-top:10px; padding:10px; grid-template-columns:28px minmax(0,1fr); gap:6px 9px; border-radius:14px; }
  body[data-platform='telegram'] .mind-game .hint-bulb { width:28px; height:28px; }
  body[data-platform='telegram'] .mind-game .hint-bulb .icon { width:19px; height:19px; }
  body[data-platform='telegram'] .mind-game .hint-heading h2 { font-size:13px; }
  body[data-platform='telegram'] .mind-game .hint-copy p { margin-top:3px; font-size:11px; line-height:1.45; }
  body[data-platform='telegram'] .mind-game .hint-card button { min-height:44px; padding:8px 10px; }
  body[data-platform='telegram'] .mind-game .feedback { margin-top:10px; padding:10px; gap:8px; font-size:13px; line-height:1.5; border-radius:13px; }
  body[data-platform='telegram'] .mind-game .feedback strong { font-size:14px; }
  body[data-platform='telegram'] .mind-game .feedback-icon { width:24px; height:24px; }
  body[data-platform='telegram'] .mind-game .feedback-figure .choice-svg { width:60px; }
  body[data-platform='telegram'] .mind-game .feedback-details summary { display:list-item; min-height:44px; padding:12px 0; cursor:pointer; font-weight:600; }
  body[data-platform='telegram'] .mind-game .feedback-details[open] summary { padding-bottom:8px; }
  body[data-platform='telegram'] .mind-game .halfway-note { margin-top:10px; padding:9px; font-size:12px; }
  body[data-platform='telegram'] .mind-game .mind-bottom {
    position:fixed; z-index:30; left:0; right:0;
    bottom:max(0px,calc(100vh - var(--iq-tg-height,100vh)));
    bottom:max(0px,calc(100dvh - var(--iq-tg-height,100dvh)));
    gap:6px; margin:0; padding:8px max(var(--iq-tg-gutter,12px),env(safe-area-inset-right,0px),var(--iq-tg-inset-right,0px)) var(--question-bottom-safe) max(var(--iq-tg-gutter,12px),env(safe-area-inset-left,0px),var(--iq-tg-inset-left,0px));
    border-top:1px solid var(--world-border,#e7eaf4); background:var(--world-solid,#fff); box-shadow:0 -4px 16px #29365308;
  }
  body[data-platform='telegram'] .mind-game .safe-pill { font-size:11px; line-height:14px; }
  body[data-platform='telegram'] .mind-game #next { min-height:48px; max-width:680px; padding:10px 14px; border-radius:12px; }
}
