.dashboard-page { padding: 60px 0; max-width: 800px; margin: 0 auto; }
        .dashboard-page h1 { font-family: 'Shrikhand', cursive; font-size: 3rem; color: var(--accent-orange); text-shadow: 4px 4px 0 var(--border); margin-bottom: 12px; }
        .dash-greeting { font-family: 'Kalam', cursive; font-weight: 700; font-size: 1.4rem; margin-bottom: 32px; }
        .dash-card { background: var(--surface); border: 4px solid var(--border); padding: 28px; box-shadow: 8px 8px 0 var(--accent-blue); margin-bottom: 24px; }
        .dash-card h2 { font-family: 'Kalam', cursive; font-size: 1.5rem; font-weight: 700; margin-bottom: 16px; }
        .key-display-row { display: flex; gap: 0; margin-bottom: 16px; }
        .key-text { flex: 1; min-width: 0; padding: 14px 16px; font-family: 'JetBrains Mono', monospace; font-size: 0.95rem; font-weight: 600; background: #2d2a2e; color: #a6e22e; border: 3px solid var(--border); border-right: none; overflow-wrap: anywhere; position: relative; }
        .key-text.hidden-key { color: #a8a8a8; user-select: none; }
        .key-btn { padding: 14px 20px; font-family: 'Kalam', cursive; font-size: 1.1rem; font-weight: 700; border: 3px solid var(--border); cursor: pointer; box-shadow: 3px 3px 0 var(--border); transition: transform 0.1s; white-space: nowrap; }
        .key-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--border); }
        .key-copy { background: var(--accent-green); border-left: none; }
        .key-toggle { background: var(--accent-blue); }
        .key-regenerate { background: #ffff00; }
        .key-actions { display: flex; gap: 12px; flex-wrap: wrap; }
        .regenerate-warning { display: none; padding: 16px; background: #ff6b6b; border: 3px solid var(--border); box-shadow: 4px 4px 0 var(--border); font-weight: 700; margin-top: 16px; transform: rotate(-0.5deg); }
        .regenerate-warning .regen-btns { margin-top: 12px; display: flex; gap: 12px; }
        .dash-meta { font-weight: 600; font-size: 1rem; color: var(--text-secondary); margin-bottom: 8px; }
        .dash-meta code { background: var(--accent-pink); padding: 2px 6px; border: 2px solid var(--border); font-family: 'JetBrains Mono', monospace; font-weight: 700; }
        .usage-card { box-shadow: 8px 8px 0 var(--accent-green); }
        .usage-card p { font-weight: 600; font-size: 1.05rem; background: var(--bg-primary); padding: 12px 16px; border: 2px solid var(--border); margin-bottom: 8px; }
        .usage-card p code { background: var(--accent-pink); padding: 2px 6px; border: 2px solid var(--border); font-family: 'JetBrains Mono', monospace; font-weight: 700; }
        .consent-card { box-shadow: 8px 8px 0 var(--accent-pink); }
        .consent-status { display: inline-block; padding: 8px 18px; font-family: 'Kalam', cursive; font-weight: 700; font-size: 1rem; border: 3px solid var(--border); box-shadow: 3px 3px 0 var(--border); margin-right: 12px; margin-bottom: 12px; }
        .consent-status.in { background: var(--accent-green); }
        .consent-status.out { background: #d4d4d4; }
        .consent-actions { margin-top: 14px; display: flex; gap: 12px; flex-wrap: wrap; }
        .consent-actions a { display: inline-block; padding: 12px 22px; font-family: 'Kalam', cursive; font-size: 1.1rem; font-weight: 700; background: var(--accent-blue); border: 3px solid var(--border); box-shadow: 3px 3px 0 var(--border); text-decoration: none; color: var(--text-primary); }
        .training-card { box-shadow: 8px 8px 0 var(--accent-green); }
        .training-warning { background: #fff3a0; border: 2px solid var(--accent-orange); padding: 12px 14px; margin-top: 12px; font-weight: 600; }
        .dsar-card { box-shadow: 8px 8px 0 var(--accent-blue); }
        .dsar-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
        .dsar-btn { padding: 12px 20px; font-family: 'Kalam', cursive; font-size: 1.05rem; font-weight: 700; border: 3px solid var(--border); box-shadow: 3px 3px 0 var(--border); cursor: pointer; transition: transform 0.1s; background: var(--surface); }
        .dsar-btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--border); }
        .dsar-btn.danger { background: #ff6b6b; }
        .delete-warning { display: none; padding: 18px; background: #ff6b6b; border: 3px solid var(--border); box-shadow: 4px 4px 0 var(--border); font-weight: 700; margin-top: 14px; }
        .delete-warning .delete-btns { margin-top: 14px; display: flex; gap: 12px; }
        .logout-section { margin-top: 32px; text-align: right; }
        .logout-btn { background: var(--surface); padding: 12px 24px; font-family: 'Kalam', cursive; font-size: 1.2rem; font-weight: 700; border: 3px solid var(--border); box-shadow: var(--shadow); cursor: pointer; }
        .logout-btn:active { transform: translate(4px, 4px); box-shadow: 2px 2px 0 var(--border); }
        .key-btn, .dsar-btn, .logout-btn, .consent-actions a { transition: transform 180ms cubic-bezier(0.2, 1.3, 0.45, 1), box-shadow 180ms ease-out; }
        .key-btn:not(:disabled):is(:hover, :focus-visible):not(:active),
        .dsar-btn:not(:disabled):is(:hover, :focus-visible):not(:active),
        .consent-actions a:is(:hover, :focus-visible):not(:active) { transform: translateY(-3px) rotate(1deg); box-shadow: 4px 5px 0 var(--border); }
        .logout-btn:is(:hover, :focus-visible):not(:active) { transform: translateY(-3px) rotate(1deg); box-shadow: 7px 9px 0 var(--border); }
        @media (prefers-reduced-motion: reduce) {
            .key-btn, .dsar-btn, .logout-btn, .consent-actions a { transition: none; }
            .key-btn:not(:disabled):is(:hover, :focus-visible):not(:active),
            .dsar-btn:not(:disabled):is(:hover, :focus-visible):not(:active),
            .consent-actions a:is(:hover, :focus-visible):not(:active),
            .logout-btn:is(:hover, :focus-visible):not(:active) { transform: none; }
        }
        .loading-state { text-align: center; padding: 80px 0; font-family: 'Kalam', cursive; font-size: 1.6rem; font-weight: 700; }
        .not-logged-in { text-align: center; padding: 80px 0; }
        .not-logged-in h2 { font-family: 'Shrikhand', cursive; font-size: 2rem; margin-bottom: 16px; }
        .not-logged-in p { font-weight: 600; font-size: 1.1rem; margin-bottom: 24px; }
        @media (max-width: 640px) {
            .dashboard-page { padding-block: 48px; }
            .dashboard-page h1 { font-size: 2.4rem; }
            .dash-card { padding: 18px; }
            .key-display-row { flex-direction: column; align-items: stretch; }
            .key-text { border-right: 3px solid var(--border); }
            .key-display-row .key-copy { align-self: flex-start; }
            .regenerate-warning .regen-btns, .delete-warning .delete-btns { flex-wrap: wrap; }
            .dash-meta, .usage-card p { overflow-wrap: anywhere; }
        }

/* Account navigation follows the public site's existing design tokens. */
[hidden] { display: none !important; }
.dashboard-container { max-width: 1200px; }
.dashboard-page { max-width: none; padding: 40px 0 64px; }
.dashboard-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.dashboard-heading h1 { font-size: 2.7rem; }
.dashboard-heading .dash-greeting { margin-bottom: 24px; }
.dashboard-help { margin-bottom: 24px; flex-shrink: 0; }
.dsar-btn { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; color: var(--text-primary); }
.compact-action { margin-top: 16px; padding: 8px 12px; font-size: .95rem; }
.dashboard-layout { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 32px; align-items: start; }
.dashboard-nav { display: flex; flex-direction: column; gap: 8px; position: sticky; top: 110px; padding-bottom: 8px; }
.dashboard-nav a { text-decoration: none; color: var(--text-primary); font-weight: 700; padding: 10px 14px; border: 3px solid transparent; }
.dashboard-nav a:hover, .dashboard-nav a:focus-visible { border-color: var(--border); }
.dashboard-nav a[aria-current="page"] { background: var(--accent-orange); color: #111; border-color: var(--border); box-shadow: 4px 4px 0 var(--border); }
.dashboard-content, .dashboard-panel { min-width: 0; }
.dashboard-panel > h2, .section-toolbar h2 { font-family: 'Kalam', cursive; font-size: 2rem; margin: 0 0 8px; }
.section-intro { color: var(--text-secondary); margin-bottom: 24px; font-weight: 600; }
.dash-card h3 { font-family: 'Kalam', cursive; font-size: 1.5rem; margin-bottom: 12px; }
.dash-card { padding: 24px; }
.summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; }
.summary-tile { padding: 18px; background: var(--surface); border: 3px solid var(--border); box-shadow: 4px 4px 0 var(--accent-blue); min-width: 0; }
.summary-tile span, .summary-tile small { display: block; color: var(--text-secondary); font-weight: 600; }
.summary-tile strong { display: block; font: 700 1.7rem 'Kalam', cursive; overflow-wrap: anywhere; margin: 6px 0; }
.summary-tile a { color: var(--text-primary); font-weight: 700; }
.access-ready { color: var(--text-primary); }
.dashboard-shortcuts { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 18px; }
.dashboard-shortcuts a { color: var(--text-primary); text-decoration: none; }
.section-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.section-toolbar > div { display: flex; gap: 10px; flex-wrap: wrap; }
.section-toolbar select, .package-select { padding: 10px 12px; background: var(--surface); color: var(--text-primary); border: 3px solid var(--border); box-shadow: 4px 4px 0 var(--border); font: inherit; font-weight: 700; max-width: 100%; cursor: pointer; }
.dashboard-disclosure { margin: 20px 0; }
.dashboard-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 16px; border: 3px solid var(--border); background: var(--surface); color: var(--text-primary); box-shadow: 4px 4px 0 var(--border); cursor: pointer; user-select: none; font-weight: 700; list-style: none; }
.dashboard-disclosure > summary::-webkit-details-marker { display: none; }
.dashboard-disclosure > summary::after { content: '+'; font-size: 1.5rem; line-height: 1; flex-shrink: 0; }
.dashboard-disclosure[open] > summary { background: var(--accent-blue); color: var(--on-accent); margin-bottom: 18px; }
.dashboard-disclosure[open] > summary::after { content: '−'; }
.dashboard-disclosure > p { margin: 14px 0; }
.dashboard-disclosure > summary, .section-toolbar select, .package-select { transition: transform 180ms cubic-bezier(.2,1.3,.45,1), box-shadow 180ms ease-out, background 150ms; }
.dashboard-disclosure > summary:is(:hover, :focus-visible):not(:active), .section-toolbar select:is(:hover, :focus-visible):not(:active), .package-select:is(:hover, :focus-visible):not(:active) { transform: translateY(-3px) rotate(-1deg); box-shadow: 6px 7px 0 var(--border); }
.dashboard-disclosure > summary:active, .section-toolbar select:active, .package-select:active { transform: translate(3px,3px); box-shadow: 1px 1px 0 var(--border); }
.dashboard-disclosure > summary:focus-visible, .section-toolbar select:focus-visible, .package-select:focus-visible, .dsar-btn:focus-visible { outline: 3px solid var(--accent-orange); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
 .dashboard-disclosure > summary, .section-toolbar select, .package-select { transition: none; transform: none !important; }
}
.usage-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 24px; }
.usage-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
.usage-chart-grid .dash-card { padding: 18px; }
.usage-chart { display: grid; grid-template-columns: 38px minmax(0,1fr); grid-template-rows: 170px auto; column-gap: 8px; row-gap: 7px; padding-top: 12px; }
.usage-y-axis { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; justify-content: space-between; padding: 24px 0 2px; color: var(--text-muted); font: .7rem 'JetBrains Mono', monospace; text-align: right; }
.usage-chart-plot { grid-column: 2; grid-row: 1; display: flex; align-items: stretch; gap: 3px; min-width: 0; height: 170px; border-left: 1px solid var(--border); border-bottom: 2px solid var(--border); padding-top: 24px; }
.usage-x-axis { grid-column: 2; grid-row: 2; display: flex; justify-content: space-between; gap: 8px; color: var(--text-muted); font: .7rem 'JetBrains Mono', monospace; }
.usage-x-axis span { white-space: nowrap; }
.usage-bar { flex: 1; min-width: 0; position: relative; display: flex; align-items: flex-end; outline-offset: 2px; }
.usage-bar-fill { width: 100%; background: var(--accent-blue); border: 1px solid var(--border); min-height: 2px; }
#tokens-chart .usage-bar-fill { background: var(--accent-green); }
.usage-bar:focus .usage-tooltip, .usage-bar:hover .usage-tooltip { display: block; }
.usage-tooltip { display: none; position: absolute; z-index: 3; bottom: 100%; left: 50%; transform: translateX(-50%); background: var(--surface); color: var(--text-primary); border: 2px solid var(--border); padding: 6px; font-size: .75rem; white-space: nowrap; pointer-events: none; }
.usage-bar:first-child .usage-tooltip { left: 0; transform: none; }
.usage-bar:last-child .usage-tooltip { left: auto; right: 0; transform: none; }
.dashboard-table-scroll { overflow-x: auto; max-width: 100%; margin-top: 12px; }
.dashboard-table-scroll table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.dashboard-table-scroll th, .dashboard-table-scroll td { text-align: right; padding: 10px; border-bottom: 2px solid var(--border); white-space: nowrap; }
.dashboard-table-scroll th:first-child, .dashboard-table-scroll td:first-child { text-align: left; }
.dashboard-table-scroll th { background: var(--bg-primary); }
.dashboard-table-scroll td:first-child { white-space: normal; overflow-wrap: anywhere; min-width: 120px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.integration-heading { display:flex; align-items:center; gap:16px; margin-bottom:16px; }
.integration-heading img { object-fit:contain; flex-shrink:0; }
.integration-heading h3, .integration-heading h4 { margin:0; overflow-wrap:anywhere; }
.featured-integration p { margin-bottom:12px; }
.app-form { display:grid; gap:10px; }
.app-card.is-editing { border-color:var(--accent-blue); }
.app-card.is-editing > :not(.integration-heading):not(.app-editor) { display:none; }
.app-card.is-private:not(.is-editing) { border-color:#7651d6; border-inline-start-width:7px; background:color-mix(in srgb, #a98bff 8%, var(--surface)); box-shadow:6px 6px 0 #9b7af2; }
.app-card-title { flex:1; }
.app-status.status-disabled, .app-status.status-suspended { background:#ffb3a7; }
.app-visibility { display:inline-flex; align-items:center; padding:3px 9px; border:2px solid var(--border); background:color-mix(in srgb, var(--accent-blue) 28%, var(--surface)); color:var(--text-primary); font-size:.78rem; font-weight:700; }
.app-visibility.is-private { background:#d8caff; color:#2b1853; border-color:#7651d6; }
.app-card > .app-editor { margin-top:18px; padding-top:18px; border-top:3px solid var(--border); }
.app-editor h3 { margin-bottom:16px; }
.app-form label { font-weight:700; }
.app-form input:not([type=checkbox]):not([type=radio]), .app-form textarea { width:100%; min-width:0; padding:12px; background:var(--bg-primary); color:var(--text-primary); border:3px solid var(--border); font:inherit; }
.app-form input:focus-visible, .app-form textarea:focus-visible { outline:3px solid var(--accent-orange); outline-offset:3px; }
.app-form input[type=file] { overflow:hidden; }
.app-form input[type=file].sr-only { width:1px; height:1px; padding:0; border:0; }
.app-identity-layout { display:grid; grid-template-columns:96px minmax(0,1fr); gap:16px; align-items:start; }
.app-logo-editor { display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; }
.app-logo-trigger { position:relative; display:grid; place-items:center; width:80px; height:80px; padding:0; overflow:hidden; border:2px solid var(--border); background:var(--bg-primary); color:var(--text-secondary); font:inherit; cursor:pointer; }
.app-logo-trigger img { width:100%; height:100%; object-fit:contain; }
.app-logo-trigger #app-logo-empty { padding:4px; font-size:.76rem; text-align:center; }
.app-logo-edit-hint { position:absolute; inset:auto 0 0; padding:4px; background:rgba(0,0,0,.72); color:#fff; font-size:.7rem; text-align:center; opacity:.88; transition:opacity .15s; }
.app-logo-trigger:hover .app-logo-edit-hint, .app-logo-trigger:focus-visible .app-logo-edit-hint { opacity:1; }
.app-logo-trigger:focus-visible { outline:3px solid var(--accent-orange); outline-offset:3px; }
.app-logo-clear { margin:0; padding:4px 8px; font-size:.76rem; }
.app-logo-clear[hidden] { display:none !important; }
.app-logo-help { grid-column:1 / -1; max-width:none; margin:0; font-size:.74rem; line-height:1.35; }
.app-identity-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 14px; align-content:start; min-width:0; }
.app-field { display:grid; gap:5px; min-width:0; }
.app-field label { margin:0; }
.app-description-field textarea { resize:vertical; }
.app-security-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; align-items:start; }
.app-checkbox { display:flex; align-items:center; gap:10px; }
.app-options { margin:0; padding:10px 12px; border:2px solid var(--border); background:color-mix(in srgb,var(--bg-primary) 55%,var(--surface)); min-width:0; }
.app-options legend { margin-bottom:8px; padding:0 4px; font-weight:700; }
.app-choice-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:7px; margin-bottom:8px; }
.app-choice { display:flex; position:relative; padding:9px 34px 9px 10px; border:2px solid var(--border); box-shadow:2px 2px 0 var(--border); background:var(--bg-primary); cursor:pointer; min-width:0; }
.app-choice input { position:absolute; width:1px; height:1px; opacity:0; }
.app-choice strong, .app-choice .dash-meta { display:block; }
.app-choice .dash-meta { margin-top:3px; font-size:.82rem; font-weight:500; line-height:1.35; }
.app-choice::after { content:'○'; position:absolute; right:10px; top:50%; transform:translateY(-50%); font-size:1.05rem; }
.app-choice:has(input:checked) { border-color:var(--accent-blue); background:color-mix(in srgb,var(--accent-blue) 12%,var(--surface)); box-shadow:2px 2px 0 var(--accent-blue); }
.app-choice:has(input:checked)::after { content:'✓'; }
.app-choice.is-owner-only:has(input:checked) { border-color:#9b7af2; background:color-mix(in srgb,#9b7af2 15%,var(--surface)); box-shadow:2px 2px 0 #9b7af2; }
.app-choice.is-secret-required:has(input:checked) { border-color:var(--accent-orange); background:color-mix(in srgb,var(--accent-orange) 12%,var(--surface)); box-shadow:2px 2px 0 var(--accent-orange); }
.app-choice:has(input:focus-visible) { outline:2px solid var(--accent-orange); outline-offset:2px; }
.app-secret-panel { padding:12px; border:2px solid var(--border); background:color-mix(in srgb,var(--accent-blue) 6%,var(--surface)); }
.app-secret-panel #app-secret-status { margin:10px 0; font-weight:600; }
.app-secret-controls { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.app-secret-controls .dsar-btn { margin:0; }
.app-secret-panel [hidden], .app-secret-panel[hidden] { display:none !important; }
.app-auth-badge { display:inline-flex; padding:3px 9px; border:2px solid var(--accent-orange); background:color-mix(in srgb,var(--accent-orange) 12%,var(--surface)); font-size:.78rem; font-weight:700; }
@media(max-width:760px) { .app-security-options { grid-template-columns:minmax(0,1fr); } }
@media(max-width:600px) {
 .app-identity-layout { grid-template-columns:76px minmax(0,1fr); gap:12px; }
 .app-logo-trigger { width:68px; height:68px; }
 .app-identity-fields { grid-template-columns:minmax(0,1fr); }
}
.app-error { border:3px solid var(--border); background:#ffdddd; color:#111; padding:14px; margin-bottom:20px; overflow-wrap:anywhere; }
.connection-item code { overflow-wrap:anywhere; }
.setup-command { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 12px 0; }
.setup-command code { flex: 1; min-width: 0; padding: 12px; background: var(--bg-primary); border: 2px solid var(--border); }
.connection-item { border: 2px solid var(--border); padding: 16px; margin: 12px 0; }
.connection-item.has-connection-actions { position:relative; }
.connection-item.has-connection-visibility .connection-heading { padding-right:50px; }
.connection-item.has-connection-website .connection-heading { padding-right:164px; }
.connection-item.has-connection-website.has-connection-visibility .connection-heading { padding-right:214px; }
.connection-top-actions { position:absolute; top:12px; right:12px; display:flex; align-items:center; gap:8px; }
.connection-top-actions .dsar-btn, .connection-top-actions .compact-action { margin:0; }
.connection-top-actions .compact-action { padding:7px 10px; font-size:.86rem; }
.connection-visibility-toggle { width:42px; height:42px; padding:7px; }
.connection-visibility-toggle svg { display:block; }
.connection-heading { display:flex; align-items:center; gap:14px; margin-bottom:12px; min-width:0; }
.connection-logo { width:52px; height:52px; flex:0 0 52px; object-fit:contain; border:2px solid var(--border); background:var(--surface); }
.connection-logo-fallback { display:grid; place-items:center; background:var(--accent-blue); color:#111; font:700 1.35rem 'Space Grotesk',sans-serif; }
.connection-title { display:flex; align-items:center; flex-wrap:wrap; gap:8px; min-width:0; }
.connection-item h4 { font-size: 1.1rem; margin:0; overflow-wrap:anywhere; }
.connection-status { display:inline-flex; align-items:center; padding:2px 8px; border:2px solid var(--border); background:var(--accent-green); color:#111; font-size:.78rem; font-weight:700; text-transform:capitalize; }
.connection-status.status-revoked, .connection-status.status-unavailable { background:#ffb3a7; }
.connection-status.status-expired { background:#ffe68a; }
.connection-item p { color: var(--text-secondary); margin-bottom: 6px; overflow-wrap: anywhere; }
.connection-item .dsar-btn { margin-top: 12px; }
.connection-permissions { margin-top:12px; border-top:1px solid var(--border); padding-top:10px; }
.connection-permissions summary, .hidden-connections > summary { cursor:pointer; width:fit-content; padding:6px 10px; border:2px solid var(--border); background:var(--surface); font-weight:700; transition:transform 180ms cubic-bezier(.2,1.3,.45,1), box-shadow 180ms ease-out; }
.connection-permissions summary:hover, .connection-permissions summary:focus-visible, .hidden-connections > summary:hover, .hidden-connections > summary:focus-visible { transform:translateY(-2px); box-shadow:3px 4px 0 var(--border); }
.connection-permissions ul { list-style:none; padding:8px 0 0; }
.connection-permissions li { padding:10px 0; border-bottom:1px solid color-mix(in srgb, var(--border) 30%, transparent); }
.connection-permissions li strong { margin-right:8px; }
.connection-permissions li code { display:inline-block; padding:1px 5px; background:var(--bg-primary); }
.connection-permissions li p { margin:5px 0 0; }
.hidden-connections { margin-top:20px; padding-top:16px; border-top:2px dashed var(--border); }
.hidden-connections > p { color:var(--text-secondary); margin:10px 0; }
.dashboard-feedback { background: var(--accent-green); color: #111; border: 2px solid var(--border); padding: 12px; margin-bottom: 20px; }
#usage-status { margin: 12px 0; }
#usage-status button, #overview-usage button { margin-left: 10px; }
.account-danger { box-shadow: 8px 8px 0 var(--accent-orange); }
.discord-access-notice { margin: 0 0 20px; padding: 16px 18px; border: 2px solid var(--border); border-left: 7px solid var(--accent-orange); background: var(--surface); color: var(--text-primary); font-weight: 700; line-height: 1.5; }
.discord-profile-card { overflow: hidden; border: 3px solid var(--border); background: var(--surface); box-shadow: 8px 8px 0 var(--accent-pink); }
.discord-profile-banner { min-height: 112px; position: relative; overflow: hidden; display: flex; align-items: flex-start; justify-content: flex-end; padding: 16px 20px; background: linear-gradient(115deg, #5865f2 0%, #8659df 48%, #db5baf 100%); }
.discord-profile-brand { z-index: 1; color: #fff; font: 800 .75rem 'JetBrains Mono', monospace; letter-spacing: .12em; }
.discord-profile-brand span { padding: 0 4px; opacity: .75; }
.discord-profile-orbit { position: absolute; width: 230px; height: 230px; right: 12%; top: -148px; border: 1px solid rgb(255 255 255 / 30%); border-radius: 50%; box-shadow: 0 0 0 28px rgb(255 255 255 / 8%), 0 0 0 56px rgb(255 255 255 / 6%); }
.discord-profile-body { display: grid; grid-template-columns: 108px minmax(0,1fr); gap: 20px; align-items: start; padding: 0 24px 24px; }
.discord-profile-avatar-wrap { width: 108px; height: 108px; position: relative; margin-top: -48px; padding: 5px; border-radius: 50%; background: var(--surface); }
.discord-profile-avatar { display: grid; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.discord-profile-avatar-fallback { place-items: center; background: linear-gradient(145deg, #5865f2, #d65da8); color: #fff; font-size: 2rem; font-weight: 800; }
.discord-member-dot { position: absolute; right: 4px; bottom: 5px; width: 22px; height: 22px; border: 4px solid var(--surface); border-radius: 50%; background: var(--text-muted); }
.discord-member-dot.is-member { background: #43b581; }
.discord-member-dot.is-out { background: #ed4245; }
.discord-member-dot.is-unknown { background: #faa61a; }
.discord-profile-info { min-width: 0; padding-top: 18px; }
.discord-name-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.discord-name-row h3 { margin: 0; font: 800 1.7rem/1.15 'Kalam', cursive; overflow-wrap: anywhere; }
.discord-display-kind { margin: 5px 0 0; color: var(--text-secondary); font-size: .9rem; font-weight: 700; }
.discord-membership-badge { flex-shrink: 0; padding: 7px 10px; border: 2px solid var(--border); border-radius: 999px; font-size: .78rem; font-weight: 800; }
.discord-membership-badge.is-member { background: rgb(67 181 129 / 16%); color: #267c56; }
.discord-membership-badge.is-out { background: rgb(237 66 69 / 14%); color: #c53d40; }
.discord-membership-badge.is-unknown { background: rgb(250 166 26 / 15%); color: #a86b00; }
.discord-profile-handle { margin: 6px 0 16px; color: var(--text-secondary); font: 600 .95rem 'JetBrains Mono', monospace; overflow-wrap: anywhere; }
.discord-profile-id { display: grid; gap: 5px; }
.discord-profile-id span { color: var(--text-muted); font: 700 .68rem 'JetBrains Mono', monospace; letter-spacing: .1em; }
.discord-profile-id code { color: var(--text-primary); font: 600 .92rem 'JetBrains Mono', monospace; overflow-wrap: anywhere; }
.account-details-card { margin-top: 24px; }
.account-meta-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.account-meta-grid .dash-meta { display: grid; gap: 5px; min-width: 0; }
.account-meta-grid .dash-meta span { color: var(--text-secondary); font-weight: 700; }
.account-meta-grid code { overflow-wrap: anywhere; }
.account-link-note { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid color-mix(in srgb, var(--border) 35%, transparent); color: var(--text-secondary); line-height: 1.55; }
@media (max-width: 900px) { .dashboard-layout { grid-template-columns: 155px minmax(0,1fr); gap: 24px; } .summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .usage-chart-grid { grid-template-columns: minmax(0,1fr); } }
@media (max-width: 700px) {
 .dashboard-layout { grid-template-columns: minmax(0,1fr); gap: 20px; }
 .setup-command code { flex-basis:100%; }
 .setup-command .dsar-btn { align-self:flex-start; }
 .dashboard-nav { position: static; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
 .dashboard-nav a { padding: 9px 6px; font-size: .9rem; text-align: center; }
 .dashboard-heading { display: block; } .dashboard-help { display: inline-block; margin-bottom: 24px; }
 .dashboard-page { padding-top: 28px; } .dashboard-heading h1 { font-size: 2.4rem; }
 .summary-tile { padding: 12px; } .summary-tile strong { font-size: 1.3rem; }
 .dash-card { padding: 18px; } .usage-chart { column-gap: 6px; row-gap: 5px; } .usage-chart-plot { gap: 2px; }
 .dashboard-help { font-size: .9rem; } .dsar-btn { font-size: 1rem; padding: 10px 14px; }
 .discord-profile-body { grid-template-columns: 82px minmax(0,1fr); gap: 14px; padding: 0 16px 18px; }
 .discord-profile-avatar-wrap { width: 82px; height: 82px; margin-top: -38px; }
 .discord-name-row { display: block; }
 .discord-membership-badge { display: inline-flex; margin-top: 10px; }
 .account-meta-grid { grid-template-columns: minmax(0,1fr); gap: 10px; }
}
@media (max-width: 560px) {
 .connection-item.has-connection-actions .connection-heading { padding-right:0; }
 .connection-top-actions { position:static; justify-content:flex-end; margin:-4px 0 12px; }
}

.connections-developer-note { margin-top:32px; padding-top:20px; border-top:2px solid var(--border); }
.connections-developer-note h3 { font-size:1.1rem; margin-bottom:8px; }
.connections-developer-note p { font-size:.9rem; color:var(--text-secondary); margin-bottom:12px; }
.app-permissions { min-width:0; border:2px solid var(--border); padding:14px; margin:8px 0; }
.app-permissions legend { font-weight:700; padding:0 8px; }
.app-scope-option { display:flex; align-items:flex-start; gap:12px; padding:10px 0; cursor:pointer; }
.app-scope-option input { flex-shrink:0; margin-top:5px; }
.app-scope-option strong { display:inline; }
.app-scope-option .dash-meta { display:block; }
.app-scope-option .dash-meta { font-weight:500; line-height:1.5; margin-top:4px; }
.app-scope-code { display:inline-block; max-width:100%; margin:0 0 0 8px; padding:2px 5px; border:1px solid var(--border); background:var(--bg-primary); color:var(--text-primary); font:600 .72rem 'JetBrains Mono',monospace; vertical-align:middle; overflow-wrap:anywhere; }