/* Card + games. Colors come from --c-* variables set per card by core.js. */
.lc-card{
  --c-bg:#1b0d24;--c-bg2:#2f1a3b;--c-ink:#fbeaf5;--c-muted:#c9a9c0;
  --c-accent:#ff4fa3;--c-deep:#d6246f;--c-pop:#c9f31d;--c-paper:#fff7ef;--c-paper-ink:#2a1a30;
  --f-display:'Yellowtail','Brush Script MT',cursive;
  --f-body:'DM Sans',ui-rounded,'Segoe UI',system-ui,sans-serif;
  --f-hand:'Caveat','Segoe Script','Bradley Hand',cursive;
  position:relative;overflow:hidden;width:100%;max-width:520px;margin:0 auto;
  background:var(--c-bg);color:var(--c-ink);font:500 16px/1.5 var(--f-body);
  border-radius:32px;padding:24px 18px 18px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;
}
.lc-card *{box-sizing:border-box}
.lc-card button{font:inherit}
.lc-stamp-row{display:flex;align-items:center;gap:16px;max-width:100%}
.lc-ball{width:44px;height:44px;border-radius:50%;background:var(--c-pop);position:relative;flex:none;overflow:hidden}
.lc-ball::before,.lc-ball::after{content:"";position:absolute;top:-10%;width:60%;height:120%;border:3px solid #fff;border-radius:50%}
.lc-ball::before{left:-36%}.lc-ball::after{right:-36%}
.lc-stamp{font-weight:700;letter-spacing:.26em;text-transform:uppercase;font-size:13px;padding:8px 14px;border:3px solid var(--c-accent);outline:3px solid var(--c-pop);outline-offset:3px;margin:3px;overflow-wrap:anywhere;min-width:0}
.lc-headline{margin:2px 0 0;font:400 clamp(38px,10.5vw,56px)/1.08 var(--f-display);color:var(--c-accent);text-wrap:balance;overflow-wrap:anywhere;max-width:100%}
.lc-sub{margin:0;color:var(--c-muted);font-size:17px;max-width:30em;text-wrap:balance}
.lc-play{width:100%;border:6px solid var(--c-accent);border-radius:28px;overflow:hidden;position:relative;background:var(--c-bg2)}
.lc-play svg{display:block;width:100%;height:auto}
.lc-foot{width:100%;display:flex;flex-direction:column;gap:10px}
.lc-skip{background:none;border:0;color:var(--c-muted);text-decoration:underline;cursor:pointer;padding:8px;font-size:15px}
.lc-replay{background:var(--c-bg2);color:var(--c-ink);border:3px solid var(--c-accent);border-radius:999px;padding:10px 22px;font-weight:700;cursor:pointer}
.lc-status{margin:0;font-weight:700;font-size:18px;line-height:1.35;min-height:4em;text-wrap:balance}
.lc-card :focus-visible{outline:3px solid var(--c-pop);outline-offset:2px}

/* Power meter + action button (golf, tennis and other timing games) */
.lc-labels{display:flex;justify-content:space-between}
.lc-pill{font-size:13px;letter-spacing:.16em;font-weight:700;padding:6px 14px;border:3px solid var(--c-accent);border-radius:999px;background:var(--c-bg)}
.lc-meter{position:relative;height:44px;border:4px solid var(--c-accent);border-radius:999px;background:var(--c-bg2);overflow:hidden}
.lc-meter::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 30%,color-mix(in srgb,var(--c-accent) 45%,transparent))}
.lc-mark{position:absolute;top:3px;bottom:3px;width:16px;left:calc((100% - 16px) * var(--p,0));border-radius:999px;background:var(--c-deep);border:2px solid #fff}
.lc-mark.locked{background:var(--c-pop)}
.lc-go{width:100%;border:0;border-radius:999px;padding:15px;background:var(--c-deep);color:#fff;font-weight:800;font-size:26px;letter-spacing:.04em;box-shadow:0 6px 0 rgba(0,0,0,.35);cursor:pointer;touch-action:manipulation}
.lc-go:active:not(:disabled){transform:translateY(3px);box-shadow:0 3px 0 rgba(0,0,0,.35)}
.lc-go:disabled{opacity:.6;cursor:default}
.lc-pin{position:absolute;top:12px;left:14px;background:#fff;color:#2a0f36;font-weight:700;font-size:14px;padding:4px 12px;border-radius:999px}

/* Letter */
.lc-letterbox{width:100%;display:flex;flex-direction:column;align-items:center;gap:14px}
.lc-letter{background:var(--c-paper);color:var(--c-paper-ink);border-radius:18px;padding:22px 22px 24px;text-align:left;font:500 26px/1.35 var(--f-hand);width:100%;box-shadow:0 8px 0 -2px rgba(0,0,0,.18)}
.lc-letterbox .lc-letter{transform:rotate(-1deg);animation:lc-slide .6s cubic-bezier(.2,.8,.2,1)}
@keyframes lc-slide{from{transform:translateY(34px) rotate(-3deg);opacity:0}}
.lc-l-to{margin:0 0 8px;font-size:30px;font-weight:700;overflow-wrap:anywhere}
.lc-l-msg{margin:0 0 14px;white-space:pre-wrap;overflow-wrap:anywhere}
.lc-l-from{margin:0;font-size:30px;font-weight:700;text-align:right;overflow-wrap:anywhere}

/* Scratch-off */
.lc-scratch{position:relative;background:var(--c-paper)}
.lc-scratch .lc-letter{border-radius:0;box-shadow:none;min-height:240px;background:transparent}
.lc-scratch canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair;transition:opacity .7s}
.lc-scratch canvas.gone{opacity:0;pointer-events:none}

/* Balloons */
.lc-sky{background:linear-gradient(#9fd8ff,#e4f4ff);padding:28px 10px 8px;min-height:250px}
.lc-balloons{display:flex;flex-wrap:wrap;justify-content:space-around;align-items:flex-start;gap:6px}
.lc-balloon{position:relative;width:62px;height:76px;border:0;padding:0;margin-bottom:64px;border-radius:50% 50% 50% 50%/58% 58% 42% 42%;background:var(--bc);cursor:pointer;animation:lc-bob 3s ease-in-out infinite}
.lc-balloon::before{content:"";position:absolute;top:14%;left:18%;width:14px;height:22px;border-radius:50%;background:rgba(255,255,255,.55);transform:rotate(20deg)}
.lc-balloon::after{content:"";position:absolute;left:50%;top:100%;width:2px;height:52px;background:rgba(40,20,60,.45);transform:translateX(-50%)}
.lc-balloon:nth-child(1){--bc:var(--c-accent)}.lc-balloon:nth-child(2){--bc:var(--c-pop)}.lc-balloon:nth-child(3){--bc:#ff9b54}.lc-balloon:nth-child(4){--bc:#b79cff}.lc-balloon:nth-child(5){--bc:#ffffff}
.lc-balloon:nth-child(even){animation-delay:-1.4s;margin-top:24px}
@keyframes lc-bob{50%{transform:translateY(-10px)}}
.lc-balloon.popped{animation:lc-pop .25s forwards;pointer-events:none}
@keyframes lc-pop{to{transform:scale(1.6);opacity:0}}

/* Envelope */
.lc-env-wrap{background:linear-gradient(var(--c-bg2),var(--c-bg));padding:56px 16px 30px;display:flex;justify-content:center}
.lc-env{position:relative;width:min(100%,340px);aspect-ratio:3/2;perspective:900px}
.lc-env>*{position:absolute}
.lc-env-back{inset:0;background:var(--c-deep);border-radius:10px;z-index:1}
.lc-env-paper{left:8%;right:8%;top:10%;bottom:10%;border-radius:6px;z-index:2;transition:transform .6s cubic-bezier(.3,.8,.3,1);background:repeating-linear-gradient(transparent 0 15px,color-mix(in srgb,var(--c-paper-ink) 14%,transparent) 15px 16px),var(--c-paper)}
.lc-env-front{inset:0;background:var(--c-accent);clip-path:polygon(0 0,50% 54%,100% 0,100% 100%,0 100%);border-radius:10px;z-index:3}
.lc-env-flap{left:0;right:0;top:0;height:56%;background:color-mix(in srgb,var(--c-accent) 78%,#000);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;transition:transform .6s;z-index:4}
.lc-env.open .lc-env-flap{transform:rotateX(180deg);z-index:1}
.lc-env.rise .lc-env-paper{transform:translateY(-42%)}
.lc-seal{left:50%;top:54%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;border:0;background:var(--c-pop);color:#2a0f36;font-weight:800;font-size:11px;letter-spacing:.12em;z-index:5;cursor:pointer;box-shadow:0 3px 0 rgba(0,0,0,.3);animation:lc-pulse 1.6s ease-in-out infinite}
@keyframes lc-pulse{50%{box-shadow:0 3px 0 rgba(0,0,0,.3),0 0 0 8px color-mix(in srgb,var(--c-pop) 35%,transparent)}}
.lc-env.open .lc-seal{opacity:0;pointer-events:none;transition:opacity .2s;animation:none}

/* Golf pieces */
#lc-club{transform-box:view-box;transform-origin:72px 160px}
#lc-club.swing{animation:lc-swing .45s ease-in-out}
@keyframes lc-swing{0%{transform:rotate(0)}35%{transform:rotate(-42deg)}60%{transform:rotate(34deg)}100%{transform:rotate(0)}}
#lc-golfer{transition:transform .9s ease-in-out}
.lc-flag path{fill:var(--c-accent)}
.lc-flag.wave path{animation:lc-wave .5s ease-in-out 3}
@keyframes lc-wave{50%{transform:translateX(3px) skewY(6deg)}}

/* Confetti */
.lc-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:20}
.lc-confetti i{position:absolute;width:8px;height:12px;border-radius:2px;animation:lc-burst 1.4s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes lc-burst{0%{transform:translate(0,0) rotate(0);opacity:1}70%{opacity:1}100%{transform:translate(var(--x),calc(var(--y) + 280px)) rotate(var(--r));opacity:0}}

@media(prefers-reduced-motion:reduce){.lc-balloon,.lc-seal{animation:none}.lc-letterbox .lc-letter{animation:none}.lc-confetti{display:none}#lc-golfer,.lc-env-paper,.lc-env-flap{transition:none}}