/* Arawn Guard canonical CSS bundle. Do not add an override layer.
 * Input inventory (SHA-256:bytes):
 * style.css=b02ff17d3e81126bbd7163dc3f5e8506a800ddc5b35c683e73ffebce4e966c62:39573
 * public.css=5122c0f2eb66be489718c8d23d1d07d530b9a3a3132fe12059b5e39d142860bd:31593
 * experience.css=f6ad21f98ee7305d7d0c197597c2a72353db686060ef674bb0cd4869d2c5eee4:102921
 * app-experience.css=32e3c4a72fac149a9fa19f827dd4ef995e489f3ee75050d6497e3f9be5a4f488:46008
 * arawn-brand.css=eed1dea7b5ea5ee1f25c4a622ef5b05c9bcd43dd414b7586c4cebe1a06cf4567:70180
 * marketing-polish.css=4a7cdc46fd727002d5f4d889866d27b35b55f35477bc111daba49b3871493fd6:57162
 * v23-1-product.css=c45ee4526e541ea9c162ffffd593e1d4f0e5c03f9491ff12d2a064b88d033b00:15956
 */

/* === CONSOLIDATED SOURCE: style.css === */
/* --- GOOGLE STYLE TECH DESIGN SYSTEM (CLIXIGUARD PREMIUM) --- */

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

:root {
    /* Harmony Palette: Cyber Dark Void with Neon Accents */
    --bg-primary: #050811;
    --bg-secondary: #0b0f19;
    --bg-card: rgba(13, 18, 34, 0.55);
    --bg-hover: rgba(99, 102, 241, 0.08);
    
    --text-primary: #f8fafc;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;
    
    --border-color: rgba(99, 102, 241, 0.12);
    --border-glow: rgba(99, 102, 241, 0.35);
    
    /* Neon Tech Color Signatures */
    --accent-primary: #6366f1; /* Cyber Indigo */
    --accent-secondary: #818cf8; /* Light Indigo */
    --accent-hover: #4f46e5;
    --accent-teal: #14b8a6; /* Neon Teal */
    --accent-pink: #d946ef; /* Cyber Pink */
    
    /* Status Colors */
    --success: #10b981;
    --warning: #f59e0b;
    --danger: #f43f5e; /* Vibrant Coral Red */
    --info: #06b6d4; /* Electric Cyan */
    
    /* Layout Sizes */
    --sidebar-width: 270px;
    --header-height: 70px;
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    
    /* Ambient Glow Shadows */
    --shadow-sm: 0 4px 20px rgba(0, 0, 0, 0.25);
    --shadow-md: 0 10px 30px -5px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 20px 50px -10px rgba(0, 0, 0, 0.6);
    --shadow-glow: 0 0 25px rgba(99, 102, 241, 0.18);
    
    --transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

body {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: 
        radial-gradient(circle at 15% 20%, rgba(99, 102, 241, 0.08) 0%, transparent 45%),
        radial-gradient(circle at 85% 80%, rgba(20, 184, 166, 0.06) 0%, transparent 45%),
        var(--bg-primary);
    color: var(--text-primary);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
    overflow-x: hidden;
}

/* Custom Sleek Scrollbar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: var(--bg-primary);
}
::-webkit-scrollbar-thumb {
    background: rgba(99, 102, 241, 0.2);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(99, 102, 241, 0.4);
}

.app-container {
    display: flex;
    min-height: 100vh;
}

/* --- PREMIUM SIDEBAR --- */
.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: var(--sidebar-width);
    height: 100vh;
    background: rgba(7, 10, 20, 0.85);
    border-right: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    z-index: 100;
    backdrop-filter: blur(20px);
    transition: var(--transition);
}

.sidebar-header {
    padding: 30px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}

.logo {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: 'Outfit', sans-serif;
    font-size: 22px;
    font-weight: 900;
    letter-spacing: -0.5px;
    color: var(--text-primary);
}

.logo span {
    background: linear-gradient(135deg, #ffffff 30%, #a5b4fc 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sidebar-nav {
    flex: 1;
    padding: 24px 16px;
    overflow-y: auto;
}

.sidebar-nav a {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 13px 18px;
    color: var(--text-secondary);
    text-decoration: none;
    border-radius: var(--radius-md);
    transition: var(--transition);
    margin-bottom: 8px;
    font-weight: 600;
    font-size: 14px;
    border: 1px solid transparent;
}

.sidebar-nav a:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
    border-color: rgba(99, 102, 241, 0.15);
    transform: translateX(4px);
}

.sidebar-nav a.active {
    background: linear-gradient(135deg, var(--accent-primary) 0%, #4f46e5 100%);
    color: white;
    box-shadow: 0 8px 25px rgba(99, 102, 241, 0.35);
    border-color: rgba(255, 255, 255, 0.15);
}

.sidebar-nav a svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    transition: var(--transition);
}

.sidebar-nav a.active svg {
    transform: scale(1.1);
}

.sidebar-footer {
    padding: 20px 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.03);
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(5, 8, 17, 0.4);
}

.user-info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.user-avatar {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, var(--accent-primary) 0%, var(--accent-pink) 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Outfit', sans-serif;
    font-weight: 800;
    font-size: 16px;
    color: white;
    box-shadow: 0 0 15px rgba(99, 102, 241, 0.25);
}

.user-details {
    display: flex;
    flex-direction: column;
}

.user-name {
    font-weight: 700;
    font-size: 14px;
    color: var(--text-primary);
}

.user-role {
    font-size: 11px;
    color: var(--accent-secondary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.logout-btn {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    transition: var(--transition);
    border: 1px solid transparent;
}

.logout-btn:hover {
    background: rgba(244, 63, 94, 0.12);
    color: var(--danger);
    border-color: rgba(244, 63, 94, 0.25);
    transform: scale(1.08);
}

.logout-btn svg {
    width: 20px;
    height: 20px;
}

/* --- MAIN LAYOUT CONTENT --- */
.main-content {
    flex: 1;
    margin-left: var(--sidebar-width);
    padding: 40px 48px;
    min-height: 100vh;
}

.page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
}

.page-header h1 {
    font-family: 'Outfit', sans-serif;
    font-size: 34px;
    font-weight: 900;
    letter-spacing: -0.75px;
    background: linear-gradient(135deg, #ffffff 40%, #94a3b8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.subtitle {
    color: var(--text-secondary);
    margin-top: 6px;
    font-size: 15px;
    font-weight: 500;
}

/* --- DYNAMIC STATS WIDGETS --- */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 24px;
    margin-bottom: 40px;
}

.stat-card {
    background: var(--bg-card);
    border-radius: var(--radius-lg);
    padding: 26px 28px;
    display: flex;
    align-items: center;
    gap: 22px;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
    backdrop-filter: blur(20px);
    position: relative;
    overflow: hidden;
}

.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, transparent 100%);
    opacity: 0;
    transition: var(--transition);
}

.stat-card:hover {
    transform: translateY(-6px);
    border-color: var(--border-glow);
    box-shadow: var(--shadow-md), var(--shadow-glow);
}

.stat-card:hover::before {
    opacity: 1;
}

.stat-icon {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-md);
    background: rgba(99, 102, 241, 0.12);
    color: var(--accent-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 0 10px rgba(99, 102, 241, 0.1);
    transition: var(--transition);
}

.stat-card:hover .stat-icon {
    transform: scale(1.1) rotate(3deg);
}

.stat-card.warning .stat-icon {
    background: rgba(245, 158, 11, 0.12);
    color: var(--warning);
}

.stat-card.danger .stat-icon {
    background: rgba(244, 63, 94, 0.12);
    color: var(--danger);
}

.stat-icon svg {
    width: 28px;
    height: 28px;
}

.stat-content {
    display: flex;
    flex-direction: column;
}

.stat-label {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.75px;
}

.stat-value {
    font-family: 'Outfit', sans-serif;
    font-size: 32px;
    font-weight: 900;
    color: var(--text-primary);
    line-height: 1.1;
    margin-top: 6px;
}

/* --- CHARTS & CARDS --- */
.charts-grid,
.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 40px;
}

.chart-card,
.dashboard-card,
.card {
    background: var(--bg-card);
    border-radius: var(--radius-lg);
    padding: 30px;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-sm);
    backdrop-filter: blur(20px);
    overflow: hidden;
    transition: var(--transition);
}

.chart-card:hover,
.dashboard-card:hover,
.card:hover {
    border-color: rgba(99, 102, 241, 0.2);
    box-shadow: var(--shadow-md);
}

.chart-card h3,
.dashboard-card h3,
.card h3 {
    font-family: 'Outfit', sans-serif;
    font-size: 18px;
    font-weight: 800;
    margin-bottom: 24px;
    color: var(--text-primary);
    letter-spacing: -0.2px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* --- DATA TABLES --- */
.data-table {
    width: 100%;
    border-collapse: collapse;
}

.data-table th,
.data-table td {
    padding: 16px 20px;
    text-align: left;
    border-bottom: 1px solid var(--border-color);
    font-size: 14px;
}

.data-table th {
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-muted);
    background: rgba(5, 8, 17, 0.35);
}

.data-table tbody tr {
    transition: var(--transition);
}

.data-table tbody tr:hover {
    background: var(--bg-hover);
}

.data-table code {
    font-family: monospace;
    font-size: 12px;
    padding: 4px 8px;
    background: rgba(5, 8, 17, 0.6);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    color: var(--accent-secondary);
}

/* --- STATUS & RISK GLOWING BADGES --- */
.status-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid transparent;
}

.status-badge.active,
.status-badge.safe {
    background: rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.25);
    color: #087a55;
    box-shadow: 0 0 10px rgba(16, 185, 129, 0.05);
}

.status-badge.inactive,
.status-badge.expired,
.status-badge.released {
    background: rgba(100, 116, 139, 0.08);
    border-color: rgba(100, 116, 139, 0.25);
    color: var(--text-secondary);
}

.status-badge.monitor {
    background: rgba(245, 158, 11, 0.08);
    border-color: rgba(245, 158, 11, 0.25);
    color: #805400;
    box-shadow: 0 0 10px rgba(245, 158, 11, 0.05);
}

.status-badge.suspicious {
    background: rgba(244, 63, 94, 0.08);
    border-color: rgba(244, 63, 94, 0.25);
    color: #a51f38;
    box-shadow: 0 0 10px rgba(244, 63, 94, 0.05);
}

.status-badge.high_risk {
    background: rgba(244, 63, 94, 0.12);
    border-color: rgba(244, 63, 94, 0.35);
    color: #f43f5e;
    box-shadow: 0 0 15px rgba(244, 63, 94, 0.1);
}

.risk-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 24px;
    padding: 0 8px;
    border-radius: 12px;
    font-family: 'Outfit', sans-serif;
    font-size: 13px;
    font-weight: 800;
    color: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.event-badge {
    display: inline-block;
    padding: 5px 10px;
    border-radius: var(--radius-sm);
    font-size: 10px;
    font-weight: 800;
    background: rgba(99, 102, 241, 0.15);
    color: var(--accent-secondary);
    border: 1px solid rgba(99, 102, 241, 0.25);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tracking-key {
    font-family: monospace;
    font-size: 12px;
    padding: 4px 8px;
    background: rgba(5, 8, 17, 0.6);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    color: var(--accent-secondary);
}

/* --- BUTTONS --- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 22px;
    border-radius: var(--radius-md);
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    border: 1px solid transparent;
    text-decoration: none;
    transition: var(--transition);
    gap: 8px;
}

.btn:active {
    transform: scale(0.96);
}

.btn-primary {
    background: linear-gradient(135deg, var(--accent-primary) 0%, #4f46e5 100%);
    color: white;
    box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3);
    border-color: rgba(255, 255, 255, 0.1);
}

.btn-primary:hover {
    box-shadow: 0 8px 25px rgba(99, 102, 241, 0.45);
    transform: translateY(-2px);
}

.btn-secondary {
    background: rgba(255, 255, 255, 0.03);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.btn-secondary:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.15);
    transform: translateY(-1px);
}

.btn-danger {
    background: rgba(244, 63, 94, 0.12);
    color: #a51f38;
    border-color: rgba(244, 63, 94, 0.25);
}

.btn-danger:hover {
    background: var(--danger);
    color: white;
    box-shadow: 0 4px 15px rgba(244, 63, 94, 0.35);
    transform: translateY(-1px);
}

.btn-success {
    background: rgba(16, 185, 129, 0.12);
    color: #087a55;
    border-color: rgba(16, 185, 129, 0.25);
}

.btn-success:hover {
    background: var(--success);
    color: white;
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.35);
    transform: translateY(-1px);
}

.btn-info {
    background: rgba(6, 182, 212, 0.12);
    color: #315b8a;
    border-color: rgba(6, 182, 212, 0.25);
}

.btn-info:hover {
    background: var(--info);
    color: white;
    box-shadow: 0 4px 15px rgba(6, 182, 212, 0.35);
    transform: translateY(-1px);
}

.btn-sm {
    padding: 8px 14px;
    font-size: 12px;
    border-radius: var(--radius-sm);
}

.btn-block {
    width: 100%;
}

/* --- FORMS & INPUTS --- */
.settings-form,
.login-form {
    display: flex;
    flex-direction: column;
}

.form-group {
    margin-bottom: 24px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 700;
    font-size: 13px;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="password"],
.form-group input[type="url"],
.form-group input[type="number"],
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 14px 18px;
    background: rgba(5, 8, 17, 0.6);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    font-size: 14px;
    transition: var(--transition);
    font-family: inherit;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.18);
    background: rgba(5, 8, 17, 0.85);
}

.form-group input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--accent-primary);
    cursor: pointer;
}

.checkbox-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

.checkbox-label {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    user-select: none;
}

.field-hint {
    display: block;
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 6px;
}

.form-actions {
    display: flex;
    gap: 14px;
    margin-top: 32px;
}

/* --- CLIENT BILLING & PLANS --- */
.plan-card {
    transition: var(--transition);
}

.plan-card.active-plan {
    border-color: var(--accent-primary) !important;
    box-shadow: var(--shadow-glow), var(--shadow-md) !important;
}

.plan-card ul li svg {
    color: var(--success);
    flex-shrink: 0;
}

/* --- SYSTEM ALERTS --- */
.alert {
    padding: 16px 22px;
    border-radius: var(--radius-md);
    margin-bottom: 30px;
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    backdrop-filter: blur(10px);
    animation: fadeIn 0.4s ease;
}

.alert-success {
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.35);
    color: #087a55;
    box-shadow: 0 4px 20px rgba(16, 185, 129, 0.05);
}

.alert-error {
    background: rgba(244, 63, 94, 0.1);
    border: 1px solid rgba(244, 63, 94, 0.35);
    color: #a51f38;
    box-shadow: 0 4px 20px rgba(244, 63, 94, 0.05);
}

/* --- GOOGLE OAUTH LOGS ERROR BOX --- */
.log-error-detail {
    background: rgba(244, 63, 94, 0.02);
}

.error-detail-box {
    padding: 12px 18px;
    background: rgba(244, 63, 94, 0.05);
    border: 1px solid rgba(244, 63, 94, 0.2);
    border-radius: var(--radius-sm);
    font-size: 13px;
    color: #fca5a5;
    line-height: 1.5;
}

/* --- SYSTEM LOGIN PAGE --- */
.login-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: 
        radial-gradient(circle at center, #0f162e 0%, var(--bg-primary) 100%);
}

.login-container {
    width: 100%;
    max-width: 460px;
    padding: 24px;
}

.login-card {
    background: var(--bg-card);
    border-radius: var(--radius-lg);
    padding: 50px 45px;
    border: 1px solid rgba(99, 102, 241, 0.15);
    box-shadow: var(--shadow-lg), var(--shadow-glow);
    backdrop-filter: blur(25px);
}

.login-header {
    text-align: center;
    margin-bottom: 38px;
}

.login-header .logo {
    justify-content: center;
    margin-bottom: 24px;
}

.login-header h1 {
    font-family: 'Outfit', sans-serif;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: -0.75px;
    margin-bottom: 10px;
    color: var(--text-primary);
}

.login-header p {
    color: var(--text-secondary);
    font-size: 14px;
    font-weight: 500;
}

.login-footer {
    text-align: center;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.03);
}

.login-footer p {
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 600;
}

/* --- KEYFRAME ANIMATIONS --- */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* --- RESPONSIVE MEDIA QUERIES --- */
@media (max-width: 1024px) {
    .charts-grid,
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .sidebar {
        transform: translateX(-100%);
    }

    .main-content {
        margin-left: 0;
        padding: 30px 24px;
    }

    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .stats-grid {
        grid-template-columns: 1fr;
    }
    
    .form-actions {
        flex-direction: column;
    }
}

/* P0/P1 component primitives */
.brand-mark {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: linear-gradient(135deg, #6366f1, #22d3ee);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .04em;
}
.brand-mark-large { width: 52px; height: 52px; margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.muted, small { color: var(--text-muted); }
.locale-form select { width: 100%; margin-top: 10px; }
.logout-btn { border: 0; cursor: pointer; }
.integration-site { margin-bottom: 32px; }
.integration-site h2 { display: flex; gap: 10px; align-items: baseline; }
.integration-grid, .platform-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.card, .integration-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 22px;
}
.card-header, .page-header, .badge-row, .button-row, .inline-form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
.stack-form { display: grid; gap: 14px; margin-top: 18px; }
.stack-form label { display: grid; gap: 7px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.badge {
    display: inline-flex;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(148,163,184,.14);
    font-size: 11px;
    font-weight: 700;
}
.badge-mode-live, .badge-status-connected { background: rgba(16,185,129,.15); color: #087a55; }
.badge-mode-mock, .badge-status-pending { background: rgba(245,158,11,.15); color: #805400; }
.badge-status-degraded, .badge-status-failed, .badge-status-revoked { background: rgba(239,68,68,.15); color: #f87171; }
.notice { border-radius: 12px; padding: 14px 16px; margin: 14px 0; }
.notice-info { background: rgba(59,130,246,.12); border: 1px solid rgba(59,130,246,.3); }
.notice-warning { background: rgba(245,158,11,.11); border: 1px solid rgba(245,158,11,.3); }
.status-list { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; }
.status-list dt { color: var(--text-muted); }
.object-selection { border-top: 1px solid var(--border-color); margin-top: 18px; padding-top: 18px; }
.check-row { display: flex !important; align-items: center; gap: 9px; padding: 7px 0; }
.table-responsive { overflow-x: auto; }
[dir="rtl"] .sidebar { left: auto; right: 0; }
[dir="rtl"] .main-content { margin-left: 0; margin-right: 280px; }
@media (max-width: 900px) {
    .integration-grid, .platform-settings-grid { grid-template-columns: 1fr; }
    [dir="rtl"] .main-content { margin-right: 0; }
}
/* --- CLIXIGUARD LIGHT-FIRST APP THEME --- */
:root{
    --bg-primary:#f6f8fc;--bg-secondary:#eef3fb;--bg-card:#ffffff;--bg-hover:#edf4ff;
    --text-primary:#14223a;--text-secondary:#52667f;--text-muted:#52667f;
    --border-color:#dde6f2;--border-glow:rgba(35,103,232,.28);
    --accent-primary:#1d4ed8;--accent-secondary:#2563eb;--accent-hover:#12479f;
    --primary:#1d4ed8;--surface-primary:#ffffff;--surface-secondary:#edf4ff;
    --accent-teal:#0aa9a1;--accent-pink:#c550a2;--shadow-sm:0 6px 22px rgba(30,64,120,.07);
    --shadow-md:0 15px 38px rgba(30,64,120,.1);--shadow-lg:0 28px 70px rgba(30,64,120,.14);
    --shadow-glow:0 0 28px rgba(35,103,232,.12)
}
[data-theme="dark"]{--bg-primary:#0b1220;--bg-secondary:#101a2d;--bg-card:#142038;--bg-hover:#1b2b48;--text-primary:#f3f7ff;--text-secondary:#a9b8cc;--text-muted:#8493a9;--border-color:#263650;--border-glow:rgba(105,160,255,.3);--accent-primary:#4d8dff;--accent-secondary:#78aaff;--accent-hover:#6d9ff7;--shadow-sm:0 6px 22px rgba(0,0,0,.18);--shadow-md:0 15px 38px rgba(0,0,0,.25);--shadow-lg:0 28px 70px rgba(0,0,0,.32)}
body{background:radial-gradient(circle at 12% 8%,rgba(35,103,232,.07),transparent 31%),var(--bg-primary)}
.sidebar{background:color-mix(in srgb,var(--bg-card) 94%,transparent);border-right-color:var(--border-color);box-shadow:5px 0 30px rgba(36,70,125,.04)}
.sidebar-header{border-bottom-color:var(--border-color)}.logo span{background:linear-gradient(135deg,var(--text-primary) 30%,var(--accent-primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.sidebar-nav a:hover{border-color:color-mix(in srgb,var(--accent-primary) 18%,var(--border-color))}.sidebar-nav a.active{background:linear-gradient(135deg,#1f63e4,#3e82f6);box-shadow:0 9px 24px rgba(35,103,232,.25)}
.sidebar-footer{padding:14px 13px;border-top-color:var(--border-color);background:var(--bg-secondary);gap:8px;flex-wrap:wrap}.user-avatar{background:linear-gradient(135deg,#2563eb,#51a0f7);box-shadow:0 5px 14px rgba(35,103,232,.2)}.user-role{color:var(--accent-primary)}.logout-btn{background:var(--bg-card);border:1px solid var(--border-color);color:var(--text-secondary)}.logout-btn:hover{background:#fff0f2;color:#d53d55}.locale-form select{background:var(--bg-card);border-color:var(--border-color);color:var(--text-secondary)}
.app-theme-toggle{order:3;display:grid;grid-template-columns:1fr 1fr;align-items:center;width:58px;height:30px;padding:2px;border:1px solid var(--border-color);border-radius:999px;background:var(--bg-card);color:var(--text-muted);cursor:pointer}.app-theme-toggle span{display:grid;place-items:center;height:24px;border-radius:50%;font-size:11px}.app-theme-toggle .theme-sun{background:#fff7df;color:#d68b00}.app-theme-toggle .theme-moon{background:transparent}[data-theme="dark"] .app-theme-toggle .theme-sun{background:transparent}[data-theme="dark"] .app-theme-toggle .theme-moon{background:#273958;color:#b9d0ff}
.card,.stat-card,.chart-card,.dashboard-card,.form-card,.integration-card{background:var(--bg-card);border-color:var(--border-color);box-shadow:var(--shadow-sm)}.stat-card:hover,.card:hover{border-color:color-mix(in srgb,var(--accent-primary) 26%,var(--border-color));box-shadow:var(--shadow-md)}
input,select,textarea{background:var(--bg-card);border-color:var(--border-color);color:var(--text-primary)}input:focus,select:focus,textarea:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px rgba(35,103,232,.12)}.data-table th{background:var(--bg-secondary);color:var(--text-secondary)}.data-table td{border-bottom-color:var(--border-color)}.data-table tr:hover td{background:var(--bg-hover)}.notice-info{background:#edf5ff;border-color:#cfe0ff;color:#315276}.notice-warning{background:#fff8e8;border-color:#f6dda5;color:#705315}[data-theme="dark"] .notice-info{background:#172b4d;color:#b9d0ff}[data-theme="dark"] .notice-warning{background:#382e18;color:#f4d88a}.modal-content,.dropdown-menu{background:var(--bg-card);border-color:var(--border-color)}code,.code-block{background:var(--bg-secondary);color:var(--text-primary);border-color:var(--border-color)}
@media(max-width:900px){.sidebar-footer{justify-content:flex-start}.app-theme-toggle{order:0}}
.table-responsive{overflow-x:auto}.table-subline{display:block;margin-top:2px}.button-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.onboarding-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:22px}.onboarding-steps span{display:flex;align-items:center;gap:9px;padding:13px 15px;border:1px solid var(--border-color);border-radius:12px;background:var(--bg-card);color:var(--text-muted);font-size:11px;font-weight:700}.onboarding-steps i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--bg-secondary);font-style:normal}.onboarding-steps .complete{color:#087d50}.onboarding-steps .complete i{background:#e9fbf3}.onboarding-steps .active{border-color:rgba(35,103,232,.32);background:#edf5ff;color:#205fcf}.onboarding-steps .active i{background:#2563eb;color:#fff}.setup-kicker{color:var(--accent-primary);font-size:9px;font-weight:850;letter-spacing:.12em}.setup-details{margin-top:24px}.integration-next-card{background:linear-gradient(150deg,var(--bg-card),var(--bg-secondary))}.integration-next-card h2{margin-top:8px}.integration-next-card>p{margin-top:9px}.next-platform{display:flex;align-items:flex-start;gap:12px;margin-top:15px;padding:14px;border:1px solid var(--border-color);border-radius:13px;background:var(--bg-card)}.next-platform .platform-logo{flex:0 0 38px;width:38px;height:38px}.next-platform strong,.next-platform small{display:block}.next-platform strong{font-size:13px}.next-platform small{margin-top:3px;font-size:10px;line-height:1.5}.integration-next-card>.btn{margin-top:20px}.capability-honesty{font-size:9px!important;line-height:1.55}.empty-state h2{margin-bottom:7px}.empty-state p{max-width:650px;margin:0 auto 18px}
@media(max-width:720px){.onboarding-steps{grid-template-columns:1fr}.button-row{min-width:420px}.integration-next-card{margin-top:15px}}
/* Temporary traffic controls v15 */
#temporary-controls{position:relative;overflow:hidden;border-color:rgba(35,103,232,.24);background:linear-gradient(145deg,var(--bg-card) 0%,var(--bg-card) 58%,rgba(35,103,232,.055) 100%)}
#temporary-controls:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#2563eb,#13b9c9,#74a7ff)}
#temporary-controls .section-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}
#temporary-controls .section-heading-row h2{margin:.25rem 0 .35rem}
#temporary-controls .section-heading-row p{max-width:780px;margin:0;color:var(--text-secondary);line-height:1.65}
#temporary-controls .eyebrow{color:var(--accent-primary);font-size:.7rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
#temporary-controls .stack-form{margin:1.1rem 0 1.5rem;padding:1.1rem;border:1px solid var(--border-color);border-radius:16px;background:var(--bg-secondary)}
#temporary-controls h3{margin:1.55rem 0 .75rem;font-size:1rem}
#temporary-controls .compact-empty{padding:1.4rem;margin:1rem 0;background:var(--bg-secondary);border:1px dashed var(--border-color);border-radius:14px}
#temporary-controls .compact-empty h3{margin:0 0 .35rem}
#temporary-controls .compact-empty p{margin:0 0 1rem}
#temporary-controls .text-muted{margin:1rem 0 0;color:var(--text-muted);line-height:1.6}
#temporary-controls .status-monitor,#temporary-controls .status-proposed,#temporary-controls .status-queued{background:#eef5ff;color:#1f5ec8;border-color:#cfe0ff}
#temporary-controls .status-applying,#temporary-controls .status-restoring{background:#fff8e6;color:#9a6200;border-color:#f5dfaa}
#temporary-controls .status-paused{background:#fff0f0;color:#b4232f;border-color:#ffcdd1}
#temporary-controls .status-restored{background:#eafaf3;color:#087d50;border-color:#bdebd7}
#temporary-controls .status-rejected,#temporary-controls .status-failed,#temporary-controls .status-manual_setup_required{background:#fff1eb;color:#a33c18;border-color:#ffd0bd}
[data-theme="dark"] #temporary-controls{background:linear-gradient(145deg,var(--bg-card),rgba(35,103,232,.08))}
[data-theme="dark"] #temporary-controls .status-badge{filter:saturate(.8);border-color:var(--border-color)}
@media(max-width:760px){#temporary-controls .section-heading-row{align-items:stretch;flex-direction:column}#temporary-controls .section-heading-row>.status-badge{align-self:flex-start}#temporary-controls .stack-form{padding:.85rem}#temporary-controls table{min-width:760px}}
@media(prefers-reduced-motion:reduce){#temporary-controls *,#temporary-controls *:before,#temporary-controls *:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Account security and TOTP v16 */
.account-security-header{align-items:flex-end;margin-bottom:1.4rem}.account-security-header>div{min-width:0}.account-security-header h1{margin:.3rem 0 .35rem;font-size:clamp(1.75rem,3vw,2.55rem);letter-spacing:-.04em}.account-security-header p{max-width:760px;margin:0;color:var(--text-secondary);line-height:1.65}.account-security-header>.status-badge{flex:0 0 auto}
.account-security-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:1.15rem;margin-bottom:1.15rem}.account-security-grid>*{min-width:0}.security-status-card{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);align-content:start;gap:.9rem 1rem;overflow:hidden}.security-status-card:after{content:"";position:absolute;right:-72px;bottom:-86px;width:210px;height:210px;border:28px solid color-mix(in srgb,var(--accent-primary) 7%,transparent);border-radius:50%;pointer-events:none}.security-card-icon,.totp-shield{display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#2563eb,#22a7de);box-shadow:0 12px 28px rgba(35,103,232,.22)}.security-card-icon{width:46px;height:46px;border-radius:14px;font-size:1.45rem}.security-status-card h2,.security-guidance-card h2,.totp-setup-panel h2,.security-management-grid h2,.recovery-code-panel h2{margin:0 0 .4rem;letter-spacing:-.025em}.security-status-card p,.security-guidance-card p,.totp-setup-panel p,.security-management-grid p,.recovery-code-panel p{color:var(--text-secondary);line-height:1.65}.security-status-card dl{position:relative;z-index:1;grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin:1rem 0}.security-status-card dl>div{padding:.85rem;border:1px solid var(--border-color);border-radius:13px;background:color-mix(in srgb,var(--bg-secondary) 72%,var(--bg-card))}.security-status-card dt{margin-bottom:.32rem;color:var(--text-muted);font-size:.7rem;font-weight:750}.security-status-card dd{margin:0;color:var(--text-primary);font-size:.86rem;font-weight:800;overflow-wrap:anywhere}.security-status-card form{position:relative;z-index:1;grid-column:1/-1}.security-guidance-card{background:linear-gradient(155deg,var(--bg-card),color-mix(in srgb,var(--accent-primary) 5%,var(--bg-card)))}.security-guidance-card ol{display:grid;gap:.75rem;margin:1rem 0;padding:0;counter-reset:security-step;list-style:none}.security-guidance-card li{position:relative;padding-left:2.3rem;color:var(--text-secondary);line-height:1.55}.security-guidance-card li:before{counter-increment:security-step;content:counter(security-step);position:absolute;left:0;top:-.1rem;display:grid;place-items:center;width:1.65rem;height:1.65rem;border-radius:50%;background:#eaf2ff;color:#1f63df;font-size:.7rem;font-weight:850}[data-theme="dark"] .security-guidance-card li:before{background:#1a3158;color:#9fc1ff}
.recovery-code-panel{position:relative;margin-bottom:1.15rem;border-color:color-mix(in srgb,#0aa981 30%,var(--border-color));background:linear-gradient(145deg,var(--bg-card),color-mix(in srgb,#0aa981 6%,var(--bg-card)))}.recovery-code-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;margin:1.1rem 0}.recovery-code-grid code{display:block;padding:.8rem .65rem;border:1px solid var(--border-color);border-radius:10px;background:var(--bg-card);font-size:.82rem;font-weight:800;letter-spacing:.06em;text-align:center;overflow-wrap:anywhere}.totp-setup-panel{margin:0 0 1.15rem;border-color:color-mix(in srgb,var(--accent-primary) 30%,var(--border-color));background:linear-gradient(145deg,var(--bg-card),color-mix(in srgb,var(--accent-primary) 4%,var(--bg-card)))}.totp-setup-panel .section-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.1rem}.totp-manual-key{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem;border:1px solid var(--border-color);border-radius:14px;background:var(--bg-secondary)}.totp-manual-key span{color:var(--text-secondary);font-size:.78rem;font-weight:750}.totp-manual-key code{max-width:100%;padding:.45rem .65rem;background:var(--bg-card);font-size:.95rem;letter-spacing:.12em;overflow-wrap:anywhere}.totp-uri{margin:1rem 0}.totp-uri summary{color:var(--accent-primary);cursor:pointer;font-size:.82rem;font-weight:750}.totp-uri code{display:block;margin-top:.65rem;padding:.8rem;white-space:normal;word-break:break-all}.security-management-grid .danger-zone{border-color:color-mix(in srgb,#dc3545 25%,var(--border-color));background:linear-gradient(145deg,var(--bg-card),color-mix(in srgb,#dc3545 4%,var(--bg-card)))}
.auth-page-totp{min-height:100vh}.auth-shell-totp{grid-template-columns:minmax(0,1fr) minmax(340px,500px);max-width:1180px}.auth-shell-totp>*{min-width:0}.totp-trust-list{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;margin-top:2rem;max-width:650px}.totp-trust-list>span{display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(255,255,255,.28);border-radius:13px;color:#fff;font-size:.75rem;font-weight:850;backdrop-filter:blur(10px)}.totp-trust-list p{margin:0}.totp-trust-list strong{display:block;margin-bottom:.2rem;color:inherit}.totp-shield{width:58px;height:58px;margin-bottom:1.15rem;border-radius:18px;font-size:1.7rem}.totp-challenge-card{align-self:center}.totp-challenge-card .form-group small{display:block;margin-top:.5rem;color:var(--text-muted);font-size:.72rem;line-height:1.5}
@media(max-width:980px){.account-security-grid{grid-template-columns:1fr}.auth-shell-totp{grid-template-columns:1fr}.auth-shell-totp .auth-value-panel{padding-bottom:2rem}.recovery-code-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.account-security-header{align-items:flex-start}.account-security-header>.status-badge{align-self:flex-start}.security-status-card{grid-template-columns:1fr}.security-card-icon{width:42px;height:42px}.security-status-card dl{grid-template-columns:1fr}.totp-setup-panel .section-heading-row,.totp-manual-key{align-items:flex-start;flex-direction:column}.totp-manual-key code{width:100%;font-size:.78rem;letter-spacing:.08em}.recovery-code-grid{grid-template-columns:1fr}.security-management-grid .btn,.totp-setup-panel .btn,.security-status-card .btn{width:100%;white-space:normal}.auth-shell-totp{display:block;padding-inline:1rem}.auth-shell-totp .auth-value-panel{padding-inline:.25rem}.totp-trust-list{gap:.75rem}.totp-challenge-card{width:100%;padding:1.35rem}.auth-topbar{gap:.75rem}.auth-topbar .marketing-logo span{font-size:1rem}.auth-topbar .btn{padding:.65rem .8rem;font-size:.72rem}}
@media(prefers-reduced-motion:reduce){.account-security-grid *,.auth-shell-totp *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.account-security-section{margin:0 0 1.15rem}.account-security-section>.section-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.15rem}.account-security-section>.section-heading-row h2{margin:.25rem 0 .4rem;letter-spacing:-.025em}.account-security-section>.section-heading-row p{max-width:760px;margin:0;color:var(--text-secondary);line-height:1.65}.security-sensitive-form{max-width:680px}.inline-security-form{margin-top:.75rem}.security-session-list{display:grid;gap:.7rem}.security-session-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem;border:1px solid var(--border-color);border-radius:14px;background:var(--bg-secondary)}.security-session-item>div{display:grid;gap:.25rem;min-width:0}.security-session-item strong{color:var(--text-primary);overflow-wrap:anywhere}.security-session-item span,.security-session-item small{color:var(--text-muted);font-size:.76rem}.security-session-actions,.identity-provider-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1rem}.security-session-actions>form,.identity-provider-card{min-width:0;padding:1rem;border:1px solid var(--border-color);border-radius:14px;background:var(--bg-secondary)}.security-session-actions h3{margin:0 0 .65rem}.identity-provider-card{display:grid;align-content:start;gap:.75rem}.identity-provider-heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.identity-provider-heading strong{font-size:1rem}.identity-provider-card p,.identity-provider-card small{margin:0;color:var(--text-secondary);line-height:1.55}.identity-provider-card .stack-form{margin-top:.35rem}.identity-provider-card .btn,.security-session-item .btn{min-height:44px}
@media(max-width:760px){.account-security-section>.section-heading-row,.security-session-item{align-items:flex-start;flex-direction:column}.security-session-actions,.identity-provider-grid{grid-template-columns:1fr}.security-session-item form,.security-session-item .btn,.account-security-section .security-sensitive-form>.btn{width:100%}}
@media(forced-colors:active){.security-session-item,.security-session-actions>form,.identity-provider-card{border:1px solid CanvasText}}

/* === CONSOLIDATED SOURCE: public.css === */
/* Arawn Guard public experience — light-first, accessible, original. */
.marketing-page,.auth-page{--public-bg:#fff;--public-soft:#f5f8ff;--public-card:#fff;--public-text:#10203b;--public-copy:#56657b;--public-muted:#7b889d;--public-line:#dfe7f3;--public-blue:#2563eb;--public-blue-2:#4d8dff;--public-blue-soft:#edf4ff;--public-cyan:#0aa9c4;--public-shadow:0 24px 70px rgba(32,75,142,.13);background:var(--public-bg);color:var(--public-text)}
[data-theme="dark"] .marketing-page,[data-theme="dark"] .auth-page{--public-bg:#0b1220;--public-soft:#101a2d;--public-card:#142038;--public-text:#f3f7ff;--public-copy:#a9b8cc;--public-muted:#8493a9;--public-line:#263650;--public-blue:#69a0ff;--public-blue-2:#8cb5ff;--public-blue-soft:#172b4d;--public-cyan:#48d3e9;--public-shadow:0 28px 80px rgba(0,0,0,.28)}
.marketing-page{min-height:100vh;background:radial-gradient(circle at 84% 9%,rgba(77,141,255,.11),transparent 30%),var(--public-bg)}
.marketing-shell{width:min(1200px,calc(100% - 48px));margin-inline:auto}.marketing-header{position:sticky;top:0;z-index:200;border-bottom:1px solid color-mix(in srgb,var(--public-line) 80%,transparent);background:color-mix(in srgb,var(--public-bg) 88%,transparent);backdrop-filter:blur(20px)}[data-theme="dark"] .marketing-header{background:rgba(9,15,26,.92);border-bottom-color:rgba(52,73,99,.8)}
.marketing-nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.marketing-logo{display:inline-flex;align-items:center;gap:11px;color:var(--public-text);font-size:19px;font-weight:850;letter-spacing:-.045em;text-decoration:none}.marketing-logo>span:last-child>span{color:var(--public-blue)}
.brand-symbol{position:relative;display:inline-grid;place-items:center;width:37px;height:37px;border-radius:12px;background:linear-gradient(145deg,#1d5fdc,#55a2ff);box-shadow:0 10px 24px rgba(35,103,232,.25);transform:rotate(-5deg)}.brand-symbol:before,.brand-symbol:after,.brand-symbol i:before{content:"";position:absolute;border:2px solid #fff;border-radius:9px}.brand-symbol:before{width:18px;height:21px;top:7px;left:8px;border-bottom-color:transparent}.brand-symbol:after{width:7px;height:2px;border-width:0 0 2px 2px;transform:rotate(-45deg);top:16px;left:15px;border-radius:0}.brand-symbol i:before{width:4px;height:4px;border-radius:50%;border-width:1px;top:10px;right:7px;background:#75e1ef}
.marketing-nav-links,.marketing-nav-actions{display:flex;align-items:center}.marketing-nav-links{gap:28px}.marketing-nav-actions{gap:12px}.marketing-nav-links a,.marketing-login-link,.marketing-footer a,.auth-topbar a{color:var(--public-copy);font-size:13px;font-weight:680;text-decoration:none;transition:.2s ease}.marketing-nav-links a:hover,.marketing-nav-links a.active,.marketing-login-link:hover,.marketing-footer a:hover,.auth-topbar a:hover{color:var(--public-blue)}
.marketing-nav-cta{padding:10px 17px}.public-locale-form select{width:auto;min-width:57px;height:38px;padding:5px 24px 5px 9px;border:1px solid var(--public-line);border-radius:10px;background:var(--public-card);color:var(--public-copy);font-size:11px}.theme-toggle{display:inline-grid;grid-template-columns:1fr 1fr;align-items:center;width:64px;height:34px;padding:3px;border:1px solid var(--public-line);border-radius:999px;background:var(--public-soft);color:var(--public-muted);cursor:pointer}.theme-toggle span{display:grid;place-items:center;height:26px;border-radius:50%;font-size:13px}.theme-sun{background:var(--public-card);color:#f59e0b;box-shadow:0 3px 8px rgba(15,23,42,.1)}[data-theme="dark"] .theme-sun{background:transparent;box-shadow:none}[data-theme="dark"] .theme-moon{background:#253653;color:#b9d0ff;box-shadow:0 3px 8px rgba(0,0,0,.25)}
.mobile-nav-toggle{display:none}.marketing-alert{padding-top:16px}.marketing-hero{position:relative;overflow:hidden;padding:92px 0 88px}.marketing-hero:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(35,103,232,.14) .8px,transparent .8px);background-size:24px 24px;mask-image:linear-gradient(90deg,transparent,#000 76%,transparent)}.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,.91fr) minmax(520px,1.09fr);align-items:center;gap:70px}.marketing-eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--public-blue);font-size:11px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.marketing-eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--public-cyan);box-shadow:0 0 0 5px color-mix(in srgb,var(--public-cyan) 15%,transparent)}
.hero-copy h1{max-width:700px;margin-top:20px;color:var(--public-text);font-size:clamp(48px,5.8vw,77px);line-height:1.02;letter-spacing:-.068em;text-wrap:balance}.hero-copy h1::first-line{color:var(--public-blue)}.hero-lead{max-width:650px;margin-top:24px;color:var(--public-copy);font-size:18px;line-height:1.75}.hero-actions{display:flex;align-items:center;gap:12px;margin-top:31px;flex-wrap:wrap}.btn-large{min-height:52px;padding:14px 22px;font-size:14px}.btn-primary{background:linear-gradient(135deg,#1f63e4,#3e82f6);box-shadow:0 12px 28px rgba(35,103,232,.23)}.btn-primary:hover{background:linear-gradient(135deg,#1855c8,#2f73e7);transform:translateY(-1px)}.btn-secondary{border:1px solid var(--public-line);background:var(--public-card);color:var(--public-text);box-shadow:0 8px 22px rgba(25,54,103,.06)}.btn-secondary:hover{border-color:color-mix(in srgb,var(--public-blue) 40%,var(--public-line));background:var(--public-blue-soft);color:var(--public-blue)}.btn-white{background:#fff;color:#1857ce;box-shadow:0 12px 28px rgba(7,33,86,.18)}.btn-white:hover{background:#f5f8ff;transform:translateY(-1px)}.hero-note{display:flex;align-items:center;gap:8px;margin-top:17px;color:var(--public-muted);font-size:12px}.hero-note span{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#e9fbf3;color:#0a9b61;font-weight:800}.trust-row{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:36px;border-top:1px solid var(--public-line);padding-top:21px}.trust-row div{padding-right:16px}.trust-row div+div{padding-left:17px;border-left:1px solid var(--public-line)}.trust-row strong,.trust-row span{display:block}.trust-row strong{font-size:12px;color:var(--public-text)}.trust-row span{margin-top:3px;color:var(--public-muted);font-size:9px;line-height:1.35}
.product-stage{position:relative;min-width:0;padding:22px 0}.stage-orbit{position:absolute;border:1px solid rgba(35,103,232,.16);border-radius:50%;pointer-events:none}.orbit-one{width:560px;height:560px;top:-38px;left:20px}.orbit-two{width:430px;height:430px;top:27px;left:84px}.preview-window{position:relative;z-index:2;display:grid;grid-template-columns:48px 1fr;overflow:hidden;border:1px solid color-mix(in srgb,var(--public-line) 90%,transparent);border-radius:22px;background:var(--public-card);box-shadow:var(--public-shadow);transform:perspective(1200px) rotateY(-2deg) rotateX(1deg)}.preview-sidebar{display:flex;flex-direction:column;align-items:center;gap:18px;padding:14px 10px;background:linear-gradient(180deg,#205fcf,#174ba8)}.preview-sidebar>span:not(.preview-mini-logo){width:20px;height:5px;border-radius:999px;background:rgba(255,255,255,.35)}.preview-sidebar>span.active{height:20px;border-radius:7px;background:#fff}.preview-mini-logo{position:relative;width:24px;height:24px;margin-bottom:10px;border-radius:7px;background:#fff}.preview-mini-logo:before{content:"";position:absolute;inset:6px 7px;border:2px solid #2563eb;border-radius:5px;border-bottom-color:transparent}.preview-main{min-width:0;padding:18px}.preview-topbar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-bottom:15px}.preview-topbar strong,.preview-topbar small{display:block}.preview-topbar strong{font-size:12px;color:var(--public-text)}.preview-topbar small{color:var(--public-muted);font-size:8px;margin-top:2px}.preview-live{display:flex;align-items:center;gap:6px;color:var(--public-muted);font-size:8px;font-weight:750}.preview-live i{width:6px;height:6px;border-radius:50%;background:#1bc27a;box-shadow:0 0 0 4px rgba(27,194,122,.12)}.preview-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.preview-metrics article{padding:13px;border:1px solid var(--public-line);border-radius:12px;background:var(--public-soft)}.preview-metrics span,.preview-metrics strong,.preview-metrics small{display:block}.preview-metrics span{color:var(--public-muted);font-size:8px}.preview-metrics strong{margin:4px 0 1px;color:var(--public-text);font-size:20px;letter-spacing:-.04em}.preview-metrics small{color:var(--public-muted);font-size:7px}.preview-content{display:grid;grid-template-columns:1.08fr .92fr;gap:9px;margin-top:9px}.traffic-panel,.signal-list{border:1px solid var(--public-line);border-radius:13px;background:var(--public-card)}.traffic-panel{padding:13px}.traffic-panel-head{display:flex;align-items:center;justify-content:space-between}.traffic-panel-head strong{font-size:9px}.traffic-panel-head span{padding:3px 6px;border-radius:5px;background:var(--public-soft);color:var(--public-muted);font-size:7px}.traffic-line{width:100%;height:155px;overflow:visible}.chart-grid{fill:none;stroke:var(--public-line);stroke-width:1}.chart-area{fill:url(#lineFill)}.chart-line{fill:none;stroke:#2f6df6;stroke-width:3;stroke-linecap:round}.traffic-line circle{fill:#fff;stroke:#2f6df6;stroke-width:3}.signal-list{display:grid;gap:7px;padding:9px}.signal-item{display:grid;grid-template-columns:32px minmax(0,1fr) 23px;align-items:center;gap:8px;padding:8px;border:1px solid var(--public-line);border-radius:9px;background:var(--public-soft)}.signal-score{display:grid;place-items:center;width:31px;height:31px;border-radius:8px;font-size:10px;font-weight:850}.signal-high{background:#fff0f2;color:#e1465b}.signal-medium{background:#fff8e8;color:#c98208}.signal-item strong,.signal-item small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.signal-item strong{color:var(--public-text);font-size:8px}.signal-item small{margin-top:2px;color:var(--public-muted);font-size:6px}.signal-platform{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;background:#fff;color:#2563eb;font-size:8px;font-weight:900;box-shadow:0 2px 5px rgba(15,23,42,.1)}.signal-platform.meta{background:#2563eb;color:#fff}.preview-disclaimer{margin:9px 0 0;color:var(--public-muted);font-size:7px}.floating-card{position:absolute;z-index:3;display:flex;align-items:center;gap:9px;padding:10px 12px;border:1px solid var(--public-line);border-radius:13px;background:color-mix(in srgb,var(--public-card) 92%,transparent);box-shadow:0 15px 35px rgba(32,75,142,.14);backdrop-filter:blur(15px)}.floating-card strong,.floating-card small{display:block}.floating-card strong{font-size:9px}.floating-card small{color:var(--public-muted);font-size:7px}.floating-protected{right:-23px;top:2px}.floating-protected>span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#e8fbf2;color:#0a9b61;font-weight:850}.floating-platform{left:-25px;bottom:-3px}.floating-platform>span{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;font-size:8px;font-weight:900}.floating-platform .google-dot{background:#fff;color:#2563eb;border:1px solid var(--public-line)}.floating-platform .meta-dot{margin-left:-14px;background:#2563eb;color:#fff;border:2px solid var(--public-card)}
.proof-strip{border-block:1px solid var(--public-line);background:var(--public-soft)}.proof-grid{min-height:96px;display:grid;grid-template-columns:.7fr repeat(4,1fr);align-items:center;gap:20px}.proof-grid span{color:var(--public-muted);font-size:10px;font-weight:750;text-transform:uppercase;letter-spacing:.1em}.proof-grid strong{color:var(--public-copy);font-size:11px;text-align:center}.marketing-section{padding:102px 0}.soft-section{background:var(--public-soft)}.section-heading{max-width:750px;margin:0 auto 49px;text-align:center}.section-heading-left{margin-left:0;text-align:left}.section-heading h2{margin-top:14px;color:var(--public-text);font-size:clamp(34px,4.3vw,53px);line-height:1.12;letter-spacing:-.055em;text-wrap:balance}.section-heading p{max-width:680px;margin:16px auto 0;color:var(--public-copy);font-size:15px;line-height:1.75}.section-heading-left p{margin-left:0}.process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.process-card{position:relative;min-height:310px;padding:28px;border:1px solid var(--public-line);border-radius:20px;background:var(--public-card);box-shadow:0 10px 35px rgba(34,68,125,.05);transition:.25s ease}.process-card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--public-blue) 35%,var(--public-line));box-shadow:0 22px 48px rgba(34,68,125,.1)}.process-number{position:absolute;right:24px;top:21px;color:var(--public-line);font-size:28px;font-weight:900}.process-icon,.feature-icon{display:grid;place-items:center;width:49px;height:49px;border-radius:14px;background:var(--public-blue-soft);color:var(--public-blue);font-size:21px}.process-card h3,.feature-card h3,.platform-card h3{margin-top:27px;color:var(--public-text);font-size:18px;line-height:1.35}.process-card p,.feature-card p,.platform-card p{margin-top:12px;color:var(--public-copy);font-size:13px;line-height:1.72}.process-card a{position:absolute;bottom:25px;color:var(--public-blue);font-size:12px;font-weight:750;text-decoration:none}.platform-compare{display:grid;grid-template-columns:1fr 1fr;gap:20px}.platform-card{position:relative;overflow:hidden;padding:34px;border:1px solid var(--public-line);border-radius:22px;background:var(--public-card);box-shadow:0 15px 45px rgba(34,68,125,.06)}.platform-card:after{content:"";position:absolute;width:190px;height:190px;right:-70px;top:-80px;border-radius:50%;background:var(--public-blue-soft)}.platform-card-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between}.platform-logo{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:12px;font-weight:900}.google-logo{background:#fff;color:#2563eb;border:1px solid #dfe7f3;box-shadow:0 5px 13px rgba(31,70,140,.1)}.meta-logo{background:#1968ec;color:#fff;box-shadow:0 5px 13px rgba(25,104,236,.23)}.platform-pill{padding:6px 9px;border-radius:999px;background:var(--public-blue-soft);color:var(--public-blue);font-size:8px;font-weight:850;letter-spacing:.08em}.platform-card h3{font-size:24px}.platform-card p{max-width:500px}.platform-card ul,.pricing-card ul{display:grid;gap:10px;margin-top:24px;list-style:none}.platform-card li,.pricing-card li{position:relative;padding-left:24px;color:var(--public-copy);font-size:12px}.platform-card li:before{content:"✓";position:absolute;left:0;color:#0ca56a;font-weight:900}.platform-note{display:flex;align-items:flex-start;gap:12px;margin-top:18px;padding:15px 17px;border:1px solid #cfe0ff;border-radius:13px;background:var(--public-blue-soft);color:var(--public-copy);font-size:11px;line-height:1.6}.platform-note>span{display:grid;place-items:center;flex:0 0 20px;height:20px;border-radius:50%;background:var(--public-blue);color:#fff;font-size:10px;font-weight:850}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.feature-card{padding:27px;border:1px solid var(--public-line);border-radius:18px;background:var(--public-card)}.feature-card h3{font-size:16px}.feature-card p{font-size:12px}.pricing-section{background:linear-gradient(135deg,var(--public-soft),var(--public-bg))}.pricing-layout{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:90px}.pricing-layout .section-heading{margin-bottom:0}.text-link{display:inline-block;margin-top:23px;color:var(--public-blue);font-size:13px;font-weight:750;text-decoration:none}.pricing-card{padding:34px;border:1px solid color-mix(in srgb,var(--public-blue) 25%,var(--public-line));border-radius:24px;background:var(--public-card);box-shadow:var(--public-shadow)}.pricing-top{display:flex;align-items:center;justify-content:space-between}.pricing-label{font-size:14px;font-weight:850}.pricing-badge{padding:5px 8px;border-radius:999px;background:#e9fbf3;color:#087d50;font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}[data-theme="dark"] .pricing-badge{background:#0f3d2c;color:#5fe3ac}.pricing-price{margin-top:22px;color:var(--public-text);font-size:48px;font-weight:900;letter-spacing:-.06em}.pricing-price small{font-size:10px;color:var(--public-muted);font-weight:650;letter-spacing:0}.pricing-card>p{margin-top:6px;color:var(--public-copy);font-size:12px}.pricing-card li span{margin-right:9px;color:#0ca56a;font-weight:900}.pricing-card .btn{margin-top:28px}.faq-shell{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px}.faq-list{border-top:1px solid var(--public-line)}.faq-list details{border-bottom:1px solid var(--public-line);padding:0 3px}.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 0;color:var(--public-text);font-size:14px;font-weight:750;cursor:pointer}.faq-list summary span{color:var(--public-blue);font-size:20px}.faq-list p{padding:0 30px 20px 0;color:var(--public-copy);font-size:12px;line-height:1.7}.marketing-cta{padding:24px 0 100px}.cta-panel{display:flex;align-items:center;justify-content:space-between;gap:50px;padding:48px;border-radius:27px;background:linear-gradient(125deg,#1559d0,#3b82f6 58%,#2aa7d2);box-shadow:0 25px 65px rgba(29,98,222,.25);color:#fff}.cta-panel .marketing-eyebrow{color:#cfe2ff}.cta-panel h2{max-width:720px;margin-top:12px;color:#fff;font-size:clamp(30px,4vw,48px);line-height:1.12;letter-spacing:-.05em}.cta-panel p{max-width:650px;margin-top:12px;color:#dceaff;font-size:13px}.cta-actions{display:flex;flex-direction:column;align-items:center;gap:12px;flex-shrink:0}.cta-actions>a:not(.btn){color:#fff;font-size:11px;text-decoration:none}
.marketing-footer{padding:62px 0 25px;border-top:1px solid var(--public-line);background:var(--public-soft)}.footer-grid{display:grid;grid-template-columns:1.7fr repeat(3,1fr);gap:50px}.footer-grid>div{display:flex;flex-direction:column;align-items:flex-start;gap:10px}.footer-grid strong{margin-bottom:6px;color:var(--public-text);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.footer-grid a{font-size:11px}.footer-brand p{max-width:330px;margin-top:5px;color:var(--public-copy);font-size:11px;line-height:1.65}.footer-bottom{display:flex;justify-content:space-between;gap:25px;margin-top:45px;padding-top:21px;border-top:1px solid var(--public-line);color:var(--public-muted);font-size:9px}
.inner-hero{position:relative;overflow:hidden;padding:105px 0 95px;background:linear-gradient(155deg,var(--public-soft),var(--public-bg))}.inner-hero-grid{display:grid;grid-template-columns:1fr .72fr;align-items:center;gap:80px}.inner-hero h1{max-width:800px;margin-top:16px;color:var(--public-text);font-size:clamp(48px,6vw,75px);line-height:1.04;letter-spacing:-.065em}.inner-hero p{max-width:670px;margin-top:22px;color:var(--public-copy);font-size:17px;line-height:1.75}.about-visual{position:relative;display:grid;place-items:center;min-height:360px}.about-ring{position:absolute;border:1px solid color-mix(in srgb,var(--public-blue) 23%,transparent);border-radius:50%}.ring-a{width:330px;height:330px}.ring-b{width:240px;height:240px}.about-core{display:grid;place-items:center;width:155px;height:155px;border-radius:42px;background:linear-gradient(145deg,#1c61dc,#59a8ff);box-shadow:0 28px 60px rgba(35,103,232,.28);color:#fff;transform:rotate(-5deg)}.about-core>*{transform:rotate(5deg)}.about-core i{width:26px;height:31px;border:3px solid #fff;border-bottom-color:transparent;border-radius:11px}.about-core strong{font-size:16px}.about-core small{color:#dceaff;font-size:8px}.story-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}.story-copy p{color:var(--public-copy);font-size:17px;line-height:1.9}.story-copy p+p{margin-top:20px}.principles-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.principles-grid article{padding:27px;border:1px solid var(--public-line);border-radius:18px;background:var(--public-card)}.principles-grid article>span{color:var(--public-blue);font-size:10px;font-weight:850}.principles-grid h3{margin-top:22px;font-size:16px}.principles-grid p{margin-top:10px;color:var(--public-copy);font-size:12px;line-height:1.7}.platform-truth{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:80px}.platform-truth h2{margin-top:14px;font-size:clamp(34px,4vw,50px);line-height:1.12;letter-spacing:-.05em}.platform-truth>div>p{margin-top:16px;color:var(--public-copy);font-size:14px;line-height:1.7}.truth-stack{display:grid;gap:13px}.truth-stack article{display:flex;align-items:flex-start;gap:16px;padding:20px;border:1px solid var(--public-line);border-radius:16px;background:var(--public-card);box-shadow:0 10px 30px rgba(34,68,125,.05)}.truth-stack strong{font-size:14px}.truth-stack p{margin-top:5px;color:var(--public-copy);font-size:11px;line-height:1.6}.contact-layout{display:grid;grid-template-columns:.85fr 1.15fr;align-items:start;gap:90px}.contact-copy{padding-top:25px}.contact-copy h1{font-size:clamp(46px,5.5vw,70px)}.contact-options{display:grid;gap:9px;margin-top:34px}.contact-options article{display:flex;align-items:flex-start;gap:15px;padding:15px 0;border-top:1px solid var(--public-line)}.contact-options article>span{color:var(--public-blue);font-size:10px;font-weight:850}.contact-options strong{font-size:13px}.contact-options p{margin-top:3px;font-size:10px;line-height:1.5}.contact-card{padding:35px;border:1px solid var(--public-line);border-radius:25px;background:var(--public-card);box-shadow:var(--public-shadow)}.contact-card-head{display:flex;align-items:center;gap:15px;margin-bottom:27px}.contact-card-head h2{font-size:22px;letter-spacing:-.03em}.contact-card-head p{margin-top:3px;color:var(--public-copy);font-size:10px}.contact-card textarea{resize:vertical;min-height:125px}.form-privacy{margin-top:13px;color:var(--public-muted);font-size:9px;line-height:1.5}
.auth-page{min-height:100vh;background:linear-gradient(120deg,var(--public-soft) 0 50%,var(--public-bg) 50%)}.auth-topbar{width:min(1200px,calc(100% - 48px));min-height:78px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px}.auth-topbar>div{display:flex;align-items:center;gap:18px}.auth-topbar a{font-size:11px}.auth-topbar strong{margin-left:4px;color:var(--public-blue)}.auth-shell{width:min(1120px,calc(100% - 48px));margin:24px auto 70px;display:grid;grid-template-columns:.86fr 1.14fr;align-items:center;gap:80px}.auth-shell-login{grid-template-columns:1fr .85fr}.auth-value-panel{padding:40px 0}.auth-value-panel h1{max-width:570px;margin-top:17px;color:var(--public-text);font-size:clamp(38px,5vw,61px);line-height:1.07;letter-spacing:-.06em}.auth-value-panel>p{max-width:540px;margin-top:17px;color:var(--public-copy);font-size:14px;line-height:1.75}.auth-proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:31px}.auth-proof-grid article{padding:14px;border:1px solid var(--public-line);border-radius:13px;background:color-mix(in srgb,var(--public-card) 82%,transparent)}.auth-proof-grid article>span{color:var(--public-blue);font-size:13px}.auth-proof-grid strong,.auth-proof-grid small{display:block}.auth-proof-grid strong{margin-top:8px;font-size:10px}.auth-proof-grid small{margin-top:3px;color:var(--public-muted);font-size:8px;line-height:1.45}.auth-mini-preview{margin-top:18px;padding:17px;border:1px solid var(--public-line);border-radius:17px;background:color-mix(in srgb,var(--public-card) 88%,transparent);box-shadow:0 15px 40px rgba(34,68,125,.07)}.auth-preview-head{display:flex;align-items:center;justify-content:space-between;color:var(--public-muted);font-size:8px}.auth-preview-head span{display:flex;align-items:center;gap:6px}.auth-preview-head i{width:6px;height:6px;border-radius:50%;background:#1bc27a}.auth-preview-head strong{color:var(--public-text);font-size:9px}.auth-preview-bars{height:85px;display:flex;align-items:end;gap:8px;margin-top:13px;border-bottom:1px solid var(--public-line);background:repeating-linear-gradient(to bottom,var(--public-line) 0 1px,transparent 1px 28px)}.auth-preview-bars i{flex:1;height:var(--h);border-radius:5px 5px 0 0;background:linear-gradient(to top,#a9c7ff,#3579ef)}.auth-preview-bars i.warn{background:linear-gradient(to top,#ffd996,#f3a91b)}.auth-card{padding:37px;border:1px solid var(--public-line);border-radius:25px;background:var(--public-card);box-shadow:var(--public-shadow)}.auth-card-wide{padding:34px}.auth-card-heading{margin-bottom:24px}.auth-welcome{color:var(--public-blue);font-size:9px;font-weight:850;letter-spacing:.11em;text-transform:uppercase}.auth-card-heading h2{margin-top:8px;color:var(--public-text);font-size:28px;letter-spacing:-.045em}.auth-card-heading p{margin-top:6px;color:var(--public-copy);font-size:11px}.google-auth-button{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;padding:10px;border:1px solid var(--public-line);border-radius:11px;background:var(--public-card);color:var(--public-text);box-shadow:0 5px 15px rgba(34,68,125,.05);font-size:12px;font-weight:750;text-decoration:none;transition:.2s}.google-auth-button:hover{border-color:#b9cdf2;background:var(--public-blue-soft)}.google-auth-button.is-disabled{cursor:not-allowed;opacity:.68}.google-g{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#fff;color:#4285f4;border:1px solid #e4e9f1;font-weight:900}.provider-status{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:7px;color:var(--public-muted);font-size:8px}.provider-status span{width:6px;height:6px;border-radius:50%;background:#e6a31a}.auth-divider{display:flex;align-items:center;gap:11px;margin:19px 0;color:var(--public-muted);font-size:8px;text-transform:uppercase;letter-spacing:.08em}.auth-divider:before,.auth-divider:after{content:"";height:1px;flex:1;background:var(--public-line)}.auth-card .form-group{margin-bottom:14px}.auth-card label,.contact-card label{color:var(--public-text);font-size:10px;font-weight:750}.auth-card input,.auth-card select,.contact-card input,.contact-card select,.contact-card textarea{height:46px;margin-top:6px;border:1px solid var(--public-line);border-radius:10px;background:var(--public-bg);color:var(--public-text);font-size:12px}.contact-card textarea{height:auto}.auth-card input:focus,.auth-card select:focus,.contact-card input:focus,.contact-card select:focus,.contact-card textarea:focus{border-color:var(--public-blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--public-blue) 13%,transparent)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.field-hint{margin:-5px 0 14px;color:var(--public-muted);font-size:8px}.terms-check{display:flex;align-items:flex-start;gap:9px;margin-bottom:17px;color:var(--public-copy)!important;font-size:9px!important;line-height:1.5}.terms-check input{flex:0 0 16px;width:16px;height:16px;margin-top:1px}.auth-card-footer{display:flex;justify-content:center;gap:6px;margin-top:18px;color:var(--public-muted);font-size:10px}.auth-card-footer a,.auth-back-link{color:var(--public-blue);font-weight:750;text-decoration:none}.auth-back-link{display:block;margin-top:20px;text-align:center;font-size:9px}.auth-benefits{display:grid;gap:12px;margin-top:30px;list-style:none}.auth-benefits li{display:flex;align-items:flex-start;gap:12px}.auth-benefits li>span{display:grid;place-items:center;flex:0 0 27px;height:27px;border-radius:50%;background:#e9fbf3;color:#0a9b61;font-size:11px;font-weight:900}.auth-benefits strong,.auth-benefits small{display:block}.auth-benefits strong{font-size:12px}.auth-benefits small{margin-top:3px;color:var(--public-muted);font-size:9px}.auth-platform-note{display:flex;align-items:center;gap:8px;margin-top:28px;padding:14px;border:1px solid var(--public-line);border-radius:14px;background:color-mix(in srgb,var(--public-card) 78%,transparent)}.auth-platform-note .platform-logo{width:31px;height:31px;border-radius:9px;font-size:10px}.auth-platform-note p{margin-left:5px;color:var(--public-copy);font-size:8px;line-height:1.5}.honeypot-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
@media (max-width:1080px){.marketing-nav-links{gap:16px}.hero-grid{grid-template-columns:1fr;gap:60px}.hero-copy{text-align:center}.hero-copy h1,.hero-lead{margin-inline:auto}.hero-actions,.hero-note{justify-content:center}.product-stage{max-width:720px;margin:auto}.feature-grid,.principles-grid{grid-template-columns:repeat(2,1fr)}.auth-shell,.auth-shell-login{grid-template-columns:1fr;max-width:720px;gap:15px}.auth-value-panel{text-align:center}.auth-value-panel h1,.auth-value-panel>p{margin-inline:auto}.auth-benefits{text-align:left}.auth-page{background:var(--public-soft)}}
@media (max-width:840px){.marketing-nav-links{position:absolute;top:76px;left:24px;right:24px;display:none;flex-direction:column;align-items:stretch;padding:18px;border:1px solid var(--public-line);border-radius:16px;background:var(--public-card);box-shadow:var(--public-shadow)}.marketing-nav-links.is-open{display:flex}.mobile-nav-toggle{display:grid;gap:4px;width:37px;height:37px;padding:10px;border:1px solid var(--public-line);border-radius:10px;background:var(--public-card)}.mobile-nav-toggle span{height:2px;border-radius:2px;background:var(--public-text)}.marketing-nav-actions .public-locale-form{display:none}.marketing-nav{justify-content:flex-start}.marketing-nav-actions{margin-left:auto}.proof-grid{grid-template-columns:repeat(2,1fr);padding:25px 0}.proof-grid span{grid-column:1/-1}.process-grid,.platform-compare{grid-template-columns:1fr}.pricing-layout,.faq-shell,.story-grid,.platform-truth,.contact-layout,.inner-hero-grid{grid-template-columns:1fr;gap:45px}.about-visual{min-height:280px}.footer-grid{grid-template-columns:repeat(2,1fr)}.contact-copy{padding-top:0}}
@media (max-width:600px){.marketing-shell,.auth-topbar,.auth-shell{width:min(100% - 28px,1200px)}.marketing-nav{min-height:68px}.marketing-logo{font-size:17px}.brand-symbol{width:33px;height:33px}.marketing-nav-actions .marketing-login-link{display:none}.marketing-nav-cta{padding:9px 11px;font-size:10px}.theme-toggle{width:56px}.marketing-hero{padding:60px 0}.hero-copy h1{font-size:44px}.hero-lead{font-size:15px}.trust-row{grid-template-columns:1fr;gap:12px}.trust-row div+div{padding-left:0;border-left:0}.preview-window{grid-template-columns:34px 1fr}.preview-sidebar{padding:10px 6px}.preview-main{padding:11px}.preview-metrics article{padding:9px}.preview-metrics strong{font-size:16px}.preview-content{grid-template-columns:1fr}.signal-list{display:none}.traffic-line{height:130px}.floating-card{display:none}.marketing-section{padding:72px 0}.section-heading h2{font-size:36px}.process-card{min-height:280px}.feature-grid,.principles-grid{grid-template-columns:1fr}.pricing-card{padding:25px}.cta-panel{align-items:flex-start;flex-direction:column;padding:31px}.footer-grid{grid-template-columns:1fr 1fr;gap:32px}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column}.inner-hero{padding:70px 0}.inner-hero h1{font-size:43px}.about-visual{min-height:245px}.ring-a{width:250px;height:250px}.ring-b{width:190px;height:190px}.about-core{width:125px;height:125px}.contact-card,.auth-card{padding:23px}.form-grid{grid-template-columns:1fr}.auth-topbar>div>a{display:none}.auth-shell{margin-top:10px}.auth-value-panel{padding:20px 0}.auth-value-panel h1{font-size:40px}.auth-proof-grid{grid-template-columns:1fr}.auth-proof-grid article:nth-child(n+2){display:none}.auth-mini-preview{display:none}.auth-card-heading h2{font-size:25px}}

/* === CONSOLIDATED SOURCE: experience.css === */
/*
 * Arawn Guard Experience System v3
 * Light-first product marketing and application entry experience.
 */
:root {
    --cg-ink: #10213e;
    --cg-copy: #53647c;
    --cg-muted: #7c8ba0;
    --cg-line: #dce6f4;
    --cg-line-strong: #c8d8ec;
    --cg-surface: #ffffff;
    --cg-canvas: #f7faff;
    --cg-canvas-blue: #edf5ff;
    --cg-blue: #2563eb;
    --cg-blue-deep: #1d4ed8;
    --cg-blue-soft: #eaf2ff;
    --cg-cyan: #0eacc4;
    --cg-cyan-soft: #e8fbfd;
    --cg-green: #0c9b69;
    --cg-amber: #da8a0b;
    --cg-coral: #e35465;
    --cg-shadow-sm: 0 10px 30px rgba(31, 75, 138, .08);
    --cg-shadow-md: 0 22px 60px rgba(31, 75, 138, .13);
    --cg-shadow-lg: 0 36px 100px rgba(22, 63, 127, .18);
    --cg-radius-sm: 14px;
    --cg-radius: 22px;
    --cg-radius-lg: 32px;
}

[data-theme="dark"] {
    --cg-ink: #f1f6ff;
    --cg-copy: #b2bfd1;
    --cg-muted: #8495ad;
    --cg-line: #273852;
    --cg-line-strong: #344965;
    --cg-surface: #111d31;
    --cg-canvas: #0a1323;
    --cg-canvas-blue: #101f38;
    --cg-blue: #65a0ff;
    --cg-blue-deep: #8bb7ff;
    --cg-blue-soft: #172d50;
    --cg-cyan-soft: #12353f;
    --cg-shadow-sm: 0 12px 32px rgba(0, 0, 0, .2);
    --cg-shadow-md: 0 24px 60px rgba(0, 0, 0, .28);
    --cg-shadow-lg: 0 38px 100px rgba(0, 0, 0, .38);
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
}

.marketing-page,
.auth-page {
    --public-bg: var(--cg-surface);
    --public-soft: var(--cg-canvas);
    --public-card: var(--cg-surface);
    --public-text: var(--cg-ink);
    --public-copy: var(--cg-copy);
    --public-muted: var(--cg-muted);
    --public-line: var(--cg-line);
    --public-blue: var(--cg-blue);
    --public-blue-2: #4e91ff;
    --public-blue-soft: var(--cg-blue-soft);
    --public-cyan: var(--cg-cyan);
    --public-shadow: var(--cg-shadow-md);
    overflow-x: clip;
    background: var(--cg-surface);
    color: var(--cg-ink);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.marketing-page::selection,
.auth-page::selection {
    background: rgba(31, 102, 235, .2);
    color: var(--cg-ink);
}

.marketing-shell {
    width: min(1240px, calc(100% - 56px));
}

.marketing-header {
    top: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--cg-line) 76%, transparent);
    background: color-mix(in srgb, var(--cg-surface) 86%, transparent);
    box-shadow: 0 6px 24px rgba(31, 75, 138, .035);
    backdrop-filter: blur(22px) saturate(1.4);
}

.marketing-nav {
    min-height: 82px;
}

.marketing-logo {
    gap: 10px;
    color: var(--cg-ink);
    font-size: 20px;
    letter-spacing: -.045em;
}

.marketing-logo .brand-symbol {
    width: 39px;
    height: 39px;
    border: 0;
    border-radius: 12px;
    background: url("images/arawn-guard-mark.svg") center / contain no-repeat;
    box-shadow: 0 9px 20px rgba(31, 102, 235, .22);
}

.marketing-logo .brand-symbol::before,
.marketing-logo .brand-symbol::after,
.marketing-logo .brand-symbol i {
    display: none;
}

.marketing-nav-links {
    gap: 30px;
}

.marketing-nav-links a {
    position: relative;
    padding: 30px 0 27px;
    font-size: 12px;
    font-weight: 720;
}

.marketing-nav-links a::after {
    position: absolute;
    right: 0;
    bottom: 19px;
    left: 0;
    height: 2px;
    border-radius: 2px;
    background: var(--cg-blue);
    content: "";
    opacity: 0;
    transform: scaleX(.4);
    transition: .22s ease;
}

.marketing-nav-links a:hover::after,
.marketing-nav-links a.active::after {
    opacity: 1;
    transform: scaleX(1);
}

.marketing-nav-cta {
    min-height: 41px;
    padding: 10px 17px;
    border-radius: 12px;
}

.btn {
    border-radius: 12px;
    font-weight: 760;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}

.btn:active {
    transform: translateY(1px) scale(.985);
}

.btn-primary {
    border: 1px solid rgba(18, 79, 197, .45);
    background: linear-gradient(135deg, #1559d4, #2f7bff 70%, #2698f6);
    box-shadow: 0 13px 30px rgba(31, 102, 235, .24), inset 0 1px rgba(255, 255, 255, .22);
}

.btn-primary:hover {
    background: linear-gradient(135deg, #104fc6, #246ee9 70%, #2189de);
    box-shadow: 0 17px 38px rgba(31, 102, 235, .3), inset 0 1px rgba(255, 255, 255, .22);
    transform: translateY(-2px);
}

.btn-secondary {
    border-color: var(--cg-line-strong);
    background: color-mix(in srgb, var(--cg-surface) 92%, var(--cg-canvas-blue));
    box-shadow: 0 8px 24px rgba(31, 75, 138, .06);
}

.btn-secondary:hover {
    border-color: color-mix(in srgb, var(--cg-blue) 50%, var(--cg-line));
    transform: translateY(-2px);
}

.btn-arrow span,
.text-link span,
.pricing-card .btn span,
.cta-panel .btn span {
    display: inline-block;
    margin-left: 5px;
    transition: transform .22s ease;
}

.btn-arrow:hover span,
.text-link:hover span,
.pricing-card .btn:hover span,
.cta-panel .btn:hover span {
    transform: translateX(4px);
}

.marketing-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--cg-blue);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.marketing-eyebrow i {
    position: relative;
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: var(--cg-blue-soft);
}

.marketing-eyebrow i::after {
    position: absolute;
    inset: 6px;
    border-radius: 50%;
    background: var(--cg-blue);
    box-shadow: 0 0 0 5px rgba(31, 102, 235, .08);
    content: "";
}

/* Hero */
.marketing-hero {
    position: relative;
    min-height: min(840px, calc(100vh - 20px));
    padding: 92px 0 48px;
    overflow: hidden;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--cg-surface) 90%, transparent), var(--cg-surface)),
        radial-gradient(circle at 84% 18%, rgba(31, 102, 235, .30), transparent 42%),
        radial-gradient(circle at 10% 6%, rgba(14, 172, 196, .22), transparent 36%),
        radial-gradient(circle at 55% 96%, rgba(227, 84, 101, .12), transparent 32%);
}

.marketing-hero::before {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(47, 110, 204, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(47, 110, 204, .06) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(to bottom, black, transparent 82%);
    content: "";
    pointer-events: none;
}

.hero-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    pointer-events: none;
}

.hero-glow-one {
    top: 60px;
    right: -190px;
    width: 620px;
    height: 620px;
    background: radial-gradient(circle, rgba(31, 102, 235, .34), rgba(31, 102, 235, 0) 68%);
    filter: blur(10px);
}

.hero-glow-two {
    right: 32%;
    bottom: 30px;
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(14, 172, 196, .30), rgba(14, 172, 196, 0) 68%);
    filter: blur(6px);
}

.hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: .88fr 1.12fr;
    align-items: center;
    gap: 58px;
}

.hero-copy {
    position: relative;
    z-index: 3;
}

.hero-copy h1 {
    max-width: 680px;
    margin-top: 22px;
    color: var(--cg-ink);
    font-size: clamp(52px, 5.1vw, 75px);
    font-weight: 820;
    line-height: .99;
    letter-spacing: -.071em;
    text-wrap: balance;
}

.hero-copy h1::first-line {
    color: var(--cg-blue);
}

.hero-lead {
    max-width: 620px;
    margin-top: 26px;
    color: var(--cg-copy);
    font-size: 17px;
    line-height: 1.76;
}

.hero-actions {
    margin-top: 31px;
}

.hero-actions .btn-large {
    min-height: 55px;
    padding: 15px 23px;
}

.hero-assurance {
    margin-top: 16px;
}

.hero-assurance > span {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--cg-muted);
    font-size: 11px;
}

.hero-assurance svg {
    width: 18px;
    height: 18px;
    padding: 3px;
    overflow: visible;
    border-radius: 50%;
    background: #e6f9f1;
    fill: none;
    stroke: var(--cg-green);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.5;
}

[data-theme="dark"] .hero-assurance svg {
    background: #123c32;
}

.hero-platforms {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-width: 550px;
    margin-top: 30px;
    padding-top: 23px;
    border-top: 1px solid var(--cg-line);
}

.platform-chip {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    column-gap: 10px;
    align-items: center;
}

.platform-chip > span,
.tab-logo {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    grid-row: 1 / span 2;
    border: 1px solid var(--cg-line);
    border-radius: 10px;
    background: var(--cg-surface);
    color: #2771ec;
    box-shadow: 0 6px 17px rgba(31, 75, 138, .08);
    font-size: 12px;
    font-weight: 900;
}

.platform-chip.meta > span,
.tab-logo.meta {
    border-color: #2875e9;
    background: #2875e9;
    color: #fff;
}

.platform-chip strong,
.platform-chip small {
    display: block;
}

.platform-chip strong {
    align-self: end;
    color: var(--cg-ink);
    font-size: 11px;
}

.platform-chip small {
    align-self: start;
    margin-top: 2px;
    color: var(--cg-muted);
    font-size: 8px;
}

.hero-visual {
    position: relative;
    min-width: 0;
    padding: 28px 0 35px;
}

.hero-visual-frame {
    position: relative;
    z-index: 2;
    min-height: 560px;
    overflow: hidden;
    border: 1px solid rgba(196, 215, 239, .88);
    border-radius: 38px;
    background: #f4f9ff;
    box-shadow: var(--cg-shadow-lg);
    transform: perspective(1400px) rotateY(-2.8deg) rotateX(1.3deg);
    transform-style: preserve-3d;
    transition: transform .25s ease-out;
}

.hero-visual-frame::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(130deg, rgba(255, 255, 255, .34), transparent 32%, transparent 72%, rgba(50, 122, 255, .09));
    content: "";
    pointer-events: none;
}

.hero-visual-frame > img {
    width: 100%;
    height: 100%;
    min-height: 560px;
    object-fit: cover;
    object-position: 53% center;
}

.visual-label {
    position: absolute;
    z-index: 3;
    top: 20px;
    left: 20px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border: 1px solid rgba(201, 218, 239, .85);
    border-radius: 999px;
    background: rgba(255, 255, 255, .82);
    color: #52647d;
    box-shadow: 0 9px 25px rgba(37, 77, 136, .08);
    backdrop-filter: blur(16px);
    font-size: 8px;
    font-weight: 780;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.visual-label i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--cg-green);
    box-shadow: 0 0 0 4px rgba(12, 155, 105, .12);
}

.visual-signal,
.visual-score {
    position: absolute;
    z-index: 4;
    border: 1px solid rgba(201, 218, 239, .92);
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 17px 38px rgba(24, 63, 122, .15);
    backdrop-filter: blur(18px) saturate(1.3);
}

.visual-signal {
    display: grid;
    grid-template-columns: 34px 1fr auto;
    align-items: center;
    gap: 9px;
    min-width: 215px;
    padding: 11px 12px;
    border-radius: 15px;
    animation: cg-float 5s ease-in-out infinite;
}

.visual-signal > span {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #fff;
    color: #2671e9;
    box-shadow: 0 5px 13px rgba(31, 75, 138, .1);
    font-size: 11px;
    font-weight: 900;
}

.visual-signal div strong,
.visual-signal div small {
    display: block;
}

.visual-signal div strong {
    color: #152746;
    font-size: 9px;
}

.visual-signal div small {
    margin-top: 2px;
    color: #7a8ba3;
    font-size: 7px;
}

.signal-google {
    right: 18px;
    bottom: 118px;
}

.signal-meta {
    bottom: 45px;
    left: 18px;
    animation-delay: -2.5s;
}

.signal-meta > span {
    background: #2875e9;
    color: #fff;
}

.status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--cg-green);
    box-shadow: 0 0 0 5px rgba(12, 155, 105, .1);
}

.status-dot.status-warn {
    background: var(--cg-amber);
    box-shadow: 0 0 0 5px rgba(218, 138, 11, .1);
}

.visual-score {
    top: 80px;
    right: 19px;
    display: grid;
    place-items: center;
    width: 92px;
    padding: 12px 8px;
    border-radius: 18px;
    color: #152746;
}

.visual-score small,
.visual-score span {
    color: #71849d;
    font-size: 6px;
    font-weight: 720;
    text-transform: uppercase;
}

.visual-score strong {
    margin: 3px 0 1px;
    color: var(--cg-coral);
    font-size: 29px;
    line-height: 1;
    letter-spacing: -.05em;
}

.traffic-pulse {
    position: absolute;
    z-index: 1;
    border: 1px solid rgba(31, 102, 235, .15);
    border-radius: 50%;
    pointer-events: none;
    animation: cg-pulse 5.5s ease-out infinite;
}

.pulse-one {
    top: -12px;
    right: -32px;
    width: 330px;
    height: 330px;
}

.pulse-two {
    bottom: -28px;
    left: -50px;
    width: 260px;
    height: 260px;
    animation-delay: -2.7s;
}

.hero-scroll-cue {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 20px;
    color: var(--cg-muted);
    font-size: 8px;
    font-weight: 760;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.hero-scroll-cue span {
    position: relative;
    width: 21px;
    height: 32px;
    border: 1px solid var(--cg-line-strong);
    border-radius: 999px;
}

.hero-scroll-cue span::after {
    position: absolute;
    top: 7px;
    left: 9px;
    width: 2px;
    height: 6px;
    border-radius: 2px;
    background: var(--cg-blue);
    content: "";
    animation: cg-scroll 1.8s ease-in-out infinite;
}

/* Trust strip */
.trust-bar {
    position: relative;
    z-index: 4;
    border-top: 1px solid var(--cg-line);
    border-bottom: 1px solid var(--cg-line);
    background: color-mix(in srgb, var(--cg-canvas) 80%, var(--cg-surface));
}

.trust-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.trust-grid > div {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 102px;
    padding: 22px 20px;
}

.trust-grid > div + div {
    border-left: 1px solid var(--cg-line);
}

.trust-icon {
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--cg-blue-soft);
    color: var(--cg-blue);
    font-size: 9px;
    font-weight: 900;
}

.trust-grid strong,
.trust-grid small {
    display: block;
}

.trust-grid strong {
    color: var(--cg-ink);
    font-size: 10px;
}

.trust-grid small {
    margin-top: 3px;
    color: var(--cg-muted);
    font-size: 8px;
    line-height: 1.45;
}

/* Shared sections */
.marketing-section {
    padding: 112px 0;
}

.soft-section {
    border-top: 1px solid color-mix(in srgb, var(--cg-line) 70%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--cg-line) 70%, transparent);
    background:
        radial-gradient(circle at 10% 0, rgba(31, 102, 235, .06), transparent 24%),
        var(--cg-canvas);
}

.section-heading {
    max-width: 790px;
    margin: 0 auto 58px;
}

.section-heading h2,
.persona-copy h2 {
    margin-top: 16px;
    color: var(--cg-ink);
    font-size: clamp(38px, 4.3vw, 59px);
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -.058em;
    text-wrap: balance;
}

.section-heading > p,
.section-heading-split > p,
.persona-copy > p {
    margin-top: 18px;
    color: var(--cg-copy);
    font-size: 15px;
    line-height: 1.75;
}

.section-heading-split {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    align-items: end;
    gap: 80px;
    max-width: none;
}

.section-heading-split > p {
    margin: 0 0 6px;
}

/* Product tour */
.product-tour-section {
    background:
        radial-gradient(circle at 86% 22%, rgba(62, 143, 255, .08), transparent 26%),
        var(--cg-surface);
}

.product-tour {
    overflow: hidden;
    border: 1px solid var(--cg-line-strong);
    border-radius: var(--cg-radius-lg);
    background: var(--cg-surface);
    box-shadow: var(--cg-shadow-lg);
}

.tour-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 82px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--cg-line);
    background: color-mix(in srgb, var(--cg-canvas) 64%, var(--cg-surface));
}

.tour-tabs,
.tour-meta {
    display: flex;
    align-items: center;
    gap: 8px;
}

.tour-tabs {
    padding: 5px;
    border: 1px solid var(--cg-line);
    border-radius: 14px;
    background: var(--cg-surface);
}

.tour-tabs button {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 43px;
    padding: 7px 13px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--cg-copy);
    cursor: pointer;
    font-size: 10px;
    font-weight: 770;
    transition: .2s ease;
}

.tour-tabs button:hover,
.tour-tabs button.is-active {
    background: var(--cg-blue-soft);
    color: var(--cg-blue);
}

.tour-tabs .tab-logo {
    width: 28px;
    height: 28px;
    grid-row: auto;
    border-radius: 8px;
    font-size: 9px;
}

.demo-badge,
.health-badge,
.capability-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 10px;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 810;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.demo-badge {
    border: 1px solid #f1d697;
    background: #fff8e8;
    color: #9a660c;
}

.health-badge {
    border: 1px solid #bfe9d8;
    background: #ebfaf4;
    color: #087d55;
}

.health-badge i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--cg-green);
    box-shadow: 0 0 0 4px rgba(12, 155, 105, .1);
}

[data-theme="dark"] .demo-badge {
    border-color: #68542d;
    background: #342b1b;
    color: #f0c96f;
}

[data-theme="dark"] .health-badge {
    border-color: #265c4b;
    background: #16342b;
    color: #8be0bd;
}

.tour-shell {
    display: grid;
    grid-template-columns: 70px 1fr;
    min-height: 640px;
}

.tour-sidebar {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 22px;
    padding: 20px 12px;
    background: linear-gradient(180deg, #1559d4, #153f91);
}

.tour-sidebar img {
    margin-bottom: 13px;
    border-radius: 11px;
    box-shadow: 0 7px 19px rgba(5, 30, 80, .25);
}

.tour-sidebar span {
    position: relative;
    width: 24px;
    height: 5px;
    border-radius: 5px;
    background: rgba(255, 255, 255, .28);
}

.tour-sidebar span.active {
    height: 26px;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 7px 19px rgba(5, 30, 80, .22);
}

.tour-sidebar span.active::after {
    position: absolute;
    inset: 8px 7px;
    border: 2px solid #2671e9;
    border-radius: 3px;
    content: "";
}

.tour-main {
    min-width: 0;
    padding: 27px;
    background:
        linear-gradient(rgba(250, 252, 255, .92), rgba(250, 252, 255, .92)),
        linear-gradient(rgba(47, 110, 204, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(47, 110, 204, .05) 1px, transparent 1px);
    background-size: auto, 40px 40px, 40px 40px;
}

[data-theme="dark"] .tour-main {
    background: var(--cg-canvas);
}

.tour-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}

.tour-header small,
.tour-header strong {
    display: block;
}

.tour-header small {
    color: var(--cg-muted);
    font-size: 8px;
    font-weight: 730;
    text-transform: uppercase;
}

.tour-header strong {
    margin-top: 2px;
    color: var(--cg-ink);
    font-size: 17px;
    letter-spacing: -.035em;
}

.tour-filters {
    display: flex;
    align-items: center;
    gap: 7px;
}

.tour-filters span {
    padding: 8px 10px;
    border: 1px solid var(--cg-line);
    border-radius: 9px;
    background: var(--cg-surface);
    color: var(--cg-copy);
    font-size: 8px;
    box-shadow: var(--cg-shadow-sm);
}

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

.tour-kpis article,
.tour-chart-card,
.decision-card {
    border: 1px solid var(--cg-line);
    background: var(--cg-surface);
    box-shadow: 0 9px 28px rgba(31, 75, 138, .055);
}

.tour-kpis article {
    padding: 15px;
    border-radius: 14px;
}

.tour-kpis span,
.tour-kpis strong,
.tour-kpis small {
    display: block;
}

.tour-kpis span {
    color: var(--cg-muted);
    font-size: 8px;
}

.tour-kpis strong {
    margin: 6px 0 3px;
    color: var(--cg-ink);
    font-size: 23px;
    line-height: 1;
    letter-spacing: -.055em;
}

.tour-kpis small {
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--cg-muted);
    font-size: 7px;
}

.tour-kpis small i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--cg-blue);
}

.tour-kpis small i.positive {
    background: var(--cg-green);
}

.tour-kpis small i.warning {
    background: var(--cg-amber);
}

.tour-content-grid {
    display: grid;
    grid-template-columns: 1.18fr .82fr;
    gap: 13px;
    margin-top: 13px;
}

.tour-chart-card,
.decision-card {
    min-width: 0;
    border-radius: 16px;
}

.tour-chart-card {
    padding: 17px;
}

.tour-chart-card header,
.decision-card header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.tour-chart-card header strong,
.tour-chart-card header small {
    display: block;
}

.tour-chart-card header strong {
    color: var(--cg-ink);
    font-size: 10px;
}

.tour-chart-card header small {
    margin-top: 2px;
    color: var(--cg-muted);
    font-size: 7px;
}

.tour-chart-card header > span {
    padding: 5px 7px;
    border-radius: 7px;
    background: var(--cg-canvas);
    color: var(--cg-muted);
    font-size: 7px;
}

.tour-chart {
    width: 100%;
    height: 250px;
    overflow: visible;
}

.tour-chart-grid {
    fill: none;
    stroke: var(--cg-line);
    stroke-width: 1;
}

.tour-chart-area {
    fill: url("#tourArea");
}

.tour-chart-line {
    fill: none;
    stroke: #2b73f6;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    stroke-linecap: round;
    stroke-width: 3;
}

.tour-chart circle {
    fill: var(--cg-surface);
    stroke: #2b73f6;
    stroke-width: 4;
}

.reveal-ready .is-visible .tour-chart-line,
.reveal-ready .product-tour.is-visible .tour-chart-line {
    animation: cg-draw 1.6s .35s ease forwards;
}

.chart-legend {
    display: flex;
    align-items: center;
    gap: 17px;
    color: var(--cg-muted);
    font-size: 7px;
}

.chart-legend span {
    display: flex;
    align-items: center;
    gap: 5px;
}

.chart-legend i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

.chart-legend .blue {
    background: var(--cg-blue);
}

.chart-legend .coral {
    background: var(--cg-coral);
}

.decision-card {
    padding: 17px;
}

.decision-card[hidden] {
    display: none;
}

.decision-card header {
    justify-content: flex-start;
}

.decision-logo {
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border: 1px solid var(--cg-line);
    border-radius: 11px;
    color: #2872ea;
    box-shadow: var(--cg-shadow-sm);
    font-size: 11px;
    font-weight: 900;
}

.decision-logo.meta {
    border-color: #2875e9;
    background: #2875e9;
    color: #fff;
}

.decision-card header div {
    min-width: 0;
}

.decision-card header div strong,
.decision-card header div small {
    display: block;
}

.decision-card header div strong {
    color: var(--cg-ink);
    font-size: 9px;
}

.decision-card header div small {
    margin-top: 2px;
    overflow: hidden;
    color: var(--cg-muted);
    font-size: 6px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.capability-badge {
    margin-left: auto;
    background: var(--cg-blue-soft);
    color: var(--cg-blue);
    font-size: 6px;
}

.capability-badge.audience {
    background: var(--cg-cyan-soft);
    color: #087c91;
}

.decision-flow {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1.2fr;
    align-items: center;
    gap: 5px;
    margin-top: 20px;
    color: var(--cg-muted);
    font-size: 6px;
    text-align: center;
}

.decision-flow span,
.decision-flow strong {
    display: grid;
    place-items: center;
    min-height: 44px;
    padding: 5px;
    border: 1px solid var(--cg-line);
    border-radius: 9px;
    background: var(--cg-canvas);
}

.decision-flow strong {
    border-color: #bdd3f8;
    background: var(--cg-blue-soft);
    color: var(--cg-blue);
}

.decision-flow i {
    color: var(--cg-blue);
    font-style: normal;
}

.decision-list {
    display: grid;
    gap: 7px;
    margin-top: 15px;
}

.decision-list > div,
.audience-health > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 10px;
    border: 1px solid var(--cg-line);
    border-radius: 9px;
    color: var(--cg-copy);
    font-size: 7px;
}

.decision-list strong {
    display: grid;
    place-items: center;
    width: 28px;
    height: 24px;
    border-radius: 7px;
    background: #fff0f2;
    color: var(--cg-coral);
    font-size: 8px;
}

.decision-card > p {
    margin-top: 14px;
    color: var(--cg-muted);
    font-size: 7px;
    line-height: 1.5;
}

.audience-health {
    display: grid;
    gap: 8px;
    margin-top: 17px;
}

.audience-health span {
    display: flex;
    align-items: center;
    gap: 7px;
}

.audience-health i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.audience-health i.complete {
    background: var(--cg-green);
    box-shadow: 0 0 0 4px rgba(12, 155, 105, .1);
}

.audience-health i.pending {
    background: var(--cg-amber);
    box-shadow: 0 0 0 4px rgba(218, 138, 11, .1);
}

.audience-health strong {
    color: var(--cg-ink);
    font-size: 7px;
}

.tour-disclaimer {
    margin: 15px 1px 0;
    color: var(--cg-muted);
    font-size: 7px;
}

/* Signal cards */
.threat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
}

.threat-card {
    position: relative;
    min-height: 278px;
    padding: 25px;
    overflow: hidden;
    border: 1px solid var(--cg-line);
    border-radius: var(--cg-radius);
    background: var(--cg-surface);
    box-shadow: var(--cg-shadow-sm);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.threat-card::after {
    position: absolute;
    right: -35px;
    bottom: -45px;
    width: 120px;
    height: 120px;
    border: 1px solid rgba(31, 102, 235, .08);
    border-radius: 50%;
    box-shadow: 0 0 0 18px rgba(31, 102, 235, .025), 0 0 0 36px rgba(31, 102, 235, .015);
    content: "";
}

.threat-card:hover {
    z-index: 2;
    border-color: color-mix(in srgb, var(--cg-blue) 35%, var(--cg-line));
    box-shadow: var(--cg-shadow-md);
    transform: translateY(-5px);
}

.threat-icon {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    border-radius: 14px;
    background: var(--cg-blue-soft);
    color: var(--cg-blue);
    font-size: 19px;
}

.threat-tag {
    position: absolute;
    top: 28px;
    right: 25px;
    color: var(--cg-muted);
    font-size: 7px;
    font-weight: 830;
    letter-spacing: .09em;
}

.threat-card h3 {
    margin-top: 25px;
    color: var(--cg-ink);
    font-size: 18px;
    letter-spacing: -.035em;
}

.threat-card > p {
    margin-top: 10px;
    color: var(--cg-copy);
    font-size: 11px;
    line-height: 1.7;
}

.threat-action {
    position: absolute;
    right: 25px;
    bottom: 22px;
    left: 25px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 14px;
    border-top: 1px solid var(--cg-line);
    color: var(--cg-muted);
    font-size: 8px;
}

.threat-action strong {
    color: var(--cg-blue);
    font-size: 8px;
}

/* Platform cards */
.platform-flow-section {
    background: var(--cg-surface);
}

.platform-flow-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.platform-flow-card {
    position: relative;
    padding: 32px;
    overflow: hidden;
    border: 1px solid var(--cg-line);
    border-radius: 26px;
    background: var(--cg-surface);
    box-shadow: var(--cg-shadow-sm);
}

.platform-flow-card::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background: linear-gradient(90deg, #4285f4, #34a853, #fbbc05, #ea4335);
    content: "";
}

.platform-flow-card.meta::before {
    background: linear-gradient(90deg, #1472e6, #3f88ff, #17a5e8);
}

.platform-flow-card header {
    display: flex;
    align-items: center;
    gap: 14px;
}

.platform-flow-card .platform-logo {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 15px;
    font-size: 15px;
}

.platform-flow-card header small,
.platform-flow-card header h3 {
    display: block;
}

.platform-flow-card header small {
    color: var(--cg-muted);
    font-size: 7px;
    font-weight: 820;
    letter-spacing: .08em;
}

.platform-flow-card header h3 {
    margin-top: 3px;
    color: var(--cg-ink);
    font-size: 20px;
    letter-spacing: -.035em;
}

.platform-flow-card > p {
    min-height: 74px;
    margin-top: 21px;
    color: var(--cg-copy);
    font-size: 12px;
    line-height: 1.7;
}

.platform-flow-card ol {
    display: grid;
    gap: 9px;
    margin-top: 23px;
    padding: 0;
    list-style: none;
}

.platform-flow-card li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 13px;
    border: 1px solid var(--cg-line);
    border-radius: 12px;
    background: var(--cg-canvas);
    color: var(--cg-copy);
    font-size: 10px;
}

.platform-flow-card li span {
    display: grid;
    place-items: center;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    border-radius: 8px;
    background: var(--cg-surface);
    color: var(--cg-blue);
    box-shadow: 0 4px 11px rgba(31, 75, 138, .08);
    font-size: 8px;
    font-weight: 900;
}

.platform-capability {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-top: 18px;
    padding: 13px;
    border: 1px solid #bfe9d8;
    border-radius: 13px;
    background: #ebfaf4;
    color: #176c51;
}

.platform-capability.warning {
    border-color: #efd899;
    background: #fff9e9;
    color: #795915;
}

[data-theme="dark"] .platform-capability {
    border-color: #265c4b;
    background: #16342b;
    color: #9bdcc1;
}

[data-theme="dark"] .platform-capability.warning {
    border-color: #68542d;
    background: #342b1b;
    color: #f0d287;
}

.platform-capability > i {
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--cg-green);
    box-shadow: 0 0 0 5px rgba(12, 155, 105, .1);
}

.platform-capability.warning > i {
    background: var(--cg-amber);
    box-shadow: 0 0 0 5px rgba(218, 138, 11, .1);
}

.platform-capability span,
.platform-capability strong {
    display: block;
}

.platform-capability span {
    font-size: 9px;
}

.platform-capability strong {
    margin-bottom: 2px;
    font-size: 7px;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.platform-note {
    margin-top: 16px;
    padding: 17px 20px;
    border-color: var(--cg-line);
    border-radius: 15px;
    background: var(--cg-canvas);
}

/* Process */
.process-line {
    position: relative;
    width: calc(66.66% + 10px);
    height: 1px;
    margin: 0 auto -1px;
    overflow: hidden;
    background: var(--cg-line);
}

.process-line i {
    position: absolute;
    top: -1px;
    left: -20%;
    width: 20%;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--cg-blue), transparent);
    animation: cg-flow 4s linear infinite;
}

.process-grid {
    gap: 15px;
}

.process-card {
    min-height: 330px;
    padding: 29px;
    border-color: var(--cg-line);
    border-radius: var(--cg-radius);
    background: var(--cg-surface);
    box-shadow: var(--cg-shadow-sm);
    transition: .25s ease;
}

.process-card:hover {
    border-color: color-mix(in srgb, var(--cg-blue) 30%, var(--cg-line));
    box-shadow: var(--cg-shadow-md);
    transform: translateY(-4px);
}

.process-number {
    color: color-mix(in srgb, var(--cg-blue) 55%, var(--cg-muted));
}

.process-card h3 {
    color: var(--cg-ink);
}

.process-card p {
    color: var(--cg-copy);
}

.process-card a {
    color: var(--cg-blue);
}

/* Personas */
.persona-section {
    border-top: 1px solid var(--cg-line);
    border-bottom: 1px solid var(--cg-line);
    background:
        radial-gradient(circle at 18% 55%, rgba(31, 102, 235, .09), transparent 25%),
        var(--cg-canvas);
}

.persona-layout {
    display: grid;
    grid-template-columns: .72fr 1.28fr;
    align-items: center;
    gap: 70px;
}

.persona-copy h2 {
    margin-top: 17px;
}

.persona-copy .text-link {
    display: inline-flex;
    margin-top: 25px;
}

.persona-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.persona-cards article {
    min-height: 390px;
    padding: 28px;
    border: 1px solid var(--cg-line);
    border-radius: 24px;
    background: var(--cg-surface);
    box-shadow: var(--cg-shadow-sm);
}

.persona-cards article.featured {
    color: #fff;
    background:
        radial-gradient(circle at 90% 10%, rgba(73, 157, 255, .38), transparent 32%),
        linear-gradient(145deg, #124bb9, #2563eb 62%, #167fc2);
    box-shadow: 0 24px 55px rgba(31, 102, 235, .25);
    transform: translateY(-16px);
}

.persona-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    background: var(--cg-blue-soft);
    color: var(--cg-blue);
    font-size: 9px;
    font-weight: 900;
}

.persona-cards .featured .persona-icon {
    background: rgba(255, 255, 255, .14);
    color: #fff;
}

.persona-cards h3 {
    margin-top: 25px;
    color: var(--cg-ink);
    font-size: 21px;
    letter-spacing: -.04em;
}

.persona-cards .featured h3 {
    color: #fff;
}

.persona-cards p {
    margin-top: 11px;
    color: var(--cg-copy);
    font-size: 11px;
    line-height: 1.7;
}

.persona-cards .featured p {
    color: rgba(255, 255, 255, .75);
}

.persona-cards ul {
    display: grid;
    gap: 11px;
    margin-top: 25px;
    padding: 0;
    list-style: none;
}

.persona-cards li {
    position: relative;
    padding-left: 20px;
    color: var(--cg-copy);
    font-size: 10px;
}

.persona-cards .featured li {
    color: rgba(255, 255, 255, .86);
}

.persona-cards li::before {
    position: absolute;
    top: 2px;
    left: 0;
    display: grid;
    place-items: center;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #e8faf2;
    color: var(--cg-green);
    content: "✓";
    font-size: 7px;
    font-weight: 900;
}

.persona-cards .featured li::before {
    background: rgba(255, 255, 255, .16);
    color: #fff;
}

/* Pricing, FAQ, CTA */
.pricing-section {
    background: var(--cg-surface);
}

.pricing-layout {
    align-items: center;
}

.pricing-card {
    border-color: var(--cg-line-strong);
    border-radius: 27px;
    background: var(--cg-surface);
    box-shadow: var(--cg-shadow-lg);
}

.pricing-card::before {
    background: linear-gradient(90deg, var(--cg-blue), #4a94ff, var(--cg-cyan));
}

.pricing-card li {
    color: var(--cg-copy);
}

.faq-section {
    border-top: 1px solid var(--cg-line);
    background: var(--cg-canvas);
}

.faq-list details {
    border-color: var(--cg-line);
    border-radius: 15px;
    background: var(--cg-surface);
    box-shadow: 0 7px 20px rgba(31, 75, 138, .04);
}

.faq-list details[open] {
    border-color: color-mix(in srgb, var(--cg-blue) 35%, var(--cg-line));
    box-shadow: var(--cg-shadow-sm);
}

.faq-list summary {
    color: var(--cg-ink);
}

.faq-list summary span {
    transition: transform .2s ease;
}

.faq-list details[open] summary span {
    transform: rotate(45deg);
}

.faq-list p {
    color: var(--cg-copy);
}

.marketing-cta {
    padding: 28px 0 92px;
    background: var(--cg-canvas);
}

.cta-panel {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(90, 158, 255, .36);
    border-radius: 31px;
    background:
        radial-gradient(circle at 87% 10%, rgba(81, 169, 255, .38), transparent 28%),
        linear-gradient(135deg, #1048ad, #1e67e6 55%, #167dbb);
    box-shadow: 0 27px 70px rgba(18, 79, 197, .27);
}

.cta-panel::after {
    position: absolute;
    right: -90px;
    bottom: -150px;
    width: 330px;
    height: 330px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 50%;
    box-shadow: 0 0 0 45px rgba(255, 255, 255, .035), 0 0 0 90px rgba(255, 255, 255, .02);
    content: "";
}

.cta-panel > * {
    position: relative;
    z-index: 2;
}

.cta-panel .marketing-eyebrow {
    color: #bfe2ff;
}

.cta-panel h2,
.cta-panel p {
    color: #fff;
}

.cta-panel p {
    opacity: .76;
}

/* Footer */
.marketing-footer {
    padding-top: 70px;
    border-top-color: var(--cg-line);
    background: var(--cg-surface);
}

.footer-grid strong {
    color: var(--cg-ink);
}

.footer-brand p,
.footer-bottom {
    color: var(--cg-muted);
}

/* Authentication experience */
.auth-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 12% 14%, rgba(31, 102, 235, .1), transparent 28%),
        linear-gradient(118deg, var(--cg-canvas) 0 52%, var(--cg-surface) 52%);
}

.auth-topbar {
    min-height: 82px;
}

.auth-shell {
    width: min(1180px, calc(100% - 56px));
    grid-template-columns: .96fr 1.04fr;
    gap: 70px;
    margin-top: 18px;
}

.auth-shell-login {
    grid-template-columns: 1.08fr .82fr;
}

.auth-value-panel {
    position: relative;
    padding: 34px 0;
}

.auth-value-panel h1 {
    font-size: clamp(42px, 4.8vw, 63px);
    letter-spacing: -.065em;
}

.auth-value-panel > p {
    font-size: 14px;
}

.auth-card {
    position: relative;
    padding: 38px;
    border-color: var(--cg-line-strong);
    border-radius: 27px;
    background: color-mix(in srgb, var(--cg-surface) 96%, transparent);
    box-shadow: var(--cg-shadow-lg);
}

.auth-card::before {
    position: absolute;
    top: 0;
    right: 34px;
    left: 34px;
    height: 3px;
    border-radius: 0 0 4px 4px;
    background: linear-gradient(90deg, transparent, var(--cg-blue), var(--cg-cyan), transparent);
    content: "";
}

.auth-card-heading h2 {
    color: var(--cg-ink);
    font-size: 30px;
}

.google-auth-button {
    min-height: 50px;
    border-color: var(--cg-line-strong);
    background: var(--cg-surface);
}

.google-auth-button.is-disabled {
    border-style: dashed;
}

.auth-card input,
.auth-card select {
    min-height: 48px;
    border-color: var(--cg-line-strong);
    background: var(--cg-canvas);
}

.auth-card input:hover,
.auth-card select:hover {
    border-color: color-mix(in srgb, var(--cg-blue) 35%, var(--cg-line));
}

.password-field {
    position: relative;
}

.password-field input {
    padding-right: 72px;
}

.password-toggle {
    position: absolute;
    right: 8px;
    bottom: 8px;
    min-width: 54px;
    height: 32px;
    padding: 0 8px;
    border: 0;
    border-radius: 8px;
    background: var(--cg-blue-soft);
    color: var(--cg-blue);
    cursor: pointer;
    font-size: 8px;
    font-weight: 800;
}

.password-meter {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    margin-top: 7px;
}

.password-meter i {
    height: 3px;
    border-radius: 3px;
    background: var(--cg-line);
    transition: .2s ease;
}

.password-meter[data-strength="1"] i:nth-child(1),
.password-meter[data-strength="2"] i:nth-child(-n+2),
.password-meter[data-strength="3"] i:nth-child(-n+3),
.password-meter[data-strength="4"] i {
    background: var(--cg-blue);
}

.password-meter[data-strength="1"] i:nth-child(1) {
    background: var(--cg-coral);
}

.password-meter[data-strength="2"] i:nth-child(-n+2) {
    background: var(--cg-amber);
}

.auth-visual-art {
    position: relative;
    min-height: 235px;
    margin-top: 22px;
    overflow: hidden;
    border: 1px solid var(--cg-line);
    border-radius: 22px;
    background: #eef6ff;
    box-shadow: var(--cg-shadow-md);
}

.auth-visual-art img {
    width: 100%;
    height: 235px;
    object-fit: cover;
    object-position: center;
}

.auth-visual-art::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(15, 55, 115, .2), transparent 45%);
    content: "";
}

.auth-visual-caption {
    position: absolute;
    z-index: 2;
    right: 14px;
    bottom: 14px;
    left: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 13px;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 12px;
    background: rgba(255, 255, 255, .82);
    color: #152746;
    box-shadow: 0 12px 30px rgba(20, 57, 111, .15);
    backdrop-filter: blur(15px);
    font-size: 8px;
    font-weight: 760;
}

.auth-visual-caption span {
    display: flex;
    align-items: center;
    gap: 7px;
}

.auth-visual-caption i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--cg-green);
    box-shadow: 0 0 0 4px rgba(12, 155, 105, .1);
}

/* About/contact refinement */
.inner-hero {
    background:
        radial-gradient(circle at 83% 32%, rgba(31, 102, 235, .12), transparent 30%),
        var(--cg-surface);
}

.inner-hero h1 {
    color: var(--cg-ink);
}

.about-visual,
.contact-card {
    border-color: var(--cg-line-strong);
    background: var(--cg-surface);
    box-shadow: var(--cg-shadow-md);
}

.principle-card,
.story-card,
.contact-option {
    border-color: var(--cg-line);
    background: var(--cg-surface);
    box-shadow: var(--cg-shadow-sm);
}

/* Reveal and motion */
.reveal-ready [data-reveal] {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s cubic-bezier(.2, .7, .2, 1), transform .7s cubic-bezier(.2, .7, .2, 1);
}

.reveal-ready [data-reveal-delay="1"] {
    transition-delay: .09s;
}

.reveal-ready [data-reveal-delay="2"] {
    transition-delay: .18s;
}

.reveal-ready [data-reveal-delay="3"] {
    transition-delay: .27s;
}

.reveal-ready [data-reveal].is-visible {
    opacity: 1;
    transform: translateY(0);
}

@keyframes cg-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-7px); }
}

@keyframes cg-pulse {
    0% { opacity: 0; transform: scale(.82); }
    35% { opacity: 1; }
    100% { opacity: 0; transform: scale(1.12); }
}

@keyframes cg-scroll {
    0% { opacity: 0; transform: translateY(-2px); }
    40% { opacity: 1; }
    100% { opacity: 0; transform: translateY(10px); }
}

@keyframes cg-flow {
    to { left: 120%; }
}

@keyframes cg-draw {
    to { stroke-dashoffset: 0; }
}

/* Responsive */
@media (max-width: 1120px) {
    .hero-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .hero-copy {
        max-width: 780px;
        text-align: left;
    }

    .hero-copy h1,
    .hero-lead {
        margin-inline: 0;
    }

    .hero-actions,
    .hero-note {
        justify-content: flex-start;
    }

    .hero-visual {
        max-width: 850px;
        margin-inline: auto;
    }

    .marketing-hero {
        min-height: auto;
    }

    .section-heading-split {
        gap: 50px;
    }

    .persona-layout {
        grid-template-columns: 1fr;
    }

    .persona-copy {
        max-width: 700px;
    }
}

@media (max-width: 900px) {
    .marketing-nav-links {
        top: 76px;
        left: 28px;
        right: 28px;
        gap: 4px;
        padding: 12px;
        border-color: var(--cg-line-strong);
        background: var(--cg-surface);
    }

    .marketing-nav-links a {
        padding: 13px 14px;
        border-radius: 10px;
    }

    .marketing-nav-links a:hover {
        background: var(--cg-blue-soft);
    }

    .marketing-nav-links a::after {
        display: none;
    }

    .trust-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .trust-grid > div:nth-child(3) {
        border-left: 0;
        border-top: 1px solid var(--cg-line);
    }

    .trust-grid > div:nth-child(4) {
        border-top: 1px solid var(--cg-line);
    }

    .section-heading-split {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .section-heading-split > p {
        margin: 0;
    }

    .tour-kpis {
        grid-template-columns: repeat(2, 1fr);
    }

    .tour-content-grid {
        grid-template-columns: 1fr;
    }

    .threat-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .platform-flow-grid {
        grid-template-columns: 1fr;
    }

    .platform-flow-card > p {
        min-height: 0;
    }

    .persona-cards article.featured {
        transform: none;
    }
}

@media (max-width: 680px) {
    html {
        scroll-padding-top: 72px;
    }

    .marketing-shell,
    .auth-topbar,
    .auth-shell {
        width: min(100% - 28px, 1240px);
    }

    .marketing-header {
        backdrop-filter: blur(16px);
    }

    .marketing-nav {
        min-height: 70px;
    }

    .marketing-logo {
        font-size: 17px;
    }

    .marketing-logo .brand-symbol {
        width: 34px;
        height: 34px;
        border-radius: 10px;
    }

    .marketing-nav-actions .marketing-login-link,
    .marketing-nav-actions .public-locale-form {
        display: none;
    }

    .theme-toggle {
        width: 54px;
    }

    .marketing-nav-cta {
        min-height: 38px;
        padding: 8px 10px;
        font-size: 9px;
    }

    .marketing-hero {
        padding: 58px 0 35px;
    }

    .hero-copy h1 {
        margin-top: 17px;
        font-size: clamp(43px, 13vw, 57px);
        line-height: 1.01;
    }

    .hero-lead {
        margin-top: 20px;
        font-size: 14px;
        line-height: 1.7;
    }

    .hero-actions {
        align-items: stretch;
    }

    .hero-actions .btn {
        width: 100%;
    }

    .hero-platforms {
        grid-template-columns: 1fr;
    }

    .hero-visual-frame,
    .hero-visual-frame > img {
        min-height: 430px;
    }

    .hero-visual-frame {
        border-radius: 25px;
        transform: none;
    }

    .hero-visual-frame > img {
        object-position: 55% center;
    }

    .visual-signal {
        min-width: 184px;
    }

    .signal-google {
        right: 10px;
        bottom: 94px;
    }

    .signal-meta {
        bottom: 27px;
        left: 10px;
    }

    .visual-score {
        top: 64px;
        right: 10px;
    }

    .hero-scroll-cue {
        display: none;
    }

    .trust-grid {
        grid-template-columns: 1fr;
    }

    .trust-grid > div {
        min-height: 82px;
        padding: 17px 5px;
    }

    .trust-grid > div + div,
    .trust-grid > div:nth-child(3),
    .trust-grid > div:nth-child(4) {
        border-top: 1px solid var(--cg-line);
        border-left: 0;
    }

    .marketing-section {
        padding: 78px 0;
    }

    .section-heading {
        margin-bottom: 38px;
    }

    .section-heading h2,
    .persona-copy h2 {
        font-size: 37px;
    }

    .section-heading > p,
    .section-heading-split > p,
    .persona-copy > p {
        font-size: 13px;
    }

    .product-tour {
        border-radius: 21px;
    }

    .tour-toolbar {
        align-items: stretch;
        flex-direction: column;
        padding: 13px;
    }

    .tour-tabs button {
        flex: 1;
        justify-content: center;
        padding-inline: 8px;
    }

    .tour-meta {
        justify-content: space-between;
    }

    .tour-shell {
        grid-template-columns: 1fr;
    }

    .tour-sidebar {
        display: none;
    }

    .tour-main {
        padding: 14px;
    }

    .tour-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .tour-kpis {
        gap: 8px;
    }

    .tour-kpis article {
        padding: 12px;
    }

    .tour-kpis strong {
        font-size: 20px;
    }

    .tour-content-grid {
        gap: 8px;
        margin-top: 8px;
    }

    .tour-chart {
        height: 205px;
    }

    .decision-flow {
        grid-template-columns: 1fr;
    }

    .decision-flow i {
        transform: rotate(90deg);
    }

    .threat-grid,
    .persona-cards {
        grid-template-columns: 1fr;
    }

    .threat-card {
        min-height: 270px;
    }

    .platform-flow-card {
        padding: 23px;
    }

    .process-line {
        display: none;
    }

    .persona-cards article {
        min-height: auto;
    }

    .cta-panel {
        padding: 30px 24px;
        border-radius: 23px;
    }

    .auth-page {
        background: var(--cg-canvas);
    }

    .auth-shell {
        gap: 6px;
    }

    .auth-value-panel {
        padding: 18px 0;
        text-align: left;
    }

    .auth-value-panel h1,
    .auth-value-panel > p {
        margin-inline: 0;
    }

    .auth-value-panel h1 {
        font-size: 39px;
    }

    .auth-visual-art {
        display: none;
    }

    .auth-card {
        padding: 23px;
        border-radius: 21px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }

    .reveal-ready [data-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* About page visual */
.about-image-frame{position:relative;min-height:430px;overflow:hidden;border:1px solid var(--cg-line-strong);border-radius:28px;background:#eef6ff;box-shadow:var(--cg-shadow-lg)}
.about-image-frame>img{width:100%;height:100%;min-height:430px;object-fit:cover}
.about-image-frame:after{position:absolute;inset:0;background:linear-gradient(to top,rgba(11,49,109,.28),transparent 48%);content:""}
.about-image-frame>div{position:absolute;z-index:2;right:18px;bottom:18px;left:18px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 15px;border:1px solid rgba(255,255,255,.55);border-radius:14px;background:rgba(255,255,255,.84);color:#152746;box-shadow:0 15px 35px rgba(18,55,110,.16);backdrop-filter:blur(16px);font-size:9px}
.about-image-frame>div span{display:flex;align-items:center;gap:8px;color:#647792}
.about-image-frame>div i{width:7px;height:7px;border-radius:50%;background:var(--cg-green);box-shadow:0 0 0 5px rgba(12,155,105,.11)}
.about-image-frame>div strong{font-size:11px}
@media(max-width:680px){.about-image-frame,.about-image-frame>img{min-height:320px}}
/* Footer confidence rail */
.footer-confidence{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:52px;overflow:hidden;border:1px solid var(--cg-line);border-radius:18px;background:var(--cg-canvas);box-shadow:var(--cg-shadow-sm)}
.footer-confidence>div{display:flex;align-items:center;gap:11px;padding:17px 19px}
.footer-confidence>div+div{border-left:1px solid var(--cg-line)}
.footer-confidence-icon{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border:1px solid var(--cg-line);border-radius:10px;background:var(--cg-surface);color:#2872e9;font-size:10px;font-weight:900}
.footer-confidence-icon.meta{border-color:#2875e9;background:#2875e9;color:#fff}.footer-confidence-icon.privacy{border-color:#bfe9d8;background:#e9faf3;color:var(--cg-green)}
.footer-confidence p,.footer-confidence strong{display:block}.footer-confidence p{color:var(--cg-muted);font-size:8px}.footer-confidence strong{margin-bottom:2px;color:var(--cg-ink);font-size:9px}
.footer-start-link{display:inline-flex!important;align-items:center;gap:5px;margin-top:8px;color:var(--cg-blue)!important;font-weight:800!important}.footer-start-link span{transition:transform .2s}.footer-start-link:hover span{transform:translateX(4px)}
@media(max-width:680px){.footer-confidence{grid-template-columns:1fr}.footer-confidence>div+div{border-top:1px solid var(--cg-line);border-left:0}}
.marketing-page :focus-visible,.auth-page :focus-visible{outline:3px solid color-mix(in srgb,var(--cg-blue) 32%,transparent);outline-offset:3px}

.mobile-locale-nav{display:none}
@media(max-width:900px){.mobile-locale-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:5px;padding:12px 14px;border-top:1px solid var(--cg-line);color:var(--cg-muted);font-size:9px;font-weight:760}.mobile-locale-nav select{width:auto;min-width:90px;height:38px;border:1px solid var(--cg-line);border-radius:9px;background:var(--cg-surface);color:var(--cg-copy)}}
/* Growth phase: visual storytelling, brand and package catalog */
.brand-logo-mark{display:block;width:38px;height:38px;flex:0 0 38px;filter:drop-shadow(0 7px 14px rgba(20,91,218,.18))}.visual-story-section{overflow:hidden;background:linear-gradient(180deg,var(--cg-canvas),#f3f8ff)}.visual-story-grid,.agency-visual-layout{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);align-items:center;gap:clamp(28px,5vw,76px)}.visual-story-copy h2,.agency-visual-layout h2{max-width:680px;margin:14px 0;color:var(--cg-ink);font-size:clamp(32px,4vw,57px);line-height:1.02;letter-spacing:-.055em}.visual-story-copy>p,.agency-visual-layout .persona-copy>p{color:var(--cg-copy);font-size:15px;line-height:1.75}.visual-story-copy ul{display:grid;gap:9px;margin:22px 0 0;padding:0;list-style:none}.visual-story-copy li{position:relative;padding-left:23px;color:var(--cg-copy);font-size:10px;line-height:1.55}.visual-story-copy li::before{position:absolute;left:0;top:4px;width:13px;height:13px;border-radius:50%;background:#e6f8f2;color:var(--cg-green);content:"✓";display:grid;place-items:center;font-size:8px;font-weight:900}.visual-story-art,.agency-visual{position:relative;margin:0;overflow:hidden;border:1px solid var(--cg-line-strong);border-radius:30px;background:#fff;box-shadow:0 35px 90px rgba(27,77,151,.17)}.visual-story-art img,.agency-visual img{display:block;width:100%;height:auto;transition:transform .6s ease}.visual-story-art:hover img,.agency-visual:hover img{transform:scale(1.018)}.visual-story-art figcaption,.agency-visual>span{position:absolute;right:14px;bottom:14px;padding:8px 11px;border:1px solid rgba(255,255,255,.65);border-radius:999px;background:rgba(255,255,255,.84);color:#415674;font-size:7px;backdrop-filter:blur(12px)}.agency-visual-layout{grid-template-columns:minmax(0,1.28fr) minmax(0,.72fr)}.persona-mini-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}.persona-mini-grid article{padding:16px;border:1px solid var(--cg-line);border-radius:15px;background:var(--cg-surface)}.persona-mini-grid strong,.persona-mini-grid small{display:block}.persona-mini-grid strong{color:var(--cg-ink);font-size:11px}.persona-mini-grid small{margin-top:6px;color:var(--cg-copy);font-size:8px;line-height:1.5}.pricing-catalog{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.pricing-catalog .pricing-card{position:relative;display:flex;min-width:0;flex-direction:column;padding:25px 21px}.pricing-catalog .pricing-card::before{position:absolute;top:0;right:16px;left:16px;height:3px;border-radius:0 0 9px 9px;content:""}.pricing-catalog .pricing-card:not(.pricing-featured){box-shadow:var(--cg-shadow-sm)}.pricing-catalog .pricing-card p{min-height:47px;color:var(--cg-copy);font-size:9px;line-height:1.55}.pricing-catalog .pricing-price{font-size:24px}.pricing-catalog .pricing-price small{font-size:8px}.plan-capacity{display:flex;gap:6px;flex-wrap:wrap;margin:13px 0}.plan-capacity span{padding:6px 8px;border-radius:999px;background:var(--cg-surface-blue);color:var(--cg-blue);font-size:7px;font-weight:800}.pricing-catalog ul{flex:1}.pricing-honesty{max-width:720px;margin:21px auto 0;color:var(--cg-muted);font-size:8px;line-height:1.6;text-align:center}@media(max-width:1080px){.pricing-catalog{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.visual-story-grid,.agency-visual-layout{grid-template-columns:1fr}.agency-visual{order:2}.pricing-catalog{grid-template-columns:1fr}.visual-story-art,.agency-visual{border-radius:20px}}
/* Authentication experience v5 — scoped, responsive and light-first */
.auth-page-v5 {
    position: relative;
    min-height: 100vh;
    overflow-x: clip;
    background:
        radial-gradient(circle at 8% 10%, rgba(31, 102, 235, .12), transparent 26%),
        radial-gradient(circle at 92% 18%, rgba(14, 172, 196, .09), transparent 24%),
        linear-gradient(145deg, var(--cg-canvas) 0%, var(--cg-surface) 52%, var(--cg-canvas-blue) 100%);
}
.auth-page-v5 .auth-backdrop { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.auth-page-v5 .auth-backdrop::before { position: absolute; inset: 0; opacity: .32; background-image: linear-gradient(rgba(31,102,235,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(31,102,235,.055) 1px,transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to bottom,#000,transparent 82%); content: ""; }
.auth-page-v5 .auth-backdrop i { position: absolute; border-radius: 50%; filter: blur(2px); opacity: .6; }
.auth-page-v5 .auth-backdrop i:nth-child(1) { width: 360px; height: 360px; inset-block-start: 8%; inset-inline-start: -220px; background: rgba(31,102,235,.1); }
.auth-page-v5 .auth-backdrop i:nth-child(2) { width: 260px; height: 260px; inset-block-end: 3%; inset-inline-end: -130px; background: rgba(14,172,196,.1); }
.auth-page-v5 .auth-backdrop i:nth-child(3) { width: 160px; height: 160px; inset-block-start: 32%; inset-inline-end: 12%; border: 28px solid rgba(31,102,235,.045); }
.auth-page-v5 .auth-topbar { position: relative; z-index: 5; width: min(1280px,calc(100% - 48px)); min-height: 76px; border-bottom: 1px solid color-mix(in srgb,var(--cg-line) 72%,transparent); }
.auth-page-v5 .auth-topbar-actions { display: flex; align-items: center; gap: 12px; }
.auth-page-v5 .auth-home-link { display: inline-flex; align-items: center; gap: 7px; padding: 9px 11px; border-radius: 10px; color: var(--cg-copy); }
.auth-page-v5 .auth-home-link:hover { background: var(--cg-blue-soft); color: var(--cg-blue); }
.auth-page-v5 .auth-locale-form select { min-width: 62px; height: 38px; padding: 0 24px 0 11px; border: 1px solid var(--cg-line); border-radius: 10px; background: var(--cg-surface); color: var(--cg-copy); font: 800 11px/1 inherit; cursor: pointer; }
.auth-page-v5 .auth-switch-link { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 14px; border: 1px solid var(--cg-line); border-radius: 11px; background: color-mix(in srgb,var(--cg-surface) 88%,transparent); box-shadow: var(--cg-shadow-sm); white-space: nowrap; }
.auth-page-v5 .auth-switch-link span { color: var(--cg-muted); font-size: 11px; }
.auth-page-v5 .auth-switch-link strong { margin: 0; color: var(--cg-blue); font-size: 11px; }
.auth-page-v5 .auth-shell { position: relative; z-index: 2; width: min(1240px,calc(100% - 48px)); margin: 30px auto 64px; display: grid; grid-template-columns: minmax(0,.9fr) minmax(560px,1.1fr); align-items: start; gap: clamp(36px,5vw,72px); }
.auth-page-v5 .auth-shell-login { grid-template-columns: minmax(0,1fr) minmax(430px,.78fr); }
.auth-page-v5 .auth-value-panel { position: sticky; inset-block-start: 98px; padding: 28px 0; text-align: start; }
.auth-page-v5 .auth-value-panel h1 { max-width: 590px; margin: 18px 0 0; color: var(--cg-ink); font-size: clamp(43px,4.4vw,62px); line-height: 1.02; letter-spacing: -.064em; text-wrap: balance; }
.auth-page-v5 .auth-value-panel > p { max-width: 570px; margin: 18px 0 0; color: var(--cg-copy); font-size: 15px; line-height: 1.72; }
.auth-page-v5 .auth-benefit-grid { display: grid; gap: 9px; margin-top: 27px; }
.auth-page-v5 .auth-benefit-grid article { display: grid; grid-template-columns: 35px minmax(0,1fr); align-items: center; gap: 12px; padding: 11px 13px; border: 1px solid color-mix(in srgb,var(--cg-line) 82%,transparent); border-radius: 14px; background: color-mix(in srgb,var(--cg-surface) 78%,transparent); backdrop-filter: blur(15px); }
.auth-page-v5 .auth-benefit-grid article > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--cg-blue-soft); color: var(--cg-blue); font-size: 10px; font-weight: 900; }
.auth-page-v5 .auth-benefit-grid strong,.auth-page-v5 .auth-benefit-grid small { display: block; }
.auth-page-v5 .auth-benefit-grid strong { color: var(--cg-ink); font-size: 12px; }
.auth-page-v5 .auth-benefit-grid small { margin-top: 2px; color: var(--cg-muted); font-size: 10px; line-height: 1.4; }
.auth-page-v5 .auth-story-card { position: relative; min-height: 254px; margin-top: 22px; overflow: hidden; border: 1px solid var(--cg-line-strong); border-radius: 24px; background: var(--cg-surface); box-shadow: var(--cg-shadow-md); transform-style: preserve-3d; transition: transform .25s ease; }
.auth-page-v5 .auth-story-card > img { display: block; width: 100%; height: 254px; object-fit: cover; }
.auth-page-v5 .auth-story-card::after { position: absolute; inset: 0; background: linear-gradient(to top,rgba(13,43,91,.4),transparent 55%); content: ""; }
.auth-page-v5 .auth-story-card figcaption { position: absolute; z-index: 3; inset-inline: 14px; inset-block-end: 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.6); border-radius: 13px; background: rgba(255,255,255,.88); color: #163157; box-shadow: 0 14px 35px rgba(20,57,111,.18); backdrop-filter: blur(18px); font-size: 10px; }
.auth-page-v5 .auth-story-card figcaption span { display: inline-flex; align-items: center; gap: 7px; }
.auth-page-v5 .auth-story-card figcaption i { width: 7px; height: 7px; border-radius: 50%; background: #0ca56a; box-shadow: 0 0 0 4px rgba(12,165,106,.14); }
.auth-page-v5 .auth-float-chip { position: absolute; z-index: 4; display: flex; align-items: center; gap: 7px; padding: 8px 10px; border: 1px solid rgba(255,255,255,.66); border-radius: 11px; background: rgba(255,255,255,.9); color: #24405f; box-shadow: 0 12px 28px rgba(20,57,111,.17); backdrop-filter: blur(14px); }
.auth-page-v5 .auth-float-chip b { display: grid; place-items: center; min-width: 29px; height: 29px; padding: 0 5px; border-radius: 8px; background: #eaf2ff; color: #2563eb; font-size: 10px; }
.auth-page-v5 .auth-float-chip span { font-size: 9px; font-weight: 800; }
.auth-page-v5 .auth-float-chip-top { inset-block-start: 14px; inset-inline-end: 14px; }
.auth-page-v5 .auth-float-chip-bottom { inset-block-start: 62px; inset-inline-end: 14px; }
.auth-page-v5 .auth-capability-note { display: flex; align-items: center; gap: 9px; margin-top: 14px; color: var(--cg-muted); font-size: 10px; font-weight: 700; }
.auth-page-v5 .auth-capability-note > span { display: grid; place-items: center; flex: 0 0 21px; height: 21px; border-radius: 50%; background: #e7f9f1; color: #078557; }
.auth-page-v5 .auth-card { position: relative; width: 100%; padding: clamp(28px,3vw,40px); overflow: hidden; border: 1px solid var(--cg-line-strong); border-radius: 28px; background: color-mix(in srgb,var(--cg-surface) 96%,transparent); box-shadow: 0 30px 90px rgba(24,67,132,.16); backdrop-filter: blur(24px) saturate(1.25); }
.auth-page-v5 .auth-card::before { right: 38px; left: 38px; height: 4px; background: linear-gradient(90deg,transparent,#236fe8 25%,#17b2c8 75%,transparent); }
.auth-page-v5 .auth-card-topline { display: flex; align-items: center; gap: 11px; min-height: 44px; margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--cg-line); }
.auth-page-v5 .auth-card-topline > div:nth-child(2) { min-width: 0; }
.auth-page-v5 .auth-card-topline strong,.auth-page-v5 .auth-card-topline span { display: block; }
.auth-page-v5 .auth-card-topline strong { color: var(--cg-ink); font-size: 12px; }
.auth-page-v5 .auth-card-topline span { margin-top: 2px; color: var(--cg-muted); font-size: 10px; }
.auth-page-v5 .auth-card-topline small { margin-inline-start: auto; color: var(--cg-muted); font-size: 9px; white-space: nowrap; }
.auth-page-v5 .auth-step-icon { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border-radius: 12px; background: linear-gradient(135deg,#2563eb,#39a4f2); color: #fff; box-shadow: 0 8px 18px rgba(35,103,232,.23); font-size: 12px; font-weight: 900; }
.auth-page-v5 .auth-lock-icon { background: linear-gradient(135deg,#175ed6,#0aa9c4); }
.auth-page-v5 .auth-card-heading { margin-bottom: 21px; }
.auth-page-v5 .auth-card-heading h2 { margin-top: 7px; color: var(--cg-ink); font-size: clamp(27px,2.6vw,34px); line-height: 1.15; letter-spacing: -.046em; }
.auth-page-v5 .auth-card-heading p { margin-top: 7px; color: var(--cg-copy); font-size: 12px; line-height: 1.55; }
.auth-page-v5 .auth-error-summary,.auth-page-v5 .auth-success-summary { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 17px; padding: 12px 14px; border-radius: 12px; font-size: 11px; line-height: 1.5; }
.auth-page-v5 .auth-error-summary { border: 1px solid #f4c6cd; background: #fff2f4; color: #a62e40; }
.auth-page-v5 .auth-success-summary { border: 1px solid #bdebd8; background: #ecfaf4; color: #087a51; }
.auth-page-v5 .auth-error-summary > span,.auth-page-v5 .auth-success-summary > span { display: grid; place-items: center; flex: 0 0 22px; height: 22px; border-radius: 50%; color: #fff; font-weight: 900; }
.auth-page-v5 .auth-error-summary > span { background: #dc4d60; }
.auth-page-v5 .auth-success-summary > span { background: #0b9a67; }
.auth-page-v5 .google-auth-button { position: relative; min-height: 52px; padding: 8px 14px; border: 1px solid var(--cg-line-strong); border-radius: 13px; background: var(--cg-surface); color: var(--cg-ink); box-shadow: 0 7px 20px rgba(24,67,132,.06); font-size: 12px; }
.auth-page-v5 .google-auth-button:hover { transform: translateY(-1px); border-color: color-mix(in srgb,var(--cg-blue) 38%,var(--cg-line)); box-shadow: 0 10px 25px rgba(24,67,132,.1); }
.auth-page-v5 .google-auth-button > i { position: absolute; inset-inline-end: 16px; color: var(--cg-blue); font-style: normal; font-size: 16px; }
.auth-page-v5 .google-auth-button > em { position: absolute; inset-inline-end: 11px; padding: 4px 7px; border-radius: 999px; background: var(--cg-blue-soft); color: var(--cg-blue); font-size: 8px; font-style: normal; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; }
.auth-page-v5 .google-auth-button.is-disabled { opacity: 1; border-style: solid; background: color-mix(in srgb,var(--cg-canvas) 85%,var(--cg-surface)); color: var(--cg-copy); }
.auth-page-v5 .google-g { display: grid; place-items: center; width: 28px; height: 28px; border: 0; background: #fff; box-shadow: 0 2px 8px rgba(28,58,103,.1); }
.auth-page-v5 .google-g svg { width: 18px; height: 18px; }
.auth-page-v5 .provider-status { min-height: 20px; margin-top: 8px; color: var(--cg-muted); font-size: 10px; text-align: center; }
.auth-page-v5 .auth-divider { margin: 16px 0; font-size: 9px; }
.auth-page-v5 .auth-form-v5 { display: grid; gap: 0; }
.auth-page-v5 .auth-card .form-group { min-width: 0; margin-bottom: 14px; }
.auth-page-v5 .auth-card .form-group label { display: flex; align-items: center; gap: 3px; margin: 0 0 7px; color: var(--cg-copy); font-size: 12px; font-weight: 760; letter-spacing: 0; text-transform: none; }
.auth-page-v5 .auth-card .form-group label span { color: var(--cg-coral); }
.auth-page-v5 .auth-card input:not([type="checkbox"]),.auth-page-v5 .auth-card select { width: 100%; min-height: 50px; height: 50px; margin: 0; padding: 0 14px; border: 1px solid var(--cg-line-strong); border-radius: 12px; background: var(--cg-canvas); color: var(--cg-ink); font-size: 13px; font-family: inherit; transition: border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.auth-page-v5 .auth-card input::placeholder { color: color-mix(in srgb,var(--cg-muted) 72%,transparent); }
.auth-page-v5 .auth-card input:not([type="checkbox"]):hover,.auth-page-v5 .auth-card select:hover { border-color: color-mix(in srgb,var(--cg-blue) 34%,var(--cg-line)); }
.auth-page-v5 .auth-card input:not([type="checkbox"]):focus,.auth-page-v5 .auth-card select:focus { outline: 0; border-color: var(--cg-blue); background: var(--cg-surface); box-shadow: 0 0 0 4px color-mix(in srgb,var(--cg-blue) 13%,transparent); }
.auth-page-v5 .form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.auth-page-v5 .password-input-wrap { position: relative; }
.auth-page-v5 .password-input-wrap input { padding-inline-end: 76px!important; }
.auth-page-v5 .password-toggle { position: absolute; z-index: 2; inset-inline-end: 7px; inset-block-start: 50%; bottom: auto; min-width: 58px; height: 36px; padding: 0 9px; border: 0; border-radius: 9px; background: var(--cg-blue-soft); color: var(--cg-blue); cursor: pointer; font-size: 10px; font-weight: 850; transform: translateY(-50%); }
.auth-page-v5 .password-toggle:hover { background: color-mix(in srgb,var(--cg-blue) 15%,var(--cg-blue-soft)); }
.auth-page-v5 .password-strength-row { display: grid; grid-template-columns: minmax(90px,1fr) auto; align-items: center; gap: 8px; margin-top: 7px; }
.auth-page-v5 .password-meter { margin: 0; }
.auth-page-v5 .password-meter i { height: 4px; }
.auth-page-v5 [data-password-feedback],.auth-page-v5 .password-match-copy { min-height: 17px; color: var(--cg-muted); font-size: 9px; line-height: 1.4; }
.auth-page-v5 .password-match-copy { display: block; margin-top: 7px; }
.auth-page-v5 .password-match-copy.is-valid { color: var(--cg-green); }
.auth-page-v5 .password-match-copy.is-invalid { color: var(--cg-coral); }
.auth-page-v5 .field-hint { margin: -4px 0 13px; color: var(--cg-muted); font-size: 10px; line-height: 1.45; }
.auth-page-v5 .terms-check { display: grid; grid-template-columns: 20px minmax(0,1fr); align-items: start; gap: 9px; min-height: 40px; margin: 1px 0 14px; color: var(--cg-copy)!important; cursor: pointer; font-size: 10px!important; line-height: 1.55; text-transform: none!important; }
.auth-page-v5 .terms-check input { width: 18px!important; min-height: 18px!important; height: 18px!important; margin: 1px 0 0!important; accent-color: var(--cg-blue); }
.auth-page-v5 .auth-submit { min-height: 52px; border-radius: 13px; background: linear-gradient(135deg,#1d63e5,#2b82ef 63%,#17a4c4); box-shadow: 0 13px 29px rgba(31,102,235,.25); font-size: 13px; }
.auth-page-v5 .auth-submit:hover { box-shadow: 0 17px 34px rgba(31,102,235,.34); }
.auth-page-v5 .auth-submit[aria-busy="true"] { cursor: wait; opacity: .8; }
.auth-page-v5 .auth-submit[aria-busy="true"] i { width: 15px; height: 15px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; font-size: 0; animation: auth-spin .7s linear infinite; }
.auth-page-v5 .auth-form-security { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 10px; color: var(--cg-muted); font-size: 9px; }
.auth-page-v5 .auth-form-security span { color: var(--cg-green); font-size: 14px; }
.auth-page-v5 .auth-card-footer { margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--cg-line); color: var(--cg-muted); font-size: 11px; }
.auth-page-v5 .auth-card-footer a { color: var(--cg-blue); }
.auth-page-v5 .auth-card-login { align-self: center; max-width: 510px; justify-self: end; }
.auth-page-v5 .auth-card-login .auth-card-heading { margin-bottom: 24px; }
.auth-page-v5 .auth-story-login { min-height: 280px; }
.auth-page-v5 .auth-story-login > img { height: 280px; }
[data-theme="dark"] .auth-page-v5 .auth-error-summary { border-color: #673341; background: #2e1b25; color: #ffb4c0; }
[data-theme="dark"] .auth-page-v5 .auth-success-summary { border-color: #225a48; background: #142d27; color: #9de8cb; }
[data-theme="dark"] .auth-page-v5 .auth-story-card figcaption,[data-theme="dark"] .auth-page-v5 .auth-float-chip { border-color: rgba(255,255,255,.12); background: rgba(15,28,48,.88); color: #eef5ff; }
[dir="rtl"] .auth-page-v5 .auth-home-link span { transform: rotate(180deg); }
@keyframes auth-spin { to { transform: rotate(360deg); } }
@media (max-width:1120px) {
    .auth-page-v5 .auth-shell,.auth-page-v5 .auth-shell-login { width: min(760px,calc(100% - 40px)); grid-template-columns: minmax(0,1fr); gap: 28px; }
    .auth-page-v5 .auth-card,.auth-page-v5 .auth-card-login { grid-row: 1; max-width: none; justify-self: stretch; }
    .auth-page-v5 .auth-value-panel { position: static; grid-row: 2; padding: 10px 0; }
    .auth-page-v5 .auth-value-panel h1 { font-size: clamp(39px,7vw,55px); }
    .auth-page-v5 .auth-story-card { min-height: 230px; }
    .auth-page-v5 .auth-story-card > img,.auth-page-v5 .auth-story-login > img { height: 230px; }
}
@media (max-width:760px) {
    .auth-page-v5 .auth-topbar { width: min(100% - 28px,1280px); min-height: 68px; }
    .auth-page-v5 .auth-home-link,.auth-page-v5 .auth-switch-link span { display: none; }
    .auth-page-v5 .auth-switch-link { padding: 0 11px; }
    .auth-page-v5 .auth-locale-form select { min-width: 56px; }
    .auth-page-v5 .auth-shell,.auth-page-v5 .auth-shell-login { width: min(100% - 24px,760px); margin-top: 13px; }
    .auth-page-v5 .auth-card { padding: 25px 20px; border-radius: 22px; }
    .auth-page-v5 .form-grid { grid-template-columns: minmax(0,1fr); gap: 0; }
    .auth-page-v5 .auth-card-topline small { display: none; }
    .auth-page-v5 .auth-benefit-grid { grid-template-columns: 1fr; }
}
@media (max-width:520px) {
    .auth-page-v5 .auth-topbar-actions { gap: 7px; }
    .auth-page-v5 .auth-locale-form { display: none; }
    .auth-page-v5 .auth-card { padding: 23px 17px; }
    .auth-page-v5 .auth-card-heading h2 { font-size: 27px; }
    .auth-page-v5 .auth-value-panel h1 { font-size: 39px; }
    .auth-page-v5 .auth-value-panel > p { font-size: 14px; }
    .auth-page-v5 .auth-story-card { min-height: 205px; }
    .auth-page-v5 .auth-story-card > img,.auth-page-v5 .auth-story-login > img { height: 205px; }
    .auth-page-v5 .auth-float-chip-bottom { display: none; }
    .auth-page-v5 .auth-card-footer { flex-wrap: wrap; }
}
@media (max-width:380px) {
    .auth-page-v5 .auth-topbar { width: calc(100% - 20px); gap: 8px; }
    .auth-page-v5 .marketing-logo { flex: 0 0 auto; }
    .auth-page-v5 .marketing-logo > span { display: none; }
    .auth-page-v5 .brand-logo-mark { width: 34px; height: 34px; flex-basis: 34px; }
    .auth-page-v5 .auth-topbar-actions { min-width: 0; gap: 5px; }
    .auth-page-v5 .auth-switch-link { padding-inline: 9px; }
    .auth-page-v5 .theme-toggle { flex: 0 0 52px; width: 52px; }
}

/* Authentication recovery v5 */
.auth-page-v5 .auth-inline-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: -3px 0 1px;
}
.auth-page-v5 .auth-remember-option {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 44px;
    color: var(--cg-muted);
    font-size: 13px;
    font-weight: 720;
    cursor: pointer;
}
.auth-page-v5 .auth-remember-option input {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--cg-blue);
}
.auth-page-v5 .auth-inline-actions a {
    color: #1265dc;
    font-size: 13px;
    font-weight: 760;
    text-decoration: none;
}
.auth-page-v5 .auth-inline-actions a:hover,
.auth-page-v5 .auth-inline-actions a:focus-visible {
    color: #1e40af;
    text-decoration: underline;
    text-underline-offset: 4px;
}
.auth-page-v5 .auth-shell-recovery {
    width: min(1120px,calc(100% - 48px));
    grid-template-columns: minmax(0,1fr) minmax(420px,520px);
    align-items: center;
    gap: clamp(54px,7vw,112px);
    min-height: calc(100vh - 118px);
    padding-bottom: 44px;
}
.auth-page-v5 .auth-recovery-visual {
    display: grid;
    align-content: center;
    gap: 18px;
    min-width: 0;
}
.auth-page-v5 .auth-recovery-visual h1 {
    margin: 0;
    max-width: 680px;
    color: var(--auth-ink,#0d213d);
    font-size: clamp(44px,5vw,68px);
    line-height: .99;
    letter-spacing: -.055em;
}
.auth-page-v5 .auth-recovery-visual > p {
    margin: 0;
    max-width: 620px;
    color: var(--auth-muted,#5c6f88);
    font-size: 16px;
    line-height: 1.7;
}
.auth-page-v5 .auth-recovery-visual .auth-story-card {
    margin-top: 6px;
    min-height: 220px;
}
.auth-page-v5 .auth-recovery-visual .auth-story-card > img {
    height: 220px;
}
.auth-page-v5 .auth-recovery-card {
    width: 100%;
    max-width: 520px;
    justify-self: end;
}
.auth-page-v5 .auth-provider-warning {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin: 0 0 16px;
    padding: 13px 14px;
    border: 1px solid #f5d889;
    border-radius: 14px;
    background: #fff9e9;
    color: #6f4b00;
    font-size: 12px;
    line-height: 1.55;
}
.auth-page-v5 .auth-provider-warning > span {
    display: grid;
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 50%;
    background: #f0b429;
    color: #fff;
    font-weight: 850;
}
.auth-page-v5 .auth-provider-warning p { margin: 1px 0 0; }
.auth-page-v5 .auth-token-invalid {
    display: grid;
    justify-items: center;
    gap: 10px;
    padding: 24px 8px 12px;
    text-align: center;
}
.auth-page-v5 .auth-token-invalid > span {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    border: 1px solid #fecaca;
    border-radius: 17px;
    background: #fff1f2;
    color: #dc2626;
    font-size: 28px;
}
.auth-page-v5 .auth-token-invalid h3 {
    margin: 5px 0 0;
    color: var(--auth-ink,#0d213d);
    font-size: 20px;
}
.auth-page-v5 .auth-token-invalid p {
    margin: 0 0 8px;
    max-width: 390px;
    color: var(--auth-muted,#5c6f88);
    font-size: 13px;
    line-height: 1.65;
}
html[data-theme="dark"] .auth-page-v5 .auth-inline-actions a { color: #74b5ff; }
html[data-theme="dark"] .auth-page-v5 .auth-provider-warning {
    border-color: rgba(245,183,55,.28);
    background: rgba(138,91,0,.16);
    color: #ffd982;
}
html[data-theme="dark"] .auth-page-v5 .auth-token-invalid > span {
    border-color: rgba(248,113,113,.28);
    background: rgba(127,29,29,.2);
    color: #fca5a5;
}
@media (max-width:1120px) {
    .auth-page-v5 .auth-shell-recovery {
        width: min(760px,calc(100% - 40px));
        grid-template-columns: minmax(0,1fr);
        gap: 28px;
        min-height: auto;
    }
    .auth-page-v5 .auth-recovery-card {
        grid-row: 1;
        max-width: none;
        justify-self: stretch;
    }
    .auth-page-v5 .auth-recovery-visual {
        grid-row: 2;
        padding: 8px 0 28px;
    }
    .auth-page-v5 .auth-recovery-visual h1 {
        font-size: clamp(38px,7vw,54px);
    }
}
@media (max-width:760px) {
    .auth-page-v5 .auth-shell-recovery {
        width: min(100% - 24px,760px);
        margin-top: 13px;
    }
    .auth-page-v5 .auth-recovery-visual {
        gap: 14px;
    }
}
@media (max-width:560px) {
    .auth-page-v5 .auth-recovery-visual {
        display: none;
    }
    .auth-page-v5 .auth-shell-recovery {
        display: block;
        padding-bottom: 24px;
    }
}
/* Authentication provider choice v5.1 */
.auth-page-v5 .auth-provider-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 11px;
    margin-bottom: 10px;
}
.auth-page-v5 .auth-provider-item { min-width: 0; }
.auth-page-v5 .auth-provider-button {
    display: grid;
    grid-template-columns: 34px minmax(0,1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-width: 0;
    min-height: 66px;
    padding: 9px 10px;
    border: 1px solid var(--cg-line-strong);
    border-radius: 15px;
    background: var(--cg-surface);
    color: var(--cg-ink);
    box-shadow: 0 8px 24px rgba(24,67,132,.07);
    font: inherit;
    text-align: start;
    text-decoration: none;
    transition: border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.auth-page-v5 .auth-provider-button:not(.is-disabled):hover,
.auth-page-v5 .auth-provider-button:not(.is-disabled):focus-visible {
    transform: translateY(-1px);
    border-color: color-mix(in srgb,var(--cg-blue) 48%,var(--cg-line));
    box-shadow: 0 13px 28px rgba(24,67,132,.13);
    outline: 0;
}
.auth-page-v5 .auth-provider-button:not(.is-disabled):focus-visible {
    box-shadow: 0 0 0 4px color-mix(in srgb,var(--cg-blue) 16%,transparent),0 13px 28px rgba(24,67,132,.13);
}
.auth-page-v5 .auth-provider-button.is-disabled {
    cursor: not-allowed;
    opacity: 1;
    background: color-mix(in srgb,var(--cg-canvas) 82%,var(--cg-surface));
    color: var(--cg-copy);
}
.auth-page-v5 .auth-provider-logo {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 9px rgba(28,58,103,.11);
}
.auth-page-v5 .auth-provider-logo svg { width: 20px; height: 20px; }
.auth-page-v5 .meta-m { color: #0866ff; }
.auth-page-v5 .meta-m svg { width: 27px; height: 19px; }
.auth-page-v5 .meta-m path {
    fill: none;
    stroke: currentColor;
    stroke-width: 2.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.auth-page-v5 .auth-provider-copy { min-width: 0; }
.auth-page-v5 .auth-provider-copy strong,
.auth-page-v5 .auth-provider-copy small { display: block; overflow-wrap: anywhere; }
.auth-page-v5 .auth-provider-copy strong { color: var(--cg-ink); font-size: 11px; line-height: 1.25; }
.auth-page-v5 .auth-provider-copy small { margin-top: 3px; color: var(--cg-muted); font-size: 8px; line-height: 1.3; }
.auth-page-v5 .auth-provider-grid .provider-badge {
    position: static;
    max-width: 72px;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: 7px;
    font-style: normal;
    font-weight: 850;
    line-height: 1.2;
    overflow-wrap: anywhere;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .035em;
}
.auth-page-v5 .provider-badge.is-ready { background: #e6f8f0; color: #087c56; }
.auth-page-v5 .provider-badge.is-pending { background: #fff5da; color: #976200; }
.auth-page-v5 .auth-provider-grid .provider-status {
    justify-content: flex-start;
    min-height: 25px;
    margin: 5px 4px 0;
    font-size: 8px;
    line-height: 1.35;
    text-align: start;
}
.auth-page-v5 .provider-status.is-ready span { background: var(--cg-green); }
.auth-page-v5 .provider-status.is-pending span { background: #e6a31a; }
.auth-page-v5 .auth-provider-boundary {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin: 2px 3px 12px;
    color: var(--cg-muted);
    font-size: 8px;
    line-height: 1.45;
}
.auth-page-v5 .auth-provider-boundary > span { flex: 0 0 auto; color: var(--cg-blue); font-size: 12px; }
html[data-theme="dark"] .auth-page-v5 .auth-provider-button { background: color-mix(in srgb,var(--cg-surface) 94%,#0f172a); }
html[data-theme="dark"] .auth-page-v5 .auth-provider-button.is-disabled { background: color-mix(in srgb,var(--cg-canvas) 86%,#0f172a); }
html[data-theme="dark"] .auth-page-v5 .provider-badge.is-ready { background: #153b31; color: #8ae6c1; }
html[data-theme="dark"] .auth-page-v5 .provider-badge.is-pending { background: #3b3017; color: #f0c766; }
[dir="rtl"] .auth-page-v5 .auth-provider-button,
[dir="rtl"] .auth-page-v5 .auth-provider-grid .provider-status { text-align: start; }
@media (max-width:680px) {
    .auth-page-v5 .auth-provider-grid { grid-template-columns: minmax(0,1fr); gap: 8px; }
    .auth-page-v5 .auth-provider-grid .provider-status { min-height: 18px; }
}
@media (max-width:360px) {
    .auth-page-v5 .auth-provider-button { grid-template-columns: 32px minmax(0,1fr) auto; gap: 8px; padding-inline: 8px; }
    .auth-page-v5 .auth-provider-logo { width: 32px; height: 32px; }
    .auth-page-v5 .auth-provider-grid .provider-badge { max-width: 60px; padding-inline: 5px; font-size: 6px; }
}

/* Content-rich marketing experience v6 */
.intent-section,.resource-section{background:linear-gradient(180deg,var(--cg-canvas),#f5f9ff)}
.intent-grid,.resource-grid,.role-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.intent-card,.resource-card,.role-grid article{position:relative;overflow:hidden;border:1px solid var(--cg-line);border-radius:22px;background:var(--cg-surface);box-shadow:var(--cg-shadow-sm)}
.intent-card{padding:26px 22px}.intent-card::after{position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--cg-blue),#23bfc5);content:""}.intent-index{display:block;margin-bottom:22px;color:var(--cg-blue);font-size:9px;font-weight:900;letter-spacing:.14em}.intent-card h3,.resource-card h3,.role-grid h3{margin:0;color:var(--cg-ink);font-size:17px;line-height:1.2;letter-spacing:-.025em}.intent-card p,.resource-card p,.role-grid p{color:var(--cg-copy);font-size:10px;line-height:1.7}.intent-card>strong{display:block;margin:21px 0 8px;color:var(--cg-muted);font-size:7px;letter-spacing:.1em;text-transform:uppercase}.intent-card ul{display:grid;gap:7px;margin:0;padding:0;list-style:none}.intent-card li{position:relative;padding-inline-start:17px;color:var(--cg-copy);font-size:9px;line-height:1.5}.intent-card li::before{position:absolute;inset-inline-start:0;top:.45em;width:7px;height:7px;border:2px solid var(--cg-blue);border-radius:50%;content:""}
.comparison-section{background:linear-gradient(135deg,#081a39,#102c5a);color:#fff}.comparison-layout{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(0,1.3fr);align-items:center;gap:clamp(30px,6vw,90px)}.comparison-copy h2{margin:14px 0;color:#fff;font-size:clamp(34px,4.4vw,62px);line-height:1.02;letter-spacing:-.055em}.comparison-copy p{color:#c5d5ef;font-size:14px;line-height:1.75}.comparison-copy .text-link{color:#fff}.comparison-table{overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:22px;background:rgba(255,255,255,.07);box-shadow:0 26px 80px rgba(0,0,0,.2);backdrop-filter:blur(16px)}.comparison-row{display:grid;grid-template-columns:.7fr 1fr 1.15fr;gap:16px;padding:17px 20px;border-top:1px solid rgba(255,255,255,.1);align-items:center}.comparison-row:first-child{border-top:0}.comparison-row span,.comparison-row strong{font-size:9px;line-height:1.45}.comparison-row>span:first-child{color:#d8e4f8;font-weight:800}.comparison-row>span:nth-child(2){color:#9eb2d0}.comparison-row>strong{color:#fff}.comparison-head{background:rgba(255,255,255,.07);text-transform:uppercase;letter-spacing:.08em}
.resource-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.resource-card{display:flex;min-height:330px;flex-direction:column;padding:28px}.resource-kicker{margin-bottom:18px;color:var(--cg-blue);font-size:8px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.resource-card h3{font-size:21px}.resource-card p{font-size:11px}.resource-takeaway{display:grid;gap:5px;margin:auto 0 20px;padding:14px;border-radius:14px;background:var(--cg-surface-blue)}.resource-takeaway strong{color:var(--cg-blue);font-size:7px;letter-spacing:.1em;text-transform:uppercase}.resource-takeaway span{color:var(--cg-copy);font-size:9px;line-height:1.55}.resource-card>a{color:var(--cg-blue);font-size:9px;font-weight:850;text-decoration:none}
.role-section{background:var(--cg-canvas)}.role-grid article{padding:22px}.role-grid article>span{display:grid;width:36px;height:36px;margin-bottom:18px;place-items:center;border-radius:11px;background:var(--cg-surface-blue);color:var(--cg-blue);font-size:10px;font-weight:900}.role-grid p{margin-bottom:0}
@media(max-width:1080px){.intent-grid,.role-grid{grid-template-columns:repeat(2,1fr)}.comparison-layout{grid-template-columns:1fr}.resource-grid{grid-template-columns:1fr}.resource-card{min-height:0}}
@media(max-width:680px){.intent-grid,.role-grid{grid-template-columns:1fr}.comparison-row{grid-template-columns:.72fr 1fr 1.1fr;gap:8px;padding:14px 11px}.comparison-row span,.comparison-row strong{font-size:7px}.resource-card{padding:22px}.intent-card{padding:22px 19px}}
[data-theme="dark"] .intent-section,[data-theme="dark"] .resource-section{background:linear-gradient(180deg,var(--cg-canvas),#0c1d36)}

/* Legal trust pages and readable comparison v5.2 */
.comparison-row span,
.comparison-row strong { font-size: 12px; }
.auth-page-v5 .terms-check a {
    color: #1265dc;
    font-weight: 800;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.auth-page-v5 .terms-check a:hover,
.auth-page-v5 .terms-check a:focus-visible { color: #1e40af; }
html[data-theme="dark"] .auth-page-v5 .terms-check a { color: #83bdff; }
.legal-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(72px,9vw,126px) 0 clamp(52px,7vw,92px);
    border-bottom: 1px solid #dce8f7;
    background:
        radial-gradient(circle at 83% 18%,rgba(39,123,246,.19),transparent 29%),
        radial-gradient(circle at 16% 82%,rgba(23,195,211,.12),transparent 31%),
        linear-gradient(145deg,#f8fbff,#eef6ff 58%,#f9fcff);
}
.legal-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: linear-gradient(rgba(30,91,164,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(30,91,164,.045) 1px,transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(to bottom,black,transparent);
}
.legal-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0,1.2fr) minmax(300px,.55fr);
    align-items: end;
    gap: clamp(42px,8vw,112px);
}
.legal-breadcrumb {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 24px;
    color: #67809e;
    font-size: 12px;
}
.legal-breadcrumb a { color: #1767d8; font-weight: 750; text-decoration: none; }
.legal-breadcrumb strong { color: #37516f; }
.legal-hero h1 {
    max-width: 840px;
    margin: 17px 0 22px;
    color: #0d213d;
    font-size: clamp(44px,6.2vw,82px);
    line-height: .96;
    letter-spacing: -.06em;
}
.legal-hero [data-reveal] > p {
    max-width: 760px;
    margin: 0;
    color: #4f6682;
    font-size: clamp(16px,1.5vw,19px);
    line-height: 1.72;
}
.legal-updated {
    display: inline-flex;
    margin-top: 22px;
    padding: 8px 12px;
    border: 1px solid #cbdcf0;
    border-radius: 999px;
    background: rgba(255,255,255,.72);
    color: #506983;
    font-size: 11px;
    font-weight: 750;
}
.legal-summary-card {
    display: grid;
    gap: 12px;
    padding: 27px;
    border: 1px solid rgba(102,143,193,.24);
    border-radius: 24px;
    background: rgba(255,255,255,.82);
    box-shadow: 0 24px 70px rgba(31,82,145,.13);
    backdrop-filter: blur(18px);
}
.legal-summary-card > span {
    color: #1767d8;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.legal-summary-card > strong { color: #102744; font-size: 22px; line-height: 1.2; }
.legal-summary-card p { margin: 0; color: #60758e; font-size: 13px; line-height: 1.65; }
.legal-summary-card a { color: #1265dc; font-size: 13px; font-weight: 800; text-decoration: none; }
.legal-section { background: #fff; }
.legal-layout {
    display: grid;
    grid-template-columns: minmax(210px,270px) minmax(0,820px);
    justify-content: space-between;
    align-items: start;
    gap: clamp(42px,8vw,110px);
}
.legal-toc {
    position: sticky;
    top: 100px;
    padding: 22px;
    border: 1px solid #dbe7f4;
    border-radius: 20px;
    background: #f8fbff;
}
.legal-toc > strong {
    display: block;
    margin-bottom: 12px;
    color: #122b49;
    font-size: 12px;
}
.legal-toc ol { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.legal-toc a {
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 8px;
    align-items: start;
    padding: 8px 7px;
    border-radius: 10px;
    color: #516982;
    font-size: 11px;
    line-height: 1.4;
    text-decoration: none;
}
.legal-toc a:hover,
.legal-toc a:focus-visible { background: #eaf3ff; color: #0b59c3; }
.legal-toc a span { color: #2c7bf0; font-family: ui-monospace,SFMono-Regular,Consolas,monospace; font-size: 9px; }
.legal-content { display: grid; }
.legal-content > article {
    display: grid;
    grid-template-columns: 48px minmax(0,1fr);
    gap: 18px;
    padding: 0 0 36px;
    margin-bottom: 36px;
    border-bottom: 1px solid #e3ecf6;
    scroll-margin-top: 110px;
}
.legal-index {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid #c9dcf3;
    border-radius: 14px;
    background: #f3f8ff;
    color: #1767d8;
    font: 800 11px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
}
.legal-content h2 { margin: 3px 0 12px; color: #102744; font-size: clamp(23px,2.4vw,32px); line-height: 1.15; letter-spacing: -.025em; }
.legal-content article p { margin: 0; color: #526a84; font-size: 14px; line-height: 1.8; }
.legal-content article ul { display: grid; gap: 9px; margin: 17px 0 0; padding: 0; list-style: none; }
.legal-content article li {
    position: relative;
    padding-inline-start: 20px;
    color: #354e6b;
    font-size: 13px;
    line-height: 1.65;
}
.legal-content article li::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: .67em;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: linear-gradient(135deg,#2378f2,#18b8cb);
}
.legal-contact-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 30px;
    border-radius: 24px;
    background: linear-gradient(135deg,#0d326a,#1258bd);
    box-shadow: 0 24px 65px rgba(14,72,152,.2);
}
.legal-contact-panel span { color: #8dddf2; font-size: 10px; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.legal-contact-panel h2 { margin: 7px 0; color: #fff; font-size: 25px; }
.legal-contact-panel p { max-width: 510px; margin: 0; color: #c9dcf8; font-size: 13px; line-height: 1.65; }
html[data-theme="dark"] .legal-hero {
    border-color: #1c3658;
    background: radial-gradient(circle at 83% 18%,rgba(39,123,246,.19),transparent 29%),linear-gradient(145deg,#071426,#0a1b31 64%,#081729);
}
html[data-theme="dark"] .legal-hero h1,
html[data-theme="dark"] .legal-summary-card > strong,
html[data-theme="dark"] .legal-content h2,
html[data-theme="dark"] .legal-toc > strong { color: #eef6ff; }
html[data-theme="dark"] .legal-hero [data-reveal] > p,
html[data-theme="dark"] .legal-summary-card p,
html[data-theme="dark"] .legal-content article p,
html[data-theme="dark"] .legal-content article li { color: #a9bdd5; }
html[data-theme="dark"] .legal-summary-card,
html[data-theme="dark"] .legal-toc {
    border-color: #1c385c;
    background: rgba(10,27,49,.88);
}
html[data-theme="dark"] .legal-section { background: #071426; }
html[data-theme="dark"] .legal-content > article { border-color: #1a3556; }
html[data-theme="dark"] .legal-index { border-color: #284c78; background: #0d2543; color: #80b9ff; }
html[data-theme="dark"] .legal-toc a { color: #a9bdd5; }
html[data-theme="dark"] .legal-toc a:hover { background: #102d50; color: #9bc7ff; }
html[data-theme="dark"] .legal-updated { border-color: #274867; background: rgba(10,27,49,.75); color: #a9bdd5; }
@media (max-width:980px) {
    .legal-hero-grid { grid-template-columns: minmax(0,1fr); gap: 30px; }
    .legal-summary-card { max-width: 620px; }
    .legal-layout { grid-template-columns: minmax(0,1fr); gap: 35px; }
    .legal-toc { position: static; }
    .legal-toc ol { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:680px) {
    .comparison-table { overflow-x: auto; }
    .comparison-row { min-width: 560px; }
    .comparison-row span,
    .comparison-row strong { font-size: 11px; }
    .legal-hero { padding-top: 56px; }
    .legal-hero h1 { font-size: 44px; }
    .legal-summary-card { padding: 22px; }
    .legal-toc ol { grid-template-columns: minmax(0,1fr); }
    .legal-content > article { grid-template-columns: 38px minmax(0,1fr); gap: 13px; }
    .legal-index { width: 36px; height: 36px; border-radius: 11px; }
    .legal-contact-panel { align-items: flex-start; flex-direction: column; padding: 24px; }
}

/* Evergreen resource experience v5.3 */
.resource-article{background:var(--cg-canvas);color:var(--cg-copy)}
.resource-hero{position:relative;overflow:hidden;padding:clamp(92px,11vw,145px) 0 clamp(58px,7vw,92px);background:radial-gradient(circle at 82% 12%,rgba(43,115,246,.15),transparent 31%),linear-gradient(180deg,#f8fbff,var(--cg-canvas))}
.resource-hero::before{position:absolute;inset:0;opacity:.45;background-image:linear-gradient(rgba(43,115,246,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(43,115,246,.045) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,#000,transparent 85%);content:"";pointer-events:none}
.resource-hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.22fr) minmax(280px,.58fr);align-items:end;gap:clamp(34px,7vw,96px)}
.resource-breadcrumb{display:flex;align-items:center;gap:9px;margin-bottom:30px;color:var(--cg-muted);font-size:10px;font-weight:760}.resource-breadcrumb a{color:inherit;text-decoration:none}.resource-breadcrumb a:hover{color:var(--cg-blue)}
.resource-hero h1{max-width:920px;margin:16px 0 20px;color:var(--cg-ink);font-size:clamp(42px,5.7vw,78px);line-height:.98;letter-spacing:-.06em}.resource-intro{max-width:820px;margin:0;color:var(--cg-copy);font-size:clamp(16px,1.7vw,20px);line-height:1.72}
.resource-meta{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:25px;color:var(--cg-muted);font-size:9px;font-weight:720}.resource-meta span{display:flex;align-items:center;gap:5px}.resource-meta span::before{width:7px;height:7px;border-radius:50%;background:var(--cg-green);content:""}.resource-meta span+span::before{background:var(--cg-blue)}
.resource-summary{padding:28px;border:1px solid var(--cg-line-strong);border-radius:24px;background:rgba(255,255,255,.84);box-shadow:0 28px 80px rgba(23,71,145,.14);backdrop-filter:blur(18px)}.resource-summary>span{color:var(--cg-blue);font-size:8px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.resource-summary strong{display:block;margin:13px 0 10px;color:var(--cg-ink);font-size:20px;line-height:1.2;letter-spacing:-.025em}.resource-summary p{margin:0;color:var(--cg-copy);font-size:12px;line-height:1.7}.resource-summary a{display:flex;align-items:center;justify-content:space-between;margin-top:22px;padding-top:17px;border-top:1px solid var(--cg-line);color:var(--cg-blue);font-size:9px;font-weight:850;text-decoration:none}
.resource-layout{display:grid;grid-template-columns:250px minmax(0,820px);justify-content:center;gap:clamp(38px,6vw,88px);padding-top:clamp(58px,8vw,100px);padding-bottom:clamp(76px,9vw,120px)}
.resource-toc{position:sticky;top:105px;height:max-content;padding:20px;border:1px solid var(--cg-line);border-radius:18px;background:var(--cg-surface);box-shadow:var(--cg-shadow-sm)}.resource-toc>strong{display:block;margin-bottom:14px;color:var(--cg-ink);font-size:10px}.resource-toc ol{display:grid;gap:5px;margin:0;padding:0;list-style:none}.resource-toc a{display:grid;grid-template-columns:24px 1fr;gap:8px;padding:9px 8px;border-radius:9px;color:var(--cg-copy);font-size:9px;line-height:1.4;text-decoration:none;transition:background .2s,color .2s}.resource-toc a:hover{background:var(--cg-surface-blue);color:var(--cg-blue)}.resource-toc a span{color:var(--cg-blue);font-size:7px;font-weight:900}
.resource-content>section:not(.resource-checklist):not(.resource-faq){display:grid;grid-template-columns:44px 1fr;gap:22px;padding:0 0 56px;margin:0 0 56px;border-bottom:1px solid var(--cg-line);scroll-margin-top:115px}.resource-index{display:grid;width:38px;height:38px;place-items:center;border-radius:12px;background:var(--cg-surface-blue);color:var(--cg-blue);font-size:9px;font-weight:900}.resource-content h2{margin:0 0 18px;color:var(--cg-ink);font-size:clamp(27px,3vw,38px);line-height:1.1;letter-spacing:-.04em}.resource-content p{margin:0 0 17px;color:var(--cg-copy);font-size:15px;line-height:1.82}.resource-content ul{display:grid;gap:9px;margin:22px 0 0;padding:0;list-style:none}.resource-content li{position:relative;padding-inline-start:25px;color:var(--cg-copy);font-size:13px;line-height:1.65}.resource-content ul li::before{position:absolute;inset-inline-start:0;top:.55em;width:10px;height:10px;border:2px solid var(--cg-blue);border-radius:50%;content:""}
.resource-checklist{margin:0 0 64px;padding:clamp(27px,4vw,46px);border:1px solid #bcd4ff;border-radius:26px;background:linear-gradient(145deg,#f4f8ff,#fff);scroll-margin-top:115px}.resource-checklist>p{max-width:650px}.resource-checklist ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin:28px 0 0;padding:0;list-style:none}.resource-checklist li{display:grid;grid-template-columns:34px 1fr;align-items:start;gap:11px;padding:15px;border:1px solid var(--cg-line);border-radius:14px;background:rgba(255,255,255,.82);font-size:11px}.resource-checklist li>span{display:grid;width:28px;height:28px;place-items:center;border-radius:9px;background:var(--cg-blue);color:#fff;font-size:8px;font-weight:900}
.resource-faq{margin:0 0 64px}.resource-faq>.faq-list{margin-top:25px}.resource-faq .faq-list details{background:var(--cg-surface)}
.resource-cta{display:grid;grid-template-columns:1fr auto;align-items:center;gap:28px;padding:clamp(28px,5vw,48px);border-radius:28px;background:linear-gradient(135deg,#0d2e62,#1558bd);box-shadow:0 30px 80px rgba(17,62,126,.22);color:#fff}.resource-cta>div>span{font-size:8px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.resource-cta h2{margin:10px 0;color:#fff}.resource-cta p{max-width:570px;margin:0;color:#cbdcf6}.resource-cta>div:last-child{display:grid;gap:9px;min-width:180px}.resource-cta .btn-secondary{border-color:rgba(255,255,255,.35);background:transparent;color:#fff}
[data-theme="dark"] .resource-hero{background:radial-gradient(circle at 82% 12%,rgba(56,133,255,.19),transparent 31%),linear-gradient(180deg,#09162b,var(--cg-canvas))}[data-theme="dark"] .resource-summary{background:rgba(15,34,61,.84)}[data-theme="dark"] .resource-checklist{border-color:#294a79;background:linear-gradient(145deg,#102849,#0d1d34)}[data-theme="dark"] .resource-checklist li{background:rgba(13,32,57,.85)}
@media(max-width:980px){.resource-hero-grid{grid-template-columns:1fr}.resource-summary{max-width:680px}.resource-layout{grid-template-columns:1fr}.resource-toc{position:static}.resource-toc ol{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.resource-hero{padding-top:78px}.resource-hero h1{font-size:40px}.resource-meta{display:grid}.resource-layout{padding-top:45px}.resource-toc ol{grid-template-columns:1fr}.resource-content>section:not(.resource-checklist):not(.resource-faq){grid-template-columns:1fr;gap:14px;padding-bottom:42px;margin-bottom:42px}.resource-checklist ol{grid-template-columns:1fr}.resource-cta{grid-template-columns:1fr}.resource-cta>div:last-child{min-width:0}.resource-content p{font-size:14px}}

/* === CONSOLIDATED SOURCE: app-experience.css === */
/*
 * Arawn Guard application shell and dashboard v3.
 * Layered after the legacy stylesheet so existing screens keep working.
 */
:root {
    --app-bg: #f5f8fd;
    --app-surface: #ffffff;
    --app-surface-soft: #f8faff;
    --app-surface-blue: #edf5ff;
    --app-ink: #13233f;
    --app-copy: #58697f;
    --app-muted: #5f6f85;
    --app-line: #dce6f2;
    --app-line-strong: #cad8e9;
    --app-blue: #1d4ed8;
    --app-blue-deep: #1d4ed8;
    --app-cyan: #0aa6b5;
    --app-green: #0b9b68;
    --app-amber: #805400;
    --app-coral: #e05264;
    --app-violet: #735ce8;
    --app-shadow-xs: 0 5px 18px rgba(26, 65, 122, .05);
    --app-shadow-sm: 0 10px 28px rgba(26, 65, 122, .07);
    --app-shadow-md: 0 18px 48px rgba(26, 65, 122, .11);
    --app-sidebar: 268px;
    --app-topbar: 74px;
}

[data-theme="dark"] {
    --app-bg: #091322;
    --app-surface: #111d31;
    --app-surface-soft: #142239;
    --app-surface-blue: #162d4e;
    --app-ink: #f1f6ff;
    --app-copy: #b1bfd0;
    --app-muted: #8393aa;
    --app-line: #273852;
    --app-line-strong: #344963;
    --app-blue: #66a0ff;
    --app-blue-deep: #8bb7ff;
    --app-amber: #ffd37a;
    --app-shadow-xs: 0 5px 18px rgba(0, 0, 0, .15);
    --app-shadow-sm: 0 10px 28px rgba(0, 0, 0, .2);
    --app-shadow-md: 0 18px 48px rgba(0, 0, 0, .28);
}

* {
    scrollbar-color: var(--app-line-strong) transparent;
    scrollbar-width: thin;
}

.app-body {
    min-height: 100vh;
    overflow-x: hidden;
    background:
        radial-gradient(circle at 85% 0, rgba(35, 103, 232, .055), transparent 24%),
        var(--app-bg);
    color: var(--app-ink);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.app-body::selection {
    background: rgba(35, 103, 232, .18);
    color: var(--app-ink);
}

.app-container-v3 {
    display: block;
    min-height: 100vh;
}

/* Sidebar */
.app-sidebar {
    position: fixed;
    z-index: 300;
    top: 0;
    bottom: 0;
    left: 0;
    display: flex;
    width: var(--app-sidebar);
    height: 100vh;
    flex-direction: column;
    border-right: 1px solid var(--app-line);
    background: color-mix(in srgb, var(--app-surface) 97%, transparent);
    box-shadow: 7px 0 32px rgba(34, 68, 122, .045);
    backdrop-filter: blur(22px);
}

.app-sidebar .sidebar-header {
    display: flex;
    min-height: var(--app-topbar);
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--app-line);
}

.app-brand {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 11px;
    color: var(--app-ink);
    text-decoration: none;
}

.app-brand img {
    flex: 0 0 39px;
    border-radius: 12px;
    box-shadow: 0 8px 18px rgba(35, 103, 232, .22);
}

.app-brand > span,
.app-brand strong,
.app-brand small {
    display: block;
}

.app-brand strong {
    color: var(--app-ink);
    font-size: 17px;
    font-weight: 850;
    letter-spacing: -.045em;
}

.app-brand strong span {
    display: inline;
    color: var(--app-blue);
}

.app-brand small {
    margin-top: 1px;
    color: var(--app-muted);
    font-size: 7px;
    font-weight: 750;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.sidebar-close {
    display: none;
    width: 34px;
    height: 34px;
    border: 1px solid var(--app-line);
    border-radius: 10px;
    background: var(--app-surface);
    color: var(--app-copy);
    cursor: pointer;
    font-size: 20px;
}

.app-sidebar .sidebar-nav {
    flex: 1;
    padding: 14px 12px 20px;
    overflow-y: auto;
}

.sidebar-group + .sidebar-group {
    margin-top: 16px;
}

.sidebar-group-label {
    display: block;
    padding: 0 11px 7px;
    color: var(--app-muted);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.app-sidebar .sidebar-nav a {
    position: relative;
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 11px;
    margin: 2px 0;
    padding: 9px 11px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: var(--app-copy);
    font-size: 10px;
    font-weight: 710;
    text-decoration: none;
    transition: .18s ease;
}

.app-sidebar .sidebar-nav a svg,
.sidebar-site-link svg,
.logout-btn svg,
.app-topbar svg,
.command-dialog svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.app-sidebar .sidebar-nav a:hover {
    border-color: var(--app-line);
    background: var(--app-surface-soft);
    color: var(--app-ink);
    transform: translateX(2px);
}

.app-sidebar .sidebar-nav a.active {
    border-color: rgba(35, 103, 232, .17);
    background: linear-gradient(135deg, #1c5ed9, #327bf4);
    color: #fff;
    box-shadow: 0 9px 24px rgba(35, 103, 232, .22);
}

.app-sidebar .sidebar-nav a.active i {
    position: absolute;
    top: 14px;
    right: 11px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, .13);
}

.app-sidebar .sidebar-footer {
    display: block;
    padding: 12px;
    border-top: 1px solid var(--app-line);
    background: transparent;
}

.sidebar-site-link {
    display: flex;
    min-height: 38px;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    border-radius: 10px;
    color: var(--app-muted);
    font-size: 9px;
    font-weight: 720;
    text-decoration: none;
}

.sidebar-site-link:hover {
    background: var(--app-surface-soft);
    color: var(--app-blue);
}

.sidebar-user-card {
    display: grid;
    grid-template-columns: 35px minmax(0, 1fr) 34px;
    align-items: center;
    gap: 9px;
    margin-top: 7px;
    padding: 10px;
    border: 1px solid var(--app-line);
    border-radius: 13px;
    background: var(--app-surface-soft);
}

.sidebar-user-card .user-avatar,
.topbar-avatar {
    display: grid;
    place-items: center;
    width: 35px;
    height: 35px;
    border-radius: 11px;
    background: linear-gradient(135deg, #1e62df, #45a0f3);
    color: #fff;
    box-shadow: 0 6px 15px rgba(35, 103, 232, .2);
    font-size: 11px;
    font-weight: 850;
}

.sidebar-user-card .user-details {
    min-width: 0;
}

.sidebar-user-card .user-name,
.sidebar-user-card .user-role {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar-user-card .user-name {
    color: var(--app-ink);
    font-size: 9px;
    font-weight: 790;
}

.sidebar-user-card .user-role {
    margin-top: 2px;
    color: var(--app-muted);
    font-size: 7px;
    text-transform: capitalize;
}

.sidebar-user-card form {
    margin: 0;
}

.sidebar-user-card .logout-btn {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid var(--app-line);
    border-radius: 9px;
    background: var(--app-surface);
    color: var(--app-muted);
}

.sidebar-user-card .logout-btn:hover {
    border-color: #f0c2c9;
    background: #fff0f2;
    color: var(--app-coral);
}

/* Main and topbar */
.app-main {
    min-height: 100vh;
    margin-left: var(--app-sidebar);
    padding: 0;
}

.app-topbar {
    position: sticky;
    z-index: 220;
    top: 0;
    display: flex;
    min-height: var(--app-topbar);
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 12px 28px;
    border-bottom: 1px solid var(--app-line);
    background: color-mix(in srgb, var(--app-surface) 87%, transparent);
    box-shadow: 0 5px 22px rgba(30, 63, 114, .035);
    backdrop-filter: blur(22px) saturate(1.35);
}

.app-topbar-start,
.app-topbar-actions {
    display: flex;
    align-items: center;
    gap: 11px;
}

.app-menu-toggle {
    display: none;
    width: 38px;
    height: 38px;
    padding: 10px;
    border: 1px solid var(--app-line);
    border-radius: 11px;
    background: var(--app-surface);
    cursor: pointer;
}

.app-menu-toggle span {
    display: block;
    height: 2px;
    margin: 3px 0;
    border-radius: 2px;
    background: var(--app-ink);
}

.app-breadcrumb small,
.app-breadcrumb strong {
    display: block;
}

.app-breadcrumb small {
    color: var(--app-muted);
    font-size: 7px;
    font-weight: 720;
    text-transform: uppercase;
}

.app-breadcrumb strong {
    margin-top: 1px;
    color: var(--app-ink);
    font-size: 12px;
    letter-spacing: -.02em;
}

.command-trigger {
    display: flex;
    min-width: 250px;
    height: 39px;
    align-items: center;
    gap: 8px;
    padding: 7px 8px 7px 11px;
    border: 1px solid var(--app-line);
    border-radius: 11px;
    background: var(--app-surface-soft);
    color: var(--app-muted);
    cursor: pointer;
    font-size: 9px;
    text-align: left;
}

.command-trigger span {
    flex: 1;
}

kbd {
    padding: 3px 6px;
    border: 1px solid var(--app-line-strong);
    border-bottom-width: 2px;
    border-radius: 6px;
    background: var(--app-surface);
    color: var(--app-muted);
    font-family: inherit;
    font-size: 7px;
    font-weight: 760;
}

.system-health {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--app-muted);
    font-size: 8px;
    font-weight: 720;
}

.system-health i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--app-green);
    box-shadow: 0 0 0 4px rgba(11, 155, 104, .1);
}

.topbar-locale-form select {
    width: 55px;
    height: 36px;
    padding: 5px 20px 5px 8px;
    border: 1px solid var(--app-line);
    border-radius: 10px;
    background: var(--app-surface);
    color: var(--app-copy);
    font-size: 8px;
    font-weight: 780;
}

.app-topbar .app-theme-toggle {
    display: grid;
    width: 58px;
    height: 32px;
    grid-template-columns: 1fr 1fr;
    order: initial;
    padding: 2px;
    border: 1px solid var(--app-line);
    border-radius: 999px;
    background: var(--app-surface-soft);
}

.app-topbar .app-theme-toggle span {
    display: grid;
    height: 26px;
    place-items: center;
    border-radius: 50%;
    font-size: 11px;
}

.app-topbar .app-theme-toggle .theme-sun {
    background: #fff7df;
    color: #d28a0c;
    box-shadow: 0 3px 8px rgba(32, 58, 95, .08);
}

[data-theme="dark"] .app-topbar .app-theme-toggle .theme-sun {
    background: transparent;
    box-shadow: none;
}

[data-theme="dark"] .app-topbar .app-theme-toggle .theme-moon {
    background: #29405f;
    color: #c2d6f5;
}

.topbar-avatar {
    width: 35px;
    height: 35px;
}

.app-content-inner {
    width: min(1540px, 100%);
    margin-inline: auto;
    padding: 30px 32px 56px;
}

/* Command palette */
.command-palette[hidden] {
    display: none;
}

.command-palette {
    position: fixed;
    z-index: 1000;
    inset: 0;
    display: grid;
    place-items: start center;
    padding: 12vh 20px 20px;
}

.command-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(8, 18, 36, .42);
    backdrop-filter: blur(5px);
}

.command-dialog {
    position: relative;
    z-index: 2;
    width: min(590px, 100%);
    overflow: hidden;
    border: 1px solid var(--app-line-strong);
    border-radius: 20px;
    background: var(--app-surface);
    box-shadow: 0 30px 100px rgba(7, 30, 68, .3);
}

.command-search {
    display: grid;
    grid-template-columns: 22px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 15px 17px;
    border-bottom: 1px solid var(--app-line);
}

.command-search svg {
    width: 20px;
    height: 20px;
    color: var(--app-muted);
}

.command-search input {
    height: 40px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--app-ink);
    box-shadow: none;
    font-size: 14px;
}

.command-search input:focus {
    border: 0;
    outline: 0;
    box-shadow: none;
}

.command-results {
    display: grid;
    max-height: 430px;
    gap: 3px;
    padding: 10px;
    overflow-y: auto;
}

.command-results a {
    display: grid;
    grid-template-columns: 34px 1fr auto;
    min-height: 48px;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    border-radius: 11px;
    color: var(--app-copy);
    font-size: 10px;
    font-weight: 730;
    text-decoration: none;
}

.command-results a:hover,
.command-results a:focus {
    background: var(--app-surface-blue);
    color: var(--app-blue);
    outline: none;
}

.command-results a svg {
    width: 17px;
    height: 17px;
    padding: 8px;
    box-sizing: content-box;
    border-radius: 10px;
    background: var(--app-surface-soft);
}

.command-results a i {
    font-style: normal;
}

.command-no-results {
    display: none;
    padding: 20px;
    color: var(--app-muted);
    font-size: 9px;
    text-align: center;
}

.command-results:not(:has(a:not([hidden]))) + .command-no-results {
    display: block;
}

/* Generic screen refinement */
.app-content-inner > .page-header,
.app-page-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin: 0 0 24px;
    padding: 0;
    border: 0;
}

.app-content-inner > .page-header h1,
.app-page-hero h1 {
    margin: 0;
    color: var(--app-ink);
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 810;
    letter-spacing: -.052em;
}

.app-content-inner > .page-header p,
.app-content-inner > .page-header .subtitle,
.app-page-hero p {
    margin-top: 7px;
    color: var(--app-copy);
    font-size: 11px;
    line-height: 1.6;
}

.page-eyebrow {
    display: block;
    margin-bottom: 8px;
    color: var(--app-blue);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.page-hero-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.app-content-inner .btn {
    min-height: 38px;
    padding: 9px 13px;
    border-radius: 10px;
    font-size: 9px;
    font-weight: 770;
    transition: .18s ease;
}

.app-content-inner .btn-primary {
    border: 1px solid #1a5bd3;
    background: linear-gradient(135deg, #1b5ed9, #327bf4);
    color: #fff;
    box-shadow: 0 9px 22px rgba(35, 103, 232, .2);
}

.app-content-inner .btn-primary:hover {
    background: linear-gradient(135deg, #1551bf, #286ce1);
    box-shadow: 0 13px 28px rgba(35, 103, 232, .26);
    transform: translateY(-1px);
}

.app-content-inner .btn-secondary,
.app-content-inner .btn:not(.btn-primary):not(.btn-danger):not(.btn-success):not(.btn-info) {
    border: 1px solid var(--app-line-strong);
    background: var(--app-surface);
    color: var(--app-copy);
    box-shadow: var(--app-shadow-xs);
}

.app-content-inner .btn-secondary:hover {
    border-color: color-mix(in srgb, var(--app-blue) 45%, var(--app-line));
    background: var(--app-surface-blue);
    color: var(--app-blue);
}

.app-content-inner .card,
.app-content-inner .integration-card,
.app-content-inner .dashboard-card,
.app-content-inner .chart-card,
.app-content-inner .form-card,
.app-panel {
    border: 1px solid var(--app-line);
    border-radius: 17px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
}

.app-content-inner .card,
.app-content-inner .integration-card,
.app-content-inner .form-card {
    padding: 22px;
}

.app-content-inner .card + .card,
.app-content-inner .integration-site + .integration-site {
    margin-top: 17px;
}

.app-content-inner .card h2,
.app-content-inner .integration-card h3,
.app-content-inner .form-card h2 {
    color: var(--app-ink);
    letter-spacing: -.03em;
}

.app-content-inner .card p,
.app-content-inner .integration-card p {
    color: var(--app-copy);
    font-size: 10px;
    line-height: 1.65;
}

.app-content-inner input,
.app-content-inner select,
.app-content-inner textarea {
    min-height: 42px;
    border: 1px solid var(--app-line-strong);
    border-radius: 10px;
    background: var(--app-surface-soft);
    color: var(--app-ink);
    font-size: 10px;
}

.app-content-inner textarea {
    min-height: 110px;
}

.app-content-inner input:focus,
.app-content-inner select:focus,
.app-content-inner textarea:focus {
    border-color: var(--app-blue);
    outline: 0;
    box-shadow: 0 0 0 3px rgba(35, 103, 232, .12);
}

.app-content-inner label {
    color: var(--app-copy);
    font-size: 9px;
    font-weight: 740;
}

.app-content-inner .notice {
    padding: 15px 17px;
    border-radius: 13px;
}

.app-content-inner .notice p {
    margin-top: 4px;
}

.app-content-inner .notice-info {
    border-color: #c8dcfa;
    background: #eef5ff;
    color: #315276;
}

.app-content-inner .notice-warning {
    border-color: #ecd594;
    background: #fff8e6;
    color: #745717;
}

[data-theme="dark"] .app-content-inner .notice-info {
    border-color: #2b4d78;
    background: #152d4d;
    color: #b8cff0;
}

[data-theme="dark"] .app-content-inner .notice-warning {
    border-color: #65542f;
    background: #352c1b;
    color: #e9cf8e;
}

.app-content-inner .data-table,
.app-content-inner table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.app-content-inner .data-table th,
.app-content-inner table th {
    padding: 11px 13px;
    border-bottom: 1px solid var(--app-line);
    background: var(--app-surface-soft);
    color: var(--app-muted);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .07em;
    text-align: left;
    text-transform: uppercase;
}

.app-content-inner .data-table td,
.app-content-inner table td {
    padding: 12px 13px;
    border-bottom: 1px solid var(--app-line);
    color: var(--app-copy);
    font-size: 9px;
}

.app-content-inner .data-table tbody tr:last-child td,
.app-content-inner table tbody tr:last-child td {
    border-bottom: 0;
}

.app-content-inner .data-table tr:hover td,
.app-content-inner table tr:hover td {
    background: color-mix(in srgb, var(--app-surface-blue) 64%, transparent);
}

.app-content-inner .table-responsive {
    overflow: auto;
    border: 1px solid var(--app-line);
    border-radius: 13px;
}

.app-content-inner .table-responsive .data-table,
.app-content-inner .table-responsive table {
    border: 0;
}

.badge,
.status-badge {
    border-radius: 999px;
}

.integration-grid,
.platform-settings-grid {
    gap: 15px;
}

.integration-site > h2 {
    margin: 26px 0 13px;
    color: var(--app-ink);
    font-size: 18px;
}

.integration-site > h2 small {
    color: var(--app-muted);
    font-size: 9px;
}

.alert {
    margin-bottom: 15px;
    border-radius: 12px;
}

/* Dashboard setup */
.dashboard-v3 {
    display: grid;
    gap: 20px;
}

.dashboard-v3 .app-page-hero {
    margin-bottom: 3px;
}

.setup-console {
    position: relative;
    padding: 24px;
    overflow: hidden;
    border: 1px solid #c8daf5;
    border-radius: 20px;
    background:
        radial-gradient(circle at 95% 5%, rgba(70, 153, 255, .18), transparent 26%),
        linear-gradient(135deg, #f8fbff, #eef5ff);
    box-shadow: var(--app-shadow-sm);
}

[data-theme="dark"] .setup-console {
    border-color: #2a466b;
    background:
        radial-gradient(circle at 95% 5%, rgba(70, 153, 255, .14), transparent 26%),
        linear-gradient(135deg, #111f34, #152b4a);
}

.setup-console-head {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 25px;
}

.setup-kicker {
    display: block;
    margin-bottom: 7px;
    color: var(--app-blue);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .12em;
}

.setup-console h2 {
    color: var(--app-ink);
    font-size: 19px;
    letter-spacing: -.035em;
}

.setup-console-head p {
    max-width: 780px;
    margin-top: 5px;
    color: var(--app-copy);
    font-size: 9px;
    line-height: 1.6;
}

.setup-progress {
    position: relative;
    display: grid;
    place-items: center;
    width: 92px;
    height: 92px;
    border-radius: 50%;
    background: conic-gradient(var(--app-blue) var(--setup-progress), var(--app-line) 0);
}

.setup-progress::before {
    position: absolute;
    inset: 7px;
    border-radius: 50%;
    background: var(--app-surface);
    content: "";
}

.setup-progress strong,
.setup-progress span {
    position: relative;
    z-index: 2;
    display: block;
    text-align: center;
}

.setup-progress strong {
    color: var(--app-ink);
    font-size: 19px;
    letter-spacing: -.04em;
}

.setup-progress span {
    max-width: 62px;
    color: var(--app-muted);
    font-size: 6px;
    line-height: 1.2;
}

.setup-step-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin-top: 20px;
}

.setup-step {
    position: relative;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    min-height: 84px;
    align-items: start;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-radius: 13px;
    background: color-mix(in srgb, var(--app-surface) 90%, transparent);
    color: var(--app-copy);
    text-decoration: none;
    transition: .18s ease;
}

.setup-step:hover {
    border-color: color-mix(in srgb, var(--app-blue) 38%, var(--app-line));
    box-shadow: var(--app-shadow-sm);
    transform: translateY(-2px);
}

.setup-step-number {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--app-surface-blue);
    color: var(--app-blue);
    font-size: 9px;
    font-weight: 900;
}

.setup-step.is-complete .setup-step-number {
    background: #e8faf2;
    color: var(--app-green);
}

[data-theme="dark"] .setup-step.is-complete .setup-step-number {
    background: #15382e;
}

.setup-step strong,
.setup-step small {
    display: block;
}

.setup-step strong {
    color: var(--app-ink);
    font-size: 9px;
}

.setup-step small {
    margin-top: 4px;
    color: var(--app-muted);
    font-size: 7px;
    line-height: 1.4;
}

.setup-step em {
    position: absolute;
    right: 9px;
    bottom: 7px;
    color: var(--app-muted);
    font-size: 6px;
    font-style: normal;
    font-weight: 750;
}

.setup-step.is-complete em {
    color: var(--app-green);
}

.setup-continue {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 16px;
    color: var(--app-blue);
    font-size: 9px;
    font-weight: 780;
    text-decoration: none;
}

.setup-continue span {
    transition: transform .18s ease;
}

.setup-continue:hover span {
    transform: translateX(4px);
}

/* Dashboard metric cards */
.app-metric-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

.app-metric-card {
    position: relative;
    display: grid;
    grid-template-columns: 43px minmax(0, 1fr);
    gap: 12px;
    min-height: 126px;
    align-items: center;
    padding: 17px;
    overflow: hidden;
    border: 1px solid var(--app-line);
    border-radius: 16px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
    transition: .2s ease;
}

.app-metric-card:hover {
    border-color: color-mix(in srgb, var(--metric-color) 32%, var(--app-line));
    box-shadow: var(--app-shadow-md);
    transform: translateY(-3px);
}

.metric-blue { --metric-color: var(--app-blue); --metric-soft: #eaf2ff; }
.metric-cyan { --metric-color: var(--app-cyan); --metric-soft: #e8fafd; }
.metric-amber { --metric-color: var(--app-amber); --metric-soft: #fff7e5; }
.metric-coral { --metric-color: var(--app-coral); --metric-soft: #fff0f2; }
.metric-violet { --metric-color: var(--app-violet); --metric-soft: #f1efff; }

[data-theme="dark"] .app-metric-card {
    --metric-soft: var(--app-surface-soft);
}

.metric-icon {
    display: grid;
    place-items: center;
    width: 43px;
    height: 43px;
    border-radius: 13px;
    background: var(--metric-soft);
    color: var(--metric-color);
}

.metric-icon svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.app-metric-card div > span,
.app-metric-card div > strong,
.app-metric-card div > small {
    display: block;
}

.app-metric-card div > span {
    overflow: hidden;
    color: var(--app-muted);
    font-size: 7px;
    font-weight: 760;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-metric-card div > strong {
    margin: 5px 0 3px;
    color: var(--app-ink);
    font-size: 24px;
    line-height: 1;
    letter-spacing: -.055em;
}

.app-metric-card div > small {
    color: var(--metric-color);
    font-size: 6px;
    font-weight: 720;
}

.metric-spark {
    position: absolute;
    right: -18px;
    bottom: -24px;
    width: 78px;
    height: 78px;
    border: 1px solid color-mix(in srgb, var(--metric-color) 14%, transparent);
    border-radius: 50%;
    box-shadow: 0 0 0 13px color-mix(in srgb, var(--metric-color) 3%, transparent), 0 0 0 26px color-mix(in srgb, var(--metric-color) 2%, transparent);
}

/* Dashboard panels */
.dashboard-primary-grid,
.dashboard-secondary-grid {
    display: grid;
    gap: 14px;
}

.dashboard-primary-grid {
    grid-template-columns: minmax(0, 1.48fr) minmax(300px, .72fr);
}

.dashboard-secondary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.app-panel {
    min-width: 0;
    padding: 20px;
}

.app-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 16px;
}

.app-panel-head h2 {
    color: var(--app-ink);
    font-size: 13px;
    letter-spacing: -.025em;
}

.app-panel-head p {
    margin-top: 3px;
    color: var(--app-muted);
    font-size: 7px;
    line-height: 1.45;
}

.panel-period {
    padding: 6px 8px;
    border: 1px solid var(--app-line);
    border-radius: 8px;
    background: var(--app-surface-soft);
    color: var(--app-muted);
    font-size: 7px;
}

.app-chart-wrap {
    position: relative;
    height: 315px;
}

.app-chart-wrap canvas {
    width: 100% !important;
    height: 100% !important;
}

.app-chart-legend {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 10px;
    color: var(--app-muted);
    font-size: 7px;
}

.app-chart-legend span {
    display: flex;
    align-items: center;
    gap: 5px;
}

.app-chart-legend i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.app-chart-legend .blue { background: var(--app-blue); }
.app-chart-legend .cyan { background: var(--app-cyan); }
.app-chart-legend .coral { background: var(--app-coral); }

.chart-empty {
    display: grid;
    min-height: 315px;
    place-items: center;
    align-content: center;
    gap: 10px;
    border: 1px dashed var(--app-line-strong);
    border-radius: 14px;
    background:
        linear-gradient(rgba(248, 250, 255, .82), rgba(248, 250, 255, .82)),
        linear-gradient(var(--app-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--app-line) 1px, transparent 1px);
    background-size: auto, 34px 34px, 34px 34px;
    text-align: center;
}

[data-theme="dark"] .chart-empty {
    background: var(--app-surface-soft);
}

.empty-pulse {
    position: relative;
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    border: 1px solid rgba(35, 103, 232, .2);
    border-radius: 50%;
    box-shadow: 0 0 0 12px rgba(35, 103, 232, .04), 0 0 0 24px rgba(35, 103, 232, .025);
}

.empty-pulse i {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--app-blue);
    box-shadow: 0 0 0 7px rgba(35, 103, 232, .12);
    animation: app-pulse 2.4s ease-in-out infinite;
}

.chart-empty strong {
    max-width: 290px;
    color: var(--app-copy);
    font-size: 10px;
}

.chart-empty a {
    color: var(--app-blue);
    font-size: 8px;
    font-weight: 770;
    text-decoration: none;
}

.platform-health-list {
    display: grid;
    gap: 9px;
}

.platform-health-card {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-radius: 13px;
    background: var(--app-surface-soft);
}

.health-platform-logo {
    display: grid;
    width: 40px;
    height: 40px;
    grid-row: 1 / span 2;
    place-items: center;
    border: 1px solid var(--app-line);
    border-radius: 12px;
    background: var(--app-surface);
    color: #2872e9;
    box-shadow: var(--app-shadow-xs);
    font-size: 11px;
    font-weight: 900;
}

.health-platform-logo.meta {
    border-color: #2875e9;
    background: #2875e9;
    color: #fff;
}

.platform-health-card div strong,
.platform-health-card div small {
    display: block;
}

.platform-health-card div strong {
    color: var(--app-ink);
    font-size: 9px;
}

.platform-health-card div small {
    margin-top: 3px;
    color: var(--app-muted);
    font-size: 7px;
    line-height: 1.35;
}

.health-state {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: max-content;
    grid-column: 2;
    margin-top: 3px;
    padding: 4px 7px;
    border-radius: 999px;
    background: var(--app-surface);
    color: var(--app-muted);
    font-size: 6px;
    font-weight: 760;
}

.health-state i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--app-muted);
}

.platform-health-card.connected .health-state {
    background: #e9faf3;
    color: var(--app-green);
}

.platform-health-card.connected .health-state i {
    background: var(--app-green);
    box-shadow: 0 0 0 3px rgba(11, 155, 104, .1);
}

.platform-health-card.mock .health-state {
    background: #fff7e5;
    color: var(--app-amber);
}

.platform-health-card.mock .health-state i {
    background: var(--app-amber);
}

[data-theme="dark"] .platform-health-card.connected .health-state { background: #15382e; }
[data-theme="dark"] .platform-health-card.mock .health-state { background: #352c1b; }

.platform-honesty {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 12px;
    padding: 11px;
    border: 1px solid #ecd89e;
    border-radius: 11px;
    background: #fff9e9;
}

[data-theme="dark"] .platform-honesty {
    border-color: #65542f;
    background: #352c1b;
}

.platform-honesty > span {
    display: grid;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    color: var(--app-amber);
    font-size: 8px;
    font-weight: 900;
}

.platform-honesty p {
    color: #745717;
    font-size: 7px;
    line-height: 1.45;
}

[data-theme="dark"] .platform-honesty p {
    color: #e9cf8e;
}

.panel-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 15px;
    color: var(--app-blue);
    font-size: 8px;
    font-weight: 780;
    text-decoration: none;
}

.panel-link.compact {
    margin-top: 0;
    white-space: nowrap;
}

.review-queue-badge {
    display: grid;
    padding: 6px 9px;
    border-radius: 9px;
    background: var(--app-surface-blue);
    color: var(--app-muted);
    font-size: 6px;
    text-align: right;
}

.review-queue-badge strong {
    color: var(--app-blue);
    font-size: 13px;
}

.app-empty-state {
    display: grid;
    min-height: 230px;
    place-items: center;
    align-content: center;
    padding: 25px;
    border: 1px dashed var(--app-line-strong);
    border-radius: 13px;
    background: var(--app-surface-soft);
    text-align: center;
}

.empty-state-icon {
    display: grid;
    width: 47px;
    height: 47px;
    place-items: center;
    margin-bottom: 11px;
    border-radius: 14px;
    background: var(--app-surface-blue);
    color: var(--app-blue);
    font-size: 18px;
}

.app-empty-state h3 {
    color: var(--app-ink);
    font-size: 11px;
}

.app-empty-state p {
    max-width: 390px;
    margin-top: 5px;
    color: var(--app-muted);
    font-size: 8px;
    line-height: 1.5;
}

.score-pill {
    display: inline-grid;
    min-width: 31px;
    height: 27px;
    place-items: center;
    border-radius: 8px;
    background: #eef4ff;
    color: var(--app-blue);
    font-size: 8px;
    font-weight: 850;
}

.score-pill.level-suspicious,
.score-pill.level-high_risk {
    background: #fff0f2;
    color: var(--app-coral);
}

.score-pill.level-review_required,
.score-pill.level-monitor {
    background: #fff7e5;
    color: var(--app-amber);
}

.status-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--app-surface-soft);
    color: var(--app-copy);
    font-size: 7px;
    font-weight: 730;
}

.status-pill i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--app-muted);
}

.status-pill.level-high_risk,
.status-pill.level-suspicious {
    background: #fff0f2;
    color: var(--app-coral);
}

.status-pill.level-high_risk i,
.status-pill.level-suspicious i {
    background: var(--app-coral);
}

.event-pill {
    display: inline-flex;
    padding: 5px 7px;
    border-radius: 7px;
    background: var(--app-surface-blue);
    color: var(--app-blue);
    font-size: 7px;
    font-weight: 730;
}

[data-theme="dark"] .score-pill,
[data-theme="dark"] .status-pill,
[data-theme="dark"] .event-pill {
    background: var(--app-surface-soft);
}

/* Existing empty states and filters */
.app-content-inner .empty-state {
    padding: 50px 25px;
    border: 1px dashed var(--app-line-strong);
    border-radius: 17px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
    text-align: center;
}

.app-content-inner .empty-state h2 {
    color: var(--app-ink);
}

.app-content-inner .filters-bar {
    display: flex;
    align-items: end;
    gap: 10px;
    margin-bottom: 16px;
    padding: 15px;
    border: 1px solid var(--app-line);
    border-radius: 14px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow-xs);
}

.app-content-inner .filter-group {
    display: grid;
    gap: 5px;
}

@keyframes app-pulse {
    0%, 100% { transform: scale(.86); opacity: .65; }
    50% { transform: scale(1); opacity: 1; }
}

/* Responsive */
@media (max-width: 1280px) {
    .system-health {
        display: none;
    }

    .command-trigger {
        min-width: 210px;
    }

    .app-metric-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dashboard-secondary-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1050px) {
    :root {
        --app-sidebar: 240px;
    }

    .command-trigger {
        min-width: 180px;
    }

    .command-trigger kbd,
    .topbar-avatar {
        display: none;
    }

    .setup-step-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-primary-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .app-sidebar {
        width: min(310px, calc(100vw - 42px));
        transform: translateX(-105%);
        transition: transform .25s cubic-bezier(.2, .7, .2, 1);
    }

    [dir="rtl"] .app-sidebar {
        right: 0;
        left: auto;
        transform: translateX(105%);
    }

    .app-sidebar.is-open {
        transform: translateX(0);
    }

    .sidebar-close {
        display: grid;
        place-items: center;
    }

    .sidebar-backdrop {
        position: fixed;
        z-index: 290;
        inset: 0;
        border: 0;
        background: rgba(7, 16, 32, .4);
        backdrop-filter: blur(3px);
    }

    .sidebar-backdrop[hidden] {
        display: none;
    }

    .sidebar-open {
        overflow: hidden;
    }

    .app-main {
        margin-left: 0;
    }

    [dir="rtl"] .app-main {
        margin-right: 0;
    }

    .app-menu-toggle {
        display: block;
    }

    .app-content-inner {
        padding: 24px 22px 48px;
    }
}

@media (max-width: 700px) {
    :root {
        --app-topbar: 66px;
    }

    .app-topbar {
        padding: 10px 14px;
    }

    .app-breadcrumb small,
    .command-trigger span,
    .command-trigger kbd,
    .topbar-locale-form,
    .topbar-avatar {
        display: none;
    }

    .app-breadcrumb strong {
        max-width: 130px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .command-trigger {
        display: grid;
        min-width: 38px;
        width: 38px;
        height: 38px;
        place-items: center;
        padding: 0;
    }

    .command-trigger svg {
        width: 17px;
        height: 17px;
    }

    .app-topbar .app-theme-toggle {
        width: 54px;
    }

    .app-content-inner {
        padding: 21px 14px 42px;
    }

    .app-content-inner > .page-header,
    .app-page-hero {
        align-items: stretch;
        flex-direction: column;
    }

    .page-hero-actions {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .page-hero-actions .btn {
        justify-content: center;
    }

    .setup-console {
        padding: 18px;
    }

    .setup-console-head {
        grid-template-columns: 1fr;
    }

    .setup-progress {
        width: 78px;
        height: 78px;
    }

    .setup-step-grid,
    .app-metric-grid {
        grid-template-columns: 1fr;
    }

    .setup-step {
        min-height: 78px;
    }

    .app-metric-card {
        min-height: 105px;
    }

    .app-panel {
        padding: 15px;
    }

    .app-chart-wrap,
    .chart-empty {
        height: 250px;
        min-height: 250px;
    }

    .app-panel-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .panel-link.compact {
        margin-top: 4px;
    }

    .app-content-inner .filters-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .button-row {
        min-width: 0;
    }

    .command-palette {
        padding: 8vh 12px 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

/* Extended legacy screen coverage */
.app-body :focus-visible{outline:3px solid color-mix(in srgb,var(--app-blue) 34%,transparent);outline-offset:3px}
.app-content-inner>.data-table,.app-content-inner>table{display:block;max-width:100%;overflow-x:auto}
.app-content-inner .stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.app-content-inner .stat-card{display:flex;min-height:112px;align-items:center;gap:12px;padding:17px;border:1px solid var(--app-line);border-radius:16px;background:var(--app-surface);box-shadow:var(--app-shadow-sm)}
.app-content-inner .stat-icon{display:grid;width:42px;height:42px;flex:0 0 42px;place-items:center;border-radius:13px;background:var(--app-surface-blue);color:var(--app-blue)}
.app-content-inner .stat-icon svg{width:20px;height:20px}.app-content-inner .stat-content{min-width:0}.app-content-inner .stat-label,.app-content-inner .stat-value{display:block}.app-content-inner .stat-label{color:var(--app-muted);font-size:8px}.app-content-inner .stat-value{margin-top:5px;color:var(--app-ink);font-size:23px;font-weight:820;letter-spacing:-.05em}
.app-content-inner .charts-grid,.app-content-inner .dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}.app-content-inner .chart-card,.app-content-inner .dashboard-card{min-width:0;padding:20px}.app-content-inner .chart-card h3,.app-content-inner .dashboard-card h3{margin-bottom:14px;color:var(--app-ink);font-size:13px}.app-content-inner .chart-card canvas{width:100%!important;height:280px!important}
.app-content-inner .budget-summary{margin-top:16px;padding:21px;border:1px solid var(--app-line);border-radius:17px;background:var(--app-surface);box-shadow:var(--app-shadow-sm)}.budget-summary h3{margin-bottom:13px;color:var(--app-ink)}.budget-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.budget-item{padding:16px;border:1px solid var(--app-line);border-radius:13px;background:var(--app-surface-soft)}.budget-label,.budget-value,.budget-detail{display:block}.budget-label{color:var(--app-muted);font-size:8px}.budget-value{margin:7px 0 4px;color:var(--app-ink);font-size:20px;font-weight:820}.budget-detail{color:var(--app-copy);font-size:8px;line-height:1.45}.budget-item.danger .budget-value{color:var(--app-coral)}.budget-item.success .budget-value{color:var(--app-green)}
.app-content-inner .visitor-detail{display:grid;gap:16px}.app-content-inner .detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.app-content-inner .detail-card{padding:20px;border:1px solid var(--app-line);border-radius:17px;background:var(--app-surface);box-shadow:var(--app-shadow-sm)}.detail-card h3{margin-bottom:14px;color:var(--app-ink)}.detail-item{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--app-line);color:var(--app-copy);font-size:9px}.detail-item:last-child{border-bottom:0}.detail-item strong{color:var(--app-ink);text-align:right}.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mini-stat{padding:14px;border:1px solid var(--app-line);border-radius:12px;background:var(--app-surface-soft)}.mini-stat-label,.mini-stat-value{display:block}.mini-stat-label{color:var(--app-muted);font-size:7px}.mini-stat-value{margin-top:5px;color:var(--app-ink);font-size:18px;font-weight:820}
.app-content-inner .plans-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.plans-grid>.card,.plans-grid>article{min-width:0}.admin-quick-links{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.admin-quick-links a{padding:18px;border:1px solid var(--app-line);border-radius:14px;background:var(--app-surface);color:var(--app-blue);box-shadow:var(--app-shadow-sm);font-size:10px;font-weight:760;text-decoration:none}
.app-content-inner .modal{position:fixed;z-index:900;inset:0;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(7,17,34,.48);backdrop-filter:blur(5px)}.app-content-inner .modal-content{width:min(560px,100%);max-height:88vh;overflow:auto;padding:24px;border:1px solid var(--app-line-strong);border-radius:19px;background:var(--app-surface);box-shadow:0 28px 90px rgba(5,22,52,.3)}.type-badge{display:inline-flex;padding:5px 8px;border-radius:999px;background:var(--app-surface-blue);color:var(--app-blue);font-size:7px;font-weight:760}
@media(max-width:1050px){.app-content-inner .stats-grid{grid-template-columns:repeat(2,1fr)}.app-content-inner .plans-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.app-content-inner .stats-grid,.app-content-inner .charts-grid,.app-content-inner .dashboard-grid,.app-content-inner .detail-grid,.budget-stats,.app-content-inner .plans-grid,.admin-quick-links{grid-template-columns:1fr}.stats-row{grid-template-columns:repeat(2,1fr)}.app-content-inner .chart-card canvas{height:235px!important}}
/* Growth phase: operations center and package catalog */
.admin-ops{display:grid;gap:16px}.admin-metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.admin-ops-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ops-health{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border-radius:999px;background:var(--app-surface-green);color:var(--app-green);font-size:7px;font-weight:800}.ops-health.warn{background:var(--app-surface-amber);color:var(--app-amber)}.ops-health i{width:6px;height:6px;border-radius:50%;background:currentColor}.ops-status-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:16px}.ops-status-grid.three{grid-template-columns:repeat(3,1fr)}.ops-status-grid>div{padding:15px;border:1px solid var(--app-line);border-radius:13px;background:var(--app-surface-soft)}.ops-status-grid span,.ops-status-grid strong{display:block}.ops-status-grid span{color:var(--app-muted);font-size:7px}.ops-status-grid strong{margin-top:6px;color:var(--app-ink);font-size:21px}.ops-user-list{display:grid;margin-top:10px}.ops-user-list>div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--app-line)}.ops-user-list>div:last-child{border-bottom:0}.ops-user-list strong,.ops-user-list small{display:block}.ops-user-list strong{color:var(--app-ink);font-size:9px}.ops-user-list small,.ops-user-list em{color:var(--app-muted);font-size:7px;font-style:normal}.ops-priority-grid{display:grid;gap:9px;margin-top:12px}.ops-priority-grid a{display:flex;align-items:center;justify-content:space-between;padding:15px;border:1px solid var(--app-line);border-radius:13px;background:var(--app-surface-soft);color:var(--app-copy);text-decoration:none}.ops-priority-grid strong{color:var(--app-blue);font-size:18px}.admin-plan-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);gap:14px;align-items:start}.admin-plan-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:14px}.admin-plan-card{position:relative;display:flex;min-width:0;flex-direction:column;padding:18px;border:1px solid var(--app-line);border-radius:16px;background:var(--app-surface-soft)}.admin-plan-card.is-recommended{border-color:color-mix(in srgb,var(--app-blue) 40%,var(--app-line));box-shadow:0 16px 38px rgba(31,95,204,.12)}.admin-plan-card h3{margin:7px 0 4px;color:var(--app-ink);font-size:15px}.admin-plan-card p{min-height:36px;color:var(--app-copy);font-size:8px}.admin-plan-card>strong{margin-top:12px;color:var(--app-blue);font-size:19px}.admin-plan-card>small{margin:5px 0;color:var(--app-muted);font-size:7px}.admin-plan-card ul{flex:1;margin:10px 0;padding-left:15px;color:var(--app-copy);font-size:8px;line-height:1.7}.plan-order,.plan-recommended{display:inline-flex;padding:5px 7px;border-radius:999px;background:var(--app-surface-blue);color:var(--app-blue);font-size:6px;font-weight:800}.plan-recommended{background:var(--app-surface-green);color:var(--app-green)}.plan-editor{position:sticky;top:88px}@media(max-width:1050px){.admin-metric-grid{grid-template-columns:repeat(2,1fr)}.admin-plan-layout{grid-template-columns:1fr}.plan-editor{position:static}}@media(max-width:700px){.admin-ops-grid,.ops-status-grid,.ops-status-grid.three,.admin-plan-list{grid-template-columns:1fr}}

/* === CONSOLIDATED SOURCE: arawn-brand.css === */
/* Arawn Guard brand and responsive quality layer. Loaded after legacy styles. */
:root {
    --ag-ink: #0f172a;
    --ag-copy: #38516f;
    --ag-muted: #526b88;
    --ag-blue: #2563eb;
    --ag-blue-deep: #1d4ed8;
    --ag-cyan: #20bcd2;
    --ag-green: #07885e;
    --ag-canvas: #f6f9fe;
    --ag-surface: #ffffff;
    --ag-surface-soft: #eef5ff;
    --ag-line: #dce8f7;
    --ag-line-strong: #c7d9ef;
    --ag-shadow-sm: 0 8px 24px rgba(14, 57, 113, .08);
    --ag-shadow-md: 0 18px 48px rgba(14, 57, 113, .12);
    --ag-shadow-lg: 0 34px 90px rgba(14, 57, 113, .16);
    --ag-radius-sm: 12px;
    --ag-radius-md: 18px;
    --ag-radius-lg: 28px;
    color-scheme: light;
}

html[data-theme="dark"] {
    --ag-ink: #f1f6ff;
    --ag-copy: #c0cde0;
    --ag-muted: #a9bad0;
    --ag-blue: #6ca8ff;
    --ag-blue-deep: #448df4;
    --ag-cyan: #51d7e7;
    --ag-green: #61d7ad;
    --ag-canvas: #081221;
    --ag-surface: #101e32;
    --ag-surface-soft: #152842;
    --ag-line: #243a56;
    --ag-line-strong: #345071;
    --ag-shadow-sm: 0 8px 26px rgba(0, 0, 0, .18);
    --ag-shadow-md: 0 20px 52px rgba(0, 0, 0, .24);
    --ag-shadow-lg: 0 36px 100px rgba(0, 0, 0, .3);
    color-scheme: dark;
}

html {
    min-width: 320px;
    scroll-padding-top: 92px;
}

body {
    min-width: 320px;
    color: var(--ag-copy);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body,
button,
input,
select,
textarea {
    font-family: Inter, "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

img,
svg,
canvas,
video {
    max-width: 100%;
}

button,
a,
input,
select,
textarea {
    -webkit-tap-highlight-color: transparent;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ag-blue) 42%, transparent) !important;
    outline-offset: 3px;
}

.brand-logo-mark {
    flex: 0 0 auto;
    filter: drop-shadow(0 7px 14px rgba(37, 99, 235, .18));
}

.marketing-logo,
.app-brand {
    letter-spacing: -.035em;
}

.marketing-logo > span,
.app-brand strong {
    color: var(--ag-ink);
    font-weight: 840;
}

.marketing-logo > span > span,
.app-brand strong > span {
    color: var(--ag-blue);
}

/* Public experience */
.marketing-page {
    background:
        radial-gradient(circle at 8% 2%, rgba(37, 99, 235, .08), transparent 31rem),
        radial-gradient(circle at 92% 18%, rgba(32, 188, 210, .08), transparent 30rem),
        var(--ag-canvas);
}

.marketing-header {
    border-bottom-color: color-mix(in srgb, var(--ag-line) 84%, transparent);
    background: color-mix(in srgb, var(--ag-surface) 90%, transparent);
    box-shadow: 0 10px 32px rgba(14, 57, 113, .055);
    backdrop-filter: blur(22px) saturate(1.25);
}

.marketing-nav {
    min-height: 78px;
}

.marketing-logo {
    min-height: 46px;
}

.marketing-logo .brand-logo-mark {
    width: 42px;
    height: 42px;
}

.marketing-nav-links a,
.marketing-login-link {
    min-height: 42px;
    font-size: 14px;
}

.marketing-nav-links a {
    display: inline-flex;
    align-items: center;
    border-radius: 10px;
}

.marketing-nav-links a:hover,
.marketing-nav-links a.active {
    color: var(--ag-blue);
    background: color-mix(in srgb, var(--ag-blue) 7%, transparent);
}

.btn,
.marketing-nav-cta {
    min-height: 44px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 760;
}

.btn-primary {
    border-color: transparent;
    background: linear-gradient(135deg, var(--ag-blue-deep), var(--ag-blue) 62%, #159ec8);
    box-shadow: 0 12px 28px rgba(37, 99, 235, .24);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 17px 34px rgba(37, 99, 235, .3);
}

.btn-secondary {
    border-color: var(--ag-line-strong);
    background: color-mix(in srgb, var(--ag-surface) 94%, transparent);
    color: var(--ag-ink);
}

.marketing-hero {
    overflow: clip;
}

.hero-copy h1,
.section-heading h2,
.comparison-copy h2,
.persona-copy h2,
.visual-story-copy h2 {
    color: var(--ag-ink);
    text-wrap: balance;
}

.hero-lead,
.section-heading p,
.marketing-page p {
    text-wrap: pretty;
}

.hero-visual-frame,
.product-tour,
.platform-flow-card,
.threat-card,
.process-card,
.intent-card,
.pricing-card,
.faq-item,
.visual-story-art,
.agency-visual,
.contact-card {
    border-color: var(--ag-line);
    box-shadow: var(--ag-shadow-sm);
}

.hero-visual-frame:hover,
.platform-flow-card:hover,
.threat-card:hover,
.process-card:hover,
.intent-card:hover,
.pricing-card:hover {
    border-color: color-mix(in srgb, var(--ag-blue) 24%, var(--ag-line));
    box-shadow: var(--ag-shadow-md);
}

.marketing-page :where(.platform-chip, .trust-grid > div, .tour-kpis article, .persona-mini-grid article) {
    min-width: 0;
}

/* Auth */
.auth-page-v5 {
    background:
        radial-gradient(circle at 8% 12%, rgba(37, 99, 235, .1), transparent 34rem),
        radial-gradient(circle at 92% 76%, rgba(32, 188, 210, .1), transparent 32rem),
        var(--ag-canvas);
}

.auth-page-v5 .auth-topbar {
    border: 1px solid color-mix(in srgb, var(--ag-line) 82%, transparent);
    border-radius: 18px;
    background: color-mix(in srgb, var(--ag-surface) 88%, transparent);
    box-shadow: var(--ag-shadow-sm);
    backdrop-filter: blur(22px) saturate(1.2);
}

.auth-page-v5 .auth-card {
    border-color: var(--ag-line-strong);
    background: color-mix(in srgb, var(--ag-surface) 96%, transparent);
    box-shadow: var(--ag-shadow-lg);
}

.auth-page-v5 .auth-card::before {
    background: linear-gradient(90deg, transparent, var(--ag-blue) 24%, var(--ag-cyan) 76%, transparent);
}

.auth-page-v5 .auth-card-heading h2,
.auth-page-v5 .auth-value-panel h1 {
    color: var(--ag-ink);
    text-wrap: balance;
}

.auth-page-v5 .auth-card-heading p,
.auth-page-v5 .auth-value-panel > p {
    color: var(--ag-copy);
}

.auth-page-v5 .auth-card .form-group label {
    color: var(--ag-copy);
    font-size: 13px;
}

.auth-page-v5 .auth-card input:not([type="checkbox"]),
.auth-page-v5 .auth-card select {
    min-height: 50px;
    border-color: var(--ag-line-strong);
    background: var(--ag-canvas);
    color: var(--ag-ink);
    font-size: 16px;
}

.auth-page-v5 .auth-provider-button {
    min-height: 58px;
}

.auth-page-v5 .auth-provider-copy strong {
    font-size: 13px;
}

.auth-page-v5 .auth-provider-copy small,
.auth-page-v5 .provider-status,
.auth-page-v5 .auth-provider-boundary,
.auth-page-v5 .field-hint,
.auth-page-v5 [data-password-feedback],
.auth-page-v5 .password-match-copy,
.auth-page-v5 .terms-check,
.auth-page-v5 .auth-form-security {
    font-size: 11px;
}

.auth-page-v5 .password-toggle,
.auth-page-v5 .auth-home-link,
.auth-page-v5 .auth-switch-link,
.auth-page-v5 .theme-toggle,
.auth-page-v5 select {
    min-height: 44px;
}

/* Authenticated workspace */
.app-body {
    background:
        radial-gradient(circle at 85% 4%, rgba(37, 99, 235, .055), transparent 28rem),
        var(--ag-canvas);
}

.app-sidebar {
    border-inline-end-color: var(--ag-line);
    background: color-mix(in srgb, var(--ag-surface) 97%, transparent);
    box-shadow: 8px 0 34px rgba(14, 57, 113, .055);
}

.app-sidebar .sidebar-header {
    min-height: 84px;
    border-bottom-color: var(--ag-line);
}

.app-brand {
    min-height: 50px;
}

.app-brand img {
    width: 42px;
    height: 42px;
}

.app-brand strong {
    font-size: 18px;
}

.app-brand small {
    color: var(--ag-muted);
    font-size: 11px;
}

.sidebar-group-label {
    color: var(--ag-muted);
    font-size: 11px;
    letter-spacing: .08em;
}

.app-sidebar .sidebar-nav a {
    min-height: 46px;
    border-radius: 12px;
    color: var(--ag-copy);
    font-size: 14px;
}

.app-sidebar .sidebar-nav a:hover {
    border-color: color-mix(in srgb, var(--ag-blue) 18%, var(--ag-line));
    background: color-mix(in srgb, var(--ag-blue) 6%, var(--ag-surface));
    color: var(--ag-ink);
}

.app-sidebar .sidebar-nav a.active {
    background: linear-gradient(135deg, var(--ag-blue-deep), var(--ag-blue));
    color: #fff;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .22);
}

.sidebar-site-link,
.sidebar-user-card {
    min-height: 46px;
}

.sidebar-site-link,
.sidebar-user-card .user-name {
    font-size: 12px;
}

.sidebar-user-card .user-role {
    font-size: 11px;
}

.sidebar-user-card .logout-btn {
    min-width: 42px;
    min-height: 42px;
}

.app-topbar {
    border-bottom-color: var(--ag-line);
    background: color-mix(in srgb, var(--ag-surface) 90%, transparent);
    backdrop-filter: blur(20px) saturate(1.2);
}

.app-breadcrumb small {
    color: var(--ag-muted);
    font-size: 11px;
}

.app-breadcrumb strong {
    color: var(--ag-ink);
    font-size: 14px;
}

.command-trigger,
.system-health,
.topbar-locale-form select,
.app-theme-toggle,
.topbar-avatar,
.app-menu-toggle {
    min-height: 42px;
}

.command-trigger,
.system-health,
.topbar-locale-form select {
    font-size: 12px;
}

.app-content-inner {
    color: var(--ag-copy);
}

.app-page-hero {
    border: 1px solid var(--ag-line);
    border-radius: var(--ag-radius-lg);
    background:
        radial-gradient(circle at 92% 10%, rgba(32, 188, 210, .1), transparent 18rem),
        linear-gradient(135deg, color-mix(in srgb, var(--ag-surface) 96%, transparent), color-mix(in srgb, var(--ag-blue) 4%, var(--ag-surface)));
    box-shadow: var(--ag-shadow-sm);
}

.app-page-hero h1 {
    color: var(--ag-ink);
    font-size: clamp(28px, 3.2vw, 44px);
    text-wrap: balance;
}

.app-page-hero p {
    max-width: 72ch;
    color: var(--ag-copy);
    font-size: 14px;
    line-height: 1.65;
}

.page-eyebrow,
.type-badge,
.plan-order,
.plan-recommended {
    font-size: 10px;
    letter-spacing: .07em;
}

.app-content-inner :where(.card, .metric-card, .app-metric-card, .chart-card, .dashboard-card, .platform-health-card, .settings-section, .data-table-wrap) {
    border-color: var(--ag-line);
    box-shadow: var(--ag-shadow-sm);
}

.app-content-inner :where(p, li, label, td, th, small, .form-text, .table-subline) {
    line-height: 1.5;
}

.app-content-inner :where(label, p, li, td, th, .form-text, .table-subline) {
    font-size: max(12px, .75rem);
}

.app-content-inner :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    min-height: 44px;
    font-size: 16px;
}

.app-content-inner :where(button, .btn, [role="button"]) {
    min-height: 42px;
}

.app-content-inner :where(.data-table, table) {
    width: 100%;
}

.app-content-inner :where(.table-responsive, .data-table-wrap) {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-gutter: stable;
}

.app-content-inner :where(.data-table th, table th) {
    color: var(--ag-muted);
    font-size: 11px;
    letter-spacing: .035em;
}

.app-content-inner :where(.data-table td, table td) {
    color: var(--ag-copy);
    font-size: 12px;
}

.ops-health,
.ops-status-grid span,
.ops-user-list small,
.ops-user-list em,
.admin-plan-card > small,
.admin-plan-card ul {
    font-size: 11px;
}

.ops-user-list strong,
.admin-plan-card p {
    font-size: 12px;
}

.admin-plan-card h3 {
    font-size: 17px;
}

.studio-shell :where(p, label, small, li, td, th, .studio-helper) {
    font-size: max(12px, .75rem);
    line-height: 1.55;
}

.studio-shell :where(input, select, textarea, button, .btn) {
    min-height: 44px;
}

/* RTL */
[dir="rtl"] .app-sidebar {
    box-shadow: -8px 0 34px rgba(14, 57, 113, .055);
}

[dir="rtl"] .marketing-logo,
[dir="rtl"] .app-brand {
    letter-spacing: 0;
}

@media (max-width: 1180px) {
    .marketing-nav-links {
        gap: 2px;
    }

    .marketing-nav-links a {
        padding-inline: 8px;
        font-size: 12px;
    }

    .marketing-nav-actions {
        gap: 7px;
    }
}

@media (max-width: 900px) {
    .marketing-nav {
        min-height: 70px;
    }

    .mobile-nav-toggle {
        min-width: 44px;
        min-height: 44px;
    }

    .marketing-nav-links {
        max-height: calc(100dvh - 86px);
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .marketing-nav-links a,
    .mobile-locale-nav select {
        min-height: 46px;
        font-size: 14px;
    }

    .app-topbar {
        padding-inline: 16px;
    }

    .app-content-inner {
        padding-inline: 16px;
    }

    .app-menu-toggle {
        display: inline-flex;
        min-width: 44px;
    }
}

@media (max-width: 700px) {
    html {
        scroll-padding-top: 74px;
    }

    .marketing-shell {
        width: min(100% - 28px, 1180px);
    }

    .marketing-logo .brand-logo-mark {
        width: 38px;
        height: 38px;
    }

    .hero-copy h1 {
        font-size: clamp(34px, 10vw, 50px);
        letter-spacing: -.045em;
    }

    .hero-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .hero-actions .btn {
        width: 100%;
        min-height: 50px;
    }

    .hero-actions .hero-text-link {
        width: 100%;
        min-height: 50px;
    }

    .hero-platforms,
    .trust-grid,
    .tour-kpis,
    .persona-mini-grid {
        grid-template-columns: 1fr;
    }

    .app-topbar {
        min-height: 68px;
        gap: 10px;
    }

    .app-topbar-start,
    .app-topbar-actions {
        min-width: 0;
    }

    .app-breadcrumb {
        min-width: 0;
    }

    .app-breadcrumb small {
        display: none;
    }

    .app-breadcrumb strong {
        display: block;
        max-width: 34vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .command-trigger span,
    .command-trigger kbd,
    .system-health {
        display: none;
    }

    .command-trigger {
        min-width: 42px;
        width: 42px;
        padding: 0;
    }

    .topbar-locale-form select {
        min-width: 52px;
        width: 52px;
        padding-inline: 8px;
    }

    .topbar-avatar {
        display: none;
    }

    .app-content-inner {
        padding: 16px 12px 34px;
    }

    .app-page-hero {
        padding: 22px 18px;
        border-radius: 20px;
    }

    .app-page-hero h1 {
        font-size: 30px;
    }

    .page-hero-actions {
        display: grid;
        width: 100%;
        grid-template-columns: 1fr;
    }

    .page-hero-actions .btn {
        width: 100%;
    }

    .auth-page-v5 .auth-topbar {
        width: calc(100% - 20px);
        min-height: 64px;
        padding: 8px 10px;
        border-radius: 15px;
    }

    .auth-page-v5 .auth-shell,
    .auth-page-v5 .auth-shell-login {
        width: calc(100% - 20px);
    }

    .auth-page-v5 .auth-card {
        padding: 24px 18px;
        border-radius: 20px;
    }

    .auth-page-v5 .auth-card-heading h2 {
        font-size: 28px;
    }

    .auth-page-v5 .auth-value-panel h1 {
        font-size: clamp(36px, 11vw, 48px);
    }
}

@media (max-width: 430px) {
    .marketing-logo > span {
        font-size: 17px;
    }

    .marketing-nav-actions .marketing-login-link,
    .public-locale-form {
        display: none;
    }

    .marketing-nav-actions {
        margin-inline-start: auto;
    }

    .marketing-nav-cta {
        min-height: 44px;
        padding-inline: 12px;
        font-size: 12px;
    }

    .auth-page-v5 .auth-switch-link span,
    .auth-page-v5 .auth-home-link {
        display: none;
    }

    .auth-page-v5 .auth-topbar-actions {
        margin-inline-start: auto;
    }

    .auth-page-v5 .auth-switch-link {
        min-width: 66px;
        padding-inline: 9px;
    }

    .app-topbar {
        padding-inline: 10px;
    }

    .app-topbar-actions {
        gap: 5px;
    }

    .app-theme-toggle {
        width: 48px;
        min-width: 48px;
    }

    .app-breadcrumb strong {
        max-width: 28vw;
        font-size: 12px;
    }
}

@media (max-width: 360px) {
    .marketing-logo > span,
    .app-breadcrumb {
        display: none;
    }

    .marketing-nav-cta {
        max-width: 122px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .auth-page-v5 .marketing-logo > span {
        display: none;
    }

    .auth-page-v5 .auth-card {
        padding-inline: 15px;
    }

    .topbar-locale-form {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

@media (forced-colors: active) {
    .brand-logo-mark {
        forced-color-adjust: none;
    }

    .btn,
    .app-sidebar .sidebar-nav a,
    .auth-page-v5 .auth-card {
        border: 1px solid CanvasText;
    }
}

/* Real product evidence and evidence-chain marketing components. */
.hero-product-evidence {
    position: relative;
    margin: 0;
    padding: clamp(.7rem, 1.8vw, 1rem);
    border: 1px solid var(--arawn-line);
    border-radius: clamp(1rem, 2.4vw, 1.5rem);
    background: var(--arawn-surface);
    box-shadow: 0 24px 64px rgba(20, 34, 58, .16);
}

[data-theme="dark"] .hero-product-evidence {
    box-shadow: 0 30px 90px rgba(0, 0, 0, .55), 0 0 0 1px rgba(140, 180, 255, .08);
}

[data-theme="dark"] .hero-product-evidence > img {
    filter: brightness(.94) contrast(1.02);
}

.hero-product-evidence > .visual-label {
    position: static;
    display: inline-flex;
    margin: 0 0 .7rem;
    color: var(--arawn-color-measurement);
}

.hero-product-evidence > img {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid var(--arawn-line);
    border-radius: .9rem;
    background: var(--arawn-surface-soft);
}

.hero-evidence-callouts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .45rem;
    margin: .7rem 0 0;
    padding: 0;
    list-style: none;
}

.hero-evidence-callouts li {
    display: flex;
    min-width: 0;
    overflow-wrap: anywhere;
    align-items: center;
    gap: .45rem;
    padding: .55rem;
    border: 1px solid var(--arawn-line);
    border-radius: .65rem;
    color: var(--arawn-color-copy);
    font-size: .68rem;
    font-weight: 750;
    line-height: 1.35;
}

.hero-evidence-callouts span {
    color: var(--arawn-color-measurement);
    font-size: .62rem;
    font-weight: 900;
}

.hero-product-evidence figcaption {
    margin-top: .65rem;
    color: var(--arawn-color-muted);
    font-size: .7rem;
    line-height: 1.5;
}

.evidence-chain-section {
    border-block: 1px solid var(--arawn-line);
    background: color-mix(in srgb, var(--arawn-surface-soft) 68%, var(--arawn-surface));
}

.evidence-chain {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .8rem;
    margin: 2rem 0 0;
    padding: 0;
    list-style: none;
}

.evidence-chain::before {
    position: absolute;
    z-index: 0;
    inset-inline: 4%;
    inset-block-start: 1.25rem;
    height: 2px;
    background: linear-gradient(90deg, var(--arawn-color-measurement), var(--arawn-color-review), var(--arawn-color-risk), var(--arawn-color-verified));
    content: '';
}

.evidence-chain-step {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .7rem;
    min-width: 0;
    padding: 1rem;
    border: 1px solid var(--arawn-line);
    border-block-start: 3px solid var(--arawn-color-measurement);
    border-radius: var(--arawn-radius-card);
    background: var(--arawn-surface);
}

.evidence-chain-step--false_positive,
.evidence-chain-step--review { border-block-start-color: var(--arawn-color-review); }
.evidence-chain-step--action { border-block-start-color: var(--arawn-color-risk); }
.evidence-chain-step--readback { border-block-start-color: var(--arawn-color-verified); }

.evidence-chain-index,
.product-tool-index {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: .65rem;
    background: var(--arawn-surface-soft);
    color: var(--arawn-color-measurement);
    font-size: .65rem;
    font-weight: 900;
}

.evidence-chain-step strong,
.evidence-chain-step small { display: block; }
.evidence-chain-step strong { color: var(--arawn-color-evidence); font-size: .84rem; }
.evidence-chain-step small { margin-top: .35rem; color: var(--arawn-color-copy); font-size: .72rem; line-height: 1.5; }

.evidence-chain-truth {
    display: flex;
    align-items: flex-start;
    gap: .7rem;
    margin: 1rem 0 0;
    color: var(--arawn-color-copy);
    font-size: .76rem;
    line-height: 1.55;
}
.evidence-chain-truth > span {
    display: grid;
    width: 1.6rem;
    height: 1.6rem;
    flex: 0 0 1.6rem;
    place-items: center;
    border: 1px solid var(--arawn-line);
    border-radius: 50%;
    color: var(--arawn-color-measurement);
    font-weight: 900;
}

.product-tools-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 2rem;
}

.product-tool-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 1.25rem;
    border: 1px solid var(--arawn-line);
    border-radius: var(--arawn-radius-card);
    background: var(--arawn-surface);
}
.product-tool-card > small { margin-top: 1rem; color: var(--arawn-color-measurement); font-size: .65rem; font-weight: 900; letter-spacing: .07em; }
.product-tool-card h3 { margin: .5rem 0; color: var(--arawn-color-evidence); }
.product-tool-card p { flex: 1; color: var(--arawn-color-copy); line-height: 1.65; }
.product-tool-card > div { display: flex; flex-wrap: wrap; gap: .4rem; margin: .7rem 0; }
.product-tool-card > div span { padding: .35rem .5rem; border-radius: 999px; background: var(--arawn-surface-soft); color: var(--arawn-color-copy); font-size: .65rem; font-weight: 750; }
.product-tool-card > a { min-height: 44px; color: var(--arawn-color-measurement); font-size: .78rem; font-weight: 850; text-decoration: none; }

@media (max-width: 980px) {
    .evidence-chain,
    .product-tools-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .evidence-chain::before { display: none; }
}

@media (max-width: 600px) {
    .hero-evidence-callouts,
    .evidence-chain,
    .product-tools-grid { grid-template-columns: 1fr; }
    .hero-product-evidence { padding: .6rem; }
}

[dir="rtl"] .hero-evidence-callouts,
[dir="rtl"] .evidence-chain-step,
[dir="rtl"] .product-tool-card { text-align: start; }

/* Audit-driven navigation, contrast and touch-target corrections. */
.command-trigger,
.command-trigger span,
.command-trigger kbd,
.system-health {
    color: var(--ag-muted);
}

.command-trigger kbd {
    font-size: 10px;
}

.sidebar-user-card .user-role {
    color: var(--ag-muted);
}

.marketing-footer a:not(.marketing-logo),
.auth-page-v5 .auth-inline-actions a,
.auth-page-v5 .auth-card-footer a,
.dashboard-v3 .setup-continue,
.dashboard-v3 .chart-empty a,
.dashboard-v3 .panel-link,
.resource-card > a,
.text-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}

.comparison-scroll-hint {
    display: none;
    align-items: center;
    gap: 8px;
    margin: 12px 2px 0;
    color: #cbd9ed;
    font-size: 12px;
    font-weight: 700;
}

.comparison-scroll-hint span {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .09);
    color: #fff;
}

@media (max-width: 1120px) {
    .marketing-nav {
        position: relative;
        justify-content: flex-start;
    }

    .marketing-nav-links {
        position: absolute;
        z-index: 120;
        inset-block-start: calc(100% + 10px);
        inset-inline: 0;
        display: none;
        max-height: calc(100dvh - 102px);
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        padding: 16px;
        overflow-y: auto;
        border: 1px solid var(--ag-line);
        border-radius: 18px;
        background: color-mix(in srgb, var(--ag-surface) 97%, transparent);
        box-shadow: var(--ag-shadow-lg);
        backdrop-filter: blur(24px) saturate(1.2);
    }

    .marketing-nav-links.is-open {
        display: flex;
    }

    .marketing-nav-links a {
        width: 100%;
        min-height: 46px;
        padding-inline: 13px;
        font-size: 14px;
    }

    .mobile-nav-toggle {
        display: grid;
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        place-content: center;
        gap: 5px;
        padding: 10px;
        border: 1px solid var(--ag-line);
        border-radius: 12px;
        background: var(--ag-surface);
    }

    .mobile-nav-toggle span {
        width: 20px;
        height: 2px;
        border-radius: 2px;
        background: var(--ag-ink);
    }

    .marketing-nav-actions {
        margin-inline-start: auto;
    }

    .marketing-nav-actions .public-locale-form {
        display: none;
    }
}

@media (max-width: 680px) {
    .comparison-scroll-hint {
        display: flex;
    }

    .comparison-table {
        scrollbar-width: thin;
        scrollbar-color: rgba(255, 255, 255, .38) rgba(255, 255, 255, .08);
    }
}

@media (max-width: 340px) {
    .marketing-nav-cta {
        width: 44px;
        min-width: 44px;
        position: relative;
        padding: 0;
        overflow: hidden;
        color: transparent;
        font-size: 12px;
    }

    .marketing-nav-cta::after {
        position: absolute;
        inset: 0;
        display: grid;
        place-items: center;
        color: #fff;
        content: "→";
        font-size: 18px;
    }
}

/* Live 320–1440 audit hardening: content remains readable while motion initializes. */
.reveal-ready [data-reveal] {
    opacity: .985;
    transform: translateY(6px);
}

.reveal-ready [data-reveal].is-visible {
    opacity: 1;
    transform: translateY(0);
}

.marketing-page .theme-toggle,
.tour-tabs button,
.cta-actions > a,
.marketing-footer .footer-start-link {
    min-height: 44px !important;
}

.cta-actions > a,
.marketing-footer .footer-start-link {
    display: inline-flex;
    align-items: center;
    padding-block: 10px;
}

.resource-card > a {
    font-size: 12px !important;
}

.app-sidebar .sidebar-close,
.app-topbar .app-menu-toggle,
.app-topbar .command-trigger,
.sidebar-user-card .logout-btn {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
}

.app-topbar .app-theme-toggle,
.app-sidebar .sidebar-site-link,
.app-content-inner .btn {
    min-height: 44px !important;
}

.app-sidebar .sidebar-site-link {
    font-size: 11px !important;
}

.dashboard-v3 .setup-step,
.dashboard-v3 .setup-continue,
.dashboard-v3 .panel-link,
.dashboard-v3 .chart-empty a {
    font-size: 12px !important;
}

.studio-shell .studio-form-grid :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
.studio-shell .studio-mini-form :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
.studio-shell :is(button, .btn) {
    min-height: 44px !important;
    font-size: 12px !important;
}

.process-card > a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    padding-inline: 2px;
}

.dashboard-v3 .page-hero-actions .btn {
    min-height: 44px !important;
    font-size: 12px !important;
}

.marketing-logo,
.marketing-nav-links a,
.marketing-footer a:not(.marketing-logo) {
    min-width: 44px;
}

.marketing-login-link,
.public-locale-form select,
.topbar-locale-form select,
.auth-page-v5 .terms-check {
    min-height: 44px !important;
}

.cta-actions > a {
    min-width: 44px;
}

.legal-breadcrumb a,
.legal-summary-card a,
.resource-breadcrumb a,
.resource-summary a {
    display: inline-flex;
    min-height: 44px !important;
    align-items: center;
}

.legal-toc a,
.resource-toc a {
    min-height: 44px !important;
    align-items: center;
}

.legal-toc a,
.resource-summary a,
.resource-toc a,
.app-content-inner .btn {
    font-size: 12px !important;
}

/*
 * Arawn Guard usability layer v8
 * Dashboard density, navigation clarity and responsive overflow corrections.
 */
:root {
    --app-sidebar: 256px;
}

.app-sidebar .sidebar-nav {
    min-height: 0;
    padding: 12px 11px 16px;
}

.sidebar-group + .sidebar-group {
    margin-top: 11px;
}

.sidebar-group-label {
    padding: 0 10px 5px;
    font-size: 10px;
    line-height: 1.35;
}

.app-sidebar .sidebar-nav a {
    min-height: 44px;
    gap: 10px;
    margin-block: 1px;
    padding: 8px 10px;
}

.sidebar-assistance {
    display: grid;
    gap: 2px;
    padding: 10px 11px;
    border-top: 1px solid var(--ag-line);
    background: color-mix(in srgb, var(--ag-blue) 2%, var(--ag-surface));
}

.sidebar-assistance .sidebar-site-link {
    min-height: 40px !important;
    padding: 7px 9px;
    overflow-wrap: anywhere;
}

.sidebar-assistance span.sidebar-site-link {
    align-items: flex-start;
    color: var(--ag-muted);
    font-size: 10px !important;
    line-height: 1.4;
}

.app-topbar {
    gap: 18px;
    padding-inline: clamp(18px, 2.2vw, 30px);
}

.app-topbar-start {
    min-width: 0;
    flex: 1 1 auto;
}

.app-topbar-actions {
    min-width: 0;
    flex: 0 1 auto;
    justify-content: flex-end;
}

.app-breadcrumb {
    min-width: 0;
}

.app-breadcrumb strong {
    max-width: min(36vw, 360px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-topbar .command-trigger {
    width: auto !important;
    min-width: 220px !important;
    max-width: 280px;
    flex: 0 1 260px;
    justify-content: flex-start;
    padding-inline: 13px 9px;
    overflow: hidden;
    white-space: nowrap;
}

.app-topbar .command-trigger > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-topbar .command-trigger kbd {
    flex: 0 0 auto;
}

.app-content-inner {
    padding: 28px clamp(20px, 2.4vw, 36px) 56px;
}

.app-content-inner > .page-header,
.app-page-hero {
    min-width: 0;
}

.app-content-inner > .page-header > *,
.app-page-hero > * {
    min-width: 0;
}

.app-content-inner > .page-header p,
.app-content-inner > .page-header .subtitle,
.app-page-hero p {
    max-width: 72ch;
    font-size: 14px;
    line-height: 1.65;
}

.app-content-inner .card p,
.app-content-inner .integration-card p {
    font-size: 13px;
}

.app-content-inner :where(.card, .integration-card, .dashboard-card, .chart-card, .form-card, .app-panel) {
    min-width: 0;
}

.app-content-inner :where(.card, .integration-card, .dashboard-card, .chart-card, .form-card, .app-panel) :where(h1, h2, h3, p, strong, small, span) {
    overflow-wrap: anywhere;
}

.app-content-inner .filters-bar {
    flex-wrap: wrap;
}

.app-content-inner .filter-group {
    min-width: min(190px, 100%);
    flex: 1 1 190px;
}

.button-row,
.page-hero-actions {
    flex-wrap: wrap;
}

.dashboard-v3 {
    gap: 24px;
}

.dashboard-v3 .app-page-hero {
    align-items: center;
    margin: 0;
    padding: clamp(22px, 2.4vw, 32px);
    overflow: hidden;
}

.dashboard-v3 .app-page-hero h1 {
    max-width: 18ch;
    font-size: clamp(32px, 3.15vw, 46px);
    line-height: 1.02;
}

.dashboard-v3 .page-eyebrow {
    font-size: 11px;
}

.setup-console {
    padding: clamp(22px, 2.4vw, 30px);
    border-radius: 22px;
}

.setup-console-head {
    gap: 28px;
}

.setup-kicker {
    margin-bottom: 9px;
    font-size: 10px;
    line-height: 1.35;
}

.setup-console h2 {
    font-size: clamp(22px, 2vw, 29px);
    line-height: 1.15;
}

.setup-console-head p {
    max-width: 72ch;
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.6;
}

.setup-progress {
    width: 104px;
    height: 104px;
    flex: 0 0 104px;
}

.setup-progress::before {
    inset: 8px;
}

.setup-progress strong {
    font-size: 24px;
}

.setup-progress span {
    max-width: 72px;
    margin-top: 3px;
    font-size: 9px;
    line-height: 1.25;
}

.setup-step-grid {
    gap: 12px;
    margin-top: 22px;
}

.setup-step {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    min-height: 120px;
    padding: 15px 14px 30px;
    border-radius: 15px;
}

.setup-step-number {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    font-size: 11px;
}

.setup-step strong {
    font-size: 13px;
    line-height: 1.35;
}

.setup-step small {
    margin-top: 5px;
    font-size: 11px;
    line-height: 1.5;
}

.setup-step em {
    right: 13px;
    bottom: 10px;
    font-size: 9px;
}

.setup-continue {
    margin-top: 17px;
    font-size: 13px !important;
}

.app-metric-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.app-metric-card {
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 14px;
    min-height: 142px;
    padding: 20px;
    border-radius: 18px;
}

.app-metric-card::before {
    position: absolute;
    top: 0;
    right: 20px;
    left: 20px;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, transparent, var(--metric-color), transparent);
    opacity: .55;
    content: "";
}

.metric-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
}

.metric-icon svg {
    width: 22px;
    height: 22px;
}

.app-metric-card div > span {
    font-size: 11px;
    line-height: 1.35;
}

.app-metric-card div > strong {
    margin: 7px 0 5px;
    font-size: 30px;
}

.app-metric-card div > small {
    max-width: 22ch;
    font-size: 10px;
    line-height: 1.35;
}

.metric-spark {
    right: -42px;
    bottom: -44px;
    width: 76px;
    height: 76px;
    opacity: .5;
    box-shadow: 0 0 0 16px color-mix(in srgb, var(--metric-color) 3%, transparent);
}

.dashboard-primary-grid,
.dashboard-secondary-grid {
    gap: 16px;
}

.app-panel {
    padding: clamp(20px, 2vw, 26px);
    border-radius: 19px;
}

.app-panel-head {
    gap: 18px;
    margin-bottom: 20px;
}

.app-panel-head h2 {
    font-size: 18px;
    line-height: 1.25;
}

.app-panel-head p {
    margin-top: 5px;
    font-size: 12px;
    line-height: 1.55;
}

.panel-period {
    flex: 0 0 auto;
    padding: 7px 10px;
    font-size: 10px;
}

.app-chart-legend {
    flex-wrap: wrap;
    row-gap: 8px;
    font-size: 11px;
}

.chart-empty strong {
    max-width: 40ch;
    font-size: 14px;
    line-height: 1.45;
}

.chart-empty a {
    font-size: 12px;
}

.platform-health-list {
    gap: 11px;
}

.platform-health-card {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
}

.health-platform-logo {
    width: 44px;
    height: 44px;
    font-size: 13px;
}

.platform-health-card div strong {
    font-size: 14px;
}

.platform-health-card div small {
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.45;
}

.health-state {
    padding: 5px 8px;
    font-size: 10px;
}

.platform-honesty {
    gap: 10px;
    margin-top: 14px;
    padding: 13px;
}

.platform-honesty > span {
    flex-basis: 24px;
    width: 24px;
    height: 24px;
    font-size: 11px;
}

.platform-honesty p {
    font-size: 11px;
    line-height: 1.55;
}

.panel-link {
    font-size: 12px;
}

.review-queue-badge {
    padding: 7px 10px;
    font-size: 10px;
    line-height: 1.35;
}

.review-queue-badge strong {
    font-size: 16px;
}

.app-empty-state {
    min-height: 240px;
    padding: 28px;
}

.app-empty-state h3 {
    font-size: 16px;
}

.app-empty-state p {
    margin-top: 7px;
    font-size: 12px;
    line-height: 1.6;
}

.score-pill,
.status-pill,
.event-pill {
    font-size: 11px;
}

@media (max-width: 1380px) {
    .app-topbar .command-trigger {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px;
        flex-basis: 44px;
        justify-content: center;
        padding: 0;
    }

    .app-topbar .command-trigger > span,
    .app-topbar .command-trigger > kbd,
    .system-health {
        display: none;
    }
}

@media (max-width: 1280px) {
    :root {
        --app-sidebar: 244px;
    }

    .app-content-inner {
        padding-inline: 24px;
    }

    .setup-step-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .app-metric-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1120px) {
    :root {
        --app-sidebar: 232px;
    }

    .topbar-avatar {
        display: none;
    }

    .dashboard-primary-grid {
        grid-template-columns: 1fr;
    }

    .app-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    :root {
        --app-sidebar: 280px;
    }

    .app-content-inner {
        padding-inline: 16px;
    }

    .sidebar-assistance {
        padding-bottom: 12px;
    }
}

@media (max-width: 700px) {
    .dashboard-v3 {
        gap: 16px;
    }

    .dashboard-v3 .app-page-hero {
        padding: 22px 18px;
    }

    .dashboard-v3 .app-page-hero h1 {
        font-size: clamp(30px, 10vw, 40px);
    }

    .setup-console {
        padding: 20px 16px;
    }

    .setup-console-head {
        gap: 18px;
    }

    .setup-progress {
        width: 88px;
        height: 88px;
        flex-basis: 88px;
    }

    .setup-step-grid,
    .app-metric-grid {
        grid-template-columns: 1fr;
    }

    .setup-step {
        min-height: 112px;
    }

    .app-metric-card {
        min-height: 124px;
    }

    .dashboard-secondary-grid {
        grid-template-columns: 1fr;
    }

    .app-panel-head {
        gap: 10px;
    }
}

@media (max-width: 520px) {
    .topbar-locale-form {
        display: none;
    }

    .app-breadcrumb strong {
        max-width: 30vw;
    }

    .page-hero-actions {
        grid-template-columns: 1fr;
    }

    .setup-step {
        grid-template-columns: 38px minmax(0, 1fr);
        padding-inline: 12px;
    }
}
/* v8 readable data, compact mobile forms and Campaign Studio disclosure. */
.app-content-inner .data-table th,
.app-content-inner table th {
    font-size: 12px !important;
    line-height: 1.45;
}

.app-content-inner .data-table td,
.app-content-inner table td {
    font-size: 12px !important;
    line-height: 1.55;
}

.app-content-inner .table-responsive {
    position: relative;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
}

.app-content-inner .table-responsive:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ag-blue) 34%, transparent);
    outline-offset: 3px;
}

.app-content-inner :is(.stat-label, .budget-label, .budget-detail, .detail-item, .mini-stat-label, .type-badge) {
    font-size: 11px !important;
    line-height: 1.5;
}

.app-content-inner :is(.ops-health, .ops-status-grid span, .ops-user-list small, .ops-user-list em, .admin-plan-card > small, .plan-order, .plan-recommended) {
    font-size: 10px !important;
    line-height: 1.45;
}

.app-content-inner :is(.ops-user-list strong, .admin-plan-card p, .admin-plan-card ul) {
    font-size: 12px !important;
    line-height: 1.55;
}

.app-content-inner .studio-shell :is(p, label, small, li, .studio-helper) {
    font-size: 12px !important;
    line-height: 1.55;
}

.app-content-inner .studio-shell strong {
    font-size: max(12px, .75rem);
    line-height: 1.4;
}

.app-content-inner .studio-shell :is(
    .plan-platform,
    .studio-status,
    .plan-platform-row span,
    .review-copy > span,
    .review-evidence span,
    .experiment-platform,
    .experiment-grid > article > div
) {
    font-size: 10px !important;
    line-height: 1.4;
}

.app-content-inner .studio-shell :is(.studio-workflow strong, .plan-meta strong, .plan-platform-row strong, .monitor-state-list strong, .review-copy > strong) {
    font-size: 13px !important;
}

.app-content-inner .studio-shell :is(.studio-plan-card summary, .studio-plan-card ul) {
    font-size: 12px !important;
}

.app-content-inner .studio-shell .review-actions .btn {
    min-height: 44px !important;
    font-size: 12px !important;
}

.studio-disclosure {
    display: contents;
}

.studio-disclosure > summary {
    display: none;
}

@media (max-width: 680px) {
    .studio-disclosure {
        display: block;
        min-width: 0;
    }

    .studio-disclosure > summary {
        display: grid;
        min-height: 64px;
        grid-template-columns: auto minmax(0, 1fr) 34px;
        align-items: center;
        gap: 12px;
        padding: 13px 14px;
        border: 1px solid var(--ag-line);
        border-radius: 16px;
        background: var(--ag-surface);
        box-shadow: var(--ag-shadow-sm);
        color: var(--ag-ink);
        cursor: pointer;
        list-style: none;
    }

    .studio-disclosure > summary::-webkit-details-marker {
        display: none;
    }

    .studio-disclosure > summary > span {
        display: grid;
        min-width: 38px;
        height: 38px;
        place-items: center;
        padding-inline: 6px;
        border-radius: 11px;
        background: var(--ag-surface-soft);
        color: var(--ag-blue);
        font-size: 10px;
        font-weight: 850;
    }

    .studio-disclosure > summary > strong {
        font-size: 14px;
        line-height: 1.35;
    }

    .studio-disclosure > summary > i {
        position: relative;
        display: grid;
        width: 34px;
        height: 34px;
        place-items: center;
        border: 1px solid var(--ag-line);
        border-radius: 10px;
        background: var(--ag-canvas);
    }

    .studio-disclosure > summary > i::before,
    .studio-disclosure > summary > i::after {
        position: absolute;
        width: 12px;
        height: 2px;
        border-radius: 999px;
        background: var(--ag-blue);
        content: "";
        transition: transform .18s ease;
    }

    .studio-disclosure > summary > i::after {
        transform: rotate(90deg);
    }

    .studio-disclosure[open] > summary > i::after {
        transform: rotate(0);
    }

    .studio-disclosure[open] > :not(summary) {
        margin-top: 10px;
    }

    .studio-disclosure > section > .studio-section-heading:first-child {
        display: none;
    }

    .studio-workflow {
        display: flex;
        max-width: 100%;
        gap: 10px;
        padding-bottom: 8px;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: inline mandatory;
        scrollbar-width: thin;
    }

    .studio-workflow > article {
        min-width: min(278px, 82vw);
        scroll-snap-align: start;
    }
}

@media (max-width: 520px) {
    .app-content-inner .form-grid {
        grid-template-columns: 1fr;
    }

    .app-content-inner .form-actions {
        flex-wrap: wrap;
    }

    .app-content-inner .form-actions > * {
        min-width: min(100%, 180px);
        flex: 1 1 180px;
    }
}
/* Specificity-safe application typography floor. */
.app-content-inner p,
.app-content-inner li,
.app-content-inner label,
.app-content-inner td,
.app-content-inner th,
.app-content-inner .form-text,
.app-content-inner .table-subline {
    font-size: 12px;
    line-height: 1.55;
}

.app-content-inner small {
    font-size: 11px;
    line-height: 1.5;
}
/* Responsive data table affordance and content-sized table floors. */
.app-content-inner .data-table--visitors {
    min-width: 920px;
}

.app-content-inner .data-table--visitor-sessions {
    min-width: 760px;
}

.app-content-inner .data-table--visitor-events {
    min-width: 640px;
}

.app-content-inner .data-table--report-geo {
    min-width: 620px;
}

.app-content-inner .data-table--report-sources,
.app-content-inner .data-table--billing-requests {
    min-width: 520px;
}

.app-content-inner .data-table--billing-admin-requests {
    min-width: 760px;
}

.table-scroll-hint {
    display: none;
}

@media (max-width: 700px) {
    .table-scroll-hint {
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 8px 0 10px;
        color: var(--ag-muted);
        font-size: 11px !important;
        font-weight: 700;
        line-height: 1.45;
    }

    .table-scroll-hint::before {
        display: grid;
        width: 28px;
        height: 28px;
        flex: 0 0 28px;
        place-items: center;
        border: 1px solid var(--ag-line);
        border-radius: 9px;
        background: var(--ag-surface-soft);
        color: var(--ag-blue);
        content: "↔";
        font-size: 15px;
    }
}
.app-content-inner .app-page-hero p {
    font-size: 14px;
}

.dashboard-v3 .setup-console-head p {
    font-size: 13px;
}

/* v8 mobile locale access */
@media (max-width: 520px) {
    .app-topbar .topbar-locale-form {
        display: block;
        min-width: 48px;
        flex: 0 0 48px;
    }

    .app-topbar .topbar-locale-form select {
        width: 48px;
        min-width: 48px;
        min-height: 44px;
        padding-inline: 7px;
    }
}
/* v8 accessible table pagination */
.table-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--ag-line);
}

.table-pagination-summary {
    margin: 0;
    color: var(--ag-muted);
    font-size: 12px !important;
    font-weight: 700;
}

.table-pagination [aria-disabled="true"] {
    opacity: .48;
    pointer-events: none;
}

@media (max-width: 520px) {
    .table-pagination {
        align-items: stretch;
        flex-direction: column;
    }

    .table-pagination .form-actions,
    .table-pagination .btn {
        width: 100%;
    }
}
/* v8 RTL shell geometry and touch targets */
[dir="rtl"] .app-main {
    margin-right: var(--app-sidebar);
    margin-left: 0;
}

.sidebar-assistance a.sidebar-site-link {
    min-height: 44px !important;
}

@media (max-width: 900px) {
    [dir="rtl"] .app-main {
        margin-right: 0;
        margin-left: 0;
    }
}

/* v8 locale touch target */
.app-topbar .topbar-locale-form select {
    min-width: 44px;
    min-height: 44px;
}
/* v8 report data affordances */
.app-content-inner .data-table--report-daily {
    min-width: 680px;
}

.app-content-inner .data-table--report-risk {
    min-width: 760px;
}

.chart-data-details {
    margin-top: 14px;
    border-top: 1px solid var(--ag-line);
}

.chart-data-details summary {
    min-height: 44px;
    padding: 12px 0;
    color: var(--ag-blue);
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
}

.report-chart-legend {
    display: grid;
    gap: 9px;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}

.report-chart-legend li {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 30px;
    color: var(--ag-copy);
    font-size: 12px !important;
}

.report-chart-legend strong {
    color: var(--ag-ink);
    font-size: 12px;
}

.chart-legend-swatch {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--legend-color);
}

.chart-empty-note {
    color: var(--ag-muted);
    font-size: 12px !important;
}

.filter-check {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    min-height: 44px;
    padding-top: 9px;
    color: var(--ag-copy);
}

.filter-check input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: var(--ag-blue);
}

.filter-check span {
    display: grid;
    gap: 2px;
}

.filter-check strong {
    font-size: 12px;
    line-height: 1.35;
}

.filter-check small {
    color: var(--ag-muted);
    font-size: 11px;
    line-height: 1.35;
}

@media (max-width: 1120px) {
    .table-scroll-hint {
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 8px 0 10px;
        color: var(--ag-muted);
        font-size: 11px !important;
        font-weight: 700;
        line-height: 1.45;
    }

    .table-scroll-hint::before {
        display: grid;
        width: 28px;
        height: 28px;
        flex: 0 0 28px;
        place-items: center;
        border: 1px solid var(--ag-line);
        border-radius: 9px;
        background: var(--ag-surface-soft);
        color: var(--ag-blue);
        content: "↔";
        font-size: 15px;
    }
}
/* v9 readable setup status */
.app-content-inner .setup-progress span,
.app-content-inner .setup-step em {
    font-size: 11px !important;
    line-height: 1.45;
}
/* v9.1 locale visibility override: app-experience.css hides the form below 700px. */
.app-topbar .topbar-locale-form {
    display: block !important;
    min-width: 48px;
    flex: 0 0 48px;
}

.app-topbar .topbar-locale-form select {
    width: 48px;
    min-width: 44px;
    min-height: 44px;
}

/* v11 · regional AI insights */
.insights-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,42%);gap:28px;align-items:center;padding:28px;border:1px solid #dbe9ff;border-radius:28px;background:linear-gradient(120deg,#fff 0%,#f3f8ff 58%,#e8fbff 100%);box-shadow:0 18px 50px rgba(23,89,180,.10);overflow:hidden}.insights-hero h1{margin:.35rem 0 .65rem;font-size:clamp(2rem,4vw,3.5rem);letter-spacing:-.045em;color:#0f172a}.insights-hero p{max-width:650px;color:#466180}.insights-hero img{width:100%;height:auto;border-radius:20px;box-shadow:0 18px 40px rgba(18,95,210,.18)}.insights-provider{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:8px 12px;border-radius:999px;font-size:.78rem;font-weight:700;background:#fff;border:1px solid #d9e6f8;color:#476482}.insights-provider i{width:8px;height:8px;border-radius:50%;background:#f3a218}.insights-provider.is-live i{background:#13b981}.insights-layout{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:22px;margin-top:22px;align-items:start}.insights-form-card{position:sticky;top:18px}.insights-form fieldset{border:1px solid #dce7f5;border-radius:14px;padding:12px}.insights-form legend{padding:0 5px;font-size:.8rem;font-weight:700;color:#506987}.insights-channel-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.insights-results{display:grid;gap:18px}.insights-summary{display:flex;justify-content:space-between;gap:18px;align-items:center}.insights-summary h2{margin:.35rem 0}.insights-metrics{display:grid;grid-template-columns:auto auto;gap:2px 12px;align-items:center;min-width:150px}.insights-metrics strong{font-size:1.35rem;color:#1261da}.insights-metrics span{font-size:.72rem;color:#68809d}.insight-recommendation-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.insight-recommendation{padding:18px}.insight-rec-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.insight-recommendation h3{margin:14px 0 8px;font-size:1.02rem}.insight-recommendation p{color:#4a6482;line-height:1.65}.insight-recommendation small{color:#8a6a1c}.insight-channel{font-size:.78rem;color:#5d7592}.competitor-proof{border-color:#f0dfac;background:#fffaf0}.competitor-proof h2{margin-top:0}.insight-asset{margin:18px 0 0}.insight-asset img{display:block;width:100%;max-width:720px;border-radius:18px;border:1px solid #dbe8f8}.insight-asset figcaption{margin-top:7px;color:#7a8fa8;font-size:.8rem}.badge-high{background:#eaf2ff;color:#185dd1}.badge-medium{background:#eef7f3;color:#127b58}.badge-low{background:#f4f5f7;color:#68758a}.badge-warning{background:#fff1cc;color:#936510}@media (max-width:900px){.insights-hero{grid-template-columns:1fr}.insights-layout{grid-template-columns:1fr}.insights-form-card{position:static}.insight-recommendation-grid{grid-template-columns:1fr}}@media (max-width:560px){.insights-hero{padding:20px;border-radius:20px}.insights-summary{display:block}.insights-metrics{margin-top:18px}.insights-channel-grid{grid-template-columns:1fr}.insights-hero img{border-radius:14px}}
/* v12 · growth command center */
.growth-hero{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;align-items:center;padding:30px;border:1px solid #dbe9ff;border-radius:28px;background:linear-gradient(120deg,#fff,#f2f7ff 62%,#e8fbff);box-shadow:0 18px 50px rgba(23,89,180,.10)}.growth-hero h1{margin:.35rem 0 .65rem;font-size:clamp(2rem,4vw,3.5rem);letter-spacing:-.045em;color:#0f172a}.growth-hero p{max-width:680px;color:#466180}.growth-hero-orbit{height:260px;position:relative;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,#fff 0 18%,#e7f1ff 19% 21%,transparent 22%),conic-gradient(from 30deg,#2a8bff,#42d7e8,#dcecff,#2a8bff);box-shadow:inset 0 0 0 12px rgba(255,255,255,.72),0 22px 50px rgba(25,99,214,.18)}.growth-hero-orbit strong{display:grid;place-items:center;width:86px;height:86px;border-radius:26px;background:#1261da;color:#fff;font-size:3rem;box-shadow:0 10px 25px rgba(18,97,218,.3)}.growth-hero-orbit span{position:absolute;padding:6px 10px;border:1px solid #cfe1fa;border-radius:999px;background:#fff;color:#2b5d97;font-size:.72rem;font-weight:800}.growth-hero-orbit span:nth-child(1){top:18px}.growth-hero-orbit span:nth-child(2){right:8px;top:94px}.growth-hero-orbit span:nth-child(3){bottom:22px;left:20px}.growth-hero-orbit span:nth-child(4){left:8px;top:88px}.growth-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}.growth-card .card-header{min-height:96px}.growth-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}.growth-result-list{display:grid;gap:12px}.growth-result-list article{padding:14px;border:1px solid #e3ebf5;border-radius:14px}.growth-result-list article strong,.growth-result-list article small{display:block}.growth-result-list article small{margin-top:4px;color:#7187a0}.growth-result-list article p{color:#536d8b;line-height:1.5}.growth-result-list ul{padding-left:18px;color:#536d8b}.score-ring{float:right;display:grid;place-items:center;width:50px;height:50px;border:5px solid #2b82f6;border-radius:50%;color:#155dc9;font-weight:800}.badge-high{background:#eaf2ff;color:#185dd1}.badge-medium{background:#eef7f3;color:#127b58}.badge-low{background:#f4f5f7;color:#68758a}@media (max-width:1050px){.growth-grid,.growth-results{grid-template-columns:1fr 1fr}.growth-hero{grid-template-columns:1fr 280px}}@media (max-width:680px){.growth-grid,.growth-results{grid-template-columns:1fr}.growth-hero{grid-template-columns:1fr;padding:22px}.growth-hero-orbit{max-width:260px;margin:auto}}

/* v13 · growth action queue */
.growth-actions{grid-column:1/-1;margin-top:1.25rem}.growth-actions .card-header{align-items:flex-start}.growth-action-list{display:grid;gap:.7rem}.growth-action{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;border:1px solid var(--line,#dce5f2);border-radius:1rem;background:rgba(255,255,255,.72);transition:transform .2s ease,box-shadow .2s ease}.growth-action:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(35,86,160,.1)}.growth-action.is-completed{opacity:.7;background:#f4fbf7}.growth-action-main{display:grid;gap:.22rem;min-width:0}.growth-action-main strong{font-size:.95rem;color:var(--ink,#10244a)}.growth-action-main small{color:var(--muted,#6a7892);font-size:.78rem}.action-state{font-size:.78rem;color:var(--muted,#6a7892);white-space:nowrap}.action-state.is-done{color:#15845d;font-weight:700}.btn-small{padding:.55rem .75rem;font-size:.78rem;white-space:nowrap}.badge-neutral{background:#eef4fb;color:#49617f}@media(max-width:700px){.growth-action{align-items:flex-start;flex-direction:column}.growth-action form,.growth-action .btn{width:100%}.growth-action .btn{text-align:center}}
/* v14 · public Growth promotion */
.growth-promo-section{background:linear-gradient(180deg,rgba(238,246,255,.5),rgba(255,255,255,0))}.growth-promo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}.growth-promo-card{position:relative;display:flex;flex-direction:column;min-height:260px;padding:24px;border:1px solid var(--ag-line,#dce8f7);border-radius:22px;background:color-mix(in srgb,var(--ag-surface,#fff) 94%,transparent);box-shadow:var(--ag-shadow-sm,0 8px 24px rgba(14,57,113,.08));overflow:hidden;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.growth-promo-card::after{position:absolute;right:-34px;bottom:-44px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(32,188,210,.16),transparent 68%);content:""}.growth-promo-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--ag-blue,#2563eb) 30%,var(--ag-line,#dce8f7));box-shadow:var(--ag-shadow-md,0 18px 48px rgba(14,57,113,.12))}.growth-promo-icon{display:grid;width:48px;height:48px;place-items:center;margin-bottom:18px;border-radius:15px;background:linear-gradient(135deg,#e6f0ff,#dffbff);color:var(--ag-blue-deep,#1d4ed8);font-size:26px;font-weight:800}.growth-promo-kicker{color:var(--ag-blue,#2563eb);font-size:11px;font-weight:800;letter-spacing:.1em}.growth-promo-card h3{margin:8px 0 10px;color:var(--ag-ink,#0f172a);font-size:1.24rem;letter-spacing:-.025em}.growth-promo-card p{position:relative;z-index:1;margin:0;color:var(--ag-copy,#38516f);line-height:1.65}.growth-promo-note{position:relative;z-index:1;display:flex;align-items:center;gap:7px;margin-top:auto;padding-top:18px;color:var(--ag-muted,#526b88);font-size:11px;font-weight:700}.growth-promo-note i{width:7px;height:7px;border-radius:50%;background:#f3a218}.growth-promo-cta{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:20px;padding:18px 22px;border:1px solid #cfe1fa;border-radius:18px;background:linear-gradient(110deg,#f6faff,#edfcff)}.growth-promo-cta>div{display:grid;gap:4px}.growth-promo-cta strong{color:var(--ag-ink,#0f172a);font-size:1rem}.growth-promo-cta span{color:var(--ag-copy,#38516f);font-size:.85rem}@media(max-width:850px){.growth-promo-grid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.growth-promo-grid{grid-template-columns:1fr}.growth-promo-card{min-height:0}.growth-promo-cta{align-items:stretch;flex-direction:column}.growth-promo-cta .btn{width:100%;text-align:center}}
/* v20.1 · site creation experience and legacy theme collision repair */
.site-setup-page {
    width: min(100%, 1280px);
    margin: 0 auto;
    color: var(--app-ink);
}

.site-setup-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, .78fr);
    gap: 32px;
    align-items: end;
    margin-bottom: 22px;
    padding: clamp(24px, 3vw, 36px);
    border: 1px solid color-mix(in srgb, var(--app-blue) 20%, var(--app-line));
    border-radius: 24px;
    background:
        radial-gradient(circle at 92% -15%, rgba(10, 166, 181, .17), transparent 35%),
        radial-gradient(circle at 5% 110%, rgba(35, 103, 232, .12), transparent 35%),
        linear-gradient(120deg, var(--app-surface) 0%, var(--app-surface-soft) 64%, var(--app-surface-blue) 100%);
    box-shadow: var(--app-shadow-sm);
    overflow: hidden;
}

.site-setup-hero::after {
    position: absolute;
    z-index: 0;
    top: -68px;
    right: -54px;
    width: 190px;
    height: 190px;
    border: 1px solid rgba(35, 103, 232, .13);
    border-radius: 50%;
    box-shadow: 0 0 0 22px rgba(35, 103, 232, .04), 0 0 0 45px rgba(10, 166, 181, .025);
    content: "";
    pointer-events: none;
}

.site-setup-hero-copy,
.site-setup-progress {
    position: relative;
    z-index: 1;
}

.site-setup-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    color: var(--app-blue);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .14em;
}

.site-setup-eyebrow::before {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--app-blue), var(--app-cyan));
    box-shadow: 0 0 0 5px rgba(35, 103, 232, .09);
    content: "";
}

.app-content-inner .site-setup-hero h1 {
    margin: 0;
    background: none !important;
    color: var(--app-ink) !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: clamp(30px, 3.4vw, 48px);
    font-weight: 850;
    letter-spacing: -.052em;
    line-height: 1.04;
}

.app-content-inner .site-setup-hero-copy > p {
    max-width: 700px;
    margin: 13px 0 0;
    color: var(--app-copy);
    font-size: 14px;
    line-height: 1.7;
}

.site-setup-progress {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-setup-progress li {
    display: grid;
    min-width: 0;
    gap: 8px;
    align-content: center;
    min-height: 82px;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-radius: 15px;
    background: color-mix(in srgb, var(--app-surface) 87%, transparent);
    color: var(--app-muted);
    font-size: 11px;
    font-weight: 760;
    line-height: 1.35;
    text-align: center;
    backdrop-filter: blur(12px);
}

.site-setup-progress li span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    justify-self: center;
    border: 1px solid var(--app-line-strong);
    border-radius: 10px;
    background: var(--app-surface-soft);
    color: var(--app-copy);
    font-size: 11px;
}

.site-setup-progress li.is-active {
    border-color: color-mix(in srgb, var(--app-blue) 34%, var(--app-line));
    background: var(--app-surface);
    color: var(--app-blue-deep);
    box-shadow: var(--app-shadow-xs);
}

.site-setup-progress li.is-active span {
    border-color: transparent;
    background: linear-gradient(135deg, var(--app-blue-deep), var(--app-blue));
    color: #fff;
    box-shadow: 0 7px 16px rgba(35, 103, 232, .24);
}

.site-setup-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 22px;
    align-items: start;
}

.app-content-inner .site-setup-form.form-card {
    min-width: 0;
    margin: 0;
    padding: clamp(22px, 3vw, 32px);
    border-color: var(--app-line);
    border-radius: 22px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
}

.site-setup-section-heading {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 28px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--app-line);
}

.site-setup-section-icon {
    display: grid;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--app-blue) 16%, var(--app-line));
    border-radius: 14px;
    background: linear-gradient(135deg, var(--app-surface-blue), color-mix(in srgb, var(--app-cyan) 11%, var(--app-surface)));
    color: var(--app-blue);
}

.app-content-inner .site-setup-section-heading h2 {
    margin: 1px 0 5px;
    color: var(--app-ink);
    font-size: 20px;
    font-weight: 820;
    letter-spacing: -.025em;
}

.app-content-inner .site-setup-section-heading p {
    margin: 0;
    color: var(--app-copy);
    font-size: 12px;
    line-height: 1.6;
}

.site-setup-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 18px;
}

.site-setup-form .form-group {
    display: grid;
    min-width: 0;
    gap: 8px;
    margin: 0;
}

.site-setup-field-full {
    grid-column: 1 / -1;
}

.app-content-inner .site-setup-page .site-setup-form .form-group label {
    color: var(--app-ink);
    font-size: 12px;
    font-weight: 790;
    letter-spacing: .005em;
    text-transform: none;
}

.site-setup-form .form-group label span {
    color: var(--app-coral);
}

.site-setup-form .form-group > small {
    color: var(--app-copy);
    font-size: 11px;
    line-height: 1.5;
}

.app-content-inner .site-setup-page .site-setup-form .form-group input:not([type="checkbox"]):not([type="radio"]),
.app-content-inner .site-setup-page .site-setup-form .form-group select,
.app-content-inner .site-setup-page .site-setup-form .form-group textarea {
    width: 100%;
    min-width: 0;
    min-height: 52px;
    padding: 13px 15px;
    border: 1px solid var(--app-line-strong);
    border-radius: 12px;
    background: var(--app-surface) !important;
    color: var(--app-ink) !important;
    -webkit-text-fill-color: var(--app-ink) !important;
    box-shadow: 0 1px 2px rgba(24, 54, 96, .025);
    font: inherit;
    font-size: 15px;
    line-height: 1.35;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.app-content-inner .site-setup-page .site-setup-form .form-group input::placeholder {
    color: var(--app-muted);
    -webkit-text-fill-color: var(--app-muted);
    opacity: 1;
}

.app-content-inner .site-setup-page .site-setup-form .form-group input:hover,
.app-content-inner .site-setup-page .site-setup-form .form-group select:hover {
    border-color: color-mix(in srgb, var(--app-blue) 34%, var(--app-line-strong));
}

.app-content-inner .site-setup-page .site-setup-form .form-group input:focus,
.app-content-inner .site-setup-page .site-setup-form .form-group select:focus,
.app-content-inner .site-setup-page .site-setup-form .form-group textarea:focus {
    border-color: var(--app-blue);
    background: var(--app-surface) !important;
    outline: 0;
    box-shadow: 0 0 0 4px rgba(35, 103, 232, .12);
}

.site-setup-input-prefix,
.site-setup-input-suffix {
    display: flex;
    min-width: 0;
    min-height: 52px;
    align-items: center;
    border: 1px solid var(--app-line-strong);
    border-radius: 12px;
    background: var(--app-surface);
    box-shadow: 0 1px 2px rgba(24, 54, 96, .025);
    overflow: hidden;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.site-setup-input-prefix > span,
.site-setup-input-suffix > span {
    display: flex;
    min-height: 50px;
    align-items: center;
    padding: 0 13px;
    border-inline-end: 1px solid var(--app-line);
    background: var(--app-surface-soft);
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 720;
    white-space: nowrap;
}

.site-setup-input-suffix > span {
    border-inline: 1px solid var(--app-line) 0;
}

.site-setup-input-prefix-compact > span {
    min-width: 46px;
    justify-content: center;
    color: var(--app-blue);
    font-size: 15px;
}

.app-content-inner .site-setup-page .site-setup-form .site-setup-input-prefix input,
.app-content-inner .site-setup-page .site-setup-form .site-setup-input-suffix input {
    min-height: 50px;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
}

.site-setup-input-prefix:focus-within,
.site-setup-input-suffix:focus-within {
    border-color: var(--app-blue);
    box-shadow: 0 0 0 4px rgba(35, 103, 232, .12);
}

.site-setup-truth {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    padding: 16px;
    border: 1px solid color-mix(in srgb, var(--app-blue) 20%, var(--app-line));
    border-radius: 14px;
    background: var(--app-surface-blue);
}

.site-setup-truth > span {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    border-radius: 11px;
    background: var(--app-surface);
    color: var(--app-blue);
    box-shadow: var(--app-shadow-xs);
}

.site-setup-truth strong {
    display: block;
    margin: 1px 0 4px;
    color: var(--app-ink);
    font-size: 12px;
}

.app-content-inner .site-setup-truth p {
    margin: 0;
    color: var(--app-copy);
    font-size: 11px;
    line-height: 1.65;
}

.app-content-inner .site-setup-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid var(--app-line);
}

.app-content-inner .site-setup-actions .btn {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 11px 18px;
    font-size: 12px;
}

.site-setup-aside {
    display: grid;
    min-width: 0;
    gap: 16px;
}

.site-setup-guide-card {
    position: relative;
    padding: 26px;
    border: 1px solid rgba(122, 177, 255, .25);
    border-radius: 22px;
    background:
        radial-gradient(circle at 110% -10%, rgba(31, 200, 220, .24), transparent 36%),
        linear-gradient(145deg, #123366 0%, #0b2854 52%, #092143 100%);
    color: #fff;
    box-shadow: 0 20px 46px rgba(15, 48, 101, .2);
    overflow: hidden;
}

.site-setup-guide-card::after {
    position: absolute;
    right: -42px;
    bottom: -60px;
    width: 170px;
    height: 170px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 50%;
    box-shadow: 0 0 0 22px rgba(255, 255, 255, .03), 0 0 0 45px rgba(255, 255, 255, .018);
    content: "";
    pointer-events: none;
}

.site-setup-guide-badge {
    display: inline-flex;
    padding: 7px 10px;
    border: 1px solid rgba(122, 194, 255, .24);
    border-radius: 999px;
    background: rgba(58, 141, 255, .13);
    color: #8ec6ff;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .12em;
}

.app-content-inner .site-setup-guide-card h2 {
    position: relative;
    z-index: 1;
    margin: 17px 0 9px;
    color: #fff;
    font-size: 22px;
    font-weight: 820;
    letter-spacing: -.035em;
    line-height: 1.18;
}

.app-content-inner .site-setup-guide-card > p {
    position: relative;
    z-index: 1;
    margin: 0;
    color: #b9cbe3;
    font-size: 12px;
    line-height: 1.65;
}

.site-setup-guide-card ul {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 16px;
    margin: 23px 0 0;
    padding: 22px 0 0;
    border-top: 1px solid rgba(255, 255, 255, .12);
    list-style: none;
}

.site-setup-guide-card li {
    display: flex;
    gap: 11px;
    align-items: flex-start;
}

.site-setup-guide-card li > span {
    display: grid;
    width: 25px;
    height: 25px;
    flex: 0 0 25px;
    place-items: center;
    border-radius: 8px;
    background: rgba(46, 211, 173, .15);
    color: #6ce7c1;
    font-size: 12px;
    font-weight: 900;
}

.site-setup-guide-card li strong,
.site-setup-guide-card li small {
    display: block;
}

.site-setup-guide-card li strong {
    color: #f7fbff;
    font-size: 12px;
    line-height: 1.4;
}

.site-setup-guide-card li small {
    margin-top: 4px;
    color: #aabed8;
    font-size: 10px;
    line-height: 1.55;
}

.site-setup-support-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px 12px;
    align-items: start;
    padding: 18px;
    border: 1px solid var(--app-line);
    border-radius: 18px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow-xs);
}

.site-setup-support-icon {
    display: grid;
    width: 36px;
    height: 36px;
    grid-row: 1 / 3;
    place-items: center;
    border-radius: 11px;
    background: var(--app-surface-blue);
    color: var(--app-blue);
    font-size: 15px;
    font-weight: 850;
}

.site-setup-support-card strong {
    color: var(--app-ink);
    font-size: 12px;
}

.app-content-inner .site-setup-support-card p {
    margin: 4px 0 0;
    color: var(--app-copy);
    font-size: 10px;
    line-height: 1.55;
}

.site-setup-support-card a {
    grid-column: 2;
    color: var(--app-blue);
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
}

.site-setup-support-card a:hover {
    color: var(--app-blue-deep);
    text-decoration: underline;
}

[data-theme="dark"] .site-setup-hero {
    background:
        radial-gradient(circle at 92% -15%, rgba(10, 166, 181, .16), transparent 35%),
        radial-gradient(circle at 5% 110%, rgba(102, 160, 255, .12), transparent 35%),
        linear-gradient(120deg, #111d31 0%, #13223a 64%, #142d4d 100%);
}

[data-theme="dark"] .site-setup-progress li {
    background: rgba(17, 29, 49, .78);
}

[data-theme="dark"] .site-setup-progress li.is-active {
    background: #172945;
}

[data-theme="dark"] .site-setup-input-prefix,
[data-theme="dark"] .site-setup-input-suffix {
    background: var(--app-surface-soft);
}

[data-theme="dark"] .site-setup-input-prefix > span,
[data-theme="dark"] .site-setup-input-suffix > span {
    background: #0d192b;
}

:dir(rtl) .site-setup-hero::after {
    right: auto;
    left: -54px;
}

:dir(rtl) .site-setup-guide-card::after {
    right: auto;
    left: -42px;
}

@media (max-width: 1120px) {
    .site-setup-hero {
        grid-template-columns: 1fr;
    }

    .site-setup-layout {
        grid-template-columns: minmax(0, 1fr) 300px;
    }
}

@media (max-width: 900px) {
    .site-setup-layout {
        grid-template-columns: 1fr;
    }

    .site-setup-aside {
        grid-template-columns: minmax(0, 1.3fr) minmax(240px, .7fr);
    }
}

@media (max-width: 680px) {
    .site-setup-hero {
        gap: 22px;
        padding: 22px;
        border-radius: 19px;
    }

    .site-setup-progress {
        grid-template-columns: 1fr;
    }

    .site-setup-progress li {
        display: flex;
        min-height: 0;
        align-items: center;
        padding: 10px 12px;
        text-align: start;
    }

    .site-setup-progress li span {
        flex: 0 0 28px;
        margin: 0;
    }

    .site-setup-form-grid,
    .site-setup-aside {
        grid-template-columns: 1fr;
    }

    .site-setup-field-full {
        grid-column: auto;
    }

    .app-content-inner .site-setup-form.form-card {
        padding: 20px;
        border-radius: 18px;
    }
}

@media (max-width: 440px) {
    .app-content-inner .site-setup-actions {
        flex-direction: column-reverse;
    }

    .app-content-inner .site-setup-actions .btn {
        width: 100%;
    }

    .site-setup-input-prefix > span {
        padding-inline: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-setup-page *,
    .site-setup-page *::before,
    .site-setup-page *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media (forced-colors: active) {
    .site-setup-hero,
    .site-setup-guide-card,
    .site-setup-support-card,
    .site-setup-truth,
    .site-setup-input-prefix,
    .site-setup-input-suffix {
        border: 1px solid CanvasText;
    }

    .site-setup-guide-card,
    .site-setup-guide-card h2,
    .site-setup-guide-card p,
    .site-setup-guide-card li strong,
    .site-setup-guide-card li small {
        color: CanvasText;
    }
}

/* V21 live-audit touch target hardening. */
.marketing-page a.platform-social-link {
    min-height: 44px;
    padding-block: 10px;
}

.app-topbar .system-health {
    min-height: 44px;
}

.app-topbar .app-menu-toggle {
    flex-direction: column;
    justify-content: center;
}

.app-topbar .app-menu-toggle span {
    width: 100%;
    flex: 0 0 2px;
    margin-block: 2px;
}

.site-setup-support-card a {
    display: inline-flex;
    align-items: center;
    justify-self: start;
    gap: 7px;
    min-height: 44px;
    padding: 9px 12px;
    border: 1px solid color-mix(in srgb, var(--app-blue) 22%, var(--app-line));
    border-radius: 11px;
    background: var(--app-surface-blue);
    transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}

.site-setup-support-card a:hover {
    border-color: color-mix(in srgb, var(--app-blue) 46%, var(--app-line));
    background: color-mix(in srgb, var(--app-blue) 12%, var(--app-surface));
    text-decoration: none;
    transform: translateY(-1px);
}

.site-setup-support-card a:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--app-blue) 58%, transparent);
    outline-offset: 3px;
}

/* V21 universal keyboard bypass link */
.skip-link {
    position: fixed;
    z-index: 10050;
    inset-block-start: 10px;
    inset-inline-start: 12px;
    padding: 11px 15px;
    border: 2px solid currentColor;
    border-radius: 10px;
    background: #ffffff;
    color: #083f9b;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
    transform: translateY(-180%);
    transition: transform .15s ease;
}
.skip-link:focus,
.skip-link:focus-visible {
    transform: translateY(0);
    outline: 3px solid #f4a20a;
    outline-offset: 3px;
}
[data-theme="dark"] .skip-link { background: #0d2036; color: #c2ddff; }
@media (prefers-reduced-motion: reduce) { .skip-link { transition: none; } }

/* === CONSOLIDATED SOURCE: marketing-polish.css === */
/* Arawn Guard marketing polish v18.
 * Loaded after the legacy and brand layers so both themes share one coherent surface system.
 */

.marketing-page {
    overflow-x: clip;
    background-color: var(--ag-canvas);
    transition: background-color .25s ease, color .25s ease;
}

.marketing-header {
    background: color-mix(in srgb, var(--ag-surface) 92%, transparent);
    box-shadow: 0 12px 38px color-mix(in srgb, var(--ag-ink) 7%, transparent);
}

html[data-theme="dark"] .marketing-header {
    border-bottom-color: #1c3552;
    background: rgba(8, 20, 36, .92);
    box-shadow: 0 16px 44px rgba(0, 0, 0, .24);
}

.growth-promo-section {
    --gp-section: #edf4ff;
    --gp-section-deep: #f8fbff;
    --gp-stage: rgba(255, 255, 255, .9);
    --gp-stage-edge: rgba(89, 133, 198, .22);
    --gp-card: #ffffff;
    --gp-card-deep: #f7faff;
    --gp-card-edge: #d6e4f6;
    --gp-title: #0f172a;
    --gp-copy: #405a78;
    --gp-muted: #70839b;
    --gp-blue: #2563eb;
    --gp-cyan: #0aaec5;
    --gp-purple: #7857f6;
    --gp-amber: #e69218;
    --gp-grid: rgba(44, 98, 174, .07);
    position: relative;
    isolation: isolate;
    overflow: clip;
    padding-block: clamp(72px, 8vw, 118px);
    background:
        radial-gradient(circle at 10% 16%, rgba(37, 99, 235, .11), transparent 29rem),
        radial-gradient(circle at 92% 82%, rgba(10, 174, 197, .1), transparent 28rem),
        linear-gradient(180deg, var(--gp-section-deep), var(--gp-section));
}

html[data-theme="dark"] .growth-promo-section {
    --gp-section: #06101e;
    --gp-section-deep: #09182a;
    --gp-stage: rgba(10, 25, 44, .94);
    --gp-stage-edge: rgba(107, 160, 224, .25);
    --gp-card: #10233d;
    --gp-card-deep: #0d1d33;
    --gp-card-edge: #274564;
    --gp-title: #f4f8ff;
    --gp-copy: #bed0e4;
    --gp-muted: #8fa7c2;
    --gp-blue: #78adff;
    --gp-cyan: #54d3e2;
    --gp-purple: #aa91ff;
    --gp-amber: #ffc15a;
    --gp-grid: rgba(133, 176, 226, .08);
    background:
        radial-gradient(circle at 12% 16%, rgba(40, 116, 226, .16), transparent 29rem),
        radial-gradient(circle at 90% 84%, rgba(28, 177, 194, .12), transparent 28rem),
        linear-gradient(180deg, #081627, #050e1a);
}

.growth-promo-section::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image:
        linear-gradient(var(--gp-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--gp-grid) 1px, transparent 1px);
    background-size: 54px 54px;
    mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 84%, transparent);
    content: "";
    pointer-events: none;
}

.growth-promo-stage {
    position: relative;
    min-width: 0;
    padding: clamp(28px, 5vw, 62px);
    border: 1px solid var(--gp-stage-edge);
    border-radius: clamp(26px, 3vw, 40px);
    background: var(--gp-stage);
    box-shadow:
        0 38px 90px rgba(23, 71, 139, .16),
        inset 0 1px 0 rgba(255, 255, 255, .72);
    backdrop-filter: blur(24px) saturate(1.15);
}

html[data-theme="dark"] .growth-promo-stage {
    box-shadow:
        0 40px 100px rgba(0, 0, 0, .38),
        inset 0 1px 0 rgba(255, 255, 255, .045);
}

.growth-promo-glow {
    position: absolute;
    top: -120px;
    right: -90px;
    width: 390px;
    height: 390px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(32, 188, 210, .16), transparent 67%);
    pointer-events: none;
}

.growth-promo-heading.section-heading-split {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(320px, .76fr);
    align-items: end;
    gap: clamp(34px, 6vw, 92px);
    max-width: none;
    margin: 0 0 clamp(30px, 4vw, 48px);
    text-align: left;
}

.growth-promo-heading .marketing-eyebrow {
    color: var(--gp-blue);
}

.growth-promo-heading h2 {
    max-width: 720px;
    margin-top: 15px;
    color: var(--gp-title);
    font-size: clamp(36px, 4.8vw, 65px);
    line-height: 1.02;
    letter-spacing: -.062em;
}

.growth-promo-intro {
    min-width: 0;
    padding-bottom: 5px;
}

.growth-promo-heading .growth-promo-intro > p {
    max-width: 560px;
    margin: 0;
    color: var(--gp-copy);
    font-size: clamp(14px, 1.35vw, 17px);
    line-height: 1.78;
}

.growth-promo-rail {
    display: grid;
    grid-template-columns: minmax(80px, 1fr) repeat(3, 8px);
    align-items: center;
    gap: 8px;
    margin-top: 24px;
}

.growth-promo-rail span {
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--gp-blue), var(--gp-cyan));
}

.growth-promo-rail i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--gp-blue) 20%, transparent);
}

.growth-promo-rail i:last-child {
    background: var(--gp-cyan);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--gp-cyan) 13%, transparent);
}

.growth-promo-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(14px, 1.8vw, 22px);
    margin: 0;
}

.growth-promo-card {
    --feature-accent: var(--gp-blue);
    --feature-soft: rgba(37, 99, 235, .11);
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 340px;
    flex-direction: column;
    padding: clamp(22px, 2.3vw, 30px);
    overflow: hidden;
    border: 1px solid var(--gp-card-edge);
    border-radius: 26px;
    background:
        radial-gradient(circle at 95% 4%, var(--feature-soft), transparent 43%),
        linear-gradient(150deg, var(--gp-card), var(--gp-card-deep));
    box-shadow: 0 17px 42px rgba(24, 72, 136, .1);
    transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}

.growth-promo-card[data-growth-feature="social"] {
    --feature-accent: var(--gp-purple);
    --feature-soft: rgba(120, 87, 246, .12);
}

.growth-promo-card[data-growth-feature="competitor"] {
    --feature-accent: var(--gp-cyan);
    --feature-soft: rgba(10, 174, 197, .13);
}

html[data-theme="dark"] .growth-promo-card {
    --feature-soft: rgba(73, 139, 239, .12);
    box-shadow: 0 19px 48px rgba(0, 0, 0, .23);
}

html[data-theme="dark"] .growth-promo-card[data-growth-feature="social"] {
    --feature-soft: rgba(139, 105, 255, .13);
}

html[data-theme="dark"] .growth-promo-card[data-growth-feature="competitor"] {
    --feature-soft: rgba(38, 196, 211, .12);
}

.growth-promo-card::before {
    position: absolute;
    top: 0;
    left: 28px;
    width: 72px;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: var(--feature-accent);
    content: "";
}

.growth-promo-card::after {
    position: absolute;
    right: -72px;
    bottom: -82px;
    width: 220px;
    height: 220px;
    border: 1px solid color-mix(in srgb, var(--feature-accent) 17%, transparent);
    border-radius: 50%;
    box-shadow:
        0 0 0 24px color-mix(in srgb, var(--feature-accent) 4%, transparent),
        0 0 0 52px color-mix(in srgb, var(--feature-accent) 3%, transparent);
    content: "";
    pointer-events: none;
}

.growth-promo-card:hover {
    z-index: 2;
    transform: translateY(-7px);
    border-color: color-mix(in srgb, var(--feature-accent) 46%, var(--gp-card-edge));
    box-shadow: 0 27px 62px color-mix(in srgb, var(--feature-accent) 16%, transparent);
}

.growth-promo-card-top {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.growth-promo-icon {
    position: relative;
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    margin: 0;
    border: 1px solid color-mix(in srgb, var(--feature-accent) 28%, var(--gp-card-edge));
    border-radius: 18px;
    background: color-mix(in srgb, var(--feature-accent) 10%, var(--gp-card));
    color: var(--feature-accent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .58);
}

.growth-promo-icon b {
    font: 850 14px/1 Inter, sans-serif;
    letter-spacing: -.02em;
}

.growth-promo-icon i {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 8px;
    height: 8px;
    border: 2px solid var(--gp-card);
    border-radius: 50%;
    background: var(--feature-accent);
}

.growth-promo-index {
    color: var(--gp-muted);
    font: 760 9px/1.2 ui-monospace, SFMono-Regular, Consolas, monospace;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.growth-promo-card-copy {
    position: relative;
    z-index: 1;
    margin-top: 30px;
}

.growth-promo-kicker {
    color: var(--feature-accent);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.growth-promo-card h3 {
    max-width: 360px;
    margin: 10px 0 12px;
    color: var(--gp-title);
    font-size: clamp(20px, 2vw, 27px);
    line-height: 1.14;
    letter-spacing: -.04em;
    text-wrap: balance;
}

.growth-promo-card p {
    position: relative;
    z-index: 1;
    max-width: 42ch;
    margin: 0;
    color: var(--gp-copy);
    font-size: 13px;
    line-height: 1.72;
}

.growth-promo-card-footer {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 15px;
    margin-top: auto;
    padding-top: 25px;
}

.growth-promo-signal {
    display: flex;
    height: 18px;
    align-items: end;
    gap: 4px;
}

.growth-promo-signal i {
    width: 4px;
    height: 32%;
    border-radius: 99px;
    background: color-mix(in srgb, var(--feature-accent) 34%, transparent);
}

.growth-promo-signal i:nth-child(2) { height: 58%; }
.growth-promo-signal i:nth-child(3) { height: 92%; background: var(--feature-accent); }
.growth-promo-signal i:nth-child(4) { height: 67%; }
.growth-promo-signal i:nth-child(5) { height: 42%; }

.growth-promo-note {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
    padding: 12px 0 0;
    border-top: 1px solid color-mix(in srgb, var(--gp-card-edge) 82%, transparent);
    color: var(--gp-muted);
    font-size: 10px;
    font-weight: 720;
    line-height: 1.45;
}

.growth-promo-note > i {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    margin-top: .35em;
    border-radius: 50%;
    background: var(--gp-amber);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--gp-amber) 12%, transparent);
}

.growth-promo-cta {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: clamp(18px, 2vw, 26px);
    padding: 20px 22px;
    border: 1px solid var(--gp-card-edge);
    border-radius: 21px;
    background:
        linear-gradient(110deg, color-mix(in srgb, var(--gp-blue) 7%, var(--gp-card)), color-mix(in srgb, var(--gp-cyan) 7%, var(--gp-card)));
    box-shadow: 0 14px 34px rgba(25, 72, 135, .08);
}

.growth-promo-cta > div {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 14px;
}

.growth-promo-cta > div > div {
    display: grid;
    min-width: 0;
    gap: 4px;
}

.growth-promo-cta-mark {
    display: grid;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    place-items: center;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--gp-blue), var(--gp-cyan));
    color: #fff !important;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--gp-blue) 24%, transparent);
    font-size: 10px !important;
    font-weight: 900;
    letter-spacing: -.02em;
}

.growth-promo-cta strong {
    color: var(--gp-title);
    font-size: 15px;
    line-height: 1.35;
}

.growth-promo-cta > div > div > span {
    color: var(--gp-copy);
    font-size: 12px;
    line-height: 1.5;
}

.growth-promo-cta .btn {
    min-width: max-content;
    flex: 0 0 auto;
}
.growth-promo-cta .btn span {
    color: inherit;
    font-size: inherit;
}

[dir="rtl"] .growth-promo-heading.section-heading-split {
    text-align: right;
}

[dir="rtl"] .growth-promo-card::before {
    right: 28px;
    left: auto;
}

[dir="rtl"] .growth-promo-card::after {
    right: auto;
    left: -72px;
}

@media (max-width: 1080px) {
    .growth-promo-heading.section-heading-split {
        grid-template-columns: minmax(0, 1fr);
        gap: 22px;
    }

    .growth-promo-heading .growth-promo-intro > p {
        max-width: 720px;
    }

    .growth-promo-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .growth-promo-card {
        min-height: 285px;
    }
}

@media (max-width: 700px) {
    .growth-promo-section {
        padding-block: 54px;
    }

    .growth-promo-stage {
        padding: 23px;
        border-radius: 26px;
    }

    .growth-promo-heading h2 {
        font-size: clamp(34px, 10vw, 48px);
    }

    .growth-promo-card {
        min-height: 0;
        padding: 22px;
        border-radius: 21px;
    }

    .growth-promo-card-copy {
        margin-top: 24px;
    }

    .growth-promo-card h3 {
        font-size: 22px;
    }

    .growth-promo-cta,
    .growth-promo-cta > div {
        align-items: flex-start;
    }

    .growth-promo-cta {
        flex-direction: column;
        padding: 19px;
    }

    .growth-promo-cta .btn {
        width: 100%;
        min-width: 0;
        text-align: center;
    }
}

@media (max-width: 420px) {
    .growth-promo-stage {
        padding: 18px;
        border-radius: 23px;
    }

    .growth-promo-heading h2 {
        letter-spacing: -.05em;
    }

    .growth-promo-cta > div {
        display: grid;
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 11px;
    }

    .growth-promo-cta-mark {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
        border-radius: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .marketing-page,
    .growth-promo-card,
    .growth-promo-cta .btn {
        transition: none !important;
    }

    .growth-promo-card:hover {
        transform: none;
    }
}

@media (forced-colors: active) {
    .growth-promo-stage,
    .growth-promo-card,
    .growth-promo-cta {
        border: 1px solid CanvasText;
        box-shadow: none;
    }
}

/* Arawn Guard marketing feature atlas v18.
 * A dense, capability-truthful bento system for growth, research and paid-traffic operations.
 */

.flow-badge {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 6px 11px;
    border: 1px solid color-mix(in srgb, var(--ag-accent) 24%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--ag-accent) 9%, var(--ag-surface));
    color: var(--ag-accent);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

html[data-theme="dark"] .flow-badge {
    border-color: rgba(111, 172, 255, .3);
    background: rgba(47, 117, 224, .14);
    color: #a9cbff;
}

.growth-promo-section {
    --gp-green: #0c9d72;
    --gp-red: #e05467;
}

html[data-theme="dark"] .growth-promo-section {
    --gp-green: #4ed6a6;
    --gp-red: #ff8697;
}

.growth-promo-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: stretch;
}

.growth-promo-card {
    grid-column: span 4;
    min-height: 360px;
}

.growth-promo-card:nth-child(-n + 2) {
    grid-column: span 6;
    min-height: 380px;
}

.growth-promo-card[data-growth-feature="traffic"],
.growth-promo-card[data-growth-feature="detection"] {
    --feature-accent: var(--gp-blue);
    --feature-soft: rgba(37, 99, 235, .12);
}

.growth-promo-card[data-growth-feature="competitor"] {
    --feature-accent: var(--gp-cyan);
    --feature-soft: rgba(10, 174, 197, .13);
}

.growth-promo-card[data-growth-feature="recommendations"] {
    --feature-accent: var(--gp-purple);
    --feature-soft: rgba(120, 87, 246, .12);
}

.growth-promo-card[data-growth-feature="seo"] {
    --feature-accent: var(--gp-green);
    --feature-soft: rgba(12, 157, 114, .12);
}

.growth-promo-card[data-growth-feature="ads"],
.growth-promo-card[data-growth-feature="platform"] {
    --feature-accent: var(--gp-amber);
    --feature-soft: rgba(230, 146, 24, .12);
}

.growth-promo-card[data-growth-feature="social"] {
    --feature-accent: var(--gp-red);
    --feature-soft: rgba(224, 84, 103, .11);
}

html[data-theme="dark"] .growth-promo-card[data-growth-feature="traffic"],
html[data-theme="dark"] .growth-promo-card[data-growth-feature="detection"] {
    --feature-soft: rgba(73, 139, 239, .13);
}

html[data-theme="dark"] .growth-promo-card[data-growth-feature="competitor"] {
    --feature-soft: rgba(38, 196, 211, .12);
}

html[data-theme="dark"] .growth-promo-card[data-growth-feature="recommendations"] {
    --feature-soft: rgba(139, 105, 255, .13);
}

html[data-theme="dark"] .growth-promo-card[data-growth-feature="seo"] {
    --feature-soft: rgba(78, 214, 166, .11);
}

html[data-theme="dark"] .growth-promo-card[data-growth-feature="ads"],
html[data-theme="dark"] .growth-promo-card[data-growth-feature="platform"] {
    --feature-soft: rgba(255, 193, 90, .1);
}

html[data-theme="dark"] .growth-promo-card[data-growth-feature="social"] {
    --feature-soft: rgba(255, 134, 151, .1);
}

.capability-status {
    display: inline-flex;
    min-height: 27px;
    max-width: 72%;
    align-items: center;
    gap: 7px;
    padding: 6px 9px;
    border: 1px solid color-mix(in srgb, var(--feature-accent) 22%, var(--gp-card-edge));
    border-radius: 999px;
    background: color-mix(in srgb, var(--feature-accent) 7%, var(--gp-card));
    color: var(--gp-copy);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .065em;
    line-height: 1.25;
    text-align: right;
    text-transform: uppercase;
}

.capability-status i {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: var(--feature-accent);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--feature-accent) 12%, transparent);
}

.capability-status-live {
    color: color-mix(in srgb, var(--gp-green) 74%, var(--gp-title));
}

.capability-status-connection,
.capability-status-approval {
    color: color-mix(in srgb, var(--gp-amber) 78%, var(--gp-title));
}

.growth-promo-card-copy {
    display: grid;
    align-content: start;
}

.growth-promo-card h3 {
    max-width: 22ch;
}

.growth-capability-tags {
    display: flex;
    min-width: 0;
    flex-wrap: wrap;
    gap: 7px;
    padding-top: 13px;
    border-top: 1px solid color-mix(in srgb, var(--gp-card-edge) 82%, transparent);
}

.growth-capability-tags span {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    padding: 5px 9px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--feature-accent) 8%, var(--gp-card-deep));
    color: var(--gp-copy);
    font-size: 9px;
    font-weight: 780;
    line-height: 1.25;
}

.growth-operating-loop {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(220px, .58fr) minmax(0, 1.42fr);
    gap: clamp(24px, 4vw, 48px);
    margin-top: clamp(22px, 3vw, 34px);
    padding: clamp(24px, 3.4vw, 38px);
    overflow: hidden;
    border: 1px solid var(--gp-card-edge);
    border-radius: 26px;
    background:
        radial-gradient(circle at 92% 0, color-mix(in srgb, var(--gp-cyan) 13%, transparent), transparent 42%),
        linear-gradient(135deg, color-mix(in srgb, var(--gp-blue) 6%, var(--gp-card)), var(--gp-card-deep));
    box-shadow: 0 18px 44px rgba(24, 72, 136, .09);
}

.growth-loop-copy {
    align-self: center;
}

.growth-loop-copy > span {
    color: var(--gp-blue);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .13em;
}

.growth-loop-copy h3 {
    margin: 10px 0 10px;
    color: var(--gp-title);
    font-size: clamp(23px, 2.4vw, 33px);
    line-height: 1.08;
    letter-spacing: -.045em;
}

.growth-loop-copy p {
    max-width: 38ch;
    margin: 0;
    color: var(--gp-copy);
    font-size: 12px;
    line-height: 1.68;
}

.growth-loop-steps {
    display: grid;
    min-width: 0;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.growth-loop-steps li {
    position: relative;
    display: grid;
    min-width: 0;
    min-height: 88px;
    align-content: space-between;
    gap: 12px;
    padding: 13px;
    border: 1px solid color-mix(in srgb, var(--gp-card-edge) 82%, transparent);
    border-radius: 16px;
    background: color-mix(in srgb, var(--gp-card) 82%, transparent);
}

.growth-loop-steps li:last-child {
    border-color: color-mix(in srgb, var(--gp-cyan) 38%, var(--gp-card-edge));
    background: color-mix(in srgb, var(--gp-cyan) 8%, var(--gp-card));
}

.growth-loop-steps span {
    color: var(--gp-blue);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .1em;
}

.growth-loop-steps strong {
    color: var(--gp-title);
    font-size: 10px;
    line-height: 1.35;
}

.tour-kpis article strong {
    overflow-wrap: anywhere;
    font-size: clamp(13px, 1.35vw, 18px);
    line-height: 1.1;
}

.decision-list strong {
    font-size: 9px;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.visual-score > strong[aria-hidden="true"] {
    font-size: 32px;
    line-height: 1;
}

[dir="rtl"] .capability-status {
    text-align: left;
}

[dir="rtl"] .growth-loop-copy,
[dir="rtl"] .growth-loop-steps {
    text-align: right;
}

@media (max-width: 1180px) {
    .growth-promo-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .growth-promo-card,
    .growth-promo-card:nth-child(-n + 2) {
        grid-column: auto;
        min-height: 340px;
    }

    .growth-operating-loop {
        grid-template-columns: minmax(0, 1fr);
    }

    .growth-loop-copy p {
        max-width: 70ch;
    }
}

@media (max-width: 700px) {
    .growth-promo-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .growth-promo-card,
    .growth-promo-card:nth-child(-n + 2) {
        min-height: 0;
    }

    .growth-operating-loop {
        padding: 20px;
        border-radius: 21px;
    }

    .growth-loop-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .capability-status {
        max-width: 68%;
        font-size: 7px;
    }
}

@media (max-width: 420px) {
    .growth-loop-steps {
        grid-template-columns: minmax(0, 1fr);
    }

    .growth-loop-steps li {
        min-height: 74px;
    }

    .growth-promo-card-top {
        align-items: flex-start;
        gap: 10px;
    }

    .capability-status {
        max-width: calc(100% - 58px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .growth-operating-loop,
    .growth-loop-steps li {
        scroll-behavior: auto;
        transition: none !important;
    }
}

@media (forced-colors: active) {
    .growth-operating-loop,
    .growth-loop-steps li,
    .capability-status,
    .growth-capability-tags span,
    .flow-badge {
        border: 1px solid CanvasText;
        box-shadow: none;
    }
}
/* Arawn Guard Web Intelligence marketing v19.
 * A responsive evidence-first product visual; every state remains capability-truthful.
 */
.web-intelligence-showcase {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr);
    gap: 28px;
    margin-top: 24px;
    padding: clamp(22px, 3vw, 36px);
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--gp-cyan) 28%, var(--gp-card-edge));
    border-radius: 26px;
    background:
        radial-gradient(circle at 100% 0, color-mix(in srgb, var(--gp-cyan) 13%, transparent), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb, var(--gp-card) 94%, transparent), color-mix(in srgb, var(--gp-card-deep) 96%, transparent));
    box-shadow: 0 26px 70px rgba(8, 39, 79, .1);
}

.web-intelligence-showcase::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    inline-size: 3px;
    background: linear-gradient(180deg, var(--gp-blue), var(--gp-cyan), var(--gp-purple));
}

.web-intelligence-showcase-copy {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.web-intelligence-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--gp-cyan);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .12em;
}

.web-intelligence-kicker i {
    inline-size: 8px;
    block-size: 8px;
    border-radius: 50%;
    background: var(--gp-cyan);
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--gp-cyan) 13%, transparent);
}

.web-intelligence-showcase h3 {
    max-width: 700px;
    margin: 17px 0 12px;
    color: var(--gp-title);
    font-size: clamp(25px, 3vw, 39px);
    line-height: 1.04;
    letter-spacing: -.035em;
}

.web-intelligence-showcase-copy > p {
    margin: 0;
    color: var(--gp-copy);
    font-size: 13px;
    line-height: 1.72;
}

.web-intelligence-showcase-copy ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 12px;
    margin: 22px 0;
    padding: 0;
    list-style: none;
}

.web-intelligence-showcase-copy li {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    gap: 8px;
    color: var(--gp-title);
    font-size: 10px;
    font-weight: 750;
    line-height: 1.45;
}

.web-intelligence-showcase-copy li span {
    display: inline-grid;
    flex: 0 0 18px;
    inline-size: 18px;
    block-size: 18px;
    place-items: center;
    border-radius: 6px;
    background: color-mix(in srgb, var(--gp-green) 14%, transparent);
    color: var(--gp-green);
    font-size: 10px;
}

.web-intelligence-truth {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 18px;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--gp-blue) 20%, var(--gp-card-edge));
    border-radius: 14px;
    background: color-mix(in srgb, var(--gp-blue) 6%, var(--gp-card));
}

.web-intelligence-truth > span {
    display: inline-grid;
    flex: 0 0 22px;
    inline-size: 22px;
    block-size: 22px;
    place-items: center;
    border-radius: 50%;
    background: var(--gp-blue);
    color: #fff;
    font-size: 10px;
    font-weight: 900;
}

.web-intelligence-truth p {
    margin: 0;
    color: var(--gp-copy);
    font-size: 10px;
    line-height: 1.6;
}

.web-intelligence-showcase-copy .btn {
    min-height: 44px;
}

.web-intelligence-console {
    position: relative;
    z-index: 1;
    min-width: 0;
    align-self: center;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--gp-blue) 28%, var(--gp-card-edge));
    border-radius: 22px;
    background: color-mix(in srgb, var(--gp-card-deep) 94%, transparent);
    box-shadow: 0 24px 54px rgba(8, 37, 79, .16);
}

.web-intelligence-console > header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 52px;
    padding: 11px 16px;
    border-bottom: 1px solid var(--gp-card-edge);
    background: color-mix(in srgb, var(--gp-card) 88%, transparent);
}

.web-intelligence-console > header > span {
    display: flex;
    gap: 5px;
}

.web-intelligence-console > header > span i {
    inline-size: 7px;
    block-size: 7px;
    border-radius: 50%;
    background: var(--gp-card-edge);
}

.web-intelligence-console > header > span i:first-child { background: var(--gp-red); }
.web-intelligence-console > header > span i:nth-child(2) { background: #e7aa33; }
.web-intelligence-console > header > span i:last-child { background: var(--gp-green); }

.web-intelligence-console > header strong {
    min-width: 0;
    overflow: hidden;
    color: var(--gp-title);
    font-size: 10px;
    letter-spacing: .02em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.web-intelligence-console > header em {
    padding: 5px 8px;
    border: 1px solid color-mix(in srgb, var(--gp-purple) 28%, var(--gp-card-edge));
    border-radius: 999px;
    color: var(--gp-purple);
    font-size: 7px;
    font-style: normal;
    font-weight: 900;
    letter-spacing: .07em;
    text-align: center;
}

.web-intelligence-console-grid {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: 12px;
    padding: 14px;
}

.web-intelligence-targets,
.web-intelligence-pipeline {
    min-width: 0;
    padding: 13px;
    border: 1px solid var(--gp-card-edge);
    border-radius: 16px;
    background: color-mix(in srgb, var(--gp-card) 84%, transparent);
}

.web-intelligence-targets > span,
.web-intelligence-pipeline > span {
    display: block;
    margin-bottom: 10px;
    color: var(--gp-muted);
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .12em;
}

.web-intelligence-targets article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 9px;
    min-width: 0;
    margin-top: 8px;
    padding: 10px;
    border: 1px solid var(--gp-card-edge);
    border-radius: 12px;
    background: var(--gp-card);
}

.web-intelligence-targets article > i {
    display: inline-grid;
    grid-row: span 2;
    inline-size: 28px;
    block-size: 28px;
    place-items: center;
    border-radius: 9px;
    background: color-mix(in srgb, var(--gp-blue) 11%, transparent);
    color: var(--gp-blue);
    font-size: 8px;
    font-style: normal;
    font-weight: 900;
}

.web-intelligence-targets article > div { min-width: 0; }
.web-intelligence-targets article strong {
    display: block;
    color: var(--gp-title);
    font-size: 9px;
    line-height: 1.35;
}

.web-intelligence-targets article small {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: var(--gp-muted);
    font-size: 7px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.web-intelligence-targets article > em {
    grid-column: 2;
    justify-self: start;
    color: var(--gp-green);
    font-size: 6px;
    font-style: normal;
    font-weight: 900;
    letter-spacing: .06em;
}

.web-intelligence-targets article.is-competitor > i {
    background: color-mix(in srgb, var(--gp-purple) 11%, transparent);
    color: var(--gp-purple);
}

.web-intelligence-targets article.is-competitor > em { color: var(--gp-purple); }

.web-intelligence-pipeline ol {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.web-intelligence-pipeline li {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
    padding: 8px 9px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--gp-blue) 6%, transparent);
}

.web-intelligence-pipeline li i {
    display: inline-grid;
    flex: 0 0 20px;
    inline-size: 20px;
    block-size: 20px;
    place-items: center;
    border-radius: 7px;
    background: color-mix(in srgb, var(--gp-blue) 13%, transparent);
    color: var(--gp-blue);
    font-size: 7px;
    font-style: normal;
    font-weight: 900;
}

.web-intelligence-pipeline li strong {
    min-width: 0;
    color: var(--gp-title);
    font-size: 8px;
    line-height: 1.3;
}

.web-intelligence-result {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 8px;
    margin-top: 10px;
    padding: 10px;
    border: 1px dashed color-mix(in srgb, var(--gp-purple) 38%, var(--gp-card-edge));
    border-radius: 12px;
}

.web-intelligence-result span {
    color: var(--gp-muted);
    font-size: 6px;
    font-weight: 900;
    letter-spacing: .08em;
}

.web-intelligence-result strong {
    color: var(--gp-purple);
    font-size: 7px;
    letter-spacing: .06em;
}

.web-intelligence-result small {
    grid-column: 1 / -1;
    color: var(--gp-copy);
    font-size: 7px;
    line-height: 1.4;
}

[dir="rtl"] .web-intelligence-showcase::before {
    inset: 0 0 0 auto;
}

[dir="rtl"] .web-intelligence-showcase,
[dir="rtl"] .web-intelligence-targets,
[dir="rtl"] .web-intelligence-pipeline {
    text-align: right;
}

@media (max-width: 980px) {
    .web-intelligence-showcase {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 700px) {
    .web-intelligence-showcase {
        gap: 20px;
        padding: 20px;
        border-radius: 22px;
    }

    .web-intelligence-showcase-copy ul,
    .web-intelligence-console-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 480px) {
    .web-intelligence-showcase {
        padding: 17px;
    }

    .web-intelligence-console > header {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .web-intelligence-console > header em {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .web-intelligence-console-grid {
        padding: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .web-intelligence-showcase *,
    .web-intelligence-showcase *::before,
    .web-intelligence-showcase *::after {
        transition: none !important;
        animation: none !important;
    }
}

@media (forced-colors: active) {
    .web-intelligence-showcase,
    .web-intelligence-console,
    .web-intelligence-targets,
    .web-intelligence-pipeline,
    .web-intelligence-targets article,
    .web-intelligence-result {
        border: 1px solid CanvasText;
        box-shadow: none;
    }
}
/* Arawn Guard Social Command Center marketing v19. */
.social-command-showcase {
    --sc-surface: #ffffff;
    --sc-surface-soft: #f3f8ff;
    --sc-surface-blue: #e8f2ff;
    --sc-line: #cbdcf2;
    --sc-line-strong: #aac7ec;
    --sc-title: #0f172a;
    --sc-copy: #405b7b;
    --sc-muted: #536b87;
    --sc-blue: #0968f6;
    --sc-cyan: #0aaec5;
    --sc-violet: #7158ed;
    --sc-green: #0b7658;
    --sc-amber: #8b5200;
    position: relative;
    z-index: 1;
    margin-top: clamp(24px, 3.4vw, 38px);
    padding: clamp(24px, 3.6vw, 42px);
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--sc-blue) 24%, var(--sc-line));
    border-radius: 30px;
    background:
        radial-gradient(circle at 92% 4%, rgba(9, 104, 246, .12), transparent 24rem),
        linear-gradient(145deg, rgba(255, 255, 255, .98), #f1f7ff);
    box-shadow: 0 28px 74px rgba(12, 65, 132, .12);
}

html[data-theme="dark"] .social-command-showcase {
    --sc-surface: #10243e;
    --sc-surface-soft: #0b1c31;
    --sc-surface-blue: #132d4d;
    --sc-line: #294a6d;
    --sc-line-strong: #3c6797;
    --sc-title: #f5f9ff;
    --sc-copy: #bed0e4;
    --sc-muted: #8fa8c3;
    --sc-blue: #78adff;
    --sc-cyan: #54d3e2;
    --sc-violet: #ad98ff;
    --sc-green: #65d9b1;
    --sc-amber: #ffc364;
    background:
        radial-gradient(circle at 92% 4%, rgba(53, 127, 228, .18), transparent 24rem),
        linear-gradient(145deg, #0b1b2f, #071523);
    box-shadow: 0 30px 84px rgba(0, 0, 0, .38);
}

.social-command-showcase::before {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(color-mix(in srgb, var(--sc-blue) 5%, transparent) 1px, transparent 1px),
        linear-gradient(90deg, color-mix(in srgb, var(--sc-blue) 5%, transparent) 1px, transparent 1px);
    background-size: 38px 38px;
    mask-image: linear-gradient(135deg, #000, transparent 62%);
    content: "";
    pointer-events: none;
}

.social-command-showcase::after {
    position: absolute;
    top: -92px;
    right: -76px;
    width: 250px;
    height: 250px;
    border: 1px solid color-mix(in srgb, var(--sc-cyan) 23%, transparent);
    border-radius: 50%;
    box-shadow:
        0 0 0 32px color-mix(in srgb, var(--sc-blue) 3%, transparent),
        0 0 0 64px color-mix(in srgb, var(--sc-blue) 2%, transparent);
    content: "";
    pointer-events: none;
}

.social-command-header,
.social-command-console,
.social-command-footer {
    position: relative;
    z-index: 1;
}

.social-command-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 26px;
    margin-bottom: 24px;
}

.social-command-heading {
    min-width: 0;
}

.social-command-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--sc-blue);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.social-command-kicker i {
    width: 9px;
    height: 9px;
    border-radius: 3px;
    background: linear-gradient(135deg, var(--sc-blue), var(--sc-cyan));
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--sc-blue) 11%, transparent);
    transform: rotate(45deg);
}

.social-command-heading h3 {
    max-width: 820px;
    margin: 16px 0 11px;
    color: var(--sc-title);
    font-size: clamp(27px, 3.3vw, 44px);
    line-height: 1.02;
    letter-spacing: -.045em;
}

.social-command-heading p {
    max-width: 74ch;
    margin: 0;
    color: var(--sc-copy);
    font-size: 13px;
    line-height: 1.72;
}

.social-command-lanes {
    display: grid;
    grid-template-columns: auto auto;
    gap: 7px;
    min-width: 226px;
    padding: 7px;
    border: 1px solid var(--sc-line);
    border-radius: 16px;
    background: color-mix(in srgb, var(--sc-surface) 89%, transparent);
    box-shadow: 0 10px 24px rgba(20, 69, 132, .08);
}

.social-command-lanes small {
    grid-column: 1 / -1;
    padding: 2px 6px 1px;
    color: var(--sc-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.social-command-lanes > span {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 7px 12px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: var(--sc-copy);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.25;
}

.social-command-lanes > span i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--sc-muted);
}

.social-command-lanes > span.is-active {
    border-color: color-mix(in srgb, var(--sc-blue) 22%, var(--sc-line));
    background: var(--sc-surface-blue);
    color: var(--sc-blue);
}

.social-command-lanes > span.is-active i {
    background: var(--sc-blue);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--sc-blue) 11%, transparent);
}

.social-command-console {
    overflow: hidden;
    border: 1px solid var(--sc-line-strong);
    border-radius: 24px;
    background: var(--sc-surface-soft);
    box-shadow:
        0 24px 58px rgba(16, 61, 121, .13),
        inset 0 1px 0 color-mix(in srgb, #fff 80%, transparent);
}

html[data-theme="dark"] .social-command-console {
    border-color: #31587f;
    background: #091a2e;
    box-shadow:
        0 26px 62px rgba(0, 0, 0, .32),
        inset 0 1px 0 rgba(255, 255, 255, .035);
}

.social-command-topbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    min-height: 68px;
    padding: 12px 17px;
    border-bottom: 1px solid var(--sc-line);
    background: color-mix(in srgb, var(--sc-surface) 92%, transparent);
}

.social-command-agent {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 11px;
}

.social-command-agent > span {
    display: inline-grid;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 12px;
    background: linear-gradient(145deg, var(--sc-blue), var(--sc-cyan));
    box-shadow: 0 9px 20px color-mix(in srgb, var(--sc-blue) 27%, transparent);
    color: #fff;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .06em;
}

.social-command-agent div {
    min-width: 0;
}

.social-command-agent strong,
.social-command-agent small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.social-command-agent strong {
    color: var(--sc-title);
    font-size: 11px;
    line-height: 1.35;
}

.social-command-agent small {
    margin-top: 3px;
    color: var(--sc-muted);
    font-size: 10px;
    line-height: 1.35;
}

.social-command-state {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    max-width: 210px;
    padding: 7px 10px;
    border: 1px solid color-mix(in srgb, var(--sc-amber) 30%, var(--sc-line));
    border-radius: 999px;
    background: color-mix(in srgb, var(--sc-amber) 8%, var(--sc-surface));
    color: var(--sc-amber);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .06em;
    line-height: 1.25;
    text-align: center;
    text-transform: uppercase;
}

.social-command-state i {
    flex: 0 0 7px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
    animation: social-agent-breathe 2.2s ease-in-out infinite;
}

@keyframes social-agent-breathe {
    0%,
    100% { box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 22%, transparent); }
    50% { box-shadow: 0 0 0 5px color-mix(in srgb, currentColor 4%, transparent); }
}

.social-command-console-body {
    display: grid;
    grid-template-columns: minmax(228px, .48fr) minmax(0, 1.52fr);
    min-width: 0;
}

.social-command-desks {
    min-width: 0;
    padding: 15px;
    border-inline-end: 1px solid var(--sc-line);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--sc-blue) 5%, var(--sc-surface)), var(--sc-surface-soft));
}

.social-command-desks > span,
.social-agent-briefing header > span,
.social-rubric-panel header > span,
.social-evidence-panel header > span {
    color: var(--sc-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.social-command-desks article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 8px 10px;
    min-width: 0;
    margin-top: 9px;
    padding: 11px;
    border: 1px solid var(--sc-line);
    border-radius: 14px;
    background: var(--sc-surface);
    box-shadow: 0 8px 20px rgba(26, 69, 125, .05);
}

.social-command-desks article:first-of-type {
    border-color: color-mix(in srgb, var(--sc-cyan) 35%, var(--sc-line));
}

.social-command-desks article > i {
    display: inline-grid;
    grid-row: span 2;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 10px;
    background: color-mix(in srgb, var(--sc-blue) 10%, transparent);
    color: var(--sc-blue);
    font-size: 10px;
    font-style: normal;
    font-weight: 900;
}

.social-command-desks article[data-social-desk="meta"] > i {
    background: color-mix(in srgb, var(--sc-violet) 10%, transparent);
    color: var(--sc-violet);
}

.social-command-desks article[data-social-desk="analyst"] > i {
    background: color-mix(in srgb, var(--sc-cyan) 11%, transparent);
    color: var(--sc-cyan);
}

.social-command-desks article > div {
    min-width: 0;
}

.social-command-desks strong,
.social-command-desks small,
.social-command-desks em {
    display: block;
    overflow-wrap: anywhere;
}

.social-command-desks strong {
    color: var(--sc-title);
    font-size: 10px;
    line-height: 1.35;
}

.social-command-desks small {
    margin-top: 3px;
    color: var(--sc-muted);
    font-size: 10px;
    line-height: 1.4;
}

.social-command-desks em {
    grid-column: 2;
    justify-self: start;
    color: var(--sc-amber);
    font-size: 10px;
    font-style: normal;
    font-weight: 900;
    letter-spacing: .05em;
    line-height: 1.35;
    text-transform: uppercase;
}

.social-command-desks article[data-social-desk="analyst"] em {
    color: var(--sc-green);
}

.social-command-workspace {
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    gap: 11px;
    min-width: 0;
    padding: 15px;
}

.social-agent-briefing,
.social-rubric-panel,
.social-evidence-panel {
    min-width: 0;
    border: 1px solid var(--sc-line);
    border-radius: 16px;
    background: var(--sc-surface);
}

.social-agent-briefing {
    grid-column: 1 / -1;
    padding: 15px;
    background:
        radial-gradient(circle at 96% 4%, color-mix(in srgb, var(--sc-blue) 10%, transparent), transparent 14rem),
        var(--sc-surface);
}

.social-agent-briefing header,
.social-rubric-panel header,
.social-evidence-panel > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.social-agent-briefing header em,
.social-rubric-panel header em {
    color: var(--sc-amber);
    font-size: 10px;
    font-style: normal;
    font-weight: 900;
    letter-spacing: .06em;
    text-align: end;
    text-transform: uppercase;
}

.social-agent-briefing h4 {
    max-width: 34ch;
    margin: 13px 0 7px;
    color: var(--sc-title);
    font-size: clamp(15px, 1.8vw, 20px);
    line-height: 1.14;
    letter-spacing: -.025em;
}

.social-agent-briefing p {
    max-width: 76ch;
    margin: 0;
    color: var(--sc-copy);
    font-size: 10px;
    line-height: 1.62;
}

.social-agent-briefing > div {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 13px;
}

.social-agent-briefing > div span {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 5px 9px;
    border: 1px solid color-mix(in srgb, var(--sc-blue) 16%, var(--sc-line));
    border-radius: 999px;
    background: var(--sc-surface-blue);
    color: var(--sc-blue);
    font-size: 10px;
    font-weight: 850;
}

.social-rubric-panel,
.social-evidence-panel {
    padding: 13px;
}

.social-rubric-panel ul,
.social-evidence-panel ol {
    margin: 11px 0 0;
    padding: 0;
    list-style: none;
}

.social-rubric-panel ul {
    display: grid;
    gap: 8px;
}

.social-rubric-panel li {
    min-width: 0;
    padding: 9px;
    border-radius: 11px;
    background: var(--sc-surface-soft);
}

.social-rubric-panel li > div {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.social-rubric-panel li span {
    color: var(--sc-title);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.35;
}

.social-rubric-panel li strong {
    color: var(--sc-muted);
    font-size: 10px;
    line-height: 1.35;
    text-align: end;
    text-transform: uppercase;
}

.social-rubric-panel li > i {
    display: block;
    height: 3px;
    margin-top: 8px;
    border-radius: 999px;
    background: repeating-linear-gradient(90deg, var(--sc-line-strong) 0 5px, transparent 5px 9px);
    opacity: .58;
}

.social-evidence-panel ol {
    display: grid;
    gap: 7px;
}

.social-evidence-panel li {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.social-evidence-panel li > i {
    display: inline-grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--sc-blue) 22%, var(--sc-line));
    border-radius: 8px;
    background: var(--sc-surface-blue);
    color: var(--sc-blue);
    font-size: 10px;
    font-style: normal;
    font-weight: 900;
}

.social-evidence-panel li > div {
    min-width: 0;
    padding: 7px 8px;
    border-inline-start: 1px solid var(--sc-line);
}

.social-evidence-panel li strong,
.social-evidence-panel li small {
    display: block;
    overflow-wrap: anywhere;
}

.social-evidence-panel li strong {
    color: var(--sc-title);
    font-size: 10px;
    line-height: 1.35;
}

.social-evidence-panel li small {
    margin-top: 2px;
    color: var(--sc-muted);
    font-size: 10px;
    line-height: 1.35;
}

.social-external-state {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 3px 8px;
    margin-top: 11px;
    padding: 10px;
    border: 1px dashed color-mix(in srgb, var(--sc-amber) 39%, var(--sc-line));
    border-radius: 12px;
    background: color-mix(in srgb, var(--sc-amber) 5%, var(--sc-surface));
}

.social-external-state span {
    color: var(--sc-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .08em;
}

.social-external-state strong {
    color: var(--sc-amber);
    font-size: 10px;
    letter-spacing: .05em;
    text-align: end;
}

.social-external-state small {
    grid-column: 1 / -1;
    color: var(--sc-copy);
    font-size: 10px;
    line-height: 1.45;
}

.social-command-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    margin-top: 17px;
}

.social-command-truth {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    gap: 10px;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--sc-blue) 19%, var(--sc-line));
    border-radius: 14px;
    background: color-mix(in srgb, var(--sc-blue) 5%, var(--sc-surface));
}

.social-command-truth > span {
    display: inline-grid;
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 50%;
    background: var(--sc-blue);
    color: #fff;
    font-size: 10px;
    font-weight: 900;
}

.social-command-truth p {
    margin: 0;
    color: var(--sc-copy);
    font-size: 10px;
    line-height: 1.58;
}

.social-command-footer .btn {
    min-height: 44px;
    white-space: nowrap;
}

/* Small labels carry product state, so they remain readable rather than decorative. */
.social-command-kicker,
.social-command-lanes small,
.social-command-desks > span,
.social-agent-briefing header > span,
.social-rubric-panel header > span,
.social-evidence-panel header > span {
    font-size: 10px;
}

.social-command-lanes > span,
.social-command-agent small,
.social-command-state,
.social-command-desks small,
.social-command-desks em,
.social-agent-briefing header em,
.social-rubric-panel header em,
.social-agent-briefing > div span,
.social-rubric-panel li strong,
.social-evidence-panel li small,
.social-external-state span,
.social-external-state strong,
.social-external-state small {
    font-size: 10px;
}

.social-command-desks strong,
.social-agent-briefing p,
.social-rubric-panel li span,
.social-evidence-panel li strong,
.social-command-truth p {
    font-size: 11px;
}

.social-command-lanes > span,
.social-command-state,
.social-command-desks em,
.social-agent-briefing header em,
.social-rubric-panel header em,
.social-external-state strong {
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
}

.social-command-showcase .btn:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--sc-blue) 72%, #fff);
    outline-offset: 3px;
}

[dir="rtl"] .social-command-showcase::after {
    right: auto;
    left: -76px;
}

[dir="rtl"] .social-command-showcase,
[dir="rtl"] .social-command-desks,
[dir="rtl"] .social-command-workspace {
    text-align: right;
}

[dir="rtl"] .social-command-agent,
[dir="rtl"] .social-command-truth {
    flex-direction: row;
}

[dir="rtl"] .social-command-desks {
    border-inline-end: 1px solid var(--sc-line);
}

@media (max-width: 1280px) {
    .social-command-console-body {
        grid-template-columns: minmax(218px, .43fr) minmax(0, 1.57fr);
    }

    .social-command-workspace {
        grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    }
}

@media (max-width: 1024px) {
    .social-command-header {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .social-command-lanes {
        justify-self: start;
    }

    .social-command-console-body {
        grid-template-columns: minmax(0, 1fr);
    }

    .social-command-desks {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 9px;
        border-inline-end: 0;
        border-bottom: 1px solid var(--sc-line);
    }

    .social-command-desks > span {
        grid-column: 1 / -1;
    }

    .social-command-desks article {
        margin-top: 0;
    }
}

@media (max-width: 768px) {
    .social-command-showcase {
        padding: 20px;
        border-radius: 24px;
    }

    .social-command-heading h3 {
        font-size: clamp(25px, 7vw, 36px);
    }

    .social-command-desks {
        grid-template-columns: minmax(0, 1fr);
    }

    .social-command-desks > span {
        grid-column: auto;
    }

    .social-command-workspace {
        grid-template-columns: minmax(0, 1fr);
    }

    .social-agent-briefing {
        grid-column: auto;
    }

    .social-command-footer {
        grid-template-columns: minmax(0, 1fr);
    }

    .social-command-footer .btn {
        justify-self: start;
    }
}

@media (max-width: 390px) {
    .social-command-showcase {
        margin-inline: -3px;
        padding: 15px;
        border-radius: 20px;
    }

    .social-command-header {
        gap: 18px;
    }

    .social-command-lanes {
        width: 100%;
        min-width: 0;
    }

    .social-command-lanes > span {
        min-width: 0;
        padding-inline: 7px;
    }

    .social-command-topbar {
        grid-template-columns: minmax(0, 1fr);
        padding: 12px;
    }

    .social-command-state {
        justify-self: start;
        max-width: 100%;
    }

    .social-command-desks,
    .social-command-workspace {
        padding: 11px;
    }

    .social-agent-briefing,
    .social-rubric-panel,
    .social-evidence-panel {
        padding: 11px;
    }

    .social-command-footer .btn {
        width: 100%;
        white-space: normal;
    }
}

@media (prefers-reduced-motion: reduce) {
    .social-command-showcase *,
    .social-command-showcase *::before,
    .social-command-showcase *::after {
        scroll-behavior: auto;
        transition: none !important;
        animation: none !important;
    }
}

@media (forced-colors: active) {
    .social-command-showcase,
    .social-command-console,
    .social-command-lanes,
    .social-command-desks article,
    .social-agent-briefing,
    .social-rubric-panel,
    .social-evidence-panel,
    .social-external-state,
    .social-command-truth {
        border: 1px solid CanvasText;
        box-shadow: none;
    }

    .social-command-kicker i,
    .social-command-state i,
    .social-command-lanes > span i {
        forced-color-adjust: none;
        background: Highlight;
    }
}
/* Arawn Guard three-lane platform bridge v19. */
.platform-flow-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
}

.platform-flow-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.platform-flow-card ol {
    flex: 1;
}

.platform-flow-card header > div,
.platform-capability span {
    min-width: 0;
}

.platform-flow-card header small,
.platform-capability strong {
    font-size: 10px;
    overflow-wrap: anywhere;
}

.platform-capability span {
    font-size: 11px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.platform-flow-card.social-intelligence {
    border-color: color-mix(in srgb, #326ce5 28%, var(--cg-line));
    background:
        radial-gradient(circle at 100% 0, color-mix(in srgb, #5a73ed 11%, transparent), transparent 18rem),
        var(--cg-surface);
}

.platform-flow-card.social-intelligence::before {
    background: linear-gradient(90deg, #1968ef, #20a9cb, #7456e8);
}

.platform-desk-mark {
    display: inline-grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid color-mix(in srgb, #276ee8 25%, var(--cg-line));
    border-radius: 15px;
    background: linear-gradient(145deg, color-mix(in srgb, #276ee8 12%, var(--cg-surface)), color-mix(in srgb, #24abc8 9%, var(--cg-surface)));
    box-shadow: 0 9px 22px rgba(30, 91, 184, .13);
    color: var(--cg-blue);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .06em;
}

.platform-social-link {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 8px;
    min-height: 40px;
    margin-top: 15px;
    padding: 8px 12px;
    border: 1px solid color-mix(in srgb, var(--cg-blue) 25%, var(--cg-line));
    border-radius: 11px;
    background: color-mix(in srgb, var(--cg-blue) 7%, var(--cg-surface));
    color: var(--cg-blue);
    font-size: 11px;
    font-weight: 800;
    line-height: 1.35;
    text-decoration: none;
}

.platform-social-link:hover {
    border-color: color-mix(in srgb, var(--cg-blue) 48%, var(--cg-line));
    background: color-mix(in srgb, var(--cg-blue) 12%, var(--cg-surface));
    transform: translateY(-1px);
}

.platform-social-link:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--cg-blue) 68%, #fff);
    outline-offset: 3px;
}

html[data-theme="dark"] .platform-flow-card.social-intelligence {
    border-color: #31587f;
    background:
        radial-gradient(circle at 100% 0, rgba(88, 117, 224, .16), transparent 18rem),
        #0e2139;
}

html[data-theme="dark"] .platform-desk-mark {
    border-color: #3a648f;
    background: linear-gradient(145deg, #17365a, #123248);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .24);
    color: #91bdff;
}

html[data-theme="dark"] .platform-social-link {
    border-color: #365f8b;
    background: #142e4d;
    color: #a9cbff;
}

[dir="rtl"] .platform-flow-card.social-intelligence {
    text-align: right;
}

[dir="rtl"] .platform-social-link span {
    transform: rotate(180deg);
}

@media (max-width: 1179px) {
    .platform-flow-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .platform-flow-card.social-intelligence {
        grid-column: 1 / -1;
    }
}

@media (max-width: 1024px) {
    .platform-flow-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .platform-flow-card.social-intelligence {
        grid-column: auto;
    }
}

@media (max-width: 760px) {
    .platform-flow-card {
        padding: 23px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .platform-social-link {
        transition: none !important;
    }

    .platform-social-link:hover {
        transform: none;
    }
}

@media (forced-colors: active) {
    .platform-flow-card.social-intelligence,
    .platform-desk-mark,
    .platform-social-link {
        border: 1px solid CanvasText;
        box-shadow: none;
    }
}

/* === CONSOLIDATED SOURCE: v23-1-product.css === */
/* Arawn Guard V23.1 product surfaces. Uses the existing central tokens only. */
.app-support-link,.marketing-support-link{display:inline-flex;align-items:center;min-height:44px;padding:.55rem .85rem;border:1px solid var(--border-color,rgba(80,120,170,.25));border-radius:999px;font-size:.78rem;font-weight:800;color:var(--text-primary,#10233f);text-decoration:none;white-space:nowrap}
.hero-text-link{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:48px;padding:.5rem 1rem;border:1px solid var(--public-line);border-radius:999px;background:var(--public-card);color:var(--text-secondary,#52667f);font-weight:750;font-size:13px;text-decoration:none;white-space:nowrap}.hero-text-link:hover{border-color:color-mix(in srgb,var(--public-blue) 35%,var(--public-line));color:var(--public-blue);background:var(--public-blue-soft)}
.start-choice-grid,.quick-tool-grid,.support-channel-grid,.quick-results-grid{display:grid;gap:1rem}
.start-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.start-choice-card,.quick-tool-card,.quick-result-card,.support-channel-grid article{position:relative;padding:1.25rem;border:1px solid var(--border-color,rgba(80,120,170,.22));border-radius:var(--radius-lg,18px);background:var(--surface-primary,#fff);box-shadow:var(--shadow-sm,0 8px 24px rgba(19,45,80,.06))}
.start-choice-card.is-selected{box-shadow:0 0 0 2px var(--primary,#2178ff),var(--shadow-sm,0 8px 24px rgba(19,45,80,.06))}.start-choice-card form{margin:0}.start-choice-card button.setup-card-action{width:100%;border:0;background:transparent;font:inherit;text-align:start;cursor:pointer}
.start-choice-card.is-primary{border-color:var(--primary,#2178ff);background:linear-gradient(145deg,rgba(33,120,255,.1),rgba(31,200,255,.04))}
.start-choice-number{display:inline-grid;place-items:center;width:2.3rem;height:2.3rem;border-radius:.75rem;background:var(--surface-secondary,#edf4ff);font-size:.72rem;font-weight:900;color:var(--primary,#2178ff)}
.start-choice-badge{position:absolute;inset-block-start:1.1rem;inset-inline-end:1.1rem;padding:.32rem .55rem;border-radius:999px;background:var(--primary,#2178ff);color:#fff;font-size:.68rem;font-weight:900}
.start-choice-card h3,.quick-tool-card h3{margin:.9rem 0 .45rem;font-size:1.05rem}.start-choice-card p,.quick-tool-card p{margin:0 0 1rem;color:var(--text-secondary,#52667f);line-height:1.6}
.start-core-state,.start-support-panel,.quick-truth{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;margin-top:1.25rem;padding:1.2rem 1.35rem;border:1px solid var(--border-color,rgba(80,120,170,.22));border-radius:var(--radius-lg,18px);background:var(--surface-primary,#fff)}
.start-core-state>div{max-width:32rem}.start-core-state h2{margin:.2rem 0}.start-core-state p{margin:.35rem 0;color:var(--text-secondary,#52667f)}.start-core-state ul{display:flex;flex-wrap:wrap;gap:.6rem;margin:0;padding:0;list-style:none}.start-core-state li{display:flex;flex-direction:column;padding:.55rem .7rem;border-radius:.7rem;background:var(--surface-secondary,#edf4ff);font-size:.72rem}.start-core-state li span{color:var(--text-secondary,#52667f)}
.start-support-actions{display:flex;flex-wrap:wrap;gap:.65rem;justify-content:flex-end}.start-support-panel p{margin:.25rem 0;color:var(--text-secondary,#52667f)}
.quick-tools-page{display:grid;gap:1.25rem}.quick-truth{justify-content:flex-start;margin:0}.quick-truth>span{display:grid;place-items:center;flex:0 0 2rem;height:2rem;border-radius:50%;background:var(--surface-secondary,#edf4ff);font-weight:900}.quick-truth p{margin:.25rem 0 0;color:var(--text-secondary,#52667f)}
.today-actions{display:grid;gap:1rem;margin:0 0 1.25rem}.today-actions>header h2{margin:.25rem 0}.today-actions>header p{margin:0;color:var(--text-secondary,#52667f)}.today-action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.today-action-card{display:grid;align-content:start;gap:.75rem;padding:1.1rem;border:1px solid var(--border-color,rgba(80,120,170,.22));border-inline-start:4px solid var(--warning,#e6a700);border-radius:var(--radius-lg,18px);background:var(--surface-primary,#fff)}.today-action-card.is-high{border-inline-start-color:var(--danger,#d23b4c)}.today-action-card h3{margin:.2rem 0}.today-action-card p,.today-action-card small{margin:0;color:var(--text-secondary,#52667f)}.today-action-card>div>span{font-size:.68rem;font-weight:900;text-transform:uppercase}.today-action-card .btn{width:max-content;margin-top:auto}
.protection-overview{display:grid;gap:1rem;margin:0 0 1.25rem;padding:1.2rem;border:1px solid var(--border-color,rgba(80,120,170,.22));border-radius:var(--radius-lg,18px);background:var(--surface-primary,#fff)}.protection-overview>header h2{margin:.2rem 0}.protection-overview>header p,.protection-next-step p{margin:.2rem 0;color:var(--text-secondary,#52667f)}.protection-state-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.protection-state-grid article{display:grid;gap:.25rem;padding:.9rem;border-radius:.8rem;background:var(--surface-secondary,#edf4ff)}.protection-state-grid span,.protection-state-grid small{font-size:.7rem;color:var(--text-muted,#70829a)}.protection-state-grid strong{font-size:1.25rem}.protection-next-step{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:.9rem;border-top:1px solid var(--border-color,rgba(80,120,170,.18))}
.protection-expert{margin:0 0 1.25rem;padding:1rem;border:1px solid var(--border-color,rgba(80,120,170,.22));border-radius:var(--radius-lg,18px);background:var(--surface-primary,#fff)}.protection-expert>summary{cursor:pointer;font-weight:850}.protection-expert>div{display:grid;gap:1rem;margin-top:1rem}
.quick-tool-picker>header,.quick-results>header{margin-bottom:1rem}.quick-tool-picker>header span,.quick-results>header span{font-size:.72rem;font-weight:900;letter-spacing:.11em;color:var(--primary,#2178ff)}.quick-tool-picker h2,.quick-results h2{margin:.3rem 0}
.quick-tool-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.quick-tool-card{display:block;text-decoration:none;color:inherit;min-height:12rem;transition:transform .18s ease,border-color .18s ease}.quick-tool-card:hover,.quick-tool-card:focus-visible,.quick-tool-card.is-selected{transform:translateY(-2px);border-color:var(--primary,#2178ff);outline:none}.quick-tool-card>span{font-size:.72rem;font-weight:900;color:var(--primary,#2178ff)}.quick-tool-card small{display:block;color:var(--text-muted,#70829a);line-height:1.45}
.quick-tool-contract{display:grid;gap:.3rem;margin:.75rem 0;padding:0;list-style:none;color:var(--text-secondary,#52667f);font-size:.78rem;line-height:1.45}.quick-tool-contract strong{color:var(--text-primary,#19324f)}
.quick-workspace-grid{display:grid;grid-template-columns:minmax(17rem,.72fr) minmax(22rem,1.28fr);gap:1rem}.quick-project-form,.quick-draft-panel .stack-form{display:grid;gap:.85rem}.quick-workspace-grid label,.quick-link-site label{display:grid;gap:.4rem;font-size:.8rem;font-weight:800}.quick-workspace-grid input,.quick-workspace-grid select,.quick-workspace-grid textarea,.quick-link-site select,.admin-support-status-form select{width:100%;min-height:44px;padding:.7rem .8rem;border:1px solid var(--border-color,rgba(80,120,170,.3));border-radius:.7rem;background:var(--surface-primary,#fff);color:var(--text-primary,#10233f)}
.quick-provider-blocked{padding:.85rem 1rem;border-inline-start:4px solid var(--warning,#e6a700);border-radius:.6rem;background:rgba(230,167,0,.08)}.quick-provider-blocked p{margin:.25rem 0 0;color:var(--text-secondary,#52667f)}
.quick-project-state{display:flex;flex-direction:column;gap:.8rem}.quick-link-site{display:flex;align-items:end;gap:.75rem}.quick-link-site label{flex:1}
.quick-results-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-result-card>header{display:flex;justify-content:space-between;gap:.75rem}.quick-result-card h3{margin:.15rem 0}.quick-result-card header span{font-size:.72rem;font-weight:900;color:var(--primary,#2178ff)}.quick-status{height:max-content;padding:.35rem .55rem;border-radius:999px;background:var(--surface-secondary,#edf4ff);font-size:.68rem;font-style:normal;font-weight:900;white-space:nowrap}.quick-status--manual_required{background:rgba(230,167,0,.12);color:#9b6400}.quick-status--ready_for_review{background:rgba(18,158,112,.12);color:#087a55}.quick-result-meta{display:flex;flex-wrap:wrap;gap:.45rem .8rem;margin:.8rem 0;padding:.65rem 0;border-block:1px solid var(--border-color,rgba(80,120,170,.18));font-size:.68rem;color:var(--text-muted,#70829a)}.quick-result-body{max-height:28rem;overflow:auto;font-size:.78rem;line-height:1.55}.quick-output-list{display:grid;gap:.35rem;margin:.35rem 0;padding-inline-start:1rem}.quick-result-card footer{margin-top:.8rem;padding-top:.7rem;border-top:1px solid var(--border-color,rgba(80,120,170,.18));font-size:.7rem;color:var(--text-muted,#70829a)}
.quick-admin-scope{display:flex;align-items:end;gap:.75rem}.quick-admin-scope label{display:grid;flex:1;gap:.4rem;font-size:.8rem;font-weight:800}.quick-admin-scope select{width:100%;min-height:44px}.quick-result-export{margin-top:.8rem}.quick-result-export summary{cursor:pointer;font-size:.75rem;font-weight:850}.quick-result-export pre{max-height:24rem;overflow:auto;padding:.75rem;border-radius:.65rem;background:var(--surface-secondary,#edf4ff);font-size:.7rem;white-space:pre-wrap}.quick-result-export>div{display:flex;gap:.5rem;flex-wrap:wrap}
.support-channel-section,.callback-section{padding:clamp(3rem,7vw,6rem) 0}.support-channel-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.support-channel-grid article>span{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:.8rem;background:var(--surface-secondary,#edf4ff);color:var(--primary,#2178ff);font-weight:900}.support-channel-grid article small{display:block;margin-top:.75rem;color:var(--text-muted,#70829a);line-height:1.4}.callback-section{background:var(--surface-secondary,#f2f7ff)}.callback-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(20rem,1.15fr);align-items:start;gap:clamp(1.5rem,5vw,4rem)}.callback-layout>div>ul{display:grid;gap:.6rem;padding-inline-start:1.15rem;color:var(--text-secondary,#52667f)}.callback-consent{display:flex!important;grid-template-columns:none!important;align-items:flex-start;gap:.65rem;line-height:1.45}.callback-consent input{flex:0 0 auto;margin-top:.2rem}
.auth-support-actions{display:flex;align-items:center;justify-content:center;gap:1rem;max-width:64rem;margin:0 auto 1.5rem;padding:1rem;border:1px solid var(--border-color,rgba(80,120,170,.22));border-radius:1rem;background:var(--surface-primary,#fff)}.auth-support-actions>span{font-weight:850}.auth-support-actions>div{display:flex;flex-wrap:wrap;gap:.5rem}.auth-support-actions a{display:inline-flex;align-items:center;min-height:44px;padding:.55rem .75rem;border-radius:.7rem;background:var(--surface-secondary,#edf4ff);color:var(--text-primary,#10233f);font-size:.76rem;font-weight:800;text-decoration:none}
.footer-grid{grid-template-columns:1.3fr repeat(4,minmax(0,1fr))}.footer-support{min-width:0}.admin-support-status-form{display:flex;gap:.45rem;align-items:center}.admin-support-status-form select{min-width:9rem}.admin-support-page .data-table td{vertical-align:top}
.app-bottom-nav{display:none}
.connection-status{position:fixed;z-index:10000;left:50%;inset-block-end:calc(1rem + env(safe-area-inset-bottom));max-width:min(32rem,calc(100vw - 2rem));transform:translateX(-50%);padding:.65rem 1rem;border-radius:999px;background:#7f1d1d;color:#fff;font:700 .8rem/1.25 system-ui,sans-serif;text-align:center;box-shadow:0 8px 24px #0004}.pwa-installed-status{background:#087a55}.pwa-install-prompt{position:fixed;z-index:9990;left:50%;inset-block-end:calc(1rem + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:1rem;width:min(38rem,calc(100vw - 2rem));transform:translateX(-50%);padding:.85rem 1rem;border:1px solid var(--border-color,rgba(80,120,170,.3));border-radius:1rem;background:var(--surface-primary,#fff);color:var(--text-primary,#10233f);box-shadow:0 14px 38px rgba(13,39,73,.2)}.pwa-install-prompt>div:first-child{display:grid;gap:.2rem}.pwa-install-prompt span{color:var(--text-secondary,#52667f);font-size:.76rem}.pwa-install-prompt>div:last-child{display:flex;flex:0 0 auto;gap:.45rem}
@media(max-width:1100px){.quick-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.start-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-brand{grid-column:1/-1}}
@media(max-width:760px){.app-support-link,.marketing-support-link{display:none}.app-main{padding-bottom:calc(5.4rem + env(safe-area-inset-bottom))}.app-bottom-nav{position:fixed;z-index:90;inset-inline:0;inset-block-end:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:.45rem max(.45rem,env(safe-area-inset-right)) calc(.45rem + env(safe-area-inset-bottom)) max(.45rem,env(safe-area-inset-left));border-top:1px solid var(--border-color,rgba(80,120,170,.22));background:color-mix(in srgb,var(--surface-primary,#fff) 94%,transparent);box-shadow:0 -10px 28px rgba(13,39,73,.12);backdrop-filter:blur(16px)}.app-bottom-nav a{display:flex;min-width:0;min-height:48px;align-items:center;justify-content:center;flex-direction:column;gap:.2rem;padding:.25rem;border-radius:.7rem;color:var(--text-muted,#70829a);font-size:.62rem;font-weight:800;text-align:center;text-decoration:none}.app-bottom-nav a[aria-current="page"],.app-bottom-nav a:focus-visible{background:var(--surface-secondary,#edf4ff);color:var(--primary,#2178ff);outline:2px solid transparent}.app-bottom-nav svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.start-choice-grid,.quick-tool-grid,.quick-results-grid,.support-channel-grid,.quick-workspace-grid,.callback-layout{grid-template-columns:1fr}.start-core-state,.start-support-panel{align-items:flex-start;flex-direction:column}.start-support-actions{justify-content:flex-start;width:100%}.start-support-actions .btn{width:100%;justify-content:center;min-height:48px}.quick-link-site{align-items:stretch;flex-direction:column}.quick-tool-card{min-height:auto}.auth-support-actions{align-items:stretch;flex-direction:column;margin:0 1rem calc(1rem + env(safe-area-inset-bottom));}.auth-support-actions>div{display:grid;grid-template-columns:1fr 1fr}.auth-support-actions a{justify-content:center;text-align:center;min-height:48px}.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}.admin-support-status-form{align-items:stretch;flex-direction:column}.hero-actions{flex-wrap:wrap}}
@media(max-width:360px){.auth-support-actions>div{grid-template-columns:1fr}.start-choice-card,.quick-tool-card,.quick-result-card{padding:1rem}.quick-tools-page .page-hero-actions{width:100%}.quick-tools-page .page-hero-actions .btn{width:100%;justify-content:center}}
@media(prefers-reduced-motion:reduce){.quick-tool-card{transition:none}.quick-tool-card:hover,.quick-tool-card:focus-visible{transform:none}}
@media(max-width:760px){.app-bottom-nav{grid-template-columns:repeat(5,minmax(0,1fr))}.app-bottom-nav button{display:flex;min-width:0;min-height:48px;align-items:center;justify-content:center;flex-direction:column;gap:.2rem;padding:.25rem;border:0;border-radius:.7rem;background:transparent;color:var(--text-muted,#70829a);font-family:inherit;font-size:.62rem;font-weight:800;line-height:1.2;text-align:center}.app-bottom-nav button:focus-visible{background:var(--surface-secondary,#edf4ff);color:var(--primary,#2178ff);outline:2px solid transparent}}
@media(max-width:760px){.app-body .connection-status,.app-body .pwa-install-prompt{inset-block-end:calc(6.4rem + env(safe-area-inset-bottom))}.pwa-install-prompt{align-items:stretch;flex-direction:column;border-radius:.9rem}.pwa-install-prompt>div:last-child{display:grid;grid-template-columns:1fr 1fr}.pwa-install-prompt .btn{min-height:44px;justify-content:center}}
@media(max-width:760px){.today-action-grid,.protection-state-grid{grid-template-columns:1fr}.protection-next-step{align-items:stretch;flex-direction:column}.quick-result-export pre{max-height:18rem;overflow:auto}}

/* === ARAWN GUARD CANONICAL TOKEN & COMPONENT CONTRACT ===
 * Evidence colors: blue=first-party measurement, amber=review,
 * coral=risk candidate, green=verified read-back, navy=evidence surface.
 */
:root {
    color-scheme: light;
    --arawn-color-measurement: #1d4ed8;
    --arawn-color-review: #805400;
    --arawn-color-risk: #a51f38;
    --arawn-color-verified: #067047;
    --arawn-color-evidence: #14223a;
    --arawn-color-copy: #52667f;
    --arawn-color-muted: #52667f;
    --arawn-surface: #ffffff;
    --arawn-surface-soft: #edf4ff;
    --arawn-line: #cad8e9;
    --arawn-radius-control: 10px;
    --arawn-radius-card: 16px;
    --arawn-space-1: .25rem;
    --arawn-space-2: .5rem;
    --arawn-space-3: .75rem;
    --arawn-space-4: 1rem;
    --arawn-space-6: 1.5rem;
    --primary: var(--arawn-color-measurement);
    --accent-primary: var(--arawn-color-measurement);
    --text-secondary: var(--arawn-color-copy);
    --text-muted: var(--arawn-color-muted);
    --surface-primary: var(--arawn-surface);
    --surface-secondary: var(--arawn-surface-soft);
    --app-blue: var(--arawn-color-measurement);
    --app-copy: var(--arawn-color-copy);
    --app-muted: #5f6f85;
}

.marketing-page,
.auth-page {
    --public-blue: var(--arawn-color-measurement);
    --public-copy: var(--arawn-color-copy);
    --public-muted: var(--arawn-color-muted);
    --cg-blue: var(--arawn-color-measurement);
    --cg-copy: var(--arawn-color-copy);
    --cg-muted: var(--arawn-color-muted);
    --ag-blue: var(--arawn-color-measurement);
    --ag-copy: var(--arawn-color-copy);
    --ag-muted: var(--arawn-color-muted);
}

[data-theme="dark"] {
    color-scheme: dark;
    --arawn-color-measurement: #8bb7ff;
    --arawn-color-review: #ffd37a;
    --arawn-color-risk: #ff9bab;
    --arawn-color-verified: #72ddb2;
    --arawn-color-evidence: #f3f7ff;
    --arawn-color-copy: #b9c7d8;
    --arawn-color-muted: #a9b8cc;
    --arawn-surface: #111d31;
    --arawn-surface-soft: #172b4d;
    --arawn-line: #344963;
}

.status-badge.active,
.status-badge.safe,
.alert-success,
.badge-mode-live,
.badge-status-connected { color: var(--arawn-color-verified); }

.status-badge.monitor,
.badge-mode-mock,
.badge-status-pending { color: var(--arawn-color-review); }

.status-badge.suspicious,
.status-badge.high_risk,
.alert-error,
.btn-danger { color: var(--arawn-color-risk); }

.btn-success { color: var(--arawn-color-verified); }
.btn-info { color: #315b8a; }

html,
body { max-width: 100%; overflow-x: clip; }

.table-responsive {
    max-width: 100%;
    overscroll-behavior-inline: contain;
    scrollbar-gutter: stable;
}

.table-responsive:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--arawn-color-measurement) 52%, transparent);
    outline-offset: 3px;
}

:is(.btn, button, input, select, textarea, summary, a[href]):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--arawn-color-measurement) 52%, transparent);
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

@media (forced-colors: active) {
    :is(.btn, button, input, select, textarea, summary, a[href], .card, .app-panel) {
        border-color: CanvasText;
    }
    :is(.status-badge, .badge, .status-pill, .health-state) {
        border: 1px solid currentColor;
    }
}

/* === CLICKTIDY BRAND === */
.marketing-logo > span, .app-brand strong { color: #0F172A; font-weight: 850; letter-spacing: -.04em; }
.marketing-logo > span > span, .app-brand strong > span { color: #2563EB; }
.brand-logo-mark { filter: none; }
.btn-primary { background: #2563EB; border-color: #2563EB; }
.btn-primary:hover { background: #1D4ED8; border-color: #1D4ED8; }
.marketing-eyebrow i { background: #22C55E; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .marketing-logo > span, :root:not([data-theme="light"]) .app-brand strong { color: #F8FAFC; } }
:root[data-theme="dark"] .marketing-logo > span, :root[data-theme="dark"] .app-brand strong { color: #F8FAFC; }
/* ct-nav-nowrap */
.marketing-nav-links a { white-space: nowrap; }
.marketing-logo { flex: 0 0 auto; }
/* ct-header-nowrap */
.marketing-header .btn, .marketing-header a { white-space: nowrap; }
.marketing-nav { gap: 14px; }
/* ct-perf: backdrop blur is expensive on scroll; public pages use solid surfaces */
.marketing-page *, .marketing-page *::before, .marketing-page *::after { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
.marketing-page .marketing-header { background: #fff !important; }

/* ct-mobile-nav: logo left, CTA centered, menu toggle far right */
@media (max-width:1120px) {
  .marketing-header .marketing-nav { display:grid !important; grid-template-columns:1fr auto 1fr; align-items:center; column-gap:10px; }
  .marketing-header .marketing-logo { grid-column:1; grid-row:1; justify-self:start; }
  .marketing-header .marketing-nav-actions { grid-column:2; grid-row:1; justify-self:center; margin:0 !important; }
  .marketing-header .mobile-nav-toggle { grid-column:3; grid-row:1; justify-self:end; margin:0 !important; }
  .marketing-header .marketing-nav-links { grid-column:1 / -1; }
}
@media (max-width:420px) {
  .marketing-header .marketing-logo > span { font-size:1.02rem; }
  .marketing-header .marketing-logo img { width:32px; height:32px; }
  .marketing-header .marketing-nav-cta { padding-inline:14px; font-size:.86rem; }
}