.htpd{--g: var(--plate-green, #143e3b);--r: var(--plate-red, #8e3421);margin:0 0 2.5rem;border-top:1px solid var(--cards-line);border-bottom:1px solid var(--cards-line);padding:1.25rem 0 1rem}.htpd-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,1fr);grid-template-areas:"kid table dad";align-items:end;gap:1rem}.htpd-player.is-kid{grid-area:kid}.htpd-player.is-dad{grid-area:dad}.htpd-table{grid-area:table}.htpd-person{position:relative;aspect-ratio:1}.htpd-person img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .35s ease,transform .35s ease;transform:translateY(4px);-webkit-mask-image:radial-gradient(closest-side,#000 82%,transparent);mask-image:radial-gradient(closest-side,#000 82%,transparent)}.htpd-person img.is-on{opacity:1;transform:none}.htpd-bubble{position:absolute;top:4%;padding:.35rem .7rem;border-radius:999px;background:#fffaf0;border:1.5px solid var(--g);color:var(--g);font:italic 600 .95rem var(--card-display-font);white-space:nowrap;animation:htpd-pop .4s ease both}.is-kid .htpd-bubble{right:2%}.is-dad .htpd-bubble{left:2%}.htpd-bubble:after{content:"";position:absolute;bottom:-7px;width:10px;height:10px;border-radius:50%;background:#fffaf0;border:1.5px solid var(--g)}.is-kid .htpd-bubble:after{left:14%}.is-dad .htpd-bubble:after{right:14%}.htpd-name{display:flex;flex-direction:column;align-items:center;gap:.3rem;margin-top:.25rem}.htpd-name strong{font:600 1rem var(--card-display-font);color:var(--g)}.htpd-pebbles{display:flex;gap:5px}.htpd-pebbles i{width:13px;height:11px;border-radius:50% 45% 50% 40%;border:1.5px solid rgba(20,62,59,.35);background:transparent;transition:background .3s,border-color .3s}.htpd-pebbles i.is-on{background:var(--r);border-color:var(--r);animation:htpd-pop .45s ease both}.htpd-table{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;padding-bottom:2.4rem}.htpd-card{display:flex;flex-direction:column;gap:.5rem;transition:transform .4s ease,opacity .4s ease}.htpd-card.is-won{transform:translateY(-8px) scale(1.04)}.htpd-card.is-lost{opacity:.55;transform:scale(.96)}.htpd-deck{position:relative}.htpd-extra{position:absolute;inset:0;border-radius:7.237%/5.124%;background:#eee4ce;border:3px solid var(--g);outline:1px solid var(--g);outline-offset:-8px;box-shadow:0 4px 12px #1c161124;opacity:0;transition:transform .5s ease,opacity .35s ease}.htpd-deck.is-more .htpd-extra{opacity:1}.htpd-deck.is-more .htpd-extra:nth-child(1){transform:rotate(-9deg) translate(-10%)}.htpd-deck.is-more .htpd-extra:nth-child(2){transform:rotate(-4.5deg) translate(-5%)}.htpd-flip{position:relative;aspect-ratio:360 / 508;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.3,.7,.3,1);transform:rotateY(180deg)}.htpd-flip.is-open{transform:none}.htpd-face{position:absolute;inset:0;width:100%;height:100%;backface-visibility:hidden;border-radius:7.237%/5.124%;box-shadow:0 6px 18px #1c16112e}.htpd-back{display:grid;place-items:center;transform:rotateY(180deg);background:#eee4ce;border:3px solid var(--g);outline:1px solid var(--g);outline-offset:-8px}.htpd-back span{font:700 clamp(.8rem,2vw,1.1rem) var(--card-display-font);letter-spacing:.12em;color:var(--g)}.htpd-front{object-fit:cover}.htpd-stats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--cards-line);border-radius:8px;overflow:hidden;background:#fbf7ee}.htpd-stats li{display:flex;flex-direction:column;align-items:center;padding:.3rem 0;transition:background .3s,color .3s}.htpd-stats span{font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--rock)}.htpd-stats b{font:700 1.1rem var(--card-display-font);color:var(--r)}.htpd-stats li.is-pick{background:var(--g)}.htpd-stats li.is-pick span,.htpd-stats li.is-pick b{color:#fffaf0}.htpd-caption{text-align:center;min-height:4.4rem;margin-top:.75rem}.htpd-cap-main{margin:0;font:600 clamp(1.3rem,3vw,1.75rem) var(--card-display-font);color:var(--g);animation:htpd-in .35s ease both}.htpd-cap-sub{margin:.2rem 0 0;font-size:1rem;color:var(--rock)}.htpd-controls{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:.5rem}.htpd-controls button{min-width:44px;min-height:40px;padding:0 .8rem;border-radius:999px;cursor:pointer;border:1px solid var(--cards-line);background:transparent;color:var(--g);font:600 1rem var(--card-display-font)}.htpd-controls button:focus-visible{outline:2px solid var(--r);outline-offset:2px}.htpd-play{min-width:88px!important}.htpd-progress{width:90px;height:3px;background:var(--cards-line);border-radius:2px;overflow:hidden;margin-left:.4rem}.htpd-progress i{display:block;height:100%;background:var(--r);transition:width .3s ease}@keyframes htpd-pop{0%{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}@keyframes htpd-in{0%{transform:translateY(6px);opacity:0}to{transform:none;opacity:1}}@media(max-width:640px){.htpd-stage{grid-template-columns:1fr 1fr;grid-template-areas:"kid dad" "table table";gap:.5rem .75rem}.htpd-table{padding:.9rem 6% 0}.htpd-bubble{font-size:.8rem}}@media(prefers-reduced-motion:reduce){.htpd *,.htpd *:before,.htpd *:after{transition:none!important;animation:none!important}}
