/* V74 — clarity-first party-platformer pass. Inspired by bright toy-like, outlined party-game UI. */
:root{
 --v74-sky:#78d8e8;--v74-sky2:#bfeef2;--v74-grass:#8fc76a;--v74-cream:#fff4c9;
 --v74-ink:#33494b;--v74-coral:#e86f5d;--v74-yellow:#f5c94f;--v74-mint:#7dbb9a;--v74-blue:#5f9fb8;
}
body{background:#67c7da;color:var(--v74-ink)}
button,input{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}

/* Global game chrome: compact, playful and readable without covering the course. */
#app header{background:rgba(42,70,73,.74)!important;border:0!important;border-radius:0 0 12px 12px!important;box-shadow:none!important;color:#fff8dd!important;backdrop-filter:blur(5px)}
#scorebar{background:transparent!important;border:0!important;box-shadow:none!important}
.globalTools{z-index:120!important;gap:7px!important}
.toolIconBtn{background:rgba(47,75,77,.72)!important;border:2px solid rgba(255,248,221,.8)!important;box-shadow:0 3px 0 rgba(38,57,58,.35)!important;color:#fff7da!important}

/* Lobby roster is an overlay, not a white application panel. */
body.inLobby #app #info{background:rgba(34,67,70,.32)!important;border:0!important;box-shadow:none!important;backdrop-filter:blur(3px)!important;border-radius:10px!important;padding:6px!important}
body.inLobby #players .player{background:rgba(31,61,64,.42)!important;border:0!important;border-left:4px solid var(--player-color)!important;border-radius:7px!important;box-shadow:none!important;color:#fff7da!important}
body.inLobby #players .playerText b{color:#fff8dc!important;font-weight:900!important}
body.inLobby #players .playerText small{color:#d8f3e0!important}
body.inLobby #players .player>span{background:var(--v74-yellow)!important;color:#3b4b48!important;border:0!important}

/* Party box: 4 columns, up to 4 rows. Large object first, label second. */
.partyOverlay{background:linear-gradient(#76d3e5 0 68%,#a8d780 68% 100%)!important}
.partyBoard{width:min(860px,96vw)!important;max-height:96dvh!important;padding:16px 20px 24px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;overflow:hidden!important}
.partyBoardHead{flex:0 0 auto!important;align-self:center!important;background:var(--v74-cream)!important;color:var(--v74-ink)!important;border:3px solid #42595a!important;border-radius:14px!important;box-shadow:0 5px 0 #c79c43!important;padding:6px 18px!important;margin-bottom:10px!important}
.partyBoardHead h2,.partyBoardHead strong{font-size:clamp(16px,2.2vw,24px)!important;font-weight:1000!important;letter-spacing:-.04em!important}
.partyCards{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-auto-rows:minmax(86px,1fr)!important;gap:8px!important;width:100%!important;max-height:calc(96dvh - 78px)!important;background:#9f7247!important;border:4px solid #5d4535!important;border-radius:18px!important;padding:12px!important;box-shadow:inset 0 7px 0 #cf9c62,0 8px 0 #6e4e37!important;overflow:hidden!important}
.partyCards:before{display:none!important}
.partyPick,.partyPick:nth-child(n){min-height:0!important;height:auto!important;margin:0!important;padding:5px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;background:#f9e9b9!important;border:2px solid #4c5551!important;border-radius:11px!important;box-shadow:0 3px 0 #c28e48!important;transform:rotate(var(--tilt,0deg))!important;overflow:hidden!important}
.partyPick:nth-child(4n+1){--tilt:-.45deg}.partyPick:nth-child(4n+2){--tilt:.25deg}.partyPick:nth-child(4n+3){--tilt:-.2deg}.partyPick:nth-child(4n){--tilt:.45deg}
.partyPick img{width:min(112px,92%)!important;height:clamp(54px,9.8dvh,82px)!important;object-fit:contain!important;filter:drop-shadow(0 4px 0 rgba(51,65,61,.18))!important;flex:0 1 auto!important}
.partyPick>span:not(.partyCat){display:block!important;width:100%!important;max-width:none!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0 2px!important;text-align:center!important}
.partyPick strong{display:block!important;color:#344b4c!important;font-size:clamp(10px,1.35vw,14px)!important;line-height:1.05!important;font-weight:1000!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.partyPick small,.partyPick em,.partyCat,.partyLive{display:none!important}
.partyPick:not(:disabled):hover,.partyPick:not(:disabled):focus-visible{transform:translateY(-4px) rotate(var(--tilt,0deg))!important;background:#fff3c9!important}
.partyPick.mine,.partyPick.pending{outline:4px solid #ffe26d!important;filter:none!important}
.partyPick.taken{opacity:.28!important;filter:saturate(.5)!important}

/* Home: sky + two clean cards, less dashboard feel. */
#join.homeScreen{background:linear-gradient(#7fd7e7 0 68%,#a7d77f 68% 100%)!important;color:var(--v74-ink)!important}
.entryConsole,.roomShelf,.hallShelf{background:rgba(255,246,207,.84)!important;border:3px solid rgba(55,74,73,.78)!important;border-radius:15px!important;box-shadow:0 7px 0 rgba(67,82,72,.20)!important;backdrop-filter:blur(4px)!important}
.nameField input{background:#fffaf0!important;border:2px solid #5a6c68!important;box-shadow:none!important;color:#34484a!important}
.primaryBig{background:var(--v74-yellow)!important;color:#354847!important;border:3px solid #4b5b57!important;box-shadow:0 5px 0 #a77c31!important;border-radius:12px!important}
.roomCard{background:rgba(255,249,222,.72)!important;border:0!important;border-radius:9px!important;box-shadow:none!important}

/* Map selection remains deliberately simple. */
body.inLobby #mapGallery{background:transparent!important;border:0!important;box-shadow:none!important}
body.inLobby #mapGallery .mapBtn{background:rgba(255,246,207,.78)!important;border:2px solid rgba(56,78,76,.62)!important;box-shadow:none!important;border-radius:10px!important}
body.inLobby #mapGallery .mapBtn.chosen{outline:4px solid #f4ca4d!important;background:#fff4bd!important}

/* Settings and result panels use the same visual language. */
.settingsbox,.modernModal{background:#fff2c6!important;color:#354a4a!important;border:3px solid #44595a!important;border-radius:16px!important;box-shadow:0 8px 0 rgba(52,67,65,.28)!important}
.legacyScorePanel{background:rgba(255,243,196,.9)!important;border:3px solid #425a58!important;border-radius:16px!important;box-shadow:0 7px 0 #c99c43!important}

@media (max-height:560px),(max-width:820px){
 .partyBoard{padding:8px 10px 12px!important}
 .partyBoardHead{margin-bottom:6px!important;padding:3px 12px!important}
 .partyCards{gap:5px!important;padding:7px!important;grid-auto-rows:minmax(66px,1fr)!important;max-height:calc(96dvh - 55px)!important}
 .partyPick{padding:3px!important;border-width:1.5px!important;border-radius:8px!important}
 .partyPick img{height:clamp(48px,10dvh,62px)!important}
 .partyPick strong{font-size:clamp(9px,1.5vw,11px)!important}
 body.inLobby #app #info{width:min(235px,29vw)!important;padding:4px!important}
}
