diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml
index 359b109..eb99110 100644
--- a/.pre-commit-config.yaml
+++ b/.pre-commit-config.yaml
@@ -23,3 +23,9 @@ repos:
           - prettier
           - prettier-plugin-svelte
           - svelte
+
+  - repo: https://github.com/codespell-project/codespell
+    rev: v2.1.0
+    hooks:
+      - id: codespell
+        exclude: yarn.lock
diff --git a/readme.md b/readme.md
index cb6e757..fef861f 100644
--- a/readme.md
+++ b/readme.md
@@ -77,12 +77,12 @@ Full list of props/bindable variables for this component:
 
 | name              | default                             | description                                                                                                                                                                                                                                                                                                   |
 | :---------------- | :---------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
-| `options`         | [required]                          | Array of strings (or numbers) that will be listed in the dropdown selection.                                                                                                                                                                                                                                  |
+| `options`         | [required]                          | Array of strings that will be listed in the dropdown selection.                                                                                                                                                                                                                                               |
 | `maxSelect`       | `null`                              | `null` or positive integer to allow users to select as many as they like or a maximum number of options, respectively.                                                                                                                                                                                        |
 | `selected`        | `[]` (or `''` if `maxSelect === 1`) | Array of currently/pre-selected options when binding/passing as props respectively.                                                                                                                                                                                                                           |
 | `readonly`        | `false`                             | Disables the input. User won't be able to interact with it.                                                                                                                                                                                                                                                   |
 | `placeholder`     | `''`                                | String shown when no option is selected.                                                                                                                                                                                                                                                                      |
-| `disabledOptions` | `[]`                                | Array of strings (or numbers) that will be disabled in the dropdown selection.                                                                                                                                                                                                                                |
+| `disabledOptions` | `[]`                                | Array of strings that will be disabled in the dropdown selection.                                                                                                                                                                                                                                             |
 | `required`        | `false`                             | Prevents submission in an HTML form when true.                                                                                                                                                                                                                                                                |
 | `input`           | `undefined`                         | Handle to the DOM node storing the currently selected options in JSON format as its `value` attribute.                                                                                                                                                                                                        |
 | `name`            | `''`                                | Used as `name` reference for associating HTML form `<label>`s with this component as well as for the `<input>`'s `id`. That is, the same DOM node bindable through `<MultiSelect bind:input />` is also retrievable via `document.getElementByID(name)` e.g. for use in a JS file outside a Svelte component. |
@@ -148,7 +148,7 @@ The first, if you only want to make small adjustments, allows you to pass the fo
 For example, to change the background color of the options dropdown:
 
 ```svelte
-<MultiSelect --sms-options-bg="var(--my-css-var, white)" />
+<MultiSelect --sms-options-bg="white" />
 ```
 
 ### With CSS frameworks
@@ -178,7 +178,7 @@ This simplified version of the DOM structure of this component shows where these
 
 ### Granular control through global CSS
 
