/* =============================================================
   www.duliyan.com 原创 - 杜立彦女性呵护
   阶段 A2 | 前台框架：顶栏 / 问候卡 / 数据三格 / 签到养花位 / 入口宫格 / 手机底栏
   基调：温暖、柔和、不幼稚、不临床。色板与圆角继承 base.css，不另起一套。
   ============================================================= */

.dly-display { font-family: 'DLY Display', var(--dly-font); font-weight: 400; }

/* ------------------------------------------------------------- 顶栏 */
.dly-bar {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(249, 244, 242, .72);
  -webkit-backdrop-filter: blur(20px) saturate(130%);
  backdrop-filter: blur(20px) saturate(130%);
  border-bottom: 1px solid rgba(255, 255, 255, .7);
}
.dly-bar_in {
  max-width: 1120px;
  margin: 0 auto;
  padding: 12px 20px;
  display: flex;
  align-items: center;
  gap: 18px;
}
.dly-brand { display: flex; align-items: center; gap: 10px; color: var(--dly-ink); flex: 0 0 auto; }
.dly-brand_mark {
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 14px;
  color: #8E5A5D;
  background: linear-gradient(140deg, #FBE3E3, #F3E7F7 60%, #FBEADF);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.8), 0 8px 18px -12px rgba(142,90,93,.6);
}
.dly-brand_txt { font-size: 17px; letter-spacing: .06em; font-family: 'DLY Display', var(--dly-font); }
.dly-nav_desktop { display: flex; gap: 4px; margin-left: 8px; flex: 1 1 auto; }
.dly-nav_link {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 9px 15px;
  border-radius: var(--dly-r-pill);
  color: var(--dly-ink-soft);
  font-size: 14.5px;
  border: 1px solid transparent;
  transition: background-color .2s, color .2s;
}
.dly-nav_link:hover { background: rgba(255,255,255,.6); color: var(--dly-ink); }
.dly-nav_link.is-on {
  background: rgba(255,255,255,.86);
  color: #8E5A5D;
  border-color: rgba(217,143,146,.24);
  box-shadow: var(--dly-shadow-soft);
}
.dly-bar_right { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.dly-petal {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 13px;
  border-radius: var(--dly-r-pill);
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(217,143,146,.22);
  color: #8E5A5D;
  font-size: 14px;
}
.dly-petal b { font-size: 15.5px; font-family: 'DLY Display', var(--dly-font); }
.dly-avatar {
  width: 36px; height: 36px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(140deg, var(--dly-blush), var(--dly-lav));
  color: #6B4A4E;
  font-size: 15px;
  border: 1px solid rgba(255,255,255,.85);
}

/* ------------------------------------------------------------- 主体 */
.dly-main { max-width: 1120px; margin: 0 auto; padding: 26px 20px 60px; }
.dly-cols { display: grid; grid-template-columns: 1.35fr .95fr; gap: 20px; align-items: start; }
.dly-stack { display: flex; flex-direction: column; gap: 20px; min-width: 0; }

.dly-section_head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 4px 2px 12px; }
.dly-section_title { font-size: 16px; color: var(--dly-ink); letter-spacing: .04em; font-family: 'DLY Display', var(--dly-font); }
.dly-section_more { font-size: 13px; color: var(--dly-ink-mute); }

/* ------------------------------------------------------------- 问候卡 */
.dly-hero {
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  padding: 34px 32px 30px;
  background: linear-gradient(150deg, rgba(255,253,252,.9), rgba(250,235,235,.72) 55%, rgba(238,231,248,.7));
  -webkit-backdrop-filter: blur(22px) saturate(128%);
  backdrop-filter: blur(22px) saturate(128%);
  border: 1px solid rgba(255,255,255,.85);
  box-shadow: var(--dly-shadow);
}
.dly-hero::after {
  content: '';
  position: absolute;
  right: -70px; top: -80px;
  width: 260px; height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, rgba(242,196,196,.55), rgba(242,196,196,0) 68%);
  pointer-events: none;
}
.dly-hero_date { font-size: 13px; color: var(--dly-ink-mute); letter-spacing: .1em; display: flex; align-items: center; gap: 8px; }
.dly-hero_title {
  margin: 12px 0 8px;
  font-size: 34px;
  line-height: 1.3;
  color: #5C464B;
  font-family: 'DLY Display', var(--dly-font);
  position: relative;
}
.dly-hero_sub { margin: 0; color: var(--dly-ink-soft); font-size: 15.5px; max-width: 34em; position: relative; }
.dly-hero_meta { margin-top: 20px; display: flex; gap: 8px; flex-wrap: wrap; position: relative; }

