.placement-popup {
    --placement-purple: #6e40d9;
    width: min(480px, calc(100vw - 40px));
    height: min(560px, calc(100dvh - 64px));
    max-width: none;
    max-height: none;
    margin: auto;
    padding: 0;
    box-sizing: border-box;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 24px;
    background: var(--crp-bg-f8fafc, #f8f8fc);
    color: var(--crp-fg-1f2937, #21293b);
    box-shadow: 0 12px 48px rgba(0,0,0,.22);
    overflow: hidden;
    font-family: inherit;
}
.placement-popup[open] { display: flex; flex-direction: column; animation: placement-appear 160ms ease-out; }
.placement-popup::backdrop { background: rgba(0,0,0,.48); }
.placement-header { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 16px; background:var(--crp-bg-f3f4f6, #f3f4f6); flex:none; }
.placement-header strong { font-size:17px; }
.placement-close, .placement-header-spacer { width:44px; height:44px; flex:none; }
.placement-close { display:grid; place-items:center; border:0; border-radius:12px; background:transparent; color:inherit; cursor:pointer; }
.placement-content { display:flex; flex-direction:column; gap:22px; padding:24px; overflow-y:auto; overscroll-behavior:contain; min-height:0; }
.placement-content p, .placement-content h2 { margin:0; }
.placement-content .placement-eyebrow { font-size:11px; font-weight:800; letter-spacing:1.8px; text-transform:uppercase; color:var(--placement-purple); }
.placement-content .placement-title { font-size:31px; line-height:1.18; font-weight:800; letter-spacing:-.6px; overflow-wrap:anywhere; }
.placement-title:focus { outline:none; }
.placement-copy { font-size:15px; line-height:1.55; color:var(--crp-fg-64748b, #64748b); }
.placement-meta { font-size:13px; color:var(--crp-fg-64748b, #64748b); }
.placement-primary, .placement-secondary, .placement-text-button { display:block; width:100%; min-height:48px; flex:none; padding:12px 16px; border-radius:12px; font-family:inherit; font-size:16px; line-height:1.35; font-weight:700; cursor:pointer; overflow-wrap:anywhere; }
.placement-primary { background:var(--placement-purple); color:white; border:1px solid var(--placement-purple); font-weight:700; font-size:16px; }
.placement-primary:disabled { opacity:.45; cursor:default; }
.placement-secondary { background:transparent; color:var(--placement-purple); border:1px solid var(--placement-purple); font-weight:700; font-size:16px; }
.placement-text-button { background:transparent; border:0; color:var(--placement-purple); font-size:14px; }
.placement-content .placement-chinese { font-size:30px; font-weight:600; text-align:center; line-height:1.45; }
.placement-progress { width:100%; height:6px; border:0; border-radius:8px; overflow:hidden; accent-color:var(--placement-purple); flex:none; }
.placement-progress::-webkit-progress-bar { background:#e5e7eb; }
.placement-progress::-webkit-progress-value { background:var(--placement-purple); }
.placement-options { display:grid; gap:12px; }
.placement-option { display:flex; align-items:center; gap:12px; min-height:52px; padding:14px; box-sizing:border-box; border:1px solid rgba(110,64,217,.2); border-radius:12px; background:var(--crp-bg-ffffff,#fff); cursor:pointer; font-size:16px; line-height:1.4; transition:background-color 160ms ease-out, border-color 160ms ease-out; }
.placement-option:has(:checked) { border-color:var(--placement-purple); background:rgba(110,64,217,.09); }
.placement-option:has(:focus-visible) { outline:3px solid #8b5cf6; outline-offset:3px; }
.placement-option input { appearance:auto; width:20px; height:20px; flex:none; margin:0; accent-color:var(--placement-purple); }
.placement-result { font-weight:700; line-height:1.5; }
.placement-error { color:#dc2626; font-size:14px; line-height:1.5; }
@keyframes placement-appear { from { opacity:0; } to { opacity:1; } }
@media (prefers-reduced-motion:reduce) { .placement-popup[open], .placement-option { animation:none; transition:none; } }