/* IQON ecosystem · visual source: IQ charge / iqcharge.tech.
   Shared by the live app and the menu design workspace. */
:root{
 --brand-primary:#3800d7;--brand-cyan:#00c7e2;--brand-mint:#a7d4ae;
 --brand-ink:#111b1c;--brand-muted:#59676b;--brand-light:#f1fbfd;--brand-line:#dce8eb;
 --brand-violet-soft:#f2efff;--brand-primary-hover:#2c00ad;
 --brand-gradient:linear-gradient(180deg,#00c7e2 0%,#3800d7 70%);
 --bg:var(--brand-light);--paper:#fff;--ink:var(--brand-ink);--muted:var(--brand-muted);--line:var(--brand-line);
 --green:var(--brand-primary);--lime:var(--brand-cyan);--sans:'Lato',Arial,sans-serif;--heading:'Plus Jakarta Sans',Arial,sans-serif;
 --shadow:0 12px 35px #3800d70d;
}
body{background:var(--bg);color:var(--ink);font-family:var(--sans)}
h1,h2,h3{font-family:var(--heading);font-weight:700;letter-spacing:-.025em;color:var(--ink)}
h1{font-size:34px;line-height:1.24}h2{line-height:1.3}h3{line-height:1.4}
p,small,.muted,.help-text,.menu-notice,.bottom-note,.panel-foot{color:var(--muted)}
.eyebrow{font-family:var(--heading);font-size:10px;letter-spacing:.1em;color:var(--brand-primary)}
.btn{border-radius:32px;min-height:44px;font-weight:700;padding:11px 20px;border-color:var(--line);color:var(--ink);box-shadow:none;transition:background .18s,transform .18s}
.btn:hover{background:var(--brand-violet-soft);border-color:#cfc3f4;transform:translateY(-1px)}
.btn.primary{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff}
.btn.primary:hover{background:var(--brand-primary-hover);border-color:var(--brand-primary-hover)}
.btn.lime{background:var(--brand-cyan);border-color:var(--brand-cyan);color:#082c34}
.btn.lime:hover{background:#65dfed;border-color:#65dfed}.btn:disabled{transform:none}
.btn.sm{min-height:36px;padding:8px 13px}.btn.danger{color:#9b3528;border-color:#e8c5bf}.btn.danger:hover{background:#fff1ee}
.icon-btn{border-color:var(--line);border-radius:50%;color:var(--brand-primary)}.icon-btn:hover{background:var(--brand-violet-soft)}
input,select,textarea{border-color:var(--line);border-radius:10px;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--brand-primary)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--brand-cyan);outline-offset:3px}
.panel,.stat,.food-card,.table-card,.quick-card,.mail-provider,.document-card,.payment-panel{border-color:var(--line);border-radius:12px;background:#fff}
.logo{display:inline-flex;align-items:center;line-height:1;width:167px;letter-spacing:0}.logo img{display:block;width:100%;height:auto;aspect-ratio:660/164}
.sidebar{background:#fff;border-right:1px solid var(--line);color:var(--ink);padding:0 20px 20px}
.brand-lockup{background:var(--brand-gradient);margin:0 -20px;padding:25px 22px 18px;border-bottom:5px solid #6540ef;min-height:120px}
.brand-sub{color:#e9faff;font-size:8px;letter-spacing:.15em;margin-top:12px}
.venue{margin-top:24px;background:var(--brand-light);border-color:var(--line);border-radius:10px}.venue strong{color:var(--ink);font-size:12px}.venue small{color:var(--muted)}
.venue-icon{background:#e4f8fc;color:var(--brand-primary)}.venue>.icon{color:var(--brand-primary)}
.nav-label{color:var(--muted);margin-top:25px}.nav button{color:var(--muted);font-size:12px;font-weight:400}
.nav button:hover{background:var(--brand-light);color:var(--brand-primary)}
.nav button.active{background:var(--brand-violet-soft);color:var(--brand-primary);font-weight:700;box-shadow:inset 3px 0 0 var(--brand-cyan)}
.nav button.active .icon{color:var(--brand-primary)}.nav button .badge-number{background:#fff;color:var(--brand-primary)}
.nav-demo,.sidebar>.nav>.nav-demo{color:var(--muted)}.nav-demo:hover,.sidebar>.nav>.nav-demo:hover{color:var(--brand-primary)}
.mini-note{background:var(--brand-light);border:1px solid var(--line);padding:15px 13px;border-radius:12px}.mini-note .eyebrow{font-size:8px;color:var(--brand-primary)}.mini-note p{color:var(--muted);font-size:10px;line-height:1.7;margin-top:12px}
.ecosystem-link{display:flex;align-items:center;gap:10px;margin-top:14px;padding:11px 10px;background:var(--brand-gradient);border-radius:8px;opacity:1}.ecosystem-link img{width:100%;max-width:150px;height:auto}.ecosystem-link .icon{color:#fff;width:14px}
.ecosystem-active{display:flex;align-items:center;gap:8px;color:var(--brand-primary);font-size:11px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}.ecosystem-active .dot{margin-left:auto;color:var(--brand-cyan)}
.owner{border-color:var(--line)}.owner strong{color:var(--ink)}.owner small{color:var(--muted)}.owner .avatar{background:var(--brand-violet-soft);color:var(--brand-primary)}
.topbar{background:var(--brand-gradient);color:#fff;border-bottom:4px solid #6540ef;height:120px}.topbar:after{display:none}
.breadcrumb{color:#e6faff}.breadcrumb strong{color:#fff;font-weight:700}.topbar .studio-dot,.topbar .connection{color:#fff}.topbar .studio-dot .dot,.topbar .connection .dot{background:#a5f2fb}
.topbar-actions .avatar{background:#fff;border-color:#ffffff70;color:var(--brand-primary)}.topbar-actions .btn,.topbar-actions .icon-btn{border-color:#ffffff80;background:#ffffff10;color:#fff}.topbar-actions .btn:hover{background:#ffffff25}
.content{padding-top:32px}.page-heading p,.stat-label,.stat-foot{color:var(--muted)}.stat-value{color:var(--brand-primary)}
.hero{background:linear-gradient(115deg,#3800d7,#4b16dd);border:0;min-height:195px;border-radius:12px}.hero:after{content:'';position:absolute;bottom:0;left:0;right:0;height:4px;background:var(--brand-cyan)}
.hero h2{color:#fff;font-family:var(--heading);font-size:29px;font-weight:700;line-height:1.3}.hero h2 em{font-family:var(--heading);font-weight:700;font-style:normal;color:#a5f2fb}.hero .eyebrow{color:#a5f2fb}.hero p{color:#f1edff;font-size:12px}.hero .btn.lime{background:var(--brand-cyan);color:#082c34;border-color:var(--brand-cyan)}
.orbit,.orbit:before,.orbit:after{border-color:#c8b4ff55}.float-chip{border-radius:12px}.float-chip.one{background:#fff;color:var(--brand-primary)}.float-chip.two{background:var(--brand-cyan);color:#082c34;font-weight:700}.float-chip.three{color:var(--ink)}
.table-number,.table-card.empty .table-number{color:var(--ink)}.table-name,.table-bottom,.table-card.empty .table-bottom{color:var(--muted)}
.table-card.selected{background:var(--brand-violet-soft);border-color:#baabec}.table-card:hover{border-color:var(--brand-primary);box-shadow:0 8px 25px #3800d70d}.table-card.empty{border-style:solid}
.tabs{background:var(--brand-light);border-color:var(--line);border-radius:24px}.tabs button{border-radius:24px;color:var(--muted)}.tabs button.active{color:var(--brand-primary)}
.badge-number{background:var(--brand-violet-soft);color:var(--brand-primary)}
.demo-strip{background:var(--brand-violet-soft);color:#493283;border-bottom:1px solid #e4dcfa}
.guest-nav{background:var(--brand-gradient);border-bottom:4px solid #6540ef;color:#fff;padding-block:22px}.guest-brand .logo{width:167px}.guest-brand small{color:#e6faff}.guest-nav .connection{color:#fff}.guest-nav .connection .dot{background:#a5f2fb}.guest-nav .lang-select{color:#fff;border-color:#ffffff90;background:#ffffff15;border-radius:22px}.guest-nav select option{background:#fff;color:var(--ink)}
.guest-intro h1,.split-head h1,.closed-state h1,.join-wrap h1{font-family:var(--heading);font-weight:700;letter-spacing:-.025em;color:var(--ink)}.guest-intro h1{font-size:34px}.guest-intro p,.split-head p,.join-wrap>p{color:var(--muted)}
.session-bar,.table-code{background:#eafafd;border-color:#c3eaf1}.session-bar strong,.table-code strong{color:var(--brand-primary)}.session-bar small,.table-code small{color:var(--muted)}.session-bar select{border-color:var(--line)}
.food-tag{color:var(--brand-primary);background:var(--brand-violet-soft)}.food-body p,.food-body small{color:var(--muted)}.food-body .price{color:var(--brand-primary)}.filter-pills button{color:var(--muted);border-radius:28px;border-color:var(--line)}.filter-pills button.active{background:var(--brand-primary);color:#fff;border-color:var(--brand-primary)}
.cart-foot{background:var(--brand-light)}.cart-line{border-color:var(--line)}.cart-foot p,.quick-card p{color:var(--muted)}.quick-card h3{color:var(--ink)}.quick-icon{background:var(--brand-violet-soft);color:var(--brand-primary)}
.info-box{background:var(--brand-light);border-color:#c3eaf1;color:#28545d;border-radius:12px}.join-visual{background:var(--brand-light);border-color:#c3eaf1;color:var(--brand-primary)}
.modal{border-color:var(--line);border-radius:16px}.modal-head,.modal-foot,.modal-body{border-color:var(--line)}.modal-head h2{font-family:var(--heading);font-weight:700}.modal .code{border-color:var(--line);background:var(--brand-light);color:var(--muted)}
.bill-summary p,.bill-summary small,.payment-mode small,.bill-item>small,.assign-list-heading span,.assign-dish-line>div>small,.assign-current small,.payer-picker p,.payment-share small,.payment-totals span,.document-card>div>small,.mail-provider small,.mail-sender small,.receipt-settings>p{color:var(--muted)}
.bill-summary>div:last-child strong,.payer-heading>strong,.equal-share,.guest-total>strong,.payment-share>strong,.payment-totals strong{color:var(--brand-primary)}
.payer-column,.guest-total,.payment-totals,.assign-list-heading,.mail-steps span{background:var(--brand-light);border-color:var(--line)}
.payment-mode,.assign-list,.assign-dish,.assign-current,.bill-item,.bill-modes,.document-panel,.mail-sender,.mail-advanced,.receipt-panel>.between{border-color:var(--line)}
.payment-mode>span,.assign-current,.payer-picker .chosen{background:var(--brand-violet-soft);color:var(--brand-primary)}
.payment-mode.selected,.mail-provider.selected{border-color:var(--brand-primary);background:var(--brand-violet-soft);box-shadow:none}.payment-mode.selected>span{background:var(--brand-primary);color:#fff}.payment-mode.selected:after{color:var(--brand-primary)}
.assign-dish.expanded,.mail-settings .field input[readonly]{background:var(--brand-light)}.provider-symbol,.document-card>a{color:var(--brand-primary)}
.connection.lost{color:#9b3528}.guest-nav .connection.lost,.topbar .connection.lost{color:#fff0c2}.guest-nav .connection.lost .dot,.topbar .connection.lost .dot{background:#ffe3a0}
@media(max-width:1000px) and (min-width:761px){.content{padding-inline:24px}.topbar{padding-inline:24px}}
@media(max-width:760px){
 .brand-lockup{display:none}.sidebar{padding:6px 10px;background:#fff;border-top:1px solid var(--line);border-right:0;box-shadow:0 -5px 25px #3800d70b}
 .sidebar>.nav{display:contents}.sidebar .nav button{flex:1;max-width:calc((100vw - 20px)/5);min-height:54px;color:var(--muted);font-size:9px;line-height:1.35;padding:7px 3px;text-align:center;border-radius:10px;box-shadow:none}
 .sidebar .nav button.active{color:var(--brand-primary);background:var(--brand-violet-soft);box-shadow:inset 0 3px 0 var(--brand-cyan)}
 .sidebar .nav button>span{font-size:12px}.sidebar .nav button .badge-number{display:none}.sidebar>.nav>.nav-demo{display:none}
 .topbar{height:82px;padding-inline:20px}.mobile-brand .logo{width:145px}.topbar-actions .connection{font-size:10px;max-width:140px}.topbar-actions .avatar{width:29px;height:29px}
 .content{padding:26px 20px 98px}.page-heading h1{font-size:28px}.page-heading .eyebrow{font-size:9px}.page-heading p{font-size:12px}.hero{padding:25px 22px}.hero h2{font-size:26px}.stat-value{font-size:24px}
 .guest-nav{padding:17px 20px;gap:12px}.guest-brand .logo{width:139px}.guest-brand small{font-size:7px}.guest-nav .connection{font-size:9px}.guest-nav>.flex{gap:8px}.guest-nav .lang-select{max-width:100px}
 .guest-main{padding-inline:20px}.guest-intro h1,.split-head h1,.guest-main .join-wrap h1{font-size:28px}.guest-intro p{font-size:13px}.btn{min-height:44px}.btn.sm{min-height:36px}
}
@media(prefers-reduced-motion:reduce){.btn,.mail-provider,.table-card{transition:none}.btn:hover{transform:none}}
@media print{body{background:#fff}.brand-lockup{display:none}.hero{print-color-adjust:exact}.modal{border-radius:0}.paper-menu{color:#111b1c}}
.closed-state p,.modal-head p,.field>span,.field>label{color:var(--muted)}
@media(max-width:760px){.closed-state h1{font-size:30px}}
.guest-nav .btn.text{color:#fff}.guest-nav .btn.text:hover{color:#a5f2fb;background:transparent;border-color:transparent}
#toast{background:var(--brand-primary);color:#fff;box-shadow:0 8px 25px #3800d726}#toast.error{background:#9b3528}