.ptuzoom-panel { max-width: 100%; overflow-wrap: anywhere; }
.ptuzoom-panel h1, .ptuzoom-panel h2 { margin-block: 0 .75rem; }
.ptuzoom-panel form { margin-block: .75rem; }
.ptuzoom-panel .ipsButton { max-width: 100%; white-space: normal; }
.ptuzoom-panel[aria-busy="true"] { cursor: progress; }
.ptuzoom-panel :focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.ptuzoom-status { font-weight: 600; }
@media (max-width: 480px) { .ptuzoom-panel .ipsButton { width: 100%; } }

/* IC5 resolves System with JavaScript. Keep app-owned cards readable while
   that scheme is unresolved, without changing the surrounding native theme. */
html[data-ips-scheme="system"] .ptuzoom-panel {
    --ptuzoom-fallback-bg: #ffffff;
    --ptuzoom-fallback-text: #171717;
    --ptuzoom-fallback-border: #737373;
    --ptuzoom-fallback-link: #0645ad;
    --ptuzoom-fallback-visited: #5b2180;
    --ptuzoom-fallback-button-bg: #14532d;
    --ptuzoom-fallback-button-text: #ffffff;
    --ptuzoom-fallback-input-bg: #ffffff;
    --ptuzoom-fallback-placeholder: #4b5563;
    --ptuzoom-fallback-disabled-bg: #e5e7eb;
    --ptuzoom-fallback-disabled-text: #374151;
    --ptuzoom-fallback-focus: #b45309;
    color-scheme: light;
    background-color: var(--ptuzoom-fallback-bg);
    border-color: var(--ptuzoom-fallback-border);
    color: var(--ptuzoom-fallback-text);
}
html[data-ips-scheme="system"] .ptuzoom-panel :is(h1, h2, p, label, legend, .ipsFieldRow__label, .ipsFieldRow__desc, .ipsFieldRow__warning, .ipsFieldRow__error, .ipsFieldRow__required, .ipsMessage) {
    color: var(--ptuzoom-fallback-text);
}
html[data-ips-scheme="system"] .ptuzoom-panel a:not(.ipsButton) {
    color: var(--ptuzoom-fallback-link);
    text-decoration: underline;
}
html[data-ips-scheme="system"] .ptuzoom-panel a:not(.ipsButton):visited {
    color: var(--ptuzoom-fallback-visited);
}
html[data-ips-scheme="system"] .ptuzoom-panel .ipsButton {
    background-color: var(--ptuzoom-fallback-button-bg);
    border-color: var(--ptuzoom-fallback-button-bg);
    color: var(--ptuzoom-fallback-button-text);
}
html[data-ips-scheme="system"] .ptuzoom-panel .ipsButton:is(:disabled, [aria-disabled="true"]) {
    background-color: var(--ptuzoom-fallback-disabled-bg);
    border-color: var(--ptuzoom-fallback-border);
    color: var(--ptuzoom-fallback-disabled-text);
    opacity: 1;
}
html[data-ips-scheme="system"] .ptuzoom-panel :is(input:not([type="hidden"]), textarea, select) {
    background-color: var(--ptuzoom-fallback-input-bg);
    border-color: var(--ptuzoom-fallback-border);
    color: var(--ptuzoom-fallback-text);
}
html[data-ips-scheme="system"] .ptuzoom-panel :is(input, textarea)::placeholder {
    color: var(--ptuzoom-fallback-placeholder);
    opacity: 1;
}
html[data-ips-scheme="system"] .ptuzoom-panel :focus-visible {
    outline: 2px solid var(--ptuzoom-fallback-focus);
    outline-offset: 3px;
}
@media (prefers-color-scheme: dark) {
    html[data-ips-scheme="system"] .ptuzoom-panel {
        --ptuzoom-fallback-bg: #171717;
        --ptuzoom-fallback-text: #f5f5f5;
        --ptuzoom-fallback-border: #a3a3a3;
        --ptuzoom-fallback-link: #a8d1ff;
        --ptuzoom-fallback-visited: #e9bbff;
        --ptuzoom-fallback-button-bg: #bbf7d0;
        --ptuzoom-fallback-button-text: #052e16;
        --ptuzoom-fallback-input-bg: #262626;
        --ptuzoom-fallback-placeholder: #d4d4d4;
        --ptuzoom-fallback-disabled-bg: #404040;
        --ptuzoom-fallback-disabled-text: #e5e7eb;
        --ptuzoom-fallback-focus: #fbbf24;
        color-scheme: dark;
    }
}
