:root{
  --bg:#f4f8fc;
  --card:#ffffff;
  --text:#172b4d;
  --muted:#6b7a90;
  --primary:#1f78ff;
  --primary-dark:#0b4dbb;
  --line:#e7eef7;
  --soft-blue:#eef6ff;
  --soft-green:#eaf9f1;
  --shadow:0 12px 36px rgba(22,64,123,.08);
}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:"Segoe UI","Noto Sans TC",Arial,sans-serif}
a{text-decoration:none}
.card{border:1px solid rgba(231,238,247,.9);box-shadow:var(--shadow);border-radius:1.3rem;background:var(--card)}
.muted{color:var(--muted)!important}
.table{vertical-align:middle}
.form-label{font-weight:600}
.app-alert{max-width:1280px;margin:0 auto 1rem auto}

/* public landing */
.public-main{padding:0}.public-body{background:linear-gradient(135deg,#f7fbff 0%,#eef4fb 100%)}
.landing-page{overflow-x:hidden}
.landing-hero{position:relative;min-height:100vh;overflow:hidden;background:linear-gradient(120deg,#f7fbff 0%,#eef4fb 40%,#f9fcff 100%)}
.landing-hero .container-fluid{position:relative;z-index:2}
.hero-badge{display:inline-block;background:#deedff;color:var(--primary-dark);padding:.7rem 1.2rem;border-radius:999px;font-weight:700;margin-bottom:1.5rem;font-size:1.05rem}
.hero-title{font-size:clamp(2.8rem,6vw,5.2rem);line-height:1.08;font-weight:900;letter-spacing:-.03em;margin-bottom:1.5rem;color:#0c2b66}
.hero-title span{color:var(--primary)}
.hero-lead{max-width:860px;font-size:clamp(1.15rem,2vw,1.4rem);line-height:1.8;color:#42526e;margin-bottom:2rem}
.hero-btn,.hero-btn-outline{min-width:180px;padding:.95rem 1.6rem;border-radius:1rem;font-weight:700}
.hero-btn{box-shadow:0 12px 24px rgba(31,120,255,.22)}
.hero-check{display:flex;align-items:center;gap:.7rem;color:#243b64;font-weight:700;font-size:1.05rem}
.hero-check span{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:#2ecb70;color:#fff;font-weight:900}
.landing-shape{position:absolute;border-radius:50%;filter:blur(.1px);opacity:.6}
.landing-shape-a{width:900px;height:900px;right:-240px;bottom:-220px;background:radial-gradient(circle at 30% 30%, rgba(71,171,255,.35), rgba(71,171,255,.03) 65%, transparent 66%)}
.landing-shape-b{width:760px;height:760px;left:-260px;bottom:-280px;background:radial-gradient(circle at 50% 50%, rgba(46,203,112,.16), rgba(46,203,112,0) 68%)}
.landing-shape-c{width:1500px;height:620px;right:-200px;bottom:-180px;border-radius:45% 55% 0 0;background:linear-gradient(135deg, rgba(59,170,255,.12), rgba(50,140,255,.25) 45%, rgba(46,203,112,.16) 100%);transform:rotate(-10deg)}
.landing-cross{position:absolute;right:8%;top:42%;font-size:9rem;line-height:1;color:rgba(255,255,255,.65);width:190px;height:190px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,255,255,.55);z-index:1}
.landing-hero:before,.landing-hero:after{content:"";position:absolute;border-radius:999px;z-index:1}
.landing-hero:before{right:-5%;bottom:22%;width:76%;height:2px;background:linear-gradient(90deg, rgba(255,255,255,.1), rgba(255,255,255,.95), rgba(87,176,255,.6)) ;transform:rotate(8deg)}
.landing-hero:after{right:18%;top:30%;width:26px;height:26px;background:rgba(113,213,244,.6);box-shadow:-130px 320px 0 0 rgba(113,213,244,.25)}

/* topbar after login */
.app-body{background:linear-gradient(180deg,#f5f8fd 0%,#eff4fa 100%)}
.app-topbar{background:rgba(255,255,255,.86);backdrop-filter:blur(12px);border-bottom:1px solid rgba(226,236,248,.9)}
.brand-mark{display:flex;align-items:center;gap:.6rem;font-weight:800;color:#17305f;font-size:1.6rem}
.brand-icon{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;background:linear-gradient(135deg,#2ecb70,#37a6ff);border-radius:.8rem;font-size:1.15rem;box-shadow:0 6px 16px rgba(55,166,255,.18)}
.app-nav-links .nav-link,.app-nav-actions .nav-link{color:#35507b;font-weight:700;padding:.75rem .85rem;border-radius:.9rem}
.app-nav-links .nav-link:hover,.app-nav-actions .nav-link:hover{background:#edf5ff;color:#0f4cc1}
.small-link{font-size:.94rem}
.notify-badge{position:absolute;top:.25rem;right:0;font-size:.68rem}
.app-main{max-width:1440px;margin:0 auto}

/* dashboard */
.dashboard-hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#ffffff 0%,#f6fbff 55%,#eef7ff 100%)}
.dashboard-hero:after{content:"";position:absolute;right:-100px;bottom:-120px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle, rgba(62,145,255,.20), rgba(62,145,255,0) 68%)}
.dashboard-badge{display:inline-block;background:#e9f4ff;color:#0f64d8;border-radius:999px;padding:.45rem .85rem;font-weight:800;font-size:.9rem;margin-bottom:.9rem}
.mini-summary{background:linear-gradient(180deg,#fff,#f8fbff)}
.metric-tile{display:flex;align-items:center;gap:1rem}
.metric-icon{width:52px;height:52px;display:flex;align-items:center;justify-content:center;border-radius:1rem;background:#edf5ff;font-size:1.5rem;flex:0 0 52px}
.metric-value{font-size:1.6rem;font-weight:800;color:#14366b}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.section-head a{font-size:.95rem;font-weight:700;color:#2675f5}
.list-row{padding:.9rem 0;border-bottom:1px solid var(--line)}
.list-row:last-child{border-bottom:0;padding-bottom:0}
.empty-state{padding:2rem 0;color:var(--muted)}
.quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.quick-item{display:block;padding:1.2rem;border:1px solid var(--line);border-radius:1.1rem;background:linear-gradient(180deg,#fff,#fbfdff);color:var(--text);transition:.2s ease}
.quick-item:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(31,120,255,.10);border-color:#d8e7fb}
.quick-item b{display:block;margin:.25rem 0 .2rem 0}
.quick-item small{display:block;color:var(--muted);line-height:1.6}
.quick-emoji{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:14px;background:#edf5ff;font-size:1.35rem;margin-bottom:.65rem}

/* forms and misc existing */
.metric-card .value{font-size:2rem;font-weight:700}
.drug-form-card{max-width:1100px}
.drug-thumb{width:100%;aspect-ratio:1/1;object-fit:cover;background:#fff}
.drug-placeholder{width:100%;aspect-ratio:1/1;background:#f8fafc;font-size:3rem}
.drug-edit-preview{width:150px;height:150px;object-fit:cover;background:#fff}
.drug-notes{white-space:pre-wrap;word-break:break-word}

@media(max-width:1199px){
  .app-nav-actions{padding-top:.75rem}
}
@media(max-width:992px){
  .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:768px){
  .card{border-radius:1rem}
  .table-responsive{font-size:.88rem}
  .hero-title{font-size:3rem}
  .hero-lead{font-size:1.05rem}
  .landing-cross{display:none}
  .metric-value{font-size:1.35rem}
}
@media(max-width:576px){
  .app-main{padding-top:1rem!important}
  .drug-form-card{padding:1rem!important}
  .drug-placeholder{font-size:2.2rem}
  .hero-btn,.hero-btn-outline{width:100%;justify-content:center}
  .quick-grid{grid-template-columns:1fr}
}


/* =============================
   Unified UI Design System
============================= */
:root{
  --ui-bg:#f5f8fd;
  --ui-card:#ffffff;
  --ui-soft:#eef5ff;
  --ui-soft-2:#f8fbff;
  --ui-line:#e5edf7;
  --ui-text:#152b4c;
  --ui-muted:#6c7f99;
  --ui-primary:#1f78ff;
  --ui-primary-dark:#0d4db8;
  --ui-success:#25b76a;
  --ui-warning:#ffb547;
  --ui-danger:#ef5b5b;
  --ui-radius:1.25rem;
  --ui-shadow:0 12px 32px rgba(19, 65, 123, .08);
}
h1,h2,h3,h4,h5{color:var(--ui-text)}
.btn{border-radius:.95rem;font-weight:700}
.btn-primary{box-shadow:0 8px 18px rgba(31,120,255,.18)}
.form-control,.form-select{
  border-radius:.9rem;
  border:1px solid var(--ui-line);
  min-height:48px;
  box-shadow:none!important;
}
textarea.form-control{min-height:120px}
.form-control:focus,.form-select:focus{
  border-color:#9bc3ff;
  box-shadow:0 0 0 .22rem rgba(31,120,255,.12)!important;
}
.table>:not(caption)>*>*{padding:.95rem .8rem;border-bottom-color:var(--ui-line)}
.table thead th{
  color:#35507b;
  font-size:.92rem;
  font-weight:800;
  background:#f7fbff;
}
.card{border:1px solid rgba(229,237,247,.95)}
pre.text-wrap{
  white-space:pre-wrap;
  word-break:break-word;
  background:#f8fbff;
  border:1px solid var(--ui-line);
  border-radius:1rem;
  padding:1rem;
}
.page-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:1rem;
  flex-wrap:wrap;
  margin-bottom:1.25rem;
}
.page-title{
  font-size:2rem;
  line-height:1.2;
  font-weight:900;
  margin:0;
}
.page-subtitle{
  color:var(--ui-muted);
  font-size:1rem;
  margin:.35rem 0 0 0;
}
.app-panel{
  background:var(--ui-card);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  box-shadow:var(--ui-shadow);
}
.panel-soft{
  background:linear-gradient(180deg,#ffffff,#f9fcff);
}
.panel-body{padding:1.5rem}
.panel-title{
  font-weight:800;
  font-size:1.15rem;
  margin-bottom:1rem;
}
.panel-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  margin-bottom:1rem;
}
.simple-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}
.data-card{
  padding:1.15rem 1.2rem;
  border:1px solid var(--ui-line);
  background:linear-gradient(180deg,#ffffff,#fbfdff);
  border-radius:1rem;
}
.data-card .label{font-size:.92rem;color:var(--ui-muted)}
.data-card .value{font-size:1.5rem;font-weight:900;color:#173a76}
.auth-wrap{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:2rem 1rem;
}
.auth-card{
  width:100%;
  max-width:980px;
  overflow:hidden;
  border-radius:1.5rem;
  box-shadow:0 20px 50px rgba(18,66,125,.10);
}
.auth-left{
  background:linear-gradient(150deg,#f7fbff 0%,#edf5ff 50%,#f4fbff 100%);
  position:relative;
  overflow:hidden;
}
.auth-left::before{
  content:"";
  position:absolute;
  right:-60px;
  bottom:-80px;
  width:320px;
  height:320px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(31,120,255,.16), rgba(31,120,255,0) 70%);
}
.auth-left::after{
  content:"";
  position:absolute;
  left:-90px;
  bottom:-120px;
  width:340px;
  height:340px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(37,183,106,.12), rgba(37,183,106,0) 70%);
}
.auth-brand{
  display:flex;
  align-items:center;
  gap:.8rem;
  font-size:1.65rem;
  font-weight:900;
  color:#10325f;
  margin-bottom:1.25rem;
}
.auth-brand .brand-icon{font-size:1.3rem}
.auth-left-inner{position:relative;z-index:1;padding:2.2rem}
.auth-title{
  font-size:2.4rem;
  font-weight:900;
  line-height:1.18;
  color:#0c2b66;
  margin-bottom:1rem;
}
.auth-title span{color:var(--ui-primary)}
.auth-text{
  color:#47607f;
  line-height:1.8;
  font-size:1.02rem;
}
.auth-bullets{display:grid;gap:.85rem;margin-top:1.4rem}
.auth-bullets div{display:flex;align-items:center;gap:.65rem;font-weight:700;color:#243b64}
.auth-bullets span{
  width:28px;height:28px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:#2ecb70;color:#fff;font-weight:900
}
.auth-form{padding:2.2rem}
.auth-form .panel-title{font-size:1.6rem;margin-bottom:.5rem}
.auth-note{color:var(--ui-muted);margin-bottom:1.5rem}
.info-banner{
  background:linear-gradient(180deg,#fff8e8,#fffdf6);
  border:1px solid #ffe6b0;
  border-radius:1rem;
  padding:1rem 1.1rem;
  color:#7a5b1c;
}
.module-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}
.module-card{
  background:linear-gradient(180deg,#fff,#fbfdff);
  border:1px solid var(--ui-line);
  border-radius:1rem;
  padding:1.15rem;
  display:block;
  color:var(--ui-text);
}
.module-card:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(31,120,255,.08)}
.module-card .icon{
  width:46px;height:46px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:#edf5ff;font-size:1.35rem;margin-bottom:.6rem
}
.list-stack > * + *{margin-top:1rem}
.record-card{
  border:1px solid var(--ui-line);
  border-radius:1rem;
  padding:1rem 1.1rem;
  background:#fff;
}
.badge-soft{
  display:inline-block;
  padding:.4rem .75rem;
  background:#eaf4ff;
  color:#1664d4;
  border-radius:999px;
  font-weight:800;
  font-size:.83rem;
}
.table-card{overflow:hidden}
.section-spacer{margin-bottom:1.25rem}
@media (max-width:992px){
  .simple-grid,.module-grid{grid-template-columns:1fr}
}
@media (max-width:768px){
  .page-title{font-size:1.65rem}
  .auth-title{font-size:2rem}
}


/* =========================================
   Pro Sidebar + Dark Mode + SaaS Home
========================================= */

body.dark-mode{
  --bg:#0f1724;
  --card:#172233;
  --text:#ecf3ff;
  --muted:#a8b7cb;
  --line:#243247;
  --soft-blue:#19293e;
  --soft-green:#173026;
  --ui-bg:#0f1724;
  --ui-card:#172233;
  --ui-soft:#19293e;
  --ui-soft-2:#101c2b;
  --ui-line:#243247;
  --ui-text:#ecf3ff;
  --ui-muted:#a8b7cb;
  --shadow:0 12px 36px rgba(0,0,0,.25);
}
body.dark-mode .card,
body.dark-mode .app-panel,
body.dark-mode .data-card,
body.dark-mode .record-card,
body.dark-mode .module-card,
body.dark-mode .sidebar-tip,
body.dark-mode .app-header,
body.dark-mode .app-sidebar{
  box-shadow:0 10px 28px rgba(0,0,0,.25);
}
body.dark-mode .table thead th{background:#112033;color:#d6e6ff}
body.dark-mode .form-control,
body.dark-mode .form-select{background:#122034;color:#eef5ff;border-color:#2a3a52}
body.dark-mode .form-control::placeholder{color:#93a7c1}
body.dark-mode .btn-outline-secondary{color:#d9e5f5;border-color:#41526b}
body.dark-mode .btn-outline-secondary:hover{background:#233247;color:#fff}
body.dark-mode .badge-soft{background:#12325f;color:#a9ceff}
body.dark-mode pre.text-wrap{background:#101b2a;border-color:#243247;color:#ecf3ff}
body.dark-mode .info-banner{background:#3c2f14;border-color:#705720;color:#ffe7ab}
body.dark-mode .landing-hero,
body.dark-mode .landing-section{background:transparent}
body.dark-mode .landing-card{background:#172233}
body.dark-mode .landing-stat{background:#182637}
body.dark-mode .hero-title,
body.dark-mode .auth-title{color:#f4f8ff}
body.dark-mode .public-topbar .top-link{color:#eaf2ff}

.app-shell{
  display:flex;
  min-height:100vh;
  background:var(--ui-bg);
}
.app-sidebar{
  width:290px;
  flex:0 0 290px;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  border-right:1px solid var(--ui-line);
  padding:1.35rem 1rem 1.2rem 1rem;
  position:sticky;
  top:0;
  height:100vh;
  overflow:auto;
}
.sidebar-brand{
  margin-bottom:1.25rem;
}
.sidebar-brand-link{
  display:flex;
  gap:.9rem;
  align-items:center;
  color:var(--ui-text);
}
.sidebar-brand-link .brand-icon{
  width:48px;height:48px;border-radius:1rem;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#2ecb70,#36a5ff);
  box-shadow:0 10px 22px rgba(49,149,255,.18);
  font-size:1.35rem;
}
.sidebar-brand-link b{
  display:block;
  font-size:1.35rem;
  line-height:1.1;
}
.sidebar-brand-link small{
  display:block;
  color:var(--ui-muted);
  margin-top:.2rem;
}
.sidebar-section-label{
  color:var(--ui-muted);
  font-size:.8rem;
  letter-spacing:.08em;
  font-weight:800;
  margin:.95rem .45rem .6rem;
  text-transform:uppercase;
}
.sidebar-nav{
  display:grid;
  gap:.35rem;
}
.sidebar-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  color:#27456e;
  padding:.8rem .9rem;
  border-radius:1rem;
  font-weight:700;
  transition:.18s ease;
}
.sidebar-link:hover{
  background:#edf5ff;
  color:#0e57c8;
}
.sidebar-link.active{
  background:linear-gradient(180deg,#eaf4ff,#f4f9ff);
  color:#0b57cb;
  box-shadow:inset 0 0 0 1px #d6e8ff;
}
.sidebar-link .bubble{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:22px;height:22px;padding:0 .35rem;
  border-radius:999px;background:#ef5b5b;color:#fff;font-size:.72rem
}
.sidebar-tip{
  margin-top:1rem;
  padding:1rem;
  border:1px solid var(--ui-line);
  border-radius:1.1rem;
  background:linear-gradient(180deg,#ffffff,#fbfdff);
}
.tip-badge{
  display:inline-block;
  background:#eaf4ff;
  color:#1466d7;
  border-radius:999px;
  padding:.35rem .7rem;
  font-size:.8rem;
  font-weight:800;
  margin-bottom:.6rem;
}
.tip-title{
  font-weight:800;
  margin-bottom:.35rem;
}
.tip-text{
  color:var(--ui-muted);
  font-size:.92rem;
  line-height:1.65;
}

.app-stage{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
}
.app-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  padding:1rem 1.25rem;
  border-bottom:1px solid var(--ui-line);
  background:rgba(255,255,255,.76);
  backdrop-filter:blur(14px);
  position:sticky;
  top:0;
  z-index:5;
}
.app-header-title{
  font-size:1.1rem;
  font-weight:900;
  color:var(--ui-text);
}
.app-header-sub{
  color:var(--ui-muted);
  font-size:.92rem;
  margin-top:.1rem;
}
.app-header-right{
  display:flex;
  align-items:center;
  gap:.6rem;
  flex-wrap:wrap;
}
.app-content{
  padding:1.35rem;
  max-width:1600px;
}
.public-alert{max-width:1280px;margin-top:1rem}

.public-topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  padding:1.25rem 0 0 0;
}
.public-brand{
  display:flex;
  align-items:center;
  gap:.8rem;
  font-weight:900;
  font-size:1.4rem;
  color:#0d2f62;
}
.public-brand .brand-icon{
  width:44px;height:44px;border-radius:1rem;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#2ecb70,#36a5ff);
  color:#fff;
  box-shadow:0 10px 20px rgba(54,165,255,.18);
}
.public-topbar .top-actions{
  display:flex;gap:.75rem;flex-wrap:wrap
}
.public-topbar .top-link{
  color:#29486f;font-weight:700
}

.landing-page-shell{
  min-height:100vh;
  background:
    radial-gradient(circle at 0% 100%, rgba(88,198,153,.10), transparent 32%),
    radial-gradient(circle at 100% 100%, rgba(70,168,255,.14), transparent 38%),
    linear-gradient(135deg,#f7fbff 0%,#eef4fb 100%);
}
.landing-hero{
  padding:0 0 2.5rem 0;
}
.landing-hero-inner{
  position:relative;
  padding:3rem 0 2rem;
}
.landing-section{
  padding:1.5rem 0 1rem;
}
.landing-card{
  background:#fff;
  border:1px solid var(--ui-line);
  border-radius:1.35rem;
  box-shadow:var(--ui-shadow);
}
.hero-title-xl{
  font-size:clamp(3rem,6.2vw,5.3rem);
  line-height:1.06;
  font-weight:900;
  color:#0d2b64;
  letter-spacing:-.03em;
  margin-bottom:1.35rem;
}
.hero-title-xl span{color:var(--ui-primary)}
.hero-body{
  font-size:1.2rem;
  color:#42526e;
  line-height:1.85;
  max-width:860px;
}
.hero-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-top:2rem;
}
.landing-stat{
  background:#fff;
  border:1px solid var(--ui-line);
  border-radius:1.15rem;
  padding:1rem 1.1rem;
}
.landing-stat .label{
  color:var(--ui-muted);
  font-size:.92rem;
}
.landing-stat .value{
  font-size:1.45rem;
  font-weight:900;
  color:#14356e;
}
.feature-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
}
.feature-card{
  padding:1.2rem;
  border:1px solid var(--ui-line);
  border-radius:1.1rem;
  background:linear-gradient(180deg,#fff,#fbfdff);
}
.feature-icon{
  width:50px;height:50px;border-radius:15px;
  display:flex;align-items:center;justify-content:center;
  background:#edf5ff;
  font-size:1.45rem;
  margin-bottom:.8rem;
}
.feature-card b{
  display:block;
  font-size:1.1rem;
  margin-bottom:.35rem;
}
.feature-card small{
  color:var(--ui-muted);
  display:block;
  line-height:1.7;
}
.value-band{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}
.value-box{
  padding:1.15rem;
  border-radius:1rem;
  border:1px solid var(--ui-line);
  background:linear-gradient(180deg,#fff,#fbfdff);
}
.value-box b{
  display:block;
  margin-bottom:.35rem;
}
.value-box small{
  color:var(--ui-muted);
  line-height:1.7;
}
.cta-banner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
  padding:1.4rem 1.6rem;
  border-radius:1.25rem;
  background:linear-gradient(135deg,#0d56c3,#2b84ff);
  color:#fff;
}
.cta-banner p{margin:0;color:rgba(255,255,255,.85)}
.cta-banner h3{color:#fff;margin:0}
.theme-toggle{min-width:118px}

@media(max-width:1200px){
  .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .value-band{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:992px){
  .app-shell{display:block}
  .app-sidebar{
    width:100%;
    height:auto;
    position:relative;
    border-right:0;
    border-bottom:1px solid var(--ui-line);
  }
  .app-header{position:relative}
  .hero-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:768px){
  .public-topbar{flex-direction:column;align-items:flex-start}
  .feature-grid,
  .value-band,
  .hero-stats{grid-template-columns:1fr}
  .app-content{padding:1rem}
  .app-header{padding:1rem}
  .sidebar-brand-link b{font-size:1.2rem}
}


/* Home hero-only refinement */
.landing-hero{
  min-height: 100vh;
}
.landing-hero-inner{
  max-width: 980px;
  padding-top: 3.5rem;
  padding-bottom: 4rem;
}
.hero-body{
  max-width: 1100px;
}


/* =========================================
   Polished Hero-only Homepage
========================================= */
.polished-home .public-main{
  padding:0;
}

.polished-hero-shell{
  min-height:100vh;
  overflow:hidden;
  background:
    linear-gradient(115deg,#f8fbff 0%,#f2f7fc 48%,#eef6fd 100%);
}

.polished-hero{
  position:relative;
  min-height:100vh;
  overflow:hidden;
}

.polished-topbar{
  position:relative;
  z-index:5;
  padding-top:1.15rem;
}

.polished-brand{
  font-size:1.52rem;
  letter-spacing:-.01em;
}

.polished-brand .brand-icon{
  width:46px;
  height:46px;
  border-radius:14px;
  font-size:1.15rem;
}

.polished-top-btn{
  min-width:108px;
  border-radius:.9rem;
  padding:.7rem 1.25rem;
  font-weight:800;
}

.polished-hero-inner{
  position:relative;
  z-index:4;
  display:flex;
  align-items:center;
  min-height:calc(100vh - 90px);
  padding:2rem 0 5rem;
}

.hero-copy{
  max-width:900px;
  padding-left:.2rem;
}

.polished-badge{
  display:inline-flex;
  align-items:center;
  background:rgba(222,237,255,.92);
  color:#1463ce;
  padding:.65rem 1.15rem;
  border-radius:999px;
  font-size:1rem;
  font-weight:800;
  letter-spacing:.01em;
  margin-bottom:1.65rem;
  box-shadow:0 6px 18px rgba(31,120,255,.06);
}

.polished-title{
  margin:0 0 1.65rem 0;
  color:#0c2b66;
  font-size:clamp(3.4rem,6.4vw,6.3rem);
  line-height:1.04;
  letter-spacing:-.045em;
  font-weight:950;
}

.polished-title span{
  color:#1f78ff;
}

.polished-lead{
  max-width:850px;
  margin:0 0 2.1rem 0;
  color:#425674;
  font-size:clamp(1.1rem,1.5vw,1.28rem);
  line-height:1.9;
  letter-spacing:.005em;
}

.polished-actions{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  margin-bottom:2.4rem;
}

.polished-primary-btn,
.polished-secondary-btn{
  min-width:180px;
  padding:1rem 1.65rem;
  border-radius:1rem;
  font-size:1.06rem;
  font-weight:800;
}

.polished-primary-btn{
  box-shadow:0 14px 28px rgba(31,120,255,.20);
}

.polished-primary-btn span{
  margin-left:.45rem;
}

.polished-secondary-btn{
  background:rgba(255,255,255,.65);
}

.polished-trust{
  display:flex;
  flex-wrap:wrap;
  gap:1.4rem 2rem;
  color:#2e4465;
  font-weight:700;
}

.polished-trust > div{
  display:flex;
  align-items:center;
  gap:.65rem;
}

.polished-trust span{
  width:30px;
  height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#2ecb70;
  color:#fff;
  font-weight:900;
  box-shadow:0 6px 14px rgba(46,203,112,.18);
}

/* Softer right-side decoration */
.hero-decor{
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}

.hero-decor-1{
  width:760px;
  height:760px;
  right:-260px;
  bottom:-280px;
  background:radial-gradient(circle at 38% 38%,rgba(87,176,255,.18),rgba(87,176,255,.035) 58%,transparent 72%);
}

.hero-decor-2{
  width:580px;
  height:580px;
  right:90px;
  bottom:-260px;
  background:radial-gradient(circle at 50% 50%,rgba(70,207,160,.12),rgba(70,207,160,0) 70%);
}

.hero-decor-3{
  width:360px;
  height:360px;
  right:10%;
  top:18%;
  background:radial-gradient(circle,rgba(98,187,255,.10),rgba(98,187,255,0) 70%);
}

.hero-decor-line{
  position:absolute;
  right:-8%;
  bottom:22%;
  width:64%;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.92),rgba(86,174,255,.28));
  transform:rotate(8deg);
}

.hero-med-cross{
  position:absolute;
  right:7.5%;
  top:43%;
  width:130px;
  height:130px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(255,255,255,.62);
  font-size:6.3rem;
  font-weight:200;
  border:1px solid rgba(255,255,255,.42);
  background:rgba(255,255,255,.03);
}

.polished-hero::after{
  content:"";
  position:absolute;
  right:17%;
  top:31%;
  width:18px;
  height:18px;
  border-radius:50%;
  background:rgba(96,205,236,.43);
  box-shadow:-115px 330px 0 rgba(96,205,236,.18);
}

body.dark-mode .polished-hero-shell{
  background:linear-gradient(115deg,#101826 0%,#111c2b 48%,#0f1b29 100%);
}
body.dark-mode .polished-badge{
  background:#17365d;
  color:#a9ceff;
}
body.dark-mode .polished-title{
  color:#f2f7ff;
}
body.dark-mode .polished-lead{
  color:#b7c6d9;
}
body.dark-mode .polished-trust{
  color:#d6e2f2;
}
body.dark-mode .polished-secondary-btn{
  background:rgba(22,34,51,.65);
}

@media(max-width:992px){
  .polished-hero-inner{
    min-height:auto;
    padding-top:4rem;
    padding-bottom:5rem;
  }
  .hero-copy{
    max-width:780px;
  }
  .hero-med-cross{
    right:2%;
    opacity:.45;
  }
}

@media(max-width:768px){
  .polished-topbar{
    align-items:center;
    flex-direction:row;
  }
  .polished-brand{
    font-size:1.22rem;
  }
  .polished-brand .brand-icon{
    width:40px;
    height:40px;
  }
  .polished-top-btn{
    min-width:auto;
    padding:.55rem .85rem;
  }
  .polished-title{
    font-size:clamp(2.8rem,13vw,4rem);
  }
  .polished-lead{
    font-size:1rem;
    line-height:1.75;
  }
  .polished-actions{
    gap:.75rem;
  }
  .polished-primary-btn,
  .polished-secondary-btn{
    flex:1 1 100%;
    text-align:center;
  }
  .polished-trust{
    display:grid;
    grid-template-columns:1fr;
    gap:.9rem;
  }
  .hero-med-cross,
  .hero-decor-3,
  .hero-decor-line{
    display:none;
  }
}


/* Follow-up appointment dashboard */
.followup-dashboard-card{
  background:linear-gradient(135deg,#ffffff 0%,#f8fbff 60%,#eef7ff 100%);
}
body.dark-mode .followup-dashboard-card{
  background:linear-gradient(135deg,#172233 0%,#152235 100%);
}
