/* R6.53 — Mobile story UX & interaction stability */
.r69-story-reader button:active,
.r69-story-reader [role="button"]:active{transform:none!important}
.r652-segment:active{transform:none!important}
.r652-reader-refreshed{animation:none!important}

/* Focus control: stable pill on desktop, compact icon on phones. */
.r620-focus-toggle{flex:0 0 auto!important;white-space:nowrap;overflow:hidden;max-width:160px;transition:background-color .16s ease,border-color .16s ease,color .16s ease!important}
.r620-focus-toggle.is-active,.r620-focus-toggle[aria-pressed="true"]{background:#123b64!important;color:#fff!important;border-color:#123b64!important}
.r620-focus-icon{display:grid;place-items:center;width:18px;height:18px;line-height:1;font-size:.72rem}
.r620-focus-label{min-width:0;white-space:nowrap}

/* Audio is a first-class, explicit state without exposing provider internals. */
.r653-audio-panel{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;margin:4px auto 10px;padding:10px 12px;max-width:640px;border:1px solid #dfe8ef;border-radius:16px;background:linear-gradient(180deg,#fbfefd,#f6fbfa);box-shadow:0 6px 18px rgba(23,56,87,.045);text-align:right}
.r653-audio-panel.unavailable{opacity:.78;background:#f8fafb}
.r653-audio-symbol{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#e8f7f3;color:#118a7d}
.r653-audio-symbol .ui-icon{width:19px;height:19px}
.r653-audio-copy{display:grid;gap:1px;min-width:0}
.r653-audio-copy b{font-size:.78rem;color:#183d57}
.r653-audio-copy small{font-size:.61rem;line-height:1.55;color:#738293;white-space:normal}
.r653-audio-actions{display:flex;gap:6px}
.r653-audio-button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:38px;padding:7px 10px;border:1px solid #d9e6ec;border-radius:11px;background:#fff;color:#164a61;font-weight:900;font-size:.67rem;box-shadow:none!important;transform:none!important}
.r653-audio-button.play:not(:disabled){background:#128f80;color:#fff;border-color:#128f80}
.r653-audio-button:disabled{opacity:.46;cursor:not-allowed}
.r653-audio-button .ui-icon{width:16px;height:16px}
.r653-audio-panel .r69-audio-status{grid-column:2/-1;margin:0;color:#688090;font-size:.6rem}

/* Mobile story: information card appears once, compactly, above the scene. */
@media(max-width:900px){
  .r69-reader-shell{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
  .r69-story-info{order:-1!important;display:grid!important;grid-template-columns:72px minmax(0,1fr)!important;grid-template-areas:"cover title" "cover progress" "meta meta"!important;gap:5px 10px!important;align-items:center!important;width:100%!important;min-width:0!important;padding:9px 10px!important;margin:0!important;border-radius:16px!important;background:linear-gradient(180deg,#fff,#f9fbfc)!important;box-shadow:0 7px 20px rgba(23,56,87,.055)!important;overflow:hidden!important}
  .r69-story-info>img{grid-area:cover!important;width:72px!important;height:62px!important;min-width:0!important;object-fit:cover!important;border-radius:12px!important}
  .r69-story-info h2{grid-area:title!important;min-width:0!important;margin:0!important;font-size:.86rem!important;line-height:1.4!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .r69-story-info>.reader-progress{grid-area:progress!important;min-width:0!important;margin:0!important}
  .r69-story-info>.reader-progress>span,.r69-story-info>.reader-progress>b{font-size:.59rem!important}
  .r69-story-info>p,.r69-story-info>.story-parent-note{display:none!important}
  .r69-story-meta{grid-area:meta!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;margin:2px 0 0!important;padding-top:6px!important;border-top:1px solid #edf2f4!important;min-width:0!important}
  .r69-story-meta span{display:flex!important;min-width:0!important;min-height:29px!important;align-items:center!important;justify-content:center!important;gap:4px!important;padding:4px 5px!important;border-radius:9px!important;background:#f4f8f8!important;font-size:.58rem!important;line-height:1.25!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .r69-story-meta .ui-icon{flex:0 0 auto;width:13px!important;height:13px!important}
  .r620-focus-mode .r69-story-info{display:none!important}
}

@media(max-width:600px){
  .r69-story-topbar{grid-template-columns:40px minmax(0,1fr) auto 40px!important;gap:5px!important;align-items:center!important}
  .r620-focus-toggle{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;max-width:40px!important;padding:0!important;border-radius:12px!important;justify-content:center!important;gap:0!important}
  .r620-focus-label{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
  .r620-focus-icon{width:18px;height:18px;font-size:.72rem}
  .r69-story-title{min-width:0!important}
  .r69-story-title h1{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .r69-story-info{grid-template-columns:62px minmax(0,1fr)!important;padding:8px!important;gap:4px 8px!important}
  .r69-story-info>img{width:62px!important;height:54px!important}
  .r69-story-meta span{font-size:.54rem!important;padding-inline:3px!important}
  .r653-audio-panel{grid-template-columns:auto minmax(0,1fr);gap:8px;margin:3px 5px 9px;padding:9px 10px;border-radius:14px}
  .r653-audio-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;width:100%}
  .r653-audio-button{width:100%;min-height:40px}
  .r653-audio-panel .r69-audio-status{grid-column:1/-1;text-align:center}
  .r653-audio-copy b{font-size:.73rem}.r653-audio-copy small{font-size:.58rem}
  .r620-focus-mode .r69-story-stage>.story-scene-visual{height:clamp(255px,72vw,375px)!important}
  .r620-focus-mode .r69-reading-card{margin-top:-5px!important;border-radius:18px!important}
}

/* Today in Naqra: calmer premium palette and clearer hierarchy. */
.r641-daily-plan{border:1px solid rgba(22,118,111,.12)!important;background:linear-gradient(145deg,#fbfffe 0%,#f7fbff 55%,#fff 100%)!important;box-shadow:0 18px 44px rgba(20,66,83,.075)!important}
.r641-daily-head .section-kicker{color:#0f8a7f!important}
.r641-daily-head h2{color:#173c56!important;letter-spacing:-.01em}
.r641-daily-head p{color:#71808f!important}
.r641-daily-metrics>span{border-color:#e1ecec!important;background:rgba(255,255,255,.9)!important;box-shadow:0 5px 14px rgba(22,72,88,.04)!important}
.r641-daily-metrics>span:nth-child(1) b{color:#177d72!important}.r641-daily-metrics>span:nth-child(2) b{color:#b55b7d!important}.r641-daily-metrics>span:nth-child(3) b{color:#336bb5!important}
.r641-plan-card{border-color:#e2ebef!important;background:#fff!important;box-shadow:0 9px 24px rgba(24,65,82,.055)!important;transform:none!important}
.r641-plan-card:hover{transform:none!important;box-shadow:0 13px 30px rgba(24,65,82,.085)!important;border-color:color-mix(in srgb,var(--r641) 24%,#e2ebef)!important}
.r641-plan-card.learn{--r641:#376fc0!important;background:linear-gradient(145deg,#fff,#f5f9ff)!important}
.r641-plan-card.read{--r641:#bd547b!important;background:linear-gradient(145deg,#fff,#fff7fa)!important}
.r641-plan-card.play{--r641:#168b78!important;background:linear-gradient(145deg,#fff,#f4fcf9)!important}
.r641-plan-icon{border:1px solid color-mix(in srgb,var(--r641) 12%,#e6edf0)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)}
.r641-plan-card b{color:#1b3a50!important}.r641-plan-card em{color:#7b8996!important}

@media(prefers-reduced-motion:reduce){.r620-focus-toggle,.r653-audio-button,.r641-plan-card{transition:none!important}}