/* 오늘의 운세(/today, /today/{띠}) 공용 스타일 — 무료 사주 페이지와 같은 색·글꼴 */
/* 색·글꼴은 site.css 공용 토큰을 따른다 */
:root{
  --t-paper:var(--c-paper);--t-card:var(--c-card);--t-sub:var(--c-paper-2);--t-dark:var(--c-ink);
  --t-ink:var(--c-ink);--t-ink2:var(--c-ink-2);--t-muted:var(--c-ink-3);--t-red:var(--c-red);--t-gold:var(--c-gold);
  --t-border:var(--c-line);--t-serif:var(--f-serif);--t-sans:var(--f-sans);
}
*{box-sizing:border-box}
body{margin:0;background:var(--t-paper);color:var(--t-ink);font-family:var(--t-sans);line-height:1.6}
.t-wrap{max-width:640px;margin:0 auto;padding:20px 16px 48px}
.t-back{display:inline-block;margin-bottom:14px;color:var(--t-muted);text-decoration:none;font-family:var(--t-serif);font-size:14px}
.t-h1{font-family:var(--t-serif);font-size:28px;margin:0 0 4px;font-weight:600}
.t-date{color:var(--t-ink2);font-size:14px;margin-bottom:18px}
.t-sec{margin:28px 0 10px;font-family:var(--t-serif);font-size:18px}
.t-note{font-size:12.5px;color:var(--t-muted);line-height:1.6}
/* 운세 카드 */
.tf-card{position:relative;background:var(--t-card);border:1px solid var(--t-border);border-radius:var(--r-lg);padding:22px 18px;box-shadow:var(--sh-card)}
.tf-who{font-size:12.5px;letter-spacing:.08em;color:var(--t-gold);margin-bottom:8px}
.tf-total{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tf-stars{font-size:24px;color:#C79A2E;letter-spacing:2px}
.tf-stars .off{color:#E5DCC8}
.tf-word{font-size:14px;color:var(--t-ink2)}
.tf-headline{font-family:var(--t-serif);font-size:21px;margin:12px 0 6px}
.tf-body{font-size:14.5px;margin:6px 0 14px}
.tf-domains{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.tf-domains li{display:grid;grid-template-columns:56px 48px 1fr;gap:8px;align-items:baseline;font-size:13.5px;padding:8px 0;border-top:1px dashed var(--t-border)}
.tf-dk{font-weight:600}
.tf-ds{font-size:12px;text-align:center;border-radius:999px;padding:1px 0}
.tf-ds.good{background:var(--c-good-bg);color:var(--c-good)}.tf-ds.mid{background:var(--c-mid-bg);color:var(--c-mid)}.tf-ds.warn{background:var(--c-warn-bg);color:var(--c-warn)}
.tf-dt{color:var(--t-ink2)}
.tf-lucky{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--t-border);font-size:13px;color:var(--t-ink2)}
.tf-lucky b{color:var(--t-ink)}
.tf-why{margin-top:10px;font-size:12px;color:var(--t-muted)}
/* 입력·버튼 */
.t-form{background:var(--t-card);border:1px solid var(--t-border);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:10px}
.t-row{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.t-row select{flex:1;min-width:0;padding:10px 6px;border-radius:8px;border:1px solid var(--t-border);background:#fff;font-size:14px}
.t-seg{flex:1;display:flex;border:1px solid var(--t-border);border-radius:8px;overflow:hidden}
.t-seg button{flex:1;padding:9px 0;border:0;background:#fff;font-size:14px;cursor:pointer}
.t-seg button.on{background:var(--t-dark);color:#f3ead2}
.t-btn{display:block;width:100%;padding:13px;border:0;border-radius:8px;background:var(--t-dark);color:#f3ead2;font-family:var(--t-serif);font-size:15px;cursor:pointer;text-align:center;text-decoration:none}
.t-btn.gold{background:var(--t-gold);color:var(--t-dark)}
.t-link{color:var(--t-ink2);font-size:13px}
.t-cta{margin-top:16px;background:var(--t-sub);border-radius:12px;padding:18px;text-align:center}
.t-cta p{margin:0 0 12px;font-size:14px}
.t-logins{display:flex;flex-direction:column;gap:6px;max-width:320px;margin:10px auto 0}
.t-logins a{display:block;padding:10px;border-radius:8px;font-size:13.5px;font-weight:600;text-decoration:none;text-align:center}
.t-logins .kakao{background:#FEE500;color:#191919}.t-logins .naver{background:#03C75A;color:#fff}.t-logins .google{background:#fff;color:#1f1f1f;border:1px solid #ddd}
/* 띠 목록 */
.t-ttis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.t-ttis a{display:block;padding:10px 4px;text-align:center;background:var(--t-card);border:1px solid var(--t-border);border-radius:8px;color:var(--t-ink);text-decoration:none;font-size:13.5px}
.t-ttis a.on{border-color:var(--t-dark);font-weight:600}
.t-years{display:flex;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--t-ink2)}
.t-years span{background:var(--t-card);border:1px solid var(--t-border);border-radius:999px;padding:3px 10px}
.t-faq details{background:var(--t-card);border:1px solid var(--t-border);border-radius:8px;padding:10px 14px;margin-bottom:8px}
.t-faq summary{cursor:pointer;font-weight:600;font-size:14px}
.t-faq p{font-size:13.5px;color:var(--t-ink2);margin:8px 0 0}
.t-channel{margin-top:16px;padding:16px;border-radius:var(--r-lg);background:var(--c-card);border:1px solid var(--c-line);text-align:center;font-size:13.5px}
.t-channel a{display:inline-block;margin-top:8px;padding:9px 18px;border-radius:8px;background:#FEE500;color:#191919;font-weight:600;text-decoration:none}
.t-foot{margin-top:32px;font-size:12px;color:var(--t-muted);text-align:center}
@media (max-width:420px){.t-ttis{grid-template-columns:repeat(3,1fr)}}

/* 백로 캐릭터(둥근백로) */
.tf-heron{position:absolute;top:-22px;right:8px;width:72px;height:auto;pointer-events:none}
.tf-who,.tf-total{padding-right:70px}
.t-wait{text-align:center;padding:24px 0}
.t-wait img{width:84px;height:auto;display:block;margin:0 auto 6px}

/* 밤결타로 연결(2026-10-20) — 오늘의 운세를 다 읽은 아래 */
.t-tarot{display:flex;flex-direction:column;gap:4px;margin-top:16px;padding:16px 18px;border-radius:var(--r-lg);background:linear-gradient(135deg,#141a33,#2a1f3d);color:#f1e9ff;text-decoration:none;border:1px solid rgba(190,170,255,.25)}
.t-tarot .tt-k{font-size:11.5px;letter-spacing:.04em;color:#c9b8ff}
.t-tarot b{font-size:16px;font-weight:600}
.t-tarot .tt-d{font-size:13.5px;color:rgba(241,233,255,.85)}
.t-tarot:hover{border-color:rgba(190,170,255,.6)}
.cg-sister{margin:8px 0 0;font-size:12.5px;opacity:.85}
.cg-sister a{color:inherit}

/* 백로의 도장(출석) */
.t-stamp{margin-top:14px;background:var(--t-card);border:1px solid var(--t-border);border-radius:12px;padding:14px;text-align:center}
.t-stamp .h{font-family:var(--t-serif);font-size:16px}.t-stamp .h small{display:block;font-family:inherit;font-size:12px;color:var(--t-muted);margin-top:2px}
.t-stamp .row{display:flex;justify-content:center;gap:6px;margin:12px 0 8px}
.t-stamp .row i{font-style:normal;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1.5px dashed var(--t-border);color:var(--t-muted);font-size:12px}
.t-stamp .row i.on{border:0;background:#8B1A1A;color:#fbe9c6;font-family:var(--t-serif);font-size:16px;transform:rotate(-8deg)}
.t-stamp .row i.new{animation:tStampIn .5s ease-out}.t-stamp .row.one i{width:48px;height:48px;font-size:22px}
@keyframes tStampIn{0%{transform:scale(1.8) rotate(-20deg);opacity:0}70%{transform:scale(.92) rotate(-6deg);opacity:1}100%{transform:scale(1) rotate(-8deg)}}
.t-stamp p{font-size:13.5px;margin:0;color:var(--t-ink2);word-break:keep-all}.t-stamp p.got{color:var(--t-ink);margin-bottom:10px}