.encounter-buttons{display:flex;flex-wrap:wrap;gap:15px;margin-top:28px}.zombie-art{position:relative;width:100%;height:100%}.zombie-art img{position:absolute;object-fit:contain;width:100%;height:auto;filter:none}.crate-sprite{bottom:-10%;animation:crate-arrive 1s both;transform-origin:50% 85%}.weapon-sprite{left:12%;top:-30%;max-width:78%;z-index:2;animation:weapon-emerge 2.1s .35s both}.energy-column{position:absolute;inset:-25% 10% 5%;background:linear-gradient(0deg,#75ff7155,transparent);clip-path:polygon(32% 100%,0 0,100% 0,68% 100%);animation:box-beam 1.2s .5s both}.effect-zombies .scene-art{width:min(440px,83vw);top:47%;height:300px}.still .weapon-sprite{transform:none!important;opacity:1!important}.still .crate-sprite{transform:none!important}
.sky-ray{position:fixed;left:15%;top:30%;z-index:23;width:clamp(120px,19vw,220px);padding:0;background:transparent;filter:drop-shadow(0 4px 5px #0005);color:#fff;border:0;cursor:pointer}.sky-ray img{display:block;width:100%;height:auto;filter:none!important}.sky-ray span{font:12px system-ui,sans-serif;background:#123e32;padding:5px 8px;border:1px solid #79e98e;border-radius:4px;white-space:nowrap}.sky-ray.evolving{left:50%;top:40%;transform:translate(-50%,-50%);width:clamp(200px,33vw,340px);pointer-events:none}.sky-ray.evolving img{animation:mega-charge 1.8s ease both}.sky-ray.evolving:before{content:'';position:absolute;inset:-15%;border:3px solid #e8cc4c;border-radius:50%;box-shadow:0 0 30px #59edbd;animation:mega-ring 2s both;pointer-events:none}.sky-ray.mega img{animation:mega-arrive .6s both}.sky-ray.departing-ray{animation:ray-depart 1.5s ease-in both}.dice-effect{position:fixed;left:50%;top:42%;transform:translate(-50%,-50%);z-index:24;pointer-events:none;text-align:center;color:var(--accent);filter:drop-shadow(0 0 12px var(--bg))}.d20{position:relative;width:190px;height:200px;animation:dice-roll 1.4s ease-out both}.d20 svg{width:100%;height:100%;fill:var(--surface);stroke:var(--accent);stroke-width:2}.d20 strong{position:absolute;inset:0;display:grid;place-items:center;font:700 42px Georgia;color:var(--accent)}.dice-effect p{padding:10px 15px;background:var(--bg);border:1px solid var(--accent);font:16px Georgia;letter-spacing:.1em;animation:caption-reveal .4s 1.3s both}.dice-effect.still *{animation:none!important}
@keyframes crate-arrive{from{opacity:0;transform:translateY(50px) scaleY(.4)}to{opacity:1;transform:none}}@keyframes weapon-emerge{0%{opacity:0;transform:translateY(150px) scale(.2) rotate(-15deg)}35%{opacity:1}100%{opacity:1;transform:translateY(-18px) rotate(-5deg)}}@keyframes dice-roll{from{transform:translateY(-150px) rotate(-620deg) scale(.3)}70%{transform:rotate(12deg)}to{transform:none}}@keyframes mega-charge{50%{transform:scale(.7);opacity:.5}to{transform:scale(1);opacity:1}}@keyframes mega-ring{0%{transform:scale(.3);opacity:0}40%{opacity:.8}100%{transform:scale(1.5);opacity:0}}@keyframes mega-arrive{from{transform:scale(.7)}to{transform:scale(1)}}@keyframes ray-depart{to{transform:translate(100vw,-60vh) rotate(-25deg);opacity:0}}
@media(prefers-reduced-motion:reduce){.sky-ray,.sky-ray *,.dice-effect *{animation:none!important}.sky-ray.departing-ray{opacity:0}}
.work-die{flex:0 0 165px;align-self:center;text-align:center;padding:0;color:var(--accent);background:transparent;cursor:pointer;transition:transform .2s}.work-die:hover{transform:translateY(-4px)}.work-die canvas{display:block;width:160px;height:160px;margin:auto}.work-die>span{display:block;font:11px ui-monospace,monospace;letter-spacing:.13em}.work-die small{display:block;min-height:35px;font:12px var(--font);color:var(--muted);margin-top:6px}.more-work{position:relative;overflow:hidden}.drawn-ray.sky-ray{position:absolute;z-index:4;width:clamp(210px,32vw,410px);filter:drop-shadow(0 5px 5px #0003);will-change:transform;left:0;top:0}.drawn-ray canvas{display:block;width:100%;height:auto;pointer-events:none}.drawn-ray span{font-size:11px}.drawn-ray.evolving{width:clamp(210px,32vw,410px);left:0;top:0;pointer-events:none}.drawn-ray.evolving:before{inset:10% 20%;border-width:2px;box-shadow:0 0 20px #59edbd}.drawn-ray.departing-ray{animation:none}.drawn-ray:focus-visible{outline:2px solid #31bb80;outline-offset:5px;border-radius:30px}.drawn-ray:disabled{opacity:1}
@media(max-width:900px){#projects>.section-heading{flex-wrap:wrap;align-items:center}.work-die{order:3;margin:auto}.work-die canvas{width:145px;height:145px}}
@media(max-width:700px){#projects>.section-heading{display:grid;grid-template-columns:1fr 125px;gap:12px}#projects>.section-heading>div{grid-column:1/-1}#projects>.section-heading>p{grid-column:1;grid-row:2}.work-die{grid-column:2;grid-row:2;min-width:0;width:125px}.work-die canvas{width:125px;height:125px}.work-die>span{font-size:9px}.work-die small{font-size:11px}.drawn-ray.sky-ray{width:240px}.drawn-ray.evolving{width:240px}}
.work-die .dice-result{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap}.work-die{flex-basis:150px}.work-die canvas{width:150px;height:150px}.drawn-ray.sky-ray,.drawn-ray.evolving{width:clamp(160px,21vw,245px)}.drawn-ray .ray-art{width:100%;aspect-ratio:1;object-fit:contain;transform-origin:50% 55%;will-change:transform}.drawn-ray span{position:absolute;left:50%;bottom:-12px;transform:translateX(-50%);opacity:0;transition:opacity .2s}.drawn-ray:hover span,.drawn-ray:focus-visible span,.drawn-ray.evolving span{opacity:1}.drawn-ray.evolving .ray-art{animation:none;filter:none}.drawn-ray.mega .ray-art{animation:none}.drawn-ray.evolving:before{inset:5%}
@media(max-width:700px){.work-die canvas{width:125px;height:125px}.drawn-ray.sky-ray,.drawn-ray.evolving{width:170px}}
