body{margin:0;background:#101918;color:#ebe6d8}.city-top{padding:12px 24px;min-height:72px;background:#101918f5;border-bottom:1px solid #ffffff20;align-items:center;gap:20px}.city-brand{display:flex;align-items:center;gap:12px;color:#e5c38a;text-decoration:none;font-size:23px}.brand-sub{display:block;font:9px/1.6 system-ui;letter-spacing:2px;color:#a5b1a9}.city-top #identity-badge{margin-left:auto;font-size:11px;color:#bdc8bd}.city-top button{margin:0;font-size:12px;background:#253733;color:#e7dcc3;border:1px solid #d0b67544}.eyebrow{font-size:10px;letter-spacing:2px;color:#c7b788}.scene-stage{padding:0;margin:0;border:0;border-radius:0;background:#101918}.scene-canvas{position:relative;width:100%;aspect-ratio:1.6;isolation:isolate}.scene-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3}.scene-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,#09131140,transparent 25%,transparent 80%,#09131166)}.scene-location{position:absolute;left:24px;top:22px;padding:14px 20px;background:#101918d9;border:1px solid #b1b69d55;border-radius:10px;backdrop-filter:blur(6px)}.scene-location small{font-size:10px;color:#d1b784;letter-spacing:2px}.scene-location h1{font-size:22px;margin:4px 0;color:#f0e7ce;letter-spacing:2px}.scene-location p{font-size:12px;color:#c4d0c2;margin:0}.scene-location a{color:#e0c48e;font-size:12px;text-decoration:none}.map-pin{position:absolute;transform:translate(-50%,-50%);display:block;min-width:115px;border:1px solid #d5c29380;border-radius:9px;padding:9px 15px;background:#14241fe6;color:#f5e8c5;text-decoration:none;text-align:center;box-shadow:0 5px 18px #0006;backdrop-filter:blur(5px);font-size:15px;transition:background .15s,box-shadow .15s}.map-pin>span{margin-right:8px;color:#e2bf75;font-size:20px}.map-pin small{display:block;font-size:10px;color:#bccabb;margin-top:2px;white-space:nowrap}.map-pin:hover{background:#3a4d37;box-shadow:0 0 0 3px #efd5a030,0 5px 18px #0008}.map-pin:after{content:'';display:block;position:absolute;width:7px;height:7px;left:calc(50% - 4px);bottom:-5px;background:#d5c293;transform:rotate(45deg)}.village-tavern{left:15%;top:43%}.village-library{left:58%;top:31%}.village-maps{left:76%;top:44%}.village-hall{left:31%;top:75%;border-color:#f0cc86}.village-route{left:76%;top:18%}.desk-person{left:20%;top:65%}.desk-agent{left:27%;top:32%}.desk-manage{left:50%;top:27%}.desk-governance{left:74%;top:32%}.desk-reward{left:78%;top:66%}.scene-directory{display:flex;justify-content:center;gap:28px;margin:0;padding:12px 20px;border-top:1px solid #a7b28b30;background:#12211c}.scene-directory a{font-size:12px;color:#d1c4a3;text-decoration:none}.office-heading{display:flex;flex-direction:column;gap:10px;color:#ead9b2;margin-bottom:18px}.office-heading>a{color:#dac89e;font-size:13px}.office-heading h2{margin:0}.hall-office main{position:fixed;right:20px;top:90px;bottom:20px;width:min(550px,calc(100% - 40px));margin:0;padding:24px;overflow:auto;z-index:4;background:#15241ef5;border:1px solid #ccb88888;border-radius:14px;box-shadow:0 25px 80px #0009;backdrop-filter:blur(8px)}.hall-office #workspace .toolbar,.hall-office #workspace #counts,.hall-office #workspace #next-step,.hall-office #workspace nav{display:none}.hall-office #workspace section{margin:10px 0;border-color:#d0c4a0;background:#f4f0e5}.hall-office #town-hall .scene-canvas{filter:brightness(.7)}#unavailable-scene{max-width:650px;margin:60px auto;color:#233b30}#unavailable-scene a{color:#376650}.office-close{float:right;font-size:13px;color:#526849}#reward-dialog{max-width:520px}button:focus-visible,a:focus-visible{outline:3px solid #efcc85;outline-offset:5px}
dialog{max-width:860px;width:calc(100% - 32px);max-height:90vh;overflow:auto;background:#f4f0e5;color:#263e35;border:1px solid #c2b68f;border-radius:18px;padding:38px;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#061819bf;backdrop-filter:blur(7px)}.dialog-close{position:absolute;right:14px;top:6px;background:transparent;color:#4e6356;font-size:27px}.civic-heading .eyebrow{color:#837044}.civic-heading h2{font-size:27px;margin:12px 0}.civic-heading p{font-size:13px;color:#627268}dialog section{background:transparent;padding:0;border:0}.auth-tabs{display:flex;border-bottom:1px solid #cdc8b8;margin-bottom:22px}.auth-tabs button{background:transparent;color:#6a7669;border-radius:0;font-size:14px}.auth-tabs button[aria-pressed=true]{color:#284b3d;box-shadow:0 2px #7f9662}.role-layout{display:grid;grid-template-columns:240px 1fr;gap:30px}.role-preview{padding:28px 15px;text-align:center;color:#e8dec4;background:radial-gradient(ellipse at 50% 35%,#597567,#233e34 75%);border:1px solid #9c996d;border-radius:80px 80px 12px 12px}.role-preview h3{color:#f1e9d2}.role-preview p{color:#d1d9bc}.role-preview small{font-size:10px}.role-symbol{display:grid;place-items:center;width:135px;height:155px;border:1px solid #a6af7d;border-radius:70px 70px 15px 15px;font-size:83px;color:#e1d09b;margin:30px auto}.role-options h3{margin-top:0}.role-options p{font-size:12px}fieldset{border:1px solid #cdc8b8;border-radius:10px;padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:8px}fieldset label{border:1px solid #d1cbb7;border-radius:7px;padding:8px;margin:0;font-size:13px}input[type=radio]{display:inline;width:auto;margin-right:4px}fieldset label:has(input:checked){background:#e0e8d4;border-color:#78916b}#civic-notice:not(:empty){padding:12px;background:#ece0bd;border-radius:8px;font-size:13px}#workspace{color:#243b37}#workspace nav a{color:#d6dfc9}#workspace section{background:#f4f4eb}#workspace .card{background:#fdfdf8}#notice{color:#314838}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ac8747;outline-offset:4px}@media(max-width:700px){.city-top{padding:12px 16px;gap:12px;flex-wrap:wrap}.city-brand{font-size:20px}.city-top #identity-badge{font-size:10px}.city-top button{padding:8px}.scene-location{left:0;top:0;padding:5px 10px;display:flex;align-items:center;gap:12px;width:100%;border-radius:0}.scene-location h1{font-size:14px;margin:0}.scene-location p,.scene-location small{display:none}.scene-directory{gap:10px;flex-wrap:wrap;justify-content:flex-start;padding:16px}.scene-directory a{border:1px solid #c2b68f55;border-radius:7px;padding:10px 12px;font-size:13px}.map-pin{font-size:11px;min-width:0;padding:6px 8px}.map-pin small,.map-pin>span{display:none}.scene-canvas{aspect-ratio:1.6}.scene-background{object-fit:cover}.desk-manage{top:29%}.hall-office main{right:10px;left:10px;top:110px;bottom:10px;width:auto;padding:18px}.role-layout{grid-template-columns:1fr}.role-preview{border-radius:12px;padding:16px}.role-symbol{height:100px;width:100px;font-size:60px;margin:10px auto}.role-preview h3,.role-preview p{margin:5px}dialog{padding:26px 20px}.civic-heading h2{font-size:22px}.brand-sub{font-size:8px}#workspace nav{gap:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.station-0{left:22%;top:49%}.station-1{left:50%;top:30%}.station-2{left:78%;top:50%}.station-3{left:50%;top:76%}.station-4{left:79%;top:79%}.village-returns{left:77%;top:65%}.village-tower{left:49%;top:49%}.village-honor{left:49%;top:73%}.village-chronicle{left:38%;top:25%}.scene-directory{flex-wrap:wrap;gap:12px 22px}.hall-office .module-canvas{filter:brightness(.7)}.availability{display:inline-block;background:#e6dcc5;color:#6c542c;border-radius:20px;padding:5px 12px;font-size:12px}.hall-office #scene-records:empty{display:none}#scene-records .card{background:#fffdf6}#scene-records h2{font-size:18px}.module-canvas .scene-location{max-width:440px}.module-canvas .scene-location p{max-width:380px}.village-canvas .map-pin{min-width:100px;font-size:13px;padding:8px 10px}
@media(max-width:700px){.village-canvas .map-pin{font-size:10px;padding:5px 6px;min-width:0}.module-canvas .scene-location{max-width:none}.module-canvas .scene-location p{display:none}.map-pin{white-space:nowrap}.station-4{left:80%;top:79%}.hall-office main{top:110px}#scene-records{padding:14px}}

#scene-tavern .station-0{left:50%;top:32%}#scene-tavern .station-1{left:78%;top:48%}#scene-tavern .station-2{left:22%;top:45%}

/* Fit the complete panorama and its directory into the visible viewport. */
html,body{height:100%;overflow:hidden}
body{--city-header-height:76px;height:100dvh}
.city-top{display:flex;flex-shrink:0}
.scene-stage{height:calc(100dvh - var(--city-header-height));display:flex;flex-direction:column;align-items:center;overflow:hidden}
#module-scenes{min-height:0}
.scene-canvas{flex:none;width:min(100%,calc((100dvh - var(--city-header-height) - var(--scene-directory-height,60px)) * 1.6));aspect-ratio:1.6;margin:auto 0}
.scene-background{object-fit:contain}
.scene-directory{flex:none;width:100%;margin:0;max-height:35%;overflow:auto}
body:not(.hall-office)>main{position:fixed;bottom:calc(var(--active-directory-height,60px) + 8px);left:50%;transform:translateX(-50%);width:min(600px,100%);margin:0;z-index:3;pointer-events:none}
body:not(.hall-office) #notice{margin:0;padding:6px 12px;font-size:12px}
.hall-office main{top:calc(var(--city-header-height) + 12px);max-height:calc(100dvh - var(--city-header-height) - 24px);overscroll-behavior:contain}
dialog{max-height:calc(100dvh - 24px)}
@media(max-height:600px){.city-top{min-height:48px;padding:4px 16px}.city-brand{font-size:17px}.scene-location{left:0;top:0;padding:3px 10px;display:flex;align-items:center;gap:12px;border-radius:0}.scene-location h1{font-size:14px;margin:0}.scene-location p,.scene-location small{display:none}.scene-directory{padding:6px 12px;gap:6px 16px}.scene-directory a{padding:3px 6px;font-size:11px}.map-pin{min-width:0;font-size:11px;padding:5px 7px}.map-pin small,.map-pin>span{display:none}.village-canvas .map-pin{min-width:0;font-size:10px;padding:4px 6px}}

.mobile-thumb,.mobile-hint,.mobile-desk-number,.mobile-navigation{display:none}
@media(max-width:700px){
 body{--mobile-nav-height:calc(64px + env(safe-area-inset-bottom,0px))}
 .city-top{min-height:76px;padding:8px 14px;gap:6px 10px;display:grid;grid-template-columns:1fr auto auto}
 .city-brand{grid-column:1;grid-row:1;font-size:19px;gap:6px;white-space:nowrap}.brand-sub{font-size:7px;letter-spacing:1.4px}
 .city-top #identity-badge{grid-column:1/-1;grid-row:2;margin:0;font-size:10px;color:#9cac9e}
 .city-top button{min-height:40px;padding:7px 9px;font-size:11px}.city-top #city-account{grid-column:2;grid-row:1}.city-top #city-logout{grid-column:3;grid-row:1}
 .scene-stage{height:calc(100dvh - var(--city-header-height) - var(--mobile-nav-height));align-items:stretch;background:#101e19}
 .scene-canvas{width:100%;height:clamp(155px,25dvh,220px);aspect-ratio:auto;margin:0;flex:none}
 .scene-background{object-fit:cover;object-position:center 48%}.scene-shade{background:linear-gradient(180deg,#07150e15 20%,#07150ed9 100%)}
 .scene-canvas .map-pin{display:none}
 .scene-location,.module-canvas .scene-location{left:0;right:0;top:auto;bottom:0;width:auto;max-width:none;padding:18px 20px;display:block;border:0;background:transparent;backdrop-filter:none;border-radius:0}
 .scene-location h1{font-size:25px;letter-spacing:2px;margin:4px 0}.scene-location p,.module-canvas .scene-location p{display:block;font-size:12px;color:#e0d7bf}.scene-location small{display:none}.scene-location a{font-size:12px}
 .scene-directory{display:grid;grid-template-columns:1fr;align-content:start;gap:10px;max-height:none;min-height:0;flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px;background:#101e19;border:0}
 .scene-directory a{position:relative;display:flex;align-items:center;gap:14px;min-height:80px;margin:0;padding:14px;border:1px solid #ad9e6844;border-radius:12px;background:#1c2d23;font-size:15px;color:#f5e8ca;text-decoration:none;overflow:hidden}
 .directory-copy{position:relative;z-index:1;display:block;min-width:0}.directory-title{display:block;font-weight:600;line-height:1.5}.mobile-hint{display:block;font-size:11px;line-height:1.5;letter-spacing:0;color:#bcceba;margin-top:5px}.mobile-desk-number{display:grid;place-items:center;flex:none;width:36px;height:40px;font:20px Georgia,serif;color:#d4b879;border-right:1px solid #c7b48255;padding-right:10px}
 #city-world .scene-directory{grid-template-columns:1fr 1fr;gap:12px}
 #city-world .scene-directory a{min-height:125px;padding:14px 12px;align-items:flex-end;background:#233427;isolation:isolate}
 #city-world .mobile-thumb{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
 #city-world .scene-directory a:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0b1a1133,#0b1a11ed)}
 #city-world .mobile-desk-number{display:none}#city-world .mobile-hint{font-size:10px;color:#e2dac6}
 .mobile-navigation{position:fixed;z-index:6;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(3,1fr);height:var(--mobile-nav-height);margin:0;padding:4px 8px calc(4px + env(safe-area-inset-bottom,0px));gap:6px;background:#102019;border-top:1px solid #a391614d}
 .mobile-navigation a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:48px;font-size:11px;color:#aabaac;text-decoration:none;border-radius:9px}.mobile-navigation a>span{font-size:21px;line-height:1.1;color:#cab887}.mobile-navigation a[aria-current]{background:#29402e;color:#f8e8bb}
 .hall-office main{left:0;right:0;top:var(--city-header-height);bottom:var(--mobile-nav-height);width:100%;max-height:none;padding:18px 16px;margin:0;border:0;border-radius:0;background:#13251e;box-shadow:none;backdrop-filter:none}
 .hall-office .scene-stage{visibility:hidden}.hall-office #workspace section{padding:16px}.hall-office #workspace .card{padding:14px}.hall-office .office-heading{position:sticky;top:-18px;z-index:2;background:#13251e;padding:12px 0;margin-top:-12px}.office-heading h2{font-size:22px}
 #workspace input,#workspace select,#workspace textarea,dialog input,dialog select{font-size:16px;min-height:44px}#workspace button,dialog button{min-height:44px;max-width:100%}#workspace pre{font-size:13px;overflow-wrap:anywhere}
 body:not(.hall-office)>main{bottom:calc(var(--mobile-nav-height) + 8px);width:calc(100% - 24px);padding:0}body:not(.hall-office) #notice{box-shadow:0 4px 20px #0005}
 dialog{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0;padding:52px 20px calc(24px + env(safe-area-inset-bottom,0px));overscroll-behavior:contain}
 .dialog-close{top:8px;right:12px}.civic-heading h2{font-size:25px}.role-layout{gap:20px}.role-preview{display:grid;grid-template-columns:80px 1fr;text-align:left;align-items:center;column-gap:16px}.role-preview .eyebrow,.role-preview small{grid-column:2}.role-symbol{grid-column:1;grid-row:1/5;width:76px;height:90px;font-size:45px;margin:0}.role-preview h3,.role-preview p{margin:0}
}
@media(max-width:700px){.scene-directory{scrollbar-width:thin;scrollbar-color:#61715b transparent}.scene-directory::-webkit-scrollbar{width:4px}.scene-directory::-webkit-scrollbar-thumb{background:#61715b;border-radius:4px}.scene-directory::-webkit-scrollbar-track{background:transparent}}