/* ═══ 디자인 토큰 — 색은 여기 한 곳에서만 정한다 (REBUILD_PLAN §8 · 규격서 타이포 승계) ═══ */
:root{
  --bg:#FAF9F6;        /* 페이지 바탕 (밝은 바탕) */
  --surface:#FFFFFF;   /* 카드·입력면 */
  --line:#E7E3DA;      /* 모든 경계선 */
  --ink:#1C1A17;       /* 본문 글자 */
  --dim:#6E6A63;       /* 보조 글자 (바탕 대비 5.0:1) */
  --accent:#7A5A17;    /* 강조 글자·선 — 3곳만: 카테고리 라벨, 리드 세로선, 주 CTA */
  --accent-bg:#EAD08A; /* 주 CTA 배경 (글자는 --ink) */
  --radius:14px; --max:720px; --gap:26px;
}
*{box-sizing:border-box} html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;font-size:16px;line-height:1.7;word-break:keep-all}
a{color:inherit}
.container{max-width:var(--max);margin:0 auto;padding:0 24px}
/* 헤더 */
.site-header{border-bottom:1px solid var(--line);background:var(--surface)}
.site-header .container{display:flex;align-items:center;justify-content:space-between;height:52px}
.logo{font-weight:700;text-decoration:none;letter-spacing:-.02em}
.nav a{text-decoration:none;color:var(--dim);font-size:14px;margin-left:16px;padding:8px 0;display:inline-block;min-height:44px;line-height:28px}
.nav a.active{color:var(--ink);font-weight:600}
/* 히어로 */
.hero{padding:56px 0 8px}
.eyebrow{color:var(--accent);font-size:13px;font-weight:600;letter-spacing:0;margin:0 0 10px}
.hero h1{font-size:clamp(26px,4.6vw,34px);font-weight:700;letter-spacing:-.035em;line-height:1.3;margin:0 0 14px}
.hero p{margin:0;padding-left:16px;border-left:2px solid var(--accent);color:var(--dim)}
.hero-badge{display:inline-block;margin-top:14px;font-size:13px;color:var(--dim);border:1px solid var(--line);border-radius:999px;padding:4px 12px}
.hero-emoji{display:none} /* 이모지는 UI 요소로 쓰지 않는다 — 원문 보존 목적으로만 마크업에 남긴다 */
/* 본문 */
.article{margin-top:var(--gap)}
.section{padding:var(--gap) 0;border-top:1px solid var(--line)}
.section:first-child{border-top:0}
.section h2{font-size:18px;font-weight:700;letter-spacing:-.02em;margin:0 0 12px}
.section h3{font-size:16px;font-weight:700;margin:20px 0 6px}
.section p{margin:0 0 12px}
.section .faq-item{padding:12px 0;border-bottom:1px solid var(--line)} .section .faq-q{font-weight:700;margin-bottom:6px}
.section .related-links,.section .notice,.section .lotto-disclaimer{display:none} /* 원문에 섞인 옛 크롬: 보존하되 표시하지 않는다 */
/* 관련·공유·고지 (크롬) */
.mid-related{margin:var(--gap) 0;padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.mid-related-t{font-size:13px;color:var(--dim);margin-bottom:8px}
.mid-related a{display:block;text-decoration:none;padding:6px 0;font-weight:600}
.related{margin-top:var(--gap);padding-top:var(--gap);border-top:1px solid var(--line)}
.related h2{font-size:16px;margin:0 0 4px} .related .sub{color:var(--dim);font-size:13px;margin:0 0 10px}
.related a{display:flex;justify-content:space-between;align-items:center;text-decoration:none;padding:12px 0;border-bottom:1px solid var(--line);min-height:44px}
.related .meta{font-size:12px;color:var(--dim);margin-left:12px;white-space:nowrap}
.share{margin-top:var(--gap);display:flex;gap:8px}
.share button{flex:1;min-height:44px;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);font:inherit;font-weight:600;cursor:pointer}
.share button.kakao{background:#FEE500;border-color:#FEE500}
.disclaimer{margin:var(--gap) 0;font-size:13px;color:var(--dim)}
.cta{display:block;text-align:center;text-decoration:none;background:var(--accent-bg);color:var(--ink);font-weight:700;border-radius:var(--radius);padding:14px;min-height:44px}
/* 푸터 */
.site-footer{border-top:1px solid var(--line);margin-top:56px;padding:26px 0 40px;font-size:13px;color:var(--dim)}
.site-footer a{color:var(--ink);margin-right:14px}
/* ═══ 인라인 꿈사주 + 행운번호 (M2) ═══ */
.dream-saju{margin:var(--gap) 0;padding:22px 20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.dream-saju h2{font-size:18px;margin:0 0 8px;letter-spacing:-.02em}
.ds-today{color:var(--dim);margin:0 0 16px}
.ds-row{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:8px;margin-bottom:8px}
.dream-saju select{width:100%;min-height:44px;border:1px solid var(--line);border-radius:10px;background:var(--bg);font:inherit;padding:0 10px}
/* 사주로 가는 문 — 09-15 3단계. 꿈 상세에서 인라인 폼을 걷어내고 이 카드가 대신한다.
   해몽 본문과 섞이지 않게 카드로 세우되, 광고처럼 보이지 않도록 테두리는 얇게 둔다. */
.saju-cta{margin:22px 0;padding:16px 16px 15px;border:1px solid var(--line);border-radius:var(--radius);
  background:linear-gradient(180deg,#FFFDF7,#FBF8F0)}
.saju-cta .eyebrow{margin:0 0 4px}
.saju-cta h2{font-size:17px;margin:0 0 6px;letter-spacing:-.02em;line-height:1.35}
.page .saju-cta p{font-size:14px;color:#4A463F;margin:0 0 12px;line-height:1.7}
.saju-cta .to-saju{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  min-height:54px;border-radius:11px;background:var(--accent-bg);color:var(--ink);
  text-decoration:none;text-align:center}
.saju-cta .to-saju b{font-size:16px;font-weight:700;letter-spacing:-.02em}
.saju-cta .to-saju span{font-size:12.5px;color:#5C4A16}

/* 주제별 기운 막대 — 09-14. 숫자는 쓰지 않는다(근사 계산이라 정확해 보이는 착시를 피한다) */
.ds-tbars{margin:4px 0 10px;display:grid;gap:7px}
.ds-titem{border-radius:10px}
.ds-titem:has(.ds-trow.on){background:rgba(234,208,138,.10)}
.ds-trow{display:grid;grid-template-columns:92px 1fr auto;align-items:center;gap:10px;
  width:100%;border:0;background:none;padding:6px 8px;font:inherit;text-align:left;cursor:pointer;
  border-radius:10px;min-height:40px}
.ds-trow:hover,.ds-trow.on{background:rgba(234,208,138,.16)}
/* 「상세보기 +」를 글자로 적는다 — 꺾쇠 하나로는 누를 수 있는 줄인지 몰랐다(09-15 운영자 지적) */
.ds-tcaret{display:inline-flex;align-items:center;gap:4px;color:var(--accent);font-size:11.5px;font-weight:600;white-space:nowrap}
.ds-tcaret i{font-style:normal;font-size:14px;line-height:1;width:15px;height:15px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;background:var(--accent-bg);color:#4A3C18}
.ds-thint{font-size:12.5px;color:var(--dim);margin:0 0 2px;line-height:1.55}
.ds-thint b{color:var(--ink)}
/* 09-16 — 이름이 「~운」으로 길어졌다(최대 5자 + '운'). 이름 칸을 넓히고 버튼 글자에 이름을 넣는다.
   연애운·건강운은 막대가 없다 — 빈 칸을 남겨 줄 높이를 맞춘다(없는 근거로 막대를 세우지 않는다). */
.ds-trow{grid-template-columns:104px 1fr auto;min-height:44px}   /* 8-2 터치 타깃 — 40px 이었다 */
.ds-trow.nobar .ds-tbar{opacity:0}
.ds-tcaret{font-size:11px}
/* 안 A — /saju 맨 아래 「오늘」 묶음. 오늘 것과 타고난 것을 눈으로 갈라 놓는다 */
.ds-todaywrap{border:1px solid var(--line);border-radius:var(--radius);padding:12px 12px 4px;margin-top:22px;background:#FCFBF8}
.ds-wraplabel{margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--accent)}
.ds-todaywrap .ds-block{margin-bottom:10px}
#dream-saju .ds-tonext{margin:2px 0 12px;font-size:13.5px}
#dream-saju .ds-tonext a{color:var(--accent);text-decoration:none;display:inline-block;padding:8px 0;min-height:44px}
.ds-tdetail{margin:2px 8px 8px;padding:10px 12px;border-radius:10px;background:#FCFBF8;border:1px solid var(--line)}
.ds-tdetail h3{font-size:15.5px;margin:0 0 5px;letter-spacing:-.02em}
/* 연애운은 제목이 둘이다(마음 / 방식). 무엇을 기준으로 한 말인지 각 제목 위에 단다 — 09-16 */
#dream-saju .ds-tsub{margin:0 0 2px;font-size:11.5px;font-weight:700;letter-spacing:.04em;color:var(--accent)}
/* 목록 아래 요약 두 덩어리 — 막대 목록에서 한 칸 띄워 「마지막 줄의 내용」으로 안 읽히게 한다 */
#dream-saju .ds-tbars+.ds-tsub{margin-top:18px}
#dream-saju .ds-tgone+.ds-tsub,#dream-saju p+.ds-tsub{margin-top:16px}
#dream-saju .ds-tdetail h3+p+.ds-tsub{margin-top:14px}
.ds-tdetail p{font-size:14px;margin:0;color:#37342E;line-height:1.75}
/* 이름은 「~운」(대인관계운·재능운·재물운·직업운·학업운·연애운·건강운), 뜻은 그 밑 한 줄로 — 09-16 재설계 */
.ds-tname{font-size:13px;color:var(--dim);display:block;line-height:1.3}
.ds-tname b{display:block;font-size:14px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.ds-tname i{display:block;font-style:normal;font-size:10.5px;color:var(--dim);margin-top:1px}

/* 연애 · 건강 — 막대가 없는 카드. 근거가 십신이 아니라 따로 서 있다는 걸 테두리로 드러낸다 */
.ds-love,.ds-health{border-left:3px solid var(--accent-bg);padding-left:12px}
.ds-lovepick{display:flex;gap:8px;margin-top:10px}
.ds-lsex{flex:1;min-height:46px;border:1px solid var(--line);background:#fff;border-radius:10px;
  font:inherit;font-size:14.5px;font-weight:600;cursor:pointer;color:var(--ink)}
.ds-lsex:hover{background:rgba(234,208,138,.16);border-color:var(--accent-bg)}
.ds-health-note{font-size:12px;color:var(--dim);margin:10px 0 0;line-height:1.6;
  padding:9px 11px;border-radius:9px;background:#F6F4EF}
.ds-health-note b{color:var(--ink)}
.ds-tbar{height:8px;border-radius:999px;background:var(--line);overflow:hidden}
.ds-tbar i{display:block;height:100%;border-radius:999px;background:var(--accent-bg)}
.ds-topics h3{font-size:15.5px;margin:2px 0 4px;letter-spacing:-.02em}
.ds-tgone{color:var(--dim);font-size:13.5px;margin:8px 0 0}
.ds-tnote{font-size:12px;color:var(--dim);margin:8px 0 0;line-height:1.55}
/* 10년 흐름(대운) — 09-14 */
/* 연령별 사주 — 세로 아코디언 (09-16 운영자 지시)
   종전의 가로 알약 줄(.ds-dtl/.ds-dchip)은 좁은 화면에서 뒤쪽 연령대가 잘려 있는 줄도 몰랐고,
   본문이 한 칸뿐이라 다른 연령대를 보면 보던 것이 사라졌다. 줄마다 제 본문을 갖는다.
   위 주제 아코디언과 달리 **여러 칸을 동시에 펼쳐 둔다** — 연령대는 이어서 읽는 것이라 나란히 보는 게 맞다. */
.ds-daeun .ds-dlist{display:block;margin-top:4px}
.ds-ditem{border-radius:10px;border:1px solid var(--line);margin-bottom:8px;overflow:hidden;background:var(--surface)}
.ds-ditem:has(.ds-drow.on){border-color:var(--accent-bg)}
.ds-drow{display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;border:0;background:none;padding:10px 12px;font:inherit;text-align:left;cursor:pointer;min-height:48px}
.ds-drow:hover,.ds-drow.on{background:rgba(234,208,138,.16)}
.ds-dname{display:inline-flex;align-items:baseline;gap:8px;min-width:0}
.ds-dname b{font-size:15px;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
.ds-dnow{font-style:normal;font-size:11.5px;font-weight:600;color:#4A3C18;background:var(--accent-bg);
  border-radius:999px;padding:2px 8px;white-space:nowrap}
.ds-daeun .ds-dbody{margin:0;padding:2px 12px 14px;background:#FCFBF8;border-top:1px solid var(--line)}
.ds-daeun .ds-dbody h3{font-size:15.5px;margin:10px 0 5px;letter-spacing:-.02em}
.ds-daeun .ds-dbody p{font-size:14px;margin:0;color:#37342E;line-height:1.75}
.ds-daeun .ds-dload{color:var(--dim);font-size:14px;margin:0}
.ds-dask .linkbtn{margin-top:8px}
/* 성별 — 양력/음력 토글과 같은 모양을 쓴다(신규 CSS 최소화, 09-14) */
.ds-sexrow{margin:2px 0 4px}
.ds-sex{min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:var(--bg);font:inherit;font-size:14px;cursor:pointer}
.ds-sex.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.ds-sexnote{font-size:12px;color:var(--dim);margin:0 0 8px;line-height:1.55}
.ds-cals{display:flex;gap:8px;margin:4px 0 8px}
.ds-cal{min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:var(--bg);font:inherit;font-size:14px;cursor:pointer}
.ds-cal.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.ds-leap{font-size:14px;color:var(--dim);margin:0 0 8px}
.ds-go{width:100%;min-height:48px;border:0;border-radius:var(--radius);background:var(--accent-bg);color:var(--ink);font:inherit;font-weight:700;cursor:pointer;margin-top:6px}
.ds-priv{font-size:12px;color:var(--dim);margin:10px 0 0}
/* 입력 완료 상태 — 폼을 감추지 않고 값이 들어간 채로 남긴다 (09-16 운영자 지적)
   ⚠️ `#dream-saju` 로 시작한다. /saju 는 main.page 라 `.page p{color:var(--ink)}`(0,2,0)가
      한 클래스 규칙을 이긴다(09-15 3D 패널에서 같은 함정을 밟았다). */
#dream-saju .ds-form.ds-done{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:14px;margin-bottom:18px}
#dream-saju .ds-form.ds-done .ds-priv,#dream-saju .ds-form.ds-done .ds-sexnote{display:none}
#dream-saju .ds-form.ds-done .ds-go{background:transparent;border:1px solid var(--line);font-weight:600;min-height:44px;margin-top:10px}
#dream-saju .ds-cur{font-size:13px;color:var(--dim);margin:0 0 10px;line-height:1.5}
#dream-saju .ds-cur b{color:var(--ink);margin-right:6px;font-weight:700}
.ds-err{color:#B42318;font-size:14px;margin:6px 0 0}
.ds-block{padding:16px 0;border-top:1px solid var(--line)} .ds-block:first-child{border-top:0;padding-top:4px}
.ds-label{font-size:12px;color:var(--accent);font-weight:600;margin:0 0 4px}
.ds-block h3{margin:0 0 6px;font-size:17px} .ds-block p{margin:0 0 8px}
.ds-bridge{padding-left:12px;border-left:2px solid var(--accent)}
.balls{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 12px}
.ball{width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:17px;color:#1C1A17;box-shadow:inset -4px -5px 8px rgba(0,0,0,.18),inset 3px 4px 6px rgba(255,255,255,.55)}
.ball.b1{background:#FBC400} .ball.b2{background:#69C8F2} .ball.b3{background:#FF7272} .ball.b4{background:#B5B5B5} .ball.b5{background:#B0D840}
.ball.core{outline:2px solid var(--ink);outline-offset:2px}
.ds-why{font-size:14px;color:var(--dim)}
.ds-actions{display:flex;gap:8px;margin:8px 0}
.ds-actions button{flex:1;min-height:44px;border-radius:10px;border:1px solid var(--line);background:var(--bg);font:inherit;font-weight:600;cursor:pointer}
.ds-actions .ds-save{background:var(--ink);color:var(--surface);border-color:var(--ink)} .ds-actions .ds-save:disabled{opacity:.7}
.ds-note{font-size:12px;color:var(--dim);margin:0}
/* ═══ 요약 카드 · 목차 · 공유 · 광고 슬롯 (M2-2) ═══ */
.summary{margin:var(--gap) 0 0;padding:18px 20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.summary .grade{display:inline-block;font-size:13px;font-weight:700;color:var(--accent);border:1px solid var(--accent);border-radius:999px;padding:2px 10px;margin-bottom:10px}
.summary .line{margin:0 0 10px;font-weight:600}
.summary .todo{margin:0;color:var(--dim);font-size:15px}
.summary .todo b{color:var(--ink);font-weight:600}
/* 09-15: 종전 문구는 "이 꿈을 꾼 오늘, 당신의 흐름과 행운번호"라 **사주라는 말이 없었고**,
   목차 칩 바로 위 옅은 상자라 목차의 일부처럼 보였다 — 운영자가 "사주로 연결되는 게 어디 있냐"고 못 찾았다.
   주 CTA 배경(--accent-bg)으로 목차와 분리한다. OPERATIONS §4 「주 CTA 는 3곳만」 중 하나다. */
.summary .to-saju{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  text-align:center;text-decoration:none;margin:14px 0 2px;padding:12px 14px;border-radius:12px;
  background:var(--accent-bg);color:var(--ink);min-height:58px}
.summary .to-saju b{font-size:15.5px;font-weight:700;letter-spacing:-.02em}
.summary .to-saju span{font-size:12.5px;color:#5C4A16}
.toc{margin:10px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.toc a{font-size:13px;color:var(--dim);text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:6px 10px;min-height:32px;display:inline-block}
.ad-slot:empty{display:none} .ad-slot{margin:var(--gap) 0;text-align:center}
.share button.card{background:var(--accent-bg);border-color:var(--accent-bg)}
.toast{position:fixed;left:50%;bottom:32px;transform:translateX(-50%);background:var(--ink);color:var(--surface);padding:10px 16px;border-radius:999px;font-size:14px;z-index:9}
.section{scroll-margin-top:64px}
/* ═══ /today (M3) ═══ */
.today .hero{padding-bottom:0}
.box{margin-top:var(--gap);padding-top:var(--gap);border-top:1px solid var(--line)}
.box h2{font-size:18px;margin:0 0 4px} .box .sub{color:var(--dim);font-size:14px;margin:0 0 10px}
.week{margin-bottom:14px} .week-t{font-size:13px;color:var(--accent);font-weight:600;margin:0 0 6px}
.row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none;min-height:44px}
.row-d{font-size:13px;color:var(--dim);white-space:nowrap}
.balls.small{gap:4px;margin:0} .balls.small .ball{width:30px;height:30px;font-size:13px}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-size:inherit;color:var(--ink);text-decoration:underline;cursor:pointer}
/* ═══ 홈·사전·꿈사주·정적 페이지 (M5) ═══ */
.home-hero h1{margin-bottom:18px}
.search{display:flex;gap:8px} .search input,.search-input{flex:1;min-height:48px;border:1px solid var(--line);border-radius:var(--radius);padding:0 14px;font:inherit;background:var(--surface);width:100%}
.search .cta{flex:0 0 auto;padding:0 18px;display:flex;align-items:center}
.results{margin-top:8px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:0 14px}
.results .row{width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);font:inherit;cursor:pointer;color:var(--ink)}
.results .row:last-child{border-bottom:0}
.dcard{margin-top:var(--gap);padding:18px 20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.dcard .grade{display:inline-block;font-size:13px;font-weight:700;color:var(--accent);border:1px solid var(--accent);border-radius:999px;padding:2px 10px;margin-bottom:8px}
.dcard h2{margin:0 0 8px;font-size:20px} .dcard .todo{color:var(--dim);font-size:15px} .dcard .todo b{color:var(--ink)}
.dcard .to-saju{display:inline-block;margin-top:6px;font-weight:700;text-decoration:none;color:var(--accent)}
.sub-inline{font-size:13px;color:var(--dim);font-weight:400;margin-left:6px}
.list .row{color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:6px} .chips a,.chips button{font-size:13px;color:var(--dim);text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:6px 10px;min-height:32px;background:var(--surface);font:inherit;cursor:pointer}
.chips a.on,.chips button.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.today-cta .cta{margin-top:10px}
.cho-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}
.cho-tabs a{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;text-decoration:none;font-weight:700;background:var(--surface)}
.cho-section{margin-top:var(--gap);scroll-margin-top:64px} .cho-header{font-size:13px;color:var(--accent);font-weight:700;margin:0 0 4px}
.cho-section .row[hidden]{display:none}
.page h1{font-size:clamp(24px,4.6vw,30px);letter-spacing:-.03em;margin:40px 0 8px} .page h2{font-size:18px;margin:26px 0 8px} .page p,.page li{color:var(--ink)}
.page .updated{font-size:13px;color:var(--dim);margin-bottom:16px} .page .card{padding:16px 18px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);margin:12px 0}
.page .highlight{padding:12px 14px;border-left:2px solid var(--accent);background:var(--surface)}
.page .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0} .page .stat-card{text-align:center;padding:14px 8px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)} .page .stat-num{display:block;font-weight:800;font-size:20px} .page .stat-label{font-size:12px;color:var(--dim)}
.page .section-title{font-weight:700;margin:26px 0 8px} .page .feature-list{list-style:none;padding:0} .page .feature-item{padding:8px 0;border-bottom:1px solid var(--line)} .page .feature-dot{display:none}
.page .dream-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px} .page .dream-item{padding:10px;border:1px solid var(--line);border-radius:10px;text-decoration:none;background:var(--surface)} .page .dream-item-icon{display:none}
.page .hero-emoji{display:none} .page .cta-btn{display:inline-block;margin-top:12px;padding:12px 18px;border-radius:var(--radius);background:var(--accent-bg);color:var(--ink);text-decoration:none;font-weight:700}
.page .disclaimer{font-size:13px;color:var(--dim)}
/* ═══ 모바일 실측 보정 (09-08 360px 감사: 가로 넘침 0, 터치 타깃·12px 글자만 미달) ═══ */
.logo{display:inline-flex;align-items:center;min-height:44px}
.nav a{min-width:44px;text-align:center;padding:8px 6px;margin-left:6px}
.toc a,.chips a,.chips button{min-height:44px;display:inline-flex;align-items:center}
.cho-tabs a{width:44px;height:44px}
.site-footer a{display:inline-block;padding:10px 0;min-height:44px}
.linkbtn{min-height:44px;display:inline-flex;align-items:center}
.ds-label,.ds-priv,.ds-note,.related .meta,.row-d,.page .stat-label{font-size:13px}
#td-echo a,.ds-note a{display:inline-block;padding:6px 0}
.mid-related a{min-height:44px;display:flex;align-items:center}
#td-echo a,.ds-note a{padding:10px 0}

/* ═══ 행운번호 순차 등장 (09-08 운영자 요청 — 옛 홈의 스태거 복원)
   ⚠️ '안 보이는 상태'는 기본값이 아니라 JS가 붙이는 .pending 에만 건다.
      스크립트가 실패해도 번호·설명이 사라지지 않는다(09-08 설계 변경). ═══ */
.balls.reveal{min-height:42px}                     /* 자리를 미리 잡아 레이아웃이 밀리지 않게 */
.balls.reveal .ball{transition:opacity .28s ease,transform .38s cubic-bezier(.34,1.56,.64,1)}
.balls.reveal.pending .ball:not(.show){opacity:0;transform:scale(.4) translateY(6px)}
.ds-lucky .ds-why,.ds-lucky .ds-actions{transition:opacity .4s ease}
.ds-lucky.pending .ds-why,.ds-lucky.pending .ds-actions{opacity:0}
/* 꿈에서 온 번호는 착지할 때 테두리가 한 번 번진다 — 나머지와 구분되는 순간을 만든다 */
.balls.reveal.pending .ball.core.show{animation:coreLand .7s ease-out .1s 1}
@keyframes coreLand{
  0%{box-shadow:inset -4px -5px 8px rgba(0,0,0,.18),inset 3px 4px 6px rgba(255,255,255,.55),0 0 0 0 rgba(122,90,23,.55)}
  60%{box-shadow:inset -4px -5px 8px rgba(0,0,0,.18),inset 3px 4px 6px rgba(255,255,255,.55),0 0 0 9px rgba(122,90,23,0)}
  100%{box-shadow:inset -4px -5px 8px rgba(0,0,0,.18),inset 3px 4px 6px rgba(255,255,255,.55),0 0 0 0 rgba(122,90,23,0)}
}
@media (prefers-reduced-motion: reduce){
  .balls.reveal.pending .ball:not(.show){opacity:1;transform:none}
  .balls.reveal .ball{transition:none}
  .ds-lucky.pending .ds-why,.ds-lucky.pending .ds-actions{opacity:1}
  .balls.reveal.pending .ball.core.show{animation:none}
}
/* ═══ 근거 공개 (09-10) ═══ */
.ds-basis{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.ds-basis summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--accent);min-height:44px;display:flex;align-items:center;list-style:none}
.ds-basis summary::-webkit-details-marker{display:none}
.ds-basis summary::before{content:'＋';margin-right:6px;font-weight:400}
.ds-basis[open] summary::before{content:'－'}
.ds-basis dl{margin:6px 0 0;font-size:14px}
.ds-basis dt{color:var(--dim);font-size:13px;margin-top:10px}
.ds-basis dd{margin:2px 0 0}
.ds-basis-more{font-size:13px;color:var(--dim);margin:14px 0 0;padding-top:10px;border-top:1px solid var(--line)}
.ds-basis-more b{color:var(--ink)}
.ds-basis-more a{display:inline-block;padding:8px 0;font-weight:600;color:var(--accent)}