/*! Benri Calendar China 2027 — styles (scoped to .bcc) */

.bcc{
  --page:#fff; --card:#fff; --soft:#fdf6f4; --soft2:#f7ecea;
  --text:#1f2430; --muted:#6b7280; --border:#f0dfdb;
  --main:#9b1c26; --main2:#c2323d; --on-main:#fff;
  --gold:#b8860b; --gold-bg:#fdf6e3;
  --red:#c0262f; --red-bg:#fdeeef;
  --blue:#1f5f8b; --blue-bg:#eef6ff;
  --green:#0f7a52; --green-bg:#eafaf3;
  --shadow:0 14px 34px rgba(155,28,38,.10);
  --shadow-sm:0 8px 20px rgba(155,28,38,.06);
  max-width:1280px; margin:0 auto; padding:14px;
  color:var(--text);
  background:linear-gradient(180deg,#fffdfb,#fdf7f6 40%,#fff);
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",system-ui,sans-serif;
  font-size:16px; line-height:1.75;
  word-break:auto-phrase;
}
.bcc *,.bcc *::before,.bcc *::after{box-sizing:border-box}
.bcc a{color:var(--main)}
.bcc a:focus-visible,.bcc button:focus-visible,.bcc summary:focus-visible,.bcc select:focus-visible,.bcc [tabindex="0"]:focus-visible{
  outline:3px solid var(--gold); outline-offset:3px; border-radius:6px;
}
.bcc-muted{color:var(--muted)}

/* ------------------------------------------------------------ hero */
.bcc-hero{
  position:relative; overflow:hidden;
  padding:26px 20px; border-radius:26px;
  color:#fff; background:
    radial-gradient(circle at 86% 12%,rgba(255,196,0,.28),transparent 34%),
    linear-gradient(135deg,var(--main),var(--main2));
  box-shadow:var(--shadow);
}
.bcc-hero::before{
  content:"羊"; position:absolute; right:22px; bottom:-48px;
  font-size:170px; font-weight:900; line-height:1; opacity:.09;
}
.bcc-hero-grid{position:relative; z-index:1; display:grid; gap:18px}
.bcc-pill{
  display:inline-flex; padding:6px 13px; border-radius:999px;
  border:1px solid rgba(255,255,255,.4); background:rgba(255,255,255,.16);
  color:#fff; font-size:12px; font-weight:800;
}
.bcc-hero h1{margin:12px 0 0; color:#fff; font-size:clamp(25px,6vw,42px); font-weight:900; line-height:1.2}
.bcc-hero p{max-width:820px; margin:12px 0 0; color:#fff; font-size:14px; opacity:.95}
.bcc-yearcard{
  padding:18px; border-radius:20px; text-align:center;
  border:1px solid rgba(255,255,255,.34); background:rgba(255,255,255,.16);
  backdrop-filter:blur(8px);
}
.bcc-yearcard small{display:block; color:#fff; font-size:12px; font-weight:800; opacity:.9}
.bcc-yearmain{color:#fff; font-size:27px; font-weight:900; line-height:1.25; margin-top:4px}
.bcc-yearsub{color:#fff; font-size:13px; font-weight:700; margin-top:4px; opacity:.92}
.bcc-today{
  position:relative; z-index:1; margin:16px 0 0; padding:10px 14px;
  border-radius:14px; background:rgba(0,0,0,.18); color:#fff;
  font-size:13.5px; font-weight:700;
}

/* ------------------------------------------------------------ nav + stats */
.bcc-nav{
  display:flex; flex-wrap:wrap; gap:8px; margin:14px 0;
  padding:10px; border:1px solid var(--border); border-radius:18px;
  background:rgba(255,255,255,.96); box-shadow:var(--shadow-sm);
}
.bcc-nav a{
  display:inline-flex; align-items:center; min-height:36px; padding:6px 13px;
  border:1px solid var(--border); border-radius:999px;
  background:#fff; color:var(--text); font-size:12.5px; font-weight:800; text-decoration:none;
}
.bcc-nav a:hover{border-color:var(--main); background:var(--main); color:var(--on-main)}

.bcc-stats{display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(152px,1fr)); margin-bottom:16px}
.bcc-stat{
  padding:13px 14px; border:1px solid var(--border); border-radius:16px;
  background:linear-gradient(180deg,#fff,var(--soft)); box-shadow:var(--shadow-sm);
}
.bcc-stat small{display:block; color:var(--muted); font-size:11.5px; font-weight:800}
.bcc-stat strong{display:block; margin-top:3px; color:var(--main); font-size:19px; font-weight:900; line-height:1.25}
.bcc-stat span{display:block; margin-top:3px; color:var(--muted); font-size:11.5px; line-height:1.5}

/* ------------------------------------------------------------ sections */
.bcc-section{
  margin-bottom:16px; padding:16px;
  border:1px solid var(--border); border-radius:22px;
  background:rgba(255,255,255,.97); box-shadow:var(--shadow);
  content-visibility:auto; contain-intrinsic-size:auto 600px;
}
.bcc-head{margin-bottom:12px}
.bcc-head h2{margin:0; color:var(--main); font-size:21px; font-weight:900; line-height:1.35}
.bcc-head p{margin:6px 0 0; color:var(--muted); font-size:13px}
.bcc-section h3{color:var(--main); font-size:15px; font-weight:900}

.bcc-note{
  margin-top:13px; padding:13px 15px;
  border-left:5px solid var(--main2); border-radius:14px;
  background:var(--soft); color:#3b4150; font-size:13px;
}
.bcc-note-warn{border-left-color:var(--gold); background:var(--gold-bg)}
.bcc-note strong{color:var(--main)}

/* ------------------------------------------------------------ calendar */
.bcc-monthjump{display:flex; flex-wrap:wrap; gap:7px; margin-bottom:12px}
.bcc-monthjump a{
  min-width:46px; padding:6px 10px; border:1px solid var(--border); border-radius:999px;
  background:#fff; color:var(--main); font-size:12px; font-weight:900; text-align:center; text-decoration:none;
}
.bcc-monthjump a:hover{background:var(--main); color:var(--on-main)}

.bcc-legend{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px}
.bcc-key{
  display:inline-flex; align-items:center; gap:6px; padding:4px 10px;
  border:1px solid var(--border); border-radius:999px; background:#fff;
  font-size:11.5px; font-weight:700;
}
.bcc-key::before{content:""; width:11px; height:11px; border-radius:4px; background:var(--border)}
.bcc-key-stat::before{background:var(--red)}
.bcc-key-shuo::before{background:var(--gold)}
.bcc-key-wang::before{background:var(--blue)}
.bcc-key-sun::before{background:var(--red-bg); border:1px solid var(--red)}
.bcc-key-sat::before{background:var(--blue-bg); border:1px solid var(--blue)}

.bcc-grid{display:grid; gap:14px}
.bcc-month{overflow:hidden; border:1px solid var(--border); border-radius:18px; background:#fff}
.bcc-month-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 13px; color:#fff; background:linear-gradient(135deg,var(--main),var(--main2));
}
.bcc-month-head h3{margin:0; color:#fff; font-size:17px; font-weight:900}
.bcc-month-head span{color:#fff; font-size:11.5px; font-weight:800; opacity:.92}
.bcc-month-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch}
.bcc-cal{width:100%; min-width:322px; border-collapse:collapse; table-layout:fixed}
.bcc-cal caption{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.bcc-cal th{
  padding:7px 2px; border-bottom:1px solid var(--border);
  background:var(--soft); color:#4a5568; font-size:11.5px; font-weight:900;
}
.bcc-cal th:first-child{color:var(--red)}
.bcc-cal th:last-child{color:var(--blue)}
.bcc-cal td{
  height:62px; padding:3px 2px; border:1px solid #f6ecea;
  background:#fff; color:var(--text); font-size:12px; text-align:center; vertical-align:top;
}
.bcc-cal time{
  display:inline-flex; align-items:center; justify-content:center;
  width:23px; height:23px; border-radius:50%; font-weight:900;
}
.bcc-lunar{display:block; margin-top:1px; color:var(--muted); font-size:9px; line-height:1.15}
.bcc-fest{display:block; color:var(--red); font-size:8.5px; font-weight:900; line-height:1.1; overflow-wrap:anywhere}
.bcc-term{display:block; color:var(--gold); font-size:8.5px; font-weight:800; line-height:1.1}
.bcc-cal .bcc-sun{color:var(--red); background:#fffafa}
.bcc-cal .bcc-sat{color:var(--blue); background:#fafcff}
.bcc-cal .bcc-stat{background:var(--red-bg)}
.bcc-cal .bcc-stat time{background:var(--red); color:#fff}
.bcc-cal .bcc-shuo .bcc-lunar{color:var(--gold); font-weight:900}
.bcc-cal .bcc-wang .bcc-lunar{color:var(--blue); font-weight:900}
.bcc-cal .bcc-empty{background:#fbfafa}
.bcc-cal td[data-cell]{cursor:pointer}
.bcc-cal td[data-cell]:hover{outline:2px solid var(--main2); outline-offset:-2px}
.bcc-cal td.is-today{box-shadow:inset 0 0 0 3px var(--gold)}
.bcc-month-link{padding:8px 12px 11px; border-top:1px solid var(--border)}
.bcc-month-link a{color:var(--main); font-size:11.5px; font-weight:900; text-decoration:none}
.bcc-month-link a:hover{text-decoration:underline}

/* ------------------------------------------------------------ tables */
.bcc-table-wrap{overflow-x:auto; border:1px solid var(--border); border-radius:16px; -webkit-overflow-scrolling:touch}
.bcc-table{width:100%; min-width:600px; border-collapse:collapse}
.bcc-table th,.bcc-table td{
  padding:9px 11px; border-bottom:1px solid var(--border);
  font-size:13px; text-align:left; vertical-align:top;
}
.bcc-table thead th{background:var(--soft); color:#374151; font-weight:900; white-space:nowrap}
.bcc-table tbody th[scope="row"]{background:#fff; font-weight:900; white-space:nowrap}
.bcc-table tbody th[scope="row"] small{display:block; color:var(--muted); font-size:11px; font-weight:600}
.bcc-table tr:last-child td,.bcc-table tr:last-child th{border-bottom:0}
.bcc-table tr.is-stat{background:var(--red-bg)}
.bcc-table-num td,.bcc-table-num th{font-variant-numeric:tabular-nums}
.bcc-table-stat{min-width:720px}
.bcc-table-fest{min-width:680px}
.bcc-tag{
  display:inline-flex; padding:3px 9px; border-radius:999px;
  background:var(--red-bg); color:var(--red); font-size:11.5px; font-weight:900; white-space:nowrap;
}
.bcc-tag-soft{background:var(--soft2); color:var(--muted)}

.bcc-d{
  padding:2px 5px; border:0; background:none; color:var(--main);
  font:inherit; font-size:12.5px; font-weight:800;
  text-decoration:underline; text-underline-offset:2px; cursor:pointer; white-space:nowrap;
}
.bcc-d:hover{color:var(--main2); background:var(--soft)}

/* ------------------------------------------------------------ cards */
.bcc-cards{display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.bcc-card{
  padding:14px; border:1px solid var(--border); border-radius:17px;
  background:linear-gradient(180deg,#fff,var(--soft));
}
.bcc-card h3{margin:0 0 6px; font-size:15px}
.bcc-card p{margin:0; color:#41485a; font-size:13px}

.bcc-zodline{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 14px}
.bcc-zod{
  display:inline-flex; flex-direction:column; align-items:center; min-width:46px; padding:6px 4px;
  border:1px solid var(--border); border-radius:12px; background:#fff; font-size:10.5px; color:var(--muted);
}
.bcc-zod b{font-size:16px; color:var(--text)}
.bcc-zod.is-now{border-color:var(--main); background:var(--red-bg)}
.bcc-zod.is-now b{color:var(--main)}

/* ------------------------------------------------------------ details / filters */
.bcc-details{
  margin-top:12px; padding:11px 14px;
  border:1px solid var(--border); border-radius:16px; background:#fff;
}
.bcc-details>summary{color:var(--main); font-size:13.5px; font-weight:900; cursor:pointer}
.bcc-ad-bar{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px;
  margin:12px 0; padding:11px; border:1px solid var(--border); border-radius:13px; background:var(--soft);
}
.bcc-field{display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:800}
.bcc-field select{
  padding:6px 9px; border:1px solid var(--border); border-radius:9px;
  background:#fff; color:var(--text); font:inherit; font-size:12.5px;
}
.bcc-check{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700}
.bcc-ad-count{margin:0 0 0 auto; color:var(--muted); font-size:12px; font-weight:800; font-variant-numeric:tabular-nums}
.bcc-ad-table{min-width:520px}
.bcc-ad-table th,.bcc-ad-table td{padding:6px 10px; font-size:12.5px; white-space:nowrap}
.bcc-ad-table th[scope="row"] small{display:inline; margin-left:4px; color:var(--muted); font-size:11px; font-weight:600}
.bcc-ad-row.is-sun th[scope="row"]{color:var(--red)}
.bcc-ad-row.is-sat th[scope="row"]{color:var(--blue)}
.bcc-ad-row.is-stat{background:var(--red-bg)}
.bcc-ad-row[hidden]{display:none}

/* ------------------------------------------------------------ faq / sources */
.bcc-faq{display:grid; gap:10px}
.bcc-faq details{padding:11px 14px; border:1px solid var(--border); border-radius:15px; background:#fff}
.bcc-faq summary{color:var(--main); font-size:14px; font-weight:900; cursor:pointer}
.bcc-faq p{margin:9px 0 0; color:#41485a; font-size:13px}
.bcc-sources{margin:10px 0 0; padding-left:20px}
.bcc-sources li{margin:7px 0; font-size:13px; color:#41485a}

/* ------------------------------------------------------------ related / hub */
.bcc-related{margin-top:16px; padding-top:13px; border-top:1px dashed var(--border)}
.bcc-related-h{margin:0 0 9px; color:var(--muted); font-size:12px; font-weight:800; letter-spacing:.04em}
.bcc-related-grid{display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
a.bcc-rel{
  position:relative; display:flex; flex-direction:column; gap:2px;
  padding:10px 28px 10px 12px; border:1px solid var(--border); border-radius:13px;
  background:#fff; color:var(--text); text-decoration:none;
  transition:border-color .15s,background .15s,transform .15s;
}
a.bcc-rel::after{content:"›"; position:absolute; top:50%; right:12px; transform:translateY(-52%); color:var(--main2); font-size:17px; font-weight:800}
a.bcc-rel b{color:var(--main); font-size:13px; font-weight:800; line-height:1.35}
a.bcc-rel small{color:var(--muted); font-size:11.5px; line-height:1.4}
a.bcc-rel:hover{border-color:var(--main2); background:var(--soft); transform:translateY(-1px)}

.bcc-hub{display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(214px,1fr))}
.bcc-hub-col h3{margin:0 0 9px; font-size:14px}
.bcc-links{display:grid; gap:6px}
.bcc-links a{
  padding:8px 11px; border:1px solid var(--border); border-radius:11px;
  background:#fff; color:var(--text); font-size:12.5px; font-weight:700; text-decoration:none;
}
.bcc-links a:hover{border-color:var(--main); background:var(--main); color:var(--on-main)}

/* ------------------------------------------------------------ sheet */
.bcc-sheet{
  width:min(560px,94vw); padding:0; border:0; border-radius:20px;
  background:var(--card); color:var(--text); box-shadow:0 30px 70px rgba(0,0,0,.3);
}
.bcc-sheet::backdrop{background:rgba(24,12,14,.5)}
.bcc-sheet-inner{padding:18px}
.bcc-sheet-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px}
.bcc-sheet-head h3{margin:0; font-size:17px}
.bcc-x{
  width:32px; height:32px; border:1px solid var(--border); border-radius:50%;
  background:#fff; color:var(--muted); font-size:17px; line-height:1; cursor:pointer;
}
.bcc-x:hover{border-color:var(--main); color:var(--main)}
.bcc-sheet-body dl{display:grid; grid-template-columns:auto 1fr; gap:6px 14px; margin:0}
.bcc-sheet-body dt{color:var(--muted); font-size:12.5px; font-weight:800}
.bcc-sheet-body dd{margin:0; font-size:13.5px; font-weight:700}
.bcc-sheet-body .bcc-sheet-fest{
  margin-top:12px; padding:11px 13px; border-radius:13px;
  background:var(--red-bg); color:var(--red); font-size:13px; font-weight:800;
}

/* ------------------------------------------------------------ responsive */
@media (min-width:560px){
  .bcc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:900px){
  .bcc{padding:20px}
  .bcc-hero{padding:34px 28px}
  .bcc-hero-grid{grid-template-columns:1.4fr .6fr; align-items:center}
  .bcc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bcc-section{padding:20px}
}
@media (min-width:1180px){
  .bcc-stats{grid-template-columns:repeat(6,1fr)}
}
@media (max-width:480px){
  .bcc{padding:9px}
  .bcc-hero{border-radius:20px}
  .bcc-section{padding:13px; border-radius:18px}
}

/* ------------------------------------------------------------ dark mode */
@media (prefers-color-scheme:dark){
  .bcc:not([data-theme="light"]){
    --page:#15100f; --card:#1d1615; --soft:#231a19; --soft2:#2b2020;
    --text:#f0e7e5; --muted:#b3a3a1; --border:#3a2926;
    --main:#f08a92; --main2:#e2646f; --on-main:#1a1010;
    --red:#f58a91; --red-bg:#3a1f22; --blue:#8fc2f0; --blue-bg:#1d2b3a;
    --green:#7fd7b4; --green-bg:#16302a; --gold:#e8c169; --gold-bg:#332a16;
    background:linear-gradient(180deg,#15100f,#1a1413 40%,#15100f);
  }
  .bcc:not([data-theme="light"]) .bcc-cal td{background:#1d1615; border-color:#33211f}
  .bcc:not([data-theme="light"]) .bcc-cal .bcc-empty{background:#171110}
  .bcc:not([data-theme="light"]) .bcc-cal .bcc-sun{background:#241718}
  .bcc:not([data-theme="light"]) .bcc-cal .bcc-sat{background:#181f28}
  .bcc:not([data-theme="light"]) .bcc-card,
  .bcc:not([data-theme="light"]) .bcc-links a,
  .bcc:not([data-theme="light"]) a.bcc-rel,
  .bcc:not([data-theme="light"]) .bcc-details,
  .bcc:not([data-theme="light"]) .bcc-faq details,
  .bcc:not([data-theme="light"]) .bcc-nav a,
  .bcc:not([data-theme="light"]) .bcc-monthjump a,
  .bcc:not([data-theme="light"]) .bcc-table tbody th[scope="row"],
  .bcc:not([data-theme="light"]) .bcc-month{background:var(--card)}
  .bcc:not([data-theme="light"]) .bcc-stat{background:linear-gradient(180deg,var(--card),var(--soft))}
}

/* ------------------------------------------------------------ print */
@media print{
  .bcc{max-width:none; padding:0; background:#fff}
  .bcc-nav,.bcc-monthjump,.bcc-hub-section,.bcc-related,.bcc-ad-bar,.bcc-today,.bcc-month-link{display:none !important}
  .bcc-section,.bcc-month,.bcc-hero,.bcc-stat{box-shadow:none; break-inside:avoid}
  .bcc-grid{grid-template-columns:repeat(3,1fr)}
  .bcc-cal td{height:48px}
  .bcc-details[open]>summary{display:none}
}