*{box-sizing:border-box}body{margin:0;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Hiragino Sans','Noto Sans JP',sans-serif;color:#203f35;background:#e7eee8;font-size:14px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;border:0;background:none}button:hover{filter:brightness(.9)}button:focus-visible,a:focus-visible{outline:3px solid #c9b044;outline-offset:4px}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}header{height:76px;background:#fff;display:flex;align-items:center;padding:0 29px;border-bottom:1px solid #dfe7e0;position:relative;z-index:4}.brand{font-size:29px;font-weight:750;letter-spacing:-1.5px;color:#164d3d}.brand span{vertical-align:top;font-size:12px;letter-spacing:0;margin-left:3px}.workspace-name{font-size:13px;color:#6a7c70;margin-left:36px}.workspace-name i{margin:0 15px;color:#b5c5bb;font-style:normal}.header-right{display:flex;align-items:center;gap:20px;margin-left:auto}.demo{font-size:11px;letter-spacing:1.7px;border:1px solid #dce5df;padding:7px 10px;border-radius:5px;color:#6a7c70}.avatar{width:35px;height:35px;border-radius:50%;background:#e9edde;display:grid;place-items:center;font-size:12px}main{display:flex;height:calc(100dvh - 76px);min-height:650px}.rail{width:82px;flex-shrink:0;background:#173f35;display:flex;align-items:center;flex-direction:column;padding:22px 10px;gap:15px;z-index:3}.rail button{color:#adc3b6;width:58px;padding:10px 0;border-radius:10px}.rail button.active{background:#d5e7b7;color:#214536}.rail button span{font-size:26px;display:block;margin-bottom:4px}.rail small{font-size:12px}.rail a{margin-top:auto;font-size:27px;color:#c1d8a9;font-weight:700}.world{position:relative;flex:1;overflow:hidden;min-width:0;background:#e7eee8}#viewport{position:absolute;inset:0}canvas{display:block;width:100%;height:100%;touch-action:none}#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}.building-label{position:absolute;white-space:nowrap;pointer-events:auto;background:#fffffff0;border:1px solid #d6e2d7;border-radius:7px;padding:7px 11px;box-shadow:0 3px 12px #173f3515;transform:translate(-50%,-100%);font-size:12px;display:flex;align-items:center;gap:6px;transition:background .2s}.building-label.active{background:#205b45;color:white;border-color:#205b45}.building-label:before{content:'';width:6px;height:6px;background:#73ac77;border-radius:50%}.building-label.stopped:before{background:#9b9d9b}.building-label.alert:before{background:#df9d4c}.world-title{position:absolute;top:29px;left:32px;pointer-events:none}.world-title>p{font-size:11px;letter-spacing:2.5px;color:#56806a;font-weight:600}.world-title h1{font-size:25px;font-weight:600;letter-spacing:.8px;margin:9px 0}.world-title>span{font-size:13px;color:#788e80}.town-stats{position:absolute;top:30px;right:30px;display:flex;background:#ffffffcf;backdrop-filter:blur(12px);padding:17px 0;border:1px solid #fff;border-radius:12px;box-shadow:0 6px 20px #24453105}.town-stats>div{padding:0 22px;border-right:1px solid #e1e9e1;min-width:115px}.town-stats>div:last-child{border:0}.town-stats span{display:block;font-size:11px;color:#7e8d80;margin-bottom:7px}.town-stats b{font-size:24px;font-weight:500;font-variant-numeric:tabular-nums}.town-stats small{font-size:12px;margin-left:5px;color:#7b8e80}.town-stats em{font-size:16px;color:#b8c7ba;font-style:normal;margin:0 5px}.inspector{position:absolute;top:157px;right:30px;width:272px;background:#ffffffed;backdrop-filter:blur(15px);border:1px solid #fff;border-radius:15px;padding:23px;box-shadow:0 12px 36px #2648330b}.panel-eyebrow{font-size:11px;letter-spacing:1.5px;color:#8b9a8d;display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.panel-eyebrow button{font-size:21px;line-height:1;padding:0 2px}.inspector h2{font-size:20px;font-weight:600}.address{font-size:12px;color:#849183;margin:8px 0 15px}.status{display:inline-block;font-size:12px;border-radius:5px;background:#edf5e7;color:#5c8353;padding:5px 8px}.status.warning{background:#fff0dc;color:#a77837}.meta{display:flex;gap:16px;font-size:12px;color:#758274;padding:17px 0;border-bottom:1px solid #e4eae1}.meta b{color:#40533e;font-weight:500}.rule{display:flex;align-items:center;gap:11px;padding:15px 0;border-bottom:1px solid #edf1e9}.rule-icon{font-size:20px;width:24px;color:#699479}.rule h3{font-size:14px;font-weight:500}.rule small{display:block;font-size:11px;margin-top:4px;color:#8b9989}.switch{margin-left:auto;flex:none;width:34px;height:20px;border-radius:20px;padding:3px;background:#cdd8cc}.switch:after{content:'';display:block;width:14px;height:14px;border-radius:50%;background:white;box-shadow:0 1px 3px #0001;transition:transform .2s}.switch[aria-checked=true]{background:#377a57}.switch[aria-checked=true]:after{transform:translateX(14px)}.inspector-note{font-size:11px;line-height:1.7;color:#8c9b89;margin-top:16px}.camera-controls{position:absolute;left:30px;bottom:148px;display:flex;flex-direction:column;border-radius:9px;padding:4px;background:#ffffffed;box-shadow:0 3px 15px #334c3310;border:1px solid #fff}.camera-controls button{width:35px;height:35px;font-size:19px}.camera-controls button:last-child{font-size:13px}.camera-controls button+button{border-top:1px solid #edf1e9}.world-bottom{position:absolute;bottom:52px;left:30px;right:30px;display:flex;justify-content:space-between;align-items:end;gap:15px}.event-card{display:flex;align-items:center;gap:13px;background:#ffffffde;border:1px solid white;backdrop-filter:blur(10px);border-radius:11px;padding:14px 18px;max-width:440px;min-height:69px}.event-icon{font-size:30px;color:#87a672}.event-card small{font-size:11px;color:#8b9987}.event-card p{font-size:12px;margin-top:5px;line-height:1.5}.playback{display:flex;align-items:center;background:#ffffffeb;backdrop-filter:blur(10px);border-radius:11px;border:1px solid white;box-shadow:0 5px 20px #334c3310;padding:12px 14px;gap:16px}.clock{display:grid;grid-template-columns:22px auto;column-gap:7px;align-items:center}.clock>span{grid-row:1/3;font-size:24px;color:#b19a4d}.clock b{font-size:21px;font-weight:500;line-height:1.1;font-variant-numeric:tabular-nums}.clock small{font-size:10px;color:#91a08c;margin-top:3px}.play-buttons{border-left:1px solid #e0e7dc;padding-left:12px;display:flex;align-items:center;gap:4px}.play-buttons button{padding:7px;border-radius:5px;font-size:13px}.play-buttons .active{background:#e4eedb;color:#305e3d}.play-buttons #pause{font-size:18px;min-width:29px}#night{font-size:12px;padding:7px 9px;border:1px solid #dfe7da;border-radius:6px;white-space:nowrap}.world-foot{position:absolute;bottom:19px;left:32px;right:32px;display:flex;justify-content:space-between;font-size:11px;color:#80927e;pointer-events:none}.drawer{position:absolute;top:145px;left:30px;width:340px;max-height:calc(100% - 295px);overflow:auto;background:#fffffff2;backdrop-filter:blur(15px);border:1px solid white;border-radius:13px;padding:20px;box-shadow:0 8px 30px #334c3315;z-index:3}.drawer h2{font-size:18px;margin-bottom:15px}.drawer-head{display:flex;align-items:center;justify-content:space-between}.drawer-head button{font-size:23px}.building-row{display:block;width:100%;text-align:left;padding:14px 0;border-top:1px solid #e6ebe3}.building-row strong{font-size:14px;font-weight:500}.building-row small{display:block;color:#8b9b87;font-size:12px;margin-top:5px}.activity-row{font-size:12px;line-height:1.7;padding:12px 0;border-top:1px solid #e6ebe3}.activity-row time{display:block;color:#8b9b87;font-size:11px}.alert-box{background:#fff4e4;padding:11px;font-size:12px;line-height:1.6;border-radius:6px;margin-top:14px}.alert-box button{background:#246848;color:white;padding:8px 12px;margin-top:9px;border-radius:5px;width:100%}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);padding:12px 20px;background:#173f35;color:white;border-radius:8px;z-index:20;opacity:0;pointer-events:none;font-size:13px}#toast.show{opacity:1}.skip{position:fixed;top:-100px;background:white;z-index:30;padding:15px}.skip:focus{top:10px}#loading,#error{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;background:#e7eee8;z-index:10}#error{padding:30px;text-align:center}#error p{max-width:420px;line-height:1.8}#error button{padding:12px 20px;background:#246848;color:white;border-radius:8px}.loader{height:32px;width:32px;border-radius:50%;border:3px solid #ccdcc7;border-top-color:#326c4e;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}[hidden]{display:none!important}.night .world-title h1{color:#f0f4e7}.night .world-title>span,.night .world-title>p,.night .world-foot{color:#a6b8b4}@media(max-width:1150px){.town-stats>div{padding:0 15px;min-width:95px}.town-stats{top:24px;right:22px}.world-title{left:25px;top:24px}.world-title h1{font-size:22px}.world-title>span{font-size:12px}.inspector{right:22px;width:248px;padding:20px}.world-bottom{left:22px;right:22px;gap:10px}.event-card{max-width:340px;padding:12px}.playback{gap:10px;padding:12px}.world-foot{font-size:10px}.workspace-name{font-size:12px}.town-stats>div:last-child{display:none}}@media(max-width:800px){header{height:62px;padding:0 18px}.brand{font-size:25px}.workspace-name{display:none}main{height:calc(100dvh - 62px);min-height:800px}.rail{width:62px;padding:18px 6px}.rail button{width:48px}.world-title{top:22px;left:20px}.world-title h1{font-size:21px}.town-stats{top:113px;left:20px;right:auto;padding:12px 0}.town-stats>div{min-width:85px;padding:0 16px}.town-stats span{font-size:10px}.town-stats b{font-size:22px}.inspector{top:210px;right:16px;width:230px;padding:18px}.world-bottom{left:18px;right:18px;flex-direction:column;align-items:stretch;bottom:45px;gap:10px}.event-card{max-width:none;min-height:55px;padding:10px 14px}.playback{justify-content:space-between}.world-foot{left:20px;right:20px;bottom:13px;font-size:9px}.world-foot>span:first-child{display:none}.camera-controls{left:18px;bottom:202px}.drawer{top:205px;left:16px;width:calc(100% - 32px);max-height:calc(100% - 390px)}}@media(max-width:540px){main{min-height:740px}.rail{width:52px}.rail button{width:42px}.rail small{font-size:10px}.rail button span{font-size:23px}.demo{font-size:9px;padding:6px;letter-spacing:1px}.header-right{gap:12px}.world-title h1{font-size:19px}.world-title>p{font-size:10px}.town-stats{top:109px}.town-stats span{font-size:10px}.inspector{top:auto;bottom:198px;left:16px;right:16px;width:auto;padding:15px}.inspector .panel-eyebrow{margin-bottom:9px}.inspector h2{font-size:17px}.inspector .address,.inspector .meta,.inspector .inspector-note{display:none}.inspector .status{margin-top:8px;font-size:10px}.inspector .rule{padding:9px 0}.rule h3{font-size:12px}.rule small{font-size:10px}.camera-controls{bottom:198px}.inspector:not([hidden])~.camera-controls{display:none}.world-bottom{left:12px;right:12px}.playback{padding:10px;gap:5px}.clock b{font-size:18px}.play-buttons{padding-left:6px;gap:1px}.play-buttons button{padding:6px}.event-card p{font-size:11px}.event-icon{font-size:23px}#night{font-size:11px;padding:6px}.building-label{font-size:10px;padding:6px 8px}.world-foot{font-size:9px;left:12px}.world-title>span{font-size:11px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.inspector{max-height:calc(100% - 305px);overflow:auto}@media(max-width:540px){.inspector{max-height:45%}}
.workflow-panel{position:absolute;top:155px;right:28px;width:310px;padding:21px;background:#fffffff2;backdrop-filter:blur(15px);border:1px solid #fff;border-radius:15px;max-height:calc(100% - 300px);overflow:auto;box-shadow:0 10px 35px #243d3112;z-index:2}.workflow-heading{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#366f52;border-bottom:1px solid #e2eae0;padding-bottom:14px}.workflow-heading button{font-size:21px}.workflow-ticket{display:flex;justify-content:space-between;margin:17px 0 9px;font-size:11px;color:#899684}.workflow-ticket small{font-size:10px;background:#eff3e9;padding:2px 6px;border-radius:3px}.workflow-panel h2{font-size:19px;line-height:1.5;font-weight:600}.workflow-description{font-size:12px;line-height:1.8;color:#7a8b76;margin:9px 0 12px}.case-property{font-size:12px;padding:10px 0;border-top:1px solid #e9eee5;border-bottom:1px solid #e9eee5}.case-property span{float:right;color:#93a08d;font-size:11px}.flow-steps{padding:0;list-style:none;margin:16px 0;font-size:12px;line-height:2.2;color:#a0aa98}.flow-steps li{display:flex;gap:10px}.flow-steps .done{color:#5a9467}.flow-steps .current{color:#285f42;font-weight:600}.flow-steps .current span{color:#c5a257}.approval-card{background:#fff4df;border:1px solid #f1dfb8;border-radius:9px;padding:14px}.human-tag{font-size:11px;color:#ad8034}.estimate-price{font-size:25px;margin-top:9px;font-weight:600}.estimate-price small{font-size:10px;font-weight:400;color:#947c52}.approval-card p{font-size:11px;line-height:1.8;color:#977e55;margin:9px 0 12px}#approve-repair,#replay-repair{width:100%;background:#226345;color:#fff;padding:12px 8px;border-radius:7px;font-size:12px}#replay-repair:disabled{background:#edf1e8;color:#889982;cursor:default}.approval-card .defer{width:100%;font-size:11px;padding:10px 0 0;color:#9c814d}.auto-working{display:flex;align-items:center;gap:8px;font-size:11px;color:#56805a;padding:12px;background:#f1f6eb;border-radius:6px}.auto-working span{height:7px;width:7px;border-radius:50%;background:#93b479}.workflow-disclaimer{font-size:10px;color:#9ba893;line-height:1.6;margin-top:14px}.completion-card{background:#eff7e9;color:#54805b;font-size:12px;padding:13px;border-radius:7px;line-height:1.9;margin-bottom:12px}.incident-label,.van-label{position:absolute;transform:translate(-50%,-100%);white-space:nowrap;border-radius:6px;padding:6px 10px;font-size:11px;box-shadow:0 3px 14px #243a3120}.incident-label{pointer-events:auto;background:#e9a253;color:white;z-index:2}.incident-label.complete{background:#44825b}.van-label{background:#ffdf91;color:#665025;pointer-events:none;z-index:2;font-size:10px}.hub-label{border-color:#a5c496;background:#edf5de;color:#315d40}.town-stats>div:last-child{min-width:190px}.town-stats>div:last-child b{font-size:23px}@media(max-width:1150px){.town-stats>div:last-child{display:block}.town-stats>div:nth-child(2){display:none}.workflow-panel{right:20px;width:290px}}@media(max-width:800px){.workflow-panel{top:210px;right:16px;width:270px;max-height:calc(100% - 400px)}.town-stats>div:last-child{min-width:180px}.world-title>span{max-width:280px;display:block;line-height:1.7}.town-stats{top:124px}.workflow-panel h2{font-size:17px}.flow-steps{margin:10px 0;line-height:1.9}}@media(max-width:540px){.workflow-panel{top:218px;left:12px;right:12px;width:auto;max-height:calc(100% - 400px);padding:16px}.workflow-heading{font-size:11px}.workflow-description{font-size:11px}.flow-steps{font-size:11px}.world-title h1{font-size:17px}.town-stats>div{padding:0 10px;min-width:70px}.town-stats>div:last-child{min-width:155px}.town-stats span{font-size:9px}.town-stats>div:last-child b{font-size:20px}.rail{gap:9px}.workflow-panel:not([hidden])~.camera-controls{display:none}.incident-label{font-size:10px}.van-label{font-size:9px}}
.workflow-panel[data-stage=approval] .flow-steps{display:none}.workflow-panel[data-stage=approval] .workflow-description{display:none}.workflow-panel[data-stage=approval] .case-property{margin:12px 0}.incident-label{margin-top:-23px}

/* Phone workspace: full-width town, bottom navigation, scrollable detail sheets. */
@media(max-width:600px){
 body:not([data-hero]){height:100dvh;overflow:hidden}
 body:not([data-hero]) header{height:56px;padding:0 16px}
 body:not([data-hero]) main{height:calc(100dvh - 56px);min-height:0;display:block;padding-bottom:calc(62px + env(safe-area-inset-bottom))}
 body:not([data-hero]) .world{height:100%}
 body:not([data-hero]) .rail{position:fixed;bottom:0;left:0;right:0;width:100%;height:calc(62px + env(safe-area-inset-bottom));padding:4px 8px calc(4px + env(safe-area-inset-bottom));flex-direction:row;justify-content:space-around;gap:4px;z-index:10}
 body:not([data-hero]) .rail button{width:56px;min-height:48px;padding:3px}
 body:not([data-hero]) .rail button span{font-size:21px;margin:0}.rail small{font-size:11px}
 body:not([data-hero]) .rail a{margin:0;min-width:44px;min-height:44px;display:grid;place-items:center}
 body:not([data-hero]) .world-title{left:16px;top:12px}
 body:not([data-hero]) .world-title h1{font-size:19px;margin:5px 0}
 body:not([data-hero]) .world-title>span{display:none}
 body:not([data-hero]) .town-stats{top:73px;left:12px;right:12px;padding:9px 0;justify-content:space-between}
 body:not([data-hero]) .town-stats>div{min-width:0;padding:0 12px}
 body:not([data-hero]) .town-stats>div:last-child{min-width:0}
 body:not([data-hero]) .town-stats span{font-size:10px;margin-bottom:3px}
 body:not([data-hero]) .town-stats b{font-size:19px}
 body:not([data-hero]) #viewport{top:115px;bottom:78px}
 body:not([data-hero]) .world-bottom{bottom:10px;left:10px;right:10px}
 body:not([data-hero]) .event-card,body:not([data-hero]) .world-foot{display:none}
 body:not([data-hero]) .playback{padding:6px 8px}.play-buttons button,#night{min-height:44px}
 body:not([data-hero]) .camera-controls{bottom:82px;left:12px;flex-direction:row}
 body:not([data-hero]) .camera-controls button{width:44px;height:44px}
 body:not([data-hero]) .workflow-panel,body:not([data-hero]) .inspector,body:not([data-hero]) .drawer{top:auto;bottom:78px;left:10px;right:10px;width:auto;max-height:46%;overflow-y:auto;overscroll-behavior:contain;padding:16px;border-radius:16px}
 body:not([data-hero]) .workflow-panel h2{font-size:17px}
 body:not([data-hero]) .workflow-description,body:not([data-hero]) .flow-steps{font-size:12px}
 body:not([data-hero]) #close-workflow,body:not([data-hero]) #close-inspector,body:not([data-hero]) #close-drawer{min-width:44px;min-height:44px}
 body:not([data-hero]) #approve-repair,body:not([data-hero]) #defer-repair,body:not([data-hero]) #replay-repair{min-height:44px}
}
@media(max-width:600px){
 body:not([data-hero]) .world:has(.workflow-panel:not([hidden])) #viewport,
 body:not([data-hero]) .world:has(.inspector:not([hidden])) #viewport,
 body:not([data-hero]) .world:has(.drawer:not([hidden])) #viewport{bottom:calc(46% + 78px)}
}
