@nodesecure/cli/dist/public/main.css.map

Node.js security CLI

{
  "version": 3,
  "sources": ["../../public/css/reset.css", "../../public/css/light.css", "../../public/css/animation.css", "../../public/font/fontello/fontello.css", "../../public/font/roboto/roboto.css", "../../public/font/mononoki/mononoki.css", "../../public/components/locker/locker.css", "../../public/components/legend/legend.css", "../../public/components/popup/popup.css", "../../public/components/file-box/file-box.css", "../../public/components/expandable/expandable.css", "../../public/components/navigation/navigation.css", "../../public/components/bundlephobia/bundlephobia.css", "../../public/components/package/header/header.css", "../../public/components/package/pannels/scripts/scripts.css", "../../public/components/package/pannels/overview/overview.css", "../../public/components/package/pannels/vulnerabilities/vulnerabilities.css", "../../public/components/package/pannels/scorecard/scorecard.css", "../../public/components/package/pannels/warnings/warnings.css", "../../public/components/package/package.css", "../../public/components/searchbar/searchbar.css", "../../public/components/views/home/maintainers/maintainers.css", "../../public/components/views/home/report/report.css", "../../public/components/views/home/home.css", "../../public/components/views/network/network.css", "../../public/components/views/search/search.css", "../../public/components/views/settings/settings.css", "../../public/components/wiki/wiki.css", "../../public/components/gauge/gauge.css", "../../public/main.css"],
  "sourcesContent": ["/* http://meyerweb.com/eric/tools/css/reset/\n   v2.0 | 20110126\n   License: none (public domain)\n*/\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font-size: 100%;\n  font: inherit;\n}\n\n/* HTML5 display-role reset for older browsers */\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\nsection {\n  display: block;\n}\n\nbody {\n  line-height: 1;\n}\n\nol,\nul {\n  list-style: none;\n}\n\nblockquote,\nq {\n  quotes: none;\n}\n\nblockquote:before,\nblockquote:after,\nq:before,\nq:after {\n  content: '';\n  content: none;\n}\n", ":root {\n  --primary-theme-color: #FFF;\n  --primary-darker: #261877;\n  --primary: #3722AF;\n  --primary-lighter: #5A44DA;\n  --secondary: #00D1FF;\n  --secondary-darker: #1976D2;\n}\nbody {\n  color: var(--primary-theme-color);\n  background: rgb(255,255,255);\n  background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 15%, rgba(208,220,221,1) 100%);\n  background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 15%,rgba(208,220,221,1) 100%);\n  background: radial-gradient(ellipse at center,  rgba(255,255,255,1) 15%,rgba(208,220,221,1) 100%);\n  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d0dcdd',GradientType=1 );\n}\n", "\n.lds-ellipsis {\n  display: inline-block;\n  position: relative;\n  width: 80px;\n  height: 80px;\n}\n.lds-ellipsis div {\n  position: absolute;\n  top: 33px;\n  width: 13px;\n  height: 13px;\n  border-radius: 50%;\n  background: var(--primary);\n  animation-timing-function: cubic-bezier(0, 1, 1, 0);\n}\n.lds-ellipsis div:nth-child(1) {\n  left: 8px;\n  animation: lds-ellipsis1 0.6s infinite;\n}\n.lds-ellipsis div:nth-child(2) {\n  left: 8px;\n  animation: lds-ellipsis2 0.6s infinite;\n}\n.lds-ellipsis div:nth-child(3) {\n  left: 32px;\n  animation: lds-ellipsis2 0.6s infinite;\n}\n.lds-ellipsis div:nth-child(4) {\n  left: 56px;\n  animation: lds-ellipsis3 0.6s infinite;\n}\n@keyframes lds-ellipsis1 {\n  0% {\n    transform: scale(0);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n@keyframes lds-ellipsis3 {\n  0% {\n    transform: scale(1);\n  }\n  100% {\n    transform: scale(0);\n  }\n}\n@keyframes lds-ellipsis2 {\n  0% {\n    transform: translate(0, 0);\n  }\n  100% {\n    transform: translate(24px, 0);\n  }\n}\n\n.slide-in {\n  animation: slide-in 0.8s forwards;\n  -webkit-animation: slide-in 0.8s forwards;\n}\n\n.slide-out {\n  animation: slide-out 0.8s forwards;\n  -webkit-animation: slide-out 0.8s forwards;\n}\n\n.slide-out-documentation {\n  animation: slide-out-documentation 0.8s forwards;\n  -webkit-animation: slide-out-documentation 0.8s forwards;\n}\n\n@keyframes slide-in {\n  100% {\n    transform: translateX(0%);\n  }\n}\n\n@keyframes slide-out {\n  0% {\n    transform: translateX(0%);\n  }\n\n  100% {\n    transform: translateX(-100%);\n  }\n}\n\n@keyframes slide-out-documentation {\n  0% {\n    transform: translateX(0%);\n  }\n\n  100% {\n    transform: translateX(calc(100%, -26px));\n  }\n}\n\n", "@font-face {\n  font-family: 'fontello';\n  src: url('./fontello.eot?84631897');\n  src: url('./fontello.eot?84631897#iefix') format('embedded-opentype'),\n       url('./fontello.woff2?84631897') format('woff2'),\n       url('./fontello.woff?84631897') format('woff'),\n       url('./fontello.ttf?84631897') format('truetype'),\n       url('./fontello.svg?84631897#fontello') format('svg');\n  font-weight: normal;\n  font-style: normal;\n}\n/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */\n/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */\n/*\n@media screen and (-webkit-min-device-pixel-ratio:0) {\n  @font-face {\n    font-family: 'fontello';\n    src: url('../font/fontello.svg?84631897#fontello') format('svg');\n  }\n}\n*/\n[class^=\"icon-\"]:before, [class*=\" icon-\"]:before {\n  font-family: \"fontello\";\n  font-style: normal;\n  font-weight: normal;\n\n  display: inline-block;\n  text-decoration: inherit;\n  width: 1em;\n  margin-right: .2em;\n  text-align: center;\n  /* opacity: .8; */\n\n  /* For safety - reset parent styles, that can break glyph codes*/\n  font-variant: normal;\n  text-transform: none;\n\n  /* fix buttons height, for twitter bootstrap */\n  line-height: 1em;\n\n  /* Animation center compensation - margins should be symmetric */\n  /* remove if not needed */\n  margin-left: .2em;\n\n  /* you can be more comfortable with increased icons size */\n  /* font-size: 120%; */\n\n  /* Font smoothing. That was taken from TWBS */\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n\n  /* Uncomment for 3D effect */\n  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */\n}\n\n.icon-eye:before { content: '\\e800'; } /* '\uE800' */\n.icon-eye-off:before { content: '\\e801'; } /* '\uE801' */\n.icon-chart-bar:before { content: '\\e802'; } /* '\uE802' */\n.icon-chart-pie:before { content: '\\e803'; } /* '\uE803' */\n.icon-chat:before { content: '\\e804'; } /* '\uE804' */\n.icon-attention-circled:before { content: '\\e805'; } /* '\uE805' */\n.icon-book-open:before { content: '\\e806'; } /* '\uE806' */\n.icon-search:before { content: '\\e807'; } /* '\uE807' */\n.icon-link:before { content: '\\e808'; } /* '\uE808' */\n.icon-users:before { content: '\\e809'; } /* '\uE809' */\n.icon-archive:before { content: '\\e80a'; } /* '\uE80A' */\n.icon-home:before { content: '\\e80b'; } /* '\uE80B' */\n.icon-star-empty:before { content: '\\e80c'; } /* '\uE80C' */\n.icon-star:before { content: '\\e80d'; } /* '\uE80D' */\n.icon-warning:before { content: '\\e80e'; } /* '\uE80E' */\n.icon-warning-empty:before { content: '\\e80f'; } /* '\uE80F' */\n.icon-users-1:before { content: '\\e810'; } /* '\uE810' */\n.icon-doc:before { content: '\\e811'; } /* '\uE811' */\n.icon-eye-1:before { content: '\\e812'; } /* '\uE812' */\n.icon-eye-off-1:before { content: '\\e813'; } /* '\uE813' */\n.icon-ok-circled:before { content: '\\e814'; } /* '\uE814' */\n.icon-ok-circled2:before { content: '\\e815'; } /* '\uE815' */\n.icon-cancel-circled:before { content: '\\e816'; } /* '\uE816' */\n.icon-cancel-circled2:before { content: '\\e817'; } /* '\uE817' */\n.icon-book:before { content: '\\e818'; } /* '\uE818' */\n.icon-award:before { content: '\\e819'; } /* '\uE819' */\n.icon-box-1:before { content: '\\e81a'; } /* '\uE81A' */\n.icon-vcard:before { content: '\\e81b'; } /* '\uE81B' */\n.icon-doc-text:before { content: '\\e81c'; } /* '\uE81C' */\n.icon-doc-text-inv:before { content: '\\e81d'; } /* '\uE81D' */\n.icon-vcard-1:before { content: '\\e81e'; } /* '\uE81E' */\n.icon-left-open-big:before { content: '\\e81f'; } /* '\uE81F' */\n.icon-bell-1:before { content: '\\e820'; } /* '\uE820' */\n.icon-right-open-big:before { content: '\\e821'; } /* '\uE821' */\n.icon-globe:before { content: '\\e822'; } /* '\uE822' */\n.icon-cog:before { content: '\\e823'; } /* '\uE823' */\n.icon-code:before { content: '\\e824'; } /* '\uE824' */\n.icon-globe-alt-outline:before { content: '\\e825'; } /* '\uE825' */\n.icon-globe-alt:before { content: '\\e826'; } /* '\uE826' */\n.icon-lock:before { content: '\\e827'; } /* '\uE827' */\n.icon-info-circled:before { content: '\\f085'; } /* '\uF085' */\n.icon-info-circled-alt:before { content: '\\f086'; } /* '\uF086' */\n.icon-docs:before { content: '\\f0c5'; } /* '\uF0C5' */\n.icon-sitemap:before { content: '\\f0e8'; } /* '\uF0E8' */\n.icon-plus-squared:before { content: '\\f0fe'; } /* '\uF0FE' */\n.icon-terminal:before { content: '\\f120'; } /* '\uF120' */\n.icon-fork:before { content: '\\f126'; } /* '\uF126' */\n.icon-unlink:before { content: '\\f127'; } /* '\uF127' */\n.icon-lock-open:before { content: '\\f13e'; } /* '\uF13E' */\n.icon-minus-squared:before { content: '\\f146'; } /* '\uF146' */\n.icon-minus-squared-alt:before { content: '\\f147'; } /* '\uF147' */\n.icon-doc-inv:before { content: '\\f15b'; } /* '\uF15B' */\n.icon-box:before { content: '\\f187'; } /* '\uF187' */\n.icon-plus-squared-alt:before { content: '\\f196'; } /* '\uF196' */\n.icon-cube:before { content: '\\f1b2'; } /* '\uF1B2' */\n.icon-cubes:before { content: '\\f1b3'; } /* '\uF1B3' */\n", "@font-face {\n  font-family: 'Roboto';\n  src: url('../../font/roboto/Roboto-Light.ttf');\n  font-weight: 300;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: 'Roboto';\n  src: url('../../font/roboto/Roboto-LightItalic.ttf');\n  font-weight: 300;\n  font-style: italic;\n}\n\n@font-face {\n  font-family: 'Roboto';\n  src: url('../../font/roboto/Roboto-Regular.ttf');\n  font-weight: 400;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: 'Roboto';\n  src: url('../../font/roboto/Roboto-Italic.ttf');\n  font-weight: 400;\n  font-style: italic;\n}\n\n@font-face {\n  font-family: 'Roboto';\n  src: url('../../font/roboto/Roboto-Medium.ttf');\n  font-weight: 500;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: 'Roboto';\n  src: url('../../font/roboto/Roboto-MediumItalic.ttf');\n  font-weight: 500;\n  font-style: italic;\n}\n\n@font-face {\n  font-family: 'Roboto';\n  src: url('../../font/roboto/Roboto-Bold.ttf');\n  font-weight: 700;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: 'Roboto';\n  src: url('../../font/roboto/Roboto-BoldItalic.ttf');\n  font-weight: 700;\n  font-style: italic;\n}\n", "@font-face {\n  font-family: \"mononoki\";\n  src: url(\"../../font/mononoki/mononoki-Regular.woff\");\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"mononoki\";\n  src: url(\"../../font/mononoki/mononoki-Bold.woff\");\n  font-style: bold;\n}\n\n@font-face {\n  font-family: \"mononoki\";\n  src: url(\"../../font/mononoki/mononoki-Italic.woff\");\n  font-style: italic;\n}\n", "#network-locker {\n  position: absolute;\n  bottom: 10px;\n  right: 10px;\n  z-index: 30;\n  display: flex;\n  height: 30px;\n  border-radius: 4px;\n  align-items: center;\n  box-sizing: border-box;\n  overflow: hidden;\n  background-color: var(--primary);\n  transition: 0.3s all linear;\n  cursor: pointer;\n}\n\n#network-locker:not(.enabled) {\n  background-color: var(--primary);\n}\n\n#network-locker.enabled {\n  background-color: #af2222;\n}\n\n#network-locker>i {\n  height: inherit;\n  padding: 0 5px;\n  display: flex;\n  align-items: center;\n  border-radius: 4px;\n  margin-right: 10px;\n  transition: 0.3s all linear;\n}\n\n#network-locker>i:not(.enabled) {\n  background-color: var(--primary-lighter);\n}\n\n#network-locker>i.enabled {\n  background-color: #cb3d3d;\n}\n\n#network-locker>p {\n  font-family: \"mononoki\";\n  padding-right: 10px;\n  display: flex;\n  align-items: center;\n  height: inherit;\n  text-transform: capitalize;\n}\n", "#legend {\n  position: absolute;\n  right: 10px;\n  bottom: 40px;\n  z-index: 30;\n  max-width: 692px;\n  padding: 4px;\n  border-radius: 0 0 0 1rem;\n  overflow: hidden;\n  transition: transform 0.3s;\n  display: none;\n  flex-direction: column;\n  justify-content: right;\n  flex-wrap: wrap;\n  font-size: 14px;\n  color: #030421;\n  padding: 0 10px 10px 0;\n  border-radius: 4px;\n}\n\n.legend-box {\n  box-sizing: border-box;\n  display: inline-flex;\n  flex-direction: row-reverse;\n  align-items: center;\n  height: 24px;\n  border-radius: 4px;\n}\n\n.legend-badge {\n  display: inline-block;\n  width: 15px;\n  height: 15px;\n  margin: 0 5px;\n  border-radius: 50%;\n  box-shadow: 0 0 10px rgba(0, 0, 0, 0.34);\n}\n\n.legend {\n  font-weight: bold;\n  padding-left: 6px;\n  display: none;\n}\n\n.legend-box:not(:hover) {\n  background: transparent !important;\n}\n\n.legend-box:hover {\n  border: 1px solid rgba(48, 56, 165, 0.6);\n}\n\n.legend-box:hover > .legend {\n  display: flex;\n  align-items: center;\n}\n\n.legend-box:hover .legend-badge {\n  box-shadow: none;\n}\n", "/** TODO: ANIMATE ? **/\nsection#popup--background {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  position: fixed;\n  left: 0;\n  top: 0;\n  z-index: 50;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  /* pointer-events: none; */\n  background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0) 0%, rgb(30 35 65) 100%);\n\n  visibility: hidden;\n  opacity: 0;\n  transition: opacity 0.35s ease-in, visibility 0ms ease-in 0.35s;\n}\n\nsection#popup--background.show {\n  visibility: visible;\n  opacity: 1;\n  transition: opacity 0.35s ease-in, visibility 0ms ease-in 0ms;\n}\n\nsection#popup--background>.popup {\n  pointer-events: all !important;\n  background: #f5f4f4;\n  border-radius: 4px;\n  box-shadow: 5px 5px 15px rgb(23 27 129 / 41%);\n  border-left: 2px solid #ffffff;\n  border-top: 2px solid #FFF;\n}\n", ".box-file-info {\n  display: flex;\n  flex-direction: column;\n  padding: 10px;\n  border-top: 2px solid #351ea7;\n  border-left: 2px solid #351ea7;\n  background: -moz-linear-gradient(top, rgba(12, 15, 94, 0.27) 0%, rgba(0, 0, 0, 0) 100%);\n  background: -webkit-linear-gradient(top, rgba(12, 15, 94, 0.27) 0%, rgba(0, 0, 0, 0) 100%);\n  background: linear-gradient(to bottom, rgba(12, 15, 94, 0.27) 0%, rgba(0, 0, 0, 0) 100%);\n  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#450c0f5e', endColorstr='#00000000', GradientType=0);\n  border-radius: 4px;\n  box-shadow: 1px 1px 10px rgba(18, 101, 109, 0.1);\n}\n\n.box-file-info+.box-file-info {\n  margin-top: 10px;\n}\n\n.box-file-info>.box-header {\n  display: flex;\n  align-items: center;\n  height: 20px;\n  margin-bottom: 20px;\n}\n\n.box-file-info>.box-header>span {\n  width: 24px;\n  height: 24px;\n  border-radius: 4px;\n  box-sizing: border-box;\n  margin-right: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-family: 'mononoki';\n  font-weight: bold;\n  text-shadow: 2px 2px 10px #000;\n}\n.box-file-info>.box-header>span.Critical {\n  background: #d32f2f;\n}\n.box-file-info>.box-header>span.Warning {\n  background: #f08e26;\n}\n.box-file-info>.box-header>span.Information {\n  background: #0288d1ab;\n}\n\n.box-file-info>.box-header>.box-title {\n  font-size: 18px;\n  font-variant: small-caps;\n  font-family: \"mononoki\";\n  color: #FFF;\n  font-weight: bold;\n  letter-spacing: 1px;\n  text-decoration: none;\n}\n\n.box-file-info>.box-header>a:hover {\n  text-decoration: underline;\n  cursor: pointer;\n}\n\n.box-file-info>.box-header>.box-file {\n  margin-left: auto;\n  color: #B3E5FC;\n  display: flex;\n}\n\n.box-file-info>.box-header>.box-file a {\n  color: inherit;\n  text-decoration: none;\n}\n\n.box-file-info>.box-header>.box-file a:hover {\n  text-decoration: underline;\n}\n\n.box-file-info>.box-header>.box-file i {\n  margin-right: 6px;\n}\n\n/**\n * LICENSES\n */\n.box-file-info>.box-container-licenses {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n.box-file-info>.box-container-licenses>div {\n  flex-grow: 1;\n  flex-basis: 150px;\n  height: 26px;\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  font-weight: 500;\n  color: #D1C4E9;\n  font-family: system-ui;\n}\n\n/**\n * WARNINGS\n */\n.box-file-info>.box-container-warning {\n  display: flex;\n}\n\n.box-file-info>.box-container-warning .info {\n  flex-grow: 1;\n  display: flex;\n  flex-direction: column;\n}\n\n.box-file-info>.box-container-warning .info>p.title {\n  font-size: 15px;\n  color: #ede3ff;\n}\n\n.box-file-info>.box-container-warning .info>p.value {\n  font-size: 12px;\n  margin-top: 5px;\n  color: var(--secondary);\n  font-family: \"mononoki\";\n  word-break: break-all;\n}\n\n.box-file-info>.box-container-warning .view-more {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 18px;\n  box-sizing: border-box;\n  color: #bfecff;\n  background: #1a237e;\n  border: 2px solid #2d39ac;\n  border-radius: 50%;\n  flex-shrink: 0;\n  margin-left: 10px;\n  transition: all 0.4s ease;\n}\n\n.box-file-info>.box-container-warning .view-more:hover {\n  cursor: pointer;\n  border-color: var(--secondary);\n  color: var(--secondary);\n}\n\n.box-file-info>.box-source-code-position {\n  height: 18px;\n  margin-top: 10px;\n  font-size: 14px;\n  font-family: \"system-ui\";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n", "span.expandable {\n  display: flex;\n  align-items: center !important;\n  justify-content: center !important;\n  height: 35px;\n  font-size: 13px;\n  font-family: \"mononoki\";\n  background: none;\n  color: #00B0FF;\n  text-shadow: 1px 1px 1px rgba(20, 20, 20, 0.5);\n  transition: all 0.2s linear;\n  margin-top: 5px;\n}\n\nspan.expandable[data-value=\"opened\"] {\n  color: #F44336 !important;\n}\n\nspan.expandable:hover {\n  cursor: pointer;\n}\n\nspan.expandable i {\n  margin-right: 4px;\n  margin-top: 1px;\n}\n\n/**\n * CUSTOM CSS\n */\n.package-scripts>.expandable {\n  margin-top: 10px;\n}\n\n.home--body .expandable {\n  text-shadow: none;\n  font-size: 15px;\n  color: var(--secondary-darker);\n  flex-grow: 1;\n  flex-basis: 100%;\n  margin-top: 10px;\n}\n", "nav#aside {\n  width: 70px;\n  flex-shrink: 0;\n  background: var(--primary);\n  position: relative;\n  align-items: center;\n  display: flex !important;\n  flex-direction: column;\n  z-index: 40;\n}\n\nnav#aside>.nsecure-logo {\n  margin-top: 20px;\n}\n\nnav#aside>ul {\n  width: inherit;\n  display: flex;\n  margin-top: 10px;\n  flex-direction: column;\n  flex-grow: 1;\n  margin-bottom: 20px;\n}\n\nnav#aside>ul li {\n  height: 70px;\n  display: flex;\n  position: relative;\n  justify-content: center;\n  align-items: center;\n}\n\nnav#aside>ul li+li {\n  margin-top: 10px;\n}\n\nnav#aside>ul li:not(.active):hover {\n  cursor: pointer;\n  background: rgba(50, 200, 255, 0.085);\n}\n\nnav#aside>ul li.active:before {\n  background: var(--secondary);\n  position: absolute;\n  left: 0;\n  top: 17.5px;\n  height: 35px;\n  width: 4px;\n  border-radius: 0 4px 4px 0;\n  content: \"\";\n}\n\nnav#aside>ul li>i {\n  font-size: 24px;\n}\n\nnav#aside>ul li.active,\nnav#aside>ul li.active span {\n  color: var(--secondary);\n}\n\nnav#aside>ul li>span {\n  position: absolute;\n  left: 10px;\n  bottom: 5px;\n  font-size: 12px;\n  color: #FFF;\n  font-weight: bold;\n}\n\nnav#aside>ul li.bottom-nav {\n  margin-top: auto;\n}\n", "section#package-info div.bundlephobia {\n  height: 50px;\n  display: flex;\n  margin-top: 10px;\n}\n\nsection#package-info div.bundlephobia>div {\n  height: inherit;\n  box-sizing: border-box;\n  border-radius: 4px;\n  border: 2px dashed var(--secondary);\n  flex-grow: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  box-shadow: 1px 1px 10px rgba(41, 103, 122, 0.3) inset;\n}\n\nsection#package-info div.bundlephobia>div+div {\n  margin-left: 10px;\n}\n\nsection#package-info div.bundlephobia>div>b {\n  font-weight: 800px;\n  color: var(--secondary);\n  margin-bottom: 5px;\n  font-size: 18px;\n}\nsection#package-info div.bundlephobia>div>b i {\n  font-family: 'mononoki';\n  font-size: 14px;\n  color: #fce12b;\n}\n\nsection#package-info div.bundlephobia>div>span {\n  font-size: 12px;\n  font-family: 'mononoki';\n}\n", "div.package-header {\n  display: flex;\n  flex-direction: column;\n  margin-top: 20px;\n}\n\ndiv.package-header>.package-name {\n  display: flex;\n  font-family: \"mononoki\";\n  text-shadow: 1px 1px 5px rgba(20, 20, 20, 0.5);\n}\n\ndiv.package-header>.package-name>.name {\n  color: #FFF;\n  font-size: 22px;\n}\n\ndiv.package-header>.package-name>.version {\n  color: var(--secondary);\n  font-size: 16px;\n  margin-left: 10px;\n  display: flex;\n  align-items: end;\n}\n\n/**\n * RIGHT MENU (TOOLS ETC)\n */\ndiv.package-header>.package-name>.info {\n  background: url(\"../../../img/arrow-right-solid.svg\");\n  background-position: center center;\n  background-repeat: no-repeat;\n  width: 18px;\n  height: 22px;\n  border: none;\n  margin-left: auto;\n  cursor: pointer;\n  /* https://codepen.io/sosuke/pen/Pjoqqp */\n  filter: invert(71%) sepia(22%) saturate(6942%) hue-rotate(149deg) brightness(101%) contrast(106%);\n}\n\ndiv.package-header>.package-name>.info-menu {\n  background: #f7f7f7;\n  padding: 16px;\n  border: none;\n  border-radius: 6px;\n  position: absolute;\n  left: 420px;\n  width: 160px;\n  text-shadow: none;\n}\n\ndiv.package-header>.package-name>.info-menu>.info-menu-title {\n  font-weight: bold;\n  text-align: center;\n  margin-bottom: 12px;\n  color: rgb(39, 38, 38);\n}\n\ndiv.package-header>.package-name>.info-menu>a {\n  display: block;\n  margin-bottom: 4px;\n}\n\n/**\n * DESC\n */\ndiv.package-header>.description {\n  width: 100%;\n  color: #FFF;\n  text-align: left;\n  font-size: 15px;\n  margin-top: 7px;\n}\n\n/**\n * FLAGS\n */\ndiv.package-header>ul.flags {\n  display: flex;\n  font-size: 18px;\n  justify-content: center;\n  margin-top: 20px;\n  margin-bottom: 10px;\n}\n\n.flag-infobulle {\n  position: relative;\n  display: inline-block;\n  cursor: pointer;\n}\n\n.flag-infobulle+.flag-infobulle {\n  margin-left: 5px;\n}\n\n.flag-infobulle>span {\n  visibility: hidden;\n  width: 300px;\n  background-color: #000;\n  color: #FFF;\n  text-align: center;\n  border-radius: 3px;\n  padding: 10px;\n  position: absolute;\n  z-index: 21;\n  font-size: 13px;\n  text-shadow: 1px 1px 1px rgba(20, 20, 20, 0.5);\n  top: 150%;\n  left: 50%;\n  margin-left: -140px;\n  font-family: \"mononoki\";\n}\n\n.flag-infobulle>span::after {\n  content: \"\";\n  position: absolute;\n  bottom: 100%;\n  left: 44%;\n  margin-left: -5px;\n  border-width: 5px;\n  border-style: solid;\n  border-color: transparent transparent #000 transparent;\n}\n\n.flag-infobulle:hover span {\n  visibility: visible;\n}\n\n/**\n * LINKS START\n */\ndiv.package-header>.links {\n  height: 20px;\n  display: flex;\n  justify-content: center;\n}\n\ndiv.package-header>.links div {\n  display: flex;\n  height: inherit;\n  align-items: center;\n}\n\ndiv.package-header>.links div+div {\n  margin-left: 20px;\n}\n\ndiv.package-header>.links div>img {\n  height: 20px;\n}\n\ndiv.package-header>.links div>i {\n  font-size: 20px;\n}\n\ndiv.package-header>.links div>a {\n  margin-left: 6px;\n  color: #FFF;\n  font-size: 14px;\n  text-decoration: none;\n}\n\ndiv.package-header>.links div>a:hover {\n  text-decoration: underline;\n}\n/**\n * LINKS END\n */\n", ".package-scripts {\n  display: flex;\n  flex-direction: column;\n  margin: 10px 0;\n}\n\n.package-scripts .script {\n  display: flex;\n  flex-direction: column;\n  padding: 5px;\n  border-radius: 4px;\n  box-sizing: border-box;\n}\n\n.package-scripts .script.suspicious {\n  background: #8776464f;\n}\n\n.package-scripts .script:nth-child(even) {\n  background: rgba(150, 100, 150, 0.05);\n}\n\n.package-scripts .script+.script {\n  margin-top: 5px;\n}\n\n.package-scripts .script.suspicious p.name {\n  color: #efe493;\n}\n\n.package-scripts .script p.name {\n  color: #B3E5FC;\n  height: 26px;\n  display: flex;\n  align-items: center;\n  letter-spacing: 0.3px;\n}\n\n.package-scripts .script p.value {\n  font-size: 13px;\n  color: #f3e4f8;\n  font-family: 'mononoki';\n  margin-top: 5px;\n}\n", "div.package-maintainers {\n  display: flex;\n  flex-direction: column;\n  margin: 10px 0;\n}\n\ndiv.package-maintainers>div {\n  display: flex;\n  height: 40px;\n  margin-bottom: 6px;\n  box-sizing: border-box;\n  border-radius: 4px;\n  overflow: hidden;\n  background: linear-gradient(to right, rgb(43 68 137) 0%, rgba(255, 255, 255, 0) 100%);\n}\n\ndiv.package-maintainers>div.clickable:hover {\n  background: linear-gradient(to right, rgb(43, 87, 137) 0%, rgba(255, 255, 255, 0) 100%);\n  cursor: pointer;\n  color: yellow;\n}\n\ndiv.package-maintainers>div>img {\n  width: 40px;\n  margin-right: 6px;\n}\n\ndiv.package-maintainers>div>p {\n  flex-grow: 1;\n  display: flex;\n  align-items: center;\n  font-family: \"mononoki\";\n}\n\ndiv.package-maintainers>div>span {\n  margin-left: 6px;\n  display: flex;\n  align-items: center;\n  font-family: \"mononoki\";\n  min-width: 76px;\n  padding-right: 10px;\n  justify-content: flex-end;\n  background-color: #236f5c2e;\n  border-radius: 20px;\n  color: #ecf5da;\n}\n", ".vuln-strategy {\n  display: flex;\n  flex-direction: column;\n  height: 60px;\n  margin-bottom: 15px;\n  justify-content: center;\n}\n\n.vuln-strategy>div {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.vuln-strategy>div+div {\n  margin-top: 5px;\n}\n\n.vuln-strategy img {\n  width: 40px;\n  margin-right: 10px;\n}\n\n.vuln-strategy .strategy {\n  color: #bbb;\n  font-size: 13px;\n  font-family: system-ui;\n  letter-spacing: 1px;\n}\n\n.vuln-strategy .strategy>i {\n  margin-right: 4px;\n}\n\n.vuln-strategy .name {\n  font-family: \"mononoki\";\n  font-variant: small-caps;\n  font-weight: bold;\n  font-size: 20px;\n  text-shadow: 2px 2px 10px #00000082;\n}\n\n.packages-vuln {\n  display: flex;\n  flex-direction: column;\n}\n\n.packages-vuln .vuln {\n  border-top: 4px solid grey;\n  border-left: 1px solid grey;\n  border-right: 2px solid grey;\n  border-bottom: 1px solid grey;\n  border-radius: 8px;\n  box-sizing: border-box;\n  overflow: hidden;\n  color: #FFF;\n  display: flex;\n  flex-direction: column;\n}\n\n.packages-vuln .vuln+.vuln {\n  margin-top: 10px;\n}\n\n.packages-vuln .vuln.critical {\n  border-color: #B71C1C;\n  background: -moz-linear-gradient(left, rgba(63, 0, 6, 0.53) 0%, rgba(0, 0, 0, 0) 100%);\n  background: -webkit-linear-gradient(left, rgba(63, 0, 6, 0.53) 0%, rgba(0, 0, 0, 0) 100%);\n  background: linear-gradient(to right, rgba(63, 0, 6, 0.53) 0%, rgba(0, 0, 0, 0) 100%);\n  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#873f0006', endColorstr='#00000000', GradientType=1);\n}\n\n.packages-vuln .vuln.high {\n  border-color: rgb(249, 104, 37);\n  background: -moz-linear-gradient(left, rgba(53, 38, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);\n  background: -webkit-linear-gradient(left, rgba(53, 38, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);\n  background: linear-gradient(to right, rgba(53, 38, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);\n  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a6352600', endColorstr='#00000000', GradientType=1);\n}\n\n.packages-vuln .vuln.medium,\n.packages-vuln .vuln.moderate {\n  border-color: #F9A825;\n  background: -moz-linear-gradient(left, rgba(65, 66, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);\n  background: -webkit-linear-gradient(left, rgba(65, 66, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);\n  background: linear-gradient(to right, rgba(65, 66, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);\n  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a6414200', endColorstr='#00000000', GradientType=1);\n}\n\n.packages-vuln .vuln.info,\n.packages-vuln .vuln.low {\n  border-color: #2545f9;\n  background: -moz-linear-gradient(left, rgba(0, 46, 63, 0.65) 0%, rgba(0, 0, 0, 0) 100%);\n  background: -webkit-linear-gradient(left, rgba(0, 46, 63, 0.65) 0%, rgba(0, 0, 0, 0) 100%);\n  background: linear-gradient(to right, rgba(0, 46, 63, 0.65) 0%, rgba(0, 0, 0, 0) 100%);\n  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a6002e3f', endColorstr='#00000000', GradientType=1);\n}\n\n.packages-vuln .vuln {\n  display: flex;\n  flex-direction: column;\n  padding: 10px;\n}\n\n.packages-vuln .vuln>div {\n  display: flex;\n  height: 24px;\n  align-items: center;\n}\n\n.packages-vuln .vuln .links {\n  font-size: 14px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  margin-top: 5px;\n}\n\n.packages-vuln .vuln .links>i {\n  margin-right: 5px;\n  color: #00b8ead1;\n}\n\n.packages-vuln .vuln .links>a {\n  text-decoration: none;\n  font-variant: all-small-caps;\n}\n\n.packages-vuln .vuln.critical .links>a {\n  color: #ff9797d1;\n}\n\n.packages-vuln .vuln.high .links>a {\n  color: #ffd6a1d1;\n}\n\n.packages-vuln .vuln.medium .links>a,\n.packages-vuln .vuln.modate .links>a {\n  color: #ffeea1d1;\n}\n\n.packages-vuln .vuln.info .links>a,\n.packages-vuln .vuln.low .links>a {\n  color: #a1c8ffd1;\n}\n\n.packages-vuln .vuln>div .severity {\n  width: 24px;\n  height: inherit;\n  margin-right: 10px;\n  border-radius: 4px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-family: 'mononoki';\n  font-weight: bold;\n  text-shadow: 2px 2px 10px #000;\n  color: #FFF;\n  border-top: 2px solid #fbffde61;\n  box-sizing: border-box;\n}\n\n.packages-vuln .vuln>div>p {\n  display: flex;\n  align-items: center;\n  font-size: 14px;\n}\n\n.packages-vuln .vuln>div>p.name {\n  font-family: \"mononoki\";\n  font-size: 16px;\n  color: #FFF;\n}\n\n.packages-vuln .vuln>div>span {\n  margin-left: auto;\n  background: #0000005c;\n  padding: 4px 5px;\n  margin-right: 10px;\n  font-family: \"mononoki\";\n  font-size: 12px;\n  border-radius: 4px;\n}\n\n.packages-vuln .vuln .description {\n  height: auto;\n  margin-top: 10px;\n  text-shadow: 2px 2px 5px #00000054;\n}\n\n.packages-vuln .vuln>div .severity.critical {\n  background: #B71C1C;\n}\n\n.packages-vuln .vuln>div .severity.high {\n  background: rgb(249, 104, 37);\n}\n\n.packages-vuln .vuln>div .severity.medium,\n.packages-vuln .vuln>div .severity.moderate {\n  background: #F9A825;\n}\n\n.packages-vuln .vuln>div .severity.info,\n.packages-vuln .vuln>div .severity.low {\n  background: #2545f9;\n}\n", "#pan-scorecard {\n  padding: 10px;\n  border-radius: 8px 8px 0 0;\n  background: -moz-linear-gradient(top, rgba(76, 50, 223, 0.2) 0%, rgba(0, 0, 0, 0) 15%);\n  background: -webkit-linear-gradient(top, rgba(76, 50, 223, 0.2) 0%, rgba(0, 0, 0, 0) 15%);\n  background: linear-gradient(to bottom, rgba(76, 50, 223, 0.2) 0%, rgba(0, 0, 0, 0) 15%);\n  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#334c32df', endColorstr='#00000000', GradientType=0);\n}\n\n#pan-scorecard .container-title {\n  display: flex;\n  justify-content: center;\n  width: 100%;\n  color: var(--secondary);\n  margin-bottom: 10px;\n  font-family: 'mononoki';\n  letter-spacing: 1px;\n  text-shadow: 1px 1px 5px #2a6f99;\n  position: static;\n}\n\n#pan-scorecard .score-header {\n  height: inherit;\n  flex-grow: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  margin-bottom: 5px;\n}\n\n#pan-scorecard .score-header .score-text {\n  font-family: 'mononoki';\n  font-size: 16px;\n  margin-top: 5px;\n}\n\n#pan-scorecard .score-header .score-value {\n  font-weight: 800px;\n  color: var(--secondary);\n  margin-top: 6px;\n  font-size: 18px;\n}\n\n#pan-scorecard .score-header .visualizer a {\n  color: #cfd8dc;\n  margin-top: 6px;\n}\n\n#pan-scorecard .score-header .visualizer .logo {\n  vertical-align: sub;\n  width: 21px;\n  /* https://codepen.io/sosuke/pen/Pjoqqp */\n  filter: invert(99%) sepia(36%) saturate(748%) hue-rotate(170deg) brightness(93%) contrast(84%);\n}\n\n#pan-scorecard .check {\n  display: flex;\n  height: 26px;\n  align-items: center;\n  cursor: pointer;\n  flex-wrap: wrap;\n  white-space: initial;\n  overflow: hidden;\n}\n\n#pan-scorecard .check.visible {\n  height: auto;\n}\n\n#pan-scorecard .check:before {\n  content: '\u25B6';\n  padding: 4px;\n  width: 20px;\n  text-align: center;\n  font-size: 11px;\n}\n\n#pan-scorecard .check.visible:before {\n  content: '\u25BC';\n}\n\n#pan-scorecard .check:hover {\n  background: #3722af;\n}\n\n#pan-scorecard .check .info {\n  flex: 1 1 100%;\n  margin-left: 28px;\n  visibility: hidden;\n  font-size: 14px;\n}\n\n#pan-scorecard .check .info.visible {\n  visibility: visible;\n}\n\n#pan-scorecard .check .info strong {\n  font-weight: 500;\n}\n\n#pan-scorecard .check .description,\n#pan-scorecard .check .reason,\n#pan-scorecard .check .detail {\n  margin-bottom: 10px;\n  word-wrap: break-word;\n}\n\n#pan-scorecard .check .detail {\n  font-size: small;\n  margin-bottom: 6px;\n}\n\n#pan-scorecard .name,\n#pan-scorecard .score {\n  height: 26px;\n  line-height: 26px;\n  font-size: 16px;\n}\n\n#pan-scorecard .name {\n  font-weight: 500;\n  color: #BBDEFB;\n  font-family: system-ui;\n}\n\n#pan-scorecard .score {\n  margin-left: auto;\n  font-family: 'mononoki';\n}\n", ".package-code {\n  visibility: hidden;\n  position: absolute;\n  z-index: 21;\n  min-width: 120px;\n  max-width: 600px;\n  max-height: 300px;\n  left: calc(50% + 500px);\n  top: 50%;\n  transform: translate(-50%, -50%);\n  color: #FFF;\n  border-radius: 4px;\n  text-align: left;\n  font-size: 14px;\n  font-family: \"mononoki\";\n  letter-spacing: 0.5px;\n  word-wrap: break-word;\n}\n\n.package-code pre {\n  background: white;\n  margin: 0;\n  padding: 0;\n  box-shadow:  0px 5px 3px rgba(0, 0, 0, 0.2);\n}\n\n.package-code code {\n  scrollbar-width: thin;\n}\n\n.package-code pre code.hljs {\n  padding-top: 0;\n}\n\n.package-code pre div.file {\n  padding: 8px;\n  text-align: right;\n  background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(232,232,232,1) 100%);\n  margin-bottom: 5px;\n}\n\n\n.package-code pre div a {\n  color: var(--secondary-darker);\n}\n\n.relevant-line {\n  background: rgb(255 221 124 / 27%);\n  padding: 2px 0px;\n}\n\n.hljs-ln-numbers {\n  -webkit-touch-callout: none;\n  -webkit-user-select: none;\n  -khtml-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n\n  text-align: center;\n  color: #ccc;\n  border-right: 1px solid #CCC;\n  vertical-align: top;\n  padding-right: 10px !important;\n}\n\n.hljs-ln-code {\n  padding-left: 10px;\n}\n\n.hljs-ln-n {\n  text-align: right;\n}\n\n.package-code table, .package-code table tr {\n  width: auto;\n  background: white;\n  height: auto;\n  line-height: normal;\n}\n\n.package-code table tr, .package-code table td {\n  border: none;\n  padding: 0;\n  text-align: left;\n  height: auto;\n  line-height: normal;\n}\n\n", "@import url(\"./header/header.css\");\n@import url(\"./pannels/scripts/scripts.css\");\n@import url(\"./pannels/overview/overview.css\");\n@import url(\"./pannels/vulnerabilities/vulnerabilities.css\");\n@import url(\"./pannels/scorecard/scorecard.css\");\n@import url(\"./pannels/warnings/warnings.css\");\n\nsection#package-info {\n  height: 100vh;\n  width: 400px;\n  top: 0px;\n  left: 0px;\n  background: var(--primary-darker);\n  padding: 15px;\n  flex-direction: column;\n  z-index: 20;\n  position: absolute;\n  transform: translateX(-100%);\n  -webkit-transform: translateX(-100%);\n}\n\nsection#package-info .package-container {\n  margin-bottom: 40px;\n  padding: 10px;\n  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(76, 50, 223, 0.2) 100%);\n  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(76, 50, 223, 0.2) 100%);\n  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(76, 50, 223, 0.2) 100%);\n  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#334c32df', GradientType=0);\n  border-radius: 0 0 8px 8px;\n  overflow-y: auto;\n  overflow-x: hidden;\n  height: calc(100vh - 315px);\n}\n\nsection#package-info>.package-navigation>div {\n  font-family: 'mononoki';\n}\n\n/**\n * NAVIGATION START\n */\nsection#package-info>.package-navigation {\n  display: flex;\n  position: relative;\n  justify-content: space-around;\n  height: 55px;\n  margin-top: 20px;\n  padding-top: 40px;\n  padding-bottom: 10px;\n  border-radius: 8px 8px 0 0;\n  background: -moz-linear-gradient(top, rgba(76, 50, 223, 0.2) 0%, rgba(0, 0, 0, 0) 100%);\n  background: -webkit-linear-gradient(top, rgba(76, 50, 223, 0.2) 0%, rgba(0, 0, 0, 0) 100%);\n  background: linear-gradient(to bottom, rgba(76, 50, 223, 0.2) 0%, rgba(0, 0, 0, 0) 100%);\n  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#334c32df', endColorstr='#00000000', GradientType=0);\n}\n\n.container-title {\n  display: flex;\n  justify-content: center;\n  width: 100%;\n  color: var(--secondary);\n  margin-bottom: 10px;\n  font-family: 'mononoki';\n  letter-spacing: 1px;\n  text-shadow: 1px 1px 5px #2a6f99;\n  position: absolute;\n  left: 0;\n  top: 10px;\n}\n\nsection#package-info>.package-navigation>div {\n  width: 45px;\n  height: 45px;\n  position: relative;\n  border-radius: 55px;\n  box-sizing: border-box;\n  background: var(--primary);\n  border: 2px solid #4c32df6b;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  transition: all 0.5s ease;\n}\n\nsection#package-info>.package-navigation>div:not(.active):not(.disabled):hover {\n  cursor: pointer;\n  background: #311B92;\n}\n\nsection#package-info>.package-navigation>div.active {\n  border: 2px solid var(--secondary);\n  background: #311B92;\n  color: var(--secondary);\n}\n\nsection#package-info>.package-navigation>div.disabled {\n  opacity: 0.3;\n}\n\nsection#package-info>.package-navigation>div.active:before {\n  content: \"\";\n  position: absolute;\n  bottom: -17px;\n  left: 10px;\n  width: 0;\n  height: 0;\n  border-left: 10px solid transparent;\n  border-right: 10px solid transparent;\n  border-top: 8px solid var(--secondary);\n}\n\nsection#package-info>.package-navigation>div>.signal {\n  position: absolute;\n  bottom: -2px;\n  right: -2px;\n  font-size: 12px;\n  font-family: \"mononoki\";\n  background: #FBC02D;\n  color: #000 !important;\n  border-radius: 100%;\n  width: 16px;\n  height: 16px;\n  align-items: center;\n  justify-content: center;\n  display: none;\n}\n\nsection#package-info>.package-navigation>div#scorecard-menu {\n  display: none;\n}\n\nsection#package-info>.package-navigation>div#scorecard-menu.red {\n  border: 2px solid #EF5350;\n  color: #FF80AB;\n}\nsection#package-info>.package-navigation>div#scorecard-menu.orange {\n  border: 2px solid #FDD835;\n  color: #FFD740;\n}\nsection#package-info>.package-navigation>div#scorecard-menu.blue {\n  border: 2px solid #2962FF;\n  color: #BBDEFB;\n}\nsection#package-info>.package-navigation>div#scorecard-menu.green {\n  border: 2px solid #00E676;\n  color: #B2FF59;\n}\n/**\n * NAVIGATION END\n */\n\n/**\n * TITLE\n */\nsection#package-info .head-title {\n  background: var(--primary-darker);\n  height: 28px;\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  border-bottom: 2px solid var(--primary-lighter);\n  border-radius: 2px 2px 0 0;\n}\n\nsection#package-info .head-title.no-margin {\n  margin-top: 0px;\n}\n\nsection#package-info .head-title>p {\n  text-shadow: 1px 1px 5px rgba(20, 20, 20, 0.5);\n  font-size: 18px;\n  font-variant: small-caps;\n  font-family: \"mononoki\";\n  font-weight: bold;\n  letter-spacing: 1px;\n  padding: 0 10px;\n}\n\nsection#package-info .head-title>span {\n  margin-left: auto;\n  background: #0068ff;\n  margin-right: 10px;\n  padding: 2px 5px;\n  border-radius: 4px;\n  font-size: 12px;\n  font-family: 'mononoki';\n  text-shadow: 2px 2px 5px #000000d4;\n  transition: all 0.5s ease;\n  cursor: pointer;\n}\n\nsection#package-info .head-title>span.disabled {\n  background: #3b3b3b;\n  cursor: default;\n  opacity: 0.3;\n}\n\nsection#package-info .head-title>span.active {\n  background: #7900ff;\n}\n\nsection#package-info .head-title>span.active:not(.disabled):hover {\n  background: #0068ff;\n}\n\nsection#package-info .head-title>span:not(.disabled):not(.active):hover {\n  background: #7900ff;\n}\n\n/**\n * FIELDS CONTAINER\n */\nsection#package-info .fields {\n  margin-top: 10px;\n  margin-bottom: 10px;\n}\n\n/**\n * LIST OF ITEMS\n */\nsection#package-info .list-item {\n  display: flex;\n  flex-wrap: wrap;\n  margin-top: 5px;\n  margin-bottom: 5px;\n  margin-left: -5px;\n}\n\nsection#package-info .list-item.line {\n  flex-direction: column;\n}\n\nsection#package-info .list-item>span {\n  padding: 0 10px;\n  height: 25px;\n  border-radius: 4px;\n  font-size: 13px;\n  flex-basis: 50px;\n  letter-spacing: 0.7px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-grow: 1;\n  color: #CFD8DC;\n}\n\nsection#package-info .list-item>span:not(.expandable).clickable:hover {\n  background: var(--secondary-darker);\n  color: #FFF;\n  cursor: pointer;\n}\n\nsection#package-info .list-item.line>span {\n  flex-basis: 25px;\n  justify-content: start;\n}\n\nsection#package-info .list-item>span {\n  margin-left: 5px;\n  margin-top: 5px;\n}\n\n/**\n * ANOTHER LIST OF ITEMS\n */\nsection#package-info ul li {\n  display: flex;\n  height: 23px;\n  font-size: 14px;\n  padding: 0 10px;\n  line-height: 26px;\n  border-radius: 2px;\n}\n\nsection#package-info ul li+li {\n  margin-top: 2px;\n}\n\nsection#package-info ul li>b {\n  font-weight: 500;\n  color: #BBDEFB;\n  font-family: system-ui;\n}\n\nsection#package-info ul li>p,\nsection#package-info ul li>a {\n  margin-left: auto;\n  color: #cfd8dc;\n}\n\nsection#package-info ul li.clickable i {\n  margin-left: 5px;\n}\n\nsection#package-info ul li.clickable:hover {\n  background-color: var(--primary-lighter);\n  color: #FFF;\n  cursor: pointer;\n}\n\n/**\n * HELP DIALOG START\n */\n.help-dialog {\n  display: flex;\n  padding: 10px;\n  border-radius: 8px;\n  margin-bottom: 10px;\n  border: 2px dashed #57e1bf4a;\n  color: #9de157;\n  letter-spacing: 0.5px;\n  align-items: center;\n}\n\n.help-dialog>i {\n  margin-right: 5px;\n  font-size: 28px;\n}\n\n.help-dialog>p {\n  font-size: 14px;\n  font-style: italic;\n}\n\n.help-dialog>p b {\n  background: #9de157;\n  padding: 2px 5px;\n  color: #000;\n  border-radius: 4px;\n  font-style: normal;\n  font-weight: bold;\n  cursor: pointer;\n}\n\n.help-dialog>p b:hover {\n  background: var(--secondary);\n}\n\n.help-dialog>p a {\n  color: inherit;\n  cursor: pointer;\n  text-decoration: underline;\n  font-weight: bold;\n}\n/**\n * HELP DIALOG END\n */\n", "#searchbar {\n  background: linear-gradient(to bottom, #37474f 0%, #263238 100%);\n  display: flex;\n  height: inherit;\n  box-sizing: border-box;\n  border-left: 2px solid #0f041a;\n}\n\n#searchbar>* {\n  transform: skewX(20deg);\n}\n\n#searchbar>div.search-items {\n  padding-left: 5px;\n  display: flex;\n  align-items: center;\n}\n\n#searchbar>div.search-items div.cancel {\n  cursor: pointer;\n  width: 14px;\n  height: 14px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 2px;\n  font-size: 14px;\n  font-family: \"roboto\";\n  color: #B3E5FC;\n  font-weight: bold;\n}\n\n#searchbar>div.search-items div:not(.cancel) {\n  padding: 5px;\n  background: #37474F;\n  border-radius: 3px;\n  font-size: 13px;\n  font-family: \"mononoki\";\n  display: flex;\n}\n\n#searchbar>div.search-items div p {\n  margin-left: 5px;\n}\n\n#searchbar>div.search-items div+div {\n  margin-left: 5px;\n}\n\n#searchbar>input {\n  width: 210px;\n  background: none;\n  border: none;\n  outline: none;\n  color: #FFF;\n  font-family: \"mononoki\";\n  margin-bottom: 2px;\n}\n\n#searchbar>input::placeholder {\n  color: #FFF;\n}\n\n#searchbar>i {\n  width: 45px;\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 22px;\n}\n\ndiv.search-result-background {\n  position: absolute;\n  display: none;\n  margin-top: 35px;\n  right: -130px;\n  min-width: 360px;\n  max-width: 400px;\n  padding: 10px !important;\n  background: #263238;\n  box-shadow: 1px 1px 10px rgba(20, 20, 20, 0.4);\n  border-radius: 4px;\n  box-sizing: border-box;\n  padding: 15px;\n  flex-direction: column;\n}\n\ndiv.search-result-background.show {\n  display: flex;\n}\n\ndiv.search-result-background>div.search-result-pannel {\n  display: flex;\n  flex-direction: column;\n  max-height: 70vh;\n  overflow-y: auto;\n}\n\ndiv.search-result-pannel>.helpers {\n  display: flex;\n  flex-direction: column;\n  border-bottom: 1px solid #37474F;\n  padding-bottom: 10px;\n  margin-bottom: 10px;\n  font-family: \"mononoki\";\n}\n\ndiv.search-result-pannel>.helpers.hide {\n  display: none;\n}\n\ndiv.search-result-pannel>.helpers>.title {\n  display: flex;\n  align-items: center;\n  font-size: 14px;\n  font-weight: bold;\n  margin-bottom: 3px;\n  color: #ECEFF1;\n  margin-bottom: 10px;\n}\n\ndiv.search-result-pannel>.helpers>.title>a {\n  margin-left: auto;\n  color: inherit;\n}\n\ndiv.search-result-pannel>.helpers>.line {\n  display: flex;\n  align-items: center;\n  font-size: 13px;\n  border-radius: 4px;\n  padding: 2px 10px;\n  min-height: 20px;\n}\n\ndiv.search-result-pannel>.helpers>.line.hide {\n  display: none;\n}\n\ndiv.search-result-pannel>.helpers>.line+.line {\n  margin-top: 2px;\n}\n\ndiv.search-result-pannel>.helpers>.line:hover {\n  cursor: pointer;\n  background: var(--secondary-darker);\n}\n\ndiv.search-result-pannel>.helpers>.line:hover p {\n  color: #FFF;\n}\n\ndiv.search-result-pannel>.helpers>.line b {\n  margin-right: 5px;\n  color: #E1F5FE;\n}\n\ndiv.search-result-pannel>.helpers>.line p {\n  color: #B0BEC5;\n}\n\ndiv.search-result-pannel .package {\n  background: rgba(69, 90, 100, 0.198);\n  align-items: center;\n  border-radius: 2px;\n  padding: 10px;\n  display: flex;\n  flex-shrink: 0;\n  text-shadow: 1px 1px 1px rgba(20, 20, 20, 0.5);\n  font-size: 14px;\n  letter-spacing: 0.7px;\n  margin-right: 2px;\n}\n\ndiv.search-result-pannel .package:hover {\n  color: #E1F5FE;\n  background: #01579B;\n  cursor: pointer;\n}\n\ndiv.search-result-pannel .package>p {\n  margin-right: 10px;\n}\n\ndiv.search-result-pannel .package>b {\n  color: #ffeb3b;\n  font-weight: bold;\n  margin-left: auto;\n}\n\ndiv.search-result-pannel .package.hide {\n  display: none !important;\n}\n\ndiv.search-result-pannel .package+.package {\n  margin-top: 5px;\n}\n\n#search-nav {\n  z-index: 30;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: absolute;\n  height: 30px;\n  left: 50px;\n  padding-left: 20px;\n  max-width: calc(100vw - 70px);\n  box-sizing: border-box;\n  background: var(--primary);\n  transform: skewX(-20deg);\n  box-shadow: 2px 1px 10px #26107f7a;\n}\n\n#search-nav:has(#searchbar[style*=\"display: none;\"]) {\n  display: none;\n}\n\n#search-nav .search-result-pannel .package {\n  height: 30px;\n  color: rgb(229, 229, 229);\n  display: flex;\n  align-items: center;\n  padding: 0 10px;\n  font-family: \"Roboto\";\n}\n\n#search-nav .packages {\n  height: inherit;\n  display: flex;\n  max-width: calc(100vw - 70px - 264px);\n  background: var(--primary);\n}\n\n#search-nav .packages>.package {\n  height: inherit;\n  color: rgb(229, 229, 229);\n  font-family: \"mononoki\";\n  display: flex;\n  align-items: center;\n  background: linear-gradient(to right,  rgba(55,34,175,1) 0%,rgba(87,74,173,1) 50%,rgb(59, 110, 205) 100%);\n  padding: 0 10px;\n  border-right: 2px solid #0f041a;\n  text-shadow: 1px 1px 10px #000;\n  color: #def7ff;\n}\n\n#search-nav .packages>.package>* {\n  transform: skewX(20deg);\n}\n\n#search-nav .packages>.package:first-child {\n  padding-left: 10px;\n}\n\n#search-nav .packages>.package:not(.active):hover {\n  background: linear-gradient(to right, rgba(55, 34, 175, 1) 1%, rgb(68, 121, 218) 100%);\n  color: #defff9;\n  cursor: pointer;\n}\n\n#search-nav .packages>.package.active {\n  background: linear-gradient(to right,  rgba(55,34,175,1) 0%,rgba(87,74,173,1) 50%,rgb(59, 110, 205) 100%);\n}\n\n#search-nav .packages>.package.active>b {\n  background: var(--secondary);\n}\n\n#search-nav .packages>.package.active>.remove {\n  display: block;\n}\n\n#search-nav .packages>.package>b:last-of-type:not(:first-of-type) {\n  background: #f57c00;\n}\n\n#search-nav .packages>.package>b{\n  font-weight: bold;\n  font-size: 12px;\n  margin-left: 5px;\n  background: var(--secondary-darker);\n  padding: 3px 5px;\n  border-radius: 2px;\n  font-family: \"Roboto\";\n  letter-spacing: 1px;\n}\n\n#search-nav .add {\n  height: inherit;\n  color: white;\n  font-size: 20px;\n  border: none;\n  background: var(--secondary-darker);\n  cursor: pointer;\n  padding: 0 7px;\n  transition: 0.2s all ease;\n  color: #def7ff;\n}\n\n#search-nav .add:hover {\n  background: var(--secondary);\n  cursor: pointer;\n}\n\n#search-nav .add>i {\n  transform: skewX(20deg);\n}\n\n#search-nav button.remove {\n  display: none;\n  border: none;\n  position: relative;\n  cu