@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#0d1518;--panel:#162125;--muted:#829398;--line:#2b3a3e;--mint:#b7ef9f;--cream:#f4f1e9;--red:#ee8e88}*{box-sizing:border-box}html{font-family:'DM Sans',Arial,sans-serif;background:var(--bg)}body{margin:0;color:var(--cream);background:radial-gradient(circle at 46% 38%,#1b2a28 0,transparent 45%),var(--bg);min-height:100vh}button{font:inherit}.shell{max-width:1500px;margin:auto;padding:0 46px}.topbar{height:98px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{text-decoration:none;color:var(--cream);font:700 21px 'Space Grotesk';letter-spacing:-1px;white-space:nowrap}.brand span:last-child{color:var(--mint)}.brandmark{color:var(--mint);font-size:32px;vertical-align:-3px;margin-right:8px}.topright{font-size:10px;font-weight:700;letter-spacing:2px;color:#a9b6b6}.live-dot{display:inline-block;width:7px;height:7px;background:var(--mint);border-radius:50%;margin-right:10px;box-shadow:0 0 12px var(--mint)}.layout{display:grid;grid-template-columns:minmax(230px,1fr) minmax(330px,440px) minmax(275px,1fr);gap:clamp(25px,3.5vw,70px);padding-top:70px;min-height:770px}.intro{padding-top:110px}.eyebrow{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:2px;font-weight:700;color:var(--mint);white-space:nowrap}.eyebrow .line{display:block;width:20px;height:1px;background:var(--mint)}h1,h2,h3,p{margin-top:0}h1{font:700 clamp(44px,4.5vw,72px)/1.02 'Space Grotesk';letter-spacing:-4px;margin:26px 0}h1 em{font-style:normal;color:var(--mint)}.intro p{font-size:15px;color:#a8b6b8;line-height:1.8;max-width:300px}.statrow{display:flex;align-items:center;gap:22px;margin-top:53px}.statrow div:not(.stat-divider){display:flex;flex-direction:column;gap:8px}.statrow strong{font:600 25px 'Space Grotesk'}.statrow span{font-size:9px;letter-spacing:1.5px;color:var(--muted);white-space:nowrap}.stat-divider{width:1px;height:38px;background:var(--line)}.section-label{display:flex;justify-content:space-between;font-size:10px;color:#a6b7b6;letter-spacing:1.6px;font-weight:700;margin-bottom:25px}.arena{min-width:0}.card-area{height:530px;position:relative;touch-action:pan-y;user-select:none}.back-card{position:absolute;inset:13px 14px -6px;background:#2b4140;border:1px solid #435c56;border-radius:19px;transform:rotate(3deg)}.player-card{position:absolute;inset:0;background:#1b292c;border:1px solid #455351;border-radius:18px;overflow:hidden;box-shadow:0 22px 75px #0007;cursor:grab;transform-origin:50% 90%;will-change:transform}.player-card.dragging{cursor:grabbing;transition:none!important}.card-art{height:55%;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(140deg,#395d51,#1c3536)}.card-art:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#1b292c,transparent 38%)}.art-monogram{font:700 145px 'Space Grotesk';letter-spacing:-15px;color:#e8eadc;text-shadow:10px 12px 0 #0002;z-index:1;opacity:.92}.art-decoration{position:absolute;font-size:330px;color:#fff1;right:-60px;top:-110px;transform:rotate(-18deg)}.card-badge{position:absolute;z-index:2;top:20px;left:20px;border:1px solid #ffffff78;border-radius:30px;padding:8px 12px;color:white;font-size:9px;font-weight:700;letter-spacing:1.4px}.card-body{padding:20px 26px}.card-index{font-size:10px;letter-spacing:1.5px;color:var(--mint);font-weight:700}.card-body h2{font:700 clamp(30px,3vw,41px)/1 'Space Grotesk';letter-spacing:-2px;margin:8px 0}.player-description{color:#b5c1bf;font-size:12px;line-height:1.5;min-height:36px}.rating-line{display:flex;justify-content:space-between;align-items:end;border-top:1px solid #415150;padding-top:13px;margin-top:13px}.rating-line>div{display:flex;flex-direction:column;gap:2px}.rating-label{font-size:9px;letter-spacing:1.4px;color:#9eafad}.rating-line strong{font:600 26px 'Space Grotesk';color:var(--mint)}.rating-change{font:600 11px 'Space Grotesk';color:var(--mint);min-height:14px}.vote-stamp{position:absolute;z-index:4;top:24%;left:17%;border:5px solid;padding:6px 14px;border-radius:9px;font:700 42px 'Space Grotesk';transform:rotate(-14deg);opacity:0;pointer-events:none}.vote-stamp.like{color:var(--mint)}.vote-stamp.dislike{color:var(--red)}.actions{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:22px}.action{width:70px;height:70px;border-radius:50%;border:1px solid #4a5b59;background:#1d2c2f;color:var(--cream);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s,background .15s}.action:hover{transform:translateY(-4px);background:#30403d}.action:focus-visible{outline:3px solid var(--mint)}.action span{font-size:30px;line-height:25px}.action small{font-size:9px;letter-spacing:1.4px;margin-top:6px;font-weight:700}.like{border-color:#759b74;color:var(--mint)}.dislike{color:var(--red)}.action-hint{text-align:center;color:#d6dcd6;font-size:10px;font-weight:700;letter-spacing:1.6px;line-height:1.8}.action-hint span{font-size:9px;color:#819792}.keyboard-hint{text-align:center;color:#718481;font-size:10px;margin-top:19px}.sidebar{padding-top:1px}.sidebar .signal{color:var(--mint);letter-spacing:1px}.sidebar h3{font:700 28px 'Space Grotesk';letter-spacing:-1.2px;margin-bottom:5px}.accent-dot{color:var(--mint)}.sidebar-sub{font-size:12px;color:#849794;line-height:1.6;margin-bottom:26px}.activity{border-top:1px solid var(--line);min-height:175px}.activity-item{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid var(--line)}.activity-icon{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:none;font-size:19px;background:#283f37;color:var(--mint)}.activity-icon.no{background:#413030;color:var(--red)}.activity-copy{flex:1;min-width:0}.activity-copy strong{font-size:12px}.activity-copy div{font-size:11px;color:#8fa29e;margin-top:4px}.activity-delta{font:600 12px 'Space Grotesk';white-space:nowrap}.activity-delta.negative{color:var(--red)}.activity-delta.positive{color:var(--mint)}.empty-state{padding:30px 0;color:#81928f;font-size:12px;line-height:1.7}.ranking{margin-top:46px}.ranking .section-label{padding-top:21px;border-top:1px solid var(--line)}.leader{display:flex;align-items:center;gap:12px;padding:11px 0}.leader-num{color:#7b908c;font:600 12px 'Space Grotesk';width:16px}.leader-avatar{width:33px;height:33px;border-radius:50%;display:grid;place-items:center;font-size:10px;font-weight:700}.leader-name{flex:1;font-size:12px;font-weight:600}.leader-rating{font:600 12px 'Space Grotesk';color:var(--mint)}footer{border-top:1px solid var(--line);margin-top:60px;padding:26px 0 38px;color:#8ba19b;font-size:10px;letter-spacing:1.4px;font-weight:700;display:flex;justify-content:space-between}footer span{font-weight:400;letter-spacing:0;color:#70837e}@media(max-width:1060px){.layout{grid-template-columns:minmax(280px,1fr) minmax(330px,440px);gap:40px}.intro{padding-top:40px}.sidebar{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 40px}.sidebar>.section-label,.sidebar h3,.sidebar-sub,.activity{grid-column:1}.ranking{grid-column:2;grid-row:1/5;margin-top:0}}@media(max-width:690px){.shell{padding:0 18px}.topbar{height:70px}.brand{font-size:18px}.topright{display:none}.layout{display:block;padding-top:35px}.intro{padding:0}.eyebrow{font-size:9px}h1{font-size:47px;letter-spacing:-3px;margin:17px 0}.intro p{max-width:450px;margin-bottom:0}.statrow{margin:23px 0 38px}.arena{max-width:440px;margin:auto}.card-area{height:min(530px,115vw);min-height:450px}.card-art{height:55%}.card-body{padding:18px 22px}.art-monogram{font-size:125px}.sidebar{display:block;margin-top:56px}.ranking{margin-top:40px}footer{gap:20px;line-height:1.5}.action-hint{font-size:9px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
/* Compact full-screen voting layout */
.shell{max-width:1800px;padding-inline:clamp(18px,2vw,34px)}
.topbar{height:68px}
.layout{grid-template-columns:minmax(190px,1fr) minmax(360px,510px) minmax(230px,1fr);gap:clamp(36px,4vw,74px);padding-top:clamp(16px,2.5vh,28px);min-height:0}
.intro{padding-top:clamp(30px,8vh,86px)}
.statrow{margin-top:35px}
.arena{position:relative;min-width:0}
.arena .section-label{margin-bottom:13px}
.card-area{height:clamp(365px,calc(100dvh - 190px),625px)}
.card-art{height:62%;background-size:cover;background-repeat:no-repeat}
.card-art:after{background:linear-gradient(0deg,#1b292c 0%,transparent 26%)}
.card-body{padding:clamp(13px,2vh,23px) 25px}
.card-body h2{font-size:clamp(29px,2.5vw,40px);margin:6px 0}
.player-description{min-height:0}
.rating-line{padding-top:10px;margin-top:10px}
.side-arrow{position:absolute;z-index:5;top:45%;width:55px;height:67px;border:1px solid #5b766c;border-radius:14px;background:#20322e;color:var(--mint);display:flex;align-items:center;justify-content:center;flex-direction:column;cursor:pointer;box-shadow:0 10px 25px #0005;transition:background .15s,transform .15s}
.side-arrow:hover{background:#365047;transform:scale(1.06)}
.side-arrow:focus-visible{outline:3px solid var(--mint);outline-offset:3px}
.side-arrow span{font-size:28px;line-height:30px}.side-arrow small{font-size:9px;letter-spacing:1.2px;font-weight:700}
.side-arrow-left{left:-69px;color:var(--red);border-color:#785b56}.side-arrow-right{right:-69px}
.keyboard-hint{margin-top:14px;letter-spacing:1px}
.sidebar .section-label{margin-bottom:18px}.sidebar-sub{margin-bottom:17px}.activity-item{padding:11px 0}.ranking{margin-top:26px}.leader{padding:7px 0}
footer{margin-top:30px;padding:16px 0}
@media(max-width:1060px){.layout{grid-template-columns:minmax(180px,1fr) minmax(340px,500px);gap:70px}.sidebar{display:block;grid-column:1/-1}.intro{padding-top:30px}.card-area{height:clamp(365px,calc(100dvh - 195px),620px)}}
@media(max-width:690px){.shell{padding-inline:15px}.layout{display:block;padding-top:22px}.intro{padding-top:0}.statrow{margin:15px 0 24px}.arena{max-width:min(440px,calc(100vw - 84px));margin:auto}.card-area{height:clamp(390px,calc(100dvh - 285px),580px)}.card-art{height:60%}.side-arrow{top:47%;width:38px;height:56px;border-radius:10px}.side-arrow span{font-size:23px}.side-arrow small{font-size:7px}.side-arrow-left{left:-45px}.side-arrow-right{right:-45px}.card-body{padding:13px 18px}.card-body h2{font-size:clamp(27px,7vw,36px)}.rating-line strong{font-size:22px}.sidebar{margin-top:35px}footer{margin-top:25px}}
@media(max-height:650px) and (min-width:691px){.intro{padding-top:18px}.card-area{height:calc(100dvh - 160px)}.card-art{height:58%}.card-body{padding:10px 20px}.rating-line{margin-top:5px;padding-top:6px}}
/* Zozo Poker identity and compact desktop experience */
.brand{display:inline-flex;align-items:center;gap:6px;font-size:20px;letter-spacing:-.7px}
.brandmark{width:45px;height:45px;object-fit:contain;margin:0 7px 0 0;vertical-align:middle;filter:drop-shadow(0 0 10px #b7ef9f28)}
.brand span:last-child{margin-left:-6px}
.intro{padding-top:20px}
.hero-mascot{display:block;width:min(100%,245px);height:clamp(165px,28vh,245px);object-fit:contain;object-position:center left;margin:8px 0 -4px;filter:drop-shadow(0 15px 36px #b7ef9f19)}
.intro h1{font-size:clamp(45px,4.4vw,72px);margin:6px 0 15px;line-height:.99}
.intro p{max-width:310px}
.statrow{margin-top:25px}
.sidebar .activity{min-height:0}
.activity-item{padding:10px 0}
.activity-copy strong{font-size:12px}
.activity-copy div{font-size:10px}
.activity-delta{font-size:12px}
.ranking{margin-top:18px}.ranking .section-label{padding-top:15px;margin-bottom:11px}.leader{padding:6px 0}
.rating-line strong{white-space:nowrap}
@media(max-width:1060px){.intro{padding-top:8px}.hero-mascot{width:190px;height:180px}.intro h1{font-size:50px}}
@media(max-width:690px){.brandmark{width:38px;height:38px}.hero-mascot{width:125px;height:120px;margin:4px 0 -2px}.intro h1{font-size:43px;margin:2px 0 9px}.intro p{font-size:13px;line-height:1.5}.statrow{margin:12px 0 22px}.sidebar{margin-top:32px}.card-area{height:clamp(385px,calc(100dvh - 360px),550px)}}
@media(max-height:750px) and (min-width:691px){.hero-mascot{height:165px;width:185px}.intro h1{font-size:50px}.statrow{margin-top:18px}.sidebar-sub{margin-bottom:7px}.activity-item{padding:7px 0}.ranking{margin-top:10px}.leader{padding:4px 0}}
/* Square portrait crops preserve faces in the wide card. */
.card-art{background-size:cover!important;background-position:center 38%!important;background-repeat:no-repeat!important}
.side-arrow-left{left:12px}.side-arrow-right{right:12px}
.side-arrow{top:48%;background:#172521e8;backdrop-filter:blur(5px)}
.special-actions{position:absolute;z-index:6;left:-65px;top:18%;display:flex;flex-direction:column;gap:10px}
.special-action{width:53px;min-height:59px;border:1px solid #4b635b;border-radius:13px;background:#1e2e2beb;color:var(--cream);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer;box-shadow:0 8px 22px #0005;transition:background .15s,transform .15s}
.special-action:hover{background:#344940;transform:translateX(-3px)}
.special-action:focus-visible{outline:3px solid var(--mint);outline-offset:2px}
.special-action span{font-size:23px;line-height:27px}.special-action small{font-size:10px;font-weight:700;letter-spacing:.4px}
.special-action.flowers{border-color:#77986f;color:var(--mint)}.special-action.tomato{border-color:#89594f;color:var(--red)}
.reaction-effect{position:absolute;z-index:7;pointer-events:none;left:50%;top:30%;font-size:90px;opacity:0;transform:translate(-50%,-50%) scale(.45)}
.reaction-effect.show{animation:reaction-pop .65s ease-out forwards}
.reaction-effect.tomato{animation-name:tomato-splat}
@keyframes reaction-pop{0%{opacity:0;transform:translate(-50%,35%) scale(.3) rotate(-16deg)}35%{opacity:1;transform:translate(-50%,-50%) scale(1.25) rotate(8deg)}75%{opacity:1;transform:translate(-50%,-65%) scale(1)}100%{opacity:0;transform:translate(-50%,-100%) scale(.8)}}
@keyframes tomato-splat{0%{opacity:0;transform:translate(-160%,-130%) scale(.4) rotate(-25deg)}45%{opacity:1;transform:translate(-50%,-50%) scale(1.35) rotate(18deg)}70%{opacity:1;transform:translate(-50%,-50%) scale(.95)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.15)}}
@media(max-width:690px){.special-actions{left:-43px;top:17%;gap:7px}.special-action{width:38px;min-height:46px;border-radius:9px}.special-action span{font-size:18px;line-height:21px}.special-action small{font-size:8px}.side-arrow-left{left:6px}.side-arrow-right{right:6px}.side-arrow{top:51%;width:36px;height:48px}}
@media(prefers-reduced-motion:reduce){.reaction-effect.show{opacity:1;transform:translate(-50%,-50%);animation:none}}
/* Player identity artwork for the GPI snapshot; only matched illustrations use image assets. */
.card-art:not(.portrait){background:radial-gradient(circle at 50% 43%,#425c4c 0%,var(--portrait-color,#35564b) 35%,#182824 75%)!important}
.art-identity{font:700 clamp(95px,11vw,190px)/1 'Space Grotesk',sans-serif;letter-spacing:-.09em;color:#ebdab7;text-shadow:0 14px 30px #0007;z-index:1;transform:rotate(-7deg);border:2px solid #dfcfac50;border-radius:50%;width:min(48%,210px);aspect-ratio:1;display:grid;place-items:center;padding-right:.12em;box-shadow:0 0 0 16px #d7c19410,0 0 0 34px #d7c1940a}
.art-identity[hidden]{display:none}
.source-note{font-size:11px!important;line-height:1.5!important;color:#93a39e!important;margin-top:22px}
.source-note a{color:var(--mint);text-decoration:underline;text-underline-offset:3px}
.card-body h2{font-size:clamp(24px,2.5vw,39px);overflow-wrap:anywhere}
@media(max-width:690px){.art-identity{font-size:clamp(86px,22vw,145px)}.source-note{margin-top:12px}}