/* Kiểu chung của các trang dựng sẵn — cùng bảng màu với index.html. */
:root{
  --red:#C40610; --red-dark:#8E0A12; --gold:#D99A0B; --gold-soft:#F5E3B8; --gold-ink:#7A5200;
  --paper:#F3E7DA; --card:#FFFDF8; --ink:#2B1B14; --muted:#6E5A50;
  --line:#E4D3C2; --green:#166B45; --green-soft:#D8EFE2; --rose:#FBE4E2;
  --radius:16px; --shadow:0 8px 24px rgba(90,40,20,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);line-height:1.65;
  font-family:"Segoe UI",Roboto,-apple-system,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--red-dark)}
img{max-width:100%;height:auto}
.wrap{max-width:1000px;margin:0 auto;padding:0 16px}
.narrow{max-width:780px}

/* header */
.site-head{position:sticky;top:0;z-index:20;background:rgba(243,231,218,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:14px;min-height:60px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:17px;text-decoration:none;color:var(--ink);white-space:nowrap}
.brand img{width:32px;height:32px;border-radius:8px}
.nav-links{margin-left:auto;display:flex;gap:18px;font-size:15px;align-items:center}
.nav-links a{color:var(--muted);text-decoration:none}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--red)}
.nav-links .nav-cta{background:var(--red);color:#fff;padding:7px 14px;border-radius:10px;font-weight:700}
.nav-links .nav-cta:hover{background:var(--red-dark);color:#fff}
.menu-toggle{display:none;margin-left:auto;background:none;border:1px solid var(--line);border-radius:10px;padding:6px 10px;font-size:15px;color:var(--ink)}
@media(max-width:820px){
  .menu-toggle{display:block}
  .nav{flex-wrap:wrap}
  .nav-links{display:none;width:100%;flex-direction:column;align-items:flex-start;gap:10px;padding:6px 0 14px;margin-left:0}
  .menu-open .nav-links{display:flex}
}

/* chung */
main{padding:22px 0 40px}
.crumbs{font-size:13.5px;color:var(--muted);margin:0 0 10px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li+li::before{content:"›";margin-right:6px;color:#B9A69A}
.crumbs a{color:var(--muted)}
h1{font-size:clamp(25px,4.2vw,36px);line-height:1.2;margin:4px 0 8px;letter-spacing:-.3px}
h2{font-size:clamp(19px,2.6vw,23px);margin:30px 0 10px;line-height:1.3}
h3{font-size:17px;margin:22px 0 8px}
.lead{font-size:17px;color:var(--muted);margin:0 0 18px}
.muted{color:var(--muted)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.cards{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.cards a.card{text-decoration:none;color:var(--ink);display:block}
.cards a.card:hover{border-color:#D9B7AE}
.cards .card b{display:block;font-size:16px;margin-bottom:4px}
.cards .card span{color:var(--muted);font-size:14.5px}
.links{padding-left:20px}
.links li{margin:4px 0}
.pager{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:26px 0 0}
.pager a{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:9px 14px;text-decoration:none;font-weight:600}
.btn-link{font-weight:700}
.disclaimer{font-size:13.5px;color:var(--muted);margin-top:18px}
.error{color:var(--red-dark);font-weight:600}
.big{font-size:17px;margin:6px 0}
.cols{display:grid;gap:18px;grid-template-columns:1fr 1fr}
@media(max-width:760px){.cols{grid-template-columns:1fr}}
table.list{width:100%;border-collapse:collapse;background:var(--card);border-radius:12px;overflow:hidden;font-size:15px}
table.list th,table.list td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
table.list th{background:#F7EDE2;font-size:13.5px;color:var(--muted)}
.scroll{overflow-x:auto}

/* tờ lịch một ngày */
.bloc{display:flex;background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);max-width:520px}
.bloc>div{flex:1;padding:16px 10px;text-align:center;display:flex;flex-direction:column;gap:2px}
.bloc b{font-family:Georgia,"Times New Roman",serif;font-size:64px;line-height:1;margin:4px 0}
.bloc-solar b{color:var(--red)}
.bloc-lunar{background:var(--gold-soft);color:var(--gold-ink)}
.bloc-cap{font-size:11px;letter-spacing:2px;font-weight:700;opacity:.8}
.holiday-line{color:var(--red);font-weight:700;margin:12px 0 0}
.greeting{color:var(--gold-ink);font-style:italic;margin:4px 0 0}
.trad{font-weight:600;margin:14px 0 8px}
table.facts{border-collapse:collapse;background:var(--card);border-radius:12px;overflow:hidden;width:100%;max-width:520px;font-size:15px}
table.facts th,table.facts td{border-bottom:1px solid var(--line);padding:7px 10px;text-align:left}
table.facts th{width:90px;color:var(--muted);font-weight:600}
ul.hours{list-style:none;padding:0;margin:0;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
ul.hours li{border-radius:10px;padding:8px 10px;font-size:14.5px}
.hours-good li{background:var(--green-soft);color:var(--green)}
.hours-bad li{background:#EFE6DE;color:var(--muted)}
ul.hours li.now{outline:2px solid var(--red);font-weight:700}
.rating{display:inline-block;padding:4px 12px;border-radius:999px;margin:0 0 6px}
.rating.good{background:var(--green-soft);color:var(--green)}
.rating.normal{background:#EFE6DE;color:var(--muted)}
.rating.bad{background:var(--rose);color:var(--red-dark)}
.reasons{padding-left:20px;margin:6px 0}
.todo{display:grid;gap:12px;grid-template-columns:1fr 1fr;margin-top:10px}
@media(max-width:600px){.todo{grid-template-columns:1fr}}
.todo>div{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.todo p{margin:4px 0 0;color:var(--muted)}
.todo-yes b{color:var(--green)}
.todo-no b{color:var(--red-dark)}

/* lưới tháng */
table.grid-month{width:100%;border-collapse:separate;border-spacing:4px;table-layout:fixed}
table.grid-month th{font-size:13px;color:var(--muted);padding:4px 0}
table.grid-month td{background:var(--card);border:1px solid var(--line);border-radius:10px;text-align:center;padding:0;height:58px}
table.grid-month td.empty{background:transparent;border:none}
table.grid-month td a,table.grid-month td>b{display:block;text-decoration:none;color:inherit;padding:6px 0}
table.grid-month td b{display:block;font-size:18px}
table.grid-month td small{display:block;font-size:12px;color:var(--muted)}
table.grid-month td.sun b{color:var(--red)}
table.grid-month td.l1 small,table.grid-month td.l15 small{color:var(--gold-ink);font-weight:800}
table.grid-month td.hol{background:#FDF0EE;border-color:#F0C9C6}
table.grid-month td.today{background:var(--red);border-color:var(--red)}
table.grid-month td.today b,table.grid-month td.today small{color:#fff}
@media(max-width:480px){table.grid-month td{height:50px}table.grid-month td b{font-size:16px}}
.months{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.months a{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;text-decoration:none;text-align:center;font-weight:600}

/* biểu mẫu */
form.tool{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
form.tool label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--muted);font-weight:600}
form.tool input,form.tool select{font:inherit;font-size:16px;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);min-width:0}
form.tool input[type=number]{width:110px}
form.tool label.check{flex-direction:row;align-items:center;padding-bottom:10px}
form.tool button,.btn{font:inherit;font-weight:700;background:var(--red);color:#fff;border:none;border-radius:10px;padding:10px 18px;cursor:pointer;text-decoration:none;display:inline-block}
form.tool button:hover,.btn:hover{background:var(--red-dark)}
.chips{display:flex;flex-wrap:wrap;gap:6px;width:100%}
.chips button{background:var(--rose);color:var(--red-dark);padding:5px 10px;font-size:14px}
.chips button:hover{background:#F6CFCB}
.result{margin-top:14px}
.result-head{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin-bottom:14px}

/* đếm ngược */
.countdown{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}
.countdown div{background:var(--red);color:#fff;border-radius:14px;padding:12px 6px;min-width:82px;text-align:center}
.countdown b{display:block;font-size:38px;line-height:1.1;font-family:Georgia,serif}
.countdown span{font-size:13px;opacity:.9}

/* văn khấn */
.prayer p{margin:0 0 10px;font-size:17px;line-height:1.8}
.prayer{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px}
.offer{padding-left:20px}

/* lời mời tải app */
.app-cta{display:flex;gap:16px;align-items:center;background:var(--card);border:1px solid #E7CE8E;border-radius:var(--radius);padding:16px 18px;margin:30px 0 0;box-shadow:var(--shadow)}
.app-cta img{width:56px;height:56px;border-radius:14px;flex:none}
.app-cta p{margin:2px 0 8px;color:var(--muted);font-size:15px}
.app-cta b{font-size:17px}
@media(max-width:520px){.app-cta{flex-direction:column;align-items:flex-start}}

/* faq */
details{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-bottom:8px}
details summary{cursor:pointer;font-weight:700}
details p{color:var(--muted);margin:8px 0 0}

/* footer */
.site-foot{background:#2B1B14;color:#E9DCD1;padding:34px 0 26px;margin-top:20px;font-size:15px}
.site-foot a{color:#F5D9A8}
.fgrid{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.fgrid strong{display:block;margin-bottom:6px;color:#fff}
.site-foot small{display:block;margin-top:22px;color:#B9A093}