:root {
    --dspace-ink: #07111f;
    --dspace-deep: #101a3a;
    --dspace-surface: #f4f7fb;
    --dspace-muted: #93a4b8;
    --dspace-accent: #7c3aed;
    --dspace-signal: #22d3ee;
}

.dspace-app {
    background:
        radial-gradient(circle at top right, rgba(34, 211, 238, 0.12), transparent 34rem),
        linear-gradient(135deg, var(--dspace-deep), var(--dspace-ink) 68%);
}

.dspace-app footer {
    color: var(--dspace-muted) !important;
}

.dspace-app footer a {
    color: var(--dspace-signal);
}

.tracking-wide {
    letter-spacing: 0.08em;
}

.dspace-game-shell {
    display: grid;
}

.dspace-game-sidebar {
    position: sticky;
    top: 0;
    width: 19rem;
    max-height: 100vh;
    overflow-y: auto;
    background: rgba(7, 17, 31, 0.82);
    backdrop-filter: blur(16px);
}

.dspace-game-sidebar__logo {
    width: 2rem;
    height: 2rem;
    image-rendering: pixelated;
}

.dspace-game-main {
    min-width: 0;
}

.dspace-game-mobile-header,
.dspace-game-content {
    background: rgba(7, 17, 31, 0.25);
}

.dspace-game-character__details {
    display: grid;
    gap: 0.75rem;
}

.dspace-game-character__details dt {
    color: var(--dspace-muted);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dspace-game-character__details dd {
    margin-bottom: 0;
    color: var(--dspace-surface);
}

.dspace-game-menu .nav-link {
    display: flex;
    align-items: center;
    color: rgba(244, 247, 251, 0.74);
    border: 1px solid transparent;
}

.dspace-game-menu .nav-link:hover,
.dspace-game-menu .nav-link:focus {
    color: var(--dspace-surface);
    background: rgba(34, 211, 238, 0.08);
    border-color: rgba(34, 211, 238, 0.18);
}

.dspace-game-menu .nav-link.active {
    color: var(--dspace-surface);
    background: rgba(34, 211, 238, 0.18);
    border-color: rgba(34, 211, 238, 0.34);
}

.dspace-game-menu .nav-link.disabled {
    color: rgba(148, 163, 184, 0.55);
}

.dspace-action-card {
    background: rgba(244, 247, 251, 0.035);
}

@media (min-width: 992px) {
    .dspace-game-shell {
        grid-template-columns: 19rem minmax(0, 1fr);
    }
}

.dspace-home {
    min-height: 100vh;
    background:
        radial-gradient(circle at top right, rgba(34, 211, 238, 0.22), transparent 34rem),
        linear-gradient(135deg, var(--dspace-deep), var(--dspace-ink) 62%);
    color: var(--dspace-surface);
}

.dspace-home .container-xl {
    max-width: 1180px;
}

.dspace-hero {
    min-height: calc(100vh - 8rem);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.dspace-mark {
    width: 8rem;
    height: 8rem;
    image-rendering: pixelated;
}

.dspace-app label.required::after {
    content: ' *';
    color: var(--bs-danger);
    font-weight: 700;
}

.dspace-details {
    display: grid;
    gap: 0.75rem;
}

.dspace-details__row {
    display: grid;
    gap: 0.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}

.dspace-details__row:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.dspace-details dt {
    color: var(--dspace-muted);
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dspace-details dd {
    margin-bottom: 0;
    color: var(--dspace-surface);
    font-size: 1.05rem;
}

@media (min-width: 768px) {
    .dspace-details__row {
        grid-template-columns: minmax(10rem, 16rem) 1fr;
        align-items: baseline;
    }
}