.chip-button {
    cursor: pointer;
}

.terminal-window-body,
.assistant-window-body,
.hire-window-body {
    padding: 20px;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.terminal-shell {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto 1fr auto;
    gap: 14px;
    padding: 20px;
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(5, 10, 20, 0.96), rgba(8, 15, 29, 0.98));
    color: #dbeafe;
    border: 1px solid rgba(148, 163, 184, 0.14);
}

.terminal-shell .card-heading h3,
.terminal-shell .card-heading .pill,
.terminal-shell .chip {
    color: inherit;
}

.terminal-shell .chip {
    background: rgba(59, 130, 246, 0.18);
    border-color: rgba(96, 165, 250, 0.18);
}

.terminal-output {
    overflow: auto;
    min-height: 0;
    padding-right: 4px;
    font-family: var(--mono-font);
    font-size: 0.9rem;
    display: grid;
    gap: 10px;
}

.terminal-line {
    line-height: 1.6;
    color: rgba(219, 234, 254, 0.92);
}

.terminal-line--muted {
    color: rgba(148, 163, 184, 0.9);
}

.terminal-line--error {
    color: #fca5a5;
}

.terminal-line--command {
    display: flex;
    gap: 10px;
    color: #e2e8f0;
}

.terminal-prefix {
    font-family: var(--mono-font);
    color: #60a5fa;
    flex: 0 0 auto;
}

.terminal-input-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 18px;
    background: rgba(15, 23, 42, 0.8);
    border: 1px solid rgba(148, 163, 184, 0.12);
}

.terminal-input-row input {
    flex: 1;
    min-width: 0;
    background: transparent;
    border: none;
    color: #f8fafc;
    outline: none;
    font-family: var(--mono-font);
}

.assistant-shell {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto auto 1fr auto;
    gap: 14px;
}

.assistant-messages {
    min-height: 0;
    overflow: auto;
    display: grid;
    gap: 12px;
    padding-right: 4px;
}

.assistant-message {
    display: grid;
    gap: 6px;
    max-width: min(92%, 460px);
    padding: 14px 16px;
    border-radius: 22px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 12px 24px rgba(148, 163, 184, 0.12);
}

.assistant-message--assistant {
    background: rgba(255, 255, 255, 0.92);
}

.assistant-message--user {
    margin-left: auto;
    background: linear-gradient(135deg, rgba(var(--accent-rgb), 1), rgba(var(--accent-rgb), 0.72));
    color: #ffffff;
}

.assistant-message--user .assistant-message-label,
.assistant-message--user p {
    color: inherit;
}

.assistant-message-label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted-ink);
}

.assistant-message p {
    margin: 0;
    line-height: 1.6;
}

.assistant-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: end;
}

.assistant-form textarea,
.hire-form textarea,
.hire-form input[type="text"],
.hire-form input[type="email"],
.hire-form select {
    width: 100%;
    min-height: 46px;
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
    color: var(--ink);
    resize: vertical;
}

.assistant-form textarea {
    min-height: 86px;
}

.achievement-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.achievement-metric {
    padding: 18px;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 12px 24px rgba(148, 163, 184, 0.14);
}

.achievement-metric strong {
    display: block;
    font-size: 1.8rem;
    margin-bottom: 6px;
}

.achievement-metric span {
    display: block;
    font-weight: 700;
    margin-bottom: 6px;
}

.achievement-metric small {
    color: var(--muted-ink);
    line-height: 1.5;
}

.achievement-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.7fr);
    gap: 16px;
}

.achievement-card-list {
    display: grid;
    gap: 14px;
}

.achievement-card {
    padding: 16px;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.achievement-card h4,
.achievement-card p {
    margin: 0;
}

.achievement-card p {
    line-height: 1.6;
}

.achievement-signal-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 12px;
}

.achievement-signal-list li {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.achievement-signal-list strong {
    font-size: 1.05rem;
}

.hire-layout {
    display: grid;
    grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr);
    gap: 16px;
}

.hire-form {
    display: grid;
    gap: 14px;
}

.hire-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.form-status {
    margin: 0;
    min-height: 22px;
    color: var(--muted-ink);
}

.form-status[data-state="success"] {
    color: #047857;
}

.form-status[data-state="error"] {
    color: #b91c1c;
}

.form-status[data-state="pending"] {
    color: #1d4ed8;
}

.form-status[data-state="paused"] {
    color: #b45309;
}

.toast-stack {
    position: fixed;
    right: 18px;
    bottom: 98px;
    width: min(360px, calc(100vw - 28px));
    display: grid;
    gap: 10px;
    z-index: 150;
}

