:root{font-family:Inter,Arial,sans-serif;color:#183d33;background:#f5f4ed;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a,input{touch-action:manipulation}button{font:inherit;cursor:pointer;border:1px solid #dce2d7;border-radius:11px;background:#fff;color:#214b3f;padding:12px 15px;font-weight:600}button:hover{background:#eaf1e6}button:disabled{opacity:.55;cursor:wait}header{height:92px;padding:20px 36px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d9dfd3;background:#fffef9}.brand{font-weight:900;font-size:27px;letter-spacing:-1.5px;text-decoration:none;color:#153d32}.brand span{color:#e38840}.brand small{display:block;font-size:9px;letter-spacing:3px;margin-top:4px}.header-right{display:flex;align-items:center;gap:20px;font-size:13px}#login,.primary{background:#1b5140;color:white;border-color:#1b5140}.live{color:#608461;font-size:12px}#wallet{font-weight:700}main{display:grid;grid-template-columns:minmax(0,1fr) 360px;height:calc(100dvh - 92px);min-height:600px}.city{position:relative;overflow:hidden;background:#dce8d0}#scene{position:absolute;inset:0}#scene canvas{display:block;width:100%;height:100%}.city-title{position:absolute;top:34px;left:38px;pointer-events:none;max-width:80%}.eyebrow{font-size:10px;letter-spacing:2.2px;font-weight:700}h1{font-size:clamp(27px,3vw,43px);line-height:1.13;letter-spacing:-1.8px;margin:14px 0}p{font-size:14px;line-height:1.65;color:#64766b}.city-title p{max-width:260px;color:#45614e}.map-label{position:absolute;bottom:70px;left:28px;font-size:10px;letter-spacing:2px;background:#fffc;padding:10px 14px;border-radius:8px}.map-label span{color:#dd8e46;margin-left:8px}.map-controls{position:absolute;bottom:24px;right:24px;display:flex;gap:7px}.map-controls button{box-shadow:0 4px 12px #36543a15}.map-help{position:absolute;bottom:27px;left:28px;font-size:11px;color:#4d6a50}aside{background:#fffef9;display:flex;flex-direction:column;overflow:auto;border-left:1px solid #d9dfd3}nav{display:flex;padding:20px 20px 0;gap:6px}nav button{flex:1;border:none;background:transparent;color:#7b887f;border-radius:8px;padding:12px 8px}nav .active{color:#204d3b;background:#edf1e7}#panel{padding:26px;flex:1}h2{font-size:24px;letter-spacing:-.7px;margin:10px 0 6px}h3{font-size:16px;margin:16px 0 8px}.tag{font-size:10px;font-weight:700;color:#739274;text-transform:uppercase;letter-spacing:1.5px}.house-icon{height:128px;background:linear-gradient(140deg,#e0e9cc,#f2e8cb);border-radius:17px;display:grid;place-items:center;margin:18px 0;font-size:62px}.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0}.stat{border:1px solid #e3e6dc;border-radius:12px;padding:14px}.stat small{display:block;color:#809083;font-size:10px;margin-bottom:7px}.stat strong{font-size:20px}.full{width:100%;margin:5px 0}.muted{color:#88978a;font-size:12px;line-height:1.7}.steps{display:flex;gap:4px;margin:16px 0}.steps i{height:5px;flex:1;background:#e9eddf;border-radius:3px}.steps i.on{background:#e5a35f}.card{border:1px solid #e1e6d8;padding:16px;border-radius:14px;margin:14px 0}.card p{margin:4px 0;font-size:12px}footer{font-size:10px;line-height:1.7;color:#91a08e;border-top:1px solid #e5e9dd;margin:0 26px;padding:18px 0}input[type=number]{width:100%;padding:12px;border:1px solid #dce2d7;border-radius:9px;font:inherit;margin:8px 0}input[type=color]{height:44px;width:100%;border:0;border-radius:10px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#163d32;color:white;border-radius:12px;max-width:90%;padding:14px 22px;z-index:20;display:none}#notice{position:absolute;top:20px;right:18px;background:#fff5dc;border:1px solid #ead5a5;font-size:11px;border-radius:8px;padding:8px 10px;max-width:210px}#notice:empty{display:none}.fallback{display:grid!important;grid-template-columns:repeat(4,1fr);gap:10px;padding:220px 24px 100px;overflow:auto}.fallback button{min-height:65px}.hint{padding:14px;border-radius:10px;background:#f5edda;font-size:12px;line-height:1.6}.history{font-size:11px;padding:9px 0;border-bottom:1px solid #eee}
@media(max-width:850px){header{height:74px;padding:14px 18px}.brand{font-size:23px}.live{display:none}.header-right{gap:8px}#login{font-size:11px;padding:10px}main{grid-template-columns:1fr;height:auto;min-height:0}.city{height:58dvh;min-height:390px}.city-title{top:22px;left:20px}.city-title h1{font-size:29px}.city-title p{font-size:11px;max-width:220px}.eyebrow{font-size:8px}.map-help{display:none}.map-label{bottom:77px;left:20px}.map-controls{bottom:20px;left:20px;right:auto}.map-controls button{padding:11px 13px}aside{border-left:0;border-top:1px solid #d9dfd3;min-height:390px}#panel{padding:22px}nav{padding-top:12px}.house-icon{height:95px}.header-right #wallet{font-size:11px}#notice{top:175px;font-size:10px;max-width:180px}footer{margin-top:10px}}
:root select{font:inherit;color:#214b3f;border:1px solid #d3ddc9;border-radius:10px;background:#fffef5;padding:12px;max-width:90%}#districtPicker{position:absolute;top:22px;right:22px;max-width:270px;font-size:12px}progress{width:100%;height:10px;accent-color:#59845d}#districtName{width:100%;padding:12px;border:1px solid #dce2d7;border-radius:9px;font:inherit;margin:8px 0}label{font-size:12px}.brand small{letter-spacing:1.3px}@media(max-width:850px){#districtPicker{top:auto;bottom:128px;left:20px;right:auto;max-width:270px}.brand small{font-size:7px;letter-spacing:1px}}

@media(min-width:851px){#notice{top:75px}}

.map-controls{flex-wrap:wrap}@media(max-width:850px){.map-controls{gap:4px;right:12px;left:12px}.map-controls button{font-size:11px;padding:11px 9px}}
/* Scenic view: the world owns the viewport; information is an optional overlay. */
main{display:block;position:relative;height:calc(100dvh - 92px);min-height:0}.city{height:100%;min-height:0}.city-title{top:24px;left:26px;max-width:55%}.city-title .eyebrow{display:none}.city-title h1{font-size:23px;letter-spacing:-.8px;margin:0;text-shadow:0 1px 8px #fff9}.map-help{display:none}.map-label{bottom:88px;left:24px}.map-controls{left:50%;right:auto;transform:translateX(-50%);bottom:22px;flex-wrap:nowrap;white-space:nowrap}.map-controls button{background:#fffdf4ee;backdrop-filter:blur(8px)}#panelToggle{position:absolute;top:64px;left:24px;z-index:3;background:#fffdf2ee}#districtPicker{top:24px;right:24px}#notice{top:77px;right:24px;max-width:220px;background:#fff8e4e8}aside{position:absolute;z-index:8;top:16px;bottom:16px;right:16px;width:370px;border:1px solid #d8dfcf;border-radius:20px;box-shadow:0 12px 45px #233f3426;transform:translateX(410px);visibility:hidden;transition:transform .25s,visibility .25s;min-height:0;background:#fffdf4f5;backdrop-filter:blur(14px)}body.panel-open aside{transform:translateX(0);visibility:visible}#panelClose{align-self:flex-end;border:none;padding:7px 14px;background:transparent;margin:8px 8px -17px 0;font-size:18px}nav{padding-top:14px}#tourCard{position:absolute;z-index:4;bottom:94px;left:50%;transform:translateX(-50%);width:420px;max-width:calc(100% - 32px);border:1px solid #dce3d4;background:#fffdf1f5;padding:18px 20px;border-radius:17px;box-shadow:0 8px 30px #36563c20}#tourCard[hidden]{display:none}#tourCount{font-size:10px;color:#87957d;letter-spacing:2px}#tourCard h3{margin:8px 0;font-size:20px}#tourCard p{font-size:12px;margin:6px 0 14px}#tourCard>div{display:flex;gap:7px}#tourCard button{font-size:12px;padding:10px 14px}#toast{bottom:86px}#scene.fallback{padding:135px 24px 110px}.header-right{gap:16px}
@media(max-width:850px){header{height:68px;padding:10px 14px}.brand{font-size:22px}.brand small{font-size:7px}main{height:calc(100dvh - 68px)}.city{height:100%;min-height:0}.city-title{top:18px;left:16px;max-width:70%}.city-title h1{font-size:17px}#panelToggle{top:53px;left:14px;padding:10px 12px;font-size:12px}#districtPicker{top:100px;left:14px;right:auto;bottom:auto;max-width:210px;font-size:11px;padding:10px}#notice{top:52px;right:12px;max-width:145px;font-size:9px;padding:8px}.map-label{bottom:126px;left:14px;font-size:8px;padding:9px}.map-controls{left:12px;right:12px;transform:none;bottom:16px;gap:5px;flex-wrap:wrap;justify-content:center;white-space:normal}.map-controls button{padding:11px 12px;font-size:11px;flex:1 0 auto}.header-right{gap:7px}#wallet{max-width:76px}aside{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;height:57dvh;min-height:0;border-radius:22px 22px 0 0;transform:translateY(105%);box-shadow:0 -10px 35px #1b49351c}body.panel-open aside{transform:translateY(0)}#panel{padding:16px 22px}nav{padding:12px 18px 0}#tourCard{bottom:126px;padding:14px 16px}#tourCard h3{font-size:18px}#tourCard p{font-size:11px}#toast{bottom:130px}.fallback{grid-template-columns:repeat(2,1fr)}}
html,body{overflow:hidden}main{overflow:hidden}
textarea{width:100%;min-height:105px;padding:12px;border:1px solid #d8dfd0;border-radius:10px;font:inherit;margin:10px 0;resize:vertical}.shop-card{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between}.swatch{width:44px;height:44px;border-radius:50%;border:4px solid #e8e3d2}.feature-levels{font-size:12px;line-height:1.7;color:#85927e;padding-left:22px}.feature-levels .unlocked{color:#235542}#panel a{color:#2b6d56}#httpBanner{position:fixed;top:92px;left:50%;transform:translateX(-50%);z-index:6;background:#f9e4ad;color:#6d582e;font-size:10px;padding:6px 12px;border-radius:0 0 10px 10px}@media(max-width:850px){#httpBanner{top:68px;max-width:92%;white-space:nowrap;font-size:8px}}
aside{overflow:hidden}#panel{min-height:0;overflow-y:auto}aside nav,aside footer,#panelClose{flex-shrink:0}@media(max-width:850px){.city-title{top:32px}#panelToggle{top:64px}#districtPicker{top:112px}}
#panel input:not([type=color]),#panel select{width:100%;padding:11px;border:1px solid #d8dfd0;border-radius:9px;margin:8px 0;font:inherit;background:#fffef8}#panel details summary{cursor:pointer;font-weight:600}#panel progress{margin-top:10px}@media(max-width:850px){.map-controls{display:grid;grid-template-columns:repeat(4,1fr)}.map-controls button{font-size:10px;padding:9px 5px}}
.appearance-section{margin:20px 0}.appearance-section h3{margin-bottom:10px}.appearance-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.appearance-option{padding:6px 3px;border:2px solid #e1e7d8;min-width:0;font-size:9px;overflow-wrap:anywhere;line-height:1.4}.appearance-option svg{display:block;width:100%;height:44px}.appearance-option.selected{border-color:#468463;background:#e4eddb;opacity:1}.appearance-option span{display:block;min-height:26px}.appearance-option:disabled{cursor:default}