/* In-site administration: one themed workspace over the live page. */
.site-shell:has(.site-admin-dialog-layer) { height: 100vh; overflow: hidden }

.site-admin-dialog-layer {
    position: fixed;
    inset: 0;
    z-index: 2200;
    color: var(--ink);
    font-family: var(--font-body,Inter,sans-serif)
}

.site-admin-dialog-backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    border: 0;
    background: color-mix(in srgb,var(--dark) 66%,transparent);
    backdrop-filter: blur(11px) saturate(.8)
}

.site-admin-workspace {
    position: absolute;
    inset: 18px;
    display: grid;
    grid-template-columns: 220px minmax(0,1fr);
    overflow: hidden;
    border: 1px solid var(--line-strong);
    border-radius: min(var(--radius),24px);
    background: var(--bg);
    color: var(--ink);
    box-shadow: 0 40px 120px rgba(0,0,0,.5);
    animation: site-admin-arrive .3s var(--ease) both
}

.site-admin-rail {
    display: grid;
    grid-template-rows: auto 1fr auto;
    min-height: 0;
    border-right: 1px solid var(--line);
    background: var(--surface-2)
}

.site-admin-rail-brand {
    display: grid;
    grid-template-columns: 9px 1fr;
    gap: 11px;
    align-items: center;
    min-height: 82px;
    padding: 20px;
    border-bottom: 1px solid var(--line)
}
.site-admin-rail-brand > span:last-child { display: grid; gap: 2px }
.site-admin-rail-brand b { color: var(--ink); font-size: 11px; letter-spacing: .12em; text-transform: uppercase }
.site-admin-rail-brand small { color: var(--muted); font: 500 8px/1.2 var(--font-mono,monospace); letter-spacing: .1em; text-transform: uppercase }
.site-admin-status { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 5px color-mix(in srgb,var(--success) 12%,transparent),0 0 15px color-mix(in srgb,var(--success) 48%,transparent) }

.site-admin-rail nav { display: grid; align-content: start; gap: 4px; padding: 14px 10px; overflow-y: auto }
.site-admin-rail nav button,
.site-admin-rail-bottom button {
    display: grid;
    width: 100%;
    min-height: 45px;
    grid-template-columns: 25px 1fr auto;
    gap: 8px;
    align-items: center;
    padding: 0 11px;
    border: 1px solid transparent;
    border-radius: 9px;
    background: transparent;
    color: var(--muted);
    text-align: left
}
.site-admin-rail nav button > span,
.site-admin-rail-bottom button > span { color: var(--muted-2); font: 600 8px/1 var(--font-mono,monospace) }
.site-admin-rail nav button b,
.site-admin-rail-bottom button b { font-size: 10px; font-weight: 750 }
.site-admin-rail nav button i { color: transparent; font-style: normal }
.site-admin-rail nav button:hover,
.site-admin-rail-bottom button:hover { border-color: var(--line); background: var(--surface); color: var(--ink) }
.site-admin-rail nav button.active { border-color: color-mix(in srgb,var(--accent) 36%,var(--line)); background: var(--surface); color: var(--ink); box-shadow: inset 3px 0 0 var(--accent) }
.site-admin-rail nav button.active > span,
.site-admin-rail nav button.active i { color: var(--accent) }

.site-admin-rail-bottom { display: grid; gap: 4px; padding: 11px 10px; border-top: 1px solid var(--line) }
.site-admin-rail-bottom button { grid-template-columns: 25px 1fr }

.site-admin-stage { display: grid; min-width: 0; min-height: 0; grid-template-rows: 82px minmax(0,1fr) }
.site-admin-stage-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 0 30px;
    border-bottom: 1px solid var(--line);
    background: color-mix(in srgb,var(--bg) 84%,transparent);
    backdrop-filter: blur(16px)
}
.site-admin-stage-head > div { display: grid; gap: 3px }
.site-admin-stage-head span { color: var(--muted); font: 600 8px/1.2 var(--font-mono,monospace); letter-spacing: .12em; text-transform: uppercase }
.site-admin-stage-head h2 { margin: 0; color: var(--ink); font: 700 19px/1.1 var(--font-display,Inter,sans-serif); letter-spacing: -.025em }
.site-admin-close { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--muted); font-size: 22px; line-height: 1 }
.site-admin-close:hover { border-color: var(--accent); color: var(--ink); transform: rotate(4deg) }

