/*
 * DSE RMM Public Enrollment - Modern 2026
 *
 * A presentation-only overlay for the customer enrollment journey. It is
 * intentionally scoped to body.dse-enroll-modern so the protected server
 * flow, form contract, and data-enroll JavaScript hooks remain independent.
 */

body.dse-enroll-modern {
    --dse-modern-navy-950: #061126;
    --dse-modern-navy-900: #091a38;
    --dse-modern-navy-800: #102851;
    --dse-modern-gold-500: #f0b828;
    --dse-modern-gold-300: #fce466;
    --dse-modern-gold-700: #ac740c;
    --dse-modern-canvas: #f3f6fa;
    --dse-modern-surface: #ffffff;
    --dse-modern-surface-strong: #e9eef5;
    --dse-modern-ink: #101b31;
    --dse-modern-body: #31405a;
    --dse-modern-muted: #536077;
    --dse-modern-border: #d7dfeb;
    --dse-modern-border-strong: #b7c3d3;
    --dse-modern-success: #147a57;
    --dse-modern-success-soft: #e8f7f1;
    --dse-modern-warning: #a64b00;
    --dse-modern-warning-soft: #fff6e8;
    --dse-modern-critical: #b51e36;
    --dse-modern-critical-soft: #fff0f3;
    --dse-modern-radius-sm: 12px;
    --dse-modern-radius-md: 16px;
    --dse-modern-radius-lg: 24px;
    --dse-modern-radius-xl: 30px;
    --dse-modern-shadow-card: 0 30px 80px rgba(1, 9, 24, .34), 0 2px 8px rgba(1, 9, 24, .12);
    --dse-modern-shadow-control: 0 10px 24px rgba(6, 17, 38, .08);
    margin: 0;
    background:
        radial-gradient(circle at 7% 2%, rgba(240, 184, 40, .19), transparent 29rem),
        radial-gradient(circle at 94% 16%, rgba(16, 40, 81, .72), transparent 35rem),
        linear-gradient(142deg, var(--dse-modern-navy-950), var(--dse-modern-navy-900) 58%, #07152d) !important;
    color: var(--dse-modern-body);
    font-family: "Segoe UI", Tahoma, Arial, sans-serif;
    line-height: 1.5;
}

body.dse-enroll-modern::before {
    height: 4px;
    background: linear-gradient(90deg, var(--dse-modern-navy-800) 0 15%, var(--dse-modern-gold-500) 15% 85%, var(--dse-modern-navy-800) 85%) !important;
}

body.dse-enroll-modern::after {
    opacity: .38;
    background-image:
        linear-gradient(rgba(240, 184, 40, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(240, 184, 40, .045) 1px, transparent 1px) !important;
    background-size: 64px 64px !important;
    -webkit-mask-image: linear-gradient(to bottom, #000 0, transparent 82%);
    mask-image: linear-gradient(to bottom, #000 0, transparent 82%);
}

body.dse-enroll-modern :where(a, button, input, summary):focus-visible {
    outline: 3px solid var(--dse-modern-gold-500) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 2px var(--dse-modern-navy-950) !important;
}

body.dse-enroll-modern .dse-enroll-app {
    width: min(100%, 1180px);
    min-height: calc(100vh - 4px);
    min-height: calc(100dvh - 4px);
    padding:
        max(22px, env(safe-area-inset-top))
        max(20px, env(safe-area-inset-right))
        max(28px, env(safe-area-inset-bottom))
        max(20px, env(safe-area-inset-left));
}

/* Compact public chrome */
body.dse-enroll-modern .dse-enroll-header {
    min-height: 64px;
    margin: 0 0 18px;
    padding: 8px 10px 8px 8px;
    border: 1px solid rgba(240, 184, 40, .18);
    border-radius: var(--dse-modern-radius-md);
    background: rgba(6, 17, 38, .72);
    box-shadow: 0 14px 38px rgba(1, 8, 20, .16);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}

body.dse-enroll-modern .dse-enroll-brand {
    gap: 11px;
    border-radius: 12px;
}

body.dse-enroll-modern .dse-enroll-brand-mark {
    flex-basis: 46px;
    width: 46px;
    height: 46px;
    padding: 3px;
    border: 1px solid rgba(240, 184, 40, .64) !important;
    border-radius: 12px;
    background: var(--dse-modern-navy-950) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .24) !important;
}

body.dse-enroll-modern a.dse-enroll-brand:hover .dse-enroll-brand-mark {
    transform: translateY(-1px);
    border-color: var(--dse-modern-gold-300) !important;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .28), 0 0 0 3px rgba(240, 184, 40, .10) !important;
}

body.dse-enroll-modern .dse-enroll-brand-copy strong {
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -.015em;
}

body.dse-enroll-modern .dse-enroll-brand-copy span {
    color: #aebbd0;
    font-size: 11px;
    font-weight: 600;
}

body.dse-enroll-modern .dse-enroll-secure {
    min-height: 40px;
    padding: 8px 13px 8px 9px;
    border: 1px solid rgba(20, 122, 87, .52);
    background: rgba(20, 122, 87, .14);
    color: #d7f7ec;
    font-size: 11px;
    letter-spacing: .01em;
}

body.dse-enroll-modern .dse-enroll-secure > span:first-child {
    display: grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 50%;
    background: #4dd2a2;
    color: var(--dse-modern-navy-950);
    font-size: 11px;
}

/* Progress rail */
body.dse-enroll-modern .dse-enroll-progress {
    width: min(100%, 880px);
    max-width: none;
    margin: 0 auto 20px;
    padding: 10px 14px;
    border: 1px solid rgba(240, 184, 40, .20) !important;
    border-radius: var(--dse-modern-radius-md);
    background: rgba(6, 17, 38, .78) !important;
    box-shadow: 0 12px 32px rgba(1, 8, 20, .18);
}

body.dse-enroll-modern .dse-enroll-progress li {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 10px;
    min-height: 38px;
    padding: 3px 18px 3px 0;
}

body.dse-enroll-modern .dse-enroll-progress li > span {
    width: 32px;
    height: 32px;
    border: 1px solid rgba(183, 195, 211, .32);
    border-radius: 10px;
    background: rgba(255, 255, 255, .05);
    color: #aebbd0;
    font-size: 11px;
    font-weight: 900;
}

body.dse-enroll-modern .dse-enroll-progress li:not(:last-child)::after {
    top: 18px;
    left: 44px;
    right: 11px;
    height: 1px;
    background: rgba(183, 195, 211, .24);
}

body.dse-enroll-modern .dse-enroll-progress li.is-complete:not(:last-child)::after,
body.dse-enroll-modern .dse-enroll-progress li[aria-current="step"]:not(:last-child)::after {
    background: linear-gradient(90deg, rgba(240, 184, 40, .86), rgba(240, 184, 40, .20));
}

body.dse-enroll-modern .dse-enroll-progress li.is-complete > span,
body.dse-enroll-modern .dse-enroll-progress li[aria-current="step"] > span {
    border-color: var(--dse-modern-gold-700) !important;
    background: linear-gradient(135deg, var(--dse-modern-gold-300), var(--dse-modern-gold-500)) !important;
    color: var(--dse-modern-navy-950) !important;
    box-shadow: 0 5px 16px rgba(172, 116, 12, .22);
}

body.dse-enroll-modern .dse-enroll-progress li strong {
    color: #f7f9fc;
    font-size: 12px;
    font-weight: 800;
}

body.dse-enroll-modern .dse-enroll-progress li small {
    color: #8f9db3;
    font-size: 10px;
    font-weight: 600;
}

/* Entry state: a high-clarity two-panel card */
body.dse-enroll-modern .dse-enroll-layout-entry > .dse-enroll-card {
    width: min(100%, 1080px);
    margin: 0 auto;
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card,
body.dse-enroll-modern .dse-enroll-install-panel {
    overflow: hidden;
    border: 1px solid rgba(240, 184, 40, .32) !important;
    border-radius: var(--dse-modern-radius-xl);
    background: var(--dse-modern-surface) !important;
    box-shadow: var(--dse-modern-shadow-card) !important;
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card::before,
body.dse-enroll-modern .dse-enroll-install-panel::before {
    height: 5px;
    background: linear-gradient(90deg, var(--dse-modern-gold-700), var(--dse-modern-gold-500) 45%, var(--dse-modern-gold-300) 72%, var(--dse-modern-gold-500)) !important;
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-inner {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
    min-height: 540px;
    padding: 0;
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head {
    position: relative;
    display: flex;
    min-width: 0;
    height: 100%;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    overflow: hidden;
    padding: clamp(40px, 5vw, 64px) clamp(34px, 4vw, 54px);
    background:
        radial-gradient(circle at 20% 6%, rgba(240, 184, 40, .19), transparent 19rem),
        linear-gradient(145deg, var(--dse-modern-navy-800), var(--dse-modern-navy-950) 72%);
    text-align: left;
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .32;
    background-image:
        linear-gradient(rgba(252, 228, 102, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(252, 228, 102, .08) 1px, transparent 1px);
    background-size: 44px 44px;
    -webkit-mask-image: linear-gradient(135deg, #000, transparent 72%);
    mask-image: linear-gradient(135deg, #000, transparent 72%);
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head > * {
    position: relative;
    z-index: 1;
}

body.dse-enroll-modern .dse-enroll-eyebrow {
    color: #80520a !important;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-eyebrow {
    align-self: flex-start;
    padding: 7px 10px;
    border: 1px solid rgba(240, 184, 40, .30);
    border-radius: 999px;
    background: rgba(240, 184, 40, .10);
    color: var(--dse-modern-gold-300) !important;
}

body.dse-enroll-modern .dse-enroll-eyebrow > span:first-child {
    background: var(--dse-modern-success);
    box-shadow: 0 0 0 4px rgba(77, 210, 162, .12);
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head h1 {
    max-width: 10ch;
    margin: 22px 0 18px;
    color: #fff !important;
    font-size: clamp(40px, 4.7vw, 58px);
    font-weight: 850;
    line-height: .99;
    letter-spacing: -.05em;
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head h1 em {
    color: var(--dse-modern-gold-300) !important;
    font-style: normal;
}

body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head p {
    max-width: 42ch;
    margin: 0;
    color: #c3cede;
    font-size: 15px;
    line-height: 1.68;
}

body.dse-enroll-modern .dse-enroll-code-form {
    display: flex;
    width: 100%;
    max-width: none;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding: clamp(36px, 5vw, 58px);
    background: linear-gradient(180deg, #fff, #f9fbfd);
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-field {
    margin-bottom: 18px;
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-label-row {
    margin-bottom: 9px;
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-label-row label {
    color: var(--dse-modern-ink);
    font-size: 13px;
    font-weight: 800;
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-required {
    color: var(--dse-modern-muted);
    font-size: 10px;
    font-weight: 800;
}

body.dse-enroll-modern .dse-enroll-code-input {
    width: 100%;
    height: 68px;
    border: 2px solid var(--dse-modern-border-strong);
    border-radius: var(--dse-modern-radius-md);
    background: #fff;
    color: var(--dse-modern-ink);
    box-shadow: inset 0 1px 2px rgba(6, 17, 38, .04), var(--dse-modern-shadow-control);
    font-size: clamp(21px, 3vw, 28px);
    font-weight: 850;
    letter-spacing: .13em;
    text-align: center;
}

body.dse-enroll-modern .dse-enroll-code-input::placeholder {
    color: #8995a8;
    opacity: .76;
}

body.dse-enroll-modern .dse-enroll-code-input:hover {
    border-color: #8d9bb0;
}

body.dse-enroll-modern .dse-enroll-code-input:focus {
    border-color: var(--dse-modern-gold-500) !important;
    box-shadow: 0 0 0 4px rgba(240, 184, 40, .16), var(--dse-modern-shadow-control) !important;
    outline: 0;
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-help {
    margin-top: 8px;
    color: var(--dse-modern-muted);
    font-size: 11px;
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-authorization {
    gap: 12px;
    margin: 0 0 18px;
    padding: 14px 15px;
    border: 1px solid var(--dse-modern-border);
    border-radius: var(--dse-modern-radius-md);
    background: var(--dse-modern-canvas);
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-authorization:hover {
    border-color: var(--dse-modern-border-strong);
    background: #eef2f7;
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-authorization input {
    width: 20px;
    height: 20px;
    margin-top: 2px;
    accent-color: var(--dse-modern-gold-700);
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-authorization strong {
    color: var(--dse-modern-ink);
    font-size: 12px;
    line-height: 1.4;
}

body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-authorization small {
    margin-top: 4px;
    color: var(--dse-modern-muted);
    font-size: 10px;
    line-height: 1.52;
}

body.dse-enroll-modern .dse-enroll-button-primary {
    min-height: 58px;
    border: 1px solid var(--dse-modern-gold-700) !important;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--dse-modern-gold-300), var(--dse-modern-gold-500)) !important;
    box-shadow: 0 14px 28px rgba(172, 116, 12, .24), inset 0 1px 0 rgba(255, 255, 255, .42) !important;
    color: var(--dse-modern-navy-950) !important;
    font-size: 13px;
    font-weight: 850;
    letter-spacing: -.005em;
}

body.dse-enroll-modern .dse-enroll-button-primary:hover:not(:disabled) {
    transform: translateY(-1px);
    background: linear-gradient(135deg, #fff0a0, var(--dse-modern-gold-300)) !important;
    box-shadow: 0 18px 32px rgba(172, 116, 12, .29), inset 0 1px 0 rgba(255, 255, 255, .46) !important;
}

body.dse-enroll-modern .dse-enroll-button-primary:active:not(:disabled) {
    transform: translateY(0);
}

body.dse-enroll-modern .dse-enroll-button-arrow {
    background: rgba(6, 17, 38, .12) !important;
    color: var(--dse-modern-navy-950) !important;
}

body.dse-enroll-modern .dse-enroll-trust-line {
    gap: 10px 16px;
    margin-top: 17px;
    color: var(--dse-modern-muted);
    font-size: 9px;
}

body.dse-enroll-modern .dse-enroll-trust-line i {
    color: var(--dse-modern-success);
}

body.dse-enroll-modern .dse-enroll-promise {
    width: min(100%, 950px);
    gap: 10px;
    margin: 14px auto 0;
}

body.dse-enroll-modern .dse-enroll-promise > span {
    min-height: 60px;
    padding: 11px 13px;
    border: 1px solid rgba(240, 184, 40, .13);
    border-radius: 13px;
    background: rgba(6, 17, 38, .55);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

body.dse-enroll-modern .dse-enroll-promise b {
    display: grid;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 1px solid rgba(240, 184, 40, .24);
    border-radius: 9px;
    background: rgba(240, 184, 40, .08);
    color: var(--dse-modern-gold-300);
    font-size: 9px;
}

body.dse-enroll-modern .dse-enroll-promise small {
    color: #8f9db3;
    font-size: 9px;
}

body.dse-enroll-modern .dse-enroll-promise small strong {
    color: #edf2f8;
    font-size: 10px;
}

/* Installer-ready and connected states */
body.dse-enroll-modern .dse-enroll-layout-single > .dse-enroll-install-panel {
    width: min(100%, 940px);
    margin: 0 auto;
}

body.dse-enroll-modern .dse-enroll-install-panel .dse-enroll-card-inner {
    padding: clamp(28px, 5vw, 48px);
}

body.dse-enroll-modern .dse-enroll-install-panel > .dse-enroll-card-inner > .dse-enroll-alert:first-child {
    margin: calc(clamp(28px, 5vw, 48px) * -1) calc(clamp(28px, 5vw, 48px) * -1) 30px;
    padding: 14px clamp(28px, 5vw, 48px);
    border: 0;
    border-bottom: 1px solid #bfe2d4;
    border-radius: 0;
    background: var(--dse-modern-success-soft);
}

body.dse-enroll-modern .dse-enroll-install-panel > .dse-enroll-card-inner > .dse-enroll-alert:first-child strong {
    color: #0d5f43;
    font-size: 12px;
}

body.dse-enroll-modern .dse-enroll-install-panel > .dse-enroll-card-inner > .dse-enroll-alert:first-child span {
    color: #326d59;
    font-size: 11px;
}

body.dse-enroll-modern .dse-enroll-install-panel .dse-enroll-card-head {
    max-width: 760px;
    margin: 0 auto 24px;
    text-align: center;
}

body.dse-enroll-modern .dse-enroll-install-panel .dse-enroll-card-head h1 {
    margin: 11px 0 10px;
    color: var(--dse-modern-ink) !important;
    font-size: clamp(30px, 4vw, 43px);
    font-weight: 850;
    line-height: 1.06;
    letter-spacing: -.04em;
}

body.dse-enroll-modern .dse-enroll-install-panel .dse-enroll-card-head > p {
    max-width: 64ch;
    margin: 0 auto;
    color: var(--dse-modern-muted);
    font-size: 14px;
    line-height: 1.62;
}

body.dse-enroll-modern .dse-enroll-download-hero {
    grid-template-columns: 80px minmax(0, 1fr) minmax(210px, .65fr);
    gap: 18px;
    margin: 0;
    padding: 19px;
    border: 1px solid var(--dse-modern-border);
    border-radius: 20px;
    background: linear-gradient(135deg, #fff, var(--dse-modern-canvas));
    box-shadow: var(--dse-modern-shadow-control);
}

body.dse-enroll-modern .dse-enroll-download-hero .dse-enroll-download-icon {
    width: 74px;
    height: 74px;
    border: 1px solid rgba(240, 184, 40, .32);
    border-radius: 18px;
    background: var(--dse-modern-navy-950);
    box-shadow: 0 12px 26px rgba(6, 17, 38, .22);
}

body.dse-enroll-modern .dse-enroll-download-hero .dse-enroll-download-icon > span:last-child {
    border-color: var(--dse-modern-gold-700);
    background: var(--dse-modern-gold-500);
    color: var(--dse-modern-navy-950);
}

body.dse-enroll-modern .dse-enroll-download-halo {
    border-color: rgba(240, 184, 40, .22);
}

body.dse-enroll-modern .dse-enroll-ready-pill {
    border-color: #b8dfd1;
    background: var(--dse-modern-success-soft);
    color: #0d694b;
}

body.dse-enroll-modern .dse-enroll-download-copy > strong {
    color: var(--dse-modern-ink);
    font-size: 15px;
}

body.dse-enroll-modern .dse-enroll-download-copy > strong span,
body.dse-enroll-modern .dse-enroll-download-copy > small {
    color: var(--dse-modern-muted);
}

body.dse-enroll-modern .dse-enroll-download-hero .dse-enroll-button {
    min-height: 52px;
}

body.dse-enroll-modern .dse-enroll-auto-download {
    min-height: 36px;
    margin: 8px 0 14px;
    color: var(--dse-modern-muted);
    font-size: 10px;
}

body.dse-enroll-modern .dse-enroll-auto-download .dse-enroll-mini-spinner {
    border-color: rgba(172, 116, 12, .24);
    border-top-color: var(--dse-modern-gold-700);
}

body.dse-enroll-modern .dse-enroll-install-steps {
    gap: 10px;
    margin: 0 0 14px;
}

body.dse-enroll-modern .dse-enroll-install-steps li {
    min-height: 94px;
    padding: 14px;
    border: 1px solid var(--dse-modern-border);
    border-radius: 14px;
    background: var(--dse-modern-canvas);
}

body.dse-enroll-modern .dse-enroll-install-steps li > span {
    border-color: var(--dse-modern-border-strong);
    background: #fff;
    color: var(--dse-modern-navy-800);
}

body.dse-enroll-modern .dse-enroll-install-steps li strong {
    color: var(--dse-modern-ink);
}

body.dse-enroll-modern .dse-enroll-install-steps li small {
    color: var(--dse-modern-muted);
}

body.dse-enroll-modern .dse-enroll-install-steps li.is-complete {
    border-color: #b8dfd1;
    background: var(--dse-modern-success-soft);
}

body.dse-enroll-modern .dse-enroll-install-steps li.is-complete > span {
    border-color: var(--dse-modern-success);
    background: var(--dse-modern-success);
    color: #fff;
}

body.dse-enroll-modern .dse-enroll-next-step {
    gap: 14px;
    margin: 0 0 12px;
    padding: 14px 16px;
    border: 1px solid #c4d1e2;
    border-radius: 14px;
    background: linear-gradient(135deg, #f6f8fb, #edf2f7);
}

body.dse-enroll-modern .dse-enroll-connection-orb {
    border-color: rgba(240, 184, 40, .20);
    background: rgba(240, 184, 40, .12);
}

body.dse-enroll-modern .dse-enroll-connection-orb::before,
body.dse-enroll-modern .dse-enroll-connection-orb i {
    background: var(--dse-modern-gold-500);
}

body.dse-enroll-modern .dse-enroll-next-step strong {
    color: var(--dse-modern-ink);
}

body.dse-enroll-modern .dse-enroll-next-step p span {
    color: var(--dse-modern-muted);
}

body.dse-enroll-modern .dse-enroll-recovery-note,
body.dse-enroll-modern .dse-enroll-platform-note,
body.dse-enroll-modern .dse-enroll-command-warning,
body.dse-enroll-modern .dse-enroll-signing-note {
    border-radius: 14px;
}

body.dse-enroll-modern .dse-enroll-recovery-note,
body.dse-enroll-modern .dse-enroll-platform-note {
    border-color: #cbd7e6;
    background: #f4f7fa;
}

body.dse-enroll-modern .dse-enroll-alert-error,
body.dse-enroll-modern .dse-enroll-field-error {
    color: var(--dse-modern-critical);
}

body.dse-enroll-modern .dse-enroll-alert-error {
    border-color: #edbac4;
    background: var(--dse-modern-critical-soft);
}

body.dse-enroll-modern .dse-enroll-signing-note,
body.dse-enroll-modern .dse-enroll-command-warning {
    border-color: #ecd39f;
    background: var(--dse-modern-warning-soft);
}

body.dse-enroll-modern .dse-enroll-details {
    margin-top: 12px;
    border: 1px solid var(--dse-modern-border);
    border-radius: 14px;
    background: #fff;
}

body.dse-enroll-modern .dse-enroll-details > summary {
    min-height: 48px;
    padding: 14px 16px;
    color: var(--dse-modern-ink);
    font-size: 12px;
    font-weight: 800;
}

body.dse-enroll-modern .dse-enroll-details[open] > summary {
    border-bottom-color: var(--dse-modern-border);
    background: var(--dse-modern-canvas);
}

body.dse-enroll-modern .dse-enroll-details-body {
    color: var(--dse-modern-muted);
}

body.dse-enroll-modern .dse-enroll-details-body strong,
body.dse-enroll-modern .dse-enroll-details-body code {
    color: var(--dse-modern-ink);
}

body.dse-enroll-modern .dse-enroll-app[data-enroll-state="completed"] .dse-enroll-install-panel {
    border-color: rgba(20, 122, 87, .52) !important;
}

body.dse-enroll-modern .dse-enroll-app[data-enroll-state="completed"] .dse-enroll-install-panel::before {
    background: linear-gradient(90deg, #0f5e43, #2a9f76, #6ed8b4) !important;
}

body.dse-enroll-modern .dse-enroll-app[data-enroll-state="completed"] .dse-enroll-next-step {
    border-color: #a9d7c7;
    background: var(--dse-modern-success-soft);
}

body.dse-enroll-modern .dse-enroll-app[data-enroll-state="completed"] .dse-enroll-next-step strong {
    color: #0d5f43;
}

/* Footer */
body.dse-enroll-modern .dse-enroll-footer {
    justify-content: space-between;
    width: min(100%, 1080px);
    margin: 18px auto 0;
    padding: 8px 4px 0;
}

body.dse-enroll-modern .dse-enroll-footer > a {
    color: var(--dse-modern-gold-300) !important;
    font-size: 11px;
    font-weight: 750;
}

body.dse-enroll-modern .dse-enroll-footer > a:hover {
    color: #fff !important;
}

body.dse-enroll-modern .dse-enroll-footer-brand {
    color: #8998ae;
    font-size: 11px;
}

body.dse-enroll-modern .dse-enroll-footer-brand img {
    border-color: rgba(240, 184, 40, .28);
}

@media (max-width: 920px) {
    body.dse-enroll-modern .dse-enroll-app {
        width: min(100%, 760px);
    }

    body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-inner {
        grid-template-columns: minmax(0, 1fr);
        min-height: 0;
    }

    body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head {
        min-height: 300px;
        padding: 40px clamp(30px, 6vw, 52px);
    }

    body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head h1 {
        max-width: 14ch;
        margin: 18px 0 14px;
        font-size: clamp(38px, 7vw, 52px);
    }

    body.dse-enroll-modern .dse-enroll-code-form {
        padding: clamp(32px, 6vw, 50px);
    }

    body.dse-enroll-modern .dse-enroll-download-hero {
        grid-template-columns: 74px minmax(0, 1fr);
    }

    body.dse-enroll-modern .dse-enroll-download-hero .dse-enroll-download-form {
        grid-column: 1 / -1;
    }
}

@media (max-width: 680px) {
    body.dse-enroll-modern .dse-enroll-app {
        padding:
            max(16px, env(safe-area-inset-top))
            max(12px, env(safe-area-inset-right))
            max(22px, env(safe-area-inset-bottom))
            max(12px, env(safe-area-inset-left));
    }

    body.dse-enroll-modern .dse-enroll-header {
        min-height: 58px;
        margin-bottom: 12px;
        padding: 6px;
        border-radius: 14px;
    }

    body.dse-enroll-modern .dse-enroll-brand-mark {
        flex-basis: 42px;
        width: 42px;
        height: 42px;
    }

    body.dse-enroll-modern .dse-enroll-brand-copy strong {
        font-size: 13px;
    }

    body.dse-enroll-modern .dse-enroll-secure {
        min-height: 38px;
        padding: 8px;
    }

    body.dse-enroll-modern .dse-enroll-secure-label {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
    }

    body.dse-enroll-modern .dse-enroll-progress {
        margin-bottom: 12px;
        padding: 9px;
        border-radius: 14px;
    }

    body.dse-enroll-modern .dse-enroll-progress li {
        grid-template-columns: 28px minmax(0, 1fr);
        gap: 7px;
        padding-right: 6px;
    }

    body.dse-enroll-modern .dse-enroll-progress li > span {
        width: 28px;
        height: 28px;
        border-radius: 9px;
    }

    body.dse-enroll-modern .dse-enroll-progress li:not(:last-child)::after {
        top: 16px;
        left: 37px;
        right: 4px;
    }

    body.dse-enroll-modern .dse-enroll-progress li strong {
        font-size: 10px;
        line-height: 1.2;
    }

    body.dse-enroll-modern .dse-enroll-progress li small {
        display: none;
    }

    body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card,
    body.dse-enroll-modern .dse-enroll-install-panel {
        border-radius: 22px;
    }

    body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head {
        min-height: 260px;
        padding: 32px 25px;
    }

    body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head h1 {
        margin: 15px 0 12px;
        font-size: clamp(34px, 11vw, 44px);
    }

    body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head p {
        font-size: 13px;
        line-height: 1.55;
    }

    body.dse-enroll-modern .dse-enroll-code-form {
        padding: 26px 20px 28px;
    }

    body.dse-enroll-modern .dse-enroll-code-input {
        height: 62px;
        font-size: clamp(18px, 6vw, 25px);
        letter-spacing: .09em;
    }

    body.dse-enroll-modern .dse-enroll-code-form .dse-enroll-authorization {
        align-items: flex-start;
    }

    body.dse-enroll-modern .dse-enroll-trust-line {
        justify-content: center;
    }

    body.dse-enroll-modern .dse-enroll-promise {
        grid-template-columns: 1fr;
        gap: 7px;
        margin-top: 10px;
    }

    body.dse-enroll-modern .dse-enroll-promise > span {
        min-height: 52px;
    }

    body.dse-enroll-modern .dse-enroll-install-panel .dse-enroll-card-inner {
        padding: 24px 18px;
    }

    body.dse-enroll-modern .dse-enroll-install-panel > .dse-enroll-card-inner > .dse-enroll-alert:first-child {
        margin: -24px -18px 24px;
        padding: 13px 18px;
    }

    body.dse-enroll-modern .dse-enroll-install-panel .dse-enroll-card-head h1 {
        font-size: clamp(29px, 9vw, 38px);
    }

    body.dse-enroll-modern .dse-enroll-download-hero {
        grid-template-columns: minmax(0, 1fr);
        justify-items: center;
        padding: 18px;
        text-align: center;
    }

    body.dse-enroll-modern .dse-enroll-download-copy {
        align-items: center;
    }

    body.dse-enroll-modern .dse-enroll-download-hero .dse-enroll-download-form {
        width: 100%;
        grid-column: auto;
    }

    body.dse-enroll-modern .dse-enroll-install-steps {
        grid-template-columns: minmax(0, 1fr);
    }

    body.dse-enroll-modern .dse-enroll-install-steps li {
        min-height: 0;
    }

    body.dse-enroll-modern .dse-enroll-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }
}

@media (max-width: 390px) {
    body.dse-enroll-modern .dse-enroll-brand-copy span,
    body.dse-enroll-modern .dse-enroll-footer-brand > span {
        display: none;
    }

    body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head {
        padding: 28px 20px;
    }

    body.dse-enroll-modern .dse-enroll-code-form {
        padding-inline: 16px;
    }

    body.dse-enroll-modern .dse-enroll-progress li strong {
        max-width: 7ch;
    }
}

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

@media (forced-colors: active) {
    body.dse-enroll-modern,
    body.dse-enroll-modern::before,
    body.dse-enroll-modern::after,
    body.dse-enroll-modern .dse-enroll-header,
    body.dse-enroll-modern .dse-enroll-progress,
    body.dse-enroll-modern .dse-enroll-layout-entry .dse-enroll-card-head,
    body.dse-enroll-modern .dse-enroll-code-form {
        background: Canvas !important;
        color: CanvasText !important;
        forced-color-adjust: auto;
    }

    body.dse-enroll-modern :where(.dse-enroll-card, .dse-enroll-header, .dse-enroll-progress, .dse-enroll-code-input, .dse-enroll-authorization, .dse-enroll-download-hero, .dse-enroll-install-steps li) {
        border: 1px solid CanvasText !important;
        box-shadow: none !important;
    }

    body.dse-enroll-modern :where(.dse-enroll-brand-copy strong, .dse-enroll-brand-copy span, .dse-enroll-card-head h1, .dse-enroll-card-head h1 em, .dse-enroll-card-head p, .dse-enroll-eyebrow, .dse-enroll-progress strong, .dse-enroll-progress small) {
        color: CanvasText !important;
    }

    body.dse-enroll-modern .dse-enroll-button-primary {
        border: 2px solid ButtonText !important;
        background: ButtonFace !important;
        color: ButtonText !important;
        box-shadow: none !important;
    }

    body.dse-enroll-modern .dse-enroll-progress li[aria-current="step"] > span {
        border: 2px solid Highlight !important;
        background: Highlight !important;
        color: HighlightText !important;
    }
}

@media print {
    body.dse-enroll-modern {
        background: #fff !important;
        color: #000;
    }

    body.dse-enroll-modern::before,
    body.dse-enroll-modern::after,
    body.dse-enroll-modern .dse-enroll-progress,
    body.dse-enroll-modern .dse-enroll-promise,
    body.dse-enroll-modern .dse-enroll-footer {
        display: none !important;
    }

    body.dse-enroll-modern .dse-enroll-app,
    body.dse-enroll-modern .dse-enroll-card {
        width: 100%;
        margin: 0;
        padding: 0;
        border: 0 !important;
        box-shadow: none !important;
    }
}

/* ========================================================================== 
   Readability-first operating scale
   Presentation only: no workflow, visibility, or enrollment-state rules.
   ========================================================================== */

body.dse-enroll-modern {
    font-size: 15px !important;
    line-height: 1.55 !important;
}

/* Product chrome, progress, and compact operational metadata. */
body.dse-enroll-modern :where(
    .dse-enroll-brand-copy span,
    .dse-enroll-secure,
    .dse-enroll-secure > span,
    .dse-enroll-progress li > span,
    .dse-enroll-progress li small,
    .dse-enroll-eyebrow,
    .dse-enroll-required,
    .dse-enroll-help,
    .dse-enroll-field-error,
    .dse-enroll-trust-line,
    .dse-enroll-promise b,
    .dse-enroll-promise small,
    .dse-enroll-auto-download,
    .dse-enroll-ready-pill,
    .dse-enroll-download-icon > span:last-child,
    .dse-enroll-command-warning time,
    .dse-enroll-footer > a,
    .dse-enroll-footer-brand
) {
    font-size: 13px !important;
    line-height: 1.45 !important;
}

body.dse-enroll-modern .dse-enroll-progress li strong {
    font-size: 14px !important;
    line-height: 1.4 !important;
}

/* Primary instructions and supporting copy remain readable at every width. */
body.dse-enroll-modern :where(
    .dse-enroll-layout-entry .dse-enroll-card-head p,
    .dse-enroll-alert,
    .dse-enroll-platform-note p,
    .dse-enroll-recovery-note p,
    .dse-enroll-details-body,
    .dse-enroll-next-step p,
    .dse-enroll-command-warning,
    .dse-enroll-no-script
) {
    font-size: 15px !important;
    line-height: 1.6 !important;
}

/* Authorization and installer guidance use a clear primary/supporting pair. */
body.dse-enroll-modern :where(
    .dse-enroll-code-form .dse-enroll-authorization strong,
    .dse-enroll-promise small strong,
    .dse-enroll-install-panel > .dse-enroll-card-inner > .dse-enroll-alert:first-child strong,
    .dse-enroll-install-steps li strong,
    .dse-enroll-next-step strong,
    .dse-enroll-command-head strong
) {
    font-size: 15px !important;
    line-height: 1.45 !important;
}

body.dse-enroll-modern :where(
    .dse-enroll-code-form .dse-enroll-authorization small,
    .dse-enroll-install-panel > .dse-enroll-card-inner > .dse-enroll-alert:first-child span,
    .dse-enroll-install-steps li > span,
    .dse-enroll-install-steps li small,
    .dse-enroll-checklist li > span,
    .dse-enroll-checklist small,
    .dse-enroll-next-step p span,
    .dse-enroll-command-head small,
    .dse-enroll-security-summary small
) {
    font-size: 13px !important;
    line-height: 1.5 !important;
}

body.dse-enroll-modern .dse-enroll-download-copy > strong {
    font-size: 16px !important;
    line-height: 1.4 !important;
}

body.dse-enroll-modern :where(
    .dse-enroll-download-copy > strong span,
    .dse-enroll-download-copy > small,
    .dse-enroll-command-value
) {
    font-size: 14px !important;
    line-height: 1.5 !important;
}

/* Text-entry and actions keep comfortable type and touch targets. */
body.dse-enroll-modern :where(
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="password"],
    textarea,
    select
) {
    min-height: 52px !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
}

body.dse-enroll-modern .dse-enroll-code-input {
    font-size: clamp(18px, 6vw, 28px) !important;
}

body.dse-enroll-modern :where(
    button,
    .dse-enroll-button,
    .dse-enroll-details > summary
) {
    min-height: 48px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}
