/* gizma.css — Gizma "The Standby" skin. Loads ON TOP of iris-mascot.css; every
   rule scoped to .pup.gizma, variables on .gizma-box. Silhouette: low and round,
   short legs, wide chest, big head carried low — the opposite of Domino's height.
   Coat: caramel with a wide white blaze, white muzzle, bib and paws. Rose lens,
   and a hood over the top of it so she always reads half-asleep. */
.gizma-box{
  --c0:#efbe84; --c1:#dda05c; --c2:#c07c3c; --c3:#8f5624; --c4:#5e3616;
  --w0:#fdfaf3; --w1:#f2ece0; --w2:#ddd5c4; --w3:#bab1a0;
  --snout:#9a6f66; --snout2:#5e3f3a; --inear:#e8a89e; --paw:#f4ecdc;
  --rose:#e0568a; --rosehi:#ffc2d6; --edge:rgba(10,8,10,.5);
  /* rig accessory palette (declared on .pup-box upstream) — hers leans rose */
  --gold0:#ffd0e2; --gold1:#ffc2d6; --gold2:#e0568a; --gold3:#c33d72;
  --cream:#f6ecd6; --amber:#f0b24a; --pink:#f3a8b6;
  --red:#ff3b53; --brand:#c8102e; --green:#3fd08a;
  --panel2:#17171a; --panel3:#1d1d22; --border:#27272d; --hair:#1e1e23;
  --font:'Outfit',system-ui,sans-serif; --serif:'Newsreader',Georgia,serif; --mono:'JetBrains Mono',monospace;
  position:relative;
}

.pup.gizma .puddle{ left:50%; bottom:-4px; width:220px; height:44px;
  background:radial-gradient(closest-side, rgba(224,86,138,.24), transparent 76%); }