.site-admin-dialog-content { min-width: 0; overflow: auto; padding: clamp(20px,2.5vw,38px); background: var(--bg) }
.site-admin-dialog-content::-webkit-scrollbar,
.site-admin-rail nav::-webkit-scrollbar { width: 9px }
.site-admin-dialog-content::-webkit-scrollbar-thumb,
.site-admin-rail nav::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 10px; background: color-mix(in srgb,var(--muted) 36%,transparent); background-clip: padding-box }

/* Shared admin language, re-skinned from the public theme tokens. */
.site-admin-workspace .admin-page-head { margin-bottom: 26px }
.site-admin-workspace .admin-page-head h1 { margin: 5px 0 9px; color: var(--ink); font: 720 clamp(34px,4vw,48px)/.95 var(--font-display,Inter,sans-serif); letter-spacing: -.055em }
.site-admin-workspace .admin-page-head p { color: var(--muted); font-size: 11px; line-height: 1.6 }
.site-admin-workspace .admin-kicker { color: var(--accent); font: 750 8px/1.2 var(--font-mono,monospace); letter-spacing: .15em }

.site-admin-workspace .admin-panel,
.site-admin-workspace .admin-list,
.site-admin-workspace .admin-editor,
.site-admin-workspace .survey-admin-card,
.site-admin-workspace .stat-card { border-color: var(--line); background: var(--surface); color: var(--ink); box-shadow: none }
.site-admin-workspace .admin-list,
.site-admin-workspace .admin-editor { border-radius: 15px }
.site-admin-workspace .admin-list-row { border-color: var(--line); background: var(--surface); color: var(--ink) }
.site-admin-workspace .admin-list-row:hover,
.site-admin-workspace .admin-list-row.selected { background: var(--accent-soft) }
.site-admin-workspace .admin-list-row.selected { box-shadow: inset 3px 0 0 var(--accent) }
.site-admin-workspace .admin-list-row .drag,
.site-admin-workspace .admin-list-row small,
.site-admin-workspace .row-arrow { color: var(--muted) }

.site-admin-workspace .admin-editor { padding: 24px }
.site-admin-workspace .editor-head,
.site-admin-workspace .editor-actions { border-color: var(--line) }
.site-admin-workspace .editor-head h2 { color: var(--ink); font-family: var(--font-display,Inter,sans-serif) }
.site-admin-workspace .empty-state { color: var(--muted) }
.site-admin-workspace .empty-state b { color: var(--ink) }

.site-admin-workspace .admin-fields > label > span,
.site-admin-workspace .survey-search > span,
.site-admin-workspace .survey-status-control > span { color: var(--muted); font: 750 8px/1.2 var(--font-mono,monospace) }
.site-admin-workspace .admin-fields input:not([type=checkbox]),
.site-admin-workspace .admin-fields textarea,
.site-admin-workspace .admin-fields select,
.site-admin-workspace .survey-search input,
.site-admin-workspace .survey-status-control select,
.site-admin-workspace .survey-card-head select {
    border-color: var(--line);
    background: var(--surface-2);
    color: var(--ink)
}
.site-admin-workspace .admin-fields input:focus,
.site-admin-workspace .admin-fields textarea:focus,
.site-admin-workspace .admin-fields select:focus,
.site-admin-workspace .survey-search input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft) }
.site-admin-workspace .admin-fields label.check span { color: var(--ink-2) }
.site-admin-workspace input[type=checkbox] { accent-color: var(--accent) }

