:root{--ocean: #0D1B3D;--ocean-2: #14224A;--teal: #0D1B3D;--teal-deep: #1E3A8A;--mint: #EEF1F8;--seafoam: #FFFFFF;--bg: #F2F4F7;--surface: #FFFFFF;--ink: #0D1B3D;--muted: #6B7280;--faint: #9AA3B2;--line: #E3E7EF;--gold: #D4AF37;--gold-tint: #FBF3DA;--red: #1A1A1A;--red-tint: #EBEBEB;--shadow: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.06);--radius: 16px;--radius-sm: 11px;--font-display: "Fraunces", Georgia, serif;--font-body: "Inter", -apple-system, system-ui, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font-body);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.5}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer}input,textarea,select{font-family:inherit;font-size:16px}.app{max-width:480px;margin:0 auto;min-height:100%;background:var(--bg);position:relative;display:flex;flex-direction:column}.topbar{background:var(--ocean);color:#f5f5f5;padding:calc(env(safe-area-inset-top) + 16px) 20px 18px;border-bottom-left-radius:22px;border-bottom-right-radius:22px}.topbar .greeting{font-size:13px;color:#a6a6a6;letter-spacing:.3px}.topbar .name{font-family:var(--font-display);font-size:22px;font-weight:600;margin-top:2px}.topbar .whale{font-size:20px}.page{flex:1;padding:18px 16px 96px}.page-title{font-family:var(--font-display);font-size:20px;font-weight:600;margin-bottom:14px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;margin-bottom:14px}.card-label{font-size:11px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--faint);margin-bottom:10px}.journey{position:relative;padding-left:8px}.stage{display:flex;gap:14px;padding-bottom:4px}.stage:last-child .rail:after{display:none}.rail{position:relative;display:flex;flex-direction:column;align-items:center}.dot{width:15px;height:15px;border-radius:50%;border:2px solid var(--line);background:var(--surface);flex-shrink:0;margin-top:3px;z-index:1}.rail:after{content:"";position:absolute;top:18px;bottom:-4px;width:2px;background:var(--line);left:50%;transform:translate(-50%)}.stage.done .dot{background:var(--teal);border-color:var(--teal)}.stage.done .rail:after{background:var(--teal)}.stage.current .dot{background:var(--ocean);border-color:var(--ocean);box-shadow:0 0 0 4px var(--mint)}.stage-label{font-size:14px;padding-bottom:16px;color:var(--muted)}.stage.done .stage-label{color:var(--ink)}.stage.current .stage-label{color:var(--ocean);font-weight:600}.stage.current .stage-badge{display:inline-block;margin-left:8px;font-size:10px;font-weight:700;color:var(--teal-deep);background:var(--mint);padding:2px 8px;border-radius:20px;vertical-align:middle;letter-spacing:.5px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 10px;text-align:center}.stat .n{font-family:var(--font-display);font-size:22px;font-weight:600;color:var(--ocean)}.stat .l{font-size:10.5px;color:var(--muted);margin-top:2px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--teal);color:#fff;border:none;border-radius:12px;padding:13px 18px;font-size:15px;font-weight:600;width:100%}.btn:active{background:var(--teal-deep)}.btn.ghost{background:transparent;color:var(--teal-deep);border:1px solid var(--line)}.btn.small{width:auto;padding:8px 14px;font-size:13px;border-radius:10px}.btn:disabled{opacity:.55}.settings .field{margin-bottom:14px}.settings label{display:block;font-size:12.5px;color:var(--muted);margin-bottom:6px;font-weight:500}.settings input[type=text],.settings input[type=email],.settings input[type=password]{width:100%;padding:13px 14px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);outline:none;font-size:15px}.settings input:focus{border-color:var(--teal)}.settings .sub{font-size:12px;color:var(--faint);margin-top:6px;line-height:1.5}.settings .ok{background:#10a34a1a;color:#0a8f5f;border:1px solid rgba(16,163,74,.3);padding:11px 14px;border-radius:11px;font-size:13px;margin-bottom:12px}.settings .err{background:#dc262614;color:#b91c1c;border:1px solid rgba(220,38,38,.28);padding:11px 14px;border-radius:11px;font-size:13px;margin-bottom:12px}.thread{display:flex;flex-direction:column;gap:10px;padding-bottom:8px}.bubble{max-width:78%;padding:10px 13px;border-radius:16px;font-size:14.5px;line-height:1.45}.bubble .meta{font-size:10.5px;color:var(--faint);margin-top:4px}.bubble.them{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:5px}.bubble.me{align-self:flex-end;background:var(--ocean);color:#f5f5f5;border-bottom-right-radius:5px}.bubble.me .meta{color:#a6a6a6}.attach-chip{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:12px;padding:6px 10px;background:var(--mint);color:var(--teal-deep);border-radius:8px}.composer{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;z-index:40;display:flex;flex-direction:column;gap:8px;background:linear-gradient(to top,var(--bg) 78%,rgba(241,245,244,0));padding:14px 16px calc(env(safe-area-inset-bottom) + 82px)}.composer-row{display:flex;gap:8px;align-items:flex-end}.composer .clip{width:46px;height:46px;border-radius:50%;flex-shrink:0;font-size:18px;background:var(--surface);border:1px solid var(--line)}.composer .clip:disabled{opacity:.55}.attach-pending{display:flex;align-items:center;gap:8px;background:var(--mint);color:var(--teal-deep);border:1px solid #DBDBDB;border-radius:12px;padding:8px 12px;font-size:13px}.attach-pending .an{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.attach-pending .up{font-size:12px;font-weight:600}.attach-pending .rm{background:none;border:none;color:var(--teal-deep);font-size:14px;padding:2px 4px}.composer textarea{flex:1;resize:none;border:1px solid var(--line);border-radius:14px;padding:11px 14px;max-height:120px;background:var(--surface);color:var(--ink);outline:none;line-height:1.4}.composer .send{width:46px;height:46px;border-radius:50%;background:var(--teal);color:#fff;border:none;flex-shrink:0;font-size:18px}.row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line)}.row:last-child{border-bottom:none}.row .ic{width:38px;height:38px;border-radius:10px;background:var(--mint);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}.row .grow{flex:1;min-width:0}.row .t{font-size:14px;font-weight:500}.row .s{font-size:12px;color:var(--muted)}.badge{font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:20px;letter-spacing:.3px}.badge.paid{background:var(--mint);color:var(--teal-deep)}.badge.due{background:var(--gold-tint);color:var(--gold)}.badge.pending{background:var(--red-tint);color:var(--red)}.drop{border:2px dashed #CCCCCC;border-radius:var(--radius);padding:26px 16px;text-align:center;color:var(--muted);background:var(--surface)}.drop .big{font-size:30px;margin-bottom:8px}.pending-req{background:var(--gold-tint);border:1px solid #DBDBDB;border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:10px}.tabbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;display:flex;justify-content:space-around;background:#fffffff0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:8px 6px calc(env(safe-area-inset-bottom) + 8px);z-index:50}.tab{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--faint);font-size:10.5px;font-weight:500;background:none;border:none;padding:4px 10px;position:relative}.tab .ti{font-size:20px}.tab.active{color:var(--teal-deep)}.tab .dotmark{position:absolute;top:2px;right:6px;width:8px;height:8px;background:var(--red);border-radius:50%;border:1.5px solid #fff}.tab.cta-itr{color:#16a34a;font-weight:700}.cta-full{display:none}.cta-short{display:inline}.login{min-height:100dvh;display:flex;flex-direction:column;justify-content:center;padding:32px 26px calc(env(safe-area-inset-bottom) + 32px);background:linear-gradient(160deg,var(--ocean) 0%,var(--ocean-2) 60%,var(--teal-deep) 100%);color:#f5f5f5}.login .brand{text-align:center;margin-bottom:34px}.login .brand .logocard{display:inline-block;background:#fff;border-radius:18px;padding:16px 22px;box-shadow:0 10px 30px #00000047}.login .brand .logocard img{width:min(240px,66vw);height:auto;display:block}.login .brand h1{font-family:var(--font-display);font-size:30px;font-weight:600;margin-top:6px}.login .brand p{color:#c7ceda;font-size:14px;margin-top:14px}.login .field{margin-bottom:14px}.login label{font-size:12px;color:#c7ceda;display:block;margin-bottom:7px;letter-spacing:.3px}.login input{width:100%;padding:15px 16px;border-radius:13px;border:1px solid rgba(255,255,255,.16);background:#ffffff14;color:#fff;outline:none}.login input:focus{border-color:var(--gold)}.login input::placeholder{color:#ffffff73}.login .btn{background:var(--gold);color:var(--ocean);margin-top:8px;font-weight:700}.login .btn:active{filter:brightness(.94)}.login .hint{text-align:center;font-size:12.5px;color:#aeb6c4;margin-top:18px;line-height:1.5}.login .err{background:#ffffff1a;border:1px solid rgba(255,255,255,.35);color:#f5f5f5;padding:11px 14px;border-radius:11px;font-size:13px;margin-bottom:14px}.center-note{text-align:center;color:var(--muted);padding:40px 20px}.center-note .big{font-size:34px;margin-bottom:10px}.spinner{width:22px;height:22px;border:2.5px solid var(--line);border-top-color:var(--teal);border-radius:50%;animation:spin .7s linear infinite}.loading-screen{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:var(--muted)}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;bottom:92px;left:50%;transform:translate(-50%);background:var(--ocean);color:#f5f5f5;padding:11px 18px;border-radius:12px;font-size:13.5px;z-index:100;box-shadow:var(--shadow);max-width:90%}.content{display:flex;flex-direction:column;flex:1;min-width:0}.nav-brand{display:none}@media (min-width: 900px){.app{max-width:1240px;flex-direction:row;align-items:stretch;min-height:100vh}.tabbar{position:sticky;top:0;bottom:auto;left:auto;transform:none;height:100vh;width:230px;max-width:none;flex-shrink:0;flex-direction:column;justify-content:flex-start;gap:4px;border-top:none;border-right:1px solid var(--line);background:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none;padding:20px 14px}.nav-brand{display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-size:21px;font-weight:700;padding:6px 14px 22px;color:var(--ink)}.tab{flex-direction:row;justify-content:flex-start;gap:12px;width:100%;padding:12px 16px;border-radius:12px;font-size:14.5px;font-weight:500;color:var(--muted)}.tab .ti{font-size:19px}.tab.active{background:var(--mint);color:var(--ink);font-weight:600}.tab .dotmark{top:10px;right:12px}.tab.cta-itr{background:#16a34a;color:#fff;font-weight:700;justify-content:center;margin-top:12px;box-shadow:0 6px 16px #16a34a47}.tab.cta-itr:hover{background:#15803d;color:#fff}.cta-full{display:inline}.cta-short{display:none}.content{min-height:100vh}.topbar{border-bottom-left-radius:0;border-bottom-right-radius:22px;padding-left:32px}.page{max-width:860px;padding:24px 32px 48px}.composer{left:auto;transform:none;max-width:none;position:sticky;bottom:0;width:auto;margin-top:auto;padding:14px 32px 18px;background:linear-gradient(to top,var(--bg) 85%,rgba(247,247,247,0))}.composer>*{max-width:796px}.login{flex:1;align-items:center}.login>*{width:100%;max-width:420px}}.ring-pulse{animation:ringpulse 1.1s ease-in-out infinite;display:inline-block}@keyframes ringpulse{0%,to{transform:scale(1)}50%{transform:scale(1.18)}}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}