:root { --ink:#6B4A3A; --paper:#FBF4E8; --card:#FFFDF8; --soft:#d9c6ad; --gold:#F7C948; --pink:#F08A9A; --vid:#A77BE0; --green:#8CCB7E;
  --sat: env(safe-area-inset-top, 0px); --sab: env(safe-area-inset-bottom, 0px); }
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html, body { margin:0; height:100%; overflow:hidden; background:#E9E1D3; font-family:'Fredoka', 'Trebuchet MS', sans-serif; color:var(--ink);
  -webkit-user-select:none; user-select:none; touch-action:none; overscroll-behavior:none; }
img { -webkit-user-drag:none; }
#app { position:relative; margin:0 auto; max-width:480px; height:100dvh; height:100vh; height:100dvh; overflow:hidden; background:var(--paper);
  background-image:radial-gradient(#efe3cf 1.3px, transparent 1.4px); background-size:18px 18px; }
.screen { position:absolute; inset:0; display:none; flex-direction:column; padding-top:calc(var(--sat) + 10px); padding-bottom:calc(var(--sab) + 12px); }
.screen.on { display:flex; animation:fadein .22s ease-out; }
@keyframes fadein { from { opacity:0; transform:translateY(6px); } }

/* ---------- common ---------- */
.btn { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:6px 18px;
  background:var(--card); border:3px solid var(--ink); border-radius:18px; box-shadow:0 4px 0 var(--ink); font-weight:700; font-size:20px; color:var(--ink);
  cursor:pointer; transition:transform .08s, box-shadow .08s; }
.btn.pressed { transform:translateY(3px) scale(.96); box-shadow:0 1px 0 var(--ink); }
.btn.disabled { opacity:.45; pointer-events:none; }
.btn .bi { width:34px; height:34px; object-fit:contain; }
.btn .vid { width:30px; height:28px; }
.btn.primary { background:#FFD873; font-size:24px; min-height:60px; padding:8px 28px; }
.btn.video { background:var(--vid); color:#fff; }
.btn.video .bl { text-shadow:0 2px 0 #6b4a3a66; }
.btn.quiet { background:transparent; border-color:transparent; box-shadow:none; font-size:17px; color:#8a6f60; min-height:44px; text-decoration:underline; text-underline-offset:4px; }
.btn.late { visibility:hidden; } .btn.late.show { visibility:visible; animation:fadein .3s; }
.btn.round { width:56px; height:56px; padding:0; border-radius:50%; min-height:0; }
.btn.round .bi { width:36px; height:36px; }
.badge { position:absolute; top:-10px; right:-10px; min-width:26px; height:26px; padding:0 6px; border-radius:13px; background:var(--pink); color:#fff;
  border:2.5px solid var(--ink); font-size:15px; line-height:21px; text-align:center; font-weight:700; }
.badge.plus { background:var(--vid); }
.badge.dot { min-width:18px; width:18px; height:18px; padding:0; top:-6px; right:-6px; }
.chip { display:flex; align-items:center; gap:6px; background:var(--card); border:2.5px solid var(--soft); border-radius:18px; padding:3px 12px; font-weight:700; font-size:20px; min-height:40px; }
.chip img { width:30px; height:30px; object-fit:contain; }
.pill { white-space:nowrap; background:var(--card); border:3px solid var(--ink); border-radius:20px; padding:2px 16px; font-weight:700; font-size:22px; box-shadow:0 3px 0 var(--ink); min-height:44px; display:flex; align-items:center; gap:6px; }
.pill img { width:30px; height:30px; }
.bump { animation:bump .3s; } @keyframes bump { 40% { transform:scale(1.18); } }
.topbar { display:flex; align-items:center; justify-content:space-between; padding:0 14px; min-height:56px; }
.missing { visibility:hidden; }

/* ---------- game ---------- */
.stat { display:flex; justify-content:center; gap:12px; margin-top:8px; }
.hearts img { width:30px; height:30px; transition:filter .3s, transform .3s; }
.hearts img.off { filter:grayscale(1) opacity(.35); transform:scale(.85); }
.hearts.hit { animation:shake .35s; }
.rules { display:flex; justify-content:center; gap:8px; margin:10px 12px 8px; }
.rule { flex:1; max-width:120px; background:var(--card); border:2px dashed var(--soft); border-radius:14px; padding:5px 2px; text-align:center; font-size:14px; font-weight:600; line-height:1.15; }
.rule svg { display:block; margin:0 auto 2px; height:22px; }
.boardwrap { position:relative; margin:4px auto 0; background:var(--card); border:3px solid var(--ink); border-radius:20px; padding:4px; box-shadow:0 5px 0 var(--ink); }
.board { display:grid; border-radius:14px; overflow:hidden; touch-action:none; }
.cell { position:relative; min-width:0; aspect-ratio:1; display:grid; place-items:center; }
.cell .cx { width:52%; height:52%; object-fit:contain; pointer-events:none; animation:pop .14s ease-out; }
.cell .cx.auto { opacity:.38; width:40%; height:40%; animation:none; }
.cell .cx.bad { filter:sepia(1) saturate(6) hue-rotate(-30deg); opacity:.9; }
.cell .cat { width:96%; height:96%; object-fit:contain; pointer-events:none; filter:drop-shadow(0 2px 0 #6b4a3a55); animation:catin .32s cubic-bezier(.3,1.6,.6,1); transform-origin:50% 90%; }
.cell.hl::after { content:''; position:absolute; inset:2px; border:3px solid #F29F05; border-radius:6px; animation:pulse .9s infinite; pointer-events:none; }
.cell.flash { animation:flashbad .5s; }
.cell.dance .cat { animation:dance .6s ease-in-out infinite; }
@keyframes pop { from { transform:scale(.4); opacity:0; } }
@keyframes catin { from { transform:scale(.2) translateY(20%); } }
@keyframes pulse { 50% { opacity:.35; } }
@keyframes flashbad { 30% { background:#F7A1A1 !important; } }
@keyframes shake { 20%,60% { transform:translateX(-6px); } 40%,80% { transform:translateX(6px); } }
@keyframes dance { 50% { transform:translateY(-10%) scaleY(1.04); } }
.hintbox { margin:12px 18px 0; min-height:58px; background:#fff; border:2.5px solid var(--ink); border-left:9px solid var(--gold); border-radius:16px; box-shadow:0 4px 0 var(--ink);
  display:flex; align-items:center; gap:10px; padding:6px 8px 6px 10px; font-weight:600; font-size:18px; visibility:hidden; }
.hintbox.on { visibility:visible; animation:fadein .2s; }
.hintbox img { width:34px; height:34px; }
.hintbox span { flex:1; }
.hintbox .btn { min-height:44px; font-size:18px; padding:4px 14px; background:#FFD873; }
.tools { margin-top:auto; display:flex; justify-content:center; gap:28px; padding:8px 0 6px; }
.tools .btn { width:76px; height:76px; border-radius:26px; padding:0; }
.tools .btn .bi { width:48px; height:48px; }
.tools .btn.pulse { animation:nudge 1s infinite; }
@keyframes nudge { 50% { transform:scale(1.1) rotate(-4deg); } }
#autoBtn { position:absolute; left:50%; bottom:-28px; transform:translateX(-50%); background:var(--green); color:#fff; font-size:18px; min-height:46px; display:none; white-space:nowrap; }
#autoBtn.on { display:inline-flex; animation:fadein .3s; }
#autoBtn .bi { width:28px; height:28px; }
.lvtag { font-size:12px; vertical-align:2px; font-weight:700; color:#fff; background:#B48AE0; border-radius:10px; padding:1px 8px; margin-left:4px; }

/* ---------- home ---------- */
.logo { text-align:center; margin-top:6px; position:relative; }
.logo .peek { width:150px; display:block; margin:0 auto -18px; position:relative; z-index:1; }
.logo h1 { margin:0; font-size:46px; line-height:1; font-weight:700; color:var(--ink); letter-spacing:.5px;
  text-shadow:3px 3px 0 #FFD873, 5px 5px 0 #6b4a3a33; background:var(--card); display:inline-block; padding:10px 22px 12px; border:3px solid var(--ink); border-radius:24px; box-shadow:0 5px 0 var(--ink); position:relative; z-index:2; }
.logo h1 b { color:#E8738A; }
.homeplay { display:flex; flex-direction:column; align-items:center; gap:14px; margin-top:22px; }
.homeplay .btn.primary { min-width:230px; font-size:30px; min-height:74px; }
.nextcat { display:flex; align-items:center; gap:10px; background:var(--card); border:2.5px solid var(--soft); border-radius:18px; padding:6px 14px 6px 6px; font-weight:600; }
.nextcat img { width:54px; height:54px; filter:brightness(0) opacity(.28); }
.nextcat .bar { width:120px; height:12px; border-radius:6px; background:#efe3cf; overflow:hidden; border:2px solid var(--soft); }
.nextcat .bar i { display:block; height:100%; background:var(--pink); }
.tiles { display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; margin:auto 16px 6px; }
.tile { flex-direction:column; gap:0; padding:8px 0 6px; min-height:96px; border-radius:22px; font-size:16px; }
.tile .bi { width:54px; height:54px; }
.tile.locked .bi { filter:grayscale(1) opacity(.5); }
.freecoins { align-self:center; margin:2px 0 4px; font-size:18px; min-height:46px; }
.freecoins .bi { width:28px; height:28px; }

/* ---------- album ---------- */
.list { flex:1; overflow-y:auto; touch-action:pan-y; padding:8px 14px 20px; }
.album { display:grid; grid-template-columns:repeat(4, 1fr); gap:10px; }
.acard { position:relative; background:var(--card); border:2.5px solid var(--soft); border-radius:16px; padding:6px 4px 4px; text-align:center; font-weight:600; font-size:14px; min-height:96px; }
.acard img { width:100%; aspect-ratio:1; object-fit:contain; }
.acard.lock img { filter:brightness(0) opacity(.18); }
.acard .lv { position:absolute; left:0; right:0; top:34%; font-weight:700; font-size:15px; }
.acard.new::after { content:''; position:absolute; top:-5px; right:-5px; width:16px; height:16px; border-radius:50%; background:var(--pink); border:2px solid var(--ink); }
.sectitle { text-align:center; font-size:26px; font-weight:700; }
.backbtn { width:52px; height:52px; padding:0; border-radius:50%; min-height:0; }
.backbtn svg { width:26px; height:26px; }

/* ---------- room ---------- */
.room { position:relative; margin:4px 12px 0; flex:1; min-height:0; border:3px solid var(--ink); border-radius:22px; overflow:hidden; box-shadow:0 5px 0 var(--ink);
  background-size:cover; background-position:center; }
.room .it { position:absolute; transform:translate(-50%, -100%); pointer-events:none; }
.room .it.new { animation:drop .5s cubic-bezier(.3,1.5,.6,1); }
.room .rcat { position:absolute; transform:translate(-50%, -100%); width:17%; pointer-events:auto; animation:idle 3s ease-in-out infinite; transform-origin:50% 100%; }
@keyframes idle { 50% { transform:translate(-50%, -100%) scaleY(.97) scaleX(1.02); } }
@keyframes drop { from { transform:translate(-50%, -160%); opacity:0; } }
.shop { display:flex; gap:10px; overflow-x:auto; touch-action:pan-x; padding:12px 12px 4px; }
.sitem { flex:0 0 96px; flex-direction:column; gap:2px; padding:6px 4px; border-radius:18px; min-height:118px; font-size:16px; }
.sitem img.bi { width:62px; height:62px; }
.sitem .price { display:flex; align-items:center; gap:3px; font-size:16px; }
.sitem .price img { width:20px; height:20px; }
.sitem.owned { background:#E7F4E2; }
.sitem.poor .price { color:#c0707a; }

/* ---------- modals ---------- */
#modals { position:absolute; inset:0; pointer-events:none; z-index:50; }
#modals > * { pointer-events:auto; }
.dim { position:absolute; inset:0; background:#4b3328aa; animation:dimin .2s; }
.dim.out { animation:dimout .2s forwards; }
@keyframes dimin { from { opacity:0; } } @keyframes dimout { to { opacity:0; } }
.modal { position:absolute; left:50%; top:50%; width:min(88%, 400px); max-height:88%; overflow-y:auto; transform:translate(-50%, -50%);
  background:var(--card); border:3px solid var(--ink); border-radius:28px; box-shadow:0 6px 0 var(--ink); padding:18px 18px 18px; text-align:center;
  animation:mpop .28s cubic-bezier(.3,1.5,.6,1); }
.modal.out { animation:mout .2s forwards; }
@keyframes mpop { from { transform:translate(-50%, -50%) scale(.6); opacity:0; } }
@keyframes mout { to { transform:translate(-50%, -50%) scale(.85); opacity:0; } }
.mart { width:62%; max-height:220px; object-fit:contain; margin:-6px auto 2px; display:block; }
.mtitle { font-size:32px; font-weight:700; margin:2px 0 8px; }
.mbtns { display:flex; flex-direction:column; align-items:center; gap:10px; margin-top:12px; }
.mbtns .btn { min-width:220px; }
.mclose { position:absolute; top:6px; right:6px; width:52px; height:52px; display:grid; place-items:center; cursor:pointer; }
.mclose svg { width:24px; height:24px; }
.reward { display:flex; justify-content:center; align-items:center; gap:8px; font-size:34px; font-weight:700; }
.reward img { width:44px; height:44px; }
.stamp { position:absolute; top:58px; right:22px; width:86px; transform:rotate(14deg); animation:stamp .4s .5s both cubic-bezier(.3,1.6,.6,1); }
@keyframes stamp { from { transform:rotate(14deg) scale(2.4); opacity:0; } }
.sub { font-size:17px; font-weight:500; color:#8a6f60; margin:4px 0; }
.setrow { display:flex; align-items:center; justify-content:space-between; padding:6px 4px; font-size:20px; font-weight:600; min-height:52px; }
.setrow img { width:34px; height:34px; vertical-align:middle; margin-right:8px; }
.tog { width:62px; height:34px; border-radius:17px; background:#e6d8c8; border:2.5px solid var(--ink); position:relative; transition:background .2s; }
.tog::after { content:''; position:absolute; top:2px; left:2px; width:24px; height:24px; border-radius:50%; background:#fff; border:2px solid var(--ink); transition:left .2s; }
.tog.on { background:var(--green); } .tog.on::after { left:28px; }
.build { font-size:12px; color:#b09a8a; margin-top:8px; }
.giftrow { display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; }
.gday { border:2.5px solid var(--soft); border-radius:14px; padding:4px 2px; font-size:13px; font-weight:600; position:relative; }
.gday img { width:36px; height:36px; display:block; margin:0 auto; }
.gday.done { opacity:.45; } .gday.today { border-color:var(--ink); background:#FFF3C9; }
.ruledemo { display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; margin:6px 0; }
.ruledemo .rule { max-width:none; font-size:15px; }
.ruledemo .rule svg { height:44px; }

/* ---------- toast / fx / coach ---------- */
#toast { position:absolute; left:18px; right:18px; bottom:calc(var(--sab) + 108px); z-index:70; display:flex; align-items:center; gap:10px; padding:10px 12px;
  background:#fff; border:2.5px solid var(--ink); border-left-width:9px; border-radius:16px; box-shadow:0 4px 0 var(--ink); font-weight:600; font-size:18px;
  opacity:0; transform:translateY(12px); transition:opacity .2s, transform .2s; pointer-events:none; }
#toast.show { opacity:1; transform:none; }
#toast.info { border-left-color:#8DC3E8; } #toast.problem { border-left-color:#E8738A; } #toast.reward { border-left-color:var(--gold); }
#toast .ti { width:30px; height:30px; }
#fx { position:absolute; inset:0; pointer-events:none; z-index:60; overflow:hidden; }
.conf { position:absolute; top:-12px; width:10px; height:14px; border-radius:3px; border:1.5px solid #6b4a3a55; animation:fall 2s ease-in forwards; }
@keyframes fall { to { transform:translate(var(--dx), 110vh) rotate(var(--r)); } }
.flycoin { position:fixed; width:28px; height:28px; z-index:80; pointer-events:none; transition:transform .6s cubic-bezier(.5,0,.6,1), opacity .6s; }
#coach { position:absolute; inset:0; z-index:90; display:none; }
#coach.on { display:block; }
#coach .hole { position:absolute; border-radius:16px; box-shadow:0 0 0 2000px #3a261d99; border:3px solid #FFD873; animation:holepulse 1.2s infinite; }
@keyframes holepulse { 50% { border-color:#fff; } }
#coach.pass { pointer-events:none; } #coach.pass .cskip, #coach.pass .cbox { pointer-events:auto; }
#coach .cbox { position:absolute; left:16px; right:16px; display:flex; align-items:center; gap:10px; padding:10px 14px; background:#FFF8DC; border:2.5px solid var(--ink);
  border-left:9px solid var(--gold); border-radius:16px; box-shadow:0 4px 0 var(--ink); font-size:20px; font-weight:700; }
#coach .cbox::before { content:''; position:absolute; left:calc(var(--ax, 50%) - 16px - 10px); width:18px; height:18px; background:#FFF8DC; border:2.5px solid var(--ink); transform:rotate(45deg); display:none; }
#coach .cbox.up::before { display:block; top:-11px; border-right:none; border-bottom:none; }
#coach .cbox.down::before { display:block; bottom:-11px; border-left:none; border-top:none; }
#coach .cbox .ti { width:34px; height:34px; }
#coach .cbox span { flex:1; }
#coach .dots { display:flex; gap:4px; } #coach .dots i { width:8px; height:8px; border-radius:50%; background:#e3d2b8; } #coach .dots i.on { background:var(--ink); }
#coach .cskip { flex:0 0 44px; width:44px; height:44px; margin:-6px -8px -6px 0; border-radius:50%; display:grid; place-items:center; opacity:.7; }
#coach .cskip svg { width:18px; height:18px; }
#coach .hand { position:absolute; width:56px; height:64px; margin:-6px 0 0 -16px; pointer-events:none; }
#coach .hand.tap { animation:handtap 1.1s infinite; }
#coach .hand.drag { animation:handdrag 1.8s infinite; }
@keyframes handtap { 0%,100% { transform:translate(10px, 18px); } 45% { transform:translate(0, 0) scale(.9); } }
@keyframes handdrag { 0% { transform:translate(-70px, 0); } 70% { transform:translate(70px, 0); } 100% { transform:translate(70px, 0); opacity:0; } }

/* ---------- boot ---------- */
#boot { position:fixed; inset:0; z-index:100; display:flex; flex-direction:column; align-items:center; justify-content:center; background:var(--paper); transition:opacity .35s; }
#boot.off { opacity:0; pointer-events:none; }
#boot .t { font-size:40px; font-weight:700; margin-top:10px; }
#boot .bar { width:200px; height:12px; border-radius:7px; background:#efe3cf; border:2px solid var(--soft); margin-top:18px; overflow:hidden; }
#boot .bar i { display:block; height:100%; width:35%; background:var(--pink); animation:load 1.1s ease-in-out infinite; }
@keyframes load { from { transform:translateX(-100%); } to { transform:translateX(300%); } }

#gearSlot { display:flex; gap:8px; }
.btn.round.info { width:44px; height:44px; margin-top:6px; }
.btn.round.info .bl { font-size:24px; font-weight:700; font-style:italic; font-family:Georgia, 'Times New Roman', serif; line-height:1; }

.room .rcat.pose-sleep { width:20%; animation:breathe 3.6s ease-in-out infinite; }
.room .rcat.pose-play { width:21%; animation:bat 1.4s ease-in-out infinite; }
.room .rcat.pose-stretch { width:22%; }
@keyframes bat { 50% { transform:translate(-50%, -100%) rotate(-3deg); } }
@keyframes breathe { 50% { transform:translate(-50%, -100%) scale(1.03, .97); } }
.room { isolation:isolate; } /* cat z-order stays inside the room, under modals */
/* top bar fits 360 px phones with coins + "Level 60 BIG" + i + gear */
#scrGame .topbar { padding:0 8px; gap:6px; }
#scrGame .topbar .pill { padding:2px 10px; font-size:19px; min-width:0; }
#scrGame .topbar .pill img { width:26px; height:26px; }
#scrGame #gearSlot { gap:6px; flex:none; }
#scrGame #gearSlot .btn.round { width:48px; height:48px; }
#scrGame #gearSlot .btn.round.info { width:44px; height:44px; margin-top:2px; }
#scrGame #gearSlot .btn.round .bi { width:30px; height:30px; }

/* ---------- v1.2 life + celebration ---------- */
.cell .cat { animation:catin .32s cubic-bezier(.3,1.6,.6,1), breathe2 3.2s ease-in-out .4s infinite; }
.cell .cat.land { animation:land .42s cubic-bezier(.3,1.5,.5,1), breathe2 3.2s ease-in-out .5s infinite; }
@keyframes land { 0% { transform:translateY(-70%) scale(.8,1.15); } 55% { transform:translateY(0) scale(1.18,.82); } 80% { transform:scale(.94,1.06); } 100% { transform:none; } }
@keyframes breathe2 { 50% { transform:scale(1.025,.975); } }
.cell .cat.look { animation:look .7s ease-in-out, breathe2 3.2s ease-in-out .7s infinite; }
@keyframes look { 35%,65% { transform:rotate(var(--lx, 0deg)) translateY(-3%); } }
.cell .cat.huff { animation:huff .4s ease-in-out 2; }
@keyframes huff { 30% { transform:scale(1.06,.94) rotate(-3deg); } 70% { transform:scale(.97,1.03) rotate(3deg); } }
.cell.glow::before { content:''; position:absolute; inset:0; background:radial-gradient(circle, #fff9 0%, #fff0 70%); animation:rglow .7s ease-out forwards; pointer-events:none; }
@keyframes rglow { 0% { opacity:0; } 30% { opacity:1; } 100% { opacity:0; } }
.puff { position:absolute; inset:0; pointer-events:none; }
.puff i { position:absolute; left:50%; bottom:12%; width:22%; height:22%; border-radius:50%; background:#fff; border:1.5px solid #6b4a3a33; opacity:.9; animation:puff .6s ease-out forwards; }
.puff i:nth-child(1) { --dx:-140%; } .puff i:nth-child(2) { --dx:-70%; --dy:-40%; } .puff i:nth-child(3) { --dx:0%; --dy:-60%; } .puff i:nth-child(4) { --dx:70%; --dy:-40%; } .puff i:nth-child(5) { --dx:140%; }
@keyframes puff { from { transform:translate(-50%, 0) scale(.4); } to { transform:translate(calc(-50% + var(--dx, 0%)), var(--dy, -20%)) scale(1.1); opacity:0; } }
.cell.dance .cat { animation:hop .55s cubic-bezier(.3,1.6,.6,1) 2 alternate; }
@keyframes hop { from { transform:none; } to { transform:translateY(-16%) scale(1.06,.96); } }
#boardwrap { overflow:visible; }
#boardwrap.sweep .board { position:relative; }
#boardwrap.sweep .board::after { content:''; position:absolute; inset:-20% -60%; background:linear-gradient(105deg, #fff0 40%, #fffc 50%, #fff0 60%); animation:sweep .9s ease-in-out forwards; pointer-events:none; z-index:3; }
@keyframes sweep { from { transform:translateX(-60%); } to { transform:translateX(60%); } }
#peekCat { position:absolute; right:6%; bottom:-6px; width:30%; transform:translateY(40%); opacity:0; transition:transform .35s cubic-bezier(.3,1.5,.6,1), opacity .2s; pointer-events:none; z-index:4; }
#peekCat.on { transform:translateY(-62%); opacity:1; }
.conf.paw { width:22px; height:22px; background:none !important; border:none; }
.conf.paw svg { width:100%; height:100%; display:block; }
.runner { position:absolute; left:-30%; width:26%; animation:run 2.2s linear forwards; pointer-events:none; }
@keyframes run { 0% { transform:translateX(0) translateY(0); } 25% { transform:translateX(130%) translateY(-6%); } 50% { transform:translateX(260%) translateY(0); } 75% { transform:translateX(390%) translateY(-6%); } 100% { transform:translateX(560%) translateY(0); } }
@media (prefers-reduced-motion: reduce) { .cell .cat, .cell .cat.land, .cell .cat.look, .runner { animation:none !important; } }

.hintbox .helper { width:54px; height:54px; object-fit:contain; margin:-14px 0 -6px -4px; animation:helperpop .4s cubic-bezier(.3,1.6,.6,1); }
@keyframes helperpop { from { transform:translateY(40%) scale(.6); opacity:0; } }

.room .rcat { touch-action:none; cursor:grab; }
.room .rcat.held { cursor:grabbing; animation:none !important; filter:drop-shadow(0 10px 6px #6b4a3a55); transform:translate(-50%, -104%) scale(1.08) !important; }

/* Auto Complete sits in the free slot under the board (same slot as the hint box), never over the board */
#autoBtn { bottom:auto; top:calc(100% + 14px); }

.room .rcat.small { width:14%; } .room .rcat.small.pose-sleep { width:16%; } .room .rcat.small.pose-play, .room .rcat.small.pose-stretch { width:17%; }
.room .rcat.perch { width:13%; } .room .rcat.perch.pose-sleep { width:15%; }

/* curtain call */
.curtain { position:absolute; left:0; right:0; bottom:0; height:30%; pointer-events:none; }
.curtain .cc { position:absolute; bottom:-4%; transform:translateX(-50%); filter:drop-shadow(0 -2px 0 #6b4a3a33);
  animation:ccIn .5s cubic-bezier(.3,1.6,.6,1) var(--d1) backwards, ccWave .5s ease-in-out var(--d2), ccOut .45s ease-in 2.5s forwards; }
@keyframes ccIn { from { transform:translate(-50%, 110%); } }
@keyframes ccWave { 50% { transform:translate(-50%, -22%) rotate(-4deg); } }
@keyframes ccOut { to { transform:translate(-50%, 115%); } }
@media (prefers-reduced-motion: reduce) { .curtain .cc { animation:none; } }

.curtain { height:36%; background:radial-gradient(ellipse at 50% 100%, #FFF3D6 0%, #FFF3D6cc 40%, #FFF3D600 72%); animation:stageIn .3s ease-out, stageOut .4s ease-in 2.6s forwards; }
@keyframes stageIn { from { opacity:0; } } @keyframes stageOut { to { opacity:0; } }
.curtain .cc { bottom:-2%; }
.curtain .cc:nth-child(even) { bottom:5%; z-index:1; }
/* v1.3.0 Double Nap tag */
.lvtag.x2 { background:#E58A6B; }