:root{--ink:#e8e5d9;--muted:#a7b5ad;--bg:#101c18;--panel:#1b2a23;--border:#364539;--gold:#d8b76b;--accent:#c9a452;--wood:#be9160;--stone:#b8c4bf;--iron:#9daec4;--grain:#e9c277}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 system-ui,sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button{border:0}.topbar{height:86px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 28px;border-bottom:1px solid var(--border);background:#15221d;position:relative;z-index:3}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--ink);font-family:Georgia,serif;font-size:16px;letter-spacing:1px;white-space:nowrap}.brand small{display:block;font:9px system-ui;letter-spacing:3.5px;color:var(--gold);margin-top:5px}.crest{font-size:30px;border:1px solid var(--gold);color:var(--gold);border-radius:6px 6px 15px 15px;width:42px;height:47px;text-align:center}.resources{display:flex;gap:10px}.resource{display:grid;grid-template-columns:23px 1fr;gap:0 8px;min-width:108px;border-right:1px solid var(--border);padding-right:17px}.resource .symbol{grid-row:span 2;color:var(--color);font-size:26px}.resource b{font-size:17px;color:#ede8d7;font-weight:600;line-height:1.2}.resource small{color:var(--muted);font-size:10px}.resource em{font-style:normal;font-size:10px;color:#7fba89;margin-left:4px}.account{border:1px solid var(--border);background:#22352a;color:var(--gold);border-radius:6px;padding:10px 14px;font-size:13px}.app{display:grid;grid-template-columns:200px 1fr;max-width:1740px;margin:auto}.sidebar{padding:28px 16px;border-right:1px solid var(--border);min-height:calc(100dvh - 86px);display:flex;flex-direction:column}.realm{font-size:10px;letter-spacing:2px;color:var(--gold);padding:0 14px 24px}.realm span{display:block;font-size:9px;letter-spacing:1px;color:var(--muted);margin-top:5px}.sidebar nav{display:flex;flex-direction:column;gap:7px}.sidebar nav button{display:flex;gap:13px;text-align:left;align-items:center;background:transparent;color:#b3beb2;padding:12px 15px;border-radius:5px;font-size:20px}.sidebar nav button span{font-size:14px}.sidebar nav button.active{color:var(--gold);background:linear-gradient(90deg,#3d4028,#263326);box-shadow:inset 2px 0 var(--gold)}.side-bottom{margin-top:auto;padding:35px 12px 0;font-size:11px;color:var(--muted)}.quiet{display:block;margin-top:13px;background:none;color:var(--muted);padding:0;font-size:12px}main{min-width:0;padding:26px 30px}.page-heading{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:12px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--gold)}h1{font:32px Georgia,serif;font-weight:400;margin:4px 0}h2{font:21px Georgia,serif;margin:0 0 10px}h3{font:23px Georgia,serif;margin:8px 0 12px}p{color:var(--muted);line-height:1.7}small{font-size:12px}.settlement-stats{display:flex;gap:20px;font-size:12px;color:var(--muted)}.settlement-stats b{color:var(--ink)}.network-note{font-size:11px;color:#a5b3a5;margin-bottom:16px}.network-note.error{color:#f0b49a}.village-layout{display:grid;grid-template-columns:minmax(0,1fr) 264px;gap:20px}.stage-frame{border:1px solid #7f8057;padding:4px;background:#394837;border-radius:10px;box-shadow:0 15px 45px #0003}.village-stage{position:relative;isolation:isolate;aspect-ratio:1.5;background:#758b51 url('assets/valley-open.png') center/100% 100%;overflow:hidden;border-radius:6px}.village-stage.night:before{content:'';position:absolute;inset:0;background:#0c1c6190;mix-blend-mode:multiply;pointer-events:none;z-index:4}.map-caption{position:absolute;left:17px;right:17px;top:13px;display:flex;justify-content:space-between;color:#fff7dd;font-size:10px;text-shadow:0 1px 4px black;z-index:5;letter-spacing:.7px}.map-weather{padding:4px 10px;background:#162a2475;border-radius:20px}.building{position:absolute;width:19%;aspect-ratio:1;transform:translate(-50%,-83%);background:none;padding:0;isolation:isolate;transition:filter .2s;z-index:2}.building .art{display:block;width:100%;height:100%;background-image:url('assets/buildings.png');background-size:400% 200%;background-position:var(--sprite-x) var(--sprite-y);filter:drop-shadow(0 5px 3px #17281f66);transition:transform .25s}.building.selected .art,.building:hover .art{filter:drop-shadow(0 0 5px #ffdc8a);transform:translateY(-4px) scale(1.05)}.building .building-name{position:absolute;left:50%;bottom:-5px;transform:translateX(-50%);color:#f6eac9;background:#14271fe8;border:1px solid #8f8957;white-space:nowrap;font-size:10px;padding:2px 8px;border-radius:5px}.building .level{position:absolute;bottom:-23px;left:50%;transform:translateX(-50%);background:#eee0b8;color:#374332;min-width:22px;padding:1px 5px;border:2px solid #676b42;border-radius:50%;font-size:10px;font-weight:bold}.building.unbuilt .art{opacity:.26;filter:grayscale(1)}.building.unbuilt .building-name{border-style:dashed;color:#dfd6b9}.building.in-progress .art{animation:work 2s ease-in-out infinite}.building.in-progress .level{background:#e5b44d}.building.reveal .art{animation:reveal 1.2s ease-out}.stage-guide{position:absolute;bottom:9px;left:50%;transform:translateX(-50%);background:#112d2480;color:#faf5df;font-size:10px;padding:5px 14px;border-radius:25px;white-space:nowrap;z-index:5}.under-map{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:13px 0 20px;font-size:10px;color:var(--muted)}.status-light{display:inline-block;width:5px;height:5px;background:#86af73;border-radius:50%;margin-right:5px}.text-btn{color:var(--gold);background:none;padding:4px 0;font-size:12px}.quest-strip{border:1px solid #6b6340;border-radius:7px;background:linear-gradient(100deg,#373921,#1c2c23);padding:17px;display:flex;align-items:center;gap:15px}.quest-symbol{font-size:30px;color:var(--gold)}.quest-strip small{display:block;font-size:9px;color:var(--gold);letter-spacing:1px}.quest-strip strong{display:block;font-size:13px;margin:4px 0}.quest-strip span{display:block;font-size:10px;color:var(--muted)}.quest-strip button{margin-left:auto;white-space:nowrap;font-size:12px}.detail-panel,.panel{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:20px}.detail-panel{align-self:start;min-height:400px}.detail-art{width:155px;height:155px;background-image:url('assets/buildings.png');background-size:400% 200%;background-position:var(--sprite-x) var(--sprite-y);margin:-6px auto 0;filter:drop-shadow(0 8px 5px #0004)}.detail-kind{font-size:9px;letter-spacing:2px;color:var(--gold)}.detail-panel h2{font-size:25px;margin:7px 0}.detail-panel p{font-size:12px;margin:10px 0}.level-line{font-size:11px;display:flex;justify-content:space-between;color:var(--muted);border-bottom:1px solid var(--border);padding:0 0 12px}.level-line b{color:var(--gold)}.costs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:15px 0;font-size:11px}.costs span{background:#13231c;padding:7px;border-radius:4px}.costs .short{color:#f1a58b}.gold-btn{background:linear-gradient(#d7b96f,#b89850);color:#20281d;border:1px solid #e6cb8c;border-radius:5px;padding:10px 15px;font-size:13px;font-weight:700;box-shadow:0 2px 4px #0003}.detail-panel .gold-btn{width:100%;margin-top:10px}.dark-btn{background:#2a3b30;border:1px solid #63705a;color:var(--ink);padding:10px 15px;border-radius:5px;font-size:13px}.detail-tip{font-size:10px!important}.lower-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}.panel-title{display:flex;justify-content:space-between;align-items:center;gap:10px}.panel-title h2{font-size:18px}.panel-title>span{color:var(--muted);font-size:10px}.panel p{font-size:13px}.queue-item{margin:12px 0;padding-bottom:10px;border-bottom:1px solid var(--border)}.queue-item .row{display:flex;justify-content:space-between;gap:8px;font-size:12px}.queue-item small{color:var(--gold);font-size:10px}.progress{height:4px;border-radius:5px;background:#364b3a;margin-top:9px;overflow:hidden}.progress i{height:100%;display:block;background:var(--gold);transition:width 1s linear}.empty{padding:20px 0;color:var(--muted);font-size:13px}.advisor{display:flex;gap:12px;align-items:center}.advisor b{display:block;font-size:12px}.advisor small{color:var(--muted);font-size:10px}.seal{display:grid;place-items:center;width:36px;height:40px;border:1px solid #7e895b;color:var(--gold);font-family:Georgia,serif;border-radius:50%}.two-columns{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}.world-grid{display:grid;grid-template-columns:repeat(9,1fr);gap:2px;border:1px solid #657853;padding:4px;background:#283a2c;aspect-ratio:1.15}.world-tile{aspect-ratio:1;background:#658459;color:#dce5c7;border-radius:2px;position:relative;padding:0;font-size:21px}.world-tile:nth-child(3n){background:#5f7b50}.world-tile.own{outline:2px solid var(--gold);z-index:1}.world-tile.village{background:#8d9060;color:#fff2c6}.world-tile small{display:block;font-size:8px;overflow:hidden;text-overflow:ellipsis;max-width:100%}.world-tile.ruins{background:#676c4b}.muted{color:var(--muted);font-size:12px!important}.unit-display{display:flex;gap:20px;align-items:center;margin:24px 0}.unit-display>span{font-size:65px;color:var(--gold)}.unit-display h3{font-size:20px}.unit-display p{margin:4px 0}form{display:grid;gap:14px;margin-top:20px}label{display:grid;gap:7px;color:#c1caba;font-size:13px}input,select{background:#11221b;border:1px solid #465b47;color:var(--ink);border-radius:5px;padding:10px;width:100%;min-width:0}.form-row{display:flex;gap:12px}.form-row>label{flex:1}.trade-offer,.alliance-item,.report,.message{padding:13px 0;border-bottom:1px solid var(--border);font-size:13px}.trade-offer{display:flex;justify-content:space-between;gap:12px}.trade-offer small,.message small,.report small{display:block;color:var(--muted);font-size:10px}.alliance-item{display:flex;align-items:center;justify-content:space-between}.shop-intro{max-width:600px;margin:24px 0}.shop-intro h2{font-size:32px}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.product{display:flex;flex-direction:column;gap:10px;padding:26px}.product-symbol{font-size:50px;color:var(--gold)}.product>small{color:var(--gold);font-size:10px;letter-spacing:1px}.product strong{font:22px Georgia,serif;margin-top:auto}.product strong small{display:block;font:11px system-ui;color:var(--muted);margin-top:5px}.product button{margin-top:14px}.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);max-width:min(90vw,580px);background:#eddbaf;color:#293323;padding:14px 24px;border:1px solid #998956;border-radius:7px;box-shadow:0 6px 40px #0005;z-index:30;font-size:14px}dialog{background:#1b2a23;color:var(--ink);border:1px solid #6f714e;border-radius:10px;padding:32px;width:440px;max-width:94vw}dialog::backdrop{background:#03120bd9;backdrop-filter:blur(5px)}dialog h2{font-size:31px;margin-top:10px}dialog p{font-size:13px}.close{position:absolute;right:12px;top:10px;background:none;color:var(--ink);font-size:24px}.error{color:#edb79c}footer{display:flex;justify-content:space-between;font-size:10px;color:#809283;margin-top:25px;padding-top:20px;border-top:1px solid var(--border)}.ambient{pointer-events:none;position:absolute;inset:0}.villager{position:absolute;color:#f1d298;text-shadow:0 2px #343023;font-size:12px;bottom:25%;left:32%;animation:walk 22s linear infinite}.v2{animation-delay:-8s;bottom:30%;color:#8fb5c0}.v3{animation-delay:-15s;bottom:38%;color:#e5a795}.bird{position:absolute;top:25%;left:10%;width:8px;height:3px;border-top:1px solid #162d26;border-radius:50%;animation:fly 25s linear infinite}.b2{animation-delay:-8s;top:20%}.celebration{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);z-index:9;background:#1a2e22eb;border:1px solid var(--gold);padding:17px 30px;color:#f1d18a;text-align:center;border-radius:9px;white-space:nowrap;box-shadow:0 0 30px #e4cf7170;pointer-events:none}.celebration:before{content:'✦';display:block;font-size:30px}@keyframes walk{0%,100%{left:24%;transform:translateY(0)}25%{left:43%;transform:translateY(-10px)}50%{left:62%;transform:translateY(-2px)}75%{left:43%;transform:translateY(8px)}}@keyframes fly{from{left:-10%;transform:translateY(0)}to{left:110%;transform:translateY(-30px)}}@keyframes work{0%,100%{filter:drop-shadow(0 0 3px #eccb80);transform:translateY(0)}50%{filter:drop-shadow(0 0 10px #eccb80);transform:translateY(-3px)}}@keyframes reveal{0%{transform:scale(.5);opacity:.3}60%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}[hidden]{display:none!important}.motion-off *{animation:none!important;transition:none!important}
@media(min-width:1550px){.village-layout{grid-template-columns:minmax(0,1fr) 300px}.detail-panel{padding:25px}.building .building-name{font-size:12px}.building .level{font-size:12px}.detail-panel p{font-size:14px}.resource{min-width:130px}.detail-art{width:185px;height:185px}}
@media(max-width:1150px){.topbar{padding:0 18px;gap:12px}.brand{font-size:12px}.brand small{font-size:8px}.crest{display:none}.resource{min-width:85px;padding-right:8px;gap:0 3px}.resource b{font-size:14px}.resource small{font-size:9px}.app{grid-template-columns:165px 1fr}.sidebar{padding:24px 10px}.sidebar nav button{padding:12px 9px;gap:8px}.sidebar nav button span{font-size:12px}main{padding:23px 20px}.village-layout{grid-template-columns:1fr 230px;gap:15px}.detail-panel{padding:15px}.detail-art{width:125px;height:125px}.building .building-name{font-size:8px}.building .level{bottom:-19px;min-width:18px}.detail-panel h2{font-size:23px}.quest-strip{padding:12px;gap:9px}.quest-strip span{display:none}.quest-strip strong{font-size:11px}.under-map>div{max-width:60%}}
@media(max-width:850px){.topbar{height:auto;min-height:108px;flex-wrap:wrap;gap:8px;padding:12px 16px}.brand{font-size:13px;order:0}.brand small{font-size:8px}.account{order:1;font-size:11px;padding:7px 10px}.resources{order:2;width:100%;justify-content:space-between;margin-top:8px;gap:4px}.resource{flex:1;min-width:0}.resource .symbol{font-size:20px}.resource small{font-size:8px}.app{display:block}.sidebar{position:fixed;bottom:0;left:0;right:0;min-height:0;height:65px;padding:4px;background:#15251ff2;backdrop-filter:blur(12px);border-top:1px solid var(--border);border-right:0;z-index:15}.sidebar .realm,.side-bottom{display:none}.sidebar nav{flex-direction:row;gap:0;justify-content:space-around;overflow:auto}.sidebar nav button{flex-direction:column;gap:0;min-width:46px;padding:3px 5px;border-radius:5px;font-size:20px}.sidebar nav button span{font-size:8px;white-space:nowrap}.sidebar nav button.active{box-shadow:inset 0 -2px var(--gold)}main{padding:20px 14px 85px}.page-heading{align-items:flex-start}h1{font-size:28px}.settlement-stats{gap:4px;flex-direction:column;font-size:10px}.village-layout{grid-template-columns:1fr}.village-stage{aspect-ratio:1.25;background-size:100% 100%}.building{width:21%}.building .building-name{font-size:8px}.stage-guide{font-size:8px}.map-caption{font-size:8px;left:10px;right:10px}.detail-panel{min-height:0;display:grid;grid-template-columns:110px 1fr;column-gap:15px}.detail-art{grid-row:span 8;width:110px;height:110px;align-self:center;margin:0}.detail-panel .costs{margin:8px 0}.detail-panel .detail-tip{grid-column:2}.detail-panel .level-line{padding-bottom:5px}.detail-panel h2{font-size:21px}.detail-panel p{font-size:12px;margin:6px 0}.detail-panel .gold-btn{margin-top:5px}.detail-kind{font-size:9px}.lower-grid,.two-columns{grid-template-columns:1fr;gap:15px}.lower-grid{margin-top:15px}.product-grid{grid-template-columns:1fr}.network-note{font-size:10px}.under-map{font-size:9px}.quest-strip strong{font-size:12px}.quest-strip button{font-size:11px;padding:9px}.quest-symbol{font-size:23px}.world-tile{font-size:20px}.world-tile small{font-size:8px}footer{gap:15px;flex-wrap:wrap}.toast{bottom:80px}.panel{padding:18px}.celebration{font-size:12px;padding:12px 20px}}
@media(prefers-reduced-motion:reduce){body:not(.motion-on) *{animation:none!important;transition:none!important}}

/* Construction progresses visibly through foundation, frame and finishing. */
.scaffold{display:none}.in-progress .scaffold{display:block;position:absolute;inset:35% 12% 8%;border:3px solid #98784b;border-top:5px solid #d2b07a;background:repeating-linear-gradient(90deg,transparent 0 27%,#a78855 28% 31%,transparent 32% 33%);transform:skewY(-8deg);pointer-events:none}.in-progress[data-phase="1"] .art{opacity:.32;clip-path:inset(62% 0 0)}.in-progress[data-phase="2"] .art{opacity:.7;clip-path:inset(25% 0 0)}.in-progress[data-phase="3"] .scaffold{opacity:.4}.ambient{z-index:90}.villager{width:7px;height:13px;background:#d1a659;border-radius:3px 3px 2px 2px;font-size:0;box-shadow:1px 2px 2px #15271b}.villager:before{content:"";position:absolute;width:6px;height:6px;left:1px;top:-5px;border-radius:50%;background:#edc18c}.villager:after{content:"";position:absolute;top:11px;left:0;width:7px;height:5px;border-left:2px solid #362d27;border-right:2px solid #362d27;animation:steps .35s alternate infinite}.villager.v2{background:#5e8c9a}.villager.v3{background:#b16d54}.villager i{position:absolute;left:-3px;top:3px;width:13px;height:3px;background:#aa8054;transform:rotate(15deg)}.celebration{z-index:100}.resource{grid-template-columns:18px 1fr}.resource b{white-space:nowrap}@keyframes steps{to{transform:skewX(20deg)}}@media(max-width:850px){.resource{padding-right:3px;grid-template-columns:13px 1fr;gap:0 2px}.resource .symbol{font-size:16px}.resource b{font-size:12px}.resource em{font-size:8px;margin-left:2px}.side-bottom{display:flex;position:fixed;right:10px;bottom:70px;gap:10px;padding:5px 10px;background:#15251ff2;border-radius:6px}.side-bottom>div{display:none}.side-bottom .quiet{margin:0;font-size:10px}.villager{transform:scale(.7)}}
/* Alpha 0.4 — clãs, estruturas evolutivas e comunidades */
.live-hud{display:flex;gap:18px;align-items:center;flex-wrap:wrap;padding:10px 0 18px;color:#d8c99d;font-size:12px}.live-hud time{margin-left:auto;font-variant-numeric:tabular-nums}.live-hud #clan-badge{color:var(--clan-color,var(--gold))}.building .art,.detail-art{background-image:none!important}.building .art svg,.detail-art svg{width:100%;height:100%;overflow:visible}.building.unbuilt .art{opacity:.85;filter:none}.building .art{filter:drop-shadow(0 4px 3px #15271b77)}.building[data-level="0"] .building-name{font-size:9px}.clan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:25px 0}.clan-card{padding:18px 12px;background:#22342b;color:var(--ink);border:1px solid #45624b;border-radius:10px;text-align:left;transition:transform .2s,border-color .2s}.clan-card:hover{transform:translateY(-3px);border-color:var(--clan-color)}.clan-card>span{display:block;font-size:36px;color:var(--clan-color)}.clan-card strong{display:block;font:22px Georgia}.clan-card small{display:block;color:var(--muted);font-size:12px;margin-top:10px}.clan-card.chosen{opacity:1;border:2px solid var(--clan-color)}#clan-dialog{width:860px;max-height:94dvh;overflow:auto}#clan-dialog h2{font-size:35px}.worker-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:24px 0}.worker-card{display:grid;gap:10px;padding:20px;border:1px dashed #627059;border-radius:8px;color:#8c998c}.worker-card.hired{background:#304331;color:#e8d7a2;border-style:solid}.worker-card>span{font-size:35px}.worker-card small{font-size:11px}.chat-feed{height:350px;overflow:auto;margin-top:18px;background:#132019;padding:12px;border-radius:7px}.chat-bubble{background:#26392d;padding:12px;border-radius:8px;margin:8px 0}.chat-bubble small{float:right;font-size:10px;color:#a5b2a3}.chat-bubble p{color:#e0e7d9;white-space:pre-wrap;overflow-wrap:anywhere;margin:5px 0}.chat-bubble button{font-size:10px;margin-right:15px}textarea{background:#12211a;color:#e8e5d9;border:1px solid #52664e;border-radius:6px;padding:12px;font:inherit;resize:vertical}#attack-alert{position:sticky;top:0;z-index:110;background:#71392d;border:1px solid #d99a70;padding:12px;margin-bottom:12px;border-radius:7px}#attack-alert b{font-variant-numeric:tabular-nums}#attack-alert button{margin-left:15px}.sidebar nav{gap:3px}.sidebar nav button{padding-top:8px;padding-bottom:8px}.village-stage:has(.building[data-level="0"]):after{pointer-events:none}.in-progress[data-phase="1"] .art{opacity:.6}.in-progress .scaffold{border-color:#b59457}.in-progress:after{content:'⚒';position:absolute;bottom:10%;left:40%;color:#fce0a0;font-size:20px;animation:hammer .5s alternate infinite}@keyframes hammer{to{transform:rotate(-30deg)}}@media(max-width:850px){.sidebar nav{justify-content:flex-start;overflow-x:auto}.sidebar nav button{min-width:65px;flex:none}.live-hud{gap:8px;font-size:10px}.live-hud time{margin-left:0}.clan-grid{grid-template-columns:repeat(2,1fr);gap:8px}.clan-card{padding:12px}.clan-card>span{font-size:27px}.clan-card strong{font-size:19px}.clan-card small{font-size:11px}.worker-cards{grid-template-columns:repeat(2,1fr);gap:8px}.worker-card{padding:12px}#clan-dialog{padding:20px}#clan-dialog h2{font-size:28px}.chat-feed{height:300px}}

@media(max-width:850px){.sidebar:before{content:'Deslize o menu para ver mais →';position:absolute;right:8px;top:-17px;font-size:9px;color:#cab77f;background:#15251f;padding:0 6px;border-radius:3px}.side-bottom{bottom:86px}}
/* Detailed painted structures and working construction crews, 0.4.1 */
.painted-building{position:relative;display:block;width:100%;height:100%;isolation:isolate}.painted-main,.painted-annex{position:absolute;inset:0;background-image:url('assets/buildings.png');background-size:400% 200%;background-position:var(--sprite-x) var(--sprite-y);background-repeat:no-repeat}.painted-annex{inset:55% -13% -3% 65%;background-position:0 100%;z-index:2;filter:brightness(.91)}.painted-annex.second{inset:62% 66% -4% -12%;filter:brightness(.86)}.clan-pennant{position:absolute;width:8%;height:9%;left:52%;top:9%;clip-path:polygon(0 0,100% 15%,70% 50%,100% 95%,0 80%);transform-origin:left;animation:pennant 4s ease-in-out infinite;opacity:.85}.tier-1 .clan-pennant{display:none}.empty-lot{position:absolute;left:23%;right:23%;bottom:10%;height:23%;border:1px dashed #e8d6a0aa;background:#58472c50;transform:skewY(-15deg);border-radius:40%}.empty-lot:after{content:'+';color:#e6d5a3;font-size:24px;position:absolute;inset:-12px 0 0;text-shadow:0 1px 3px #243224}.building .art{overflow:visible}.building.in-progress .art{animation:none!important;opacity:1!important;filter:drop-shadow(0 4px 3px #25331e77)!important;transform:none!important;clip-path:inset(var(--reveal,78%) -20% -15%)!important}.in-progress .scaffold{inset:42% 18% 10%;border:0;border-left:3px solid #8b7049;border-right:3px solid #a58a5f;background:repeating-linear-gradient(0deg,transparent 0 18%,#b2935e 19% 22%,transparent 23% 33%);box-shadow:inset 1px 0 #d8b882;transform:skewY(-7deg);opacity:.8;transition:opacity .8s}.in-progress[data-phase="3"] .scaffold{opacity:.25}.in-progress:after{display:none}.construction-site{position:absolute;inset:0;pointer-events:none;z-index:5}.site-worker{position:absolute;width:12%;height:22%;bottom:2%;left:27%;filter:drop-shadow(1px 2px 1px #1d2d2260)}.site-worker svg{width:100%;height:100%;overflow:visible}.site-worker .worker-arm{transform-origin:27px 24px;animation:masonswing .65s ease-in-out infinite}.porter{left:64%;bottom:-2%;animation:carrymaterials 6s linear infinite}.porter .worker-arm{animation:none}.porter .worker-legs{transform-origin:20px 37px;animation:workerstep .3s alternate infinite}.timber-stack{position:absolute;bottom:0;left:5%;width:18%;height:10%;border-radius:3px;background:repeating-linear-gradient(0deg,#6d4b2c 0 3px,#b48e59 3px 5px);transform:rotate(-13deg);box-shadow:2px 2px 3px #1e2e2355}.work-dust{position:absolute;bottom:7%;left:25%;width:12%;height:8%;border-radius:50%;background:#dbc89888;filter:blur(3px);animation:workdust 1.3s ease-out infinite}.site-crane{position:absolute;right:13%;top:26%;height:55%;width:3px;background:#9b7950;box-shadow:1px 0 #d1b184}.site-crane:before{content:'';position:absolute;right:-6px;top:0;width:35px;height:3px;background:#a4814e;transform:rotate(-15deg)}.site-crane i{position:absolute;right:18px;top:4px;width:1px;height:28px;background:#d9c49b;animation:hoist 4s ease-in-out infinite;transform-origin:top}.site-crane i:after{content:'';position:absolute;bottom:-6px;left:-4px;width:9px;height:7px;border-radius:1px;background:#a3a99a;box-shadow:1px 1px #5f6e62}.site-time{position:absolute;top:6%;left:50%;transform:translateX(-50%);padding:3px 8px;border:1px solid #d4b97799;border-radius:12px;background:#213529ed;color:#f4d994;font-size:11px;white-space:nowrap;font-variant-numeric:tabular-nums;z-index:7}.detail-art{width:190px;height:190px}.detail-progress{height:6px;margin:10px 0}#construction-clock{font-variant-numeric:tabular-nums;color:#e0c684!important}.building.selected .art{filter:drop-shadow(0 0 4px #ffdc8a)}@keyframes masonswing{0%,100%{transform:rotate(20deg)}55%{transform:rotate(-60deg)}}@keyframes carrymaterials{0%,100%{transform:translateX(0)}48%{transform:translateX(-45px)}50%{transform:translateX(-45px) scaleX(-1)}98%{transform:translateX(0) scaleX(-1)}}@keyframes workerstep{to{transform:skewX(14deg)}}@keyframes hoist{50%{height:10px}}@keyframes workdust{0%{opacity:0;transform:scale(.3)}35%{opacity:.7}100%{opacity:0;transform:translateY(-10px) scale(1.7)}}@keyframes pennant{50%{transform:skewY(8deg)}}@media(max-width:850px){.detail-art{width:110px;height:110px}.site-worker{width:17%;height:28%}.site-time{font-size:9px;padding:2px 5px}.site-crane:before{width:20px}.site-crane i{right:9px}.site-crane{width:2px}.in-progress .scaffold{border-width:2px}}
/* A living city: independent perimeter, residents, farms and lighting. */
.village-stage{background-image:url('assets/valley-open.png')}.building{width:16%;}.life-sprite{position:absolute;inset:0;background-image:url('assets/living-atlas.png');background-repeat:no-repeat}.wall-mini{position:absolute;inset:0;background:url('assets/wall-ring.png') center/contain no-repeat}.city-wall{position:absolute;inset:5% 3% 6%;background:url('assets/wall-ring.png') center/100% 100% no-repeat;pointer-events:none;transition:opacity 1s}.city-wall.back{z-index:5;clip-path:inset(0 0 47%)}.city-wall.front{z-index:85;clip-path:inset(53% 0 0)}.city-wall[data-level="1"]{filter:brightness(.9)}.city-wall[data-level="4"],.city-wall[data-level="5"],.city-wall[data-level="6"]{filter:contrast(1.06)}.city-wall.wall-building{filter:sepia(.3)}.building[data-building="wall"]{width:13%;z-index:110!important}.building[data-building="wall"] .painted-building{opacity:0}.building[data-building="wall"] .construction-site{opacity:1}.building[data-building="wall"] .level{background:#e1c275}.painted-building .night-window{position:absolute;width:3%;height:5%;background:#ffd981;box-shadow:0 0 7px 3px #ffd986a0;opacity:0;border-radius:1px;transition:opacity 2s}.w1{left:43%;top:63%}.w2{left:65%;top:56%}.door-lantern{position:absolute;width:3%;height:4%;left:63%;top:74%;background:#ffe9ae;border-radius:50%;box-shadow:0 0 13px 5px #fac666b0;opacity:0;animation:candle 2s ease-in-out infinite}.city-night .night-window,.city-night .door-lantern{opacity:1}.night-shade{position:absolute;inset:0;background:#06122f;opacity:var(--night-shade,0);pointer-events:none;z-index:100;transition:opacity 2s}.street-lamp{position:absolute;width:4px;height:7px;background:#ffdf8c;box-shadow:0 0 18px 9px #ffbd5970;border-radius:50%;opacity:0;animation:candle 2s ease-in-out infinite}.city-night .street-lamp{opacity:1}#street-lights{position:absolute;inset:0;pointer-events:none;z-index:105}.wind-rotor{position:absolute;width:76%;height:76%;left:-12%;top:1%;transform:skewY(-8deg);pointer-events:none}.wind-rotor svg{animation:windturn 9s linear infinite;transform-origin:50% 50%;filter:drop-shadow(1px 2px 1px #422f2450)}.in-progress .wind-rotor svg{animation-play-state:paused}.chimney-smoke{position:absolute;left:34%;top:8%;width:10%;height:20%;pointer-events:none}.chimney-smoke i{position:absolute;inset:35% 5% 0;background:#e1dac99a;border-radius:50%;filter:blur(2px);animation:chimneysmoke 5s linear infinite}.chimney-smoke i:nth-child(2){animation-delay:-1.7s}.chimney-smoke i:nth-child(3){animation-delay:-3.4s}.waterwheel{position:absolute;width:19%;height:25%;left:17%;top:57%;border:3px solid #7e5734;border-radius:50%;background:repeating-conic-gradient(#b38c52 0deg 9deg,transparent 9deg 45deg);animation:windturn 10s linear infinite;box-shadow:inset 0 0 0 1px #cfb879}.quarry-hoist{position:absolute;left:70%;top:38%;width:1px;height:21%;background:#a68e66;animation:stonehoist 5s ease-in-out infinite}.quarry-hoist i{position:absolute;bottom:0;width:9px;height:8px;left:-4px;background:#bac0b1;box-shadow:1px 2px #6f7d70}.moving-cart{position:absolute;left:30%;bottom:10%;font-size:14px;color:#8c643d;animation:cartway 12s ease-in-out infinite}.guard-patrol,.tower-patrol{position:absolute;left:37%;top:74%;width:9%;height:20%;animation:guardway 9s ease-in-out infinite}.guard-patrol svg,.tower-patrol svg{width:100%;height:100%}.tower-patrol{left:35%;top:27%;width:7%;height:16%;animation-duration:12s}.beacon-flame{position:absolute;left:45%;top:11%;width:6%;height:12%;border-radius:60% 20% 55% 45%;background:linear-gradient(#ff7f2d,#fff2b9);box-shadow:0 0 8px 3px #ff9b4880;animation:fireflicker .7s ease-in-out infinite}.fountain-ripple{position:absolute;width:10%;height:5%;left:48%;top:75%;border:1px solid #c6e8e7;border-radius:50%;animation:ripple 2.5s ease-out infinite}.royal-banner{position:absolute;left:42%;top:50%;width:7%;height:19%;background:#407c70;clip-path:polygon(0 0,100% 0,90% 100%,50% 83%,0 100%);animation:bannerwave 3s ease-in-out infinite;transform-origin:top}.clan-pennant{display:block!important;animation:bannerwave 3s ease-in-out infinite}.river-glimmer{position:absolute;inset:4% 0 0 93%;background:repeating-linear-gradient(173deg,transparent 0 25px,#e2f4e944 28px,transparent 32px);opacity:.6;animation:riverflow 9s linear infinite;pointer-events:none;z-index:2}.drifting-cloud{position:absolute;width:45%;height:20%;left:-45%;top:13%;border-radius:50%;background:#22342920;filter:blur(18px);animation:cloudway 65s linear infinite;pointer-events:none;z-index:4}#city-residents,#city-animals{position:absolute;inset:0;pointer-events:none;z-index:89}.city-person{position:absolute;width:1.7%;height:4%;min-width:9px;min-height:16px;animation:citywalk var(--walk-time) linear infinite;filter:drop-shadow(1px 2px 1px #20312166)}.city-person svg{width:100%;height:100%;overflow:visible}.city-person svg>path{fill:var(--coat)}.city-person .worker-legs{animation:workerstep .3s alternate infinite;transform-origin:20px 37px}.city-person .worker-arm{animation:none}.farm-animal{position:absolute;width:5%;height:5%;animation:animalwalk 22s ease-in-out infinite}.farm-animal.hen{width:2.4%;height:3.5%;animation-duration:14s}.farm-animal .life-sprite{animation:graze 2.5s ease-in-out infinite;transform-origin:center bottom}.light-control{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:11px;color:var(--muted)}.light-control select{padding:5px;font-size:11px;max-width:150px}.under-map{flex-wrap:wrap}.population-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.population-stats>div{padding:12px;background:#14251c;border:1px solid #455439;border-radius:7px}.population-stats strong{font:25px Georgia;color:var(--gold);display:block}.population-stats span{font-size:11px;color:var(--muted)}#arrival-status{color:#d9c58e}#population .dark-btn{margin:10px 0}#population .gold-btn{margin-right:7px}.map-caption{z-index:111;pointer-events:none}.stage-guide{z-index:111}.site-time{z-index:112}.celebration{z-index:120}.structure-wall .royal-banner{display:none}@keyframes windturn{to{transform:rotate(360deg)}}@keyframes chimneysmoke{0%{opacity:0;transform:translate(0,0) scale(.5)}30%{opacity:.6}100%{opacity:0;transform:translate(12px,-35px) scale(2)}}@keyframes stonehoist{50%{height:10%}}@keyframes cartway{50%{left:60%;transform:translateY(5px)}}@keyframes guardway{50%{transform:translateX(17px)}}@keyframes fireflicker{50%{transform:scale(.8,1.15) rotate(4deg);filter:brightness(1.2)}}@keyframes ripple{from{transform:scale(.5);opacity:.8}to{transform:scale(1.7);opacity:0}}@keyframes bannerwave{50%{transform:skewY(7deg) scaleX(.88)}}@keyframes riverflow{to{background-position:0 64px}}@keyframes cloudway{to{left:110%;top:40%}}@keyframes candle{50%{filter:brightness(.78);box-shadow:0 0 14px 5px #ffc26680}}@keyframes citywalk{0%,100%{left:var(--x1);top:var(--y1);transform:scaleX(1)}48%{left:var(--x2);top:var(--y2);transform:scaleX(1)}50%{left:var(--x2);top:var(--y2);transform:scaleX(-1)}98%{left:var(--x1);top:var(--y1);transform:scaleX(-1)}}@keyframes animalwalk{50%{transform:translate(18px,-4px)}}@keyframes graze{50%{transform:rotate(3deg) translateY(1px)}}@media(max-width:850px){.building{width:19%}.building .building-name{font-size:7px;padding:2px 4px}.light-control{width:100%;justify-content:flex-end}.city-person{width:2%;min-width:8px;min-height:13px}.population-stats{grid-template-columns:repeat(2,1fr)}.street-lamp{width:2px;height:4px;box-shadow:0 0 10px 5px #ffbd5970}.side-bottom{bottom:87px}.building[data-building="wall"]{width:18%}}
#city-residents{z-index:50}#city-animals{z-index:76}.night-shade{transition:opacity 1.5s}.building .building-name{max-width:140px;overflow:hidden;text-overflow:ellipsis}
#city-labels{position:absolute;inset:0;z-index:113;pointer-events:none}.city-label{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;white-space:nowrap;background:#152b24e8;border:1px solid #9c9865;color:#f1e6c5;border-radius:5px;font-size:9px;padding:3px 5px;line-height:1.1}.city-label b{color:#ffe2a1;margin-left:4px}.city-label.chosen{border-color:#edd28c;box-shadow:0 0 4px #edd28c66}.village-stage .building-name,.village-stage .building>.level{visibility:hidden}.village-stage .building{outline-offset:0}@media(max-width:850px){.city-label{font-size:6px;padding:2px 3px}.city-label b{margin-left:2px}}
.wind-rotor{left:-17%;top:-1%}.wall-sentry{position:absolute;width:1.8%;height:6%;top:74%;left:30%;animation:wallpatrol 18s ease-in-out infinite}.wall-sentry svg{width:100%;height:100%}.wall-sentry:nth-child(2){left:67%;animation-delay:-9s}.wall-sentry .worker-legs{animation:workerstep .3s alternate infinite;transform-origin:20px 37px}@keyframes wallpatrol{50%{transform:translateX(35px)}}

/* 0.6: explicit motion preference, laboratory and public entrance */
body.landing-open>.topbar,body.landing-open>.app{display:none}#welcome{min-height:100dvh;background:linear-gradient(90deg,#10231aef,#10231a60),url('assets/valley-open.png') center/cover;display:grid;align-content:center;padding:clamp(22px,8vw,110px);gap:22px}#welcome h1{font:clamp(40px,7vw,88px)/1.05 Georgia;max-width:750px;margin:0;color:#f6e6b7}#welcome p{max-width:650px;color:#d1ddcc;line-height:1.7}#welcome .welcome-actions{display:flex;gap:12px;flex-wrap:wrap}#welcome .welcome-features{display:flex;gap:25px;flex-wrap:wrap;color:#dfc792}#welcome a{color:#e1c884}.lab-toolbar{border:1px solid #d1b25a;background:#303d25;padding:14px;border-radius:10px;margin:0 0 18px}.lab-toolbar .row{flex-wrap:wrap;gap:8px}.lab-toolbar p{font-size:12px;margin:8px 0}.lab-toolbar select{max-width:230px}.lab-toolbar button{padding:10px}.motion-indicator{font-size:11px;color:#cabf95;margin:6px 0}.farm-animal{animation-name:animalroam;animation-duration:18s}.farm-animal.hen{animation-duration:12s}.chimney-smoke{width:14%;height:28%;top:2%}.chimney-smoke i{background:#ece3ccbb}.wind-rotor svg{animation-duration:6s}.city-person{min-width:12px;min-height:20px}#motion{min-height:40px}.city-focus .village-stage{min-width:800px}.city-focus .stage-frame{overflow:auto;max-height:75dvh}.stage-frame{touch-action:pan-x pan-y}.lab-toolbar .gold-btn{min-height:44px}@keyframes animalroam{0%,100%{transform:translate(0,0) scaleX(1)}40%{transform:translate(60px,-12px) scaleX(1)}48%{transform:translate(60px,-12px) scaleX(-1)}90%{transform:translate(0,0) scaleX(-1)}}@media(max-width:850px){.lab-toolbar .row{display:grid;grid-template-columns:1fr 1fr}.lab-toolbar select{max-width:100%;width:100%}.lab-toolbar button{font-size:12px}.city-person{min-width:10px;min-height:16px}#welcome .welcome-actions{flex-direction:column}#welcome{padding-bottom:60px}.topbar{padding-top:env(safe-area-inset-top)}.sidebar nav{padding-bottom:env(safe-area-inset-bottom)}}
.village-layout>div{min-width:0}.city-focus .stage-frame{width:100%}@media(max-width:850px){.village-layout{grid-template-columns:minmax(0,1fr)}}
/* Actual WebGL view; illustrated scene remains a hardware fallback. */
#city-canvas,#scene-labels{display:none}.village-stage.scene-3d{background:#91a282;isolation:isolate;aspect-ratio:1.4;min-height:420px}.scene-3d>#buildings,.scene-3d>.city-wall,.scene-3d>#city-residents,.scene-3d>#city-animals,.scene-3d>.river-glimmer,.scene-3d>.drifting-cloud,.scene-3d>.night-shade,.scene-3d>#street-lights,.scene-3d>#city-labels{display:none!important}.scene-3d>#city-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:1;touch-action:none;cursor:grab}.scene-3d>#city-canvas:active{cursor:grabbing}.scene-3d>#scene-labels{display:block;position:absolute;inset:0;pointer-events:none;z-index:2}.scene-label{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;background:#20372aca;border:1px solid #c6b47c77;color:#f0e4b7;border-radius:5px;padding:4px 7px;font:10px Georgia;white-space:nowrap;min-height:25px;box-shadow:0 2px 6px #12271a44}.scene-label.chosen{border-color:#e8c781;background:#40523a}.names-off .scene-label{visibility:hidden}.scene-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0;padding:8px 10px;background:#1a2c23;border:1px solid #526244;border-radius:7px}.scene-controls button{min-height:40px;padding:8px 12px}.scene-controls span{font-size:11px;color:#c3c6aa;margin-left:auto}.audio-controls{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:6px 2px 12px}.audio-controls label{font-size:11px;color:#b6c5ad;display:flex;align-items:center;gap:8px}.audio-controls input{padding:0;width:90px;accent-color:#d8be73}.audio-controls small{font-size:10px;color:#9bab94}.scene-expanded{position:fixed!important;inset:12px!important;width:auto!important;height:auto!important;z-index:300;background:#243728}.scene-expanded .village-stage{width:100%;height:100%;aspect-ratio:auto}.scene-expanded:after{content:'Use Esc para fechar';position:absolute;right:16px;top:10px;color:#fff1c9;z-index:301;pointer-events:none;font-size:12px}.scene-controls .quiet{margin:0;color:#c7b98b}.scene-3d .map-caption,.scene-3d .stage-guide{z-index:3;pointer-events:none}.scene-3d .celebration{z-index:5}.scene-3d .map-caption{background:#14271b77;padding:8px;border-radius:7px}.scene-3d .stage-guide{background:#14271baa;padding:5px 12px;border-radius:12px}.scene-close{position:absolute;right:15px;bottom:15px;z-index:305;background:#d9bf7d;color:#183022;border-radius:7px;padding:12px;display:none}.scene-expanded .scene-close{display:block}@media(max-width:850px){.village-stage.scene-3d{aspect-ratio:1;min-height:360px}.scene-label{font-size:8px;padding:4px;min-height:24px}.scene-controls{gap:4px}.scene-controls button{font-size:11px;padding:8px}.scene-controls span{width:100%;margin:0}.audio-controls{gap:6px 16px}.audio-controls small{width:100%}.scene-expanded{inset:0!important}.scene-expanded .village-stage{min-height:100%;}.scene-3d .map-caption{font-size:9px}.scene-3d .stage-guide{font-size:9px}.scene-3d .celebration{font-size:12px;max-width:90%;white-space:normal}}

.three-active .detail-art{display:none}.three-active .side-bottom{display:none}

.three-active .detail-panel{display:block}
/* 0.8: illustrated architecture is the default again. */
#art-actors,#weather-canvas{display:none}.artful-city .village-stage.artful-stage{aspect-ratio:1.5;min-height:0;width:calc(100% * var(--art-zoom,1));background-image:url('assets/valley-open.png');touch-action:pan-x pan-y}.artful-city .building{width:16%}.artful-city #art-actors{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:80;pointer-events:none}.artful-city #weather-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:110;pointer-events:none}.artful-city #city-residents,.artful-city #city-animals,.artful-city .site-worker,.artful-city .wind-rotor,.artful-city .guard-patrol,.artful-city .tower-patrol,.artful-city .wall-sentry{display:none}.artful-city .detail-art{display:block}.artful-city .side-bottom{display:none}.artful-city .in-progress:not([data-level="0"]) .art{clip-path:none!important}.artful-city .stage-frame{overflow:auto;max-height:80dvh;touch-action:pan-x pan-y}.artful-city .scene-expanded{max-height:none}.artful-city .scene-expanded .village-stage{min-height:100%;width:100%;aspect-ratio:1.5}.artful-city .scene-label{display:none}.living-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:10px 0;color:#b6c5aa;font-size:12px}.living-controls label{display:flex;align-items:center;gap:8px}.living-controls select{font-size:12px;padding:7px}.city-rank{display:grid;grid-template-columns:140px 1fr;gap:16px;align-items:center;background:#23392bcc;border:1px solid #566647;border-radius:8px;padding:12px 16px;margin:10px 0 16px}.city-rank small{color:#acb99e;font-size:11px}.city-rank strong{display:block;color:#ebcd8a;font:23px Georgia}.city-rank .progress{height:5px;margin:6px 0}.artful-city .city-label{font-size:9px}.artful-city .scene-controls #scene-label-toggle{display:none}@media(max-width:850px){.city-rank{grid-template-columns:100px 1fr;padding:10px;gap:10px}.city-rank strong{font-size:20px}.city-rank small{font-size:9px}.artful-city .village-stage.artful-stage{aspect-ratio:1.3;min-height:280px}.artful-city .city-label{font-size:7px;padding:3px}.living-controls{font-size:10px;gap:8px}.artful-city .detail-panel{display:block}.artful-city .detail-art{float:left;margin-right:15px}.artful-city .scene-expanded .village-stage{min-width:700px;min-height:100%}}

/* Large late-game resource values stay inside the mobile grid. */
.resource{grid-template-columns:23px minmax(0,1fr)}.resource b,.resource small{min-width:0}.resource em{display:block;margin-left:0}.resource small{overflow-wrap:anywhere}@media(max-width:600px){.resource{grid-template-columns:13px minmax(0,1fr)}.resource b{font-size:11px}}

/* 0.9: keep annexes inside each lot and reserve the central street. */
.artful-city .painted-annex{inset:58% -2% 0 65%}.artful-city .building:hover .art,.artful-city .building.selected .art{transform:none}
.artful-city .waterwheel{width:17%;height:22%;left:19%;top:58%;border-width:1px;opacity:.7;animation-duration:16s}.artful-city .moving-cart{display:none}

/* 0.10: grounded architecture and persistent renovations. */
.artful-city .waterwheel,.artful-city .quarry-hoist,.artful-city .moving-cart{display:none!important}
.artful-city .building.in-progress .art{animation:none!important;opacity:1!important;clip-path:none!important;filter:none!important}
.artful-city .building.in-progress.unbuilt .art{opacity:.85!important}
.artful-city .building[data-building="plaza"]:not(.unbuilt)>.art,.artful-city .building[data-building="plaza"].in-progress>.art{visibility:hidden}
.plaza-preview{display:block;width:100%;height:100%}.plaza-preview svg{width:100%;height:100%}
#environment-motion{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}.scene-3d #environment-motion{display:none}

.waterwheel-real{display:none}.artful-city .waterwheel-real{display:block;position:absolute;inset:0;clip-path:ellipse(6.4% 8.4% at 29.5% 63%)}.waterwheel-real .painted-main{transform-origin:29.5% 63%;animation:waterwheel-real-turn 18s linear infinite}@keyframes waterwheel-real-turn{from{transform:scaleX(.76) rotate(0deg) scaleX(1.315789)}to{transform:scaleX(.76) rotate(360deg) scaleX(1.315789)}}.motion-off .waterwheel-real .painted-main{animation-play-state:paused!important}

/* 0.11 painted square matches the existing architecture. */
.plaza-painted{display:block;position:absolute;inset:0;background:url('assets/plaza-painted.png') center/contain no-repeat}
.artful-city .building[data-building="plaza"]{width:20%;aspect-ratio:1.5;transform:translate(-50%,-65%)}
.artful-city .building[data-building="plaza"]:not(.unbuilt)>.art,.artful-city .building[data-building="plaza"].in-progress>.art{visibility:visible}
.plaza-tier-1{filter:saturate(.85)}.plaza-tier-3{filter:saturate(1.06)}
/* Rotate only the wheel face in its own elliptical plane, never the surrounding logs. */
.artful-city .waterwheel-real{clip-path:ellipse(5.3% 7.2% at 30% 63%)}
.waterwheel-real .painted-main{transform-origin:30% 63%;animation-duration:24s}

.development-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.development-card{padding:16px;border:1px solid #586447;border-radius:8px;background:#1b3025}.development-card p{font-size:12px}.requirements{padding-left:18px}.requirements .met{color:#a8cb8a}.requirements .missing{color:#e4bb83}.requirements button{text-align:left}#development-detail{border-top:1px solid #576447;margin-top:18px;padding-top:10px}#development-detail h3{font-size:18px}#workers>.panel{margin-bottom:18px}.gate-notice{position:absolute;left:50%;top:85%;transform:translateX(-50%);z-index:115;background:#ead4a0;color:#263221;border:1px solid #8c6a39;border-radius:6px;padding:7px;font-size:11px}.wall-watch-canvas{position:absolute;inset:0;z-index:90;pointer-events:none;width:100%;height:100%}.scene-3d .wall-watch-canvas{display:none}@media(max-width:600px){.development-grid{grid-template-columns:1fr}.gate-notice{font-size:9px;padding:4px}}

/* 0.12.2: sized lots leave streets between buildings, without enlarging on hover. */
.artful-city .building,.artful-city .building[data-building="plaza"]{width:var(--lot-width,14%)}
.construction-picker{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0;padding:12px;background:#1b2a23;border:1px solid #526244;border-radius:8px}
.construction-picker label{flex:1;min-width:200px;font-size:12px;color:#d8c48f}
.construction-picker select{display:block;width:100%;min-height:44px;margin-top:5px}
.construction-picker button{min-height:44px}
.artful-city .city-label{min-height:24px}

.city-label .label-short{display:none}@media(max-width:850px){.city-label .label-full{display:none}.city-label .label-short{display:inline}}

/* Gate approach uses the same stage coordinates as the fixed wall perimeter. */
.village-stage::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;background:url('assets/valley-gate-road.png') center/100% 100% no-repeat;transform:translateX(-1.4%);mask-image:radial-gradient(ellipse 18% 43% at 54% 104%,#000 65%,transparent 100%)}
.scene-3d.village-stage::after{display:none}
/* 0.13 — civic expansion */
.expansion-building,.expansion-sprite{position:absolute;inset:0}.expansion-sprite{background-image:url('assets/expansion-buildings.webp');background-position:var(--exp-x,0%) var(--exp-y,0%);background-size:400% 200%;background-repeat:no-repeat}.expansion-building.tier-2{filter:brightness(1.06)}.expansion-building.tier-3{filter:contrast(1.08)}.expansion-building.tier-3:after{content:'⚑';position:absolute;right:12%;top:25%;color:var(--clan-color,#d4bd79);font-size:18px;animation:bannerwave 3s infinite}
.artful-city .painted-annex{display:none}.topbar{height:auto;min-height:86px;padding:14px 24px;gap:16px}.resources{display:grid;grid-template-columns:repeat(3,minmax(105px,1fr));gap:6px 12px}.resource{min-width:0;grid-template-columns:32px 1fr;gap:0 6px;padding-right:8px}.resource .symbol{display:flex;align-items:center}.resource-icon{width:32px;height:32px;vertical-align:middle;flex-shrink:0;filter:drop-shadow(0 2px 2px #0005)}.costs .resource-icon{width:22px;height:22px}.resource b{font-size:14px}.resource small{font-size:9px}.resource em{display:block;font-size:9px}.costs{display:grid;grid-template-columns:repeat(3,1fr)}
.campaign-grid,.army-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0 0 22px}.campaign-grid .panel{min-width:0}.campaign-grid form{margin-bottom:16px}.army-card{padding:0;overflow:hidden;border-color:#726d4b}.unit-portrait{height:240px;background-color:#23382b;position:relative}.unit-portrait.clan-sheet-a{background-image:url('assets/clan-units-a.webp');background-size:400% 300%}.unit-portrait.clan-sheet-b{background-image:url('assets/clan-units-b.webp');background-size:400% 300%}.unit-portrait span{position:absolute;bottom:0;left:0;right:0;padding:25px 18px 10px;background:linear-gradient(transparent,#14221dec);font:22px Georgia;color:#ffe6a5}.army-content{padding:18px}.army-content p{font-size:12px}.army-stats{display:flex;justify-content:space-between;gap:10px;color:#e1c37b;font-size:13px}.army-card input{max-width:100%}.army-card .gold-btn{width:100%}.rank-scroll{overflow:auto}.rank-table{border-collapse:collapse;width:100%;min-width:500px}.rank-table td,.rank-table th{text-align:left;padding:14px;border-bottom:1px solid #42533f}.rank-table th{color:#c8af6f;font-size:12px}.rank-mine{background:#514e2a55}.rank-table button{white-space:nowrap}#my-rank{color:#e5c784}
.world-atlas{position:relative;aspect-ratio:1.2;min-height:430px;margin-top:16px;border:2px solid #a39362;border-radius:12px;background:linear-gradient(#1b302133,#21342322),url('assets/valley-open.png') center/cover;box-shadow:inset 0 0 55px #092217}.world-atlas:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#ece7c516 1px,transparent 1px),linear-gradient(90deg,#ece7c516 1px,transparent 1px);background-size:10% 10%;pointer-events:none}.atlas-coordinates{position:absolute;top:10px;left:12px;padding:4px 8px;background:#13291fd9;border-radius:6px;color:#eddba8;font-size:10px}.atlas-pin{position:absolute;transform:translate(-50%,-50%);background:#182c24ee;border:1px solid #e5dcc0;color:#eee9d3;border-radius:8px;padding:4px 7px;min-width:44px;max-width:140px;box-shadow:0 3px 8px #0007;z-index:1}.atlas-pin b,.atlas-pin small{display:block;font-size:10px}.atlas-pin small{font-size:9px}.atlas-pin span{font-size:24px;line-height:1.1}.atlas-pin.own{border:2px solid #f2d075;color:#f9db89;z-index:3}.atlas-pin.friend{border-color:#80bc83}.atlas-pin.enemy{border-color:#e48976;color:#ffc9b7}.atlas-pin.peace{border-color:#8bc5de}.atlas-pin.ruin{background:#534931ed;max-width:100px}.atlas-pin:hover,.atlas-pin:focus-visible{z-index:5;box-shadow:0 0 14px #e7c46c}.view[hidden]{display:none!important}
@media(max-width:1100px){.campaign-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.army-cards{gap:10px}.brand{font-size:12px}.topbar{padding:10px}.army-content{padding:12px}.unit-portrait{height:190px}}
@media(max-width:850px){.resources{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:4px}.topbar{flex-wrap:wrap}.resource b{font-size:12px}.resource{grid-template-columns:26px 1fr;padding:3px;gap:3px}.resource-icon{width:26px;height:26px}.campaign-grid,.army-cards{grid-template-columns:1fr}.army-card{display:grid;grid-template-columns:120px 1fr}.unit-portrait{height:100%;min-height:260px}.unit-portrait.clan-sheet-a,.unit-portrait.clan-sheet-b{height:120px;min-height:120px;aspect-ratio:1}.unit-portrait span{font-size:14px;padding:20px 5px 5px}.army-content h3{font-size:19px}.army-content p{font-size:11px}.army-stats{font-size:11px}.artful-city .village-stage.artful-stage{min-width:680px;aspect-ratio:1.5;min-height:0}.artful-city .stage-frame{max-height:65dvh}.artful-city .city-label{font-size:7px;min-height:22px}.world-atlas{min-height:400px}.atlas-pin{max-width:100px}.atlas-pin b{font-size:8px}.atlas-pin small{font-size:8px}.costs{grid-template-columns:repeat(2,1fr)}}

.unit-portrait.clan-sheet-a,.unit-portrait.clan-sheet-b{height:auto;aspect-ratio:1}
.world-atlas{width:100%}.two-columns>*{min-width:0}#map-player{width:100%;max-width:100%}.atlas-pin{overflow:hidden;text-overflow:ellipsis}

.atlas-viewport{width:100%;height:530px;overflow:auto;border-radius:12px;margin-top:12px;touch-action:pan-x pan-y;cursor:grab}.atlas-viewport:active{cursor:grabbing}.atlas-viewport .world-atlas{margin:0;max-width:none;flex:none;aspect-ratio:auto}.atlas-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0}.atlas-tools small{font-size:10px;color:#b9c6b0}.atlas-tools button{min-height:40px}@media(max-width:850px){.atlas-viewport{height:400px}}

/* Small ground markers keep architecture unobstructed. Names appear only on intent. */
.artful-city .city-label{width:auto;min-width:23px;min-height:0;height:14px;padding:1px 4px;border:1px solid #6d5132;border-radius:1px;white-space:nowrap;line-height:1;font:8px Georgia,serif;color:#f6e5bf;text-shadow:0 1px #38230d;background:linear-gradient(4deg,#65503a,#8b704d 45%,#766040);box-shadow:inset 0 1px #b49a73,0 1px 2px #18210e55;transform:translate(-50%,-50%);isolation:isolate}
.artful-city .city-label:before{content:"";position:absolute;left:calc(50% - 1px);top:100%;width:2px;height:4px;background:#705235;z-index:-1}
.artful-city .city-label:after{content:"";position:absolute;left:calc(50% - 5px);top:calc(100% + 3px);width:13px;height:3px;border-radius:50%;background:#26331950;z-index:-2}
.artful-city .city-label b{display:block;margin:0;font:700 8px Georgia,serif;color:#fff0ce}
.artful-city .city-label.chosen{border-color:#efd390;box-shadow:0 0 3px #f6dc9b}.artful-city .city-label:hover{filter:brightness(1.1)}
.sign-tooltip{display:none;position:absolute;bottom:calc(100% + 9px);left:50%;transform:translateX(-50%);width:max-content;max-width:150px;white-space:normal;background:#243328ed;border:1px solid #b8a278;border-radius:4px;padding:6px 8px;color:#fff1d0;font:11px Georgia,serif;pointer-events:none;box-shadow:0 2px 6px #0005}
.city-label:hover,.city-label:focus-visible{z-index:5}.city-label:hover .sign-tooltip,.city-label:focus-visible .sign-tooltip{display:block}
@media(max-width:850px){.artful-city .city-label{min-width:21px;height:13px;padding:1px 3px}.artful-city .city-label b{font-size:8px}}

#building-actions{position:fixed;z-index:450;width:min(370px,calc(100vw - 24px));padding:15px;background:linear-gradient(145deg,#26372bf5,#14271ff7);border:1px solid #b29a61;border-radius:14px;box-shadow:0 12px 40px #0009;color:#eae1c9;max-height:75dvh;overflow:auto;backdrop-filter:blur(7px)}#building-actions[hidden]{display:none}#building-actions header{display:flex;justify-content:space-between;gap:10px}#building-actions h3{font:21px Georgia;margin:5px 0 12px}#building-actions small{font-size:10px;color:#d3b678}#building-actions header button{align-self:flex-start;background:none;color:#fff2cd;font-size:25px;padding:0 5px}.context-actions{display:flex;justify-content:space-around;gap:8px}.context-actions button{flex:1;background:none;color:#f4e4b9;padding:3px;font-size:11px}.context-actions i{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 6px;border-radius:50%;border:2px solid #a78a51;background:radial-gradient(circle at 35% 25%,#655335,#29291e);box-shadow:inset 0 0 0 3px #2a3025,0 3px 5px #0005;font:bold 34px Georgia;color:#edd387}.context-actions button:disabled{opacity:.45}.context-live{font-size:11px;line-height:1.4;color:#c8cbb8}.context-boosts button{display:block;width:100%;padding:10px;margin:6px 0;border:1px solid #b49755;background:#584628;color:#fff0ba;border-radius:6px;font-size:12px}#building-actions details{font-size:12px;line-height:1.5}#building-actions summary{cursor:pointer;padding:10px 0;color:#ead08c}.context-detail{background:none;color:#dac795;text-decoration:underline;padding:10px 0;font-size:12px}#site-progress-layer{position:absolute;inset:0;z-index:116;pointer-events:none}.site-progress{position:absolute;transform:translateX(-50%);width:104px;padding:4px;background:#1d2e24dd;border:1px solid #927a44;border-radius:4px;box-shadow:0 2px 4px #0004}.site-progress small{display:block;text-align:center;font-size:8px;color:#ffe8b1;margin-bottom:3px}.site-progress [role=progressbar]{height:5px;background:#101e18;border-radius:3px;overflow:hidden}.site-progress i{display:block;height:100%;background:linear-gradient(90deg,#bc9042,#f0d884)}.artful-city .in-progress .scaffold,.artful-city .site-crane{display:none}.artful-city .in-progress .art{opacity:1!important}.artful-city .city-label{border-color:#658447}.artful-city .city-label.chosen{box-shadow:0 0 5px #b8e58c}
@media(max-width:650px){#building-actions{left:10px!important;right:10px;top:auto!important;bottom:max(10px,env(safe-area-inset-bottom));width:auto!important;max-height:55dvh;padding:12px}.context-actions i{width:52px;height:52px}.context-actions button{min-height:76px}.site-progress{width:90px}}

/* Small carved direction marker beside the level plate. */
.artful-city .city-label:before{width:8px;height:12px;left:-7px;top:-2px;background:linear-gradient(90deg,#395428,#8cac58,#527538);clip-path:polygon(50% 0,100% 42%,72% 42%,72% 100%,28% 100%,28% 42%,0 42%);filter:drop-shadow(1px 1px 1px #26321c);z-index:0}

.artful-city .in-progress .site-time{display:none}

/* 0.15: contain grid content; only the city and atlas pan horizontally. */
.app{grid-template-columns:200px minmax(0,1fr)}
.village-layout>*,.lower-grid>*,.two-columns>*,.page-heading>*,.panel,.detail-panel,.view{min-width:0}
.hosted-game #welcome-lab,.hosted-game #welcome-demo,.hosted-game #welcome-expansion,.hosted-game #welcome-status,.hosted-game .expansion-access{display:none!important}
#welcome{min-width:0;width:100%;overflow-wrap:anywhere}#welcome>*{min-width:0}
@media(max-width:1150px){.app{grid-template-columns:165px minmax(0,1fr)}}
@media(max-width:850px){
 html,body{width:100%;margin:0}.app{display:block;width:100%}main{width:100%;padding:16px 12px calc(90px + env(safe-area-inset-bottom))}
 .topbar{height:auto;padding:12px;gap:10px}.brand{min-width:0;white-space:normal;font-size:12px}.brand small{letter-spacing:2px}.account{max-width:45%;overflow-wrap:anywhere;min-height:44px}
 .resources{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:8px}.resource{min-width:0!important;padding:4px!important;border:0;grid-template-columns:26px minmax(0,1fr);gap:0 5px}.resource b{font-size:14px;overflow-wrap:anywhere}.resource small{font-size:10px}.resource em{display:block;margin:0}
 .page-heading{display:block}.page-heading h1{font-size:27px;overflow-wrap:anywhere}.settlement-stats{flex-direction:row;flex-wrap:wrap;margin-top:12px;gap:8px 16px;font-size:12px}
 .village-layout,.lower-grid,.two-columns,.product-grid,.development-grid{grid-template-columns:minmax(0,1fr)!important}.stage-frame{width:100%;max-width:100%;overflow:auto;overscroll-behavior-x:contain;touch-action:pan-x pan-y}.village-stage{min-width:680px;aspect-ratio:1.5}
 .panel,.detail-panel{padding:16px;overflow-wrap:anywhere}.row,.form-row,.under-map,.level-line,.quest-strip,.trade-offer,.panel-title{flex-wrap:wrap}.form-row>*{min-width:0;flex:1 1 130px}.under-map>div{max-width:100%}.quest-strip button{white-space:normal}.construction-picker label{min-width:0;flex-basis:100%}.construction-picker button{flex:1 1 120px}
 input,select,textarea{font-size:16px!important;max-width:100%}button:not(.building):not(.city-label):not(.atlas-pin){min-height:44px}.requirements button{text-wrap:wrap;max-width:100%}
 dialog,#clan-dialog{box-sizing:border-box;width:calc(100% - 24px);max-width:540px;max-height:calc(100dvh - 32px);margin:auto;padding:24px 16px;overflow:auto;overscroll-behavior:contain}dialog h2,#clan-dialog h2{font-size:27px;padding-right:20px}.close{width:44px;height:44px;right:4px;top:2px}.clan-grid{grid-template-columns:minmax(0,1fr);gap:10px;margin:16px 0}.clan-card{width:100%;min-width:0;white-space:normal}
 #welcome{padding:32px 20px calc(32px + env(safe-area-inset-bottom));gap:16px;min-height:100svh}#welcome h1{font-size:46px}#welcome p{margin:0;max-width:100%;font-size:15px}.welcome-actions{width:100%}.welcome-actions button{width:100%;white-space:normal}#welcome .welcome-features{gap:10px 16px;font-size:13px}
 .sidebar{height:calc(70px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}.sidebar nav{justify-content:flex-start;overflow-x:auto;width:100%;padding-bottom:0}.sidebar nav button{flex:0 0 66px;min-height:58px}.sidebar nav button span{font-size:10px}
 #building-actions{bottom:calc(76px + env(safe-area-inset-bottom));max-height:55dvh}.toast{bottom:calc(82px + env(safe-area-inset-bottom));width:max-content;max-width:calc(100% - 24px);padding:12px 16px}
 .city-progression,.city-level,.city-level-bar,.live-hud{max-width:100%;flex-wrap:wrap;overflow-wrap:anywhere}.atlas-viewport{max-width:100%;height:55dvh}.worker-cards{grid-template-columns:repeat(2,minmax(0,1fr))}footer{flex-wrap:wrap;gap:10px}
}