/* Little Words — Catch, Collect & Reveal (shared). Builds on travel-adventure-v2.css stage rules. */
.ta-hot.is-selected img { filter:drop-shadow(0 0 14px rgba(255,236,170,1)) brightness(1.05); }
.ta-hot.is-collected { pointer-events:none; }

/* ---------- compact practice panel ---------- */
.ccr-practice { position:absolute; z-index:55; bottom:calc(10px + env(safe-area-inset-bottom, 0px)); width:min(320px, 44%); opacity:0; pointer-events:none; transition:opacity .22s, transform .22s; transform:translateY(12px); }
.ccr-practice[data-dock="right"] { right:10px; }
.ccr-practice[data-dock="left"] { left:10px; }
.ccr-practice.is-show { opacity:1; pointer-events:auto; transform:none; }
.ccr-card { background:rgba(255,251,245,.97); border-radius:20px; box-shadow:0 12px 40px rgba(30,42,74,.3); padding:10px 12px 12px; display:flex; flex-direction:column; gap:8px; align-items:stretch; }
.ccr-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.ccr-player { display:flex; align-items:center; gap:6px; font-size:.82rem; font-weight:800; color:var(--navy,#1E2A4A); min-width:0; }
.ccr-player b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ccr-level { position:relative; }
.ccr-level-pill, .ccr-free-pill { min-height:34px; padding:0 10px; border-radius:999px; border:1px solid var(--border,#EDE6DC); background:#fff; font-weight:800; font-size:.8rem; color:var(--navy,#1E2A4A); cursor:pointer; white-space:nowrap; }
.ccr-level-menu, .ccr-free-menu { position:absolute; right:0; top:calc(100% + 4px); background:#fff; border:1px solid var(--border,#EDE6DC); border-radius:12px; box-shadow:0 10px 30px rgba(30,42,74,.25); padding:6px; display:flex; flex-direction:column; gap:4px; z-index:5; min-width:140px; }
.ccr-level-menu[hidden], .ccr-free-menu[hidden] { display:none; }
.ccr-level-menu button, .ccr-free-menu button { min-height:38px; border-radius:9px; border:0; background:#fff; font:inherit; font-weight:700; color:var(--navy,#1E2A4A); text-align:left; padding:0 10px; cursor:pointer; }
.ccr-level-menu button[aria-selected="true"], .ccr-level-menu button:hover, .ccr-free-menu button:hover { background:#e5f2eb; }
.ccr-picture { width:min(140px, 52%); aspect-ratio:1; align-self:center; border-radius:16px; overflow:hidden; background:#fff; border:1px solid var(--border,#EDE6DC); }
.ccr-picture img { width:100%; height:100%; object-fit:contain; display:block; }
.ccr-text { font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(1.4rem, 3.8vw, 2rem); color:var(--navy,#1E2A4A); line-height:1.15; text-align:center; }
.ccr-text.is-long { font-size:clamp(1.1rem, 3vw, 1.5rem); }
.ccr-text.is-sentence { font-size:clamp(1rem, 2.6vw, 1.3rem); font-weight:700; }
.ccr-actions { display:flex; gap:6px; }
.ccr-actions button { flex:1; min-height:46px; border-radius:14px; border:1px solid var(--border,#EDE6DC); background:#fff; font-weight:800; font-size:.86rem; color:var(--navy,#1E2A4A); cursor:pointer; padding:0 6px; }
.ccr-actions button.primary { background:#3F7A5C; color:#fff; border-color:#3F7A5C; box-shadow:0 4px 0 #2E5B44; }
.ccr-actions button.primary:active { transform:translateY(2px); box-shadow:0 2px 0 #2E5B44; }
.ccr-actions .ccr-record[aria-pressed="true"] { background:#FFF0E8; border-color:#F28B6E; color:#B95233; }
.ccr-playback { display:flex; justify-content:center; }
.ccr-playback[hidden] { display:none; }
.ccr-playback button { min-height:36px; border-radius:10px; border:1px solid var(--border,#EDE6DC); background:#fff; font-weight:700; font-size:.82rem; color:var(--navy,#1E2A4A); cursor:pointer; padding:0 12px; }
@media (max-width:640px) { .ccr-practice { width:min(270px, 50%); } .ccr-picture { width:96px; } }

/* Free Play corner control */
.ccr-free { position:absolute; top:8px; right:8px; z-index:50; }
.ccr-free[hidden] { display:none; }
.ccr-free .ccr-free-pill { opacity:.85; }
.ccr-free-menu { left:auto; right:0; }

/* pause veil */
.ccr-pause { position:absolute; inset:0; z-index:70; display:flex; align-items:center; justify-content:center; background:rgba(30,42,74,.45); backdrop-filter:blur(2px); }
.ccr-pause[hidden] { display:none; }

/* ---------- grown-up recap ---------- */
.ccr-recap { position:absolute; inset:0; z-index:65; display:flex; align-items:center; justify-content:center; padding:12px; background:rgba(30,42,74,.5); backdrop-filter:blur(3px); }
.ccr-recap[hidden] { display:none; }
.ccr-recap-card { background:var(--cream,#FFFBF5); border-radius:22px; box-shadow:0 20px 60px rgba(30,42,74,.35); width:min(600px,100%); max-height:min(100%, calc(100vh - 120px)); overflow:auto; padding:18px 18px 14px; }
.ccr-recap-card h2 { font-family:'Bricolage Grotesque',sans-serif; margin:0; font-size:1.3rem; color:var(--navy,#1E2A4A); }
.ccr-recap-cheer { margin:2px 0 10px; color:var(--body,#4A4A4A); font-weight:700; }
.ccr-recap-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; margin-bottom:10px; }
.ccr-recap-grid div { background:#fff; border:1px solid var(--border,#EDE6DC); border-radius:12px; padding:8px 10px; display:flex; flex-direction:column; gap:2px; }
.ccr-recap-grid b { font-size:.72rem; color:var(--muted,#6B6B6B); text-transform:uppercase; letter-spacing:.03em; }
.ccr-recap-grid span { font-weight:800; color:var(--navy,#1E2A4A); }
.ccr-recap-player { padding:8px 0; border-top:1px solid var(--border,#EDE6DC); font-size:.9rem; color:var(--navy,#1E2A4A); }
.ccr-recap-player p { margin:3px 0 0; color:var(--body,#4A4A4A); }
.ccr-slp { margin-top:10px; border:1px solid var(--border,#EDE6DC); border-radius:12px; padding:8px 12px; background:#fff; }
.ccr-slp summary { cursor:pointer; font-weight:800; color:var(--navy,#1E2A4A); min-height:36px; display:flex; align-items:center; }
.ccr-slp label { display:flex; flex-direction:column; gap:3px; font-size:.82rem; font-weight:700; color:var(--muted,#6B6B6B); margin:8px 0; }
.ccr-slp input, .ccr-slp select, .ccr-slp textarea { font:inherit; border:1px solid var(--border,#EDE6DC); border-radius:8px; padding:6px 8px; min-height:36px; }
.ccr-accuracy { margin:4px 0; font-weight:800; color:var(--navy,#1E2A4A); }
.ccr-slp-actions { display:flex; gap:8px; }
.ccr-slp-actions button { flex:1; min-height:40px; border-radius:10px; border:1px solid var(--border,#EDE6DC); background:#fff; font-weight:700; cursor:pointer; }
.ccr-recap-actions { display:flex; gap:10px; margin-top:12px; }
.ccr-recap-actions .big-btn { flex:1; font-size:1rem; padding:12px 14px; text-align:center; }
@media (max-width:560px) { .ccr-recap-grid { grid-template-columns:repeat(2, 1fr); } }

/* adult-facing count pill (stage bar) */
.ccr-count { display:inline-flex; align-items:center; background:#fff; border:1px solid var(--border,#EDE6DC); border-radius:999px; padding:4px 10px; font-size:.8rem; font-weight:700; color:var(--navy,#1E2A4A); }
.ccr-count[hidden] { display:none; }

/* water-fill in a container */
.ccr-tank-inner { position:absolute; inset:0; z-index:2; pointer-events:none; }

.ta-ico{width:1.1em;height:1.1em;vertical-align:-0.18em;margin-right:.3em;display:inline-block}

@media (max-height: 520px) {
  .ta-setup { padding:8px; align-items:flex-start; }
  .ta-setup-card { padding:10px 14px 10px; }
  .ccr-practice[data-dock="right"], .ccr-practice[data-dock="left"] { bottom:auto; top:8px; width:min(240px, 32%); }
  .ccr-card { padding:8px; gap:5px; }
  .ccr-picture { width:min(80px, 44%); }
}

/* the stage owns its hotspots: no juice lift shadow, bob or nudge may move an anchored hotspot */
.ta-box .lwj-lift { box-shadow:none !important; }
.ta-box .lwj-primary, .ta-box .lwj-nudge { animation:none !important; }
.ta-box .ta-hot, .ta-box .ta-sprite, .ta-box .ta-kid, .ta-box .ta-vehicle { translate:-50% -100% !important; }

@media (orientation: portrait) { .ccr-practice { bottom:calc(26px + env(safe-area-inset-bottom, 0px)); } }

/* The runtime is a fixed full-viewport stage; pin the document to the dynamic viewport so an in-flow
   editorial note behind it cannot add a 10px scroll jiggle (mobile audit #14). */
body.lw-ccr { height:100dvh; min-height:0; display:flow-root; overflow:hidden; }

.ccr-level-pill { min-height:40px; }
.ccr-recap { align-items:flex-start; overflow:auto; }