html{-webkit-tap-highlight-color:transparent}
body{min-height:100dvh}
.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{scrollbar-width:none}
.card{background:#fff;border:1px solid #e6ecf7;border-radius:20px;box-shadow:0 1px 2px rgba(16,24,64,.04),0 8px 24px -12px rgba(29,64,216,.10)}
.chip{display:inline-flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:600;padding:.28rem .6rem;border-radius:999px;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:600;border-radius:14px;padding:.72rem 1.1rem;transition:all .15s;font-size:.9rem}
.btn:active{transform:scale(.97)}
.btn-primary{background:linear-gradient(135deg,#2552eb,#1d40d8);color:#fff;box-shadow:0 10px 22px -10px rgba(29,64,216,.7)}
.btn-primary:hover{filter:brightness(1.08)}
.btn-ghost{background:#eff5ff;color:#1d40d8}
.btn-ghost:hover{background:#dbe8fe}
.btn-line{background:#fff;border:1px solid #dbe3f2;color:#334155}
.btn-line:hover{border-color:#93b8fd;color:#1d40d8}
.inp{width:100%;background:#f7f9fe;border:1px solid #dfe6f3;border-radius:14px;padding:.75rem .9rem;font-size:.92rem;outline:none;transition:.15s}
.inp:focus{border-color:#5f91fa;background:#fff;box-shadow:0 0 0 4px rgba(59,110,246,.12)}
.lbl{display:block;font-size:.75rem;font-weight:600;color:#64748b;margin-bottom:.35rem}
.nav-item{display:flex;align-items:center;gap:.75rem;padding:.7rem .9rem;border-radius:14px;color:#475569;font-weight:600;font-size:.9rem;transition:.15s}
.nav-item:hover{background:#f1f5ff;color:#1d40d8}
.nav-item.active{background:#1d40d8;color:#fff;box-shadow:0 10px 22px -12px rgba(29,64,216,.8)}
.bnav a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:.66rem;font-weight:600;color:#94a3b8;flex:1;padding:.35rem 0}
.bnav a.active{color:#1d40d8}
.bnav a.active .ico{background:#eff5ff}
.bnav .ico{width:44px;height:30px;border-radius:999px;display:grid;place-items:center;transition:.2s}
.fade-in{animation:fade .35s ease both}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.sheet-bg{animation:bg .2s ease both}
@keyframes bg{from{opacity:0}to{opacity:1}}
.sheet{animation:up .28s cubic-bezier(.2,.9,.3,1) both}
@keyframes up{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
.toast{animation:toast .3s ease both}
@keyframes toast{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}
.skel{background:linear-gradient(90deg,#eef2fa 25%,#f7f9fe 50%,#eef2fa 75%);background-size:200% 100%;animation:sk 1.1s infinite}
@keyframes sk{to{background-position:-200% 0}}
.tgl{width:44px;height:26px;border-radius:999px;background:#cbd5e1;position:relative;transition:.2s;flex-shrink:0}
.tgl::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:.2s}
.tgl.on{background:#2552eb}.tgl.on::after{left:21px}
.bar{transition:height .8s cubic-bezier(.2,.9,.3,1)}
.hero-grad{background:radial-gradient(1200px 500px at 10% -10%,#3b6ef6 0,transparent 60%),linear-gradient(135deg,#1e36af,#1d40d8 45%,#2552eb)}
.dot-grid{background-image:radial-gradient(rgba(255,255,255,.18) 1px,transparent 1px);background-size:18px 18px}
.slot-free{border:1.5px dashed #bfd5fe;background:#f8fbff}
.slot-free:hover{border-color:#3b6ef6;background:#eff5ff}
.step-dot{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:.75rem;font-weight:700}
.pb-nav{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
@media(min-width:1024px){.pb-nav{padding-bottom:2.5rem}}
.opt{border:1.5px solid #e2e8f4;border-radius:16px;transition:.15s;cursor:pointer}
.opt:hover{border-color:#93b8fd}
.opt.sel{border-color:#2552eb;background:#eff5ff;box-shadow:0 0 0 3px rgba(59,110,246,.12)}
.grid>*{min-width:0}
