#promo-intro {
  position:fixed; inset:0; z-index:110; width:100%; height:100%; max-width:none; max-height:none;
  padding:0; margin:0; border:0; border-radius:0; overflow:hidden; color:#15233d; color-scheme:light;
  background:radial-gradient(ellipse at 72% 29%,#e6ecff 0,transparent 58%),linear-gradient(145deg,#fbfcff,#eef3ff);
}
#promo-intro[open] { display:grid; grid-template-rows:minmax(56px,1fr) auto minmax(66px,1fr); justify-items:center; animation:promo-exit .44s ease-in 5.56s both; }
#promo-intro::backdrop { background:transparent; }
.promo-top { position:absolute; inset:0 0 auto; display:flex; align-items:center; justify-content:space-between; z-index:2; gap:12px; padding:clamp(16px,3vw,52px); }
.promo-top>span { font-size:20px; font-weight:800; letter-spacing:-.04em; }
.promo-top small { color:#516489; font-size:10px; font-weight:750; letter-spacing:.08em; margin-left:7px; }
.promo-footer { grid-area:3/1; align-self:start; padding-top:14px; z-index:2; }
#promo-skip { display:flex; align-items:center; gap:10px; min-height:46px; padding:0 20px; border:1px solid #284acb; border-radius:999px; background:#3558d6; color:#fff; font-size:15px; font-weight:800; white-space:nowrap; cursor:pointer; animation:promo-skip-glow 1.35s ease-in-out 4; }
#promo-skip:hover { background:#2546bc; }
#promo-skip:focus-visible { outline:3px solid #3f61da; outline-offset:3px; }
.promo-stage { grid-area:2/1; align-self:center; width:min(1060px,calc(100% - 56px)); animation:promo-stage-exit .42s ease 4.03s both; }
.promo-headline { text-align:center; margin:0 0 clamp(22px,3.3vh,42px); animation:promo-rise .55s ease-out both; }
.promo-headline p { display:inline-block; margin:0 0 14px; border:1px solid #cfdafb; border-radius:999px; padding:6px 14px; background:#ffffffbb; color:#364c87; font-size:13px; font-weight:750; }
.promo-headline h1 { margin:0; color:#13213e; font-size:clamp(32px,5vw,83px); font-weight:850; letter-spacing:-.075em; line-height:1.12; }
.promo-headline em { color:#3055d3; font-style:normal; }
.promo-bento { display:grid; grid-template-columns:1.65fr 1fr; grid-template-rows:repeat(2,1fr); gap:14px; }
.promo-tile { border:1px solid #e0e8fb; border-radius:22px; padding:clamp(17px,2.2vw,32px); background:#fff; box-shadow:0 18px 40px #25447112; min-width:0; }
.promo-tile header { display:flex; flex-wrap:wrap; gap:6px; justify-content:space-between; align-items:center; font-size:14px; font-weight:800; }
.promo-tile header small { border-radius:999px; padding:4px 9px; background:#ecf1ff; color:#3c528b; font-size:11px; line-height:1.2; white-space:nowrap; }
.promo-tile strong { display:block; font-size:clamp(23px,2.4vw,40px); margin-top:10px; line-height:1.12; letter-spacing:-.05em; font-variant-numeric:tabular-nums; }
.promo-tile p { margin:6px 0 0; font-size:14px; color:#495b76; }
.promo-sales { grid-row:span 2; animation:promo-rise .65s cubic-bezier(.18,.85,.25,1) .78s both; }
.promo-sales strong { color:#2549c5; font-size:clamp(33px,4vw,59px); }
.promo-chart { display:block; width:100%; height:clamp(85px,16vh,160px); margin-top:14px; }
.promo-chart-grid { fill:none; stroke:#e3eafa; stroke-width:1; vector-effect:non-scaling-stroke; }
.promo-chart rect { rx:4px; }
.promo-bars,.promo-costs { transform-origin:center bottom; transform-box:view-box; animation:promo-bars .85s cubic-bezier(.25,.7,.2,1) 1.24s both; }
.promo-bars { fill:#5474e7; }
.promo-costs { fill:#dd9b5e; animation-delay:1.4s; }
.promo-chart-labels { display:flex; gap:17px; color:#526384; font-size:12px; }
.promo-chart-labels span::before { content:''; display:inline-block; width:7px; height:7px; margin-right:5px; border-radius:50%; background:#5474e7; }
.promo-chart-labels span+span::before { background:#dd9b5e; }
.promo-receivable { background:#edf8f4; border-color:#d5ece3; animation:promo-rise .54s ease-out 1.85s both; }
.promo-receivable strong { color:#136552; }
.promo-receivable header small { background:#d8eee5; color:#205d50; }
.promo-document { background:#fff7ed; border-color:#f0e3d1; animation:promo-rise .54s ease-out 2.43s both; }
.promo-document strong { color:#84451e; }
.promo-document header small { background:#f9e8d2; color:#764423; }
.promo-end { grid-area:2/1; width:100%; display:grid; place-content:center; justify-items:center; text-align:center; pointer-events:none; padding:14px; animation:promo-fade-in .55s ease-out 4.25s both; }
.promo-end strong { color:#172b57; font-size:clamp(40px,6vw,96px); font-weight:850; letter-spacing:-.08em; }
.promo-end p { margin:4px 0 10px; color:#35538c; font-size:clamp(16px,1.5vw,23px); font-weight:650; }
.promo-end small { color:#536a92; font-size:12px; font-weight:750; letter-spacing:.13em; }
.promo-progress { position:absolute; left:0; right:0; bottom:0; height:4px; background:#e0e9ff; }
.promo-progress i { display:block; width:100%; height:100%; background:#4468e0; transform-origin:left center; animation:promo-progress 6s linear both; }
@keyframes promo-rise { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
@keyframes promo-fade-in { from { opacity:0; } to { opacity:1; } }
@keyframes promo-bars { from { transform:scaleY(.08); } to { transform:scaleY(1); } }
@keyframes promo-stage-exit { to { opacity:0; transform:translateY(-12px); } }
@keyframes promo-exit { to { opacity:0; } }
@keyframes promo-progress { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@keyframes promo-skip-glow { 0%,100% { box-shadow:0 0 0 0 #496aef50; } 50% { box-shadow:0 0 0 7px #496aef30; } }
@media(prefers-reduced-motion:reduce) { #promo-skip { animation:none; } }

.settings-title { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.btn.feedback-trigger { min-height:44px; background:#0f766e; border-color:#0f766e; color:#fff; }
.btn.feedback-trigger:hover { background:#115e59; border-color:#115e59; color:#fff; }
#owner-unread:not([hidden]) { display:inline-grid; place-items:center; margin-left:auto; min-width:24px; height:24px; padding:0 5px; border-radius:99px; background:#b42335; color:#fff; font-weight:800; font-size:12px; }
.btn.subscription-cancel { background:#a6263a; border-color:#a6263a; color:#fff; }
.btn.subscription-cancel:hover { background:#8c1930; border-color:#8c1930; color:#fff; }
.purchase-price,.purchase-terms,.purchase-refund { padding:12px 15px; border-radius:12px; }
.purchase-price { display:grid; gap:3px; background:#ecf1ff; color:#2343a6; }
.purchase-price strong { font-size:26px; font-variant-numeric:tabular-nums; }
.purchase-terms { background:#eaf7f3; color:#125747; }
.purchase-terms ul { margin:7px 0 0; padding-left:19px; }
.purchase-refund { display:grid; gap:5px; margin:0; background:#fff2e0; color:#784710; font-size:14px; line-height:1.55; }
.purchase-actions { display:flex; justify-content:flex-end; gap:8px; }
#feedback-body { width:100%; resize:vertical; min-height:116px; border:1px solid var(--line); border-radius:var(--control-radius); background:var(--paper); color:var(--ink); padding:12px; font:inherit; }
#feedback-body::placeholder { color:var(--muted); opacity:.7; }
.owner-inbox { max-width:940px; }
.owner-inbox .panel-header { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.owner-inbox ul { margin:0; padding:0; list-style:none; }
.owner-inbox-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:12px; padding:13px 10px; border-bottom:1px solid var(--line); }
.owner-inbox-row.unread { border-inline-start:3px solid #ae7408; background:var(--ground); }
.owner-inbox-row header { display:flex; flex-wrap:wrap; gap:4px 12px; align-items:baseline; }
.owner-inbox-row header span { font-size:13px; color:var(--muted); }
.owner-inbox-row p { margin:5px 0 0; font-size:14px; overflow-wrap:anywhere; }
.owner-inbox-message { white-space:pre-wrap; }
.inbox-status:empty { display:none; }

@media(max-width:650px) {
  .promo-stage { width:calc(100% - 28px); }
  .promo-top small { display:none; }
  .promo-bento { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:auto auto; gap:8px; }
  .promo-tile { border-radius:15px; padding:12px; }
  .promo-sales { grid-column:1/-1; grid-row:auto; }
  .promo-tile p { font-size:12px; }
  .promo-tile strong { font-size:clamp(17px,5vw,26px); }
  .promo-sales strong { font-size:36px; }
}
@media(max-height:600px) {
  .promo-top { padding:8px 16px; }
  .promo-headline { margin-bottom:12px; }
  .promo-headline p { margin-bottom:5px; }
  .promo-headline h1 { font-size:clamp(26px,5vh,46px); }
  .promo-tile { padding-block:9px; }
  .promo-tile strong { margin-top:5px; }
  .promo-chart { height:52px; margin-top:6px; }
}
@media(max-height:420px) {
  #promo-intro[open] { grid-template-rows:minmax(36px,1fr) auto minmax(54px,1fr); }
  .promo-footer { padding-top:5px; }
  .promo-tile p { display:none; }
  .promo-chart { height:34px; }
}
