:root { --night:#10141d; --cream:#f5efe3; --atlas:#ff704d; --nita:#54d8e8; --glass:rgba(16,20,29,.72); }
* { box-sizing:border-box; }
html,body { width:100%; height:100%; min-height:100%; margin:0; overflow:hidden; background:var(--night); color:var(--cream); font-family:"DM Sans",sans-serif; overscroll-behavior:none; }
button { font:inherit; }
.game-hub { position:fixed;z-index:50;inset:0;display:flex;flex-direction:column;min-height:100dvh;padding:clamp(20px,3vw,42px) clamp(20px,5vw,72px) 24px;overflow:auto;isolation:isolate;background:linear-gradient(135deg,#070b12 0%,#0d1520 52%,#080b12 100%);transition:opacity .45s ease,visibility .45s ease; }
.game-hub.hidden { opacity:0;visibility:hidden;pointer-events:none; }
.game-hub:before { content:"";position:absolute;z-index:-2;inset:0;opacity:.16;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,black,transparent 82%); }
.game-hub:after { content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(7,11,18,.92),transparent 23%,transparent 77%,rgba(7,11,18,.75));pointer-events:none; }
.hub-glow { position:absolute;z-index:-1;width:48vw;height:48vw;border-radius:50%;filter:blur(100px);opacity:.13;pointer-events:none; }.hub-glow-one{left:-20vw;top:-26vw;background:var(--nita)}.hub-glow-two{right:-22vw;bottom:-34vw;background:var(--atlas)}
.hub-header { display:flex;align-items:center;justify-content:space-between;gap:20px; }
.hub-brand { display:flex;align-items:center;gap:12px;color:var(--cream);font:800 .72rem "Manrope",sans-serif;letter-spacing:.15em;text-decoration:none; }.hub-brand b{color:var(--nita)}
.hub-brand-mark { position:relative;display:block;width:34px;height:34px;border:1px solid rgba(84,216,232,.4);border-radius:11px;transform:rotate(45deg);box-shadow:inset 0 0 16px rgba(84,216,232,.1),0 0 24px rgba(84,216,232,.08); }.hub-brand-mark i{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--nita);box-shadow:0 0 10px var(--nita)}.hub-brand-mark i:first-child{left:6px;bottom:6px}.hub-brand-mark i:last-child{right:6px;top:6px;background:var(--atlas);box-shadow:0 0 10px var(--atlas)}
.hub-count { padding:8px 12px;border:1px solid rgba(245,239,227,.14);border-radius:100px;color:rgba(245,239,227,.52);font-size:.56rem;font-weight:700;letter-spacing:.15em; }
.hub-intro { margin:clamp(34px,6vh,72px) 0 clamp(24px,4vh,42px); }.hub-kicker{margin:0 0 9px;color:var(--atlas);font-size:.62rem;font-weight:800;letter-spacing:.25em}.hub-intro h1{margin:0;font:800 clamp(2.65rem,6vw,6.2rem)/.88 "Manrope",sans-serif;letter-spacing:-.068em;text-transform:uppercase}.hub-intro h1 em{color:var(--nita);font-style:normal}.hub-intro>p:last-child{max-width:560px;margin:18px 0 0;color:rgba(245,239,227,.52);font-size:clamp(.72rem,1vw,.88rem);line-height:1.6}
.game-library { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,26px);width:100%;max-width:1500px;margin:auto 0; }
.game-tile { position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:space-between;min-width:0;min-height:clamp(255px,35vh,390px);padding:clamp(18px,2.2vw,30px);overflow:hidden;border:1px solid rgba(245,239,227,.16);border-radius:28px;background:#111923;color:var(--cream);box-shadow:0 25px 65px rgba(0,0,0,.28);text-align:left;cursor:pointer;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease; }
.game-tile:hover,.game-tile:focus-visible{transform:translateY(-8px);border-color:rgba(84,216,232,.7);box-shadow:0 34px 80px rgba(0,0,0,.38),0 0 30px rgba(84,216,232,.12);outline:none}.game-tile:active{transform:translateY(-2px) scale(.99)}
.tile-art,.tile-shade { position:absolute;z-index:-2;inset:0; }.tile-shade{z-index:-1;background:linear-gradient(180deg,rgba(5,8,13,.12),rgba(5,8,13,.24) 35%,rgba(5,8,13,.96) 100%)}
.nita-game .tile-art{background:url("assets/menu-atlas-nita-bg.png") 45% 42%/cover no-repeat;filter:saturate(.9)}.nita-game:hover .tile-art,.nita-game:focus-visible .tile-art{transform:scale(1.035);transition:transform .5s ease}
.project-gun .tile-art{background:radial-gradient(circle at 64% 31%,rgba(255,78,45,.44),transparent 3%,rgba(255,78,45,.08) 14%,transparent 33%),linear-gradient(125deg,#1b2027,#080a0d 62%)}.project-gun .tile-art:before{content:"";position:absolute;right:12%;top:27%;width:45%;height:18%;border:3px solid rgba(239,241,232,.7);border-left-width:11px;border-radius:4px 18px 7px 4px;transform:rotate(-13deg);filter:drop-shadow(0 0 16px rgba(255,112,77,.35));clip-path:polygon(0 0,100% 0,100% 65%,60% 65%,52% 100%,34% 100%,37% 65%,0 65%)}.project-gun .tile-art i{position:absolute;inset:0;background:repeating-linear-gradient(112deg,transparent 0 39px,rgba(255,255,255,.025) 40px 41px)}
.empty-game{cursor:not-allowed}.empty-game .tile-art{display:grid;place-items:center;background:radial-gradient(circle at center,rgba(84,216,232,.08),transparent 42%),linear-gradient(145deg,#131a22,#090d13)}.empty-game .tile-art i{display:grid;place-items:center;width:90px;height:90px;border:1px dashed rgba(245,239,227,.22);border-radius:50%;color:rgba(245,239,227,.24);font:300 3.4rem/1 "DM Sans",sans-serif}.empty-game:disabled{opacity:.64}.empty-game:disabled:hover{transform:none;border-color:rgba(245,239,227,.16);box-shadow:0 25px 65px rgba(0,0,0,.28)}
.tile-top { display:flex;align-items:center;justify-content:space-between;gap:12px;color:rgba(245,239,227,.65);font-size:.55rem;font-weight:800;letter-spacing:.13em }.tile-top b{padding:6px 9px;border:1px solid rgba(245,239,227,.2);border-radius:100px;font-size:.48rem}.tile-top .live-badge{border-color:rgba(84,216,232,.42);background:rgba(84,216,232,.12);color:#b8f8ff}
.tile-copy{display:grid;margin-top:auto}.tile-copy strong{font:800 clamp(2rem,3.3vw,4rem)/.8 "Manrope",sans-serif;letter-spacing:-.065em;text-transform:uppercase;text-shadow:0 5px 20px rgba(0,0,0,.7)}.tile-copy strong em{color:var(--nita);font-style:normal}.project-gun .tile-copy strong em{color:var(--atlas)}.empty-game .tile-copy strong em{color:rgba(245,239,227,.45)}.tile-copy>small{margin-top:15px;color:rgba(245,239,227,.56);font-size:.65rem}
.tile-action{display:flex;align-items:center;justify-content:space-between;margin-top:24px;padding-top:16px;border-top:1px solid rgba(245,239,227,.13);font-size:.57rem;font-weight:800;letter-spacing:.14em}.tile-action b{font-size:1.1rem;color:var(--nita)}.project-gun .tile-action b{color:var(--atlas)}
.hub-status{min-height:1.2em;margin:22px 0 0;color:rgba(245,239,227,.42);font-size:.6rem;letter-spacing:.08em;text-align:center}.game-tile.attention{animation:hubAttention .45s ease}@keyframes hubAttention{50%{border-color:var(--atlas);box-shadow:0 0 0 4px rgba(255,112,77,.12),0 30px 75px rgba(0,0,0,.4)}}
#game { position:fixed; inset:0; width:100vw; height:100dvh; min-height:100svh; overflow:hidden; background:#10141d; }
body.pseudo-fullscreen #game { height:100lvh;min-height:100lvh; }
body.pseudo-fullscreen .hud { padding-top:max(7px,env(safe-area-inset-top)); }
#game-canvas { display:block; width:100%; height:100%; }
.hud { position:absolute; z-index:3; inset:0 0 auto; display:grid; grid-template-columns:1fr auto 1fr auto; align-items:center; gap:22px; min-height:82px; padding:14px 24px; pointer-events:none; background:linear-gradient(to bottom,rgba(8,11,17,.9),transparent); }
.brand { font:800 clamp(.9rem,1.6vw,1.2rem) "Manrope",sans-serif; letter-spacing:.12em; }
.brand span { color:var(--nita); }
.brand b { margin-left:8px;padding:4px 7px;border-radius:20px;background:rgba(245,239,227,.12);font:700 .5rem "DM Sans",sans-serif;color:rgba(245,239,227,.6);letter-spacing:.08em; }
.level-info { display:grid; grid-template-columns:auto auto; justify-content:center; align-items:baseline; column-gap:8px; text-align:center; }
.level-info small { font-size:.57rem; letter-spacing:.18em; opacity:.55; }
.level-info strong { font:700 .78rem "Manrope",sans-serif; }
.level-info span { grid-column:1/-1; margin-top:2px; font-size:.75rem; opacity:.8; }
.hud-actions { justify-self:end; display:flex; gap:8px; pointer-events:auto; }
.economy { display:flex;align-items:center;justify-content:center;gap:8px; }
.economy>span { display:grid;grid-template-columns:10px auto;align-items:center;gap:0 7px;min-width:112px;padding:7px 10px;border:1px solid rgba(245,239,227,.16);border-radius:12px;background:rgba(10,14,21,.58);backdrop-filter:blur(9px); }
.economy i { grid-row:1/3;width:9px;height:9px;border-radius:50%;background:var(--atlas);box-shadow:0 0 12px var(--atlas); }
.economy .nita-wallet i { background:var(--nita);box-shadow:0 0 12px var(--nita); }
.economy b { font:800 .72rem "Manrope",sans-serif;line-height:1; }
.economy small { margin-top:2px;font-size:.48rem;letter-spacing:.05em;opacity:.58;white-space:nowrap; }
.hud button { border:1px solid rgba(245,239,227,.22); border-radius:100px; padding:8px 12px; background:rgba(16,20,29,.48); color:inherit; font-size:.62rem; font-weight:700; letter-spacing:.08em; cursor:pointer; backdrop-filter:blur(8px); }
#hud-market-button { border-color:rgba(255,211,77,.55);background:linear-gradient(110deg,rgba(255,112,77,.2),rgba(255,211,77,.16));color:#ffe89b;box-shadow:0 0 18px rgba(255,211,77,.1); }
#inventory-button { border-color:rgba(190,115,255,.55);color:#e4bdff;background:rgba(83,36,112,.25); }
#village-button { border-color:rgba(255,136,62,.58);color:#ffc083;background:rgba(104,45,19,.28); }
#village-button.quest-return { border-color:rgba(84,216,232,.7);color:#b7fbff;background:rgba(24,91,101,.32); }
#fullscreen-button { border-color:rgba(84,216,232,.5);color:#aef8ff; }
#main-menu-button { border-color:rgba(245,239,227,.38);color:var(--cream);background:rgba(245,239,227,.08); }
.controls { position:absolute; z-index:3; left:24px; bottom:20px; display:flex; gap:10px; pointer-events:none; }
.player-control { display:flex; align-items:center; gap:8px; padding:9px 12px; border:1px solid rgba(245,239,227,.14); border-radius:12px; background:var(--glass); box-shadow:0 10px 30px rgba(0,0,0,.2); backdrop-filter:blur(9px); font-size:.65rem; }
.player-control>span:not(.player-dot) { opacity:.65; }
.player-dot { width:8px; height:8px; border-radius:50%; background:var(--atlas); box-shadow:0 0 12px var(--atlas); }
.nita-control .player-dot { background:var(--nita); box-shadow:0 0 12px var(--nita); }
kbd { min-width:21px; display:inline-grid; place-items:center; margin:0 2px; padding:3px 5px; border:1px solid rgba(245,239,227,.38); border-bottom-width:2px; border-radius:4px; color:var(--cream); font:700 .58rem "DM Sans",sans-serif; }
.message { position:absolute; z-index:4; top:94px; left:50%; translate:-50% 0; padding:10px 16px; border-radius:100px; background:var(--cream); color:var(--night); font-weight:700; font-size:.78rem; opacity:0; transform:translateY(-8px); transition:.2s ease; pointer-events:none; }
.message.show { opacity:1; transform:translateY(0); }
.level-transition { position:absolute;z-index:6;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;background:radial-gradient(circle at center,rgba(84,216,232,.3),rgba(8,11,17,.94) 62%);opacity:0;visibility:hidden;pointer-events:none; }
.level-transition.active { visibility:visible;animation:transitionScreen 2.15s ease both; }
.transition-check { position:relative;z-index:2;display:grid;place-items:center;width:104px;height:104px;border:5px solid var(--nita);border-radius:50%;color:var(--cream);background:var(--night);box-shadow:0 0 0 12px rgba(84,216,232,.12),0 0 55px rgba(84,216,232,.55);font:800 4rem/1 "Manrope",sans-serif;animation:checkPop .55s cubic-bezier(.2,1.5,.5,1) both; }
.level-transition p { margin:28px 0 4px;color:var(--nita);font:800 clamp(1.5rem,4vw,3rem) "Manrope",sans-serif;letter-spacing:.08em;animation:transitionText .5s .22s ease both; }
.level-transition strong { font:700 clamp(.9rem,2vw,1.25rem) "Manrope",sans-serif;opacity:.82;animation:transitionText .5s .32s ease both; }
.level-transition>span { margin-top:18px;font-size:.62rem;font-weight:700;letter-spacing:.18em;opacity:.5;animation:transitionText .5s .42s ease both; }
.transition-burst { position:absolute;left:50%;top:50%;width:1px;height:1px; }
.transition-burst i { position:absolute;left:-2px;top:-145px;width:4px;height:34px;border-radius:4px;background:var(--atlas);transform-origin:2px 145px;animation:burstRay .7s .1s ease-out both; }
.transition-burst i:nth-child(2){background:var(--nita);transform:rotate(120deg)}.transition-burst i:nth-child(3){background:var(--cream);transform:rotate(240deg)}
@keyframes transitionScreen { 0%{opacity:0} 12%,82%{opacity:1} 100%{opacity:0} }
@keyframes checkPop { 0%{opacity:0;transform:scale(.2) rotate(-25deg)} 100%{opacity:1;transform:scale(1) rotate(0)} }
@keyframes transitionText { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
@keyframes burstRay { from{opacity:0;scale:1 .2} 45%{opacity:.9} to{opacity:0;scale:1 1.8} }
.overlay { position:absolute; z-index:5; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:24px; text-align:center; background-color:#070a10;background-image:radial-gradient(circle at 50% 40%,rgba(22,29,42,.42),rgba(7,10,16,.9) 72%),linear-gradient(rgba(6,9,15,.48),rgba(6,9,15,.68)),url("assets/menu-atlas-nita-bg.png");background-position:center,center,calc(50% - 10vw) center;background-repeat:no-repeat;background-size:auto,auto,min(92vw,164vh) auto; transition:opacity .4s ease,visibility .4s; }
.overlay.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.overlay h1 { margin:10px 0 16px; font:800 clamp(4rem,10vw,8.5rem)/.75 "Manrope",sans-serif; letter-spacing:-.085em; text-transform:uppercase; }
.overlay h1 em { color:var(--nita); font-style:normal; }
.overlay>p:not(.eyebrow,.restart-hint) { max-width:520px; margin:5px 0 26px; color:rgba(245,239,227,.66); line-height:1.55; }
.eyebrow { margin:0; font-size:.64rem; font-weight:700; letter-spacing:.22em; color:var(--atlas); }
.overlay button { border:0; border-radius:100px; padding:16px 22px; background:var(--cream); color:var(--night); font-weight:800; font-size:.78rem; letter-spacing:.06em; cursor:pointer; box-shadow:0 10px 35px rgba(0,0,0,.24); }
.overlay button span { padding-left:20px; }
.lobby-actions { display:flex;flex-direction:column;gap:10px;width:min(390px,90vw); }
.lobby-actions .secondary { background:transparent;color:var(--cream);border:1px solid rgba(245,239,227,.3);box-shadow:none; }
.lobby-actions>button { width:100%;min-width:0;height:52px;padding:0 22px;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,border-color .2s ease; }
.lobby-actions>button:hover,.lobby-actions>button:focus-visible { transform:translateY(-3px) scale(1.015);border-color:rgba(245,239,227,.65);box-shadow:0 15px 38px rgba(0,0,0,.34),0 0 22px rgba(84,216,232,.14);outline:none; }
.lobby-actions>button:active { transform:translateY(0) scale(.985); }
.lobby-actions .text-button { background:transparent;color:var(--cream);border:1px solid rgba(245,239,227,.3);box-shadow:none;font-size:.78rem; }
.lobby-actions .levels-button { border:1px solid rgba(84,216,232,.45);background:linear-gradient(100deg,rgba(20,66,77,.42),rgba(255,112,77,.14));color:#d7fbff;box-shadow:0 10px 30px rgba(0,0,0,.2),inset 0 0 22px rgba(84,216,232,.05); }
.lobby-actions .hub-return-button { height:38px;border:0;background:transparent;color:rgba(245,239,227,.58);box-shadow:none;font-size:.58rem; }
.level-select { position:relative;display:flex;flex-direction:column;width:min(980px,94vw);max-height:min(700px,88dvh);padding:clamp(18px,2.6vw,34px);border:1px solid rgba(84,216,232,.28);border-radius:28px;background:radial-gradient(circle at 15% 5%,rgba(84,216,232,.16),transparent 34%),radial-gradient(circle at 92% 96%,rgba(255,112,77,.12),transparent 31%),rgba(7,11,18,.92);box-shadow:0 32px 100px rgba(0,0,0,.58),inset 0 0 0 1px rgba(245,239,227,.035);backdrop-filter:blur(20px);overflow:hidden;text-align:left; }
.level-select[hidden] { display:none; }
.level-select:before { content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 34%,rgba(245,239,227,.035) 50%,transparent 66%); }
.level-select-header { position:relative;display:grid;grid-template-columns:minmax(220px,.8fr) minmax(300px,1.2fr);gap:28px;align-items:end;margin-bottom:20px;padding-bottom:18px;border-bottom:1px solid rgba(245,239,227,.12); }
.level-select-header h2 { margin:5px 0 0;font:800 clamp(1.8rem,4vw,3.4rem)/.95 "Manrope",sans-serif;letter-spacing:-.055em;text-transform:uppercase; }
.level-select-header>p { justify-self:end;max-width:470px;margin:0;color:rgba(245,239,227,.58);font-size:.7rem;line-height:1.6;text-align:right; }
.level-select-header kbd { color:#baf8ff;border-color:rgba(84,216,232,.5);background:rgba(84,216,232,.08); }
.level-grid { position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;min-height:0;padding:2px 5px 5px 2px;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(84,216,232,.45) rgba(245,239,227,.05); }
.level-grid::-webkit-scrollbar { width:7px; }.level-grid::-webkit-scrollbar-track{background:rgba(245,239,227,.04);border-radius:10px}.level-grid::-webkit-scrollbar-thumb{background:linear-gradient(var(--nita),#25899a);border-radius:10px}
.level-card { position:relative;isolation:isolate;display:grid;align-content:end;min-height:154px;padding:16px!important;border:1px solid rgba(245,239,227,.15)!important;border-radius:19px!important;overflow:hidden;background:linear-gradient(145deg,rgba(35,46,61,.94),rgba(11,16,24,.96))!important;color:var(--cream)!important;box-shadow:0 15px 34px rgba(0,0,0,.24)!important;text-align:left;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.level-card-art { position:absolute;z-index:0;inset:0;width:100%;height:100%;object-fit:cover;opacity:.82;transform:scale(1.01);filter:saturate(.92) contrast(1.05);transition:transform .35s ease,filter .25s ease,opacity .25s ease;pointer-events:none; }
.level-card:before { content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,rgba(4,9,14,.08) 5%,rgba(5,10,16,.28) 42%,rgba(5,9,15,.94) 100%),radial-gradient(circle at 82% 15%,rgba(84,216,232,.18),transparent 38%);pointer-events:none; }
.level-card:after { content:"";position:absolute;z-index:1;right:-16px;top:-25px;width:86px;height:86px;border:1px solid rgba(84,216,232,.16);border-radius:50%;box-shadow:0 0 0 12px rgba(84,216,232,.035),0 0 0 24px rgba(84,216,232,.018);pointer-events:none; }
.level-card:hover:not(:disabled):not(.locked),.level-card:focus-visible:not(:disabled):not(.locked) { transform:translateY(-4px);border-color:rgba(84,216,232,.72)!important;box-shadow:0 20px 45px rgba(0,0,0,.34),0 0 24px rgba(84,216,232,.15)!important;outline:none; }
.level-card:hover:not(:disabled):not(.locked) .level-card-art,.level-card:focus-visible:not(:disabled):not(.locked) .level-card-art { transform:scale(1.065);filter:saturate(1.08) contrast(1.08); }
.level-card.selected,.level-card[aria-current="true"] { border-color:var(--atlas)!important;box-shadow:0 0 0 2px rgba(255,112,77,.2),0 18px 45px rgba(0,0,0,.35),0 0 28px rgba(255,112,77,.14)!important; }
.level-card.locked,.level-card:disabled { opacity:1;cursor:not-allowed!important; }
.level-card.locked .level-card-art,.level-card:disabled .level-card-art { filter:grayscale(1) saturate(.18) brightness(.38);opacity:.72; }
.level-card.locked:before,.level-card:disabled:before { background:linear-gradient(180deg,rgba(8,10,13,.28),rgba(7,9,12,.96)),radial-gradient(circle at 82% 15%,rgba(245,239,227,.08),transparent 38%); }
.level-card-number,.level-card .number,.level-card>small:first-child { position:relative;z-index:2;align-self:start;margin-bottom:auto;color:var(--nita);font:800 .58rem "Manrope",sans-serif;letter-spacing:.16em;text-shadow:0 2px 9px rgba(0,0,0,.9); }
.level-card-name,.level-card .name,.level-card>strong { position:relative;z-index:2;display:block;margin-top:18px;font:800 clamp(.78rem,1.3vw,1rem)/1.16 "Manrope",sans-serif;letter-spacing:.02em;text-transform:uppercase;text-shadow:0 3px 12px rgba(0,0,0,.94); }
.level-card-status,.level-card .status,.level-card>small:last-child { position:relative;z-index:2;display:block;margin-top:7px;color:rgba(245,239,227,.62);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;text-shadow:0 2px 8px rgba(0,0,0,.95); }
.level-card.locked .level-card-status:before,.level-card.locked .status:before,.level-card:disabled .level-card-status:before { content:"◆";margin-right:6px;color:rgba(245,239,227,.52); }
#level-select-back { position:relative;align-self:center;margin-top:18px;padding:11px 20px;border:1px solid rgba(245,239,227,.22);background:rgba(245,239,227,.06);color:rgba(245,239,227,.82);box-shadow:none;font-size:.61rem; }
#level-select-back:hover,#level-select-back:focus-visible { border-color:rgba(245,239,227,.55);color:var(--cream);outline:none; }
.join-form { width:min(390px,90vw); }
.join-form label,.room-wait>span { display:block;margin-bottom:8px;font-size:.58rem;font-weight:700;letter-spacing:.16em;color:rgba(245,239,227,.55); }
.join-form div { display:flex;gap:8px; }
.join-form input { min-width:0;flex:1;border:1px solid rgba(245,239,227,.3);border-radius:100px;padding:14px 18px;background:rgba(0,0,0,.2);color:var(--cream);font:800 1rem "Manrope",sans-serif;text-transform:uppercase;letter-spacing:.18em;outline:none; }
.room-wait strong { display:block;margin:0 0 12px;font:800 2rem "Manrope",sans-serif;letter-spacing:.18em;color:var(--nita); }
.room-wait button { padding:10px 14px;font-size:.62rem; }
.room-wait button:disabled { opacity:.42;cursor:wait; }
.room-wait p { margin:14px 0 0!important;font-size:.68rem!important; }
.character-select { width:min(470px,92vw);padding:18px;border:1px solid rgba(245,239,227,.18);border-radius:22px;background:rgba(7,10,16,.78);backdrop-filter:blur(14px); }
.character-select>p { margin:0 0 13px;font:800 .7rem "Manrope",sans-serif;letter-spacing:.18em; }.character-select>div{display:grid;grid-template-columns:1fr 1fr;gap:10px}.character-select button{display:grid;gap:3px;border:1px solid rgba(245,239,227,.2);border-radius:16px;padding:18px;background:rgba(255,255,255,.06);color:var(--cream);box-shadow:none}.character-select button:first-child{border-color:rgba(255,112,77,.5)}.character-select button:last-child{border-color:rgba(84,216,232,.5)}.character-select button:disabled{opacity:.28;cursor:not-allowed}.character-select button.selected{outline:3px solid var(--cream);transform:translateY(-2px)}.character-select small{opacity:.55;font-size:.58rem}.character-select>span{display:block;margin-top:13px;font-size:.66rem;opacity:.65}
.touch-controls { display:none;position:absolute;z-index:4;inset:auto 18px 44px;align-items:end;justify-content:space-between;pointer-events:none; }
.touch-controls button { width:82px;height:66px;border:1px solid rgba(245,239,227,.13);border-radius:21px;background:rgba(16,20,29,.34);color:rgba(245,239,227,.78);font-weight:800;font-size:.62rem;pointer-events:auto;touch-action:none;user-select:none;backdrop-filter:blur(5px);box-shadow:0 7px 20px rgba(0,0,0,.16); }
.touch-controls button.active { background:rgba(245,239,227,.22);color:var(--cream);transform:scale(.96); }
.touch-controls .action { font-size:.58rem;color:var(--atlas); }
.character-nita .touch-controls .action { color:var(--nita); }
.touch-actions { display:grid;grid-template-columns:1fr 1fr;gap:7px;direction:ltr; }
.joystick { position:relative;flex:0 0 104px;width:104px;height:104px;border:1px solid rgba(245,239,227,.08);border-radius:50%;background:rgba(16,20,29,.13);box-shadow:inset 0 0 15px rgba(0,0,0,.1);pointer-events:auto;touch-action:none;direction:ltr; }
.joystick:before,.joystick:after { content:"";position:absolute;left:50%;top:14px;bottom:14px;width:1px;background:rgba(245,239,227,.1); }
.joystick:after { top:50%;left:14px;right:14px;width:auto;height:1px; }
.joystick i { position:absolute;z-index:2;left:50%;top:50%;width:43px;height:43px;border-radius:50%;translate:-50% -50%;background:color-mix(in srgb,var(--atlas) 38%,transparent);box-shadow:0 4px 11px rgba(0,0,0,.14),0 0 8px rgba(255,112,77,.08); }
.character-nita .joystick i { background:var(--nita); }
.joystick span { position:absolute;inset:7px;border:1px dashed rgba(245,239,227,.04);border-radius:50%; }
.rotate-device { display:none;position:absolute;z-index:20;inset:0;align-items:center;justify-content:center;flex-direction:column;gap:9px;text-align:center;background:#10141d;color:var(--cream); }
.rotate-device strong { font:800 1rem "Manrope",sans-serif;letter-spacing:.08em; }.rotate-device span{font-size:.75rem;opacity:.55}.phone-icon{font-size:3rem;color:var(--nita);animation:rotatePhone 1.8s ease-in-out infinite}@keyframes rotatePhone{50%{transform:rotate(90deg)}}
.ios-install-tip { position:fixed;z-index:30;left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));display:grid;grid-template-columns:46px 1fr;gap:12px;align-items:center;max-width:430px;margin:auto;padding:14px 40px 14px 14px;border:1px solid rgba(84,216,232,.35);border-radius:18px;background:rgba(8,13,21,.94);box-shadow:0 18px 55px rgba(0,0,0,.48),0 0 24px rgba(84,216,232,.1);backdrop-filter:blur(16px);animation:iosTipIn .35s ease both; }
.ios-install-tip[hidden]{display:none}.ios-install-tip>button{position:absolute;right:9px;top:7px;border:0;background:transparent;color:rgba(245,239,227,.65);font-size:1.25rem;cursor:pointer}.ios-share-icon{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(84,216,232,.5);border-radius:13px;color:var(--nita);font-size:1.55rem}.ios-install-tip strong{font:800 .68rem "Manrope",sans-serif;letter-spacing:.08em}.ios-install-tip p{margin:4px 0 0;font-size:.66rem;line-height:1.4;color:rgba(245,239,227,.7)}.ios-install-tip b{color:var(--cream)}@keyframes iosTipIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.restart-hint { margin-top:22px!important; font-size:.65rem; opacity:.5; }
.market { position:absolute;z-index:7;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(18px,4vw,52px);text-align:center;background:radial-gradient(circle at 50% 25%,rgba(50,62,82,.96),rgba(7,10,15,.99) 72%);opacity:0;visibility:hidden;pointer-events:none;transition:.28s ease; }
.market.active { opacity:1;visibility:visible;pointer-events:auto; }
.market h2 { margin:7px 0 4px;font:800 clamp(2rem,5vw,4.2rem)/1 "Manrope",sans-serif;letter-spacing:-.055em; }
.market-wallets { display:flex;align-items:center;justify-content:center;gap:9px;margin:8px 0; }
.market-wallets span { display:flex;align-items:center;gap:7px;padding:8px 13px;border:1px solid;border-radius:999px;background:rgba(8,12,18,.52);font:800 .65rem "Manrope",sans-serif;letter-spacing:.08em;box-shadow:0 9px 24px rgba(0,0,0,.2); }
.market-wallets b { min-width:1.5ch;font-size:.92rem;line-height:1; }
.atlas-market-wallet { color:#ffc1ae;border-color:rgba(255,112,77,.42)!important; }
.atlas-market-wallet b { color:var(--atlas); }
.nita-market-wallet { color:#c7f8ff;border-color:rgba(84,216,232,.42)!important; }
.nita-market-wallet b { color:var(--nita); }
.market-summary { margin:0 0 22px;color:rgba(245,239,227,.6);font-size:.78rem; }
.market-grid { display:grid;grid-template-columns:repeat(2,minmax(230px,420px));gap:14px;width:min(860px,94vw);animation:marketReveal .24s ease both; }
.market-grid[hidden] { display:none; }
@keyframes marketReveal { from{opacity:0;transform:translateY(10px) scale(.98)} to{opacity:1;transform:none} }
.shop-card { position:relative;display:grid;grid-template-columns:72px 1fr;gap:16px;align-items:center;min-height:188px;padding:22px;text-align:left;border:1px solid rgba(245,239,227,.14);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025));box-shadow:0 26px 70px rgba(0,0,0,.25);overflow:hidden; }
.shop-card { --item-color:var(--atlas); }
.shop-card:before { content:"";position:absolute;inset:auto -30% -65% -30%;height:130px;background:var(--item-color);filter:blur(55px);opacity:.2; }
.nita-shop:before { background:var(--item-color); }
.shop-icon { display:grid;place-items:center;width:70px;height:70px;border-radius:20px;background:color-mix(in srgb,var(--item-color) 16%,transparent);color:var(--item-color);font-size:2rem;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--item-color) 28%,transparent),0 12px 28px rgba(0,0,0,.22); }
.nita-shop .shop-icon { background:color-mix(in srgb,var(--item-color) 16%,transparent);color:var(--item-color);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--item-color) 28%,transparent); }
.blessed-hand-icon { font-size:2.2rem;text-shadow:0 0 18px var(--item-color); }
.dual-ring-shop { --item-color:#ffb12e; }
.ancient-charm-icon { font-size:2rem;color:#dca0ff;text-shadow:0 0 10px #bd63ff,0 0 24px #ffb12e;background:radial-gradient(circle,rgba(185,108,255,.2),rgba(255,177,46,.06)); }
.dual-ring-shop button { background:linear-gradient(100deg,#ffb62e,#b76cff); }
.sky-whisper-shop { --item-color:#79eaff; }
.sky-whisper-icon { color:#eaffff;text-shadow:0 0 8px #fff,0 0 24px #54d8e8;background:radial-gradient(circle,rgba(84,216,232,.24),rgba(84,216,232,.04)); }
.sky-whisper-shop button { background:linear-gradient(100deg,#54d8e8,#a9f8ff); }
.cloak-icon i { position:relative;width:42px;height:46px;border-radius:18px 18px 8px 8px;background:linear-gradient(135deg,rgba(255,255,255,.55),var(--item-color) 38%,rgba(8,15,23,.82));clip-path:polygon(28% 0,72% 0,100% 100%,52% 84%,0 100%);filter:drop-shadow(0 0 10px color-mix(in srgb,var(--item-color) 65%,transparent)); }
.cloak-icon b { position:absolute;left:50%;top:5px;width:20px;height:18px;border:4px solid var(--item-color);border-bottom:0;border-radius:50% 50% 0 0;transform:translateX(-50%); }
.shop-card small { color:var(--atlas);font-weight:800;font-size:.58rem;letter-spacing:.16em; }
.nita-shop small { color:var(--nita); }
.shop-card h3 { margin:4px 0 5px;font:800 1.05rem "Manrope",sans-serif; }
.shop-card p { margin:0;color:rgba(245,239,227,.56);font-size:.7rem;line-height:1.45; }
.shop-card button { position:relative;z-index:1;grid-column:1/-1;border:0;border-radius:100px;padding:12px 14px;background:var(--atlas);color:#111722;font-weight:800;font-size:.66rem;letter-spacing:.05em;cursor:pointer; }
.nita-shop button { background:var(--nita); }
.shop-card button:disabled { cursor:not-allowed;filter:grayscale(.72);opacity:.38; }
.shop-card.maxed { opacity:.68; }
.market-toggle { width:min(390px,82vw);margin:10px 0 16px;border:1px solid color-mix(in srgb,var(--nita) 48%,transparent);border-radius:100px;padding:15px 22px;background:linear-gradient(100deg,rgba(255,112,77,.16),rgba(84,216,232,.18));color:var(--cream);font:800 .72rem "Manrope",sans-serif;letter-spacing:.14em;cursor:pointer;box-shadow:0 12px 34px rgba(0,0,0,.25); }
.market-toggle span { padding-left:22px;color:var(--nita);font-size:1rem; }
.continue-button { margin-top:18px;border:1px solid rgba(245,239,227,.2);border-radius:100px;padding:14px 22px;background:var(--cream);color:var(--night);font-weight:800;font-size:.72rem;letter-spacing:.08em;cursor:pointer; }
.continue-button span { padding-left:18px; }
.market-note { margin:12px 0 0;color:rgba(245,239,227,.38);font-size:.58rem; }
.inventory-panel { position:absolute;z-index:9;inset:5% 7%;display:flex;flex-direction:column;padding:clamp(18px,3vw,38px);border:1px solid rgba(245,239,227,.16);border-radius:30px;background:radial-gradient(circle at 50% 15%,rgba(84,43,71,.94),rgba(7,10,16,.985) 68%);box-shadow:0 35px 100px rgba(0,0,0,.55);opacity:0;visibility:hidden;pointer-events:none;transition:.25s ease;overflow:auto; }
.inventory-panel.active { opacity:1;visibility:visible;pointer-events:auto; }
.panel-topline { display:flex;align-items:start;justify-content:space-between;gap:20px; }
.panel-topline h2 { margin:4px 0 0;font:800 clamp(2rem,5vw,4rem)/1 "Manrope",sans-serif;letter-spacing:-.05em; }
.panel-close { display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(245,239,227,.22);border-radius:50%;background:rgba(0,0,0,.25);color:var(--cream);font-size:1.35rem;cursor:pointer; }
.inventory-help { margin:8px 0 18px;color:rgba(245,239,227,.55);font-size:.72rem; }
.inventory-grid { display:grid;grid-template-columns:repeat(2,minmax(250px,1fr));gap:18px;min-height:0; }
.inventory-character { position:relative;display:grid;grid-template-columns:minmax(130px,42%) 1fr;min-height:430px;border:1px solid color-mix(in srgb,var(--hero-color) 42%,transparent);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.018));overflow:hidden;transition:.18s ease; }
.inventory-character.drop-ready { outline:3px solid #ff5749;box-shadow:0 0 38px rgba(255,58,45,.34);transform:translateY(-3px); }
.avatar-stage { position:relative;display:grid;place-items:end center;min-height:360px;padding:28px 6px 18px;background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--hero-color) 18%,transparent),transparent 62%); }
.avatar-stage:after { content:"";position:absolute;left:14%;right:14%;bottom:17px;height:16px;border-radius:50%;background:rgba(0,0,0,.5);filter:blur(7px); }
.avatar-stage img { position:relative;z-index:1;width:min(170px,95%);height:330px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 18px 18px rgba(0,0,0,.55)); }
.inventory-character.nita .avatar-stage img { width:min(145px,90%); }
.inventory-character.armored .avatar-stage img { filter:drop-shadow(0 18px 18px rgba(0,0,0,.6)) drop-shadow(0 0 12px rgba(255,48,35,.2)); }
.character-inventory { display:flex;flex-direction:column;padding:25px 22px; }
.character-inventory small { color:var(--hero-color);font-weight:800;letter-spacing:.16em;font-size:.58rem; }
.character-inventory h3 { margin:4px 0 16px;font:800 1.45rem "Manrope",sans-serif; }
.gear-slot { display:grid;place-items:center;min-height:112px;padding:12px;border:1px dashed rgba(245,239,227,.2);border-radius:17px;background:rgba(0,0,0,.18);text-align:center;color:rgba(245,239,227,.48);font-size:.68rem; }
.gear-slot.equipped { border-style:solid;border-color:rgba(255,55,40,.58);color:#ffb2a9;background:rgba(91,20,19,.22); }
.inventory-items { display:grid;gap:9px;margin-top:12px; }
.inventory-item { display:grid;grid-template-columns:42px 1fr;gap:10px;align-items:center;width:100%;padding:10px;border:1px solid rgba(245,239,227,.15);border-radius:14px;background:rgba(255,255,255,.055);color:var(--cream);text-align:left;cursor:grab; }
.inventory-item.selected { outline:2px solid #ff594b;background:rgba(130,27,23,.32); }
.inventory-item:active { cursor:grabbing; }
.item-gem { display:grid;place-items:center;width:40px;height:40px;clip-path:polygon(50% 0,91% 25%,80% 78%,50% 100%,20% 78%,9% 25%);background:radial-gradient(circle at 36% 28%,#ffb19f,#bd261e 42%,#32070a 78%);color:#fff;text-shadow:0 0 8px #fff;box-shadow:0 0 20px #ff3425; }
.item-armor { display:block;width:46px;height:46px;background:url("assets/wrath-armor-icon.png") center/contain no-repeat;filter:drop-shadow(0 3px 4px rgba(0,0,0,.55)) drop-shadow(0 0 7px rgba(255,51,38,.28)); }
.inventory-item b { display:block;font-size:.7rem; }.inventory-item em{display:block;margin-top:2px;color:rgba(245,239,227,.48);font-style:normal;font-size:.58rem}
.empty-inventory { margin-top:12px;padding:13px;border-radius:14px;background:rgba(0,0,0,.18);color:rgba(245,239,227,.42);font-size:.64rem;line-height:1.5; }
.village { position:absolute;z-index:8;inset:0;overflow:hidden;background:linear-gradient(#f2b45e 0 34%,#7f9c5a 34% 66%,#493726 66%);opacity:0;visibility:hidden;pointer-events:none;transition:.3s ease; }
.village-mode .hud { z-index:10; }
.village-mode .hud:before { content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(37,24,17,.82),transparent);z-index:-1; }
.village-mode .hud-actions button:not(#village-button) { display:none; }
.village.active { opacity:1;visibility:visible;pointer-events:auto; }
.village-sky { position:absolute;inset:0 0 40%;background:radial-gradient(circle at 72% 26%,#fff4bb 0 5%,rgba(255,237,166,.3) 6%,transparent 20%),linear-gradient(#588fc0,#edbd76); }
.village-sky i { position:absolute;width:160px;height:32px;border-radius:50%;background:rgba(255,246,217,.55);filter:blur(2px); }.village-sky i:nth-child(1){left:7%;top:15%}.village-sky i:nth-child(2){left:44%;top:8%;scale:.7}.village-sky i:nth-child(3){right:4%;top:33%;scale:1.25}
.village-mountains { position:absolute;left:-8%;right:-8%;top:22%;height:43%;background:#526a52;clip-path:polygon(0 54%,11% 20%,20% 52%,33% 4%,48% 55%,59% 24%,71% 58%,85% 11%,100% 49%,100% 100%,0 100%);box-shadow:inset 0 -50px rgba(34,59,42,.35); }
.village-houses { position:absolute;left:4%;right:4%;bottom:23%;height:250px;display:flex;align-items:end;justify-content:space-between;pointer-events:none; }
.village-houses i { width:190px;height:145px;border:8px solid #56371f;background:linear-gradient(90deg,#d59a56 0 42%,#683f26 43% 48%,#d59a56 49%);clip-path:polygon(0 28%,50% 0,100% 28%,100% 100%,0 100%);box-shadow:inset 0 -35px rgba(77,42,25,.24); }.village-houses i:nth-child(2){width:140px;height:110px;translate:0 25px}.village-houses i:nth-child(3){width:220px;height:165px}
.village-road { position:absolute;left:17%;right:17%;bottom:-15%;height:67%;background:linear-gradient(90deg,transparent,rgba(174,137,87,.9) 23% 77%,transparent);clip-path:polygon(39% 0,61% 0,100% 100%,0 100%); }
.village-header { position:absolute;z-index:2;left:50%;top:88px;translate:-50% 0;min-width:min(520px,80vw);padding:15px 24px;border:2px solid #392517;border-radius:18px;text-align:center;background:linear-gradient(#8b542d,#4f2e1d);box-shadow:0 10px 0 #271a12,0 22px 45px rgba(0,0,0,.28); }
.village-header h2 { margin:3px 0;font:800 clamp(1.5rem,3vw,2.7rem)/1 "Manrope",sans-serif;text-shadow:0 3px #382116; }.village-header span{font-size:.66rem;color:#f5d9b0}
.blacksmith-npc { position:absolute;z-index:3;left:20%;bottom:13%;width:250px;height:330px;border:0;background:transparent;color:var(--cream);cursor:pointer;filter:drop-shadow(0 16px 18px rgba(0,0,0,.42));transition:.2s ease; }.blacksmith-npc:hover{transform:translateY(-7px) scale(1.025)}
.forge-building { position:absolute;z-index:-1;left:-58px;bottom:20px;width:340px;height:220px;border:10px solid #4a2e1c;border-radius:18px 18px 0 0;background:linear-gradient(90deg,#9a5c34,#5e3924 65%,#2d201b);box-shadow:inset 0 0 0 7px rgba(255,190,104,.11); }.forge-building:before{content:"";position:absolute;left:-20px;right:-20px;top:-75px;height:90px;background:#38261d;clip-path:polygon(0 100%,18% 25%,50% 0,82% 25%,100% 100%)}.forge-building:after{content:"";position:absolute;right:28px;top:20px;width:76px;height:90px;border-radius:45% 45% 0 0;background:#1b1210;box-shadow:inset 0 -18px 24px #d9341e,0 0 22px #ff6b2d}
.forge-fire { position:absolute;right:43px;top:48px;width:44px;height:56px;background:#ffb52f;clip-path:polygon(50% 0,72% 35%,100% 55%,78% 100%,21% 100%,0 58%,30% 35%);filter:drop-shadow(0 0 13px #ff391d);animation:forgeFlame .55s ease-in-out infinite alternate}.forge-anvil{position:absolute;left:28px;bottom:28px;width:92px;height:32px;border-radius:7px;background:#24272b;box-shadow:0 12px 0 -3px #17191c}.forge-anvil:before{content:"";position:absolute;right:-35px;top:-7px;border-left:38px solid #24272b;border-top:22px solid transparent}
.smith-figure { position:absolute;left:87px;bottom:45px;width:95px;height:170px; }.smith-head{position:absolute;left:28px;top:0;width:46px;height:52px;border-radius:50%;background:#9a5f3f;box-shadow:inset 0 -13px #522f28}.smith-head:after{content:"";position:absolute;left:7px;right:7px;top:30px;height:36px;border-radius:7px 7px 20px 20px;background:#211c1c}.smith-body{position:absolute;left:12px;top:48px;width:78px;height:112px;border-radius:24px 24px 8px 8px;background:linear-gradient(90deg,#271e1b,#753c2c 52%,#211b1a);box-shadow:inset 0 0 0 5px #151517}.smith-hammer{position:absolute;right:-29px;top:62px;width:67px;height:16px;background:#23262a;rotate:-48deg;transform-origin:left center;box-shadow:-10px 0 0 5px #75502f}
.blacksmith-npc>strong,.blacksmith-npc>small { position:absolute;left:50%;translate:-50% 0;white-space:nowrap;border-radius:100px;background:#17110e; }.blacksmith-npc>strong{bottom:-4px;padding:9px 17px;color:#ffbd78;font:800 .78rem "Manrope",sans-serif;letter-spacing:.1em}.blacksmith-npc>small{bottom:-30px;padding:5px 12px;color:#fff;font-size:.56rem}
.locked-villager { position:absolute;right:18%;bottom:17%;display:grid;place-items:center;width:110px;height:160px;border:2px dashed rgba(255,245,220,.3);border-radius:60px 60px 18px 18px;background:rgba(36,31,27,.32);color:rgba(255,255,255,.5); }.locked-villager span{font:800 3rem "Manrope",sans-serif}.locked-villager small{font-size:.6rem}
.forge-panel { position:absolute;z-index:6;left:50%;top:50%;translate:-50% -50%;width:min(700px,88vw);padding:30px;border:2px solid #b76b32;border-radius:25px;background:radial-gradient(circle at 80% 20%,rgba(255,82,29,.18),transparent 30%),linear-gradient(145deg,#2e211c,#0d0d11 70%);box-shadow:0 32px 120px rgba(0,0,0,.75),inset 0 0 0 5px rgba(255,255,255,.035); }.forge-panel[hidden]{display:none}.forge-panel>.panel-close{position:absolute;right:14px;top:14px}.forge-panel h3{margin:6px 0;font:800 2.2rem "Manrope",sans-serif}.forge-panel>p:not(.eyebrow){margin:0 0 18px;max-width:570px;color:rgba(245,239,227,.62);font-size:.75rem;line-height:1.55}
.forge-options { display:grid;grid-template-columns:repeat(2,1fr);gap:12px; }.forge-option{display:grid;grid-template-columns:48px 1fr;gap:10px;align-items:center;padding:14px;border:1px solid rgba(245,239,227,.15);border-radius:16px;background:rgba(255,255,255,.05)}.forge-option b{font-size:.78rem}.forge-option small{display:block;margin-top:3px;color:rgba(245,239,227,.5);font-size:.58rem}.forge-option button{grid-column:1/-1;border:0;border-radius:100px;padding:10px;background:linear-gradient(90deg,#8e201c,#ff5b35);color:#fff;font-weight:800;font-size:.62rem;cursor:pointer}.forge-option button:disabled{filter:grayscale(1);opacity:.42;cursor:not-allowed}
@keyframes forgeFlame{to{transform:scale(.88,1.08) rotate(3deg)}}
.village { background:#172419 url("assets/village-3d-bg.png") center/cover no-repeat;perspective:1100px; }
.village:before { content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(to bottom,rgba(9,16,24,.22),transparent 25%,transparent 70%,rgba(14,9,6,.3)),radial-gradient(circle at 34% 60%,rgba(255,122,41,.15),transparent 23%);pointer-events:none; }
.village:after { content:"";position:absolute;z-index:1;inset:0;box-shadow:inset 0 0 110px rgba(5,8,12,.5);pointer-events:none; }
.village>.village-sky,.village>.village-mountains,.village>.village-houses,.village>.village-road,.village>.locked-villager { display:none; }
.village-header { z-index:4;top:96px;border-color:#7e3a1e;background:linear-gradient(180deg,rgba(95,43,23,.95),rgba(36,20,15,.96));box-shadow:0 7px 0 #20110d,0 18px 50px rgba(0,0,0,.46),inset 0 0 0 2px rgba(255,175,91,.15);backdrop-filter:blur(6px); }
.village-header:before,.village-header:after { content:"";position:absolute;top:50%;width:60px;height:7px;border-radius:8px;background:linear-gradient(90deg,#392116,#bc6b34);box-shadow:0 0 0 3px #25140e; }.village-header:before{right:100%}.village-header:after{left:100%;scale:-1 1}
.blacksmith-npc { left:27%;bottom:3%;width:min(28vw,350px);height:min(70vh,590px);filter:drop-shadow(0 25px 24px rgba(0,0,0,.5));transform-origin:center bottom; }
.blacksmith-npc img { position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;transition:transform .22s ease,filter .22s ease; }
.blacksmith-npc:hover { transform:translateY(-6px) scale(1.025) rotateY(-2deg); }
.blacksmith-npc:hover img,.blacksmith-npc:focus-visible img { filter:drop-shadow(0 0 20px rgba(255,103,39,.75)) brightness(1.06); }
.blacksmith-npc:focus-visible { outline:0; }
.blacksmith-npc .npc-action { position:absolute;z-index:2;left:50%;bottom:1%;translate:-50% 0;display:grid;justify-items:center;white-space:nowrap; }
.blacksmith-npc .npc-action strong { padding:11px 22px;border:2px solid #d16e30;border-radius:100px;background:linear-gradient(#4d2618,#1b1110);box-shadow:0 5px 0 #110a08,0 9px 28px rgba(0,0,0,.55);color:#ffd49b;font:800 .78rem "Manrope",sans-serif;letter-spacing:.11em; }
.blacksmith-npc .npc-action small { margin-top:6px;padding:6px 14px;border-radius:100px;background:#f3d8a7;color:#27160e;font-size:.57rem;font-weight:800;box-shadow:0 5px 13px rgba(0,0,0,.35); }
.village-residents { position:absolute;z-index:2;inset:0;pointer-events:none; }
.resident { position:absolute;display:grid;justify-items:center;padding:7px 11px;border:1px solid rgba(255,226,174,.32);border-radius:12px;background:rgba(30,20,15,.62);box-shadow:0 6px 20px rgba(0,0,0,.32);backdrop-filter:blur(4px);color:rgba(255,234,199,.72);font:800 .48rem "Manrope",sans-serif;letter-spacing:.09em;opacity:.78; }.resident small{margin-top:2px;font:600 .46rem "DM Sans",sans-serif;opacity:.62}.resident.guard{left:64%;bottom:28%}.resident.elder{left:72%;bottom:26%}.resident.merchant{right:8%;bottom:22%}
.forge-panel { z-index:7;border-color:#e47331;background:radial-gradient(circle at 84% 17%,rgba(255,91,31,.27),transparent 32%),linear-gradient(145deg,rgba(58,34,25,.98),rgba(9,10,14,.99) 72%);backdrop-filter:blur(13px); }
@media(max-width:950px) and (orientation:landscape){
  .game-hub{padding:14px 24px 12px}.hub-header{min-height:32px}.hub-brand-mark{width:26px;height:26px;border-radius:8px}.hub-brand-mark i{width:7px;height:7px}.hub-intro{margin:10px 0 12px}.hub-intro h1{font-size:clamp(1.7rem,5vw,2.7rem);line-height:.9}.hub-intro>p:last-child{display:none}.game-library{gap:12px}.game-tile{min-height:190px;padding:14px;border-radius:18px}.tile-copy strong{font-size:clamp(1.45rem,3.4vw,2.5rem)}.tile-copy>small{margin-top:8px}.tile-action{margin-top:12px;padding-top:9px}.hub-status{margin:8px 0 0}
  #fullscreen-button{display:inline-block}
  .hud{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}.touch-controls{left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));bottom:max(44px,calc(env(safe-area-inset-bottom) + 30px))}
  #hud-market-button{display:inline-block}.hud-actions #sound-button{display:none}
  .hud{min-height:54px;padding:7px 10px;grid-template-columns:1fr auto auto;gap:8px}.level-info{display:none}.economy>span{min-width:72px;padding:5px 7px}.economy small{display:none}.hud-actions button{padding:6px 8px;font-size:.48rem}.hud-actions #sound-button,.hud-actions #pause-button{display:none}.controls{display:none}.overlay h1{font-size:clamp(2.8rem,10vw,4.5rem)}.overlay>p:not(.eyebrow,.restart-hint){max-width:440px;font-size:.7rem;margin-bottom:9px}.lobby-actions{width:min(330px,62vw);min-width:0;gap:6px}.lobby-actions>button{height:36px;padding:0 14px;font-size:.53rem}.lobby-actions button span{padding-left:12px}.touch-controls{display:flex}.overlay{padding:8px 12px}.title-mark{height:26px}.restart-hint{display:none}.level-select{width:min(900px,96vw);max-height:94dvh;padding:13px 16px;border-radius:20px}.level-select-header{grid-template-columns:.72fr 1.28fr;gap:14px;margin-bottom:10px;padding-bottom:10px}.level-select-header h2{font-size:1.45rem}.level-select-header>p{font-size:.56rem;line-height:1.4}.level-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.level-card{min-height:96px;padding:9px!important;border-radius:13px!important}.level-card-name,.level-card .name,.level-card>strong{margin-top:7px;font-size:.65rem}.level-card-status,.level-card .status,.level-card>small:last-child{margin-top:3px;font-size:.42rem}#level-select-back{margin-top:9px;padding:7px 14px;font-size:.5rem}.market{padding:8px}.market h2{font-size:1.55rem}.market-wallets{margin:4px 0;gap:5px}.market-wallets span{padding:5px 9px;font-size:.5rem}.market-wallets b{font-size:.68rem}.market-summary{margin-bottom:5px}.market-toggle{margin:5px 0 7px;padding:9px 15px}.market-grid{grid-template-columns:repeat(2,1fr);width:min(700px,94vw);gap:8px}.shop-card{grid-template-columns:46px 1fr;min-height:118px;padding:11px;gap:9px}.shop-icon{width:44px;height:44px;border-radius:13px;font-size:1.3rem}.cloak-icon i{scale:.7}.shop-card h3{font-size:.78rem}.shop-card p{font-size:.56rem}.shop-card button{padding:8px;font-size:.53rem}.continue-button{margin-top:7px;padding:9px 16px}.market-note{display:none}.inventory-panel{inset:4%;padding:12px}.inventory-help{margin:3px 0 8px}.inventory-grid{gap:8px}.inventory-character{min-height:245px;grid-template-columns:38% 1fr}.avatar-stage{min-height:230px;padding:8px}.avatar-stage img{height:210px}.character-inventory{padding:12px}.character-inventory h3{margin:2px 0 7px;font-size:1rem}.gear-slot{min-height:58px}.inventory-items{margin-top:6px}.inventory-item{padding:6px}.village-header{top:58px;padding:8px 16px}.village-header h2{font-size:1.35rem}.blacksmith-npc{left:25%;bottom:1%;width:210px;height:330px;scale:1}.resident{display:none}.forge-panel{padding:18px}.forge-panel h3{font-size:1.5rem}.forge-panel>p:not(.eyebrow){margin-bottom:8px;font-size:.62rem}
}
@media(max-width:780px) and (orientation:portrait){.game-hub{padding:18px 16px 26px}.hub-count{display:none}.hub-intro{margin:38px 0 28px}.hub-intro h1{font-size:clamp(2.35rem,12vw,4rem)}.game-library{grid-template-columns:1fr;gap:14px;margin:0}.game-tile{min-height:260px}.hub-status{margin-top:18px}}
@media(min-width:951px){
  #fullscreen-button{display:none}
  .overlay{background-position:center,center,42% center;background-size:auto,auto,cover}
}
@media(max-width:700px) and (orientation:portrait){body:not(.hub-open) .rotate-device{display:flex}}
@media(prefers-reduced-motion:reduce){.overlay,.message,.lobby-actions>button{transition:none}.lobby-actions>button:hover,.lobby-actions>button:focus-visible{transform:none}.level-transition.active{animation-duration:2.15s}.transition-check,.level-transition p,.level-transition strong,.level-transition>span,.transition-burst i{animation:none}}
@media(hover:hover) and (pointer:fine){
  html,body,#game,#game-canvas,#game button,#game [role="button"]{cursor:url("assets/nita-cursor.svg") 3 3,auto}
  #game input,#game textarea{cursor:text}
  #game button:disabled{cursor:url("assets/nita-cursor.svg") 3 3,not-allowed}
}