.wdp{
  --wdp-ink:#0B0B0B; --wdp-line:#E4E4E1; --wdp-line2:#D2D2CE; --wdp-muted:#6E6E6B;
  --wdp-blue:#121AB0; --wdp-blue50:#EEF0FB; --wdp-panel:#F3F3F1; --wdp-ph:#A3A3A0;
  --wdp-red:#DC2626; --wdp-r:7px; --wdp-h:44px;
  position:relative; display:block; width:100%; box-sizing:border-box;
}
.wdp .wdp-native{
  position:absolute; inset:0; width:100%; height:100%; min-height:0; margin:0; padding:0;
  border:0; background:none; opacity:0; pointer-events:none; -webkit-appearance:none; appearance:none;
}
.wdp .wdp-btn{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  width:100%; height:var(--wdp-h); box-sizing:border-box; padding:0 13px;
  border:1px solid var(--wdp-line); border-radius:var(--wdp-r); background:#fff;
  font-family:inherit; font-size:14px; font-weight:400; line-height:1.7; color:var(--wdp-ink);
  text-align:start; cursor:pointer; -webkit-appearance:none; appearance:none;
  transition:border-color .16s, box-shadow .16s;
}
.wdp .wdp-btn:hover{ border-color:var(--wdp-line2) }
.wdp.is-open .wdp-btn,.wdp .wdp-btn:focus-visible{
  border-color:var(--wdp-blue); box-shadow:0 0 0 3px rgba(18,26,176,.12); outline:none;
}
.wdp.is-err .wdp-btn{ border-color:var(--wdp-red) }
.wdp.is-err.is-open .wdp-btn,.wdp.is-err .wdp-btn:focus-visible{ box-shadow:0 0 0 3px rgba(220,38,38,.12) }
.wdp .wdp-msg{ display:block; margin-top:5px; font-size:12.5px; font-weight:400; line-height:1.7; color:var(--wdp-red) }
.wdp.is-dis .wdp-btn{ background:var(--wdp-panel); color:var(--wdp-muted); cursor:not-allowed }
.wdp .wdp-val{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.wdp .wdp-val.is-ph{ color:var(--wdp-ph) }
.wdp .wdp-ico{ width:16px; height:16px; flex:none; color:var(--wdp-muted) }

.wdp-pop{
  --wdp-ink:#0B0B0B; --wdp-line:#E4E4E1; --wdp-line2:#D2D2CE; --wdp-muted:#6E6E6B;
  --wdp-blue:#121AB0; --wdp-blue50:#EEF0FB; --wdp-panel:#F3F3F1; --wdp-ph:#A3A3A0; --wdp-r:7px;
  position:fixed; z-index:2147483000; display:none; box-sizing:border-box; width:392px; max-width:calc(100vw - 16px); padding:10px;
  background:#fff; border:1px solid var(--wdp-line); border-radius:var(--wdp-r);
  box-shadow:0 2px 6px rgba(11,11,11,.05), 0 18px 36px -24px rgba(11,11,11,.30);
}
.wdp-pop.is-open{ display:block }
.wdp-pop *{ box-sizing:border-box }
.wdp-pop .wdp-hd{ display:flex; align-items:center; gap:6px; margin-bottom:8px }
.wdp-pop .wdp-nav{
  width:30px; height:30px; flex:none; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--wdp-line); border-radius:var(--wdp-r); background:#fff;
  color:var(--wdp-muted); cursor:pointer; padding:0;
}
.wdp-pop .wdp-nav:hover{ border-color:var(--wdp-line2); color:var(--wdp-ink) }
.wdp-pop .wdp-nav:focus-visible{ outline:none; border-color:var(--wdp-blue); box-shadow:0 0 0 3px rgba(18,26,176,.12) }
.wdp-pop .wdp-nav svg{ width:15px; height:15px }
.wdp-pop .wdp-ttl{ flex:1; display:flex; align-items:center; justify-content:center; gap:5px; min-width:0 }
.wdp-pop .wdp-pick{
  border:1px solid transparent; border-radius:var(--wdp-r); background:none; padding:5px 9px;
  font-family:inherit; font-size:13.5px; font-weight:500; color:var(--wdp-ink); cursor:pointer;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.wdp-pop .wdp-pick:hover{ background:var(--wdp-panel) }
.wdp-pop .wdp-pick:focus-visible{ outline:none; border-color:var(--wdp-blue); box-shadow:0 0 0 3px rgba(18,26,176,.12) }
.wdp-pop .wdp-pick.is-on{ background:var(--wdp-blue50); color:var(--wdp-blue) }
.wdp-pop .wdp-wk{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; margin-bottom:2px }
.wdp-pop .wdp-wk span{
  text-align:center; font-size:11.5px; font-weight:500; color:var(--wdp-muted);
  line-height:2; overflow:hidden; white-space:nowrap;
}
.wdp-pop .wdp-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; outline:none }
.wdp-pop .wdp-grid:focus,.wdp-pop .wdp-grid:focus-visible{ outline:none!important; box-shadow:none!important; border-color:transparent }
.wdp-pop .wdp-d{
  height:34px; display:flex; align-items:center; justify-content:center;
  border:1px solid transparent; border-radius:var(--wdp-r); background:none;
  font-family:inherit; font-size:13px; font-weight:400; color:var(--wdp-ink);
  cursor:pointer; padding:0; font-variant-numeric:tabular-nums;
}
.wdp-pop .wdp-d:hover{ background:var(--wdp-panel) }
.wdp-pop .wdp-d.is-out{ color:var(--wdp-ph) }
.wdp-pop .wdp-d.is-off{ color:#C9C9C6; cursor:not-allowed; background:none }
.wdp-pop .wdp-d.is-today{ border-color:var(--wdp-line2) }
.wdp-pop .wdp-d.is-act{ box-shadow:0 0 0 3px rgba(18,26,176,.12); border-color:var(--wdp-blue) }
.wdp-pop .wdp-d.is-sel{ background:var(--wdp-blue); border-color:var(--wdp-blue); color:#fff; font-weight:500 }
.wdp-pop .wdp-mg{ display:grid; grid-template-columns:repeat(3,1fr); gap:4px }
.wdp-pop .wdp-yg{ display:grid; grid-template-columns:repeat(4,1fr); gap:4px; max-height:214px; overflow-y:auto; scrollbar-width:thin }
.wdp-pop .wdp-yg::-webkit-scrollbar{ width:4px }
.wdp-pop .wdp-yg::-webkit-scrollbar-thumb{ background:var(--wdp-line2); border-radius:99px }
.wdp-pop .wdp-c{
  height:38px; display:flex; align-items:center; justify-content:center;
  border:1px solid transparent; border-radius:var(--wdp-r); background:none;
  font-family:inherit; font-size:13px; font-weight:400; color:var(--wdp-ink); cursor:pointer; padding:0;
  font-variant-numeric:tabular-nums;
}
.wdp-pop .wdp-c:hover{ background:var(--wdp-panel) }
.wdp-pop .wdp-c.is-sel{ background:var(--wdp-blue50); border-color:var(--wdp-blue); color:var(--wdp-blue); font-weight:500 }
.wdp-pop .wdp-ft{ display:flex; align-items:center; gap:6px; margin-top:9px; padding-top:9px; border-top:1px solid var(--wdp-line) }
.wdp-pop .wdp-a{
  flex:1; height:34px; border:1px solid var(--wdp-line); border-radius:var(--wdp-r); background:#fff;
  font-family:inherit; font-size:12.5px; font-weight:500; color:var(--wdp-ink); cursor:pointer; padding:0;
}
.wdp-pop .wdp-a:hover{ border-color:var(--wdp-line2); background:var(--wdp-panel) }
.wdp-pop .wdp-a:focus-visible{ outline:none; border-color:var(--wdp-blue); box-shadow:0 0 0 3px rgba(18,26,176,.12) }
.wdp-pop .wdp-a.wdp-clear{ color:var(--wdp-muted) }
@media (max-width:480px){
  .wdp-pop{ width:min(320px, calc(100vw - 20px)) }
  .wdp-pop .wdp-d{ height:38px; font-size:14px }
}
@media (prefers-reduced-motion:reduce){
  .wdp .wdp-btn{ transition:none }
}
