
:root{--k:#1b0711;--red:#d61f2c;--red2:#a8131f;--cream:#f6e8cc;--paper:#fff3dc;--gold:#f2b83a;--gold2:#fbe39a;--ink:#2a0a14;--soft:#6b3a45;--bg:#160509;font-family:Heebo,system-ui,sans-serif}
:root .wrap{display:flex;flex-wrap:wrap;gap:26px;justify-content:center;align-items:flex-start}
.ph5{width:330px;border:8px solid #070103;border-radius:38px;overflow:hidden;position:relative;color:var(--cream);box-shadow:0 14px 34px rgba(0,0,0,.55);user-select:none;-webkit-user-select:none;background:linear-gradient(#2a0a14,#160509 60%)}
.ph5 .top{padding:14px 12px 6px;display:flex;flex-direction:column;align-items:center;gap:6px}
.ph5 .ttl{font:400 13px "Secular One",Heebo;letter-spacing:3px;color:var(--red);background:var(--cream);padding:2px 14px;border-radius:3px;border:2px solid var(--k);box-shadow:3px 3px 0 var(--k);transform:rotate(-1.5deg)}
.ph5 .cur{display:flex;align-items:center;gap:8px;font:400 38px/1 "Secular One",Heebo;color:var(--cream);text-shadow:3px 3px 0 var(--red),5px 5px 0 var(--k);font-variant-numeric:tabular-nums}
.ph5 .chips{display:flex;gap:6px}
.ph5 .chip{display:flex;align-items:center;gap:5px;font:800 12px Heebo;background:var(--cream);color:var(--ink);border:2px solid var(--k);border-radius:20px;padding:3px 10px;box-shadow:2px 2px 0 var(--k)}
.news{margin:6px 0 0;background:var(--k);border-block:2px solid var(--red);overflow:hidden;white-space:nowrap;height:26px;position:relative}
.news span{position:absolute;top:0;line-height:26px;font:600 12px Heebo;color:var(--gold2)}
.ph5 .stage{position:relative;margin:2px 0 0}
.ph5 .stage svg{display:block;width:100%;height:auto;touch-action:manipulation;cursor:pointer}
.ph5 .list{padding:8px 12px 4px;display:flex;flex-direction:column;gap:11px}
.row5{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:14px;background:var(--paper);color:var(--ink);border:3px solid var(--k);box-shadow:4px 4px 0 var(--k);position:relative}
.row5 .ic{width:54px;height:54px;flex:none;position:relative;border-radius:50%;background:#ffd9a0;border:3px solid var(--k);display:flex;align-items:center;justify-content:center}
.row5 .ic svg{filter:drop-shadow(2px 0 0 var(--cream)) drop-shadow(-2px 0 0 var(--cream)) drop-shadow(0 2px 0 var(--cream)) drop-shadow(0 -2px 0 var(--cream));margin-top:-2px}
.row5 .ic .b{position:absolute;bottom:-7px;left:-8px;min-width:24px;text-align:center;background:var(--red);color:var(--cream);font:400 12px "Secular One",Heebo;border-radius:10px;padding:1px 6px;border:2px solid var(--k)}
.row5 .tx{flex:1;min-width:0}.row5 .tx b{display:block;font:400 17px/1.1 "Secular One",Heebo}.row5 .tx small{color:var(--soft);font-weight:600;font-size:12px}
.row5 .bar{height:9px;margin-top:5px;background:#e6cfa8;border:2px solid var(--k);border-radius:6px;overflow:hidden}
.row5 .bar i{display:block;height:100%;width:100%;transform-origin:right center;transform:scaleX(0);background:repeating-linear-gradient(135deg,var(--red) 0 6px,#ff5a3a 6px 12px)}
.buy5{flex:none;min-width:66px;min-height:48px;border:3px solid var(--k);border-radius:12px;cursor:pointer;font:400 16px/1.05 "Secular One",Heebo;color:var(--cream);padding:5px 10px;background:var(--red);box-shadow:3px 3px 0 var(--k)}
.buy5 s{display:block;text-decoration:none;font:800 11px Heebo;color:var(--gold2)}
.buy5:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--k)}
.buy5:focus-visible{outline:3px solid #7de3ff;outline-offset:2px}
.buy5.off{background:#9b8f84;color:#3d3530;box-shadow:3px 3px 0 var(--k);cursor:not-allowed}.buy5.off s{color:#3d3530}
.row5.lock{background:#cdb99a;border-style:dashed}
.nav5{display:grid;grid-template-columns:repeat(4,1fr);margin-top:14px;background:var(--k);border-top:3px solid var(--red);padding:6px 4px 12px}
.nav5 a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;min-height:48px;color:#bfa98f;font:600 11.5px Heebo;position:relative;text-decoration:none}
.nav5 a.on{color:var(--cream)}.nav5 a.on::before{content:"";position:absolute;top:-9px;width:34px;height:5px;background:var(--red);border-radius:0 0 4px 4px}
.nav5 a u{position:absolute;top:0;right:26%;background:var(--gold);color:var(--ink);border-radius:9px;font:800 10px Heebo;padding:1px 5px;text-decoration:none;border:1.5px solid var(--k)}
.side5{width:310px;display:flex;flex-direction:column;gap:14px}
.card5{background:var(--paper);color:var(--ink);border:3px solid var(--k);border-radius:14px;box-shadow:5px 5px 0 var(--red);padding:14px;font:13px/1.45 Heebo}
.card5 h4{margin:0 0 8px;font:400 18px "Secular One",Heebo;color:var(--red)}
.card5 ul{margin:0;padding-inline-start:18px}.card5 li{margin:3px 0}
.fg{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;text-align:center;font:600 11px Heebo}
.fg svg{width:58px;height:58px;filter:drop-shadow(2px 0 0 var(--cream)) drop-shadow(-2px 0 0 var(--cream)) drop-shadow(0 2px 0 var(--cream)) drop-shadow(0 -2px 0 var(--cream))}
.fg div{background:#ffd9a0;border:2px solid var(--k);border-radius:10px;padding:6px 0}
.ph5{background:linear-gradient(180deg,#4a1260 0,#2e0b3a 16%,#2a0a14 46%,#160509)}
.ph5 .ttl{background:linear-gradient(#fff0b0,#f2b83a);color:#7a0f26;box-shadow:3px 3px 0 var(--k),inset 0 -3px 0 #c4902a;position:relative;overflow:hidden;padding:3px 16px}
.ph5 .ttl::after{content:"";position:absolute;top:0;left:-40%;width:28%;height:100%;background:rgba(255,255,255,.6);transform:skewX(-20deg);animation:shine 3.6s infinite}
@keyframes shine{0%,55%{left:-40%}100%{left:140%}}
.ph5 .cur{text-shadow:none}
.ph5 .cur bdi{background:linear-gradient(#fff,#ffe9a0 50%,#f2b83a);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:2.5px var(--k);paint-order:stroke fill;filter:drop-shadow(0 3px 0 var(--red)) drop-shadow(0 6px 0 var(--k))}
.ph5 .chip:nth-child(1){background:#ffe27a}.ph5 .chip:nth-child(2){background:#bff0ff}.ph5 .chip:nth-child(3){background:#ffc1d3}
.ph5 .stage::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 36px rgba(20,4,10,.5)}
.row5{--c:#ffd9a0;background:linear-gradient(180deg,#fffaf0,#fde3bd)}
.row5 .ic{background:radial-gradient(circle at 35% 28%,#fff 0,var(--c) 68%)}
.row5 .bar i{background:repeating-linear-gradient(135deg,#ff3a2a 0 6px,#ff8a3a 6px 12px);box-shadow:inset 0 3px 0 rgba(255,255,255,.45)}
.buy5{background:linear-gradient(#ff6a50,#d61f2c 55%,#a8131f);position:relative;overflow:hidden;box-shadow:3px 3px 0 var(--k),inset 0 2px 0 rgba(255,255,255,.5)}
.buy5::before{content:"";position:absolute;left:8%;right:8%;top:3px;height:34%;border-radius:8px;background:rgba(255,255,255,.3)}
.buy5.off{background:#9b8f84}.buy5.off::before{display:none}
.nav5 a.on::before{box-shadow:0 0 12px var(--red)}
@media (prefers-reduced-motion:reduce){.ph5 *{animation:none!important}}
