:root{--wn-ink:#26343b;--wn-muted:#7c8c7a;--wn-orange:#e96c13;--wn-green:#2b835a;--wn-line:#e9e4d9;--wn-cream:#fffcf6}
body{color:var(--wn-ink);background-color:#f8f5ed}
.brand,.section-top h2,.dialog-heading h2,#summary-title{color:var(--wn-ink)}
.brand{font-size:26px;letter-spacing:.5px}
.brand-mark{background:transparent;color:#43a875;width:44px;height:43px}
.brand-mark svg{width:42px;height:42px}
.brand small{letter-spacing:1.65px;font-size:8px;color:#8f9e8a}
.nav-item{color:#586b67;font-size:14px}
.nav-item.active{background:#dcefe2;color:#245c43;font-weight:600}
.nav-item svg{width:19px;height:19px}
.page-header h1{color:#82917e;font-size:12px}
.card{border-color:var(--wn-line);background:var(--wn-cream);box-shadow:0 4px 12px #6a553708}
.hero,.shift-card,.quick-card,.fixed-overview-card,.fish-card{border-radius:24px}
.hero{background:linear-gradient(115deg,#fffdf8,#fff9ef);border-color:#ece3d4}
.hero select{font-size:22px;font-weight:700;color:var(--wn-ink)}
.hero .hero-value{position:relative;z-index:2;margin-top:20px}
.hero .hero-value strong{font-size:76px;letter-spacing:-3px;font-weight:700;color:var(--wn-orange)}
.hero .hero-value>span{font-size:34px;color:var(--wn-orange)}
.hero .hero-value strong.long-value{font-size:39px;letter-spacing:-1px}
.hero .hero-value strong.very-long-value{font-size:26px;letter-spacing:-.7px}
.hero-art{width:224px;height:173px;right:10px;bottom:25px;object-fit:contain}
.hero.large-amount .hero-art{opacity:.16}
.hero-description{font-size:12px;color:#78896c;max-width:64%}
.hero-bottom{color:#87967b}
.hero .pill{background:#dff0de;color:#5a8c62}
.hero.uncovered{background:linear-gradient(115deg,#fff2ec,#fbe4da);border-color:#e4b5a6;box-shadow:0 4px 15px #a34b3510}
.hero.uncovered select{color:#9c4339}
.hero.uncovered .hero-description{color:#98564a}
.hero.uncovered .hero-art{opacity:1;filter:none}
.hero.uncovered.large-amount .hero-art{opacity:.14}
.hero.uncovered .hero-value strong,.hero.uncovered .hero-value>span{color:#b94037}
.shift-card{background:linear-gradient(125deg,#fffdfa,#fffaf2);overflow:hidden}
.clock-art{position:absolute;right:15px;top:20px;width:112px;height:95px;pointer-events:none}
.shift-card .card-heading{padding-right:111px;font-size:17px;font-weight:600;color:var(--wn-ink)}
.shift-card .card-heading .muted{font-size:10px;font-weight:400;color:#8d9c83}
.shift-card .countdown{font-size:41px;color:var(--wn-ink)!important;letter-spacing:.6px;font-weight:650;position:relative;z-index:1}
.shift-card .progress-line{color:#73836d}
.shift-card .shift-summary{color:#8a977d}
.overtime-mode .shift-card .countdown{color:#b55c3e!important}
.overtime-mode #shift-label-text{color:#ad6046}
.overtime-mode .shift-card .shift-summary{color:#ae765c}
progress{height:8px}
progress::-webkit-progress-bar{background:#e6e7de}
progress::-webkit-progress-value{background:linear-gradient(90deg,#51bd8a,#76c997)}
.primary-button,.shift-card .primary-button,.fish-button{background:linear-gradient(#36865e,#28774f);border-color:#28774f;box-shadow:inset 0 1px 0 #ffffff24;color:#fff}
.primary-button:hover,.shift-card .primary-button:hover,.fish-button:hover{background:#28734d}
.primary-button:focus-visible,.fish-button:focus-visible{outline:3px solid #e4b36b;outline-offset:3px}
.finance-card{background:#f4f6ed;box-shadow:none;border-color:#e7e8dc;border-radius:16px}
.finance-card h2{font-size:13px;font-weight:600}
.finance-card .money-grid strong{color:#536b53;font-weight:550}
.finance-card .net-row strong{color:var(--wn-orange);font-weight:650}
.quick-card h2,.fixed-overview-card h2{font-size:17px;color:var(--wn-ink)}
.quick-card h2 svg,.fixed-overview-card h2 svg{width:21px;height:21px;vertical-align:-4px;margin-right:6px;color:#3d9b6c}
.quick-card h2 strong,.fixed-overview-card h2 strong{font-size:20px;color:var(--wn-orange)}
.quick-expenses span{background:#f5efdf;border:1px solid #ece2cf;color:#9c8b6d}
.quick-expenses button:hover span{background:#efe2ca}
.overview-cost-row{color:#62745c}
.overview-cost-row b{color:#33483d;font-size:14px}
.fish-card{background:linear-gradient(135deg,#e8f6ec,#e1f0de);border-color:#d8e8d3;position:relative;overflow:hidden}
.fish-art{position:absolute;width:103px;height:81px;right:11px;top:48px;pointer-events:none}
.fish-card .card-heading{color:#4a8060;font-size:12px}
.fish-time{text-align:left;font-size:29px;margin-top:19px;letter-spacing:.6px;color:#286b50;font-weight:650}
.fish-subtitle{text-align:left;font-size:9px;color:#85a17e;margin-bottom:18px}
.efficiency{border-color:#c9dbc0}
.efficiency>div{color:#79916e}
.efficiency b{color:#47694a}
.efficiency>div:nth-child(2){background:#fff9e8;border:1px solid #ebead3;border-radius:9px;padding:7px 9px}
#effective-hour{color:#dc721e;font-size:15px;font-weight:600}
.goal-card{background:linear-gradient(115deg,#fffdf6,#fbf6e8)}
.goal-icon{background:#f6e8c6;color:#d39a43}
.goal-card h2{font-weight:600;color:#465f45}
.goal-card progress::-webkit-progress-value{background:linear-gradient(90deg,#d6a250,#ebbf75)}
.input-currency{flex-direction:row;justify-content:flex-start;align-items:center;gap:9px}
.purchase-card .input-currency{margin-bottom:10px}
.input-currency>span{flex:0 0 auto;color:#b39563}
.input-currency input{flex:1 1 auto;min-width:0;text-align:left}
.purchase-card>strong{color:#bd8a40;font-size:18px}
dialog{border-color:#e5e1d3;box-shadow:0 18px 70px #304d3b28}
.form-error{color:#af4b3f}
.settings-explanation{color:#728867}
.reminder-setting{background:#eaf2e2}
.calendar-day.ontime{color:#386c45;background:#dcf0d9}
.calendar-day.late{color:#a04b40;background:#f9e0d7}
.mini-mode:not(.tray-detail-mode){background:#fffaf0}
.mini-mode.net-uncovered:not(.tray-detail-mode){background:#fff0e8}
.mini-mode:not(.tray-detail-mode) .mini-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:30px 24px 48px 6px 39px auto;gap:8px 14px;padding:14px 18px;min-height:0;align-content:start}
.mini-mode:not(.tray-detail-mode) .mini-top{grid-column:1/3;grid-row:1;margin:0}
.mini-mode:not(.tray-detail-mode) #mini-display{grid-column:1;grid-row:2;font-size:10px;padding:4px 6px;max-width:100%;justify-self:start;align-self:start}
.mini-mode:not(.tray-detail-mode) #mini-amount{grid-column:1;grid-row:3;margin:0;font-size:35px;letter-spacing:-1.4px;align-self:center;line-height:1.1;color:var(--wn-orange)}
.mini-mode:not(.tray-detail-mode) #mini-amount.long-value{font-size:24px;letter-spacing:-.6px}
.mini-mode:not(.tray-detail-mode) #mini-amount.very-long-value{font-size:17px;letter-spacing:-.35px}
.mini-mode:not(.tray-detail-mode) #mini-countdown{grid-column:2;grid-row:2/4;margin:0;padding:1px 0 0 14px;border-left:1px solid #e4e5d7;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:5px;min-width:0}
#mini-time-label{font-size:10px;font-weight:500;color:#8b9a80}
#mini-time-value{font-size:25px;font-weight:600;letter-spacing:.3px;font-variant-numeric:tabular-nums;color:#376c50;white-space:nowrap}
#mini-time-status{font-size:8px;line-height:1.5;color:#93a185}
.overtime-mode #mini-time-label,.overtime-mode #mini-time-value{color:#b76546}
.mini-mode:not(.tray-detail-mode) #mini-progress{grid-column:1/3;grid-row:4;height:6px;margin:0}
.mini-mode:not(.tray-detail-mode) .mini-actions{grid-column:1/3;grid-row:5;margin:0;gap:10px}
.mini-mode:not(.tray-detail-mode) .mini-actions button{font-size:11px;padding:9px;line-height:1.3}
.mini-mode:not(.tray-detail-mode) #mini-notice{grid-column:1/3;grid-row:6;font-size:8px;line-height:1.5;margin-top:1px}
.tray-detail-mode #mini-countdown{display:grid;grid-template-columns:auto 1fr;gap:5px 10px;margin:13px 0 12px;align-items:center}
.tray-detail-mode #mini-time-value{font-size:20px}
.tray-detail-mode #mini-time-status{grid-column:1/3}
.tray-detail-mode #mini-amount.very-long-value{font-size:26px}
@media(max-width:1000px){
  .hero .hero-value strong{font-size:61px}
  .hero .hero-value strong.long-value{font-size:35px}
  .hero .hero-value strong.very-long-value{font-size:25px}
  .hero-art{width:195px;right:-3px}
  .hero-description{font-size:10px;max-width:76%}
  .clock-art{width:85px;height:75px;right:11px;top:23px;opacity:.82}
  .shift-card .card-heading{padding-right:82px;font-size:14px}
  .shift-card .countdown{font-size:34px}
  .quick-card h2,.fixed-overview-card h2{font-size:14px}
  .quick-card h2 strong,.fixed-overview-card h2 strong{font-size:17px}
  .quick-card h2 svg{display:none}
  .fish-art{width:78px;right:4px;top:50px;opacity:.8}
  .fish-time{font-size:25px}
  .fish-card .card-heading{font-size:10px}
}
@media(max-width:760px){
  .hero .hero-value strong{font-size:50px}
  .hero .hero-value strong.long-value{font-size:30px}
  .hero .hero-value strong.very-long-value{font-size:23px}
  .hero-art{width:146px;right:-8px;opacity:.55}
  .hero-description{max-width:100%}
  .clock-art{width:68px;top:19px;right:8px;opacity:.65}
  .shift-card .card-heading{padding-right:58px;font-size:12px}
  .shift-card .countdown{font-size:28px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Compact supporting stack: fixed costs and goal share the middle column. */
.mini-top>span>svg{display:none}
.mini-mascot{width:40px;height:32px;object-fit:contain;flex-shrink:0}
.hero-bottom>span:last-child{display:none}
.hero-description{max-width:65%;margin-bottom:13px}
.dashboard-lower{gap:12px;margin-top:12px}
.card-heading .text-button,.section-top .text-button{min-height:24px;display:inline-flex;align-items:center}
@media(min-width:761px){
  .dashboard-lower{grid-template-columns:1fr 1fr 1.16fr;grid-template-rows:auto auto auto auto;align-items:stretch}
  .quick-card{grid-column:1;grid-row:2/4;padding:17px 19px}
  .fixed-overview-card{grid-column:2;grid-row:2;padding:16px 18px 13px}
  .fixed-overview-card .section-top{margin-bottom:5px}
  .fixed-overview-card>.fine-print{margin-top:6px}
  .overview-cost-row{padding-top:8px;padding-bottom:8px}
  .goal-card{grid-column:2;grid-row:3;display:block;padding:15px 18px}
  .goal-card .goal-icon,.goal-card .eyebrow{display:none}
  .goal-card h2{font-size:14px}
  .goal-card .goal-numbers{margin-top:10px;margin-bottom:9px;font-size:11px}
  .goal-card .fine-print{margin-top:9px;font-size:10px;line-height:1.5}
  .goal-card .section-top{gap:6px}
  .goal-card .text-button{font-size:9px}
  .fish-card{grid-column:3;grid-row:2/4;padding:17px 20px 15px}
  .fish-time{margin-top:19px}
  .fish-subtitle{margin-bottom:15px}
  .fish-art{top:48px}
  .purchase-card{grid-column:1/4;grid-row:4;display:grid;grid-template-columns:155px 140px 125px 1fr;gap:4px 18px;align-items:center;padding:15px 20px}
  .purchase-card h2{grid-column:1;grid-row:1/3;font-size:15px;margin:0}
  .purchase-card h2 svg{width:20px;height:20px;margin-left:7px}
  .purchase-card .input-currency{grid-column:2;grid-row:1/3;margin:0;min-height:40px}
  .purchase-card p{grid-column:3;grid-row:1;margin:0;font-size:11px}
  .purchase-card>small{grid-column:3;grid-row:2;margin:0;font-size:9px}
  .purchase-card>strong{grid-column:4;grid-row:1/3;font-size:22px}
  .expense-preview{margin-top:12px}
}
@media(min-width:761px) and (max-width:1000px){
  .quick-card,.fixed-overview-card,.goal-card{padding-left:14px;padding-right:14px}
  .purchase-card{grid-template-columns:135px 110px 110px 1fr;gap:4px 10px;padding:13px 16px}
  .purchase-card>strong{font-size:18px}
}
@media(max-width:760px){.hero-description{max-width:100%}}