:root {
  --bg:#f5f6fa;
  --panel:#ffffff;
  --border:#d6dae4;
  --text:#1e2430;
  --accent:#2859d4;
  --danger:#c62828;
}
* { box-sizing:border-box; }
html, body { height:100%; }
body { margin:0; font-family:Arial,Helvetica,sans-serif; color:var(--text); background:var(--bg); }
a { text-decoration:none; }
.hidden { display:none !important; }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:14px 18px; background:#fff; border-bottom:1px solid var(--border); position:sticky; top:0; z-index:30; }
.topbar h1 { margin:0; font-size:22px; }
.topbar-check { font-size:15px; display:flex; align-items:center; gap:6px; }
.topbar-actions-wrap { gap:10px; }
.sub { color:#5d6678; font-size:15px; margin-top:4px; }
.topbar-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
button, .btn-link { border:1px solid var(--border); background:#fff; color:var(--text); padding:10px 14px; border-radius:8px; cursor:pointer; font-size:16px; }
button:hover, .btn-link:hover { border-color:#9fb0da; }
.btn-link { display:inline-block; }
.danger { color:var(--danger); }
.map-page { padding:12px; }
.map-shell { background:#fff; border:1px solid var(--border); border-radius:12px; overflow:hidden; height:calc(100vh - 95px); }
.map-viewport { position:relative; width:100%; height:100%; overflow:hidden; background:#d6e7f2; cursor:grab; }
.map-stage { position:absolute; left:0; top:0; width:2690px; height:2500px; transform-origin:0 0; user-select:none; }
#mapImage { display:block; width:2690px; height:2500px; pointer-events:none; user-select:none; -webkit-user-drag:none; }
.overlay-svg { position:absolute; inset:0; width:2690px; height:2500px; pointer-events:none; overflow:visible; }
.demarcation-line { fill:none; stroke:#c42525; stroke-width:12; stroke-dasharray:28 16; stroke-linecap:round; stroke-linejoin:round; opacity:.95; filter:drop-shadow(0 0 4px rgba(255,255,255,.8)); }
.hotspots-layer { position:absolute; inset:0; }
.hotspot { position:absolute; border-radius:999px; border:2px solid rgba(255,255,255,.78); cursor:var(--hotspot-cursor, pointer); appearance:none; -webkit-appearance:none; background:var(--fill, #3a7bd5); opacity:var(--spot-opacity, .20); box-shadow:0 0 0 1px rgba(0,0,0,.12); }
.hotspot:hover, .hotspot.active { transform:scale(1.06); opacity:.42; z-index:2; }
.hotspot.hidden-by-filter { display:none; }
.hover-popup { position:absolute; z-index:40; min-width:400px; max-width:620px; background:#fff; border:1px solid var(--border); border-radius:16px; box-shadow:0 16px 34px rgba(0,0,0,.22); padding:16px; font-size:16px; }
.hover-popup h3 { margin:0 0 10px; font-size:22px; line-height:1.2; }
.hover-popup .popup-content { max-height:260px; overflow:auto; border:1px solid #edf0f5; padding:14px; border-radius:12px; background:#fafbfd; line-height:1.5; font-size:16px; }
.hover-popup .popup-actions { display:flex; gap:12px; margin-top:16px; flex-wrap:wrap; }
.login-page { display:grid; place-items:center; min-height:100vh; }
.login-card, .panel { background:#fff; border:1px solid var(--border); border-radius:12px; padding:20px; box-shadow:0 10px 24px rgba(0,0,0,.06); }
.login-card { width:min(420px, calc(100vw - 30px)); }
.login-form, .options-page form { display:grid; gap:10px; }
input[type="text"], input[type="password"], input[type="number"], input[type="file"], input[type="color"], input[type="range"], select, textarea { width:100%; padding:11px 13px; border:1px solid var(--border); border-radius:8px; font-size:16px; }
input[type="color"] { padding:6px; min-height:46px; }
.alert { padding:12px 14px; border-radius:8px; margin:10px 0; }
.alert.error { background:#fdeaea; color:#921c1c; }
.alert.success { background:#e8f5e9; color:#1e6a2b; }
.hint { color:#5d6678; font-size:14px; }
.options-page { max-width:980px; margin:20px auto; display:grid; gap:18px; padding:0 12px 24px; }
.stack-row { display:flex; gap:10px; flex-wrap:wrap; }
.modal { position:fixed; inset:0; z-index:100; }
.modal-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.42); }
.modal-dialog { position:absolute; left:60px; top:60px; background:#fff; border-radius:14px; border:1px solid var(--border); box-shadow:0 18px 40px rgba(0,0,0,.28); display:flex; flex-direction:column; min-width:760px; min-height:500px; max-width:calc(100vw - 24px); max-height:calc(100vh - 24px); overflow:hidden; touch-action:none; font-size:15px; }
.modal-header, .modal-footer { padding:14px 16px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; gap:12px; background:#fff; }
.modal-header{position:sticky;top:0;z-index:2;}
.modal-header.drag-handle { cursor:move; user-select:none; }
.modal-footer { border-bottom:0; border-top:1px solid var(--border); justify-content:flex-end; position:sticky; bottom:0; z-index:2; box-shadow:0 -4px 14px rgba(0,0,0,.05); }
.modal-title-wrap { flex:1; }
.dept-selects { display:flex; gap:10px; align-items:center; margin-top:10px; flex-wrap:wrap; }
.toolbar { display:flex; gap:10px; flex-wrap:wrap; padding:12px 16px; border-bottom:1px solid var(--border); background:#fbfcff; }
.editor-wrap { padding:16px; flex:1; min-height:340px; overflow:auto; }
.wysiwyg-editor, .html-editor { width:100%; height:100%; min-height:420px; border:1px solid var(--border); border-radius:10px; padding:16px; overflow:auto; background:#fff; font-size:15px; line-height:1.55; }
.wysiwyg-editor { outline:none; }
.html-editor { font-family:Consolas,monospace; resize:none; }
.icon-btn { font-size:20px; line-height:1; }
.resize-handle { position:absolute; right:0; bottom:0; width:26px; height:26px; cursor:nwse-resize; z-index:3; background:linear-gradient(135deg, transparent 0 35%, #94a3b8 35% 45%, transparent 45% 55%, #94a3b8 55% 65%, transparent 65% 100%); }
@media (max-width: 900px) {
  .map-shell { height:calc(100vh - 120px); }
  .hover-popup { min-width:320px; max-width:92vw; font-size:15px; }
  .modal-dialog { left:12px !important; top:12px !important; max-width:calc(100vw - 24px); max-height:calc(100vh - 24px); }
}

.modal-dialog button, .modal-dialog select, .modal-dialog textarea{font-size:15px;}
