X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/37911a5555bb26621b3d43b9ec89ef03b81ae1b5..ba87362e7fe237c00df01967e02d182c15039f5d:/vendor/assets/iD/iD.css.erb?ds=inline

diff --git a/vendor/assets/iD/iD.css.erb b/vendor/assets/iD/iD.css.erb
index 284cc036e..83db1687c 100644
--- a/vendor/assets/iD/iD.css.erb
+++ b/vendor/assets/iD/iD.css.erb
@@ -53,13 +53,17 @@
 
 .ideditor button,
 .ideditor input {
-    line-height: normal;
+    line-height: inherit;
+	letter-spacing: inherit;
 }
 
 /* Hide default number spinner controls */
 .ideditor input[type="number"]::-webkit-inner-spin-button,
 .ideditor input[type="number"]::-webkit-outer-spin-button {
-display: none;
+	display: none;
+}
+.ideditor input[type=number] {
+    -moz-appearance: textfield;
 }
 
 /*
@@ -104,8 +108,6 @@ display: none;
 
 .ideditor input[type="search"] {
     -webkit-appearance: none; /* 1 */
-    -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box; /* 2 */
     box-sizing: border-box;
 }
 
@@ -177,19 +179,18 @@ display: none;
 /* No interactivity except what we specifically allow */
 .ideditor .data-layer.osm *,
 .ideditor .data-layer.notes *,
