/* Homepage details use the existing Exodia artwork and official Discord Wumpus. */
.modes { gap: 24px; }
.mode-card { padding: 0; overflow: hidden; }
.mode-content { display: flex; flex: 1; flex-direction: column; align-items: flex-start; width: 100%; padding: 30px; }
.mode-content .mode-icon { display: none; }
.mode-content > p { margin: 15px 0 20px; font-size: .9rem; line-height: 1.8; }
.mode-content .mode-features { gap: 9px; margin: 0 0 25px; }
.mode-features li { padding: 8px 10px; border: 1px solid #b2c9e515; border-radius: 4px; background: #030b1438; font-size: .72rem; }
.mode-content .btn-block { width: 100%; justify-content: space-between; }
.mode-scene { position: relative; isolation: isolate; width: 100%; height: 250px; overflow: hidden; background: radial-gradient(ellipse at 50% 70%, #70d75d2b, transparent 68%), linear-gradient(140deg, #142c29, #0d1b28); border-bottom: 1px solid #b2c9e51c; }
.mode-scene::before,.shop-rich::before,.discord-rich::before { content: ''; position: absolute; z-index: -1; inset: 0; background-image: linear-gradient(#ffffff05 1px, transparent 1px), linear-gradient(90deg, #ffffff05 1px, transparent 1px); background-size: 24px 24px; pointer-events: none; }
.scene-caption { position: absolute; top: 22px; left: 24px; font: 600 .65rem var(--font-mono); letter-spacing: .13em; color: #bde4c1; }
.scene-index { position: absolute; bottom: -24px; right: 12px; font: 900 7.5rem/1 'Montserrat',sans-serif; color: #ffffff04; z-index: -1; }
.block-build { position: absolute; width: 240px; height: 164px; left: 50%; top: 53px; transform: translateX(-50%); filter: drop-shadow(0 20px 12px #00000040); }
.build-block { position: absolute; width: 86px; height: 97px; }
.b1 { left: 34px; top: 16px; }.b2 { left: 114px; top: 16px; }.b3 { left: -6px; top: 40px; }.b4 { left: 74px; top: 64px; }.b5 { left: 154px; top: 40px; }
.scene-chip { position: absolute; padding: 7px 10px; border: 1px solid #b8dfc72b; background: #0b191cdd; border-radius: 4px; box-shadow: 0 5px 12px #00000020; color: #c4e7c6; font: 500 .65rem 'Poppins',sans-serif; }
.chip-left { left: 20px; bottom: 28px; transform: rotate(-4deg); }.chip-right { right: 18px; top: 85px; transform: rotate(4deg); }
.oneblock-scene { background: radial-gradient(ellipse at 50% 65%,#6151a43d,transparent 68%),linear-gradient(140deg,#152443,#141b30); }
.oneblock-scene .scene-caption,.oneblock-scene .scene-chip { color: #bdcaff; border-color: #a0aaff40; }
.oneblock-orbit { position: absolute; left: 50%; top: 45px; width: 240px; height: 200px; transform: translateX(-50%); }
.oneblock-orbit > span { position: absolute; inset: 45px 0 15px; border: 1px dashed #a0aaff45; border-radius: 50%; transform: rotate(-22deg); }
.island-block { position: absolute; width: 120px; height: 135px; left: 52px; top: 7px; filter: drop-shadow(0 24px 16px #00000050); transform: rotate(-6deg); }
.orbit-gem { position: absolute; width: 43px; right: 2px; bottom: 14px; transform: rotate(10deg); }
.oneblock-scene .chip-right { top: 78px; }
.shop-rich { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 1.15fr 1fr; gap: 30px; padding: 44px 48px; background: radial-gradient(ellipse at 80% 50%, #a67d1929,transparent 52%),linear-gradient(120deg,#172330,#222316); }
.shop-rich .shop-copy { position: relative; z-index: 1; }
.shop-rich h2 { margin: 18px 0; font-size: clamp(2rem,3.5vw,3.1rem); font-weight: 900; line-height: 1.13; text-shadow: var(--sh-text); }
.shop-rich h2 span { color: var(--ex-gold); }
.shop-rich h3 { margin: 0 0 12px; font-size: 1.05rem; }
.shop-rich .shop-copy p { max-width: 490px; }
.shop-perks { display: flex; flex-wrap: wrap; list-style: none; padding: 0; margin: 22px 0 28px; gap: 9px 16px; font-size: .72rem; }
.shop-perks span { color: var(--ex-gold); padding-right: 4px; }
.shop-scene { position: relative; min-width: 0; width: 100%; min-height: 320px; display: grid; place-items: center; }
.rank-showcase { width: min(100%,270px); padding: 22px; background: linear-gradient(150deg,#2f3943,#121b25); border: 1px solid #efd4836b; border-radius: 8px; box-shadow: 0 16px 0 -8px #09121d,0 18px 0 -7px #edb73855,0 30px 44px #00000044; text-align: center; transform: rotate(5deg); }
.rank-showcase-label { display: block; color: #e8c986; font: 600 .58rem var(--font-mono); letter-spacing: .15em; }
.rank-emblem { width: 122px; height: 122px; object-fit: contain; margin: 15px auto 7px; filter: drop-shadow(0 6px 8px #00000044); }
.rank-title { display: block; color: #e6efff; font: 800 1rem 'Montserrat',sans-serif; letter-spacing: .04em; }
.rank-title b { color: #ffd15c; padding: 4px 7px; background: #ffd15c12; border: 1px solid #ffd15c50; }
.item-slots { display: flex; justify-content: center; gap: 8px; margin-top: 22px; }
.item-slots > span { display: grid; place-items: center; width: 48px; height: 48px; background: #070f1dbb; border: 1px solid #e8c98640; box-shadow: inset 2px 2px 0 #00000055,inset -2px -2px 0 #ffffff0d; }
.item-slots img { width: 30px; height: 34px; }.slot-spark { color: #e8c986; font-size: 28px; }
.loot-tag { position: absolute; bottom: -6px; padding: 9px 16px; background: #edd08c; color: #322611; box-shadow: 0 4px 0 #9c782d; transform: rotate(-5deg); border-radius: 3px; font-size: .72rem; font-weight: 700; }
.scene-spark { position: absolute; color: var(--ex-gold); font-size: 32px; }.spark-one { left: 0; top: 65px; }.spark-two { right: 0; bottom: 45px; font-size: 21px; }
.discord-rich { isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 1.15fr 1fr; gap: 30px; padding: 40px 48px; text-align: left; background: radial-gradient(ellipse at 80% 80%,#6756c352,transparent 55%),linear-gradient(120deg,#1a2540,#242048); }
.discord-rich .section-kicker { display: inline-flex; align-items: center; gap: 9px; border-color: #b4b8ff40; background: #b4b8ff0b; }
.discord-rich .section-kicker img { width: 22px; height: 22px; }
.discord-rich h2 { font-size: clamp(1.8rem,3vw,2.5rem); line-height: 1.18; font-weight: 800; margin: 20px 0; }
.discord-rich h2 span { color: #c3bfff; }.discord-rich p { font-size: .88rem; margin: 0 0 26px; }
.discord-scene { position: relative; min-width: 0; align-self: center; min-height: 320px; }
.wumpus { position: absolute; z-index: 2; width: 260px; height: 260px; bottom: -6px; left: 50%; transform: translateX(-50%); }
.wumpus > svg { position: absolute; inset: 0; }.wumpus-fallback { position: absolute; width: 130px; height: 130px; inset: 70px auto auto 65px; opacity: .8; }
.wumpus.is-ready .wumpus-fallback { display: none; }
.wumpus-bubble { position: absolute; top: 0; right: 16px; z-index: 3; color: #292647; background: #eeeaff; padding: 12px 18px; border-radius: 12px 12px 12px 2px; transform: rotate(4deg); font-size: .9rem; font-weight: 700; box-shadow: 0 8px 16px #00000020; }
.wumpus-bubble span { color: #7768ce; }
.discord-channel { position: absolute; z-index: 3; color: #c7c8f7; font: 500 .7rem var(--font-mono); padding: 9px 12px; background: #242743e6; border: 1px solid #b4b8ff35; border-radius: 4px; }
.channel-one { left: 0; top: 90px; transform: rotate(-8deg); }.channel-two { right: 0; bottom: 30px; transform: rotate(7deg); }
.discord-scene-floor { position: absolute; width: 240px; height: 40px; left: 50%; bottom: 4px; transform: translateX(-50%); border-radius: 50%; background: #9e83ff20; box-shadow: 0 0 50px #ac8eff20; }
#hlasovani { padding-bottom: 25px; }
.vote { max-width: none; gap: 24px; }
.vote-dlazdice { overflow: hidden; padding: 28px; border-top: 3px solid var(--ex-cyan); background: radial-gradient(ellipse at 95% 0%,#49baff20,transparent 58%),linear-gradient(150deg,var(--bg-3),var(--bg-2)); }
.vote-gold { border-top-color: var(--ex-gold); background: radial-gradient(ellipse at 95% 0%,#ffd15c20,transparent 58%),linear-gradient(150deg,var(--bg-3),var(--bg-2)); }
.vote-card-top { display: flex; align-items: center; justify-content: space-between; min-height: 85px; margin-bottom: 6px; gap: 10px; }.vote-card-top img { width: 58px; height: 65px; transform: rotate(9deg); filter: drop-shadow(0 9px 8px #00000044); }
.vote-card-top .vote-number { margin: 0; font-size: .65rem; letter-spacing: .07em; }.vote-gold .vote-number { color: var(--ex-gold); }
.vote-dlazdice h3 { font-size: clamp(1.1rem,3vw,1.4rem); margin: 0 0 12px; overflow-wrap: anywhere; }
.vote-gold .btn-block { --button-top: #ffe596; --button-bottom: #edb738; --button-base: #896113; }
.leaderboard-section { padding-top: 38px; }
.leaderboard-heading-art { display: flex; justify-content: center; align-items: center; gap: 26px; margin-bottom: 22px; }.leaderboard-heading-art img { width: 50px; height: 56px; }.leaderboard-heading-art span { width: 75px; height: 1px; background: linear-gradient(90deg,transparent,#ffd15c55); }.leaderboard-heading-art span:last-child { transform: rotate(180deg); }
.leaderboard-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; margin-top: 34px; text-align: left; }
.leaderboard-card { --board-color: var(--ex-cyan); min-width: 0; padding: 25px; border: 1px solid #49baff30; border-radius: var(--r); background: linear-gradient(145deg,#15283c,#0c1725); }.board-gold { --board-color: var(--ex-gold); border-color: #ffd15c30; }
.leaderboard-title { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }.board-eyebrow { color: var(--board-color); font: 600 .62rem var(--font-mono); letter-spacing: .08em; }.leaderboard-title h3 { font-size: 1.13rem; margin: 8px 0 0; overflow-wrap: anywhere; }.board-period { color: var(--tx-2); font-size: .63rem; padding: 5px 8px; border: 1px solid var(--line); border-radius: 4px; }
.voter-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }.voter-row { display: grid; grid-template-columns: 24px 34px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid #b2c9e512; background: #040d1840; border-radius: 4px; min-width: 0; }.voter-row:first-child { padding-block: 18px; border-color: #ffd15c45; background: linear-gradient(110deg,#b1831920,#ffd15c05); }.voter-position { color: var(--tx-3); font: 700 .75rem var(--font-mono); }.voter-row:first-child .voter-position { color: var(--ex-gold); }.voter-avatar { width: 34px; height: 34px; border-radius: 3px; image-rendering: pixelated; background: #22384c; }.voter-name { min-width: 0; color: var(--tx-1); font-weight: 600; font-size: .8rem; overflow-wrap: anywhere; }.voter-count { text-align: right; font: 700 1.1rem 'Montserrat',sans-serif; color: var(--board-color); }.voter-count small { display: block; font: 400 .6rem 'Poppins',sans-serif; color: var(--tx-3); margin-top: 1px; }
.board-players { min-height: 315px; }.board-message { padding: 70px 20px; margin: 0; text-align: center; font-size: .85rem; color: var(--tx-2); }.board-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 18px; padding-top: 15px; border-top: 1px solid var(--line); font-size: .65rem; }.board-footer a { display: inline-flex; align-items: center; min-height: 36px; gap: 6px; }.board-updated { color: var(--tx-3); }.leaderboard-note { color: var(--tx-3); font-size: .73rem; max-width: 700px; margin: 24px auto 0; }
@media (max-width: 960px) { .shop-rich,.discord-rich { padding: 32px; gap: 15px; grid-template-columns: 1.15fr 1fr; }.channel-one { left: -10px; }.channel-two { right: -10px; }.scene-chip { font-size: .6rem; }.chip-left { left: 12px; }.chip-right { right: 12px; top: 175px; }.oneblock-scene .chip-right { top: 175px; } }
@media (max-width: 760px) { .mode-content { padding: 26px; }.mode-scene { height: 240px; }.shop-rich,.discord-rich { grid-template-columns: 1fr; padding: 30px; gap: 32px; }.shop-scene { width: min(100%,350px); justify-self: center; margin: 0 0 10px; }.discord-scene { width: min(100%,380px); justify-self: center; min-height: 300px; }.leaderboard-grid { grid-template-columns: 1fr; }.scene-chip { font-size: .65rem; }.chip-right,.oneblock-scene .chip-right { top: 85px; }.discord-rich h2 { max-width: 500px; } }
@media (max-width: 420px) { .mode-content,.vote-dlazdice { padding: 22px; }.mode-features { grid-template-columns: 1fr; }.mode-features li { font-size: .75rem; }.mode-scene { height: 230px; }.scene-caption { left: 18px; font-size: .59rem; }.scene-chip { font-size: .56rem; padding: 6px 8px; }.chip-right,.oneblock-scene .chip-right { top: 173px; }.chip-left { bottom: 23px; }.block-build { transform: translateX(-50%) scale(.85); top: 38px; }.oneblock-orbit { transform: translateX(-50%) scale(.9); top: 30px; }.shop-rich,.discord-rich { padding: 26px 22px; }.shop-rich h2 { font-size: 2rem; }.shop-scene { min-height: 320px; }.rank-showcase { width: 220px; padding: 18px; }.rank-emblem { width: 110px; height: 110px; }.scene-spark { font-size: 20px; }.discord-rich h2 { font-size: 1.7rem; }.wumpus-bubble { font-size: .78rem; right: 0; }.channel-one { left: -7px; top: 70px; }.channel-two { right: -6px; bottom: 15px; }.discord-channel { font-size: .59rem; }.leaderboard-card { padding: 18px 14px; }.voter-row { grid-template-columns: 20px 28px minmax(0,1fr) auto; gap: 8px; padding: 11px 8px; }.voter-avatar { width: 28px; height: 28px; }.voter-name { font-size: .71rem; }.voter-count { font-size: 1rem; } }
@media (hover:hover) and (prefers-reduced-motion:no-preference) { .mode-scene .block-build,.island-block,.rank-showcase { transition: transform .3s ease; }.mode-card:hover .block-build { transform: translateX(-50%) translateY(-5px); }.mode-card:hover .island-block { transform: translateY(-6px) rotate(-3deg); }.shop-rich:hover .rank-showcase { transform: rotate(2deg) translateY(-4px); } }

/* Three separate voting services and leaderboards. */
.vote,.leaderboard-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.vote-dlazdice { padding: 24px; }.vote-card-top .vote-number { font-size: .6rem; }.vote-card-top img { width: 46px; height: 52px; }.vote-dlazdice h3 { font-size: 1.15rem; }
.vote-green { border-top-color: var(--ex-grass); background: radial-gradient(ellipse at 95% 0%,#74d65e20,transparent 58%),linear-gradient(150deg,var(--bg-3),var(--bg-2)); }.vote-green .vote-number { color: var(--ex-grass); }.vote-green .btn-block { --button-top:#a0e98c; --button-bottom:#62b84a; --button-base:#2e6428; }
.board-green { --board-color: var(--ex-grass); border-color: #74d65e30; }.leaderboard-card { padding: 22px 18px; }.leaderboard-title { min-height: 77px; }.leaderboard-title h3 { font-size: 1.05rem; }.voter-row { padding-inline: 9px; gap: 8px; grid-template-columns: 20px 30px minmax(0,1fr) auto; }.voter-avatar { width: 30px; height: 30px; }.voter-name { font-size: .73rem; }.voter-count { font-size: 1rem; }
@media (max-width:1000px) { .vote,.leaderboard-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.vote > :last-child,.leaderboard-grid > :last-child { grid-column: 1 / -1; width: calc(50% - 9px); justify-self: center; } }
@media (max-width:760px) { .vote,.leaderboard-grid { grid-template-columns: 1fr; }.vote > :last-child,.leaderboard-grid > :last-child { grid-column: auto; width: 100%; }.leaderboard-title { min-height: 0; }.voter-name { font-size: .8rem; }.voter-row { gap: 10px; grid-template-columns: 24px 34px minmax(0,1fr) auto; }.voter-avatar { width: 34px; height: 34px; } }
@media (max-width:420px) { .leaderboard-card { padding: 18px 14px; }.voter-row { grid-template-columns: 20px 28px minmax(0,1fr) auto; gap: 8px; padding: 11px 8px; }.voter-avatar { width: 28px; height: 28px; }.voter-name { font-size: .71rem; } }