:root {
    --font-family-ui: "SF", Arial, sans-serif;
    --logo-height: 2.8rem;
    --logo-padding-x: 0.9rem;
    --logo-min-width: 8.2rem;
    --logo-radius: 0.5rem;
    --logo-bg: #000;
    --logo-fg: #fff;
    --logo-wordmark-shadow: 0.0625rem 0.0625rem 0.125rem #000;
    --logo-terra-weight: 600;
    --logo-linguarum-weight: 300;
}

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

/* Symbol primitive */
i,
symbol,
[symbol] {
    font-family: "symbols";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

html,
body {
    width: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    font-family: var(--font-family-ui);
}

body {
    min-height: 100vh;
}

button,
input,
textarea,
select {
    font: inherit;
}

button {
    cursor: pointer;
}

page {
    display: block;
    min-height: 100vh;
    opacity: 1;
    transition: opacity 0.18s ease;
}

page[page-leaving] {
    opacity: 0;
}

page > content {
display: flex;
width: 100%;
}

logo {
    display: inline-flex;
    align-items: center;
}

button[logo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: var(--logo-min-width);
    height: var(--logo-height);
    padding: 0 var(--logo-padding-x);
    border: none;
    border-radius: var(--logo-radius);
    background-color: var(--logo-bg);
    color: var(--logo-fg);
    text-decoration: none;
    cursor: pointer;
    line-height: 1;
}

terra,
linguarum {
    font-size: 1.5rem;
    letter-spacing: 0;
    cursor: default;
    color: var(--logo-fg);
    text-shadow: var(--logo-wordmark-shadow);
}

terra {
    font-weight: var(--logo-terra-weight);
}

linguarum {
    font-weight: var(--logo-linguarum-weight);
}

page[view="index"] {
    --logo-bg: whitesmoke;
    --logo-fg: #000;
    --logo-wordmark-shadow: 0.0625rem 0.0625rem 0.125rem white;
    --logo-linguarum-weight: 300;
}

challenge {
    display: block;
}

input[bot-trap] {
    position: absolute;
    left: -9999rem;
    opacity: 0;
    width: 0;
    height: 0;
}

toast {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    display: block;
    max-width: 22rem;
    padding: 0.7rem 0.9rem;
    border-radius: 0.55rem;
    background: rgba(0, 0, 0, 0.82);
    color: #fff;
    opacity: 0;
    transform: translateY(0.4rem);
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.18s ease;
    z-index: var(--toast-z-index);
}

toast[show] {
    opacity: 1;
    transform: translateY(0);
}

toast[success] {
    background: rgba(23, 115, 58, 0.92);
}

toast[error] {
    background: rgba(168, 28, 28, 0.92);
}



/*  */


