:root{color-scheme:light;--paper:#f8f5ee;--ink:#14283f;--muted:#586271;--accent:#806026;--line:#dfd6c5;--soft:#f0e8d8;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:5px}a:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:6px}[hidden]{display:none!important}.skip-link{position:absolute;left:24px;top:-80px;background:var(--ink);color:white;padding:12px;z-index:10}.skip-link:focus{top:12px}header,main,footer{width:min(1180px,calc(100% - 80px));margin-inline:auto}header{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:112px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-weight:650;font-size:15px}.brand small{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:5px;font-weight:400}.monogram{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--ink);border-radius:50%;font-family:Georgia,serif;font-size:17px}nav{display:flex;gap:8px}nav a{padding:10px 16px;font-size:14px;border-radius:24px}nav a[aria-current=page]{background:var(--ink);color:white}.view{padding-block:56px 72px;min-height:calc(100vh - 205px)}.cover{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center;padding-block:66px}.eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:650;color:var(--accent);margin:0 0 22px}h1,h2,p{margin-top:0}h1{font-size:42px;line-height:1.13;letter-spacing:-.045em;font-weight:500;margin-bottom:18px}.cover h1{font-family:Georgia,serif;font-size:clamp(48px,5.9vw,78px);font-weight:400;letter-spacing:-.055em;line-height:1.04}.intro{max-width:440px;font-size:17px;line-height:1.85;color:var(--muted);margin-block:28px}.button{display:inline-flex;gap:44px;align-items:center;background:var(--ink);color:white;padding:17px 23px;border-radius:6px;font-size:14px}.button:hover{background:var(--accent);text-decoration:none}.quiet{color:var(--muted);font-size:14px;line-height:1.65}.cover-note{font-size:12px;margin-top:22px}.art{position:relative;min-height:450px;background:#e5ecdf;overflow:hidden;border-radius:160px 160px 8px 8px;display:grid;place-items:center}.art-top,.art-bottom{position:absolute;font-size:9px;letter-spacing:.15em;text-align:center;left:15px;right:15px}.art-top{top:48px}.art-bottom{bottom:30px}.orbit{position:absolute;width:280px;height:280px;border:1px solid #9bb296;border-radius:50%}.one{transform:translate(-58px,10px)}.two{transform:translate(58px,10px)}.three{transform:translateY(-52px)}.art-copy{font-family:Georgia,serif;font-size:49px;line-height:1.1;z-index:1;text-align:center}.heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:30px}.heading .eyebrow{margin-bottom:16px}.badge{white-space:nowrap;font-size:11px;background:var(--soft);color:var(--accent);padding:9px 13px;border-radius:20px}.card{background:white;border:1px solid var(--line);border-radius:12px;padding:26px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stats .card>p:first-child{font-size:13px;color:var(--muted);margin-bottom:20px}.metric{font-size:43px;letter-spacing:-.05em;margin-bottom:12px}.metric span{font-size:20px;letter-spacing:-.02em}.card p:last-child{margin-bottom:0}.preview-note{font-size:12px;color:var(--muted);margin:14px 0 32px}.dashboard-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:22px}h2{font-size:19px;font-weight:550;letter-spacing:-.02em}.focus-list{list-style:none;padding:0;margin:10px 0 0}.focus-list li{display:flex;justify-content:space-between;gap:16px;padding:15px 0;border-top:1px solid var(--line);font-size:14px}.focus-list span{font-size:12px;color:var(--muted);white-space:nowrap}.reflection{background:var(--soft);display:flex;flex-direction:column;justify-content:center;padding:36px}.reflection h2{font-family:Georgia,serif;font-size:30px;line-height:1.25;font-weight:400}.text-link{font-size:14px;font-weight:600;margin-top:24px;align-self:flex-start}.empty{text-align:center;padding:64px 28px}.empty h2{font-family:Georgia,serif;font-size:32px;font-weight:400}.empty>p{max-width:510px;margin:0 auto 20px;color:var(--muted);line-height:1.7}.empty-mark{display:grid;place-items:center;background:var(--soft);border-radius:50%;width:60px;height:60px;margin:0 auto 26px;font-size:28px}.chips{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:26px 0 0}.chips li{border:1px solid var(--line);border-radius:24px;padding:9px 15px;font-size:12px}.prompt{background:var(--paper);max-width:500px;margin:32px auto 0;padding:25px;border-radius:8px}.prompt .eyebrow{margin-bottom:12px}footer{border-top:1px solid var(--line);min-height:93px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px;color:var(--muted)}
@media(min-width:1500px){.cover{min-height:720px}}
@media(max-width:900px){header,main,footer{width:calc(100% - 48px)}.cover{gap:32px}.art{min-height:400px}.stats{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.cover h1{font-size:58px}.orbit{width:240px;height:240px}.art-copy{font-size:42px}}
@media(max-width:600px){header,main,footer{width:calc(100% - 36px)}header{padding-block:22px 16px;flex-direction:column;align-items:flex-start;gap:22px}nav{width:100%;gap:4px}nav a{flex:1;text-align:center;padding:10px 12px}.cover{grid-template-columns:1fr;gap:32px}.cover h1{font-size:56px}.intro{font-size:16px}.art{min-height:360px;border-radius:130px 130px 8px 8px}.view{padding-block:36px 44px}h1{font-size:34px}.heading{flex-direction:column;gap:4px}.stats{gap:12px}.card{padding:20px}.metric{font-size:36px}.stats .quiet{font-size:12px}.reflection{padding:28px}.empty{padding:42px 20px}.empty h2{font-size:28px}.focus-list li{font-size:13px}footer{padding-block:24px;flex-direction:column;align-items:flex-start;gap:12px}}

/* Navy, ivory, and champagne: a formal personal profile palette. */
body {
  background: radial-gradient(ellipse at 92% 12%, #e9dfca80, transparent 48%),
    linear-gradient(135deg, #fcfaf5, var(--paper) 55%, #f0ece3);
  border-top: 4px solid #b89a5d;
}
header { border-bottom-color: #cbbb9b; }
.brand { letter-spacing: .02em; }
.brand small { color: var(--accent); }
.monogram {
  color: #ead8ae;
  background: linear-gradient(145deg, #293f58, #0c1b2d);
  border: 1px solid #b89a5d;
  box-shadow: 0 0 0 3px var(--paper), 0 0 0 4px #d6c5a2;
}
nav a:hover { background: #eae1d0; text-decoration: none; }
nav a[aria-current=page] {
  background: linear-gradient(135deg, #29425d, #13273e);
  color: #fff5df;
  box-shadow: inset 0 -2px #b89a5d;
}
.cover h1 { color: #13283f; }
.button {
  background: linear-gradient(115deg, #294560, #11253b);
  color: #fff6e5;
  border: 1px solid #a58951;
  box-shadow: 0 8px 20px #12263e18;
}
.button:hover { background: linear-gradient(115deg, #375673, #1e3853); }
.art {
  color: #f5ebd6;
  background: radial-gradient(ellipse at 75% 15%, #496078 0%, transparent 55%),
    linear-gradient(145deg, #243b54 0%, #11253c 55%, #091726 100%);
  border: 1px solid #b99b62;
  box-shadow: inset 0 0 0 9px #ffffff04, 0 20px 44px #17283c1a;
}
.orbit { border-color: #c9ab6b80; }
.art-top, .art-bottom { color: #e3cea2; }
.art-copy { text-shadow: 0 3px 20px #0003; }
.art-copy em { color: #e4c990; }
.card { background: linear-gradient(145deg, #fffefa, #fcfaf5); box-shadow: 0 5px 18px #17283c05; }
.stats .card { border-top: 2px solid #b69a62; }
.metric { color: #203b57; }
.badge, .empty-mark { background: linear-gradient(130deg, #f3ebd9, #e9dcc1); color: #725420; }
.reflection {
  background: radial-gradient(ellipse at top right, #3b5368, transparent 80%),
    linear-gradient(130deg, #1b3048, #102237);
  color: #fff4df;
  border-color: #a78a53;
}
.reflection .eyebrow, .reflection .text-link { color: #ecd49e; }
.reflection .quiet { color: #d0d8e0; }
.reflection a:focus-visible { outline-color: #ecd49e; }
.chips li { background: #faf6ed; border-color: #d7c8ac; }
.prompt { background: linear-gradient(120deg, #f5eedf, #eee6d6); border: 1px solid #ded0b3; }
footer { border-top-color: #cbbb9b; }
footer a { color: #725420; }

/* Compact icon navigation, wrapping into two columns on small screens. */
nav a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; white-space: nowrap; padding: 10px 12px; font-size: 13px; }
nav svg { width: 17px; height: 17px; flex: 0 0 17px; }
.empty-mark svg { width: 28px; height: 28px; }
@media (max-width: 1000px) { header { flex-wrap: wrap; padding-block: 22px; } }
@media (max-width: 600px) { nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } nav a { justify-content: flex-start; } }

/* The Becoming Journal — editorial workspace. */
header, main, footer { width:min(1280px,calc(100% - 80px)); }
body { background: #f7f5ef; }
header { min-height:104px; }
.brand small { font-size:9px; letter-spacing:.18em; }
.view { padding-block:40px 56px; }
.cover { min-height:calc(100vh - 200px); padding-block:66px; }
.cover h1 { font-size:clamp(54px,5.6vw,80px); line-height:1.05; }
h1 em { color:#95733d; font-weight:400; }
.cover-note { font-size:9px; letter-spacing:.14em; }
.cover .art { min-height:510px; border-radius:220px 220px 12px 12px; }
.workspace-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:30px; }
.workspace-heading h1 { font-family:Georgia,serif; font-size:44px; font-weight:400; letter-spacing:-.035em; margin-bottom:10px; }
.workspace-heading .eyebrow { font-size:9px; margin-bottom:14px; }
.workspace-heading .quiet { margin-bottom:0; }
.date-stamp { display:flex; flex-direction:column; align-items:flex-end; gap:12px; font-size:12px; color:var(--muted); }
.feature-grid { display:grid; grid-template-columns:2.35fr 1fr; gap:22px; }
.north-star { position:relative; overflow:hidden; display:flex; justify-content:space-between; padding:35px 38px 65px; border:1px solid #b79860; border-radius:12px; color:#f7f0e2; background:radial-gradient(ellipse at 95% 10%,#35536d,transparent 65%),linear-gradient(120deg,#112337,#182e45); }
.north-star .eyebrow { color:#ddc38b; font-size:9px; }
.north-star h2 { font:400 40px/1.13 Georgia,serif; letter-spacing:-.025em; margin-bottom:16px; }
.north-star h2 em { color:#e0c68f; }
.north-star p:not(.eyebrow) { color:#c2cdda; font-size:13px; line-height:1.8; }
.button.gold { background:linear-gradient(110deg,#efdfb7,#cfb17a); color:#162b41; border:0; font-size:12px; padding:13px 18px; margin-top:7px; }
.north-foot { position:absolute; bottom:0; left:0; right:0; padding:16px 38px; display:flex; justify-content:space-between; gap:10px; border-top:1px solid #ffffff18; font-size:8px; letter-spacing:.15em; color:#cab991; }
.compass { position:relative; width:220px; height:220px; flex-shrink:0; align-self:center; border:1px solid #c7ab6f50; border-radius:50%; display:grid; place-items:center; margin-left:10px; }
.compass:before,.compass:after { content:''; position:absolute; border:1px solid #c7ab6f40; border-radius:50%; inset:14px; }
.compass:after { inset:40px; }
.compass span { position:absolute; top:21px; font:10px Georgia,serif; color:#e0c68f; }
.compass i { position:absolute; inset:36px; background:linear-gradient(135deg,#e4ca9290,#a1844420); clip-path:polygon(50% 0,58% 41%,100% 50%,58% 58%,50% 100%,41% 58%,0 50%,41% 41%); transform:rotate(25deg); }
.compass b { font:32px Georgia,serif; z-index:1; background:#1c3349; width:70px; height:70px; display:grid; place-items:center; border-radius:50%; border:1px solid #ae9259; color:#e7d1a2; }
.compass small { position:absolute; bottom:-24px; font-size:7px; letter-spacing:.18em; color:#ccb98f; white-space:nowrap; }
.momentum { padding:28px 20px; text-align:center; border:1px solid var(--line); background:#fffdf8; border-radius:12px; }
.momentum .eyebrow { font-size:9px; margin-bottom:18px; }
.progress-ring { --progress:33.333%; width:156px; height:156px; border-radius:50%; padding:9px; background:conic-gradient(#b69a63 var(--progress),#eee9de 0); margin:0 auto 18px; transform:rotate(-30deg); }
.progress-ring>div { background:#fffdf8; width:100%; height:100%; border-radius:50%; display:flex; justify-content:center; align-items:center; flex-direction:column; transform:rotate(30deg); }
.progress-ring strong { font:46px Georgia,serif; }
.progress-ring strong span { font-size:23px; color:#77808a; }
.progress-ring small { font-size:9px; color:var(--muted); margin-top:6px; }
.momentum h3 { font:20px Georgia,serif; margin:0 0 8px; }
.momentum .quiet { font-size:11px; margin-bottom:16px; }
.sample-label { font-size:9px; color:#806026; background:#f3ecdd; padding:6px 10px; border-radius:20px; }
.section-line { display:flex; justify-content:space-between; align-items:flex-end; margin:34px 0 17px; gap:12px; }
.section-line .eyebrow { font-size:8px; margin-bottom:9px; }
.section-line h2 { font:25px Georgia,serif; margin:0; }
.section-line>.quiet { font-size:11px; }
.pillars { display:grid; grid-template-columns:repeat(5,1fr); gap:13px; }
.pillar { position:relative; padding:22px 18px 19px; border:1px solid var(--line); border-radius:10px; background:#fffdf8; }
.pillar-number { font-size:9px; letter-spacing:.1em; color:#8c7650; }
.pillar-symbol { display:block; font-size:25px; margin:18px 0 11px; color:#8d703b; }
.pillar h3 { font-size:13px; font-weight:600; margin:0 0 7px; }
.pillar p { font-size:10px; color:var(--muted); margin-bottom:20px; }
.pillar-track { height:4px; border-radius:5px; background:#eee9dd; overflow:hidden; }
.pillar-track span { display:block; height:100%; background:#a38958; }
.pillar:nth-child(2) .pillar-track span { background:#668277; }.pillar:nth-child(3) .pillar-track span { background:#ad8473; }.pillar:nth-child(4) .pillar-track span { background:#6d829c; }.pillar:nth-child(5) .pillar-track span { background:#94859e; }
.pillar-caption { display:flex; justify-content:space-between; margin-top:10px; color:var(--muted); font-size:9px; }
.lower-grid { display:grid; grid-template-columns:1.55fr 1fr; gap:22px; margin-top:24px; }
.panel { border:1px solid var(--line); background:#fffdf8; border-radius:12px; padding:26px; }
.panel-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:18px; }
.panel-heading .eyebrow { font-size:8px; margin-bottom:8px; }.panel-heading h2 { font:24px Georgia,serif; margin:0; }.panel-heading a { font-size:11px; color:#806026; }
.task { display:flex; align-items:center; gap:13px; padding:18px 0; border-top:1px solid #e9e3d8; cursor:pointer; }
.task input { width:19px; height:19px; flex-shrink:0; accent-color:#8a713d; cursor:pointer; }
.task input:focus-visible { outline:2px solid #806026; outline-offset:4px; }
.task-copy { flex:1; }.task-copy strong { display:block; font-size:12px; font-weight:500; line-height:1.5; }.task-copy small { display:block; font-size:10px; color:#687382; margin-top:5px; }
.task:has(input:checked) strong { text-decoration:line-through; color:#798274; }.task-time { font-size:10px; color:#687382; white-space:nowrap; }
.panel-note { color:var(--muted); font-size:10px; line-height:1.8; margin:14px 0 0; }
.reflection-card { position:relative; overflow:hidden; padding:32px; border:1px solid #dfd3b9; border-radius:12px; background:radial-gradient(ellipse at top right,#e8dab7,transparent 75%),#eee8d9; }
.reflection-card .eyebrow { font-size:8px; position:relative; }.reflection-card h2 { font:29px/1.3 Georgia,serif; position:relative; }.reflection-card>p:not(.eyebrow) { font-size:11px; color:#626754; line-height:1.8; }.reflection-card a { display:block; border-top:1px solid #cfc4ad; padding-top:18px; margin-top:24px; font-size:11px; color:#705729; }.reflection-card a span { float:right; }.quote-mark { position:absolute; font:160px Georgia,serif; top:18px; right:22px; color:#b8a67830; }
.journey-strip { display:flex; align-items:center; gap:20px; margin-top:26px; padding:24px 0 4px; border-top:1px solid var(--line); }.journey-icon { font-size:34px; color:#927849; }.journey-strip h3 { font-size:12px; font-weight:600; margin:0 0 7px; }.journey-strip p { font-size:11px; color:var(--muted); margin:0; line-height:1.7; }.signature { margin-left:auto; font:italic 24px Georgia,serif; color:#8f7341; white-space:nowrap; }
.milestone-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.milestone { background:#fffdf8; border:1px solid var(--line); border-radius:12px; padding:30px; }.milestone-number { display:block; font:70px Georgia,serif; color:#b99b6050; margin-bottom:25px; }.milestone h2 { font:28px Georgia,serif; }.milestone>p:not(.eyebrow) { font-size:14px; line-height:1.9; color:var(--muted); }.milestone .eyebrow { font-size:9px; }
.schedule { max-width:850px; background:#fffdf8; border:1px solid var(--line); border-radius:12px; padding-inline:30px; }.schedule article { display:flex; align-items:center; gap:40px; padding:30px 0; border-bottom:1px solid var(--line); }.schedule article:last-child { border:0; }.schedule time { font:28px Georgia,serif; color:#997b43; }.schedule .eyebrow { font-size:8px; margin-bottom:8px; }.schedule h2 { font:25px Georgia,serif; margin-bottom:10px; }.schedule p:last-child { font-size:13px; color:var(--muted); margin:0; line-height:1.7; }.schedule-dot { margin-left:auto; width:8px; height:8px; flex-shrink:0; border-radius:50%; background:#b99b60; }
@media(max-width:1100px) { .compass { width:170px; height:170px; }.north-star { padding-inline:26px; }.north-star h2 { font-size:34px; }.pillars { gap:9px; }.pillar { padding-inline:12px; } }
@media(max-width:900px) { header,main,footer { width:calc(100% - 40px); }.compass { display:none; }.feature-grid { grid-template-columns:1.5fr 1fr; }.pillars { grid-template-columns:repeat(3,1fr); }.lower-grid { grid-template-columns:1fr; }.milestone-grid { grid-template-columns:1fr; }.workspace-heading h1 { font-size:37px; }.signature { font-size:20px; }.cover .art { min-height:420px; } }
@media(max-width:600px) { header,main,footer { width:calc(100% - 36px); }.workspace-heading { align-items:flex-start; flex-direction:column; }.workspace-heading h1 { font-size:36px; }.date-stamp { align-items:flex-start; }.feature-grid { grid-template-columns:1fr; }.north-star { padding:30px 24px 68px; }.north-star h2 { font-size:37px; }.north-foot { padding-inline:24px; font-size:7px; }.north-foot span { display:none; }.momentum { padding:25px; }.pillars { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.pillar { padding:18px 14px; }.pillar:last-child { grid-column:1/-1; }.section-line { align-items:flex-start; flex-direction:column; }.panel { padding:22px 18px; }.task-time { display:none; }.reflection-card { padding:26px; }.journey-strip { flex-wrap:wrap; }.signature { margin-left:0; }.schedule { padding-inline:20px; }.schedule article { gap:18px; }.schedule time { font-size:22px; }.schedule h2 { font-size:22px; }.schedule-dot { display:none; }.cover h1 { font-size:52px; }.cover .art { min-height:380px; }.cover { padding-block:38px; } }

.task-pillars { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
.task-pillars button { text-align:left; padding:20px 16px; border:1px solid var(--line); border-radius:10px; background:#fffdf8; color:var(--ink); font:inherit; cursor:pointer; }
.task-pillars button strong { display:block; font-size:13px; margin-bottom:10px; }
.task-pillars button small { font-size:11px; }
.task-pillars button[aria-pressed=true] { background:linear-gradient(135deg,#29445f,#11253b); color:#f6e8c8; border-color:#b69861; }
.task-workspace { display:grid; grid-template-columns:1.5fr 1fr; gap:24px; margin-top:24px; align-items:start; }
#task-form label { display:block; font-size:13px; margin-top:18px; }
#task-form input,#task-form textarea,#task-form select { display:block; width:100%; min-width:0; margin-top:8px; padding:12px; border:1px solid #cabea6; border-radius:6px; background:#fffefa; color:var(--ink); font:inherit; }
#task-form textarea { resize:vertical; }
.task-date-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; align-items:center; }
button { cursor:pointer; font:inherit; }button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline:3px solid #95733d; outline-offset:3px; }
.form-actions>button:not(.button),.task-actions button { border:1px solid var(--line); background:#f8f4eb; color:var(--ink); padding:8px 12px; border-radius:5px; font-size:12px; }
.saved-task { border-top:1px solid var(--line); padding:20px 0; overflow-wrap:anywhere; }
.saved-task label { display:flex; align-items:flex-start; gap:12px; font-size:15px; line-height:1.6; cursor:pointer; }
.saved-task input { width:18px; height:18px; flex-shrink:0; margin-top:3px; accent-color:#806026; }
.saved-task.is-complete strong { text-decoration:line-through; color:var(--muted); }
.saved-task p { font-size:12px; color:var(--muted); line-height:1.8; margin:10px 0; white-space:pre-wrap; }
.saved-task time { display:block; font-size:12px; color:#806026; margin-block:12px; }
.task-actions { display:flex; gap:8px; }
@media(max-width:900px) { .task-pillars { grid-template-columns:repeat(3,minmax(0,1fr)); }.task-workspace { grid-template-columns:1fr; } }
@media(max-width:600px) { .task-pillars { grid-template-columns:repeat(2,minmax(0,1fr)); }.task-pillars button:last-child { grid-column:1/-1; }.task-date-row { grid-template-columns:1fr; } }

/* Public entrance. Authentication must be enforced by the hosting service. */
body:has(#cover:not([hidden])) { background:#f8f6f0; }
body:has(#cover:not([hidden]))>header,body:has(#cover:not([hidden]))>footer { display:none; }
.landing { min-height:calc(100svh - 4px); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:70px 0 30px; overflow:hidden; }
.landing>.eyebrow { font-size:10px; letter-spacing:.3em; margin-bottom:40px; }
.landing h1 { font:400 clamp(70px,11vw,150px)/.94 Georgia,serif; letter-spacing:-.055em; margin:0; }
.landing h1 span { display:block; }
.name-first { animation:name-from-left 1.2s cubic-bezier(.2,.7,.2,1) both; }
.name-last { color:#8c6e39; animation:name-from-right 1.2s cubic-bezier(.2,.7,.2,1) .12s both; }
.landing-motto { font:italic 23px Georgia,serif; margin:35px 0 38px; color:#5b6470; }
.landing-actions { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:32px; width:auto; }
.landing-actions a { font-size:14px; padding:12px 0; border-radius:0; }
.landing-actions .button { font-size:14px; min-width:150px; justify-content:space-between; }
.landing-bottom { margin:75px 0 0; font-size:9px; letter-spacing:.2em; color:#806b47; }
.landing-photo { width:min(620px,100%); margin:48px 0 0; }.landing-photo img { display:block; width:100%; max-height:580px; object-fit:cover; border-radius:160px 160px 8px 8px; }.landing-photo figcaption { margin-top:12px; font-size:12px; color:var(--muted); }
#login-dialog { width:min(440px,calc(100% - 40px)); padding:30px; border:1px solid #b89a5d; border-radius:12px; color:var(--ink); background:#fffdf8; }
#login-dialog::backdrop { background:#10233799; }#login-dialog p { line-height:1.7; }
@keyframes name-from-left { from { opacity:0; transform:translateX(-160px); } to { opacity:1; transform:translateX(0); } }
@keyframes name-from-right { from { opacity:0; transform:translateX(160px); } to { opacity:1; transform:translateX(0); } }
@media(prefers-reduced-motion:reduce) { .name-first,.name-last { animation:none; } }
@media(max-width:600px) { .landing h1 { font-size:clamp(55px,14vw,84px); }.landing>.eyebrow { font-size:8px; }.landing-motto { font-size:21px; }.landing-actions { gap:24px; }.landing-bottom { font-size:8px; letter-spacing:.13em; } }
.landing-actions>button:not(.button) { background:transparent; border:0; color:var(--ink); padding:12px 0; font-size:14px; }
#booking-dialog { width:min(440px,calc(100% - 40px)); padding:30px; border:1px solid #b89a5d; border-radius:12px; color:var(--ink); background:#fffdf8; }#booking-dialog::backdrop { background:#10233799; }#booking-dialog p { line-height:1.7; }
#habit-days { border:1px solid var(--line); border-radius:8px; margin:18px 0; padding:12px; }#habit-days legend { font-size:13px; }#task-form #habit-days label { display:inline-flex; align-items:center; gap:5px; margin:6px; font-size:12px; }#task-form #habit-days input { width:16px; margin:0; }
.habit-week-nav { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; margin-block:14px; }.habit-week-nav button { border:1px solid var(--line); border-radius:5px; padding:8px 12px; background:#f7f2e7; color:var(--ink); }.habit-days-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px; }.saved-task .habit-days-grid label { flex-direction:column; align-items:center; gap:6px; background:#f4efe4; border-radius:6px; padding:10px 2px; font-size:11px; }.habit-days-grid small { color:var(--muted); }.habit-days-grid input { margin:0; }.habit-days-grid .off-day { opacity:.45; }#task-form :disabled { opacity:.65; }
.habit-finished { color:#466a53!important; background:#edf3e9; padding:10px 12px; border-radius:6px; }.saved-task:has(.habit-finished) { border-left:3px solid #8b9f7e; padding-left:14px; }
.parent-group { margin:18px 0; padding:18px; border:1px solid #c9b78f; border-radius:10px; background:#faf6ed; }.parent-group summary { cursor:pointer; font-size:17px; font-weight:600; margin-bottom:15px; overflow-wrap:anywhere; }.parent-group>button { padding:8px 12px; border:1px solid var(--line); background:#fffdf7; border-radius:5px; margin:0 8px 15px 0; color:var(--ink); font-size:12px; }.parent-group>.saved-task { margin-left:8px; }.group-summary { background:#eee6d3; padding:15px; border-radius:8px; font-weight:600; }.parent-caption { color:#806026!important; }.year-filter { display:flex; gap:12px; align-items:center; font-size:13px; margin-bottom:20px; }.year-filter select { padding:8px; border:1px solid var(--line); background:#fffdf8; border-radius:5px; }
.finance-filters { display:flex; align-items:end; flex-wrap:wrap; gap:20px; margin-bottom:24px; }.finance-filters label { font-size:12px; }.finance-filters input,.finance-filters select { display:block; padding:10px; margin-top:8px; border:1px solid var(--line); border-radius:6px; background:#fffdf8; color:var(--ink); }.finance-filters p { font-size:13px; color:var(--muted); }.finance-layout { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(0,1fr); gap:24px; align-items:start; }.finance-stats { grid-template-columns:1fr 1fr; }.finance-stats .metric { font-size:32px; overflow-wrap:anywhere; }.finance-panel { margin-top:22px; }.expense-category { margin:20px 0; }.expense-category>div:first-child { display:flex; justify-content:space-between; gap:12px; font-size:13px; overflow-wrap:anywhere; }.expense-bar { background:#ede6d6; height:7px; border-radius:5px; margin-top:10px; overflow:hidden; }.expense-bar span { display:block; height:100%; background:#9c804b; }.expense-table-wrap { overflow-x:auto; }.expense-table { width:100%; border-collapse:collapse; font-size:12px; text-align:left; }.expense-table th,.expense-table td { padding:14px 9px; border-bottom:1px solid var(--line); vertical-align:top; overflow-wrap:anywhere; }.expense-table td:nth-child(3) { min-width:130px; max-width:240px; }.expense-table button { background:#f5efdf; border:1px solid var(--line); padding:6px; border-radius:4px; color:var(--ink); margin:0 4px 4px 0; font-size:11px; }#expense-form label { display:block; margin-top:18px; font-size:13px; }#expense-form input { display:block; width:100%; min-width:0; margin-top:8px; padding:12px; border:1px solid #cabea6; border-radius:6px; background:#fffefa; color:var(--ink); font:inherit; }
@media(max-width:900px){.finance-layout { grid-template-columns:1fr; }header>nav{flex-wrap:wrap;}}
@media(max-width:600px){.finance-stats { grid-template-columns:1fr; }}
#expense-form select { display:block; width:100%; padding:12px; margin-top:8px; border:1px solid #cabea6; border-radius:6px; background:#fffefa; color:var(--ink); font:inherit; }.monthly-bill { border-top:1px solid var(--line); padding:18px 0; }.monthly-bill h3 { font-size:16px; }.monthly-bill p { font-size:12px; color:var(--muted); }.monthly-bill button { border:1px solid var(--line); background:#eee4ce; padding:8px 12px; border-radius:5px; color:var(--ink); font-size:12px; }.monthly-bill button:disabled { opacity:.6; cursor:default; }.bill-occurrence { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-top:14px; font-size:12px; }.expense-category>p { font-size:12px; color:var(--muted); margin:10px 0; }

/* 60–30–10 blue palette: pale surfaces, navy structure, royal-blue accents. */
:root { --paper:#eff5fc; --ink:#142e50; --muted:#526780; --accent:#245ccc; --line:#cedced; --soft:#e0ecfc; }
body,body:has(#cover:not([hidden])) { background:var(--paper); border-top-color:#245ccc; }
header,footer { border-color:var(--line); }
.monogram { background:#142e50; color:#fff; border-color:#669bf3; box-shadow:0 0 0 3px var(--paper),0 0 0 4px #b8cdeb; }
.brand small,.eyebrow,.name-last,h1 em,.signature,.landing-bottom,footer a,.pillar-symbol,.pillar-number,.parent-caption,.saved-task time { color:var(--accent)!important; }
nav a:hover { background:#dae8fc; }
nav a[aria-current=page],.task-pillars button[aria-pressed=true] { background:#142e50; color:#fff; border-color:#4a87ea; box-shadow:inset 0 -2px #4a87ea; }
.button,.button.gold { background:#245ccc; color:#fff; border:1px solid #245ccc; box-shadow:0 5px 15px #245ccc20; }
.button:hover,.button.gold:hover { background:#1949ab; }
.card,.panel,.pillar,.momentum,.milestone,.schedule,.task-pillars button { background:#fbfdff; border-color:var(--line); }
.stats .card { background:#142e50; border-color:#244c7b; border-top-color:#4a87ea; color:#fff; }
.stats .card>p:first-child,.stats .card .quiet { color:#d6e5fa; }.stats .metric { color:#fff; }
.north-star,.art,.reflection { background:linear-gradient(125deg,#142e50,#234e7a); border-color:#4877b3; color:#fff; }
.north-star .eyebrow,.north-star h2 em,.north-foot,.art-top,.art-bottom,.art-copy em,.reflection .eyebrow,.reflection .text-link { color:#bcd8ff!important; }
.north-star p:not(.eyebrow),.reflection .quiet { color:#d9e7f9; }
.compass,.compass:before,.compass:after,.orbit { border-color:#90b9ed70; }.compass b { background:#17365b; color:#dbeaff; border-color:#78a7e5; }.compass span,.compass small { color:#bdd8fa; }.compass i { background:linear-gradient(135deg,#b7d5ff,#4179bc50); }
.badge,.sample-label,.empty-mark,.chips li,.prompt,.group-summary,.parent-group,.saved-task .habit-days-grid label { background:#e0ecfc; border-color:#bfd2ed; color:#224c83; }
.progress-ring { background:conic-gradient(#245ccc var(--progress),#dfe9f6 0); }.progress-ring>div { background:#fbfdff; }
.pillar-track,.expense-bar { background:#dde8f6; }.pillar .pillar-track span,.expense-bar span { background:#245ccc; }
.reflection-card { background:linear-gradient(130deg,#dae8fa,#eaf2fc); border-color:#c3d6ef; }.reflection-card a { color:#245ccc; border-color:#bbcee9; }.reflection-card>p:not(.eyebrow) { color:#526780; }.quote-mark { color:#245ccc15; }
#task-form input,#task-form textarea,#task-form select,#expense-form input,#expense-form select,.finance-filters input,.finance-filters select,.year-filter select { background:#fbfdff; border-color:#b8cce6; }
.form-actions>button:not(.button),.task-actions button,.parent-group>button,.habit-week-nav button,.expense-table button,.monthly-bill button { background:#e0ecfc; color:#214777; border-color:#b8cce6; }
.task input,.saved-task input { accent-color:#245ccc; }
.habit-finished { background:#dfeefb; color:#214777!important; }
#booking-dialog,#login-dialog { background:#fbfdff; border-color:#669bf3; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible,.task input:focus-visible { outline-color:#245ccc; }
.forecast-panel { margin-bottom:24px; }.forecast-panel .panel-heading label { font-size:13px; white-space:nowrap; }.forecast-panel select { margin-left:8px; padding:10px; border:1px solid var(--line); background:#fbfdff; color:var(--ink); border-radius:6px; }.forecast-table th,.forecast-table td { white-space:nowrap; min-width:110px; }.forecast-table tfoot { background:#e0ecfc; font-weight:600; }.forecast-table thead button { color:#245ccc; background:#e0ecfc; padding:10px; }.forecast-panel>.quiet { font-size:12px; }@media(max-width:600px){.forecast-panel .panel-heading{align-items:flex-start;flex-direction:column;}}
.finance-stats { grid-template-columns:repeat(3,minmax(0,1fr)); }.finance-stats .card { padding:20px 16px; }.finance-stats .metric { font-size:clamp(23px,2.2vw,32px); }.finance-stats .quiet { font-size:11px; }@media(max-width:600px){.finance-stats{grid-template-columns:1fr;}}
#finance>.finance-stats { margin-bottom:24px; }
#finance>.forecast-panel { margin-top:28px; margin-bottom:0; }

/* UI gate; database RLS enforces record access. */
.signed-out header nav,.signed-out .view:not(#cover),.signed-out #reset-data{display:none!important}
.signed-out #cover{display:block!important}
#cloud-toolbar{position:sticky;bottom:0;padding:1rem;background:#eaf2ff;border-top:1px solid #b4c8ec;z-index:10;display:flex;gap:.7rem;flex-wrap:wrap;align-items:center}
#cloud-toolbar[hidden]{display:none}
#auth-dialog{max-width:min(90vw,480px);padding:2rem;border:1px solid #b4c8ec;border-radius:16px;color:#13294b}
#auth-dialog::backdrop{background:#10264799}

#auth-form{display:grid;gap:.75rem;margin:1.25rem 0}#auth-email{width:100%;box-sizing:border-box;padding:.8rem;border:1px solid #7188a8;border-radius:8px;font:inherit}#auth-switch{margin-right:1rem}#cover-title{overflow-wrap:normal}.landing-actions{flex-wrap:wrap}

dialog{max-width:min(90vw,560px);max-height:85vh;overflow:auto;padding:1.5rem;border-radius:14px}dialog button{margin:.4rem .4rem .4rem 0}.task-highlight{outline:3px solid var(--accent);outline-offset:4px}#cloud-status{flex:1 1 250px}