:root {
    --psr-ink: #11212d;
    --psr-ink: color-mix(in srgb, var(--primary-color, #667eea) 16%, #11212d 84%);
    --psr-muted: #607086;
    --psr-muted: color-mix(in srgb, var(--secondary-color, #764ba2) 14%, #607086 86%);
    --psr-line: rgba(17, 33, 45, 0.10);
    --psr-line: color-mix(in srgb, var(--primary-color, #667eea) 10%, #d5dde6 90%);
    --psr-surface: rgba(255, 255, 255, 0.94);
    --psr-surface: color-mix(in srgb, var(--primary-color, #667eea) 3%, #ffffff 97%);
    --psr-surface-strong: rgba(255, 255, 255, 0.98);
    --psr-surface-strong: color-mix(in srgb, var(--secondary-color, #764ba2) 2%, #ffffff 98%);
    --psr-primary: var(--primary-color, #667eea);
    --psr-primary: color-mix(in srgb, var(--primary-color, #667eea) 78%, #0f172a 22%);
    --psr-primary-soft: rgba(102, 126, 234, 0.12);
    --psr-primary-soft: color-mix(in srgb, var(--primary-color, #667eea) 12%, #ffffff 88%);
    --psr-accent: var(--secondary-color, #764ba2);
    --psr-accent: color-mix(in srgb, var(--secondary-color, #764ba2) 82%, var(--primary-color, #667eea) 18%);
    --psr-accent-soft: rgba(118, 75, 162, 0.14);
    --psr-accent-soft: color-mix(in srgb, var(--secondary-color, #764ba2) 12%, #ffffff 88%);
    --psr-shadow: 0 18px 48px rgba(17, 33, 45, 0.08);
    --psr-radius-xl: 28px;
    --psr-radius-lg: 20px;
    --psr-radius-md: 16px;
    --psr-radius-sm: 12px;
}

body.platform-site-request-page {
    min-height: 100vh;
    /* background: #f8f9fa; */
    /* background: radial-gradient(circle at top left, color-mix(in srgb, var(--primary-color, #667eea) 8%, #ffffff 92%) 0%, transparent 30%), radial-gradient(circle at top right, color-mix(in srgb, var(--secondary-color, #764ba2) 7%, #ffffff 93%) 0%, transparent 24%), linear-gradient(180deg, #f8f9fa 0%, color-mix(in srgb, var(--primary-color, #667eea) 2%, #f8f9fa 98%) 100%); */
    color: var(--psr-ink);
    font-family: "Tajawal", system-ui, sans-serif;
}

.platform-site-request-page.platform-site-request-page--standalone .navbar,
.platform-site-request-page.platform-site-request-page--standalone .main-header,
.platform-site-request-page.platform-site-request-page--standalone .main-footer {
    display: none !important;
}

.platform-site-request-page .footer {
    margin-top: 24px;
}

.psr-shell {
    width: min(1240px, calc(100% - 32px));
    margin: 0 auto;
    padding: 22px 0 40px;
}

.platform-site-request-page .psr-shell {
    position: relative;
    z-index: 2;
}

.psr-hero {
    position: relative;
    overflow: hidden;
    padding: 34px;
    border: 1px solid var(--psr-line);
    border-radius: var(--psr-radius-xl);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.92)),
        linear-gradient(135deg, var(--psr-primary-soft), var(--psr-accent-soft));
    box-shadow: var(--psr-shadow);
    backdrop-filter: blur(12px);
}

.psr-hero::before,
.psr-hero::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    filter: blur(6px);
    opacity: 0.8;
}

.psr-hero::before {
    inset: auto auto -48px -28px;
    width: 180px;
    height: 180px;
    background: color-mix(in srgb, var(--primary-color, #667eea) 10%, #ffffff 90%);
    opacity: 0.55;
}

.psr-hero::after {
    inset: -56px -42px auto auto;
    width: 200px;
    height: 200px;
    background: color-mix(in srgb, var(--secondary-color, #764ba2) 10%, #ffffff 90%);
    opacity: 0.5;
}

.psr-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 8px 14px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary-color, #667eea) 8%, #ffffff 92%);
    color: var(--psr-primary);
    font-size: 14px;
    font-weight: 700;
}

.psr-hero h1 {
    margin: 0 0 10px;
    font-size: clamp(24px, 2.9vw, 38px);
    font-weight: 800;
    line-height: 1.28;
    text-wrap: balance;
}

.psr-hero p {
    max-width: 760px;
    margin: 0;
    color: var(--psr-muted);
    font-size: 16px;
    line-height: 1.9;
}

.psr-inline-note {
    display: flex;
    align-items: center;
    width: 100%;
    margin-top: 18px;
    padding: 10px 14px;
    border: 1px solid rgba(211, 139, 17, 0.22);
    border-radius: 14px;
    background: rgba(255, 248, 230, 0.82);
    color: #8b6115;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.8;
}

.psr-action-stack {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 18px;
}

.psr-action-stack .psr-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
}

.psr-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(420px, 0.95fr);
    gap: 24px;
    align-items: end;
}

.psr-hero-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
}

.psr-metric {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 122px;
    padding: 16px 14px;
    border-radius: var(--psr-radius-md);
    border: 1px solid var(--psr-line);
    background: rgba(255, 255, 255, 0.78);
    text-align: center;
}

.psr-metric-label {
    margin-bottom: 10px;
    color: #506073;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
}

.psr-metric-value {
    font-size: clamp(18px, 1.65vw, 28px);
    font-weight: 800;
    line-height: 1.28;
    max-width: 100%;
    overflow-wrap: normal;
    word-break: keep-all;
    text-wrap: balance;
}

.psr-hero--portal .psr-hero-grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(380px, 0.9fr);
    align-items: center;
}

.psr-hero--portal h1 {
    font-size: clamp(24px, 2.45vw, 34px);
    line-height: 1.3;
}

.psr-hero--portal p {
    font-size: 17px;
    line-height: 1.9;
}

.psr-hero--portal .psr-hero-metrics {
    align-self: stretch;
}

.psr-hero--portal .psr-metric {
    min-height: 144px;
    padding: 16px 12px;
}

.psr-hero--portal .psr-metric-label {
    margin-bottom: 10px;
    font-size: 12px;
    line-height: 1.5;
}

.psr-hero--portal .psr-metric-value {
    font-size: clamp(13px, 1vw, 18px);
    line-height: 1.45;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: normal;
}

.psr-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(280px, 0.72fr);
    gap: 22px;
    margin-top: 22px;
}

.psr-grid > * {
    min-width: 0;
}

.psr-card {
    width: 100%;
    min-width: 0;
    border: 1px solid var(--psr-line);
    border-radius: var(--psr-radius-xl);
    background: var(--psr-surface);
    box-shadow: var(--psr-shadow);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.psr-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 28px 72px rgba(17, 33, 45, 0.14);
}

.psr-live-state {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 22px;
    padding: 14px 18px;
    border-radius: 20px;
    border: 1px solid var(--psr-line);
    background: rgba(255, 255, 255, 0.84);
    box-shadow: 0 14px 34px rgba(17, 33, 45, 0.05);
    transition: border-color 180ms ease, transform 180ms ease, background 180ms ease;
}

.psr-live-state-copy {
    display: grid;
    gap: 4px;
}

.psr-live-state-copy strong {
    font-size: 16px;
    font-weight: 800;
}

.psr-live-state-copy span {
    color: var(--psr-muted);
    font-size: 14px;
}

.psr-live-state.is-loading {
    border-color: rgba(36, 99, 235, 0.22);
    background: rgba(239, 246, 255, 0.92);
    transform: translateY(-1px);
}

.psr-live-state.is-success {
    border-color: rgba(22, 163, 74, 0.22);
    background: rgba(240, 253, 244, 0.92);
}

.psr-live-state.is-error {
    border-color: rgba(220, 38, 38, 0.22);
    background: rgba(254, 242, 242, 0.96);
}

.psr-live-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 180px;
    padding: 10px 16px;
    border-radius: 999px;
    background: rgba(17, 33, 45, 0.08);
    color: var(--psr-ink);
    font-weight: 800;
}

.psr-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 24px 24px 0;
}

.psr-card-header h2,
.psr-card-header h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
}

.psr-card-header p {
    margin: 6px 0 0;
    color: var(--psr-muted);
}

.psr-card-body {
    padding: 24px;
}

.psr-progress {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: stretch;
    gap: 10px;
    padding: 18px 20px 8px;
}

.psr-progress-step {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-width: 0;
    min-height: 98px;
    padding: 14px 14px;
    border: 1px solid var(--psr-line);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.66);
    color: var(--psr-muted);
    text-align: right;
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, color 180ms ease;
}

.psr-progress-step.is-active,
.psr-progress-step.is-done {
    border-color: rgba(11, 122, 117, 0.28);
    background: rgba(11, 122, 117, 0.10);
    color: var(--psr-ink);
    transform: translateY(-2px);
}

.psr-progress-step-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 12px;
    background: rgba(17, 33, 45, 0.08);
    font-weight: 800;
    flex: 0 0 34px;
}

.psr-progress-step.is-active .psr-progress-step-index,
.psr-progress-step.is-done .psr-progress-step-index {
    background: var(--psr-primary);
    color: #fff;
}

.psr-progress-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.psr-progress-copy strong {
    display: block;
    max-width: 100%;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.psr-progress-copy span {
    display: block;
    max-width: 100%;
    font-size: 12px;
    line-height: 1.45;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    text-wrap: pretty;
}

.psr-progress-meter {
    padding: 0 24px 12px;
}

.psr-progress-bar {
    position: relative;
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(17, 33, 45, 0.08);
}

.psr-progress-bar > span {
    display: block;
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--psr-primary), var(--psr-accent));
    transition: width 280ms ease;
}

.psr-wizard {
    position: relative;
    min-height: 0;
}

.psr-panel {
    display: none;
}

.psr-panel.is-active {
    display: block;
    animation: psrPanelReveal 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes psrPanelReveal {
    from {
        opacity: 0;
        transform: translateY(18px) scale(0.988);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.psr-panel-head {
    margin-bottom: 22px;
}

.psr-panel-head h3 {
    margin: 0 0 8px;
    font-size: 26px;
    font-weight: 800;
}

.psr-panel-head p {
    margin: 0;
    color: var(--psr-muted);
    font-size: 16px;
    line-height: 1.85;
}

.psr-fieldset {
    margin-bottom: 24px;
    padding: 22px;
    border: 1px solid var(--psr-line);
    border-radius: var(--psr-radius-lg);
    background: rgba(255, 255, 255, 0.76);
}

.psr-fieldset-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    font-size: 18px;
    font-weight: 800;
}

.psr-fieldset-title i {
    color: var(--psr-primary);
}

.psr-input,
.psr-select,
.psr-textarea {
    border: 1px solid rgba(17, 33, 45, 0.12);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.92);
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.psr-input:focus,
.psr-select:focus,
.psr-textarea:focus {
    border-color: rgba(11, 122, 117, 0.42);
    box-shadow: 0 0 0 0.24rem rgba(11, 122, 117, 0.12);
    transform: translateY(-1px);
}

.psr-input-group {
    display: flex;
    align-items: stretch;
    gap: 10px;
}

.psr-input-group > * {
    flex: 1 1 auto;
}

.psr-domain-preview,
.psr-result-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 999px;
    background: rgba(17, 33, 45, 0.06);
    color: var(--psr-ink);
    font-size: 14px;
    font-weight: 700;
}

.psr-domain-check {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-top: 12px;
}

.psr-result-panel {
    min-height: 56px;
    padding: 14px 16px;
    border: 1px dashed rgba(17, 33, 45, 0.14);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.52);
    color: var(--psr-muted);
    line-height: 1.8;
}

.psr-result-panel.is-loading {
    position: relative;
    overflow: hidden;
    border-style: solid;
    color: #1d4ed8;
    background: linear-gradient(90deg, rgba(236, 245, 255, 0.92), rgba(255, 255, 255, 0.86), rgba(236, 245, 255, 0.92));
    background-size: 220% 100%;
    animation: psrShimmer 1.25s linear infinite;
}

.psr-result-panel.is-success {
    border-color: rgba(11, 122, 117, 0.28);
    background: rgba(11, 122, 117, 0.08);
    color: #0b5f5a;
}

.psr-result-panel.is-warning {
    border-color: rgba(237, 139, 51, 0.28);
    background: rgba(237, 139, 51, 0.10);
    color: #8a5620;
}

.psr-upload-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.psr-upload-card {
    position: relative;
    overflow: hidden;
    padding: 18px;
    border: 1px dashed rgba(17, 33, 45, 0.16);
    border-radius: var(--psr-radius-md);
    background: rgba(255, 255, 255, 0.72);
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.psr-upload-card:hover {
    transform: translateY(-2px);
    border-color: rgba(11, 122, 117, 0.24);
    box-shadow: 0 18px 36px rgba(17, 33, 45, 0.08);
}

.psr-upload-card.is-dragover {
    border-color: rgba(11, 122, 117, 0.46);
    background: rgba(11, 122, 117, 0.08);
}

.psr-upload-card.is-uploading::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(236, 245, 255, 0.82), rgba(255, 255, 255, 0.28), rgba(236, 245, 255, 0.82));
    background-size: 220% 100%;
    animation: psrShimmer 1.1s linear infinite;
    pointer-events: none;
}

.psr-upload-card.is-uploaded {
    border-color: rgba(22, 163, 74, 0.26);
    background: rgba(240, 253, 244, 0.82);
}

.psr-upload-card.is-upload-error {
    border-color: rgba(220, 38, 38, 0.24);
    background: rgba(254, 242, 242, 0.88);
}

.psr-upload-card.required::after {
    content: "مطلوب";
    position: absolute;
    top: 14px;
    left: 14px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(237, 139, 51, 0.16);
    color: #8a5620;
    font-size: 12px;
    font-weight: 700;
}

.psr-upload-card h4 {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 800;
}

.psr-upload-card p {
    min-height: 44px;
    margin: 0 0 10px;
    color: var(--psr-muted);
    font-size: 14px;
    line-height: 1.7;
}

.psr-upload-name {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--psr-primary);
}

.psr-upload-drop {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 12px;
    min-height: 62px;
    padding: 14px;
    border-radius: 16px;
    border: 1px dashed rgba(17, 33, 45, 0.14);
    background: rgba(255, 255, 255, 0.78);
    color: var(--psr-muted);
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: border-color 180ms ease, background 180ms ease, color 180ms ease;
}

.psr-upload-card.is-dragover .psr-upload-drop,
.psr-upload-drop:hover {
    border-color: rgba(11, 122, 117, 0.32);
    background: rgba(11, 122, 117, 0.08);
    color: var(--psr-primary);
}

.psr-upload-state {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(17, 33, 45, 0.07);
    color: var(--psr-muted);
    font-size: 12px;
    font-weight: 800;
}

.psr-upload-state.is-ready {
    background: rgba(22, 163, 74, 0.12);
    color: #166534;
}

.psr-sidebar {
    position: sticky;
    top: 24px;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.psr-summary-grid {
    display: grid;
    gap: 12px;
}

.psr-summary-item {
    padding: 14px 16px;
    border-radius: var(--psr-radius-md);
    border: 1px solid rgba(17, 33, 45, 0.08);
    background: rgba(255, 255, 255, 0.74);
}

.psr-summary-item span {
    display: block;
    margin-bottom: 8px;
    color: var(--psr-muted);
    font-size: 13px;
}

.psr-summary-item strong {
    display: block;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.7;
}

.psr-value-missing {
    color: #c53030 !important;
}

.psr-value-pending {
    color: #c77700 !important;
}

.psr-status-card {
    position: relative;
    overflow: hidden;
}

.psr-status-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    border-radius: inherit;
}

.psr-status-card.psr-tone-pending {
    border-color: rgba(194, 135, 11, 0.28);
    background: linear-gradient(180deg, rgba(255, 248, 230, 0.94), rgba(255, 255, 255, 0.86));
    box-shadow: inset 0 0 0 1px rgba(194, 135, 11, 0.06);
}

.psr-status-card.psr-tone-pending::before {
    background: linear-gradient(90deg, #d38b11, #f2c14e);
}

.psr-status-card.psr-tone-pending span,
.psr-status-card.psr-tone-pending .psr-metric-label {
    color: #8b6115;
}

.psr-status-card.psr-tone-pending strong,
.psr-status-card.psr-tone-pending .psr-metric-value {
    color: #7a4f00;
}

.psr-status-card.psr-tone-progress {
    border-color: rgba(36, 99, 235, 0.24);
    background: linear-gradient(180deg, rgba(236, 245, 255, 0.96), rgba(255, 255, 255, 0.88));
    box-shadow: inset 0 0 0 1px rgba(36, 99, 235, 0.06);
}

.psr-status-card.psr-tone-progress::before {
    background: linear-gradient(90deg, #2563eb, #38bdf8);
}

.psr-status-card.psr-tone-progress span,
.psr-status-card.psr-tone-progress .psr-metric-label {
    color: #1d4ed8;
}

.psr-status-card.psr-tone-progress strong,
.psr-status-card.psr-tone-progress .psr-metric-value {
    color: #1e40af;
}

.psr-status-card.psr-tone-success {
    border-color: rgba(22, 163, 74, 0.24);
    background: linear-gradient(180deg, rgba(237, 252, 242, 0.96), rgba(255, 255, 255, 0.88));
    box-shadow: inset 0 0 0 1px rgba(22, 163, 74, 0.06);
}

.psr-status-card.psr-tone-success::before {
    background: linear-gradient(90deg, #0f9f6e, #22c55e);
}

.psr-status-card.psr-tone-success span,
.psr-status-card.psr-tone-success .psr-metric-label {
    color: #15803d;
}

.psr-status-card.psr-tone-success strong,
.psr-status-card.psr-tone-success .psr-metric-value {
    color: #166534;
}

.psr-status-card.psr-tone-danger {
    border-color: rgba(220, 38, 38, 0.22);
    background: linear-gradient(180deg, rgba(254, 242, 242, 0.96), rgba(255, 255, 255, 0.88));
    box-shadow: inset 0 0 0 1px rgba(220, 38, 38, 0.06);
}

.psr-status-card.psr-tone-danger::before {
    background: linear-gradient(90deg, #dc2626, #f97316);
}

.psr-status-card.psr-tone-danger span,
.psr-status-card.psr-tone-danger .psr-metric-label {
    color: #b91c1c;
}

.psr-status-card.psr-tone-danger strong,
.psr-status-card.psr-tone-danger .psr-metric-value {
    color: #991b1b;
}

.psr-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    border-radius: 999px;
    background: rgba(11, 122, 117, 0.10);
    color: var(--psr-primary);
    font-size: 14px;
    font-weight: 800;
}

.psr-timeline {
    display: grid;
    gap: 14px;
}

.psr-timeline-item {
    position: relative;
    padding: 18px 18px 18px 18px;
    border-radius: var(--psr-radius-md);
    border: 1px solid rgba(17, 33, 45, 0.08);
    background: rgba(255, 255, 255, 0.76);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.psr-timeline-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 34px rgba(17, 33, 45, 0.08);
}

.psr-timeline-item::before {
    content: "";
    position: absolute;
    right: -10px;
    top: 22px;
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--psr-primary), var(--psr-accent));
    box-shadow: 0 0 0 6px rgba(11, 122, 117, 0.10);
}

.psr-timeline-meta {
    margin-top: 10px;
    color: var(--psr-muted);
    font-size: 13px;
}

.psr-review-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.psr-review-block {
    padding: 18px;
    border-radius: var(--psr-radius-md);
    border: 1px solid rgba(17, 33, 45, 0.08);
    background: rgba(255, 255, 255, 0.76);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.psr-review-block:hover,
.psr-summary-item:hover,
.psr-mini-list-item:hover,
.psr-kpi:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 30px rgba(17, 33, 45, 0.07);
}

.psr-review-block h4 {
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 800;
}

.psr-review-list {
    display: grid;
    gap: 10px;
}

.psr-review-row {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 10px;
    border-bottom: 1px dashed rgba(17, 33, 45, 0.10);
}

.psr-review-row:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.psr-review-row span {
    color: var(--psr-muted);
}

.psr-review-row strong {
    text-align: left;
    font-weight: 800;
}

.psr-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid rgba(17, 33, 45, 0.08);
}

.psr-actions-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.psr-btn {
    border-radius: 16px;
    padding: 12px 20px;
    font-weight: 800;
}

.psr-portal-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.72fr);
    gap: 22px;
    margin-top: 22px;
}

.psr-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.psr-kpi {
    padding: 20px;
    border-radius: var(--psr-radius-lg);
    border: 1px solid rgba(17, 33, 45, 0.08);
    background: rgba(255, 255, 255, 0.78);
}

.psr-kpi span {
    display: block;
    margin-bottom: 10px;
    color: var(--psr-muted);
    font-size: 13px;
}

.psr-kpi strong {
    display: block;
    font-size: 22px;
    font-weight: 800;
}

.psr-mini-list {
    display: grid;
    gap: 12px;
}

.psr-mini-list-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.76);
    border: 1px solid rgba(17, 33, 45, 0.08);
}

.psr-mini-list-item strong {
    display: block;
    margin-bottom: 6px;
}

.psr-muted {
    color: var(--psr-muted) !important;
}

.psr-skeleton-panel {
    display: grid;
    gap: 10px;
}

.psr-skeleton-line {
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(17, 33, 45, 0.08), rgba(255, 255, 255, 0.82), rgba(17, 33, 45, 0.08));
    background-size: 220% 100%;
    animation: psrShimmer 1.1s linear infinite;
}

.psr-skeleton-line.w-100 {
    width: 100%;
}

.psr-skeleton-line.w-75 {
    width: 75%;
}

.psr-skeleton-line.w-50 {
    width: 50%;
}

@keyframes psrShimmer {
    from {
        background-position: 200% 0;
    }
    to {
        background-position: -200% 0;
    }
}

@media (max-width: 1199.98px) {
    .psr-hero-grid,
    .psr-grid,
    .psr-portal-grid {
        grid-template-columns: 1fr;
    }

    .psr-sidebar {
        position: static;
    }

    .psr-progress {
        display: flex;
        align-items: stretch;
        gap: 10px;
        overflow-x: auto;
        padding-bottom: 8px;
        scrollbar-width: none;
    }

    .psr-progress::-webkit-scrollbar {
        display: none;
    }

    .psr-progress-step {
        flex: 0 0 220px;
        min-width: 220px;
    }

    .psr-hero-metrics,
    .psr-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .psr-live-state {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 767.98px) {
    body.platform-site-request-page {
        background: #f8f9fa;
    }

    .psr-shell {
        width: min(100% - 20px, 100%);
        padding-top: 16px;
        padding-bottom: 28px;
    }

    .psr-hero,
    .psr-card,
    .psr-live-state {
        background: #fff;
        box-shadow: 0 10px 24px rgba(17, 33, 45, 0.08);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    .psr-hero::before,
    .psr-hero::after {
        display: none;
    }

    .psr-fieldset,
    .psr-metric,
    .psr-progress-step {
        background: #fff;
    }

    .psr-hero,
    .psr-card-body,
    .psr-card-header,
    .psr-progress {
        padding-left: 18px;
        padding-right: 18px;
    }

    .psr-card-header {
        padding-top: 18px;
    }

    .psr-progress-meter {
        padding-left: 18px;
        padding-right: 18px;
    }

    .psr-upload-grid,
    .psr-review-grid,
    .psr-hero-metrics,
    .psr-kpi-grid {
        grid-template-columns: 1fr;
    }

    .psr-action-stack .psr-btn {
        width: 100%;
    }

    .psr-progress-step {
        min-width: 180px;
        min-height: 96px;
    }

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

    .psr-actions-group,
    .psr-actions .btn,
    .psr-actions .psr-btn {
        width: 100%;
    }
}

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