@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,300;0,600;1,300;1,600&family=Barlow:ital,wght@0,300;0,500;0,700;1,300;1,500;1,700&display=swap');

:root {
  --oklab-primary-navy: .35 -.03 -.1;
  --oklab-primary-green: .76 -.11 .13;
  --oklab-primary-gray: .51 0 0;
  --oklab-dark-gray: .51 0 -.01;
  --oklab-secondary-dark-blue: .55 -.02 -.05;
  --oklab-secondary-blue: .68 -.03 -.05;
  --oklab-secondary-sky-blue: .86 -.02 -.03;
  --oklab-secondary-green-apple: .66 -.09 .09;
  --oklab-secondary-green-sprout: .83 -.05 .07;
  --oklab-secondary-light-green: .9 -.03 -.05;
  --oklab-secondary-japonica: .66 .11 .07;
  --oklab-secondary-yellow: .83 .01 .14;
  --oklab-secondary-cloud: .83 0 .01;
  --oklab-secondary-chocolate: .52 .07 .09;
  --oklab-secondary-white: 1 0 0;
  --color-navy: oklab( var(--oklab-primary-navy) );
  --color-green: oklab( var(--oklab-primary-green) );
  --color-gray: oklab( var(--oklab-primary-gray) );
  --color-dark-gray: oklab( var(--oklab-dark-gray) );
  --color-dark-blue: oklab( var(--oklab-secondary-dark-blue) );
  --color-blue: oklab( var(--oklab-secondary-blue) );
  --color-japonica: oklab( var(--oklab-secondary-japonica) );
}/*

*,
*:before,
*:after {
    box-sizing: border-box
}

body {
    background-color: var(--white);
    background: radial-gradient(at 50% 0%, #fff 30%, #ccc);
    color: var(--gray);
    font-family: "ff-dagny-web-pro", "helvetica neue", helvetica, arial, sans-serif
}

a {
    color: var(--blue)
}

#login {
    width: min( 100%, 40rem )
}
*/
.login h1 a {
    all: initial;
    cursor: pointer;
    margin: 0 auto 1.5625rem;
    text-decoration: none;
    display: block;
    text-align: center
}
/*
.login h1 img {
    width: 100%;
    max-height: 10rem;
    vertical-align: middle
}

.login form {
    background: unset;
    border: none;
    box-shadow: none;
    padding: 0 1.25rem;
}
@media (min-width:40em){
    .login form {
        align-items: flex-start;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between
    }
}

#login form p,
.user-pass-wrap {
    border: unset;
    border-radius: .25rem;
    padding: .625rem
}

#login form .forgetmenot {
    border: 0;
    border-radius: 0;
    padding: initial
}

#login form p:first-child,
#login form p:first-child + * {
    margin-bottom: 1rem;
    background: #eee
}
@media (min-width:40em){
    #login form p:first-child,
    #login form p:first-child + * {
        width: calc( 50% - .625rem )
    }
}

input[type="text"],
input[type="password"] {
    box-shadow: none;
    border-radius: 0;
    border: none;
    color: inherit
}

input[type="text"]:focus,
input[type="password"]:focus {
    border: none;
    box-shadow: none;
    outline: 0
}

.login form .input,
.login input[type="text"],
.login input[type="password"] {
    margin: 0;
    padding: 0;
    min-height: 0;
    background: transparent
}

.login input[type="text"]:focus,
.login input[type="password"]:focus {
    background: transparent
}

.wp-core-ui .button,
.wp-core-ui .button-secondary {
    color: var(--blue);
}

.wp-core-ui .button-primary {
    background: var(--blue);
    border: 0;
    color: var(--white)
}

.wp-core-ui .button-primary:hover {
    background: hsl( var(--blue__hue) calc(var(--blue__sat) + 15%) calc(var(--blue__light) - 10%) )
}

.wp-core-ui .button-primary:active {
    background: hsl( var(--blue__hue) calc(var(--blue__sat) - 15%) calc(var(--blue__light) + 10%) )
}

.wp-core-ui .button-primary:focus {
    background: var(--blue);
    outline: var(--blue) auto 1px;
    outline-offset: .125rem;
    box-shadow: none
}

.login .button.wp-hide-pw {
    border: 0;
    font-size: 1.5rem;
    line-height: 1;
    width: 1.66667em;
    height: 100%;
    min-width: 0;
    min-height: 0;
    padding: 0
}

input[type="checkbox"] {
    border-color: var(--gray);
    color: var(--white);
}

input[type="checkbox"]:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 1px var(--blue)
}

input[type="checkbox"]:checked::before {
    content: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%232f52a2%27%2F%3E%3C%2Fsvg%3E)
}

.login #backtoblog a,
.login #nav a {
    color: var(--blue)
}

.login #backtoblog a:hover,
.login #nav a:hover,
.login h1 a:hover {
    color: hsl( var(--blue__hue) calc(var(--blue__sat) + 15%) calc(var(--blue__light) - 10%) )
}

.login #backtoblog a:focus,
.login #nav a:focus,
.login h1 a:focus {
    color: var(--blue);
    outline: var(--blue) auto 1px;
    box-shadow: none
}

.login .message {
    border-left-color: var(--gray)
}

.login #login_error {
    border-left-color: var(--orange)
}

#login form p.submit {
    border: 0
}*/