/* 디데이·기념일 계산기 전용 CSS — 시안 dday.html head <style>에서 옮김(2026-10-06). 공용 부품은 assets/v2.css */
/* ============================================================
   디데이·기념일 계산기 — 전용 레이아웃 (공용 요소는 assets/v2.css)
   ============================================================ */
.dd-set{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 24px;align-items:end;padding:16px 18px 14px;border-bottom:1px solid var(--soft)}
.dd-set__left{display:grid;gap:10px;min-width:0}
.dd-date{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dd-date input[type="date"]{height:var(--v2-ctl,42px);padding:0 10px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);font-family:var(--sans);font-size:15px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;outline:0;min-width:170px;transition:border-color var(--ease),box-shadow var(--ease)}
.dd-date input[type="date"]:focus{border-color:var(--ink);box-shadow:0 0 0 2px var(--accent-wash)}
.dd-date .today{font-family:var(--sans);font-size:12px;color:var(--muted);white-space:nowrap}

/* 결과 머리: 큰 숫자 + 다음 기념일 2칸 */
.dd-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.dd-big{padding:18px 18px 16px;min-width:0}
.dd-big .v2-label{display:block;margin-bottom:6px}
.dd-bar{margin:14px 0 0}
.dd-bar i{display:block;height:4px;background:var(--soft);border-radius:2px;overflow:hidden}
.dd-bar i b{display:block;height:100%;width:0;background:var(--accent);transition:width 240ms ease}
.dd-bar span{display:block;margin-top:6px;font-family:var(--sans);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.dd-bar span strong{color:var(--ink);font-weight:700}
.dd-next{display:grid;grid-template-rows:1fr 1fr;border-left:1px solid var(--soft)}
.dd-next > div{padding:14px 18px;min-width:0}
.dd-next > div + div{border-top:1px solid var(--soft)}
.dd-next .v2-label{display:block;margin-bottom:4px}
.dd-next b{display:block;font-size:15px;font-weight:750;letter-spacing:-.01em}
.dd-next b .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin:0 7px 1px 0;vertical-align:middle}
.dd-next p{margin:3px 0 0;font-family:var(--sans);font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.dd-next p strong{color:var(--ink);font-weight:700}

/* 기념일 표 */
.dd-table{padding:6px 18px 4px}
.dd-table table{width:100%;border-collapse:collapse}
.dd-table th{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--muted);text-align:left;padding:8px 6px 6px;border-bottom:1px solid var(--line)}
.dd-table td{padding:8px 6px;border-bottom:1px solid var(--soft);font-size:13.5px;vertical-align:middle}
.dd-table tr:last-child td{border-bottom:0}
.dd-table td.k{font-weight:700;white-space:nowrap}
.dd-table td.d{font-family:var(--sans);font-variant-numeric:tabular-nums;white-space:nowrap}
.dd-table td.w{color:var(--muted);white-space:nowrap}
.dd-table td.r{text-align:right;font-family:var(--sans);font-variant-numeric:tabular-nums;white-space:nowrap}
.dd-table th.r{text-align:right}
.dd-table tr.past td{color:var(--muted)}
.dd-table tr.past td.k{font-weight:600}
.dd-table tr.next td{background:var(--accent-wash)}
.dd-table tr.next td.k::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin:0 7px 1px 0;vertical-align:middle}
.dd-table tr.today td.r{color:var(--accent);font-weight:700}
.dd-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 18px 16px;border-top:1px solid var(--soft)}
.dd-foot .v2-status{margin-left:auto}
.dd-past{margin:0 18px 10px}
.dd-past summary{cursor:pointer;list-style:none;font-family:var(--sans);font-size:12px;font-weight:600;color:var(--muted);padding:8px 0}
.dd-past summary::-webkit-details-marker{display:none}
.dd-past summary:hover{color:var(--ink)}

.dd-table th.s{width:36px}
.dd-table td.s{text-align:right;padding-right:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.dd-ics{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:var(--radius);color:var(--muted);transition:background var(--ease),color var(--ease)}
.dd-ics:hover{background:var(--btn);color:var(--ink)}
.dd-ics .i{width:14px;height:14px}
@media (max-width:720px){
  /* v2: 모바일에서는 결과(큰 숫자·다음 기념일)를 입력보다 먼저 보여 준다 */
  .v2-work{display:flex;flex-direction:column}
  .dd-head{order:-1;border-bottom:1px solid var(--soft)}
  .dd-set{grid-template-columns:minmax(0,1fr)}
  .dd-head{grid-template-columns:minmax(0,1fr)}
  .dd-next{border-left:0;border-top:1px solid var(--soft);grid-template-rows:none;grid-template-columns:1fr 1fr}
  .dd-next > div + div{border-top:0;border-left:1px solid var(--soft)}
  .dd-table td.w,.dd-table th.w{display:none}
}
@media (max-width:420px){
  .dd-set,.dd-big,.dd-next > div,.dd-foot{padding-left:12px;padding-right:12px}
  .dd-table{padding-left:12px;padding-right:12px}
  .dd-next{grid-template-columns:minmax(0,1fr)}
  .dd-next > div + div{border-left:0;border-top:1px solid var(--soft)}
}

/* saturn 모듈 추가분(2026-10-06): 빠른 선택·시각 옵션·남은 시간 줄 */
.dd-set{align-items:start}
.dd-quick{margin-top:2px}
.dd-quick button{height:30px;padding:0 11px;font-family:var(--mono);font-size:11.5px;font-weight:700}
.dd-time{display:grid;gap:10px;align-content:start;min-width:0}
.dd-time__input{display:flex;align-items:center;gap:10px}
.dd-time__input input[type="time"]{height:var(--v2-ctl,42px);padding:0 10px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);font-family:var(--sans);font-size:14px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.dd-time__input input[type="time"]:focus{border-color:var(--ink);box-shadow:0 0 0 2px var(--accent-wash)}
.dd-clock{margin:8px 0 0;font-family:var(--sans);font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.dd-clock b{color:var(--ink);font-weight:700}
.v2-big.is-empty span{font-size:18px;font-weight:600;color:var(--muted)}