.site-admin-workspace .admin-primary,
.site-admin-workspace .ghost,
.site-admin-workspace .danger { border-radius: 9px }
.site-admin-workspace .admin-primary { border: 1px solid var(--accent); background: var(--accent); color: var(--on-dark) }
.site-admin-workspace .admin-primary:hover { filter: brightness(1.08) }
.site-admin-workspace .ghost { border: 1px solid var(--line); background: var(--surface-2); color: var(--ink-2) }
.site-admin-workspace .danger { border: 1px solid color-mix(in srgb,#ef5b50 30%,var(--line)); background: color-mix(in srgb,#ef5b50 10%,var(--surface)); color: color-mix(in srgb,#ef5b50 78%,var(--ink)) }
.site-admin-workspace .save-state { color: var(--success) }
.site-admin-workspace .admin-error,
.site-admin-workspace .admin-validation { border-color: color-mix(in srgb,#ef5b50 34%,var(--line)); background: color-mix(in srgb,#ef5b50 10%,var(--surface)); color: color-mix(in srgb,#ef5b50 70%,var(--ink)) }

.site-admin-workspace .admin-callout { border: 1px solid var(--line); background: var(--surface-2); color: var(--ink) }
.site-admin-workspace .admin-callout p,
.site-admin-workspace .admin-note,
.site-admin-workspace .admin-preview-card p,
.site-admin-workspace .admin-preview-link p { color: var(--muted) }
.site-admin-workspace .admin-callout code { background: var(--accent-soft); color: var(--accent) }
.site-admin-workspace .admin-note,
.site-admin-workspace .admin-preview-card,
.site-admin-workspace .admin-preview-link,
.site-admin-workspace .partner-preview,
.site-admin-workspace .survey-admin-attachments { border-color: var(--line); background: var(--surface-2); color: var(--ink) }
.site-admin-workspace .project-preview { border: 1px solid var(--line); background-color: var(--surface-2) }

/* Service editor: explicit global rules prevent an unstyled fallback. */
.site-admin-workspace .service-editor { padding: 0; background: var(--surface) }
.site-admin-workspace .service-editor-head,
.site-admin-workspace .service-editor-tabs,
.site-admin-workspace .service-editor-section-head,
.site-admin-workspace .service-editor-subsection,
.site-admin-workspace .service-content-row-head,
.site-admin-workspace .service-editor-actions { border-color: var(--line) }
.site-admin-workspace .service-editor-tabs { background: var(--surface-2) }
.site-admin-workspace .service-editor-tabs button { border-color: var(--line); background: var(--surface); color: var(--muted) }
.site-admin-workspace .service-editor-tabs button:hover { border-color: var(--line-strong); color: var(--ink) }
.site-admin-workspace .service-editor-tabs button.active { border-color: var(--accent); background: var(--accent); color: var(--on-dark); box-shadow: 0 8px 20px var(--glow) }
.site-admin-workspace .service-editor-tabs button b { background: var(--surface-2); color: var(--muted) }
.site-admin-workspace .service-editor-tabs button.active b { background: color-mix(in srgb,var(--on-dark) 16%,transparent); color: var(--on-dark) }
.site-admin-workspace .service-content-editor,
.site-admin-workspace .relationship-panel { border-color: var(--line); background: var(--surface-2) }
.site-admin-workspace .relationship-title { border-color: var(--line); background: color-mix(in srgb,var(--surface-2) 78%,var(--surface)) }
.site-admin-workspace .relationship-title span { background: var(--accent-soft); color: var(--accent) }
.site-admin-workspace .relationship-option { border-color: var(--line) }
.site-admin-workspace .relationship-option:hover { background: var(--surface) }
.site-admin-workspace .relationship-option b,
.site-admin-workspace .service-content-row-head b { color: var(--ink-2) }
.site-admin-workspace .relationship-option small,
.site-admin-workspace .relationship-empty,
.site-admin-workspace .relationship-empty small { color: var(--muted) }
.site-admin-workspace .service-editor-actions { background: color-mix(in srgb,var(--surface) 92%,transparent); box-shadow: 0 -12px 30px color-mix(in srgb,var(--dark) 9%,transparent) }

/* Requests and summaries. */
.site-admin-workspace .survey-toolbar,
.site-admin-workspace .survey-card-head,
.site-admin-workspace .survey-actions { border-color: var(--line) }
.site-admin-workspace .survey-filters button { border-color: var(--line); background: var(--surface); color: var(--muted) }
.site-admin-workspace .survey-filters button b { background: var(--surface-2); color: var(--muted) }
.site-admin-workspace .survey-filters button.active { border-color: var(--accent); background: var(--accent); color: var(--on-dark) }
.site-admin-workspace .survey-filters button.active b { background: color-mix(in srgb,var(--on-dark) 16%,transparent); color: var(--on-dark) }
.site-admin-workspace .survey-card-head h2,
.site-admin-workspace .survey-detail-grid b,
.site-admin-workspace .survey-detail-grid p { color: var(--ink) }
.site-admin-workspace .survey-card-head p,
.site-admin-workspace .survey-detail-grid span { color: var(--muted) }
.site-admin-workspace .survey-admin-file-list a { border-color: var(--line); background: var(--surface); color: var(--ink) }
.site-admin-workspace .survey-actions a { border-color: var(--line); color: var(--ink-2) }
.site-admin-workspace .survey-actions a:hover { background: var(--surface-2) }
.site-admin-workspace .survey-count { border-color: var(--line); background: var(--surface); color: var(--ink) }

/* The authenticated editor now keeps every content section in one right-hand drawer. */
.site-shell:has(.inline-admin-workspace) { height: 100vh; overflow: hidden }
.site-admin-workspace.inline-admin-workspace {
    position: fixed;
    inset: 14px 14px 14px auto;
    width: min(1320px,calc(100vw - 28px));
    grid-template-columns: 190px minmax(0,1fr);
    border-radius: min(var(--radius),18px);
    animation: inline-admin-enter .28s cubic-bezier(.2,.78,.2,1) both
}
.inline-admin-workspace .site-admin-rail-brand { min-height: 76px; padding: 18px }
.inline-admin-workspace .site-admin-stage { grid-template-rows: 76px minmax(0,1fr) }
.inline-admin-workspace .site-admin-stage-head { padding: 0 24px }
.inline-admin-workspace .site-admin-dialog-content { padding: clamp(18px,2.2vw,30px) }
.inline-admin-workspace .inline-admin-site-content { padding: 0; background: var(--bg) }
.inline-admin-workspace .inline-admin-form { max-width: 860px; margin: 0 auto; overflow: visible }
.inline-admin-workspace .inline-admin-form > section { padding: 24px 26px; border: 1px solid var(--line); border-bottom: 0; background: var(--surface) }
.inline-admin-workspace .inline-admin-form > section:first-of-type { margin-top: 24px; border-radius: 14px 14px 0 0 }
.inline-admin-workspace .inline-admin-form > section:last-of-type { border-bottom: 1px solid var(--line); border-radius: 0 0 14px 14px }
.inline-admin-workspace .inline-admin-section-head b { color: var(--ink); font-size: 14px }
.inline-admin-workspace .inline-admin-section-head small,
.inline-admin-workspace .inline-admin-logo-row small { color: var(--muted) }
.inline-admin-workspace .inline-admin-fields label > span,
.inline-admin-workspace .inline-admin-logo-row label > span,
.inline-admin-workspace .inline-admin-theme-field > span { color: var(--muted) }
.inline-admin-workspace .inline-admin-fields input,
.inline-admin-workspace .inline-admin-fields textarea,
.inline-admin-workspace .inline-admin-fields select { border-color: var(--line); background: var(--surface-2); color: var(--ink) }
.inline-admin-workspace .inline-admin-logo-row { border-color: var(--line); border-radius: 10px; background: var(--surface-2) }
.inline-admin-workspace .inline-admin-logo-row > button { border-color: var(--line); border-radius: 7px; color: var(--muted) }
.inline-admin-workspace .inline-admin-theme-grid { grid-template-columns: repeat(3,minmax(0,1fr)) }
.inline-admin-workspace .inline-admin-theme-grid label { border-color: var(--line); background: var(--surface-2) }
.inline-admin-workspace .inline-admin-theme-grid label:hover { border-color: var(--line-strong) }
.inline-admin-workspace .inline-admin-theme-grid label.on { border-color: var(--accent); background: var(--accent-soft) }
.inline-admin-workspace .inline-admin-theme-grid strong { color: var(--ink) }
.inline-admin-workspace .inline-admin-theme-grid small { color: var(--muted) }
.inline-admin-workspace .inline-admin-validation,
.inline-admin-workspace .inline-admin-error { border-color: color-mix(in srgb,#ef5b50 34%,var(--line)); background: color-mix(in srgb,#ef5b50 10%,var(--surface)); color: color-mix(in srgb,#ef5b50 70%,var(--ink)) }
.inline-admin-workspace .inline-admin-actions { margin-top: 24px; padding: 14px 0; border-color: var(--line); background: color-mix(in srgb,var(--bg) 94%,transparent) }
.inline-admin-workspace .inline-admin-actions button { border-color: var(--line); border-radius: 8px; color: var(--ink-2) }
.inline-admin-workspace .inline-admin-actions button[type="submit"] { border-color: var(--accent); background: var(--accent); color: var(--on-dark) }

/* Integration vault inherits the active public theme while remaining a secure admin surface. */
.site-admin-workspace .integration-template-picker,
.site-admin-workspace .integration-list,
.site-admin-workspace .integration-editor { border-color: var(--line); background: var(--surface) }
.site-admin-workspace .integration-template-card,
.site-admin-workspace .integration-property,
.site-admin-workspace .integration-empty.compact { border-color: var(--line); background: var(--surface-2); color: var(--ink) }
.site-admin-workspace .integration-template-card:hover { border-color: var(--line-strong); box-shadow: 0 14px 30px color-mix(in srgb,var(--dark) 10%,transparent) }
.site-admin-workspace .integration-template-card>span,
.site-admin-workspace .integration-template-card>p,
.site-admin-workspace .integration-help,
.site-admin-workspace .integration-empty { color: var(--muted) }
.site-admin-workspace .integration-template-card>b,
.site-admin-workspace .integration-property-head b,
.site-admin-workspace .integration-empty b { color: var(--ink) }
.site-admin-workspace .integration-provider,
.site-admin-workspace .integration-secret-state { background: var(--surface-2); color: var(--muted) }
.site-admin-workspace .integration-secret-state.stored { background: color-mix(in srgb,#18a970 14%,var(--surface)); color: color-mix(in srgb,#18a970 72%,var(--ink)) }
.site-admin-workspace .integration-properties,
.site-admin-workspace .integration-editor-head { border-color: var(--line) }
.site-admin-workspace .integration-value-field input,
.site-admin-workspace .integration-value-field textarea { border-color: var(--line); background: var(--surface); color: var(--ink) }
.site-admin-workspace .integration-value-field input:focus,
.site-admin-workspace .integration-value-field textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft) }
.site-admin-workspace .integration-success { border-color: color-mix(in srgb,#18a970 35%,var(--line)); background: color-mix(in srgb,#18a970 10%,var(--surface)); color: color-mix(in srgb,#18a970 72%,var(--ink)) }
.site-admin-workspace .user-member-panel,
.site-admin-workspace .user-invite-panel,
.site-admin-workspace .user-invitation-panel,
.site-admin-workspace .user-invitation-row { border-color: var(--line); background: var(--surface) }
.site-admin-workspace .user-member-list,
.site-admin-workspace .user-member-row,
.site-admin-workspace .user-invite-actions { border-color: var(--line) }
.site-admin-workspace .user-member-row b,
.site-admin-workspace .user-invitation-main b { color: var(--ink) }
.site-admin-workspace .user-member-row small,
.site-admin-workspace .user-invitation-main small { color: var(--muted) }
.site-admin-workspace .user-avatar { background: var(--dark); color: var(--on-dark) }
.site-admin-workspace .user-member-row>i,
.site-admin-workspace .user-invite-status { background: var(--surface-2); color: var(--muted) }
.site-admin-workspace .user-invite-status.sent { background: var(--accent-soft); color: var(--accent) }
.site-admin-workspace .user-invite-actions button { border-color: var(--line); background: var(--surface-2); color: var(--ink-2) }
.site-admin-workspace .analytics-range,
.site-admin-workspace .analytics-stat-grid article,
.site-admin-workspace .analytics-trend-panel,
.site-admin-workspace .analytics-list-panel { border-color: var(--line); background: var(--surface) }
.site-admin-workspace .analytics-range button { color: var(--muted) }
.site-admin-workspace .analytics-range button.active { background: var(--accent); color: var(--on-dark) }
.site-admin-workspace .analytics-stat-grid b,
.site-admin-workspace .analytics-panel-head h2,
.site-admin-workspace .analytics-ranked-list b,
.site-admin-workspace .analytics-event-list b { color: var(--ink) }
.site-admin-workspace .analytics-stat-grid span,
.site-admin-workspace .analytics-stat-grid small,
.site-admin-workspace .analytics-panel-head>small,
.site-admin-workspace .analytics-ranked-list small,
.site-admin-workspace .analytics-event-list small { color: var(--muted) }
.site-admin-workspace .analytics-ranked-list>div,
.site-admin-workspace .analytics-event-list>div,
.site-admin-workspace .analytics-bars { border-color: var(--line) }
.site-admin-workspace .analytics-ranked-list i,
.site-admin-workspace .analytics-sublist>span { background: var(--surface-2) }
.site-admin-workspace .analytics-ranked-list em { background: var(--accent) }
.site-admin-workspace .analytics-device-grid>div { border-color: var(--line); background: var(--surface-2) }
.site-admin-workspace .inline-admin-social-image-preview { background: var(--surface) }

@keyframes site-admin-arrive {
    from { opacity: 0; transform: translateY(10px) scale(.992) }
    to { opacity: 1; transform: none }
}

@media (max-width: 980px) {
    .site-admin-workspace { inset: 8px; grid-template-columns: 1fr; grid-template-rows: auto minmax(0,1fr); border-radius: 15px }
    .site-admin-rail { display: block; border-right: 0; border-bottom: 1px solid var(--line) }
    .site-admin-rail-brand { display: none }
    .site-admin-rail nav { display: flex; gap: 5px; padding: 8px; overflow-x: auto }
    .site-admin-rail nav button { width: auto; min-width: max-content; grid-template-columns: auto 1fr; padding: 0 11px }
    .site-admin-rail nav button i { display: none }
    .site-admin-rail nav button.active { box-shadow: inset 0 -2px 0 var(--accent) }
    .site-admin-rail-bottom { display: none }
    .site-admin-stage { grid-template-rows: 66px minmax(0,1fr) }
    .site-admin-stage-head { padding: 0 18px }
    .site-admin-dialog-content { padding: 20px 16px }
    .site-admin-workspace.inline-admin-workspace { inset: 8px; width: auto; grid-template-columns: 1fr; grid-template-rows: auto minmax(0,1fr) }
    .inline-admin-workspace .inline-admin-theme-grid { grid-template-columns: repeat(2,minmax(0,1fr)) }
}

@media (max-width: 620px) {
    .site-admin-workspace { inset: 0; border: 0; border-radius: 0 }
    .site-admin-rail nav button > span { display: none }
    .site-admin-stage-head span { display: none }
    .site-admin-dialog-content { padding: 17px 12px }
    .site-admin-workspace .admin-page-head { align-items: stretch; gap: 16px }
    .site-admin-workspace .admin-page-head > button { width: 100% }
    .site-admin-workspace.inline-admin-workspace { inset: 0; width: auto; border-radius: 0 }
    .inline-admin-workspace .inline-admin-form > section { padding: 20px 16px }
    .inline-admin-workspace .inline-admin-form > section:first-of-type { margin-top: 12px }
    .inline-admin-workspace .inline-admin-theme-grid { grid-template-columns: 1fr }
    .inline-admin-workspace .inline-admin-actions { padding: 12px }
}

@media (prefers-reduced-motion: reduce) {
    .site-admin-workspace { animation: none }
}
