/*!*************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js!./src/css/core/index.scss ***!
  \*************************************************************************************************************************************************/
/* [core] */
/* core:main */
@font-face
{
  font-family: 'Android101';
  src: url(../res/fonts/Android101.woff2);
}
html {
  font-family: sans-serif;
}
body {
  margin: 0;
  padding: 0;
}
body:not(.advanced) .advanced {
  display: none !important;
}
body:not(.expert) .expert {
  display: none !important;
}
body:not(.service) .service-on {
  display: none !important;
}
body.service .service-off {
  display: none !important;
}
body > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1em;
}
:is(body > header) h1 {
    font-family: 'Android101';
    margin: 0.125em;
  }
:is(body > header) menu {
    margin: 0.125em;
    margin-right: 0.25em;
    display: block;
  }
:is(:is(body > header) menu)  > li {
      display: inline-block;
      border-radius: 6px;
      padding: 0.25em;
    }
:is(:is(:is(body > header) menu) > li):hover {
        cursor: pointer;
      }
.disabled:is(:is(:is(body > header) menu) > li) {
        opacity: 0.5;
      }
.disabled:is(:is(:is(body > header) menu) > li):hover {
          cursor: not-allowed !important;
        }
body > footer {
  margin-top: 1em;
  text-align: center;
  font-size: 0.75em;
  opacity: 0.6;
}
body > section {
  display: none;
  margin: 0 1em;
  padding: 0.5em;
}
.active:is(body > section) {
    display: block;
  }
.info-page:is(body > section) {
    margin: 0 10%;
  }
button.primary {
  font-size: 1.1em;
}
:is(details > summary) h1,:is(details > summary) h2,:is(details > summary) h3,:is(details > summary) h4 {
    display: inline-block;
  }
dialog {
  border-radius: 6px;
  max-width: 55vw;
  max-height: 70vh;
}
dialog header,dialog footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
dialog button {
    border-radius: 4px;
  }
dialog label {
    display: block;
    margin: 0.5em 0.125em;
  }
section .notice {
  text-align: center;
  margin: 0.5em 15%;
  padding: 0.5em;
}
section .info, dialog .info {
  font-size: 0.9em;
  opacity: 0.8;
}
p.center {
  text-align: center;
}
@media (max-width: 800px)
{

/* core:smol */
  :is(body > header > menu > li) span {
    display: none;
  }
  .active:is(body > header > menu > li) span {
    display: inline;
  }
  .info-page:is(body > section) {
    margin: 0 1em;
  }

section .notice {
  margin: 0.5em 1em;
}
}
@media (prefers-color-scheme: light)
{

/* core:lite */

html,body {
  background-color: white;
  color: black;
}

body > header {
  background-color: azure;
  border-bottom: solid 1px lavender;
}
  :is(body > header) menu > li {
    background-color: aliceblue;
    border: solid 1px lavender;
  }
    .active:is(:is(body > header) menu > li) {
      background-color: white;
      color: purple;
    }
    :is(:is(body > header) menu > li):hover {
      color: blue;
    }

button.primary, button.ok {
  background-color: #f0fff0;
  color: green;
}
  :is(button.primary,button.ok):hover {
    background-color: green;
    color: white;
  }

button.delete, button.warn {
  background-color: #fff0f0;
  color: red;
}
  :is(button.delete,button.warn):hover {
    background-color: red;
    color: white;
  }

dialog {
  background-color: aliceblue;
  border: solid 1px lavender;
  color: black;
}
  dialog button {
    background-color: azure;
    color: black;
  }
    :is(dialog button):hover {
      background-color: white;
    }
    :is(dialog button):disabled {
      background-color: #f0f0f0 !important;
      color: gray !important;
    }

section .notice {
  background-color: yellow;
  border: dotted 1px black;
}
}
@media (prefers-color-scheme: dark)
{

/* core:dark */

html,body {
  background-color: black;
  color: white;
}

body > header {
  background-color: darkblue;
  border-bottom: solid 1px slateblue;
}
  :is(body > header) menu > li {
    background-color: midnightblue;
    border: solid 1px slateblue;
  }
    .active:is(:is(body > header) menu > li) {
      background-color: blue;
      color: lightpink;
    }
    :is(:is(body > header) menu > li):hover {
      color: yellow;
    }

button.primary, button.ok {
  background-color: #246624;
  color: mintcream;
}
  :is(button.primary,button.ok):hover {
    background-color: mintcream;
    color: green;
  }

button.delete, button.warn {
  background-color: #662424;
  color: mistyrose;
}
  :is(button.delete,button.warn):hover {
    background-color: mistyrose;
    color: red;
  }

dialog {
  background-color: darkblue;
  border: solid 1px slateblue;
  color: white;
}
  dialog button {
    background-color: midnightblue;
    color: white;
  }
    :is(dialog button):hover {
      background-color: black;
    }
    :is(dialog button):disabled {
      background-color: gray !important;
      color: silver !important;
    }

section .notice {
  background-color: orange;
  border: dotted 1px black;
}
}

