:root{
  --primary:#05a7b3;
  --primary-dark:#047b8b;
  --secondary:#12c2a6;
  --cyan:#e8fbff;
  --ink:#0f172a;
  --muted:#64748b;
  --line:#dbeafe;
  --bg:#f5fbff;
  --card:#ffffff;
  --danger:#ef4444;
  --warning:#f59e0b;
  --success:#16a34a;
  --purple:#7c3aed;
  --shadow:0 24px 70px rgba(15, 118, 134, .14);
  --soft-shadow:0 12px 30px rgba(15, 23, 42, .08);
  --radius:22px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
html,body,#app{height:100%;margin:0;color:var(--ink);background:radial-gradient(circle at top left, #dffbff 0, transparent 36%),linear-gradient(145deg,#f8fdff,#eff8fb)}
button,input,select,textarea{font:inherit}
button{cursor:pointer;border:0}
.login-shell{min-height:100%;display:grid;grid-template-columns:1.1fr .9fr;overflow:hidden;background:linear-gradient(135deg,#e9fbff 0%,#ffffff 47%,#e9fff8 100%)}
.login-hero{position:relative;padding:54px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.login-hero:before{content:"";position:absolute;inset:auto auto -180px -150px;width:520px;height:520px;border-radius:50%;background:linear-gradient(135deg,rgba(5,167,179,.3),rgba(18,194,166,.18));filter:blur(4px)}
.login-hero:after{content:"";position:absolute;top:10%;right:8%;width:180px;height:180px;border-radius:50%;background:rgba(124,58,237,.1);box-shadow:0 0 0 42px rgba(5,167,179,.07)}
.hero-card{position:relative;z-index:1;width:min(620px,100%);border-radius:36px;background:linear-gradient(145deg,#008aa7,#05b7b7 55%,#10b981);padding:38px;color:white;box-shadow:0 30px 90px rgba(4,123,139,.28);overflow:hidden}
.hero-card:before{content:"";position:absolute;inset:-60px -80px auto auto;width:260px;height:260px;background:rgba(255,255,255,.16);border-radius:50%}
.hero-card:after{content:"";position:absolute;inset:auto -100px -130px auto;width:360px;height:360px;background:rgba(255,255,255,.1);border-radius:50%}
.brand-mark{width:68px;height:68px;border-radius:20px;background:rgba(255,255,255,.18);display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);backdrop-filter:blur(8px)}
.brand-mark svg{width:42px;height:42px;fill:white}
.hero-card h1{font-size:48px;line-height:1;margin:24px 0 12px;letter-spacing:-1.5px}.hero-card p{font-size:18px;line-height:1.65;color:rgba(255,255,255,.88);max-width:520px}.hero-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:30px}.hero-pill{border-radius:18px;background:rgba(255,255,255,.14);padding:16px;backdrop-filter:blur(9px);border:1px solid rgba(255,255,255,.16)}.hero-pill b{display:block;font-size:22px}.hero-pill span{font-size:13px;color:rgba(255,255,255,.78)}
.login-panel{display:flex;align-items:center;justify-content:center;padding:42px}.login-card{width:min(460px,100%);background:rgba(255,255,255,.82);backdrop-filter:blur(16px);border:1px solid rgba(5,167,179,.16);border-radius:34px;box-shadow:var(--shadow);padding:34px}.login-card h2{font-size:32px;margin:0 0 8px}.login-card p{color:var(--muted);line-height:1.6}.form-group{display:grid;gap:8px;margin:16px 0}.form-group label{font-weight:800;font-size:13px;color:#0f5362}.field{width:100%;border:1px solid #cbeefa;background:#fbfeff;border-radius:16px;padding:13px 14px;outline:none;transition:.2s}.field:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(5,167,179,.12)}.primary-btn{width:100%;border-radius:17px;background:linear-gradient(135deg,var(--primary),var(--secondary));color:white;font-weight:900;padding:14px 18px;box-shadow:0 12px 24px rgba(5,167,179,.22);transition:.2s}.primary-btn:hover{transform:translateY(-1px);box-shadow:0 18px 32px rgba(5,167,179,.28)}.tiny-note{font-size:12px;color:var(--muted);background:#f1fbff;border-radius:14px;padding:12px;margin-top:14px}
.app-shell{height:100%;display:grid;grid-template-columns:260px 1fr;overflow:hidden}.sidebar{background:linear-gradient(180deg,#008baa 0%,#07a6b7 52%,#0ab38e 100%);color:white;padding:18px 14px;display:flex;flex-direction:column;gap:14px;box-shadow:18px 0 40px rgba(2,132,199,.16);z-index:5}.logo-row{display:flex;align-items:center;gap:12px;padding:10px 10px 18px}.logo-mini{width:46px;height:46px;border-radius:16px;background:rgba(255,255,255,.16);display:grid;place-items:center}.logo-mini svg{width:28px;height:28px;fill:white}.logo-text b{display:block;font-size:16px}.logo-text span{display:block;font-size:11px;color:rgba(255,255,255,.74)}.nav{display:grid;gap:4px;overflow:auto;padding-right:4px}.nav::-webkit-scrollbar{width:6px}.nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.24);border-radius:99px}.nav-section{margin:12px 12px 4px;font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:rgba(255,255,255,.68);font-weight:900}.nav-btn{display:flex;align-items:center;gap:10px;border-radius:14px;color:rgba(255,255,255,.88);padding:11px 12px;background:transparent;text-align:left;font-size:14px;font-weight:750;transition:.18s}.nav-btn:hover,.nav-btn.active{background:rgba(255,255,255,.16);color:white;transform:translateX(2px)}.nav-icon{font-size:17px;width:20px;text-align:center}.sidebar-footer{margin-top:auto;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:14px;font-size:12px;color:rgba(255,255,255,.82)}
.main{overflow:auto;padding:24px 28px 40px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.mobile-menu{display:none;width:44px;height:44px;border-radius:14px;background:white;box-shadow:var(--soft-shadow);font-size:20px}.title-stack h1{font-size:30px;line-height:1.1;margin:0;letter-spacing:-.8px}.title-stack p{margin:7px 0 0;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:10px}.search-box{position:relative}.search-box input{width:320px;border:1px solid #d5eff9;background:white;border-radius:18px;padding:13px 16px 13px 42px;outline:none;box-shadow:0 7px 20px rgba(15,23,42,.04)}.search-box span{position:absolute;left:15px;top:12px}.user-chip{display:flex;align-items:center;gap:10px;background:white;border:1px solid #dbeafe;border-radius:18px;padding:8px 12px;box-shadow:var(--soft-shadow)}.avatar{width:36px;height:36px;border-radius:13px;background:linear-gradient(135deg,var(--primary),var(--purple));display:grid;place-items:center;color:white;font-weight:950}.ghost-btn,.outline-btn,.danger-btn{border-radius:14px;padding:11px 14px;font-weight:850}.ghost-btn{background:white;color:#0f5362;border:1px solid #dbeafe;box-shadow:var(--soft-shadow)}.outline-btn{background:#f8feff;color:#057e8e;border:1px solid #bdebf5}.danger-btn{background:#fff1f2;color:#be123c;border:1px solid #fecdd3}.section-card{background:rgba(255,255,255,.9);border:1px solid rgba(125,211,252,.28);border-radius:var(--radius);box-shadow:var(--soft-shadow);padding:20px;margin-bottom:18px}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.metric{position:relative;overflow:hidden;border-radius:24px;background:white;border:1px solid #dceffd;padding:19px;box-shadow:var(--soft-shadow)}.metric:before{content:"";position:absolute;right:-28px;top:-28px;width:90px;height:90px;border-radius:50%;background:linear-gradient(135deg,rgba(5,167,179,.14),rgba(18,194,166,.08))}.metric .icon{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:#e9fbff;color:var(--primary);font-size:21px}.metric b{display:block;font-size:28px;margin-top:15px;letter-spacing:-.8px}.metric span{display:block;color:var(--muted);font-size:13px;margin-top:4px}.grid-2{display:grid;grid-template-columns:1.4fr .8fr;gap:18px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px;flex-wrap:wrap}.toolbar h2{margin:0;font-size:20px}.toolbar p{margin:5px 0 0;color:var(--muted);font-size:14px}.button-row{display:flex;gap:9px;flex-wrap:wrap}.premium-table{width:100%;border-collapse:separate;border-spacing:0 10px}.premium-table th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#64748b;text-align:left;padding:0 12px}.premium-table td{background:#fff;padding:14px 12px;border-top:1px solid #e2f4fb;border-bottom:1px solid #e2f4fb;vertical-align:middle}.premium-table tr td:first-child{border-left:1px solid #e2f4fb;border-radius:16px 0 0 16px;font-weight:850}.premium-table tr td:last-child{border-right:1px solid #e2f4fb;border-radius:0 16px 16px 0}.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:850}.badge.active,.badge.paid,.badge.confirmed,.badge.completed,.badge.available,.badge.success{background:#dcfce7;color:#166534}.badge.pending,.badge.in_process,.badge.bot,.badge.draft{background:#fef3c7;color:#92400e}.badge.cancelled,.badge.inactive,.badge.suspended,.badge.maintenance,.badge.danger{background:#fee2e2;color:#991b1b}.badge.in_use,.badge.human,.badge.info{background:#dbeafe;color:#1e40af}.badge.urgent,.badge.high{background:#ffe4e6;color:#be123c}.kanban{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.patient-card,.doctor-card,.unit-card{background:white;border:1px solid #dceffd;border-radius:22px;padding:17px;box-shadow:var(--soft-shadow);position:relative;overflow:hidden}.patient-card:before,.doctor-card:before,.unit-card:before{content:"";position:absolute;left:0;top:0;width:100%;height:5px;background:linear-gradient(90deg,var(--primary),var(--secondary))}.entity-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.entity-avatar{width:50px;height:50px;border-radius:18px;background:linear-gradient(135deg,#e0fbff,#dff7ef);display:grid;place-items:center;font-size:24px}.entity-title{font-weight:950}.entity-sub{color:var(--muted);font-size:13px;margin-top:3px}.mini-list{display:grid;gap:10px;margin-top:14px}.mini-item{display:flex;justify-content:space-between;gap:14px;background:#f8fcff;border:1px solid #e4f6fb;border-radius:15px;padding:10px;font-size:13px}.chart-bars{height:230px;display:flex;align-items:end;gap:10px;padding:16px;background:linear-gradient(180deg,#ffffff,#f4fcff);border-radius:20px;border:1px solid #e1f4fb}.bar{flex:1;min-width:20px;border-radius:12px 12px 5px 5px;background:linear-gradient(180deg,var(--primary),var(--secondary));box-shadow:0 10px 18px rgba(5,167,179,.18);position:relative}.bar span{position:absolute;bottom:-25px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--muted)}.odontogram{display:grid;grid-template-columns:repeat(16,1fr);gap:8px}.tooth{aspect-ratio:1;border-radius:14px;background:#ffffff;border:1px solid #bdebf5;display:grid;place-items:center;color:#047b8b;font-weight:900;box-shadow:0 8px 16px rgba(15,23,42,.05);transition:.15s}.tooth:hover,.tooth.active{transform:translateY(-2px);background:linear-gradient(135deg,#e6fcff,#dcfce7);border-color:var(--primary)}.landing-preview{min-height:360px;border-radius:30px;background:linear-gradient(135deg,rgba(8,145,178,.85),rgba(20,184,166,.75)),url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 700"><rect width="1200" height="700" fill="%23e0f2fe"/><circle cx="900" cy="150" r="260" fill="%23a7f3d0" opacity=".6"/><circle cx="230" cy="520" r="280" fill="%23bae6fd" opacity=".7"/></svg>');background-size:cover;color:white;padding:42px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;position:relative}.landing-preview h2{font-size:48px;line-height:1.05;margin:0 0 14px;max-width:640px}.landing-preview p{max-width:560px;font-size:18px;line-height:1.6;color:rgba(255,255,255,.88)}.modal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.42);backdrop-filter:blur(8px);display:grid;place-items:center;z-index:20;padding:20px}.modal{width:min(720px,100%);max-height:90vh;overflow:auto;background:white;border-radius:28px;box-shadow:0 40px 100px rgba(15,23,42,.25);padding:22px}.modal-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px}.modal-head h2{margin:0}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.form-grid .span-2{grid-column:1/-1}.toast{position:fixed;right:22px;bottom:22px;z-index:30;background:#0f172a;color:white;padding:14px 16px;border-radius:18px;box-shadow:0 20px 50px rgba(15,23,42,.28);font-weight:750}.toast.success{background:#047857}.toast.error{background:#b91c1c}.empty-state{text-align:center;padding:40px 16px;color:var(--muted)}.empty-state .big{font-size:54px;display:block;margin-bottom:10px}.loading{display:grid;place-items:center;padding:70px;color:var(--muted)}.spinner{width:42px;height:42px;border-radius:50%;border:4px solid #ccfbf1;border-top-color:var(--primary);animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.mobile-overlay{display:none}
@media(max-width:1180px){.metrics{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}.kanban,.grid-3{grid-template-columns:repeat(2,1fr)}.search-box input{width:240px}.login-shell{grid-template-columns:1fr}.login-hero{display:none}}
@media(max-width:860px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;inset:0 auto 0 0;width:285px;transform:translateX(-105%);transition:.25s}.sidebar.open{transform:translateX(0)}.mobile-overlay.show{display:block;position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:4}.main{padding:18px}.mobile-menu{display:block}.topbar{align-items:flex-start}.top-actions{flex-wrap:wrap;justify-content:flex-end}.search-box input{width:100%}.search-box{width:100%;order:3}.metrics,.kanban,.grid-3{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.form-grid .span-2{grid-column:auto}.odontogram{grid-template-columns:repeat(8,1fr)}.landing-preview h2{font-size:34px}.premium-table{font-size:13px}.premium-table th:nth-child(n+4),.premium-table td:nth-child(n+4){display:none}.user-chip span{display:none}}
@media(max-width:540px){.login-panel{padding:18px}.login-card{padding:24px;border-radius:26px}.topbar{display:grid}.button-row button{width:100%}.toolbar{display:grid}.odontogram{grid-template-columns:repeat(4,1fr)}}