:is(html[data-section],html){--bg:#fcf8f5;--card:#fffdfb;--text:#3d2b32;--muted:#765d68;--pink:#873b54;--soft:#f6e5eb;--border:#ead9df;--cream:#faf1e7;--header-a:#efd3dc;--header-b:#fcf2e7;--shadow:0 5px 24px #66344607}
:is(html[data-section],html)[data-theme=dark]{--bg:#251e23;--card:#30252c;--text:#f9edf2;--muted:#d1b8c5;--pink:#f0b6cc;--soft:#49323f;--border:#604653;--cream:#382c30;--header-a:#503342;--header-b:#32272c}
:is(html[data-section],html) body{font-size:16px;line-height:1.65;background:var(--bg)}
:is(html[data-section],html) .app{background:var(--bg)}
:is(html[data-section],html) .hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 10% 0%,#fff8,transparent 70%),linear-gradient(120deg,var(--header-a),var(--header-b));padding-bottom:22px}
:is(html[data-section],html) .hero:after{content:'✿';position:absolute;right:16px;bottom:-60px;font-family:Georgia,serif;font-size:200px;line-height:1;color:#a46e7d;opacity:.07;z-index:-1;pointer-events:none}
:is(html[data-section],html) .brand{font-size:14px;letter-spacing:1.5px}
:is(html[data-section],html) .brand img{width:30px;height:30px}
:is(html[data-section],html) .hero-meta{font-size:14px;margin:18px 0 10px}
:is(html[data-section],html) .quiet-badge{font-size:14px;letter-spacing:.6px}
:is(html[data-section],html) .hero h1,:is(html[data-section],html) .welcome h2,:is(html[data-section],html) .section-head h2{font-family:Georgia,'Times New Roman',serif}
:is(html[data-section],html) .hero h1{font-size:clamp(29px,7.2vw,40px);font-weight:400;line-height:1.17;letter-spacing:-.7px}
:is(html[data-section],html) .hero p{font-size:14px;line-height:1.6}
:is(html[data-section],html) .avatar-button{display:flex;align-items:center;justify-content:center;gap:7px;border-radius:24px;min-height:44px;height:auto;min-width:44px;padding:6px 11px;color:var(--text);touch-action:manipulation}
:is(html[data-section],html) .avatar-button>span:first-child{font-size:23px}
:is(html[data-section],html) .avatar-button>span:last-child{font-size:14px;font-weight:650}
:is(html[data-section],html) .avatar-button[aria-current=page]{border-color:var(--pink);background:var(--soft)}
:is(html[data-section],html) .status-row{font-size:14px;flex-wrap:wrap;padding:11px 18px;line-height:1.5;overflow-wrap:anywhere}
:is(html[data-section],html) .welcome{padding:6px 3px 14px}
:is(html[data-section],html) .welcome h2{font-size:26px;font-weight:400}
:is(html[data-section],html) .eyebrow{font-size:14px;letter-spacing:.8px}
:is(html[data-section],html) .card{border-radius:22px;padding:19px;margin-bottom:14px;box-shadow:var(--shadow)}
:is(html[data-section],html) .section-head{align-items:center;flex-wrap:wrap;gap:10px}
:is(html[data-section],html) .section-head h2{font-size:24px;line-height:1.25;font-weight:400;letter-spacing:-.3px;overflow-wrap:anywhere}
:is(html[data-section],html) .section-head>button{min-height:44px;font-size:14px;padding:10px 13px}
:is(html[data-section],html) .muted,:is(html[data-section],html) .empty,:is(html[data-section],html) .center,:is(html[data-section],html) .storage-status,:is(html[data-section],html) .app-release,:is(html[data-section],html) .chart-label,:is(html[data-section],html) .chart-label strong,:is(html[data-section],html) .remaining,:is(html[data-section],html) .money-unpaid,:is(html[data-section],html) .photo-state,:is(html[data-section],html) .programme-grid small,:is(html[data-section],html) .form-error,:is(html[data-section],html) .instructions li,:is(html[data-section],html) .detail-field p,:is(html[data-section],html) .exercise-list .task span,:is(html[data-section],html) .fitness-set label,:is(html[data-section],html) .fitness-set>span,:is(html[data-section],html) .location-card small,:is(html[data-section],html) .location-intro,:is(html[data-section],html) .notebook-preview,:is(html[data-section],html) .notebook-card-foot small,:is(html[data-section],html) .notebook-footnote,:is(html[data-section],html) .notebook-dates,:is(html[data-section],html) .notebook-save-status,:is(html[data-section],html) .comeback-card .muted{font-size:14px;line-height:1.65}
:is(html[data-section],html) .metric>span,:is(html[data-section],html) .money-balances small,:is(html[data-section],html) .monthly-expense-info>span,:is(html[data-section],html) .comparison h3,:is(html[data-section],html) .clock-control legend,:is(html[data-section],html) .bulk-row output,:is(html[data-section],html) #bulk-preview [data-bulk-summary]{font-size:14px}
:is(html[data-section],html) .metric strong{font-size:29px;line-height:1.35}
:is(html[data-section],html) .primary,:is(html[data-section],html) .soft,:is(html[data-section],html) .danger,:is(html[data-section],html) .file-button,:is(html[data-section],html) .external{font-size:16px;min-height:44px;padding:11px 15px;border-radius:13px;touch-action:manipulation}
:is(html[data-section],html) .primary{background:#873b54;color:#fff}
:is(html[data-section],html) .chip.active{background:#873b54;border-color:#873b54;color:#fff}
:is(html[data-section],html) .task input[type=checkbox],:is(html[data-section],html) .switch input,:is(html[data-section],html) .expense-paid input{accent-color:#873b54}
:is(html[data-section],html) .task-name strong,:is(html[data-section],html) .record strong,:is(html[data-section],html) .shortcut strong,:is(html[data-section],html) .programme-grid strong,:is(html[data-section],html) .location-card strong{font-size:16px;line-height:1.5}
:is(html[data-section],html) .task-name small,:is(html[data-section],html) .record small,:is(html[data-section],html) .shortcut small{font-size:14px;line-height:1.6}
:is(html[data-section],html) .task{gap:10px}
:is(html[data-section],html) .task-tools button,:is(html[data-section],html) .bulk-row-head button{font-size:14px;min-height:44px;padding:9px 12px}
:is(html[data-section],html) .task-tools{flex-shrink:1}
:is(html[data-section],html) .task-notes,:is(html[data-section],html) .bulk-note,:is(html[data-section],html) .notebook-filters,:is(html[data-section],html) .notebook-options{font-size:14px}
:is(html[data-section],html) .task-notes summary,:is(html[data-section],html) .bulk-note summary,:is(html[data-section],html) summary{min-height:44px;cursor:pointer}
:is(html[data-section],html) .task-notes summary,:is(html[data-section],html) .bulk-note summary{padding:10px 0}
:is(html[data-section],html) .record,:is(html[data-section],html) .shortcut{min-height:52px}
:is(html[data-section],html) .dots{margin-right:-8px}
:is(html[data-section],html) .chip{font-size:14px;min-height:44px;padding:10px 15px}
:is(html[data-section],html) .section-tabs{display:flex;flex-wrap:wrap;overflow:visible;gap:8px;padding:3px 0 8px;margin-bottom:16px}
:is(html[data-section],html) .section-tabs .chip{white-space:normal;line-height:1.5}
:is(html[data-section],html) .calendar-toolbar>.soft{min-width:44px;min-height:44px}
:is(html[data-section],html) .date-select>span,:is(html[data-section],html) .date-select input,:is(html[data-section],html) .calendar>span{font-size:14px}
:is(html[data-section],html) .date-select input{min-height:44px;max-width:185px}
:is(html[data-section],html) .calendar{gap:2px}
:is(html[data-section],html) .calendar .day{font-size:14px;min-height:44px}
:is(html[data-section],html) .calendar>span{padding-bottom:5px}
:is(html[data-section],html) .home-tools{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 15px}
:is(html[data-section],html) .home-tools button{font-size:14px}
:is(html[data-section],html) .studio-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
:is(html[data-section],html) .studio-shortcuts .shortcut{display:grid;grid-template-columns:1fr;align-content:start;gap:8px;border:0;padding:14px;border-radius:17px;background:var(--cream)}
:is(html[data-section],html) .studio-shortcuts .shortcut>span:last-child{display:none}
:is(html[data-section],html) .studio-shortcuts .shortcut-icon{width:38px;height:38px}
:is(html[data-section],html) .feature-fold{border-block:1px solid var(--border);margin:16px 0}
:is(html[data-section],html) .feature-fold>summary{font-family:Georgia,'Times New Roman',serif;font-size:23px;color:var(--pink);padding:13px 3px;line-height:1.4}
:is(html[data-section],html) .feature-fold>.card{box-shadow:none;border:0;padding:8px 3px 14px;background:transparent}
:is(html[data-section],html) .feature-fold .section-head h2{font-size:20px}
:is(html[data-section],html) .feature-fold[open]{padding-bottom:8px}
:is(html[data-section],html) .goal-links .shortcut>span:first-child{flex:1;min-width:0}
:is(html[data-section],html) .goal-links .shortcut{gap:12px}
:is(html[data-section],html) .notebook-card{background:var(--bg)}
:is(html[data-section],html) .notebook-open h3{font-family:Georgia,'Times New Roman',serif;font-size:24px;font-weight:400}
:is(html[data-section],html) .notebook-preview{font-size:16px}
:is(html[data-section],html) .notebook-card-foot small{font-size:14px}
:is(html[data-section],html) .location-card small{font-size:14px}
:is(html[data-section],html) .location-continue{font-size:16px}
:is(html[data-section],html) .remaining{flex-wrap:wrap}
:is(html[data-section],html) .remaining strong{font-size:23px}
:is(html[data-section],html) .money-balances strong{font-size:30px}
:is(html[data-section],html) .money-explainer{font-size:14px!important}
:is(html[data-section],html) .monthly-expense-amount{font-size:22px}
:is(html[data-section],html) .monthly-expense .expense-paid{font-size:16px}
:is(html[data-section],html) .money-balances>div{padding:15px}
:is(html[data-section],html) .comparison .photo-frame img{object-fit:cover}
:is(html[data-section],html) .detail-field p{font-size:16px}
:is(html[data-section],html) .dialog-head{gap:10px}
:is(html[data-section],html) .dialog-head h2{font-family:Georgia,'Times New Roman',serif;font-size:26px;font-weight:400;line-height:1.25;overflow-wrap:anywhere}
:is(html[data-section],html) .dialog-head button{width:44px;min-width:44px;height:44px;min-height:44px}
:is(html[data-section],html) .dialog-head h2{min-width:0}
:is(html[data-section],html) label:not(.task):not(.switch):not(.file-button):not(.date-select){font-size:14px}
:is(html[data-section],html) .switch{font-size:16px;min-height:44px}
:is(html[data-section],html) .fitness-set label{font-size:14px}
:is(html[data-section],html) .fitness-set>span{font-size:14px}
:is(html[data-section],html) input,:is(html[data-section],html) select,:is(html[data-section],html) textarea{font-size:16px}
:is(html[data-section],html) .clock-parts label{font-size:14px}
:is(html[data-section],html) #nav{grid-template-columns:repeat(5,minmax(0,1fr));padding-inline:4px;background:var(--card);border-top:1px solid var(--border)}
:is(html[data-section],html) #nav button{font-size:14px;min-height:54px;gap:4px;border-radius:16px;line-height:1.4;touch-action:manipulation}
:is(html[data-section],html) #nav button.active{background:var(--soft);color:var(--pink)}
:is(html[data-section],html) #nav svg{width:22px;height:22px}
:is(html[data-section],html) .auth-intro{font-size:16px}
:is(html[data-section],html) .auth-fine,:is(html[data-section],html) .auth-error,:is(html[data-section],html) .auth-notice,:is(html[data-section],html) .auth-account-email,:is(html[data-section],html) .auth-setup{font-size:14px!important}
:is(html[data-section],html) .auth-text,:is(html[data-section],html) .auth-back,:is(html[data-section],html) .auth-outline{font-size:16px!important;min-height:44px}
:is(html[data-section],html) .auth-card h1{font-family:Georgia,'Times New Roman',serif;font-weight:400}
:is(html[data-section],html) .auth-shell{background:linear-gradient(135deg,var(--bg),var(--cream))}
:is(html[data-section],html) #toast{font-size:14px}
:is(html[data-section],html) #app-update p,:is(html[data-section],html) #app-update button{font-size:14px}
:is(html[data-section],html) h1,:is(html[data-section],html) h2,:is(html[data-section],html) h3{overflow-wrap:anywhere}
:is(html[data-section],html)[data-theme=dark] .primary,:is(html[data-section],html)[data-theme=dark] .chip.active{background:#d38aa9;color:#271a21}
:is(html[data-section],html)[data-theme=dark] .hero:after{color:#f0b6cc}
@media(max-width:350px){:is(html[data-section],html) .brand{letter-spacing:.4px;font-size:14px;gap:5px}
:is(html[data-section],html) .hero{padding-inline:14px}
:is(html[data-section],html) .quiet-badge{display:none}
:is(html[data-section],html) .card{padding:15px}
:is(html[data-section],html) .section-head h2{font-size:23px}
:is(html[data-section],html) .studio-shortcuts{grid-template-columns:1fr}
:is(html[data-section],html) .status-row{padding-inline:14px}
:is(html[data-section],html) .metrics{gap:9px}
:is(html[data-section],html) .metric strong{font-size:25px}
:is(html[data-section],html) #main{padding-inline:10px}
:is(html[data-section],html) .fitness-set{grid-template-columns:28px minmax(0,1fr) minmax(0,1fr) 58px 38px;gap:4px}
:is(html[data-section],html) .fitness-set label{font-size:14px}
:is(html[data-section],html) .clock-parts{flex-wrap:wrap}
:is(html[data-section],html) .location-card small{font-size:14px}
:is(html[data-section],html) .section-tabs .chip{padding-inline:12px}
:is(html[data-section],html) #nav button{font-size:14px}
:is(html[data-section],html) .money-balances strong{font-size:27px}
}
@media(min-width:680px){:is(html[data-section],html) .hero{padding:30px 28px}
:is(html[data-section],html) .app{border-color:var(--border)}
:is(html[data-section],html) .studio-shortcuts{grid-template-columns:repeat(4,minmax(0,1fr))}
:is(html[data-section],html) .card{padding:23px}
:is(html[data-section],html) .section-tabs{gap:10px}
}
@media(prefers-reduced-motion:reduce){:is(html[data-section],html) *,:is(html[data-section],html) *:before,:is(html[data-section],html) *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
:is(html[data-section],html) body:has(.app:not([hidden])){height:100dvh;overflow:hidden}
:is(html[data-section],html) .app{height:calc(100dvh - 74px - env(safe-area-inset-bottom));min-height:0;overflow-y:auto;overflow-x:hidden;padding-bottom:24px;margin-block:0;overscroll-behavior-y:contain;scroll-padding-block:18px}
:is(html[data-section],html) #nav{min-height:74px}
:is(html[data-section],html) .app button,:is(html[data-section],html) .app input,:is(html[data-section],html) .app select,:is(html[data-section],html) .app summary{scroll-margin-block:18px}
@media(min-width:680px){:is(html[data-section],html) .app{margin-block:0}
}
:is(html[data-section],html) .hero{padding-block:calc(12px + env(safe-area-inset-top)) 14px}
:is(html[data-section],html) .hero-meta{margin-block:10px 6px}
:is(html[data-section],html) .hero h1{margin-bottom:6px}
:is(html[data-section],html) .welcome{padding-bottom:9px}
:is(html[data-section],html) .card{padding-block:15px;margin-bottom:11px}
:is(html[data-section],html) .section-head{margin-bottom:8px}
:is(html[data-section],html) .compact-progress{margin-block:7px;align-items:center}
:is(html[data-section],html) .compact-progress .metric{display:flex;align-items:center;justify-content:space-between;gap:8px}
:is(html[data-section],html) .compact-progress .metric>span{max-width:85px}
:is(html[data-section],html) .compact-progress+progress{margin-block:9px}
:is(html[data-section],html) .studio-shortcuts .shortcut{display:flex;gap:10px;padding:10px;align-items:center}
:is(html[data-section],html) .studio-shortcuts .shortcut-icon{flex:0 0 32px;width:32px;height:32px}
:is(html[data-section],html) .studio-shortcuts .shortcut>span:nth-child(2){min-width:0}
:is(html[data-section],html) .studio-shortcuts .shortcut strong{font-size:16px}
:is(html[data-section],html) .studio-shortcuts .shortcut small{display:none}
:is(html[data-section],html) .feature-fold{margin-block:10px}
:is(html[data-section],html) .feature-fold>summary{padding-block:9px}
:is(html[data-section],html) .home-tools{padding:8px 0}
:is(html[data-section],html) .task{padding-block:9px}
:is(html[data-section],html) .task-notes{margin-bottom:6px}
:is(html[data-section],html) .compact-help{margin:8px 0;font-size:14px}
:is(html[data-section],html) .compact-help summary{padding-block:8px;color:var(--pink);min-height:44px}
:is(html[data-section],html) .expense-filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(100px,.45fr);gap:10px;margin-bottom:10px}
:is(html[data-section],html) .compact-balances{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-block:12px}
:is(html[data-section],html) .compact-balances>div{padding:11px}
:is(html[data-section],html) .compact-balances>div:last-child{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px}
:is(html[data-section],html) .compact-balances>div:last-child small{flex-basis:100%}
:is(html[data-section],html) .compact-balances strong{font-size:30px}
:is(html[data-section],html) .planner-overview .metrics{margin-block:10px}
:is(html[data-section],html) .planner-overview .money-unpaid{margin-block:9px}
:is(html[data-section],html) .monthly-expense.compact-expense{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:start;gap:5px;padding-block:6px}
:is(html[data-section],html) .compact-paid{display:flex!important;align-items:center;justify-content:center;width:44px;min-height:56px;margin:0;cursor:pointer}
:is(html[data-section],html) .compact-paid input{width:22px;height:22px;accent-color:var(--pink);margin:0}
:is(html[data-section],html) .compact-expense details{min-width:0}
:is(html[data-section],html) .compact-expense summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:56px;list-style:none;cursor:pointer;padding:3px 5px}
:is(html[data-section],html) .compact-expense summary::-webkit-details-marker{display:none}
:is(html[data-section],html) .compact-expense summary>span{min-width:0;flex:1}
:is(html[data-section],html) .compact-expense summary>span strong{display:block;font-size:16px;font-weight:650;overflow-wrap:anywhere}
:is(html[data-section],html) .compact-expense summary small{font-size:14px;color:var(--muted);display:block}
:is(html[data-section],html) .compact-expense .monthly-expense-amount{font-size:22px;max-width:47%;text-align:right;overflow-wrap:anywhere}
:is(html[data-section],html) .compact-expense summary:after{content:'⌄';color:var(--muted);font-size:18px}
:is(html[data-section],html) .compact-expense details[open]>summary:after{content:'⌃'}
:is(html[data-section],html) .compact-expense .expense-edit-tools{justify-content:flex-start;gap:8px;margin-bottom:8px}
:is(html[data-section],html) .compact-expense .expense-edit-tools button{font-size:14px;min-height:44px}
:is(html[data-section],html) .compact-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
:is(html[data-section],html) .planner-overview .money-balances small{font-size:14px}
:is(html[data-section],html) .planner-overview .money-balances span{font-size:14px}
@media(max-width:350px){:is(html[data-section],html) .studio-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))}
:is(html[data-section],html) .studio-shortcuts .shortcut{padding:9px;gap:7px}
:is(html[data-section],html) .studio-shortcuts .shortcut-icon{display:none}
:is(html[data-section],html) .compact-progress .metric{display:block}
:is(html[data-section],html) .expense-filters{grid-template-columns:minmax(0,1fr) 105px}
}
@media(min-width:680px){:is(html[data-section],html) .hero{padding-block:18px}
:is(html[data-section],html) .compact-balances{grid-template-columns:repeat(3,minmax(0,1fr))}
:is(html[data-section],html) .compact-balances>div:last-child{grid-column:auto;display:grid}
:is(html[data-section],html) .compact-balances>div:last-child small{flex-basis:auto}
:is(html[data-section],html) .studio-shortcuts .shortcut{display:grid;grid-template-columns:32px minmax(0,1fr)}
:is(html[data-section],html) .studio-shortcuts .shortcut strong{font-size:16px}
}
:is(html[data-section],html) .photo-record{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;align-items:center;border-bottom:1px solid var(--border);padding-block:8px}
:is(html[data-section],html) .photo-record .photo-frame{width:64px;min-height:68px;height:68px;margin:0;border-radius:12px}
:is(html[data-section],html) .photo-record .photo-frame img{width:64px;min-height:68px;height:68px;object-fit:cover}
:is(html[data-section],html) .photo-record .photo-state{font-size:14px;padding:2px}
:is(html[data-section],html) .photo-record .record{border:0;padding-block:8px}
:is(html[data-section],html) .compact-progress .metric{display:block}
:is(html[data-section],html) .compact-progress .metric>span{max-width:none}
:is(html[data-section],html) .compact-balances>div:last-child{grid-row:1}
@media(min-width:680px){:is(html[data-section],html) .compact-balances>div:last-child{grid-row:auto}
}
:is(html[data-section],html) .hero{padding-block:10px 12px}
:is(html[data-section],html) .hero-meta{display:none}
:is(html[data-section],html) .hero h1{font-size:28px;line-height:1.2;margin:8px 0 0;letter-spacing:-.5px}
:is(html[data-section],html) .hero>p:empty{display:none}
:is(html[data-section],html) .hero>p{margin-top:4px}
:is(html[data-section],html) .status-row{padding-block:6px}
:is(html[data-section],html) .brand-row{min-height:44px}
:is(html[data-section],html) .screen-back{min-height:44px;font-size:14px;margin:0 0 8px;padding-block:8px}
:is(html[data-section],html) .today-summary{padding-block:12px}
:is(html[data-section],html) .today-summary>div{display:flex;justify-content:space-between;gap:10px;align-items:center}
:is(html[data-section],html) .today-summary strong{font-family:Georgia,serif;font-size:24px;font-weight:400}
:is(html[data-section],html) .today-summary span,:is(html[data-section],html) .today-summary small{font-size:14px}
:is(html[data-section],html) .today-summary progress{margin-block:9px}
:is(html[data-section],html) .home-action-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px}
:is(html[data-section],html) .destination-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px 0 14px}
:is(html[data-section],html) .destination-grid .destination{min-width:0;min-height:72px;border:1px solid var(--border);border-radius:16px;background:var(--cream);padding:10px;display:flex;flex-wrap:wrap;gap:4px 8px;align-content:center}
:is(html[data-section],html) .destination strong{font-size:16px}
:is(html[data-section],html) .destination small{font-size:14px;flex-basis:100%}
:is(html[data-section],html) .home-studios .destination{margin:0;min-height:60px;padding:8px}
:is(html[data-section],html) .home-studios .shortcut-icon{width:30px;height:30px;flex:0 0 30px}
:is(html[data-section],html) .home-studios strong{flex:1;min-width:0;line-height:1.4}
:is(html[data-section],html) .gentle-strip{display:flex;flex-wrap:wrap;align-items:center;gap:7px 10px;border:1px solid var(--border);background:var(--soft);padding:8px 12px;border-radius:15px;margin-bottom:10px}
:is(html[data-section],html) .gentle-strip>span{font-size:14px;flex:1;min-width:140px;overflow-wrap:anywhere}
:is(html[data-section],html) .gentle-strip button{font-size:14px;padding:9px 11px;min-height:44px}
:is(html[data-section],html) .goal-overview{display:flex;align-items:center;gap:15px}
:is(html[data-section],html) .goal-overview progress{flex:1}
:is(html[data-section],html) .goal-overview .metric{flex:0 0 auto}
:is(html[data-section],html) .section-tabs{margin-bottom:8px;gap:6px}
:is(html[data-section],html) .section-tabs .chip{padding:8px 12px;min-height:44px}
:is(html[data-section],html) .section-head h2{font-size:24px}
:is(html[data-section],html) .card{padding-block:13px}
:is(html[data-section],html) .form-grid,:is(html[data-section],html) .check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
:is(html[data-section],html) .form-grid>label{min-width:0}
:is(html[data-section],html) .compact-avatar{font-size:38px;padding:8px}
:is(html[data-section],html) .cycle-dashboard{display:grid;grid-template-columns:85px minmax(0,1fr);gap:12px;align-items:center;margin:8px 0}
:is(html[data-section],html) .cycle-dashboard span{display:block;font-size:14px;color:var(--muted)}
:is(html[data-section],html) .cycle-dashboard strong{font-size:32px;display:block;color:var(--pink);font-weight:600}
:is(html[data-section],html) .cycle-dashboard strong.phase-label{font-size:20px;line-height:1.4}
:is(html[data-section],html) .cycle-dashboard small{font-size:14px}
:is(html[data-section],html) .countdown{padding:10px 12px;background:var(--soft);border-radius:12px;font-size:16px;margin:10px 0}
:is(html[data-section],html) .logged-period{background:var(--soft)!important;border:1px solid var(--pink)!important}
:is(html[data-section],html) .predicted-period{border:1px dashed var(--pink)!important}
:is(html[data-section],html) .cycle-tabs .chip{font-size:14px}
:is(html[data-section],html) .cycle-calendar .day{height:44px}
:is(html[data-section],html) .feature-fold p{font-size:14px}
:is(html[data-section],html) .check-grid label{min-width:0}
:is(html[data-section],html) .money-overview-lines{display:grid;gap:0}
:is(html[data-section],html) .money-overview-lines>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid var(--border)}
:is(html[data-section],html) .money-overview-lines span{font-size:14px;min-width:0}
:is(html[data-section],html) .money-overview-lines strong{font-size:25px;max-width:65%;color:var(--pink);overflow-wrap:anywhere;text-align:right}
:is(html[data-section],html) .money-overview-lines small{display:none}
:is(html[data-section],html) #generator fieldset:not(.clock-control){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:0}
:is(html[data-section],html) #generator fieldset>legend,:is(html[data-section],html) #generator fieldset>p,:is(html[data-section],html) #generator fieldset>button{grid-column:1/-1}
:is(html[data-section],html) #generator fieldset .switch{font-size:16px;align-items:center;min-height:44px;min-width:0;padding-block:4px}
:is(html[data-section],html) .dialog-head{padding-block:12px}
:is(html[data-section],html) .dialog-head h2{font-size:25px}
:is(html[data-section],html) .bulk-row details>summary{min-height:44px;cursor:pointer;font-size:16px}
:is(html[data-section],html) .bulk-row .bulk-row-head{flex-wrap:wrap}
:is(html[data-section],html) #editor textarea{min-height:90px}
:is(html[data-section],html)[data-section=home] .hero>p{display:none}
@media(max-width:350px){:is(html[data-section],html) .form-grid,:is(html[data-section],html) .check-grid{grid-template-columns:1fr}
:is(html[data-section],html) .home-studios .shortcut-icon{display:none}
:is(html[data-section],html) .destination-grid .destination{padding:9px}
:is(html[data-section],html) .section-tabs .chip{padding-inline:10px}
:is(html[data-section],html) #generator fieldset:not(.clock-control){grid-template-columns:1fr}
:is(html[data-section],html) .hero h1{font-size:27px}
:is(html[data-section],html) .cycle-dashboard{grid-template-columns:75px minmax(0,1fr)}
}
:is(html[data-section],html) .app{height:calc(100dvh - 74px - env(safe-area-inset-bottom) - var(--update-space,0px))}
:is(html[data-section],html) .money-overview-lines>div{padding-block:6px}
:is(html[data-section],html) .money-overview-lines strong{font-size:22px;line-height:1.35}
:is(html[data-section],html) .help-answer,:is(html[data-section],html) .chat-bubble p{white-space:pre-wrap;font-size:16px;overflow-wrap:anywhere}
:is(html[data-section],html) .support-chat{max-height:52dvh;overflow:auto;overscroll-behavior:contain;padding-block:6px}
:is(html[data-section],html) .chat-bubble{padding:14px;border-radius:18px;background:var(--soft);margin-block:12px;overflow-wrap:anywhere}
:is(html[data-section],html) .chat-bubble.user{background:var(--cream)}
:is(html[data-section],html) .chat-bubble small{display:block;font-size:14px}
:is(html[data-section],html) .chat-bubble .button-row{gap:8px}
:is(html[data-section],html) .chat-bubble button{font-size:14px;min-height:44px}
:is(html[data-section],html) .support-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--border);padding-block:10px}
:is(html[data-section],html) .support-row>div{min-width:0}
:is(html[data-section],html) .support-row strong,:is(html[data-section],html) .support-row small{display:block;overflow-wrap:anywhere}
:is(html[data-section],html) .support-row small{font-size:14px;color:var(--muted)}
:is(html[data-section],html) .notification-status{margin-block:10px}
:is(html[data-section],html) .notification-status>div{display:flex;justify-content:space-between;gap:10px;padding-block:6px}
:is(html[data-section],html) .notification-status dt,:is(html[data-section],html) .notification-status dd{margin:0;font-size:14px}
:is(html[data-section],html) .notification-status dd{font-weight:650;text-align:right}
:is(html[data-section],html) .support-image{width:min(95vw,650px);max-height:90dvh;overflow:auto;background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:20px;padding:14px}
:is(html[data-section],html) .support-image img{display:block;max-width:100%;height:auto;margin-top:12px}
:is(html[data-section],html) #support-content input,:is(html[data-section],html) #support-content textarea,:is(html[data-section],html) #support-content select{max-width:100%;min-width:0;font-size:16px}
:is(html[data-section],html) #support-content fieldset{min-width:0}
:is(html[data-section],html) #support-content .record small{display:block}
:is(html[data-section],html) #support-content .feature-fold p{font-size:14px}
:is(html[data-section],html) #notification-preferences>.primary{position:sticky;bottom:8px}
:is(html[data-section],html) #support-filter{display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:10px}
:is(html[data-section],html) #support-filter button{grid-column:1/-1}
@media(max-width:350px){:is(html[data-section],html) #support-filter{grid-template-columns:1fr}
}
:is(html[data-section],html) #support-messages{max-height:50dvh;overflow-y:auto;overscroll-behavior:contain;padding-block:4px}
:is(html[data-section],html) #support-messages .chat-bubble:first-child{margin-top:0}
:is(html[data-section],html) .grocery-utility{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-block:8px 12px}
:is(html[data-section],html) .grocery-utility .switch{font-size:14px}
:is(html[data-section],html) .grocery-stock-row{display:flex;align-items:center;gap:10px;padding-block:12px;border-bottom:1px solid var(--border);flex-wrap:wrap}
:is(html[data-section],html) .grocery-stock-row>div:first-of-type{flex:1;min-width:100px}
:is(html[data-section],html) .grocery-stock-row strong,:is(html[data-section],html) .grocery-stock-row small{display:block;overflow-wrap:anywhere}
:is(html[data-section],html) .grocery-stock-row small{font-size:14px;color:var(--muted)}
:is(html[data-section],html) .grocery-stock-row>.button-row{flex-basis:100%}
:is(html[data-section],html) .grocery-stock-row>input{width:24px;height:24px;min-width:24px}
:is(html[data-section],html) .grocery-totals{display:grid;gap:0;margin:8px 0}
:is(html[data-section],html) .grocery-totals>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-block:8px;border-bottom:1px solid var(--border)}
:is(html[data-section],html) .grocery-totals dt{font-size:14px}
:is(html[data-section],html) .grocery-totals dd{margin:0;font-size:19px;font-weight:650;color:var(--pink);text-align:right;max-width:60%;overflow-wrap:anywhere}
:is(html[data-section],html) .grocery-shopping-row{border-bottom:1px solid var(--border);padding-block:10px}
:is(html[data-section],html) .grocery-shopping-row .switch span{min-width:0}
:is(html[data-section],html) .grocery-shopping-row strong,:is(html[data-section],html) .grocery-shopping-row small{display:block;overflow-wrap:anywhere}
:is(html[data-section],html) .grocery-shopping-row small{font-size:14px;color:var(--muted)}
:is(html[data-section],html) .grocery-item-details>summary{font-size:14px;min-height:44px;cursor:pointer;padding-block:10px}
:is(html[data-section],html) .grocery-import-row{padding-block:10px;border-bottom:1px solid var(--border)}
:is(html[data-section],html) .grocery-nutrition{font-size:14px;background:var(--cream);padding:10px;border-radius:12px}
:is(html[data-section],html) .grocery-nutrition p{font-size:14px}
:is(html[data-section],html) .grocery-item-details .button-row{display:flex;flex-wrap:wrap;gap:8px}
:is(html[data-section],html) [data-grocery-form] input,:is(html[data-section],html) [data-grocery-form] select,:is(html[data-section],html) [data-grocery-form] textarea{font-size:16px;max-width:100%;min-width:0}
:is(html[data-section],html) [data-grocery-form] fieldset{min-width:0}
:is(html[data-section],html) #grocery-live-totals{padding-block:8px}
:is(html[data-section],html) .grocery-stock-row button{min-height:44px;font-size:14px}