.toast-card {
    display: grid;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 18px;
    background: rgba(15, 23, 42, 0.92);
    color: #f8fafc;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.24);
    transform: translateY(10px);
    opacity: 0;
    transition: transform 180ms ease, opacity 180ms ease;
}

.toast-card.is-visible {
    transform: translateY(0);
    opacity: 1;
}

.toast-card strong {
    font-size: 0.85rem;
}

.toast-card span {
    line-height: 1.5;
    color: rgba(248, 250, 252, 0.92);
}

.toast-card--success {
    border-color: rgba(74, 222, 128, 0.24);
}

.toast-card--error {
    border-color: rgba(248, 113, 113, 0.24);
}

.toast-card--warning {
    border-color: rgba(251, 191, 36, 0.24);
}

.toast-dismiss {
    justify-self: start;
    padding: 0;
    background: transparent;
    color: rgba(248, 250, 252, 0.78);
    font-size: 0.72rem;
    text-decoration: underline;
}

.tour-overlay {
    position: fixed;
    inset: 0;
    z-index: 160;
    pointer-events: none;
}

.tour-overlay.is-visible {
    pointer-events: auto;
}

.tour-spotlight {
    position: fixed;
    border-radius: 28px;
    box-shadow: 0 0 0 9999px rgba(2, 6, 23, 0.72);
    border: 2px solid rgba(255, 255, 255, 0.72);
    transition: all 220ms ease;
}

.tour-card {
    position: fixed;
    right: 22px;
    bottom: 112px;
    width: min(360px, calc(100vw - 28px));
    padding: 20px;
    border-radius: 24px;
    background: rgba(241, 245, 249, 0.96);
    border: 1px solid rgba(15, 23, 42, 0.08);
    color: var(--ink);
    box-shadow: 0 24px 56px rgba(15, 23, 42, 0.24);
}

.tour-card h2,
.tour-card p {
    margin: 0;
}

.tour-card p + .tour-footer,
.tour-card h2 + p {
    margin-top: 10px;
}

.tour-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
}

body[data-shell-mode="dark"] .app-window {
    --window-surface:
        linear-gradient(180deg, rgba(10, 16, 30, 0.98), rgba(14, 22, 40, 0.9));
    --window-surface-border: rgba(255, 255, 255, 0.08);
    --window-surface-divider: rgba(255, 255, 255, 0.08);
    background: var(--window-surface);
    border-color: var(--window-surface-border);
}

body[data-shell-mode="dark"] .window-chrome {
    background: var(--window-surface);
    border-bottom-color: var(--window-surface-divider);
}

body[data-shell-mode="dark"] .window-body {
    background: var(--window-surface);
}

body[data-shell-mode="dark"] .window-body::before {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.01) 22%, transparent 50%),
        radial-gradient(circle at top left, rgba(var(--accent-rgb), 0.14), transparent 28%);
}

body[data-shell-mode="dark"] .window-body p,
body[data-shell-mode="dark"] .window-body li,
body[data-shell-mode="dark"] .window-body span,
body[data-shell-mode="dark"] .window-body strong,
body[data-shell-mode="dark"] .window-body h2,
body[data-shell-mode="dark"] .window-body h3,
body[data-shell-mode="dark"] .window-body h4,
body[data-shell-mode="dark"] .window-title,
body[data-shell-mode="dark"] .start-menu,
body[data-shell-mode="dark"] .taskbar,
body[data-shell-mode="dark"] .system-clock {
    color: #e5edf8;
}

body[data-shell-mode="dark"] .window-body p,
body[data-shell-mode="dark"] .window-body li,
body[data-shell-mode="dark"] .stack-list span,
body[data-shell-mode="dark"] .feature-list li,
body[data-shell-mode="dark"] .contact-card span {
    color: rgba(226, 232, 240, 0.84);
}

body[data-shell-mode="dark"] .window-body strong,
body[data-shell-mode="dark"] .window-body h2,
body[data-shell-mode="dark"] .window-body h3,
body[data-shell-mode="dark"] .window-body h4 {
    color: #f8fbff;
}

body[data-shell-mode="dark"] .taskbar {
    background:
        linear-gradient(180deg, rgba(8, 13, 24, 0.84), rgba(13, 20, 36, 0.64));
    box-shadow:
        0 30px 72px rgba(var(--accent-rgb), calc(0.16 + (var(--taskbar-glow) * 0.22))),
        0 18px 40px rgba(2, 6, 23, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.14);
}

