*{box-sizing:border-box}body{margin:0;background:#edf1f8;color:#152440;font:16px/1.5 system-ui,sans-serif}header{display:flex;align-items:center;gap:16px;background:#101c35;color:white;padding:18px max(24px,calc((100vw - 1000px)/2))}header strong{font-size:24px;letter-spacing:.04em}header span,.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:750}main{max-width:1048px;padding:24px;margin:auto}section,article,details{background:white;border:1px solid #d9e2f1;border-radius:16px;padding:24px;margin:16px 0}details{padding:12px 16px}h1,h2{line-height:1.15;margin:.2em 0 .5em}h1{font-size:clamp(27px,5vw,42px)}h2{font-size:24px}.eyebrow,small{color:#4b6082}small{display:block}a{color:#1747a9}button,.button{display:inline-block;border:0;border-radius:10px;padding:11px 16px;background:var(--accent,#2454d6);color:white;font:inherit;font-weight:650;cursor:pointer;text-decoration:none}nav{display:flex;align-items:center;justify-content:space-between}form{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:12px 0}nav form,td form{margin:0}label{display:grid;gap:4px;font-size:13px;min-width:160px;flex:1}input,select{border:1px solid #b9c7df;border-radius:8px;padding:10px;font:inherit;min-width:0;width:100%}input[type=color]{height:42px}.login{max-width:500px;margin:10vh auto}.login form{display:grid}.metrics,.actions{display:flex;gap:12px;flex-wrap:wrap}.metric{padding:12px 18px;background:#edf3ff;border-radius:12px;min-width:120px}.metric b{display:block;font-size:24px}.metric span{font-size:13px}.scroll{overflow:auto}table{width:100%;border-collapse:collapse;margin-top:12px;text-align:left}th,td{padding:10px;border-bottom:1px solid #e2e8f3}summary{cursor:pointer;font-weight:650}.public main{max-width:580px}.card{border-top:6px solid var(--accent);text-align:center;box-shadow:0 15px 45px #19325918;padding:32px}.card.editorial{text-align:left;border-left:8px solid var(--accent);border-top:0}.card.compact .portrait{width:78px;height:78px}.portrait{width:124px;height:124px;border-radius:50%;object-fit:cover;background:#e1ebff;margin-bottom:12px}.placeholder{display:inline-grid;place-items:center;font-size:42px}.card .actions{justify-content:center;margin-top:18px}.editorial .actions{justify-content:flex-start}.secondary{align-items:center;font-size:14px}#notice{min-height:1.5em;color:#395377}@media(max-width:500px){main{padding:14px}section,.card{padding:20px}.actions .button{flex:1}}
/* Cards360 Spatial UI, adapted from the developer handover prototypes. */
:root{color-scheme:dark;--accent:#3db8f2;--muted:#acbed6;--line:#ffffff16;--surface:#ffffff07}
body{color:#f1f6ff;background:radial-gradient(ellipse at 15% 0,#123261 0,transparent 56%),radial-gradient(ellipse at 100% 100%,#0b3449,transparent 55%),#050d1f;background-attachment:fixed;font-family:Inter,'Plus Jakarta Sans',system-ui,sans-serif;line-height:1.55;min-height:100vh}
.workspace>header{background:#07142b99;border-bottom:1px solid var(--line);padding:20px 34px;gap:12px}.workspace>header strong{font-size:20px}.workspace>header span{color:#80d3fa;font-size:12px}
.workspace main{max-width:1500px;padding:36px 40px 60px}main:has(.sidebar){padding-left:274px;max-width:1600px}
h1{font-size:clamp(28px,3vw,38px);letter-spacing:-.04em;font-weight:750}h2{font-size:20px;letter-spacing:-.025em}p{color:var(--muted)}small{font-size:13px;color:var(--muted)}a{color:#91d9fc;text-underline-offset:4px}a:hover{color:white}.eyebrow{color:#96b7d6;font-size:12px;letter-spacing:.15em}
section,article,details{background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:inset 0 1px 0 #ffffff07}details{border-radius:16px;padding:16px;box-shadow:none}details[open] summary{margin-bottom:20px}summary{font-size:15px}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0 0 26px}.page-heading p{margin:5px 0}.page-heading .eyebrow{margin-bottom:12px}.page-heading .pill{white-space:nowrap}
.sidebar{position:fixed;left:22px;top:22px;bottom:22px;width:220px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:22px 14px;border:1px solid #ffffff1b;border-radius:26px;background:#0d1d35ed;backdrop-filter:blur(30px);box-shadow:0 30px 70px #0003;z-index:5}.wordmark{display:flex;gap:10px;align-items:center;text-decoration:none;margin:0 6px 32px;color:white}.wordmark img{width:60px;height:48px;object-fit:contain}.wordmark strong{font-size:20px}.wordmark strong span{color:#3db8f2}.sidebar>.eyebrow{margin:0 14px 12px;font-size:11px}.nav-item{display:flex;align-items:center;gap:12px;padding:13px 14px;margin:3px 0;text-decoration:none;color:#b7c9df;border-radius:12px;font-size:14px;font-weight:600}.nav-item>span{font-size:21px;width:22px;text-align:center}.nav-item.selected{background:#3db8f21c;color:#8adaff;box-shadow:inset 3px 0 #3db8f2}.nav-item:hover{background:#ffffff0a}.nav-bottom{margin-top:auto;padding:20px 10px 0;border-top:1px solid var(--line)}.nav-bottom strong{display:block;font-size:14px;margin-top:10px}.nav-bottom small{margin-bottom:16px}.avatar{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#3db8f22b;color:#90dfff}.nav-bottom button{background:#ffffff0c;color:#dceaff;min-height:40px;padding:8px 14px;font-size:13px}
button,.button{background:var(--accent);color:#061530;border-radius:999px;font-size:14px;min-height:44px;padding:11px 20px;font-weight:750;transition:filter .15s}button:hover,.button:hover{filter:brightness(1.1);color:#061530}input,select{background:#071429;color:#edf5ff;border:1px solid #ffffff24;border-radius:10px;padding:12px}input:focus,select:focus{outline:2px solid #3db8f2;outline-offset:2px}label{font-size:14px;color:#c7d8eb;gap:8px;min-width:190px}form{gap:18px}.pill{display:inline-flex;align-items:center;padding:5px 12px;border-radius:99px;background:#3db8f218;color:#99dcff;font-size:12px;font-weight:650}.metrics{gap:14px}.metric{background:#ffffff07;border:1px solid var(--line);border-radius:20px;padding:20px;min-width:140px;flex:1}.metric b{font-size:32px;letter-spacing:-.04em;margin:10px 0 3px;color:white}.metric span{font-size:14px;color:#bccfe4}.metric small{font-size:12px}.kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}.kpis .metric{min-width:0}.dashboard-grid{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(0,1.4fr);gap:20px}.dashboard-grid section{min-width:0;margin:24px 0}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px}.section-heading h2{margin:0}.section-heading a{font-size:13px}.bar-row{margin-bottom:20px}.bar-row>div:first-child{display:flex;justify-content:space-between;font-size:14px;margin-bottom:8px}.track{height:7px;background:#ffffff0e;border-radius:99px;overflow:hidden}.track>div{height:100%;background:linear-gradient(90deg,#177bbd,#61d3ff);border-radius:99px}.info-strip{padding:18px;border-radius:16px;background:#3db8f20b;border:1px solid #3db8f222;color:#adcbe3;font-size:14px;margin:20px 0}.domain-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:24px 0}.domain-grid>div{padding:18px;background:#ffffff05;border-radius:16px}.domain-grid strong{overflow-wrap:anywhere}
table{font-size:14px}th{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#9fb5d1;font-weight:650}th,td{padding:16px 10px;border-bottom:1px solid var(--line)}td a{text-decoration:none}td small{font-size:12px;margin-top:4px}td form button{background:#ffffff0b;color:#c3d8ee;font-size:12px;padding:8px 13px;min-height:36px}tr:hover td{background:#ffffff03}.login{max-width:480px;margin:7vh auto;padding:38px;background:#ffffff09;box-shadow:0 35px 90px #0004}.login h1{font-size:38px}.login button{margin-top:8px}.login label{margin-top:8px}.profile-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(270px,.8fr);gap:30px}.profile-grid>div{min-width:0}.profile-grid form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}.profile-grid label{min-width:0}.profile-grid input[name^=ar_]{direction:rtl}.preview-column{position:sticky;top:32px;align-self:start;padding-top:16px}.preview-card{position:relative;border:1px solid #ffffff24;border-radius:28px;overflow:hidden;min-height:520px;background:#061530;box-shadow:0 30px 70px #0005}.preview-card>img{width:100%;height:430px;object-fit:cover;object-position:top}.preview-brand{position:absolute;left:22px;top:22px;font-size:24px;font-weight:800;text-shadow:0 2px 8px #000}.preview-content{position:relative;margin-top:-160px;padding:100px 22px 26px;text-align:center;background:linear-gradient(transparent,#061530 35%)}.preview-content h2{font-size:24px}.preview-content p{font-size:14px;color:#67caff}.preview-actions{display:flex;gap:8px;justify-content:center;margin:22px 0;font-size:11px}.preview-actions span{border-radius:12px;background:#ffffff0e;padding:10px 6px}.preview-content .button{width:100%}.preview-column>small{margin:18px 8px}.preview-placeholder{height:400px;display:grid;place-items:center;font-size:100px;background:linear-gradient(135deg,#144f7e,#061530)}
.public>header{background:transparent;padding:18px 24px;justify-content:center}.public main{max-width:500px}.public .card{position:relative;border:1px solid #ffffff1c;padding:0 0 26px;border-radius:28px;overflow:hidden;background:#061530}.public .portrait{width:100%;height:390px;border-radius:0;object-position:top;margin:0;mask-image:linear-gradient(#000 68%,transparent)}.public .card>div[dir]{position:relative;margin-top:-60px;padding:0 24px}.public .card h1{font-size:30px}.public .card .actions{padding:0 20px}.public .card .actions .button{font-size:13px;padding:10px 15px}.public .card .secondary{gap:16px;font-size:13px}.public #notice{color:#91d9fc}.public .card.compact .portrait{width:110px;height:110px;border-radius:50%;margin:28px auto 60px;mask-image:none}.public .card.editorial{text-align:left}
:focus-visible{outline:2px solid #71d6ff;outline-offset:4px}@media(min-width:1000px){.workspace:has(.sidebar)>header{padding-left:280px}}@media(max-width:1200px){.kpis{grid-template-columns:repeat(3,1fr)}.dashboard-grid{grid-template-columns:1fr}.dashboard-grid section{margin:6px 0}.profile-grid{grid-template-columns:1fr}.preview-column{max-width:400px;position:static}.workspace main{padding-right:24px}}@media(max-width:800px){.sidebar{position:relative;left:auto;top:auto;bottom:auto;width:auto;flex-direction:row;flex-wrap:wrap;gap:6px;padding:12px;border-radius:18px;margin-bottom:26px}.sidebar .wordmark{width:100%;margin:0 4px 6px}.sidebar>.eyebrow,.nav-bottom{display:none}.nav-item{padding:10px;font-size:12px;gap:5px}.nav-item>span{font-size:16px;width:auto}main:has(.sidebar),.workspace main{padding:18px}.page-heading{align-items:flex-start;flex-direction:column}.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.metric{padding:16px}.metric b{font-size:27px}.domain-grid{grid-template-columns:1fr}.profile-grid form{grid-template-columns:1fr}.login{margin:20px auto;padding:26px}section{padding:20px}.public .portrait{height:360px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.workspace:has(.sidebar)>header{display:none}
@media(max-width:800px){.sidebar .nav-bottom{display:flex;align-items:center;gap:12px;width:100%;padding:12px 4px 0;margin-top:6px}.nav-bottom .avatar,.nav-bottom small{display:none}.nav-bottom strong{margin:0;flex:1}.nav-bottom form{margin:0}}
/* Active theme: Claymorphism, from the supplied Cards360 handover kit. */
:root{color-scheme:light;--accent:#3db8f2;--muted:#4a6285;--line:#c6d5e8;--surface:#f5f9fe;--clay-shadow:16px 16px 36px rgba(72,104,158,.24),inset -6px -6px 14px rgba(120,150,200,.2),inset 6px 6px 14px rgba(255,255,255,.95);--clay-in:inset 4px 4px 10px rgba(72,104,158,.2),inset -4px -4px 10px rgba(255,255,255,.95);--clay-button:8px 10px 20px rgba(61,184,242,.3),inset -4px -4px 10px rgba(0,60,110,.22),inset 4px 4px 10px rgba(255,255,255,.6)}
body{background:#e3ecf7;color:#0b1b33;font-family:'Nunito',ui-rounded,'Arial Rounded MT Bold',system-ui,sans-serif}h1,h2{font-weight:850;letter-spacing:-.025em}p,small,.eyebrow{color:#4a6285}a{color:#0658a3}a:hover{color:#0b1b33}.workspace>header{background:#e3ecf7;color:#0b1b33;border:0}.workspace>header span{color:#0658a3}
section,article{border:0;border-radius:32px;background:#f5f9fe;box-shadow:var(--clay-shadow)}details{background:#eaf1fa;border:0;border-radius:20px;box-shadow:var(--clay-in);padding:20px}.sidebar{background:#f5f9fe;border:0;border-radius:32px;box-shadow:var(--clay-shadow);backdrop-filter:none}.wordmark{color:#0b1b33}.wordmark img{width:52px;height:52px;padding:8px;border-radius:50%;background:#0b2a52;box-shadow:inset -5px -5px 10px #0003,inset 5px 5px 10px #ffffff4d,6px 8px 16px #48689e40}.wordmark strong{font-weight:900}.wordmark strong span{color:#0677c9}.sidebar>.eyebrow{color:#4a6285}.nav-item{color:#2b4366;font-weight:800;border-radius:20px;min-height:48px}.nav-item:hover{background:#eaf1fa;color:#0b1b33}.nav-item.selected{background:#3db8f2;color:#061530;box-shadow:var(--clay-button)}.nav-bottom{background:#eaf1fa;border:0;border-radius:20px;padding:16px 12px;box-shadow:var(--clay-in)}.avatar{color:#0b2a52;background:#9ad8ff;box-shadow:inset -3px -3px 7px #48689e40,inset 3px 3px 7px #fff9}.nav-bottom button{background:#f5f9fe;color:#2b4366;box-shadow:6px 6px 12px #48689e26,inset -3px -3px 6px #7896c833,inset 3px 3px 6px #fff}
.metric{background:#f5f9fe;border:0;border-radius:28px;box-shadow:var(--clay-shadow);padding:22px}.metric b{color:#0b1b33;font-weight:900}.metric span{color:#4a6285;font-weight:750}.kpis .metric:before{content:'';display:block;width:32px;height:32px;border-radius:50%;margin-bottom:15px;background:#9ad8ff;box-shadow:inset -5px -5px 10px #0002,inset 5px 5px 10px #ffffff80,6px 8px 15px #48689e30}.kpis .metric:nth-child(2):before{background:#8de3cf}.kpis .metric:nth-child(3):before{background:#f7a8c4}.kpis .metric:nth-child(4):before{background:#c6b0f3}.kpis .metric:nth-child(5):before{background:#ffd27a}.kpis{gap:20px}.dashboard-grid{gap:24px}.dashboard-grid section{margin-top:28px}.pill{background:#d5effd;color:#17577e;font-weight:800;box-shadow:inset -2px -2px 5px #0000000d,inset 2px 2px 5px #ffffffb3}.track{height:12px;background:#e3ecf7;box-shadow:inset 3px 3px 6px #48689e40,inset -3px -3px 6px #fffffff2}.track>div{background:#3db8f2;box-shadow:inset -2px -3px 5px #003c6e40,inset 2px 2px 4px #fff9}.bar-row{margin-bottom:22px}.bar-row strong{color:#0b1b33}.info-strip{background:#eaf1fa;color:#395775;border:0;box-shadow:var(--clay-in);border-radius:20px}.domain-grid>div{background:#eaf1fa;box-shadow:var(--clay-in);border-radius:20px}
button,.button{background:var(--accent);color:#061530;box-shadow:var(--clay-button);font-weight:850}button:hover,.button:hover{filter:brightness(1.03)}button:active,.button:active{box-shadow:var(--clay-in)}input,select{background:#eaf1fa;color:#0b1b33;border:1px solid #cfdbec;box-shadow:var(--clay-in);border-radius:14px}label{color:#2b4366;font-weight:700}input:focus,select:focus{outline-color:#0677c9}table{border-collapse:separate;border-spacing:0 8px}th{color:#4a6285;font-weight:850;border:0}td{background:#eaf1fa;border:0}td:first-child{border-radius:16px 0 0 16px}td:last-child{border-radius:0 16px 16px 0}tr:hover td{background:#deebf9}td form button{background:#f5f9fe;color:#2b4366;box-shadow:4px 4px 10px #48689e26,inset -2px -2px 5px #7896c826,inset 2px 2px 5px #fff}.login{background:#f5f9fe;box-shadow:var(--clay-shadow);border:0;border-radius:32px}
.preview-card{background:#f5f9fe;border:0;border-radius:36px;box-shadow:var(--clay-shadow);padding:10px}.preview-card>img{height:350px;border-radius:28px;display:block}.preview-brand{background:#0b2a52;color:white;border-radius:50%;width:64px;height:64px;display:grid;place-items:center;font-size:16px;box-shadow:inset -5px -5px 10px #0003,inset 5px 5px 10px #ffffff4d,6px 8px 16px #48689e40}.preview-content{margin:0;background:none;padding:24px 12px 20px}.preview-content h2{color:#0b1b33}.preview-content p{color:#0677c9}.preview-actions span{background:#eaf1fa;color:#2b4366;box-shadow:var(--clay-in)}.preview-placeholder{background:#d5e7f6;color:#0b2a52;border-radius:28px}
.public>header{color:#0b1b33;background:transparent}.public .card{background:#f5f9fe;border:0;border-radius:36px;padding:10px 10px 28px;box-shadow:var(--clay-shadow)}.public .portrait{mask-image:none;border-radius:28px;height:390px;display:block}.public .card>div[dir]{margin-top:24px;padding:0 16px}.public .card h1{color:#0b1b33}.public .card .eyebrow{color:#4a6285}.public .card .actions{padding:0 8px;margin-top:24px}.public .card .secondary{line-height:1.8}.public .card .secondary a{color:#0658a3}.public #notice{color:#395775}.public .card.compact .portrait{margin:18px auto}.public .card.editorial{border-left:6px solid var(--accent)}:focus-visible{outline-color:#0677c9}
@media(max-width:800px){.sidebar{border-radius:26px}.sidebar .nav-bottom{padding:12px}.dashboard-grid section{margin-top:20px}.metric{padding:18px}.public .portrait{height:350px}.kpis{gap:16px}}
.tenant-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:28px 0}.tenant-card{display:block;background:#f5f9fe;box-shadow:var(--clay-shadow);border-radius:30px;padding:26px;color:#0b1b33;text-decoration:none;transition:transform .18s}.tenant-card:hover{transform:translateY(-4px);color:#0b1b33}.tenant-card h2{font-size:23px;margin-bottom:4px}.tenant-card p{margin:0 0 24px;font-size:14px}.tenant-monogram{display:grid;place-items:center;width:58px;height:58px;border-radius:20px;background:#9ad8ff;color:#0b2a52;font-size:22px;font-weight:850;box-shadow:inset -4px -4px 10px #48689e33,inset 4px 4px 10px #ffffff99,6px 8px 16px #48689e26}.tenant-card:nth-child(3n+2) .tenant-monogram{background:#8de3cf}.tenant-card:nth-child(3n) .tenant-monogram{background:#c6b0f3}.tenant-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:22px}.tenant-mini-stats strong{display:block;font-size:24px}.tenant-mini-stats span{font-size:12px;color:#4a6285}.tenant-open{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #d5e1ef;margin-top:18px;padding-top:18px;font-size:14px;font-weight:800;color:#0658a3}.back-link{display:inline-block;margin:0 0 24px;font-size:14px;font-weight:750;text-decoration:none}@media(max-width:1250px){.tenant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.tenant-grid{grid-template-columns:1fr}.tenant-card{padding:24px}}
.upgrade-pitch{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px;margin:24px 0;background:#dceefa;border:1px solid #c0ddf0;border-radius:24px;box-shadow:inset 3px 3px 8px #ffffffaa,inset -3px -3px 8px #8eb6da22}.upgrade-pitch p{margin:6px 0;font-size:14px;max-width:620px}.upgrade-pitch .button{flex-shrink:0}.wizard-steps{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 30px;justify-content:flex-start}.wizard-steps a,.wizard-steps>span{padding:12px 18px;border-radius:18px;background:#eaf1fa;box-shadow:var(--clay-in);font-size:14px;text-decoration:none;font-weight:750}.wizard-steps [aria-current]{background:#3db8f2;color:#061530;box-shadow:var(--clay-button)}.wizard-steps [aria-disabled]{color:#60748c}.plan-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:24px}.plan-grid section{margin:0}.plan-grid h2{margin-top:20px}.plan-grid ul{padding-left:22px;line-height:2}.paid-plan{outline:2px solid #3db8f2;outline-offset:-2px}.check-label{display:flex;flex-basis:100%;align-items:center;gap:10px}.check-label input{width:20px;height:20px;flex-shrink:0;box-shadow:none}.style-guide{flex-basis:100%;padding:16px 20px;background:#eaf1fa;border-radius:20px}.style-guide p{margin:6px 0}.setup-guide{padding-left:24px;line-height:1.8}.setup-guide li{padding:6px 0}@media(max-width:800px){.plan-grid{grid-template-columns:1fr}.upgrade-pitch{flex-direction:column;align-items:flex-start}.wizard-steps{gap:8px}.wizard-steps a,.wizard-steps>span{padding:10px 12px}.plan-grid section{margin-bottom:12px}}
.subscription-cards{margin:26px 0;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}.subscription-card{display:flex;flex-direction:column;min-width:0;padding:26px!important}.subscription-card .section-heading{align-items:flex-start;flex-wrap:wrap;margin-bottom:8px}.subscription-card .section-heading h2{font-size:26px;margin:0}.subscription-card.current-plan{outline:3px solid #0677c9;outline-offset:3px;background:#f2faff}.plan-state{font-size:12px;font-weight:850;border-radius:99px;padding:6px 10px;background:#e3ecf7;color:#4a6285}.current-plan .plan-state{background:#0677c9;color:white}.plan-price{font-size:19px;font-weight:850;margin:16px 0;color:#0b2a52}.plan-price small{font-weight:600;margin-top:6px}.subscription-card ul{padding-left:22px;line-height:1.65;margin:14px 0 20px;flex:1}.subscription-card li{padding:5px 0;font-size:14px}.subscription-card .plan-limit{font-size:13px;padding:14px;background:#eaf1fa;border-radius:16px}.subscription-card .button{margin-top:12px;text-align:center;align-self:stretch}.current-note{padding:15px 0 4px;text-align:center;font-size:14px;font-weight:800;color:#0658a3}@media(max-width:800px){.subscription-cards{grid-template-columns:1fr}.subscription-card{margin-bottom:8px!important}}
.qr-detail{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.2fr);gap:32px}.qr-preview{display:block;width:100%;max-width:320px;aspect-ratio:1;background:white;border:12px solid white;border-radius:16px;margin-bottom:20px}.qr-target{overflow-wrap:anywhere}.qr-detail input[readonly]{font-size:13px}.qr-filters label{min-width:150px}.qr-chart{display:flex;align-items:flex-end;gap:5px;height:160px;padding:15px 8px;background:#eaf1fa;border-radius:18px;overflow-x:auto;box-shadow:var(--clay-in);border-bottom:1px solid #9eb9cf}.qr-bar-pair{height:130px;min-width:14px;flex:1;display:flex;align-items:flex-end;gap:2px}.qr-bar{background:#0677c9;flex:1;min-width:5px;border-radius:3px 3px 0 0}.qr-bar.comparison{background:#9274c4}.chart-key{display:inline-block;width:12px;height:12px;border-radius:3px;background:#0677c9}.chart-key.previous{background:#9274c4}.qr-series-table{max-height:440px;margin-top:20px}.qr-series-table th{position:sticky;top:0;background:#f5f9fe}.qr-library h2{margin-top:18px}.form-note{flex-basis:100%;font-size:14px}.tenant-qr-link{float:right;margin-bottom:20px}.qr-filters{padding:16px 0}.qr-detail .actions{gap:10px}.qr-detail .actions .button{font-size:13px}@media(max-width:900px){.qr-detail{grid-template-columns:1fr}.qr-preview{margin-inline:auto}.tenant-qr-link{float:none;display:block;width:fit-content}}
form label[hidden]{display:none}
/* Make prices distinct from descriptive text while retaining the clay surfaces. */
.subscription-card .cost-highlight,.billing-price{padding:22px 24px;border-radius:22px;background:linear-gradient(140deg,#123d69,#08649b);color:#fff;border:1px solid #0879b5;box-shadow:inset 2px 2px 5px #ffffff25,inset -3px -3px 7px #001d3640,6px 7px 15px #a3b8ce70;margin:18px 0 24px}
.subscription-card .cost-highlight{font-size:clamp(36px,4vw,48px);line-height:1.15;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.subscription-card .cost-highlight small,.billing-price strong small{color:#e1f4ff;font-size:14px;letter-spacing:0;font-weight:600;margin-top:8px}
.billing-price{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px}.billing-price>span{font-size:14px;color:#e1f4ff}.billing-price>strong{font-size:40px;line-height:1.15;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.cost-total{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:20px 24px;background:#e1f5ee;border:2px solid #85bcaa;border-radius:20px;box-shadow:inset 2px 2px 6px #ffffffcc,4px 5px 12px #a6bdbe55;color:#124d3b;margin:20px 0}.cost-total>span{font-size:14px;font-weight:750}.cost-total>strong{font-size:36px;line-height:1.2;font-variant-numeric:tabular-nums;letter-spacing:-.035em}.cost-total small{font-size:13px;color:#285f4e;letter-spacing:0;margin-top:5px}.seat-purchase{flex-basis:100%;min-width:0}.cost-summary{padding:16px 20px;border-left:5px solid #08649b;background:#e3f2ff;border-radius:12px;font-weight:800;color:#123d69}.metric.cost-metric{background:#e1f5ee;border:2px solid #85bcaa}.metric.cost-metric b{color:#124d3b}.metric.cost-metric span{color:#285f4e}@media(max-width:500px){.billing-price{align-items:flex-start;flex-direction:column}.cost-total{padding:18px}.cost-total>strong{font-size:30px}}
/* Keep seat selection, total and confirmation together in a compact form. */
form:has(.seat-purchase){display:grid;grid-template-columns:minmax(0,1fr);width:100%;max-width:520px;gap:20px;align-items:start;margin-top:24px}
.seat-purchase{width:100%;min-width:0;scroll-margin-top:32px}.seat-purchase>p:first-child{margin-top:0}.seat-purchase>label{display:grid;min-width:0;max-width:260px;gap:10px;font-size:15px}.seat-purchase .seat-count{max-width:180px;min-height:52px;font-size:22px;font-weight:750;text-align:center;font-variant-numeric:tabular-nums}.seat-purchase .cost-total{gap:12px;padding:18px 20px;margin:22px 0 16px}.seat-purchase .seat-total{font-size:28px;overflow-wrap:anywhere}.seat-purchase>small{line-height:1.6}
form:has(.seat-purchase)>label{display:flex;align-items:flex-start;min-width:0;gap:12px;line-height:1.55;font-size:14px}form:has(.seat-purchase)>label input[type=checkbox]{flex:0 0 18px;width:18px;height:18px;margin:3px 0 0}form:has(.seat-purchase)>button{justify-self:start;max-width:100%}.seat-purchase:focus{outline:none}@media(max-width:500px){form:has(.seat-purchase){max-width:100%}.seat-purchase .cost-total{align-items:flex-start;flex-direction:column}.seat-purchase .seat-total{font-size:26px}}
.license-price-panel{padding:22px;background:#e1f5ee;border:2px solid #85bcaa;border-radius:22px;box-shadow:inset 2px 2px 6px #ffffffcc,4px 5px 12px #a6bdbe55;margin-bottom:16px}.license-unit-price{margin:0 0 20px;color:#285f4e;font-size:14px;font-weight:750}.license-price-row{display:grid;grid-template-columns:minmax(120px,.8fr) minmax(0,1.2fr);gap:24px;align-items:center}.license-price-row>label{min-width:0;color:#124d3b;font-size:14px;font-weight:700;gap:10px}.license-price-row .seat-count{width:100%;max-width:180px;background:#f5fcf9;color:#124d3b}.license-total{border-left:1px solid #85bcaa;padding-left:24px;min-width:0}.license-total>span{display:block;font-size:14px;color:#285f4e;font-weight:700;margin-bottom:10px}.license-total .seat-total{display:block;font-size:clamp(22px,3vw,30px);color:#124d3b;font-variant-numeric:tabular-nums;line-height:1.25;overflow-wrap:anywhere}@media(max-width:430px){.license-price-panel{padding:16px}.license-price-row{gap:14px;grid-template-columns:minmax(100px,.8fr) minmax(0,1.2fr)}.license-total{padding-left:14px}.license-total .seat-total{font-size:22px}}
/* Consistent billing, team access and destructive-action layouts. */
input[type=checkbox],input[type=radio]{width:20px;height:20px;min-width:20px;padding:0;box-shadow:none;accent-color:#0879b5;margin:2px 0;flex:0 0 20px}
label:has(>input[type=checkbox]),label:has(>input[type=radio]){display:flex;align-items:flex-start;gap:12px;min-width:0;line-height:1.5}
.action-bar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:24px}.action-bar form{display:block;margin:0}.action-bar .button,.action-bar button{min-height:46px;margin:0;font-size:14px}.secondary-button,.billing-actions form button{background:#eaf1fa;color:#234366;box-shadow:var(--clay-in)}.danger-button{background:#fff0ef;color:#9e302d;box-shadow:inset 2px 2px 5px #fff,4px 4px 10px #cda6a333}
.billing-panel{max-width:1100px}.billing-panel .section-heading{gap:16px;flex-wrap:wrap}.billing-overview{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:24px 0}.billing-overview .billing-price,.billing-overview .cost-total{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;margin:0;min-width:0;padding:24px}.billing-overview strong{font-size:clamp(28px,3vw,40px)}.currency-unit{font-size:.48em;letter-spacing:0;white-space:nowrap}.billing-explainer{align-self:center;padding:12px 24px}.billing-explainer h3{margin:0}.billing-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;padding:22px 0;margin:0;border-block:1px solid #d5e1ef}.billing-facts dt{color:#4a6285;font-size:13px}.billing-facts dd{margin:6px 0 0;font-weight:850;overflow-wrap:anywhere}.billing-note{font-size:14px;max-width:720px}.billing-actions{padding-top:20px;border-top:1px solid #d5e1ef}.billing-actions .danger-button{margin-left:auto}
.tenant-access form,.stacked-form{display:grid;grid-template-columns:minmax(0,1fr);max-width:720px;gap:20px;align-items:start}.tenant-access form>button,.stacked-form>button{justify-self:start}.access-identity{display:grid;grid-template-columns:minmax(110px,.35fr) minmax(0,1fr);gap:20px;padding:20px;background:#eaf1fa;border-radius:20px;box-shadow:var(--clay-in)}.access-identity a{overflow-wrap:anywhere;font-weight:750}.access-identity code{font-size:17px}.setting-toggle{padding:16px 0;border-bottom:1px solid #d5e1ef}.setting-toggle strong,.closure-option strong{display:block;font-size:16px}.setting-toggle small,.closure-option small{margin-top:6px;font-weight:500}.copy-notice{font-size:13px;color:#285f4e}
.closure-panel{max-width:1000px}.closure-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:24px 0}.closure-option{padding:22px;border:2px solid #d4dfed;border-radius:22px;background:#eaf1fa;cursor:pointer}.closure-option:has(input:checked){border-color:#0879b5;background:#e0f2ff}.closure-option.destructive:has(input:checked){border-color:#b74c43;background:#fff0ef}.closure-panel .stacked-form>label:not(.check-label){max-width:420px}.danger-zone{border:1px solid #dca8a5}.danger-zone form{display:grid;grid-template-columns:1fr;max-width:520px}.danger-zone button{justify-self:start;background:#fff0ef;color:#9e302d}.danger-zone summary{color:#9e302d}
.team-entry{max-width:1040px;margin:auto}.entry-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.entry-grid section{margin:0}.entry-grid form{display:grid;gap:18px}.entry-grid label{min-width:0}.entry-grid button{justify-self:start}.entry-grid h2{font-size:26px}
@media(max-width:700px){.billing-overview,.entry-grid,.access-identity{grid-template-columns:1fr}.billing-panel .section-heading{align-items:flex-start}.billing-actions .danger-button{margin-left:0}.billing-overview .billing-price,.billing-overview .cost-total{padding:20px}.action-bar{gap:10px}.closure-options{grid-template-columns:1fr}.entry-grid section{padding:24px}}
.browse-banner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;background:#fff3ce;border:1px solid #dfc36e;border-radius:20px;padding:18px 22px;margin-bottom:24px}.browse-banner strong{color:#62470b}.browse-banner small{color:#725c2c;margin-top:4px}.browse-banner form{margin:0}.account-features{line-height:2;padding-left:22px}button:disabled{opacity:.55;cursor:not-allowed}
.onboarding-page{max-width:1040px;margin:auto}.onboarding-form{display:grid;grid-template-columns:1fr;max-width:900px;gap:24px}.onboarding-form fieldset,.entry-grid fieldset{display:grid;grid-template-columns:1fr 1fr;gap:18px;border:1px solid #d3dfed;border-radius:20px;padding:20px;min-width:0;margin:0}.onboarding-form legend,.entry-grid legend,.language-options legend{font-weight:850;padding:0 8px;color:#234366}.onboarding-form label,.entry-grid label{min-width:0}.phone-fields{display:grid;grid-template-columns:minmax(130px,.8fr) minmax(0,1.2fr);gap:16px;grid-column:1/-1}.phone-fields label:last-child{grid-column:1/-1}.arabic-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px;grid-column:1/-1}.arabic-fields input{direction:rtl}.language-options{display:flex;flex-wrap:wrap;gap:20px;border:1px solid #d3dfed;border-radius:18px;padding:18px;min-width:0}.language-options label{flex:0 0 auto}.onboarding-form>button{justify-self:start}.onboarding-share{display:grid;grid-template-columns:160px minmax(0,1fr);gap:24px;align-items:center;margin:24px 0}.signup-qr{display:block;width:160px;height:160px;background:white;padding:4px;border-radius:16px;box-shadow:4px 5px 12px #a3b8ce50}.onboarding-share h3{margin:0}.onboarding-share p{font-size:14px}.onboarding-share a{overflow-wrap:anywhere}.entry-grid .onboarding-company,.entry-grid .onboarding-person{grid-template-columns:1fr}.entry-grid .phone-fields,.entry-grid .arabic-fields{grid-template-columns:1fr}.onboarding-complete{max-width:850px;margin:24px auto}.onboarding-complete code{overflow-wrap:anywhere}.phone-fields label[hidden],.arabic-fields[hidden]{display:none}
@media(max-width:600px){.onboarding-form fieldset,.phone-fields,.arabic-fields{grid-template-columns:1fr}.onboarding-share{grid-template-columns:1fr;gap:18px}.onboarding-form fieldset{padding:16px}.signup-qr{width:160px;height:160px}}