/* ── low tail, curled along the ground ── */
.pup.gizma .tail{ left:184px; top:214px; width:26px; height:84px; border-radius:14px 14px 16px 16px;
  background:linear-gradient(172deg,var(--c1) 0%,var(--c2) 56%,var(--c3) 100%);
  transform-origin:50% 90%; transform:rotate(34deg);
  box-shadow:0 0 0 1px var(--edge), -2px 4px 8px -4px #000; }
.pup.gizma .tail::after{ content:''; position:absolute; left:2px; bottom:0; width:22px; height:30px;
  border-radius:11px; background:linear-gradient(var(--w1),var(--w2)); }

/* ── wide low haunch ── */
.pup.gizma .hind{ left:46px; top:206px; width:104px; height:94px; border-radius:50% 50% 42% 42%/ 60% 60% 40% 40%;
  background:radial-gradient(72% 64% at 44% 20%, var(--c0), var(--c1) 52%, var(--c3) 100%);
  box-shadow:0 0 0 1px var(--edge), 0 12px 26px -16px #000; }

/* ── body: wide, low, round ── */
.pup.gizma .body{ left:82px; top:180px; width:126px; height:120px; border-radius:46% 46% 40% 40%/ 50% 50% 50% 50%;
  background:radial-gradient(74% 60% at 52% 12%, var(--c0), var(--c1) 46%, var(--c3) 100%);
  box-shadow:0 0 0 1px var(--edge), 0 14px 30px -16px #000; }
/* the white bib (base .blaze re-used) */
.pup.gizma .blaze{ left:110px; top:204px; width:70px; height:96px; border-radius:44% 44% 38% 38%/ 52% 52% 48% 48%;
  background:radial-gradient(64% 58% at 50% 16%, #fff 0%, var(--w0) 46%, var(--w2) 86%, rgba(221,213,196,0) 99%);
  opacity:.97; }

/* ── short front legs, white socks ── */
.pup.gizma .legf{ top:244px; width:30px; height:56px; border-radius:15px 15px 10px 10px;
  background:linear-gradient(var(--w0),var(--w2));
  box-shadow:0 0 0 1px var(--edge), inset 0 6px 8px -6px rgba(40,30,20,.45), 0 4px 9px -5px #000; }
.pup.gizma .legf.l{ left:104px; } .pup.gizma .legf.r{ left:148px; }
.pup.gizma .legf::after{ left:-7px; bottom:-3px; width:44px; height:32px;
  background:linear-gradient(#fffdf7,var(--paw));
  box-shadow:0 0 0 1px var(--edge), 0 4px 8px -4px #000, inset 6px -7px 0 -5px rgba(80,66,48,.16), inset -6px -7px 0 -5px rgba(80,66,48,.16); }

/* ── short thick neck ── */
.pup.gizma .neck{ left:106px; top:118px; width:70px; height:74px; border-radius:40% 40% 30% 30%/ 34% 34% 66% 66%;
  background:linear-gradient(168deg,var(--c0) 0%,var(--c2) 66%,var(--c3) 100%);
  box-shadow:0 0 0 1px var(--edge); }

/* ── big head, carried low ── */
.pup.gizma .head-grp{ transform-origin:140px 110px; }
.pup.gizma .head{ left:78px; top:22px; width:124px; height:108px; border-radius:48% 48% 44% 44%;
  background:radial-gradient(62% 58% at 50% 26%, var(--c0), var(--c1) 54%, var(--c2) 100%);
  box-shadow:0 0 0 1px var(--edge), 0 10px 26px -14px #000; }
/* white blaze up the face, clipped to the head so it can't break the silhouette */
.pup.gizma .stripe{ left:78px; top:22px; width:124px; height:108px; border-radius:48% 48% 44% 44%; overflow:hidden;
  background-image:
    radial-gradient(15% 26% at 72% 78%, #fffdf8 0 84%, rgba(255,253,248,0) 99%),
    radial-gradient(10% 20% at 74% 48%, var(--w0) 0 80%, rgba(253,250,243,0) 97%),
    radial-gradient(7% 13% at 75% 20%, var(--w1) 0 74%, rgba(242,236,224,0) 96%); }
.pup.gizma .hspots{ display:none; }

.pup.gizma .face{ left:106px; top:48px; width:68px; height:68px; }
/* the hood — a soft brow over the top of the lens. She always looks half asleep. */
.pup.gizma .hood{ left:102px; top:44px; width:76px; height:24px; border-radius:38px 38px 22px 22px;
  background:linear-gradient(180deg, var(--c1) 0%, var(--c2) 52%, rgba(192,124,60,0) 100%);
  opacity:.85; transition:height .4s cubic-bezier(.3,.7,.3,1), top .4s; }
.pup.gizma.m-alert .hood, .pup.gizma.m-cheer .hood, .pup.gizma.m-wow .hood, .pup.gizma.m-due .hood{ height:14px; top:40px; }
.pup.gizma.m-doze .hood, .pup.gizma.m-nap .hood, .pup.gizma.m-sleep .hood{ height:32px; top:46px; }
.pup.gizma .glint{ width:8px; height:8px;
  background:radial-gradient(circle at 38% 34%, #fff, var(--rosehi) 55%, rgba(255,194,214,0) 78%); }
.pup.gizma .glint.l{ left:114px; top:62px; } .pup.gizma .glint.r{ left:156px; top:72px; }
.pup.gizma .lid{ left:104px; top:92px; width:72px; height:18px; border-radius:0 0 36px 36px; background:#160f0c; }

/* ── white muzzle, speckled rose nose ── */
.pup.gizma .muzzle{ left:111px; top:116px; width:58px; height:48px; border-radius:44% 44% 48% 48%/ 26% 26% 74% 74%;
  background:radial-gradient(66% 76% at 50% 12%, #fffdf8 0%, var(--w0) 40%, var(--w2) 80%, rgba(221,213,196,0) 99%);
  box-shadow:0 8px 16px -12px #000; }
.pup.gizma .nose{ left:126px; top:136px; width:28px; height:20px; border-radius:50% 50% 50% 50%/ 56% 56% 46% 46%;
  background:radial-gradient(circle at 42% 28%, #b08880, var(--snout) 52%, var(--snout2) 92%);
  box-shadow:inset 0 -3px 5px -2px rgba(0,0,0,.45); }
.pup.gizma .maw{ display:none; left:118px; top:158px; width:46px; height:30px; border-radius:50% 50% 52% 52%/ 40% 40% 60% 60%;
  background:radial-gradient(60% 70% at 50% 24%, #6e2f3a 0%, #3a1620 70%); box-shadow:inset 0 3px 5px rgba(0,0,0,.5); }
.pup.gizma .tongue{ left:131px; top:156px; width:19px; height:22px; border-radius:8px 8px 11px 12px; }

/* ── rose ears: folded over, set wide and high so they break the head outline ── */
.pup.gizma .ear{ width:54px; height:60px;
  background:linear-gradient(150deg,var(--c1) 0%,var(--c3) 58%,var(--c4) 100%);
  border-radius:44% 44% 48% 48%/ 24% 24% 76% 76%;
  box-shadow:-2px 6px 12px -7px #000, 0 0 0 1px rgba(255,255,255,.04) inset;
  transform-origin:50% 8%; transition:transform .5s cubic-bezier(.3,.7,.3,1); }
.pup.gizma .ear::after{ content:''; position:absolute; left:50%; top:16px; transform:translateX(-50%);
  width:22px; height:30px; border-radius:50% 50% 46% 46%/ 30% 30% 70% 70%;
  background:linear-gradient(var(--inear),#b0706a); opacity:.5; }
.pup.gizma .ear.l{ left:52px; top:32px; transform:rotate(-38deg); }
.pup.gizma .ear.r{ left:174px; top:32px; transform:rotate(38deg) scaleX(-1); }
.pup.gizma.e-perk .ear.l{ transform:rotate(-18deg) scaleY(1.08); }
.pup.gizma.e-perk .ear.r{ transform:rotate(18deg) scaleY(1.08) scaleX(-1); }
.pup.gizma.e-rest .ear.l{ transform:rotate(-38deg); }
.pup.gizma.e-rest .ear.r{ transform:rotate(38deg) scaleX(-1); }
.pup.gizma.e-one  .ear.l{ transform:rotate(-16deg); }
.pup.gizma.e-one  .ear.r{ transform:rotate(42deg) scaleX(-1); }
.pup.gizma.e-back .ear.l{ transform:rotate(-54deg) translate(-4px,4px); }
.pup.gizma.e-back .ear.r{ transform:rotate(54deg) scaleX(-1) translate(-4px,4px); }

/* ── her moves: a long doze, a curl, a snap-awake, a lean against you ── */
.pup.gizma.an-doze{ animation:gzDoze 7s ease-in-out infinite; }
.pup.gizma.an-doze .head-grp{ animation:gzDozeHead 7s ease-in-out infinite; }
.pup.gizma.an-curl{ animation:gzCurl 8s ease-in-out infinite; }
.pup.gizma.an-curl .head-grp{ animation:gzCurlHead 8s ease-in-out infinite; }
.pup.gizma.an-perkup .head-grp{ animation:gzPerk 2.4s cubic-bezier(.3,.7,.3,1) infinite; }
.pup.gizma.an-lean{ animation:gzLean 4s ease-in-out infinite; }
@keyframes gzDoze{ 0%,100%{ transform:translate(-50%,-50%) scale(var(--s)); }
  50%{ transform:translate(-50%,-49.4%) scale(calc(var(--s)*1.012)); } }
@keyframes gzDozeHead{ 0%,100%{ transform:rotate(var(--tilt,0deg)) translateY(0); }
  46%{ transform:rotate(calc(var(--tilt,0deg) + 3deg)) translateY(4px); } }
@keyframes gzCurl{ 0%,100%{ transform:translate(-50%,-48.5%) scale(calc(var(--s)*1.01)); }
  50%{ transform:translate(-50%,-47.6%) scale(calc(var(--s)*1.025)); } }
@keyframes gzCurlHead{ 0%,100%{ transform:rotate(calc(var(--tilt,0deg) + 8deg)) translateY(10px); }
  50%{ transform:rotate(calc(var(--tilt,0deg) + 9deg)) translateY(13px); } }
@keyframes gzPerk{ 0%,54%,100%{ transform:rotate(var(--tilt,0deg)) translateY(2px); }
  64%{ transform:rotate(calc(var(--tilt,0deg) - 4deg)) translateY(-5px); }
  80%{ transform:rotate(var(--tilt,0deg)) translateY(0); } }
@keyframes gzLean{ 0%,100%{ transform:translate(-50%,-50%) scale(var(--s)) rotate(0deg); }
  50%{ transform:translate(-54%,-50%) scale(var(--s)) rotate(-4deg); } }