body[data-shell-mode="dark"] .content-card,
body[data-shell-mode="dark"] .project-card,
body[data-shell-mode="dark"] .contact-card,
body[data-shell-mode="dark"] .hero-sidecard,
body[data-shell-mode="dark"] .achievement-metric,
body[data-shell-mode="dark"] .achievement-card,
body[data-shell-mode="dark"] .achievement-signal-list li {
    background: rgba(15, 23, 42, 0.72);
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: none;
}

body[data-shell-mode="dark"] .widget-card {
    background:
        linear-gradient(145deg, rgba(29, 39, 82, 0.98), rgba(35, 47, 96, 0.92) 52%, rgba(29, 39, 82, 0.9) 100%),
        radial-gradient(circle at 84% 18%, rgba(255, 255, 255, 0.08), transparent 28%);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    color: #e5edf8;
}

body[data-shell-mode="dark"] .widget-card::before {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.03) 42%),
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.1), transparent 32%);
}

body[data-shell-mode="dark"] .widget-card::after {
    opacity: 0.94;
}

body[data-shell-mode="dark"] .widget-card:hover {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

body[data-shell-mode="dark"] .hero-widget {
    background:
        linear-gradient(145deg, rgba(29, 39, 82, 0.99), rgba(40, 54, 108, 0.94) 48%, rgba(29, 39, 82, 0.92) 100%),
        radial-gradient(circle at 88% 18%, rgba(255, 255, 255, 0.08), transparent 28%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

body[data-shell-mode="dark"] .focus-widget {
    background:
        linear-gradient(145deg, rgba(29, 39, 82, 0.99), rgba(40, 54, 108, 0.94) 52%, rgba(29, 39, 82, 0.92) 100%),
        radial-gradient(circle at 18% 18%, rgba(255, 255, 255, 0.08), transparent 20%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

body[data-shell-mode="dark"] .quote-widget {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

body[data-shell-mode="dark"] .quote-widget {
    background:
        linear-gradient(145deg, rgba(29, 39, 82, 0.99), rgba(40, 54, 108, 0.94) 52%, rgba(29, 39, 82, 0.92) 100%),
        radial-gradient(circle at 18% 18%, rgba(255, 255, 255, 0.08), transparent 20%);
}

body[data-shell-mode="dark"] .stats-widget {
    background:
        linear-gradient(145deg, rgba(29, 39, 82, 0.99), rgba(40, 54, 108, 0.94) 52%, rgba(29, 39, 82, 0.92) 100%),
        radial-gradient(circle at 18% 18%, rgba(255, 255, 255, 0.08), transparent 20%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

body[data-shell-mode="dark"] .signals-grid article {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

body[data-shell-mode="dark"] .widget-card .chip,
body[data-shell-mode="dark"] .widget-card .pill {
    color: rgba(245, 248, 255, 0.96);
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

body[data-shell-mode="dark"] .icon-badge,
body[data-shell-mode="dark"] .mini-badge,
body[data-shell-mode="dark"] .app-icon {
    --icon-start: #1d2752;
    --icon-end: #1d2752;
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow:
        0 10px 28px rgba(9, 18, 38, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

body[data-shell-mode="dark"] .hero-widget .primary-button,
body[data-shell-mode="dark"] .hero-widget .secondary-button {
    color: #eef4ff;
    border-color: rgba(255, 255, 255, 0.14);
}

body[data-shell-mode="dark"] .hero-widget .primary-button {
    background: linear-gradient(180deg, rgba(23, 39, 74, 0.74), rgba(19, 32, 62, 0.68));
}

body[data-shell-mode="dark"] .hero-widget .secondary-button {
    background: linear-gradient(180deg, rgba(15, 27, 54, 0.9), rgba(12, 21, 42, 0.84));
}

body[data-shell-mode="dark"] .secondary-button,
body[data-shell-mode="dark"] .toolbar button,
body[data-shell-mode="dark"] .game-actions button,
body[data-shell-mode="dark"] .inline-actions button,
body[data-shell-mode="dark"] .upload-button,
body[data-shell-mode="dark"] .tab-button,
body[data-shell-mode="dark"] .control-field input[type="range"],
body[data-shell-mode="dark"] .control-field input[type="url"],
body[data-shell-mode="dark"] .control-field select,
body[data-shell-mode="dark"] .hire-form textarea,
body[data-shell-mode="dark"] .hire-form input[type="text"],
body[data-shell-mode="dark"] .hire-form input[type="email"],
body[data-shell-mode="dark"] .hire-form select,
body[data-shell-mode="dark"] .assistant-form textarea,
body[data-shell-mode="dark"] .start-menu,
body[data-shell-mode="dark"] .start-panel,
body[data-shell-mode="dark"] .launcher-chip,
body[data-shell-mode="dark"] .start-app.app-tile,
body[data-shell-mode="dark"] .recommended-item.start-card-link,
body[data-shell-mode="dark"] .start-link-tile {
    background:
        linear-gradient(180deg, rgba(12, 19, 34, 0.92), rgba(16, 25, 44, 0.82));
    color: #e5edf8;
    border-color: rgba(255, 255, 255, 0.08);
}

body[data-shell-mode="dark"] .taskbar-core,
body[data-shell-mode="dark"] .taskbar-app {
    background:
        linear-gradient(180deg, rgba(17, 28, 50, 0.96), rgba(10, 18, 34, 0.82));
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 12px 24px rgba(2, 6, 23, 0.18);
}

body[data-shell-mode="dark"] .taskbar-app.is-active {
    background:
        linear-gradient(180deg, rgba(33, 52, 88, 0.98), rgba(20, 34, 58, 0.92));
    border-color: rgba(var(--accent-rgb), 0.36);
}

body[data-shell-mode="dark"] .taskbar::before {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.03));
}

body[data-shell-mode="dark"] .taskbar-empty-state {
    color: rgba(229, 237, 248, 0.82);
}

body[data-shell-mode="dark"] #start-button {
    background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.94), rgba(65, 116, 223, 0.74));
    border-color: rgba(255, 255, 255, 0.14);
}

body[data-shell-mode="dark"] .taskbar-launcher,
body[data-shell-mode="dark"] .tray-power-button {
    background: linear-gradient(180deg, rgba(17, 28, 50, 0.96), rgba(10, 18, 34, 0.82));
    border-color: rgba(255, 255, 255, 0.08);
    color: #e5edf8;
}

body[data-shell-mode="dark"] .tray-power-button:hover,
body[data-shell-mode="dark"] .tray-power-button:focus-visible {
    background: linear-gradient(180deg, rgba(60, 17, 22, 0.92), rgba(43, 11, 16, 0.82));
    border-color: rgba(248, 113, 113, 0.24);
    color: #fecaca;
}

body[data-shell-mode="dark"] .start-search input {
    background: rgba(15, 23, 42, 0.86);
    color: #e5edf8;
    border-color: rgba(255, 255, 255, 0.08);
}

body[data-shell-mode="dark"] .start-search-glyph {
    color: rgba(226, 232, 240, 0.7);
}

body[data-shell-mode="dark"] .muted-copy,
body[data-shell-mode="dark"] .stack-list span,
body[data-shell-mode="dark"] .feature-list li,
body[data-shell-mode="dark"] .contact-card span,
body[data-shell-mode="dark"] .recommended-item span:last-child,
body[data-shell-mode="dark"] .app-meta,
body[data-shell-mode="dark"] .launcher-copy small,
body[data-shell-mode="dark"] .start-user span:last-child,
body[data-shell-mode="dark"] .achievement-metric small {
    color: rgba(226, 232, 240, 0.8);
}

@media (max-width: 920px) {
    .terminal-window-body,
    .assistant-window-body {
        padding: 12px;
    }

    .terminal-shell,
    .assistant-shell {
        gap: 12px;
        padding: 16px;
        border-radius: 22px;
    }

    .achievement-grid,
    .achievement-layout,
    .hire-layout,
    .hire-form-grid,
    .assistant-form {
        grid-template-columns: 1fr;
    }

    .assistant-form button,
    .tour-footer .inline-actions {
        width: 100%;
    }

    .assistant-messages,
    .terminal-output {
        padding-right: 0;
    }

    .tour-card {
        right: 10px;
        left: 10px;
        width: auto;
        bottom: 104px;
    }
}

@media (max-width: 640px) {
    .terminal-window-body,
    .assistant-window-body {
        padding: 10px;
    }

    .terminal-input-row {
        align-items: stretch;
        flex-direction: column;
    }

    .terminal-prefix {
        word-break: break-word;
    }

    .assistant-message {
        max-width: 100%;
        padding: 12px 14px;
        border-radius: 18px;
    }

    .assistant-form button {
        width: 100%;
    }

    .assistant-form textarea {
        min-height: 72px;
    }

    .toast-stack {
        right: 8px;
        left: 8px;
        width: auto;
        bottom: 84px;
    }

    .terminal-shell,
    .achievement-metric,
    .achievement-card {
        padding: 16px;
    }

    .terminal-output {
        font-size: 0.82rem;
    }

    .terminal-line--command {
        flex-direction: column;
        gap: 2px;
    }

    .tour-footer {
        align-items: stretch;
        flex-direction: column;
    }
}