/* RAÍZZ theme layer: colors from Raíz the root mascot, calmer stickers, mascot UI */
:root{
  --cream:#FBF8F3; --ink:#4A3320; --white:#FFFFFF;
  --pink:#C8693B; --purple:#6D7626; --yellow:#E9CA98; --teal:#6D7626; --lime:#C9D27A; --orange:#D9883F; --lilac:#E4D8C2;
  --rz-leaf:#6D7626; --rz-leaf-dk:#535B1B; --rz-body:#E9CA98; --rz-line:#E6D8C0;
}
html,body{background:var(--cream)}
.bgplant{background:var(--cream)}
.hud-top{background:linear-gradient(var(--cream) 60%,rgba(251,248,243,0))}

/* softer, office-clean stickers */
.st{border:2px solid var(--rz-line);box-shadow:0 3px 0 var(--rz-line);border-radius:20px}
.st.sm{box-shadow:0 2px 0 var(--rz-line)}
.chip{border:1.5px solid var(--rz-line)}
.chip.dark{background:var(--rz-leaf);color:var(--cream);border-color:var(--rz-leaf)}
.btn{border-width:2px;border-color:var(--ink);box-shadow:0 3px 0 var(--ink)}
input,select,textarea{border:2px solid var(--rz-line)}
input:focus,select:focus,textarea:focus,.btn:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid var(--rz-leaf)}
.nav{border:2px solid var(--rz-line);box-shadow:0 6px 18px rgba(74,51,32,.12)}
.nav a[aria-current="page"]{background:var(--rz-body)}
.nav .mic{border:0;box-shadow:0 6px 14px rgba(109,118,38,.4);background:var(--rz-leaf)}
.nav .mic .icon{color:var(--cream);stroke:var(--cream)}
.toast{background:var(--rz-leaf);color:var(--cream)}

/* logo */
.rz-logo{display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.rz-logo-img{width:46px;height:46px;object-fit:contain;transform:rotate(-4deg)}
.rz-wm{font:700 28px/1 "Varela Round",system-ui,sans-serif;color:var(--rz-leaf);letter-spacing:.02em}

/* report-death + wipe buttons (no more execution) */
.execute{min-height:auto;padding:30px 0 40px}
.rz-dead{display:flex;align-items:center;gap:12px;margin:0 auto;background:var(--white);border:2px solid var(--rz-line);border-radius:20px;padding:8px 18px 8px 10px;cursor:pointer;font:inherit;color:var(--ink)}
.rz-dead img{width:64px;height:64px;object-fit:contain}
.rz-dead .exec-label{background:none;border:0;color:var(--ink);font:18px/1.2 var(--display);padding:0}
.rz-dead.armed{border-color:#B4472E}
.rz-dead.armed .exec-label{color:#B4472E;background:none}
.rz-close{margin:0 auto;background:none;border:0;cursor:pointer;color:#8A7258;font:14px var(--body);text-decoration:underline}
.rz-close .exec-label{background:none;border:0;color:inherit;font:inherit;padding:0}
.rz-close.armed{color:#B4472E}

/* mascots */
.rz-hero{display:flex;align-items:center;gap:10px;background:var(--rz-body);border-radius:24px;padding:14px 14px 14px 6px;position:relative;overflow:hidden}
.rz-hero .rz-say{flex:1;font:20px/1.25 var(--display)}
.rz-hero .rz-say small{display:block;font:14px/1.4 var(--body);opacity:.85;margin-bottom:2px}
.rz-hero img{width:112px;height:112px;object-fit:contain;flex:none}
.rz-mini{display:flex;align-items:center;gap:10px}
.rz-mini img{width:64px;height:64px;object-fit:contain;flex:none}
.rz-side{float:left;width:96px;height:96px;object-fit:contain;margin:-6px -4px 0 6px}

@keyframes rzBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes rzRock{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
@keyframes rzBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.04,.97)}}
@keyframes rzJump{0%,100%{transform:translateY(0) scale(1)}12%{transform:translateY(6px) scale(1.08,.9)}35%{transform:translateY(-44px) scale(.95,1.06)}55%{transform:translateY(0) scale(1.06,.94)}65%{transform:none}}
@keyframes rzWobble{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(-3px) rotate(-2deg)}75%{transform:translateX(3px) rotate(2deg)}}
.rz-a-bob{animation:rzBob 2.6s ease-in-out infinite}
.rz-a-rock{animation:rzRock 1.6s ease-in-out infinite;transform-origin:50% 95%}
.rz-a-breath{animation:rzBreath 3.2s ease-in-out infinite;transform-origin:50% 100%}
.rz-a-jump{animation:rzJump 2.4s ease-in-out infinite;transform-origin:50% 100%}
.rz-a-wobble{animation:rzWobble .9s ease-in-out infinite}

/* pop-up mascot that replaces the plain toast */
.rz-pop{position:fixed;z-index:45;left:12px;bottom:calc(122px + env(safe-area-inset-bottom,0px));display:flex;align-items:flex-end;gap:6px;pointer-events:none;transform:translateY(140%);transition:transform .45s cubic-bezier(.2,1.3,.4,1)}
.rz-pop.on{transform:translateY(0)}
.rz-pop img{width:92px;height:92px;object-fit:contain}
.rz-pop .rz-bub{background:var(--white);border:2px solid var(--rz-line);border-radius:18px 18px 18px 4px;padding:9px 13px;max-width:62vw;font-size:15px;box-shadow:0 6px 16px rgba(74,51,32,.14);margin-bottom:36px}

/* confetti */
.rz-cf-layer{position:fixed;inset:0;z-index:60;pointer-events:none;overflow:hidden}
.rz-cf{position:absolute;animation:rzCf 2.6s cubic-bezier(.2,.7,.4,1) forwards}
@keyframes rzCf{0%{transform:translate(0,0) rotate(0);opacity:1}45%{transform:translate(var(--x),var(--y)) rotate(calc(var(--r)*.6));opacity:1}100%{transform:translate(calc(var(--x)*1.25),calc(var(--y)*-1 + 160px)) rotate(var(--r));opacity:0}}
.rz-celebrate{position:fixed;z-index:61;left:50%;top:42%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}
.rz-celebrate img{width:min(56vw,260px);height:auto}
.rz-celebrate b{display:block;font:26px/1.2 var(--display);color:var(--rz-leaf);background:rgba(251,248,243,.92);border-radius:14px;padding:6px 14px;margin-top:6px}

/* hidden Raíz: peeks out, tap to reveal */
.rz-peek{position:absolute;width:54px;height:54px;object-fit:contain;cursor:pointer;transition:transform .3s;transform:translateY(38%) rotate(-8deg);filter:drop-shadow(0 2px 2px rgba(0,0,0,.12));border:0;background:none;padding:0}
.rz-peek:hover,.rz-peek:focus-visible{transform:translateY(0) rotate(0)}
.rz-host{position:relative;overflow:hidden}
@media (prefers-reduced-motion:reduce){.rz-a-bob,.rz-a-rock,.rz-a-breath,.rz-a-jump,.rz-a-wobble{animation:none}.rz-cf{display:none}}
.regb{background:#C8693B;border:2px solid var(--cream)}
.regnote{background:#F6E3D3;color:#7A3A1C;border:1.5px solid #E8C2A6}
