/* Арканатсал - база: сброс, типографика, элементы форм */

*{box-sizing:border-box}
html,body{height:100%}

body{
  margin:0;
  background:var(--void);
  color:var(--text);
  font-family:var(--sans);
  font-weight:300;
  font-size:var(--fs-body);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

::selection{background:var(--signal);color:var(--void)}
:focus-visible{outline:1px solid var(--signal);outline-offset:3px}

h1,h2,h3{font-family:var(--display);font-weight:300;letter-spacing:-.01em;margin:0}
h1{font-size:var(--fs-hero);line-height:1.1}
h2{font-size:var(--fs-h2);line-height:1.2}
h3{font-family:var(--sans);font-weight:400;font-size:17px;line-height:1.35;letter-spacing:0}
p{margin:0 0 var(--s-4)}
a{color:var(--signal);text-decoration:none;border-bottom:1px solid transparent;transition:border-color var(--fast) var(--ease)}
a:hover{border-bottom-color:var(--signal)}

/* Служебная строка данных: моноширинный, разрядка, тихий цвет */
.data{font-family:var(--mono);font-size:var(--fs-data);letter-spacing:var(--ls-data);color:var(--muted)}
.label{
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:var(--ls-label);
  text-transform:uppercase;color:var(--muted);
}
.rubric{
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.2em;
  text-transform:uppercase;color:var(--signal);font-weight:500;
}

/* Формы */
input[type=date],input[type=time],input[type=text]{
  font-family:var(--mono);font-size:12px;color:var(--text);
  background:var(--panel);border:1px solid var(--line);
  padding:11px 12px;transition:border-color var(--fast) var(--ease);
}
input:hover{border-color:var(--line-2)}
input:focus{outline:none;border-color:var(--signal)}
input[type=range]{width:100%;accent-color:var(--flare);margin:var(--s-2) 0 var(--s-1)}

button{
  font-family:var(--mono);font-size:10.5px;letter-spacing:var(--ls-label);
  text-transform:uppercase;color:var(--void);background:var(--flare);
  border:1px solid var(--flare);padding:12px 22px;cursor:pointer;
  transition:background var(--fast) var(--ease),color var(--fast) var(--ease);
}
button:hover:enabled{background:transparent;color:var(--flare)}
button:disabled{opacity:.3;cursor:default}