/* The everyday screens share the calm, tactile layout of the reference. */
:root{--simple-green:#123f34;--simple-lime:#ddff97;--simple-border:#dbe2dc;--simple-muted:#83908a}
body{background:radial-gradient(ellipse at 95% 0,#eff7db 0,transparent 42%),#edf2ed}
.app-shell{background:transparent}
.topbar{padding-top:max(12px,env(safe-area-inset-top));padding-bottom:12px}
.topbar h1{font-size:18px;text-transform:capitalize;line-height:1.3}
.topbar .eyebrow{font-size:9px;letter-spacing:.14em}
.brand-mark{width:42px;height:42px;border-radius:14px}
.app-content{scrollbar-width:thin}
#app{padding:10px 14px 22px}
.simple-view{display:grid;gap:14px;color:#162720;font-variant-numeric:tabular-nums;max-width:100%}
.simple-view button{font:inherit}
.simple-view svg,.bottom-nav svg{width:24px;height:24px;flex:none}
.simple-view .eyebrow{font-size:11px;letter-spacing:.13em;font-weight:850;color:var(--simple-muted);margin:0 0 8px}
.simple-view h2{font-size:20px;font-weight:800;line-height:1.3;margin:0}
.earnings-card{position:relative;overflow:hidden;border-radius:30px;padding:27px 20px 20px;background:var(--simple-green);color:white;box-shadow:0 13px 32px #163d3210}
.earnings-card:before{content:"";position:absolute;pointer-events:none;width:240px;height:240px;border:1px solid #deff9720;border-radius:50%;right:-110px;top:-165px}
.earnings-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;position:relative}
.earnings-head>div:first-child{min-width:0;flex:1}
.earnings-card .eyebrow{color:#acc1b7}
.simple-money{display:block;letter-spacing:-.045em;font-size:clamp(28px,7.6vw,49px);line-height:1.25;overflow-wrap:anywhere;font-weight:850;white-space:normal}
.gross-mini{display:grid;text-align:right;gap:7px;max-width:36%;flex:none}
.gross-mini>span{font-size:10px;font-weight:850;letter-spacing:.03em;color:#acc1b7}
.gross-mini>strong{font-size:15px;white-space:nowrap}
.earnings-caption{font-size:12px;color:#a9c0b6;line-height:1.5;margin:11px 0 0;min-height:36px}
.earnings-metrics{border-top:1px solid #9ab8a83b;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:15px;padding-top:18px;gap:10px}
.earnings-metrics>div+div{padding-left:10px;border-left:1px solid #9ab8a83b}
.earnings-metrics small{display:block;color:#9fb7ad;font-size:10px;margin-bottom:6px}
.earnings-metrics strong{display:block;color:var(--simple-lime);font-size:clamp(14px,3.9vw,22px);line-height:1.25;overflow-wrap:anywhere}
.simple-clock{text-align:center;padding:22px 0 14px;position:relative}
.punch-orbit{position:relative;width:230px;height:230px;border:1px dashed #c8d5ca;border-radius:50%;margin:0 auto 22px;display:grid;place-items:center;background:radial-gradient(circle,#b7c9c226 0 58%,#b7c9c214 59%,transparent 68%);box-shadow:0 25px 32px #173b3115}
.punch-orbit:before{content:"";position:absolute;inset:9px;border:1px solid #c9d6cd;border-radius:50%;pointer-events:none}
.round-punch{width:190px;height:190px;border-radius:50%;background:var(--simple-green);border:1px solid #618578;box-shadow:0 0 0 8px #c2ceca;color:white;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;cursor:pointer;touch-action:manipulation;transition:transform .12s}
.round-punch:active{transform:scale(.97)}
.round-punch:disabled{opacity:.8;cursor:default}
.round-punch svg{width:35px;height:35px;color:var(--simple-lime);margin-bottom:4px;stroke-width:2.4}
.round-punch strong{font-size:25px;font-weight:850;line-height:1.2}
.round-punch small{font-size:12px;color:#abc2b8;font-weight:650}
.simple-clock time{font-size:29px;font-weight:850;letter-spacing:-.02em}
.simple-clock p{font-size:11px;color:var(--simple-muted);margin:8px 0 0}
.simple-state{font-size:9px;letter-spacing:.14em;color:#637d70;display:block;min-height:12px;margin-top:7px}
.simple-card{border:1px solid var(--simple-border);border-radius:25px;background:#ffffffdf;padding:21px 18px;min-width:0}
.simple-card .section-head{margin:0 0 20px;gap:8px}
.day-card h2{font-size:17px}
.simple-icon{padding:8px;display:inline-grid;place-items:center;flex:none;background:transparent;border:0;color:inherit;min-width:40px;min-height:40px;cursor:pointer;border-radius:12px}
.simple-icon:hover{background:#eaf2e7}
.simple-icon:focus-visible,.setting-row:focus-visible,.week-card:focus-visible{outline:3px solid #608350;outline-offset:2px}
.simple-timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));text-align:center;gap:5px;padding:3px 0 0}
.simple-timeline>div{display:grid;justify-items:center;gap:9px;position:relative}
.simple-timeline>div:not(:last-child):after{content:"";position:absolute;top:13px;left:calc(50% + 16px);width:calc(100% - 27px);height:1px;background:var(--simple-border)}
.simple-timeline span{width:28px;height:28px;border-radius:50%;border:1px solid #d7e0d9;display:grid;place-items:center;background:#f6f9f5;color:#96a29a;font-size:12px;font-weight:800}
.simple-timeline .done span{background:#ddff97;color:var(--simple-green);border-color:#c7e68b}
.simple-timeline small{font-size:9px;color:var(--simple-muted)}
.simple-timeline strong{font-size:15px}
.simple-tile{display:flex;align-items:center;text-align:left;gap:14px;border:1px solid var(--simple-border);border-radius:22px;background:#ffffffd4;padding:15px;color:inherit;cursor:pointer;width:100%}
.tile-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:#e9f6da;color:#436f3a;flex:none}
.tile-icon.peach{background:#fff0e8;color:#be653e}
.simple-tile>span:nth-child(2){display:grid;gap:7px;flex:1;min-width:0}
.simple-tile small{color:var(--simple-muted);font-size:11px}
.simple-tile strong{font-size:23px;font-weight:850}
.chevron{font-size:27px;color:#8b9991}
.simple-details>summary{font-size:13px;font-weight:700;cursor:pointer;min-height:24px;line-height:1.6}
.simple-details p{font-size:12px;line-height:1.6;color:#63766a}
.simple-details button{margin-top:9px}
.bottom-nav{background:#20372e;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #72857b;border-radius:26px;margin:0 14px max(10px,env(safe-area-inset-bottom));padding:7px;gap:3px;min-height:73px;box-shadow:0 8px 30px #0b2d2319}
.nav-item{border-radius:21px;padding:9px 3px;color:#97a69f;min-width:0;background:transparent;gap:5px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.nav-item.active{background:var(--simple-lime);color:var(--simple-green)}
.nav-item>span{font-size:25px;line-height:1;display:grid;place-items:center}
.nav-item small{font-size:10px;font-weight:800}
.discovery-intro{margin:0 20px 15px;padding:0;background:transparent;color:#849389;border:0;font-size:11px}
.discovery-intro section{padding:15px 0}.discovery-intro h2{font-size:16px}
.app-information{font-size:11px}
.month-switch{display:flex;justify-content:space-between;align-items:center;text-align:center;padding:8px 0 14px}
.month-switch .simple-icon{border:1px solid #183c2e;border-radius:15px;width:41px;height:41px;font-size:27px;background:#ffffff75;line-height:1}
.month-switch h2{font-weight:400;font-size:24px;text-transform:capitalize}
.month-switch .eyebrow{font-size:10px;margin-bottom:5px}
.month-earnings .gross-mini>strong{color:var(--simple-lime)}
.month-earnings .simple-money{font-size:clamp(28px,7.2vw,45px)}
.month-earnings progress{width:100%;height:8px;border:0;border-radius:8px;background:#446358;accent-color:var(--simple-lime);margin-top:23px}
.month-earnings progress::-webkit-progress-bar{background:#446358;border-radius:8px}.month-earnings progress::-webkit-progress-value{background:var(--simple-lime);border-radius:8px}
.month-earnings .tiny{font-size:11px;color:#adc2b7;margin:5px 0 0}
.simple-month>.simple-card h2{font-size:18px}
.heading-icon{color:#739386;display:grid;place-items:center}
.week-stack{display:grid;gap:10px}
.week-card{display:grid;grid-template-columns:1.1fr 1fr;gap:12px;text-align:left;border:1px solid #dce5db;border-radius:21px;background:#f7f9f5;padding:17px 14px;color:#173f32;width:100%;cursor:pointer}
.week-card small{font-weight:800;font-size:10px;color:#7a8980;display:block}
.week-card>div>strong{font-size:29px;font-weight:850;letter-spacing:-.04em;line-height:1.3;white-space:nowrap;display:block;margin-top:4px}
.week-card p{font-size:9px;color:#8b9990;margin:4px 0 0}
.week-card dl{display:grid;align-content:center;gap:9px;font-size:10px;margin:0}
.week-card dl>div{display:flex;gap:7px;justify-content:space-between;align-items:center}
.week-card dt{color:#839388;white-space:nowrap}.week-card dd{margin:0;font-weight:800;color:#334c40;white-space:nowrap}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#78a08b;margin-right:6px}.dot.gold{background:#d4ad50}.dot.orange{background:#ce8055}
.mileage-pill{margin-top:12px;padding:9px 11px;background:#e8f5dc;border-radius:24px;display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:850;color:#426c38}
.mileage-pill svg{width:16px;height:16px}
.month-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.month-summary .simple-card{padding:18px 15px;display:grid;gap:13px}
.month-summary small{font-size:11px;font-weight:800;color:#85938a}.month-summary strong{font-size:21px;font-weight:850;overflow-wrap:anywhere}.month-summary p{font-size:9px;color:#8d9b92;margin:0}
.month-cash{padding:15px}.cash-banner{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #f1d6c9;background:#fff8f4;border-radius:18px;padding:15px}.cash-banner .eyebrow{color:#ad7a60;font-size:10px}.cash-banner strong{font-size:16px}.cash-banner button{font-size:12px;padding:10px;border-radius:13px;min-height:40px}
.cash-list>div{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;padding:15px 0;border-bottom:1px solid #e8eee7}.cash-list small{display:block;font-size:10px;color:#82938a;margin-top:4px}.cash-list strong{white-space:nowrap;margin-left:auto}.cash-list .simple-icon{color:#b76750;font-size:24px}
.month-day{display:flex;gap:5px;align-items:center;border-top:1px solid #e6ece5;padding:14px 0}
.day-open{display:flex;align-items:center;gap:9px;flex:1;min-width:0;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}
.date-square{display:grid;place-items:center;gap:3px;padding:9px 8px;background:#edf4e9;border-radius:13px;min-width:39px;flex:none}.date-square strong{font-size:22px;line-height:1}.date-square small{font-size:8px;color:#789080;text-transform:uppercase}
.day-open>span:nth-child(2){display:grid;gap:5px;min-width:0;flex:1}.day-open>span:nth-child(2)>strong{font-size:12px}.day-open>span:nth-child(2)>small{font-size:9px;color:#84958a;overflow-wrap:anywhere}
.day-amount{display:grid;text-align:right;gap:5px}.day-amount>strong{font-size:13px;white-space:nowrap}.day-amount small{font-size:9px;color:#5d8c43}.month-day .simple-icon{min-width:30px;width:30px;padding:3px}.month-day svg{width:19px;height:19px}
.settings-intro{padding:14px 5px 3px}.settings-intro h2{font-size:23px;line-height:1.35;letter-spacing:-.03em}.settings-intro p:last-child{font-size:12px;color:#728779;line-height:1.6;margin-bottom:0}
.settings-search{font-size:11px;font-weight:700}.settings-search input{margin-top:8px;border:1px solid #d9e3d5;border-radius:17px;min-height:48px;background:white;font-size:14px}
.settings-groups{display:grid;gap:12px}.settings-group{padding:0;overflow:hidden}.settings-group>summary{padding:21px 18px;font-size:15px;font-weight:800;cursor:pointer}.settings-group>summary small{display:inline-block;color:#84958a;font-size:10px;font-weight:400;margin-left:8px}
.setting-row{border:0;border-top:1px solid #e8eee5;background:transparent;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:13px;padding:17px 18px;color:inherit;cursor:pointer;width:100%}.setting-row strong{font-size:13px;display:block}.setting-row small{color:#839389;font-size:11px;line-height:1.5;display:block;margin-top:5px}.setting-row>span:last-child{font-size:23px;color:#82958a}.setting-row:hover{background:#f4f8ef}
.settings-view [hidden],.simple-view [hidden]{display:none!important}
.settings-view>#settings-count:empty{display:none}
@media(min-width:600px){.simple-view{gap:19px}.earnings-card{padding:30px}.earnings-metrics small{font-size:13px}.simple-money{font-size:53px}.earnings-metrics strong{font-size:24px}.gross-mini>strong{font-size:23px}.gross-mini>span{font-size:12px}.simple-clock{padding:30px 0 20px}.punch-orbit{width:270px;height:270px}.round-punch{width:225px;height:225px}.round-punch strong{font-size:30px}.round-punch small{font-size:15px}.week-card{padding:22px}.week-card small,.week-card dl{font-size:13px}.week-card p{font-size:12px}.week-card>div>strong{font-size:36px}.day-open>span:nth-child(2)>strong{font-size:15px}.day-open>span:nth-child(2)>small{font-size:12px}.day-amount>strong{font-size:17px}.month-summary strong{font-size:29px}}
@media(max-width:359px){.earnings-card{padding:23px 15px 18px}.gross-mini{max-width:38%}.gross-mini>strong{font-size:12px}.gross-mini>span{font-size:8px}.simple-money{font-size:27px}.week-card{grid-template-columns:1fr;gap:12px}.week-card dl{max-width:220px}.simple-tile strong{font-size:20px}}
@media(prefers-reduced-motion:reduce){.round-punch{transition:none}}
.simple-timeline>div:before{display:none}
html[data-reading-size="large"] .simple-view .setting-row strong{font-size:17px}
html[data-reading-size="large"] .simple-view .setting-row small,html[data-reading-size="large"] .simple-view p,html[data-reading-size="large"] .simple-view .week-card dl{font-size:14px}
html[data-reading-size="large"] .simple-view .day-open>span:nth-child(2)>strong{font-size:16px}
html[data-reading-size="large"] .simple-view .day-open>span:nth-child(2)>small{font-size:12px}
html[data-reading-size="large"] .simple-view .month-day{flex-wrap:wrap}
