/* Ultra Whats / capability ledger. One comparison surface, three visible plans.
   Presentation only: no hidden prices, no scroll lock, no rendering side effects. */
body.immersive-public #visitor-plans{--ip-ink:#EFEFEA;--ip-bone:#090C11;--ip-accent:#B9AAF4;--ip-line:#AEB8C72B;--ip-muted:#AEB8C7;--ip-paper:#11151D;--ip-selected:#B9AAF412;--ip-focus:#B9AAF4;color:var(--ip-ink);container-type:inline-size}
body.immersive-public .ip-experience{font-family:'IBM Plex Sans Arabic','Alexandria',system-ui,sans-serif;color:var(--ip-ink)}
body.immersive-public .ip-experience :is(button,a,summary){-webkit-tap-highlight-color:transparent}
body.immersive-public .ip-experience :is(button,a,summary):focus-visible{outline:3px solid var(--ip-focus);outline-offset:5px}
body.immersive-public .ip-controls{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid var(--ip-line)}
body.immersive-public .ip-eyebrow{font-size:12px;color:var(--ip-muted)}
body.immersive-public .ip-controls p{font-size:17px;line-height:1.8;margin:6px 0 0;color:var(--ip-ink)}
body.immersive-public .ip-period{display:flex;gap:3px;border:1px solid var(--ip-line);padding:3px;flex-shrink:0;border-radius:8px;background:var(--ip-paper)}
body.immersive-public .ip-period button{appearance:none;border:0;background:transparent;color:var(--ip-ink);font:inherit;font-size:13px;font-weight:500;line-height:1.6;padding:10px 22px;min-height:44px;cursor:pointer}
body.immersive-public .ip-period button[aria-pressed="true"]{background:var(--ip-ink);color:var(--ip-bone);border-radius:5px}
body.immersive-public .ip-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,29%);gap:0;border:1px solid var(--ip-line);background:var(--ip-paper);border-radius:16px;overflow:hidden}
body.immersive-public .ip-comparison{min-width:0;padding-inline:20px}
body.immersive-public .ip-column-labels{display:grid;grid-template-columns:1.1fr .9fr 1.65fr .7fr;gap:18px;padding:20px 12px;color:var(--ip-muted);font-size:12px;border-bottom:1px solid var(--ip-line)}
body.immersive-public .ip-row{display:grid;grid-template-columns:1.1fr .9fr 1.65fr .7fr;align-items:center;gap:18px;margin:0;padding:30px 12px;border:0;border-bottom:1px solid var(--ip-line);border-radius:0;background:transparent;position:relative;isolation:isolate;min-height:152px}
body.immersive-public .ip-row:last-child{border-bottom:0}
body.immersive-public .ip-row::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ip-selected);opacity:0;pointer-events:none}
body.immersive-public .ip-row.is-selected::before{opacity:1}
body.immersive-public .ip-row.is-selected::after{content:"";position:absolute;inset-inline-start:0;inset-block:26px;width:2px;background:var(--ip-accent);pointer-events:none}
body.immersive-public .ip-plan h3{margin:0;font:500 28px/1.25 'Readex Pro','Alexandria',sans-serif;letter-spacing:-.9px}
body.immersive-public .ip-plan h3 button{font:inherit;color:var(--ip-ink);width:100%;border:0;background:transparent;text-align:start;cursor:pointer;min-height:48px;padding:0;display:flex;align-items:center;gap:8px}
body.immersive-public .ip-choice{font-size:16px;opacity:0;transform:translate(-4px,4px)}
body.immersive-public .ip-row.is-selected .ip-choice{opacity:1;transform:none}
body.immersive-public .ip-plan>p{font-size:12px;line-height:1.9;color:var(--ip-muted);margin:3px 0 0}
body.immersive-public .ip-price strong{display:block;font-family:'Readex Pro','Alexandria',sans-serif;font-size:42px;font-weight:400;line-height:1.3;letter-spacing:-1px;font-variant-numeric:tabular-nums;color:var(--ip-ink)}
body.immersive-public .ip-price>span{display:block;font-size:12px;color:var(--ip-ink);margin-top:4px}
body.immersive-public .ip-price small{font-size:12px;color:var(--ip-muted)}
body.immersive-public .ip-price .ip-unavailable{font-size:12px;line-height:1.9;color:var(--ip-muted)}
body.immersive-public .ip-capacity>strong{display:block;font:500 13px/1.6 'Readex Pro','Alexandria',sans-serif;color:var(--ip-ink)}
body.immersive-public .ip-capacity>p{font-size:12px;line-height:1.85;color:var(--ip-ink);margin:5px 0}
body.immersive-public .ip-capacity>small{font-size:12px;line-height:1.8;color:var(--ip-muted);display:block}
body.immersive-public .ip-subscribe{font:500 12px/1.6 'IBM Plex Sans Arabic','Alexandria',sans-serif;display:flex;align-items:center;justify-content:space-between;gap:7px;color:var(--ip-ink);border:0;border-bottom:1px solid var(--ip-ink);background:transparent;padding:10px 0;cursor:pointer;min-height:44px}
body.immersive-public .ip-subscribe span{font-size:17px}
body.immersive-public .ip-subscribe:disabled{cursor:default;opacity:.55}
body.immersive-public .ip-comparison-note{font-size:12px;line-height:1.9;color:var(--ip-muted);margin:14px 12px 20px;max-width:72ch}
body.immersive-public .ip-focus{--ip-panel:#171C27;--ip-panel-ink:#EFEFEA;--ip-focus:var(--ip-panel-ink);position:relative;isolation:isolate;overflow:hidden;background:var(--ip-panel);color:var(--ip-panel-ink);padding:30px;border:0;border-inline-start:1px solid #AEB8C738;border-radius:0;min-width:0;display:flex;flex-direction:column;box-shadow:inset 0 1px 0 #FFFFFF12}
body.immersive-public .ip-focus-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:var(--ip-panel-ink);padding-bottom:18px;border-bottom:1px solid color-mix(in srgb,currentColor 22%,transparent)}
body.immersive-public .ip-focus-top bdi{font:500 15px/1.6 'Readex Pro',sans-serif}
body.immersive-public .ip-folio{height:115px;margin:24px 0 14px;position:relative;transform:translateX(4px);pointer-events:none;contain:layout style}
body.immersive-public .ip-folio i{display:block;position:absolute;width:132px;height:80px;border:1px solid currentColor;border-inline-start-width:3px;border-radius:3px;background:linear-gradient(135deg,#FFFFFF14,transparent 48%,#AEB8C71A);box-shadow:inset 0 1px 0 #FFFFFF24,0 12px 20px #00000018;inset-block-start:15px;inset-inline-start:calc(50% - 66px);transform:skewY(-12deg);opacity:.48}
body.immersive-public .ip-folio i:nth-child(2){transform:translate(14px,-11px) skewY(-12deg);opacity:.7}
body.immersive-public .ip-folio i:nth-child(3){transform:translate(28px,-22px) skewY(-12deg);opacity:1}
body.immersive-public .ip-folio span{position:absolute;height:1px;width:200px;inset-block-start:66px;inset-inline-end:-48px;background:currentColor;opacity:.3;transform:rotate(-12deg)}
body.immersive-public .ip-ai-name{position:relative;color:var(--ip-panel-ink);text-align:start;line-height:1;letter-spacing:-3px;margin-bottom:18px}
body.immersive-public .ip-ai-name>span{display:block;font:500 15px/1.4 'Readex Pro',sans-serif;letter-spacing:0;margin-bottom:6px}
body.immersive-public .ip-ai-name>b{font:400 clamp(66px,7vw,100px)/1 'Readex Pro','Alexandria',sans-serif;letter-spacing:-6px}
body.immersive-public .ip-ai-name .ip-ai-simple{font-size:46px;line-height:1.2;letter-spacing:-2px}
body.immersive-public .ip-ai-description{font-size:12px;line-height:1.95;color:inherit;margin:0 0 12px}
body.immersive-public .ip-allowance{font-size:12px;line-height:1.8;color:inherit;padding-top:14px;margin:0 0 18px;border-top:1px solid color-mix(in srgb,currentColor 22%,transparent)}
body.immersive-public .ip-perks{border-block-start:1px solid color-mix(in srgb,currentColor 22%,transparent);margin-top:auto;font-size:12px;line-height:1.9}
body.immersive-public .ip-perks summary{cursor:pointer;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none}
body.immersive-public .ip-perks summary::-webkit-details-marker{display:none}
body.immersive-public .ip-perks summary>span{font:300 24px system-ui}
body.immersive-public .ip-perks[open] summary>span{transform:rotate(45deg)}
body.immersive-public .ip-perks ul{margin:4px 0 16px;padding-inline-start:18px}
body.immersive-public .ip-perks li{padding:3px 0;color:inherit}
body.immersive-public [data-pricing-tier="plus"] .ip-focus{--ip-panel:#11151D}
body.immersive-public [data-pricing-tier="ultimate"] .ip-focus{--ip-panel:#EFEFEA;--ip-panel-ink:#090C11}
body.immersive-public [data-pricing-tier="ultimate"] .ip-folio i:nth-child(2){transform:translate(20px,-14px) skewY(-12deg)}
body.immersive-public [data-pricing-tier="ultimate"] .ip-folio i:nth-child(3){transform:translate(40px,-28px) skewY(-12deg)}
body.immersive-public .ip-ai-note{font-size:12px;line-height:1.9;color:var(--ip-muted);margin:22px 0 30px;max-width:84ch}
body.immersive-public .ip-announcement{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body.immersive-public .ip-policy{display:flex;align-items:center;justify-content:space-between;gap:32px;padding-block:24px;border-block:1px solid var(--ip-line)}
body.immersive-public .ip-policy strong{font-size:13px;font-weight:500;color:var(--ip-ink)}
body.immersive-public .ip-policy p{font-size:12px;line-height:1.9;color:var(--ip-muted);margin:6px 0 0;max-width:76ch}
body.immersive-public .ip-policy>a{white-space:nowrap;color:var(--ip-ink);font-size:12px;text-decoration:none;border-bottom:1px solid color-mix(in srgb,currentColor 22%,transparent);padding-block:10px;min-height:44px}
body.immersive-public .ip-trial{display:flex;justify-content:space-between;align-items:center;gap:32px;padding:32px 0}
body.immersive-public .ip-trial>div>span{font-size:12px;color:var(--ip-muted)}
body.immersive-public .ip-trial h3{font:500 clamp(18px,2vw,26px)/1.7 'Readex Pro','Alexandria',sans-serif;letter-spacing:-.5px;color:var(--ip-ink);margin:8px 0}
body.immersive-public .ip-trial p{font-size:12px;color:var(--ip-muted);margin:0 0 7px}
body.immersive-public .ip-trial small{font-size:12px;line-height:1.8;color:var(--ip-muted)}
body.immersive-public .ip-trial>a{display:flex;align-items:center;gap:24px;justify-content:space-between;background:var(--ip-ink);color:var(--ip-bone);font-size:12px;padding:16px 22px;min-height:52px;text-decoration:none;white-space:nowrap}
/* Before the metadata arrives, the same three entries remain a continuous ledger. */
body.immersive-public #visitor-plans .plans-placeholder{display:block;border-block:1px solid var(--ip-line)}
body.immersive-public #visitor-plans .plans-placeholder article{display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:8px 24px;border:0;border-bottom:1px solid var(--ip-line);border-radius:0;box-shadow:none;padding:24px 0;background:none;align-items:center}
body.immersive-public #visitor-plans .plans-placeholder article:last-child{border-bottom:0}
body.immersive-public #visitor-plans .plans-placeholder h3{grid-column:1;grid-row:1;font:500 25px 'Readex Pro',sans-serif;margin:0;text-align:start;color:var(--ip-ink)}
body.immersive-public #visitor-plans .plans-placeholder article>span{grid-column:1;grid-row:2;font-size:12px;color:var(--ip-muted)}
body.immersive-public #visitor-plans .plans-placeholder .loading-price{grid-column:2;grid-row:1/3;color:var(--ip-muted);font-size:12px}
body.immersive-public #visitor-plans .plans-placeholder article>b{grid-column:3;grid-row:1;font-size:14px;color:var(--ip-ink)}
body.immersive-public #visitor-plans .plans-placeholder article>p:not(.loading-price){grid-column:3;grid-row:2;font-size:12px;color:var(--ip-muted);margin:0}
body.immersive-public #visitor-plans .plans-placeholder article>a{grid-column:3;grid-row:3;font-size:12px;color:var(--ip-ink)}
body.immersive-public #visitor-plans .pricing-status{font-size:12px;line-height:1.9;color:var(--ip-muted);padding:16px 0}
body.immersive-public #visitor-plans .pricing-status button{font:inherit;min-height:44px;padding:10px 16px;border:1px solid var(--ip-ink);color:var(--ip-ink);background:transparent;cursor:pointer}
@media(hover:hover){body.immersive-public .ip-row:not(.is-selected):hover::before{opacity:.25}body.immersive-public .ip-row:not(.is-selected):hover .ip-choice{opacity:.6;transform:none}body.immersive-public .ip-subscribe:hover{border-bottom-width:2px}}
@media(prefers-reduced-motion:no-preference){body.immersive-public .ip-row::before{transition:opacity 160ms ease-out}body.immersive-public .ip-choice{transition:opacity 160ms ease-out,transform 160ms ease-out}body.immersive-public .ip-folio{animation:ip-focus-in 200ms ease-out both}@keyframes ip-focus-in{from{opacity:.65;transform:translateX(12px)}to{opacity:1;transform:translateX(4px)}}}
@container(max-width:1100px){body.immersive-public .ip-stage{grid-template-columns:minmax(0,1fr)}body.immersive-public .ip-comparison{padding-inline:20px}body.immersive-public .ip-focus{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;padding:28px 32px;border-inline-start:0;border-block-start:1px solid #AEB8C738}body.immersive-public .ip-focus-top{grid-column:1/-1}body.immersive-public .ip-folio{grid-column:2;grid-row:2/5;height:160px;align-self:center}body.immersive-public .ip-ai-name{grid-column:1;margin-top:24px}body.immersive-public .ip-ai-description{grid-column:1}body.immersive-public .ip-allowance{grid-column:1}body.immersive-public .ip-perks{grid-column:2;grid-row:5;align-self:end}}
@container(max-width:600px){body.immersive-public .ip-comparison{padding-inline:8px}body.immersive-public .ip-row.is-selected::after{inset-block:20px}body.immersive-public .ip-controls{align-items:center;gap:12px;margin-bottom:18px}body.immersive-public .ip-eyebrow{font-size:11px}body.immersive-public .ip-controls p{font-size:13px;max-width:18ch}body.immersive-public .ip-period button{font-size:11px;padding-inline:12px}body.immersive-public .ip-column-labels{display:none}body.immersive-public .ip-row{grid-template-columns:1fr auto;gap:8px 16px;padding:20px 12px;min-height:0}body.immersive-public .ip-plan{grid-column:1;grid-row:1}body.immersive-public .ip-plan h3{font-size:23px}body.immersive-public .ip-plan h3 button{min-height:44px;width:auto}body.immersive-public .ip-plan>p{font-size:11px;margin:0}body.immersive-public .ip-price{grid-column:2;grid-row:1;text-align:end;min-width:76px}body.immersive-public .ip-price strong{font-size:34px}body.immersive-public .ip-price>span{font-size:11px;margin:2px 0 0}body.immersive-public .ip-capacity{grid-column:1;grid-row:2;min-width:0}body.immersive-public .ip-capacity>strong{font-size:11px}body.immersive-public .ip-capacity>p{font-size:11px;line-height:1.75;margin:3px 0}body.immersive-public .ip-capacity>small{font-size:11px;line-height:1.75}body.immersive-public .ip-subscribe{grid-column:2;grid-row:2;align-self:end;font-size:11px;min-width:72px}body.immersive-public .ip-comparison-note{font-size:11px;margin:15px 12px 18px}body.immersive-public .ip-focus{display:block;padding:24px}body.immersive-public .ip-folio{position:absolute;inset-inline-end:-40px;top:65px;width:180px;margin:0;height:130px;opacity:.65}body.immersive-public .ip-ai-name{margin-top:34px;max-width:65%}body.immersive-public .ip-ai-name>b{font-size:76px}body.immersive-public .ip-ai-name .ip-ai-simple{font-size:38px}body.immersive-public .ip-ai-description{max-width:40ch;font-size:11px;margin-top:20px}body.immersive-public .ip-allowance{margin-bottom:10px}body.immersive-public .ip-ai-note{font-size:11px;margin:18px 0 22px}body.immersive-public .ip-policy{display:block;padding-block:20px}body.immersive-public .ip-policy>a{display:inline-flex;gap:20px;margin-top:8px;align-items:center}body.immersive-public .ip-trial{display:block;padding-block:24px}body.immersive-public .ip-trial>a{margin-top:18px;width:fit-content;min-width:220px}body.immersive-public #visitor-plans .plans-placeholder article{grid-template-columns:1fr 1fr;gap:7px 16px;padding:20px 12px}body.immersive-public #visitor-plans .plans-placeholder article>b{grid-column:1;grid-row:3}body.immersive-public #visitor-plans .plans-placeholder article>p:not(.loading-price){grid-column:1/-1;grid-row:4}body.immersive-public #visitor-plans .plans-placeholder article>a{grid-column:2;grid-row:3;text-align:end}body.immersive-public #visitor-plans .plans-placeholder .loading-price{text-align:end}}
@media(prefers-reduced-motion:reduce){body.immersive-public .ip-experience *,body.immersive-public .ip-experience *::before{animation:none;transition:none;scroll-behavior:auto}}
@media(forced-colors:active){body.immersive-public .ip-row.is-selected{outline:2px solid Highlight;outline-offset:-2px}body.immersive-public .ip-choice{color:Highlight}body.immersive-public .ip-focus{border:1px solid CanvasText}body.immersive-public .ip-period button[aria-pressed="true"]{outline:2px solid Highlight}body.immersive-public .ip-row::before{display:none}}

/* The shared paid-action policy stays intact; its dialog adopts this page's ink. */
body.immersive-public .subscription-dialog{--sp-ink:#EFEFEA;--sp-muted:#AEB8C7;--sp-line:#AEB8C738;--sp-bg:#11151D;border-radius:14px;border-inline-start:2px solid #B9AAF4;font-family:'IBM Plex Sans Arabic','Alexandria',sans-serif}
body.immersive-public .subscription-dialog h2{font-family:'Readex Pro','Alexandria',sans-serif;font-weight:500}
body.immersive-public .subscription-dialog .sp-button{border-radius:7px;background:#EFEFEA;color:#090C11;border-color:#EFEFEA}
body.immersive-public .subscription-dialog .sp-secondary{background:transparent;color:var(--sp-ink);border-color:var(--sp-ink)}
body.immersive-public .subscription-dialog .sp-button:focus-visible{outline-color:var(--sp-ink)}

/* Dark is the composition's default. Explicit light changes the ledger,
   while the product's cinematic scene can keep its own dark material. */
:root[data-theme="light"] body.immersive-public #visitor-plans{--ip-ink:#151923;--ip-bone:#EFEFEA;--ip-line:#090C112B;--ip-muted:#555F70;--ip-paper:#F8F8F3;--ip-selected:#79659F0E;--ip-accent:#695991;--ip-focus:#695991}
:root[data-theme="light"] body.immersive-public .subscription-dialog{--sp-ink:#151923;--sp-muted:#555F70;--sp-line:#090C1138;--sp-bg:#EFEFEA}
:root[data-theme="light"] body.immersive-public .subscription-dialog .sp-button:not(.sp-secondary){background:#151923;color:#EFEFEA;border-color:#151923}
body.immersive-public [data-pricing-tier="ultimate"] .ip-focus{box-shadow:inset 0 1px 0 #FFFFFFCC}
body.immersive-public [data-pricing-tier="ultimate"] .ip-folio i{background:linear-gradient(135deg,#FFFFFFB8,transparent 48%,#AEB8C72B);box-shadow:inset 0 1px 0 #FFFFFFCC,0 12px 20px #090C1110}
/* ═══ 2026-10: أزرار اشتراكٍ حقيقية، وسم «الأنسب»، والتوفير السنوي من الأسعار نفسها ═══
   كان «الاشتراك ←» سطرًا تحته خطّ لا يُقرأ زرًّا؛ الآن زرٌّ بإطار، والصفّ المختار يمتلئ لونًا. */
body.immersive-public .ip-subscribe{display:inline-flex;align-items:center;justify-content:center;gap:10px;justify-self:end;min-height:44px;min-width:108px;padding:10px 18px;border:1px solid color-mix(in srgb,var(--ip-ink) 28%,transparent);border-radius:10px;background:transparent;color:var(--ip-ink);font:600 13px/1.4 'IBM Plex Sans Arabic','Alexandria',sans-serif;white-space:nowrap}
body.immersive-public .ip-subscribe span{font-size:15px}
body.immersive-public .ip-row.is-selected .ip-subscribe{background:var(--ip-ink);color:var(--ip-bone);border-color:var(--ip-ink)}
body.immersive-public .ip-tag{display:inline-block;font-style:normal;font-size:10.5px;font-weight:700;line-height:1;padding:5px 9px;border-radius:999px;background:var(--ip-accent);color:#120B30;margin-inline-start:6px;vertical-align:1px}
body.immersive-public .ip-save{display:block;font-style:normal;font-size:12px;font-weight:500;color:var(--ip-accent);margin-top:6px}
body.immersive-public .ip-period button small{font-size:11px;font-weight:600;color:var(--ip-accent);margin-inline-start:2px}
body.immersive-public .ip-period button[aria-pressed="true"] small{color:#5B4A8C}
body.immersive-public .ip-paychips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px}
body.immersive-public .ip-paychips span{font:600 11px/1 system-ui,-apple-system,sans-serif;letter-spacing:.3px;padding:6px 9px;border:1px solid var(--ip-line);border-radius:7px;color:var(--ip-muted)}
body.immersive-public .ip-paychips .ip-secure{border:0;padding-inline:4px;font:500 11.5px/1.6 'IBM Plex Sans Arabic',sans-serif;letter-spacing:0}
body.immersive-public .ip-policy--open>a{display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:12px 22px;border:0;border-radius:10px;background:var(--ip-ink);color:var(--ip-bone);font-size:14px;font-weight:600;text-decoration:none}
body.immersive-public .ip-trial>a{border-radius:10px;font-size:13px;font-weight:600}
@media(hover:hover){
  body.immersive-public .ip-subscribe:hover{border-bottom-width:1px;border-color:var(--ip-accent)}
  body.immersive-public .ip-row.is-selected .ip-subscribe:hover{background:#FFFFFF;border-color:#FFFFFF}
  body.immersive-public .ip-policy--open>a:hover,body.immersive-public .ip-trial>a:hover{background:#FFFFFF}
}
@container(max-width:600px){
  body.immersive-public .ip-subscribe{min-width:0;padding:9px 14px;font-size:12px;min-height:40px}
  body.immersive-public .ip-policy--open>a{margin-top:16px;width:100%;justify-content:center}
  body.immersive-public .ip-tag{font-size:10px;padding:4px 8px}
}
:root[data-theme="light"] body.immersive-public .ip-period button[aria-pressed="true"] small{color:#CFC4FF}
:root[data-theme="light"] body.immersive-public .ip-tag{background:#695991;color:#FFFFFF}
@media(hover:hover){:root[data-theme="light"] body.immersive-public :is(.ip-row.is-selected .ip-subscribe,.ip-policy--open>a,.ip-trial>a):hover{background:#000000;border-color:#000000}}
