/* Learn To Read Online — learning helpers (daily goal, word hints, accessibility) */

/* ---- larger tap targets (WCAG 2.5.5: at least 44px) on touch screens ---- */
@media (pointer:coarse){
  button, .btn, [role="button"], select, summary, .pill{ min-height:44px; }
  button:not(.sound-letter):not(.ltr-switch), .btn{ min-width:44px; }
  .cart-btn{ min-width:44px; min-height:44px; }
}
:focus-visible{ outline:3px solid #1E7CA8; outline-offset:2px; }

/* ---- progress ring ---- */
.ltr-ring-bg{ stroke:#EADFCB; }
.ltr-ring-fg{ stroke:#2DBE5F; transition:stroke-dashoffset .5s ease; }
.done .ltr-ring-fg{ stroke:#E0A200; }
.ltr-goal-mini{ position:relative; display:inline-flex; align-items:center; justify-content:center; padding:0 !important; background:#fff; }
.ltr-goal-mini svg{ display:block; }
.ltr-ring-txt{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font:800 10px/1 'Fredoka',system-ui,sans-serif; color:#2B2757; }
.ltr-ring-txt small{ font-size:7px; opacity:.7; }
.ltr-ring-txt.big{ font-size:17px; }
.ltr-ring-txt.big small{ font-size:10px; }
.ltr-goal-ring-btn{ display:inline-flex; flex-direction:column; align-items:center; gap:2px; background:none; border:0; padding:2px 4px; cursor:pointer; color:var(--ink,#2B2757); }
.ltr-goal-ring-wrap, .ltr-ring-big{ position:relative; display:inline-flex; }
.ltr-goal-cap{ font:700 11px/1 system-ui,sans-serif; color:var(--ink-soft,#5B5683); }
.ltr-streak-widget{ flex-wrap:wrap; }

/* ---- sheet ---- */
.ltr-sheet{ position:fixed; inset:0; z-index:120; background:rgba(40,30,60,.5); display:flex; align-items:flex-end; justify-content:center; overflow-y:auto; }
.ltr-sheet[hidden]{ display:none; }
.ltr-sheet-panel{ background:#fff; width:100%; max-width:520px; max-height:92vh; overflow-y:auto; border-radius:24px 24px 0 0; padding:18px 18px calc(24px + env(safe-area-inset-bottom)); box-shadow:0 -10px 40px rgba(0,0,0,.25); }
@media (min-width:640px){ .ltr-sheet{ align-items:center; } .ltr-sheet-panel{ border-radius:24px; } }
.ltr-sheet-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
.ltr-sheet-head h2{ margin:0; font-size:20px; }
.ltr-x{ width:48px; height:48px; border-radius:50%; border:0; background:#F1ECF8; font-size:18px; cursor:pointer; }
.ltr-sheet section{ border-top:1.5px solid #EEE8F7; padding:14px 0 6px; }
.ltr-sheet h3{ margin:0 0 8px; font-size:16px; }
.ltr-p, .ltr-note, .ltr-row-s{ color:#5B5683; font-size:13.5px; margin:0 0 10px; line-height:1.4; }
.ltr-note{ font-size:12.5px; margin-top:10px; }
.ltr-goal-row{ display:flex; align-items:center; gap:14px; margin-bottom:12px; }
.ltr-row-t{ font-weight:800; font-size:15px; color:#2B2757; }
.ltr-seg{ display:flex; gap:8px; }
.ltr-seg-btn, .ltr-chip{ flex:1; min-height:48px; border-radius:14px; border:2px solid #D9CFF0; background:#fff; font:800 15px system-ui,sans-serif; color:#2B2757; cursor:pointer; padding:8px 12px; }
.ltr-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.ltr-chip{ flex:0 1 auto; }
.ltr-seg-btn.on, .ltr-chip.on{ background:#2B2757; border-color:#2B2757; color:#fff; }
.ltr-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; }
.ltr-switch{ flex:none; width:60px; height:34px; border-radius:20px; border:2px solid #9A92BD; background:#EEE8F7; position:relative; cursor:pointer; padding:0; }
.ltr-switch span{ position:absolute; top:3px; left:3px; width:24px; height:24px; border-radius:50%; background:#fff; border:2px solid #9A92BD; transition:left .15s; }
.ltr-switch[aria-checked="true"]{ background:#2DBE5F; border-color:#1B8E43; }
.ltr-switch[aria-checked="true"] span{ left:29px; border-color:#1B8E43; }
.ltr-noscroll{ overflow:hidden; }

/* ---- hint bubble & pill ---- */
#ltr-hint{ position:fixed; z-index:130; max-width:min(300px,92vw); background:#2B2757; color:#fff; border-radius:16px; padding:10px 40px 10px 14px; box-shadow:0 8px 28px rgba(0,0,0,.3); display:none; font-family:system-ui,sans-serif; }
#ltr-hint.show{ display:block; }
.ltr-hint-lang{ font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; opacity:.75; }
.ltr-hint-word{ font-size:17px; margin-top:2px; } .ltr-hint-word strong{ color:#FFD43B; font-size:19px; } .ltr-hint-word .en{ opacity:.85; }
.ltr-hint-none{ font-size:14px; margin-top:2px; }
.ltr-hint-x{ position:absolute; top:2px; right:2px; width:40px; height:40px; background:none; border:0; color:#fff; font-size:16px; cursor:pointer; }
.ltr-hint-report{ margin-top:6px; background:none; border:0; color:#B9E4FF; font-size:12px; text-decoration:underline; cursor:pointer; padding:4px 0; }
#ltr-hint-pill{ position:fixed; left:10px; bottom:calc(138px + env(safe-area-inset-bottom)); z-index:70; background:#fff; border:2px solid #2B2757; color:#2B2757; border-radius:20px; padding:6px 12px; font:800 12px system-ui,sans-serif; cursor:pointer; box-shadow:0 3px 10px rgba(0,0,0,.15); }

/* ---- read aloud ---- */
#ltr-aloud-fab{ position:fixed; left:10px; bottom:calc(76px + env(safe-area-inset-bottom)); z-index:70; min-height:52px; padding:10px 18px; border-radius:26px; border:0; background:#1E7CA8; color:#fff; font:800 15px system-ui,sans-serif; box-shadow:0 5px 16px rgba(0,0,0,.28); cursor:pointer; }
.ltr-reading{ background:#FFF3B8 !important; outline:2px solid #FFD43B; border-radius:6px; }
html.ltr-aloud #pages p, html.ltr-aloud #pages li{ cursor:pointer; }
#ltr-toast{ position:fixed; left:50%; bottom:calc(140px + env(safe-area-inset-bottom)); transform:translateX(-50%) translateY(20px); opacity:0; pointer-events:none; z-index:140; background:#2B2757; color:#fff; padding:12px 18px; border-radius:16px; font:700 14px system-ui,sans-serif; max-width:90vw; text-align:center; transition:all .25s; }
#ltr-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

/* ---- bigger text & buttons ---- */
html.ltr-large #pages{ zoom:1.18; }
html.ltr-large button, html.ltr-large .btn, html.ltr-large select{ min-height:56px; font-size:max(1em,16px); }
html.ltr-large .pill{ min-height:52px; }

/* ---- high contrast ---- */
html.ltr-hc{ --ink:#000; --ink-soft:#1A1A1A; --cream:#fff; --card:#fff; --edge:#000; --shadow:none; --shadow-lift:none; --shadow-press:none; }
html.ltr-hc body{ background:#fff !important; color:#000; }
html.ltr-hc .ltr-floaties{ display:none !important; }
html.ltr-hc #pages [style*="background"]{ background:#fff !important; background-image:none !important; }
html.ltr-hc #pages :where(p,li,h1,h2,h3,h4,h5,span,div,label,td,th,small,em,strong,a):not(button *):not(.btn *){ color:#000 !important; }
html.ltr-hc #pages a{ text-decoration:underline; }
html.ltr-hc .card, html.ltr-hc #pages [class*="card"], html.ltr-hc #pages .lesson-block{ border:2px solid #000 !important; box-shadow:none !important; }
html.ltr-hc button, html.ltr-hc .btn{ border:2px solid #000 !important; box-shadow:none !important; }
html.ltr-hc .btn-primary, html.ltr-hc button.btn-primary, html.ltr-hc .cta-mini, html.ltr-hc .pill.active, html.ltr-hc .tier-btn{ background:#000 !important; color:#fff !important; }
html.ltr-hc .btn-outline, html.ltr-hc .pill:not(.active), html.ltr-hc .order-opt{ background:#fff !important; color:#000 !important; }
html.ltr-hc .order-opt.correct{ background:#fff !important; border:4px solid #000 !important; }
html.ltr-hc .order-opt.wrong{ background:#fff !important; border:4px dashed #000 !important; text-decoration:line-through; }
html.ltr-hc .theme-strip{ background:#000 !important; height:8px; }
html.ltr-hc .badge{ background:#000 !important; color:#fff !important; }
html.ltr-hc .ltr-ring-bg{ stroke:#999; } html.ltr-hc .ltr-ring-fg{ stroke:#000; }
html.ltr-hc .ltr-seg-btn.on, html.ltr-hc .ltr-chip.on{ background:#000; border-color:#000; }
html.ltr-hc .ltr-switch{ border-color:#000; } html.ltr-hc .ltr-switch[aria-checked="true"]{ background:#000; }
html.ltr-hc :focus-visible{ outline:4px solid #000; outline-offset:3px; }