Implement select listbox using shadow DOM

Source/core/css/html.css

Index: Source/core/css/html.css
diff --git a/Source/core/css/html.css b/Source/core/css/html.css
index 68f50e7c19d3581ecc3b1edf7fd52b554e607c6c..8eda75163512f0b193f72b5c7212f8aeb867b78e 100644
--- a/Source/core/css/html.css
+++ b/Source/core/css/html.css
@@ -759,24 +759,57 @@ select[size][multiple] {
     align-items: flex-start;
     border: 1px inset gray;
     border-radius: initial;
-    white-space: initial;
+    overflow-x: hidden;
+    overflow-y: scroll;
+    vertical-align: text-bottom;
+    -webkit-user-select: none;
+    white-space: nowrap;
 }
 
 select[size="0"],
 select[size="1"] {
     -webkit-appearance: menulist;
     align-items: center;
-    border: 1px solid;
+    border-width: 1px;
+    border-style: solid;
+    border-color: initial;
     border-radius: 5px;
+    overflow-x: initial;
+    overflow-y: initial;
+    vertical-align: initial;
+    -webkit-user-select: initial;
     white-space: pre;
 }
 
 optgroup {
     font-weight: bolder;
+    display: block;
 }
 
 option {
     font-weight: normal;
+    display: block;
+    padding: 0 2px 1px 2px;
+    white-space: pre;
+}
+
+option:checked {
+    background-color: -internal-inactive-list-box-selection;
+    color: -internal-inactive-list-box-selection-text;
+}
+
+select:focus option:checked {
+    background-color: -internal-active-list-box-selection;
+    color: -internal-active-list-box-selection-text;
+}
+
+select:disabled option:checked,
+option:checked:disabled {
+    color: gray;
+}
+
+optgroup::-webkit-optgroup-label {
+    padding: 0 2px 1px 2px;
 }
 
 output {