@font-face{font-family:'Client Display';src:url('/studio/fonts/cormorant-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Client Display';src:url('/studio/fonts/cormorant-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:'Studio Sans';src:url('/studio/fonts/inter-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Studio Sans';src:url('/studio/fonts/inter-600.ttf') format('truetype');font-weight:600 800;font-display:swap}
:root{--navy:#10123f;--yellow:#f1e613;--muted:#696b80;--line:#e5e5ed;--surface:#f7f7fa;--display:Baskerville,'Iowan Old Style',Georgia,serif;--sans:'Studio Sans','Avenir Next',sans-serif;font-family:var(--sans);color:var(--navy);background:var(--surface);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}a{color:inherit}h1,h2,h3,p{margin:0}h1,h2{font-family:var(--display);font-weight:400}h1{font-size:clamp(34px,3.2vw,48px);line-height:1.12;letter-spacing:-1.2px;text-wrap:balance}h1 em{font-weight:400}h2{font-size:27px;line-height:1.2;letter-spacing:-.4px}h3{font-size:15px;line-height:1.5;font-weight:600}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #9c9db4;outline-offset:4px}input:focus,select:focus,textarea:focus{outline:2px solid #a8aac3;outline-offset:2px}a,button{touch-action:manipulation}button,a{transition:background .15s,border-color .15s,box-shadow .15s}svg{flex-shrink:0}
/* Brand partnership reads as attribution, never as a close control. */
.brand-lockup{display:flex;align-items:center;gap:24px;min-width:0}.brand{display:block;flex-shrink:0}.brand img{display:block;width:168px;height:auto}.partner-credit{border-left:1px solid var(--line);padding-left:24px;display:flex;flex-direction:column;gap:6px;line-height:1.25}.partner-credit span{font-size:10px;color:var(--muted);letter-spacing:.3px}.partner-credit strong{font-size:12px;font-weight:600;white-space:nowrap;letter-spacing:-.2px}.sidebar .brand-lockup{align-items:flex-start;flex-direction:column;gap:24px}.sidebar .partner-credit{border-left:0;padding-left:0}.sidebar .brand img{width:166px}
.layout{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100dvh;padding:36px 24px 24px;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0}.product-name{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#9696a7;margin:40px 12px 14px}.nav{display:flex;flex-direction:column;gap:5px}.nav button{display:flex;align-items:center;gap:12px;border:0;border-radius:8px;padding:13px 12px;min-height:46px;background:transparent;color:var(--muted);text-align:left;font-size:12px;white-space:nowrap}.nav button:hover{background:#f7f7fa;color:var(--navy)}.nav button.active{background:#f0f0f7;color:var(--navy);font-weight:600;box-shadow:inset 3px 0 var(--yellow)}.nav svg{width:18px;height:18px}.sidebottom{margin-top:auto;padding:24px 12px 0;font-size:11px;line-height:1.7;color:var(--muted)}.sidebottom a{display:block;text-decoration:none;margin-bottom:20px}.sidebottom p{overflow-wrap:anywhere;margin:8px 0}.sidebottom [data-action=logout]{display:none}.badge{display:inline-flex;align-items:center;border:1px solid var(--line);background:var(--surface);padding:5px 10px;border-radius:999px;font-size:10px;line-height:1.4;color:var(--muted)}.main{min-width:0}.topbar{min-height:80px;padding:18px 40px;display:flex;justify-content:space-between;align-items:center;gap:20px;background:#fff;border-bottom:1px solid var(--line)}.breadcrumb{font-size:11px;color:var(--muted);line-height:1.6}.breadcrumb strong{font-weight:600;color:var(--navy)}.bizpick{display:flex;align-items:center;gap:20px;min-width:0}.bizpick select{max-width:230px;min-height:42px;padding:10px 30px 10px 14px;border:1px solid var(--line);background:#fff;border-radius:7px;color:var(--navy);font-size:12px}.logout-link{font-size:11px}.demo-banner{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:11px;color:var(--muted);line-height:1.6;padding:12px 40px;background:#f1f1f7;border-bottom:1px solid var(--line)}.demo-banner:before{content:'';height:6px;width:6px;background:#9c9daf;border-radius:50%;flex-shrink:0}.content{max-width:1320px;margin:auto;padding:40px}.pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:32px}.eyebrow{font-size:10px;line-height:1.6;text-transform:uppercase;font-weight:600;letter-spacing:1.7px;color:var(--muted);margin-bottom:12px}.lead{font-size:14px;line-height:1.8;color:var(--muted);max-width:580px;margin-top:14px}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.button{min-height:44px;padding:12px 18px;border:1px solid #d5d6e0;border-radius:8px;background:#fff;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:12px;font-weight:600;color:var(--navy);line-height:1.4;text-decoration:none;white-space:normal}.button:hover:not(:disabled){background:#f3f3f8;border-color:#aeb0c3}.button.primary{background:var(--navy);border-color:var(--navy);color:white;box-shadow:0 4px 10px #10123f0c}.button.primary:hover:not(:disabled){background:#252756}.button.yellow{background:var(--yellow);border-color:var(--yellow);color:#10123f}.button svg{width:18px;height:18px}.small,.help,.save-status{font-size:12px;line-height:1.7;color:var(--muted)}.help{margin-top:9px;font-size:11px}.inline-link{font-size:12px;color:var(--muted);border:0;background:transparent;padding:4px 0;text-decoration:underline;text-underline-offset:4px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.88fr);gap:28px;align-items:start}.workspace>*{min-width:0}.panel,.stat,.ops-card{border:1px solid var(--line);background:#fff;border-radius:14px;box-shadow:0 3px 16px #10123f03}.panel{padding:30px}.panel-title{display:flex;align-items:center;gap:12px;margin-bottom:28px}.panel-title h2{font-size:25px}.num{display:grid;place-items:center;width:29px;height:29px;border:1px solid var(--line);border-radius:7px;font-size:10px;color:var(--muted);flex-shrink:0}.section+.section{border-top:1px solid var(--line);margin-top:30px;padding-top:30px}.sectionhead{font-size:11px;letter-spacing:.5px;font-weight:600;color:var(--navy);margin-bottom:18px}.field{display:block;margin-top:20px;min-width:0}.field>span{display:block;font-size:12px;line-height:1.5;font-weight:600;margin-bottom:8px}.field input:not([type=color]),.field textarea,.field select{width:100%;padding:12px 14px;border:1px solid #dcdde7;border-radius:7px;background:#fdfdfe;color:var(--navy);min-height:46px;font-size:14px;line-height:1.5}.field textarea{min-height:128px;resize:vertical}.field input::placeholder{color:#9092a2}.field input[type=color]{display:block;width:100%;height:46px;padding:5px;background:#fff;border:1px solid var(--line);border-radius:7px}.twocol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.logoarea{display:flex;gap:18px;align-items:center}.logobox{width:96px;height:64px;display:grid;place-items:center;border:1px solid var(--line);background:var(--surface);border-radius:8px;flex-shrink:0;overflow:hidden;font:30px var(--display)}.logobox img{width:100%;height:100%;object-fit:contain}.upload{display:inline-block;cursor:pointer;font-size:12px;font-weight:600}.upload input{display:none}.logoarea .inline-link{font-size:11px;margin-top:6px}.savebar{margin-top:30px;border-top:1px solid var(--line);padding-top:22px;display:flex;align-items:center;justify-content:space-between;gap:20px}.save-status{font-size:11px;max-width:220px}.note{margin-top:20px;padding:16px 18px;border:1px solid #e9e9f0;background:#f7f7fb;border-radius:8px;color:var(--muted);font-size:12px;line-height:1.75}.terms-details{border-top:1px solid var(--line);margin-top:26px;padding-top:18px;color:var(--muted);font-size:12px;line-height:1.8}.terms-details summary{cursor:pointer;color:var(--navy);font-weight:600;padding:4px 0}.terms-details p{margin-top:14px}.terms-details+.small{margin-top:20px}.checkrow{display:flex;align-items:start;gap:12px;margin:20px 0;color:var(--muted);font-size:12px;line-height:1.7}.checkrow input{margin:4px 0 0;accent-color:var(--navy);width:17px;height:17px;flex-shrink:0}
/* Calm, distinct card preview. */
.preview{position:sticky;top:24px;background:#eeeef4;border:1px solid var(--line);border-radius:14px;padding:24px;overflow:hidden}.previewtop{display:flex;justify-content:space-between;align-items:center;gap:12px}.previewlabel{font-size:10px;color:var(--muted);letter-spacing:.8px}.tabs{display:flex;gap:2px;padding:3px;border:1px solid #ddddE8;border-radius:7px;background:#e5e5ed}.tabs button{border:0;border-radius:5px;padding:7px 9px;background:transparent;font-size:10px;color:var(--muted)}.tabs button.active{background:white;color:var(--navy);box-shadow:0 1px 4px #10123f0a}.phone{border:5px solid #2f3039;border-radius:34px;background:#f9f9fb;max-width:316px;margin:26px auto 22px;overflow:hidden;box-shadow:0 20px 36px -24px #10123f77;padding-bottom:20px}.phonestatus{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;font-size:10px;font-weight:600}.island{background:#2f3039;width:75px;height:17px;border-radius:20px}.phoneheading{font-size:23px;letter-spacing:-.7px;font-weight:600;padding:10px 16px 18px}.phonefooter{font-size:10px;color:var(--muted);line-height:1.6;text-align:center;padding:18px 18px 0}.preview-counter{display:flex;gap:16px;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted)}.preview-counter input{width:42%;accent-color:var(--navy)}.pass{background:var(--card);color:var(--pass-text,var(--ink));border:1px solid #ffffff1a;border-radius:15px;margin:0 10px;overflow:hidden;box-shadow:0 12px 28px #0000000f;font-family:var(--sans)}.passhead{padding:22px 20px 18px;display:flex;gap:12px;align-items:center;border-bottom:1px solid #ffffff20}.passhead.wide-logo{display:block}.passlogo{width:36px;height:36px;border:1px solid #ffffff60;border-radius:10px;display:grid;place-items:center;font-size:16px;flex-shrink:0}.passlogo img{width:100%;height:100%;object-fit:contain}.pass-wordmark{display:block;width:100%;max-width:260px;height:auto}.passname{font-size:14px;font-weight:600;line-height:1.4;overflow-wrap:anywhere}.passsub{font-size:10px;line-height:1.6;opacity:.7;margin-top:5px;overflow-wrap:anywhere}.wide-logo .passsub{margin-top:9px}.passbody{padding:22px}.passbalance{display:flex;justify-content:space-between;gap:14px;align-items:end}.passbalance small{display:block;font-size:9px;text-transform:uppercase;letter-spacing:1.2px;opacity:.72}.passbalance strong{display:block;font-size:36px;line-height:1.15;font-weight:600;margin-top:9px;color:var(--ink)}.pass-total{font-size:14px;font-weight:400;opacity:.75}.passbalance p{font-size:10px;line-height:1.6;max-width:130px;text-align:right;opacity:.8}.stamps{display:grid;gap:9px;margin:24px 0}.stamp{border:1px solid color-mix(in srgb,var(--ink) 32%,transparent);background:color-mix(in srgb,var(--ink) 4%,transparent);border-radius:50%;aspect-ratio:1;display:grid;place-items:center;color:var(--ink);font-size:11px}.stamp.filled{background:var(--ink);color:var(--card);border-color:var(--ink)}.stamp svg{width:18px;height:18px}.rewardline{padding-top:18px;border-top:1px solid #ffffff18;color:var(--ink);font-size:12px;font-weight:600;line-height:1.7;overflow-wrap:anywhere}.codezone{background:#ffffff08;padding:17px 20px;border-top:1px solid #ffffff15;text-align:center}.codezone small,.codezone .small{font-size:10px;line-height:1.6;color:inherit;opacity:.7}.codezone canvas,.preview-card-qr{display:block;width:160px!important;height:auto!important;max-width:100%;margin:0 auto 10px;border-radius:8px}.workspace>.pass{width:100%;max-width:380px;margin:auto}.salon-pass{font-family:'Studio Sans',sans-serif;border-color:#302c25;box-shadow:0 20px 50px #0003}.salon-pass .passbalance strong{font-family:'Client Display',serif;font-size:44px}.salon-pass .passsub{color:#b4b0a8;opacity:1}.salon-pass .passhead{border-bottom-color:#ebbd5726}.salon-pass .codezone{background:#151719;color:#a9a59d;border-top-color:#ebbd571a}
.cards-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:28px}.stat{padding:25px}.stat small{font-size:12px;color:var(--muted)}.stat strong{display:block;font:400 38px var(--display);margin:14px 0 7px}.stat p{font-size:11px;color:var(--muted)}.tablewrap{overflow:auto;max-width:100%;margin-top:18px}table{width:100%;border-collapse:collapse;text-align:left;font-size:12px;line-height:1.6}th{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);font-weight:600;padding:14px 12px;border-bottom:1px solid var(--line)}td{padding:18px 12px;border-bottom:1px solid #eeeeF3;overflow-wrap:anywhere}td:first-child,th:first-child{padding-left:0}td small{display:block;font-size:10px;color:var(--muted);margin-top:4px}td .button{min-height:38px;padding:8px 12px;font-size:11px}.chip{display:inline-block;border-radius:6px;padding:5px 9px;background:#f3f2bd;color:var(--navy);font-size:11px}.chip.pending{background:#f0f0f6;color:var(--muted)}.empty-state{padding:42px 20px;text-align:center;font-size:13px;line-height:1.8;color:var(--muted)}.ops{max-width:820px}.ops-card{margin-top:24px;padding:30px}.rowhead{display:flex;justify-content:space-between;align-items:start;gap:18px}.rowhead>div{min-width:0}.rowhead .small{overflow-wrap:anywhere}.opscount{font:400 52px var(--display);margin-top:26px}.opscount small{font:14px var(--sans);color:var(--muted)}.progress{height:5px;background:#eeeef4;border-radius:6px;overflow:hidden;margin:22px 0}.progress div{background:var(--navy);height:100%}.history{padding:0;list-style:none;font-size:12px;line-height:1.7;margin:18px 0 0}.history li{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding:14px 0}.history small{color:var(--muted)}.integration{display:flex;align-items:start;gap:20px;padding:26px 0;border-top:1px solid var(--line)}.integration:first-child{border-top:0;padding-top:0}.integration h3{margin-bottom:7px}.integration p{font-size:13px;line-height:1.8;color:var(--muted);max-width:650px;margin-bottom:12px}.integration .bigicon{width:40px;height:40px;background:var(--surface);border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;flex-shrink:0}.integration svg{width:19px;height:19px}.hidden{display:none!important}.share-qr{padding:24px 0}.share-qr canvas{max-width:100%}
/* Public access and customer surfaces. */
.public-header{padding:25px max(24px,calc((100vw - 1160px)/2));display:flex;justify-content:space-between;align-items:center;gap:24px;background:#fff;border-bottom:1px solid var(--line);min-height:100px}.public-header>.button{font-size:11px;flex-shrink:0;background:transparent}.public-content{max-width:1120px;padding:54px 32px 70px;margin:auto}.public-content .workspace{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:44px}.public-content .pass{max-width:380px;margin:auto}.public-content:has(#loginForm),.public-content:has(#setupForm),.public-content:has(#registerForm){max-width:560px;padding-top:54px}.public-content:has(#loginForm) .pagehead,.public-content:has(#setupForm) .pagehead,.public-content:has(#registerForm) .pagehead{display:block;margin-bottom:28px}.public-content:has(#loginForm) h1,.public-content:has(#setupForm) h1,.public-content:has(#registerForm) h1{font-size:44px}.public-content:has(#loginForm) .panel,.public-content:has(#setupForm) .panel,.public-content:has(#registerForm) .panel{padding:30px 32px}.public-content:has(#loginForm) .button.primary,.public-content:has(#setupForm) .button.primary,.public-content:has(#registerForm) .button.primary{width:100%;min-height:48px}.setup-panel{max-width:720px}.setup-panel form>.field:first-child{margin-top:0}.setup-panel>.note{border:0;background:transparent;padding:0;margin-top:24px;font-size:11px;line-height:1.8}.client-panel{max-width:480px;margin:auto;text-align:center}.client-panel .pagehead{display:block}.client-panel .pass{margin:26px auto}.client-panel .actions{justify-content:center}.client-panel .field{text-align:left}.customer-brand{max-width:60%}.customer-brand img{display:block;width:240px;max-width:100%;height:auto}.customer-branded{--navy:var(--client-text);--yellow:var(--client-accent);--line:#292a2c;--surface:#141618;--muted:#a7a39b;--display:'Client Display',serif;background:#060709;color:var(--client-text)}.customer-branded .public-header{background:#0e1012;min-height:96px;padding-top:18px;padding-bottom:18px}.customer-branded .eyebrow{color:var(--client-accent)}.customer-branded h1{font:400 58px/1.08 var(--display);letter-spacing:-1px}.customer-branded h2{font-size:36px}.customer-branded .panel{background:#0e1012;border-color:#292a2c;border-radius:18px;box-shadow:none}.customer-branded .button{background:transparent;color:var(--client-text);border-color:#ebbd5740;border-radius:999px}.customer-branded .button.primary{background:var(--client-accent);color:#060709;border-color:var(--client-accent)}.customer-branded .button:hover:not(:disabled){background:#ebbd5710}.customer-branded .button.primary:hover:not(:disabled){background:#f1c66b}.customer-branded .field input{background:#191b1d;color:var(--client-text);border-color:#39362e}.customer-branded .note{background:#191b1d;border-color:#302e29}.customer-branded .terms-details summary{color:var(--client-accent)}.customer-branded .checkrow input{accent-color:var(--client-accent)}.customer-branded :focus-visible{outline-color:var(--client-accent)}.customer-branded .client-panel h1{font-size:44px}
dialog{border:1px solid var(--line);border-radius:18px;padding:36px;max-width:490px;width:calc(100% - 32px);color:#10123f;box-shadow:0 30px 90px #10123f30}dialog::backdrop{background:#10123f55;backdrop-filter:blur(5px)}dialog h2{margin:8px 0 14px}dialog p{font-size:13px;line-height:1.8;color:#696b80;margin-bottom:20px}dialog .close{position:absolute;right:14px;top:12px;width:32px;height:32px;border:0;background:#f1f1f6;border-radius:50%;font-size:22px;color:#696b80}#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,12px);opacity:0;pointer-events:none;background:#10123f;color:#fff;padding:14px 22px;border-radius:10px;font-size:12px;line-height:1.6;z-index:30;max-width:calc(100% - 32px);width:max-content;box-shadow:0 10px 30px #10123f25;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1500px){.content{padding:50px}.panel{padding:34px}.workspace{gap:36px}}
@media(max-width:1100px){.layout{grid-template-columns:220px minmax(0,1fr)}.sidebar{padding:30px 18px}.content{padding:32px 26px}.topbar{padding:18px 26px}.demo-banner{padding:12px 26px}.workspace{gap:20px}.panel{padding:24px}.preview{padding:20px 14px}.public-header{padding-left:28px;padding-right:28px}.public-header .partner-credit{padding-left:18px}.public-header .brand-lockup{gap:18px}}
@media(max-width:900px){.layout{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}.sidebar{height:auto;position:relative;padding:23px 26px 0;border-right:0;border-bottom:1px solid var(--line)}.sidebar .brand-lockup{flex-direction:row;align-items:center;gap:24px}.sidebar .partner-credit{padding-left:24px;border-left:1px solid var(--line)}.sidebar .brand img{width:150px}.product-name,.sidebottom{display:none}.nav{flex-direction:row;overflow-x:auto;gap:8px;margin-top:25px;scrollbar-width:thin;padding-bottom:12px}.nav button{padding:11px 13px;min-height:43px;font-size:11px;flex-shrink:0}.nav button.active{box-shadow:none;background:#eeeef6}.topbar{min-height:70px}.workspace{grid-template-columns:minmax(0,1fr) minmax(0,.85fr)}.public-content .workspace{gap:24px}.public-header .brand img{width:148px}.public-header .partner-credit strong{font-size:11px}.public-header .partner-credit span{font-size:9px}.public-header>.button{padding:10px 13px;font-size:10px}.public-content{padding:42px 28px 60px}.preview-counter{align-items:start;flex-direction:column;gap:12px}.preview-counter input{width:100%}.pagehead{flex-wrap:wrap}}
@media(max-width:650px){.public-header{padding:21px 20px;gap:18px;align-items:center;min-height:106px}.public-header .brand-lockup{align-items:flex-start;flex-direction:column;gap:13px}.public-header .partner-credit{border:0;padding:0;gap:4px}.public-header .partner-credit span{font-size:9px}.public-header .partner-credit strong{font-size:11px}.public-header .brand img{width:150px}.public-header>.button{min-height:40px}.public-content{padding:32px 20px 48px}.public-content:has(#loginForm),.public-content:has(#setupForm),.public-content:has(#registerForm){padding-top:34px}.public-content:has(#loginForm) h1,.public-content:has(#setupForm) h1,.public-content:has(#registerForm) h1{font-size:38px}.public-content:has(#loginForm) .panel,.public-content:has(#setupForm) .panel,.public-content:has(#registerForm) .panel{padding:25px 22px}.public-header:has(+.public-content #loginForm)>.button,.public-header:has(+.public-content #setupForm)>.button{display:none}.public-header:has(+.public-content #loginForm) .brand-lockup,.public-header:has(+.public-content #setupForm) .brand-lockup{flex-direction:row;align-items:center;width:100%;justify-content:space-between;gap:18px}.public-header:has(+.public-content #loginForm) .partner-credit,.public-header:has(+.public-content #setupForm) .partner-credit{border-left:1px solid var(--line);padding-left:18px}.sidebar{padding:22px 18px 0}.sidebar .brand-lockup{justify-content:space-between;gap:16px}.sidebar .brand img{width:134px}.sidebar .partner-credit{padding-left:16px}.sidebar .partner-credit strong{font-size:10px}.sidebar .partner-credit span{font-size:9px}.nav{gap:4px;margin-top:20px}.nav button{padding:10px;font-size:11px;gap:8px}.nav svg{width:15px;height:15px}.topbar{padding:15px 18px;gap:14px;align-items:center;flex-wrap:wrap}.breadcrumb{font-size:10px}.bizpick{justify-content:space-between;width:100%;gap:14px}.bizpick select{flex:1;max-width:none;min-width:0}.demo-banner{padding:11px 18px;font-size:10px}.content{padding:28px 18px 40px}h1{font-size:35px}h2{font-size:26px}.pagehead{margin-bottom:25px;gap:20px}.pagehead .actions{width:100%}.pagehead .button{flex:1}.eyebrow{font-size:9px;letter-spacing:1.4px}.lead{font-size:13px;line-height:1.8;margin-top:12px}.workspace,.public-content .workspace{grid-template-columns:minmax(0,1fr);gap:24px}.workspace>#previewHost{grid-row:1}.workspace>.pass{grid-row:1}.panel{padding:24px 22px;border-radius:12px}.preview{position:relative;top:0;padding:22px;min-width:0}.previewtop{gap:14px}.preview-counter{flex-direction:row;align-items:center}.preview-counter input{width:44%}.phone{margin:22px auto 20px}.field input:not([type=color]),.field select,.field textarea{font-size:16px}.twocol{gap:12px}.savebar{flex-wrap:wrap}.savebar .button{flex:1}.cards-grid{grid-template-columns:1fr;gap:12px}.stat{display:grid;grid-template-columns:1fr auto;align-items:center;padding:20px 22px}.stat strong{grid-column:2;grid-row:1/3;margin:0;font-size:32px}.stat p{margin-top:7px}.tablewrap{margin-top:18px}.tablewrap table{min-width:420px}.ops-card{padding:24px}.ops-card .actions{display:grid;grid-template-columns:minmax(0,1fr)}.rowhead{flex-wrap:wrap}.history li{font-size:11px;gap:14px}.history li>span{min-width:0;overflow-wrap:anywhere}.integration{gap:14px;padding:22px 0}.integration .bigicon{width:34px;height:34px}.integration p{font-size:12px}.customer-branded .public-header{padding:18px;min-height:83px}.customer-brand img{width:190px}.customer-branded .public-content{padding:32px 20px 50px}.customer-branded h1{font-size:46px}.customer-branded h2{font-size:33px}.customer-branded .pagehead{margin-bottom:28px}.customer-branded .workspace>.pass{grid-row:1}.customer-branded .panel{padding:26px}.customer-branded .client-panel h1{font-size:36px}.passbody{padding:22px}.passhead{padding:22px 20px 18px}.pass-wordmark{max-width:260px}.client-panel .actions .button{width:100%}.client-panel .small{font-size:11px}.customer-branded .terms-details{margin-top:24px}.customer-branded .public-header>.button{font-size:10px;padding:10px 12px}.note{padding:15px;font-size:11px}.terms-details{font-size:12px}dialog{padding:30px 24px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.cashier-view { max-width: 760px; margin-inline: auto; }
.trial-card { width: 100%; max-width: 380px; margin-inline: auto; }
.trial-actions { margin-top: 18px; }
.trial-actions .actions { margin-top: 12px; gap: 8px; }
.trial-actions button[hidden] { display: none; }
#trialStatus:not(:empty) { margin-top: 12px; }
.manual-card-id { margin-top: 12px; color: inherit; }
.manual-card-id summary { cursor: pointer; font-size: 12px; }
.manual-card-id code { display: block; margin-top: 8px; font-size: 12px; overflow-wrap: anywhere; user-select: all; }
@media (max-width: 650px) {
  .try-layout .trial-card { grid-row: 1; }
}

#scannedCustomer { overflow-wrap: anywhere; }
#scannedCustomer:focus { outline: none; }
.customer-metrics {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(115px, 1fr));
  gap: 16px; margin: 20px 0 8px; padding: 16px;
  border-radius: 10px; background: var(--surface);
}
.customer-metrics dt, .activity-info { font-size: 12px; line-height: 1.5; color: var(--muted); }
.customer-metrics dd { margin: 5px 0 0; font-size: 24px; font-variant-numeric: tabular-nums; }
.activity-info summary { cursor: pointer; }
.activity-info p { margin: 8px 0; overflow-wrap: anywhere; }

/* The cashier holds the phone upright and presents the square to the card. */
.reader { min-height: 100svh; background: #f9f9fb; display: flex; flex-direction: column; }
.reader-header {
  display: flex; flex-direction: column; align-items: flex-start; gap: 10px;
  padding: 14px clamp(16px, 4vw, 42px); background: #fff; border-bottom: 1px solid var(--line);
}
.reader-partnership { display: flex; align-items: center; width: min(100%, 345px); min-height: 44px; }
.reader-partnership img { display: block; width: 100%; height: auto; }
.reader main { flex: 1; display: grid; }
.reader-stage {
  display: grid; grid-template-rows: minmax(56px,1fr) auto minmax(90px,1fr);
  justify-items: center; align-content: center; padding: 0 18px;
}
.reader-square {
  grid-row: 2; position: relative; overflow: hidden; width: min(100%, 60svh, 390px);
  aspect-ratio: 1; background: #151820; border-radius: 18px; isolation: isolate;
}
.reader-square video { display: block; width: 100%; height: 100%; object-fit: cover; }
.reader-square i { position:absolute; width: 23px; height: 23px; border: solid #fff; opacity: .83; pointer-events:none; }
.reader-square i:nth-of-type(1) { inset: 9% auto auto 9%; border-width: 2px 0 0 2px; }
.reader-square i:nth-of-type(2) { inset: 9% 9% auto auto; border-width: 2px 2px 0 0; }
.reader-square i:nth-of-type(3) { inset: auto auto 9% 9%; border-width: 0 0 2px 2px; }
.reader-square i:nth-of-type(4) { inset: auto 9% 9% auto; border-width: 0 2px 2px 0; }
.reader-fallback { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 16px; color: #d6d9df; }
.reader-fallback svg { width: 36px; height: 36px; }
.camera-live .reader-fallback { display: none; }
.reader-retry { background: white; color: var(--navy); padding: 11px 16px; border: 0; border-radius: 8px; font-size: 13px; }
.reader-tools { grid-row: 3; width: min(100%,390px); text-align: center; padding: 18px 0; }
.reader-tools [role=status] { font-size: 14px; line-height: 1.5; }
.reader-tools summary,.reader-history summary { cursor: pointer; font-size: 12px; color: var(--muted); padding: 12px 0; }
.reader-tools form { text-align: left; }
.reader-tools .field { margin: 0 0 12px; }
.reader-result,.reader-wait { align-self: center; justify-self: center; width: min(calc(100% - 32px),540px); padding: clamp(22px,5vw,38px); margin: 24px auto; background: #fff; border: 1px solid var(--line); border-radius: 16px; }
.reader-label { display: flex; align-items: center; gap: 8px; color: #22644d; font-size: 13px; font-weight: 600; margin-bottom: 14px; }
.reader-label svg { width: 22px; height: 22px; }
.reader-result h1 { font-size: clamp(33px,7vw,44px); }
.reader-since,.reader-wait p { color:var(--muted); font-size:13px; margin: 8px 0 16px; }
.reader-result .customer-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.reader-balance { border-top: 1px solid var(--line); margin: 20px 0; padding-top: 18px; font-size: 14px; line-height: 1.6; }
.reader-history { margin-top: 16px; }
@media(max-width: 480px) {
  .reader-header { padding: calc(28px + env(safe-area-inset-top, 0px)) 16px 15px; }
}

/* Shared administration frame */
.admin-partnership{display:inline-flex;align-items:center;max-width:100%;align-self:flex-start;min-height:44px}
.admin-partnership img{display:block;width:214px;max-width:100%;height:auto}
.layout .product-name{margin:32px 12px 12px}
.layout .pagehead .eyebrow,.layout .panel-title .num{display:none}
.layout .pagehead h1{margin-top:0}
.layout .admin-scanner{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;min-height:44px;padding:10px 16px;font-size:13px;text-decoration:none}
.admin-scanner svg{width:17px;height:17px;flex:none}
.layout .panel>.admin-scanner{margin-top:16px}
.admin-card-detail{max-width:860px}
.admin-card-detail .rowhead{margin-top:28px}
@media(max-width:900px){.admin-partnership{margin-bottom:12px}.admin-partnership img{width:200px}}
@media(max-width:600px){.layout .breadcrumb{display:none}.layout .bizpick{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px}.layout .bizpick select{width:100%;min-height:44px}.layout .bizpick .logout-link{grid-column:1/-1;justify-self:end}.layout .topbar{padding-block:12px}.layout .admin-scanner{padding-inline:12px}}

.guest-fields{border:0;padding:0;margin:0;min-width:0}.guest-fields:disabled .button{opacity:.55}.company-label{overflow-wrap:anywhere;font-size:.94rem}

.reader-header{flex-direction:row;align-items:center;justify-content:space-between;gap:18px}
.reader-header .reader-partnership{min-width:0;flex:0 1 345px}
.reader-logout{flex:none;min-height:44px}
.reader-signup{display:grid;place-items:center;background:white;border:1px solid var(--line)}
.reader-signup canvas{width:94%;height:auto;image-rendering:pixelated}
.reader-tools [data-mode]{margin:10px auto 0;display:flex;min-height:44px}

.client-panel .wallet-offer { margin: 0 0 24px; }

/* The two controls share one row and the same label style. */
.reader-shop {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 210px));
  justify-content: space-between;
  align-items: stretch;
  gap: 8px;
  padding: 10px clamp(12px, 4vw, 42px);
}
.reader-shop > :is(select, strong, .button) {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  min-height: 46px;
  margin: 0;
  padding: 9px 12px;
  border: 1px solid #d9dbe5;
  border-radius: 10px;
  background-color: #fff;
  color: var(--navy);
  font: 600 14px/20px var(--sans);
  letter-spacing: normal;
  text-align: center;
  box-shadow: none;
}
.reader-shop > select[data-scanner-shop] {
  appearance: none;
  cursor: pointer;
  padding-inline: 8px 22px;
  text-align: start;
  text-overflow: ellipsis;
  background: white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m2 4 4 4 4-4' fill='none' stroke='%235b6174' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 7px center;
}
.reader-shop > strong { overflow-wrap: anywhere; }
@media (max-width: 389px) {
  .reader-shop { padding-inline: 8px; gap: 6px; }
  .reader-shop > :is(select, strong, .button) { font-size: 13px; }
  .reader-shop > select[data-scanner-shop] { padding-inline: 3px 14px; background-position: right 2px center; }
}

/* Monochrome laptop stamp cards: the circles carry the progress. */
.laptop-pass .passhead{padding:24px 24px 20px;border-bottom-color:#ffffff18}.laptop-pass .pass-wordmark{width:180px;max-width:85%}.laptop-pass .passsub{margin-top:16px;letter-spacing:.15px;font-size:11px}.laptop-pass .passbody{display:flex;flex-direction:column;padding:0 24px 22px}.laptop-pass .passbalance{order:2;justify-content:center}.laptop-pass .passbalance>div{display:none}.laptop-pass .passbalance p{max-width:none;text-align:center;font-size:11px;margin:0 0 20px;opacity:.65}.laptop-pass .stamps{order:1;margin:24px 0 16px;gap:18px}.laptop-pass .stamp{border-width:1.25px;background:#ffffff06}.laptop-pass .stamp.empty svg{opacity:.43}.laptop-pass .stamp.filled{background:var(--ink);color:var(--card)}.laptop-pass .stamp svg{width:47%;height:47%}.laptop-pass .rewardline{order:3;text-align:left;font-size:12px;font-weight:500;border-top:1px solid #ffffff25}.laptop-pass .codezone{background:transparent;padding:20px 24px 24px}.laptop-pass .codezone canvas,.laptop-pass .preview-card-qr{border-radius:0;width:135px!important}

.public-header.monochrome-header .customer-brand img{filter:brightness(0)}