:root{--v4-ink:#2f272a;--v4-muted:#9a858d;--v4-rose:#df6f97;--v4-berry:#b9577a;--v4-line:rgba(193,145,161,.18);--v4-shadow:0 16px 42px rgba(91,61,72,.08)}

/* Workbench V4: one controlled component layer. */
#view-today{padding-bottom:26px}
#view-today .mood-rail{gap:8px;margin:2px 0 24px;padding:3px 1px 7px;scrollbar-width:none}
#view-today .mood-rail::-webkit-scrollbar{display:none}
#view-today .mood-rail button{min-width:55px;padding:7px 4px 8px;border:1px solid transparent;border-radius:20px;background:rgba(255,255,255,.72);box-shadow:none}
#view-today .mood-rail i{width:45px;height:45px;margin-bottom:5px;overflow:visible;background:transparent!important}
#view-today .mood-rail i img{width:45px;height:45px;object-fit:contain;object-position:center}
#view-today .mood-rail span{font-size:9px}
#view-today .mood-rail .selected{border-color:#ef91b0;background:linear-gradient(145deg,#fff,#fff0f5);box-shadow:0 9px 20px rgba(199,91,130,.1)}
#view-today .mood-rail .selected i{transform:translateY(-2px) scale(1.04)}

#view-today .task-heading{margin-bottom:11px}
#view-today .task-heading-icon{width:31px;height:31px;border-width:1.5px;border-radius:11px;font-size:13px}
#view-today .task-heading h2{font-size:22px;letter-spacing:-.7px}
#view-today .task-heading>div:first-child>b{width:24px;height:24px;border-radius:8px}
#view-today .view-toggle{padding:3px;border-color:var(--v4-line);border-radius:14px;background:rgba(255,255,255,.68)}
#view-today .view-toggle button{min-width:43px;padding:7px 10px;border-radius:11px}
#view-today .view-toggle .selected{background:#f7bfd2;color:#994461;box-shadow:none}

#view-today .card-stack{height:362px;padding-top:48px}
#view-today .task-card{border-radius:28px}
#view-today .stack-back,#view-today .stack-mid{height:92px;padding:14px 19px;box-shadow:none}
#view-today .stack-back{top:0;left:8%;width:84%;background:#dcecf7;opacity:1}
#view-today .stack-mid{top:24px;left:4%;width:92%;background:#f8dfa1}
#view-today .stack-front{top:50px;min-height:304px;padding:22px 20px;border-color:rgba(229,117,156,.36);background:linear-gradient(145deg,#fffafd 0,#fff1f5 68%,#fcecf1 100%);box-shadow:0 20px 45px rgba(133,72,94,.11)}
#view-today .stack-front:before{position:absolute;right:-45px;top:-54px;width:170px;height:170px;border-radius:50%;background:rgba(255,255,255,.42);content:"";pointer-events:none}
#view-today .stack-front header,#view-today .stack-front h2,#view-today .stack-front>p,#view-today .task-meta,#view-today .complete-track{position:relative;z-index:2;width:65%}
#view-today .stack-front header time{font-size:15px}
#view-today .stack-front h2{max-width:none;margin:28px 0 9px;font-size:27px;line-height:1.08}
#view-today .stack-front>p{max-width:none;min-height:34px;font-size:10px}
#view-today .task-meta{margin:19px 0 14px;padding-bottom:13px}
#view-today .complete-track{height:49px;border-radius:25px}
#view-today .complete-track button{width:39px;height:39px;font-size:20px}
#view-today .card-kitty{z-index:1;right:3px;bottom:18px;width:37%;height:194px;overflow:visible}
#view-today .card-kitty img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 12px 12px rgba(148,80,106,.1))}
#view-today .task-edit{z-index:3;right:14px;top:50px;bottom:auto;width:35px;height:35px;border:1px solid rgba(219,184,196,.42);box-shadow:none;font-size:0}
#view-today .task-edit:before{font-size:14px;content:"✎"}

#view-today .task-list-mode{gap:10px}
#view-today .task-list-summary{display:flex;align-items:end;justify-content:space-between;padding:3px 4px 4px}
#view-today .task-list-summary small{display:block;color:#b06a84;font-size:7px;font-weight:900;letter-spacing:.12em}
#view-today .task-list-summary b{display:block;margin-top:3px;font-size:18px}
#view-today .task-list-summary>span{color:var(--v4-muted);font-size:8px}
#view-today .list-task{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr) 72px 34px;min-height:98px;padding:12px 11px;border-color:var(--v4-line);border-radius:23px;background:rgba(255,255,255,.76);box-shadow:none;overflow:hidden}
#view-today .list-task.active{min-height:151px;border-color:rgba(227,116,154,.34);background:linear-gradient(145deg,#fff7fa,#fff0f4)}
#view-today .list-task time{align-self:start;padding-top:4px;font-size:12px}
#view-today .list-task-copy{min-width:0}
#view-today .list-task small{font-size:7px}
#view-today .list-task h3{margin:4px 0;font-size:13px;line-height:1.25}
#view-today .list-task p{display:-webkit-box;overflow:hidden;font-size:8px;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:2}
#view-today .task-art-frame{display:grid;width:68px;height:72px;align-self:center;place-items:center;overflow:visible}
#view-today .task-art-frame img{width:68px;height:68px;object-fit:contain;object-position:center}
#view-today .list-task>button{align-self:center}
#view-today .list-task-progress{display:flex;align-items:center;gap:6px;margin-top:9px}
#view-today .list-task-progress i{width:48px;height:3px;border-radius:9px;background:#f0dae2}
#view-today .list-task-progress i b{display:block;width:36%;height:100%;border-radius:inherit;background:#d97a9e}
#view-today .list-task-progress span{color:var(--v4-muted);font-size:7px;white-space:nowrap}
#view-today .next-task-label{display:flex;align-items:center;justify-content:space-between;margin:7px 4px 0}
#view-today .next-task-label h3{margin:0;font-size:13px}
#view-today .next-task-label span{color:var(--v4-muted);font-size:8px}
#view-today .task-timeline{display:grid;gap:8px}

.home-overview{margin-top:15px}
.home-overview-heading{display:flex;align-items:end;justify-content:space-between;margin:0 3px 9px}
.home-overview-heading small{color:#b06a84;font-size:7px;font-weight:900;letter-spacing:.13em}
.home-overview-heading h3{margin:3px 0 0;font-size:15px}
.home-overview-heading button{padding:8px 11px;border-radius:999px;background:#f8e7ee;color:#a74d6f;font-size:8px}
.home-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.home-metrics>button{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:7px;min-height:67px;padding:9px;border:1px solid var(--v4-line);border-radius:19px;background:rgba(255,255,255,.76);text-align:left;box-shadow:none}
.home-metrics>button:active{transform:scale(.97)}
.home-metrics>button>span:last-child{min-width:0}
.home-metrics small,.home-metrics b{display:block;white-space:nowrap}
.home-metrics small{color:var(--v4-muted);font-size:7px}
.home-metrics b{margin-top:3px;font-size:9px}
.home-metrics em{font-style:normal}
.metric-art{position:relative;display:grid;width:38px;height:38px;place-items:center;border-radius:14px;background:#f8e7ef;color:#ae5677;font-size:12px;font-weight:800}
.metric-water{overflow:hidden;background:#e7f2f7}
.metric-water:before{position:absolute;bottom:8px;width:14px;height:20px;border:2px solid #6693a8;border-radius:4px 4px 7px 7px;content:""}
.metric-water i{position:absolute;bottom:9px;width:12px;height:var(--water-level,55%);max-height:17px;border-radius:2px 2px 5px 5px;background:#91cce0;transition:height .35s ease}
.metric-cycle{background:#fff0e4;color:#d47b74;font-size:18px}
.metric-word{background:#eee9f8;color:#826aa6}
.home-insight{display:grid;grid-template-columns:39px 1fr 28px;align-items:center;gap:10px;margin-top:9px;padding:12px 13px;border-radius:20px;background:linear-gradient(135deg,#f8eef6,#fff3e8);box-shadow:0 12px 30px rgba(90,60,72,.055)}
.home-insight .ai-mark{display:grid;width:39px;height:39px;place-items:center;border-radius:14px;background:#bd5b80;color:#fff;font-size:10px;font-weight:900}
.home-insight small{color:#a86b82;font-size:7px}
.home-insight h3{margin:3px 0;font-size:11px;line-height:1.3}
.home-insight p{margin:0;color:var(--v4-muted);font-size:8px}
.home-insight>button{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.72);color:#aa5775}

/* Plan V4: illustrated calendar followed by a living timeline, no mood duplication. */
#view-plan .calendar-agenda-title{align-items:center;margin:18px 3px 10px}
#view-plan .calendar-agenda-title small{color:#b06a84;font-size:7px;font-weight:900;letter-spacing:.13em}
#view-plan .calendar-agenda-title h3{margin:3px 0 0;font-size:21px}
#view-plan .calendar-agenda-title>button{width:40px;height:40px;border-radius:15px;background:#f6d6e2;color:#a54d6c;font-size:22px;box-shadow:none}
#view-plan .timeline{display:grid;gap:9px;padding-bottom:6px}
#view-plan .timeline article{position:relative;display:grid;grid-template-columns:54px 8px minmax(0,1fr) 66px 42px;align-items:center;gap:8px;min-height:105px;padding:11px 10px;border:1px solid var(--v4-line)!important;border-radius:24px;background:rgba(255,251,247,.78)!important;box-shadow:none;overflow:hidden}
#view-plan .timeline article.current{min-height:139px;border-color:rgba(226,111,151,.34)!important;background:linear-gradient(145deg,#fff6f9,#fff0f4)!important;box-shadow:0 14px 32px rgba(112,67,83,.07)}
#view-plan .timeline article.current:before{position:absolute;right:-35px;top:-45px;width:130px;height:130px;border-radius:50%;background:rgba(255,255,255,.5);content:""}
#view-plan .timeline-time{align-self:start;padding-top:4px}
#view-plan .timeline-time small,#view-plan .timeline-time time{display:block}
#view-plan .timeline-time small{color:#bd718c;font-size:6px;font-weight:900;letter-spacing:.12em}
#view-plan .timeline-time time{margin-top:4px;font-size:11px;font-weight:850}
#view-plan .timeline article>i{align-self:stretch;width:1px;margin:auto;background:#eadce1}
#view-plan .timeline article>i:before{display:block;width:7px;height:7px;margin-left:-3px;border:2px solid #fff;border-radius:50%;background:#e681a4;box-shadow:0 0 0 1px #e9a2ba;content:""}
#view-plan .timeline-copy{min-width:0}
#view-plan .timeline-copy>span{color:#b46581;font-size:7px}
#view-plan .timeline-copy h3{margin:4px 0;font-size:12px;line-height:1.25}
#view-plan .timeline-copy p{display:-webkit-box;margin:0;overflow:hidden;color:var(--v4-muted);font-size:8px;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:2}
#view-plan .timeline-copy>small{display:block;margin-top:6px;color:#a88994;font-size:7px}
#view-plan .timeline-art{position:relative;z-index:1;display:grid;width:64px;height:73px;place-items:center;overflow:visible}
#view-plan .timeline-art img{width:64px;height:70px;object-fit:contain;object-position:center}
#view-plan .timeline article.current .timeline-art{width:72px;height:92px}
#view-plan .timeline article.current .timeline-art img{width:74px;height:88px}
#view-plan .timeline article>button{position:relative;z-index:1;width:39px;height:39px;padding:0;border-radius:14px;background:#f7e5ec;color:#a95574;font-size:8px}
#view-plan .timeline article.current>button{background:#bd5b80;color:#fff}

/* Dedicated safe zones: no full-body art is hard-shrunk into a tiny slot. */
.profile-avatar-button{overflow:hidden!important;padding:0!important}
.profile-avatar-button>img{width:53px!important;height:53px!important;max-width:53px!important;max-height:53px!important;object-fit:contain!important;object-position:center!important;transform:none!important}
.profile-avatar-button:active>img{transform:scale(.94) rotate(-2deg)!important}
.ledger-insights article{grid-template-columns:58px minmax(0,1fr)!important;overflow:visible!important}
.ledger-insights img{width:58px!important;height:58px!important;object-fit:contain!important;object-position:center!important;filter:drop-shadow(0 7px 8px rgba(125,75,92,.07))}
.ledger-quick-actions button:first-child i img{width:38px!important;height:38px!important;max-width:38px!important;max-height:38px!important}
.task-empty-state img{width:94px!important;height:94px!important;margin:auto;object-fit:contain!important;object-position:center!important}
.sleep-sheet-hero{grid-template-columns:104px minmax(0,1fr)!important;gap:12px!important;overflow:visible!important}
.sleep-sheet-hero>img{width:100px!important;height:100px!important;object-fit:contain!important;object-position:center!important}

/* Ledger correction: amount, percentage and ring never share the same text layer. */
.ledger-budget-card{display:flex!important;min-height:166px!important;flex-direction:column!important;overflow:hidden!important}
.ledger-budget-card>strong{margin-top:9px!important;font-size:23px!important;line-height:1!important;white-space:nowrap}
.ledger-budget-card .budget-progress-row{display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center;gap:8px;margin-top:auto;padding-top:11px}
.ledger-budget-card .budget-ring{position:relative!important;width:76px!important;height:38px!important;margin:0!important;overflow:hidden!important;border-radius:42px 42px 0 0!important;background:conic-gradient(from 270deg,#e8759d 0 var(--budget-angle,122deg),#eee5e8 var(--budget-angle,122deg) 180deg,transparent 180deg 360deg)!important;transform:none!important}
.ledger-budget-card .budget-ring:after{position:absolute;left:8px;top:8px;width:60px;height:60px;border-radius:50%;background:#fff;content:""}
.ledger-budget-card .budget-progress-copy{min-width:0;text-align:left}
.ledger-budget-card .budget-progress-copy b,.ledger-budget-card .budget-progress-copy span{display:block!important;position:static!important;transform:none!important}
.ledger-budget-card .budget-progress-copy b{color:#d75d88;font-size:16px;line-height:1}
.ledger-budget-card .budget-progress-copy span{margin-top:4px;color:#8d7c82;font-size:7px;white-space:nowrap}

.ledger-kitty-shelf{right:0!important;bottom:-3px!important;width:59%!important;height:146px!important}
.ledger-kitty-shelf>img{right:auto!important;bottom:1px!important;left:50%!important;width:146px!important;height:146px!important;transform:translateX(-50%)!important;object-fit:contain!important;object-position:center!important}
.safe-spend-bubble{left:-96px!important}

/* Category cards: fixed three-column grid, no absolute percentage overlap. */
.category-spending button{display:grid!important;grid-template-columns:64px minmax(0,1fr) 38px!important;grid-template-rows:1fr 1fr!important;column-gap:10px!important;min-height:92px!important;padding:10px 12px!important;overflow:hidden!important}
.category-spending button i{grid-column:1!important;grid-row:1/3!important;width:62px!important;height:62px!important;overflow:visible!important;background:#fff5f8!important}
.category-spending button i img{display:block!important;width:58px!important;height:58px!important;margin:auto!important;object-fit:contain!important;object-position:center!important}
.category-spending button span{grid-column:2!important;grid-row:1!important;align-self:end!important;font-size:10px!important}
.category-spending button b{grid-column:2!important;grid-row:2!important;align-self:start!important;margin-top:3px;font-size:13px!important;white-space:nowrap}
.category-spending button small{position:static!important;grid-column:3!important;grid-row:1/3!important;align-self:center!important;justify-self:end!important;padding:5px 6px;border-radius:999px;background:#f8e9ef;color:#a95b77!important;font-size:7px!important}

@media(max-width:380px){
  #view-today .stack-front header,#view-today .stack-front h2,#view-today .stack-front>p,#view-today .task-meta,#view-today .complete-track{width:67%}
  #view-today .stack-front h2{font-size:24px}
  .home-metrics{gap:6px}.home-metrics>button{grid-template-columns:34px 1fr;padding:7px}.metric-art{width:34px;height:34px}
  #view-plan .timeline article{grid-template-columns:48px 7px minmax(0,1fr) 56px 38px;gap:6px}
  #view-plan .timeline-art,#view-plan .timeline-art img{width:56px}
}
@media(prefers-reduced-motion:reduce){#view-today .mood-rail .selected i,.home-metrics>button,.metric-water i{transition:none!important;transform:none!important}}
