:root { color-scheme: light; --ink:#14252a; --muted:#496166; --paper:#f4f0e8; --white:#fffdf8; --line:rgba(20,37,42,.16); --lime:#b7f36b; --violet:#6e60e8; --coral:#8c3b31; } * { box-sizing:border-box; } body { margin:0; min-height:100vh; min-height:100svh; display:grid; place-items:center; padding:max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); background:radial-gradient(circle at 15% 10%, rgba(183,243,107,.24) 0, transparent 33%), var(--paper); color:var(--ink); font:15px/1.5 "Avenir Next",Avenir,Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; } main { width:min(100%,420px); padding:clamp(24px,6vw,36px); border:1px solid var(--line); border-radius:18px; background:var(--white); box-shadow:0 24px 80px rgba(20,37,42,.10); } .brand { display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:-.04em; } .mark { width:34px; height:34px; display:grid; place-items:center; border-radius:11px 11px 11px 3px; background:var(--ink); color:var(--lime); font-size:19px; transform:rotate(-5deg); } .eyebrow { margin:30px 0 5px; color:var(--violet); font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; } h1 { margin:0; font-size:clamp(29px,8vw,34px); letter-spacing:-.06em; } .intro { margin:8px 0 24px; color:var(--muted); } label { display:block; margin:16px 0 6px; font-size:12px; font-weight:700; } input { width:100%; min-height:48px; padding:12px 13px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); font:16px/1.4 "Avenir Next",Avenir,Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; } input:focus-visible, button:focus-visible { outline:3px solid var(--violet); outline-offset:2px; } button { width:100%; min-height:48px; margin-top:21px; padding:12px; border:0; border-radius:9px; background:var(--ink); color:white; font:inherit; font-weight:750; cursor:pointer; } button:hover:not(:disabled) { background:#243b42; } button:disabled { opacity:.65; cursor:wait; } [role=status] { min-height:24px; margin:13px 0 0; color:var(--coral); font-size:13px; } .foot { margin:20px 0 0; color:var(--muted); font-size:12px; } @media(max-width:480px) { main { padding:25px 20px; border-radius:15px; } .eyebrow { margin-top:25px; } }
PricingDash

Private workspace

Welcome back.

Sign in to view the app catalog and manage shared PPP suggestions.

PPP changes are saved to this workspace. Store prices are never changed from here.