/* ═══════════════════════════════════════════════════════════ somapoint — themes.css (4 visual directions, var contracts) set on ═══════════════════════════════════════════════════════════ */ :root { --radius-sm: 8px; --radius-md: 14px; --radius-lg: 20px; --ease: cubic-bezier(.33,1,.68,1); --font-body: 'Noto Sans JP', sans-serif; --font-display: 'Noto Sans JP', sans-serif; --font-num: 'Noto Sans JP', sans-serif; --grain-opacity: 0; } /* ─────────────────────────────────────────────────────────── A · FOREST — 既存進化。深緑×ベージュ、有機的で温かい ─────────────────────────────────────────────────────────── */ [data-theme="forest"] { --shell: #1e3d1a; --bg: #faf7f2; --surface: #ffffff; --surface-2: #f3ede1; --surface-hero: linear-gradient(150deg,#ffffff 55%,#f1ead9 100%); --surface-quote: linear-gradient(135deg,#fffdf8,#f3ede1); --header-bg: linear-gradient(160deg,#1e3d1a 0%,#2d5a27 100%); --header-fg: #f5f0e8; --header-fg-dim: rgba(245,240,232,.72); --header-press: rgba(255,255,255,.13); --tabbar-bg: #1e3d1a; --tabbar-border: #2d5a27; --tab-fg: rgba(245,240,232,.5); --tab-active: #b88a1e; --text: #1a1a14; --text-mid: #3d3d30; --muted: #7a7a6a; --accent: #2d5a27; --accent-fg: #f5f0e8; --accent-ink: #1e3d1a; --accent-soft: #eaf3e6; --accent-grad: linear-gradient(90deg,#2d5a27,#4a9c3e); --border: rgba(30,61,26,.07); --border-strong: #e3dccc; --divider: #e8e0d0; --ring-track: #e8e0d0; --st-full:#3a8c32; --st-full-bg:#e8f5e6; --st-am:#2870b8; --st-am-bg:#e6f0fa; --st-pm:#c8640a; --st-pm-bg:#fdf0e4; --st-abs:#8a8a80; --st-abs-bg:#f0f0ec; --st-off:#b0a898; --st-off-bg:#f0ece6; --sat:#2870b8; --sun:#c8640a; --money:#8b6914; --st-sched:#6882b0; --st-sched-bg:#edf1f9; --seg-bg:#e8e0d0; --toggle-off:#d8d0c0; --cell-bg:#fff; --dot:9px; --badge-radius:50%; --cal-gap:5px; --scrim:rgba(20,35,18,.5); --scrim-strong:rgba(20,35,18,.85); --toast-bg:#1e3d1a; --toast-fg:#f5f0e8; --danger:#c0392b; --shadow-card:0 2px 12px rgba(30,61,26,.1),0 1px 3px rgba(30,61,26,.06); --shadow-row:0 1px 4px rgba(30,61,26,.06); --shadow-sheet:0 -8px 32px rgba(30,61,26,.2); --font-display:'Kaisei Opti', serif; --font-num:'Kaisei Opti', serif; --grain-opacity:.04; --pt-cash-hd-bg: rgba(139,105,20,.09); } /* ─────────────────────────────────────────────────────────── B · WASHI — 和紙×墨×朱。明朝の編集的な静けさ、判子マーク ─────────────────────────────────────────────────────────── */ [data-theme="washi"] { --shell: #2a2620; --bg: #ece3d1; --surface: #f6f0e1; --surface-2: #e6dcc6; --surface-hero: linear-gradient(155deg,#f7f2e4,#ece2cf); --surface-quote: #f1e9d6; --header-bg: #26221b; --header-fg: #f1e9d6; --header-fg-dim: rgba(241,233,214,.66); --header-press: rgba(255,255,255,.1); --tabbar-bg: #26221b; --tabbar-border: #3a342a; --tab-fg: rgba(241,233,214,.5); --tab-active: #c0492f; --text: #2a2620; --text-mid: #4d463a; --muted: #948a74; --accent: #c0492f; --accent-fg: #f6f0e1; --accent-ink: #a63a23; --accent-soft: #f3ddd4; --accent-grad: linear-gradient(90deg,#a63a23,#c0492f); --border: rgba(42,38,32,.1); --border-strong: #d6c9ad; --divider: #ddd0b6; --ring-track: #ddd0b6; --st-full:#3f6b3a; --st-full-bg:#e3ead9; --st-am:#3a5a8c; --st-am-bg:#dde3ee; --st-pm:#b07818; --st-pm-bg:#f3e8cf; --st-abs:#8c8270; --st-abs-bg:#e6dcc6; --st-off:#b3a98f; --st-off-bg:#e6ddc8; --sat:#3a5a8c; --sun:#c0492f; --money:#a63a23; --st-sched:#5a6e9c; --st-sched-bg:#e8ecf5; --seg-bg:#ddd0b6; --toggle-off:#cabd9f; --cell-bg:#f6f0e1; --dot:9px; --badge-radius:4px; --cal-gap:4px; --scrim:rgba(38,34,27,.55); --scrim-strong:rgba(38,34,27,.88); --toast-bg:#26221b; --toast-fg:#f1e9d6; --danger:#b03028; --shadow-card:0 1px 0 rgba(42,38,32,.05); --shadow-row:0 1px 0 rgba(42,38,32,.04); --shadow-sheet:0 -8px 32px rgba(42,38,32,.22); --font-display:'Shippori Mincho', serif; --font-num:'Shippori Mincho', serif; --logo-tracking:.04em; --grain-opacity:.05; --pt-cash-hd-bg: rgba(166,58,35,.09); } /* washi: stamp-like status badges */ [data-theme="washi"] .status-badge { border: 1.5px solid currentColor; background: transparent !important; } [data-theme="washi"] .card-title, [data-theme="washi"] .section-hd-title { letter-spacing: .18em; } /* ─────────────────────────────────────────────────────────── C · DARK — 夜の山。墨緑の背景に発光する若葉色 ─────────────────────────────────────────────────────────── */ [data-theme="dark"] { --shell: #0d110c; --bg: #141a12; --surface: #1e251b; --surface-2: #28302405; --surface-2: #283024; --surface-hero: linear-gradient(150deg,#222b1f,#1a211802); --surface-hero: linear-gradient(150deg,#243020,#191f17); --surface-quote: #1f271c; --header-bg: linear-gradient(160deg,#0f140e,#1f2a1b); --header-fg: #eef2e8; --header-fg-dim: rgba(238,242,232,.6); --header-press: rgba(255,255,255,.08); --tabbar-bg: #0f140e; --tabbar-border: #283024; --tab-fg: rgba(238,242,232,.42); --tab-active: #7fd96a; --text: #eef2e8; --text-mid: #c2cbb8; --muted: #828d78; --accent: #6fcf5c; --accent-fg: #0f140e; --accent-ink: #8fe07c; --accent-soft: rgba(111,207,92,.14); --accent-grad: linear-gradient(90deg,#4fa83e,#7fd96a); --border: rgba(255,255,255,.06); --border-strong: #3a4434; --divider: #2c3427; --ring-track: #2c3427; --st-full:#7fd96a; --st-full-bg:rgba(127,217,106,.14); --st-am:#6cb6f5; --st-am-bg:rgba(108,182,245,.14); --st-pm:#f5b15c; --st-pm-bg:rgba(245,177,92,.14); --st-abs:#8a9384; --st-abs-bg:rgba(138,147,132,.13); --st-off:#5a634f; --st-off-bg:rgba(90,99,79,.16); --sat:#6cb6f5; --sun:#f5b15c; --money:#e0b96a; --st-sched:#8aabd4; --st-sched-bg:rgba(138,171,212,.14); --seg-bg:#283024; --toggle-off:#3a4434; --cell-bg:#1e251b; --dot:10px; --dot-glow:0 0 9px; --badge-radius:50%; --cal-gap:5px; --scrim:rgba(5,8,4,.62); --scrim-strong:rgba(5,8,4,.9); --toast-bg:#7fd96a; --toast-fg:#0f140e; --danger:#ef6f5e; --shadow-card:0 2px 14px rgba(0,0,0,.4); --shadow-row:0 1px 6px rgba(0,0,0,.3); --shadow-sheet:0 -8px 36px rgba(0,0,0,.55); --font-display:'Kaisei Opti', serif; --font-num:'Space Mono', monospace; --grain-opacity:0; --pt-cash-hd-bg: rgba(224,185,106,.12); } /* dark: glowing status dots on grid */ [data-theme="dark"] .cal-cell .cc-dot { box-shadow: 0 0 9px var(--glow,transparent); } [data-theme="dark"] .ring-fill { filter: drop-shadow(0 0 5px rgba(127,217,106,.5)); } /* ─────────────────────────────────────────────────────────── D · LEDGER — 台帳。明るい中立紙、ピン留めの等幅数字、罫線 ─────────────────────────────────────────────────────────── */ [data-theme="ledger"] { --shell: #20231f; --bg: #f4f2ed; --surface: #ffffff; --surface-2: #eeebe3; --surface-hero: #ffffff; --surface-quote: #f6f4ee; --header-bg: #20281f; --header-fg: #f1f0ea; --header-fg-dim: rgba(241,240,234,.62); --header-press: rgba(255,255,255,.09); --tabbar-bg: #ffffff; --tabbar-border: #e0ddd3; --tab-fg: #9a978c; --tab-active: #1f5943; --text: #1c1c19; --text-mid: #4a4a43; --muted: #93908685; --muted: #908c80; --accent: #1f5943; --accent-fg: #f1f0ea; --accent-ink: #1f5943; --accent-soft: #e2ede8; --accent-grad: linear-gradient(90deg,#1f5943,#3a8c6b); --border: #e8e5db; --border-strong: #ddd9cd; --divider: #ebe8df; --ring-track: #e8e5db; --st-full:#1f7a52; --st-full-bg:#e3f1ea; --st-am:#2d6bb0; --st-am-bg:#e5eef8; --st-pm:#c07012; --st-pm-bg:#f8edda; --st-abs:#8c887c; --st-abs-bg:#eeebe3; --st-off:#b0ac9e; --st-off-bg:#f0ede5; --sat:#2d6bb0; --sun:#c07012; --money:#b07012; --st-sched:#5c7ab0; --st-sched-bg:#eaeff8; --seg-bg:#e8e5db; --toggle-off:#d5d1c5; --cell-bg:#fff; --dot:8px; --badge-radius:7px; --cal-gap:4px; --scrim:rgba(28,28,25,.45); --scrim-strong:rgba(28,28,25,.82); --toast-bg:#20281f; --toast-fg:#f1f0ea; --danger:#c0392b; --shadow-card:0 1px 2px rgba(28,28,25,.05); --shadow-row:0 1px 2px rgba(28,28,25,.04); --shadow-sheet:0 -8px 32px rgba(28,28,25,.16); --font-display:'Noto Sans JP', sans-serif; --font-num:'Space Mono', monospace; --logo-tracking:-.01em; --grain-opacity:0; --pt-cash-hd-bg: rgba(176,112,18,.08); } [data-theme="ledger"] .app-logo .wordmark { font-weight: 700; letter-spacing: -.02em; } [data-theme="ledger"] .card { border-radius: 12px; } [data-theme="ledger"] .day-row { border-radius: 10px; }