-.ideditor .data-layer.keepRight *,
-.ideditor .data-layer.improveOSM * {
+.ideditor .data-layer.keepRight * {
     pointer-events: none;
 }
 
-.ideditor .lasso #map {
+.ideditor .lasso .main-map {
     pointer-events: visibleStroke;
 }
 
 
 /* `.target` objects are interactive */
 /* They can be picked up, clicked, hovered, or things can connect to them */
-.ideditor .qa_error.target,
+.ideditor .qaItem.target,
 .ideditor .note.target,
 .ideditor .node.target,
 .ideditor .turn .target {
@@ -209,6 +210,17 @@ display: none;
     stroke-linejoin: round;
 }
 
+.ideditor[pointer='pen'] .way.target {
+    stroke-width: 18;
+}
+.ideditor[pointer='touch'] .way.target {
+    stroke-width: 32;
+}
+.ideditor[pointer='touch'] .node.vertex.target {
+    pointer-events: painted;
+    stroke: currentColor;
+    stroke-width: 10;
+}
 
 /* `.target-nope` objects are explicitly forbidden to join to */
 .ideditor .surface:not(.nope-disabled) .node.target.target-nope,
@@ -227,7 +239,7 @@ display: none;
 /* points, notes & QA */
 
 /* points, notes, markers */
-.ideditor g.qa_error .stroke,
+.ideditor g.qaItem .stroke,
 .ideditor g.note .stroke {
     stroke: #222;
     stroke-width: 1;
@@ -235,7 +247,7 @@ display: none;
     opacity: 0.6;
 }
 
-.ideditor g.qa_error.active .stroke,
+.ideditor g.qaItem.active .stroke,
 .ideditor g.note.active .stroke {
     stroke: #222;
     stroke-width: 1;
@@ -250,7 +262,7 @@ display: none;
 }
 
 
-.ideditor g.qa_error .shadow,
+.ideditor g.qaItem .shadow,
 .ideditor g.point .shadow,
 .ideditor g.note .shadow {
     fill: none;
@@ -259,14 +271,14 @@ display: none;
     stroke-opacity: 0;
 }
 
-.ideditor g.qa_error.hover:not(.selected) .shadow,
+.ideditor g.qaItem.hover:not(.selected) .shadow,
 .ideditor g.note.hover:not(.selected) .shadow,
 .ideditor g.point.related:not(.selected) .shadow,
 .ideditor g.point.hover:not(.selected) .shadow {
     stroke-opacity: 0.5;
 }
 
-.ideditor g.qa_error.selected .shadow,
+.ideditor g.qaItem.selected .shadow,
 .ideditor g.note.selected .shadow,
 .ideditor g.point.selected .shadow {
     stroke-opacity: 0.7;
@@ -389,9 +401,7 @@ display: none;
     font-size: 12px;
     font-weight: bold;
     fill: #333;
-    -webkit-transition: opacity 100ms linear;
     transition: opacity 100ms linear;
-    -moz-transition: opacity 100ms linear;
 }
 
 /* Opera doesn't support dominant-baseline. See #715 */
@@ -429,12 +439,14 @@ display: none;
 
 
 /* Wikidata-tagged */
-.ideditor g.point.tag-wikidata path.stroke {
+.ideditor g.point.tag-wikidata path.stroke,
+.ideditor g.vertex.tag-wikidata circle.stroke {
     stroke-width: 2px;
     stroke: #666;
     fill: #eee;
 }
-.ideditor g.point.tag-wikidata .icon {
+.ideditor g.point.tag-wikidata .icon,
+.ideditor g.vertex.tag-wikidata .icon {
     color: #666;
 }
 
@@ -613,7 +625,11 @@ display: none;
 .ideditor path.stroke.tag-leisure-pitch,
 .ideditor path.stroke.tag-leisure-track,
 .ideditor path.stroke.tag-natural,
-.ideditor path.stroke.tag-natural-wood {
+.ideditor path.stroke.tag-natural-wood,
+.ideditor path.stroke.tag-golf-tee,
+.ideditor path.stroke.tag-golf-fairway,
+.ideditor path.stroke.tag-golf-rough,
+.ideditor path.stroke.tag-golf-green {
     stroke: rgb(140, 208, 95);
 }
 .ideditor path.fill.tag-barrier-hedge,
@@ -629,7 +645,11 @@ display: none;
 .ideditor path.fill.tag-leisure-pitch,
 .ideditor path.fill.tag-leisure-track,
 .ideditor path.fill.tag-natural,
-.ideditor path.fill.tag-natural-wood {
+.ideditor path.fill.tag-natural-wood,
+.ideditor path.fill.tag-golf-tee,
+.ideditor path.fill.tag-golf-fairway,
+.ideditor path.fill.tag-golf-rough,
+.ideditor path.fill.tag-golf-green {
     stroke: rgba(140, 208, 95, 0.3);
     fill: rgba(140, 208, 95, 0.3);
 }
@@ -647,12 +667,14 @@ display: none;
 .ideditor path.stroke.tag-amenity-fountain,
 .ideditor path.stroke.tag-leisure-swimming_pool,
 .ideditor path.stroke.tag-natural-bay,
+.ideditor path.stroke.tag-natural-strait,
 .ideditor path.stroke.tag-natural-water {
     stroke: rgb(119, 211, 222);
 }
 .ideditor path.fill.tag-amenity-fountain,
 .ideditor path.fill.tag-leisure-swimming_pool,
 .ideditor path.fill.tag-natural-bay,
+.ideditor path.fill.tag-natural-strait,
 .ideditor path.fill.tag-natural-water {
     stroke: rgba(119, 211, 222, 0.3);
     fill: rgba(119, 211, 222, 0.3);
@@ -827,14 +849,17 @@ display: none;
 
 
 /* Tan things */
-.ideditor path.stroke.tag-landuse-farmyard {
+.ideditor path.stroke.tag-landuse-farmyard,
+.ideditor path.stroke.tag-leisure-horse_riding {
     stroke: rgb(245, 220, 186);
 }
-.ideditor path.fill.tag-landuse-farmyard {
+.ideditor path.fill.tag-landuse-farmyard,
+.ideditor path.fill.tag-leisure-horse_riding {
     stroke: rgba(245, 220, 186, 0.3);
     fill: rgba(245, 220, 186, 0.3);
 }
-.ideditor .preset-icon-fill path.area.stroke.tag-landuse-farmyard {
+.ideditor .preset-icon-fill path.area.stroke.tag-landuse-farmyard
+.preset-icon-fill path.area.stroke.tag-leisure-horse_riding {
     stroke: rgb(226, 177, 111);
 }
 .ideditor .pattern-color-farmyard {
@@ -1145,12 +1170,19 @@ display: none;
 .ideditor path.line.stroke.tag-highway-road {
     stroke-width: 5;
 }
+.ideditor path.line.casing.tag-highway-service.tag-service-driveway {
+    stroke-width: 6.25;
+}
+.ideditor path.line.stroke.tag-highway-service.tag-service-driveway {
+    stroke-width: 4.25;
+}
 
 .ideditor path.line.shadow.tag-highway-path,
 .ideditor path.line.shadow.tag-highway-footway,
 .ideditor path.line.shadow.tag-highway-cycleway,
 .ideditor path.line.shadow.tag-highway-bridleway,
 .ideditor path.line.shadow.tag-highway-corridor,
+.ideditor path.line.shadow.tag-highway-ladder,
 .ideditor path.line.shadow.tag-highway-steps {
     stroke-width: 16;
 }
@@ -1159,6 +1191,7 @@ display: none;
 .ideditor path.line.casing.tag-highway-cycleway,
 .ideditor path.line.casing.tag-highway-bridleway,
 .ideditor path.line.casing.tag-highway-corridor,
+.ideditor path.line.casing.tag-highway-ladder,
 .ideditor path.line.casing.tag-highway-steps {
     stroke-width: 5;
 }
@@ -1167,6 +1200,7 @@ display: none;
 .ideditor path.line.stroke.tag-highway-cycleway,
 .ideditor path.line.stroke.tag-highway-bridleway,
 .ideditor path.line.stroke.tag-highway-corridor,
+.ideditor path.line.stroke.tag-highway-ladder,
 .ideditor path.line.stroke.tag-highway-steps {
     stroke-width: 3;
 }
@@ -1192,12 +1226,19 @@ display: none;
 .ideditor .low-zoom path.line.stroke.tag-highway-road {
     stroke-width: 3;
 }
+.ideditor .low-zoom  path.line.casing.tag-highway-service.tag-service-driveway {
+    stroke-width: 4.25;
+}
+.ideditor .low-zoom  path.line.stroke.tag-highway-service.tag-service-driveway {
+    stroke-width: 2.25;
+}
 
 .ideditor .low-zoom path.line.shadow.tag-highway-path,
 .ideditor .low-zoom path.line.shadow.tag-highway-footway,
 .ideditor .low-zoom path.line.shadow.tag-highway-cycleway,
 .ideditor .low-zoom path.line.shadow.tag-highway-bridleway,
 .ideditor .low-zoom path.line.shadow.tag-highway-corridor,
+.ideditor .low-zoom path.line.shadow.tag-highway-ladder,
 .ideditor .low-zoom path.line.shadow.tag-highway-steps {
     stroke-width: 12;
 }
@@ -1206,6 +1247,7 @@ display: none;
 .ideditor .low-zoom path.line.casing.tag-highway-cycleway,
 .ideditor .low-zoom path.line.casing.tag-highway-bridleway,
 .ideditor .low-zoom path.line.casing.tag-highway-corridor,
+.ideditor .low-zoom path.line.casing.tag-highway-ladder,
 .ideditor .low-zoom path.line.casing.tag-highway-steps {
     stroke-width: 3;
 }
@@ -1214,6 +1256,7 @@ display: none;
 .ideditor .low-zoom path.line.stroke.tag-highway-cycleway,
 .ideditor .low-zoom path.line.stroke.tag-highway-bridleway,
 .ideditor .low-zoom path.line.stroke.tag-highway-corridor,
+.ideditor .low-zoom path.line.stroke.tag-highway-ladder,
 .ideditor .low-zoom path.line.stroke.tag-highway-steps {
     stroke-width: 1;
 }
@@ -1294,10 +1337,6 @@ display: none;
 }
 
 /* service roads */
-.ideditor .preset-icon .icon.tag-highway-service {
-    color: #fff;
-    fill: #666;
-}
 .ideditor path.line.stroke.tag-highway-service,
 .ideditor path.line.stroke.tag-service {
     stroke: #fff;
@@ -1320,6 +1359,16 @@ display: none;
     stroke: #666;
 }
 
+.ideditor path.line.stroke.tag-highway-service.tag-service-parking_aisle {
+    stroke: #cccac7;
+}
+.ideditor path.line.stroke.tag-highway-service.tag-service-driveway {
+    stroke: #fff6e4;
+}
+.ideditor path.line.stroke.tag-highway-service.tag-service-emergency_access {
+    stroke: #ddb2aa;
+}
+
 /* unmaintained track roads */
 .ideditor path.line.stroke.tag-highway-track,
 .ideditor path.line.stroke.tag-track {
@@ -1352,6 +1401,7 @@ display: none;
 .ideditor path.line.stroke.tag-public_transport-platform,
 .ideditor path.line.stroke.tag-highway-platform,
 .ideditor path.line.stroke.tag-railway-platform,
+.ideditor path.line.stroke.tag-railway-platform_edge,
 .ideditor path.line.stroke.tag-man_made-pier {
     stroke: #dca;
 }
@@ -1450,27 +1500,34 @@ display: none;
 }
 
 /* steps */
-.ideditor .preset-icon .icon.tag-highway-steps {
+.ideditor .preset-icon .icon.tag-highway-steps,
+.ideditor .preset-icon .icon.tag-highway-ladder {
     color: #81d25c;
     fill: #fff;
 }
-.ideditor path.line.stroke.tag-highway-steps {
+.ideditor path.line.stroke.tag-highway-steps,
+.ideditor path.line.stroke.tag-highway-ladder {
     stroke-linecap: butt;
     stroke-dasharray: 3, 3;
 }
-.ideditor .low-zoom path.line.stroke.tag-highway-steps {
+.ideditor .low-zoom path.line.stroke.tag-highway-steps,
+.ideditor .low-zoom path.line.stroke.tag-highway-ladder {
     stroke-dasharray: 2, 2;
 }
-.ideditor path.line.casing.tag-highway-steps {
+.ideditor path.line.casing.tag-highway-steps,
+.ideditor path.line.casing.tag-highway-ladder {
     stroke: #fff;
     stroke-linecap: round;
     stroke-dasharray: none;
 }
 .ideditor path.line.stroke.tag-highway-steps,
-.ideditor .preset-icon-container path.line.casing.tag-highway-steps {
+.ideditor path.line.stroke.tag-highway-ladder,
+.ideditor .preset-icon-container path.line.casing.tag-highway-steps,
+.ideditor .preset-icon-container path.line.casing.tag-highway-ladder {
     stroke: #81d25c;
 }
-.ideditor .preset-icon-container path.line.stroke.tag-highway-steps {
+.ideditor .preset-icon-container path.line.stroke.tag-highway-steps,
+.ideditor .preset-icon-container path.line.stroke.tag-highway-ladder {
     stroke: #fff;
 }
 
@@ -1509,14 +1566,12 @@ display: none;
 
 .ideditor path.line.stroke.tag-highway.tag-footway-access_aisle {
     stroke-dasharray: 4, 2;
+    stroke: #4c4444;
 }
 .ideditor .low-zoom path.line.stroke.tag-highway.tag-footway-access_aisle,
 .ideditor .preset-icon-container path.stroke.tag-highway.tag-footway-access_aisle {
     stroke-dasharray: 2.5, 1.5;
 }
-.ideditor path.line.stroke.tag-highway.tag-footway-access_aisle {
-    stroke: #4c4444;
-}
 .ideditor .preset-icon .icon.tag-highway.tag-footway-access_aisle {
     color: #4c4444;
 }
@@ -1525,6 +1580,7 @@ display: none;
 /* highway midpoints */
 .ideditor g.midpoint.tag-highway-corridor .fill,
 .ideditor g.midpoint.tag-highway-steps .fill,
+.ideditor g.midpoint.tag-highway-ladder .fill,
 .ideditor g.midpoint.tag-highway-path .fill,
 .ideditor g.midpoint.tag-highway-footway .fill,
 .ideditor g.midpoint.tag-highway-cycleway .fill,
@@ -1556,10 +1612,12 @@ display: none;
 }
 .ideditor path.line.casing.tag-aeroway-taxiway,
 .ideditor path.line.casing.tag-taxiway {
+    stroke: #666;
     stroke-width: 7;
 }
 .ideditor path.line.stroke.tag-aeroway-taxiway,
 .ideditor path.line.stroke.tag-taxiway {
+    stroke: #ff0;
     stroke-width: 5;
 }
 .ideditor .low-zoom path.line.shadow.tag-aeroway-taxiway,
@@ -1575,15 +1633,6 @@ display: none;
     stroke-width: 3;
 }
 
-.ideditor path.line.stroke.tag-aeroway-taxiway,
-.ideditor path.line.stroke.tag-taxiway {
-    stroke: #ff0;
-}
-.ideditor path.line.casing.tag-aeroway-taxiway,
-.ideditor path.line.casing.tag-taxiway {
-    stroke: #666;
-}
-
 /* wide aeroways (runway) */
 .ideditor .preset-icon .icon.tag-aeroway-runway,
 .ideditor .preset-icon .icon.tag-runway {
@@ -1639,7 +1688,7 @@ display: none;
 .ideditor path.line.stroke.tag-railway {
     stroke-width: 2;
     stroke-linecap: butt;
-    stroke-dasharray: 12,12;
+    stroke-dasharray: 12, 12;
 }
 .ideditor .low-zoom path.line.shadow.tag-railway {
     stroke-width: 12;
@@ -1649,16 +1698,18 @@ display: none;
 }
 .ideditor .low-zoom path.line.stroke.tag-railway {
     stroke-width: 2;
-    stroke-dasharray: 6,6;
+    stroke-dasharray: 6, 6;
 }
 .ideditor .preset-icon-container path.line.stroke.tag-railway:not(.tag-status),
 .ideditor .preset-icon-container path.line.stroke.tag-railway.tag-status-disused {
     stroke-dasharray: 6;
 }
 
+.ideditor path.line.casing.tag-railway.tag-railway-platform_edge,
 .ideditor path.line.casing.tag-railway.tag-railway-platform {
     stroke-width: 0;
 }
+.ideditor path.line.stroke.tag-railway.tag-railway-platform_edge,
 .ideditor path.line.stroke.tag-railway.tag-railway-platform {
     stroke-dasharray: none;
 }
@@ -1671,7 +1722,6 @@ display: none;
     stroke: #eee;
 }
 
-
 .ideditor .preset-icon .icon.tag-railway.tag-status {
     color: #999;
 }
@@ -1688,7 +1738,6 @@ display: none;
     stroke: #808080;
 }
 
-
 .ideditor path.line.casing.tag-railway-subway {
     stroke: #222;
 }
@@ -1764,26 +1813,39 @@ display: none;
 
 
 /* wide waterways (river) */
-.ideditor path.line.shadow.tag-waterway-river {
+.ideditor path.line.shadow.tag-waterway-river,
+.ideditor path.line.shadow.tag-waterway-flowline {
     stroke-width: 20;
 }
-.ideditor path.line.casing.tag-waterway-river {
+.ideditor path.line.casing.tag-waterway-river,
+.ideditor path.line.casing.tag-waterway-flowline {
     stroke-width: 10;
 }
-.ideditor path.line.stroke.tag-waterway-river {
+.ideditor path.line.stroke.tag-waterway-river,
+.ideditor path.line.stroke.tag-waterway-flowline {
     stroke-width: 8;
 }
 
-.ideditor .low-zoom path.line.shadow.tag-waterway-river {
+.ideditor .low-zoom path.line.shadow.tag-waterway-river,
+.ideditor .low-zoom path.line.shadow.tag-waterway-flowline {
     stroke-width: 16;
 }
-.ideditor .low-zoom path.line.casing.tag-waterway-river {
+.ideditor .low-zoom path.line.casing.tag-waterway-river,
+.ideditor .low-zoom path.line.casing.tag-waterway-flowline {
     stroke-width: 7;
 }
-.ideditor .low-zoom path.line.stroke.tag-waterway-river {
+.ideditor .low-zoom path.line.stroke.tag-waterway-river,
+.ideditor .low-zoom path.line.stroke.tag-waterway-flowline {
     stroke-width: 5;
 }
 
+.ideditor path.line.stroke.tag-waterway-flowline {
+    stroke-opacity: 0.5;
+}
+.ideditor path.line.casing.tag-waterway-flowline {
+    display: none;
+}
+
 
 /* ditch */
 .ideditor .preset-icon .icon.tag-waterway-ditch {
@@ -1793,13 +1855,15 @@ display: none;
     stroke: #39a;
 }
 
-/* narrow width miscellanous things */
+/* narrow width miscellaneous things */
 .ideditor path.line.shadow.tag-aerialway,
 .ideditor path.line.shadow.tag-attraction-summer_toboggan,
 .ideditor path.line.shadow.tag-attraction-water_slide,
 .ideditor path.line.shadow.tag-golf-cartpath,
 .ideditor path.line.shadow.tag-man_made-pipeline,
 .ideditor path.line.shadow.tag-natural-tree_row,
+.ideditor path.line.shadow.tag-roller_coaster-track,
+.ideditor path.line.shadow.tag-roller_coaster-support,
 .ideditor path.line.shadow.tag-piste {
     stroke-width: 16;
 }
@@ -1809,6 +1873,8 @@ display: none;
 .ideditor path.line.casing.tag-golf-cartpath,
 .ideditor path.line.casing.tag-man_made-pipeline,
 .ideditor path.line.casing.tag-natural-tree_row,
+.ideditor path.line.casing.tag-roller_coaster-track,
+.ideditor path.line.casing.tag-roller_coaster-support,
 .ideditor path.line.casing.tag-piste {
     stroke-width: 7;
 }
@@ -1818,6 +1884,8 @@ display: none;
 .ideditor path.line.stroke.tag-golf-cartpath,
 .ideditor path.line.stroke.tag-man_made-pipeline,
 .ideditor path.line.stroke.tag-natural-tree_row,
+.ideditor path.line.stroke.tag-roller_coaster-track,
+.ideditor path.line.stroke.tag-roller_coaster-support,
 .ideditor path.line.stroke.tag-piste {
     stroke-width: 5;
 }
@@ -1828,6 +1896,8 @@ display: none;
 .ideditor .low-zoom path.line.shadow.tag-golf-cartpath,
 .ideditor .low-zoom path.line.shadow.tag-man_made-pipeline,
 .ideditor .low-zoom path.line.shadow.tag-natural-tree_row,
+.ideditor .low-zoom path.line.shadow.tag-roller_coaster-track,
+.ideditor .low-zoom path.line.shadow.tag-roller_coaster-support,
 .ideditor .low-zoom path.line.shadow.tag-piste {
     stroke-width: 12;
 }
@@ -1837,6 +1907,8 @@ display: none;
 .ideditor .low-zoom path.line.casing.tag-golf-cartpath,
 .ideditor .low-zoom path.line.casing.tag-man_made-pipeline,
 .ideditor .low-zoom path.line.casing.tag-natural-tree_row,
+.ideditor .low-zoom path.line.casing.tag-roller_coaster-track,
+.ideditor .low-zoom path.line.casing.tag-roller_coaster-support,
 .ideditor .low-zoom path.line.casing.tag-piste {
     stroke-width: 5;
 }
@@ -1846,6 +1918,8 @@ display: none;
 .ideditor .low-zoom path.line.stroke.tag-golf-cartpath,
 .ideditor .low-zoom path.line.stroke.tag-man_made-pipeline,
 .ideditor .low-zoom path.line.stroke.tag-natural-tree_row,
+.ideditor .low-zoom path.line.stroke.tag-roller_coaster-track,
+.ideditor .low-zoom path.line.stroke.tag-roller_coaster-support,
 .ideditor .low-zoom path.line.stroke.tag-piste {
     stroke-width: 3;
 }
@@ -1860,6 +1934,7 @@ display: none;
     stroke-width: 16;
 }
 .ideditor path.line.stroke.tag-route-ferry {
+    stroke: #58a9ed;
     stroke-width: 3;
     stroke-linecap: butt;
     stroke-dasharray: 12,8;
@@ -1872,9 +1947,6 @@ display: none;
     stroke-width: 2;
     stroke-dasharray: 6,4;
 }
-.ideditor path.line.stroke.tag-route-ferry {
-    stroke: #58a9ed;
-}
 .ideditor path.line.casing.tag-route-ferry {
     stroke: none;
 }
@@ -1913,6 +1985,23 @@ display: none;
     stroke: #3d6c71;
 }
 
+.ideditor path.line.stroke.tag-roller_coaster-track {
+    stroke: #dddddd;
+    stroke-width: 3;
+    stroke-dasharray: 5, 1;
+    stroke-linecap: butt;
+}
+.ideditor path.line.casing.tag-roller_coaster-track {
+    stroke: #707070;
+}
+
+.ideditor path.line.stroke.tag-roller_coaster-support {
+    stroke: #707070;
+}
+.ideditor path.line.casing.tag-roller_coaster-support {
+    visibility: hidden;
+}
+
 
 /* golf cartpaths (like service roads) */
 .ideditor .preset-icon .icon.tag-golf-cartpath {
@@ -2032,15 +2121,13 @@ display: none;
 .ideditor path.line.casing.tag-bridge {
     stroke-opacity: 0.6;
     stroke: #000 !important;
+    stroke-width: 16;
     stroke-linecap: butt;
     stroke-dasharray: none;
 }
 .ideditor path.line.shadow.tag-bridge {
     stroke-width: 24;
 }
-.ideditor path.line.casing.tag-bridge {
-    stroke-width: 16;
-}
 .ideditor .low-zoom path.line.shadow.tag-bridge {
     stroke-width: 16;
 }
@@ -2056,6 +2143,7 @@ display: none;
 .ideditor path.line.shadow.tag-highway-service.tag-bridge,
 .ideditor path.line.shadow.tag-highway-track.tag-bridge,
 .ideditor path.line.shadow.tag-highway-steps.tag-bridge,
+.ideditor path.line.shadow.tag-highway-ladder.tag-bridge,
 .ideditor path.line.shadow.tag-highway-footway.tag-bridge,
 .ideditor path.line.shadow.tag-highway-cycleway.tag-bridge,
 .ideditor path.line.shadow.tag-highway-bridleway.tag-bridge {
@@ -2069,6 +2157,7 @@ display: none;
 .ideditor path.line.casing.tag-highway-service.tag-bridge,
 .ideditor path.line.casing.tag-highway-track.tag-bridge,
 .ideditor path.line.casing.tag-highway-steps.tag-bridge,
+.ideditor path.line.casing.tag-highway-ladder.tag-bridge,
 .ideditor path.line.casing.tag-highway-footway.tag-bridge,
 .ideditor path.line.casing.tag-highway-cycleway.tag-bridge,
 .ideditor path.line.casing.tag-highway-bridleway.tag-bridge {
@@ -2083,6 +2172,7 @@ display: none;
 .ideditor .low-zoom path.line.shadow.tag-highway-service.tag-bridge,
 .ideditor .low-zoom path.line.shadow.tag-highway-track.tag-bridge,
 .ideditor .low-zoom path.line.shadow.tag-highway-steps.tag-bridge,
+.ideditor .low-zoom path.line.shadow.tag-highway-ladder.tag-bridge,
 .ideditor .low-zoom path.line.shadow.tag-highway-footway.tag-bridge,
 .ideditor .low-zoom path.line.shadow.tag-highway-cycleway.tag-bridge,
 .ideditor .low-zoom path.line.shadow.tag-highway-bridleway.tag-bridge {
@@ -2096,6 +2186,7 @@ display: none;
 .ideditor .low-zoom path.line.casing.tag-highway-service.tag-bridge,
 .ideditor .low-zoom path.line.casing.tag-highway-track.tag-bridge,
 .ideditor .low-zoom path.line.casing.tag-highway-steps.tag-bridge,
+.ideditor .low-zoom path.line.casing.tag-highway-ladder.tag-bridge,
 .ideditor .low-zoom path.line.casing.tag-highway-footway.tag-bridge,
 .ideditor .low-zoom path.line.casing.tag-highway-cycleway.tag-bridge,
 .ideditor .low-zoom path.line.casing.tag-highway-bridleway.tag-bridge {
@@ -2111,7 +2202,7 @@ display: none;
 }
 .ideditor path.line.casing.tag-tunnel,
 .ideditor path.line.casing.tag-location-underground,
-.ideditor path.line.stroke.tag-location-underwater {
+.ideditor path.line.casing.tag-location-underwater {
     stroke-opacity: 0.5;
     stroke-linecap: butt;
     stroke-dasharray: none;
@@ -2219,6 +2310,72 @@ display: none;
     stroke-dasharray: 8, 8;
 }
 
+/** Closed Paths */
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-path,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-footway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-cycleway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-bridleway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-corridor,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-steps,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-construction.tag-construction-ladder {
+    stroke-width: 15;
+}
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-path,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-footway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-cycleway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-bridleway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-corridor,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-steps,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-construction.tag-construction-ladder {
+    stroke-width: 5;
+    stroke-linecap: butt;
+    stroke-dasharray: none
+}
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-path,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-footway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-cycleway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-bridleway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-corridor,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-steps,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-construction.tag-construction-ladder {
+    stroke-width: 4;
+    stroke-linecap: butt;
+    stroke-dasharray: 10, 10;
+}
+
+/** Proposed Paths */
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-path,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-footway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-cycleway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-bridleway,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-steps,
+.ideditor path.line.shadow.tag-highway.tag-status.tag-status-proposed.tag-proposed-ladder {
+    stroke-width: 15;
+}
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-path,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-footway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-cycleway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-bridleway,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-steps,
+.ideditor path.line.casing.tag-highway.tag-status.tag-status-proposed.tag-proposed-ladder {
+    stroke-width: 4.5;
+}
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-path,
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-footway,
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-cycleway,
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-bridleway,
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-steps,
+.ideditor path.line.casing.tag-highway.tag-bridge.tag-status.tag-status-proposed.tag-proposed-ladder {
+    stroke-width: 10;
+}
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-path,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-footway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-cycleway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-bridleway,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-steps,
+.ideditor path.line.stroke.tag-highway.tag-status.tag-status-proposed.tag-proposed-ladder {
+    stroke-width: 3;
+}
 
 /* Buildings */
 .ideditor path.stroke.tag-building {
@@ -2236,37 +2393,52 @@ display: none;
 }
 
 .ideditor .map-in-map,
-.ideditor #map {
+.ideditor .main-map {
     cursor: auto; /* Opera */
     cursor: url(<%= asset_path("iD/img/cursor-grab.png") %>) 9 9, auto; /* FF */
 }
 
 .ideditor.mode-browse .point,
-.ideditor.mode-select .point {
+.ideditor.mode-select .point,
+.ideditor.mode-select-data .point,
+.ideditor.mode-select-error .point,
+.ideditor.mode-select-note .point {
     cursor: pointer; /* Opera */
     cursor: url(<%= asset_path("iD/img/cursor-select-point.png") %>), pointer; /* FF */
 }
 
+.ideditor.mode-browse .vertex,
 .ideditor.mode-select .vertex,
-.ideditor.mode-browse .vertex {
+.ideditor.mode-select-data .vertex,
+.ideditor.mode-select-error .vertex,
+.ideditor.mode-select-note .vertex {
     cursor: pointer; /* Opera */
     cursor: url(<%= asset_path("iD/img/cursor-select-vertex.png") %>), pointer; /* FF */
 }
 
 .ideditor.mode-browse .line,
-.ideditor.mode-select .line {
+.ideditor.mode-select .line,
+.ideditor.mode-select-data .line,
+.ideditor.mode-select-error .line,
+.ideditor.mode-select-note .line {
     cursor: pointer; /* Opera */
     cursor: url(<%= asset_path("iD/img/cursor-select-line.png") %>), pointer; /* FF */
 }
 
+.ideditor.mode-browse .area,
 .ideditor.mode-select .area,
-.ideditor.mode-browse .area {
+.ideditor.mode-select-data .area,
+.ideditor.mode-select-error .area,
+.ideditor.mode-select-note .area {
     cursor: pointer; /* Opera */
     cursor: url(<%= asset_path("iD/img/cursor-select-area.png") %>), pointer; /* FF */
 }
 
+.ideditor.mode-browse .midpoint,
 .ideditor.mode-select .midpoint,
-.ideditor.mode-browse .midpoint {
+.ideditor.mode-select-data .midpoint,
+.ideditor.mode-select-error .midpoint,
+.ideditor.mode-select-note .midpoint {
     cursor: pointer; /* Opera */
     cursor: url(<%= asset_path("iD/img/cursor-select-split.png") %>), pointer; /* FF */
 }
@@ -2284,13 +2456,13 @@ display: none;
     cursor: url(<%= asset_path("iD/img/cursor-select-remove.png") %>), pointer; /* FF */
 }
 
-.ideditor.mode-add-preset #map,
-.ideditor.mode-draw-line #map,
-.ideditor.mode-draw-area #map,
-.ideditor.mode-add-line  #map,
-.ideditor.mode-add-area  #map,
-.ideditor.mode-drag-node #map,
-.ideditor.mode-drag-note #map {
+.ideditor.mode-add-preset .main-map,
+.ideditor.mode-draw-line .main-map,
+.ideditor.mode-draw-area .main-map,
+.ideditor.mode-add-line  .main-map,
+.ideditor.mode-add-area  .main-map,
+.ideditor.mode-drag-node .main-map,
+.ideditor.mode-drag-note .main-map {
     cursor: crosshair; /* Opera */
     cursor: url(<%= asset_path("iD/img/cursor-draw.png") %>) 9 9, crosshair; /* FF */
 }
@@ -2313,13 +2485,13 @@ display: none;
     cursor: url(<%= asset_path("iD/img/cursor-draw-connect-vertex.png") %>) 9 9, crosshair; /* FF */
 }
 
-.ideditor.mode-add-point #map,
-.ideditor.mode-add-note #map,
-.ideditor.mode-browse.lasso #map,
+.ideditor.mode-add-point .main-map,
+.ideditor.mode-add-note .main-map,
+.ideditor.mode-browse.lasso .main-map,
 .ideditor.mode-browse.lasso .way,
 .ideditor.mode-browse.lasso .vertex,
 .ideditor.mode-browse.lasso .midpoint,
-.ideditor.mode-select.lasso #map,
+.ideditor.mode-select.lasso .main-map,
 .ideditor.mode-select.lasso .way,
 .ideditor.mode-select.lasso .vertex,
 .ideditor.mode-select.lasso .midpoint {
@@ -2328,15 +2500,42 @@ display: none;
 }
 
 .ideditor.mode-browse .note,
-.ideditor.mode-browse .qa_error,
 .ideditor.mode-select .note,
-.ideditor.mode-select .qa_error,
+.ideditor.mode-select-data .note,
+.ideditor.mode-select-error .note,
+.ideditor.mode-select-note .note {
+    cursor: pointer;
+}
+
+.ideditor.mode-browse .qaItem,
+.ideditor.mode-select .qaItem,
+.ideditor.mode-select-data .qaItem,
+.ideditor.mode-select-error .qaItem,
+.ideditor.mode-select-note .qaItem {
+    cursor: pointer;
+}
+
+/* turn restriction editor */
 .ideditor .turn rect,
 .ideditor .turn circle {
     cursor: pointer;
 }
+/* legend */
+.ideditor li.list-item-photos.active:after {
+    display: block;
+    content: "";
+    height: 100%;
+    position: absolute;
+    right: 0;
+    width: 8px;
+}
+.ideditor[dir='rtl'] li.list-item-photos.active:after {
+    right: auto;
+    left: 0;
+}
+
 /* photo viewer div */
-.ideditor #photoviewer {
+.ideditor .photoviewer {
     position: relative;
     flex-shrink: 0;
     margin-bottom: 10px;
@@ -2345,23 +2544,23 @@ display: none;
     padding: 5px;
     background-color: #fff;
 }
-.ideditor[dir='ltr'] #photoviewer {
+.ideditor[dir='ltr'] .photoviewer {
     margin-left: 10px;
     margin-right: 2px;
 }
-.ideditor[dir='rtl'] #photoviewer {
+.ideditor[dir='rtl'] .photoviewer {
     margin-right: 10px;
     margin-left: 2px;
 }
 
 @media screen and (min-width: 1600px) {
-    .ideditor #photoviewer {
+    .ideditor .photoviewer {
         width: 490px;
         height: 370px;
     }
 }
 
-.ideditor #photoviewer button.thumb-hide {
+.ideditor .photoviewer button.thumb-hide {
     border-radius: 0;
     padding: 5px;
     position: absolute;
@@ -2370,7 +2569,16 @@ display: none;
     z-index: 50;
 }
 
-.ideditor #photoviewer button.resize-handle-xy {
+.ideditor .photoviewer button.set-photo-from-viewer {
+    border-radius: 0;
+    padding: 5px;
+    position: absolute;
+    left: 5px;
+    top: 5px;
+    z-index: 50;
+}
+
+.ideditor .photoviewer button.resize-handle-xy {
     border-radius: 0;
     position: absolute;
     top: 0;
@@ -2381,7 +2589,7 @@ display: none;
     width: 25px;
 }
 
-.ideditor #photoviewer button.resize-handle-x {
+.ideditor .photoviewer button.resize-handle-x {
     border-radius: 0;
     position: absolute;
     top: 0;
@@ -2393,7 +2601,7 @@ display: none;
     width: 6px;
 }
 
-.ideditor #photoviewer button.resize-handle-y {
+.ideditor .photoviewer button.resize-handle-y {
     border-radius: 0;
     position: absolute;
     top: 0;
@@ -2405,12 +2613,10 @@ display: none;
 }
 
 
-.ideditor .photo-wrapper,
-.ideditor .photo-wrapper img {
+.ideditor .photo-wrapper {
     width: 100%;
     height: 100%;
     overflow: hidden;
-    object-fit: cover;
 }
 
 .ideditor .photo-wrapper .photo-attribution {
@@ -2420,16 +2626,21 @@ display: none;
     width: 100%;
     font-size: 10px;
     text-align: right;
-    line-height: 1.1em;
-    padding: 4px 2px;
+    line-height: 150%;
+    padding: 4px 8px;
     z-index: 10;
 }
+.ideditor .photo-attribution-dual {
+    display: flex;
+    justify-content: space-between;
+}
 
 .ideditor .photo-attribution a,
 .ideditor .photo-attribution a:visited,
 .ideditor .photo-attribution span {
     padding: 4px 2px;
     color: #fff;
+    text-wrap: nowrap;
 }
 
 /* markers and sequences */
@@ -2437,7 +2648,10 @@ display: none;
     pointer-events: none;
 }
 .ideditor.mode-browse .viewfield-group,
-.ideditor.mode-select .viewfield-group {
+.ideditor.mode-select .viewfield-group,
+.ideditor.mode-select-data .viewfield-group,
+.ideditor.mode-select-error .viewfield-group,
+.ideditor.mode-select-note .viewfield-group {
     pointer-events: visible;
     cursor: pointer;
 }
@@ -2498,7 +2712,7 @@ display: none;
 .ideditor .sequence {
     fill: none;
     stroke-width: 2;
-    stroke-opacity: 0.4;
+    stroke-opacity: 0.6;
 }
 .ideditor .sequence.highlighted,
 .ideditor .sequence.currentView {
@@ -2508,6 +2722,9 @@ display: none;
 
 
 /* Streetside Image Layer */
+.ideditor li.list-item-photos.list-item-streetside.active:after {
+    background-color: #0fffc4;
+}
 .ideditor .layer-streetside-images {
     pointer-events: none;
 }
@@ -2519,8 +2736,26 @@ display: none;
     stroke-opacity: 0.85;  /* bump opacity - only one per road */
 }
 
+/* Vegbilder Image Layer */
+.ideditor li.list-item-photos.list-item-vegbilder.active:after {
+    background-color: #ed1c2e;
+}
+.ideditor .layer-vegbilder {
+    pointer-events: none;
+}
+.ideditor .layer-vegbilder .viewfield-group * {
+    fill: #ed1c2e;
+}
+.ideditor .layer-vegbilder .sequence {
+    stroke: #ed1c2e;
+    stroke-opacity: 0.85;  /* bump opacity - only one per road */
+}
+
 
 /* Mapillary Image Layer */
+.ideditor li.list-item-photos.list-item-mapillary.active:after {
+    background-color: #55ff22;
+}
 .ideditor .layer-mapillary {
     pointer-events: none;
 }
@@ -2545,31 +2780,151 @@ display: none;
 .ideditor .layer-mapillary-detections .icon-detected rect {
     fill: none;
 }
-.ideditor .layer-mapillary-detections .icon-detected:hover rect {
+.ideditor .layer-mapillary-detections .icon-detected:active {
+    opacity: 1;
+}
+.ideditor .layer-mapillary-detections .icon-detected:active rect {
     outline: 3px solid rgba(255, 238, 0, 0.6);
 }
-.ideditor .layer-mapillary-detections .icon-detected.currentView rect {
-    outline: 3px solid rgba(255, 238, 0, 1);
+@media (hover: hover) {
+    .ideditor .layer-mapillary-detections .icon-detected:hover {
+        opacity: 1;
+    }
+    .ideditor .layer-mapillary-detections .icon-detected:hover rect {
+        outline: 3px solid rgba(255, 238, 0, 0.6);
+    }
 }
-.ideditor .layer-mapillary-detections .icon-detected:hover,
 .ideditor .layer-mapillary-detections .icon-detected.currentView {
     opacity: 1;
 }
+.ideditor .layer-mapillary-detections .icon-detected.currentView rect {
+    outline: 3px solid rgba(255, 238, 0, 1);
+}
 
 
-/* OpenStreetCam Image Layer */
-.ideditor .layer-openstreetcam {
+/* KartaView Image Layer */
+.ideditor li.list-item-photos.list-item-kartaview.active:after {
+    background-color: #20c4ff;
+}
+.ideditor .layer-kartaview {
     pointer-events: none;
 }
-.ideditor .layer-openstreetcam .viewfield-group * {
+.ideditor .layer-kartaview .viewfield-group * {
     fill: #20c4ff;
 }
-.ideditor .layer-openstreetcam .sequence {
+.ideditor .layer-kartaview .sequence {
     stroke: #20c4ff;
 }
 
 
+/* Mapilio Image Layer */
+.ideditor li.list-item-photos.list-item-mapilio.active:after {
+    background-color: #0056f1;
+}
+.ideditor .layer-mapilio {
+    pointer-events: none;
+}
+.ideditor .layer-mapilio .viewfield-group * {
+    fill: #0056f1;
+    stroke: #ffffff;
+    stroke-opacity: .6;
+    fill-opacity: .6;
+}
+.ideditor .layer-mapilio .sequence {
+    stroke: #0056f1;
+}
+.ideditor .photo-controls-mapilio {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+}
+.ideditor .photo-controls-mapilio button {
+    padding:0 6px;
+    pointer-events: initial;
+}
+.ideditor .mapilio-wrapper {
+    position: relative;
+    background-color: #000;
+    background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
+    background-position: center;
+    background-repeat: no-repeat;
+}
+.ideditor #ideditor-viewer-mapilio-simple-wrap {
+    height: 100%;
+}
+.ideditor #ideditor-viewer-mapilio-simple {
+    width: 100%;
+    height: 100%;
+    transform-origin: 0 0;
+}
+.ideditor #ideditor-viewer-mapilio-simple img {
+    width: 100%;
+    height: 100%;
+    -o-object-fit: cover;
+       object-fit: cover;
+    overflow: hidden;
+}
+
+/* panoramax Image Layer */
+.ideditor li.list-item-photos.list-item-panoramax.active:after {
+    background-color: #ff6f00;
+}
+.ideditor .layer-panoramax {
+    pointer-events: none;
+}
+.ideditor .layer-panoramax .viewfield-group * {
+    fill: #ff6f00;
+    stroke: #ffffff;
+    stroke-opacity: .6;
+    fill-opacity: .6;
+}
+.ideditor .layer-panoramax .sequence {
+    stroke: #ff6f00;
+}
+.ideditor .photo-controls-panoramax {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+}
+.ideditor .photo-controls-panoramax button {
+    padding:0 6px;
+    pointer-events: initial;
+}
+
+.ideditor label.panoramax-hd {
+    float: left;
+    cursor: pointer;
+}
+.ideditor .panoramax-hd span {
+    margin-top: 2px;
+}
+.ideditor .panoramax-hd input[type="checkbox"] {
+    width: 12px;
+    height: 12px;
+    margin: 0 2px;
+}
+
+.ideditor .slider-wrap {
+    display: inline-block;  
+}
+
+.ideditor .year-datalist {
+    display: flex;
+    justify-content: space-between;
+}
+
+.ideditor .list-option-date-slider{
+    direction: rtl
+}
+
+
 /* Streetside Viewer (pannellum) */
+.ideditor .ms-wrapper .photo-attribution {
+    line-height: 1.1em;
+    padding: 4px 2px;
+}
 .ideditor .ms-wrapper .photo-attribution .image-link {
     display: block;
 }
@@ -2588,12 +2943,18 @@ display: none;
     text-align: right;
 }
 
-.ideditor .ms-wrapper .photo-attribution a:active,
-.ideditor .ms-wrapper .photo-attribution a:hover {
+.ideditor .ms-wrapper .photo-attribution a:active {
     color: #0fffc4;
 }
+@media (hover: hover) {
+    .ideditor .ms-wrapper .photo-attribution a:hover {
+        color: #0fffc4;
+    }
+}
 
-.ideditor .ms-wrapper .pnlm-compass.pnlm-control {
+.ideditor .ms-wrapper .pnlm-compass.pnlm-control,
+.ideditor .vegbilder-wrapper  .pnlm-compass.pnlm-control,
+.ideditor .panoramax-wrapper  .pnlm-compass.pnlm-control {
     width: 26px;
     height: 26px;
     left: 4px;
@@ -2615,32 +2976,44 @@ display: none;
     margin: 0 5px;
 }
 
+.ideditor .pnlm-zoom-controls {
+    margin-top: 6px;
+}
+
 
 /* Mapillary viewer */
-.ideditor #mly .domRenderer .TagSymbol {
+.ideditor #ideditor-mly .domRenderer .TagSymbol {
     font-size: 10px;
     background-color: rgba(0,0,0,0.4);
     padding: 0 4px;
     border-radius: 4px;
     top: -25px;
 }
-.ideditor #mly .domRenderer .Attribution {
-    /* we will roll our own to avoid async update issues like #4526 */
-    display: none;
+
+.ideditor .mly-wrapper .mapillary-attribution-container {
+    display: flex;
+    align-items: center;
+}
+
+.ideditor .mly-wrapper .mapillary-attribution-container .mapillary-attribution-icon-container {
+    display: flex;
+    align-items: center;
 }
 
-.ideditor .mly-wrapper .photo-attribution a:active,
-.ideditor .mly-wrapper .photo-attribution a:hover {
-    color: #35af6d;
+.ideditor .mapillary-attribution-image-container {
+  height: auto;
 }
 
-.ideditor .mly-wrapper .mapillary-js-dom {
-    z-index: 9;
+.ideditor .mly-wrapper .mapillary-attribution-container .mapillary-attribution-username {
+    padding: 0px 8px 0 6px;
 }
 
+.ideditor .mly-wrapper .mapillary-attribution-container .mapillary-attribution-date {
+    margin-right: 6px;
+}
 
-/* OpenStreetCam viewer */
-.ideditor .osc-wrapper {
+/* KartaView viewer */
+.ideditor .kartaview-wrapper {
     position: relative;
     background-color: #000;
     background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
@@ -2648,21 +3021,48 @@ display: none;
     background-repeat: no-repeat;
 }
 
-.ideditor .osc-wrapper .photo-attribution a:active,
-.ideditor .osc-wrapper .photo-attribution a:hover {
+.ideditor .kartaview-wrapper img {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    -o-object-fit: cover;
+       object-fit: cover;
+}
+
+.ideditor .kartaview-wrapper .photo-attribution a:active {
     color: #20c4ff;
 }
+@media (hover: hover) {
+    .ideditor .kartaview-wrapper .photo-attribution a:hover {
+        color: #20c4ff;
+    }
+}
 
-.ideditor .osc-image-wrap {
+.ideditor .kartaview-image-wrap {
     width: 100%;
     height: 100%;
-    transform-origin:0 0;
-    -ms-transform-origin:0 0;
-    -webkit-transform-origin:0 0;
-    -moz-transform-origin:0 0;
-    -o-transform-origin:0 0;
+    transform-origin: 0 0;
+}
+
+.ideditor .photo-wrapper {
+    position: relative;
+    background-color: #000;
+    background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
+    background-position: center;
+    background-repeat: no-repeat;
+}
+
+.ideditor .photoviewer .plane-frame {
+    height: 100%;
+    width: 100%;
+    transform-origin: 0 0;
 }
 
+.ideditor .photoviewer .plane-frame > img.plane-photo {
+    width: auto;
+    height: 100%;
+    transform-origin: 0 0;
+}
 
 /* photo-controls (step forward, back, rotate) */
 .ideditor .photo-controls-wrap {
@@ -2671,17 +3071,20 @@ display: none;
     top: 10px;
     width: 100%;
     z-index: 10;
+    pointer-events: none;
 }
 
 .ideditor .photo-controls {
     display: inline-block;
     z-index: 10;
+    pointer-events: initial;
 }
 
 .ideditor .photo-controls button,
 .ideditor .photo-controls button:focus {
     height: 18px;
     width: 18px;
+    line-height: 18px;
     background: rgba(0,0,0,0.65);
     color: #eee;
     border-radius: 0;
@@ -2692,46 +3095,150 @@ display: none;
 .ideditor .photo-controls button:last-of-type {
     border-radius: 0 3px 3px 0;
 }
-.ideditor .photo-controls button:hover,
 .ideditor .photo-controls button:active {
     background: rgba(0,0,0,0.85);
     color: #fff;
 }
-
-/* OSM Notes and KeepRight Layers */
-
-.ideditor .error-header-icon .qa_error-fill,
-.ideditor .layer-keepRight .qa_error .qa_error-fill,
-.ideditor .layer-improveOSM .qa_error .qa_error-fill {
-    stroke: #333;
-    stroke-width: 1.3px;  /* NOTE: likely a better way to scale the icon stroke */
+@media (hover: hover) {
+    .ideditor .photo-controls button:hover {
+        background: rgba(0,0,0,0.85);
+        color: #fff;
+    }
 }
 
-.ideditor .note-header-icon .note-fill,
-.ideditor .layer-notes .note .note-fill {
-    color: #f30;
-    stroke: #333;
-    stroke-width: 40px;
+/* local georeferenced photos */
+.ideditor .layer-local-photos {
+    pointer-events: none;
 }
-.ideditor .note-header-icon.new .note-fill,
-.ideditor .layer-notes .note.new .note-fill {
-    color: #fe0;
-    stroke: #333;
-    stroke-width: 40px;
+.ideditor .layer-local-photos .viewfield-group * {
+    fill: #ed00d9;
 }
-.ideditor .note-header-icon.closed .note-fill,
-.ideditor .layer-notes .note.closed .note-fill {
-    color: #5d0;
-    stroke: #333;
-    stroke-width: 40px;
+.ideditor .local-photos {
+    display: flex;
 }
-
-/* slight adjustments to preset icon for note icons */
-.ideditor .note-header-icon .preset-icon-28 {
-    top: 18px;
+.ideditor .local-photos > div {
+    width: 50%;
 }
-.ideditor .note-header-icon .note-icon-annotation {
-    position: absolute;
+.ideditor .local-photos > div:first-child {
+    margin-right: 20px;
+}
+
+.ideditor .list-local-photos {
+    max-height: 40vh;
+    overflow-y: scroll;
+    overflow-x: auto;
+    /* workaround for something like "overflow-x: visible"
+       see https://stackoverflow.com/a/39554003 */
+    margin-left: -100px;
+    padding-left: 100px;
+    margin-top: -20px;
+    padding-top: 20px;
+    min-height: 100px;
+}
+.ideditor .list-local-photos::-webkit-scrollbar {
+    border-left: none;
+}
+.ideditor .list-local-photos li {
+    list-style: none;
+    display: flex;
+    justify-content: space-between;
+    height: 30px;
+}
+.ideditor .list-local-photos span.filename {
+    display: block;
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    line-height: 30px;
+    padding-left: 8px;
+    border-bottom: 1px solid #ccc;
+    border-left: 1px solid #ccc;
+    border-right: 1px solid #ccc;
+}
+.ideditor .list-local-photos li:first-child span.filename {
+    border-top: 1px solid #ccc;
+    border-top-left-radius: 4px;
+}
+.ideditor .list-local-photos li:first-child button {
+    border-top: 1px solid #ccc;
+}
+.ideditor .list-local-photos li:first-child button.remove {
+    border-top-right-radius: 4px;
+}
+.ideditor .list-local-photos li:last-child span.filename {
+    border-bottom-left-radius: 4px;
+}
+.ideditor .list-local-photos li:last-child button.remove {
+    border-bottom-right-radius: 4px;
+}
+.ideditor .list-local-photos li.invalid button.zoom-to-data {
+    display: none;
+}
+.ideditor .list-local-photos li button.no-geolocation {
+    display: none;
+}
+.ideditor .list-local-photos li.invalid button.no-geolocation {
+    display: block;
+    color: red;
+}
+.ideditor .list-local-photos .placeholder div {
+    display: block;
+    height: 40px;
+    width: 40px;
+    background-position: center;
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-image: url(<%= asset_path("iD/img/loader-black.gif") %>);
+    filter: invert(1);
+}
+.ideditor .local-photos label.button {
+    background: #7092ff;
+    color: #fff;
+    font-weight: bold;
+    padding: 10px 25px;
+    text-align: center;
+    font-size: 12px;
+    display: inline-block;
+    border-radius: 4px;
+    cursor: pointer;
+}
+
+
+/* OSM Notes and QA Layers */
+
+.ideditor .qa-header-icon .qaItem-fill,
+.ideditor .layer-keepRight .qaItem .qaItem-fill,
+.ideditor .layer-osmose .qaItem .qaItem-fill {
+    stroke: #333;
+    stroke-width: 1.3px;  /* NOTE: likely a better way to scale the icon stroke */
+}
+
+.ideditor .note-header-icon .note-fill,
+.ideditor .layer-notes .note .note-fill {
+    color: #f30;
+    stroke: #333;
+    stroke-width: 40px;
+}
+.ideditor .note-header-icon.new .note-fill,
+.ideditor .layer-notes .note.new .note-fill {
+    color: #fe0;
+    stroke: #333;
+    stroke-width: 40px;
+}
+.ideditor .note-header-icon.closed .note-fill,
+.ideditor .layer-notes .note.closed .note-fill {
+    color: #5d0;
+    stroke: #333;
+    stroke-width: 40px;
+}
+
+/* slight adjustments to preset icon for note icons */
+.ideditor .note-header-icon .preset-icon-28 {
+    top: 18px;
+}
+.ideditor .note-header-icon .note-icon-annotation {
+    position: absolute;
     top: 22px;
     left: 22px;
     margin: auto;
@@ -2741,117 +3248,90 @@ display: none;
     height: 15px;
 }
 
-/* adjustment for error icon */
-
-.ideditor .error-header-icon .preset-icon-28 {
+/* adjustment to center QA icons */
+.ideditor .qa-header-icon .preset-icon-28 {
     top: auto;
     left: auto;
 }
-
-.ideditor .error-header-icon {
+.ideditor .qa-header-icon {
     display: flex;
     align-items: center;
     justify-content: center;
 }
 
-/* Keep Right Errors
+/* Keep Right Issues
 ------------------------------------------------------- */
-.ideditor .keepRight.error_type-20,     
-.ideditor .keepRight.error_type-40,     
-.ideditor .keepRight.error_type-210,     
-.ideditor .keepRight.error_type-270,     
-.ideditor .keepRight.error_type-310,     
-.ideditor .keepRight.error_type-320,     
-.ideditor .keepRight.error_type-350 {   /* improper bridge tag */
+.ideditor .keepRight.itemType-20,     
+.ideditor .keepRight.itemType-40,     
+.ideditor .keepRight.itemType-210,     
+.ideditor .keepRight.itemType-270,     
+.ideditor .keepRight.itemType-310,     
+.ideditor .keepRight.itemType-320,     
+.ideditor .keepRight.itemType-350 {   /* improper bridge tag */
     color: #ff9;
 }
 
-.ideditor .keepRight.error_type-50 {    /* almost junctions */
+.ideditor .keepRight.itemType-50 {    /* almost junctions */
     color: #88f;
 }
 
-.ideditor .keepRight.error_type-60,     
-.ideditor .keepRight.error_type-70,     
-.ideditor .keepRight.error_type-90,     
-.ideditor .keepRight.error_type-100,     
-.ideditor .keepRight.error_type-110,     
-.ideditor .keepRight.error_type-150,     
-.ideditor .keepRight.error_type-220,     
-.ideditor .keepRight.error_type-380 {   /* non-physical sport tag */
+.ideditor .keepRight.itemType-60,     
+.ideditor .keepRight.itemType-70,     
+.ideditor .keepRight.itemType-90,     
+.ideditor .keepRight.itemType-100,     
+.ideditor .keepRight.itemType-110,     
+.ideditor .keepRight.itemType-150,     
+.ideditor .keepRight.itemType-220,     
+.ideditor .keepRight.itemType-380 {   /* non-physical sport tag */
     color: #5d0;
 }
 
-.ideditor .keepRight.error_type-130 {   /* disconnected ways */
+.ideditor .keepRight.itemType-130 {   /* disconnected ways */
     color: #fa3;
 }
 
-.ideditor .keepRight.error_type-170 {   /* FIXME tag */
+.ideditor .keepRight.itemType-170 {   /* FIXME tag */
     color: #ff0;
 }
 
-.ideditor .keepRight.error_type-190 {   /* intersection without junction */
+.ideditor .keepRight.itemType-190 {   /* intersection without junction */
     color: #f33;
 }
 
-.ideditor .keepRight.error_type-200 {   /* overlapping ways */
+.ideditor .keepRight.itemType-200 {   /* overlapping ways */
     color: #fdbf6f;
 }
 
-.ideditor .keepRight.error_type-160,    
-.ideditor .keepRight.error_type-230 {   /* layer conflict */
+.ideditor .keepRight.itemType-160,    
+.ideditor .keepRight.itemType-230 {   /* layer conflict */
     color: #b60;
 }
 
-.ideditor .keepRight.error_type-280 {   /* boundary issues */
+.ideditor .keepRight.itemType-280 {   /* boundary issues */
     color: #5f47a0;
 }
 
-.ideditor .keepRight.error_type-180,    
-.ideditor .keepRight.error_type-290 {   /* turn restriction issues */
+.ideditor .keepRight.itemType-180,    
+.ideditor .keepRight.itemType-290 {   /* turn restriction issues */
     color: #ace;
 }
 
-.ideditor .keepRight.error_type-300,    
-.ideditor .keepRight.error_type-390 {   /* missing tracktype */
+.ideditor .keepRight.itemType-300,    
+.ideditor .keepRight.itemType-390 {   /* missing tracktype */
     color: #090;
 }
 
-.ideditor .keepRight.error_type-360,    
-.ideditor .keepRight.error_type-370,    
-.ideditor .keepRight.error_type-410 {   /* website issues */
+.ideditor .keepRight.itemType-360,    
+.ideditor .keepRight.itemType-370,    
+.ideditor .keepRight.itemType-410 {   /* website issues */
     color: #f9b;
 }
 
-.ideditor .keepRight.error_type-120,    
-.ideditor .keepRight.error_type-400 {   /* geometry / turn angles */
+.ideditor .keepRight.itemType-120,    
+.ideditor .keepRight.itemType-400 {   /* geometry / turn angles */
     color: #c35;
 }
 
-/* ImproveOSM Errors
-------------------------------------------------------- */
-
-.ideditor .improveOSM.error_type-ow {   /* missing one way */
-    color: #1E90FF;
-}
-
-.ideditor .improveOSM.error_type-mr-road {   /* missing road */
-    color: #B452CD;
-}
-.ideditor .improveOSM.error_type-mr-path {   /* missing path */
-    color: #A0522D;
-}
-.ideditor .improveOSM.error_type-mr-parking {   /* missing parking */
-    color: #EEEE00;
-}
-.ideditor .improveOSM.error_type-mr-both {   /* missing road+parking */
-    color: #FFA500;
-}
-
-.ideditor .improveOSM.error_type-tr {   /* missing turn restriction */
-    color: #EC1C24;
-}
-
-
 /* Custom Map Data (geojson, gpx, kml, vector tile) */
 .ideditor .layer-mapdata {
     pointer-events: none;
@@ -2899,11 +3379,11 @@ display: none;
     dominant-baseline: middle;
 }
 .ideditor .layer-mapdata text.label {
-    fill: #ff26d4;
+    fill: #ddd;
 }
 .ideditor .layer-mapdata text.label.hover,
 .ideditor .layer-mapdata text.label.selected {
-    fill: #f6634f;
+    fill: #fff;
 }
 .ideditor .layer-mapdata text.label-halo {
     opacity: 0.7;
@@ -2960,9 +3440,65 @@ display: none;
     stroke-width: 20px;
 }
 .ideditor.mode-browse .fill-partial path.area.fill,
-.ideditor.mode-select .fill-partial path.area.fill {
+.ideditor.mode-select .fill-partial path.area.fill,
+.ideditor.mode-select-data .fill-partial path.area.fill,
+.ideditor.mode-select-error .fill-partial path.area.fill,
+.ideditor.mode-select-note .fill-partial path.area.fill {
     pointer-events: visibleStroke;
 }
+.ideditor svg.preset-icon-category-border path {
+    stroke-width: 1;
+    stroke: rgb(170, 170, 170);
+    fill: rgba(170, 170, 170, 0.3);
+}
+
+.ideditor .preset-category-barrier svg.preset-icon-category-border path {
+    stroke: rgb(200, 144, 144);
+    fill: rgba(200, 144, 144, 0.3);
+}
+
+.ideditor .preset-category-building svg.preset-icon-category-border path {
+    stroke: rgb(224, 110, 95);
+    fill: rgba(224, 110, 95, 0.3);
+}
+
+.ideditor .preset-category-landuse svg.preset-icon-category-border path {
+    stroke: rgb(196, 189, 25);
+    fill: rgba(196, 189, 25, 0.3);
+}
+
+.ideditor .preset-category-natural svg.preset-icon-category-border path,
+.ideditor .preset-category-playground svg.preset-icon-category-border path,
+.ideditor .preset-category-golf svg.preset-icon-category-border path {
+    stroke: rgb(140, 208, 95);
+    fill: rgba(140, 208, 95, 0.3);
+}
+
+.ideditor .preset-category-water svg.preset-icon-category-border path,
+.ideditor .preset-category-waterway svg.preset-icon-category-border path {
+    stroke: rgb(119, 211, 222);
+    fill: rgba(119, 211, 222, 0.3);
+}
+
+.ideditor .preset-category-utility svg.preset-icon-category-border path {
+    stroke: rgb(125, 125, 125);
+    fill: rgba(219, 219, 125, 0.3);
+}
+
+.ideditor .preset-category-path svg.preset-icon-category-border path {
+    stroke: rgb(221, 221, 204);
+    fill: rgba(221, 221, 204, 0.3);
+}
+
+.ideditor .preset-category-road_service svg.preset-icon-category-border path,
+.ideditor .preset-category-road_minor svg.preset-icon-category-border path,
+.ideditor .preset-category-road_major svg.preset-icon-category-border path {
+    stroke: #999;
+}
+
+.ideditor .preset-category-rail svg.preset-icon-category-border path {
+    stroke: #555;
+}
 /* Basics
 ------------------------------------------------------- */
 /* the root element of iD */
@@ -2974,44 +3510,48 @@ display: none;
     border: 0;
     overflow: hidden;
 
-    font: normal 12px/1.6667 "-apple-system", BlinkMacSystemFont,
+    /* Establish a local stacking context so all elements within iD are on the
+       same layer relative to elements outside iD - #7457.
+       https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
+    */
+    position: relative;
+    z-index: 0;
+
+    font: normal 12px/1.6667 ui-sans-serif, "-apple-system", BlinkMacSystemFont,
         "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
         "Fira Sans", "Droid Sans", "Helvetica Neue", "Arial",
         sans-serif;
     color: #333;
 
+    touch-action: none;
     -ms-user-select: none;
     -ms-content-zooming: none;
-
-    /* Establish a local stacking context so all elements within iD are on the
-    same layer relative to elements outside iD - #7457.
-    https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
-    */
-    position: relative;
-    z-index: 0;
+}
+.ideditor div {
+    /* disable pinch-to-zoom of the UI on touch devices */
+    touch-action: pan-x pan-y;
 }
 
-.ideditor #content {
+.ideditor .main-content {
     position: relative;
+    display: flex;
+    flex-direction: column;
     overflow: hidden;
     height: 100%;
+    touch-action: none;
 }
 
-.ideditor #content.active {
-    -webkit-filter: none !important;
+.ideditor .main-content.active {
     filter: none !important;
-    -webkit-duration: 200ms;
     transition-duration: 200ms;
 }
 
-.ideditor #content.inactive {
-    -webkit-filter: grayscale(80%) brightness(80%);
+.ideditor .main-content.inactive {
     filter: grayscale(80%) brightness(80%);
-    -webkit-duration: 200ms;
     transition-duration: 200ms;
 }
 
-.ideditor #defs {
+.ideditor #ideditor-defs {
     /* Can't be display: none or the clippaths are ignored. */
     position: absolute;
     width: 0;
@@ -3019,8 +3559,6 @@ display: none;
 }
 
 .ideditor div, .ideditor textarea, .ideditor label, .ideditor input, .ideditor form, .ideditor span, .ideditor ul, .ideditor li, .ideditor ol, .ideditor a, .ideditor button, .ideditor h1, .ideditor h2, .ideditor h3, .ideditor h4, .ideditor h5, .ideditor p, .ideditor img {
-    -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box;
     box-sizing: border-box;
 }
 
@@ -3034,8 +3572,7 @@ display: none;
 }
 
 .ideditor a,
-.ideditor button,
-.ideditor .radial-menu-item {
+.ideditor button {
     cursor: pointer;
 }
 
@@ -3045,9 +3582,14 @@ display: none;
     font-weight: bold;
     margin-bottom: 20px;
 }
+.ideditor .header h2 {
+    font-size: 20px;
+    line-height: 1.25;
+    font-weight: bold;
+    margin-bottom: 0px;
+}
 
 .ideditor h3:last-child,
-.ideditor h2:last-child,
 .ideditor h4:last-child { margin-bottom: 0;}
 
 .ideditor h3 {
@@ -3062,20 +3604,27 @@ display: none;
     padding-bottom: 10px;
 }
 
-.ideditor :focus {
+.ideditor button:focus,
+.ideditor textarea:focus,
+.ideditor input[type=text]:focus,
+.ideditor input[type=search]:focus,
+.ideditor input[type=number]:focus,
+.ideditor input[type=url]:focus,
+.ideditor input[type=tel]:focus,
+.ideditor input[type=email]:focus,
+.ideditor input[type=date]:focus {
     outline-color: transparent;
     outline-style: none;
 }
 
-.ideditor ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
+.ideditor ::-moz-placeholder {
     color: #aaa;
     opacity: 1; /* Firefox */
 }
-.ideditor :-ms-input-placeholder { /* Internet Explorer 10-11 */
-    color: #aaa;
-}
-.ideditor ::-ms-input-placeholder { /* Microsoft Edge */
+
+.ideditor ::placeholder {
     color: #aaa;
+    opacity: 1; /* Firefox */
 }
 
 .ideditor p {
@@ -3092,19 +3641,26 @@ display: none;
 .ideditor strong {
     font-weight: bold;
 }
-.ideditor a:visited, .ideditor a {
+.ideditor a,
+.ideditor a:visited,
+.ideditor a:active {
     color: #7092ff;
 }
-.ideditor a:hover {
+.ideditor a:focus {
     color: #597be7;
 }
+@media (hover: hover) {
+    .ideditor a:hover {
+        color: #597be7;
+    }
+}
 .ideditor kbd {
     display: inline-block;
     text-align: center;
     padding: 3px 5px;
     font-size: 11px;
-    line-height: 12px;
-    min-width: 12px;
+    line-height: 1.3;
+    min-width: 0.9em;
     vertical-align: baseline;
     background-color: #fcfcfc;
     border: solid 1px #ccc;
@@ -3114,41 +3670,54 @@ display: none;
     box-shadow: inset 0 -1px 0 #bbb;
 }
 
-/* Forms
-------------------------------------------------------- */
-.ideditor textarea  {
-    resize: vertical;
-    font:normal 12px/20px "-apple-system", BlinkMacSystemFont,
-        "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
-        "Fira Sans", "Droid Sans", "Helvetica Neue", "Arial",
-        sans-serif;
+.ideditor code {
+    font-family: ui-monospace, monospace, monospace;
+    background: rgba(174, 174, 174, 0.25);
+    padding: 1px 2px;
 }
 
+/* Forms
+------------------------------------------------------- */
 .ideditor textarea,
 .ideditor input[type=text],
 .ideditor input[type=search],
 .ideditor input[type=number],
 .ideditor input[type=url],
 .ideditor input[type=tel],
-.ideditor input[type=email] {
+.ideditor input[type=email],
+.ideditor input[type=date] {
     background-color: #fff;
     color: #333;
     border: 1px solid #ccc;
-    padding: 5px 20px 5px 10px;
-    height: 30px;
+    padding: 0px 10px 0px 10px;
     border-radius: 4px;
     text-overflow: ellipsis;
+    overflow: auto;
+}
+.ideditor input[type=text],
+.ideditor input[type=search],
+.ideditor input[type=number],
+.ideditor input[type=url],
+.ideditor input[type=tel],
+.ideditor input[type=email],
+.ideditor input[type=date],
+.ideditor input[type=color] {
+    /* need this since line-height interpretation may vary by font or browser */
+    height: 2.585em;
 }
-.ideditor[dir='rtl'] textarea,
-.ideditor[dir='rtl'] input[type=text],
-.ideditor[dir='rtl'] input[type=search],
-.ideditor[dir='rtl'] input[type=number],
-.ideditor[dir='rtl'] input[type=url],
-.ideditor[dir='rtl'] input[type=tel],
-.ideditor[dir='rtl'] input[type=email] {
-    padding: 5px 10px 5px 20px;
+.ideditor textarea  {
+    min-height: 2em;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    resize: vertical;
+    font:normal 12px/20px "-apple-system", BlinkMacSystemFont,
+        "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
+        "Fira Sans", "Droid Sans", "Helvetica Neue", "Arial",
+        sans-serif;
 }
 
+.ideditor textarea:active,
+.ideditor input:active,
 .ideditor textarea:focus,
 .ideditor input:focus {
     background-color: #f1f1f1;
@@ -3163,20 +3732,36 @@ display: none;
 
 .ideditor input[type="checkbox"],
 .ideditor input[type="radio"] {
-    float: left;
     width: 14px;
     height: 14px;
-    margin-right: 5px;
-    margin-top: 3px;
+    margin-right: 6px;
     cursor: pointer;
+    vertical-align: middle;
 }
 .ideditor[dir='rtl'] input[type="checkbox"],
 .ideditor[dir='rtl'] input[type="radio"] {
-    float: right;
-    margin-left: 5px;
+    margin-left: 6px;
     margin-right: 0;
 }
 
+.ideditor input.mixed::-moz-placeholder, .ideditor textarea.mixed::-moz-placeholder {
+    font-style: italic;
+}
+
+.ideditor input.mixed::placeholder,
+.ideditor textarea.mixed::placeholder {
+    font-style: italic;
+}
+
+/* keytraps need to be invisible yet not be display:none or visibility:hidden */
+.ideditor .keytrap {
+    width: 0;
+    height: 0;
+    padding: 0;
+    margin: 0;
+    border: 0;
+}
+
 /* tables */
 .ideditor table {
     background-color: #fff;
@@ -3257,21 +3842,24 @@ display: none;
 ------------------------------------------------------- */
 .ideditor button {
     text-align: center;
-    line-height: 20px;
     border: 0;
     background: #fff;
-    font-weight: bold;
     color: #333;
     font-size: 12px;
     display: inline-block;
-    height: 40px;
     border-radius: 4px;
 }
 
 .ideditor button:focus,
-.ideditor button:hover {
+.ideditor button:active,
+.ideditor button.hover {
     background-color: #ececec;
 }
+@media (hover: hover) {
+    .ideditor button:hover {
+        background-color: #ececec;
+    }
+}
 .ideditor button.active {
     background: #7092ff;
 }
@@ -3312,41 +3900,76 @@ display: none;
 .ideditor button.action {
     background: #7092ff;
     color: #fff;
+    font-weight: bold;
 }
 .ideditor button.action:focus,
-.ideditor button.action:hover {
+.ideditor button.action:active {
     background: #597be7;
 }
 .ideditor button.secondary-action {
     background: #ececec;
+    font-weight: bold;
 }
 .ideditor button.secondary-action:focus,
-.ideditor button.secondary-action:hover {
+.ideditor button.secondary-action:active {
     background: #cccccc;
 }
 
 .ideditor button.action.disabled,
-.ideditor button.action.disabled:hover,
-.ideditor button[disabled].action,
-.ideditor button[disabled].action:hover {
+.ideditor button[disabled].action {
     background: #cccccc;
     color: #888;
     cursor: not-allowed;
 }
 
+.ideditor button.action,
+.ideditor button.secondary-action {
+    padding: 10px 5px;
+}
+
+@media (hover: hover) {
+    .ideditor button.action:hover {
+        background: #597be7;
+    }
+    .ideditor button.secondary-action:hover {
+        background: #cccccc;
+    }
+    .ideditor button.action.disabled:hover,
+    .ideditor button[disabled].action:hover {
+        background: #cccccc;
+        color: #888;
+        cursor: not-allowed;
+    }
+}
+
 
 /* Icons
 ------------------------------------------------------- */
 .ideditor .icon {
-    vertical-align: top;
+    vertical-align: middle;
     width: 20px;
     height: 20px;
 }
 
+.ideditor .icon.operation use {
+    fill: #222;
+    color: #79f;
+}
+.ideditor button.disabled .icon.operation use,
+.ideditor .icon.operation.disabled use {
+    fill: rgba(32,32,32,.2);
+    color: rgba(40,40,40,.2);
+}
+
+.ideditor .icon.monochrome use {
+    fill: currentColor;
+}
+
 .ideditor .icon.inline {
     vertical-align: text-top;
-    width: 14px;
-    height: 14px;
+    display: inline-block;
+    width: 1.17em;
+    height: 1.17em;
     margin: 0px 3px;
 }
 
@@ -3365,6 +3988,7 @@ display: none;
 
 .ideditor .icon.light {
     color: #fff;
+    fill: currentColor;
 }
 .ideditor .icon.created {
     color: #00ca07;
@@ -3386,32 +4010,23 @@ display: none;
 
 .ideditor .icon-annotation {
     color: #333;
+    vertical-align: baseline;
 }
 
-.ideditor .notification-badge {
-    display: block;
-    position: absolute;
-    width: 10px;
-    height: 10px;
-    right: 7px;
-    top: 9px;
-}
-
-.ideditor .notification-badge.hide {
-    display: none;
+.ideditor button.loading .icon {
+    background-image: url(<%= asset_path("iD/img/mini-loader.gif") %>);
+    background-position: 0 0;
+    background-size: auto;
 }
 
 
 /* Toolbar / Persistent UI Elements
 ------------------------------------------------------- */
-.ideditor #bar-wrap {
-    position: absolute;
-    left: 0;
-    top: 0;
-    right: 0;
+.ideditor .top-toolbar-wrap {
+    position: relative;
     z-index: 101;
 }
-.ideditor #bar {
+.ideditor .top-toolbar {
     display: flex;
     flex-flow: row nowrap;
     justify-content: space-between;
@@ -3425,16 +4040,16 @@ display: none;
     scrollbar-width: none; /* Firefox */
     -ms-overflow-style: none; /* IE, Edge */
 }
-.ideditor #bar::-webkit-scrollbar {
+.ideditor .top-toolbar::-webkit-scrollbar {
     display: none; /* Chrome, Safari, Opera */
 }
-.ideditor #bar .toolbar-item {
+.ideditor .top-toolbar .toolbar-item {
     display: flex;
     flex: 0 1 auto;
     flex-flow: column wrap;
     justify-content: center;
 }
-.ideditor #bar .toolbar-item .item-content {
+.ideditor .top-toolbar .toolbar-item .item-content {
     display: flex;
     flex: 0 1 auto;
     flex-flow: row nowrap;
@@ -3443,31 +4058,39 @@ display: none;
     width: auto;
     margin: 0 5px;
 }
-.ideditor[dir='ltr'] #bar .toolbar-item:last-child .item-content,
-.ideditor[dir='rtl'] #bar .toolbar-item:first-child .item-content {
+.ideditor[dir='ltr'] .top-toolbar .toolbar-item:last-child .item-content,
+.ideditor[dir='rtl'] .top-toolbar .toolbar-item:first-child .item-content {
     margin-right: 10px;
 }
-.ideditor[dir='ltr'] #bar .toolbar-item:first-child .item-content,
-.ideditor[dir='rtl'] #bar .toolbar-item:last-child .item-content {
+.ideditor[dir='ltr'] .top-toolbar .toolbar-item:first-child .item-content,
+.ideditor[dir='rtl'] .top-toolbar .toolbar-item:last-child .item-content {
     margin-left: 10px;
 }
-.ideditor #bar .toolbar-item .item-label {
+.ideditor[dir='ltr'] .top-toolbar .toolbar-item:last-child .item-label,
+.ideditor[dir='rtl'] .top-toolbar .toolbar-item:first-child .item-label {
+    padding-right: 5px;
+}
+.ideditor[dir='ltr'] .top-toolbar .toolbar-item:first-child .item-label,
+.ideditor[dir='rtl'] .top-toolbar .toolbar-item:last-child .item-label {
+    padding-left: 5px;
+}
+.ideditor .top-toolbar .toolbar-item .item-label {
     text-align: center;
     font-size: 11px;
     white-space: nowrap;
     margin: 1px 2px 2px 2px;
 }
-.ideditor #bar .toolbar-item.spacer {
+.ideditor .top-toolbar .toolbar-item.spacer {
     width: 100%;
     flex-grow: 2;
 }
-.ideditor #bar .toolbar-item:first-child {
+.ideditor .top-toolbar .toolbar-item:first-child {
     justify-content: flex-start;
 }
-.ideditor #bar .toolbar-item:last-child {
+.ideditor .top-toolbar .toolbar-item:last-child {
     justify-content: flex-end;
 }
-.ideditor #bar .toolbar-item:empty:not(.spacer) {
+.ideditor .top-toolbar .toolbar-item:empty:not(.spacer) {
     display: none;
 }
 .ideditor button.bar-button {
@@ -3478,6 +4101,7 @@ display: none;
     min-width: 30px;
     white-space: nowrap;
     display: flex;
+    font-weight: bold;
 }
 .ideditor button.bar-button .icon {
     flex: 0 0 20px;
@@ -3504,7 +4128,7 @@ display: none;
     text-align: center;
 }
 
-.ideditor .help-wrap svg.icon.pre-text.add-note,
+.ideditor .help-pane svg.icon.inline.add-note,
 .ideditor button.add-note svg.icon {
     height: 15px;
     width: 15px;
@@ -3521,7 +4145,7 @@ display: none;
     margin-left: 4px;
     margin-right: unset;
 }
-.ideditor .help-wrap svg.icon.pre-text.add-note {
+.ideditor .help-pane svg.icon.inline.add-note {
     margin-left: 3px;
     margin-right: 3px;
 }
@@ -3530,29 +4154,28 @@ display: none;
     opacity: .5;
     position: absolute;
     right: 4px;
-    bottom: 26px;
-}
-.ideditor .spinner img {
+    bottom: 4px;
     height: 20px;
     width: 20px;
+}
+.ideditor .spinner img {
+    height: 100%;
+    width: 100%;
     background: transparent;
     border-radius: 100%;
 }
 .ideditor[dir='rtl'] .spinner img {
-    -moz-transform: scaleX(-1);
-    -o-transform: scaleX(-1);
-    -webkit-transform: scaleX(-1);
     transform: scaleX(-1);
     filter: FlipH;
     -ms-filter: "FlipH";
 }
 
 
-.ideditor #bar.narrow .spinner,
-.ideditor #bar.narrow button.bar-button .label {
+.ideditor .top-toolbar.narrow .spinner,
+.ideditor .top-toolbar.narrow button.bar-button .label {
     display: none;
 }
-.ideditor #bar.narrow button .count {
+.ideditor .top-toolbar.narrow button .count {
     border-left-width: 0;
     border-right-width: 0;
 }
@@ -3568,17 +4191,20 @@ display: none;
 ------------------------------------------------------- */
 .ideditor .header {
     border-bottom: 1px solid #ccc;
-    height: 60px;
+    padding: 20px 40px;
     position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex: 0 0 auto;
 }
 
 .ideditor .header h3 {
     text-align: center;
     margin-bottom: 0;
-    white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
-    padding: 20px;
+    padding: 0;
 }
 
 .ideditor .header button,
@@ -3595,20 +4221,14 @@ display: none;
 }
 
 .ideditor .field-help-title button.close,
-.ideditor .sidebar-component .header button.data-editor-close,
-.ideditor .sidebar-component .header button.note-editor-close,
-.ideditor .sidebar-component .header button.error-editor-close,
-.ideditor .entity-editor-pane .header button.preset-close,
+.ideditor .sidebar .header button.close,
 .ideditor .preset-list-pane .header button.preset-choose {
     position: absolute;
     right: 0;
     top: 0;
 }
 .ideditor[dir='rtl'] .field-help-title button.close,
-.ideditor[dir='rtl'] .sidebar-component .header button.data-editor-close,
-.ideditor[dir='rtl'] .sidebar-component .header button.note-editor-close,
-.ideditor[dir='rtl'] .sidebar-component .header button.error-editor-close,
-.ideditor[dir='rtl'] .entity-editor-pane .header button.preset-close,
+.ideditor[dir='rtl'] .sidebar .header button.close,
 .ideditor[dir='rtl'] .preset-list-pane .header button.preset-choose {
     left: 0;
     right: auto;
@@ -3646,13 +4266,15 @@ display: none;
     position: absolute;
     bottom: 0;
     margin: 0;
-    padding: 5px 20px 5px 20px;
+    padding: 0 15px;
     border-top: 1px solid #ccc;
     background-color: #f6f6f6;
     width: 100%;
+    height: 2.5em;
     z-index: 1;
     flex-wrap: wrap;
     justify-content: space-between;
+    align-items: center;
     list-style: none;
     display: flex;
 }
@@ -3661,31 +4283,13 @@ display: none;
     justify-content: center;
 }
 
-.ideditor .header-container {
-    display: flex;
-    justify-content: space-between;
-}
-
-.ideditor .header-block-outer {
-    width: 20%;
-}
-
-.ideditor .header-block-close {
-    display: flex;
-    justify-content: flex-end;
-}
-
-/* Hide/Toggle collapsable sections (aka Disclosure)
+/* Hide/Toggle collapsible sections (aka Disclosure)
 ------------------------------------------------------- */
 .ideditor .hide-toggle .icon.pre-text {
-    vertical-align: text-top;
+    vertical-align: middle;
     width: 16px;
     height: 16px;
-    margin-left: -3px;
-}
-.ideditor[dir='rtl'] .hide-toggle .icon.pre-text {
-    margin-left: 0;
-    margin-right: -3px;
+    margin-top: -3px;
 }
 
 .ideditor a:visited.hide-toggle,
@@ -3693,13 +4297,13 @@ display: none;
     display: inline-block;
     font-size: 14px;
     font-weight: bold;
-    padding-bottom: 5px;
+    margin-bottom: 5px;
 }
 
 
 /* Sidebar / Inspector
 ------------------------------------------------------- */
-.ideditor #sidebar {
+.ideditor .sidebar {
     position: relative;
     float: left;
     height: 100%;
@@ -3709,31 +4313,38 @@ display: none;
     border: 0px solid #ccc;
     border-right-width: 1px;
 }
-.ideditor[dir='rtl'] #sidebar {
+.ideditor[dir='rtl'] .sidebar {
     float: right;
     border-right-width: 0px;
     border-left-width: 1px;
 }
 
-.ideditor #sidebar-resizer {
+.ideditor .sidebar-resizer {
     position: absolute;
     top: 0;
-    right: -6px;
+    right: -10px;
+    width: 10px;
     height: 100%;
-    width: 6px;
     cursor: col-resize;
+    /* disable drag-to-select */
+    -webkit-user-select: none;
+       -moz-user-select: none;
+            user-select: none;
 }
-.ideditor[dir='rtl'] #sidebar-resizer {
+.ideditor[dir='rtl'] .sidebar-resizer {
     right: auto;
     left: -6px;
 }
 
-.ideditor #sidebar.collapsed #sidebar-resizer {
+.ideditor .sidebar.collapsed > *:not(.sidebar-resizer) {
+    display: none;
+}
+.ideditor .sidebar.collapsed .sidebar-resizer {
     /* make target wider to avoid the user accidentally resizing window */
     width: 10px;
     right: -10px;
 }
-.ideditor[dir='rtl'] #sidebar.collapsed #sidebar-resizer {
+.ideditor[dir='rtl'] .sidebar.collapsed .sidebar-resizer {
     left: -10px;
 }
 
@@ -3743,14 +4354,16 @@ display: none;
     left: 0;
     bottom: 0;
     right: 0;
+    display: flex;
+    flex-direction: column;
 }
 
 .ideditor .sidebar-component .body {
     width: 100%;
-    overflow: auto;
-    top: 60px;
-    bottom: 0;
-    position: absolute;
+    height: 100%;
+    overflow-y: auto;
+    overflow-x: hidden;
+    position: relative;
 }
 
 .ideditor .panewrap {
@@ -3764,7 +4377,9 @@ display: none;
     position: absolute;
     width: 50%;
     top: 0;
-    bottom: 30px;
+    bottom: 2.5em;
+    display: flex;
+    flex-direction: column;
 }
 
 .ideditor .pane:first-child {
@@ -3774,6 +4389,11 @@ display: none;
 .ideditor .pane:last-child {
     right: 0;
 }
+.ideditor .feature-list-pane {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+}
 
 .ideditor .inspector-wrap {
     width: 100%;
@@ -3789,44 +4409,39 @@ display: none;
 .ideditor .inspector-body {
     overflow-y: scroll;
     overflow-x: hidden;
-    position: absolute;
-    right: 0;
-    left: 0;
-    bottom: 0;
+    position: relative;
+    height: 100%;
+    flex: 1 1 100%;
 }
-
-.ideditor .feature-list-pane .inspector-body,
-.ideditor .preset-list-pane .inspector-body {
-    top: 120px;
+.ideditor .entity-editor {
+    padding: 20px;
 }
-.ideditor .entity-editor-pane .inspector-body,
-.ideditor .selection-list-pane .inspector-body {
-    top: 60px;
+/* preserve extra space at bottom of inspector to allow for dropdown options - #5280 */
+.ideditor .entity-editor > div:last-child {
+    margin-bottom: 150px;
 }
 
-.ideditor .inspector-inner {
-    padding: 20px 20px 5px 20px;
+.ideditor .sidebar .search-header {
     position: relative;
+    overflow: hidden;
+    flex: 0 0 auto;
 }
-
-.ideditor #sidebar .search-header .icon {
-    display: block;
+.ideditor .sidebar .search-header .icon {
+    display: inline-block;
     position: absolute;
     left: 10px;
-    top: 80px;
+    height: 100%;
     pointer-events: none;
 }
-.ideditor[dir='rtl'] #sidebar .search-header .icon {
+.ideditor[dir='rtl'] .sidebar .search-header .icon {
     left: auto;
     right: 10px;
 }
 
-.ideditor #sidebar .search-header input {
-    position: absolute;
-    top: 60px;
-    height: 60px;
+.ideditor .sidebar .search-header input {
     width: 100%;
-    padding: 5px 10px;
+    padding: 0 10px;
+    height: 3em;
     border-radius: 0;
     border-width: 0;
     border-bottom-width: 1px;
@@ -3835,6 +4450,11 @@ display: none;
     font-weight: bold;
 }
 
+.ideditor .section:not(:last-child),
+.ideditor .map-pane .section {
+    margin-bottom: 30px;
+}
+
 
 /* Feature List / Search Results
 ------------------------------------------------------- */
@@ -3842,49 +4462,34 @@ display: none;
     width: 100%;
 }
 .ideditor .no-results-item,
-.ideditor .geocode-item,
 .ideditor .feature-list-item {
     width: 100%;
     position: relative;
     border-bottom: 1px solid #ccc;
     border-radius: 0;
 }
-
-.ideditor .geocode-item {
-    width: 50%;
-    background-color: #ccc;
-    left: 25%;
-    margin-top: 30px;
-    border-radius: 2px;
-}
-
-.ideditor[dir='rtl'] .geocode-item {
-    left: -25%;
+.ideditor .no-results-item {
+    padding: 10px;
+    font-weight: bold;
 }
 
-.ideditor .geocode-item:hover {
-    background-color: #aaa;
+.ideditor .geocode-item {
+    width: 100%;
+    max-width: 200px;
+    margin: 30px auto;
+    min-height: 40px;
 }
 
 .ideditor .feature-list-item {
-    background-color: #fff;
-    font-weight: bold;
-    height: 40px;
-    line-height: 20px;
-}
-.ideditor .feature-list-item:hover {
-    background-color: #ececec;
-}
-.ideditor .feature-list-item button {
-    background: transparent;
+    display: flex;
 }
 .ideditor .feature-list-item .label {
     text-align: left;
-    padding: 10px 10px;
+    padding: 10px;
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
-    border-left: 1px solid rgba(0, 0, 0, .1);
+    flex: 1 1 auto;
 }
 .ideditor[dir='rtl'] .feature-list-item .label {
     text-align: right;
@@ -3894,20 +4499,26 @@ display: none;
     opacity: .5;
 }
 .ideditor .feature-list-item .close {
-    float: right;
     padding: 10px;
+
 }
 .ideditor .feature-list-item .close .icon {
-    opacity: 1;
+    opacity: 0.5;
 }
 .ideditor .feature-list-item .entity-type {
     color: #7092ff;
+    font-weight: bold;
 }
-.ideditor .feature-list-item:hover .entity-type {
+.ideditor .feature-list-item:active .entity-type,
+.ideditor .feature-list-item:focus .entity-type {
     color: #597be7;
 }
+@media (hover: hover) {
+    .ideditor .feature-list-item:hover .entity-type {
+        color: #597be7;
+    }
+}
 .ideditor .feature-list-item .entity-name {
-    font-weight: normal;
     color: #666;
     padding-left: 10px;
 }
@@ -3915,14 +4526,37 @@ display: none;
     padding-left: 0;
     padding-right: 10px;
 }
-
+.ideditor .section-selected-features .feature-list {
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    overflow: hidden;
+    margin-top: 5px;
+}
+.ideditor .section-selected-features .feature-list-item:last-child {
+    border: none;
+}
+.ideditor[dir='ltr'] .section-selected-features .feature-list-item > button:not(:first-child) {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+}
+.ideditor[dir='rtl'] .section-selected-features .feature-list-item > button:not(:last-child) {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+}
+.ideditor[dir='ltr'] .section-selected-features .feature-list-item > button:not(:last-child) {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+}
+.ideditor[dir='rtl'] .section-selected-features .feature-list-item > button:not(:last-child) {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+}
 
 /* Preset List and Icons
 ------------------------------------------------------- */
 .ideditor .preset-list  {
     width: 100%;
     padding: 20px 20px 10px 20px;
-    border-bottom: 1px solid #ccc;
 }
 
 .ideditor .preset-list-item {
@@ -3931,7 +4565,7 @@ display: none;
 }
 
 .ideditor .preset-list-button-wrap {
-    height: 62px;
+    min-height: 62px;
     display: flex;
     border: 1px solid #ccc;
     border-radius: 4px;
@@ -3942,6 +4576,7 @@ display: none;
     height: 100%;
     position: relative;
     display: flex;
+    align-items: center;
 }
 
 .ideditor .preset-list.filtered .preset-list-item:first-child .preset-list-button {
@@ -3956,6 +4591,7 @@ display: none;
     display: flex;
     align-items: center;
     justify-content: center;
+    flex: 0 0 auto;
 }
 .ideditor .preset-icon-container.small {
     width: 40px;
@@ -3965,7 +4601,8 @@ display: none;
 .ideditor .preset-icon-container img.image-icon {
     width: 50px;
     height: 50px;
-    object-fit: contain;
+    -o-object-fit: contain;
+       object-fit: contain;
     border-radius: 2px;
     z-index: 2;
     visibility: hidden;
@@ -3974,7 +4611,7 @@ display: none;
     visibility: visible;
 }
 .ideditor .preset-icon-container.showing-img *:not(.image-icon) {
-    visibility: hidden;
+    display: none;
 }
 
 .ideditor .preset-icon-point-border path {
@@ -3983,6 +4620,15 @@ display: none;
     fill: transparent;
 }
 
+.ideditor .preset-icon-category-border path {
+    stroke: #999;
+    stroke-width: 1px;
+    fill: transparent;
+    -webkit-backface-visibility: hidden;
+            backface-visibility: hidden;
+    vector-effect: non-scaling-stroke;
+}
+
 .ideditor .preset-icon-line {
     margin: auto;
     position: absolute;
@@ -4031,7 +4677,8 @@ display: none;
     stroke-width: 1.5px;
     stroke: #333;
     fill: #efefef;
-    backface-visibility: hidden;
+    -webkit-backface-visibility: hidden;
+            backface-visibility: hidden;
 }
 
 .ideditor .preset-icon {
@@ -4058,7 +4705,7 @@ display: none;
 .ideditor .preset-icon.framed .icon {
     transform: scale(0.4);
 }
-.ideditor .preset-icon.framed.line-geom .icon,
+.ideditor .preset-icon.framed.line-geom:not(.category) .icon,
 .ideditor .preset-icon.framed.route-geom .icon {
     top: 20%;
     transform: translateY(-30%) scale(0.4);
@@ -4069,7 +4716,7 @@ display: none;
 .ideditor .preset-icon-iD.framed .icon {
     transform: scale(0.74);
 }
-.ideditor .preset-icon-iD.framed.line-geom .icon,
+.ideditor .preset-icon-iD.framed.line-geom:not(.category) .icon,
 .ideditor .preset-icon-iD.framed.route-geom .icon {
     transform: translateY(-30%) scale(0.74);
 }
@@ -4081,23 +4728,26 @@ display: none;
     display: flex;
     flex-flow: row wrap;
     align-items: center;
-    background-color: #f6f6f6;
+    background: #f6f6f6;
     text-align: left;
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    right: 0;
     padding: 5px 10px;
-    left: 60px;
     border-left: 1px solid rgba(0, 0, 0, .1);
+    flex: 1 1 100%;
+    align-self: stretch;
 }
 .ideditor[dir='rtl'] .preset-list-button .label {
     text-align: right;
-    left: 0;
-    right: 60px;
     border-left: none;
     border-right: 1px solid rgba(0, 0, 0, .1);
 }
+.ideditor[dir='ltr'] .preset-list-item.mixed-types .preset-list-button .label {
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+}
+.ideditor[dir='rtl'] .preset-list-item.mixed-types .preset-list-button .label {
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+}
 .ideditor[dir='ltr'] .category .preset-list-button .label {
     border-radius: 0px 4px 4px 0px;
 }
@@ -4105,51 +4755,58 @@ display: none;
     border-radius: 4px 0px 0px 4px;
 }
 
+.ideditor .preset-list-item.mixed-types .label {
+    font-style: italic;
+}
+
 .ideditor .preset-list-button .label-inner {
     width: 100%;
+    line-height: 1.35em;
 }
 .ideditor .preset-list-button .label-inner .namepart {
-    height: 17px;
-    white-space: nowrap;
     text-overflow: ellipsis;
-    overflow: hidden;
 }
-.ideditor .preset-list-button .label-inner .namepart:nth-child(2) {
-    font-weight: normal;
+.ideditor .preset-list-button .label-inner .namepart:nth-child(1) {
+    font-weight: bold;
 }
 
-.ideditor .preset-list-button:hover .label,
 .ideditor .preset-list-button:focus .label,
+.ideditor .preset-list-button:active .label,
 .ideditor .preset-list-button.disabled,
 .ideditor .preset-list-button.disabled .label {
     background-color: #ececec;
 }
+@media (hover: hover) {
+    .ideditor .preset-list-button:hover .label {
+        background-color: #ececec;
+    }
+}
 
-.ideditor .preset-list-item button.tag-reference-button {
-    height: 100%;
+.ideditor .preset-list-button-wrap button.tag-reference-button {
     width: 32px;
     flex: 0 0 auto;
+}
+.ideditor .preset-list-button-wrap button.tag-reference-button:not(:hover):not(:active):not(:focus) {
     background: #f6f6f6;
 }
-.ideditor[dir='ltr'] .preset-list-item button.tag-reference-button {
+.ideditor[dir='ltr'] .preset-list-button-wrap button.tag-reference-button {
     border-left: 1px solid #ccc;
 }
-.ideditor[dir='rtl'] .preset-list-item button.tag-reference-button {
+.ideditor[dir='rtl'] .preset-list-button-wrap button.tag-reference-button {
     border-right: 1px solid #ccc;
 }
-.ideditor[dir='ltr'] .preset-list-item button:last-child {
+.ideditor[dir='ltr'] .preset-list-button-wrap:not(.category) button:last-child {
     border-radius: 0 4px 4px 0;
 }
-.ideditor[dir='rtl'] .preset-list-item button:last-child {
+.ideditor[dir='rtl'] .preset-list-button-wrap:not(.category) button:last-child {
     border-radius: 4px 0 0 4px;
 }
-
-.ideditor .preset-list-item button.tag-reference-button:hover {
-    background: #f1f1f1;
-}
-.ideditor .preset-list-item button.tag-reference-button .icon {
+.ideditor .preset-list-button-wrap button.tag-reference-button .icon {
     opacity: .5;
 }
+.ideditor .preset-list-button-wrap .accessory-buttons {
+    display: flex;
+}
 
 
 .ideditor .current .preset-list-button,
@@ -4174,12 +4831,11 @@ display: none;
 }
 
 .ideditor .subgrid .preset-list {
+    width: auto;
     padding: 10px;
-    margin-top: 0;
+    margin: 0 -10px;
     border: 0;
     border-radius: 8px;
-    width: -webkit-calc(100% + 20px);
-    margin-left: -10px;
 }
 .ideditor .subgrid .preset-list > *:last-child {
     margin-bottom: 0;
@@ -4192,7 +4848,7 @@ display: none;
     width: 0;
     height: 0;
     margin-left: 50%;
-    margin-left: -webkit-calc(50% - 10px);
+    margin-left: calc(50% - 10px);
 }
 
 
@@ -4202,44 +4858,24 @@ display: none;
     display: flex;
     flex-flow: row wrap;
     justify-content: flex-end;
-    padding: 0 20px;
+    padding: 5px 0 0 0;
 }
 .ideditor .quick-link {
     margin: 0 5px;
 }
 
-.ideditor .data-editor .quick-links,
-.ideditor .error-editor .quick-links,
-.ideditor .note-editor .quick-links {
-    padding: 5px 0 0 0;
-}
-
 
 /* Entity/Preset Editor
 ------------------------------------------------------- */
-.ideditor .entity-issues,
-.ideditor .preset-editor {
-    overflow: hidden;
-    padding: 10px 0px 5px 0px;
-}
-.ideditor .entity-issues a.hide-toggle,
-.ideditor .preset-editor a.hide-toggle {
-    margin: 0 20px 5px 20px;
-}
-.ideditor .entity-issues .disclosure-wrap-entity_issues,
-.ideditor .preset-editor .form-fields-container {
+.ideditor .section .grouped-items-area {
     padding: 10px;
-    margin: 0 10px 10px 10px;
+    margin: 0 -10px 10px -10px;
     border-radius: 8px;
     background: #ececec;
 }
-.ideditor .entity-issues .disclosure-wrap-entity_issues:empty,
-.ideditor .preset-editor .form-fields-container:empty {
+.ideditor .section .grouped-items-area:empty {
     display: none;
 }
-.ideditor .entity-editor-pane .preset-list-item {
-    margin-bottom: 0;
-}
 
 /*
     The parts of a field:
@@ -4267,10 +4903,7 @@ display: none;
     flex-flow: row wrap;
     margin-bottom: 10px;
     width: 100%;
-    -webkit-transition: margin-bottom 200ms;
-       -moz-transition: margin-bottom 200ms;
-         -o-transition: margin-bottom 200ms;
-            transition: margin-bottom 200ms;
+    transition: margin-bottom 200ms;
 }
 
 .ideditor .form-field.nowrap,
@@ -4283,7 +4916,6 @@ display: none;
     display: flex;
     flex-flow: row nowrap;
     flex: 1 1 100%;
-    height: 30px;
     position: relative;
     font-weight: bold;
     color: #333;
@@ -4293,11 +4925,16 @@ display: none;
     overflow: hidden;
 }
 .ideditor .field-label .label-text {
+    overflow: hidden;
+    text-overflow: ellipsis;
     flex: 1 1 auto;
-    padding: 5px 0 5px 10px;
+    padding: 5px 0 4px 10px;
 }
 .ideditor[dir='rtl'] .field-label .label-text {
-    padding: 5px 10px 5px 0;
+    padding: 5px 10px 4px 0;
+}
+.ideditor .field-label .label-text {
+    white-space: nowrap;
 }
 
 .ideditor .label-text .label-textannotation svg.icon {
@@ -4310,22 +4947,21 @@ display: none;
 }
 
 .ideditor .field-label button {
-    flex: 0 0 32px;
+    flex: 0 0 auto;
     border-left: 1px solid #ccc;
     width: 32px;
-    height: 100%;
     border-radius: 0;
-    background: #f6f6f6;
 }
 .ideditor[dir='rtl'] .field-label button {
     border-left: none;
     border-right: 1px solid #ccc;
 }
-.ideditor .field-label button:hover {
-    background: #f1f1f1;
+.ideditor .field-label button:not(:hover):not(:active):not(:focus) {
+    background: none;
 }
 .ideditor .field-label .icon {
     opacity: .5;
+
 }
 
 .ideditor .field-label .modified-icon,
@@ -4345,7 +4981,6 @@ display: none;
     flex-flow: row nowrap;
     width: 100%;
     flex: 1 1 auto;
-    min-height: 30px;
     border-top: 0;
     border-radius: 0 0 4px 4px;
 }
@@ -4359,23 +4994,19 @@ display: none;
 .ideditor .form-field-input-wrap > textarea,
 .ideditor .form-field-input-wrap > ul.chiplist {
     flex: 1 1 auto;
-    min-height: 30px;
     border: 1px solid #ccc;
     border-top: 0;
     border-radius: 0;
-    overflow: hidden;
     position: relative;
 }
 .ideditor .form-field-input-wrap > textarea {
     height: 65px;
     border-radius: 0 0 4px 4px;
-    overflow: auto;
 }
 
 /* Buttons inside fields */
 .ideditor .form-field-button {
     flex: 0 0 auto;
-    height: 30px;
     width: 32px;
     position: relative;
     background-color: #fff;
@@ -4389,13 +5020,51 @@ display: none;
     border-left-width: 1px;
     border-right-width: 0;
 }
-.ideditor .form-field-button:hover {
+.ideditor .form-field-button:active,
+.ideditor .form-field-button:focus {
     background-color: #f1f1f1;
 }
+@media (hover: hover) {
+    .ideditor .form-field-button:hover {
+        background-color: #f1f1f1;
+    }
+}
 .ideditor .form-field-button .icon {
     fill: #333;
     opacity: .5;
 }
+.ideditor .form-field-button.colour-preview {
+    border-radius: 0 0 4px 0;
+}
+.ideditor .form-field-button.colour-preview > div.colour-box {
+    border: 3px solid #fff;
+    height: 100%;
+    border-radius: 8px;
+    cursor: pointer;
+    text-align: center;
+    line-height: 20px;
+    padding: 1px 0 0 1px;
+}
+.ideditor .inspector-hover .form-field-button.colour-preview > div.colour-box {
+    border-color: #ececec;
+}
+.ideditor .form-field-button.colour-preview:active > div.colour-box,
+.ideditor .form-field-button.colour-preview:focus > div.colour-box {
+    border-color: #f1f1f1;
+}
+@media (hover: hover) {
+    .ideditor .form-field-button.colour-preview:hover > div.colour-box {
+        border-color: #f1f1f1;
+    }
+}
+.ideditor input.colour-selector {
+    visibility: hidden;
+    position: absolute;
+}
+.ideditor input.date-selector {
+    visibility: hidden;
+    position: absolute;
+}
 
 
 /* round corners of first/last child elements */
@@ -4407,10 +5076,10 @@ display: none;
 }
 
 
-/* Field - Access, Cycleway
+/* Field - Access, DirectionalCombo
 ------------------------------------------------------- */
 .ideditor .form-field-input-access,
-.ideditor .form-field-input-cycleway {
+.ideditor .form-field-input-directionalcombo {
     flex: 1 1 auto;
     display: flex;
     flex-flow: row wrap;
@@ -4436,11 +5105,11 @@ display: none;
     display: flex;
     flex-flow: row nowrap;
 }
-.ideditor .form-field ul.rows li.labeled-input > span,
 .ideditor .form-field ul.rows li.labeled-input > div {
     flex: 1 1 auto;
     width: 100%;
     border-radius: 0;
+    line-height: 0.95rem;
 }
 .ideditor .form-field ul.rows li input {
     border-radius: 0;
@@ -4459,6 +5128,28 @@ display: none;
     border-right-width: 1px;
 }
 
+/* Field - lists with labeled input items as table
+------------------------------------------------------- */
+.ideditor .form-field ul.rows.rows-table {
+    display: table;
+    width: 100%;
+}
+.ideditor .form-field ul.rows.rows-table li.labeled-input {
+    display: table-row;
+}
+.ideditor .form-field ul.rows.rows-table li.labeled-input > div:first-child {
+    display: table-cell;
+    width: auto;
+    max-width: 170px;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+.ideditor .form-field ul.rows.rows-table li.labeled-input > div:nth-child(2) {
+    display: table-cell;
+    width: auto;
+}
+
 
 /* Field - Structure
 ------------------------------------------------------- */
@@ -4480,6 +5171,7 @@ display: none;
 ------------------------------------------------------- */
 .ideditor .form-field-input-combo > input:only-of-type {
     border-radius: 0 0 4px 4px;
+    width: 100%;
 }
 .ideditor .form-field-input-combo.empty-combobox input,
 .ideditor .form-field-input-multicombo .empty-combobox input {
@@ -4491,6 +5183,17 @@ display: none;
     display: none;
 }
 
+.ideditor .form-field-input-combo input.raw-value,
+.ideditor .form-field-input-semicombo input.raw-value,
+.ideditor .form-field-input-multicombo input.raw-value {
+    font-family: monospace;
+}
+.ideditor .form-field-input-combo input.known-value,
+.ideditor .form-field-input-semicombo input.known-value,
+.ideditor .form-field-input-multicombo input.known-value {
+    color: #7092ff;
+}
+
 .ideditor .form-field-input-multicombo ul.chiplist {
     padding: 5px 8px 5px 8px;
     background: #fff;
@@ -4502,7 +5205,6 @@ display: none;
 .ideditor .form-field-input-multicombo li {
     display: inline-flex;
     flex-flow: row nowrap;
-    align-items: center;
     margin-bottom: 3px;
     margin-top: 3px;
     border-radius: 4px;
@@ -4517,8 +5219,16 @@ display: none;
 .ideditor .form-field-input-multicombo li.chip {
     background-color: #eff2f7;
     border: 1px solid #ccd5e3;
-    line-height: 25px;
     max-width: 100%;
+    color: #7092ff;
+}
+.ideditor .form-field-input-multicombo li.chip.negated span {
+    text-decoration: line-through;
+}
+.ideditor .form-field-input-multicombo li.chip input {
+    width: 1em;
+    height: 11px;
+    margin-top: 7px;
 }
 .ideditor[dir='ltr'] .form-field-input-multicombo li.chip {
     padding: 2px 0px 2px 5px;
@@ -4534,15 +5244,26 @@ display: none;
     z-index: 3000;
     cursor: grabbing;
 }
+.ideditor .form-field-input-multicombo li.chip.raw-value {
+    font-family: monospace;
+    color: #333;
+}
+.ideditor .form-field-input-multicombo li.mixed {
+    border-color: #eff2f7;
+    color: #888;
+    font-style: italic;
+}
 
-.ideditor .form-field-input-multicombo li.chip span {
+.ideditor .form-field-input-multicombo li.chip > span {
     display: block;
     flex: 1 1 auto;
     overflow: hidden;
     word-wrap: break-word;
+    margin-top: 4px;
 }
 
-.ideditor .form-field-input-multicombo a {
+.ideditor .form-field-input-multicombo a,
+.ideditor .form-field-input-multicombo button {
     font-family: Arial, Helvetica, sans-serif !important;
     font-size: 16px !important;
     padding: 0px 5px 0px 5px;
@@ -4552,17 +5273,48 @@ display: none;
     display: block;
     text-align: center;
     flex: 0 0 auto;
+    background: transparent;
+    border: 0;
+}
+
+.ideditor .form-field-input-multicombo li.chip .field_buttons {
+    display: inline-block;
+    text-align: right;
+    margin-right: 2px;
+    margin-top: 2px;
+    margin-bottom: 2px;
+}
+
+.ideditor .form-field-input-multicombo li.chip .field_buttons a {
+    display: block;
+    float: right;
+    margin-top: -2px;
+    margin-bottom: -2px;
+}
+
+.ideditor[dir='rtl'] .form-field-input-multicombo li.chip .field_buttons a {
+    float: left;
+}
+
+.ideditor .form-field-input-multicombo li.chip .field_buttons button {
+    display: inline-block;
+    margin-right: -4px;
+    margin-top: -4px;
+    margin-bottom: -2px;
+    margin-left: -2px;
+}
+
+.ideditor .form-field-input-multicombo li.chip .field_buttons button:hover {
+    background-color: transparent;
 }
 
 .ideditor .form-field-input-multicombo .input-wrap {
     border: 1px solid #ddd;
-    width: 100px;
-    height: 31px;
+    width: 180px;
 }
 .ideditor .form-field-input-multicombo input {
     border: none;
     width: 100%;
-    height: 100%;
 }
 
 .ideditor .form-field-input-multicombo input:focus {
@@ -4576,15 +5328,70 @@ display: none;
     width: auto;
 }
 
+.ideditor .form-field-input-combo .tag-value-icon,
+.ideditor .form-field-input-semicombo .input-wrap .tag-value-icon,
+.ideditor .form-field-input-multicombo .input-wrap .tag-value-icon {
+    display: inline-block;
+    position: relative;
+    height: 24px;
+    width: 30px;
+    margin-right: -30px;
+    align-self: center;
+    vertical-align: middle;
+    z-index: 1;
+    padding-left: 11px;
+}
+.ideditor[dir='rtl'] .form-field-input-combo .tag-value-icon,
+.ideditor[dir='rtl'] .form-field-input-semicombo .input-wrap .tag-value-icon,
+.ideditor[dir='rtl'] .form-field-input-multicombo .input-wrap .tag-value-icon  {
+    margin-right: 0;
+    margin-left: -30px;
+    padding-left: 0;
+    padding-right: 11px;
+}
+.ideditor .tag-value-icon .icon {
+    width: 21px;
+    height: 21px;
+    margin: auto;
+}
+.ideditor[dir='ltr'] .form-field-input-combo .tag-value-icon + input,
+.ideditor[dir='ltr'] .form-field-input-semicombo .input-wrap .tag-value-icon + input,
+.ideditor[dir='ltr'] .form-field-input-multicombo .input-wrap .tag-value-icon + input {
+    padding-left: 40px;
+}
+.ideditor[dir='rtl'] .form-field-input-combo .tag-value-icon + input,
+.ideditor[dir='rtl'] .form-field-input-semicombo .input-wrap .tag-value-icon + input,
+.ideditor[dir='rtl'] .form-field-input-multicombo .input-wrap .tag-value-icon + input {
+    padding-right: 40px;
+}
+.ideditor .combobox-option .tag-value-icon {
+    display: inline-block;
+    width: 28px;
+}
+.ideditor .form-field-input-multicombo li.chip .tag-value-icon .icon {
+    margin: 0;
+    margin-right: 6px;
+    display: inline-block;
+    vertical-align: center;
+}
+.ideditor[dir='rtl'] .form-field-input-multicombo li.chip .tag-value-icon .icon {
+    margin-right: 6px;
+    margin-left: 0;
+}
+
 
 /* Field - Text / Numeric
 ------------------------------------------------------- */
-.ideditor .form-field-input-text > input:only-of-type,
+.ideditor .form-field-input-text > input:only-child,
 .ideditor .form-field-input-tel > input:only-of-type,
 .ideditor .form-field-input-email > input:only-of-type,
-.ideditor .form-field-input-url > input:only-of-type {
+.ideditor .form-field-input-url > input:only-child {
     border-radius: 0 0 4px 4px;
 }
+.ideditor .form-field-input-text > input:not(:only-child),
+.ideditor .form-field-input-url > input:not(:only-child) {
+    border-radius: 0 0 0 4px;
+}
 .ideditor .form-field-input-number > input:only-of-type {
     border-radius: 0 0 0 4px;
 }
@@ -4644,33 +5451,49 @@ display: none;
 }
 .ideditor .form-field-input-check > input[type="checkbox"] {
     flex: 0 1 auto;
-    min-height: 20px;
-    width: 20px;
     margin-top: 0;
 }
 .ideditor .form-field-input-check > span {
     flex: 1 1 auto;
 }
-.ideditor .form-field-input-check > .reverser.button {
+.ideditor .form-field-input-check > span.mixed {
+    font-style: italic;
+}
+.ideditor .form-field-input-check > .reverser {
     flex: 0 1 auto;
     background-color: #eff2f7;
     border: 1px solid #ccd5e3;
     border-radius: 2px;
     padding: 0px 8px;
+    color: inherit;
 }
-.ideditor[dir='ltr'] .form-field-input-check > .reverser.button {
+.ideditor[dir='ltr'] .form-field-input-check > .reverser {
     padding-right: 2px;
 }
-.ideditor[dir='rtl'] .form-field-input-check > .reverser.button {
+.ideditor[dir='rtl'] .form-field-input-check > .reverser {
     padding-left: 2px;
 }
-.ideditor .form-field-input-check > .reverser.button.hide {
+.ideditor .form-field-input-check > .reverser:active,
+.ideditor .form-field-input-check > .reverser:focus {
+    background: #e3e8ef;
+}
+@media (hover: hover) {
+    .ideditor .form-field-input-check > .reverser:hover {
+        background: #e3e8ef;
+    }
+}
+.ideditor .form-field-input-check > .reverser.hide {
     display: none;
 }
-
-.ideditor .form-field-input-check:hover {
+.ideditor .form-field-input-check:active,
+.ideditor .form-field-input-check:focus {
     background: #f1f1f1;
 }
+@media (hover: hover) {
+    .ideditor .form-field-input-check:hover {
+        background: #f1f1f1;
+    }
+}
 .ideditor .form-field-input-check .set {
     color: inherit;
 }
@@ -4690,19 +5513,28 @@ display: none;
     flex: 1 1 auto;
     display: flex;
     flex-flow: row nowrap;
+    align-items: center;
     width: 100%;
     padding: 5px 10px;
-    height: 30px;
     background-color: #fff;
     color: #7092ff;
     cursor: pointer;
 }
+.ideditor .form-field-input-radio > label.mixed {
+    font-style: italic;
+}
 .ideditor .form-field-input-radio > label:last-child {
     border-radius: 0 0 4px 4px;
 }
-.ideditor .form-field-input-radio > label:hover {
+.ideditor .form-field-input-radio > label:active,
+.ideditor .form-field-input-radio > label:focus {
     background-color: #ececec;
 }
+@media (hover: hover) {
+    .ideditor .form-field-input-radio > label:hover {
+        background-color: #ececec;
+    }
+}
 .ideditor .form-field-input-radio > label.active {
     background-color: #e8ebff;
 }
@@ -4711,7 +5543,6 @@ display: none;
 }
 .ideditor .form-field-input-radio > label > input[type="radio"] {
     flex: 0 1 auto;
-    width: 20px;
 }
 .ideditor .form-field-input-radio > label > span {
     flex: 1 1 auto;
@@ -4726,27 +5557,44 @@ display: none;
     padding: 0;
     opacity: 0;
     width: 0;
-    line-height: 0;
+    height: 0;
     display: block;
     overflow: hidden;
 }
-
-
-/* Field - Maxspeed
-------------------------------------------------------- */
-.ideditor .form-field-input-maxspeed > input:first-of-type {
+
+
+/* Field - roadheight and roadspeed
+------------------------------------------------------- */
+.ideditor .form-field-input-roadheight input.roadheight-number,
+.ideditor .form-field-input-roadheight input.roadheight-secondary-number,
+.ideditor .form-field-input-roadspeed input.roadspeed-number {
+    flex-basis: 0;
+    width: 0;
+}
+.ideditor .form-field-input-roadheight input.roadheight-unit,
+.ideditor .form-field-input-roadheight input.roadheight-secondary-unit {
+    flex: 0 1 auto;
+    width: 60px;
+}
+.ideditor .form-field-input-roadspeed input.roadspeed-unit {
+    flex: 0 1 auto;
+    width: 80px;
+}
+.ideditor[dir='ltr'] .form-field-input-roadheight > input:first-of-type,
+.ideditor[dir='ltr'] .form-field-input-roadspeed > input:first-of-type {
     border-radius: 0 0 0 4px;
 }
-.ideditor[dir='rtl'] .form-field-input-maxspeed > input:first-of-type {
+.ideditor[dir='rtl'] .form-field-input-roadheight > input:first-of-type,
+.ideditor[dir='rtl'] .form-field-input-roadspeed > input:first-of-type {
     border-radius: 0 0 4px 0;
 }
-.ideditor .form-field-input-maxspeed > input:last-of-type {  /* unit field */
-    flex: 0 1 80px;
-    width: 80px;
+.ideditor[dir='ltr'] .form-field-input-roadheight > input:last-of-type,
+.ideditor[dir='ltr'] .form-field-input-roadspeed > input:last-of-type {
     border-left: 0;
     border-radius: 0 0 4px 0;
 }
-.ideditor[dir='rtl'] .form-field-input-maxspeed > input:last-of-type {
+.ideditor[dir='rtl'] .form-field-input-roadheight > input:last-of-type,
+.ideditor[dir='rtl'] .form-field-input-roadspeed > input:last-of-type {
     border-right: 0;
     border-radius: 0 0 0 4px;
 }
@@ -4826,7 +5674,6 @@ display: none;
     flex: 1 1 auto;
     display: flex;
     width: 100%;
-    min-height: 30px;
 }
 
 .ideditor .addr-row > input {
@@ -4861,6 +5708,19 @@ display: none;
 .ideditor[dir='rtl'] .addr-row:last-of-type input:last-of-type {
     border-radius: 0 0 0 4px;
 }
+.ideditor .combobox-address-street-place .combobox-option.address-street,
+.ideditor .combobox-address-street-place .combobox-option.address-place {
+    padding-right: 20px;
+}
+.ideditor .combobox-address-street-place .combobox-option.address-street::after,
+.ideditor .combobox-address-street-place .combobox-option.address-place::after {
+    position: absolute;
+    right: 2px;
+    opacity: 0.4;
+}
+.ideditor .combobox-address-street-place .combobox-option.address-place::after {
+    content: url(data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMCIgeT0iMCIgd2lkdGg9IjIwIiBoZWlnaHQ9IjIwIiB2aWV3Qm94PSIwIDAgMjAgMjAiPg0KICAgIDxwYXRoIGQ9Ik0xMCwzIEM2LjY4NiwzIDQsNS42MTIgNCw4LjgzMyBDNCwxMi4wNTUgMTAsMTcgMTAsMTcgQzEwLDE3IDE2LDEyLjA1NSAxNiw4LjgzMyBDMTYsNS42MTIgMTMuMzE0LDMgMTAsMyB6IE0xMC4xODcsNi41IEMxMS41MTMsNi41IDEyLjU4Nyw3LjU0NSAxMi41ODcsOC44MzMgQzEyLjU4NywxMC4xMjIgMTEuNTEzLDExLjE2NyAxMC4xODcsMTEuMTY3IEM4Ljg2MiwxMS4xNjcgNy43ODcsMTAuMTIyIDcuNzg3LDguODMzIEM3Ljc4Nyw3LjU0NSA4Ljg2Miw2LjUgMTAuMTg3LDYuNSB6IiBmaWxsPSJjdXJyZW50Q29sb3IiLz4NCjwvc3ZnPg==);
+}
 
 
 /* Field - Wikipedia
@@ -4920,10 +5780,9 @@ display: none;
 
 .ideditor .restriction-controls-container .restriction-controls {
     display: table;
-    -moz-user-select: none;
     -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
+       -moz-user-select: none;
+            user-select: none;
 }
 
 .ideditor .restriction-controls .restriction-control {
@@ -4933,13 +5792,13 @@ display: none;
 }
 
 .ideditor .restriction-control input,
-.ideditor .restriction-control span {
+.ideditor .restriction-control > span {
     display: table-cell;
     text-align: start;
     padding: 0px 5px;
 }
 
-.ideditor .restriction-control span.restriction-control-label {
+.ideditor .restriction-control > span.restriction-control-label {
     text-align: end;
 }
 
@@ -4975,11 +5834,9 @@ display: none;
     color: #888;
     text-align: center;
     pointer-events: none;
-
-    -moz-user-select: none;
     -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
+       -moz-user-select: none;
+            user-select: none;
 }
 
 .ideditor .restriction-help span {
@@ -5017,6 +5874,16 @@ display: none;
 
 /* Field - Combobox
 ------------------------------------------------------- */
+.ideditor[dir='ltr'] textarea.combobox-input,
+.ideditor[dir='ltr'] input.combobox-input {
+    /* leave room for the caret */
+    padding-right: 20px;
+}
+.ideditor[dir='rtl'] textarea.combobox-input,
+.ideditor[dir='rtl'] input.combobox-input {
+    padding-left: 20px;
+}
+
 .ideditor div.combobox {
     z-index: 9999;
     display: none;
@@ -5034,15 +5901,20 @@ display: none;
     display: block;
     padding: 5px 10px;
     border-top: 1px solid #ccc;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
+    line-height: 0.95rem;
+    break: all;
 }
 
 .ideditor .combobox a.selected,
-.ideditor .combobox a:hover {
+.ideditor .combobox a:active,
+.ideditor .combobox a:focus {
     background: #ececec;
 }
+@media (hover: hover) {
+    .ideditor .combobox a:hover {
+        background: #ececec;
+    }
+}
 
 .ideditor .combobox a:first-child {
     border-top: 0;
@@ -5052,10 +5924,11 @@ display: none;
 .ideditor .combobox-caret {
     display: inline-block;
     position: relative;
-    height: 30px;
+    height: 5px;
     width: 30px !important;
     margin-left: -30px;
-    vertical-align: top;
+    align-self: center;
+    vertical-align: middle;
     cursor: pointer;
 }
 .ideditor[dir='rtl'] .combobox-caret {
@@ -5074,6 +5947,52 @@ display: none;
     border-right: 5px solid transparent;
 }
 
+.ideditor .combobox .combobox-option.raw-option {
+    font-family: monospace;
+    color: #333;
+}
+
+.ideditor .combobox .combobox-option.virtual-option {
+    font-style: italic;
+    color: #333;
+}
+
+.ideditor .form-field-input-wrap {
+    position: relative;
+}
+
+.ideditor .form-field-input-wrap span.length-indicator-wrap {
+    visibility: hidden;
+    position: absolute;
+    top: -5px;
+    left: 0;
+    right: 0;
+}
+
+.ideditor .form-field-input-wrap input:focus + span.length-indicator-wrap,
+.ideditor .form-field-input-wrap textarea:focus + span.length-indicator-wrap,
+.ideditor .form-field-input-wrap input:focus + div.combobox-caret + span.length-indicator-wrap,
+.ideditor .form-field-input-wrap textarea:focus + div.combobox-caret + span.length-indicator-wrap {
+    visibility: visible;
+}
+
+.ideditor .form-field-input-wrap span.length-indicator {
+    display: block;
+    left: 0;
+    right: 0;
+    height: 4px;
+    background-color: #7092ff;
+    border-right-style: solid;
+    border-right-color: lightgray;
+}
+
+.ideditor .form-field-input-wrap span.length-indicator.limit-reached {
+    border-right-color: red;
+}
+
+.ideditor .tooltip.max-length-warning {
+    z-index: 10;
+}
 
 /* Field Help
 ------------------------------------------------------- */
@@ -5119,10 +6038,17 @@ display: none;
     color: #7092ff;
     border-bottom: 2px solid;
 }
-.ideditor .field-help-nav-item:hover {
+.ideditor .field-help-nav-item:active,
+.ideditor .field-help-nav-item:focus {
     color: #597be7;
     background-color: #efefef;
 }
+@media (hover: hover) {
+    .ideditor .field-help-nav-item:hover {
+        color: #597be7;
+        background-color: #efefef;
+    }
+}
 
 .ideditor .field-help-content {
     padding: 10px;
@@ -5180,12 +6106,9 @@ display: none;
 /* More Fields dropdown
 ------------------------------------------------------- */
 .ideditor .more-fields {
-    padding: 0 20px 20px 20px;
+    margin-top: 10px;
     font-weight: bold;
 }
-.ideditor .changeset-editor .more-fields {
-    padding: 15px 20px 0 20px;
-}
 
 .ideditor .more-fields label {
     display: flex;
@@ -5196,7 +6119,7 @@ display: none;
 
 .ideditor .more-fields input {
     margin-left: 10px;
-    flex: 1 1 50%;
+    flex: 1 1 auto;
 }
 .ideditor[dir='rtl'] .more-fields input {
     margin-left: auto;
@@ -5204,7 +6127,6 @@ display: none;
 }
 
 .ideditor .form-field-input-wrap .label {
-    height: 30px;
     background: #f6f6f6;
     padding: 5px 10px;
 }
@@ -5215,24 +6137,27 @@ display: none;
 .ideditor .raw-tag-options {
     display: flex;
     flex-flow: row nowrap;
-    flex-direction: row-reverse;
-    margin-top: -25px;
-    padding: 0 3px;
+    justify-content: flex-end;
+    margin-top: -28px;
 }
 .ideditor button.raw-tag-option {
-    flex: 0 0 20px;
-    height: 20px;
-    width: 20px;
+    flex: 0 0 auto;
+    padding: 3px;
     background: #aaa;
     color: #eee;
     margin: 0 3px;
 }
 .ideditor button.raw-tag-option:focus,
-.ideditor button.raw-tag-option:hover,
 .ideditor button.raw-tag-option.active {
     color: #fff;
     background: #597be7;
 }
+@media (hover: hover) {
+    .ideditor button.raw-tag-option:hover {
+        color: #fff;
+        background: #597be7;
+    }
+}
 .ideditor button.raw-tag-option.selected {
     color: #fff;
     background: #7092ff;
@@ -5240,12 +6165,9 @@ display: none;
 .ideditor button.raw-tag-option svg.icon {
     width: 14px;
     height: 14px;
-    vertical-align: text-bottom;
+    display: block;
 }
 .ideditor[dir='ltr'] button.raw-tag-option-list {
-    -moz-transform: scaleX(-1);
-    -o-transform: scaleX(-1);
-    -webkit-transform: scaleX(-1);
     transform: scaleX(-1);
     filter: FlipH;
     -ms-filter: "FlipH";
@@ -5255,6 +6177,7 @@ display: none;
 .ideditor .tag-text {
     width: 100%;
     height: 100%;
+    min-height: 32px;
     font-family: monospace;
     white-space: pre;
 }
@@ -5289,7 +6212,6 @@ display: none;
 }
 
 .ideditor .tag-row input {
-    height: 31px;
     border: 0;
     border-radius: 0;
     border-bottom: 1px solid #ccc;
@@ -5327,8 +6249,7 @@ display: none;
     border-top: 1px solid #ccc;
 }
 .ideditor .tag-row button {
-    flex: 0 0 32px;
-    height: 31px;
+    flex: 0 0 auto;
     width: 32px;
     border: 1px solid #ccc;
     border-top-width: 0;
@@ -5339,9 +6260,15 @@ display: none;
     border-right-width: 0;
 }
 
-.ideditor .tag-row button:hover {
+.ideditor .tag-row button:active,
+.ideditor .tag-row button:focus {
     background: #f1f1f1;
 }
+@media (hover: hover) {
+    .ideditor .tag-row button:hover {
+        background: #f1f1f1;
+    }
+}
 .ideditor .tag-row button .icon {
     opacity: .5;
 }
@@ -5391,14 +6318,19 @@ display: none;
 }
 .ideditor .tag-reference-body.expanded {
     padding-bottom: 10px;
-    display: inline-block;
+    padding-left: 10px;
+    display: block;
 }
-.ideditor .tag-reference-description {
-
+.ideditor[dir='rtl'] .tag-reference-body.expanded {
+    padding-left: 0;
+    padding-right: 10px;
 }
 .ideditor .tag-reference-link {
     display: block;
 }
+.ideditor .tag-reference-link .icon:first-child {
+    margin-left: 0;
+}
 
 .ideditor img.tag-reference-wiki-image {
     float: right;
@@ -5432,44 +6364,64 @@ display: none;
 
 /* Raw Member / Membership Editor
 ------------------------------------------------------- */
+.ideditor .section-raw-member-editor .member-list:empty,
+.ideditor .section-raw-membership-editor .member-list:empty {
+    display: none;
+}
 
-.ideditor .raw-member-editor .member-list,
-.ideditor .raw-membership-editor .member-list {
-    padding-top: 10px;
+.ideditor .section-raw-member-editor .member-list,
+.ideditor .section-raw-membership-editor .member-list {
+    position: relative; /* required for drag-and-drop */
+    padding-top: 5px;
 }
-.ideditor .raw-member-editor .member-list li,
-.ideditor .raw-membership-editor .member-list li {
+.ideditor .section-raw-member-editor .member-list li,
+.ideditor .section-raw-membership-editor .member-list li {
     position: relative;
     border-radius: 4px;
     margin: 0;
     padding-bottom: 10px;
 }
-.ideditor .raw-member-editor .member-row .member-entity-name,
-.ideditor .raw-membership-editor .member-row .member-entity-name {
+.ideditor .section-raw-member-editor .member-row .member-entity-name,
+.ideditor .section-raw-membership-editor .member-row .member-entity-name {
     font-weight: normal;
     padding-left: 10px;
 }
+.ideditor .section-raw-member-editor .member-row .member-entity-name.has-colour::before,
+.ideditor .section-raw-membership-editor .member-row .member-entity-name.has-colour::before,
+.ideditor .feature-list .entity-name.has-colour::before,
+.ideditor .combobox-parent-relation .has-colour::before {
+    display: inline-block;
+    content: '';
+    margin-left: -5px;
+    margin-right: 5px;
+    border-style: solid;
+    border-width: 4px;
+    border-radius: 4px;
+    border-color: inherit;
+}
+.ideditor .combobox-parent-relation .has-colour::before  {
+    margin-left: 2px;
+}
 
-.ideditor[dir='rtl'] .raw-member-editor .member-row .member-entity-name,
-.ideditor[dir='rtl'] .raw-membership-editor .member-row .member-entity-name {
+.ideditor[dir='rtl'] .section-raw-member-editor .member-row .member-entity-name,
+.ideditor[dir='rtl'] .section-raw-membership-editor .member-row .member-entity-name {
     padding-left:0;
     padding-right: 10px;
 }
-
-.ideditor .form-field-input-member > input.member-role {
-    border-radius: 0 0 0 4px;
+.ideditor[dir='rtl'] .section-raw-member-editor .member-row .member-entity-name.has-colour::before,
+.ideditor[dir='rtl'] .section-raw-membership-editor .member-row .member-entity-name.has-colour::before,
+.ideditor[dir='rtl'] .feature-list .entity-name.has-colour::before {
+    margin-left: 5px;
+    margin-right: -5px;
 }
-.ideditor[dir='rtl'] .form-field-input-member > input.member-role {
-    border-radius: 0 0 4px 0;
+.ideditor[dir='rtl'] .combobox-parent-relation .has-colour::before  {
+    margin-left: 5px;
+    margin-right: 2px;
 }
 
-.ideditor .member-incomplete .form-field-input-member > input.member-role,
-.ideditor[dir='rtl'] .member-incomplete .form-field-input-member > input.member-role {
-    border-radius: 0 0 4px 4px;
-}
 
-.ideditor .member-incomplete .member-delete {
-    display: none;
+.ideditor .form-field-input-member > input.member-role {
+    border-radius: 0 0 4px 4px;
 }
 
 .ideditor .member-row-new .member-entity-input {
@@ -5478,30 +6430,14 @@ display: none;
     border: 0;
 }
 
-.ideditor .raw-member-editor .member-row.dragging {
+.ideditor .section-raw-member-editor .member-row.dragging {
     opacity: 0.75;
     z-index: 3000;
     /*
-    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
-    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
     box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
     */
 }
 
-/* preserve extra space at bottom of inspector to allow for dropdown options - #5280 */
-.ideditor .raw-membership-editor.inspector-inner {
-    margin-bottom: 150px;
-}
-
-/* hidden field to prevent user from tabbing out of the sidebar */
-.ideditor input.key-trap {
-    height: 0px;
-    width: 0px;
-    padding: 0px;
-    border: 1px solid rgba(0,0,0,0);
-}
-
-
 /* add tag, add relation buttons */
 .ideditor .add-row {
     display: flex;
@@ -5517,13 +6453,18 @@ display: none;
     flex: 0 0 62px;
 }
 .ideditor .add-row button {
-    height: 30px;
+    padding: 5px;
     background: rgba(0,0,0,.5);
 }
 .ideditor .add-row button:focus,
-.ideditor .add-row button:hover {
+.ideditor .add-row button:active {
     background: rgba(0,0,0,.8);
 }
+@media (hover: hover) {
+    .ideditor .add-row button:hover {
+        background: rgba(0,0,0,.8);
+    }
+}
 
 .ideditor .add-tag {
     border-radius: 0 0 4px 4px;
@@ -5534,10 +6475,10 @@ display: none;
 }
 
 
-/* OSM Note / KeepRight Editors
+/* OSM Note / QA Editors
 ------------------------------------------------------- */
 .ideditor .note-header,
-.ideditor .error-header {
+.ideditor .qa-header {
     background-color: #f6f6f6;
     border-radius: 5px;
     border: 1px solid #ccc;
@@ -5547,10 +6488,10 @@ display: none;
 }
 
 .ideditor .note-header-icon,
-.ideditor .error-header-icon {
+.ideditor .qa-header-icon {
     background-color: #fff;
     padding: 10px;
-    flex: 0 0 62px;
+    flex: 0 0 auto;
     position: relative;
     width: 60px;
     height: 60px;
@@ -5558,14 +6499,14 @@ display: none;
     border-radius: 5px 0 0 5px;
 }
 .ideditor[dir='rtl'] .note-header-icon,
-.ideditor[dir='rtl'] .error-header-icon {
+.ideditor[dir='rtl'] .qa-header-icon {
     border-right: unset;
     border-left: 1px solid #ccc;
     border-radius: 0 5px 5px 0;
 }
 
 .ideditor .note-header-icon .icon-wrap,
-.ideditor .error-header-icon .icon-wrap {
+.ideditor .qa-header-icon .icon-wrap {
     position: absolute;
     top: 0px;
 }
@@ -5581,7 +6522,7 @@ display: none;
 }
 
 .ideditor .note-header-label,
-.ideditor .error-header-label {
+.ideditor .qa-header-label {
     background-color: #f6f6f6;
     padding: 0 15px;
     flex: 1 1 100%;
@@ -5590,7 +6531,7 @@ display: none;
     border-radius: 0 5px 5px 0;
 }
 .ideditor[dir='rtl'] .note-header-label,
-.ideditor[dir='rtl'] .error-header-label {
+.ideditor[dir='rtl'] .qa-header-label {
     border-radius: 5px 0 0 5px;
 }
 
@@ -5615,12 +6556,13 @@ display: none;
 }
 .ideditor .comment-avatar {
     padding: 10px;
-    flex: 0 0 62px;
+    flex: 0 0 auto;
 }
 .ideditor .comment-avatar .icon.comment-avatar-icon {
     width: 40px;
     height: 40px;
-    object-fit: cover;
+    -o-object-fit: cover;
+       object-fit: cover;
     border: 1px solid #ccc;
     border-radius: 20px;
 }
@@ -5657,32 +6599,37 @@ display: none;
 }
 
 .ideditor .note-save,
-.ideditor .error-save {
+.ideditor .qa-save {
     padding-top: 20px;
 }
 
-.ideditor .error-details {
-    padding: 10px;
-}
-.ideditor .error-details-container {
+.ideditor .qa-details-container {
     background: #ececec;
     padding: 10px;
     margin-top: 20px;
     border-radius: 4px;
     border: 1px solid #ccc;
+    display: flex;
+    flex-direction: column;
 }
-.ideditor .error-details-description {
-    margin-bottom: 10px;
-}
-.ideditor .error-details-description-text::first-letter {
+.ideditor .qa-details-description-text::first-letter {
     text-transform: capitalize;
 }
-.ideditor[dir='rtl'] .error-details-description-text::first-letter {
+.ideditor[dir='rtl'] .qa-details-description-text::first-letter {
     text-transform: none;  /* #5877 */
 }
+.ideditor .qa-details-subsection h4 {
+    padding-bottom: 2px;
+}
+.ideditor .qa-details-subsection:not(:last-child) {
+    margin-bottom: 10px;
+}
+.ideditor .qa-details-subsection:empty {
+    display: none;
+}
 
 .ideditor .note-save .new-comment-input,
-.ideditor .error-save .new-comment-input {
+.ideditor .qa-save .new-comment-input {
     width: 100%;
     height: 100px;
     max-height: 300px;
@@ -5690,7 +6637,7 @@ display: none;
 }
 
 .ideditor .note-save .detail-section,
-.ideditor .error-save .detail-section {
+.ideditor .qa-save .detail-section {
     margin: 10px 0;
 }
 
@@ -5713,7 +6660,7 @@ display: none;
 .ideditor .data-header-icon {
     background-color: #fff;
     padding: 10px;
-    flex: 0 0 62px;
+    flex: 0 0 auto;
     position: relative;
     width: 60px;
     height: 60px;
@@ -5753,36 +6700,99 @@ display: none;
 }
 
 
+.ideditor .over-map {
+    position: relative;
+    height: 100%;
+    pointer-events: none;
+    display: flex;
+    flex-direction: row-reverse;
+    align-items: flex-end;
+    overflow: hidden;
+}
+.ideditor .over-map > * {
+    pointer-events: auto;
+    z-index: 5;
+}
+/* offscreen this without hiding it */
+.ideditor .over-map .select-trap {
+    position: absolute;
+    right: -1000%;
+    opacity: 0;
+}
+
 /* Map Controls
 ------------------------------------------------------- */
+.ideditor .map-controls-wrap {
+    position: absolute;
+    left: 0;
+    right: 0;
+    height: 100%;
+    z-index: 100;
+    display: block;
+    overflow-x: hidden;
+    overflow-y: auto;
+    pointer-events: none;
+    -ms-overflow-style: none;
+    scrollbar-width: none;
+}
+.ideditor .map-controls-wrap::-webkit-scrollbar {
+    display: none;
+}
 .ideditor .map-controls {
     right: 0;
-    top: 141px;
+    top: 0;
     width: 40px;
     position: absolute;
-    z-index: 100;
+    bottom: 0;
+    display: flex;
+    flex-direction: column;
+    padding: 5px 0;
+    pointer-events: none;
+}
+.ideditor .map-controls:before {
+    content: '';
+    display: inline-block;
+    pointer-events: none;
+    width: 40px;
+    height: 100%;
+    max-height: 70px;
+    flex: 0 1 auto;
 }
 .ideditor[dir='rtl'] .map-controls {
     left: 0;
     right: auto;
 }
 
+.ideditor .map-control {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+}
 .ideditor .map-control > button {
     position: relative;
     width: 40px;
+    height: 40px;
     background: rgba(0,0,0,.5);
     border-radius: 0;
+    pointer-events: auto;
 }
 
-.ideditor .map-control > button:not(.disabled):hover,
-.ideditor .map-control > button:not(.disabled):focus {
+.ideditor .map-control > button:not(.disabled):focus,
+.ideditor .map-control > button:not(.disabled):active {
     background: rgba(0, 0, 0, .8);
 }
-
 .ideditor .map-control > button.active,
-.ideditor .map-control > button.active:hover {
+.ideditor .map-control > button.active:active {
     background: #7092ff;
 }
+@media (hover: hover) {
+    .ideditor .map-control > button:not(.disabled):hover {
+        background: rgba(0, 0, 0, .8);
+    }
+    .ideditor .map-control > button.active:hover {
+        background: #7092ff;
+    }
+}
 
 .ideditor .map-control > button.disabled .icon {
     color: rgba(255, 255, 255, 0.5);
@@ -5792,7 +6802,7 @@ display: none;
 /* Fullscreen Button (disabled)
 ------------------------------------------------------- */
 .ideditor div.full-screen {
-    display: inline-block;
+    /*display: inline-block;*/
     width: 40px;
     margin-right: 10px;
     display: none;
@@ -5807,14 +6817,21 @@ display: none;
     height: 40px;
     background: transparent;
 }
-
-.ideditor div.full-screen > button:hover {
+.ideditor div.full-screen > button:active,
+.ideditor div.full-screen > button:focus {
     background-color: rgba(0, 0, 0, .8);
 }
+@media (hover: hover) {
+    .ideditor div.full-screen > button:hover {
+        background-color: rgba(0, 0, 0, .8);
+    }
+}
 
 
-/* Zoom Buttons
+/* Map Controls
 ------------------------------------------------------- */
+
+/* Zoom in/out buttons */
 .ideditor .zoombuttons > button.zoom-in {
     border-radius: 4px 0 0 0;
 }
@@ -5822,9 +6839,7 @@ display: none;
     border-radius: 0 4px 0 0;
 }
 
-
-/* Geolocate Button
-------------------------------------------------------- */
+/* Geolocate button */
 .ideditor .geolocate-control {
     margin-bottom: 10px;
 }
@@ -5835,6 +6850,12 @@ display: none;
     border-radius: 0 0 4px 0;
 }
 
+/* Zoom to selection button */
+.ideditor .zoom-to-selection-control .icon {
+    width: 22px;
+    height: 22px;
+}
+
 
 /* Background / Map Data / Help Pane buttons
 ------------------------------------------------------- */
@@ -5855,11 +6876,6 @@ display: none;
 
 /* Background / Map Data Settings
 ------------------------------------------------------- */
-.ideditor .map-data-control,
-.ideditor .background-control {
-    position: relative;
-}
-
 .ideditor .imagery-faq {
     margin-bottom: 10px;
     white-space: nowrap;
@@ -5872,7 +6888,6 @@ display: none;
 }
 
 .ideditor .layer-list > li {
-    height: 30px;
     background-color: #fff;
     color: #7092ff;
     position: relative;
@@ -5895,9 +6910,14 @@ display: none;
 .ideditor .layer-list li:not(:last-child) {
     border-bottom: 1px solid #ccc;
 }
-.ideditor .layer-list li:hover {
+.ideditor .layer-list li:active {
     background-color: #ececec;
 }
+@media (hover: hover) {
+    .ideditor .layer-list li:hover {
+        background-color: #ececec;
+    }
+}
 
 .ideditor .layer-list li.active button,
 .ideditor .layer-list li.switch button,
@@ -5909,6 +6929,7 @@ display: none;
 .ideditor .layer-list li.best > div.best {
     padding: 5px;
     flex: 0 0 auto;
+    align-self: center;
 }
 
 .ideditor[dir='rtl'] .list-item-data-browse svg {
@@ -5925,6 +6946,9 @@ display: none;
     padding: 5px 10px;
     cursor: pointer;
     flex: 1 1 auto;
+    display: flex;
+    align-items: center;
+    overflow: hidden;
 }
 
 .ideditor[dir='ltr'] .layer-list .indented label {
@@ -5937,13 +6961,22 @@ display: none;
 .ideditor .layer-list label > span {
     display: block;
     overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
+    width: calc(100% - 20px); /* Ensures radio input width within flexbox */
+}
+
+.ideditor .layer-list label span.localized-text {
+    line-height: 0.95rem;
+}
+
+.ideditor .layer-list input.list-item-input {
+    height: 2.2em;
+    padding: 0px 4px;
+    width: 50%;
+    min-width: 160px;
 }
 
 .ideditor .map-data-pane .layer-list button,
 .ideditor .background-pane .layer-list button {
-    height: 100%;
     border-left: 1px solid #ccc;
     border-radius: 0;
     padding-left: 4px;
@@ -5988,15 +7021,17 @@ display: none;
     display: flex;
     flex-flow: row nowrap;
     cursor: pointer;
+    text-align: initial;
+    background: none;
 }
 
 .ideditor .issue-text .issue-icon {
     flex: 0 0 auto;
-    padding: 5px 7px;
+    padding: 2px 3px;
 }
 .ideditor .issue-text .issue-message {
     flex: 1 1 auto;
-    padding: 5px 0;
+    padding: 4px 5px;
 }
 .ideditor .issue-label .issue-autofix {
     flex: 0 0 auto;
@@ -6034,16 +7069,21 @@ display: none;
     color: #fff;
 }
 .ideditor button.autofix.action:focus,
-.ideditor button.autofix.action:hover,
+.ideditor button.autofix.action:active,
 .ideditor button.autofix.action.active {
     background: #597be7;
 }
+@media (hover: hover) {
+    .ideditor button.autofix.action:hover {
+        background: #597be7;
+    }
+}
 
 /* fix all */
 .ideditor .autofix-all {
     display: flex;
     flex-flow: row nowrap;
-    flex-direction: row-reverse;
+    justify-content: flex-end;
     margin-top: -25px;
     padding-bottom: 5px;
 }
@@ -6069,7 +7109,7 @@ display: none;
 
 .ideditor .warnings-list .issue.severity-warning .issue-label,
 .ideditor .issue.severity-warning .issue-fix-list,
-.ideditor.mode-save .warning-section {
+.ideditor .warning-section {
     background: #ffc;
 }
 
@@ -6077,32 +7117,38 @@ display: none;
     background: #ffa;
 }
 
-.ideditor .warnings-list .issue.severity-warning .issue-label:hover,
-.ideditor .issue.severity-warning .issue-fix-item.actionable:hover {
-    background: #ff8;
-}
-
 .ideditor .issue.severity-warning .issue-icon {
     color: #f90;
 }
 
-.ideditor .issue.severity-warning .issue-fix-item.actionable,
+.ideditor .issue.severity-warning .issue-fix-item button.actionable,
 .ideditor .issue-container.active .issue.severity-warning .issue-info-button {
     color: #b15500;
     fill: #b15500;
-    /*color: #7092ff;*/
-    /*fill: #7092ff;*/
 }
-.ideditor .issue.severity-warning .issue-fix-item.actionable:hover,
-.ideditor .issue-container.active .issue.severity-warning .issue-info-button:hover {
+.ideditor .warnings-list .issue.severity-warning .issue-label:active,
+.ideditor .warnings-list .issue.severity-warning .issue-label:focus,
+.ideditor .issue.severity-warning .issue-fix-item button.actionable:active,
+.ideditor .issue.severity-warning .issue-fix-item button.actionable:focus {
+    background: #ff8;
+}
+.ideditor .issue.severity-warning .issue-fix-item button.actionable:active,
+.ideditor .issue.severity-warning .issue-fix-item button.actionable:focus,
+.ideditor .issue-container.active .issue.severity-warning .issue-info-button:active,
+.ideditor .issue-container.active .issue.severity-warning .issue-info-button:focus {
     color: #7f3d00;
     fill: #7f3d00;
-    /*color: #597be7;*/
-    /*fill: #597be7;*/
 }
-
-.ideditor .notification-badge.warning {
-    color: #ffdf5c;
+@media (hover: hover) {
+    .ideditor .warnings-list .issue.severity-warning .issue-label:hover,
+    .ideditor .issue.severity-warning .issue-fix-item button.actionable:hover {
+        background: #ff8;
+    }
+    .ideditor .issue.severity-warning .issue-fix-item button.actionable:hover,
+    .ideditor .issue-container.active .issue.severity-warning .issue-info-button:hover {
+        color: #7f3d00;
+        fill: #7f3d00;
+    }
 }
 
 
@@ -6116,7 +7162,7 @@ display: none;
 
 .ideditor .errors-list .issue.severity-error .issue-label,
 .ideditor .issue.severity-error .issue-fix-list,
-.ideditor.mode-save .error-section {
+.ideditor .error-section {
     background: #ffd6d6;
 }
 
@@ -6124,32 +7170,37 @@ display: none;
     background: #ffc6c6;
 }
 
-.ideditor .errors-list .issue.severity-error .issue-label:hover,
-.ideditor .issue.severity-error .issue-fix-item.actionable:hover {
-    background: #ffb6b6;
+.ideditor .issue.severity-error .issue-fix-item button.actionable,
+.ideditor .issue-container.active .issue.severity-error .issue-info-button {
+    color: #b91201;
+    fill: #b91201;
 }
-
 .ideditor .issue.severity-error .issue-icon {
     color: #dd1400;
 }
-
-.ideditor .issue.severity-error .issue-fix-item.actionable,
-.ideditor .issue-container.active .issue.severity-error .issue-info-button {
-    color: #b91201;
-    fill: #b91201;
-    /*color: #7092ff;*/
-    /*fill: #7092ff;*/
+.ideditor .errors-list .issue.severity-error .issue-label:active,
+.ideditor .errors-list .issue.severity-error .issue-label:focus,
+.ideditor .issue.severity-error .issue-fix-item button.actionable:active,
+.ideditor .issue.severity-error .issue-fix-item button.actionable:focus {
+    background: #ffb6b6;
 }
-.ideditor .issue.severity-error .issue-fix-item.actionable:hover,
-.ideditor .issue-container.active .issue.severity-error .issue-info-button:hover {
+.ideditor .issue.severity-error .issue-fix-item button.actionable:active,
+.ideditor .issue.severity-error .issue-fix-item button.actionable:focus,
+.ideditor .issue-container.active .issue.severity-error .issue-info-button:active,
+.ideditor .issue-container.active .issue.severity-error .issue-info-button:focus {
     color: #840c00;
     fill: #840c00;
-    /*color: #597be7;*/
-    /*fill: #597be7;*/
 }
-
-.ideditor .notification-badge.error {
-    color: #ff0c05;
+@media (hover: hover) {
+    .ideditor .errors-list .issue.severity-error .issue-label:hover,
+    .ideditor .issue.severity-error .issue-fix-item button.actionable:hover {
+        background: #ffb6b6;
+    }
+    .ideditor .issue.severity-error .issue-fix-item button.actionable:hover,
+    .ideditor .issue-container.active .issue.severity-error .issue-info-button:hover {
+        color: #840c00;
+        fill: #840c00;
+    }
 }
 
 
@@ -6172,6 +7223,7 @@ display: none;
 .ideditor .issues-option label {
     display: table-cell;
     padding: 0 10px;
+    white-space: nowrap;
 }
 
 .ideditor .layer-list.issues-list li.issue {
@@ -6188,28 +7240,28 @@ display: none;
 .ideditor .section-footer {
     display: flex;
     flex-flow: row nowrap;
-    flex-direction: row-reverse;
+    justify-content: flex-end;
     height: 30px;
 }
 .ideditor .section-footer a {
     padding: 5px;
 }
 
-.ideditor .issues-none .box {
+.ideditor .section-issues-status .box {
     border-radius: 4px;
     border: 1px solid #72d979;
     background: #c6ffca;
     padding: 5px !important;
     display: flex;
 }
-.ideditor .issues-none .icon {
+.ideditor .section-issues-status .icon {
     color: #05ac10;
 }
 
 .ideditor input.square-degrees-input {
-    padding: 2px !important; /* important needed for rtl */
-    width: 40px;
-    height: unset;
+    padding: 2px !important; /* important needed for rtl */
+    width: 3em;
+    height: 2em;
     text-align: center;
     background: rgba(0,0,0,0);
     color: currentColor;
@@ -6217,66 +7269,78 @@ display: none;
 
 
 /* Entity Issues List */
-.ideditor .entity-issues .issue-container .issue {
+.ideditor .section-entity-issues .issue-container .issue {
     border-radius: 4px;
     border: 1px solid #ccc;
     background: #f6f6f6;
 }
-.ideditor .entity-issues .issue-container:not(.active) .issue-text:hover,
-.ideditor .entity-issues .issue-container:not(.active) .issue-info-button:hover {
+.ideditor .section-entity-issues .issue-container:not(.active) .issue-text:active,
+.ideditor .section-entity-issues .issue-container:not(.active) .issue-text:focus,
+.ideditor .section-entity-issues .issue-container:not(.active) .issue-info-button:active,
+.ideditor .section-entity-issues .issue-container:not(.active) .issue-info-button:focus {
     background: #f1f1f1;
 }
-.ideditor .entity-issues .issue .issue-label .issue-text {
+@media (hover: hover) {
+    .ideditor .section-entity-issues .issue-container:not(.active) .issue-text:hover,
+    .ideditor .section-entity-issues .issue-container:not(.active) .issue-info-button:hover {
+        background: #f1f1f1;
+    }
+}
+.ideditor .section-entity-issues .issue .issue-label .issue-text {
     padding-right: 10px;
 }
-.ideditor[dir='rtl'] .entity-issues .issue .issue-label .issue-text {
+.ideditor[dir='rtl'] .section-entity-issues .issue .issue-label .issue-text {
     padding-right: unset;
     padding-left: 10px;
 }
 
-.ideditor .entity-issues .issue-container.active .issue-label .issue-text {
+.ideditor .section-entity-issues .issue-container.active .issue-label button.issue-text {
     font-weight: bold;
 }
-.ideditor .entity-issues .issue-container:not(:last-of-type) {
+.ideditor .section-entity-issues .issue-container:not(:last-of-type) {
     margin-bottom: 5px;
 }
-.ideditor .entity-issues .issue-container.active:not(:first-of-type) {
+.ideditor .section-entity-issues .issue-container.active:not(:first-of-type) {
     margin-top: 10px;
 }
-.ideditor .entity-issues .issue-container.active:not(:last-of-type) {
+.ideditor .section-entity-issues .issue-container.active:not(:last-of-type) {
     margin-bottom: 10px;
 }
 
 /* fixes */
-.ideditor .entity-issues .issue-fix-list {
+.ideditor .section-entity-issues .issue-fix-list {
     border-top: 1px solid;
     border-color: inherit;
 }
-.ideditor .entity-issues .issue-container.active .issue-fix-list:empty {
+.ideditor .section-entity-issues .issue-container.active .issue-fix-list:empty {
     display: none;
 }
 
-.ideditor li.issue-fix-item {
+.ideditor li.issue-fix-item button {
     padding: 2px 10px 2px 20px;
+    background: transparent;
+    width: 100%;
+    text-align: initial;
 }
-.ideditor[dir='rtl'] li.issue-fix-item {
+.ideditor[dir='rtl'] li.issue-fix-item button {
     padding: 2px 20px 2px 10px;
 }
-.ideditor li.issue-fix-item:first-of-type {
+.ideditor li.issue-fix-item:first-of-type button {
     padding-top: 5px;
 }
-.ideditor li.issue-fix-item:last-of-type {
+.ideditor li.issue-fix-item:last-of-type button {
     padding-bottom: 5px;
 }
 
-.ideditor li.issue-fix-item .fix-message {
+.ideditor li.issue-fix-item button .fix-message {
     padding: 0 10px;
+    vertical-align: middle;
 }
 
-.ideditor li.issue-fix-item.actionable {
+.ideditor li.issue-fix-item button.actionable {
     cursor: pointer;
 }
-.ideditor li.issue-fix-item:not(.actionable) .fix-icon {
+.ideditor li.issue-fix-item button:not(.actionable) .fix-icon {
     color: #555;
     fill: #555;
 }
@@ -6284,6 +7348,9 @@ display: none;
 .ideditor .issue-container:not(.active) ul.issue-fix-list {
     display: none;
 }
+.ideditor .issue-container:not(.active) .issue-info {
+    display: none;
+}
 
 .ideditor .issue-info {
     flex: 1 1 auto;
@@ -6327,18 +7394,24 @@ display: none;
     padding: 10px;
 }
 
-.ideditor .display-control h5 {
+.ideditor .display-options-container label {
     padding-bottom: 0;
     padding-top: 10px;
 }
 
-.ideditor .display-control h5 span {
+.ideditor .display-options-container label span {
+    font-weight: bold;
     margin: 5px;
 }
 
+.ideditor .display-control .control-wrap {
+    display: flex;
+    align-items: center;
+    width: 100%;
+}
 .ideditor .display-control .display-option-input {
     height: 20px;
-    width: 155px;
+    flex: 1 1 100%;
 }
 
 .ideditor .display-control button {
@@ -6348,6 +7421,7 @@ display: none;
     margin-right: 0px;
     vertical-align: text-bottom;
     border-radius: 4px;
+    flex: 0 0 auto;
 }
 .ideditor[dir='rtl'] .display-control button {
     margin-left: 0px;
@@ -6361,10 +7435,13 @@ display: none;
     border: 1px solid #ccc;
     border-radius: 4px;
     padding: 10px;
+    position: relative;
 }
 
-.ideditor .nudge-container .nudge-instructions {
-    padding-bottom: 15px;
+.ideditor .nudge-container .nudge-controls-wrap {
+    position: relative;
+    width: 100%;
+    overflow: hidden;
 }
 
 .ideditor .nudge-container .nudge-outer-rect {
@@ -6372,13 +7449,18 @@ display: none;
     border: 1px solid #ccc;
     border-radius: 2px;
     padding: 20px 0;
-    width: 70%;
     display: flex;
     justify-content: center;
     align-items: center;
-    margin: 0 auto;
-    margin-top: 20px;
+    margin: 45px;
     cursor: move;
+    /* prevent scrolling pane while dragging on touchscreen */
+    touch-action: none;
+    /* disable drag-to-select */
+    -webkit-user-select: none;
+       -moz-user-select: none;
+            user-select: none;
+    position: relative;
 }
 
 .ideditor .nudge-container .nudge-inner-rect {
@@ -6401,7 +7483,7 @@ display: none;
 
 .ideditor .nudge-container input {
     width: 100%;
-    height: 20px;
+    padding: 2px;
     text-align: center;
     border: 0;
 }
@@ -6412,39 +7494,42 @@ display: none;
     background: #ffb;
 }
 
-.ideditor .nudge-container input:focus {
-    background-color: transparent;
-}
-
 .ideditor .nudge-container button {
-    float: left;
-    display: block;
-    width: 20%;
-    position: relative;
-    background-color: transparent;
+    position: absolute;
+    height: 40px;
+    width: 40px;
+}
+.ideditor .nudge-container button.right,
+.ideditor .nudge-container button.left {
+    top: 0;
+    bottom: 0;
+    margin-top: auto;
+    margin-bottom: auto;
+    vertical-align: middle;
 }
-
 .ideditor .nudge-container button.right {
-    top: -50px;
-    right: -85%;
+    right: 0;
 }
-
 .ideditor .nudge-container button.left {
-    top: -50px;
-    right: 45%;
+    left: 0;
+}
+.ideditor .nudge-container button.top,
+.ideditor .nudge-container button.bottom {
+    left: 0;
+    right: 0;
+    margin-left: auto;
+    margin-right: auto;
 }
-
 .ideditor .nudge-container button.top {
-    left: 20%;
-    top: -104px;
+    top: 0;
 }
-
 .ideditor .nudge-container button.bottom {
-    left: -20%;
+    bottom: 0;
 }
 
 .ideditor .nudge-container button.nudge-reset {
-    right: -10px;
+    right: 0;
+    bottom: 0;
 }
 
 .ideditor .nudge-surface {
@@ -6489,18 +7574,20 @@ display: none;
     flex: 0 1 auto;
     position: relative;
     height: 100%;
+    max-width: 100%;
 }
 .ideditor .map-pane {
     position: relative;
     top: 0;
     width: 400px;
+    max-width: 100%;
     height: 100%;
-    padding-bottom: 60px;
-    overflow: hidden;
     z-index: 10;
+    display: flex;
+    flex-direction: column;
 }
 
-.ideditor .map-pane.help-wrap {
+.ideditor .map-pane.help-pane {
     width: 600px;
 }
 
@@ -6509,7 +7596,7 @@ display: none;
     flex-flow: row nowrap;
     justify-content: space-between;
     border-bottom: 1px solid #ccc;
-    height: 60px;
+    flex: 0 0 auto;
 }
 
 .ideditor .pane-heading h2 {
@@ -6518,123 +7605,118 @@ display: none;
 
 .ideditor .pane-heading button {
     width: 40px;
-    height: 100%;
     border-radius: 0;
 }
 
 .ideditor .pane-content {
     height: 100%;
-    padding: 10px 40px 20px 20px;
+    padding: 10px 50px 20px 20px;
     overflow-x: hidden;
     overflow-y: scroll;
     position: relative;
 }
 .ideditor[dir='rtl'] .pane-content {
-    padding: 10px 20px 20px 40px;
+    padding: 10px 20px 20px 50px;
 }
 
-.ideditor .pane-content > div {
+.ideditor .help-pane .pane-content > div {
     padding-bottom: 15px;
 }
 
 
 /* Help
 ------------------------------------------------------- */
-.ideditor .help-wrap p {
+.ideditor .help-pane p {
     font-size: 15px;
     margin-bottom: 20px;
 }
 
-.ideditor .help-wrap .left-content .body p code {
-    padding: 3px 4px;
-    font-size: 12px;
-    color: #555;
-    vertical-align: baseline;
-    background-color: #f6f6f6;
-    border: solid 1px #ccc;
-    margin: 0 2px;
-    border-bottom-color: #bbb;
-    border-radius: 3px;
-    box-shadow: inset 0 -1px 0 #bbb;
-}
-
-.ideditor .help-wrap .left-content .icon.pre-text {
-    vertical-align: text-top;
+.ideditor .help-pane .left-content .icon.inline,
+.ideditor .curtain-tooltip .icon.inline {
     margin-right: 0;
     margin-left: 0;
-    display: inline-block;
+    height: 1.34em;
+    width: 1.34em;
 }
 
-.ideditor .help-wrap .toc {
-    width: 40%;
+.ideditor .help-pane .toc {
+    width: 100%;
+    max-width: 200px;
     float: right;
     margin-left: 20px;
     margin-bottom: 20px;
     padding-left: 5px;
 }
 
-.ideditor .help-wrap .toc li a,
-.ideditor .help-wrap .nav a {
+.ideditor .help-pane .toc li a,
+.ideditor .help-pane .nav a {
     display: block;
     border: 1px solid #ccc;
     padding: 5px 10px;
 }
 
-.ideditor .help-wrap .toc li a {
+.ideditor .help-pane .toc li a {
     border-bottom: 0;
 }
-
-.ideditor .help-wrap .toc li a:hover,
-.ideditor .help-wrap .nav a:hover {
+.ideditor .help-pane .toc li a:focus,
+.ideditor .help-pane .nav a:focus,
+.ideditor .help-pane .toc li a:active,
+.ideditor .help-pane .nav a:active {
     background: #ececec;
 }
+@media (hover: hover) {
+    .ideditor .help-pane .toc li a:hover,
+    .ideditor .help-pane .nav a:hover {
+        background: #ececec;
+    }
+}
 
-.ideditor .help-wrap .toc li a.selected {
+.ideditor .help-pane .toc li a.selected {
     background: #e8ebff;
 }
 
-.ideditor .help-wrap .toc li:first-child a {
+.ideditor .help-pane .toc li:first-child a {
     border-radius: 4px 4px 0 0;
 }
 
-.ideditor .help-wrap .toc li:nth-last-child(3) a {
+.ideditor .help-pane .toc li:nth-last-child(3) a {
     border-bottom: 1px solid #ccc;
     border-radius: 0 0 4px 4px
 }
 
-.ideditor .help-wrap .toc li.shortcuts a,
-.ideditor .help-wrap .toc li.walkthrough a {
+.ideditor .help-pane .toc li.shortcuts a,
+.ideditor .help-pane .toc li.walkthrough a {
     overflow: hidden;
     margin-top: 10px;
     border-bottom: 1px solid #ccc;
     border-radius: 4px;
 }
 
-.ideditor .help-wrap .toc li.walkthrough a {
+.ideditor .help-pane .toc li.walkthrough a {
     text-align: center;
 }
 
-.ideditor .help-wrap .nav {
+.ideditor .help-pane .nav {
     position: relative;
     padding-bottom: 30px;
 }
 
-.ideditor .help-wrap .nav a {
+.ideditor .help-pane .nav a {
     float: left;
     width: 50%;
     text-align: center;
 }
 
-.ideditor .help-wrap .nav a:first-child {
+.ideditor .help-pane .nav a:first-child {
     border-radius: 4px 0 0 4px;
 }
 
-.ideditor .help-wrap .nav a:last-child:not(:only-child) {
+.ideditor .help-pane .nav a:last-child:not(:only-child) {
     border-radius: 0 4px 4px 0;
     border-left: 0;
 }
 
-.ideditor .help-wrap .nav a:only-child {
+.ideditor .help-pane .nav a:only-child {
     width: 100%;
     border-radius: 4px;
 }
@@ -6642,7 +7724,7 @@ display: none;
 
 /* Inspector (hover styles)
 ------------------------------------------------------- */
-.ideditor .inspector-hover .entity-issues .issue-container .issue .issue-label,
+.ideditor .inspector-hover .section-entity-issues .issue-container .issue .issue-label,
 .ideditor .inspector-hover .form-field-input-wrap .label,
 .ideditor .inspector-hover .form-field-input-multicombo .chiplist,
 .ideditor .inspector-hover .form-field-button,
@@ -6662,7 +7744,7 @@ display: none;
 .ideditor .inspector-hover a,
 .ideditor .inspector-hover .form-field-input-multicombo .chip,
 .ideditor .inspector-hover .form-field-input-check span,
-.ideditor .inspector-hover .entity-issues .issue .icon {
+.ideditor .inspector-hover .section-entity-issues .issue .icon {
     color: #666;
 }
 
@@ -6671,10 +7753,10 @@ display: none;
     border: 1px solid #ccc;
 }
 
-/* no scrollbars */
+/* scrollbars only when necessary*/
 .ideditor .inspector-hover div {
-    overflow-x: hidden;
-    overflow-y: hidden;
+    overflow-x: visible;
+    overflow-y: auto;
 }
 
 /* hide and remove from layout */
@@ -6686,9 +7768,9 @@ display: none;
 .ideditor .inspector-hover .form-field-input-radio label,
 .ideditor .inspector-hover .form-field-input-radio label span,
 .ideditor .inspector-hover .form-field-input-radio label.remove .icon,
-.ideditor .inspector-hover .inspector-inner .add-row,
-.ideditor .inspector-hover .entity-issues .issue-container .issue-fix-list,
-.ideditor .inspector-hover .entity-issues .issue-container .issue-info-button {
+.ideditor .inspector-hover .add-row,
+.ideditor .inspector-hover .section-entity-issues .issue-container .issue-fix-list,
+.ideditor .inspector-hover .section-entity-issues .issue-container .issue-info-button {
     display: none;
 }
 
@@ -6706,17 +7788,17 @@ display: none;
 }
 
 /* Unstyle the active entity issue on hover */
-.ideditor .inspector-hover .entity-issues .issue-container.active {
+.ideditor .inspector-hover .section-entity-issues .issue-container.active {
     margin-top: 1px;
     margin-bottom: 1px;
 }
-.ideditor .inspector-hover .entity-issues .issue-container * {
+.ideditor .inspector-hover .section-entity-issues .issue-container * {
     border-color: #ccc !important;
 }
-.ideditor .inspector-hover .entity-issues .issue-container.active .issue-label {
+.ideditor .inspector-hover .section-entity-issues .issue-container.active .issue-label {
     border-bottom: 0;
 }
-.ideditor .inspector-hover .entity-issues .issue-container.active .issue-label .issue-text {
+.ideditor .inspector-hover .section-entity-issues .issue-container.active .issue-label button.issue-text {
     font-weight: normal;
 }
 
@@ -6779,8 +7861,8 @@ display: none;
     opacity: 1;
     color: #666;
     padding: 5px 10px;
-    line-height: 20px;
     width: 100%;
+    height: auto;
     border: 0;
 }
 .ideditor .inspector-hover .form-field-input-radio .structure-extras-wrap {
@@ -6793,20 +7875,19 @@ display: none;
 .ideditor img.tile {
     position: absolute;
     transform-origin: 0 0;
-    -ms-transform-origin: 0 0;
-    -webkit-transform-origin: 0 0;
-    -moz-transform-origin: 0 0;
-    -o-transform-origin: 0 0;
 
-    -moz-user-select: none;
     -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
+
+       -moz-user-select: none;
+
+            user-select: none;
+
+    pointer-events: none;
+
+    -webkit-user-drag: none;
 
     opacity: 0;
 
-    -webkit-transition: opacity 200ms linear;
-    -moz-transition: opacity 200ms linear;
     transition: opacity 200ms linear;
 }
 
@@ -6831,15 +7912,12 @@ display: none;
     margin-top: -20px;
 
     transform-origin: 0 0;
-    -ms-transform-origin: 0 0;
-    -webkit-transform-origin: 0 0;
-    -moz-transform-origin: 0 0;
-    -o-transform-origin: 0 0;
 
-    -moz-user-select: none;
     -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
+
+       -moz-user-select: none;
+
+            user-select: none;
 }
 
 .ideditor img.tile-debug {
@@ -6849,26 +7927,31 @@ display: none;
 
 /* Map
 ------------------------------------------------------- */
-.ideditor #map {
-    position: relative;
+.ideditor .main-map {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
     overflow: hidden;
     height: 100%;
+    width: 100%;
     background: #000;
-    -moz-user-select: none;
     -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
+       -moz-user-select: none;
+            user-select: none;
+    touch-action: none;
+    -webkit-touch-callout: none;
+}
+.ideditor .main-map * {
+    touch-action: none;
 }
 
-.ideditor #supersurface {
+.ideditor .supersurface {
     transform-origin: 0 0;
-    -ms-transform-origin: 0 0;
-    -webkit-transform-origin: 0 0;
-    -moz-transform-origin: 0 0;
-    -o-transform-origin: 0 0;
 }
 
-.ideditor #supersurface, .ideditor .layer {
+.ideditor .supersurface, .ideditor .layer {
     position: absolute;
     top: 0;
     left: 0;
@@ -6885,9 +7968,10 @@ display: none;
     top: 10px;
     width: 200px;
     height: 150px;
-    z-index: 5;
+    z-index: 2;
     background: #000;
     border: #aaa 1px solid;
+    border-radius: 4px;
     box-shadow: 0 0 2em black;
 }
 .ideditor[dir='ltr'] .map-in-map {
@@ -6899,15 +7983,9 @@ display: none;
 
 .ideditor .map-in-map-tiles {
     transform-origin: 0 0;
-    -ms-transform-origin: 0 0;
-    -webkit-transform-origin: 0 0;
-    -moz-transform-origin: 0 0;
-    -o-transform-origin: 0 0;
-
-    -moz-user-select: none;
     -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
+       -moz-user-select: none;
+            user-select: none;
 }
 
 .ideditor .map-in-map-viewport,
@@ -6980,30 +8058,17 @@ display: none;
 }
 
 
-.ideditor .over-map {
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 71px;
-    bottom: 30px;
-    pointer-events: none;
-    display: flex;
-    flex-direction: row-reverse;
-    align-items: flex-end;
-}
-.ideditor .over-map > * {
-    pointer-events: auto;
-}
-
 /* Information Panels
 ------------------------------------------------------- */
 .ideditor .info-panels {
     display: flex;
-    flex-flow: row-reverse wrap-reverse;
+    flex-flow: row wrap-reverse;
+    justify-content: flex-end;
     width: 100%;
     z-index: 1;
     -ms-user-select: element;
     pointer-events: none;
+    overflow: hidden;
 }
 
 .ideditor .panel-container h1,
@@ -7028,6 +8093,7 @@ display: none;
     border: 1px solid rgba(0, 0, 0, 0.75);
     padding-bottom: 10px;
     width: 250px;
+    max-width: 100%;
     pointer-events: auto;
 }
 
@@ -7037,21 +8103,27 @@ display: none;
 
 .ideditor .panel-title {
     padding: 5px 10px;
+    display: flex;
+    justify-content: space-between;
 }
 
 .ideditor .panel-title button.close {
-    float: right;
-    height: 20px;
+    padding: 2px;
     background: none;
     color: #ddd;
 }
 .ideditor[dir='rtl'] .panel-title button.close {
     float: left;
 }
-
-.ideditor .panel-title button.close:hover {
+.ideditor .panel-title button.close:focus,
+.ideditor .panel-title button.close:active {
     color: #fff;
 }
+@media (hover: hover) {
+    .ideditor .panel-title button.close:hover {
+        color: #fff;
+    }
+}
 .ideditor .panel-title button.close .icon {
     height: 20px;
     width: 16px;
@@ -7062,7 +8134,11 @@ display: none;
     position: relative;
 }
 
-.ideditor .panel-content li span {
+.ideditor .panel-content ul:empty {
+    display: none;
+}
+
+.ideditor .panel-content li span:not(.localized-text) {
     display: inline-block;
     white-space: nowrap;
     margin: 0 8px;
@@ -7097,93 +8173,113 @@ display: none;
 }
 
 
-/* About Section, Attribution, Footer
+/* Map Footer
 ------------------------------------------------------- */
-.ideditor #about {
+.ideditor .map-footer {
     width: 100%;
-    position: absolute;
-    right: 0;
-    bottom: 0;
+    position: relative;
     border-radius: 0;
     pointer-events: none;
     display: flex;
     flex-direction: column;
     -ms-user-select: element;
+    flex: 0 0 auto;
 }
 
-.ideditor #attrib {
-    width: 100%;
-    height: 20px;
-    margin-bottom: 5px;
+.ideditor .map-footer-bar {
+    pointer-events: all;
+    display: block;
+    height: 2.5em;
+    position: relative;
+}
+
+.ideditor .main-footer-wrap,
+.ideditor .flash-wrap {
+    display: flex;
+    flex: 0 0 100%;
+    flex-flow: row nowrap;
+    justify-content: space-between;
+    height: 100%;
+    position: absolute;
+    right: 0;
+    left: 0;
+}
+
+.ideditor .footer-show {
+    bottom: 0px;
+    transition: bottom 75ms linear;
+}
+
+.ideditor .footer-hide {
+    bottom: -100%;
+    transition: bottom 75ms linear;
 }
 
-.ideditor #attrib * { pointer-events: all; }
 
-.ideditor .base-layer-attribution,
-.ideditor .overlay-layer-attribution {
+/* Attribution
+------------------------------------------------------- */
+.ideditor .attribution-wrap {
     position: absolute;
-    color: #ccc;
-    font-size: 10px;
+    bottom: 5px;
+    left: 5px;
+    right: 5px;
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-end;
+    z-index: 0;
+    pointer-events: none;
 }
 
-.ideditor .base-layer-attribution {
-    left: 10px;
+.ideditor .attribution-wrap > * {
+    pointer-events: auto;
 }
 
-.ideditor .overlay-layer-attribution {
-    right: 10px;
+.ideditor .attribution-wrap .base-layer-attribution,
+.ideditor .attribution-wrap .overlay-layer-attribution {
+    color: #ccc;
+    font-size: 10px;
+}
+.ideditor .attribution-wrap .overlay-layer-attribution {
+    text-align: right;
 }
 
-.ideditor .overlay-layer-attribution .attribution:not(:last-child):after {
+.ideditor .attribution-wrap .overlay-layer-attribution .attribution:not(:last-child):after {
     content: '; ';
 }
 
-.ideditor .attribution a,
-.ideditor .attribution a:visited {
+.ideditor .attribution-wrap .attribution a,
+.ideditor .attribution-wrap .attribution a:visited {
     color: #ccf;
 }
-
-.ideditor .attribution a:hover {
+.ideditor .attribution-wrap .attribution a:focus,
+.ideditor .attribution-wrap .attribution a:hover {
     color: #aaf;
 }
+@media (hover: hover) {
+    .ideditor .attribution-wrap .attribution a:hover {
+        color: #aaf;
+    }
+}
 
-.ideditor .attribution .source-image {
+.ideditor .attribution-wrap .attribution .source-image {
     height: 20px;
     vertical-align: middle;
     border-radius: 3px;
 }
 
-.ideditor .attribution span {
+.ideditor .attribution-wrap .attribution span {
     margin: 0 3px;
 }
 
-.ideditor #footer {
-    pointer-events: all;
-    display: block;
-    height: 30px;
-}
-
 
 /* Footer - Flash messages
 ------------------------------------------------------- */
-.ideditor #flash-wrap {
-    display: flex;
-    flex: 0 0 100%;
-    flex-flow: row nowrap;
-    justify-content: space-between;
-    max-height: 30px;
-    position: absolute;
-    right: 0;
-    left: 0;
-}
-
 .ideditor .flash-content {
     display: flex;
     flex: 1 0 auto;
     flex-flow: row nowrap;
     align-items: center;
     padding: 2px;
-    height: 30px;
 }
 
 .ideditor .flash-icon {
@@ -7204,14 +8300,7 @@ display: none;
 .ideditor .flash-icon use {
     color: #222;
 }
-.ideditor .flash-icon.disabled use {
-    color: rgba(32,32,32,0.7);
-}
-
-.ideditor .flash-icon.operation use {
-    fill: #222;
-    color: #79f;
-}
+.ideditor .flash-icon.disabled use,
 .ideditor .flash-icon.operation.disabled use {
     fill: rgba(32,32,32,0.7);
     color: rgba(40,40,40,0.7);
@@ -7221,136 +8310,86 @@ display: none;
     flex: 1 1 auto;
 }
 
-.ideditor #footer-wrap {
-    display: flex;
-    flex: 0 0 100%;
-    flex-flow: row nowrap;
-    justify-content: space-between;
-    max-height: 30px;
-    position: absolute;
-    right: 0;
-    left: 0;
-}
-
-.ideditor .footer-show {
-    bottom: 0px;
-    transition: bottom 75ms linear;
-    -moz-transition: bottom 75ms linear;
-    -webkit-transition: bottom 75ms linear;
-}
-
-.ideditor .footer-hide {
-    bottom: -35px;
-    transition: bottom 75ms linear;
-    -moz-transition: bottom 75ms linear;
-    -webkit-transition: bottom 75ms linear;
-}
-
-
-/* Footer - Scale bar, About, Source Switcher
+/* Scale bar
 ------------------------------------------------------- */
-.ideditor #scale-block {
+.ideditor .map-footer-bar .scale-block {
     vertical-align: bottom;
     width: 250px;
-    max-height: 30px;
-    flex: 0 0 250px;
-    -moz-user-select: none;
+    flex: 0 0 auto;
     -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-}
-
-.ideditor #info-block {
-    max-height: 30px;
-    flex: 1 1 auto;
+       -moz-user-select: none;
+            user-select: none;
+    height: 30px;
+    align-self: center;
 }
 
-.ideditor #scale {
-    height: 30px;
+.ideditor .scale-block .scale {
+    height: 100%;
     width: 100%;
+    cursor: pointer;
+    display: block;
 }
-.ideditor[dir='rtl'] #scale {
+.ideditor[dir='rtl'] .scale-block .scale {
     transform: scaleX(-1);
 }
 
-.ideditor #scale:hover {
-    cursor: pointer;
-}
-
-.ideditor #scale text {
-    font: 12px sans-serif;
-    stroke: none;
-    fill: #ccc;
-    text-anchor: start;
-}
-.ideditor[dir='rtl'] #scale text {
-    transform: scaleX(-1);
+.ideditor .scale-block .scale-text {
+    display: inline-block;
+    position: absolute;
+    color: #ccc;
+    top: 0.45em;
 }
 
-.ideditor #scale path {
+.ideditor .scale-block .scale path {
     fill: none;
     stroke: #ccc;
     stroke-width: 1;
     shape-rendering: crispEdges;
 }
 
-.ideditor #about-list {
-    text-align: right;
-    margin-right: 10px;
-    clear: right;
+/* Footer - About, Source Switcher
+------------------------------------------------------- */
+.ideditor .map-footer-bar .info-block {
+    flex: 1 1 100%;
     overflow: hidden;
 }
-.ideditor[dir='rtl'] #about-list {
-    text-align: left;
-    clear: left;
-    margin-left: 10px;
-    margin-right: 0;
+
+.ideditor .map-footer-list {
+    display: flex;
+    flex-flow: row nowrap;
+    height: 100%;
+    justify-content: flex-end;
 }
 
-.ideditor #about-list li {
-    float: right;
-    border-left: 1px solid rgba(255,255,255,.5);
-    padding: 5px 0 5px 5px;
-    margin-left: 5px;
+.ideditor .map-footer-list li {
+    height: 100%;
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+    padding: 5px;
 }
-.ideditor[dir='rtl'] #about-list li {
-    float: left;
-    border-left: none;
+.ideditor[dir='ltr'] .map-footer-list li:not(:last-child) {
     border-right: 1px solid rgba(255,255,255,.5);
-    margin-left: 0;
-    margin-right: 5px;
-    padding: 5px 5px 5px 0;
-}
-.ideditor #about-list li:empty {
-    display: none;
 }
-
-.ideditor #about-list li:last-child {
-    border-left: 0;
-    margin-left: 0;
-    padding-left: 0;
+.ideditor[dir='rtl'] .map-footer-list li:not(:last-child) {
+    border-left: 1px solid rgba(255,255,255,.5);
 }
-.ideditor[dir='rtl'] #about-list li:last-child {
-    border-right: none;
+.ideditor .map-footer-list li:empty {
+    display: none;
 }
 
-.ideditor #about-list a.chip {
-    padding: 2px 4px 3px 4px;
+.ideditor .map-footer-list a.chip {
+    padding: 1px 4px 1px 4px;
     border-radius: 2px;
     color: #eee;
 }
-.ideditor #about-list a.chip .icon {
+.ideditor .map-footer-list a.chip .icon {
     width: 14px;
     height: 14px;
-    margin-top: 3px;
-}
-.ideditor[dir='ltr'] #about-list a.chip .icon,
-.ideditor[dir='ltr'] #about-list a.chip span {
-    margin-right: 3px;
+    margin-top: -2px;
 }
-.ideditor[dir='rtl'] #about-list a.chip .icon,
-.ideditor[dir='rtl'] #about-list a.chip span {
-    margin-left: 3px;
+.ideditor .map-footer-list a.chip span.count {
+    margin: 0 3px;
 }
 
 .ideditor .source-switch a.chip.live {
@@ -7388,6 +8427,9 @@ display: none;
 .ideditor[dir='rtl'] .api-status {
     text-align: left;
 }
+.ideditor .api-status:empty {
+    display: none;
+}
 
 .ideditor .api-status.offline,
 .ideditor .api-status.readonly,
@@ -7400,37 +8442,45 @@ display: none;
     color: #ccc;
     pointer-events: all;
 }
-.ideditor .api-status a:hover {
+.ideditor .api-status a:focus,
+.ideditor .api-status a:active {
     color: inherit;
 }
+@media (hover: hover) {
+    .ideditor .api-status a:hover {
+        color: inherit;
+    }
+}
+
+.ideditor .local-storage-full {
+    display: block;
+    width: 100%;
+}
 
 /* Notification Badges
 ------------------------------------------------------- */
 /* For an icon (e.g. new version) */
 .ideditor .badge {
-    display: inline-block;
+    display: inline-flex;
     background: #d32232;
     width: 21px;
-    height: 20px;
-    border-radius: 11px;
+    height: 21px;
+    border-radius: 50%;
+    align-items: center;
+    justify-content: center;
+}
+.ideditor[dir='ltr'] .badge {
     margin-left: 6px;
 }
 .ideditor[dir='rtl'] .badge {
-    margin-left: 0;
     margin-right: 6px;
 }
-.ideditor .badge a {
-    margin-right: 5px;
-}
-.ideditor[dir='rtl'] .badge a {
-    margin-right: 0;
-    margin-left: 5px;
-}
 .ideditor .badge .icon {
     vertical-align: baseline;
     width: 11px;
     height: 11px;
     color: #fff;
+    flex: 0 0 auto;
 }
 
 /* For text (e.g. upcoming events) */
@@ -7455,18 +8505,23 @@ display: none;
 /* Modals / Prompts
 ------------------------------------------------------- */
 .ideditor .modal {
-    top: 40px;
-    display: inline-block;
-    position: absolute;
+    top: 5%;
+    max-height: 90%;
+    position: relative;
     border-radius: 3px;
     overflow: hidden;
-    left: 0;
-    right: 0;
     margin: auto;
     z-index: 50;
-    width: 50%;
+    width: 80%;
     min-width: 200px;
-    max-width: 600px;
+    max-width: 550px;
+    display: flex;
+    flex-direction: column;
+}
+
+.ideditor .modal .content {
+    overflow-x: hidden;
+    overflow-y: auto;
 }
 
 .ideditor .modal .loader {
@@ -7499,8 +8554,8 @@ display: none;
 .ideditor .modal-section p:not(:last-of-type) {
     padding-bottom: 20px;
 }
-.ideditor .modal-section.header h3 {
-    padding: 0;
+.ideditor .modal-section h4 {
+    padding-bottom: 0;
 }
 .ideditor .modal-section.buttons {
     text-align: center;
@@ -7513,15 +8568,12 @@ display: none;
 .ideditor .modal-section.buttons .action {
     display: inline-block;
     margin: 0 10px;
-    text-align: center;
-    vertical-align: middle;
 }
 
 .ideditor .save-section .buttons {
     display: flex;
     flex-wrap: wrap;
     justify-content: space-around;
-    margin-bottom: 30px;
 }
 
 .ideditor .save-section .buttons .action,
@@ -7539,17 +8591,13 @@ display: none;
     display: flex;
 }
 .ideditor .modal-actions button {
-    font-weight: normal;
     color: #7092ff;
     border-bottom: 1px solid #ccc;
     border-radius: 0;
-    height: 160px;
+    min-height: 160px;
     text-align: center;
     width: 100%;
 }
-.ideditor .modal-actions button:hover {
-    background-color: #ececec;
-}
 
 .ideditor .logo-small {
     height: 40px;
@@ -7594,10 +8642,12 @@ display: none;
 }
 
 .ideditor .save-summary,
+.ideditor .save-supporting,
 .ideditor .save-communityLinks {
     padding: 0px 20px 15px 20px;
 }
 
+.ideditor .save-supporting,
 .ideditor .save-communityLinks {
     border-top: 1px solid #ccc;
 }
@@ -7624,8 +8674,12 @@ display: none;
 .ideditor .save-success td.community-detail {
     padding-bottom: 15px;
 }
+.ideditor .save-success .community-table h3 {
+    margin: 0;
+}
 
 .ideditor .summary-view-on-osm,
+.ideditor .support-the-map,
 .ideditor .community-name {
     font-size: 14px;
     font-weight: bold;
@@ -7682,41 +8736,56 @@ display: none;
     color: #7092ff;
 }
 
+.ideditor .modal-splash .section-preferences-third-party {
+    margin-top: 20px;
+}
+
+.ideditor .modal-splash .section-preferences-third-party .privacy-link {
+    display: none;
+}
+
 
 /* Shortcuts Modal
 ------------------------------------------------------- */
 .ideditor .modal-shortcuts {
     width: 90%;
-    max-width: 950px;
+    max-width: 1050px;
 }
 
 .ideditor .modal-shortcuts .modal-section:last-child {
-    padding-top: 10px;
+    padding: 10px 15px 20px 15px;
     min-height: 275px;
 }
 
 .ideditor .modal-shortcuts .tabs-bar {
-    text-align: center;
     padding-bottom: 5px;
-    font-size: 16px;
-    font-weight: bold;
+    text-align: center;
 }
 
-.ideditor .modal-shortcuts .tab {
+.ideditor .modal-shortcuts a.tab {
     display: inline-block;
     padding: 5px 10px;
     margin: 0 5px;
     cursor: pointer;
     color: #666;
+    font-size: 16px;
+    font-weight: bold;
 }
-.ideditor .modal-shortcuts .tab.active {
+.ideditor .modal-shortcuts a.tab.active {
     color: #7092ff;
     border-bottom: 2px solid;
 }
-.ideditor .modal-shortcuts .tab:hover {
+.ideditor .modal-shortcuts a.tab:focus,
+.ideditor .modal-shortcuts a.tab:active {
     color: #597be7;
     background-color: #efefef;
 }
+@media (hover: hover) {
+    .ideditor .modal-shortcuts a.tab:hover {
+        color: #597be7;
+        background-color: #efefef;
+    }
+}
 
 .ideditor .modal-shortcuts .shortcut-tab {
     display: flex;
@@ -7755,15 +8824,6 @@ display: none;
     color: #555;
 }
 
-.ideditor svg.mouseclick use.left {
-    fill: rgba(112, 146, 255, 1);
-    color: rgba(112, 146, 255, 0);
-}
-.ideditor svg.mouseclick use.right {
-    fill: rgba(112, 146, 255, 0);
-    color: rgba(112, 146, 255, 1);
-}
-
 .ideditor .modal-shortcuts .shortcut-keys .gesture {
     color: #333;
     padding: 3px;
@@ -7780,6 +8840,16 @@ display: none;
 .ideditor .settings-custom-background .instructions-template {
     margin-bottom: 20px;
 }
+.ideditor .settings-custom-background .instructions-template p {
+    margin-bottom: 0;
+}
+.ideditor .settings-custom-background .instructions-template ul {
+    padding-bottom: 20px;
+}
+.ideditor .settings-custom-background .instructions-template ul li {
+    list-style-type: disc;
+    list-style-position: inside;
+}
 
 .ideditor .settings-custom-data .instructions-url {
     margin-bottom: 10px;
@@ -7792,34 +8862,20 @@ display: none;
 
 /* Save Mode
 ------------------------------------------------------- */
-.ideditor.mode-save a.user-info {
+.ideditor a.user-info {
     display: inline-block;
 }
 
-.ideditor.mode-save .commit-form {
+.ideditor .commit-form {
     margin-bottom: 0;
 }
 
-.ideditor.mode-save .user-info img {
-    float: left;
-}
-
-.ideditor.mode-save h3 small.count {
-    margin-right: 10px;
-    text-align: center;
+.ideditor .user-info img {
     float: left;
-    height: 12px;
-    min-width: 12px;
-    font-size: 12px;
-    line-height: 12px;
-    border-radius: 24px;
-    padding: 5px;
-    background: #7092ff;
-    color: #fff;
 }
 
 .ideditor .note-save .field-warning,
-.ideditor.mode-save .field-warning {
+.ideditor .field-warning {
     background: #ffb;
     border: 1px solid #ccc;
     border-radius: 4px;
@@ -7827,62 +8883,48 @@ display: none;
 }
 
 .ideditor .note-save .field-warning:empty,
-.ideditor.mode-save .field-warning:empty {
+.ideditor .field-warning:empty {
     display: none;
 }
 
-.ideditor.mode-save .field-warning,
-.ideditor.mode-save .changeset-info,
-.ideditor.mode-save .request-review,
-.ideditor.mode-save .commit-info {
+.ideditor .changeset-info,
+.ideditor .request-review,
+.ideditor .commit-info {
     margin-bottom: 10px;
 }
 
-.ideditor.mode-save .request-review label {
+.ideditor .field-warning {
+    margin-top: 10px;
+}
+
+.ideditor .request-review label {
     cursor: pointer;
 }
 
-.ideditor.mode-save .changeset-list {
+.ideditor .changeset-list {
     border: 1px solid #ccc;
     border-radius: 4px;
     background: #fff;
     margin-bottom: 10px;
+    overflow: hidden;
 }
 
-.ideditor.mode-save .warning-section .changeset-list button {
-    border-left: 1px solid #ccc;
+.ideditor .changeset-list li button {
+    padding: 5px 10px;
+    width: 100%;
+    border-radius: 0;
+    text-align: initial;
 }
-
-.ideditor.mode-save .changeset-list li {
-    position: relative;
+.ideditor .changeset-list li {
     border-top: 1px solid #ccc;
-    padding: 5px 10px;
-    cursor: pointer;
 }
-
-.ideditor.mode-save .changeset-list li:hover {
-    background-color: #ececec;
+.ideditor .changeset-list li:first-child {
+    border-top: 0;
 }
-
-.ideditor.mode-save .changeset-list .alert {
+.ideditor .changeset-list .alert {
     opacity: 0.5;
 }
 
-.ideditor .changeset-list li span.count {
-    font-size: 10px;
-    color: #555;
-}
-
-.ideditor.mode-save .commit-section .changeset-list button {
-    border-left: 1px solid #ccc;
-}
-
-.ideditor .changeset-list li span.count:before { content: '('; }
-
-.ideditor .changeset-list li span.count:after { content: ')'; }
-
-.ideditor .changeset-list li:first-child { border-top: 0;}
-
 
 /* Conflict resolution
 ------------------------------------------------------- */
@@ -7896,7 +8938,7 @@ display: none;
     padding: 20px;
 }
 
-.ideditor.mode-save button.conflicts-button {
+.ideditor button.conflicts-button {
     float: left;
 }
 
@@ -7947,15 +8989,21 @@ display: none;
 .ideditor .notice .zoom-to {
     margin: auto;
     width: 300px;
-    height: 70px;
+    padding: 20px 5px;
     font-size: 150%;
     border-radius: 8px;
+    font-weight: bold;
 }
 
-.ideditor .notice .zoom-to:hover,
-.ideditor .notice .zoom-to:focus {
+.ideditor .notice .zoom-to:focus,
+.ideditor .notice .zoom-to:active {
     background: rgba(0,0,0,0.6);
 }
+@media (hover: hover) {
+    .ideditor .notice .zoom-to:hover {
+        background: rgba(0,0,0,0.6);
+    }
+}
 
 .ideditor .notice .zoom-to .icon {
     width: 30px;
@@ -8044,53 +9092,6 @@ display: none;
     background-color: #fff;
 }
 
-.ideditor .tail {
-    width: 200px;
-    height: 400px;
-    pointer-events: none;
-    opacity: .8;
-    margin-top: -200px;
-    position: absolute;
-    background: transparent;
-}
-.ideditor .tail::after {
-    content: "";
-    position: absolute;
-    width: 0;
-    height: 0;
-    border-color: transparent;
-    border-style: solid;
-    top: 50%;
-    right: -5px;
-    margin-top: -5px;
-    border-left-color: #fff;
-    border-width: 5px 0 5px 5px;
-}
-
-.ideditor .tail div {
-    border-radius: 3px;
-    padding: 10px;
-    background: #fff;
-    position: absolute;
-    top: 180px;
-    left: 0;
-    right: 0;
-    margin: auto;
-}
-
-.ideditor .left.tail::after {
-    content: "";
-    position: absolute;
-    width: 0;
-    height: 0;
-    border-color: transparent;
-    border-style: solid;
-    top: 50%;
-    left: -5px;
-    margin-top: -5px;
-    border-right-color: #fff;
-    border-width: 5px 5px 5px 0;
-}
 .ideditor .popover-arrow {
     position: absolute;
     width: 0;
@@ -8158,22 +9159,26 @@ display: none;
 /* dark tooltips for sidebar / panels */
 .ideditor .tooltip.dark.top .popover-arrow,
 .ideditor .map-pane .tooltip.top .popover-arrow,
-.ideditor #sidebar .tooltip.top .popover-arrow {
+.ideditor .sidebar .tooltip.top .popover-arrow,
+.ideditor .modal .tooltip.top .popover-arrow {
     border-top-color: #000;
 }
 .ideditor .tooltip.dark.bottom .popover-arrow,
 .ideditor .map-pane .tooltip.bottom .popover-arrow,
-.ideditor #sidebar .tooltip.bottom .popover-arrow {
+.ideditor .sidebar .tooltip.bottom .popover-arrow,
+.ideditor .modal .tooltip.bottom .popover-arrow {
     border-bottom-color: #000;
 }
 .ideditor .tooltip.dark.left .popover-arrow,
 .ideditor .map-pane .tooltip.left .popover-arrow,
-.ideditor #sidebar .tooltip.left .popover-arrow {
+.ideditor .sidebar .tooltip.left .popover-arrow,
+.ideditor .modal .tooltip.left .popover-arrow {
     border-left-color: #000;
 }
 .ideditor .tooltip.dark.right .popover-arrow,
 .ideditor .map-pane .tooltip.right .popover-arrow,
-.ideditor #sidebar .tooltip.right .popover-arrow {
+.ideditor .sidebar .tooltip.right .popover-arrow,
+.ideditor .modal .tooltip.right .popover-arrow {
     border-right-color: #000;
 }
 .ideditor .tooltip.dark .popover-inner,
@@ -8182,15 +9187,16 @@ display: none;
 .ideditor .map-pane .popover-inner,
 .ideditor .map-pane .tooltip-heading,
 .ideditor .map-pane .keyhint-wrap,
-.ideditor #sidebar .popover-inner,
-.ideditor #sidebar .tooltip-heading,
-.ideditor #sidebar .keyhint-wrap {
+.ideditor .sidebar .popover-inner,
+.ideditor .sidebar .tooltip-heading,
+.ideditor .sidebar .keyhint-wrap,
+.ideditor .modal .popover-inner {
     background: #000;
     color: #ccc;
 }
 .ideditor .tooltip.dark kbd,
 .ideditor .map-pane .tooltip kbd,
-.ideditor #sidebar .tooltip kbd {
+.ideditor .sidebar .tooltip kbd {
     background-color: #666;
     border: solid 1px #444;
     border-bottom-color: #333;
@@ -8227,84 +9233,44 @@ display: none;
 }
 
 
-/* Contextual Radial Menu (deprecated)
-------------------------------------------------------- */
-.ideditor .radial-menu-tooltip {
-    opacity: 0.8;
-    display: none;
-    position: absolute;
-    width: 200px;
-}
-
-.ideditor .radial-menu-background {
-    fill: none;
-    stroke: black;
-    stroke-opacity: 0.5;
-}
-
-.ideditor .radial-menu-item circle {
-    fill: #eee;
-}
-
-.ideditor .radial-menu-item circle:active,
-.ideditor .radial-menu-item circle:hover {
-    fill: #fff;
-}
-
-.ideditor .radial-menu-item.disabled circle {
-    cursor: auto;
-    fill: rgba(255,255,255,.5);
-}
-
-.ideditor .radial-menu-item use {
-    fill: #222;
-    color: #79f;
-}
-
-.ideditor .radial-menu-item.disabled use {
-    fill: rgba(32,32,32,.5);
-    color: rgba(40,40,40,.5);
-}
-
-
 /* Contextual Edit Menu
 ------------------------------------------------------- */
-.ideditor .edit-menu-tooltip {
-    width: 200px;
+.ideditor .edit-menu {
+    position: absolute;
+    display: flex;
+    flex-direction: column;
+    background: #fff;
+    border-radius: 4px;
+    /* padding is set in edit_menu.js */
 }
 
-.ideditor .edit-menu-background {
-    fill: #eee;
+.ideditor .edit-menu .tooltip {
+    width: 200px; /* see also edit_menu.js */
 }
 
-.ideditor .edit-menu-item rect {
-    fill: #eee;
-    cursor: default;
+.ideditor .edit-menu-item {
+    display: flex;
+    align-items: center;
+    border-radius: 0;
+    padding: 0 12px;
+    /* height is set in edit_menu.js */
 }
-
-.ideditor .edit-menu-item rect:active,
-.ideditor .edit-menu-item rect:hover {
-    fill: #ccc;
+.ideditor .edit-menu-item .label {
+    max-width: 120px;
+    text-align: initial;
+    line-height: 1.1em;
+    font-weight: bold;
 }
-
-.ideditor .edit-menu-item.disabled rect {
-    cursor: not-allowed;
+.ideditor[dir='ltr'] .edit-menu-item .label {
+    margin-left: 8px;
 }
-.ideditor .edit-menu-item.disabled rect:hover {
-    cursor: not-allowed;
-    fill: #eee;
+.ideditor[dir='rtl'] .edit-menu-item .label {
+    margin-right: 8px;
 }
 
 .ideditor .edit-menu-item use {
-    fill: #222;
-    color: #79f;
     pointer-events: none;
 }
-.ideditor .edit-menu-item.disabled use {
-    fill: rgba(32,32,32,.2);
-    color: rgba(40,40,40,.2);
-}
-
 
 /* Lasso
 ------------------------------------------------------- */
@@ -8320,10 +9286,9 @@ display: none;
 /* Scrollbars
  ----------------------------------------------------- */
 .ideditor ::-webkit-scrollbar {
-    height: 20px;
+    height: 10px;
     overflow: visible;
     width: 10px;
-    background: #fff;
     border-left: 1px solid #DDD;
 }
 
@@ -8340,14 +9305,27 @@ display: none;
     border-width: 3px 3px 3px 4px;
     border-radius: 6px;
 }
-.ideditor ::-webkit-scrollbar-track:hover,
 .ideditor ::-webkit-scrollbar-track:active {
     background-color: rgba(0,0,0,.05);
 }
+@media (hover: hover) {
+    .ideditor ::-webkit-scrollbar-track:hover {
+        background-color: rgba(0,0,0,.05);
+    }
+}
+body {
+    scrollbar-width: 10px;
+}
 
 
 /* Intro walkthrough
  ----------------------------------------------------- */
+.ideditor .curtain {
+    z-index: 1000;
+    pointer-events: none;
+    position: absolute;
+}
+
 .ideditor .curtain-darkness {
     pointer-events: all;
     fill-opacity: 0.7;
@@ -8383,7 +9361,8 @@ display: none;
 
 .ideditor .intro-nav-wrap button.chapter {
     flex: 1 1 100%;
-    padding: 0px 20px;
+    padding: 0px 5px;
+    font-weight: bold;
 }
 
 .ideditor .intro-nav-wrap button.chapter.next {
@@ -8409,6 +9388,10 @@ display: none;
     display: inline-block;
 }
 
+.ideditor .curtain-tooltip {
+    z-index: 1002;
+}
+
 .ideditor .curtain-tooltip.tooltip.in {
     opacity: 1;
 }
@@ -8470,10 +9453,9 @@ display: none;
 }
 
 .ideditor .curtain-tooltip.intro-mouse {
-    -moz-user-select: none;
     -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
+       -moz-user-select: none;
+            user-select: none;
 }
 
 .ideditor .curtain-tooltip.intro-mouse .counter {
@@ -8500,7 +9482,6 @@ display: none;
 
 .ideditor .huge-modal-button {
     width: 100%;
-    height: auto;
     padding: 20px;
 }
 
@@ -8509,12 +9490,3 @@ display: none;
     width: 100px;
     color: #7092ff;
 }
-
-
-.ideditor .list-item-photos.list-item-mapillary-map-features .request-data-link {
-    float: right;
-    margin-top: -20px;
-}
-.ideditor[dir='rtl'] .list-item-photos.list-item-mapillary-map-features .request-data-link {
-    float: left;
-}