/* Снежноград: one terrain plane and a consistent winter interface. */
:root{--mint:#a5e5d6;--gold:#f4cf88;--ice:#c5e5f6;--ink:#f8f5ed;--radius:22px}
body{background:radial-gradient(ellipse at 10% 0, #1e4754 0,transparent 55%),linear-gradient(160deg,#0c2537,#121c37 75%)!important}
.topbar{background:rgba(13,35,50,.85);border-color:#91bccb44;box-shadow:0 6px 24px #03152030}
.brand .logo{background:#173e4b;border:1px solid #e6c58677;box-shadow:none;color:#f4cf88}
.brand b{letter-spacing:.01em}.brand small{color:#b3c6cc}
.primary{background:linear-gradient(#ffe2a7,#eaba65)!important;color:#312713!important;box-shadow:0 3px 0 #a67638,0 8px 22px #f4cf8830;border:1px solid #ffeac0!important}
.primary:hover{filter:brightness(1.06)}
.hero-card{position:relative;isolation:isolate;min-height:460px;border:1px solid #bfdfdc55;background:#0b293b!important;overflow:hidden;box-shadow:0 18px 46px #0005}
.hero-copy{position:relative;z-index:2;width:50%;padding:38px!important;background:linear-gradient(90deg,#072335dd,#0723358a 70%,transparent)}
.hero-copy h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(30px,4.2vw,49px);line-height:1.06;font-weight:700;letter-spacing:-.025em;color:#fff8e6;text-shadow:0 2px 8px #03111a88}
.hero-copy p{max-width:320px;color:#d0e1e6;line-height:1.65}.hero-copy .progress-block{max-width:300px;background:#09283bd9;border:1px solid #b7d0d533;box-shadow:none}
.hero-scene{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;background:none!important;overflow:hidden;z-index:0;opacity:1;transform:none!important}
.hero-scene>div:not(.menu-companions){display:none!important}.menu-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.menu-companions{position:absolute;bottom:10px;right:16px;height:220px;display:flex;align-items:flex-end;filter:drop-shadow(0 5px 8px #03121b99)}
.menu-companions img{height:100%;width:auto;max-width:none}.menu-companions img+img{height:93%;margin-left:-4px}
.season-badge{background:#113a49d9;color:#d0eee3;border-color:#8ccab466;box-shadow:none}
.feature-card,.season-pass-card{background:linear-gradient(140deg,#163949d9,#102c3dcc)!important;border-color:#a4c9ce33;box-shadow:0 5px 18px #00152333}
.city-entry-card{display:grid;grid-template-columns:210px 1fr auto;background:linear-gradient(110deg,#163c48,#122e41)!important;border-color:#accdcf44;overflow:hidden;padding:18px!important;gap:24px}
.city-entry-art::before{content:none!important}
.city-entry-art{position:relative;width:210px;height:154px;border-radius:16px;overflow:hidden;flex:none;background:#123445!important}.city-entry-art>span{display:none!important}.city-entry-art img{width:100%;height:100%;object-fit:cover;object-position:85% 65%}
.city-entry-copy h2{font-family:Georgia,serif;color:#fff4d6}.city-entry-copy small{color:#b9d9d5}.city-entry-copy p{color:#c3d8de}
.bottom-nav{background:#102c3fed!important;border-color:#a2cbd444;box-shadow:0 8px 28px #0005}.bottom-nav button.active{background:#376071!important;color:#fff5da;box-shadow:inset 0 0 0 1px #b4dbdf44}
.cw-stage{height:clamp(390px,calc(100dvh - 310px),780px);min-height:390px;max-height:none;border-radius:22px;border:1px solid #accdcf66;box-shadow:0 12px 34px #0005}
.cw-stage .city-world-v140{width:var(--ww,3600px)!important;height:var(--wh,1800px)!important;min-width:var(--ww,3600px)!important;min-height:var(--wh,1800px)!important;max-width:none!important;max-height:none!important;background:#d7e2ee!important;overflow:hidden;isolation:isolate}
.cw-ground{inset:0;background:#d8e2ed!important;filter:none!important}
.cw-terrain{position:absolute;inset:0;width:3600px!important;height:1800px!important;max-width:none!important;object-fit:fill;pointer-events:none;z-index:1}
.cw-streets{position:absolute;left:0;top:0;z-index:2;pointer-events:none}.cw-streets svg{display:block;max-width:none;width:3600px;height:1800px}.cw-streets [data-pad]{transition:opacity .5s}.cw-streets .occupied{opacity:0}
.cw-decor,.cw-landscape,.cw-actors{position:absolute;inset:0;z-index:auto;pointer-events:none}.cw-fx{z-index:4}
.cw-landscape .landmark{position:absolute;width:0;height:0;pointer-events:none}.landmark img{position:absolute;bottom:0;max-width:none;height:auto;filter:drop-shadow(0 3px 3px #31425c44)}
.land-lamp::before{content:'';position:absolute;left:-25px;top:-80px;width:50px;height:40px;background:radial-gradient(closest-side,#ffeabda6,transparent);pointer-events:none}
body[data-city-style] .cw-proj .cw-glow{display:block!important;left:-85px;top:-90px;width:170px;height:130px;opacity:calc(var(--glow)*.23);background:radial-gradient(closest-side,#ffe09ca6,transparent);mix-blend-mode:screen;z-index:-1}
.cw-proj.crown .cw-glow{animation:winterGlow 4s ease-in-out infinite}@keyframes winterGlow{50%{filter:brightness(1.25)}}
body[data-city-style='pack'] .cw-art.pk img.pk{filter:drop-shadow(2px 5px 4px #33435c30)}
.city-hotspot{z-index:4000!important;background:#17364ed9!important;border:1px solid #dfeceacc!important;box-shadow:0 3px 7px #102d3f55!important;scale:var(--hs,1)!important}.city-hotspot.locked{opacity:.5!important}.city-hotspot.selected{background:#375a5eed!important;border-color:#f4cf88!important}
.cw-zoom,.cw-fab{z-index:5000}.cw-fab{top:auto!important;bottom:10px!important;left:60px!important;right:10px!important;width:auto!important;justify-content:flex-end;gap:5px}.cw-fab .pill{background:#102e42eb!important;padding:9px 10px;font-size:11px}.cw-hint{left:60px!important;top:10px!important;bottom:auto!important;height:auto!important;max-width:calc(100% - 75px);background:#102e42d9!important}
.cw-zoom button{background:#102e42e8;border-color:#b5d3dc66}.cw-goal{background:linear-gradient(110deg,#1b4953,#183b4c);border-color:#9abfc455}.city-district-bar{flex-wrap:nowrap;overflow:auto;scrollbar-width:thin;padding-bottom:5px;gap:7px}.city-district-bar .pill{white-space:nowrap;background:#163d4c}.city-district-bar .pill.active{background:#38616c;border-color:#b5d3dc66}
.actor.hero.walking .spr{animation:none!important;transform:scaleX(var(--dir,1));transform-origin:0 100%}.actor.npc.npc-action .spr{animation:npcWork .65s ease-in-out 3}@keyframes npcWork{50%{transform:translateX(-50%) scaleX(var(--dir,1)) rotate(-4deg) translateY(-3px)}}
.npc-rig{display:block;position:relative;width:42px}.npc-rig img{position:absolute;left:50%;bottom:0;transform:translateX(-50%);height:100%;width:auto;max-width:none}.npc-rig .npc-body{clip-path:inset(0 0 18% 0);z-index:2}.npc-rig .npc-foot-l{clip-path:inset(68% 50% 0 0);transform-origin:50% 72%}.npc-rig .npc-foot-r{clip-path:inset(68% 0 0 50%);transform-origin:50% 72%}.actor.npc.walking .spr{animation:none}.walking .npc-rig .npc-body{animation:npcBob .65s ease-in-out infinite}.walking .npc-rig .npc-foot-l{animation:npcFoot .65s ease-in-out infinite}.walking .npc-rig .npc-foot-r{animation:npcFoot .65s ease-in-out -.325s infinite}@keyframes npcBob{50%{transform:translateX(-50%) translateY(-.6px)}}@keyframes npcFoot{0%,100%{transform:translateX(-50%) rotate(-4deg)}50%{transform:translateX(-50%) rotate(4deg)}75%{transform:translateX(-50%) translateY(-1px)}}
body[data-city-style='clean'] .cw-proj .cw-plot{display:block}
.cw-workdust{display:none}.cw-proj.pop .cw-workdust{display:block;position:absolute;left:-60px;top:-85px;width:120px;height:100px;border-radius:50%;background:radial-gradient(closest-side,#fff0b1b0,transparent);animation:workDust .9s ease-out both;pointer-events:none}@keyframes workDust{to{transform:translateY(-50px) scale(1.8);opacity:0}}
.cw-sheet{z-index:6000;background:#15384bf5!important;border-color:#b1d1d466!important}.cw-thumb-art.pack-preview{display:flex!important;align-items:center;justify-content:center;padding:10px;width:100%;height:100%}.pack-thumb{display:block!important;width:auto!important;height:auto!important;max-height:170px!important;max-width:100%!important}.cw-thumb-art[hidden]{display:none!important}
.modal-card{background:linear-gradient(140deg,#1b4051,#102e40)!important;border-color:#accdcf66}.hpick-card{background:#1a4056;border-color:#a9cbd744}
@media(max-width:680px){
  .hero-card{min-height:500px}.hero-copy{width:100%;padding:25px!important;background:linear-gradient(#08283acc 0%,#08283a9a 60%,transparent)}.hero-copy h1{max-width:300px;font-size:36px}.hero-copy p{max-width:250px;font-size:14px}.hero-copy .big{min-width:165px}.hero-copy .progress-block{max-width:230px;margin-top:14px}.menu-art{object-position:65% center}.menu-companions{height:155px;right:10px;bottom:8px}
  .city-entry-card{grid-template-columns:1fr;gap:14px}.city-entry-art{width:100%;height:145px}.city-entry-copy{width:100%}.city-entry-card>.primary{grid-column:auto;width:100%}
  .cw-stage{height:calc(100dvh - 305px);min-height:380px}.cw-title h2{font-size:25px}.cw-fab{left:8px!important;right:8px!important;justify-content:center;flex-wrap:wrap;bottom:8px!important}.cw-fab .pill{padding:7px 8px;font-size:10px}.cw-hint{font-size:10px}.city-district-bar .pill{padding:8px 12px}.cw-goal{border-radius:15px}
}
@media(prefers-reduced-motion:reduce){.cw-proj *,.actor *,.landmark *{animation:none!important}.cw-streets [data-pad]{transition:none}}
body.perf-low .land-lamp::before{display:none}
.cw-fx{z-index:auto;pointer-events:none}.cw-fx .cw-light{font-size:9px;text-shadow:0 0 9px var(--c);opacity:.9}.cw-fx .cw-smoke{opacity:.38}
.actor.hero .hr,.npc-rig img{image-rendering:auto;backface-visibility:hidden}.actor .shadow{opacity:.32!important;filter:blur(1px)}.actor.hero .hr-bub{bottom:130px}
.actor.npc.npc-action[data-job='musician'] .spr{animation:npcMusic .5s ease-in-out 4}.actor.npc.npc-action[data-job='courier'] .spr{animation:npcDeliver .65s ease-in-out 3}
@keyframes npcMusic{50%{transform:translateX(-50%) scaleX(var(--dir,1)) rotate(4deg)}}@keyframes npcDeliver{50%{transform:translateX(-50%) scaleX(var(--dir,1)) translateY(-5px)}}
.land-homes img{filter:drop-shadow(1px 4px 3px #40537130)}
.cw-stage.cw-over .city-world-v140{margin-inline:auto}
@media(min-width:681px){.hero-copy{width:58%;padding:32px!important}.hero-copy h1{font-size:43px}.hero-copy h1>br{display:none}.hero-card{min-height:460px}}
body[data-screen='cityScreen'] .bottom-nav{position:relative;inset:auto!important;transform:none!important;width:calc(100% - 24px)!important;margin:18px auto 0}
@media(max-width:680px){.cw-top{gap:8px}.cw-title{flex:1;min-width:0}.cw-title h2{font-size:24px!important}.cw-title small{font-size:8px;letter-spacing:.08em}.cw-progress{flex:0 0 64px;min-width:64px;margin-left:0}.cw-progress b{font-size:10px}}
@media(prefers-reduced-motion:reduce){.actor.npc.npc-action .spr{animation:none!important}}
.city-project-card img{object-fit:contain!important;background:#dce8ef;padding:5px}
[data-rink] .rink-finish{opacity:0;transition:opacity .6s}[data-rink].rink-built .rink-finish{opacity:1}
.cw-stage{overflow:visible!important;margin-bottom:58px}
.cw-stage.cw-over{height:auto!important;min-height:0!important;aspect-ratio:4/3}
#cityViewport{border-radius:inherit}
.cw-terrain,.cw-streets svg{width:4800px!important;height:3600px!important}
.cw-fab{bottom:-50px!important;left:0!important;right:0!important;justify-content:center}
.cw-fab{max-width:100%!important}
.cw-fab .pill{margin-left:0}
body[data-screen='cityScreen'] #app{padding-bottom:24px}
body[data-screen='cityScreen'] main{padding-bottom:0!important}
.city-pond{pointer-events:auto;cursor:pointer}
.actor.hero .hr-bub{bottom:45px;width:32px;height:32px;margin-left:-16px;border-width:2px}
.actor.hero .shadow,.actor.npc .shadow{width:16px!important;height:5px!important;left:-8px!important}
.npc-rig{width:24px}
.actor.hero .hr{--A:1.1px;--L:1.4px}
.actor.hero.walking .hr .up{animation-name:cityHeroBob}
@keyframes cityHeroBob{0%,50%,100%{transform:translateY(0) rotate(-.4deg)}25%,75%{transform:translateY(-.6px) rotate(.4deg)}}
.hpick-card .hc-fig .hr{zoom:2.8!important}
.actor.pet .spr{scale:.6;transform-origin:50% 100%}.actor.gift .spr{font-size:17px}
.land-lamp::before{top:-68px}
body[data-screen='gameScreen']{background:linear-gradient(#08233155,#07192c88),url('../assets/city/match3_winter_v3.png') center/cover fixed!important}
#gameScreen .winter-village-bg{display:none!important}
.game-head,.hud-card,.level-tip{background:#123749e8!important;border-color:#b6d2d555!important;box-shadow:0 6px 18px #041c2f40}
.board-wrap{background:linear-gradient(150deg,#315c6fe8,#153c51ef)!important;border-color:#c6e4eccc!important;box-shadow:0 16px 45px #02152488,0 0 0 5px #8ac9d333,inset 0 1px #e3f5f566!important}
.board-plaque{background:#173f52e8!important;color:#fff0cb!important;border-color:#c5d9d577!important}
@media(max-width:680px){.cw-stage{margin-bottom:80px}.cw-fab{bottom:-70px!important}.game-head{border-radius:18px}.board-wrap{border-radius:22px!important}.level-tip{font-size:11px!important}}
@media(max-width:680px){body[data-screen='gameScreen']{background-position:85% center!important}}
.npc-atlas{overflow:hidden;isolation:isolate}.npc-atlas img.npc-frames{left:0;bottom:0;width:600%;height:100%;transform:none;max-width:none;clip-path:none;animation:none}
.actor.npc.walking .npc-atlas .npc-frames{animation:npcCycle var(--stride,.72s) steps(4,end) infinite}
@keyframes npcCycle{from{transform:translateX(-16.666667%)}to{transform:translateX(-83.333333%)}}
.actor.npc.npc-action .npc-atlas .npc-frames{left:0;transform:translateX(-83.333333%);animation:none}
.actor.npc.npc-action:has(.npc-atlas) .spr{animation:none;transform:translateX(-50%) scaleX(var(--dir,1))}
.actor.npc.npc-action .npc-atlas{animation:npcTask 1.2s ease-in-out infinite}
@keyframes npcTask{50%{transform:translateY(-1px) rotate(-2deg)}}
.actor.hero .hr-bub{bottom:58px}
.actor.npc .bub{bottom:50px!important;font-size:11px;min-width:70px;max-width:150px}
@media(prefers-reduced-motion:reduce){.actor.npc.walking .npc-atlas .npc-frames{animation:none;left:0}.actor.npc.npc-action .npc-atlas{animation:none}}
#modal{z-index:20000!important;isolation:isolate}body:has(#modal:not(.hidden)) .cw-fab,body:has(#modal:not(.hidden)) .cw-zoom{visibility:hidden;pointer-events:none}
.modal-card{max-height:calc(100dvh - 36px)!important;overflow-y:auto;scrollbar-gutter:stable}
.land-homes,.land-homes>img{pointer-events:auto!important;cursor:pointer}.home-dress svg{max-width:none}.home-dress[data-level='3']{animation:yardLights 3s ease-in-out infinite}@keyframes yardLights{50%{opacity:.7}}
.city-lights-off .home-dress{opacity:.2!important;animation:none!important}.city-lights-off .land-lamp::before,.city-lights-off .cw-light{display:none!important}
.city-offscreen{visibility:hidden!important;pointer-events:none!important}.city-offscreen *{animation-play-state:paused!important}
.yard-card{padding:16px;margin:12px 0;background:#153b4d;border:1px solid color-mix(in srgb,var(--yard-color),transparent 65%);border-radius:16px}.yard-card h3{margin:0;color:var(--yard-color)}.yard-card p{margin:8px 0}.yard-stage{display:flex;justify-content:space-between;align-items:center;gap:12px}.yard-stage small{color:#b8d5d6}.yard-card button{font-size:12px;padding:10px}
.hero-actions{display:grid;gap:12px;margin:20px 0}.hero-actions button{text-align:left;padding:16px}.actor.hero,.actor.hero .hr{pointer-events:auto;cursor:pointer}
#renderQuality{max-width:185px;background:#173e50;color:#f6ebd1;border:1px solid #a2cbd455;border-radius:9px;padding:8px;font:inherit;font-size:12px}
body[data-quality='fast'] .landmark img{filter:none}.cw-over .npc-atlas .npc-frames{animation:none!important}
@media(max-width:680px){.cw-fab{flex-wrap:wrap}.cw-stage{margin-bottom:106px}.cw-fab{bottom:-96px!important}.yard-stage{align-items:flex-start;flex-direction:column;gap:5px}.yard-card .modal-actions{gap:6px}.yard-card button{font-size:11px}}
@media(prefers-reduced-motion:reduce){.home-dress{animation:none!important}}

.santa-sky{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:9000;border-radius:inherit}
.santa-fly{width:clamp(250px,32vw,390px);height:auto;aspect-ratio:3/1;z-index:1;touch-action:manipulation}
.santa-fly .sf-in{width:100%;height:100%;filter:drop-shadow(0 4px 5px #28446e55);animation:sfFloatV4 1.8s ease-in-out infinite}
.sf-art{display:block;width:100%;height:100%;object-fit:contain;max-width:none;pointer-events:none}
.santa-fly.to-right{animation:santaRightV4 11s linear forwards}.santa-fly.to-left{animation:santaLeftV4 11s linear forwards}
@keyframes santaRightV4{from{transform:translateX(-440px)}to{transform:translateX(calc(var(--sw,400px) + 30px))}}
@keyframes santaLeftV4{from{transform:translateX(calc(var(--sw,400px) + 30px))}to{transform:translateX(-440px)}}
@keyframes sfFloatV4{50%{translate:0 -4px;rotate:-.6deg}}
.santa-fly::before{top:65%;height:3px;width:140px;filter:blur(1px);opacity:.55}.santa-fly.to-right::before{left:-120px}.santa-fly.to-left::before{right:-120px}
.sf-bub{font-size:12px;bottom:calc(100% - 10px);left:25%;white-space:nowrap;background:#123849e8;color:#fff0c9;border-color:#f7d78b88}
.santa-fly[data-claimed] .sf-bub{opacity:.55}
.sf-spark{position:absolute;inset:50% auto auto -15px;width:6px;height:6px;background:#ffe4a0;box-shadow:0 0 8px #ffcf63;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);animation:sfSpark 1.1s linear infinite;animation-delay:var(--delay)}
.santa-fly.to-left .sf-spark{left:auto;right:-15px}.sf-spark:nth-of-type(2){top:70%}.sf-spark:nth-of-type(3){top:35%}
@keyframes sfSpark{to{translate:calc(var(--dir,1)*-95px) 14px;opacity:0;scale:.4}}
@media(max-width:680px){.santa-fly{width:250px}.sf-bub{font-size:10px}}
@media(prefers-reduced-motion:reduce){.santa-fly .sf-in,.sf-spark{animation:none}.sf-spark{display:none}}

.sf-wave{transform-box:view-box;transform-origin:176px 113px;animation:sfHandWave 3.2s ease-in-out infinite}@keyframes sfHandWave{0%,8%,58%,100%{transform:rotate(0)}18%,38%{transform:rotate(-16deg)}28%,48%{transform:rotate(14deg)}}
@media(prefers-reduced-motion:reduce){.sf-wave{animation:none}}

/* All map views share the same seasonal assets and measured foundations. */
.cw-proj.pack-model .cw-plot{scale:1!important;display:block!important}
.cw-proj.pack-model .cw-frost,.cw-proj.pack-model .cw-glow{display:none!important}
body[data-city-style="pads"] .cw-proj.pack-model .cw-lot{background:#cad1cb;box-shadow:inset 0 0 0 2px #9fafa7,0 2px 2px #20393422}
.cw-proj.pack-model[data-p="harbor"] .cw-lot,.cw-proj.pack-model[data-p="bridge_of_lights"] .cw-lot{display:none!important}

/* Close controls stay inside a reserved header, independent of dialog scrolling. */
.modal-card{display:flex;flex-direction:column;max-height:min(88dvh,820px)!important;padding:0!important;overflow:hidden!important;scrollbar-gutter:auto}
.modal-tools{display:flex;justify-content:flex-end;align-items:center;flex:0 0 auto;padding:12px 14px 0;min-height:56px}
#modalContent{min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;padding:12px 24px 24px}
#modalContent>h2:first-child{margin:0 0 14px}
.modal-close,.cw-close{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0!important;line-height:1;border-radius:14px;border:1px solid #b9d6d455;background:linear-gradient(145deg,#426272dd,#284752ee)!important;color:#fff0ce;box-shadow:inset 0 1px 0 #ffffff18,0 3px 8px #051c292a;transform:none!important;cursor:pointer}
.modal-tools .modal-close{position:static;inset:auto;font-size:0;width:44px;height:44px}
.modal-close svg,.cw-close svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.modal-close:hover,.cw-close:hover{background:linear-gradient(145deg,#587989,#355969)!important;border-color:#ecd49d99}
.modal-close:focus-visible,.cw-close:focus-visible{outline:2px solid #f4d38a;outline-offset:3px}
.cw-close{top:12px;right:12px;z-index:21;font-size:0}
.cw-sheet-main{padding-right:54px;min-height:44px}
@media(max-width:559px){.modal{padding:12px}.modal-card{max-height:calc(100dvh - 24px)!important;border-radius:24px}.modal-tools{padding:10px 12px 0;min-height:54px}#modalContent{padding:10px 16px 20px}}

.modal-tools .modal-close svg{width:20px;height:20px}
#modalContent{scrollbar-color:#829fa8 #173a4a;scrollbar-width:thin}
#modalContent::-webkit-scrollbar{width:8px}
#modalContent::-webkit-scrollbar-track{background:#173a4a;border-radius:8px}
#modalContent::-webkit-scrollbar-thumb{background:#829fa8;border-radius:8px;border:2px solid #173a4a}


/* Whole citizen poses keep both feet attached; the shared city loop selects frames. */
.npc-whole svg{display:block;overflow:hidden;pointer-events:none}.actor.npc:has(.npc-whole) .spr{animation:none!important;transform:translateX(-50%) scaleX(var(--dir,1))}.npc-whole{animation:none!important}

/* Speech occupies screen space, never changes actor depth or covers character silhouettes. */
.cw-speech{position:absolute;inset:0;z-index:18000;pointer-events:none;overflow:hidden}
.cw-speech>.bub{position:absolute;bottom:auto;transform:none!important;animation:speechFade .15s ease;max-width:180px;width:max-content;min-width:0;white-space:normal;overflow-wrap:break-word;font:700 11px/1.35 system-ui;padding:6px 9px;box-sizing:border-box;text-align:center;border-radius:10px;box-shadow:0 3px 9px #15384438}
.cw-speech>.bub[hidden]{display:none!important}.cw-speech>.bub:after{left:var(--bubble-tail,50%)}
.cw-speech>.bub[data-tail="top"]:after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:white}
.cw-speech>.bub[data-tail="left"]:after{left:auto;right:100%;top:50%;margin-left:0;margin-top:-5px;border-top-color:transparent;border-right-color:white}
.cw-speech>.bub[data-tail="right"]:after{left:100%;top:50%;margin-left:0;margin-top:-5px;border-top-color:transparent;border-left-color:white}
.city-dialogue{margin:10px 0;padding:10px 14px;border-radius:14px;background:#123747;border:1px solid #b4d2cf66;color:#ecf2e6;font:13px/1.45 system-ui}.city-dialogue[hidden]{display:none!important}.city-dialogue>div{display:flex;gap:10px;padding:3px 0}.city-dialogue b{min-width:120px;color:#f5dba0}
.npc-help-prop{position:absolute;width:24px;height:24px;margin-left:-12px;margin-top:-24px;pointer-events:none;animation:helpLift 1.25s ease-in-out 2}.npc-help-prop svg{display:block;width:100%;height:100%}.help-broom{animation:helpSweep .65s ease-in-out 4;transform-origin:50% 100%}.help-flowers,.help-water{animation:helpPour 1.3s ease-in-out 2;transform-origin:50% 80%}
@keyframes helpLift{0%,100%{transform:translateY(0)}45%,70%{transform:translateY(-10px)}}@keyframes helpSweep{0%,100%{transform:rotate(-15deg)}50%{transform:rotate(15deg)}}@keyframes helpPour{0%,100%{transform:rotate(0)}40%,70%{transform:rotate(18deg)}}
@media(max-width:600px){.city-dialogue>div{display:block}.city-dialogue b{display:block;min-width:0}}

/* Whole-pose pets have no separate limb animation. */
.animal-whole{display:block;overflow:hidden;flex:none}.animal-whole image{pointer-events:none}

/* Explicit city views; all keep the same geometry, art and interactive targets. */
body[data-weather-effects="off"] .snow,body[data-weather-effects="off"] #citySnow,body[data-weather-effects="off"] .sf-spark{display:none!important;animation:none!important}
body[data-city-style="clean"] .city-hotspot b,body[data-city-style="clean"] .city-hotspot small,body[data-city-style="clean"] .cw-spot small,body[data-city-style="clean"] #cwSpeech{visibility:hidden!important}
body[data-city-style="models"] .actor.npc,body[data-city-style="models"] #cwSpeech,body[data-city-style="models"] .npc-help-prop{visibility:hidden!important}
body[data-city-style="pads"] .cw-proj.pack-model .cw-lot{display:block!important;outline:2px dashed #957947;outline-offset:-5px;background:linear-gradient(135deg,#e3d5b9cc,#b7b5a3cc)!important}
body[data-city-style="pads"] .cw-proj.pack-model[data-p="harbor"] .cw-lot,body[data-city-style="pads"] .cw-proj.pack-model[data-p="bridge_of_lights"] .cw-lot{display:none!important}
.city-view-options{display:grid;gap:10px}.city-view-option{position:relative;display:grid;gap:5px;text-align:left;padding:16px 48px 16px 16px;border-radius:16px;border:1px solid #8fb4ba55;background:#244c5c}.city-view-option small{line-height:1.4;color:#bfd4d7}.city-view-option span{position:absolute;right:18px;top:18px}.city-view-option.selected{border-color:#eac989;background:#365769}.city-view-option:focus-visible{outline:2px solid #f2dba2;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.snow,#citySnow,.sf-spark{display:none!important;animation:none!important}}
body[data-city-style="clean"] .city-hotspot::before{display:none!important}
/* Compact level header: hidden boss meter must not turn moves into a full-width grid cell. */
.game-head{display:flex!important;align-items:center;gap:12px;padding:4px 0;background:transparent!important;border:0!important;box-shadow:none!important}
.game-head .back{flex:0 0 44px;height:44px;border:1px solid #c8e2e43d;background:#153849dd}
.game-head .level-title,.game-head .moves{flex:0 0 90px;padding:8px 12px;border-radius:18px;background:linear-gradient(145deg,#204c5de8,#143441ec);border:1px solid #c8e2e440;box-shadow:0 4px 12px #081e3040}
.game-head .moves{margin-left:auto}
.game-head .boss-meter{flex:1;min-width:0;max-width:480px;gap:10px;padding:8px 12px;border-radius:16px;background:#123749b8}
.game-head .boss-meter .progress{height:9px}
@media(max-width:560px){.game-head{gap:8px}.game-head .level-title,.game-head .moves{flex-basis:72px;padding:6px 8px}.game-head .back{flex-basis:38px;height:38px}.game-head .boss-meter{padding:8px 6px;gap:6px}}
/* Невысокое окно (фрейм ВК/ОК ~700px): hero не выталкивает карточки главной под плавающую навигацию */
@media(max-height:780px){
  body[data-screen='homeScreen'] .hero-card{min-height:clamp(330px,calc(100vh - 335px),460px)!important;padding-bottom:22px!important}
  body[data-screen='homeScreen'] .hero-copy{padding-top:20px!important;padding-bottom:16px!important}
  body[data-screen='homeScreen'] .hero-copy h1{font-size:clamp(30px,5.2vh,43px)!important}
}
/* Плашка, которую Netlify подмешивает на бесплатных сайтах: в игре она закрывает навигацию */
#nl-badge-frame,#nl-hud-frame{display:none!important}

/* Основной скролл страницы: тонкий, в цвет интерфейса; не передаёт прокрутку во внешнюю страницу (ВК/ОК) */
html{scrollbar-width:thin;scrollbar-color:#6fb9d3 #0a1c33;overscroll-behavior:contain;scroll-padding-bottom:110px}
body{overscroll-behavior:contain}
html::-webkit-scrollbar{width:10px;height:10px}
html::-webkit-scrollbar-track{background:linear-gradient(90deg,#07152a,#0d2540);border-left:1px solid #ffffff10}
html::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#8fd6e8,#4f9db9 55%,#e3b866);border-radius:10px;border:2px solid #0a1c33;min-height:48px}
html::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#b6ecf7,#6cc0dc 55%,#f3cd80)}
/* нижняя плашка-подсказка: за плавающим меню видно, что список продолжается */
body[data-screen='homeScreen'] #homeScreen{padding-bottom:130px}

/* Экран уровня: поле целиком помещается в высоту окна (фрейм ВК/ОК, ноутбуки) — верх поля ≈ 190px от верха окна */
@media(min-width:681px){
  body[data-screen='gameScreen'] .board-wrap{max-width:min(620px,max(280px,calc(100vh - 244px)))!important}
}
@media(min-width:681px) and (max-height:780px){
  body[data-screen='gameScreen'] #app,body[data-screen='gameScreen'] main{padding-bottom:0!important}
  body[data-screen='gameScreen'] #gameScreen{padding-bottom:0!important}
}

/* Главная на широком невысоком окне (ВК ~911x700): две колонки — hero слева, карточки справа, без прокрутки */
@media(min-width:800px) and (max-height:780px){
  body[data-screen='homeScreen'] #homeScreen{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);grid-auto-rows:min-content;column-gap:12px;row-gap:10px;align-content:start;padding-bottom:52px}
  body[data-screen='homeScreen'] #app,body[data-screen='homeScreen'] main{padding-bottom:0!important}
  body[data-screen='homeScreen'] #homeScreen>*{margin:0!important;min-width:0}
  body[data-screen='homeScreen'] #homeScreen>.hero-card{grid-column:1;grid-row:1/span 5;min-height:0!important;height:auto;align-self:stretch}
  body[data-screen='homeScreen'] #homeScreen>:not(.hero-card){grid-column:2}
  body[data-screen='homeScreen'] .hero-copy{width:68%!important;padding:22px!important}
  body[data-screen='homeScreen'] .hero-copy h1{font-size:clamp(28px,4.4vh,36px)!important;max-width:none}
  body[data-screen='homeScreen'] .hero-copy p{max-width:none!important;font-size:13px}
  body[data-screen='homeScreen'] .cards-row{gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))!important}
  body[data-screen='homeScreen'] .cards-row .feature-card{padding:10px 6px;min-height:0;flex-direction:column;justify-content:center;text-align:center;gap:4px;min-width:0}
  body[data-screen='homeScreen'] .cards-row .feature-card>em{display:none}
  body[data-screen='homeScreen'] .cards-row .feature-card b{font-size:12px;line-height:1.15}
  body[data-screen='homeScreen'] .cards-row .feature-card small{font-size:10px;line-height:1.15}
  body[data-screen='homeScreen'] .cityEntryCard .city-entry-art,body[data-screen='homeScreen'] #cityEntryCard .city-entry-art{display:none}
  body[data-screen='homeScreen'] #cityEntryCard{grid-template-columns:1fr!important;padding:12px 14px;gap:8px}
}

/* Уровни на широком невысоком окне: 20 уровней страницы в 2 ряда по 10 — без прокрутки */
@media(min-width:800px) and (max-height:780px){
  body[data-screen='mapScreen'] .level-map{grid-template-columns:repeat(10,minmax(0,1fr))!important;gap:10px!important;align-content:start}
  body[data-screen='mapScreen'] #app,body[data-screen='mapScreen'] main{padding-bottom:0!important}
  body[data-screen='mapScreen'] #mapScreen{padding-bottom:48px}
}

/* Город на невысоком окне: карта ужимается так, чтобы нижнее меню оставалось на экране */
@media(min-width:681px) and (max-height:780px){
  body[data-screen='cityScreen'] #cityScreen{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);column-gap:12px;align-content:start}
  body[data-screen='cityScreen'] #cityScreen>.cw-top{grid-column:1;grid-row:1;margin:0;align-self:center}
  body[data-screen='cityScreen'] #cityScreen>#cwGoal{grid-column:2;grid-row:1;margin:0 0 8px}
  body[data-screen='cityScreen'] #cityScreen>#cityDistrictBar{grid-column:1/3;grid-row:3;align-self:start;z-index:8;margin:8px 10px 0!important;padding:4px 6px 4px!important;background:rgba(9,26,44,.62);backdrop-filter:blur(6px);border-radius:16px;pointer-events:auto}
  body[data-screen='cityScreen'] #cityScreen>#cwStage{grid-column:1/3;grid-row:3}
  body[data-screen='cityScreen'] .cw-stage .cw-zoom{top:62px!important}
  body[data-screen='cityScreen'] .cw-stage .cw-hint,body[data-screen='cityScreen'] #cwHint{top:56px!important}
  body[data-screen='cityScreen'] .cw-stage,body[data-screen='cityScreen'] .cw-stage.cw-over{height:calc(100dvh - 252px)!important;min-height:230px!important;aspect-ratio:auto!important;max-height:none!important;margin-bottom:0!important}
  body[data-screen='cityScreen'] .cw-stage>.cw-fab{top:auto!important;bottom:8px!important;left:8px!important;right:8px!important;margin:0!important;z-index:6}
  body[data-screen='cityScreen'] .cw-stage>.cw-fab button{background:rgba(9,26,44,.78)!important;backdrop-filter:blur(6px)}
  body[data-screen='cityScreen'] .bottom-nav{margin-top:10px!important}
  body[data-screen='cityScreen'] #app,body[data-screen='cityScreen'] main{padding-bottom:0!important}
  body[data-screen='cityScreen'] #cityScreen{padding-bottom:6px}
}

/* Лишние 10px прокрутки: отступ сверху + min-height:100vh у контейнера */
@media(min-width:681px) and (max-height:780px){
  body #app{min-height:calc(100vh - 10px)!important;min-height:calc(100dvh - 10px)!important}
}

/* Мини-игры и окна в невысоком окне (фрейм ВК/ОК ~700px): всё помещается без прокрутки */
@media(max-height:780px){
  #modal .modal-card{max-height:calc(100dvh - 20px)!important}
  #modal .modal-tools{position:absolute;top:8px;right:8px;padding:0!important;height:0;z-index:6}
  #modal #modalContent{padding:10px 18px 14px!important}
  .mini-heading{padding:8px 56px 8px 12px!important;gap:10px!important;margin-bottom:6px!important}
  #modal #modalContent>h2,#modal #modalContent>h3:first-child{padding-right:48px}
  .mini-heading>.mini-icon{width:40px!important;height:40px!important;flex-basis:40px!important}
  .mini-heading h2{font-size:19px!important}
  .mini-heading small,.mini-heading p{font-size:12px!important}
  .mini-session{padding:4px 10px!important;margin:4px 0!important}
  .mg-msg,#pzMsg{padding:8px!important;margin-top:6px!important}
  .mg-grid.mem{grid-template-columns:repeat(4,minmax(0,62px))!important;grid-auto-rows:70px!important;grid-template-rows:none!important;gap:8px!important;padding:12px!important}
  .mg-grid.mem>*{height:70px!important;min-height:0!important}
}
@media(max-height:660px){
  .mini-heading>.mini-icon{display:none!important}
  .mini-heading small,.mini-heading p{display:none!important}
  .mg-field{height:clamp(170px,calc(100dvh - 330px),300px)!important}
  .mg-lights{padding:10px!important;gap:10px!important;grid-template-columns:repeat(2,minmax(0,84px))!important}
  .mg-lights .lt{height:84px!important;width:auto!important}
  .mg-grid.mem{grid-template-columns:repeat(4,minmax(0,54px))!important;grid-auto-rows:58px!important;gap:6px!important;padding:8px!important}
  .mg-grid.mem>*{height:58px!important}
  .mg-q,.wd{padding:12px!important}.mg-q h3{font-size:17px!important;padding:4px 0!important}
  #modal #modalContent{padding:8px 14px 10px!important}
}

/* «Лови находки»: подсказка и корзина, чтобы было понятно, как играть */
.mg-howto{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);z-index:4;text-align:center;font-weight:800;font-size:17px;line-height:1.5;color:#fff6dc;background:#0b2a3bd9;border:1px solid #e3c98a88;border-radius:16px;padding:12px 18px;pointer-events:none;box-shadow:0 8px 24px #0006;transition:opacity .5s,transform .5s}
.mg-howto small{display:block;font-size:13px;font-weight:600;color:#ffc9b8}
.mg-howto.gone{opacity:0;transform:translate(-50%,-62%)}
.mg-basket{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);z-index:3;font-size:44px;line-height:1;filter:drop-shadow(0 4px 4px #0008);pointer-events:none}
.mg-basket.bump{animation:mgBump .22s ease-out}
@keyframes mgBump{0%{transform:translateX(-50%) scale(1)}45%{transform:translateX(-50%) scale(1.22)}100%{transform:translateX(-50%) scale(1)}}

/* ===== Телефоны (touch-lite: тач-экран или узкое окно) ===== */
/* Мерцание моделей в «Городе»: сотни крупных картинок с drop-shadow и размытие под движущейся картой перегружают GPU телефона */
html.touch-lite .cw-art,html.touch-lite .cw-art img,html.touch-lite .cw-art.pk img.pk.ov,html.touch-lite .cw-art.pk .tw img.od,
html.touch-lite .cw-site,html.touch-lite .cw-site.pk img.st,html.touch-lite .cw-dc img,html.touch-lite .landmark img,html.touch-lite .land-homes img,
html.touch-lite .npc .spr img.pn,html.touch-lite .hero .spr img.pn,html.touch-lite .actor.pet .spr svg,html.touch-lite .ws-ship img,
html.touch-lite body[data-city-style="models"] .cw-art,html.touch-lite body[data-city-style='pack'] .cw-art.pk img.pk,html.touch-lite .df-i{filter:none!important}
html.touch-lite .cw-site.pk img.st.ice{filter:hue-rotate(165deg) saturate(1.8) brightness(1.15)!important}
html.touch-lite .cw-stage,html.touch-lite .cw-stage *{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* Главная на телефоне: hero ниже, мягкая подложка под текстом, три компактные карточки */
@media(max-width:480px){
  body[data-screen='homeScreen'] .hero-card{min-height:0!important;padding-bottom:18px!important}
  body[data-screen='homeScreen'] .hero-copy{width:100%!important;padding:18px!important;border-radius:24px;background:linear-gradient(180deg,#08283aea 0%,#08283ab0 100%)!important}
  body[data-screen='homeScreen'] .hero-copy h1{font-size:28px!important;max-width:none!important;line-height:1.12}
  body[data-screen='homeScreen'] .hero-copy p{font-size:13px!important;max-width:none!important;line-height:1.45}
  body[data-screen='homeScreen'] .hero-copy .progress-block{max-width:none!important}
  body[data-screen='homeScreen'] .menu-companions{height:96px!important;right:10px!important;bottom:6px!important}
  body[data-screen='homeScreen'] .cards-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
  body[data-screen='homeScreen'] .cards-row .feature-card{padding:10px 6px!important;min-height:0!important;flex-direction:column;justify-content:center;text-align:center;gap:4px;min-width:0}
  body[data-screen='homeScreen'] .cards-row .feature-card>em{display:none}
  body[data-screen='homeScreen'] .cards-row .feature-card b{font-size:12px;line-height:1.15}
  body[data-screen='homeScreen'] .cards-row .feature-card small{font-size:10px;line-height:1.15}
  body[data-screen='homeScreen'] #cityEntryCard .city-entry-art{display:none}
  body[data-screen='homeScreen'] #cityEntryCard{grid-template-columns:1fr!important;padding:14px!important;gap:10px}
}

/* Real basket artwork remains inside the catch field at desktop and phone sizes. */
.catch-field .mg-basket{display:block;width:84px;height:70px;bottom:10px;opacity:1;font-size:0;line-height:0;overflow:visible;filter:drop-shadow(0 3px 3px #08263888)}
.catch-field .mg-basket img{display:block;width:100%;height:100%;max-width:none;object-fit:contain;opacity:1}
.catch-field .mg-howto small{display:flex;align-items:center;justify-content:center;gap:5px;flex-wrap:wrap}
.catch-field .mg-howto small svg{display:inline-block;width:25px;height:25px;flex:none}
.catch-field .mg-fall{animation-name:catchFall}
@keyframes catchFall{from{top:-52px}to{top:var(--catch-floor,332px)}}
@media(max-width:480px){.catch-field .mg-basket{width:76px;height:64px;bottom:8px}.catch-field .mg-howto{width:calc(100% - 50px);font-size:15px;padding:10px}}

/* Catalogue previews are large enough to inspect each model. */
.decor-item{grid-template-columns:72px minmax(0,1fr) auto;gap:8px;min-height:76px}
.decor-item .tr-sw img.dc{width:66px;height:66px}
.decor-item .tr-name{min-width:0;overflow-wrap:anywhere}
@media(max-width:480px){.decor-item{grid-template-columns:58px minmax(0,1fr) auto;padding:8px;gap:7px}.decor-item .tr-sw img.dc{width:54px;height:58px}.decor-item button{padding:9px 10px;font-size:12px}}

/* ===== Магазин: особые коллекции за голоса/ОКи и их карточки (разметка — game.js premiumShopHtml/showPremium, превью — city_premium.js) ===== */
.shop-sub{margin:16px 0 6px;font-size:16px}
.premium-store{margin-top:14px}
.premium-store>h3{margin:6px 0 2px;font-size:17px}
.premium-store>p{margin:0 0 10px;font-size:12px;opacity:.75}
.premium-card{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;margin-bottom:9px;border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.04));border:1px solid rgba(243,205,128,.38)}
.premium-card.owned{border-color:rgba(127,224,165,.65);background:linear-gradient(145deg,rgba(44,106,90,.38),rgba(255,255,255,.05))}
.premium-card-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:26px;background:radial-gradient(circle at 30% 25%,#ffe9b0,#d79c3c 72%);box-shadow:inset 0 0 0 2px rgba(255,255,255,.4),0 3px 8px rgba(0,0,0,.35)}
.premium-card h4{margin:0 0 2px;font-size:15px;line-height:1.2}
.premium-card p{margin:0 0 3px;font-size:12px;line-height:1.35;opacity:.85}
.premium-card small{font-weight:800;color:#ffd98a;font-size:12px}
.premium-card button{white-space:nowrap}
.premium-detail{display:flex;flex-direction:column;gap:10px}
.premium-detail>h2{margin:0}
.premium-detail>p{margin:0;opacity:.88;line-height:1.45}
.premium-eyebrow{letter-spacing:.14em;font-size:11px;color:#f1d29c;font-weight:800}
.premium-controls{display:flex;flex-wrap:wrap;gap:8px}
.premium-controls button{flex:1 1 170px}
.premium-controls:empty{display:none}
.premium-styles{display:flex;flex-wrap:wrap;gap:6px;width:100%}
.premium-owned{margin:0;color:#8ff0b4;font-weight:800}
.premium-price{font-size:20px;font-weight:900;color:#ffd98a;text-align:center}
.premium-note{margin:0;font-size:12px;opacity:.75;text-align:center}
.premium-decor-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.premium-decor-preview figure{margin:0;padding:8px 4px 6px;border-radius:14px;background:rgba(255,255,255,.08);display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.premium-decor-preview img{height:84px;width:auto;max-width:100%;object-fit:contain}
.premium-decor-preview figcaption{font-size:11px;line-height:1.2;opacity:.88}
.premium-hero-preview{display:flex;align-items:flex-end;justify-content:center;gap:12px;padding:10px;border-radius:16px;background:rgba(255,255,255,.08)}
.premium-hero-preview svg{height:140px;width:auto;max-width:34%}
.premium-hero-preview img{height:92px;width:auto}
.premium-train-preview{display:flex;align-items:flex-end;justify-content:center;gap:8px;padding:14px 10px;border-radius:16px;background:rgba(255,255,255,.08)}
.premium-train-preview img{height:72px;width:auto;max-width:48%;object-fit:contain}
.premium-piece-preview{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;padding:10px;border-radius:16px;background:rgba(11,42,59,.6)}
.premium-gem{display:block;width:100%;height:auto}
@media(max-width:480px){.premium-card{grid-template-columns:44px minmax(0,1fr)}.premium-card button{grid-column:1/3}.premium-card-icon{width:44px;height:44px}.premium-decor-preview img{height:70px}}
@media(max-height:660px){.premium-decor-preview img{height:58px}.premium-hero-preview svg{height:100px}.premium-hero-preview img{height:70px}.premium-train-preview img{height:54px}.premium-piece-preview{padding:6px;gap:4px}}