/*!*************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js!./src/css/main/index.scss ***!
  \*************************************************************************************************************************************************/
/* [main] */
/* main:main */
#main > header {
  display: flex;
  align-items: center;
  justify-content: center;
}
:is(#main > header)  > input {
    border-radius: 8px;
    height: 2em;
    width: 50%;
  }
:is(#main > header)  > button {
    margin: 0 0.5em;
    background: none;
    border-radius: 8px;
    height: 2em;
    width: 2em;
  }
:is(#main > header) select {
    display: none;
  }
.expanded:is(#main > header)  > input {
      width: 37.5%;
    }
.expanded:is(#main > header) select {
      display: block;
    }
#main > div.info {
  display: none;
  margin: 0.25em 15%;
}
.active:is(#main > div.info) {
    display: block;
  }
#main > .actions {
  display: none;
  margin-top: 1em;
  text-align: center;
}
.active:is(#main > .actions) {
    display: flex;
    justify-content: space-evenly;
  }
#main > menu.listing {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  font-size: 1.125em;
}
#main > menu > li,
#main > .actions > button {
  display: inline-block;
  border-radius: 6px;
  padding: 0.25em;
  margin: 0.125em;
}
#main > menu > li {
  cursor: default;
}
dialog.editor {
  width: 55vw;
}
dialog.editor  > article {
    overflow: auto;
    max-height: 50vh;
  }
#passbox  > header {
    font-size: 0.9em;
    margin-bottom: 0.25em;
  }
:is(#passbox > header) address {
      font-style: normal;
      margin-right: 1em;
    }
:is(#passbox > header) .message {
      font-style: italic;
      opacity: 0.8;
    }
:is(#passbox > header) .actions {
      margin-left: 1em;
    }
:is(#passbox > header) .hidden {
      display: none;
    }
#passbox address {
    text-align: center;
  }
#passbox .pw {
    opacity: 0;
    overflow: auto;
    white-space: nowrap;
  }
.visible:is(#passbox .pw) {
      opacity: 1;
    }
#passbox .otp {
    /* TOTP not implemented yet */
    display: none;
    font-size: 1.2em;
  }
#passbox ul {
    padding: 0;
  }
:is(#passbox ul) li {
      padding: 0.125em;
      margin: 0.125em;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
:is(#passbox ul) .name {
      font-weight: bold;
    }
#source-value-prompt input[type="text"],#source-value-prompt input[type="password"] {
    width: 60%;
  }
#source-value-prompt label {
    white-space: nowrap;
  }
#source-value-prompt .remember {
    display: none;
  }
.active:is(#source-value-prompt .remember) {
      display: block;
    }
#create-rule details > summary > label {
  display: inline-block;
}
#rule-editor input.max-pw-len,#rule-editor input.pw-hash-offset {
    width: 4em;
  }
#rule-editor button,#rule-editor label {
    white-space: nowrap;
  }
#rule-editor > article {
  margin: 0.125em;
  padding: 0.125em;
}
#rule-editor summary {
  list-style-position: outside;
  margin-left: 1em;
}
:is(#rule-editor summary) h2,:is(#rule-editor summary) h3,:is(#rule-editor summary) h4 {
    cursor: pointer;
    display: inline-block;
    margin: 0.25em;
  }
