.village-game{
  --ink:#0b1d15;--panel:#10271d;--lime:#c7f45d;--cream:#fff3d3;--gold:#f2c44d;
  min-height:100vh;background:#07150f;color:var(--cream);
  background-image:radial-gradient(circle at 18% 0,rgba(62,133,79,.24),transparent 34%);
}
.village-game button{font:inherit}.game-hud{position:sticky;z-index:50;top:0;min-height:72px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:8px max(18px,calc((100vw - 1320px)/2));border-bottom:1px solid #ffffff1d;background:#07150fe8;backdrop-filter:blur(16px)}.game-brand{text-decoration:none}.hud-stats{display:flex;align-items:center;padding:5px;border:1px solid #ffffff20;border-radius:14px;background:#ffffff0a}.hud-stat{min-width:78px;display:grid;grid-template-columns:auto auto;align-items:center;justify-content:center;column-gap:5px;padding:5px 12px;border-right:1px solid #ffffff16}.hud-stat:last-child{border:0}.hud-stat>span{color:var(--gold);font-size:.68rem;font-weight:950}.hud-stat strong{font-size:.85rem}.hud-stat small{grid-column:1/-1;color:#819d8d;font-size:.42rem;font-weight:900;letter-spacing:.08em}.hud-actions{justify-self:end;display:flex;align-items:center;gap:.65rem}.hud-actions button,.hud-actions a{padding:.65rem .85rem;border:1px solid #607c6c;border-radius:8px;background:#193a2b;color:#fff;text-decoration:none;font-size:.57rem;font-weight:950;text-transform:uppercase;letter-spacing:.04em;cursor:pointer}.hud-actions button{border-color:#bfe654;background:var(--lime);color:#152117}
.game-shell{max-width:1320px;margin:auto;padding:clamp(1.2rem,3vw,2.6rem) clamp(10px,3vw,30px)}.map-heading{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:1.15rem}.map-kicker{margin:0;color:#afe76a;font-size:.58rem;font-weight:950;letter-spacing:.13em}.map-heading h1{margin:.3rem 0 0;font-size:clamp(2.5rem,5vw,5rem);line-height:.9;letter-spacing:-.06em}.map-heading>p{max-width:390px;margin:0;padding:.85rem 1rem;border:1px solid #ffffff1c;border-radius:12px;background:#ffffff08;color:#bdcdc3;font-size:.7rem}.tap-icon{font-size:1.15rem;margin-right:.35rem}
.game-board{position:relative;overflow:hidden;border:1px solid #729165;border-radius:25px;background:#173326;box-shadow:0 35px 90px #0009}.map-toolbar{height:44px;display:flex;align-items:center;gap:.5rem;padding:0 1rem;background:linear-gradient(90deg,#10291e,#183927);font-size:.56rem;text-transform:uppercase;letter-spacing:.05em}.map-toolbar strong{color:#d7e7dd}.live-dot{width:7px;height:7px;border-radius:50%;background:#8ef36a;box-shadow:0 0 0 5px #8ef36a1c}.draft-badge{margin-left:auto;padding:.3rem .55rem;border-radius:99px;background:#c5f4631b;color:var(--lime);font-weight:950}
.map-viewport{position:relative;aspect-ratio:16/9;overflow:hidden;background:#56874c;isolation:isolate;touch-action:pan-y}.world-track{position:absolute;z-index:0;inset:0;width:300%;height:100%;display:flex;transition:transform .68s cubic-bezier(.22,.8,.2,1);will-change:transform}.world-track.show-district-0{transform:translateX(0)}.world-track.show-district-1{transform:translateX(-33.333333%)}.world-track.show-district-2{transform:translateX(-66.666667%)}.district-slide{position:relative;width:33.333333%;height:100%;flex:0 0 33.333333%;overflow:hidden}.map-art{position:absolute;z-index:0;inset:0;width:100%;height:100%;object-fit:cover}.map-viewport:after{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(7,21,15,.08),transparent 55%,rgba(7,21,15,.18))}
.world-ambient{position:absolute;z-index:2;inset:0;overflow:hidden;pointer-events:none}.water-glint{position:absolute;width:7%;height:1.4%;border-radius:50%;background:linear-gradient(90deg,transparent,#dffcff,transparent);filter:blur(1px);opacity:.25;animation:water-shine 3.2s ease-in-out infinite}.glint-one{right:1%;top:42%}.glint-two{right:5%;top:49%;animation-delay:1.1s}.glint-three{right:0;top:57%;animation-delay:2.1s}.flying-bird{position:absolute;z-index:2;color:#203528;font-size:clamp(.75rem,1.6vw,1.35rem);font-weight:950;text-shadow:0 2px 5px #fff8;animation:bird-flight 13s linear infinite}.bird-one{left:-6%;top:11%}.bird-two{left:-12%;top:19%;animation-delay:5.7s;animation-duration:17s;transform:scale(.72)}.floating-leaf{position:absolute;color:#f4b542;font-size:clamp(.45rem,.9vw,.8rem);filter:drop-shadow(0 3px 2px #0004);animation:leaf-drift 7s ease-in-out infinite}.leaf-one{left:16%;top:24%}.leaf-two{left:58%;top:18%;animation-delay:2.4s}.leaf-three{left:76%;top:35%;animation-delay:4.5s}.lot-free .availability-marker{animation:available-pulse 2.2s ease-in-out infinite}
.lot{--x:0%;--y:0%;--w:24%;--h:30%;position:absolute;z-index:5;left:var(--x);top:var(--y);width:var(--w);height:var(--h);padding:0;border:0;background:transparent;cursor:pointer}.lot[data-lot="gatto"]{--x:6%;--y:18%;--w:27%;--h:35%}.lot[data-lot="free-c"]{--x:36%;--y:5%;--w:28%;--h:35%}.lot[data-lot="free-a"]{--x:66%;--y:9%;--w:28%;--h:33%}.lot[data-lot="free-d"]{--x:69%;--y:45%;--w:26%;--h:36%}.lot[data-lot="free-b"]{--x:3%;--y:44%;--w:32%;--h:36%}.lot[data-lot="square"]{--x:36%;--y:51%;--w:30%;--h:40%}.lot-glow{position:absolute;inset:2%;border:3px solid transparent;border-radius:28% 18% 26% 20%;background:transparent;transition:.22s}.lot-free .lot-glow{border-color:#ffe26d99;box-shadow:inset 0 0 0 4px #f2c44d22,0 0 20px #f2c44d33;background:#f6d34814}.lot:hover .lot-glow,.lot:focus-visible .lot-glow,.lot.is-selected .lot-glow{border-color:#fff8c4;box-shadow:inset 0 0 0 5px #c7f45d66,0 0 30px #c7f45d99;background:#c7f45d12}.lot:focus-visible{outline:0}.lot.is-selected{z-index:9}.map-label,.availability-marker,.community-marker{position:absolute;z-index:3;left:50%;bottom:4%;transform:translateX(-50%);display:flex;align-items:center;gap:.48rem;min-width:max-content;padding:.36rem .62rem;border:2px solid #ffffffd9;border-radius:99px;background:#0b211de8;color:#fff;box-shadow:0 7px 16px #0008;backdrop-filter:blur(7px);transition:.2s}.lot:hover .map-label,.lot:hover .availability-marker,.lot:hover .community-marker,.lot.is-selected .map-label,.lot.is-selected .availability-marker,.lot.is-selected .community-marker{transform:translateX(-50%) translateY(-5px)}.map-label img,.mini-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;background:#e76744;display:grid;place-items:center;color:#fff;font-size:.5rem;font-weight:950}.map-label>span:last-child,.availability-marker>span,.community-marker>span{display:flex;flex-direction:column;text-align:left}.map-label b,.availability-marker strong,.community-marker strong{font-size:.58rem;line-height:1.1}.map-label small,.availability-marker small,.community-marker small{margin-top:.15rem;color:#c9ec90;font-size:.4rem;font-weight:900;letter-spacing:.04em}.availability-marker{border-color:#ffe26d;background:#183424ef}.availability-marker>b{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:var(--gold);color:#1e260e;font-size:1.2rem;box-shadow:0 0 0 5px #f2c44d28}.community-marker{border-color:#e9da8c}.community-marker>b{font-size:1.45rem}
.player-token{--px:52%;--py:49%;position:absolute;z-index:20;left:var(--px);top:var(--py);transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;pointer-events:none;transition:left .72s cubic-bezier(.2,.8,.2,1),top .72s cubic-bezier(.2,.8,.2,1)}.player-token>div{width:64px;height:64px;display:grid;place-items:center;overflow:hidden;border:5px solid #fff;border-radius:50%;background:#e85f3b;color:#fff;font-size:.95rem;font-weight:950;box-shadow:0 0 0 5px var(--lime),0 15px 20px #0008;animation:token-bob 1.7s ease-in-out infinite}.player-token img{width:100%;height:100%;object-fit:cover}.player-token>b{margin-top:8px;padding:.26rem .55rem;border:2px solid #fff;border-radius:99px;background:#0d211cef;color:#fff;font-size:.5rem;box-shadow:0 4px 10px #0007}.player-token.is-moving>div{animation:token-hop .35s ease-in-out infinite alternate}
.arrival-card{position:absolute;z-index:35;left:50%;top:50%;width:min(430px,86%);transform:translate(-50%,-50%);padding:1.5rem;border:1px solid #dff69366;border-radius:20px;background:linear-gradient(150deg,#102a20f5,#071710f5);box-shadow:0 28px 80px #000c;backdrop-filter:blur(15px);transition:.28s}.arrival-card.is-hidden{opacity:0;visibility:hidden;transform:translate(-50%,-46%) scale(.97)}.arrival-close{position:absolute;right:12px;top:10px;width:34px;height:34px;border:1px solid #ffffff26;border-radius:50%;background:#ffffff0a;color:#fff;font-size:1.25rem;cursor:pointer}.arrival-kicker{color:#b9ed65;font-size:.5rem;font-weight:950;letter-spacing:.12em}.arrival-card h2{margin:.55rem 0 .7rem;font-size:clamp(1.7rem,3vw,2.6rem);line-height:1;letter-spacing:-.04em}.arrival-card h2 span{color:var(--lime)}.arrival-card p{margin:0;color:#b9cbc0;font-size:.72rem;line-height:1.55}.arrival-primary{width:100%;min-height:52px;margin-top:1.15rem;border:0;border-radius:9px;background:var(--lime);color:#152218;font-size:.65rem;font-weight:950;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 6px 0 #507d2e;cursor:pointer}
.action-dock{position:relative;z-index:25;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;margin:-32px 28px 0;padding:1rem 1.2rem;border:1px solid #7b986c;border-radius:17px;background:#0c241af5;box-shadow:0 18px 45px #0009;backdrop-filter:blur(12px)}.selected-badge{width:58px;height:58px;display:grid;place-items:center;border-radius:14px;background:#214735;color:var(--lime);font-size:1.55rem}.action-copy small{color:#9ed768;font-size:.47rem;font-weight:950;letter-spacing:.1em}.action-copy h2{margin:.2rem 0;font-size:1.3rem}.action-copy p{margin:0;color:#91a99b;font-size:.66rem}.action-buttons{display:flex;gap:.5rem}.action-buttons button{min-height:45px;padding:0 .85rem;border:1px solid #607b6b;border-radius:8px;background:#1b3b2c;color:#fff;font-size:.56rem;font-weight:950;text-transform:uppercase;cursor:pointer}.action-buttons .primary-action{border-color:#c5f463;background:var(--lime);color:#152117;box-shadow:0 5px 0 #4d792d}.action-buttons .buy-action{border-color:#f2c34a;background:#f2c34a;color:#211707;box-shadow:0 5px 0 #89651d}
.simple-loop{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:1rem;margin-top:1.2rem;padding:1.1rem 1.5rem;border:1px solid #ffffff18;border-radius:16px;background:#ffffff06}.simple-loop>div{display:flex;align-items:center;gap:.7rem}.simple-loop>div>b{width:33px;height:33px;display:grid;place-items:center;border-radius:50%;background:#244837;color:#c5f463}.simple-loop span{display:flex;flex-direction:column}.simple-loop strong{font-size:.66rem}.simple-loop small{color:#7f9b8a;font-size:.52rem}.simple-loop>i{width:34px;height:2px;background:#405e4d}.game-toast{position:fixed;z-index:60;left:50%;bottom:22px;max-width:90vw;padding:.85rem 1rem;border:1px solid var(--lime);border-radius:9px;background:#112a20;color:#fff;font-size:.7rem;font-weight:850;box-shadow:0 18px 50px #000a;opacity:0;transform:translate(-50%,90px);transition:.25s}.game-toast.is-visible{opacity:1;transform:translate(-50%,0)}.game-footer{max-width:1320px;margin:auto;padding:1.6rem clamp(14px,3vw,30px);display:flex;justify-content:space-between;border-top:1px solid #ffffff12;color:#708a7b;font-size:.6rem}.game-footer a{color:#9ab0a2}
@keyframes token-bob{50%{transform:translateY(-6px)}}@keyframes token-hop{to{transform:translateY(-10px) scale(1.04)}}@keyframes water-shine{0%,100%{opacity:.08;transform:translateX(-22px) scaleX(.65)}50%{opacity:.72;transform:translateX(20px) scaleX(1.18)}}@keyframes bird-flight{0%{transform:translate(-8vw,0) scale(.75);opacity:0}8%{opacity:.8}48%{transform:translate(52vw,-22px) scale(1)}88%{opacity:.75}100%{transform:translate(112vw,8px) scale(.78);opacity:0}}@keyframes leaf-drift{0%,100%{transform:translate(0,0) rotate(0);opacity:0}15%{opacity:.85}50%{transform:translate(20px,30px) rotate(170deg)}85%{opacity:.75}100%{transform:translate(-8px,68px) rotate(360deg);opacity:0}}@keyframes available-pulse{0%,100%{box-shadow:0 7px 16px #0008,0 0 0 0 #ffe26d00}50%{box-shadow:0 7px 16px #0008,0 0 0 9px #ffe26d32}}
@media(max-width:850px){.game-hud{grid-template-columns:1fr auto}.hud-stats{grid-row:2;grid-column:1/-1;justify-self:center}.hud-actions{grid-column:2}.map-heading{align-items:flex-start;flex-direction:column;gap:.85rem}.action-dock{grid-template-columns:auto 1fr;margin-inline:10px}.action-buttons{grid-column:1/-1}.action-buttons button{flex:1}.simple-loop{grid-template-columns:1fr}.simple-loop>i{display:none}}
@media(max-width:600px){.game-brand .brand-name{font-size:.65rem}.hud-actions a{display:none}.hud-actions button{font-size:0}.hud-actions button:after{content:"CONDIVIDI";font-size:.52rem}.hud-stat{min-width:0;padding-inline:9px}.game-shell{padding-top:1rem}.map-heading>p{font-size:.62rem}.map-toolbar{overflow:hidden}.map-toolbar strong{display:none}.map-viewport{aspect-ratio:4/5}.map-art{width:178%;max-width:none;left:50%;transform:translateX(-50%)}.arrival-card{position:fixed;top:52%;width:min(390px,88vw)}.action-dock{grid-template-columns:1fr;margin-top:-18px}.selected-badge{display:none}.action-buttons{display:grid;grid-template-columns:1fr}.simple-loop{padding:1rem}.game-footer{flex-direction:column;gap:.4rem}}
@media(prefers-reduced-motion:reduce){.lot-glow,.map-label,.availability-marker,.community-marker,.player-token,.arrival-card,.game-toast{transition:none}.player-token>div,.world-ambient *,.lot-free .availability-marker{animation:none}}
.district-status{margin-left:auto;padding:.3rem .55rem;border:1px solid #ffffff1c;border-radius:99px;color:#afc5b7;font-size:.48rem;font-weight:900}.draft-badge{margin-left:0}.lot[data-lot="expansion"]{--x:83%;--y:71%;--w:15%;--h:25%}.expansion-marker{position:absolute;z-index:3;right:0;bottom:2%;display:flex;align-items:center;gap:.42rem;min-width:max-content;padding:.38rem .58rem;border:2px solid #f2c44d;border-radius:10px;background:#10251ef2;color:#fff;box-shadow:0 8px 18px #0009;transform:rotate(-3deg)}.expansion-marker>b{font-size:1rem}.expansion-marker>span{display:flex;flex-direction:column;text-align:left}.expansion-marker strong{font-size:.5rem}.expansion-marker small{margin-top:.12rem;color:#efd477;font-size:.38rem;font-weight:900}.expansion-gate.is-open .expansion-marker{border-color:var(--lime)}.expansion-gate.is-open .expansion-marker b{font-size:0}.expansion-gate.is-open .expansion-marker b:after{content:"✓";font-size:1rem;color:var(--lime)}
.world-nav{position:absolute;z-index:30;top:43%;width:48px;height:68px;border:1px solid #fff6;border-radius:14px;background:#092018d9;color:#fff;font-size:2.25rem;line-height:1;cursor:pointer;box-shadow:0 12px 28px #0009;backdrop-filter:blur(9px);transition:.2s}.world-nav:hover{background:#c7f45d;color:#112017;transform:scale(1.04)}.world-nav:disabled{opacity:.22;cursor:default;transform:none}.world-prev{left:14px}.world-next{right:14px}.district-pager{position:absolute;z-index:31;left:50%;bottom:12px;transform:translateX(-50%);display:flex;gap:6px;padding:5px;border:1px solid #ffffff38;border-radius:12px;background:#071b14d9;box-shadow:0 9px 24px #0008;backdrop-filter:blur(10px)}.district-pager button{min-width:128px;padding:.4rem .65rem;border:0;border-radius:8px;background:transparent;color:#91a99b;cursor:pointer;text-align:left}.district-pager button.is-current{background:#c7f45d;color:#142219}.district-pager b,.district-pager small{display:block}.district-pager b{font-size:.48rem;text-transform:uppercase}.district-pager small{margin-top:2px;font-size:.4rem;font-weight:900}.district-preview-card{position:absolute;z-index:8;left:50%;top:45%;width:min(440px,70%);transform:translate(-50%,-50%);padding:1.35rem;border:1px solid #dcf38b99;border-radius:18px;background:linear-gradient(145deg,#102a20f3,#071710ed);color:#fff;box-shadow:0 25px 70px #000b;backdrop-filter:blur(12px);text-align:center}.district-preview-card>span{color:#c7f45d;font-size:.48rem;font-weight:950;letter-spacing:.13em}.district-preview-card h2{margin:.45rem 0;font-size:clamp(1.8rem,4vw,3.2rem);line-height:.9;letter-spacing:-.05em}.district-preview-card p{margin:.55rem 0;color:#c0d0c6;font-size:.68rem}.district-preview-card strong{display:block;color:#fff3d3;font-size:.57rem;line-height:1.45}.district-preview-card small{display:block;margin-top:.45rem;color:#abc4b4;font-size:.48rem}.capacity-meter{height:9px;margin-top:.85rem;overflow:hidden;border-radius:99px;background:#ffffff1d}.capacity-meter i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f2c44d,#c7f45d);transition:width .35s}.capacity-meter .meter-0{width:0}.capacity-meter .meter-1{width:12.5%}.capacity-meter .meter-2{width:25%}.capacity-meter .meter-3{width:37.5%}.capacity-meter .meter-4{width:50%}.capacity-meter .meter-5{width:62.5%}.capacity-meter .meter-6{width:75%}.capacity-meter .meter-7{width:87.5%}.capacity-meter .meter-8{width:100%}.future-zone{border-color:#8ee2e599}.future-zone>span{color:#8ee2e5}
@media(max-width:600px){.world-nav{top:40%;width:38px;height:58px;font-size:1.8rem}.world-prev{left:7px}.world-next{right:7px}.district-pager{bottom:8px;max-width:calc(100% - 18px);overflow:auto}.district-pager button{min-width:106px;padding:.36rem .5rem}.district-preview-card{top:42%;width:76%;padding:1rem}.district-preview-card h2{font-size:1.9rem}.district-preview-card p{font-size:.6rem}.lot .map-label,.lot .availability-marker,.lot .community-marker{transform:translateX(-50%) scale(.82)}.lot:hover .map-label,.lot:hover .availability-marker,.lot:hover .community-marker,.lot.is-selected .map-label,.lot.is-selected .availability-marker,.lot.is-selected .community-marker{transform:translateX(-50%) translateY(-4px) scale(.82)}.player-token>div{width:52px;height:52px}}