:root{font:14px system-ui,-apple-system,Arial;color:#18283a;background:#edf1f6}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input,select,textarea{font:inherit}button{cursor:pointer}.top{height:62px;display:flex;align-items:center;gap:12px;padding:9px 16px;background:#102641;color:#fff}.top>a{color:#fff;font-size:25px;text-decoration:none}.title{display:grid;gap:2px}.title strong{font-size:16px}.title small{font-size:11px;color:#aec0d6}.spacer{flex:1}.top button{background:#24436a;color:white;border:1px solid #49617f;border-radius:8px;padding:8px}.search{position:relative}.search input{width:min(260px,29vw);padding:9px;border:1px solid #7c93b0;border-radius:8px;background:#fff}.results{display:none;position:absolute;right:0;top:39px;width:300px;max-height:320px;overflow:auto;background:white;color:#12243b;border:1px solid #cfdae5;border-radius:8px;box-shadow:0 5px 15px #0003;z-index:12}.results.show{display:block}.results button{display:block;width:100%;text-align:left;background:#fff;border:0;border-bottom:1px solid #e7ecf2;color:#18283a}.bar{min-height:49px;background:white;display:flex;align-items:center;gap:12px;padding:7px 16px;border-bottom:1px solid #d7dee9}.filters{display:flex;gap:5px;flex-wrap:wrap}.filters button{border:1px solid #cad4e1;background:white;border-radius:9px;padding:6px 10px;color:#253c58}.filters button.active{background:#1e518b;border-color:#1e518b;color:white}.filters b{font-size:10px;opacity:.7}.overview{margin-left:auto;font-size:12px;color:#55708d;white-space:nowrap}#mapArea{height:calc(100dvh - 111px);position:relative;background:#d8e0e9;touch-action:none;overflow:hidden;cursor:grab}#mapArea.drag{cursor:grabbing}#siteSvg{height:100%;width:100%;display:block}#world{transform-origin:0 0}.lot{fill:transparent;stroke:transparent;stroke-width:.7;cursor:pointer;vector-effect:non-scaling-stroke}.lot:hover,.lot.selected{fill:#288fff55;stroke:#085bd0;stroke-width:2}.lot.progress{fill:#f7a62470}.lot.done{fill:#20b87470}.road-visible{fill:none;stroke:#1976ca;stroke-width:2.3;opacity:.4;pointer-events:none}.road-hit{fill:none;stroke:transparent;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;cursor:pointer}.road-hit:hover,.road-hit.selected{stroke:#0872e688;stroke-width:8}.wall-visible{fill:none;stroke:#d61c52;stroke-width:2.2;opacity:.56;pointer-events:none}.wall-hit{fill:none;stroke:transparent;stroke-width:10;stroke-linecap:round;cursor:pointer}.wall-hit:hover,.wall-hit.selected{stroke:#d61c52aa;stroke-width:7}.drain-visible{fill:none;stroke:#00a5b5;stroke-width:3;stroke-dasharray:5 3;opacity:.85;pointer-events:none}.drain-hit{fill:none;stroke:transparent;stroke-width:13;stroke-linecap:round;stroke-linejoin:round;cursor:pointer}.drain-hit:hover,.drain-hit.selected{stroke:#00c6d5aa;stroke-width:9}.mapControls{position:absolute;right:12px;top:12px;display:grid;gap:5px}.mapControls button{background:white;border:1px solid #ccd7e4;border-radius:8px;padding:8px;min-width:40px;box-shadow:0 2px 10px #0002}.mapNote{position:absolute;left:12px;bottom:12px;background:#fffffff0;border:1px solid #d8e0e9;border-radius:7px;padding:7px 10px;max-width:400px;color:#52657d;font-size:11px}.drawer{display:none;position:absolute;right:12px;top:122px;bottom:12px;width:min(365px,calc(100% - 24px));background:#fff;border:1px solid #d6deea;border-radius:12px;box-shadow:0 8px 25px #0004;z-index:10;overflow:auto;padding:16px}.drawer.open{display:block}.drawer header{display:flex;gap:8px;align-items:center}.drawer header h2{font-size:18px;margin:0;flex:1}.drawer header button{border:0;background:#eef2f7;border-radius:7px;padding:6px 10px}.badge{display:inline-block;font-size:11px;background:#e8eef5;border-radius:5px;padding:4px 7px;margin:8px 0;color:#38526f}.drawer label{display:block;font-size:12px;font-weight:650;margin:12px 0 5px}.drawer input,.drawer select,.drawer textarea{width:100%;border:1px solid #cbd5e1;border-radius:7px;padding:8px}.drawer textarea{resize:vertical}.row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.stage{display:grid;grid-template-columns:1fr 80px;align-items:center;gap:8px;margin:5px 0;font-size:12px}.stage input{width:100%}.muted{color:#62768d;font-size:12px;line-height:1.45}.notice{color:#a24620;font-size:12px}.buttonrow{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.buttonrow button{border:1px solid #bdccdc;background:#fff;border-radius:8px;padding:8px 11px}.buttonrow .primary{background:#1d518d;color:#fff;border-color:#1d518d}.survey{border:1px solid #dce4ef;border-radius:8px;padding:7px;margin-top:8px}.survey img{width:100%;max-height:200px;object-fit:cover;object-position:top}.statusbar{background:#edf5fd;padding:8px;margin:8px 0;border-radius:7px;font-size:12px}@media(max-width:730px){.top{height:57px;padding:8px}.title small{display:none}.title strong{font-size:13px}.search input{width:120px}.bar{min-height:45px;padding:5px;overflow-x:auto}.filters{flex-wrap:nowrap}.filters button{white-space:nowrap;padding:5px 7px}.overview{display:none}#mapArea{height:calc(100dvh - 102px)}.drawer{top:auto;bottom:0;right:0;width:100%;height:min(64dvh,550px);border-radius:14px 14px 0 0}.mapNote{font-size:10px;max-width:66%;padding:5px}.results{right:-40px;width:250px}}

body.surveyDetail .lot.type-A{fill:#c9c9c944}body.surveyDetail .lot.type-B{fill:#ff7f7f55}body.surveyDetail .lot.type-C{fill:#ffbf9f55}body.surveyDetail .lot.progress{fill:#f7a62488}body.surveyDetail .lot.done{fill:#20b87488}body.surveyDetail .lot:hover,body.surveyDetail .lot.selected{fill:#288fff77}.selectionBadge{display:none;position:absolute;left:12px;top:12px;padding:9px 12px;border-radius:8px;background:#102641;color:#fff;box-shadow:0 2px 9px #0003;z-index:2;font-weight:650}.selectionBadge.show{display:block}.mapControls #detailMode{font-size:11px;white-space:nowrap}body.surveyDetail .mapNote{color:#72521c;background:#fff8e8f2;border-color:#e9d59a}@media(max-width:730px){.selectionBadge{font-size:12px;max-width:58%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

.road-label{font-size:6px;font-weight:750;fill:#164981;stroke:#fff;stroke-width:2px;stroke-linejoin:round;paint-order:stroke fill;pointer-events:none;user-select:none}body.surveyDetail .road-label{font-size:5.3px}

.mapControls #refreshShared{font-size:11px;min-width:100px;background:#eaf6ef;border-color:#a5ceb5;color:#24543b}
/* Live field summary and clean plan */
.fieldSummary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:8px 14px;background:#f4f8fc;border-bottom:1px solid #d6e1ec;min-height:67px}
.summaryItem{display:grid;grid-template-columns:1fr;gap:2px;background:white;border:1px solid #dbe4ed;border-radius:8px;padding:5px 9px;min-width:0}
.summaryItem strong{font-size:11px;color:#193a5c}.summaryItem span{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#526579}
.summaryItem i{height:4px;border-radius:5px;background:linear-gradient(to right,#26856d var(--fill),#e3ebf1 var(--fill));display:block}
#mapArea{height:calc(100dvh - 178px)}
.lot-label{font-size:4.1px;fill:#1c344c;stroke:white;stroke-width:1.2px;paint-order:stroke fill;pointer-events:none;display:none;font-weight:700}
.showLotLabels .lot-label{display:block}
.photoSection{border-top:1px solid #e0e8ef;margin-top:13px;padding-top:3px}
.photoSection input[type=file]{font-size:11px;padding:5px}.photoSection input[type=file]::file-selector-button{border:1px solid #b9cadc;border-radius:6px;background:#fff;padding:5px;cursor:pointer}
.photoGallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}
.photoCard{border:1px solid #d7e1ed;border-radius:8px;padding:5px;min-width:0;display:grid;gap:4px}
.photoCard img{width:100%;height:90px;object-fit:cover;border-radius:5px;background:#edf2f7}
.photoCard span{font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.photoCard button{border:1px solid #d9b5b5;background:#fff2f2;color:#9c3232;border-radius:5px;font-size:11px}
#mapNote:empty{display:none}
@media(max-width:730px){.fieldSummary{display:flex;overflow-x:auto;min-height:58px;gap:5px;padding:5px}.summaryItem{min-width:132px;padding:4px 7px}#mapArea{height:calc(100dvh - 160px)}.photoCard img{height:110px}}
