/*! Benri Date Calculator — styles (scoped to .bdc) */

.bdc{
  --card:#fff; --soft:#f5f8fc; --soft2:#e9eff7;
  --text:#1f2937; --muted:#6b7280; --border:#e2e8f2;
  --main:#12355b; --main2:#1f5f8b; --on-main:#fff;
  --red:#c62828; --red-bg:#fff1f2;
  --blue:#1565c0; --blue-bg:#eef6ff;
  --green:#047857; --green-bg:#ecfdf5;
  --gold:#b8860b; --gold-bg:#fff8e1;
  --shadow:0 14px 34px rgba(18,53,91,.08);
  --shadow-sm:0 8px 20px rgba(18,53,91,.05);
  max-width:1120px; margin:0 auto; padding:14px;
  color:var(--text);
  background:linear-gradient(180deg,#fdfefe,#f7fafd 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;
}
.bdc *,.bdc *::before,.bdc *::after{box-sizing:border-box}
.bdc a{color:var(--main2)}
.bdc a:focus-visible,.bdc button:focus-visible,.bdc input:focus-visible,
.bdc select:focus-visible,.bdc summary:focus-visible{outline:3px solid var(--gold); outline-offset:2px; border-radius:6px}

/* ------------------------------------------------------------ hero */
.bdc-hero{
  padding:24px 20px; border-radius:24px; color:#fff;
  background:radial-gradient(circle at 88% 14%,rgba(255,255,255,.16),transparent 36%),
    linear-gradient(135deg,var(--main),var(--main2));
  box-shadow:var(--shadow);
}
.bdc-pill{
  display:inline-flex; padding:5px 12px; 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;
}
.bdc-hero h1{margin:11px 0 0; color:#fff; font-size:clamp(22px,5vw,34px); font-weight:900; line-height:1.28}
.bdc-hero p{max-width:840px; margin:11px 0 0; color:#fff; font-size:14px; opacity:.95}
.bdc-today{
  margin:15px 0 0; padding:9px 13px; border-radius:13px;
  background:rgba(0,0,0,.18); color:#fff; font-size:13px; font-weight:700;
}

/* ------------------------------------------------------------ nav */
.bdc-nav{
  display:flex; flex-wrap:wrap; gap:8px; margin:14px 0;
  padding:10px; border:1px solid var(--border); border-radius:17px;
  background:rgba(255,255,255,.96); box-shadow:var(--shadow-sm);
}
.bdc-nav a{
  display:inline-flex; align-items:center; min-height:35px; 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;
}
.bdc-nav a:hover{border-color:var(--main); background:var(--main); color:var(--on-main)}

/* ------------------------------------------------------------ sections */
.bdc-section{
  margin-bottom:16px; padding:18px;
  border:1px solid var(--border); border-radius:22px;
  background:rgba(255,255,255,.97); box-shadow:var(--shadow);
}
.bdc-head{margin-bottom:12px}
.bdc-head h2{margin:0; color:var(--main); font-size:21px; font-weight:900; line-height:1.35}
.bdc-head p{margin:6px 0 0; color:var(--muted); font-size:13px}
.bdc-section h3{color:var(--main); font-size:15px; font-weight:900}
.bdc-note{
  margin-top:13px; padding:13px 15px; border-left:5px solid var(--main2);
  border-radius:13px; background:var(--soft); color:#39404e; font-size:13px;
}

/* ------------------------------------------------------------ tool */
.bdc-tool{padding-top:14px}
.bdc-tabs{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px}
.bdc-tabs button{
  flex:1 1 200px; min-height:44px; padding:9px 14px;
  border:1px solid var(--border); border-radius:13px; background:#fff;
  color:var(--text); font:inherit; font-size:14px; font-weight:800; cursor:pointer;
}
.bdc-tabs button.is-on{border-color:var(--main); background:var(--main); color:var(--on-main)}

.bdc-form{margin:0}
.bdc-fields{display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end}
.bdc-field{display:flex; flex-direction:column; gap:5px; flex:1 1 190px; min-width:0}
.bdc-field-sm{flex:0 1 130px}
.bdc-field span{color:var(--muted); font-size:12px; font-weight:800}
.bdc-field input,.bdc-field select{
  width:100%; min-height:46px; padding:9px 12px;
  border:1px solid var(--border); border-radius:12px;
  background:#fff; color:var(--text); font:inherit; font-size:16px; font-weight:700;
}
.bdc-opts{display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 14px; margin-top:13px}
.bdc-check{display:inline-flex; align-items:center; gap:7px; font-size:13.5px; font-weight:700}
.bdc-check input{width:18px; height:18px}
.bdc-hint{color:var(--muted); font-size:12px}
.bdc-actions{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px}
.bdc-btn{
  min-height:42px; padding:8px 16px; border:1px solid var(--border); border-radius:999px;
  background:#fff; color:var(--text); font:inherit; font-size:13px; font-weight:800; cursor:pointer;
}
.bdc-btn:hover{border-color:var(--main); background:var(--soft)}
.bdc-btn-primary{border-color:var(--main); background:var(--main); color:var(--on-main)}
.bdc-btn-primary:hover{background:var(--main2); border-color:var(--main2); color:var(--on-main)}
.bdc-btn-sm{min-height:34px; padding:5px 13px; font-size:12.5px}

.bdc-result{display:block; margin-top:18px; padding-top:16px; border-top:1px dashed var(--border)}
.bdc-headline{
  margin:0 0 14px; padding:13px 15px; border-radius:15px;
  background:var(--soft); color:var(--text); font-size:14.5px; font-weight:700; line-height:1.7;
}
.bdc-headline b{color:var(--main); font-size:20px; font-weight:900; padding:0 4px}

.bdc-grid{display:grid; gap:9px; grid-template-columns:repeat(auto-fit,minmax(132px,1fr))}
.bdc-stat{
  padding:11px 13px; border:1px solid var(--border); border-radius:14px;
  background:linear-gradient(180deg,#fff,var(--soft));
}
.bdc-stat small{display:block; color:var(--muted); font-size:11.5px; font-weight:800}
.bdc-stat strong{
  display:block; margin-top:2px; color:var(--main);
  font-size:19px; font-weight:900; line-height:1.25; font-variant-numeric:tabular-nums;
}
.bdc-stat span{display:block; margin-top:2px; color:var(--muted); font-size:11px; line-height:1.45}

.bdc-two{display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(255px,1fr)); margin-top:14px}
.bdc-daycard{padding:14px; border:1px solid var(--border); border-radius:16px; background:#fff}
.bdc-daycard-wide{grid-column:1/-1}
.bdc-daycard-label{margin:0; color:var(--muted); font-size:11.5px; font-weight:800}
.bdc-daycard-date{margin:3px 0 0; color:var(--main); font-size:18px; font-weight:900}
.bdc-daycard-tags{display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 0}
.bdc-daycard dl{display:grid; grid-template-columns:auto 1fr; gap:4px 12px; margin:11px 0 0}
.bdc-daycard dt{color:var(--muted); font-size:12px; font-weight:800}
.bdc-daycard dd{margin:0; font-size:12.5px; font-weight:700; font-variant-numeric:tabular-nums}
.bdc-daycard .bdc-grid{margin-top:10px}

.bdc-tag{
  display:inline-flex; padding:3px 9px; border-radius:999px;
  background:var(--soft2); color:var(--muted); font-size:11.5px; font-weight:800;
}
.bdc-tag-hol{background:var(--red-bg); color:var(--red)}
.bdc-tag-biz{background:var(--green-bg); color:var(--green)}

.bdc-copy{display:flex; align-items:center; gap:10px; margin:14px 0 0}
.bdc-toast{color:var(--green); font-size:12.5px; font-weight:800}

.bdc-quick{margin-top:18px; padding-top:14px; border-top:1px dashed var(--border)}
.bdc-quick-h{margin:0 0 9px; color:var(--muted); font-size:12px; font-weight:800; letter-spacing:.04em}
.bdc-quick-row{display:flex; flex-wrap:wrap; gap:8px}
.bdc-chip{
  min-height:36px; padding:6px 13px; border:1px solid var(--border); border-radius:999px;
  background:#fff; color:var(--main); font:inherit; font-size:12.5px; font-weight:800; cursor:pointer;
}
.bdc-chip:hover{border-color:var(--main); background:var(--main); color:var(--on-main)}

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

.bdc-table-wrap{overflow-x:auto; border:1px solid var(--border); border-radius:16px}
.bdc-table{width:100%; min-width:560px; border-collapse:collapse}
.bdc-table th,.bdc-table td{padding:9px 12px; border-bottom:1px solid var(--border); font-size:13px; text-align:left; vertical-align:top}
.bdc-table thead th{background:var(--soft); color:#374151; font-weight:900; white-space:nowrap}
.bdc-table tbody th[scope="row"]{background:#fff; font-weight:900; white-space:nowrap}
.bdc-table tr:last-child td,.bdc-table tr:last-child th{border-bottom:0}

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

.bdc-hub{display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.bdc-hub-col h3{margin:0 0 9px; font-size:14px}
.bdc-links{display:grid; gap:6px}
.bdc-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;
}
.bdc-links a:hover{border-color:var(--main); background:var(--main); color:var(--on-main)}
.bdc-links-tight{grid-template-columns:repeat(2,1fr)}

/* ------------------------------------------------------------ responsive */
@media (min-width:900px){
  .bdc{padding:20px}
  .bdc-hero{padding:32px 28px}
  .bdc-section{padding:22px}
}
@media (max-width:480px){
  .bdc{padding:9px}
  .bdc-hero{border-radius:19px; padding:19px 16px}
  .bdc-section{padding:14px; border-radius:18px}
  .bdc-field{flex:1 1 100%}
  .bdc-field-sm{flex:1 1 calc(50% - 6px)}
  .bdc-headline b{display:block; padding:2px 0}
}

/* ------------------------------------------------------------ dark mode */
@media (prefers-color-scheme:dark){
  .bdc:not([data-theme="light"]){
    --card:#161c25; --soft:#1c242f; --soft2:#26303d;
    --text:#e8edf4; --muted:#a3aebd; --border:#2f3a49;
    --main:#7fb2e0; --main2:#9ec7ec; --on-main:#0f151d;
    --red:#f4959a; --red-bg:#372022; --blue:#8fc2f0; --blue-bg:#1b2836;
    --green:#7fd7b4; --green-bg:#15302a; --gold:#e8c169; --gold-bg:#322a16;
    background:linear-gradient(180deg,#10151c,#141b23 40%,#10151c);
  }
  .bdc:not([data-theme="light"]) .bdc-card,
  .bdc:not([data-theme="light"]) .bdc-daycard,
  .bdc:not([data-theme="light"]) .bdc-stat,
  .bdc:not([data-theme="light"]) .bdc-links a,
  .bdc:not([data-theme="light"]) .bdc-nav a,
  .bdc:not([data-theme="light"]) .bdc-faq details,
  .bdc:not([data-theme="light"]) .bdc-chip,
  .bdc:not([data-theme="light"]) .bdc-btn,
  .bdc:not([data-theme="light"]) .bdc-tabs button,
  .bdc:not([data-theme="light"]) .bdc-field input,
  .bdc:not([data-theme="light"]) .bdc-field select,
  .bdc:not([data-theme="light"]) .bdc-table tbody th[scope="row"]{background:var(--card); color:var(--text)}
  .bdc:not([data-theme="light"]) .bdc-tabs button.is-on,
  .bdc:not([data-theme="light"]) .bdc-btn-primary{background:var(--main); color:var(--on-main)}
}

/* ------------------------------------------------------------ print */
@media print{
  .bdc{max-width:none; padding:0; background:#fff}
  .bdc-nav,.bdc-hub-section,.bdc-quick,.bdc-actions,.bdc-copy,.bdc-tabs{display:none !important}
  .bdc-section,.bdc-hero{box-shadow:none; break-inside:avoid}
}