/* A translucent charcoal scroll, with opaque nameplates and controls. */
.pg-app{position:relative;z-index:3;width:min(94vw,1740px);margin:26px auto 60px;color:#e8edf5;font-family:Inter,Arial,sans-serif}.pg-app *{box-sizing:border-box}.pg-app [hidden]{display:none!important}.pg-scroll{position:relative;isolation:isolate;border:1px solid #a79c8740;border-radius:18px;box-shadow:0 16px 65px #0005,inset 0 0 0 5px #afa08a0b;overflow:hidden}.pg-scroll:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.75;background:url('/assets/routes/parchment.webp') center/640px 400px repeat;filter:grayscale(1) brightness(.075)}.pg-scroll:after{content:'';position:absolute;inset:9px;pointer-events:none;z-index:-1;border:1px solid #b8ab9224;border-radius:11px}.pg-heading{text-align:center;padding:32px 24px 14px}.pg-eyebrow{font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:#bba67a;margin:0 0 10px}.pg-heading h1{max-width:none;width:100%;font:700 clamp(38px,3.3vw,65px)/1.02 'Cormorant Garamond',Georgia,serif;color:#f4e0af;margin:0;text-shadow:0 3px 12px #000}.pg-heading h1 span{color:#ded5c4}.pg-heading>p:last-child{font-size:14px;line-height:1.6;color:#bcd0e4;margin:12px 0 0}.pg-stage{position:relative;height:clamp(440px,calc(100dvh - 380px),830px);overflow:hidden;isolation:isolate;outline:none;touch-action:manipulation}.pg-stage:before{content:'✦';position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);font-size:420px;color:#86b7e209;pointer-events:none}.pg-welcome,.pg-pause-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px}.pg-sigil{font-size:68px;color:#b5ceeb;text-shadow:0 0 30px #7d99ea66}.pg-welcome h2,.pg-pause-overlay h2{font:700 clamp(31px,2.4vw,48px) 'Cormorant Garamond',Georgia,serif;color:#f4e2b9;margin:12px 0}.pg-welcome p{font-size:15px;line-height:1.7;color:#c6d5e8;margin:8px 0 20px}.pg-welcome p.pg-welcome-rule{font-size:12px;color:#a8bbd4;margin-top:20px}.pg-primary{display:block;min-height:52px;border:1px solid #d5b985;border-radius:7px;background:linear-gradient(125deg,#73552e,#3e3150);color:#ffeac3;font:800 17px Inter,Arial,sans-serif;padding:14px 26px;cursor:pointer;box-shadow:inset 0 1px 0 #fff1c23b,0 4px 20px #0004}.pg-primary:hover{filter:brightness(1.18)}.pg-welcome .pg-primary{min-width:230px;font-size:25px;min-height:65px}.pg-primary span{margin-left:26px}.pg-app button:focus-visible{outline:2px solid #b4d7ff;outline-offset:4px}.pg-app button:disabled{opacity:.5;cursor:default}.pg-hud{display:flex;justify-content:center;gap:clamp(24px,5vw,85px);align-items:center;padding:18px 24px 0}.pg-hud>div{text-align:center}.pg-hud span{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#b5c9df;display:block}.pg-hud strong{font-size:23px;font-weight:800;color:#f4e0ae;display:block;margin-top:5px;font-variant-numeric:tabular-nums}.pg-hud #pg-lives{color:#ef8fbd;letter-spacing:4px}.pg-game-actions{display:flex;gap:8px}.pg-game-actions button,.pg-result-actions button,#pg-touch-kick{border:1px solid #8da7c060;border-radius:5px;background:#172940;color:#d6e5f6;padding:9px 14px;font:600 11px Inter,Arial,sans-serif;cursor:pointer}.pg-mobs{position:absolute;inset:0}.pg-mob{position:absolute;transform:none;width:min(28%,350px);height:auto;display:flex;align-items:center;flex-direction:column}.pg-plate{width:100%;border:0;padding:0;background:transparent;position:relative;cursor:pointer;color:white;text-align:left;filter:drop-shadow(0 5px 6px #0007)}.pg-health{display:flex;align-items:center;justify-content:space-between;gap:10px;border:3px solid #09090e;background:linear-gradient(#fb26a7,#da0875 55%,#8e125f);box-shadow:inset 0 1px 0 #ffbfe79a;min-height:43px;padding:3px 6px;font:700 20px/1.1 'Roboto Condensed','Arial Narrow',Arial,sans-serif;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000,0 2px 3px #000}.pg-plate-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pg-health-percent{flex:0 0 auto}.pg-cast{display:block;width:100%;pointer-events:none;position:relative;height:30px;border:3px solid #080a0e;background:#0b131d;margin-top:5px;overflow:hidden;opacity:1}.pg-cast-fill{position:absolute;inset:0;transform-origin:left;background:linear-gradient(#ffb23d,#ff7900 45%,#d84e00);box-shadow:inset 0 1px #ffedb06b;will-change:transform}.pg-cast.is-casting{opacity:1;box-shadow:0 0 12px #ff962940}.pg-cast-spark{position:absolute;top:-3px;bottom:-3px;width:5px;background:#fff7d9;box-shadow:0 0 8px 4px #ffefb8c9;transform:translateX(-50%);display:none}.is-casting .pg-cast-spark{display:block}.pg-cast-time{position:absolute;right:5px;top:0;font:700 21px/24px 'Roboto Condensed',Arial,sans-serif;color:#fff;text-shadow:0 2px 3px #000,1px 0 #000,-1px 0 #000;font-variant-numeric:tabular-nums}.pg-spell{display:block;width:100%;pointer-events:none;height:24px;margin-top:3px;font:600 18px/24px 'Roboto Condensed',Arial,sans-serif;text-shadow:0 2px 3px #000}.pg-plate.is-target:before{content:'';position:absolute;inset:-2px;border:2px solid #65ff97;border-radius:2px;box-shadow:0 0 8px #63ff97a6,0 0 19px #55ef8059;pointer-events:none}.pg-creature{position:absolute;transform:translate(-50%,calc(-50% + var(--emerge-offset,0px)));display:block;width:70px;height:95px;margin-top:10px;filter:drop-shadow(0 7px 4px #0006);pointer-events:none}.pg-creature-head{position:absolute;left:20px;top:0;width:32px;height:33px;background:linear-gradient(130deg,hsl(var(--mob-hue) 36% 62%),hsl(var(--mob-hue) 45% 24%));clip-path:polygon(0 0,25% 17%,75% 17%,100% 0,88% 78%,50% 100%,12% 78%)}.pg-creature-head:after{content:'••';position:absolute;top:6px;left:8px;letter-spacing:4px;font-size:14px;color:#fde7b6;text-shadow:0 0 5px #ffc3e4}.pg-creature-cloak{position:absolute;top:28px;left:0;width:70px;height:65px;background:linear-gradient(105deg,hsl(var(--mob-hue) 28% 46%),hsl(var(--mob-hue) 42% 14%));clip-path:polygon(33% 0,67% 0,91% 25%,100% 49%,80% 44%,88% 100%,60% 88%,50% 100%,39% 88%,12% 100%,20% 44%,0 49%,9% 25%)}.pg-selection{position:absolute;bottom:12px;left:0;right:0;text-align:center;pointer-events:none;font-size:12px;color:#ecd9a3}.pg-feedback{position:absolute;top:14px;left:50%;transform:translateX(-50%);padding:9px 17px;border:1px solid #8dbabd61;border-radius:5px;background:#101f35ed;color:#a8e9d4;pointer-events:none;opacity:0;font-size:13px;font-weight:700;white-space:nowrap}.pg-feedback[data-visible=true]{opacity:1}.pg-feedback[data-kind=bad]{color:#ffb2bd;border-color:#db668a}.pg-pause-overlay{background:#080909ed;z-index:5}.pg-pause-overlay .pg-primary{margin-top:18px}.pg-arena-footer{display:flex;justify-content:center;align-items:center;gap:24px;padding:12px 22px 20px;color:#bacbe0;font-size:11px}.pg-arena-footer p{margin:0}.pg-bottom{display:block;padding:38px 20px 0;max-width:1100px;margin:auto}.pg-about h2,.pg-board h2,.pg-results h2{font:700 29px/1.15 'Cormorant Garamond',Georgia,serif;color:#ecd7a2;margin:8px 0 18px}.pg-about h3{font:700 23px 'Cormorant Garamond',Georgia,serif;color:#b9d3ef;margin:24px 0 10px}.pg-about p,.pg-about details{font-size:13px;line-height:1.85;color:#b6c6d0}.pg-about a{color:#d1bb87}.pg-about details{margin-top:12px}.pg-about summary{font-weight:700;color:#d2dfe7;cursor:pointer}.pg-board{align-self:start;padding:24px;border:1px solid #8aa6be36;border-radius:10px;background:#080a0bbf}.pg-board-note,#pg-board-empty{font-size:12px;color:#a7bfd4}.pg-board-list{list-style:none;margin:20px 0;padding:0;display:grid;gap:12px}.pg-board-row{display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:12px;border-bottom:1px solid #a6b3c123;padding:0 0 12px}.pg-rank{font-size:12px;color:#a89771}.pg-board-row strong{font-size:13px;overflow-wrap:anywhere}.pg-board-row small{display:block;font-size:10px;color:#a5b9cb;margin-top:4px}.pg-board-score{color:#f1d79d}.pg-local-note{font-size:11px!important;line-height:1.7;color:#8fa6b9!important}.pg-link-button{border:0;background:transparent;color:#bdcdd7;font-size:11px;text-decoration:underline;cursor:pointer;padding:7px 0}.pg-results{max-width:calc(100vw - 24px);width:480px;padding:28px;border:1px solid #af966a;border-radius:12px;background:#101112;color:#e1e9f2;max-height:90dvh;overflow:auto;box-shadow:0 15px 60px #0009}.pg-results::backdrop{background:#030a16c7;backdrop-filter:blur(4px)}.pg-result-score{font-size:56px;font-weight:800;color:#efd39e}.pg-results #pg-result-time{font-size:12px;color:#aac1d8}.pg-result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:22px 0}.pg-result-stats strong{display:block;font-size:18px;color:#c2d9ef}.pg-result-stats span{display:block;font-size:10px;color:#91aec5;margin-top:5px}.pg-field{display:grid;gap:8px;font-size:12px;font-weight:700}.pg-field span{font-size:10px;color:#9db5c9;font-weight:400}.pg-field input{width:100%;padding:12px;border:1px solid #7795b861;border-radius:5px;background:#09182a;color:#e4edf7;font:inherit}.pg-form-message{font-size:11px;line-height:1.6;min-height:18px;color:#f2caa4}.pg-results .pg-primary{width:100%}.pg-result-actions{display:flex;justify-content:space-between;gap:12px;margin-top:12px}
@media(min-width:2400px){.pg-app{width:min(90vw,2300px)}.pg-stage{height:clamp(650px,calc(100dvh - 425px),1000px)}.pg-mob{width:min(28%,390px)}.pg-health{font-size:23px;min-height:49px}.pg-cast{height:34px}.pg-cast-time{line-height:28px;font-size:24px}}
@media(max-width:850px){.pg-app{width:94vw;margin-top:18px}.pg-bottom{grid-template-columns:1fr;gap:24px;padding:24px 4px 0}.pg-stage{height:490px}.pg-heading{padding:26px 18px 10px}.pg-heading>p:last-child{font-size:12px}.pg-mob{width:27%;height:auto}.pg-health{font-size:12px;min-height:32px;gap:3px;border-width:2px;padding:4px}.pg-health-percent{font-size:10px}.pg-spell{font-size:13px;line-height:18px;height:18px}.pg-cast{height:23px;border-width:2px}.pg-cast-time{font-size:17px;line-height:19px}.pg-creature{transform:translate(-50%,calc(-100% + var(--emerge-offset,0px))) scale(.8);transform-origin:bottom center}.pg-hud{padding:14px 8px 0;gap:12px;flex-wrap:wrap}.pg-hud strong{font-size:18px}.pg-hud span{font-size:8px}.pg-game-actions button{padding:7px 10px}.pg-feedback{font-size:11px;max-width:90%;white-space:normal;width:max-content}.pg-arena-footer{font-size:10px;gap:10px;flex-wrap:wrap}.pg-about h2{font-size:25px}}
@media(max-width:480px){.pg-heading h1{font-size:36px}.pg-welcome h2{font-size:32px}.pg-welcome p{font-size:13px}.pg-stage{height:460px}.pg-health-percent{display:none}.pg-mob{width:44%}.pg-plate-name{font-size:12px}.pg-creature{transform:translate(-50%,calc(-100% + var(--emerge-offset,0px))) scale(.75)}.pg-hud{gap:13px}.pg-game-actions{width:100%;justify-content:center}.pg-selection{font-size:10px}.pg-welcome .pg-primary{min-width:190px}}
@media(prefers-reduced-motion:reduce){.pg-cast-fill{will-change:auto}}

.pg-scroll:has(.pg-hud:not([hidden])) .pg-stage{height:clamp(440px,calc(100dvh - 465px),830px)}
@media(min-width:2400px){.pg-scroll:has(.pg-hud:not([hidden])) .pg-stage{height:clamp(600px,calc(100dvh - 495px),1000px)}}
@media(max-width:850px){.pg-scroll:has(.pg-hud:not([hidden])) .pg-stage{height:clamp(400px,calc(100dvh - 360px),600px)}}

.pg-mode-title{display:block;font:700 clamp(24px,2vw,34px)/1.15 'Cormorant Garamond',Georgia,serif;letter-spacing:.08em;color:#cfbd97;margin:12px 0 0;text-transform:uppercase}

/* The creatures can overlap in a pull; plates reserve space for the whole cast stack. */
.pg-play-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:26px}.pg-play-layout>.pg-board{width:min(100%,900px);justify-self:center}.pg-stage.has-crowd{min-height:560px}.pg-creature.is-target{filter:drop-shadow(0 0 9px #57ff8b99)}.pg-creature.is-raising:before{content:"";position:absolute;inset:-12px -22px -5px;background:radial-gradient(ellipse at bottom,#9a66de66,transparent 70%);border-bottom:2px solid #a98de6aa;border-radius:50%;pointer-events:none}.pg-mobs:before{content:"";position:absolute;left:50%;top:50%;width:28%;height:13%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#85745816,transparent 70%);border:1px solid #a3926b16;border-radius:50%;pointer-events:none}
@media(min-width:1300px) and (min-aspect-ratio:2/1){.pg-app{width:min(96vw,2900px)}.pg-play-layout{grid-template-columns:280px minmax(0,1fr);gap:28px;align-items:start}.pg-play-layout>.pg-board{grid-column:1;grid-row:1;position:sticky;top:85px;width:100%;margin-top:25px}.pg-play-layout>.pg-scroll{grid-column:2;grid-row:1}}

.pg-mob{z-index:2}.pg-creature{z-index:1}.pg-mobs:before{z-index:0}

/* Compact live rankings: real entries only, with no placeholder slots. */
.pg-board-list{gap:9px;margin:14px 0}.pg-board-row{padding-bottom:9px;gap:8px;grid-template-columns:24px minmax(0,1fr) auto}.pg-board h2{margin-top:0;margin-bottom:14px}.pg-board-status:empty{display:none}.pg-feedback{z-index:3}

.pg-recents{margin-top:26px;padding-top:22px;border-top:1px solid #a6b3c123}.pg-recent-row{grid-template-columns:minmax(0,1fr) auto}#pg-recent-empty{font-size:12px;color:#a7bfd4}

/* Reserve room for ten fixed nameplates before the first mob appears. */
.pg-stage.is-playing{min-height:560px}

@media(max-width:480px){.pg-mob{width:42%}}

/* One readable, gently staggered stack; crowded pulls reserve the full cast height. */
.pg-mob{width:min(60%,350px)}
@media(min-width:2400px){.pg-mob{width:min(60%,390px)}}
@media(max-width:850px){.pg-mob{width:min(72%,300px)}}
.pg-stage.compact-plates .pg-health{min-height:28px;height:28px;font-size:16px;padding:2px 5px;border-width:2px}
.pg-stage.compact-plates .pg-cast{height:18px;margin-top:3px;border-width:2px}
.pg-stage.compact-plates .pg-cast-time{font-size:13px;line-height:14px}
.pg-stage.compact-plates .pg-spell{height:13px;margin-top:2px;font-size:12px;line-height:13px}
@media(max-width:850px){.pg-stage.compact-plates .pg-health,.pg-plate-name{font-size:12px}}