:root {
    --bh-ink: #17332e;
    --bh-muted: #5e6f6a;
    --bh-sea: #087f75;
    --bh-sea-dark: #05665e;
    --bh-sand: #f7f1e7;
    --bh-line: #d9e1de;
    --bh-white: #fff;
    --bh-error: #a12b2b;
    --bh-success: #176b47;
}
.bh-auth-shell,
.bh-dashboard {
    box-sizing: border-box;
    color: var(--bh-ink);
    font-family: inherit;
    margin: 2rem auto;
    max-width: 1120px;
    padding: 0 1rem;
}

.bh-auth-shell {
    max-width: 520px;
}

.bh-card {
    background: var(--bh-white);
    border: 1px solid var(--bh-line);
    border-radius: 18px;
    box-shadow: 0 12px 35px rgba(23, 51, 46, .08);
    padding: clamp(1.25rem, 3vw, 2rem);
}

.bh-card h2,
.bh-card h3,
.bh-dashboard h2 {
    color: var(--bh-ink);
    line-height: 1.15;
    margin: 0 0 .75rem;
}

.bh-eyebrow {
    color: var(--bh-sea);
    font-size: .76rem;
    font-weight: 750;
    letter-spacing: .12em;
    margin: 0 0 .5rem;
    text-transform: uppercase;
}

.bh-muted {
    color: var(--bh-muted);
}

.bh-small {
    font-size: .9rem;
}

.bh-form {
    display: grid;
    gap: .65rem;
    margin-top: 1.25rem;
}

.bh-form label,
.bh-card > label {
    font-size: .9rem;
    font-weight: 700;
}

.bh-form input[type="text"],
.bh-form input[type="password"],
.bh-form input[type="email"],
.bh-form textarea,
.bh-form select,
.bh-card input[type="url"] {
    background: var(--bh-white);
    border: 1px solid #aebdb8;
    border-radius: 10px;
    box-sizing: border-box;
    color: var(--bh-ink);
    font: inherit;
    min-height: 46px;
    padding: .65rem .8rem;
    width: 100%;
}

.bh-form input:focus,
.bh-form select:focus,
.bh-form textarea:focus,
.bh-card input[type="url"]:focus {
    border-color: var(--bh-sea);
    box-shadow: 0 0 0 3px rgba(8, 127, 117, .18);
    outline: none;
}

.bh-checkbox {
    align-items: center;
    display: flex;
    font-weight: 500 !important;
    gap: .5rem;
    margin: .2rem 0 .5rem;
}

.bh-button {
    align-items: center;
    background: var(--bh-sea);
    border: 0;
    border-radius: 999px;
    color: var(--bh-white) !important;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 750;
    justify-content: center;
    min-height: 46px;
    padding: .65rem 1.25rem;
    text-decoration: none !important;
}

.bh-button:hover,
.bh-button:focus-visible {
    background: var(--bh-sea-dark);
}

.bh-text-link,
.bh-card a {
    color: var(--bh-sea-dark);
}

.bh-dashboard-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.5rem;
}

.bh-dashboard-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.bh-setup-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin: 0 0 1.5rem;
    padding: 0;
    list-style: none;
}

.bh-setup-steps li {
    display: grid;
    grid-template-columns: 2.25rem 1fr;
    gap: .1rem .75rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid #dbe5e1;
    border-radius: .75rem;
    background: #fff;
}

.bh-setup-steps li > span {
    grid-row: 1 / 3;
    display: grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: #e8efed;
    color: #003c3a;
    font-weight: 800;
}

.bh-setup-steps li.is-complete > span { background: #003c3a; color: #fff; }
.bh-setup-steps small { color: #526762; line-height: 1.35; }
.bh-link-importer { margin: 1rem 0; padding: 1rem; border-radius: .75rem; background: #f5f2e9; }
.bh-link-importer h4 { margin-top: 0; }
.bh-advanced-settings { margin-top: 1rem; }
.bh-advanced-settings summary { cursor: pointer; font-weight: 700; }
.bh-advanced-settings[open] summary { margin-bottom: 1rem; }

@media (max-width: 720px) {
    .bh-setup-steps { grid-template-columns: 1fr; }
}

.bh-card-wide {
    grid-column: 1 / -1;
}

.bh-callout,
.bh-error,
.bh-success {
    border-radius: 10px;
    margin: 1rem 0;
    padding: .85rem 1rem;
}

.bh-callout {
    background: var(--bh-sand);
    color: var(--bh-ink);
    font-size: .9rem;
}

.bh-error {
    background: #fff0f0;
    border-left: 4px solid var(--bh-error);
    color: var(--bh-error);
}

.bh-success {
    background: #edfaf4;
    border-left: 4px solid var(--bh-success);
    color: var(--bh-success);
}

.bh-field-error {
    color: var(--bh-error);
}

.bh-account-tool + .bh-account-tool,
.bh-category-controls {
    margin-top: 1.25rem;
}

.bh-category-grid,
.bh-category-stats {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.bh-category-island,
.bh-category-stat,
.bh-shortlink-item {
    border: 1px solid var(--bh-line);
    border-radius: 12px;
    padding: 1rem;
}

.bh-category-island legend,
.bh-category-stat h6 {
    color: var(--bh-ink);
    font-weight: 750;
}

.bh-category-stat h6,
.bh-category-stat p {
    margin: 0 0 .35rem;
}

.bh-category-stat span {
    color: var(--bh-sea-dark);
    font-weight: 750;
}

.bh-slug-field {
    align-items: center;
    display: grid;
    gap: .5rem;
    grid-template-columns: auto minmax(0, 1fr);
}

.bh-slug-field span {
    color: var(--bh-muted);
    font-size: .85rem;
    overflow-wrap: anywhere;
}

.bh-shortlink-list {
    display: grid;
    gap: 1rem;
    margin-top: 1.25rem;
}

.bh-shortlink-actions {
    align-items: end;
    display: grid;
    gap: .75rem;
    grid-template-columns: minmax(0, 1fr) auto;
}

.bh-shortlink-delete {
    align-self: end;
}

.bh-button-danger {
    background: var(--bh-error);
}

.bh-button-danger:hover,
.bh-button-danger:focus-visible {
    background: #7e2020;
}

@media (max-width: 720px) {
    .bh-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .bh-dashboard-header {
        align-items: flex-start;
        gap: 1rem;
    }

    .bh-category-grid,
    .bh-category-stats,
    .bh-shortlink-actions,
    .bh-slug-field {
        grid-template-columns: 1fr;
    }
}