/* ------------------------------------------------------------- 数据三格 */
.dly-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.dly-stat {
  background: var(--dly-glass);
  -webkit-backdrop-filter: blur(16px) saturate(124%);
  backdrop-filter: blur(16px) saturate(124%);
  border: 1px solid rgba(255,255,255,.78);
  border-radius: var(--dly-r-lg);
  padding: 16px 16px 14px;
  box-shadow: var(--dly-shadow-soft);
  min-width: 0;
}
.dly-stat_ico { color: #B98A8D; display: flex; margin-bottom: 8px; }
.dly-stat_num { font-size: 25px; line-height: 1.2; color: #6B4A4E; font-family: 'DLY Display', var(--dly-font); }
.dly-stat_num small { font-size: 12.5px; color: var(--dly-ink-mute); margin-left: 4px; font-family: var(--dly-font); }
.dly-stat_lab { font-size: 12.5px; color: var(--dly-ink-soft); margin-top: 3px; }

/* ------------------------------------------------------------- 签到卡 */
.dly-checkin {
  border-radius: 30px;
  padding: 26px 24px 22px;
  background: linear-gradient(160deg, rgba(255,253,252,.92), rgba(246,235,240,.8));
  -webkit-backdrop-filter: blur(20px) saturate(128%);
  backdrop-filter: blur(20px) saturate(128%);
  border: 1px solid rgba(255,255,255,.85);
  box-shadow: var(--dly-shadow);
}
.dly-checkin_top { display: flex; align-items: center; gap: 14px; }
.dly-bloom {
  flex: 0 0 auto;
  width: 62px; height: 62px;
  border-radius: 22px;
  display: flex; align-items: center; justify-content: center;
  color: #C08A8E;
  background: radial-gradient(circle at 35% 30%, #FFF6F4, #F6E2E4 70%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.9), 0 10px 22px -16px rgba(142,90,93,.7);
}
.dly-checkin_h { margin: 0; font-size: 19px; color: #5C464B; font-family: 'DLY Display', var(--dly-font); }
.dly-checkin_p { margin: 4px 0 0; font-size: 13.5px; color: var(--dly-ink-soft); }
.dly-week { display: flex; gap: 7px; margin: 20px 0 6px; }
.dly-day {
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
  padding: 9px 0 8px;
  border-radius: 14px;
  background: rgba(255,255,255,.6);
  border: 1px solid rgba(217,143,146,.16);
  color: var(--dly-ink-mute);
  font-size: 12px;
}
.dly-day b { display: block; font-size: 14.5px; font-weight: 500; margin-bottom: 3px; font-family: 'DLY Display', var(--dly-font); }
.dly-day.is-done { background: linear-gradient(150deg, #F7DCDC, #EFE6F6); color: #8E5A5D; border-color: rgba(217,143,146,.3); }
.dly-day.is-today { box-shadow: 0 0 0 2px rgba(217,143,146,.35); }
.dly-checkin_gift { display: flex; gap: 8px; flex-wrap: wrap; margin: 14px 0 16px; }
.dly-checkin_note { font-size: 12.5px; color: var(--dly-ink-mute); margin: 12px 0 0; text-align: center; }
.dly-btn_checkin {
  width: 100%;
  padding: 15px 20px;
  font-size: 16.5px;
  border-radius: var(--dly-r-pill);
  border: 1px solid rgba(255,255,255,.7);
  background: linear-gradient(135deg, #F2C4C4, #F6C6B4);
  color: #5A4145;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 16px 30px -18px rgba(217,143,146,.9);
  transition: transform .18s, box-shadow .18s, opacity .18s;
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  font-family: var(--dly-font);
}
.dly-btn_checkin:hover { transform: translateY(-1px); }
.dly-btn_checkin:disabled { opacity: .6; cursor: default; transform: none; box-shadow: none; }
.dly-btn_checkin.is-done { background: rgba(255,255,255,.7); color: #7C6F75; box-shadow: none; border-color: var(--dly-line); }

/* ------------------------------------------------------------- 入口宫格 */
.dly-entries { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.dly-entry {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 16px;
  border-radius: var(--dly-r-lg);
  background: var(--dly-glass);
  -webkit-backdrop-filter: blur(16px) saturate(124%);
  backdrop-filter: blur(16px) saturate(124%);
  border: 1px solid rgba(255,255,255,.78);
  box-shadow: var(--dly-shadow-soft);
  color: var(--dly-ink);
  min-width: 0;
  transition: transform .18s, box-shadow .18s;
}
a.dly-entry:hover { transform: translateY(-2px); box-shadow: var(--dly-shadow); }
.dly-entry_ico {
  flex: 0 0 auto;
  width: 42px; height: 42px;
  border-radius: 15px;
  display: flex; align-items: center; justify-content: center;
  color: #A8767A;
  background: linear-gradient(150deg, #FBEDEC, #F1EAF7);
}
.dly-entry_txt { min-width: 0; flex: 1 1 auto; }
.dly-entry_txt b { display: block; font-size: 15px; font-weight: 600; }
.dly-entry_txt i { display: block; font-style: normal; font-size: 12.5px; color: var(--dly-ink-mute); margin-top: 2px; }
.dly-entry_go, .dly-entry_lock { flex: 0 0 auto; color: var(--dly-ink-mute); display: flex; }
.dly-entry.is-locked { background: rgba(255,255,255,.4); box-shadow: none; border-style: dashed; }
.dly-entry.is-locked .dly-entry_ico { color: #B6A9AE; background: rgba(240,233,235,.7); }
.dly-entry.is-locked .dly-entry_txt b { color: var(--dly-ink-soft); font-weight: 500; }

/* ------------------------------------------------------------- 柔和说明块 */
.dly-soft {
  border-radius: var(--dly-r-lg);
  padding: 16px 18px;
  background: rgba(228,220,242,.3);
  border: 1px solid rgba(169,155,196,.24);
  color: #5F5478;
  font-size: 14px;
  display: flex; gap: 11px; align-items: flex-start;
}
.dly-soft .dly-ico { flex: 0 0 auto; margin-top: 1px; }

/* ------------------------------------------------------------- 手机底栏 */
.dly-tabbar {
  display: none;
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 45;
  padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px));
  background: rgba(249,244,242,.86);
  -webkit-backdrop-filter: blur(22px) saturate(130%);
  backdrop-filter: blur(22px) saturate(130%);
  border-top: 1px solid rgba(255,255,255,.8);
  justify-content: space-around;
  gap: 4px;
}
.dly-tab {
  flex: 1 1 0;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 6px 0;
  border-radius: 16px;
  color: var(--dly-ink-mute);
  font-size: 11.5px;
  min-width: 0;
}
.dly-tab.is-on { color: #8E5A5D; background: rgba(255,255,255,.8); }

/* ------------------------------------------------------------- 自适应 */
@media (max-width: 1000px) {
  .dly-cols { grid-template-columns: 1fr; }
  .dly-entries { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .dly-nav_desktop { display: none; }
  .dly-tabbar { display: flex; }
  .dly-main { padding: 18px 14px calc(88px + env(safe-area-inset-bottom, 0px)); }
  .dly-hero { padding: 26px 22px 24px; border-radius: 28px; }
  .dly-hero_title { font-size: 27px; }
}
@media (max-width: 560px) {
  .dly-bar_in { padding: 10px 14px; gap: 10px; }
  .dly-brand_txt { font-size: 15.5px; }
  .dly-stats { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .dly-stat { padding: 13px 11px 11px; border-radius: 18px; }
  .dly-stat_num { font-size: 21px; }
  .dly-stat_lab { font-size: 11.5px; }
  .dly-entries { grid-template-columns: 1fr; gap: 10px; }
  .dly-checkin { padding: 20px 17px 18px; border-radius: 26px; }
  .dly-week { gap: 5px; }
  .dly-day { padding: 7px 0 6px; border-radius: 12px; font-size: 11px; }
  .dly-day b { font-size: 13px; }
  .dly-hero_title { font-size: 24px; }
  .dly-hero_sub { font-size: 14.5px; }
}
@media (max-width: 360px) {
  .dly-stat_num { font-size: 19px; }
  .dly-brand_txt { display: none; }
}
