* {margin:0; padding:0; box-sizing:border-box;}
html, body {height:100%; font-family:Arial,sans-serif;}
#container {display:flex; height:100%;}
#sidebar {width:30%; min-width:320px; background:#f5f5f5; padding:20px; overflow:auto;}
#map {flex:1;}
.form-group {margin-bottom:15px;}
label {display:block; margin-bottom:5px; color:#555;}
input, select, button {width:100%; padding:8px; margin-bottom:10px; border:1px solid #ccc; border-radius:4px;}
#archive-search {margin-bottom:10px;}
.buttons {display:flex; gap:5px;}
.buttons button {flex:1;}
button {cursor:pointer;}
#calculate-btn {background:#2c7be5; color:#fff; border:none;}
#calculate-btn:hover {background:#1a66cc;}
#archive-add-btn, #archive-show-btn {background:#6c757d; color:#fff; border:none;}
#archive-add-btn:hover, #archive-show-btn:hover {background:#5a6268;}
#results, #archive-section {margin-top:20px; padding:10px; background:#fff; border:1px solid #ddd; border-radius:4px; display:none;}
.total-cost {color:green; font-weight:bold;}
.archive-item {border-bottom:1px solid #eee; padding:5px 0;}
.archive-item div {display:flex; justify-content:space-between; align-items:center;}
.archive-item .note {color:red; margin-top:5px; display:block;}
.edit-btn, .delete-btn {margin-left:5px; padding:2px 6px; border:none; border-radius:3px; color:#fff; cursor:pointer;}
.edit-btn {background:#007bff;}
.delete-btn {background:#dc3545;}