/* Screen kinds */
.mk-bars{display:grid;gap:9px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:12px}
.mk-bars .bar{display:grid;grid-template-columns:42px 1fr 40px;gap:8px;align-items:center}
.mk-bars .bar span{color:#64748b}.mk-bars .bar em{font-style:normal;font-weight:700;text-align:right}
.mk-bars .bar i{display:block;height:12px;border-radius:99px;background:#eef2f7;position:relative;overflow:hidden}
.mk-bars .bar i:before{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:var(--c);border-radius:99px}
.mk-form{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:6px 12px}
.mk-form .ln{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px dashed #e2e8f0}
.mk-form .ln span{color:#64748b}.mk-form .ln.tot{border:0;font-size:1.15em;color:var(--a)}
.mk-btn{background:var(--a);color:#fff;text-align:center;font-weight:700;border-radius:12px;padding:11px}
.mk-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mk-slots .sl{border-radius:12px;padding:10px 6px;text-align:center;border:1px solid #e2e8f0;background:#fff}
.mk-slots .sl b{display:block}.mk-slots .sl span{font-size:.8em;color:#64748b}
.mk-slots .free{background:color-mix(in srgb,var(--a) 14%,#fff);border-color:var(--a)}.mk-slots .free b,.mk-slots .free span{color:var(--a)}
.mk-slots .booked{background:#fee2e2;border-color:#fecaca}.mk-slots .booked b,.mk-slots .booked span{color:#dc2626}
.mk-slots .past{opacity:.45}
.mk-qr{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:14px;text-align:center}
.mk-qr .qr{display:grid;grid-template-columns:repeat(13,1fr);width:150px;margin:0 auto;gap:1px}
.mk-qr .qr i{aspect-ratio:1;background:#eef2f7;border-radius:1px}.mk-qr .qr i.on{background:#0f172a}
.mk-qr p{margin:10px 0 0;color:#64748b}
.mk-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:10px;text-align:center}
.mk-cal b{color:#64748b;font-size:.8em}.mk-cal i{font-style:normal;padding:6px 0;border-radius:8px}
.mk-cal i.on{background:var(--a);color:#fff;font-weight:700}
.mk-kan{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mk-kan .col{background:#eef2f7;border-radius:12px;padding:8px;display:grid;gap:6px;align-content:start;min-height:120px}
.mk-kan h6{margin:0;font-size:.85em;color:var(--c)}.mk-kan h6:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--c);margin-right:5px}
.mk-kan .kc{background:#fff;border-radius:8px;padding:8px;box-shadow:0 1px 2px rgba(0,0,0,.08);border-left:3px solid var(--a)}
.mk-chat{display:grid;gap:8px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:12px}
.msg-b{max-width:80%;padding:8px 12px;border-radius:16px}.msg-b.them{background:#e9e9ee;justify-self:start;border-bottom-left-radius:5px}
.msg-b.me{background:var(--a);color:#fff;justify-self:end;border-bottom-right-radius:5px}
/* Feature tour */
.tabs{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 14px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;border:0;cursor:pointer;font:inherit;font-weight:600;padding:10px 18px;border-radius:99px;background:var(--fill);color:var(--text);transition:all .2s}
.tab:hover{background:color-mix(in srgb,var(--c) 18%,transparent)}.tab.on{background:var(--c);color:#fff;box-shadow:0 6px 18px color-mix(in srgb,var(--c) 45%,transparent)}
.tour{display:grid;grid-template-columns:1.2fr 1fr;gap:36px;align-items:center;padding:28px;border-radius:28px;background:linear-gradient(135deg,color-mix(in srgb,var(--tc,#0a84ff) 16%,var(--card)),var(--card) 70%);box-shadow:var(--shadow);min-height:420px;animation:tourin .45s ease}
@keyframes tourin{from{opacity:.4;transform:translateY(8px)}}
@media(max-width:860px){.tour{grid-template-columns:1fr;padding:18px}}
.tour>*{min-width:0}.tour-screen .mk{box-shadow:0 22px 50px color-mix(in srgb,var(--tc,#0a84ff) 35%,rgba(0,0,0,.2))}
.tour-text h3{font-size:1.7rem;margin:12px 0 10px}.tour-text ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.tour-text li{padding-left:30px;position:relative;font-weight:600}
.tour-text li:before{content:"✓";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;background:var(--tc,#0a84ff);color:#fff;display:grid;place-items:center;font-size:.75rem;font-weight:800}
.tag{display:inline-block;color:#fff;font-weight:700;font-size:.8rem;padding:4px 12px;border-radius:99px}