/* nested details */
#rule-editor > article > details > details {
  margin-top: 0.5em;
  margin-left: 1em;
}
:is(:is(#rule-editor > article > details) > summary > header)  > div {
      display: none;
    }
:is(:is(#rule-editor > article > details) > summary > header)  > h3 code {
      display: none;
    }
:is(.has-items:is(#rule-editor > article > details) > summary > header)  > h3 code {
      display: inline;
      border-radius: 10px;
      opacity: 0.75;
      padding: 0.25em;
    }
:is(:is(#rule-editor > article > details):open > summary > header)  > div {
      display: block;
    }
:is(:is(#rule-editor > article > details):open > summary > header)  > h3 code {
      display: none !important;
    }
#rule-editor.is-new .not-new {
  display: none;
}
:is(#rule-editor .preset.group)  > .compose {
    display: none;
  }
.compose-true:is(#rule-editor .preset.group) > .compose.is-true {
    display: block;
  }
.compose-false:is(#rule-editor .preset.group) > .compose.is-false {
    display: block;
  }
#rule-editor ul {
  padding: 0.125em;
  margin: 0;
}
:is(#rule-editor ul)  > li {
    display: block;
    margin: 0.25em;
    padding: 0.125em;
  }
:is(:is(#rule-editor ul) > li)  > header > .actions {
      white-space: nowrap;
    }
:is(:is(:is(#rule-editor ul) > li) > header > .actions) div {
        display: inline-block;
      }
:is(#rule-editor .sources > ul > li) .src-value {
    display: none;
  }
.has-value:is(#rule-editor .sources > ul > li) .src-value {
      display: block;
    }
:is(#rule-editor .replacements li.rep) .repvals {
    white-space: nowrap;
  }
:is(#rule-editor .replacements li.rep) input {
    width: 4em;
  }
:is(#rule-editor .notes > ul > li) .notefields {
    white-space: nowrap;
  }
:is(#rule-editor .notes > ul > li) input.name {
    width: 12em;
  }
:is(#rule-editor .notes > ul > li) input.text {
    width: 24em;
  }
:is(#rule-editor .sources > ul > li) label > span {
    display: inline-block;
    margin-right: 0.5em;
  }
:is(#rule-editor .sources > ul > li) label.object > span {
    display: block;
  }
/* Hide the move-up/move-down buttons unless the option is enabled. */
body:not(.ui-move-btns) dialog.editor ul > li .actions > .move-btns {
  display: none !important;
}
@media (max-width: 800px) {

/* main:smol */
  :is(#main > header)  > input {
    width: 80%;
  }
    .expanded:is(#main > header)  > input {
      width: 40%;
    }

#main > div.info {
  margin: 0.25em 1em;
}

dialog {
  max-width: 90vw;
  max-height: 90vh;
}

dialog.editor {
  width: 90vw;
}
  dialog.editor  > article {
    max-height: 70vh;
  }
  :is(#rule-editor .notes > ul > li) .notefields {
    white-space: normal;
  }

  :is(#rule-editor .notes > ul > li) input {
    display: block;
    margin: 0.125em;
  }

  :is(#rule-editor .notes > ul > li) input.name {
    width: 18em;
  }

  :is(#rule-editor .notes > ul > li) input.text {
    width: 18em;
  }
}
@media (prefers-color-scheme: light) {

/* main:lite */

#main > header > button {
  background-color: aliceblue;
  border: solid 1px gray;
  color: black;
}
  :is(#main > header > button):hover {
    background-color: azure;
  }

#main > .actions > button {
  background-color: aliceblue;
  border: solid 1px gray;
  color: black;
}
  :is(#main > .actions > button):hover {
    color: blue;
  }

#main > menu.listing > li {
  background-color: #f0f0ff;
  color: black;
}
  .sstore:is(#main > menu.listing > li) {
    background-color: #fff0f0;
  }
  .lstore:is(#main > menu.listing > li) {
    background-color: #f0fff0;
  }
  :is(#main > menu.listing > li):hover {
    color: blue;
  }
  :is(#rule-editor > article > details > summary > header)  > h3 code {
    background-color: white;
    color: green;
  }

#rule-editor ul > li {
  border: dotted 1px silver;
  border-radius: 5px;
  background-color: #f6faff;
}
  .drag-over:is(#rule-editor ul > li) {
    border: dashed 2px darkgreen;
  }

#passbox ul > li {
  border-bottom: dotted 1px silver;
}
}
@media (prefers-color-scheme: dark) {

/* main:dark */

#main > header > button {
  background-color: darkblue;
  border: solid 1px silver;
  color: white;
}
  :is(#main > header > button):hover {
    background-color: midnightblue;
  }

#main > .actions > button {
  background-color: midnightblue;
  border: solid 1px silver;
  color: white;
}
  :is(#main > .actions > button):hover {
    color: yellow;
  }

#main > menu.listing > li {
  background-color: #242466;
  color: white;
}
  .sstore:is(#main > menu.listing > li) {
    background-color: #662424;
  }
  .lstore:is(#main > menu.listing > li) {
    background-color: #246624;
  }
  :is(#main > menu.listing > li):hover {
    color: yellow;
  }
  :is(#rule-editor > article > details > summary > header)  > h3 code {
    background-color: black;
    color: mintcream;
  }

#rule-editor ul > li {
  border: dotted 1px gray;
  border-radius: 5px;
  background-color: #102286;
}
  .drag-over:is(#rule-editor ul > li) {
    border: dashed 2px green;
  }

#passbox ul > li {
  border-bottom: dotted 1px gray;
}
}

/*!*************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js!./src/css/sync/index.scss ***!
  \*************************************************************************************************************************************************/
/* [sync] */
/* sync:main */
#sync .format.info {
  display: none;
}
.active:is(#sync .format.info) {
    display: block;
  }
#sync-service-login label > span {
    display: inline-block;
    width: 10em;
  }
#sync .auth-info .summary {
  text-align: center;
}
#sync .auth-info .buttons {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 800px) {
/* sync:smol */
}
@media (prefers-color-scheme: light) {

/* sync:lite */
  #sync-service-login input.highlight {
    border-color: red;
  }
  :is(#sync .auth-info .summary) .active-name {
    color: darkcyan;
    font-weight: bold;
  }

  :is(#sync .auth-info .summary) .active-user {
    color: darkgreen;
    font-weight: bold;
  }
}
@media (prefers-color-scheme: dark) {

/* sync:dark */
  #sync-service-login input.highlight {
    border-color: darkred;
  }
}