:root{
  --wca-ink:#17152b;
  --wca-deep:#25204d;
  --wca-purple:#5d4bb7;
  --wca-lilac:#8f7de0;
  --wca-gold:#d7aa55;
  --wca-gold-soft:#f2d99f;
  --wca-bg:#f7f5fc;
  --wca-card:#ffffff;
  --wca-muted:#88849d;
  --wca-line:#e9e5f2;
}

.wca-shell,.wca-shell *,.wca-modal,.wca-modal *{box-sizing:border-box}

.wca-shell{
  width:100%;
  display:flex;
  justify-content:center;
  padding:22px 8px;
  font-family:"Noto Sans Thai","Tahoma",sans-serif;
  color:var(--wca-ink);
}

.wca-calendar{
  position:relative;
  width:min(470px,100%);
  overflow:hidden;
  border-radius:34px;
  background:linear-gradient(145deg,#fffaf0 0%,#f7ecd8 100%);
  border:1px solid rgba(198,154,69,.22);
  box-shadow:0 28px 80px rgba(91,66,31,.18);
}

.wca-hero{
  position:relative;
  overflow:hidden;
  padding:22px 25px 24px;
  color:#fff;
  background:
    radial-gradient(circle at 87% 16%,rgba(255,237,180,.42),transparent 23%),
    radial-gradient(circle at 12% 100%,rgba(214,169,82,.22),transparent 34%),
    linear-gradient(135deg,#5b3f20 0%,#866333 48%,#b58a45 100%);
}

.wca-hero:before{
  content:"";
  position:absolute;
  width:210px;height:210px;
  right:-105px;top:-115px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:50%;
  box-shadow:0 0 0 24px rgba(255,255,255,.035),0 0 0 48px rgba(255,255,255,.025);
}

.wca-hero-top{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:9px;
}
.wca-brand-mark{
  display:grid;
  place-items:center;
  width:28px;height:28px;
  border:1px solid rgba(255,235,184,.55);
  border-radius:9px;
  color:#ffe9b1;
  font-size:13px;
}
.wca-eyebrow{
  font-size:9px;
  letter-spacing:2.5px;
  opacity:.76;
  font-weight:700;
}
.wca-live{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:5px;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  background:rgba(255,255,255,.07);
  font-size:8px;
  letter-spacing:1.2px;
}
.wca-live i{
  width:5px;height:5px;border-radius:50%;
  background:#f2d99f;
  box-shadow:0 0 0 4px rgba(242,217,159,.08);
}

.wca-clock{
  position:relative;
  z-index:2;
  margin-top:19px;
  font-size:43px;
  line-height:1.05 !important;
  font-weight:800;
  letter-spacing:3px;
  font-variant-numeric:tabular-nums;
}
.wca-today{
  position:relative;
  z-index:2;
  margin-top:7px;
  color:rgba(255,255,255,.72);
  font-size:11px;
  line-height:18px !important;
}
.wca-hero-line{
  width:54px;height:2px;
  margin-top:17px;
  border-radius:9px;
  background:var(--wca-gold-soft);
}

.wca-content{padding:22px 23px 17px}

.wca-month-row{
  display:flex;
  align-items:center;
  gap:13px;
  margin-bottom:18px;
}
.wca-month-copy{
  flex:1;
  min-width:0;
  text-align:center;
}
.wca-month-label{
  display:block;
  color:var(--wca-muted);
  font-size:9px;
  letter-spacing:1.5px;
  line-height:15px !important;
}
.wca-month-copy strong{
  display:block;
  margin-top:1px;
  color:#6b4b25;
  font-size:22px;
  line-height:30px !important;
  font-weight:800;
}
.wca-nav{
  display:grid !important;
  place-items:center;
  flex:0 0 42px !important;
  width:42px !important;height:42px !important;
  min-width:42px !important;
  min-height:42px !important;
  padding:0 !important;
  border:1px solid #dfcda9 !important;
  border-radius:14px !important;
  background:#fff8ea !important;
  color:#6b4b25 !important;
  font-family:Arial,sans-serif !important;
  font-size:19px !important;
  line-height:42px !important;
  cursor:pointer;
  transition:.2s ease;
}
.wca-nav:hover{
  border-color:#d8d0ee !important;
  background:#fff8e9 !important;
  transform:translateY(-1px);
}

.wca-weekdays{
  display:grid !important;
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  gap:7px !important;
  margin-bottom:7px;
}
.wca-weekdays span{
  display:flex !important;
  justify-content:center;
  align-items:center;
  height:28px !important;
  color:#a28b6b;
  font-size:10px;
  font-weight:800;
  line-height:28px !important;
}

.wca-grid{
  display:grid !important;
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  grid-auto-rows:49px !important;
  gap:7px !important;
}
.wca-day{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;height:49px !important;
  min-width:0 !important;min-height:49px !important;
  padding:0 !important;margin:0 !important;
  border:1px solid transparent !important;
  border-radius:16px !important;
  background:rgba(255,249,237,.78) !important;
  color:#634b2d !important;
  font-family:inherit !important;
  font-size:13px !important;
  font-weight:600 !important;
  line-height:49px !important;
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.wca-day:hover{
  transform:translateY(-2px);
  background:#f0edf9 !important;
}
.wca-day.wca-other{
  color:#c5b79f !important;
  background:rgba(247,237,218,.55) !important;
}
.wca-day.wca-today{
  border-color:#cda65a !important;
  background:#fff1c9 !important;
  color:#805a20 !important;
  font-weight:800 !important;
}
.wca-day.wca-selected{
  background:linear-gradient(145deg,#87652f,#c39a4d) !important;
  color:#fff !important;
  box-shadow:0 9px 20px rgba(139,100,39,.25);
}
.wca-day.wca-today.wca-selected{
  border-color:var(--wca-gold-soft) !important;
}
.wca-day-dot{
  position:absolute !important;
  bottom:6px !important;
  left:50% !important;
  width:4px !important;height:4px !important;
  min-width:4px !important;
  border-radius:50% !important;
  transform:translateX(-50%) !important;
  background:#c69a45 !important;
}
.wca-day.wca-selected .wca-day-dot{background:#fff !important}

.wca-footer{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--wca-line);
  color:#a18d72;
  font-size:9px;
  line-height:16px !important;
}
.wca-today-badge{
  display:flex;
  align-items:center;
  gap:5px;
  color:#80633a;
  font-weight:800;
}
.wca-today-badge i{
  width:6px;height:6px;
  border-radius:50%;
  background:var(--wca-gold);
}

.wca-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:999999 !important;
  display:none;
  align-items:center !important;
  justify-content:center !important;
  padding:20px !important;
  background:rgba(58,39,20,.58) !important;
  backdrop-filter:blur(10px);
}
.wca-modal.wca-show{display:flex !important}
.wca-modal-card{
  position:relative;
  width:min(370px,100%);
  overflow:hidden;
  padding:28px 26px 25px;
  border:1px solid rgba(198,154,69,.28);
  border-radius:29px;
  background:linear-gradient(145deg,#fffaf0,#f7ead2);
  box-shadow:0 30px 90px rgba(65,44,20,.30);
  text-align:center;
  animation:wcaPop .22s ease;
}
@keyframes wcaPop{
  from{opacity:0;transform:translateY(14px) scale(.95)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.wca-modal-card:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:6px;
  background:linear-gradient(90deg,#765226,#c69a45,#efd9a5);
}
.wca-modal-close{
  position:absolute !important;
  top:12px !important;right:13px !important;
  width:33px !important;height:33px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:#f1e5cf !important;
  color:#806b4e !important;
  font-size:23px !important;
  line-height:33px !important;
  cursor:pointer;
}
.wca-modal-top{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:4px;
  color:#a38c6e;
  font-size:8px;
  letter-spacing:2px;
  font-weight:800;
}
.wca-modal-top b{color:var(--wca-gold);font-size:14px}
.wca-modal-day{
  margin-top:14px;
  color:#6b4b25;
  font-size:25px;
  line-height:34px !important;
  font-weight:800;
}
.wca-modal-date{
  margin-top:2px;
  color:#8b7353;
  font-size:14px;
  line-height:24px !important;
}
.wca-modal-divider{
  width:42px;height:2px;
  margin:17px auto;
  border-radius:10px;
  background:var(--wca-gold);
}
.wca-modal-info{
  color:#927d5e;
  font-size:11px;
  line-height:21px !important;
}
.wca-modal-button{
  margin-top:20px;
  padding:10px 21px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#765226 !important;
  color:#fff !important;
  font-family:inherit !important;
  font-size:11px !important;
  cursor:pointer;
}

@media(max-width:390px){
  .wca-hero{padding-left:19px;padding-right:19px}
  .wca-content{padding-left:16px;padding-right:16px}
  .wca-clock{font-size:36px}
  .wca-grid{grid-auto-rows:45px !important;gap:5px !important}
  .wca-day{height:45px !important;min-height:45px !important;line-height:45px !important;border-radius:13px !important}
  .wca-weekdays{gap:5px !important}
}

/* ===== Cream & Gold playful details ===== */
.wca-calendar:after{
  content:"✦  ·  ✧  ·  ✦";
  position:absolute;
  right:17px;
  bottom:9px;
  color:rgba(164,119,50,.25);
  font-size:11px;
  letter-spacing:5px;
  pointer-events:none;
}
.wca-content{
  position:relative;
  background:
    radial-gradient(circle at 7% 8%,rgba(198,154,69,.10) 0 3px,transparent 4px),
    radial-gradient(circle at 94% 35%,rgba(198,154,69,.08) 0 2px,transparent 3px),
    linear-gradient(180deg,rgba(255,250,240,.72),rgba(247,236,215,.62));
}
.wca-content:before{
  content:"";
  position:absolute;
  top:10px;
  right:18px;
  width:52px;height:52px;
  border:1px solid rgba(198,154,69,.16);
  border-radius:50%;
  box-shadow:0 0 0 8px rgba(198,154,69,.035);
  pointer-events:none;
}
.wca-month-row{
  position:relative;
  z-index:2;
}
.wca-month-copy strong{
  color:#6b4b25 !important;
  text-shadow:0 1px 0 #fff4d9;
}
.wca-day{
  overflow:hidden !important;
}
.wca-day:before{
  content:"";
  position:absolute;
  width:22px;height:22px;
  left:-12px;top:-12px;
  border-radius:50%;
  background:rgba(198,154,69,.08);
}
.wca-day:nth-child(7n+1):after,
.wca-day:nth-child(7n):after{
  content:"";
  position:absolute;
  width:4px;height:4px;
  right:7px;top:7px;
  border-radius:50%;
  background:rgba(198,154,69,.28);
}
.wca-day:hover{
  background:#fff0cf !important;
  border-color:#dfc486 !important;
  box-shadow:0 7px 16px rgba(126,91,37,.11);
}
.wca-day.wca-selected{
  color:#fff !important;
  border-color:#e5c879 !important;
}
.wca-day.wca-today{
  box-shadow:inset 0 0 0 1px rgba(198,154,69,.14),0 6px 14px rgba(126,91,37,.08);
}
.wca-nav{
  box-shadow:0 4px 10px rgba(115,81,31,.06);
}
.wca-footer{
  background:rgba(255,248,232,.38);
}