/* A persistent pill translates between tabs instead of replacing the bar. */
.bottom-nav{--active-tab:0;isolation:isolate;overflow:hidden;border-color:#ffffff24;background:linear-gradient(145deg,#3c3c3cd9,#202020e8);box-shadow:inset 0 1px 1px #ffffff16,0 8px 30px #0003;backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%)}
.bottom-nav::before{content:'';position:absolute;left:4px;top:4px;bottom:4px;width:calc((100% - 8px)/5);border-radius:38px;background:linear-gradient(145deg,#686867bb,#565654bb);box-shadow:inset 0 1px 2px #ffffff22,0 2px 9px #0001;transform:translateX(calc(var(--active-tab)*100%));transition:transform 460ms cubic-bezier(.22,1.12,.32,1);pointer-events:none;z-index:-1}
.bottom-nav button,.bottom-nav button.active,body.light .bottom-nav button.active{background:transparent;transition:color .22s,transform .22s}.bottom-nav button svg{transition:transform 360ms cubic-bezier(.2,1.4,.3,1),opacity .22s}.bottom-nav button.active svg{transform:translateY(-1px) scale(1.08)}.bottom-nav button:active{transform:scale(.94)}.bottom-nav button span{transition:opacity .22s}.bottom-nav button:not(.active) span{opacity:.88}.bottom-nav button:focus-visible{outline-offset:-3px}.avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}
body.light{--bg:#fff;--surface:#f1f1ed;--text:#20201d;--muted:#70706b;--line:#d4d4d0;background:#f7f7f2}body.light #app{border-color:#e5e5df}body.light .bottom-nav{background:linear-gradient(140deg,#fafafacb,#e5e5e0df);border-color:#fff8;box-shadow:inset 0 1px 1px #fff,0 8px 28px #0002}body.light .bottom-nav::before{background:linear-gradient(145deg,#d4d4d0d9,#cececad9);box-shadow:inset 0 1px 1px #fff8,0 2px 8px #0001}body.light .tools{background:#ffffffe0;border:1px solid #ecece6;box-shadow:0 6px 26px #00000008}body.light .prototype-tag{background:#f7f7f2eb;color:#777770}body.light .modal-head{background:#f3f3ed}body.light .pill{background:#e7e6e3;color:#333}body.light .pill.dark{background:#20201d;color:#fff}body.light .card-actions{background:#f1f1ed}body.light .card-actions button{border-color:#d8d8d1}body.light .shortcut svg{color:#555}body.light .shortcut:last-child span{background:#f0f0e9}body.light .reward-panel{border-color:#f4f4ef}body.light .cash-widget,body.light .insight-chart,body.light .metric-card{background:#f1f1eb}body.light .horizontal-row button span{background:#f1f1ebdb}body.light .column-space{border-bottom-color:#555}body.light .metric-arrow{background:#e0e0d9}body.light .positive{color:#467311}body.light .edit-item{background:#e9e9e3}body.light .circle-button{border-color:#e5e5df;background:#ffffff90}body.light .notice{color:#73736c}
.profile-sheet{padding:0;background:#33332f}.profile-sheet .modal-head{position:absolute;top:0;left:0;right:0;padding:16px;background:transparent;pointer-events:none}.profile-sheet .modal-head button{pointer-events:auto}.profile-sheet .modal-head h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.profile-sheet .modal-head .sheet-label{margin-top:0}.profile-sheet .circle-button{background:var(--bg);box-shadow:0 8px 22px #00000012;border:0}.profile-hero{background:var(--bg);padding:86px 16px 32px;border-radius:0 0 18px 18px}.profile-hero h1{font-size:32px;margin:17px 0 22px;line-height:1.2;overflow-wrap:anywhere}.profile-portrait{width:100px;height:100px;border-radius:50%;background:#ededE8;color:#222;position:relative;display:grid;place-items:center;padding:0}.profile-portrait>svg{width:47px;height:47px;stroke-width:1.8}.profile-portrait>img{width:100%;height:100%;object-fit:cover;border-radius:50%}.camera-badge{position:absolute;bottom:3px;right:4px;width:26px;height:26px;border-radius:50%;background:#ededE8;display:grid;place-items:center}.camera-badge svg{width:18px;height:18px}.profile-logoff{background:#efefe8;color:#20201d;border-radius:30px;padding:12px 23px;font-size:17px}.profile-section{background:var(--bg);margin-top:8px;padding:6px 16px 20px;border-radius:18px 18px 0 0;min-height:360px}.profile-section h2{font-size:23px;margin:22px 0 14px}.profile-row{width:100%;display:flex;align-items:center;gap:24px;text-align:left;min-height:85px;border-bottom:1px solid var(--line);padding:20px 0;font-size:17px}.profile-row>span:nth-child(2){flex:1}.profile-row>.profile-row-icon{width:36px;flex:none;display:grid;place-items:center}.profile-row-icon svg{width:24px;height:24px}.profile-row>svg{margin-left:auto;width:20px}.profile-row .diamond{width:18px;height:18px}.client-row>div{flex:1;min-width:0}.client-row strong{display:block;font-weight:450;margin-top:6px;overflow-wrap:anywhere}.client-row .link{font-size:16px}.contact-details{margin:25px 0}.detail-row{padding:17px 0;border-bottom:1px solid var(--line)}.detail-row dt{font-size:14px;color:var(--muted);margin-bottom:7px}.detail-row dd{margin:0;white-space:pre-line;overflow-wrap:anywhere;line-height:1.5}.notification-card{padding:20px 0;border-bottom:1px solid var(--line);margin:8px 0 25px}.notification-card p{color:var(--muted)}.photo-preview{width:128px;height:128px;display:grid;place-items:center;border-radius:50%;background:#333;color:#fff;margin:30px auto}.photo-preview img{width:100%;height:100%;object-fit:cover;border-radius:50%}.photo-preview svg{width:60px;height:60px}.photo-upload{display:block;text-align:center;cursor:pointer;background:var(--yellow);color:#222;border-radius:30px;padding:13px;font-size:16px;font-weight:600}.photo-upload:has(+input:focus-visible){outline:2px solid var(--text);outline-offset:3px}body.light .profile-sheet{background:#f7f7f2}body.light .profile-sheet .modal-head{background:transparent}body.light .profile-portrait,body.light .camera-badge,body.light .profile-logoff{background:#20201d;color:#f8f8f2}body.light .profile-hero,body.light .profile-section{background:#fff}.full-sheet:not(.profile-sheet) .back-link{margin-top:0;margin-bottom:10px}
body.light .dots button{background:#c6c6c0}body.light .dots button.active{background:#292925}body.light .filter-chips button.selected{background:#222;color:#fff;border-color:#222}
html[data-motion="reduced"] .bottom-nav::before,html[data-motion="reduced"] .bottom-nav button,html[data-motion="reduced"] .bottom-nav button svg,html[data-motion="reduced"] .bottom-nav button span{transition:none!important}
html[data-motion="reduced"] *,html[data-motion="reduced"] *::before,html[data-motion="reduced"] *::after{scroll-behavior:auto!important}
.page-enter{animation:page-enter 320ms cubic-bezier(.2,.8,.2,1) both}
@keyframes page-enter{from{opacity:.35;transform:translate3d(var(--page-offset,18px),0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
html[data-motion="reduced"] .page-enter{animation:none}
