:root{
  color-scheme:dark;
  --bg:#111214;
  --text:#f4f4f4;
  --muted:#747880;
  --edge:rgba(255,255,255,.07);
}

*{box-sizing:border-box}

html,
body{
  margin:0;
  min-height:100%;
  background:var(--bg);
}

body{
  min-height:100vh;
  color:var(--text);
  overflow-x:hidden;
}

button,
input,
textarea{
  font:inherit;
}

.settings-help,
.settings-status{
  margin:8px 2px 0;
  color:#6e7279;
  font-size:11px;
  line-height:1.45;
}

.settings-status{
  min-height:15px;
}

.settings-verified{
  width:22px;
  height:22px;
  object-fit:contain;
}

.style-mode-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}

.style-mode-row .style-mode{
  min-height:36px;
  margin:0;
  border:1px solid var(--edge);
  border-radius:10px;
  background:#141619;
  color:#7d8188;
  cursor:pointer;
}

.style-mode-row .style-mode.active{
  border-color:rgba(255,255,255,.15);
  background:#202328;
  color:#f0f0f1;
}

.colour-row{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:9px;
}

.colour-control{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:6px 8px 6px 11px;
  border:1px solid var(--edge);
  border-radius:10px;
  background:#101215;
  color:#858990;
  font-size:11px;
}

.colour-control input[type="color"]{
  width:29px;
  height:29px;
  padding:0;
  border:0;
  border-radius:7px;
  overflow:hidden;
  background:transparent;
  cursor:pointer;
}

.colour-control[hidden]{
  display:none;
}

.settings-secondary-button{
  border:1px solid rgba(255,255,255,.08)!important;
  background:rgba(255,255,255,.018)!important;
  color:#858990!important;
}

.settings-secondary-button:hover{
  background:rgba(255,255,255,.04)!important;
  color:#f1f1f2!important;
}

.danger-card{
  margin-top:0!important;
}

.danger-button{
  background:#32171b!important;
  color:#e8a6ad!important;
  border-color:rgba(213,91,103,.18)!important;
}

.danger-button:hover{
  background:#431d22!important;
}