/* ProfileAI 2026 progressive enhancement layer.
   Existing layout and template library remain intact; these rules add the studio controls, PWA shell and dark mode. */
:root {
    --pa-surface: #ffffff;
    --pa-surface-soft: rgba(255, 255, 255, 0.76);
    --pa-surface-muted: #f6f7fb;
    --pa-border: rgba(15, 23, 42, 0.09);
    --pa-border-strong: rgba(15, 23, 42, 0.16);
    --pa-text: #111827;
    --pa-muted: #667085;
    --pa-accent: #6b46c1;
    --pa-accent-2: #8b5cf6;
    --pa-success: #15803d;
    --pa-danger: #b42318;
    --pa-shadow: 0 22px 70px rgba(15, 23, 42, 0.10);
    --pa-radius-lg: 28px;
    --pa-radius-md: 18px;
}

html { scroll-behavior: smooth; }
body {
    background:
        radial-gradient(circle at 15% 0%, rgba(139, 92, 246, 0.09), transparent 28rem),
        radial-gradient(circle at 85% 5%, rgba(59, 130, 246, 0.06), transparent 26rem),
        var(--bg);
}
button, input, select { font: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible {
    outline: 3px solid rgba(107, 70, 193, 0.24);
    outline-offset: 2px;
}

.site-header {
    background: rgba(248, 250, 252, 0.78) !important;
    border-bottom-color: rgba(15, 23, 42, 0.07) !important;
}
.header-inner { max-width: 1240px !important; }
.nav-link { color: #475467 !important; font-weight: 600; }
.nav-btn {
    background: #111827 !important;
    box-shadow: 0 6px 18px rgba(17, 24, 39, 0.14);
}
.pa-header-actions { display: flex; align-items: center; gap: 8px; }
.pa-icon-button {
    width: 38px; height: 38px; border: 1px solid var(--pa-border); border-radius: 12px;
    background: rgba(255, 255, 255, 0.72); color: var(--pa-text); cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.pa-icon-button:hover { transform: translateY(-1px); background: #fff; border-color: var(--pa-border-strong); }
.pa-icon-button svg { width: 18px; height: 18px; }

#uploadScreen { max-width: 860px !important; }
#uploadSection {
    border-radius: 30px !important;
    background: rgba(255,255,255,.82) !important;
    border: 1.5px dashed rgba(107,70,193,.28) !important;
    box-shadow: 0 18px 60px rgba(15,23,42,.07) !important;
    backdrop-filter: blur(18px);
}
.upload-btn { box-shadow: 0 10px 28px rgba(107,70,193,.25) !important; }
.sample-avatar { overflow: hidden; }
.sample-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

.pa-consent-card {
    max-width: 680px; margin: 0 auto 16px; padding: 13px 15px;
    border: 1px solid var(--pa-border); border-radius: 16px;
    background: rgba(255,255,255,.72); color: var(--pa-muted);
    display: flex; gap: 11px; align-items: flex-start; text-align: left;
    box-shadow: 0 8px 26px rgba(15,23,42,.04);
}
.pa-consent-card.pa-attention { animation: paShake .35s ease; border-color: rgba(180,35,24,.45); }
.pa-consent-card input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--pa-accent); flex: 0 0 auto; }
.pa-consent-card label { font-size: 12.5px; line-height: 1.55; cursor: pointer; }
.pa-consent-card a { color: var(--pa-accent); font-weight: 700; text-decoration: none; }
@keyframes paShake { 25% { transform: translateX(-5px) } 50% { transform: translateX(5px) } 75% { transform: translateX(-3px) } }

#editorScreen { max-width: 1280px !important; padding-left: 18px !important; padding-right: 18px !important; }
.preview-sticky-container {
    background: var(--pa-surface-soft) !important;
    border: 1px solid var(--pa-border) !important;
    box-shadow: var(--pa-shadow) !important;
    backdrop-filter: blur(22px);
    border-radius: 30px !important;
}
#editorScreen .lg\:flex-1 {
    background: var(--pa-surface-soft) !important;
    border-color: var(--pa-border) !important;
    box-shadow: 0 18px 60px rgba(15,23,42,.06) !important;
    backdrop-filter: blur(18px);
}

.pa-status-line {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    margin: -8px 0 14px; color: var(--pa-muted); font-size: 11.5px;
}
.pa-status-pill {
    display: inline-flex; align-items: center; gap: 6px; padding: 6px 9px;
    border: 1px solid var(--pa-border); border-radius: 999px; background: var(--pa-surface);
}
.pa-status-dot { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px rgba(34,197,94,.12); }

.pa-compare-wrap {
    position: relative; width: 100%; max-width: 300px; aspect-ratio: 1 / 1;
    margin: 0 auto 18px; border-radius: 50%; overflow: hidden;
    background: linear-gradient(135deg,#eef2f7,#f8fafc);
    box-shadow: 0 24px 54px rgba(15,23,42,.16);
    touch-action: none;
}
.pa-compare-wrap[data-shape="35%"] { border-radius: 35%; }
.pa-compare-wrap[data-shape="20%"] { border-radius: 20%; }
.pa-compare-wrap[data-shape="10%"] { border-radius: 10%; }
.pa-compare-wrap[data-shape="0%"] { border-radius: 0; }
.pa-compare-wrap > img {
    position: absolute; inset: 0; width: 100% !important; height: 100% !important;
    max-width: none !important; border-radius: 0 !important; object-fit: cover !important;
    box-shadow: none !important; user-select: none; -webkit-user-drag: none;
}
#paBeforeImage { z-index: 1; }
#finalPreview { z-index: 2; clip-path: inset(0 0 0 50%); }
.pa-compare-divider {
    position: absolute; z-index: 4; top: 0; bottom: 0; left: 50%; width: 2px;
    background: #fff; box-shadow: 0 0 0 1px rgba(15,23,42,.08), 0 0 18px rgba(15,23,42,.25);
    pointer-events: none;
}
.pa-compare-handle {
    position: absolute; z-index: 5; left: 50%; top: 50%; transform: translate(-50%,-50%);
    width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.96);
    border: 1px solid rgba(15,23,42,.1); display: flex; align-items: center; justify-content: center;
    box-shadow: 0 10px 30px rgba(15,23,42,.18); pointer-events: none; color: #344054;
}
.pa-compare-range { position: absolute; inset: 0; z-index: 6; opacity: 0; cursor: ew-resize; width: 100%; height: 100%; }
.pa-compare-label {
    position: absolute; z-index: 3; top: 12px; padding: 5px 8px; border-radius: 999px;
    background: rgba(17,24,39,.68); color: #fff; font-size: 10px; font-weight: 800;
    letter-spacing: .05em; text-transform: uppercase; backdrop-filter: blur(8px); pointer-events: none;
}
.pa-compare-label.before { left: 12px; }
.pa-compare-label.after { right: 12px; }

