/* DESIGN.md案（pen.dev の「DESIGN.md案」13画面）をアプリへ当てる層。private-app.css の後に読む。
   色の意味：操作・今日＝青 / 注意＝赤 / 予定＝緑 / タスク＝紫 / 中立＝灰。ダークテーマには当てない。 */
:root {
  --ds-paper: #ffffff; --ds-ink: #2b2116; --ds-ink-sub: #7a7268; --ds-rule-light: #d9d5cc;
  --ds-tint: #cfe8ef; --ds-action: #2e6e84; --ds-alert: #c0362c; --ds-alert-soft: #fbecea; --ds-alert-line: #f0ccc7;
  --ds-neutral-soft: #eef1f2; --ds-select: #eaf0f3;
  --font-heading: "Zen Kaku Gothic New", var(--font-sans);
}
:root:not([data-theme=dark]) {
  --text-primary: var(--ds-ink); --text-secondary: var(--ds-ink-sub); --text-tertiary: var(--ds-ink-sub); --text-muted: var(--ds-ink-sub); --ink: var(--ds-ink);
  --border: var(--ds-rule-light); --border-light: var(--ds-rule-light); --control-line: var(--ds-rule-light);
  --bg-secondary: var(--ds-paper); --accent: var(--ds-action); --accent-soft: var(--ds-tint); --muji-red: var(--ds-action);
  --overdue: var(--ds-alert); --overdue-tint: var(--ds-alert-soft); --overdue-line: var(--ds-alert-line);
  --shadow-1: none; --shadow-2: none; --shadow-3: none;
}
body { letter-spacing: .05em; }
.private-date { letter-spacing: 0; }

/* 見出し書体：画面タイトル・セクション見出し・年月・設定の区分見出しだけ */
.lp-logo-text, .cp-header-title, .auth-card h1, .calendar-toolbar h2, .diary-month, .set-group h2,
.home-first h2, .home-block-heading h2, .home-pair > h2, .home-plan > h2 { font-family: var(--font-heading); font-weight: 700; letter-spacing: .05em; }

/* 下部タブは公開版の色のまま */
.mobile-tabbar { --accent: #405d70; --accent-soft: #eaf0f3; --text-primary: #273740; --text-secondary: #65737a; --border-light: #e6eae7; }

/* 主ボタン：白地＋焦げ茶の罫線。押せる所の主従は枠の濃さで分ける */
:root:not([data-theme=dark]) .btn-primary, :root:not([data-theme=dark]) #add-button { background: var(--ds-paper); border-color: var(--ds-ink); color: var(--ds-ink); }
:root:not([data-theme=dark]) .btn-primary:not(:disabled):hover, :root:not([data-theme=dark]) #add-button:not(:disabled):hover,
:root:not([data-theme=dark]) .btn-primary:not(:disabled):active, :root:not([data-theme=dark]) #add-button:not(:disabled):active { background: var(--ds-ink); border-color: var(--ds-ink); color: var(--ds-paper); }
:root:not([data-theme=dark]) .btn-ghost:not(:disabled):hover,
:root:not([data-theme=dark]) .btn-outline:not(:disabled):hover,
:root:not([data-theme=dark]) .agenda-links .btn:not(:disabled):hover { background: var(--ds-neutral-soft); }
:root:not([data-theme=dark]) #add-button { box-shadow: none; }

/* 選択は控えめに：カレンダーの選択日と日記一覧の選択行は淡い灰青 */
:root:not([data-theme=dark]) .private-day.selected { background: var(--ds-select); box-shadow: none; }
:root:not([data-theme=dark]) .private-day.today .private-date { background: var(--ds-action); color: var(--ds-paper); }
:root:not([data-theme=dark]) .diary-list-row[aria-pressed=true] { background: var(--ds-select); }

/* タグ・補足は灰で、意味を持たせない */
:root:not([data-theme=dark]) .diary-tags span,
:root:not([data-theme=dark]) .place-badges > span,
:root:not([data-theme=dark]) .place-tag { background: var(--ds-neutral-soft); color: var(--ds-ink-sub); }

/* 影の代わりに罫線で重なりを示す */
:root:not([data-theme=dark]) .private-dialog,
:root:not([data-theme=dark]) .private-search-results,
:root:not([data-theme=dark]) .map-detail.map-sheet { border: 1px solid var(--ds-rule-light); }
:root:not([data-theme=dark]) .switch-track::after { box-shadow: none; }

/* ローディング：ロゴの本と栞を線で描く */
.auth-loader { display: none; }
.auth-gate:is([data-state=loading], [data-state=done]) { background: var(--bg); }
.auth-gate:is([data-state=loading], [data-state=done]) .auth-card { border-color: transparent; text-align: center; }
.auth-gate:is([data-state=loading], [data-state=done]) .auth-card > img,
.auth-gate:is([data-state=loading], [data-state=done]) .auth-card > p:not(#auth-status),
.auth-gate:is([data-state=loading], [data-state=done]) form,
.auth-gate:is([data-state=loading], [data-state=done]) #retry-auth { display: none !important; }
.auth-gate:is([data-state=loading], [data-state=done]) .auth-loader { display: block; width: 120px; height: 100px; margin: 0 auto; }
.auth-gate:is([data-state=loading], [data-state=done]) h1 { margin-top: 8px; animation: loader-fade .6s ease-out both; }
.auth-gate:is([data-state=loading], [data-state=done]) #auth-status { color: var(--text-secondary); font-size: 13px; animation: loader-fade .6s .2s ease-out both; }
.auth-loader path, .auth-loader circle { fill: none; stroke: var(--ds-ink); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.auth-loader .book { stroke-dasharray: 100; stroke-dashoffset: 100; animation: loader-draw .9s ease-out forwards; }
.auth-loader .spine { stroke-dasharray: 100; stroke-dashoffset: 100; animation: loader-spine 3.2s ease-out infinite; animation-delay: calc(.6s + var(--i) * .18s); }
.auth-loader .sun { fill: #f5c400; opacity: 0; animation: loader-sun 3.2s ease-out infinite; animation-delay: 1.5s; }
@keyframes loader-draw { to { stroke-dashoffset: 0; } }
@keyframes loader-spine { 0% { stroke-dashoffset: 100; opacity: 1; } 28%, 78% { stroke-dashoffset: 0; opacity: 1; } 92%, 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes loader-sun { 0%, 8% { opacity: 0; } 22%, 62% { opacity: 1; } 76%, 100% { opacity: 0; } }
@keyframes loader-fade { from { opacity: 0; transform: translateY(12px); } }
/* 読み込み完了：描き切った形で止め、タップを待つ */
.auth-gate[data-state=done] { cursor: pointer; }
.auth-gate[data-state=done] .auth-loader .book { animation: none; stroke-dashoffset: 0; }
.auth-gate[data-state=done] .auth-loader .spine { animation: loader-finish .5s ease-out both; animation-delay: calc(var(--i, 0) * .08s); }
.auth-gate[data-state=done] .auth-loader .sun { animation: loader-fade-in .4s .45s ease-out both; }
.auth-gate[data-state=done] #auth-status { color: var(--text-primary); animation: loader-fade .6s .5s ease-out both; }
@keyframes loader-finish { from { stroke-dashoffset: 100; opacity: 1; } to { stroke-dashoffset: 0; opacity: 1; } }
@keyframes loader-fade-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .auth-loader .book, .auth-loader .spine, .auth-loader .sun,
  .auth-gate h1, .auth-gate #auth-status { animation: none; stroke-dashoffset: 0; opacity: 1; }
}