:root{
  --primary:#1FA67A;
  --primary-dark:#0F7A5A;
  --primary-deep:#087150;
  --primary-light:#E8F6F1;
  --secondary:#D6A84F;
  --accent:#8BC34A;
  --background:#F7FAF8;
  --card:#FFFFFF;
  --border:#DCEAE4;
  --soft-border:#EAF2EF;
  --text:#1F2D2A;
  --muted:#66736F;
  --danger:#D9534F;
  --shadow:0 14px 34px rgba(15,122,90,.10);
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--background);color:var(--text);font-size:15px;line-height:1.45}
a{text-decoration:none;color:inherit}
.app-header{position:sticky;top:0;z-index:1000;background:linear-gradient(180deg,rgba(247,250,248,.98),rgba(247,250,248,.96));backdrop-filter:blur(12px);box-shadow:0 2px 0 rgba(15,122,90,.06)}
.title-bar{height:58px;background:var(--primary);display:flex;align-items:center;justify-content:space-between;padding:0 16px;color:#fff}
.brand{display:flex;align-items:center;gap:10px;min-width:0;color:#fff}
.brand-icon{width:30px;height:30px;border-radius:999px;background:#fff;color:var(--primary-dark);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:17px;flex:0 0 30px}
.brand-text{display:flex;align-items:baseline;gap:10px;min-width:0}
.brand strong{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand small{font-size:12px;opacity:.95;white-space:nowrap}
.menu-toggle{display:none;border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.16);color:#fff;border-radius:10px;padding:8px 11px;font-weight:700;cursor:pointer}
.menu-shell{max-width:1240px;margin:0 auto;padding:12px 16px}
.app-menu{display:flex;align-items:center;justify-content:center;gap:10px;overflow-x:auto;background:#fff;border:1px solid var(--border);border-radius:22px;padding:8px;box-shadow:0 8px 24px rgba(15,122,90,.08);scrollbar-width:thin}
.menu-link{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:16px;color:var(--primary-dark);font-weight:700;white-space:nowrap;flex:0 0 auto;transition:.16s ease;background:transparent}
.menu-link:hover{background:var(--primary-light)}
.menu-link.active{background:var(--primary);color:#fff;box-shadow:0 8px 18px rgba(15,122,90,.18)}
.menu-ico{font-size:15px;line-height:1}
.page-shell{max-width:1240px;margin:0 auto;padding:4px 16px 24px}
.main-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;margin-bottom:16px}
.diagnosis-card{margin-top:0}
.section-title{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:14px}
.section-title h1,.section-title h2{margin:0;color:var(--primary-dark);line-height:1.2}
.section-title h1{font-size:20px}
.section-title h2{font-size:21px}
.section-title p{margin:0;color:var(--muted);max-width:520px}
.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.11em;color:var(--secondary);font-weight:700;display:block;margin-bottom:4px}
.diagnosis-form{display:grid;gap:14px}
.form-row{display:grid;gap:12px;align-items:end}
.basic-row{grid-template-columns:minmax(160px,1fr) 120px 170px minmax(280px,2fr)}
.form-grid{display:grid;gap:12px}
.tuchan-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.extra-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:12px}
.field{display:flex;flex-direction:column;gap:6px}
.field span{font-weight:700;color:var(--primary-dark)}
input,select,textarea{width:100%;border:1px solid var(--border);border-radius:12px;background:#fff;padding:11px 12px;color:var(--text);font:inherit;outline:none;transition:.16s ease}
textarea{resize:vertical;min-height:86px}
input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(31,166,122,.12)}
.extra-box{border:1px dashed var(--border);border-radius:14px;background:rgba(232,246,241,.45);padding:12px 14px}
.extra-box summary{font-weight:700;color:var(--primary-dark);cursor:pointer}
.quick-panel{display:grid;grid-template-columns:1fr 1.45fr;gap:12px}
.quick-box{border:1px solid var(--border);background:linear-gradient(180deg,#fff,#FAFFFC);border-radius:16px;padding:14px}
.quick-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-bottom:10px}
.quick-head h2{margin:0;font-size:16px;color:var(--primary-dark)}
.quick-head small{color:var(--muted);font-size:12px;text-align:right}
.chip-group{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1px solid var(--border);background:#fff;color:var(--primary-dark);border-radius:999px;padding:9px 12px;font-weight:700;cursor:pointer;transition:.14s ease}
.chip:hover{border-color:var(--primary);box-shadow:0 4px 14px rgba(15,122,90,.12)}
.chip.active{background:var(--primary-dark);border-color:var(--primary-dark);color:#fff;box-shadow:0 8px 18px rgba(15,122,90,.2)}
.form-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.btn{border:0;border-radius:12px;padding:12px 18px;font-weight:700;cursor:pointer;min-width:130px;transition:.14s ease}
.btn:hover{transform:translateY(-1px)}
.btn-danger{background:#D90000;color:#fff}
.btn-primary{background:var(--primary-dark);color:#fff}
.btn-secondary{background:#fff;color:var(--primary-dark);border:1px solid var(--primary)}
.empty-state,.loading-state{border:1px dashed var(--border);border-radius:16px;padding:22px;color:var(--muted);background:#FAFFFC}
.loading-state{font-weight:700;color:var(--primary-dark)}
.result-content{padding:2px}
.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.result-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:14px;box-shadow:0 10px 24px rgba(31,45,42,.06)}
.result-card.wide{grid-column:1/-1}
.result-card h3{margin:0 0 10px;color:var(--primary-dark);display:flex;align-items:center;gap:8px;font-size:17px}
.summary-pill{display:inline-flex;background:var(--primary-light);color:var(--primary-dark);border-radius:999px;padding:8px 12px;font-weight:700;margin:4px 6px 8px 0}
.muted{color:var(--muted)}
.bar-row{margin:10px 0}
.bar-top{display:flex;justify-content:space-between;gap:12px;font-weight:700;font-size:14px}
.bar-track{height:9px;border-radius:999px;background:#EDF5F1;overflow:hidden;margin-top:6px}
.bar-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:999px}
.item-list{display:grid;gap:8px}
.mini-item{padding:11px;border:1px solid var(--soft-border);border-radius:13px;background:#FBFFFD}
.mini-item strong{color:var(--primary-dark)}
.mini-item p{margin:4px 0 0;color:var(--muted)}
.warning-card{border-color:#F2BCBA;background:#FFF9F9}
.warning-card h3{color:var(--danger)}
.footer{max-width:1240px;margin:0 auto;padding:14px 16px 28px;color:var(--muted);display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--border)}
@media (max-width:980px){.basic-row{grid-template-columns:1fr 1fr}.chief-field{grid-column:1/-1}.tuchan-grid,.quick-panel,.result-grid{grid-template-columns:1fr 1fr}.extra-grid{grid-template-columns:1fr 1fr}.section-title{display:block}.section-title p{margin-top:6px}}
@media (max-width:720px){.title-bar{height:auto;min-height:50px}.brand-text{display:block}.brand small{display:block}.menu-toggle{display:inline-block}.menu-shell{padding:10px}.app-menu{display:none;height:auto;flex-direction:column;align-items:stretch;max-height:calc(100vh - 50px);overflow-y:auto;padding:10px;border-radius:18px}.app-menu.open{display:flex}.menu-link{justify-content:flex-start}.page-shell{padding:10px}.main-card{padding:14px;border-radius:16px}.section-title h1{font-size:18px}.section-title h2{font-size:20px}.basic-row,.tuchan-grid,.extra-grid,.quick-panel,.result-grid{grid-template-columns:1fr}.form-actions{display:grid;grid-template-columns:1fr 1fr}.btn{width:100%;min-width:0}.footer{display:block}.footer span{display:block;margin-top:6px}}
@media (max-width:420px){body{font-size:14px}.form-actions{grid-template-columns:1fr}.chip{padding:8px 10px}.quick-head{display:block}.quick-head small{text-align:left;display:block;margin-top:3px}}

/* V2.8 - đồng bộ font và thực đơn ngày */
*, button, input, select, textarea { font-family: Arial, Helvetica, sans-serif !important; }
.sub-heading{margin:14px 0 8px;color:var(--primary-dark);font-size:15px}
.meal-plan{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:12px}
.meal-day{border:1px solid var(--soft-border);border-radius:14px;background:#FBFFFD;padding:10px}
.meal-day h4{margin:0 0 8px;color:var(--primary-dark);font-size:15px}
.meal-list{display:grid;gap:8px}
.meal-item{border:1px dashed var(--border);border-radius:12px;background:#fff;padding:9px}
.meal-item strong{color:var(--primary-deep)}
.meal-item p{margin:4px 0 0;color:var(--muted);font-size:13px}
@media (max-width:1180px){.meal-plan{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.meal-plan{grid-template-columns:1fr}}


/* V2.9 - menu giữa, tiêu đề public gọn và link .html */
.app-menu{justify-content:center}
.compact-title{justify-content:center;align-items:center;text-align:center}
.compact-title>div{width:100%}
.compact-title h1{font-size:20px;line-height:1.25;text-align:center}
.menu-shell{text-align:center}
@media (max-width:720px){.app-menu{justify-content:flex-start}.compact-title h1{font-size:18px}}

/* V2.10 - fix font đồng bộ, header logo mới, bỏ logo cũ bên trái */
html, body, body * {
  font-family: Arial, Helvetica, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.app-header{
  background:linear-gradient(180deg,rgba(247,250,248,.98),rgba(247,250,248,.96));
}
.logo-title-bar{
  height:78px;
  min-height:78px;
  justify-content:center;
  position:relative;
  padding:8px 16px;
  background:var(--primary);
}
.header-logo{
  width:64px;
  height:64px;
  border-radius:999px;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-shadow:0 8px 20px rgba(0,0,0,.15);
  border:2px solid rgba(255,255,255,.95);
}
.header-logo img{
  width:58px;
  height:58px;
  object-fit:contain;
  display:block;
  border-radius:999px;
}
.logo-title-bar .menu-toggle{
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
}
.logo-title-bar .menu-toggle:hover{transform:translateY(-51%)}
.menu-ico{
  min-width:28px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
  background:var(--primary-light);
  color:var(--primary-dark);
}
.menu-link.active .menu-ico{background:#fff;color:var(--primary-dark)}
.compact-title h1{
  font-size:18px;
  line-height:1.25;
  text-align:center;
  font-weight:700;
}
.field span,.extra-box summary,.btn,.menu-link{font-weight:700}
@media (max-width:720px){
  .logo-title-bar{height:70px;min-height:70px;justify-content:center;padding:7px 12px}
  .header-logo{width:56px;height:56px}
  .header-logo img{width:50px;height:50px}
  .logo-title-bar .menu-toggle{right:12px}
  .menu-link{justify-content:flex-start}
  .compact-title h1{font-size:17px}
}

/* V2.12 - thực dưỡng dạng tab/button 5 ngày, gọn sau khi phân tích */
.meal-tabs{display:grid;gap:12px}
.meal-tab-buttons{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:2px 0 4px}
.meal-tab-btn{border:1px solid var(--border);background:#fff;color:var(--primary-dark);border-radius:16px;padding:11px 18px;font-weight:700;cursor:pointer;min-width:100px;box-shadow:0 4px 14px rgba(15,122,90,.06);transition:.14s ease}
.meal-tab-btn:hover{border-color:var(--primary);background:var(--primary-light);transform:translateY(-1px)}
.meal-tab-btn.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 8px 18px rgba(15,122,90,.18)}
.meal-tab-panels{border:1px solid var(--soft-border);border-radius:16px;background:#FBFFFD;padding:12px}
.meal-day-panel{display:none}
.meal-day-panel.active{display:block}
.meal-day-panel[hidden]{display:none!important}
.meal-day-panel .meal-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.meal-day-panel .meal-item{border:1px dashed var(--border);border-radius:13px;background:#fff;padding:11px}
.meal-day-panel .meal-item strong{color:var(--primary-deep);font-size:15px}
.meal-day-panel .meal-item p{margin:5px 0 0;color:var(--muted);font-size:13px}
@media (max-width:900px){.meal-day-panel .meal-list{grid-template-columns:1fr}.meal-tab-btn{min-width:88px;padding:10px 14px}}

/* V2.12 - public data menu pages */
[hidden]{display:none!important}
.library-card{min-height:420px}
.library-title{margin-bottom:12px}
.library-search{display:grid;grid-template-columns:minmax(260px,1fr) auto auto;gap:10px;margin:0 0 14px;align-items:center}
.library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.library-item{border:1px solid var(--border);border-radius:16px;background:#fff;padding:14px;box-shadow:0 8px 20px rgba(31,45,42,.05)}
.library-item h3{margin:0 0 9px;color:var(--primary-dark);font-size:17px;line-height:1.25;font-weight:700}
.library-item p{margin:5px 0;color:var(--muted);font-size:14px;line-height:1.4}
.library-item b{color:var(--text);font-weight:700}
html,body,button,input,select,textarea,a,p,span,div,h1,h2,h3,h4,strong,b,label,summary{font-family:Arial,Helvetica,sans-serif!important}
body{font-weight:400;letter-spacing:0}
.menu-link,.btn,.field span,.extra-box summary,.eyebrow{font-weight:700!important}
@media (max-width:880px){.library-grid{grid-template-columns:1fr}.library-search{grid-template-columns:1fr 1fr}.library-search input{grid-column:1/-1}}
@media (max-width:520px){.library-search{grid-template-columns:1fr}.library-search input{grid-column:auto}}

/* V2.12 final font normalize */
html,body,button,input,select,textarea,a,p,span,div,h1,h2,h3,h4,strong,b,label,summary,table,th,td{
  font-family:Arial,Helvetica,sans-serif!important;
  font-synthesis:none;
}
body{font-weight:400!important;letter-spacing:0!important;text-rendering:auto!important}
.menu-link,.btn,.field span,.extra-box summary,.eyebrow,.meal-tab-btn,.library-item h3{font-weight:600!important}
.section-title h1,.section-title h2,.result-card h3,.summary-pill,.mini-item strong{font-weight:700!important}

/* V2.16 - result support tabs and etiology percent summary */
.support-card{margin-top:0}
.support-tabs{display:grid;gap:12px}
.support-tab-buttons{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:2px 0 6px}
.support-tab-btn{border:1px solid var(--border);background:#fff;color:var(--primary-dark);border-radius:999px;padding:11px 18px;font-weight:700;cursor:pointer;min-width:118px;box-shadow:0 4px 14px rgba(15,122,90,.06);transition:.14s ease}
.support-tab-btn:hover{border-color:var(--primary);background:var(--primary-light);transform:translateY(-1px)}
.support-tab-btn.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 8px 18px rgba(15,122,90,.18)}
.support-tab-panels{border:1px solid var(--soft-border);border-radius:16px;background:#FBFFFD;padding:12px}
.support-panel{display:none}
.support-panel.active{display:block}
.support-panel[hidden]{display:none!important}
.support-panel .item-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.support-panel .mini-item{background:#fff}
.etiology-summary{border:1px solid var(--soft-border);background:#F8FFFC;border-radius:14px;padding:12px;margin-bottom:10px;color:var(--primary-dark)}
.etiology-summary p{margin:5px 0 0;color:var(--muted)}
.etiology-item{display:grid;gap:7px}
.etiology-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.etiology-top span{font-weight:700;color:var(--primary-dark);background:var(--primary-light);border-radius:999px;padding:4px 10px;min-width:54px;text-align:center}
.etiology-track{height:9px;border-radius:999px;background:#EDF5F1;overflow:hidden}
.etiology-fill{height:100%;border-radius:999px;background:var(--primary)}
@media (max-width:980px){.support-panel .item-list{grid-template-columns:1fr}.support-tab-btn{min-width:102px;padding:10px 14px}}


/* V2.17 - center actions, larger logo, nicer menu icons */
.form-actions{justify-content:center;align-items:center}
.logo-title-bar{height:88px;min-height:88px;padding:8px 18px}
.header-logo{width:78px;height:78px;border-width:2px;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.header-logo img{width:70px;height:70px}
.app-menu{gap:12px;padding:10px 12px}
.menu-link{gap:10px;padding:12px 18px;font-weight:700}
.menu-ico{
  width:34px;
  min-width:34px;
  height:34px;
  padding:0;
  border-radius:12px;
  border:1px solid rgba(15,122,90,.10);
  background:linear-gradient(180deg,#F4FBF8,#E6F5EF);
  color:var(--primary-dark);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 4px 10px rgba(15,122,90,.08);
}
.menu-ico svg{width:19px;height:19px;display:block}
.menu-link:hover .menu-ico{background:linear-gradient(180deg,#ECFAF4,#DDF3EA);border-color:rgba(15,122,90,.18)}
.menu-link.active .menu-ico{background:#fff;color:var(--primary-dark);border-color:rgba(255,255,255,.75);box-shadow:0 6px 14px rgba(8,113,80,.18)}
.menu-link span:last-child{display:inline-flex;align-items:center}
@media (max-width:720px){
  .logo-title-bar{height:78px;min-height:78px;padding:7px 12px}
  .header-logo{width:68px;height:68px}
  .header-logo img{width:60px;height:60px}
  .form-actions{grid-template-columns:1fr 1fr;justify-content:stretch}
  .menu-ico{width:32px;min-width:32px;height:32px;border-radius:11px}
}
@media (max-width:420px){
  .form-actions{grid-template-columns:1fr}
}


/* V2.18 - premium thin line-art icons + mobile header responsive */
.logo-title-bar{
  height:92px;
  min-height:92px;
  padding:9px 18px;
}
.header-logo{
  width:82px;
  height:82px;
  border:2px solid rgba(255,255,255,.96);
  box-shadow:0 12px 26px rgba(0,0,0,.18);
}
.header-logo img{width:74px;height:74px}
.menu-shell{max-width:1120px;padding:14px 16px}
.app-menu{
  gap:12px;
  padding:11px 14px;
  border-radius:24px;
  box-shadow:0 14px 28px rgba(15,122,90,.09);
}
.menu-link{
  min-height:46px;
  padding:10px 18px;
  gap:10px;
  border-radius:17px;
  font-weight:700!important;
}
.menu-ico{
  width:34px;
  min-width:34px;
  height:34px;
  padding:0;
  border-radius:14px;
  background:rgba(31,166,122,.09);
  border:1px solid rgba(31,166,122,.15);
  color:var(--primary-dark);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 5px 12px rgba(15,122,90,.07);
}
.menu-ico svg{
  width:20px;
  height:20px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.45;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.menu-link:hover .menu-ico{
  background:#EAF8F2;
  border-color:rgba(31,166,122,.25);
}
.menu-link.active .menu-ico{
  background:#fff;
  color:var(--primary-dark);
  border-color:rgba(255,255,255,.9);
  box-shadow:0 6px 15px rgba(8,113,80,.18);
}
.form-actions{
  justify-content:center;
  align-items:center;
  padding-top:2px;
}
.form-actions .btn{
  min-width:140px;
}
@media (max-width:980px){
  .menu-shell{max-width:100%;padding:12px 12px}
  .app-menu{
    justify-content:flex-start;
    gap:10px;
    overflow-x:auto;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
  }
  .app-menu::-webkit-scrollbar{height:4px}
  .app-menu::-webkit-scrollbar-thumb{background:rgba(15,122,90,.25);border-radius:999px}
  .menu-link{scroll-snap-align:center}
}
@media (max-width:720px){
  .app-header{position:sticky;top:0}
  .logo-title-bar{
    height:78px;
    min-height:78px;
    padding:8px 12px 7px;
  }
  .header-logo{width:68px;height:68px}
  .header-logo img{width:60px;height:60px}
  .menu-toggle{display:none!important}
  .menu-shell{padding:8px 10px 10px;background:rgba(247,250,248,.98)}
  .app-menu{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(64px,1fr));
    gap:6px;
    overflow:visible;
    padding:8px;
    border-radius:20px;
  }
  .menu-link{
    min-height:58px;
    padding:7px 5px;
    flex-direction:column;
    gap:5px;
    border-radius:14px;
    font-size:12px;
    line-height:1.12;
    text-align:center;
    justify-content:center;
  }
  .menu-ico{width:30px;min-width:30px;height:30px;border-radius:12px}
  .menu-ico svg{width:17px;height:17px;stroke-width:1.55}
  .form-actions{
    display:flex;
    justify-content:center;
    gap:10px;
  }
  .form-actions .btn{width:auto;min-width:124px}
}
@media (max-width:430px){
  .app-menu{grid-template-columns:repeat(5,minmax(54px,1fr));gap:5px;padding:7px}
  .menu-link{font-size:11px;min-height:55px;padding:6px 3px}
  .menu-ico{width:28px;min-width:28px;height:28px;border-radius:11px}
  .menu-ico svg{width:16px;height:16px}
  .form-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .form-actions .btn{width:100%;min-width:0}
}


/* V2.20 - clinical background fields for syndrome differentiation */
.clinical-extra-grid{grid-template-columns:repeat(5,minmax(0,1fr));align-items:end}
.bp-inputs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.clinical-context{margin:12px 0;padding:12px;border:1px solid var(--soft-border);border-radius:14px;background:#F8FFFC;color:var(--text)}
.clinical-context>b{color:var(--primary-dark)}
.clinical-context p{margin:5px 0;color:var(--muted)}
.clinical-context-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:8px}
.clinical-context-item{border:1px dashed var(--border);border-radius:12px;background:#fff;padding:9px}
.clinical-context-item strong{color:var(--primary-dark);font-weight:700}
@media (max-width:1120px){.clinical-extra-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.sleep-field,.bp-field{grid-column:span 1}}
@media (max-width:720px){.clinical-extra-grid,.clinical-context-list{grid-template-columns:1fr}.bp-inputs{grid-template-columns:1fr 1fr}}
@media (max-width:420px){.bp-inputs{grid-template-columns:1fr}}


/* V2.20 - thông tin nền gọn hơn: tâm thu/tâm trương cùng hàng, bệnh nền xuống dưới */
.clinical-extra-grid{grid-template-columns:repeat(6,minmax(0,1fr));align-items:end;gap:12px}
.sleep-field{grid-column:span 3}
.bp-field{grid-column:span 3}
.bp-inputs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.clinical-disease-field{grid-column:span 2}
#librarySub[hidden]{display:none!important}
@media (max-width:900px){.clinical-extra-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sleep-field,.bp-field,.clinical-disease-field{grid-column:span 1}}
@media (max-width:560px){.clinical-extra-grid{grid-template-columns:1fr}.sleep-field,.bp-field,.clinical-disease-field{grid-column:span 1}.bp-inputs{grid-template-columns:1fr 1fr}}


/* V2.21 - print/PDF result and public menu without admin */
.result-title-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;max-width:560px}
.result-title-actions p{margin:0;color:var(--muted)}
.print-result-btn{min-width:140px;padding:10px 16px;border-radius:12px}
.print-report{display:none}
@media (max-width:720px){
  .result-title-actions{justify-content:center;text-align:center;max-width:none;margin-top:8px}
  .print-result-btn{width:auto;min-width:160px}
}
@media (max-width:620px){
  .app-menu{grid-template-columns:repeat(4,minmax(0,1fr))}
  .menu-link{min-width:0}
}
@media print{
  @page{size:A4;margin:12mm}
  html,body{background:#fff!important;color:#111!important;font-family:Arial,Helvetica,sans-serif!important;font-size:12px;line-height:1.35}
  body *{visibility:hidden!important;box-shadow:none!important;text-shadow:none!important}
  #printReport,#printReport *{visibility:visible!important}
  #printReport{display:block!important;position:absolute;left:0;top:0;width:100%;background:#fff!important;color:#111!important}
  .print-page{padding:0;margin:0}
  .print-header{border-bottom:2px solid #087150;margin-bottom:12px;padding-bottom:8px}
  .print-header h1{margin:0 0 6px;color:#087150;font-size:22px;line-height:1.2}
  .print-header p{margin:3px 0;color:#333}
  .print-section{border:1px solid #d7e7df;border-radius:10px;padding:10px;margin:10px 0;background:#fff;break-inside:avoid;page-break-inside:avoid}
  .print-section h3{margin:0 0 8px;color:#087150;font-size:15px}
  .print-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px}
  .print-info-grid p{margin:2px 0}
  .print-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:start}
  .result-card,.mini-item,.meal-item,.clinical-context-item{border:1px solid #d7e7df!important;background:#fff!important;border-radius:8px!important;padding:8px!important;margin:6px 0!important;break-inside:avoid;page-break-inside:avoid}
  .result-card.wide{grid-column:auto}
  .result-grid,.item-list,.meal-list,.clinical-context-list{display:block!important}
  .summary-pill{background:#e8f6f1!important;color:#087150!important;border:1px solid #d7e7df!important;border-radius:999px;padding:5px 8px;display:inline-block;margin:3px 0}
  .bar-row{margin:8px 0;break-inside:avoid;page-break-inside:avoid}
  .bar-track,.etiology-track{height:6px!important;background:#eef5f1!important;border-radius:99px!important;overflow:hidden!important}
  .bar-fill,.etiology-fill{background:#1FA67A!important;height:100%!important;border-radius:99px!important}
  .print-meal-plan{display:block}
  .print-day-block{border:1px solid #d7e7df;border-radius:10px;padding:8px;margin:8px 0;break-inside:avoid;page-break-inside:avoid}
  .print-day-block h4{margin:0 0 6px;color:#087150;font-size:14px}
  .support-tab-buttons,.meal-tab-buttons,.btn,.app-header,.page-shell,.footer{display:none!important}
  a{color:#111;text-decoration:none}
}

/* V2.24 - header logo padding rộng hơn cho thoáng */
.logo-title-bar{
  height:118px !important;
  min-height:118px !important;
  padding:18px 20px !important;
}
.header-logo{
  width:76px !important;
  height:76px !important;
  margin:0 auto !important;
}
.header-logo img{
  width:66px !important;
  height:66px !important;
}
@media (max-width:720px){
  .logo-title-bar{
    height:104px !important;
    min-height:104px !important;
    padding:16px 18px !important;
  }
  .header-logo{width:70px !important;height:70px !important}
  .header-logo img{width:60px !important;height:60px !important}
}


/* V2.25 - bộ lọc thư viện và menu thêm Vị thuốc */
.library-search{grid-template-columns:minmax(260px,1fr) minmax(190px,250px) auto auto;align-items:center}
.library-filter{height:48px;border-radius:12px;border:1px solid var(--border);background:#fff;color:var(--primary-dark);font-weight:600;padding:0 12px;outline:none}
.library-filter:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(31,166,122,.12)}
.library-item p{line-height:1.5}
.library-item h3{font-weight:700}
@media (max-width:900px){.library-search{grid-template-columns:1fr 1fr}.library-search input{grid-column:1/-1}.library-filter{grid-column:1/-1}}
@media (max-width:560px){.library-search{grid-template-columns:1fr}.library-search input,.library-filter{grid-column:auto}.app-menu{grid-template-columns:repeat(5,minmax(0,1fr))}.menu-link{font-size:12px;padding:8px 6px}}


/* V2.28 - nút in/PDF đỏ nổi bật và chống zoom input trên iPhone */
.print-result-btn,
.btn.print-result-btn,
button.print-result-btn{
  background:#D90000!important;
  color:#fff!important;
  border-color:#D90000!important;
  box-shadow:0 8px 18px rgba(217,0,0,.16)!important;
}
.print-result-btn:hover{filter:brightness(.96)}
@media (max-width:720px){
  input,select,textarea,button{font-size:16px!important}
  body{font-size:16px}
  .menu-link{font-size:12px!important}
}

/* V2.29 - Premium jade/cream UI refresh based on approved demo */
:root{
  --primary:#1FA67A;
  --primary-dark:#0F6B53;
  --primary-deep:#075B42;
  --primary-light:#E9F6EF;
  --primary-soft:#A7DCC2;
  --secondary:#D4AF37;
  --gold-soft:#F5E8C7;
  --background:#F8F7F2;
  --card:#FFFDF8;
  --border:#D9E8DF;
  --soft-border:#E9F2ED;
  --text:#20342F;
  --muted:#64748B;
  --danger:#D64545;
  --shadow:0 18px 42px rgba(15,107,83,.12);
  --shadow-soft:0 10px 24px rgba(15,107,83,.08);
  --radius:24px;
}
body{
  background:
    radial-gradient(circle at 12% 8%, rgba(167,220,194,.32), transparent 28%),
    linear-gradient(180deg,#F4FBF8 0%,#F8F7F2 42%,#F9FCF9 100%);
  color:var(--text);
}
.app-header{position:sticky;top:0;background:linear-gradient(180deg,rgba(248,247,242,.98),rgba(248,247,242,.94));box-shadow:0 1px 0 rgba(15,107,83,.10);backdrop-filter:blur(16px)}
.logo-title-bar{
  height:128px!important;
  min-height:128px!important;
  padding:20px 20px 28px!important;
  background:
    radial-gradient(circle at 26% 24%,rgba(212,175,55,.12),transparent 18%),
    radial-gradient(circle at 76% 18%,rgba(167,220,194,.20),transparent 18%),
    linear-gradient(135deg,#0F6B53 0%,#087150 46%,#1FA67A 100%)!important;
  overflow:hidden;
}
.logo-title-bar:before,.logo-title-bar:after{
  content:"";position:absolute;top:18px;width:190px;height:90px;opacity:.22;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(245,232,199,.8),rgba(245,232,199,0) 62%);
  filter:blur(2px);
}
.logo-title-bar:before{left:20px;transform:rotate(-8deg)}
.logo-title-bar:after{right:20px;transform:rotate(8deg)}
.header-logo{width:84px!important;height:84px!important;background:#fff!important;border:3px solid rgba(245,232,199,.92)!important;box-shadow:0 16px 34px rgba(0,0,0,.20),0 0 0 8px rgba(255,255,255,.10)!important;z-index:1}
.header-logo img{width:74px!important;height:74px!important}
.menu-shell{margin-top:-42px;position:relative;z-index:5;max-width:1100px;padding:0 18px 18px!important;text-align:center}
.app-menu{
  background:rgba(255,253,248,.92)!important;border:1px solid rgba(217,232,223,.92)!important;
  border-radius:28px!important;padding:12px 14px!important;box-shadow:0 18px 42px rgba(15,107,83,.12), inset 0 1px 0 rgba(255,255,255,.75)!important;
  backdrop-filter:blur(14px);gap:14px!important;
}
.menu-link{border-radius:20px!important;min-height:52px!important;padding:10px 20px!important;color:var(--primary-deep)!important;font-weight:700!important;transition:.18s ease!important}
.menu-link:hover{background:#F1FAF5!important;transform:translateY(-1px)}
.menu-link.active{background:linear-gradient(135deg,#0F6B53,#1FA67A)!important;color:#fff!important;box-shadow:0 12px 24px rgba(15,107,83,.22)!important}
.menu-ico{width:38px!important;min-width:38px!important;height:38px!important;border-radius:16px!important;background:#F1FAF5!important;border:1px solid #CDE9DD!important;color:var(--primary-dark)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 6px 16px rgba(15,107,83,.08)!important}
.menu-ico svg{width:20px!important;height:20px!important;stroke-width:1.55!important}
.menu-link.active .menu-ico{background:#fff!important;color:var(--primary-dark)!important;border-color:rgba(255,255,255,.9)!important}
.page-shell{max-width:1180px;padding:18px 18px 28px!important}
.main-card{background:rgba(255,253,248,.96)!important;border:1px solid var(--border)!important;border-radius:26px!important;box-shadow:var(--shadow)!important;padding:26px!important;margin-bottom:20px!important}
.diagnosis-card{margin-top:0!important}
.section-title h1,.section-title h2{color:var(--primary-deep)!important;letter-spacing:-.01em}.compact-title h1{font-size:23px!important}.compact-title h1:after,.compact-title h2:after{content:"";display:block;width:42px;height:2px;background:linear-gradient(90deg,transparent,var(--secondary),transparent);margin:11px auto 0;border-radius:99px}.eyebrow{color:var(--secondary)!important;letter-spacing:.14em}
.form-row,.form-grid{gap:14px!important}.field span{color:var(--primary-deep)!important;margin-bottom:2px}input,select,textarea{border-radius:15px!important;border:1px solid #D7E7DF!important;background:#fff!important;min-height:48px;padding:13px 14px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}textarea{min-height:96px}input:focus,select:focus,textarea:focus{border-color:#1FA67A!important;box-shadow:0 0 0 4px rgba(31,166,122,.15)!important}
.extra-box{border:1px solid #D7E7DF!important;background:linear-gradient(180deg,#F5FBF8,#EFF8F3)!important;border-radius:17px!important;padding:13px 16px!important}.extra-box summary{color:var(--primary-deep)!important}
.btn{border-radius:15px!important;min-height:48px;padding:12px 22px!important;font-weight:700!important}.btn-danger{background:linear-gradient(135deg,#D64545,#E53131)!important;color:#fff!important;box-shadow:0 12px 24px rgba(214,69,69,.22)!important}.btn-secondary{background:#FFFDF8!important;color:var(--primary-dark)!important;border:1px solid #D9C9A3!important}.btn-primary{background:linear-gradient(135deg,#0F6B53,#087150)!important;color:#fff!important}.form-actions{justify-content:center!important;margin-top:8px!important;gap:18px!important}
.empty-state,.loading-state{background:#FBFFFD!important;border:1px dashed #D7E7DF!important;border-radius:18px!important}.result-card-shell{background:rgba(255,253,248,.94)!important}.result-modern{display:grid;gap:16px}.result-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.overview-card{position:relative;overflow:hidden;border-radius:20px;border:1px solid var(--border);background:#F7FFFA;padding:20px;box-shadow:var(--shadow-soft);min-height:128px}.overview-card span{display:block;color:var(--primary-dark);font-weight:700;font-size:14px;margin-bottom:8px}.overview-card strong{display:block;color:#123B31;font-size:22px;line-height:1.2;margin-bottom:8px}.overview-card p{margin:0;color:var(--muted)}.overview-card:after{content:"";position:absolute;right:18px;bottom:18px;width:54px;height:54px;border-radius:999px;background:radial-gradient(circle,#fff 0 35%,rgba(31,166,122,.18) 36%);box-shadow:inset 0 0 0 1px rgba(15,107,83,.08)}.overview-bc{background:#FFF9EA}.overview-bc:after{background:radial-gradient(circle,#fff 0 35%,rgba(212,175,55,.25) 36%)}.overview-advice{background:#F1FAF5}
.result-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.result-detail-grid .result-card:first-child{grid-column:1/-1}.result-card{border-radius:20px!important;border:1px solid var(--border)!important;background:#FFFDF8!important;box-shadow:var(--shadow-soft)!important;padding:18px!important}.result-card h3{color:var(--primary-deep)!important;font-size:18px!important}.summary-pill{background:#E9F6EF!important;color:var(--primary-deep)!important;border:1px solid #CDE9DD!important}.bar-fill,.etiology-fill{background:linear-gradient(90deg,#0F6B53,#1FA67A,#A7DCC2)!important}.mini-item{border-radius:16px!important;border:1px solid #D7E7DF!important;background:#FBFFFD!important;padding:14px!important}.support-card{padding:20px!important}.support-tab-buttons{justify-content:flex-start!important;border-bottom:1px solid #E7EFEA;padding-bottom:0;margin-bottom:14px}.support-tab-btn{border-radius:18px 18px 0 0!important;border:1px solid transparent!important;background:transparent!important;box-shadow:none!important;color:#6B756F!important;min-width:130px!important}.support-tab-btn.active{background:#FFFDF8!important;color:var(--primary-deep)!important;border-color:#E7EFEA!important;border-bottom-color:#FFFDF8!important;box-shadow:0 -4px 14px rgba(15,107,83,.05)!important}.support-tab-panels{background:#FFFDF8!important;border:1px solid #E7EFEA!important;border-radius:0 0 18px 18px!important;padding:18px!important}.nutrition-advice{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:14px;margin-bottom:16px}.nutrition-block{border:1px solid #D7E7DF;background:#F7FFFA;border-radius:16px;padding:14px}.nutrition-block h4{margin:0 0 8px;color:var(--primary-deep);font-size:15px}.nutrition-block p{margin:0;color:#40514C}.nutrition-principle{background:#F2FAF5}.food-tags{display:flex;flex-wrap:wrap;gap:8px}.food-tag{display:inline-flex;border:1px solid #C9E4D8;background:#F7FFFA;color:var(--primary-deep);border-radius:999px;padding:7px 10px;font-weight:600;font-size:13px}.food-tag.avoid{border-color:#F1C0C0;background:#FFF6F6;color:#B42323}.meal-tab-btn{border-radius:999px!important}.meal-tab-btn.active{background:linear-gradient(135deg,#0F6B53,#1FA67A)!important}.meal-tab-panels{background:#FBFFFD!important}.meal-item{border:1px dashed #D7E7DF!important;border-radius:15px!important;background:#fff!important}.library-card{padding:26px!important}.library-search{gap:12px!important}.library-item{border-radius:18px!important;background:#FFFDF8!important;border-color:#D7E7DF!important;box-shadow:var(--shadow-soft)!important}.library-item h3{color:var(--primary-deep)!important}.footer{border-top:1px solid #DDEBE4!important;color:#64748B!important}
@media(max-width:980px){.result-overview,.nutrition-advice{grid-template-columns:1fr}.result-detail-grid{grid-template-columns:1fr}.support-tab-buttons{overflow-x:auto;flex-wrap:nowrap}.support-tab-btn{flex:0 0 auto}.compact-title h1{font-size:21px!important}}
@media(max-width:720px){body{font-size:16px!important}.logo-title-bar{height:96px!important;min-height:96px!important;padding:16px 16px 26px!important}.header-logo{width:70px!important;height:70px!important}.header-logo img{width:60px!important;height:60px!important}.menu-shell{margin-top:-32px;padding:0 10px 12px!important}.app-menu{display:flex!important;overflow-x:auto!important;grid-template-columns:none!important;gap:8px!important;border-radius:20px!important;padding:8px!important;scroll-snap-type:x proximity}.menu-link{flex:0 0 92px!important;min-height:66px!important;padding:8px 6px!important;font-size:12px!important}.menu-ico{width:34px!important;min-width:34px!important;height:34px!important}.page-shell{padding:12px 10px 22px!important}.main-card{padding:18px!important;border-radius:22px!important}.basic-row,.tuchan-grid,.extra-grid,.clinical-extra-grid{grid-template-columns:1fr!important}.form-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}.result-title-actions{display:grid!important;grid-template-columns:1fr!important}.nutrition-advice{grid-template-columns:1fr}.support-tab-panels{padding:14px!important}.library-search{grid-template-columns:1fr!important}.library-search input,.library-filter{grid-column:auto!important}input,select,textarea,button{font-size:16px!important}}
@media print{.nutrition-advice{display:block!important}.food-tag{border:1px solid #aaa!important;background:#fff!important;color:#111!important;margin:2px!important}.overview-card{border:1px solid #d7e7df!important;background:#fff!important;box-shadow:none!important}.result-overview{display:block!important}}


/* V2.30 - header spacing + result artwork alignment */
.app-header{
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.logo-title-bar{
  height:auto!important;
  min-height:138px!important;
  padding:22px 20px 66px!important;
  align-items:flex-start!important;
}
.header-logo{
  margin-top:0!important;
  position:relative;
  z-index:8;
}
.menu-shell{
  margin-top:-20px!important;
  position:relative;
  z-index:7!important;
  padding:0 18px 18px!important;
}
.app-menu{
  position:relative;
  z-index:7;
}
.page-shell{padding-top:12px!important;}
.result-card-shell{
  background:
    radial-gradient(circle at 14% 12%, rgba(167,220,194,.12), transparent 22%),
    radial-gradient(circle at 86% 14%, rgba(212,175,55,.10), transparent 18%),
    rgba(255,253,248,.96)!important;
}
.result-overview{gap:18px!important;align-items:stretch;}
.overview-card{
  padding:20px 112px 20px 20px!important;
  min-height:136px!important;
  background:linear-gradient(180deg,#F8FFFB 0%,#F2FBF6 100%)!important;
}
.overview-card strong{font-size:18px!important;}
.overview-card p{font-size:14px!important;line-height:1.45!important;}
.overview-card:before,
.overview-card:after{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  transform:translateY(-50%)!important;
}
.overview-card:before{
  right:18px!important;
  width:76px!important;
  height:76px!important;
  border-radius:22px!important;
  border:1px solid #CFE7DB!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 10px 22px rgba(15,107,83,.08)!important;
  background:linear-gradient(180deg,#EDF9F3,#DFF2E8)!important;
}
.overview-card:after{
  right:36px!important;
  width:40px!important;
  height:40px!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:contain!important;
}
.overview-pattern{background:linear-gradient(180deg,#F6FEFA 0%,#EEF9F3 100%)!important;}
.overview-pattern:before{background:linear-gradient(180deg,#EAF8F2,#D7F0E4)!important;border-color:#C8E5D7!important;}
.overview-pattern:after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop stop-color='%231FA67A'/%3E%3Cstop offset='1' stop-color='%2383CCAA'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M51.7 13.5c-14.6.4-27 8.7-32.8 22.1-2.2 5.1-2.8 10.3-2.2 15.4.2 1.7 2.1 2.7 3.8 2 4.9-1.9 9.2-5 12.6-9.2C43 31.5 48 22.3 50.3 14.4c.2-.7-.3-1-.9-.9-8 2.2-17.1 7.1-29.4 17.1'/%3E%3Cpath fill='none' stroke='%230F6B53' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round' d='M20.5 50.8c2.6-10.7 8.2-20 20.4-28.4M28 42.7c2.2-.1 5.4-.8 8.9-2.4'/%3E%3C/svg%3E")!important;}
.overview-bc{background:linear-gradient(180deg,#FFFDF6 0%,#FFF7E7 100%)!important;}
.overview-bc:before{background:linear-gradient(180deg,#FFF2D7,#F8E7BA)!important;border-color:#E7D39B!important;}
.overview-bc:after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='24' fill='%23D4AF37'/%3E%3Cpath fill='%23FFFDF8' d='M32 8a24 24 0 0 0 0 48c6.6 0 12-5.4 12-12S38.6 32 32 32 20 26.6 20 20s5.4-12 12-12z'/%3E%3Ccircle cx='32' cy='20' r='4.3' fill='%23D4AF37'/%3E%3Ccircle cx='32' cy='44' r='4.3' fill='%23FFFDF8'/%3E%3C/svg%3E")!important;}
.overview-advice{background:linear-gradient(180deg,#F5FCF7 0%,#EEF8F2 100%)!important;}
.overview-advice:before{background:linear-gradient(180deg,#EAF8F2,#DBF0E7)!important;border-color:#C8E5D7!important;}
.overview-advice:after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop stop-color='%2399D4B8'/%3E%3Cstop offset='1' stop-color='%231FA67A'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M10 24h30c0 14-8.5 22-15 22s-15-8-15-22z'/%3E%3Cpath fill='none' stroke='%230F6B53' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round' d='M10 24h30c0 14-8.5 22-15 22s-15-8-15-22zm4.2-5.8h20.2M22 12c0 3-1.7 4.7-3.5 6.4M29 12c0 3-1.7 4.7-3.5 6.4M46.5 17c3.5 1 6.5 4.3 6.5 8.3 0 5-3.8 8.7-8.6 9.1M22.5 46.3v7.7M17 54h16'/%3E%3C/svg%3E")!important;}
@media (max-width:900px){
  .result-overview{grid-template-columns:1fr!important;}
  .overview-card{padding-right:104px!important;}
}
@media (max-width:720px){
  .logo-title-bar{
    min-height:118px!important;
    padding:16px 14px 42px!important;
  }
  .header-logo{width:72px!important;height:72px!important;}
  .header-logo img{width:62px!important;height:62px!important;}
  .menu-shell{
    margin-top:-12px!important;
    padding:0 10px 12px!important;
  }
  .app-menu{border-radius:22px!important;}
  .menu-link{flex:0 0 96px!important;min-height:66px!important;}
  .overview-card{padding:18px 92px 18px 18px!important;min-height:128px!important;}
  .overview-card:before{width:64px!important;height:64px!important;right:14px!important;border-radius:18px!important;}
  .overview-card:after{width:34px!important;height:34px!important;right:29px!important;}
}
@media (max-width:420px){
  .logo-title-bar{padding-bottom:38px!important;}
  .menu-shell{margin-top:-8px!important;}
  .menu-link{flex:0 0 88px!important;}
}


/* V2.32 - premium mobile UI refinement */
@media (max-width: 720px){
  html,body{
    background:linear-gradient(180deg,#F3FAF6 0%,#EEF7F2 100%)!important;
  }
  .app-header{
    background:transparent!important;
    padding-bottom:0!important;
  }
  .logo-title-bar{
    height:auto!important;
    min-height:92px!important;
    padding:12px 14px 26px!important;
    justify-content:center!important;
    border-bottom-left-radius:22px!important;
    border-bottom-right-radius:22px!important;
    overflow:hidden!important;
    background:
      radial-gradient(circle at 50% 10%, rgba(255,255,255,.18), transparent 26%),
      radial-gradient(circle at 50% 50%, rgba(119,233,198,.18), transparent 38%),
      linear-gradient(135deg,#0E7D61 0%, #1FA67A 56%, #2FC39E 100%)!important;
    box-shadow:0 16px 32px rgba(12,93,72,.18)!important;
  }
  .logo-title-bar:before,
  .logo-title-bar:after{display:none!important;}
  .header-logo{
    width:72px!important;
    height:72px!important;
    margin:0 auto!important;
    box-shadow:0 10px 22px rgba(0,0,0,.16)!important;
  }
  .header-logo img{
    width:62px!important;
    height:62px!important;
  }
  .menu-toggle{display:none!important;}
  .menu-shell{
    margin-top:-14px!important;
    padding:0 10px 10px!important;
    position:relative!important;
    z-index:9!important;
  }
  .app-menu{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;
    padding:10px!important;
    border-radius:22px!important;
    background:rgba(255,255,255,.96)!important;
    box-shadow:0 14px 30px rgba(15,107,83,.12)!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-snap-type:x proximity!important;
  }
  .app-menu::-webkit-scrollbar{display:none!important;}
  .menu-link{
    flex:0 0 78px!important;
    min-width:78px!important;
    min-height:72px!important;
    padding:8px 6px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    border-radius:18px!important;
    background:transparent!important;
    color:#0C6E55!important;
    scroll-snap-align:start!important;
    box-shadow:none!important;
  }
  .menu-link.active{
    background:linear-gradient(135deg,#16966F 0%,#24B286 100%)!important;
    color:#fff!important;
    box-shadow:0 12px 22px rgba(31,166,122,.26)!important;
  }
  .menu-link span:last-child{
    display:block!important;
    font-size:11px!important;
    line-height:1.15!important;
    text-align:center!important;
    white-space:normal!important;
    max-width:66px!important;
    font-weight:700!important;
  }
  .menu-ico{
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    border-radius:999px!important;
    border:1px solid rgba(31,166,122,.16)!important;
    background:#F8FFFB!important;
  }
  .menu-link.active .menu-ico{
    background:#FFFFFF!important;
    color:#16966F!important;
    border-color:rgba(255,255,255,.4)!important;
  }
  .menu-ico svg{width:14px!important;height:14px!important;}

  .page-shell{
    padding:8px 8px 22px!important;
  }
  .main-card,.result-card-shell,.library-card{
    border-radius:24px!important;
    padding:14px 12px!important;
    box-shadow:0 12px 28px rgba(15,107,83,.08)!important;
    background:rgba(255,255,255,.94)!important;
  }
  .diagnosis-card{margin-top:2px!important;}
  .section-title.compact-title{
    margin-bottom:10px!important;
  }
  .section-title h1{
    font-size:16px!important;
    line-height:1.35!important;
    text-align:center!important;
    margin-bottom:4px!important;
  }
  .section-title h2{
    font-size:15px!important;
    text-align:center!important;
  }
  .section-title .eyebrow,
  .compact-title .eyebrow{
    font-size:11px!important;
    letter-spacing:.12em!important;
    text-align:center!important;
  }
  .diagnosis-form{gap:12px!important;}
  .field>span,
  label>span{
    font-size:13px!important;
    margin-bottom:6px!important;
    font-weight:700!important;
  }
  input,select,textarea,button{
    font-size:16px!important;
  }
  input,select,textarea{
    border-radius:14px!important;
    min-height:46px!important;
    padding:11px 13px!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
  }
  textarea{
    min-height:78px!important;
    padding-top:10px!important;
  }
  details.quick-panel,
  .quick-panel,
  .support-panel{
    border-radius:16px!important;
  }
  details.quick-panel>summary{
    font-size:14px!important;
    padding:12px 14px!important;
  }
  .basic-row,.tuchan-grid,.extra-grid,.clinical-extra-grid,.result-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  .form-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin-top:4px!important;
  }
  .btn{
    min-height:46px!important;
    border-radius:14px!important;
    font-size:14px!important;
    padding:12px 14px!important;
  }
  .result-card-shell{margin-top:14px!important;}
  .result-title-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    align-items:start!important;
  }
  .result-title-actions .btn,
  .result-title-actions .btn-print,
  .print-btn{
    width:100%!important;
  }
  .result-overview{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  .overview-card{
    min-height:auto!important;
    border-radius:18px!important;
    padding:14px 74px 14px 14px!important;
    box-shadow:0 8px 20px rgba(15,107,83,.08)!important;
  }
  .overview-card span{
    font-size:12px!important;
    margin-bottom:5px!important;
  }
  .overview-card strong{
    font-size:15px!important;
    line-height:1.28!important;
    margin-bottom:6px!important;
  }
  .overview-card p{
    font-size:12px!important;
    line-height:1.45!important;
  }
  .overview-card:before{
    width:56px!important;
    height:56px!important;
    border-radius:16px!important;
    right:12px!important;
  }
  .overview-card:after{
    width:28px!important;
    height:28px!important;
    right:26px!important;
  }
  .result-block,
  .nutrition-block,
  .support-panel,
  .library-item,
  .pattern-card,
  .acupoint-card,
  .formula-card,
  .herb-card,
  .food-card{
    border-radius:16px!important;
  }
  .library-search{
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  .library-search input,
  .library-filter,
  .library-search .btn{
    grid-column:auto!important;
    width:100%!important;
  }
  .meal-tab-buttons,
  .support-tabs,
  .subtab-row{
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    padding-bottom:2px!important;
  }
  .meal-tab-btn,
  .support-tab-btn,
  .subtab-btn{
    white-space:nowrap!important;
  }
  .footer{
    display:block!important;
    text-align:center!important;
    font-size:12px!important;
    padding:16px 0 22px!important;
  }
  .footer span{display:block!important;margin-top:6px!important;}
}


/* V2.33 - menu scroll arrows + botanical header + footer links */
.logo-title-bar{
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.18), transparent 24%),
    linear-gradient(135deg,#0F6B53 0%,#087150 48%,#1FA67A 100%)!important;
}
.logo-title-bar:before,
.logo-title-bar:after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  bottom:8px!important;
  width:260px!important;
  height:120px!important;
  opacity:.72!important;
  pointer-events:none!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 120'%3E%3Cg fill='none' stroke='%23E8D39B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' opacity='.82'%3E%3Cpath d='M22 96C70 62 92 32 130 18'/%3E%3Cpath d='M64 64c-17-1-28-9-37-23 17 0 28 8 37 23z' fill='%23E8D39B' opacity='.26'/%3E%3Cpath d='M92 43c-13-10-16-23-12-38 14 9 18 22 12 38z' fill='%23E8D39B' opacity='.24'/%3E%3Cpath d='M119 25c-3-15 2-26 15-34 4 15-1 26-15 34z' fill='%23E8D39B' opacity='.22'/%3E%3Cpath d='M48 78c-20 5-34 1-48-12 20-6 35-2 48 12z' fill='%23E8D39B' opacity='.20'/%3E%3Cpath d='M146 14c14 2 25 9 33 22-14-1-25-8-33-22z' fill='%23E8D39B' opacity='.18'/%3E%3Cpath d='M86 47C72 50 60 47 48 38M109 31c-8-10-10-21-6-34M43 81c-13 3-25 1-36-6'/%3E%3C/g%3E%3Cg fill='none' stroke='%23A7DCC2' stroke-width='1.2' opacity='.22'%3E%3Cpath d='M14 106c68-24 142-52 228-46'/%3E%3Cpath d='M28 88c60-20 127-37 202-28'/%3E%3C/g%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-size:contain!important;
  filter:none!important;
}
.logo-title-bar:before{left:24px!important;transform:none!important;}
.logo-title-bar:after{right:24px!important;transform:scaleX(-1)!important;}
.menu-shell{position:relative!important;}
.menu-scroll-btn{
  display:none;
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:20;
  width:38px;
  height:38px;
  border:1px solid rgba(31,166,122,.22);
  border-radius:999px;
  background:rgba(255,255,255,.96);
  color:#0F6B53;
  box-shadow:0 10px 22px rgba(15,107,83,.14);
  font-size:28px;
  line-height:1;
  font-weight:700;
  cursor:pointer;
}
.menu-scroll-prev{left:4px;}
.menu-scroll-next{right:4px;}
.menu-scroll-btn.is-disabled{opacity:.36;pointer-events:none;}
.footer a{color:#0F6B53;font-weight:700;text-decoration:underline;text-underline-offset:3px;}
@media (max-width:720px){
  .logo-title-bar{
    min-height:104px!important;
    padding:12px 14px 28px!important;
  }
  .logo-title-bar:before,.logo-title-bar:after{
    width:126px!important;
    height:70px!important;
    bottom:4px!important;
    opacity:.55!important;
  }
  .logo-title-bar:before{left:6px!important;}
  .logo-title-bar:after{right:6px!important;}
  .menu-shell{padding-left:34px!important;padding-right:34px!important;}
  .menu-scroll-btn{display:flex;align-items:center;justify-content:center;}
  .menu-scroll-prev{left:6px;}
  .menu-scroll-next{right:6px;}
  .app-menu{scroll-padding-left:6px!important;scroll-padding-right:6px!important;}
}
@media (max-width:430px){
  .menu-shell{padding-left:30px!important;padding-right:30px!important;}
  .menu-scroll-btn{width:32px;height:32px;font-size:24px;}
  .menu-scroll-prev{left:4px;}
  .menu-scroll-next{right:4px;}
}


/* V2.35 - footer link style + support tab arrows */
.footer a,
.footer a:visited{
  color:#0F6B53!important;
  text-decoration:none!important;
  font-weight:700!important;
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:4px 9px;
  border-radius:999px;
  background:#E9F6EF;
  border:1px solid #CDE9DD;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
  transition:.16s ease;
}
.footer a:hover{
  background:#DFF3EA!important;
  border-color:#A7DCC2!important;
  transform:translateY(-1px);
}
.support-tab-scroll-wrap{
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
}
.support-scroll-btn{
  display:none;
  flex:0 0 auto;
  width:34px;
  height:34px;
  border:1px solid rgba(31,166,122,.22);
  border-radius:999px;
  background:rgba(255,255,255,.96);
  color:#0F6B53;
  box-shadow:0 8px 18px rgba(15,107,83,.12);
  font-size:24px;
  line-height:1;
  font-weight:700;
  cursor:pointer;
  align-items:center;
  justify-content:center;
}
.support-tab-scroll-wrap .support-tab-buttons{
  flex:1 1 auto;
  min-width:0;
}
@media(max-width:720px){
  .support-tab-scroll-wrap{gap:7px;}
  .support-scroll-btn{display:flex;}
  .support-tab-scroll-wrap .support-tab-buttons{
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    justify-content:flex-start!important;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
    padding:4px 2px 8px!important;
    margin:0!important;
    border-bottom:0!important;
  }
  .support-tab-scroll-wrap .support-tab-buttons::-webkit-scrollbar{display:none!important;}
  .support-tab-scroll-wrap .support-tab-btn{
    flex:0 0 auto!important;
    min-width:116px!important;
    scroll-snap-align:start;
    border-radius:999px!important;
    border:1px solid #D9E8DF!important;
    background:#fff!important;
    color:#0F6B53!important;
    box-shadow:0 6px 14px rgba(15,107,83,.06)!important;
  }
  .support-tab-scroll-wrap .support-tab-btn.active{
    background:linear-gradient(135deg,#0F6B53,#1FA67A)!important;
    color:#fff!important;
    border-color:#1FA67A!important;
    box-shadow:0 10px 20px rgba(15,107,83,.18)!important;
  }
}
@media(max-width:430px){
  .support-scroll-btn{width:30px;height:30px;font-size:22px;}
  .support-tab-scroll-wrap{gap:5px;}
  .support-tab-scroll-wrap .support-tab-btn{min-width:104px!important;padding-left:12px!important;padding-right:12px!important;}
}


/* V2.35 - fix mobile overflow from arrows + strict filters */
html, body {
  max-width: 100%;
  overflow-x: hidden !important;
}
.app-header,
.page-shell,
.footer,
.menu-shell,
.result-card-shell,
.main-card {
  max-width: 100%;
  box-sizing: border-box;
}

/* Main mobile menu arrows: overlay inside menu, không làm rộng màn hình */
@media (max-width:720px){
  .menu-shell{
    width:100%!important;
    max-width:100vw!important;
    padding-left:8px!important;
    padding-right:8px!important;
    overflow:hidden!important;
  }
  .app-menu{
    width:100%!important;
    max-width:100%!important;
    padding-left:42px!important;
    padding-right:42px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    box-sizing:border-box!important;
  }
  .menu-scroll-btn{
    display:flex!important;
    width:28px!important;
    height:28px!important;
    font-size:22px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    z-index:30!important;
    box-shadow:0 8px 16px rgba(15,107,83,.16)!important;
  }
  .menu-scroll-prev{left:12px!important;}
  .menu-scroll-next{right:12px!important;}
  .menu-scroll-btn[hidden]{display:none!important;}
  .menu-link{
    flex:0 0 82px!important;
    min-width:82px!important;
    max-width:82px!important;
  }
}

/* Support tabs arrows: overlay, không chiếm layout, không làm vỡ mobile */
.support-card,
.support-tabs,
.support-tab-scroll-wrap{
  max-width:100%;
  box-sizing:border-box;
}
.support-tab-scroll-wrap{
  position:relative!important;
}
@media(max-width:720px){
  .support-tab-scroll-wrap{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    padding:0 32px!important;
    overflow:hidden!important;
  }
  .support-tab-scroll-wrap .support-tab-buttons{
    width:100%!important;
    max-width:100%!important;
    display:flex!important;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    flex-wrap:nowrap!important;
    padding:4px 0 8px!important;
    margin:0!important;
    box-sizing:border-box!important;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }
  .support-tab-scroll-wrap .support-tab-buttons::-webkit-scrollbar{display:none!important;}
  .support-scroll-btn{
    position:absolute!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    display:flex!important;
    width:26px!important;
    height:26px!important;
    font-size:20px!important;
    z-index:12!important;
    background:rgba(255,255,255,.98)!important;
    box-shadow:0 6px 14px rgba(15,107,83,.14)!important;
  }
  .support-scroll-prev{left:0!important;}
  .support-scroll-next{right:0!important;}
  .support-scroll-btn[hidden]{display:none!important;}
  .support-tab-scroll-wrap .support-tab-btn{
    flex:0 0 auto!important;
    min-width:104px!important;
    max-width:130px!important;
    padding:10px 16px!important;
    white-space:nowrap!important;
  }
}

/* Library select filters: đảm bảo select luôn bấm/chọn được */
.library-search{
  position:relative;
  z-index:2;
}
.library-filter{
  pointer-events:auto!important;
  cursor:pointer!important;
  -webkit-appearance:auto!important;
  appearance:auto!important;
  min-height:48px!important;
}
.library-filter option{
  color:#20342F!important;
}


/* V2.36 - restore desktop container width + add meal filter layout */
@media (min-width:721px){
  .menu-shell{
    max-width:1120px!important;
    width:calc(100% - 64px)!important;
    margin:-42px auto 0!important;
    padding:0 18px 18px!important;
  }
  .page-shell{
    max-width:1180px!important;
    width:calc(100% - 64px)!important;
    margin:0 auto!important;
    padding:18px 18px 28px!important;
  }
  .footer{
    max-width:1180px!important;
    width:calc(100% - 64px)!important;
    margin:24px auto 0!important;
  }
  .main-card,.result-card-shell,.library-card{
    width:100%!important;
    max-width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
  }
  .library-search{
    grid-template-columns:minmax(280px,1fr) minmax(160px,210px) minmax(135px,165px) auto auto!important;
    gap:12px!important;
  }
}
@media (max-width:1100px) and (min-width:721px){
  .library-search{
    grid-template-columns:1fr 1fr auto auto!important;
  }
  .library-search input{grid-column:1/-1!important;}
}
@media (max-width:720px){
  .library-search{
    grid-template-columns:1fr!important;
  }
  .library-search input,
  .library-filter,
  .library-meal-filter,
  .library-search .btn{
    grid-column:auto!important;
    width:100%!important;
  }
}
.library-meal-filter[hidden]{display:none!important;}

/* V2.37 - SEO detail pages */
.library-detail-link{color:var(--primary-dark);text-decoration:none;transition:.18s ease}
.library-detail-link:hover{color:var(--primary);text-decoration:none}
.detail-shell{max-width:1180px;margin:0 auto;padding-top:26px}
.detail-card{padding:28px;border-radius:28px;background:rgba(255,253,248,.96)}
.breadcrumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:18px;color:#5E7380;font-size:14px}
.breadcrumb a{color:var(--primary-dark);text-decoration:none;font-weight:700;background:#EEF8F2;border:1px solid #D6EADF;border-radius:999px;padding:5px 10px}
.breadcrumb a:hover{background:#E0F3EA;color:var(--primary)}
.detail-hero{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:24px;align-items:center;padding:24px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(135deg,#F7FFF9 0%,#FFF9EA 100%);box-shadow:var(--shadow-soft);margin-bottom:18px}
.detail-hero h1{margin:8px 0 10px;color:#0B604A;font-size:34px;line-height:1.15}
.detail-hero p{margin:0;color:#566B7A;font-size:16px;line-height:1.6}
.detail-image-placeholder{width:150px;height:150px;border-radius:32px;border:1px solid #D7EADD;background:radial-gradient(circle at center,#fff 0 46%,#E8F7EF 47%);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 16px 30px rgba(15,107,83,.11)}
.detail-image-placeholder img{width:92px;height:92px;object-fit:contain}
.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}
.detail-main,.detail-side{display:grid;gap:14px}
.detail-section,.detail-side,.detail-empty,.medical-note{border:1px solid var(--border);border-radius:22px;background:#FBFFFD;padding:20px;box-shadow:var(--shadow-soft)}
.detail-section h2,.detail-side h2{margin:0 0 12px;color:#006B51;font-size:20px}
.detail-section p,.detail-side p,.detail-line{margin:0;color:#4E6170;line-height:1.65;font-size:15px}
.detail-line + .detail-line{margin-top:10px}
.detail-line b{color:#152D28}
.detail-empty{text-align:center;padding:42px 20px}
.detail-empty h1{margin:0 0 10px;color:#006B51}
.medical-note{margin-top:18px;background:#FFF9EA;border-color:#EADBAF;color:#665633;font-weight:700}
.detail-body .footer a{display:inline-flex;align-items:center;border-radius:999px;padding:4px 10px;background:#EAF8F2;color:#006B51;text-decoration:none;font-weight:800;border:1px solid #CDE8D8}
.detail-body .footer a:hover{background:#DDF3EA;color:#0B604A}
@media(max-width:900px){.detail-hero{grid-template-columns:1fr}.detail-image-placeholder{width:120px;height:120px}.detail-grid{grid-template-columns:1fr}.detail-hero h1{font-size:27px}}
@media(max-width:720px){.detail-shell{padding:8px 8px 22px!important}.detail-card{padding:14px 12px!important;border-radius:24px}.breadcrumb{font-size:12px;gap:6px}.breadcrumb a{padding:4px 8px}.detail-hero{padding:16px;border-radius:20px;gap:14px}.detail-hero h1{font-size:22px}.detail-hero p{font-size:14px}.detail-image-placeholder{width:84px;height:84px;border-radius:22px}.detail-image-placeholder img{width:58px;height:58px}.detail-section,.detail-side,.detail-empty,.medical-note{padding:16px;border-radius:18px}.detail-section h2,.detail-side h2{font-size:18px}.detail-section p,.detail-side p,.detail-line{font-size:14px}}

/* V2.39 - Detail SEO images */
.detail-image-placeholder img{object-fit:cover;background:#fff}
.detail-image-section img{width:100%;max-height:420px;object-fit:contain;border-radius:18px;border:1px solid var(--border);background:#fff;box-shadow:0 8px 20px rgba(15,107,83,.06)}
.library-thumb{margin:-2px -2px 10px;border-radius:16px;overflow:hidden;border:1px solid var(--border);background:#F1FAF5}
.library-thumb img{width:100%;height:150px;display:block;object-fit:cover}
.detail-section h2 + p{word-break:break-word}
@media(max-width:720px){.library-thumb img{height:130px}.detail-image-section img{max-height:320px}}

/* V2.40 - phân trang kho dữ liệu + bộ đếm truy cập */
.library-pager{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
  margin:22px auto 0;
  padding:12px 10px 2px;
  text-align:center;
}
.library-pager[hidden]{display:none!important;}
.library-pager button{
  min-width:42px;
  min-height:42px;
  border-radius:999px;
  border:1px solid #CDE8D8;
  background:#FFFDF8;
  color:#0F6B53;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(15,107,83,.06);
}
.library-pager button:hover:not(:disabled),
.library-pager button.active{
  background:linear-gradient(135deg,#0F6B53,#1FA67A);
  border-color:#0F6B53;
  color:#fff;
}
.library-pager button:disabled{
  opacity:.45;
  cursor:not-allowed;
  box-shadow:none;
}
.library-pager-dots,
.library-pager-info{
  color:#64748B;
  font-weight:700;
}
.library-pager-info{
  flex-basis:100%;
  margin-top:4px;
  font-size:13px;
}
.library-limit-filter{min-width:140px;}
.footer{flex-wrap:wrap!important;}
.visitor-counter{
  flex:0 0 100%;
  text-align:center;
  margin-top:8px!important;
  color:#0F6B53!important;
  font-weight:800!important;
  display:block!important;
}
@media (min-width:721px){
  .library-search{
    grid-template-columns:minmax(240px,1fr) minmax(150px,185px) minmax(125px,155px) minmax(135px,165px) auto auto!important;
  }
}
@media (max-width:1180px) and (min-width:721px){
  .library-search{
    grid-template-columns:1fr 1fr 1fr!important;
  }
  .library-search input{grid-column:1/-1!important;}
  .library-search .btn{width:100%!important;}
}
@media (max-width:720px){
  .library-limit-filter,
  .library-search input,
  .library-filter,
  .library-meal-filter,
  .library-search .btn{width:100%!important;grid-column:auto!important;}
  .library-pager button{min-width:38px;min-height:38px;}
  .visitor-counter{text-align:left!important;}
}

/* V2.41 - bộ đếm truy cập nằm cùng dòng footer trái, đếm IP + lượt đọc */
.footer .footer-left{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.footer-counter-inline,
.footer-counter-sep{
  color:inherit!important;
  font-weight:inherit!important;
  font-size:inherit!important;
  line-height:inherit!important;
}
.footer-counter-inline{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  margin-left:4px!important;
}
.footer-counter-sep{opacity:.75!important;margin:0 2px!important;}
.visitor-counter{display:none!important;}
@media(max-width:720px){
  .footer .footer-left{display:block!important;}
  .footer-counter-inline{display:inline-flex!important;margin-left:0!important;margin-top:4px!important;}
}

/* V2.45 - detail hero image larger + warning highlight */
.detail-hero{grid-template-columns:minmax(0,1fr) 260px!important;gap:30px!important;align-items:center!important;}
.detail-image-placeholder{width:236px!important;height:176px!important;border-radius:34px!important;background:linear-gradient(135deg,#F3FBF7 0%,#EEF8F2 100%)!important;border:1px solid #CFE8DB!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 18px 34px rgba(15,107,83,.13)!important;}
.detail-image-placeholder img{width:178px!important;height:128px!important;object-fit:cover!important;border-radius:6px!important;background:#fff!important;box-shadow:0 8px 18px rgba(15,107,83,.08)!important;}
.detail-warning{background:linear-gradient(135deg,#FFF1F3 0%,#FFF8F8 100%)!important;border-color:#F1B8C0!important;box-shadow:0 18px 34px rgba(214,69,69,.08)!important;}
.detail-warning h2{color:#9F1D35!important;}
.detail-warning p{color:#5E3942!important;}
@media(max-width:900px){.detail-hero{grid-template-columns:1fr!important}.detail-image-placeholder{width:190px!important;height:150px!important}.detail-image-placeholder img{width:145px!important;height:105px!important}}
@media(max-width:720px){.detail-hero{gap:16px!important}.detail-image-placeholder{width:150px!important;height:120px!important;border-radius:24px!important}.detail-image-placeholder img{width:112px!important;height:82px!important}.detail-warning{padding:16px!important}}

/* V2.46 - clickable library image + wider detail image */
.library-thumb-link{display:block;color:inherit;text-decoration:none;border-radius:16px;outline:none}
.library-thumb-link .library-thumb{transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease}
.library-thumb-link:hover .library-thumb,.library-thumb-link:focus-visible .library-thumb{transform:translateY(-2px);box-shadow:0 12px 26px rgba(15,107,83,.14);border-color:#91D4B6}
.detail-hero{grid-template-columns:minmax(0,1fr) 470px!important;gap:34px!important;align-items:center!important;min-height:235px!important}
.detail-image-placeholder{width:450px!important;height:218px!important;border-radius:36px!important;padding:14px!important;background:linear-gradient(135deg,#F4FCF8 0%,#EEF9F3 100%)!important;border:1px solid #CFE8DB!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.94),0 20px 38px rgba(15,107,83,.13)!important}
.detail-image-placeholder img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:18px!important;background:#fff!important;box-shadow:0 10px 20px rgba(15,107,83,.10)!important}
@media(max-width:1040px){.detail-hero{grid-template-columns:minmax(0,1fr) 380px!important}.detail-image-placeholder{width:360px!important;height:194px!important}}
@media(max-width:900px){.detail-hero{grid-template-columns:1fr!important}.detail-image-placeholder{width:min(100%,520px)!important;height:220px!important;justify-self:center!important}}
@media(max-width:720px){.detail-image-placeholder{width:100%!important;height:185px!important;border-radius:24px!important;padding:10px!important}.detail-image-placeholder img{border-radius:15px!important}}

/* V2.50 - formula detail ingredients table */
.formula-items-section{background:#FFFDF8!important}
.formula-items-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:16px;background:#fff}
.formula-items-table{width:100%;border-collapse:separate;border-spacing:0;min-width:620px;font-size:14px;color:#41524C}
.formula-items-table th,.formula-items-table td{padding:12px 14px;border-bottom:1px solid #E2EEE8;text-align:left;vertical-align:top;line-height:1.45}
.formula-items-table th{background:#F2FAF5;color:#0B604A;font-weight:800;white-space:nowrap}
.formula-items-table tr:last-child td{border-bottom:0}
.formula-items-table td:first-child{width:64px;color:#64748B;font-weight:700}
.formula-items-table td:nth-child(3){width:150px;white-space:nowrap;color:#0B604A;font-weight:700}
.formula-items-note{margin:12px 0 0!important;font-size:13px!important;color:#8A3D08!important;background:#FFF8E6;border:1px solid #F5C76B;border-radius:12px;padding:10px 12px}
@media(max-width:720px){.formula-items-table{min-width:540px;font-size:13px}.formula-items-table th,.formula-items-table td{padding:10px 11px}.formula-items-note{font-size:12px!important}}

/* V2.53 Combined - advanced formula search + ingredient chips */
.library-formula-herb-filter[hidden]{display:none!important;}
.formula-chip-list{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0 8px;align-items:center}
.formula-chip{display:inline-flex;align-items:center;gap:4px;border:1px solid #CDE8D8;background:#F3FBF7;color:#0B604A;border-radius:999px;padding:5px 9px;font-size:12px;line-height:1.2;max-width:100%}
.formula-chip b{font-weight:800;white-space:nowrap}.formula-chip em{font-style:normal;color:#557067;font-weight:700}.formula-chip-more{background:#FFF8E6;border-color:#F5C76B;color:#8A5A05;font-weight:800}
@media (min-width:721px){.library-search{grid-template-columns:minmax(220px,1fr) minmax(150px,180px) minmax(150px,190px) minmax(125px,155px) minmax(135px,165px) auto auto!important;}}
@media (max-width:1180px) and (min-width:721px){.library-search{grid-template-columns:1fr 1fr 1fr!important}.library-search input:first-child{grid-column:1/-1!important}}
@media (max-width:720px){.library-formula-herb-filter{width:100%!important;grid-column:auto!important}.formula-chip-list{gap:6px}.formula-chip{font-size:11px;padding:5px 8px}}


/* V2.54 Big Prescription AI */
.prescription-card,.prescription-list-card{position:relative;overflow:visible}.prescription-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.prescription-grid .full{grid-column:1/-1}.rx-table-head{margin:20px 0 10px}.rx-table-head h3{margin:0 0 6px;color:var(--primary-dark)}.rx-table-wrap{overflow:auto;border:1px solid var(--border);border-radius:18px;background:#fff}.rx-table{width:100%;border-collapse:collapse;min-width:930px}.rx-table th{background:#ECF8F2;color:var(--primary-dark);text-align:left;padding:12px;font-weight:800}.rx-table td{border-top:1px solid var(--border);padding:10px;vertical-align:top}.rx-table input,.rx-table select{width:100%;border:1px solid var(--border);border-radius:13px;padding:10px;background:#fff}.rx-table .rx-order{width:56px;text-align:center}.rx-actions-row{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 18px;align-items:center}.rx-status{margin-top:12px}.rx-substitute-panel{margin-top:18px;padding:16px;border:1px solid var(--border);border-radius:18px;background:#F8FEFB}.rx-sub-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.rx-sub-list{display:grid;gap:12px}.rx-sub-item{border:1px solid var(--border);border-radius:16px;padding:13px;background:#fff}.rx-sub-item p{margin:7px 0;color:var(--muted);line-height:1.45}.rx-score{display:inline-flex;margin-left:8px;padding:3px 8px;border-radius:999px;background:#E7F8EF;color:var(--primary-dark);font-weight:800}.rx-list-layout{display:grid;grid-template-columns:320px 1fr;gap:18px}.rx-saved-list{display:grid;gap:8px;align-content:start}.rx-saved-item{border:1px solid var(--border);border-radius:14px;padding:12px;text-align:left;background:#fff;color:var(--text);cursor:pointer}.rx-saved-item:hover{border-color:var(--primary);box-shadow:0 8px 18px rgba(15,122,90,.1)}.rx-saved-item b,.rx-saved-item span{display:block}.rx-saved-item span{font-size:13px;color:var(--muted);margin-top:4px}.rx-saved-detail{border:1px solid var(--border);border-radius:18px;padding:18px;background:#fff}.rx-output-table{min-width:720px}.library-actions{margin:8px 0 10px}.detail-action-row{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 16px}.herb-tooltip{position:relative;cursor:help;color:var(--primary-dark);border-bottom:1px dotted var(--primary)}.herb-tooltip:hover::after,.herb-tooltip:focus::after{content:attr(data-tooltip);position:absolute;left:0;top:calc(100% + 8px);z-index:30;width:min(360px,86vw);white-space:pre-line;background:#073F31;color:#fff;border-radius:14px;padding:12px 14px;font-weight:500;line-height:1.5;box-shadow:0 16px 38px rgba(0,0,0,.22)}.detail-formula-search .detail-search-form{display:grid;grid-template-columns:1fr auto;gap:10px}.detail-formula-search input{border:1px solid var(--border);border-radius:14px;padding:12px}.detail-search-results{display:grid;gap:8px;margin-top:12px}.detail-search-result{display:block;border:1px solid var(--border);border-radius:14px;padding:10px 12px;text-decoration:none;color:var(--text);background:#fff}.detail-search-result span{display:block;color:var(--muted);font-size:13px;margin-top:3px}.admin-advanced-pager{flex-wrap:wrap;gap:8px}.admin-advanced-pager .active{background:#0F7A5A;color:#fff;border-radius:10px;padding:8px 11px;font-weight:800}.pager-jump{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.pager-jump input{width:86px;border:1px solid var(--border);border-radius:10px;padding:8px}@media(max-width:900px){.prescription-grid{grid-template-columns:1fr}.rx-list-layout{grid-template-columns:1fr}.rx-actions-row{display:grid;grid-template-columns:1fr}.detail-formula-search .detail-search-form{grid-template-columns:1fr}.rx-sub-head{display:block}}@media print{.app-header,.footer,.rx-saved-list,.rx-actions-row,.menu-shell,.detail-action-row,.detail-formula-search{display:none!important}.page-shell,.main-card,.rx-saved-detail{box-shadow:none!important;border:0!important;margin:0!important;padding:0!important}.rx-list-layout{display:block}.rx-table{min-width:0;font-size:13px}}

/* V2.54 Fix1 - UI polish + prescription flow fixes */
@media (min-width:721px){
  .menu-shell{
    max-width:1180px!important;
    padding:0 8px 10px!important;
    overflow:visible!important;
  }
  .app-menu{
    gap:6px!important;
    padding:8px 10px!important;
    overflow-x:hidden!important;
    justify-content:center!important;
    white-space:nowrap!important;
  }
  .menu-link{
    min-width:0!important;
    flex:0 1 auto!important;
    min-height:46px!important;
    padding:8px 12px!important;
    gap:8px!important;
    border-radius:16px!important;
  }
  .menu-link span:last-child{font-size:14px!important;line-height:1.12!important;white-space:nowrap!important;max-width:none!important;}
  .menu-ico{width:30px!important;min-width:30px!important;height:30px!important;padding:0!important;}
  .menu-scroll-btn{display:none!important;}
}
@media (min-width:721px) and (max-width:980px){
  .menu-shell{max-width:960px!important;}
  .menu-link{padding:8px 9px!important;gap:6px!important;}
  .menu-link span:last-child{font-size:13px!important;}
  .menu-ico{width:28px!important;min-width:28px!important;height:28px!important;}
}
.detail-card > .detail-formula-search{margin:12px 0 16px!important;}
.detail-card > .detail-formula-search h2{font-size:18px!important;margin:0 0 10px!important;color:var(--primary-dark)!important;}
.rx-formula-picker-field,.rx-herb-cell{position:relative!important;overflow:visible!important;}
.rx-free-field small{display:block;color:var(--muted);font-size:12px;margin-top:6px;line-height:1.35;}
.rx-free-mode-btn{width:100%;min-width:0!important;}
.rx-suggest-panel{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:80;background:#fff;border:1px solid #CFE8DD;border-radius:14px;box-shadow:0 18px 36px rgba(15,107,83,.18);padding:6px;max-height:310px;overflow:auto;}
.rx-herb-cell .rx-suggest-panel{top:calc(100% - 2px);min-width:260px;}
.rx-suggest-item{width:100%;display:block;text-align:left;border:0;background:#fff;color:var(--text);padding:10px 12px;border-radius:10px;cursor:pointer;}
.rx-suggest-item:hover,.rx-suggest-item:focus{background:#ECF8F2;outline:none;}
.rx-suggest-item b{display:block;color:var(--primary-dark);font-size:14px;}
.rx-suggest-item span{display:block;color:var(--muted);font-size:12px;margin-top:2px;line-height:1.35;}
.rx-suggest-empty{padding:10px 12px;color:var(--muted);font-size:13px;}
.rx-row-actions{display:flex;flex-direction:column;gap:7px;min-width:92px;}
.mini-btn{display:inline-flex!important;align-items:center;justify-content:center;gap:5px;border:1px solid #BFE4D4!important;border-radius:999px!important;background:#ECF8F2!important;color:#0F6B53!important;font-weight:800!important;padding:8px 12px!important;line-height:1!important;cursor:pointer!important;box-shadow:0 6px 14px rgba(15,107,83,.08)!important;transition:.14s ease!important;}
.mini-btn:hover{transform:translateY(-1px);filter:brightness(.98);}
.mini-btn.danger{background:#FFF1F1!important;border-color:#F1BDBD!important;color:#C63A3A!important;box-shadow:none!important;}
.rx-substitute-btn::before{content:'🔎';font-size:12px;}
.rx-remove-row::before{content:'×';font-size:16px;line-height:1;}
.result-prescription-action{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0;}
.result-prescription-action .btn{min-width:180px;}
.result-prescription-action span{color:var(--muted);font-size:13px;}
.print-table{width:100%;border-collapse:collapse;margin-top:6px;}
.print-table th,.print-table td{border:1px solid #999;padding:6px 7px;text-align:left;vertical-align:top;}
.print-table th{background:#f2f2f2;color:#111;}
.rx-prescription-print{font-size:12px;color:#111;}
@media(max-width:900px){
  .rx-row-actions{flex-direction:row;min-width:0;}
  .rx-suggest-panel{position:fixed;left:12px;right:12px;top:auto;bottom:18px;max-height:45vh;}
}


/* V2.54 Fix2 - polish prescription flow, detail herb links, compact table */
@media (min-width:721px){
  .menu-shell{max-width:1210px!important;width:calc(100% - 96px)!important;padding:0 12px 14px!important;}
  .app-menu{gap:4px!important;justify-content:center!important;overflow:visible!important;}
  .menu-scroll-btn{display:none!important;}
  .menu-link{min-height:44px!important;padding:8px 12px!important;gap:7px!important;border-radius:16px!important;font-size:13px!important;flex:0 1 auto!important;}
  .menu-ico{width:32px!important;min-width:32px!important;height:32px!important;}
  .menu-link span:last-child{font-size:13px!important;line-height:1.05!important;}
}
@media (min-width:1020px) and (max-width:1180px){
  .menu-link{padding:7px 9px!important;font-size:12px!important;}
  .menu-ico{width:30px!important;min-width:30px!important;height:30px!important;}
  .menu-link span:last-child{font-size:12px!important;}
}
.detail-title-line{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.detail-title-line h1{margin-right:auto!important;}
.detail-title-line .detail-action-row{margin:4px 0 0!important;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.detail-create-rx-btn,.library-create-rx-btn{font-size:12px!important;line-height:1.1!important;min-height:0!important;padding:8px 12px!important;border-radius:999px!important;box-shadow:0 6px 14px rgba(15,107,83,.09)!important;white-space:nowrap!important;}
.library-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin:0 0 8px;}
.library-title-row h3{margin:0!important;flex:1 1 auto;min-width:0;}
.library-title-row .library-actions{margin:0!important;flex:0 0 auto;}
.formula-items-table-wrap{overflow:visible!important;max-height:none!important;}
.formula-items-table{min-width:0!important;}
.herb-detail-link{color:var(--primary-dark)!important;text-decoration:none!important;font-weight:800!important;}
.herb-detail-link:hover{text-decoration:underline!important;}
.herb-tooltip{position:relative;cursor:pointer;}
.herb-tooltip:hover::after,.herb-tooltip:focus::after{position:absolute!important;z-index:9999!important;left:0!important;top:calc(100% + 10px)!important;width:min(380px,86vw)!important;pointer-events:none!important;}
.prescription-grid{grid-template-columns:minmax(0,1.2fr) minmax(220px,.75fr) minmax(0,1.2fr)!important;}
.rx-free-field .btn{height:46px!important;padding:10px 14px!important;font-size:13px!important;}
.rx-table-wrap{overflow:visible!important;}
.rx-table{min-width:0!important;table-layout:fixed!important;font-size:14px;}
.rx-table th,.rx-table td{padding:8px!important;vertical-align:middle!important;}
.rx-table th:nth-child(1),.rx-table td:nth-child(1){width:58px!important;text-align:center;}
.rx-table th:nth-child(2),.rx-table td:nth-child(2){width:190px!important;}
.rx-table th:nth-child(3),.rx-table td:nth-child(3){width:170px!important;}
.rx-table th:nth-child(4),.rx-table td:nth-child(4){width:118px!important;}
.rx-table th:nth-child(5),.rx-table td:nth-child(5){width:130px!important;}
.rx-table th:nth-child(6),.rx-table td:nth-child(6){width:auto!important;}
.rx-table th:nth-child(7),.rx-table td:nth-child(7){width:162px!important;text-align:center;}
.rx-table input,.rx-table select{height:42px!important;padding:8px 10px!important;border-radius:12px!important;font-size:14px!important;}
.rx-table .rx-order{width:44px!important;min-width:44px!important;text-align:center!important;padding:7px 4px!important;}
.rx-row-actions{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:7px!important;min-width:144px!important;white-space:nowrap!important;}
.rx-row-actions .mini-btn{min-width:0!important;padding:8px 10px!important;font-size:12px!important;}
.rx-suggest-panel{z-index:80!important;}
@media(max-width:900px){
  .prescription-grid{grid-template-columns:1fr!important;}
  .rx-table-wrap{overflow-x:auto!important;}
  .rx-table{min-width:860px!important;}
  .library-title-row,.detail-title-line{display:block;}
  .library-title-row .library-actions,.detail-title-line .detail-action-row{margin-top:8px!important;justify-content:flex-start!important;}
}

/* V2.54 Fix3 - Arial hard reset, compact create Rx, live search, clean prescription row */
html,body,button,input,select,textarea,a,p,span,div,h1,h2,h3,h4,h5,h6,strong,b,label,summary,table,th,td,small,code{font-family:Arial,Helvetica,sans-serif!important;}
.library-create-rx-btn,.detail-create-rx-btn{font-size:11.5px!important;padding:6px 10px!important;border-radius:999px!important;min-height:0!important;white-space:nowrap!important;}
.library-title-row{align-items:center!important;}
.detail-title-line{align-items:center!important;}
.detail-formula-search{position:relative!important;margin-top:0!important;margin-bottom:16px!important;padding:16px!important;}
.detail-search-form{position:relative!important;display:grid!important;grid-template-columns:minmax(0,1fr) 116px!important;gap:8px!important;align-items:center!important;}
.detail-search-form input{height:44px!important;}
.detail-search-form .btn{min-height:44px!important;height:44px!important;padding:9px 12px!important;}
.detail-search-results{position:absolute!important;left:16px!important;right:140px!important;top:94px!important;z-index:60!important;background:#fff!important;border:1px solid #CFE8DD!important;border-radius:14px!important;box-shadow:0 16px 32px rgba(15,107,83,.16)!important;overflow:hidden!important;max-height:320px!important;overflow-y:auto!important;}
.detail-search-results:empty,.detail-search-results[hidden]{display:none!important;}
.detail-search-result{display:block!important;padding:10px 12px!important;text-decoration:none!important;color:var(--text)!important;border-bottom:1px solid #EEF6F2!important;background:#fff!important;}
.detail-search-result:hover{background:#ECF8F2!important;}
.detail-search-result b{display:block!important;color:var(--primary-dark)!important;font-size:14px!important;}
.detail-search-result span,.detail-search-hint{display:block!important;color:var(--muted)!important;font-size:12px!important;line-height:1.35!important;padding:10px 12px!important;}
.rx-table{min-width:0!important;table-layout:fixed!important;font-size:13px!important;}
.rx-table th,.rx-table td{padding:7px 6px!important;}
.rx-table th:nth-child(1),.rx-table td:nth-child(1){width:42px!important;max-width:42px!important;text-align:center!important;}
.rx-table th:nth-child(2),.rx-table td:nth-child(2){width:190px!important;}
.rx-table th:nth-child(3),.rx-table td:nth-child(3){width:160px!important;}
.rx-table th:nth-child(4),.rx-table td:nth-child(4){width:108px!important;}
.rx-table th:nth-child(5),.rx-table td:nth-child(5){width:126px!important;}
.rx-table th:nth-child(6),.rx-table td:nth-child(6){width:auto!important;}
.rx-table th:nth-child(7),.rx-table td:nth-child(7){width:150px!important;}
.rx-table .rx-order{width:34px!important;min-width:34px!important;height:38px!important;padding:5px 2px!important;font-size:13px!important;}
.rx-table input,.rx-table select{height:39px!important;min-height:39px!important;padding:7px 9px!important;font-size:13px!important;border-radius:11px!important;}
.rx-row-actions{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-width:0!important;white-space:nowrap!important;}
.rx-row-actions .mini-btn{font-size:12px!important;padding:7px 9px!important;min-height:34px!important;height:34px!important;}
.rx-substitute-btn::before{content:'🔎';font-size:11px!important;}
.rx-remove-row::before{font-size:14px!important;}
.rx-suggest-panel{top:calc(100% + 3px)!important;}
.rx-herb-cell .rx-suggest-panel{top:calc(100% + 4px)!important;min-width:260px!important;}
@media(max-width:900px){.detail-search-results{left:16px!important;right:16px!important;top:94px!important}.rx-table{min-width:820px!important}.rx-table-wrap{overflow-x:auto!important}}


/* V2.54 Fix6 - global typography and compact search/cards */
html, body, button, input, select, textarea, a, p, span, div, h1, h2, h3, h4, h5, h6, strong, b, label, small, table, th, td { font-family: Arial, Helvetica, sans-serif !important; }
.library-formula-herb-filter{display:none!important;}
.library-item .detail-line:has(b){font-size:13px;line-height:1.36;}
.library-item .formula-chip-list{margin-top:6px;gap:5px;}
.library-item .formula-chip{font-size:11.5px;padding:4px 9px;border-radius:999px;line-height:1.2;}
.library-title-row h3{font-family:Arial,Helvetica,sans-serif!important;}
.detail-search-form{position:relative;}
.detail-search-results{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:25;background:#fff;border:1px solid #cfe7dc;border-radius:16px;box-shadow:0 14px 28px rgba(15,107,83,.12);overflow:hidden;}
.detail-search-result{display:block;padding:10px 14px;text-decoration:none;color:#244b63;border-bottom:1px solid #eef6f2;background:#fff;}
.detail-search-result:hover{background:#effbf5;color:#006b55;}
.detail-search-hint{padding:10px 14px;background:#fff;color:#6a7b8a;}
.rx-table th:nth-child(1),.rx-table td:nth-child(1){width:44px;min-width:44px;}
.rx-table th:nth-child(2),.rx-table td:nth-child(2){min-width:190px;}
.rx-table th:nth-child(4),.rx-table td:nth-child(4){min-width:118px;}
.rx-table th:nth-child(6),.rx-table td:nth-child(6){min-width:150px;max-width:170px;}
.rx-table .rx-note{min-width:140px;}
.rx-row-actions{display:flex;flex-direction:row;align-items:center;gap:6px;white-space:nowrap;}
.rx-row-actions .mini-btn{min-height:34px;padding:7px 10px;font-size:12px;}
@media (min-width:900px){.rx-table{table-layout:auto}.rx-table-wrap{overflow-x:visible}.rx-table input,.rx-table select{font-size:13px;padding-left:10px;padding-right:10px}}

/* V2.54 Fix7 - font, button width, footer counter polish */
html, body, button, input, select, textarea,
.library-item, .library-item *,
.library-item .formula-chip, .library-item .formula-chip *,
.mini-btn, .rx-substitute-btn, .rx-table, .rx-table *,
.rx-prescription-print, .rx-prescription-print *,
.footer, .footer *{
  font-family: Arial, Helvetica, sans-serif !important;
}
.library-create-rx-btn,
.detail-create-rx-btn{
  width:auto!important;
  min-width:0!important;
  max-width:max-content!important;
  padding:6px 13px!important;
  line-height:1.1!important;
  display:inline-flex!important;
}
.detail-action-row{align-items:center!important;}
.footer-counter-inline{gap:8px!important;}
.footer-counter-space::before{content:'';display:inline-block;width:8px;}
.prescriber-signature{margin-top:26px;display:flex;justify-content:flex-end;page-break-inside:avoid;}
.prescriber-signature-box{min-width:230px;text-align:center;line-height:1.55;}
.prescriber-signature-box .sig-name{margin-top:56px;border-top:1px dotted #777;padding-top:6px;color:#333;}
@media print{.prescriber-signature{margin-top:30px;}}

/* V2.54 Fix11 - force regular Arial for formula chips and create-prescription buttons */
.library-item .formula-chip,
.formula-chip,
.herb-chip,
.library-item .btn-prescription,
.library-item .create-rx-btn,
.library-item .mini-btn,
.create-rx-btn,
.btn-prescription,
a[href*="ke-don-ai.html"].mini-btn,
a[href*="ke-don-ai.html"].create-rx-btn,
a[href*="ke-don-ai.html"].btn-prescription {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}

.library-item .formula-chip strong,
.formula-chip strong,
.herb-chip strong,
.library-item .formula-chip b,
.formula-chip b,
.herb-chip b {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
}

.library-item .formula-chip *,
.formula-chip *,
.herb-chip * {
    font-family: Arial, Helvetica, sans-serif !important;
}

.library-item .formula-chip .dose,
.formula-chip .dose,
.herb-chip .dose {
    font-weight: 400 !important;
}

/* Keep the button compact but not bold */
.library-item a[title="Tạo đơn từ bài thuốc này"],
.detail-hero a[title="Tạo đơn từ bài thuốc này"] {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
    padding-inline: 14px !important;
    min-width: auto !important;
    width: auto !important;
}

/* V2.54 Fix12 - herb info tooltip on formula chips in Kho bài thuốc */
.library-item,
.formula-chip-list,
.formula-chip {
    overflow: visible !important;
}

.library-herb-tooltip {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    color: #0B604A !important;
    border-bottom: 1px dotted #0F7A5A;
    position: relative;
}

.library-herb-tooltip .formula-chip-herb-name {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
}

.formula-chip .library-herb-tooltip:hover::after,
.formula-chip .library-herb-tooltip:focus::after {
    left: 0;
    top: calc(100% + 9px);
    z-index: 9999;
    width: min(380px, 86vw);
    white-space: pre-line;
    pointer-events: none;
}

.formula-chip em {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
}

/* V2.60 - Advanced herb substitution rule UI */
.rx-sub-list-v260{display:grid;gap:12px;margin-top:12px}
.rx-sub-list-v260 .rx-sub-item{border:1px solid var(--border);border-radius:16px;background:#fff;padding:14px;box-shadow:0 8px 22px rgba(15,122,90,.06)}
.rx-sub-list-v260 .rx-sub-item.rx-sub-caution{border-color:#F5C2C7;background:#FFF8F8}
.rx-sub-title{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:8px}
.rx-sub-title b{font-family:Arial,Helvetica,sans-serif;font-weight:700;color:#064E3B}
.rx-sub-badges{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 8px}
.rx-sub-badges span{font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:400;border:1px solid #CDE8D8;background:#F3FBF7;color:#0B604A;border-radius:999px;padding:4px 8px}
.rx-score-breakdown{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 12px}
.rx-score-breakdown span{font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:400;border:1px solid #E3E8EF;background:#F8FAFC;color:#334155;border-radius:999px;padding:4px 8px}
.rx-score-breakdown b{font-weight:700;color:#0B604A}
.rx-sub-warning{border-left:3px solid #E11D48;background:#FFF1F2;padding:8px 10px;border-radius:10px;color:#9F1239}
.rx-sub-head small{display:block;color:var(--muted);margin-top:4px;font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:400}

/* V2.60 Fix1 - Friendly Substitute UI */
.rx-sub-list-friendly .rx-sub-title{
    align-items:center;
    gap:10px;
}
.rx-sub-list-friendly .rx-score{
    font-family:Arial, Helvetica, sans-serif !important;
    font-weight:600;
    white-space:nowrap;
}
.rx-friendly-reason{
    margin:10px 0;
    color:#34556A;
    line-height:1.55;
}
.rx-friendly-reason ul{
    margin:7px 0 0 18px;
    padding:0;
}
.rx-friendly-reason li{
    margin:3px 0;
}
.rx-quick-info{
    color:#244B5D;
}
.rx-score-technical{
    margin:10px 0 12px;
}
.rx-score-technical summary{
    cursor:pointer;
    color:#0B604A;
    font-weight:600;
    font-family:Arial, Helvetica, sans-serif !important;
}
.rx-score-technical[open] summary{
    margin-bottom:8px;
}
.rx-score-breakdown{
    opacity:.92;
}

/* V2.60 Fix2 - dosage number stepper */
.rx-dose-stepper{
  display:flex;
  align-items:center;
  gap:6px;
  width:100%;
  border:1px solid var(--border);
  border-radius:13px;
  padding:0 10px;
  background:#fff;
}
.rx-dose-stepper:focus-within{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(15,122,90,.12);
}
.rx-dose-stepper .rx-dose{
  border:0!important;
  box-shadow:none!important;
  padding:10px 0!important;
  min-width:58px;
  background:transparent!important;
  font-family:Arial, Helvetica, sans-serif!important;
}
.rx-dose-stepper .rx-dose:focus{outline:none!important}
.rx-dose-unit{
  color:#0B604A;
  font-weight:700;
  font-family:Arial, Helvetica, sans-serif!important;
  white-space:nowrap;
}
.rx-table td:nth-child(3){min-width:150px}
@media(max-width:720px){.rx-dose-stepper .rx-dose{min-width:72px}}

/* V2.60 Fix3 - compact dosage stepper and patient label polish */
.rx-table .rx-dose-stepper{
    width:94px !important;
    min-width:94px !important;
    max-width:94px !important;
    display:flex !important;
    align-items:center !important;
    gap:4px !important;
}
.rx-table .rx-dose-stepper .rx-dose{
    width:64px !important;
    min-width:64px !important;
    max-width:64px !important;
    text-align:center !important;
    padding:9px 4px !important;
}
.rx-table .rx-dose-unit{
    flex:0 0 auto !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-weight:600 !important;
}
.rx-table th:nth-child(3),
.rx-table td:nth-child(3){
    width:112px !important;
    min-width:112px !important;
    max-width:112px !important;
}

/* V2.61 Fix1 - Mobile prescription saved list/detail layout */
#don-thuoc.prescription-list-card{
    overflow:hidden;
}
#don-thuoc .section-title{
    max-width:100%;
}
#don-thuoc .section-title h2,
#don-thuoc .section-title p{
    word-break:break-word;
}
.rx-saved-detail,
.rx-printable{
    max-width:100%;
    min-width:0;
    overflow-x:auto;
    box-sizing:border-box;
}
.rx-printable h1,
.rx-printable h2,
.rx-printable h3,
.rx-printable p{
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:break-word;
}
.rx-printable h2{
    font-size:clamp(22px, 4vw, 32px);
    line-height:1.25;
    margin:0 0 14px;
}
.rx-printable p{
    font-size:15px;
    line-height:1.55;
}
.rx-output-table{
    width:100%;
    max-width:100%;
    min-width:0 !important;
    border-collapse:collapse;
    table-layout:auto;
}
.rx-output-table th,
.rx-output-table td{
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
}

@media(max-width:900px){
    .rx-list-layout{
        grid-template-columns:1fr !important;
        gap:14px !important;
    }
    .rx-saved-detail{
        padding:14px !important;
        border-radius:16px !important;
    }
    .rx-output-table{
        font-size:14px;
    }
    .rx-output-table th,
    .rx-output-table td{
        padding:9px 8px;
    }
}

@media(max-width:720px){
    #don-thuoc.prescription-list-card{
        padding:14px 10px !important;
        border-radius:20px !important;
    }
    #don-thuoc .section-title{
        text-align:center;
        margin-bottom:14px;
    }
    #don-thuoc .section-title h2{
        font-size:22px !important;
        line-height:1.25 !important;
    }
    #don-thuoc .section-title p{
        font-size:15px !important;
        line-height:1.45 !important;
        max-width:320px;
        margin:8px auto 0 !important;
    }
    .rx-saved-list{
        padding:10px !important;
        border-radius:16px !important;
    }
    .rx-saved-item{
        padding:12px 14px !important;
        border-radius:16px !important;
    }
    .rx-saved-item b{
        font-size:17px !important;
        line-height:1.25 !important;
    }
    .rx-saved-item span{
        font-size:13px !important;
        line-height:1.35 !important;
    }
    .rx-saved-detail{
        padding:12px !important;
        margin-top:12px !important;
        border-radius:18px !important;
        overflow-x:hidden !important;
    }
    .rx-printable{
        padding:0 !important;
        overflow-x:hidden !important;
    }
    .rx-printable h2{
        font-size:24px !important;
        line-height:1.22 !important;
    }
    .rx-printable p{
        font-size:14px !important;
        line-height:1.5 !important;
        margin:8px 0 !important;
    }
    .rx-output-table{
        display:block;
        width:100%;
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
        font-size:13px !important;
        border-radius:12px;
    }
    .rx-output-table thead,
    .rx-output-table tbody,
    .rx-output-table tr{
        width:100%;
    }
    .rx-output-table th,
    .rx-output-table td{
        padding:8px 7px !important;
        line-height:1.35 !important;
    }
    .rx-output-table th:nth-child(1),
    .rx-output-table td:nth-child(1){
        width:42px;
        min-width:42px;
        text-align:center;
    }
    .rx-output-table th:nth-child(2),
    .rx-output-table td:nth-child(2){
        min-width:118px;
    }
    .rx-output-table th:nth-child(3),
    .rx-output-table td:nth-child(3){
        min-width:72px;
        text-align:right;
        white-space:nowrap;
    }
    .rx-actions-row{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:10px !important;
    }
    .rx-actions-row .btn{
        width:100% !important;
    }
}

@media(max-width:420px){
    #don-thuoc .section-title h2{
        font-size:20px !important;
    }
    #don-thuoc .section-title p{
        font-size:14px !important;
    }
    .rx-printable h2{
        font-size:22px !important;
    }
    .rx-printable p{
        font-size:13.5px !important;
    }
    .rx-output-table{
        font-size:12.5px !important;
    }
}