.pa-toolbar {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px;
}
.pa-tool-btn {
    min-height: 38px; border: 1px solid var(--pa-border); border-radius: 12px;
    background: var(--pa-surface); color: var(--pa-text); font-size: 12px; font-weight: 750;
    display: inline-flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, opacity .18s ease;
}
.pa-tool-btn:hover:not(:disabled) { transform: translateY(-1px); border-color: rgba(107,70,193,.28); }
.pa-tool-btn:disabled { opacity: .38; cursor: not-allowed; }
.pa-tool-btn svg { width: 15px; height: 15px; }

.pa-control-card {
    border: 1px solid var(--pa-border); border-radius: 18px; background: var(--pa-surface-muted);
    padding: 14px; margin-bottom: 12px;
}
.pa-control-card summary {
    display: flex; justify-content: space-between; align-items: center; list-style: none;
    cursor: pointer; font-size: 12px; font-weight: 850; color: var(--pa-text);
}
.pa-control-card summary::-webkit-details-marker { display: none; }
.pa-control-card summary::after { content: '+'; color: var(--pa-muted); font-size: 18px; font-weight: 500; }
.pa-control-card[open] summary::after { content: '–'; }
.pa-control-grid { display: grid; gap: 12px; margin-top: 14px; }
.pa-range-row { display: grid; grid-template-columns: 1fr auto; gap: 7px 10px; align-items: center; }
.pa-range-row label { font-size: 11px; font-weight: 720; color: var(--pa-muted); }
.pa-range-value { font-size: 10.5px; font-weight: 800; color: var(--pa-text); min-width: 42px; text-align: right; }
.pa-range-row input[type="range"] { grid-column: 1 / -1; width: 100%; accent-color: var(--pa-accent); }
.pa-color-inline { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pa-color-inline input[type="color"] { width: 42px; height: 30px; border: 0; padding: 0; background: transparent; cursor: pointer; }

.pa-export-card {
    border: 1px solid var(--pa-border); border-radius: 18px; background: var(--pa-surface-muted);
    padding: 14px; margin-bottom: 12px;
}
.pa-export-title { font-size: 12px; font-weight: 850; color: var(--pa-text); margin-bottom: 10px; }
.pa-export-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pa-select {
    width: 100%; height: 40px; border: 1px solid var(--pa-border); border-radius: 11px;
    background: var(--pa-surface); color: var(--pa-text); padding: 0 10px; font-size: 11.5px; font-weight: 700;
}
.pa-action-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.pa-share-btn {
    width: 48px; border: 1px solid rgba(107,70,193,.18); border-radius: 14px;
    background: #ede9fe; color: var(--pa-accent); display: inline-flex; align-items: center; justify-content: center;
    cursor: pointer;
}
.download-btn { border-radius: 14px !important; min-height: 48px; }

.pa-toast-region { position: fixed; z-index: 10050; top: 78px; right: 18px; display: grid; gap: 10px; width: min(360px, calc(100vw - 36px)); pointer-events: none; }
.pa-toast {
    pointer-events: auto; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: start;
    padding: 13px 14px; border-radius: 16px; border: 1px solid var(--pa-border);
    background: rgba(255,255,255,.94); color: var(--pa-text); box-shadow: 0 18px 44px rgba(15,23,42,.16);
    backdrop-filter: blur(18px); animation: paToastIn .24s ease-out;
}
.pa-toast.pa-error { border-color: rgba(180,35,24,.22); }
.pa-toast.pa-success { border-color: rgba(21,128,61,.22); }
.pa-toast-icon { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: #f2f4f7; font-size: 12px; font-weight: 900; }
.pa-toast.pa-error .pa-toast-icon { background: #fee4e2; color: var(--pa-danger); }
.pa-toast.pa-success .pa-toast-icon { background: #dcfae6; color: var(--pa-success); }
.pa-toast strong { display: block; font-size: 12.5px; margin-bottom: 2px; }
.pa-toast p { margin: 0; color: var(--pa-muted); font-size: 11.5px; line-height: 1.45; }
.pa-toast button { border: 0; background: transparent; color: var(--pa-muted); cursor: pointer; font-size: 18px; line-height: 1; }
@keyframes paToastIn { from { opacity: 0; transform: translateY(-8px) scale(.98); } }

.pa-modal-backdrop {
    position: fixed; z-index: 10040; inset: 0; background: rgba(15,23,42,.46);
    backdrop-filter: blur(8px); display: none; place-items: center; padding: 18px;
}
.pa-modal-backdrop.active { display: grid; }
.pa-modal {
    width: min(460px, 100%); border-radius: 28px; padding: 28px;
    background: var(--pa-surface); border: 1px solid var(--pa-border); box-shadow: 0 30px 90px rgba(15,23,42,.28);
    color: var(--pa-text); text-align: center;
}
.pa-modal-icon { width: 54px; height: 54px; margin: 0 auto 14px; border-radius: 18px; background: #fee4e2; color: var(--pa-danger); display: grid; place-items: center; }
.pa-modal h3 { margin: 0 0 8px; font-size: 21px; font-weight: 900; }
.pa-modal p { margin: 0; color: var(--pa-muted); line-height: 1.6; font-size: 13.5px; }
.pa-modal-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px; }
.pa-modal-actions button { border: 0; border-radius: 13px; padding: 12px; font-weight: 800; cursor: pointer; }
.pa-modal-secondary { background: #f2f4f7; color: #344054; }
.pa-modal-primary { background: var(--pa-accent); color: #fff; }

.pa-mobile-dock {
    display: none; position: fixed; z-index: 900; left: 12px; right: 12px; bottom: max(12px, env(safe-area-inset-bottom));
    padding: 8px; border: 1px solid var(--pa-border); border-radius: 18px;
    background: rgba(255,255,255,.88); box-shadow: 0 20px 50px rgba(15,23,42,.2); backdrop-filter: blur(22px);
    grid-template-columns: repeat(4, 1fr); gap: 6px;
}
.pa-mobile-dock button {
    border: 0; border-radius: 12px; min-height: 44px; background: transparent; color: #344054;
    display: grid; place-items: center; gap: 2px; font-size: 9px; font-weight: 800;
}
.pa-mobile-dock svg { width: 18px; height: 18px; }
.pa-mobile-dock .primary { background: var(--pa-accent); color: #fff; }

.pa-install-banner {
    position: fixed; z-index: 880; left: 50%; bottom: 24px; transform: translateX(-50%);
    display: none; align-items: center; gap: 12px; width: min(480px, calc(100vw - 32px));
    padding: 12px 14px; border: 1px solid var(--pa-border); border-radius: 18px;
    background: rgba(255,255,255,.94); box-shadow: 0 18px 48px rgba(15,23,42,.18); backdrop-filter: blur(20px);
}
.pa-install-banner.active { display: flex; }
.pa-install-banner img { width: 38px; height: 38px; border-radius: 10px; }
.pa-install-copy { flex: 1; min-width: 0; }
.pa-install-copy strong { display: block; font-size: 12px; color: var(--pa-text); }
.pa-install-copy span { display: block; font-size: 10.5px; color: var(--pa-muted); margin-top: 2px; }
.pa-install-banner button { border: 0; border-radius: 10px; padding: 9px 12px; cursor: pointer; font-size: 11px; font-weight: 800; }
.pa-install-yes { background: var(--pa-accent); color: #fff; }
.pa-install-no { background: transparent; color: var(--pa-muted); }

/* Dark mode */
html[data-theme="dark"] {
    color-scheme: dark;
    --bg: #0b0f17;
    --text: #d0d5dd;
    --pa-surface: #151a24;
    --pa-surface-soft: rgba(21, 26, 36, 0.82);
    --pa-surface-muted: #111620;
    --pa-border: rgba(255,255,255,.09);
    --pa-border-strong: rgba(255,255,255,.16);
    --pa-text: #f2f4f7;
    --pa-muted: #98a2b3;
    --pa-shadow: 0 24px 70px rgba(0,0,0,.32);
}
html[data-theme="dark"] body { background: radial-gradient(circle at 20% 0%, rgba(107,70,193,.18), transparent 30rem), #0b0f17 !important; color: var(--pa-text); }
html[data-theme="dark"] .site-header { background: rgba(11,15,23,.78) !important; border-color: var(--pa-border) !important; }
html[data-theme="dark"] .nav-link { color: #cbd5e1 !important; }
html[data-theme="dark"] .pa-icon-button,
html[data-theme="dark"] .pa-toast,
html[data-theme="dark"] .pa-install-banner,
html[data-theme="dark"] .pa-mobile-dock { background: rgba(21,26,36,.92); }
html[data-theme="dark"] #uploadSection,
html[data-theme="dark"] .pa-consent-card { background: rgba(21,26,36,.74) !important; }
html[data-theme="dark"] #uploadSection h3,
html[data-theme="dark"] #editorScreen h2,
html[data-theme="dark"] #editorScreen span[style*="color:#1e293b"],
html[data-theme="dark"] .faq-item h3,
html[data-theme="dark"] .faq-section h2,
html[data-theme="dark"] .how-section h2,
html[data-theme="dark"] .cta-box h2 { color: #f2f4f7 !important; }
html[data-theme="dark"] #editorScreen .lg\:flex-1,
html[data-theme="dark"] .preview-sticky-container { background: rgba(21,26,36,.82) !important; }
html[data-theme="dark"] .ui-colors-panel,
html[data-theme="dark"] #editorScreen div[style*="background:#f8fafc"] { background: #111620 !important; border-color: var(--pa-border) !important; }
html[data-theme="dark"] .template-card { border-color: var(--pa-border) !important; }
html[data-theme="dark"] .how-section,
html[data-theme="dark"] .cta-section,
html[data-theme="dark"] .faq-section,
html[data-theme="dark"] .pfp-section { background: #0b0f17 !important; }
html[data-theme="dark"] .cta-box { background: #171329 !important; }
html[data-theme="dark"] .faq-item p,
html[data-theme="dark"] .how-section p,
html[data-theme="dark"] .pfp-section p { color: #98a2b3 !important; }
html[data-theme="dark"] #pageLoader { background: linear-gradient(135deg,#0b0f17,#151026,#241741) !important; }
html[data-theme="dark"] .loader-brand { color: #fff; }
html[data-theme="dark"] .loader-sub { color: #b4a7d6; }

@media (max-width: 900px) {
    .nav-links .nav-link { display: none; }
    #editorScreen .w-full.lg\:w-1\/3 { max-width: none !important; }
    .preview-sticky-container { position: static !important; }
}
@media (max-width: 640px) {
    body.pa-editor-open { padding-bottom: 78px; }
    .header-inner { padding: 10px 14px !important; }
    .logo-avatar { width: 36px !important; height: 36px !important; }
    .nav-btn { padding: 7px 11px !important; font-size: 12px !important; }
    #uploadScreen { padding-left: 15px !important; padding-right: 15px !important; }
    #uploadSection { border-radius: 24px !important; padding-left: 18px !important; padding-right: 18px !important; }
    #editorScreen { padding: 14px 10px 84px !important; }
    .preview-sticky-container { border-radius: 24px !important; padding: 16px !important; }
    .pa-compare-wrap { max-width: 270px; }
    .pa-mobile-dock.pa-visible { display: grid; }
    .pa-install-banner { bottom: 82px; }
    .pa-toast-region { top: 64px; right: 10px; width: calc(100vw - 20px); }
    .pa-export-grid { grid-template-columns: 1fr; }
    .pa-modal { padding: 24px 20px; border-radius: 24px; }
    .pa-modal-actions { grid-template-columns: 1fr; }
}
/* Essential utility fallbacks when the Tailwind CDN is slow or unavailable. */
.hidden { display: none !important; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }


/* ProfileAI premium shell update 2026.07.2 */
.pa-api-nav-link { display:inline-flex!important; align-items:center; gap:6px; }
.pa-api-nav-link span { padding:2px 6px; border-radius:999px; background:linear-gradient(135deg,#ede9fe,#f5f3ff); color:#6b46c1; font-size:8px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }

/* Creative splash loader */
#pageLoader { overflow:hidden; background:
    radial-gradient(circle at 30% 20%,rgba(139,92,246,.20),transparent 32rem),
    radial-gradient(circle at 75% 75%,rgba(59,130,246,.14),transparent 28rem),#f8f7ff!important; }
#pageLoader::before { content:""; position:absolute; inset:-30%; background-image:radial-gradient(circle,rgba(107,70,193,.11) 1px,transparent 1.5px); background-size:24px 24px; transform:rotate(12deg); animation:paLoaderGrid 18s linear infinite; }
.pa-splash-orbit { position:relative; width:150px; height:150px; display:grid; place-items:center; margin-bottom:25px; isolation:isolate; }
.pa-splash-logo { position:relative; z-index:5; width:82px; height:82px; display:grid; place-items:center; border-radius:28px; background:rgba(255,255,255,.86); border:1px solid rgba(255,255,255,.9); box-shadow:0 24px 60px rgba(76,29,149,.17),inset 0 1px 0 #fff; backdrop-filter:blur(20px); animation:paLoaderFloat 2.7s ease-in-out infinite; }
.pa-splash-logo img { width:68px; height:68px; object-fit:contain; }
.pa-splash-ring { position:absolute; inset:0; border-radius:50%; border:1px solid rgba(107,70,193,.16); }
.pa-splash-ring.ring-one { inset:7px; border-top-color:#6b46c1; border-right-color:#8b5cf6; animation:paSpin 2.8s linear infinite; }
.pa-splash-ring.ring-two { inset:24px; border-style:dashed; border-color:rgba(59,130,246,.38); animation:paSpinReverse 4.2s linear infinite; }
.pa-splash-ring.ring-three { inset:-12px; border-color:rgba(139,92,246,.09); animation:paPulseRing 2.5s ease-in-out infinite; }
.pa-splash-scan { position:absolute; z-index:6; width:96px; height:2px; border-radius:999px; background:linear-gradient(90deg,transparent,#8b5cf6,transparent); box-shadow:0 0 18px #8b5cf6; animation:paScan 2.2s ease-in-out infinite; }
.pa-splash-dot { position:absolute; width:9px; height:9px; border-radius:50%; box-shadow:0 0 0 5px rgba(107,70,193,.08); }
.pa-splash-dot.dot-one { top:10px; left:30px; background:#8b5cf6; animation:paDot 1.8s .1s ease-in-out infinite; }
.pa-splash-dot.dot-two { right:3px; top:74px; background:#3b82f6; animation:paDot 1.8s .55s ease-in-out infinite; }
.pa-splash-dot.dot-three { bottom:9px; left:38px; background:#ec4899; animation:paDot 1.8s 1s ease-in-out infinite; }
#pageLoader .loader-brand { position:relative; z-index:2; font-size:25px; letter-spacing:-.05em; }
#pageLoader .loader-sub { position:relative; z-index:2; min-height:20px; font-size:12px; font-weight:700; color:#7c6c99; letter-spacing:.01em; }
.pa-splash-progress { position:relative; z-index:2; width:154px; height:3px; margin-top:18px; overflow:hidden; border-radius:999px; background:rgba(107,70,193,.10); }
.pa-splash-progress span { display:block; width:42%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#6b46c1,#a78bfa,#3b82f6); animation:paIndeterminate 1.45s cubic-bezier(.65,0,.35,1) infinite; }
@keyframes paLoaderGrid { to{transform:rotate(12deg) translate3d(24px,24px,0)} }
@keyframes paLoaderFloat { 50%{transform:translateY(-7px) rotate(1.5deg)} }
@keyframes paSpin { to{transform:rotate(360deg)} }
@keyframes paSpinReverse { to{transform:rotate(-360deg)} }
@keyframes paPulseRing { 50%{transform:scale(1.06);opacity:.4} }
@keyframes paScan { 0%,100%{transform:translateY(-38px);opacity:.15} 50%{transform:translateY(38px);opacity:1} }
@keyframes paDot { 50%{transform:scale(1.55);filter:brightness(1.15)} }
@keyframes paIndeterminate { from{transform:translateX(-110%)} to{transform:translateX(350%)} }

/* Creative photo processing animation */
#loadingScreen { padding:32px 20px!important; text-align:center; background:radial-gradient(circle at 50% 38%,rgba(107,70,193,.08),transparent 28rem); }
#loadingScreen h2 { margin:17px 0 7px!important; color:#171329!important; font-size:clamp(1.65rem,5vw,2.25rem)!important; letter-spacing:-.045em!important; }
#loadingScreen > p { max-width:430px; margin:0 auto 21px; color:#667085; line-height:1.55; font-size:13px; }
.pa-processing-kicker { display:inline-flex; align-items:center; gap:7px; color:#6b46c1; font-size:10px; text-transform:uppercase; letter-spacing:.17em; font-weight:900; }
.pa-processing-kicker::before { content:""; width:6px; height:6px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 5px rgba(34,197,94,.11); animation:paDot 1.6s ease-in-out infinite; }
.pa-processing-visual { position:relative; width:150px; height:150px; margin:0 auto; display:grid; place-items:center; perspective:700px; }
.pa-processing-photo { position:relative; z-index:4; width:92px; height:108px; border-radius:29px; background:linear-gradient(145deg,#fff,#f3efff); border:1px solid rgba(107,70,193,.12); box-shadow:0 25px 60px rgba(76,29,149,.18); display:grid; place-items:center; overflow:hidden; animation:paPhotoTilt 3.4s ease-in-out infinite; }
.pa-processing-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.82) 48%,transparent 66%); transform:translateX(-130%); animation:paShimmer 1.8s ease-in-out infinite; }
.pa-processing-photo img { width:74px; height:74px; object-fit:contain; }
.pa-processing-slice { position:absolute; left:20px; right:20px; height:1px; background:linear-gradient(90deg,transparent,#8b5cf6,transparent); box-shadow:0 0 16px rgba(139,92,246,.65); z-index:6; }
.pa-processing-slice.slice-a { top:39px; animation:paSlice 2s .1s ease-in-out infinite; }
.pa-processing-slice.slice-b { top:72px; animation:paSlice 2s .45s ease-in-out infinite; }
.pa-processing-slice.slice-c { top:105px; animation:paSlice 2s .8s ease-in-out infinite; }
.pa-processing-beam { position:absolute; z-index:5; width:110px; height:18px; border-radius:50%; background:rgba(139,92,246,.16); filter:blur(9px); animation:paBeam 2s ease-in-out infinite; }
.pa-processing-spark { position:absolute; width:7px; height:7px; border-radius:50%; background:#8b5cf6; box-shadow:0 0 15px currentColor; }
.pa-processing-spark.spark-a { left:8px; top:50px; color:#8b5cf6; animation:paOrbitSpark 2.9s linear infinite; }
.pa-processing-spark.spark-b { right:10px; top:86px; color:#3b82f6; animation:paOrbitSpark 3.4s -.8s linear infinite reverse; }
.pa-processing-spark.spark-c { left:42px; bottom:4px; color:#ec4899; animation:paOrbitSpark 3.8s -1.4s linear infinite; }
#loadingScreen .progress-track { width:min(420px,86vw); height:7px; margin:0 auto; background:#ebe7f7; border-radius:999px; padding:1px; box-shadow:inset 0 1px 2px rgba(15,23,42,.08); }
#loadingScreen #progressBar { height:100%; border-radius:999px; background:linear-gradient(90deg,#6b46c1,#8b5cf6,#3b82f6); box-shadow:0 0 16px rgba(107,70,193,.24); transition:width .4s cubic-bezier(.2,.7,.2,1); }
.pa-processing-meta { width:min(420px,86vw); margin:9px auto 0; display:flex; justify-content:space-between; gap:20px; color:#98a2b3; font-size:10.5px; font-weight:700; }
#paProgressNumber { color:#6b46c1; font-variant-numeric:tabular-nums; }
@keyframes paPhotoTilt { 0%,100%{transform:rotateY(-5deg) rotateX(2deg) translateY(2px)} 50%{transform:rotateY(5deg) rotateX(-2deg) translateY(-5px)} }
@keyframes paShimmer { to{transform:translateX(130%)} }
@keyframes paSlice { 0%,100%{transform:scaleX(.35);opacity:.15} 50%{transform:scaleX(1);opacity:1} }
@keyframes paBeam { 0%,100%{transform:translateY(-48px);opacity:.15} 50%{transform:translateY(48px);opacity:.85} }
@keyframes paOrbitSpark { 50%{transform:translate(8px,-13px) scale(1.45)} }

/* Export selector redesign */
.pa-export-card { position:relative; overflow:hidden; padding:16px; border-radius:22px; background:linear-gradient(145deg,var(--pa-surface),var(--pa-surface-muted)); box-shadow:inset 0 1px 0 rgba(255,255,255,.7); }
.pa-export-card::before { content:""; position:absolute; width:130px; height:130px; right:-58px; top:-72px; border-radius:50%; background:radial-gradient(circle,rgba(139,92,246,.15),transparent 70%); pointer-events:none; }
.pa-export-heading { position:relative; display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:13px; }
.pa-export-eyebrow { display:block; margin-bottom:3px; color:var(--pa-accent); font-size:8px; font-weight:900; letter-spacing:.15em; text-transform:uppercase; }
.pa-export-title { margin:0; font-size:13.5px; letter-spacing:-.02em; }
.pa-export-ready { display:inline-flex; align-items:center; gap:5px; padding:5px 8px; border-radius:999px; background:rgba(21,128,61,.08); color:#15803d; font-size:8px; font-weight:900; text-transform:uppercase; letter-spacing:.07em; }
.pa-export-ready i { width:5px; height:5px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 4px rgba(34,197,94,.1); }
.pa-platform-options { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.pa-platform-option { position:relative; min-width:0; padding:9px; border:1px solid var(--pa-border); border-radius:14px; background:var(--pa-surface); color:var(--pa-text); display:grid; grid-template-columns:31px 1fr 8px; gap:8px; align-items:center; text-align:left; cursor:pointer; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.pa-platform-option:hover { transform:translateY(-1px); border-color:rgba(107,70,193,.28); }
.pa-platform-option.active { border-color:rgba(107,70,193,.38); background:linear-gradient(145deg,rgba(107,70,193,.08),rgba(139,92,246,.035)); box-shadow:0 8px 20px rgba(107,70,193,.08); }
.pa-platform-option.wide { grid-column:1/-1; }
.pa-platform-option > i { width:7px; height:7px; border-radius:50%; border:1.5px solid #c7c9d1; }
.pa-platform-option.active > i { border:2px solid #fff; background:var(--pa-accent); box-shadow:0 0 0 2px var(--pa-accent); }
.pa-platform-option strong { display:block; overflow:hidden; text-overflow:ellipsis; font-size:9.5px; line-height:1.2; }
.pa-platform-option small { display:block; margin-top:2px; color:var(--pa-muted); font-size:7.5px; font-weight:700; white-space:nowrap; }
.pa-platform-mark { width:31px; height:31px; border-radius:10px; display:grid; place-items:center; color:#fff; font-size:10px; font-weight:900; box-shadow:0 6px 15px rgba(15,23,42,.12); }
.pa-platform-mark.linkedin{background:#0a66c2}.pa-platform-mark.instagram{background:linear-gradient(135deg,#833ab4,#fd1d1d,#fcb045);font-size:18px}.pa-platform-mark.whatsapp{background:#16a34a;font-size:17px}.pa-platform-mark.cv{background:#344054}.pa-platform-mark.hd{background:linear-gradient(135deg,#6b46c1,#3b82f6)}
.pa-format-row { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:10px; margin-top:10px; padding-top:10px; border-top:1px solid var(--pa-border); }
.pa-format-row label { color:var(--pa-muted); font-size:8.5px; font-weight:850; white-space:nowrap; }
.pa-format-row .pa-select { height:36px; border-radius:11px; font-size:9.5px; }
.pa-export-native-select { position:absolute!important; width:1px!important; height:1px!important; opacity:0!important; pointer-events:none!important; }

/* Mobile app shell */
.pa-app-navigation { display:none; }
@media(max-width:640px){
  html { background:var(--bg); overscroll-behavior-y:none; }
  body { padding-bottom:calc(79px + env(safe-area-inset-bottom)); -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
  body.pa-editor-open { padding-bottom:calc(82px + env(safe-area-inset-bottom)); }
  .site-header { top:max(0px,env(safe-area-inset-top)); padding:7px 8px!important; }
  .header-inner { min-height:54px; border-radius:19px!important; background:rgba(255,255,255,.78)!important; border:1px solid rgba(255,255,255,.78)!important; box-shadow:0 7px 25px rgba(15,23,42,.08)!important; }
  .logo-text { font-size:16px!important; }
  .logo-badge { font-size:9px!important; }
  .nav-links { margin-left:auto; }
  .nav-links .nav-link,.nav-links .pa-api-nav-link { display:none!important; }
  .nav-btn { min-height:36px; display:inline-flex; align-items:center; }
  .pa-header-actions { gap:4px; }
  .pa-icon-button { width:36px; height:36px; border-radius:12px; }
  #uploadScreen { padding-top:26px!important; }
  .pa-app-navigation { position:fixed; z-index:870; left:9px; right:9px; bottom:max(8px,env(safe-area-inset-bottom)); min-height:62px; padding:6px; display:grid; grid-template-columns:repeat(4,1fr); gap:4px; border:1px solid rgba(15,23,42,.09); border-radius:21px; background:rgba(255,255,255,.89); box-shadow:0 22px 55px rgba(15,23,42,.20); backdrop-filter:blur(24px) saturate(160%); -webkit-backdrop-filter:blur(24px) saturate(160%); }
  .pa-app-navigation a { min-width:0; border-radius:15px; color:#778094; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:3px; text-decoration:none; font-size:8px; font-weight:850; transition:.2s ease; }
  .pa-app-navigation a.active { color:#5b35ad; background:rgba(107,70,193,.07); }
  .pa-app-nav-icon { width:27px; height:27px; display:grid; place-items:center; border-radius:10px; }
  .pa-app-nav-icon svg { width:17px; height:17px; }
  .pa-app-nav-icon.primary { color:#fff; background:linear-gradient(145deg,#6b46c1,#8b5cf6); box-shadow:0 7px 17px rgba(107,70,193,.27); }
  body.pa-editor-open .pa-app-navigation { display:none; }
  .pa-mobile-dock { z-index:890; bottom:max(8px,env(safe-area-inset-bottom)); border-radius:21px; min-height:62px; }
  .pa-install-banner { bottom:calc(79px + env(safe-area-inset-bottom)); }
  .pa-platform-options { grid-template-columns:1fr; }
  .pa-platform-option.wide { grid-column:auto; }
  .pa-platform-option { min-height:50px; padding:9px 11px; grid-template-columns:34px 1fr 9px; }
  .pa-platform-mark { width:34px;height:34px; }
  .pa-platform-option strong { font-size:10.5px; }
  .pa-platform-option small { font-size:8px; }
  .pa-format-row { grid-template-columns:1fr; gap:5px; }
}
@media(display-mode:standalone){
  .site-header { padding-top:max(7px,env(safe-area-inset-top))!important; }
  body { user-select:none; }
  input,textarea,select { user-select:text; }
}

html[data-theme="dark"] .pa-api-nav-link span { background:rgba(139,92,246,.15); color:#c4b5fd; }
html[data-theme="dark"] .pa-app-navigation { background:rgba(17,22,32,.90); border-color:rgba(255,255,255,.09); }
html[data-theme="dark"] .pa-app-navigation a { color:#8992a3; }
html[data-theme="dark"] .pa-app-navigation a.active { color:#c4b5fd; background:rgba(139,92,246,.12); }
html[data-theme="dark"] #loadingScreen h2 { color:#f4f3ff!important; }
html[data-theme="dark"] #loadingScreen > p { color:#a6adbb; }
html[data-theme="dark"] #loadingScreen .progress-track { background:#211c30; }
html[data-theme="dark"] .pa-processing-photo { background:linear-gradient(145deg,#1e2430,#151a24); border-color:rgba(255,255,255,.09); }
html[data-theme="dark"] .pa-platform-option { background:#161b25; }
html[data-theme="dark"] .pa-export-card { box-shadow:inset 0 1px 0 rgba(255,255,255,.04); }

@media(prefers-reduced-motion:reduce){
  .pa-splash-ring,.pa-splash-scan,.pa-splash-logo,.pa-splash-dot,.pa-splash-progress span,.pa-processing-photo,.pa-processing-photo::after,.pa-processing-slice,.pa-processing-beam,.pa-processing-spark { animation-duration:.001ms!important; animation-iteration-count:1!important; }
}


/* ProfileAI focused UI fix 2026.07.3 — loader and install experience */
.pa-install-header {
    min-height: 38px; padding: 0 13px; border: 1px solid rgba(107,70,193,.18); border-radius: 12px;
    background: linear-gradient(135deg,#111827,#252b3a); color:#fff; cursor:pointer;
    display:inline-flex; align-items:center; justify-content:center; gap:8px; white-space:nowrap;
    box-shadow:0 8px 22px rgba(17,24,39,.16); transition:transform .2s ease,box-shadow .2s ease;
}
.pa-install-header:hover { transform:translateY(-1px); box-shadow:0 12px 28px rgba(17,24,39,.22); }
.pa-install-header-icon,.pa-install-header-icon svg { width:17px; height:17px; display:block; }
.pa-install-header-label { font-size:11px; font-weight:850; letter-spacing:-.01em; }

.pa-app-promo {
    width:min(690px,100%); margin:-8px auto 24px; padding:13px 14px; display:grid;
    grid-template-columns:auto 1fr auto; gap:12px; align-items:center; text-align:left;
    border:1px solid rgba(107,70,193,.13); border-radius:19px;
    background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(246,243,255,.82));
    box-shadow:0 14px 40px rgba(15,23,42,.07); backdrop-filter:blur(18px);
}
.pa-app-promo-icon { width:46px; height:46px; border-radius:14px; overflow:hidden; box-shadow:0 8px 18px rgba(107,70,193,.18); }
.pa-app-promo-icon img { width:100%; height:100%; object-fit:cover; display:block; }
.pa-app-promo-copy { min-width:0; }
.pa-app-promo-copy > span { display:block; color:#7c3aed; font-size:8.5px; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }
.pa-app-promo-copy strong { display:block; margin-top:2px; color:var(--pa-text); font-size:13px; line-height:1.25; }
.pa-app-promo-copy p { margin:3px 0 0; color:var(--pa-muted); font-size:10.5px; line-height:1.45; }
.pa-app-install-trigger { min-height:40px; padding:0 13px; border:0; border-radius:12px; background:var(--pa-accent); color:#fff; cursor:pointer; display:inline-flex; align-items:center; gap:7px; font-size:10.5px; font-weight:850; box-shadow:0 9px 22px rgba(107,70,193,.24); }
.pa-app-install-trigger svg { width:16px; height:16px; }

/* Minimal app splash */
#pageLoader {
    background:linear-gradient(180deg,#fbfbfe 0%,#f5f2ff 100%)!important;
    isolation:isolate;
}
#pageLoader::before {
    content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 42%,rgba(107,70,193,.10),transparent 22rem);
    animation:none!important; transform:none!important;
}
.pa-minimal-loader { position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; padding:26px; }
.pa-minimal-mark { position:relative; width:82px; height:82px; display:grid; place-items:center; margin-bottom:19px; }
.pa-minimal-mark img { position:relative; z-index:3; width:62px; height:62px; object-fit:contain; filter:drop-shadow(0 12px 24px rgba(76,29,149,.14)); animation:paMarkBreathe 2.1s ease-in-out infinite; }
.pa-mark-glow { position:absolute; inset:12px; border-radius:24px; background:rgba(255,255,255,.92); box-shadow:0 16px 45px rgba(76,29,149,.12),inset 0 0 0 1px rgba(107,70,193,.07); }
.pa-mark-ring { position:absolute; inset:0; border-radius:28px; border:1.5px solid transparent; background:linear-gradient(#f8f7ff,#f8f7ff) padding-box,conic-gradient(from 0deg,transparent,#8b5cf6,transparent 38%) border-box; animation:paRingSweep 1.8s linear infinite; }
#pageLoader .loader-brand { margin:0; color:#171329; font-size:24px; font-weight:850; letter-spacing:-.055em; }
#pageLoader .loader-sub { min-height:18px; margin-top:5px; color:#7c718e; font-size:11.5px; font-weight:650; animation:none; }
.pa-loader-dots { display:flex; gap:5px; margin-top:17px; }
.pa-loader-dots i { width:5px; height:5px; border-radius:50%; background:#7c3aed; animation:paDotWave 1.1s ease-in-out infinite; }
.pa-loader-dots i:nth-child(2){animation-delay:.14s}.pa-loader-dots i:nth-child(3){animation-delay:.28s}
@keyframes paMarkBreathe { 50%{transform:scale(.96);opacity:.86} }
@keyframes paRingSweep { to{transform:rotate(360deg)} }
@keyframes paDotWave { 0%,100%{transform:translateY(0);opacity:.28} 50%{transform:translateY(-4px);opacity:1} }

/* Clean processing card */
#loadingScreen { padding:28px 16px!important; background:radial-gradient(circle at 50% 36%,rgba(107,70,193,.08),transparent 25rem),var(--bg)!important; }
.pa-process-card { width:min(520px,100%); margin:auto; padding:34px 30px 27px; border:1px solid var(--pa-border); border-radius:30px; background:rgba(255,255,255,.82); box-shadow:0 28px 80px rgba(15,23,42,.10); backdrop-filter:blur(24px); text-align:center; }
.pa-process-stage { position:relative; width:132px; height:132px; margin:0 auto 20px; display:grid; place-items:center; overflow:visible; }
.pa-process-core { position:relative; z-index:4; width:76px; height:76px; border-radius:25px; display:grid; place-items:center; background:#fff; border:1px solid rgba(107,70,193,.10); box-shadow:0 18px 46px rgba(76,29,149,.16); animation:paProcessCore 2.4s ease-in-out infinite; overflow:hidden; }
.pa-process-core img { width:59px; height:59px; object-fit:contain; }
.pa-process-halo { position:absolute; border-radius:50%; border:1px solid rgba(107,70,193,.16); }
.pa-process-halo.halo-one { inset:8px; border-top-color:#7c3aed; animation:paRingSweep 2.3s linear infinite; }
.pa-process-halo.halo-two { inset:22px; border-style:dashed; border-color:rgba(59,130,246,.22); animation:paRingSweep 3.4s linear infinite reverse; }
.pa-process-scan { position:absolute; z-index:6; left:23px; right:23px; height:2px; border-radius:999px; background:linear-gradient(90deg,transparent,#8b5cf6,transparent); box-shadow:0 0 16px rgba(139,92,246,.55); animation:paCleanScan 2.1s ease-in-out infinite; }
@keyframes paProcessCore { 50%{transform:translateY(-4px)} }
@keyframes paCleanScan { 0%,100%{transform:translateY(-31px);opacity:.15} 50%{transform:translateY(31px);opacity:1} }
#loadingScreen h2 { margin:12px 0 7px!important; font-size:clamp(1.55rem,5vw,2.05rem)!important; }
#loadingScreen > p,.pa-process-card > p { max-width:410px; margin:0 auto 20px; color:#667085; font-size:12.5px; line-height:1.55; }
.pa-process-card .progress-track { height:7px!important; border-radius:999px!important; background:#edeaf4!important; overflow:hidden; }
.pa-process-card #progressBar { border-radius:999px; background:linear-gradient(90deg,#6b46c1,#8b5cf6,#3b82f6)!important; box-shadow:0 0 18px rgba(107,70,193,.22); }
.pa-process-card .pa-processing-meta { margin-top:10px; }

.pa-install-guide { z-index:10080; }
.pa-install-modal { position:relative; text-align:center; }
.pa-install-close { position:absolute; right:14px; top:13px; width:34px; height:34px; border:0; border-radius:11px; background:var(--pa-surface-muted); color:var(--pa-muted); cursor:pointer; font-size:20px; }
.pa-install-modal-icon { width:70px; height:70px; margin:0 auto 14px; border-radius:20px; overflow:hidden; box-shadow:0 15px 34px rgba(107,70,193,.20); }
.pa-install-modal-icon img { width:100%; height:100%; object-fit:cover; }
.pa-install-modal-kicker { color:#7c3aed; font-size:9px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.pa-install-steps { display:grid; gap:8px; margin:18px 0; text-align:left; }
.pa-install-steps > div { display:flex; align-items:center; gap:10px; padding:10px 11px; border:1px solid var(--pa-border); border-radius:13px; background:var(--pa-surface-muted); }
.pa-install-steps span { width:24px; height:24px; border-radius:8px; background:#ede9fe; color:#6b46c1; display:grid; place-items:center; font-size:10px; font-weight:900; }
.pa-install-steps p { margin:0; color:var(--pa-text); font-size:11.5px; font-weight:700; }
.pa-install-modal .pa-modal-primary { width:100%; min-height:45px; border:0; border-radius:13px; font-weight:850; cursor:pointer; }

html[data-theme="dark"] .pa-app-promo { background:linear-gradient(135deg,rgba(21,26,36,.92),rgba(28,23,43,.88)); }
html[data-theme="dark"] #pageLoader { background:linear-gradient(180deg,#0b0f17,#151026)!important; }
html[data-theme="dark"] #pageLoader::before { background:radial-gradient(circle at 50% 42%,rgba(139,92,246,.18),transparent 22rem); }
html[data-theme="dark"] .pa-mark-glow { background:#171c27; box-shadow:0 16px 45px rgba(0,0,0,.30),inset 0 0 0 1px rgba(255,255,255,.06); }
html[data-theme="dark"] .pa-mark-ring { background:linear-gradient(#111620,#111620) padding-box,conic-gradient(from 0deg,transparent,#a78bfa,transparent 38%) border-box; }
html[data-theme="dark"] #pageLoader .loader-brand { color:#f8fafc; }
html[data-theme="dark"] #pageLoader .loader-sub { color:#a8a1b5; }
html[data-theme="dark"] .pa-process-card { background:rgba(21,26,36,.87); border-color:rgba(255,255,255,.08); }
html[data-theme="dark"] .pa-process-core { background:#171c27; border-color:rgba(255,255,255,.08); }
html[data-theme="dark"] .pa-process-card > p { color:#a6adbb; }
html[data-theme="dark"] .pa-process-card .progress-track { background:#262032!important; }

@media(max-width:760px){
    .pa-header-actions { margin-left:auto; }
    .pa-install-header { min-height:36px; padding:0 10px; gap:6px; }
    .pa-install-header-label { font-size:10px; }
    .pa-app-promo { grid-template-columns:auto 1fr; margin-top:-2px; padding:12px; }
    .pa-app-install-trigger { grid-column:1/-1; width:100%; justify-content:center; min-height:43px; }
    .pa-app-promo-copy p { display:none; }
    .pa-process-card { padding:28px 19px 23px; border-radius:25px; }
}
@media(max-width:430px){
    .pa-install-header-label { display:none; }
    .pa-install-header { width:36px; padding:0; }
    .pa-install-header-icon,.pa-install-header-icon svg { width:16px; height:16px; }
}
@media(prefers-reduced-motion:reduce){
    .pa-minimal-mark img,.pa-mark-ring,.pa-loader-dots i,.pa-process-core,.pa-process-halo,.pa-process-scan { animation:none!important; }
}

/* Uploaded-photo preview inside the processing loader */
.pa-process-core{
    width:92px!important;height:108px!important;border-radius:28px!important;
    background:linear-gradient(145deg,#fff,#f4f0fb)!important;
}
.pa-process-core img{
    width:66px!important;height:66px!important;object-fit:contain!important;
    transition:width .28s ease,height .28s ease,object-fit .28s ease,transform .28s ease;
}
.pa-process-core img.has-photo{
    width:100%!important;height:100%!important;object-fit:cover!important;transform:scale(1.02);
}
.pa-process-core::after{
    content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
    background:linear-gradient(115deg,transparent 28%,rgba(255,255,255,.42) 49%,transparent 68%);
    transform:translateX(-130%);animation:paPreviewShimmer 1.9s ease-in-out infinite;
}
@keyframes paPreviewShimmer{to{transform:translateX(130%)}}
html[data-theme="dark"] .pa-process-core{background:linear-gradient(145deg,#1e2430,#151a24)!important}
@media(prefers-reduced-motion:reduce){.pa-process-core::after{animation:none!important}}


/* 2026.07.17.5 — mobile install experience stays at the bottom */
#paAppPromo{display:none!important}
.pa-install-guide{position:fixed!important;inset:0!important;display:flex!important;align-items:flex-end!important;justify-content:center!important;padding:12px 12px calc(12px + env(safe-area-inset-bottom))!important;background:linear-gradient(to top,rgba(15,23,42,.14),transparent 42%)!important;backdrop-filter:none!important;pointer-events:none!important;opacity:0!important;visibility:hidden!important;transition:opacity .24s ease,visibility .24s ease!important}
.pa-install-guide.active{opacity:1!important;visibility:visible!important}
.pa-install-guide .pa-install-modal{pointer-events:auto!important;width:min(620px,100%)!important;max-width:620px!important;margin:0!important;padding:15px 16px!important;border-radius:20px!important;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;text-align:left!important;transform:translateY(22px)!important;transition:transform .24s ease!important}
.pa-install-guide.active .pa-install-modal{transform:none!important}.pa-install-guide .pa-install-close{position:static!important;grid-column:3!important;grid-row:1/5!important;align-self:center!important}.pa-install-guide .pa-install-modal-icon{width:48px!important;height:48px!important;margin:0!important;grid-row:1/5!important}.pa-install-guide .pa-install-modal-kicker{grid-column:2!important;margin:0!important}.pa-install-guide h3{grid-column:2!important;margin:0!important;font-size:14px!important}.pa-install-guide p{grid-column:2!important;margin:2px 0 0!important;font-size:10.5px!important}.pa-install-guide .pa-install-steps{display:none!important}.pa-install-guide .pa-modal-primary{display:none!important}
@media(max-width:760px){.pa-install-guide{padding-bottom:calc(82px + env(safe-area-inset-bottom))!important}.pa-install-guide .pa-install-modal{grid-template-columns:auto minmax(0,1fr) auto!important;padding:11px 12px!important;border-radius:18px!important}.pa-install-guide .pa-install-modal-icon{width:42px!important;height:42px!important}.pa-install-guide .pa-install-modal-kicker{display:none!important}.pa-install-guide h3{font-size:12px!important}.pa-install-guide p{font-size:9.5px!important;line-height:1.35!important}}

/* Mobile-only header removal: bottom app navigation remains available. */
@media (max-width: 640px) {
  .site-header {
    display: none !important;
  }
}
