*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:system-ui,Segoe UI,Roboto,sans-serif;font-size:15px;color:#e8eef4;background:#14202b}
#map{position:absolute;inset:0}
button{font:inherit;background:#26394a;color:#e8eef4;border:1px solid #3d566c;border-radius:6px;padding:8px 12px;min-height:40px}
button.primary{background:#0a6fd6;border-color:#3d9bff;font-weight:600}
button:active{filter:brightness(1.3)}
.grow{flex:1}
#top{position:absolute;top:8px;left:8px;right:8px;display:flex;gap:8px;z-index:5;align-items:flex-start;pointer-events:none}
#top>*{pointer-events:auto}
#searchWrap{flex:1;position:relative;max-width:560px}
#search{width:100%;min-height:40px;padding:8px 10px;border-radius:6px;border:1px solid #3d566c;background:#1b2b3a;color:#fff;font:inherit}
#results{position:absolute;top:44px;left:0;right:0;background:#1b2b3a;border:1px solid #3d566c;border-radius:6px;max-height:50vh;overflow:auto}
#results div{padding:9px 10px;border-bottom:1px solid #2a3f50}
#results small{color:#8fa6b8}
#panel{position:absolute;top:0;left:0;bottom:0;width:min(380px,92vw);background:#162330;z-index:8;display:flex;flex-direction:column;border-right:1px solid #3d566c}
#panel[hidden],#sheet[hidden],#modal[hidden],#toast[hidden],#results[hidden]{display:none}
.ph{display:flex;gap:6px;align-items:center;padding:8px;border-bottom:1px solid #2a3f50}
.ph button{padding:4px 8px;min-height:32px;font-size:12px}
.pfilter{padding:6px 10px;border-bottom:1px solid #2a3f50;font-size:13px}
.pfilter select{font:inherit;background:#1b2b3a;color:#fff;border:1px solid #3d566c;border-radius:4px;padding:4px}
.pfilter label{margin-right:10px;white-space:nowrap}
#tree{flex:1;overflow:auto;padding:4px 0}
.grp{padding:8px 10px 2px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#7f98ab}
.row{display:flex;align-items:center;gap:6px;padding:5px 8px 5px calc(8px + var(--d,0)*16px)}
.row .tw{width:20px;text-align:center;color:#8fa6b8;cursor:pointer;user-select:none}
.row input{width:20px;height:20px;flex:none}
.row .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .ct{color:#8fa6b8;font-size:12px}
.row.pack{background:#1b2d3d;font-weight:600}
.row.pack .nm{white-space:normal}
.pfoot{padding:8px;border-top:1px solid #2a3f50;display:flex;flex-direction:column;gap:6px}
#offlineMsg,#buildInfo{font-size:11px;color:#8fa6b8}
#sheet{position:absolute;left:0;right:0;bottom:0;max-height:62vh;background:#fff;color:#111;z-index:7;display:flex;flex-direction:column;border-radius:12px 12px 0 0;box-shadow:0 -4px 16px #0008}
@media (min-width:900px){#sheet{left:auto;right:12px;bottom:12px;width:460px;max-height:80vh;border-radius:12px}}
.sh{display:flex;align-items:center;padding:8px 12px;font-weight:700;font-size:16px;border-bottom:1px solid #ddd;gap:8px}
.sh button{background:#eee;color:#111;border-color:#ccc}
#shBadges{padding:6px 12px 0}
.badge{display:inline-block;font-size:11px;font-weight:700;padding:2px 6px;border-radius:10px;margin:0 4px 4px 0;background:#ddd;color:#222}
.badge.APPROX,.badge.VERIFY,.badge.QUESTIONABLE{background:#ffd27a}
.badge.OOS,.badge.NOT_DRAWN{background:#ff9d9d}
.badge.CONFIRMED{background:#a6e9a6}
.badge.FIELD_CONFIRM,.badge.CANDIDATE{background:#a8d3ff}
#shBody{overflow:auto;padding:6px 12px;font-size:14px;line-height:1.4}
#shBody h3{margin:.3em 0}
#shBody a{color:#0a58b6}
.sf{padding:8px 12px;border-top:1px solid #ddd}
.sf button{width:100%}
#modal{position:absolute;inset:0;background:#000a;z-index:20;display:flex;align-items:center;justify-content:center;padding:10px}
.mbox{background:#fff;color:#111;border-radius:10px;width:min(560px,100%);max-height:94vh;overflow:auto;padding:14px}
.mbox h3{margin:.1em 0 .5em}
.mbox label{display:block;font-weight:600;margin:.6em 0 .2em}
.mbox input,.mbox textarea,.mbox select{width:100%;font:inherit;padding:8px;border:1px solid #aab;border-radius:6px}
.mbox .two{display:flex;gap:8px}
.mbox .two>*{flex:1}
.mbox .btns{display:flex;gap:8px;margin-top:12px}
.mbox .btns button{flex:1}
.mbox button{background:#e6ecf2;color:#111;border-color:#b6c3d0}
.mbox button.primary{background:#0a6fd6;color:#fff}
.mbox .opt{display:flex;gap:8px;align-items:flex-start;padding:8px;border:1px solid #cfd8e0;border-radius:6px;margin:6px 0}
.mbox .opt input{width:20px;height:20px;margin-top:2px;flex:none}
.mbox .warn{color:#a05a00;font-size:13px}
.mbox .err{color:#b00020;font-size:13px}
.mbox table{border-collapse:collapse;width:100%;font-size:12px}
.mbox td,.mbox th{border-bottom:1px solid #ddd;padding:3px 4px;text-align:left}
#toast{position:absolute;bottom:90px;left:50%;transform:translateX(-50%);background:#000d;color:#fff;padding:10px 16px;border-radius:20px;z-index:30;max-width:90vw}
#hud{position:absolute;left:8px;bottom:8px;z-index:4;font-size:11px;color:#9bb;background:#0007;padding:2px 6px;border-radius:4px;pointer-events:none}
@media (min-width:900px){#hud{left:auto;right:12px;bottom:auto;top:56px}}

.dupbox{background:#fff4d6;border:1px solid #e0b84a;color:#4a3500;border-radius:6px;padding:6px 8px;margin:6px 0;font-size:13px}
.dupbox small{display:block;margin-top:4px;color:#6b5a20}
#shDup{margin:6px 10px}
.btnlink{display:inline-block;padding:9px 12px;margin-right:8px;border:1px solid #b6c3d0;border-radius:8px;background:#e6ecf2;color:#111;text-decoration:none;font-size:14px}
.sf{display:flex;gap:8px;align-items:stretch}.sf button{flex:1;width:auto}

#upd{position:absolute;top:56px;left:8px;right:8px;z-index:6;background:#0a3d6e;border:1px solid #3d9bff;color:#fff;border-radius:8px;padding:8px 10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:14px}
#upd[hidden],#pickBar[hidden]{display:none}
#upd #updText{flex:1;min-width:200px}
#upd button{min-height:34px;padding:4px 10px}
#pickBar{position:absolute;top:56px;left:50%;transform:translateX(-50%);z-index:9;background:#00525e;border:1px solid #00e5ff;color:#fff;border-radius:8px;padding:8px 12px;display:flex;gap:10px;align-items:center}
.fu{background:#e6f4ea;border:1px solid #8cc58c;color:#14301a;border-radius:6px;padding:6px 8px;margin:0 0 6px;font-size:13px}
.mbox h4{margin:.9em 0 .3em}
@media (min-width:900px){#upd{left:auto;right:12px;width:520px;top:100px}}

/* sign-in + reports */
#login{position:fixed;inset:0;z-index:200;background:#14202b;display:flex;align-items:center;justify-content:center;padding:16px}
#login .lbox{background:#fff;color:#111;border-radius:12px;padding:20px;width:100%;max-width:360px}
#login label{display:block;margin:10px 0 2px}#login input{width:100%;box-sizing:border-box;padding:10px;font-size:18px}
#login .big{width:100%;padding:12px;font-size:17px;margin-top:10px}#login .or{text-align:center;color:#777;margin:8px 0}#lMsg{color:#b00020}
.chain{border:1px solid #ddd;border-radius:8px;padding:8px;margin:6px 0}.chain ul{margin:4px 0 6px 16px;padding:0}.err{color:#b00020}
/* field-first sheet */
#shTitle{font-weight:700}
#shBody .facts{background:#eef3f8;padding:4px 8px;border-radius:6px;margin-bottom:6px;font-size:15px}
#shBody .front>div{padding:2px 0;border-bottom:1px solid #eee}
#shBody details.more{margin-top:8px;font-size:12px;color:#555;background:#f6f6f6;border-radius:6px;padding:4px 8px}
#shBody details.more summary{cursor:pointer;font-weight:600;color:#335}
#shBody details.more>div{padding:2px 0}
.row .nm.office{opacity:.6;font-style:italic}
