/* Recess · Rivals ladder page */
#lad{position:relative;z-index:2;max-width:1120px;margin:0 auto;padding:calc(50px + env(safe-area-inset-top)) 16px calc(24px + env(safe-area-inset-bottom))}
.lh{text-align:center}
.lh .back{display:inline-block;margin-bottom:6px;font:600 11px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--amber);text-decoration:none;opacity:.85}
.lh h1{margin:0;font:italic 900 clamp(46px,11vw,92px)/.9 Impact,"Arial Black","Helvetica Neue",sans-serif;text-transform:uppercase;letter-spacing:.01em;color:#fff;text-shadow:3px 3px 0 #ff5fb8,0 0 26px rgba(255,95,184,.6),0 0 60px rgba(255,95,184,.35)}
.lh p{margin:8px auto 0;max-width:560px;font:italic 500 19px/1.3 var(--serif);color:#ffe2b8;text-shadow:0 1px 10px rgba(0,0,0,.7)}
.prog{display:flex;align-items:center;gap:10px;justify-content:center;margin:14px auto 0;font:700 12px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
.prog .seg{display:flex;gap:4px}
.prog .seg i{width:22px;height:8px;border-radius:2px;background:rgba(255,255,255,.12);transform:skewX(-18deg)}
.prog .seg i.on{background:var(--c,#43e6d8);box-shadow:0 0 10px var(--c,#43e6d8)}
/* featured rival */
.feat{--c:#ff5fb8;position:relative;display:grid;grid-template-columns:minmax(0,40%) 1fr;margin:20px 0 0;border-radius:22px;overflow:hidden;background:linear-gradient(150deg,rgba(52,20,64,.9),rgba(16,7,26,.94));border:1px solid color-mix(in srgb,var(--c) 40%,transparent);box-shadow:0 0 44px color-mix(in srgb,var(--c) 22%,transparent),0 18px 40px rgba(0,0,0,.5);min-height:420px}
.feat::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(-62deg,transparent 0 28px,color-mix(in srgb,var(--c) 6%,transparent) 28px 30px);pointer-events:none}
.feat .rv-breathe{position:relative;overflow:hidden}
.feat .rv-breathe::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 62%,rgba(16,7,26,.96))}
.feat.locked .rv-breathe i{inset:-12px;filter:blur(8px) brightness(.45) saturate(.3) contrast(1.3)}.feat.locked .rv-breathe::before{content:"?";position:absolute;inset:0;z-index:1;display:grid;place-items:center;font:italic 900 120px/1 Impact,"Arial Black",sans-serif;color:var(--c);text-shadow:0 0 30px var(--c)}
.fb{position:relative;padding:24px 26px 22px;display:flex;flex-direction:column;gap:2px}
.fb .rv-tag{opacity:1;transform:skewX(-14deg);animation:none;align-self:flex-start}
.fb h2{margin:10px 0 0;font:italic 900 clamp(36px,5.4vw,66px)/.92 Impact,"Arial Black",sans-serif;text-transform:uppercase;color:#fff;text-shadow:3px 3px 0 var(--c),0 0 24px color-mix(in srgb,var(--c) 55%,transparent)}
.fb .nick{margin:6px 0 0;font:italic 600 clamp(22px,3vw,32px)/1.1 var(--serif);color:var(--c)}
.fb .taunt{margin:12px 0 0;font:italic 500 20px/1.3 var(--serif);color:#fff6ec}
.fb .arc{margin:10px 0 0;font-size:13.5px;color:#d8c2d6;max-width:52ch}
.fb .arc b{color:#43e6d8;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;margin-right:6px}
.fb .meta{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}
.fb .meta span{padding:4px 10px;border-radius:99px;font:600 12px/1.2 var(--sans);background:rgba(255,255,255,.07);border:1px solid rgba(255,220,240,.15);color:#f1e6f0}
.fb .meta span.sig{border-color:color-mix(in srgb,var(--c) 50%,transparent);color:#fff}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 14px;margin:14px 0 0;max-width:460px}
.stats div{font:700 10px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#bfa8c0}
.stats i{display:block;height:5px;margin-top:5px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.stats i b{display:block;height:100%;background:linear-gradient(90deg,var(--c),#fff);border-radius:3px}
.acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.acts button,.acts a{min-height:44px;padding:11px 18px;border-radius:99px;border:1px solid rgba(255,220,240,.25);background:rgba(255,255,255,.06);color:#fbefe0;font:700 14px/1 var(--sans);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;touch-action:manipulation}
.acts .pri{background:linear-gradient(135deg,var(--c),#ff9f4d);color:#1a0a22;border-color:transparent}
.acts button:hover,.acts a:hover,.acts button:focus-visible,.acts a:focus-visible{border-color:#ffb84d;outline:none}
.acts{flex-direction:column;align-items:flex-start;gap:4px}
.acts .pri{min-height:54px;padding:15px 28px;font:800 17px/1.15 var(--sans);letter-spacing:.01em;justify-content:center;text-align:center;box-shadow:0 6px 22px color-mix(in srgb,var(--c) 40%,transparent)}
.acts .pri:hover,.acts .pri:focus-visible{border-color:#fff;filter:brightness(1.06)}
.acts .txt{min-height:40px;padding:8px 4px;border:0;background:none;font:600 13.5px/1 var(--sans);color:#d8c2d6;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(216,194,214,.45)}
.acts .txt:hover,.acts .txt:focus-visible{color:#fff;border:0}
.pick{display:none;margin-top:16px;padding:10px 12px;border-radius:14px;background:rgba(0,0,0,.35);border:1px solid rgba(255,220,240,.12)}
.pick.on{display:block}
.pick p{margin:0 0 8px;font:700 10.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#fff}
.pick p::before{content:'1';display:inline-grid;place-items:center;width:17px;height:17px;margin-right:7px;border-radius:50%;background:var(--c);color:#1a0a22;letter-spacing:0;font-size:10.5px}
.pick div{display:flex;flex-wrap:wrap;gap:6px}
.pick button{padding:9px 16px;min-height:44px;display:inline-flex;align-items:center;border-radius:99px;background:rgba(255,255,255,.08);color:#fff;font:700 14px/1 var(--sans);border:1px solid color-mix(in srgb,var(--c) 40%,transparent);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.pick button:hover,.pick button:focus-visible{background:color-mix(in srgb,var(--c) 30%,transparent);outline:none}
.pick button[aria-pressed="true"]{background:var(--c);color:#1a0a22;border-color:var(--c);box-shadow:0 0 14px color-mix(in srgb,var(--c) 50%,transparent)}
.pick button[aria-pressed="true"]::before{content:'✓';margin-right:6px}
.pick+.acts{margin-top:12px}
@keyframes jin{from{opacity:0;transform:translateY(6px)}}
/* the board */
.board{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:r}
.rung{--c:#ff5fb8;position:relative}
.rung button{position:relative;width:100%;display:block;padding:0;border:1px solid rgba(255,220,240,.16);border-radius:16px;overflow:hidden;background:#1a0b24;color:inherit;font:inherit;text-align:left;cursor:pointer;aspect-ratio:3/4;transition:transform .2s,border-color .2s,box-shadow .2s;-webkit-tap-highlight-color:transparent}
.rung button:hover,.rung button:focus-visible{transform:translateY(-3px);border-color:var(--c);box-shadow:0 0 24px color-mix(in srgb,var(--c) 45%,transparent);outline:none}
.rung.sel button{border-color:var(--c);box-shadow:0 0 0 2px var(--c),0 0 26px color-mix(in srgb,var(--c) 45%,transparent)}
.rung .ph{position:absolute;inset:0;background:center 15%/cover no-repeat;transition:filter .4s}
.rung.locked .ph{inset:-8px;filter:blur(5px) brightness(.5) saturate(.3) contrast(1.3)}.rung.locked button::after{content:"?";position:absolute;left:0;right:0;top:30%;text-align:center;font:italic 900 64px/1 Impact,"Arial Black",sans-serif;color:var(--c);text-shadow:0 0 18px var(--c);opacity:.85}
.rung.beaten .ph{filter:saturate(.55) brightness(.75)}
.rung .sh{position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(10,4,16,.94) 88%)}
.rung .no{position:absolute;left:10px;top:8px;font:italic 900 30px/1 Impact,"Arial Black",sans-serif;color:transparent;-webkit-text-stroke:1.2px var(--c);text-shadow:0 0 12px color-mix(in srgb,var(--c) 50%,transparent)}
.rung .tx{position:absolute;left:10px;right:10px;bottom:10px}
.rung .tx b{display:block;font:italic 900 clamp(17px,2vw,22px)/1 Impact,"Arial Black",sans-serif;text-transform:uppercase;color:#fff;text-shadow:2px 2px 0 var(--c)}
.rung .tx em{display:block;margin-top:4px;font:italic 600 15px/1.1 var(--serif);color:var(--c)}
.rung .tx small{display:block;margin-top:4px;font:11px/1.25 var(--sans);color:#cdb8cf}
.rung .st{position:absolute;right:8px;top:9px;padding:3px 8px;border-radius:4px;font:800 9.5px/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;transform:skewX(-12deg)}
.rung.beaten .st{background:#43e6d8;color:#06251f}
.rung.next .st{background:#ff5fb8;color:#1a0a22;animation:rvBlink 1.4s ease-in-out infinite}
.rung.locked .st{background:rgba(255,255,255,.12);color:#d8c2d6}
.rung.boss{grid-column:span 1}
.rung.shake button{animation:shk .4s}
@keyframes shk{25%{transform:translateX(-5px)}50%{transform:translateX(5px)}75%{transform:translateX(-3px)}}
@keyframes rvBlink{50%{opacity:.5}}
.lfoot{margin:22px 0 0;text-align:center;font-size:12.5px;color:var(--mute)}
.lfoot a,.lfoot button{color:var(--amber);background:none;border:0;font:inherit;cursor:pointer;padding:6px;text-decoration:underline;text-underline-offset:3px}
.ltoast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:20;padding:10px 16px;border-radius:99px;background:rgba(20,8,28,.92);border:1px solid rgba(255,184,77,.4);font:600 13.5px/1.2 var(--sans);color:#fff;opacity:0;transition:opacity .25s;pointer-events:none;max-width:90vw;text-align:center}
.ltoast.on{opacity:1}
@media (max-width:820px){.board{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.feat{grid-template-columns:1fr;min-height:0}.feat .rv-breathe{height:min(56vh,420px)}.feat .rv-breathe::after{background:linear-gradient(transparent 50%,rgba(16,7,26,.98))}.fb{padding:0 18px 18px;margin-top:-70px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.acts{align-items:stretch}.acts .pri{width:100%}.acts .txt{align-self:center}}
