/**
 * Utility & system-state recipes: 404 / error / empty / offline / maintenance / coming-soon /
 * under-construction / waitlist / success-receipt / loading-skeleton.
 * apb-rx-* tokens only; brand derives from --apb-rx-brand + scheme. Reduced-motion fallbacks inline.
 * Rendered by trait-apb-component-render-states.php. No literals for brand/glow/tint.
 */

/* ---------- shared state buttons ---------- */
.apb-rx-stbtn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:650;font-size:15px;padding:12px 22px;border-radius:var(--apb-rx-radius-pill,999px);transition:transform var(--apb-rx-t,.28s) var(--apb-rx-ease),box-shadow var(--apb-rx-t,.28s) var(--apb-rx-ease)}
.apb-rx-stbtn svg{flex:0 0 auto}
.apb-rx-stbtn--primary{color:var(--apb-rx-accent-contrast,#fff);background:var(--apb-rx-brand);box-shadow:0 8px 20px -8px var(--apb-rx-glow)}
.apb-rx-stbtn--primary:hover{transform:translateY(-2px);box-shadow:0 14px 28px -10px var(--apb-rx-glow)}
.apb-rx-stbtn--ghost{color:var(--apb-rx-ink);background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line)}
.apb-rx-stbtn--ghost:hover{background:var(--apb-rx-soft)}
@media(prefers-reduced-motion:reduce){.apb-rx-stbtn{transition:none}}

/* ---------- 404 ---------- */
.apb-rx-st{position:relative;overflow:hidden;text-align:center;padding:clamp(64px,10vw,120px) 24px;isolation:isolate}
.apb-rx-st-inner{max-width:560px;margin:0 auto;position:relative;z-index:2}
.apb-rx-st-orbit{position:absolute;inset:0;z-index:0;pointer-events:none;display:grid;place-items:center}
.apb-rx-st-orbit::before,.apb-rx-st-orbit::after{content:"";position:absolute;border-radius:50%;border:1px solid var(--apb-rx-line);opacity:.6}
.apb-rx-st-orbit::before{width:min(520px,86vw);height:min(520px,86vw)}
.apb-rx-st-orbit::after{width:min(340px,58vw);height:min(340px,58vw)}
.apb-rx-st-dot{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--apb-rx-brand);box-shadow:0 4px 14px -2px var(--apb-rx-glow);top:calc(50% - min(260px,43vw));left:50%;transform:translateX(-50%)}
.apb-rx-st-num{font-family:var(--apb-rx-font-display,var(--apb-rx-font));font-weight:800;letter-spacing:-.04em;line-height:.9;font-size:clamp(96px,20vw,190px);color:var(--apb-rx-ink);margin:0}
.apb-rx-st :is(h1,h2){font-size:clamp(22px,3.4vw,30px);font-weight:750;letter-spacing:-.02em;margin:18px 0 10px;color:var(--apb-rx-ink)}
.apb-rx-st p{font-size:16px;line-height:1.6;color:var(--apb-rx-muted);margin:0 auto 26px;max-width:44ch}
.apb-rx-st-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ---------- error ---------- */
.apb-rx-est{text-align:center;padding:clamp(56px,9vw,104px) 24px}
.apb-rx-est-inner{max-width:520px;margin:0 auto}
.apb-rx-est-mark{width:84px;height:84px;border-radius:26px;display:grid;place-items:center;margin:0 auto 26px;color:var(--apb-rx-accent-text,var(--apb-rx-brand));background:color-mix(in srgb,var(--apb-rx-brand) 12%,var(--apb-rx-surface,#fff));border:1px solid color-mix(in srgb,var(--apb-rx-brand) 22%,transparent);box-shadow:0 10px 30px -14px var(--apb-rx-glow)}
.apb-rx-est-mark svg{width:38px;height:38px}
.apb-rx-est h2{font-size:clamp(22px,3.2vw,28px);font-weight:750;letter-spacing:-.02em;margin:0 0 10px;color:var(--apb-rx-ink)}
.apb-rx-est p{font-size:16px;line-height:1.6;color:var(--apb-rx-muted);margin:0 auto 14px;max-width:46ch}
.apb-rx-est-code{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;color:var(--apb-rx-muted);background:var(--apb-rx-soft);border:1px solid var(--apb-rx-line);border-radius:8px;padding:4px 10px;margin-bottom:24px}
.apb-rx-est-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ---------- empty ---------- */
.apb-rx-emp{text-align:center;padding:clamp(52px,8vw,92px) 24px}
.apb-rx-emp-inner{max-width:480px;margin:0 auto}
.apb-rx-emp-art{width:132px;height:100px;margin:0 auto 24px;position:relative}
.apb-rx-emp-art .box{position:absolute;inset:0;border-radius:18px;border:2px dashed var(--apb-rx-line);background:var(--apb-rx-soft)}
.apb-rx-emp-art .card{position:absolute;left:18px;right:18px;height:16px;border-radius:6px;background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line);box-shadow:var(--apb-rx-shadow-1,0 1px 2px rgba(11,13,18,.06))}
.apb-rx-emp-art .c1{top:24px}.apb-rx-emp-art .c2{top:48px;left:26px;right:26px;opacity:.7}
.apb-rx-emp-art .plus{position:absolute;right:-8px;bottom:-8px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--apb-rx-accent-contrast,#fff);background:var(--apb-rx-brand);box-shadow:0 8px 18px -6px var(--apb-rx-glow)}
.apb-rx-emp h2{font-size:clamp(20px,3vw,26px);font-weight:750;letter-spacing:-.02em;margin:0 0 10px;color:var(--apb-rx-ink)}
.apb-rx-emp p{font-size:15.5px;line-height:1.6;color:var(--apb-rx-muted);margin:0 auto 24px;max-width:40ch}
.apb-rx-emp-hint{margin-top:16px;font-size:13px;color:var(--apb-rx-muted)}
.apb-rx-emp-hint a{color:var(--apb-rx-accent-text,var(--apb-rx-brand));text-decoration:none;font-weight:600}

/* ---------- offline ---------- */
.apb-rx-off{text-align:center;padding:clamp(56px,9vw,100px) 24px}
.apb-rx-off-inner{max-width:480px;margin:0 auto}
.apb-rx-off-mark{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;margin:0 auto 26px;color:var(--apb-rx-muted);background:var(--apb-rx-soft);border:1px solid var(--apb-rx-line)}
.apb-rx-off-mark svg{width:40px;height:40px}
.apb-rx-off h2{font-size:clamp(21px,3vw,27px);font-weight:750;letter-spacing:-.02em;margin:0 0 10px;color:var(--apb-rx-ink)}
.apb-rx-off p{font-size:16px;line-height:1.6;color:var(--apb-rx-muted);margin:0 auto 24px;max-width:42ch}
.apb-rx-off .apb-rx-stbtn--ghost svg{color:var(--apb-rx-accent-text,var(--apb-rx-brand))}

/* ---------- maintenance ---------- */
.apb-rx-mnt{text-align:center;padding:clamp(56px,9vw,104px) 24px;position:relative;overflow:hidden}
.apb-rx-mnt-inner{max-width:520px;margin:0 auto;position:relative;z-index:2}
.apb-rx-mnt-mark{width:88px;height:88px;border-radius:28px;display:grid;place-items:center;margin:0 auto 26px;color:var(--apb-rx-accent-text,var(--apb-rx-brand));background:color-mix(in srgb,var(--apb-rx-brand) 10%,var(--apb-rx-surface,#fff));border:1px solid var(--apb-rx-line);box-shadow:0 12px 34px -16px var(--apb-rx-glow)}
.apb-rx-mnt-mark svg{width:42px;height:42px;animation:apb-rx-mnt-spin 8s linear infinite}
@keyframes apb-rx-mnt-spin{to{transform:rotate(360deg)}}
.apb-rx-mnt h2{font-size:clamp(22px,3.2vw,29px);font-weight:750;letter-spacing:-.02em;margin:0 0 10px;color:var(--apb-rx-ink)}
.apb-rx-mnt p{font-size:16px;line-height:1.6;color:var(--apb-rx-muted);margin:0 auto 22px;max-width:46ch}
.apb-rx-mnt-win{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:var(--apb-rx-ink);background:var(--apb-rx-soft);border:1px solid var(--apb-rx-line);border-radius:var(--apb-rx-radius-pill,999px);padding:9px 16px;margin-bottom:26px}
.apb-rx-mnt-win svg{width:16px;height:16px;color:var(--apb-rx-accent-text,var(--apb-rx-brand))}
@media(prefers-reduced-motion:reduce){.apb-rx-mnt-mark svg{animation:none}}

/* ---------- coming soon ---------- */
.apb-rx-cs{position:relative;overflow:hidden;text-align:center;padding:clamp(72px,12vw,140px) 24px;isolation:isolate}
.apb-rx-cs-orb{position:absolute;z-index:0;pointer-events:none;filter:blur(60px);opacity:.5;border-radius:50%}
.apb-rx-cs-orb.a{width:340px;height:340px;background:var(--apb-rx-brand);top:-120px;left:-80px}
.apb-rx-cs-orb.b{width:300px;height:300px;background:var(--apb-rx-brand2,var(--apb-rx-brand));bottom:-120px;right:-70px}
.apb-rx-cs-inner{max-width:560px;margin:0 auto;position:relative;z-index:2}
.apb-rx-cs-chip{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--apb-rx-accent-text,var(--apb-rx-brand));background:color-mix(in srgb,var(--apb-rx-brand) 10%,var(--apb-rx-surface,#fff));border:1px solid color-mix(in srgb,var(--apb-rx-brand) 22%,transparent);border-radius:var(--apb-rx-radius-pill,999px);padding:7px 15px;margin-bottom:24px}
.apb-rx-cs-chip .pulse{width:7px;height:7px;border-radius:50%;background:var(--apb-rx-brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--apb-rx-brand) 22%,transparent)}
.apb-rx-cs h2{font-family:var(--apb-rx-font-display,var(--apb-rx-font));font-size:clamp(34px,6vw,60px);font-weight:800;letter-spacing:-.035em;line-height:1.02;margin:0 0 16px;color:var(--apb-rx-ink)}
.apb-rx-cs p{font-size:17px;line-height:1.6;color:var(--apb-rx-muted);margin:0 auto 30px;max-width:44ch}
.apb-rx-cs-form{display:flex;gap:8px;max-width:420px;margin:0 auto 16px;background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line);border-radius:var(--apb-rx-radius-pill,999px);padding:6px 6px 6px 8px;box-shadow:var(--apb-rx-shadow-2,0 2px 6px rgba(11,13,18,.06))}
.apb-rx-cs-form input{flex:1;border:0;outline:0;background:transparent;font:inherit;font-size:15px;color:var(--apb-rx-ink);padding:0 12px}
.apb-rx-cs-form input::placeholder{color:var(--apb-rx-muted)}
.apb-rx-cs-form button{flex:0 0 auto;border:0;cursor:pointer;font-weight:650;font-size:14.5px;color:var(--apb-rx-accent-contrast,#fff);background:var(--apb-rx-brand);border-radius:var(--apb-rx-radius-pill,999px);padding:11px 20px;transition:transform var(--apb-rx-t,.28s) var(--apb-rx-ease)}
.apb-rx-cs-form button:hover{transform:translateY(-1px)}
.apb-rx-cs-form button[disabled]{opacity:.7;cursor:default}
.apb-rx-cs-form button[disabled]:hover{transform:none}
.apb-rx-cs-note{font-size:13px;color:var(--apb-rx-muted)}
@media(prefers-reduced-motion:reduce){.apb-rx-cs-form button{transition:none}}

/* ---------- under construction ---------- */
.apb-rx-uc{text-align:center;padding:clamp(56px,9vw,104px) 24px}
.apb-rx-uc-inner{max-width:500px;margin:0 auto}
.apb-rx-uc-mark{width:88px;height:88px;border-radius:26px;display:grid;place-items:center;margin:0 auto 26px;color:var(--apb-rx-accent-text,var(--apb-rx-brand));background:color-mix(in srgb,var(--apb-rx-brand) 10%,var(--apb-rx-surface,#fff));border:1px solid var(--apb-rx-line);box-shadow:0 12px 32px -16px var(--apb-rx-glow)}
.apb-rx-uc-mark svg{width:42px;height:42px}
.apb-rx-uc h2{font-size:clamp(22px,3.2vw,29px);font-weight:750;letter-spacing:-.02em;margin:0 0 10px;color:var(--apb-rx-ink)}
.apb-rx-uc p{font-size:16px;line-height:1.6;color:var(--apb-rx-muted);margin:0 auto 26px;max-width:44ch}
.apb-rx-uc-prog{max-width:340px;margin:0 auto 12px}
.apb-rx-uc-track{height:8px;border-radius:999px;background:var(--apb-rx-soft);overflow:hidden}
.apb-rx-uc-fill{height:100%;border-radius:999px;background:var(--apb-rx-brand)}
.apb-rx-uc-plabel{display:flex;justify-content:space-between;font-size:12.5px;font-weight:600;color:var(--apb-rx-muted);margin-top:8px}
.apb-rx-uc .apb-rx-stbtn{margin-top:22px}

/* ---------- waitlist ---------- */
.apb-rx-wl{text-align:center;padding:clamp(52px,8vw,96px) 24px}
.apb-rx-wl-inner{max-width:500px;margin:0 auto}
.apb-rx-wl-mark{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;margin:0 auto 22px;color:var(--apb-rx-accent-contrast,#fff);background:var(--apb-rx-brand);box-shadow:0 14px 34px -12px var(--apb-rx-glow)}
.apb-rx-wl-mark svg{width:36px;height:36px}
.apb-rx-wl h2{font-size:clamp(22px,3.2vw,28px);font-weight:750;letter-spacing:-.02em;margin:0 0 8px;color:var(--apb-rx-ink)}
.apb-rx-wl p{font-size:15.5px;line-height:1.6;color:var(--apb-rx-muted);margin:0 auto 24px;max-width:44ch}
.apb-rx-wl-pos{display:flex;align-items:center;justify-content:center;gap:18px;background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line);border-radius:var(--apb-rx-radius,16px);padding:20px 24px;max-width:360px;margin:0 auto 22px;box-shadow:var(--apb-rx-shadow-2,0 2px 6px rgba(11,13,18,.06))}
.apb-rx-wl-num{font-family:var(--apb-rx-font-display,var(--apb-rx-font));font-size:38px;font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--apb-rx-ink)}
.apb-rx-wl-num small{display:block;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--apb-rx-muted);margin-top:6px}
.apb-rx-wl-div{width:1px;align-self:stretch;background:var(--apb-rx-line)}
.apb-rx-wl-meta{text-align:left;font-size:13px;color:var(--apb-rx-muted);line-height:1.5;min-width:0;overflow-wrap:anywhere}
.apb-rx-wl-meta b{color:var(--apb-rx-ink);font-weight:700}
.apb-rx-wl-share{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
@media(max-width:440px){.apb-rx-wl-pos{flex-direction:column;gap:14px}.apb-rx-wl-div{width:auto;height:1px;align-self:stretch}.apb-rx-wl-meta{text-align:center}}

/* ---------- success receipt ---------- */
.apb-rx-rcpt{padding:clamp(48px,8vw,88px) 24px}
.apb-rx-rcpt-inner{max-width:460px;margin:0 auto;text-align:center}
.apb-rx-rcpt-mark{width:80px;height:80px;border-radius:50%;display:grid;place-items:center;margin:0 auto 22px;color:var(--apb-rx-accent-contrast,#fff);background:var(--apb-rx-brand);box-shadow:0 14px 36px -12px var(--apb-rx-glow)}
.apb-rx-rcpt-mark svg{width:38px;height:38px}
.apb-rx-rcpt-mark svg path{stroke-dasharray:26;stroke-dashoffset:26;animation:apb-rx-rcpt-draw .6s var(--apb-rx-ease,cubic-bezier(.22,1,.36,1)) .15s forwards}
@keyframes apb-rx-rcpt-draw{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.apb-rx-rcpt-mark svg path{animation:none;stroke-dashoffset:0}}
.apb-rx-rcpt h2{font-size:clamp(22px,3.2vw,28px);font-weight:750;letter-spacing:-.02em;margin:0 0 8px;color:var(--apb-rx-ink)}
.apb-rx-rcpt-sub{font-size:15px;color:var(--apb-rx-muted);margin:0 0 26px}
.apb-rx-rcpt-card{text-align:left;background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line);border-radius:var(--apb-rx-radius,16px);padding:20px 22px;box-shadow:var(--apb-rx-shadow-2,0 2px 6px rgba(11,13,18,.06))}
.apb-rx-rcpt-row{display:flex;justify-content:space-between;align-items:center;gap:14px;font-size:14.5px;padding:9px 0;color:var(--apb-rx-ink)}
.apb-rx-rcpt-row span{min-width:0;overflow-wrap:anywhere}
.apb-rx-rcpt-row span:first-child{color:var(--apb-rx-muted);flex:0 0 auto}
.apb-rx-rcpt-row span:last-child{text-align:right}
.apb-rx-rcpt-row+.apb-rx-rcpt-row{border-top:1px solid var(--apb-rx-line)}
.apb-rx-rcpt-total{display:flex;justify-content:space-between;align-items:center;margin-top:6px;padding-top:14px;border-top:2px solid var(--apb-rx-line);font-weight:750;font-size:16px;color:var(--apb-rx-ink)}
.apb-rx-rcpt-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:24px}

/* ---------- loading skeleton ---------- */
.apb-rx-sk{padding:clamp(40px,6vw,72px) 24px}
.apb-rx-sk-inner{max-width:920px;margin:0 auto}
.apb-rx-sk-head{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.apb-rx-sk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.apb-rx-sk-card{border:1px solid var(--apb-rx-line);border-radius:var(--apb-rx-radius,16px);padding:16px;background:var(--apb-rx-surface,#fff)}
.apb-rx-sk-b{position:relative;overflow:hidden;background:var(--apb-rx-soft);border-radius:8px}
.apb-rx-sk-b::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:color-mix(in srgb,var(--apb-rx-ink) 5%,transparent);animation:apb-rx-sk-sweep 1.4s var(--apb-rx-ease,cubic-bezier(.22,1,.36,1)) infinite}
@keyframes apb-rx-sk-sweep{to{transform:translateX(100%)}}
.apb-rx-sk-avatar{width:44px;height:44px;border-radius:50%;flex:0 0 auto}
.apb-rx-sk-thumb{height:130px;border-radius:12px;margin-bottom:14px;display:block}
.apb-rx-sk-line{height:12px;border-radius:6px;margin:9px 0;display:block}
.apb-rx-sk-line.w40{width:40%}.apb-rx-sk-line.w60{width:60%}.apb-rx-sk-line.w75{width:75%}.apb-rx-sk-line.w90{width:90%}
.apb-rx-sk-pill{height:26px;width:88px;border-radius:999px;margin-top:14px;display:block}
@media(max-width:720px){.apb-rx-sk-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.apb-rx-sk-b::after{animation:none}}