-You can alternatively style every part of this component with more fine-grained control by using the following `:global()` CSS selectors. **Note**: Overriding properties that the component already sets internally requires the `!important` keyword.
+You can alternatively style every part of this component with more fine-grained control by using the following `:global()` CSS selectors.
 
 ```css
 :global(.multiselect) {
diff --git a/src/components/GitHubCorner.svelte b/src/components/GitHubCorner.svelte
index 85d48ef..c6712bf 100644
--- a/src/components/GitHubCorner.svelte
+++ b/src/components/GitHubCorner.svelte
@@ -20,15 +20,13 @@
 </a>
 
 <style>
-  svg {
-    fill: var(--ghc-bg, black);
-    color: var(--ghc-color, white);
-    width: var(--ghc-size, 50pt);
-    height: var(--ghc-size, 50pt);
+  a {
     position: fixed;
     top: 0;
-    border: 0;
     right: 0;
+    width: var(--ghc-size, 50pt);
+    fill: var(--ghc-bg, black);
+    color: var(--ghc-color, white);
   }
   a:hover .octo-arm {
     animation: octocat-wave 560ms ease-in-out;
@@ -47,12 +45,4 @@
       transform: rotate(10deg);
     }
   }
-  @media (max-width: 500px) {
-    a:hover .octo-arm {
-      animation: none;
-    }
-    a .octo-arm {
-      animation: octocat-wave 560ms ease-in-out;
-    }
-  }
 </style>
diff --git a/src/lib/MultiSelect.svelte b/src/lib/MultiSelect.svelte
index 7917904..d8dde29 100644
--- a/src/lib/MultiSelect.svelte
+++ b/src/lib/MultiSelect.svelte
@@ -10,8 +10,8 @@
   export let maxSelect: number | null = null // null means any number of options are selectable
   export let readonly = false
   export let placeholder = ``
-  export let options: (string | number)[]
-  export let disabledOptions: (string | number)[] = []
+  export let options: string[]
+  export let disabledOptions: string[] = []
   export let input: HTMLInputElement | null = null
   export let noOptionsMsg = `No matching options`
 
@@ -134,7 +134,7 @@
   }
 </script>
 
-<!-- z-index: 2 when showOptions is ture ensures the ul.tokens of one <MultiSelect /> display above those of another following shortly after it -->
+<!-- z-index: 2 when showOptions is true ensures the ul.tokens of one <MultiSelect /> display above those of another following shortly after it -->
 <div
   class="multiselect {outerDivClass}"
   class:readonly
@@ -215,7 +215,7 @@
 </div>
 
 <style>
-  .multiselect {
+  :where(.multiselect) {
     position: relative;
     margin: 1em 0;
     border: var(--sms-border, 1pt solid lightgray);
@@ -225,14 +225,14 @@
     display: flex;
     cursor: text;
   }
-  .multiselect:focus-within {
+  :where(.multiselect:focus-within) {
     border: var(--sms-focus-border, 1pt solid var(--sms-active-color, cornflowerblue));
   }
-  .multiselect.readonly {
+  :where(.multiselect.readonly) {
     background: var(--sms-readonly-bg, lightgray);
   }
 
-  ul.tokens > li {
+  :where(ul.tokens > li) {
     background: var(--sms-token-bg, var(--sms-active-color, cornflowerblue));
     align-items: center;
     border-radius: 4pt;
@@ -243,19 +243,17 @@
     white-space: nowrap;
     height: 16pt;
   }
-  ul.tokens > li button,
-  button.remove-all {
+  :where(ul.tokens > li button, button.remove-all) {
     align-items: center;
     border-radius: 50%;
     display: flex;
     cursor: pointer;
     transition: 0.2s;
   }
-  ul.tokens > li button:hover,
-  button.remove-all:hover {
+  :where(ul.tokens > li button:hover, button.remove-all:hover) {
     color: var(--sms-remove-x-hover-color, lightgray);
   }
-  button {
+  :where(button) {
     color: inherit;
     background: transparent;
     border: none;
@@ -264,7 +262,7 @@
     padding: 0 2pt;
   }
 
-  .multiselect input {
+  :where(.multiselect input) {
     border: none;
     outline: none;
     background: none;
@@ -274,7 +272,7 @@
     flex: 1;
   }
 
-  ul.tokens {
+  :where(ul.tokens) {
     display: flex;
     padding: 0;
     margin: 0;
@@ -282,7 +280,7 @@
     flex: 1;
   }
 
-  ul.options {
+  :where(ul.options) {
     list-style: none;
     max-height: 50vh;
     padding: 0;
@@ -293,14 +291,14 @@
     overflow: auto;
     background: var(--sms-options-bg, white);
   }
-  ul.options.hidden {
+  :where(ul.options.hidden) {
     visibility: hidden;
   }
-  ul.options li {
+  :where(ul.options li) {
     padding: 3pt 2ex;
     cursor: pointer;
   }
-  ul.options li.selected {
+  :where(ul.options li.selected) {
     border-left: var(
       --sms-li-selected-border-left,
       3pt solid var(--sms-selected-color, green)
@@ -308,22 +306,22 @@
     background: var(--sms-li-selected-bg, inherit);
     color: var(--sms-li-selected-color, inherit);
   }
-  ul.options li:not(.selected):hover {
+  :where(ul.options li:not(.selected):hover) {
     border-left: var(
       --sms-li-not-selected-hover-border-left,
       3pt solid var(--sms-active-color, cornflowerblue)
     );
     border-left: 3pt solid var(--blue);
   }
-  ul.options li.active {
+  :where(ul.options li.active) {
     background: var(--sms-li-active-bg, var(--sms-active-color, cornflowerblue));
   }
-  ul.options li.disabled {
+  :where(ul.options li.disabled) {
     background: var(--sms-li-disabled-bg, #f5f5f6);
     color: var(--sms-li-disabled-text, #b8b8b8);
     cursor: not-allowed;
   }
-  ul.options li.disabled:hover {
+  :where(ul.options li.disabled:hover) {
     border-left: unset;
   }
 </style>