@import "https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap";:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--paper-0:oklch(98.4% .012 70);--paper-1:oklch(97% .014 70);--paper-2:oklch(94.5% .018 68);--paper-3:oklch(91% .022 65);--hero-from:oklch(96% .022 70);--hero-to:oklch(91% .03 65);--ink-900:oklch(22% .04 255);--ink-700:oklch(34% .035 258);--ink-500:oklch(52% .025 260);--ink-400:oklch(64% .02 262);--ink-300:oklch(78% .012 265);--coral-600:oklch(58% .13 28);--coral-50:oklch(96% .025 30);--sage-600:oklch(54% .07 150);--sage-50:oklch(95% .022 150);--amber-600:oklch(62% .11 75);--amber-50:oklch(96% .03 80);--sage:oklch(86% .052 145);--sky:oklch(88% .04 230);--clay:oklch(82% .074 38);--amber:oklch(88% .08 82);--r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--shadow-card:0 1px 0 #281e190a, 0 4px 12px -4px #281e190f, 0 12px 32px -12px #281e1914;--shadow-hero:0 1px 0 #281e190a, 0 8px 24px -8px #281e191a, 0 24px 60px -20px #281e1924;--shadow-fab:0 2px 6px #281e191a, 0 12px 28px -8px #281e192e;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:var(--paper-2);min-height:100%}body{min-width:320px;min-height:100vh;color:var(--ink-900);background:radial-gradient(80% 55% at 10% -10%, #ffffffdb, transparent 58%), radial-gradient(70% 50% at 92% 5%, color-mix(in oklch, var(--coral-50) 80%, transparent), transparent 60%), radial-gradient(60% 50% at 80% 92%, color-mix(in oklch, var(--sage-50) 86%, transparent), transparent 62%), linear-gradient(150deg, var(--paper-0), var(--paper-2));margin:0}body:before{content:"";pointer-events:none;opacity:.22;mix-blend-mode:multiply;background-image:radial-gradient(#4a3a2b3b .55px,#0000 .65px),radial-gradient(#ffffffb3 .5px,#0000 .6px);background-size:13px 13px,21px 21px;position:fixed;inset:0}button,input{font:inherit}button:disabled{cursor:not-allowed;opacity:.54}button:focus-visible,input:focus-visible{outline:3px solid color-mix(in oklch, var(--ink-900) 18%, transparent);outline-offset:2px}.grain{position:relative;overflow:hidden}.grain:before{content:"";pointer-events:none;border-radius:inherit;opacity:.42;mix-blend-mode:multiply;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='4'/><feColorMatrix values='0 0 0 0 0.18 0 0 0 0 0.13 0 0 0 0 0.09 0 0 0 0.055 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");background-size:240px 240px;position:absolute;inset:0}.grain>*{z-index:1;position:relative}.app-shell{justify-content:center;min-height:100vh;padding:clamp(10px,3.5vw,28px);display:flex}.phone-surface{background:linear-gradient(180deg, #fffcf6f5, #f8f0e5eb), var(--paper-0);border:1px solid #fffc;border-radius:36px;flex-direction:column;gap:18px;width:min(100%,430px);min-height:calc(100vh - 22px);padding:18px;display:flex;position:relative;box-shadow:0 34px 90px -40px #281e1957,inset 0 1px #fffffff0}.phone-surface:before{content:"";pointer-events:none;border-radius:inherit;background:linear-gradient(118deg,#0000 43%,#ffffff52 43.4% 44.4%,#0000 45%),radial-gradient(circle at 36% -4%,#ffffffd1,#0000 15rem);position:absolute;inset:0}.phone-surface>*{z-index:1;position:relative}.topbar{justify-content:space-between;align-items:center;gap:16px;padding:4px 2px 0;display:flex}.detail-topbar{align-items:center}.detail-topbar>div{flex:1;min-width:0}.eyebrow,.section-kicker{color:var(--ink-500);letter-spacing:.14em;text-transform:uppercase;margin:0;font-size:.68rem;font-weight:700}.topbar h1{color:var(--ink-900);letter-spacing:-.035em;text-overflow:ellipsis;white-space:nowrap;font-variation-settings:"opsz" 144;margin:4px 0 0;font-family:Fraunces,Georgia,serif;font-size:1.9rem;font-weight:400;line-height:1.04;overflow:hidden}.icon-button{border:1px solid var(--paper-3);background:color-mix(in oklch, var(--paper-1) 82%, white);width:42px;height:42px;box-shadow:var(--shadow-card), inset 0 1px 0 #ffffffeb;cursor:pointer;color:var(--ink-700);border-radius:999px;place-items:center;font-weight:800;display:grid}.hero-card{border-radius:var(--r-xl);background:radial-gradient(120% 90% at 0% 0%, oklch(98% .018 75) 0%, transparent 55%), radial-gradient(120% 110% at 100% 100%, oklch(89% .035 55) 0%, transparent 60%), linear-gradient(160deg, var(--hero-from) 0%, var(--hero-to) 100%);min-height:246px;box-shadow:var(--shadow-hero);padding:22px}.hero-card__fold{opacity:.7;mix-blend-mode:soft-light;background:linear-gradient(118deg,#0000 48%,#ffffff6b 50%,#0000 52%);position:absolute;inset:0}.hero-card__topline{color:var(--ink-500);letter-spacing:.12em;text-transform:uppercase;justify-content:space-between;align-items:center;gap:12px;font-size:.68rem;font-weight:700;display:flex}.hero-card__active{letter-spacing:.06em;color:var(--ink-400);text-align:right;align-items:center;gap:6px;display:inline-flex}.hero-card__active span{background:var(--sage-600);border-radius:999px;width:5px;height:5px}.hero-total-row{align-items:baseline;gap:6px;margin-top:8px;display:flex}.hero-total{color:var(--ink-900);letter-spacing:-.05em;font-variant-numeric:lining-nums;font-variation-settings:"opsz" 144;margin:0;font-family:Fraunces,Georgia,serif;font-size:clamp(3.25rem,17vw,4.9rem);font-weight:400;line-height:.96}.hero-total-row>span{color:var(--ink-400);font-family:Fraunces,Georgia,serif;font-size:1.45rem}.hero-label{max-width:310px;color:var(--ink-700);margin:12px 0 18px;font-size:.91rem;line-height:1.48}.hero-card--attention .hero-label:first-letter{color:var(--coral-600)}.hero-stat-grid{border-top:1px solid var(--paper-3);grid-template-columns:1fr 1px 1fr;gap:14px;padding-top:14px;display:grid}.hero-stat span{color:var(--ink-500);letter-spacing:.12em;text-transform:uppercase;margin-bottom:5px;font-size:.66rem;font-weight:700;display:block}.hero-stat strong{color:var(--ink-900);letter-spacing:-.02em;font-family:Fraunces,Georgia,serif;font-size:1.42rem;font-weight:500}.hero-stat--coral strong{color:var(--coral-600)}.hero-stat--sage strong{color:var(--sage-600)}.hero-stat-divider{background:var(--paper-3)}.demo-date{color:var(--ink-500);margin-top:-8px;padding:0 4px;font-size:.77rem;font-weight:500}.win-banner,.completion-card{border:1px solid color-mix(in oklch, var(--sage-600) 18%, var(--paper-3));border-radius:var(--r-lg);color:var(--sage-600);background:linear-gradient(180deg, var(--sage-50), #fffcf6e6);box-shadow:var(--shadow-card);align-items:center;gap:12px;padding:14px;display:flex}.win-banner__check,.completion-card>span{color:#fff;background:var(--sage-600);border-radius:999px;flex:none;place-items:center;width:36px;height:36px;font-weight:800;display:grid}.win-banner strong,.win-banner small,.completion-card strong{display:block}.win-banner small,.completion-card p{color:var(--ink-500);margin:3px 0 0;font-size:.8rem;line-height:1.4}.confirmation-banner{margin-top:-2px}.invoice-section,.invoice-list,.invoice-form{flex-direction:column;gap:12px;display:flex}.section-heading{color:var(--ink-500);grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;display:grid}.section-heading span{background:linear-gradient(90deg, transparent, var(--paper-3), transparent);height:1px}.section-heading h2{color:var(--ink-700);letter-spacing:-.01em;margin:0;font-family:Fraunces,Georgia,serif;font-size:1.02rem;font-weight:500}.invoice-card{text-align:left;border-radius:var(--r-lg);background:var(--paper-1);width:100%;box-shadow:var(--shadow-card);cursor:pointer;color:inherit;border:0;padding:16px 18px;transition:transform .18s,box-shadow .18s;display:block;position:relative}.invoice-card:hover{transform:translateY(-1px);box-shadow:0 1px #281e190a,0 8px 18px -8px #281e1921,0 18px 42px -16px #281e1929}.invoice-card:active{transform:scale(.993)}.invoice-card__accent{border-radius:999px;width:3px;position:absolute;top:15px;bottom:15px;left:0}.invoice-card__accent--coral{background:var(--coral-600)}.invoice-card__accent--amber{background:var(--amber-600)}.invoice-card__accent--sage{background:var(--sage-600)}.invoice-card__main{align-items:flex-start;gap:12px;display:flex}.avatar,.mini-avatar{color:var(--ink-700);flex:none;place-items:center;font-weight:800;display:grid;box-shadow:inset 0 0 0 1px #ffffff80,0 10px 22px #50402b14}.avatar{border-radius:16px;width:44px;height:44px;font-size:.78rem}.avatar--large{border-radius:20px;width:58px;height:58px;font-size:1.02rem}.invoice-card__content{flex:1;min-width:0}.invoice-card__row{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.invoice-card__row--bottom{align-items:center;margin-top:12px}.invoice-card__title{color:var(--ink-900);letter-spacing:-.01em;text-overflow:ellipsis;white-space:nowrap;font-family:Fraunces,Georgia,serif;font-size:1.08rem;font-weight:500;display:block;overflow:hidden}.invoice-card__meta{color:var(--ink-500);margin-top:3px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:.68rem;display:block}.due-label{color:var(--ink-500);text-align:right;flex:none;font-size:.74rem;font-weight:600}.invoice-amount{color:var(--ink-900);letter-spacing:-.035em;flex:none;font-family:Fraunces,Georgia,serif;font-size:1.55rem;font-weight:500;line-height:1.05}.status-chip{background:var(--paper-2);color:var(--ink-500);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:5px 10px 5px 8px;font-size:.68rem;font-weight:700;line-height:1;display:inline-flex}.status-chip__dot{background:currentColor;border-radius:999px;width:5px;height:5px}.status-chip--overdue{color:var(--coral-600);background:var(--coral-50)}.status-chip--due{color:var(--amber-600);background:var(--amber-50)}.status-chip--paid{color:var(--sage-600);background:var(--sage-50)}.status-chip--sent{color:var(--ink-500);background:var(--paper-2)}.chasing-badge,.quiet-note{border-top:1px solid var(--paper-3);color:var(--ink-500);justify-content:space-between;align-items:center;gap:10px;margin-top:12px;padding:10px 12px;font-size:.76rem;font-weight:600;display:flex}.chasing-badge{color:var(--coral-600);justify-content:flex-start}.pulse-dot{background:var(--coral-600);border-radius:50%;width:7px;height:7px;animation:1.8s ease-out .35s 2 pulse-once;box-shadow:0 0 #d1513f73}.preview-card,.placeholder-panel,.control-card,.timeline-card,.detail-hero,.form-card,.new-invoice-intro{border-radius:var(--r-lg);background:var(--paper-1);box-shadow:var(--shadow-card);border:0;flex-direction:column;gap:13px;padding:18px;display:flex}.preview-card h2,.placeholder-panel h2,.control-card h2,.timeline-card h2,.form-card h2,.new-invoice-intro h2{color:var(--ink-900);letter-spacing:-.02em;margin:0;font-family:Fraunces,Georgia,serif;font-size:1.2rem;font-weight:500}.preview-card p,.placeholder-panel p,.new-invoice-intro p{color:var(--ink-700);margin:0;font-size:.9rem;line-height:1.5}.preview-card{background:linear-gradient(180deg, color-mix(in oklch, var(--paper-1) 76%, white), var(--paper-1))}.preview-card--complete{border-color:color-mix(in oklch, var(--sage-600) 20%, var(--paper-3));background:linear-gradient(180deg, var(--sage-50), var(--paper-1))}.preview-card__header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.preview-card__stamp{border:1px solid var(--paper-3);color:var(--ink-500);text-transform:uppercase;border-radius:999px;padding:5px 9px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:.64rem}.email-draft{border:1px solid var(--paper-3);border-radius:var(--r-md);background:color-mix(in oklch, white 45%, var(--paper-0));white-space:pre-line;padding:16px}.preview-meta{flex-wrap:wrap;gap:8px;display:flex}.preview-meta span,.tiny-pill,.paused-pill{color:var(--ink-500);background:var(--paper-2);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:6px 9px;font-size:.66rem;font-weight:700}.paused-pill{color:var(--amber-600);background:var(--amber-50)}.primary-cta,.secondary-button,.paid-button,.toggle-button{cursor:pointer}.primary-cta{color:var(--paper-0);background:linear-gradient(145deg, var(--ink-900), color-mix(in oklch, var(--ink-900) 82%, black));box-shadow:var(--shadow-fab);border:0;border-radius:999px;justify-content:space-between;align-items:center;gap:16px;margin-top:auto;padding:16px 18px;display:flex;position:sticky;bottom:14px}.primary-cta span{font-size:.98rem;font-weight:800}.primary-cta small{color:color-mix(in oklch, var(--paper-0) 72%, transparent);font-weight:600}.secondary-button{color:var(--ink-700);background:var(--paper-2);border:0;border-radius:16px;align-self:flex-start;padding:11px 14px;font-weight:700}.field-group{flex-direction:column;gap:8px;display:flex}.field-group label,.check-row strong{color:var(--ink-900);letter-spacing:-.01em;font-size:.92rem;font-weight:700}.text-input,.money-field input{border:1px solid var(--paper-3);background:color-mix(in oklch, white 54%, var(--paper-0));width:100%;color:var(--ink-900);border-radius:16px;outline:none;transition:border-color .16s,box-shadow .16s;box-shadow:inset 0 1px #ffffffc7}.text-input{min-height:50px;padding:0 14px;font-weight:600}.text-input:focus,.money-field:focus-within{border-color:color-mix(in oklch, var(--ink-900) 34%, var(--paper-3));box-shadow:0 0 0 4px color-mix(in oklch, var(--ink-900) 8%, transparent)}.money-field{border:1px solid var(--paper-3);border-radius:var(--r-lg);background:color-mix(in oklch, white 54%, var(--paper-0));align-items:center;gap:8px;padding:6px 14px;display:flex}.money-field span{color:var(--ink-900);font-family:Fraunces,Georgia,serif;font-size:2.25rem;font-weight:400;line-height:1}.money-field input{letter-spacing:-.055em;background:0 0;border:0;min-width:0;padding:8px 0;font-family:Fraunces,Georgia,serif;font-size:clamp(2.35rem,12vw,3.35rem);font-weight:400;line-height:1}.money-field input:focus{outline:none}.client-picker{grid-template-columns:1fr 1fr;gap:8px;display:grid}.client-picker button{border:1px solid var(--paper-3);min-width:0;color:var(--ink-500);background:var(--paper-2);cursor:pointer;text-align:left;border-radius:16px;align-items:center;gap:8px;padding:9px;font-size:.78rem;font-weight:700;display:flex}.client-picker button.is-selected{color:var(--ink-900);border-color:color-mix(in oklch, var(--ink-900) 18%, var(--paper-3));background:var(--paper-1);box-shadow:var(--shadow-card)}.client-picker button span:last-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mini-avatar{border-radius:10px;width:28px;height:28px;font-size:.68rem}.helper-copy{color:var(--ink-500);margin:-2px 0 0;font-size:.78rem;line-height:1.35}.field-error{color:var(--coral-600);margin:0;font-size:.8rem;font-weight:700;line-height:1.35}.date-row{grid-template-columns:1fr auto;align-items:center;gap:9px;display:grid}.date-distance{min-width:86px;color:var(--sage-600);background:var(--sage-50);text-align:center;border-radius:16px;padding:11px 10px;font-size:.76rem;font-weight:800}.gate-card{gap:12px}.check-row{cursor:pointer;align-items:center;gap:12px;display:flex}.check-row input{width:22px;height:22px;accent-color:var(--ink-900)}.check-row span{flex-direction:column;gap:2px;display:flex}.check-row small{color:var(--ink-500);font-size:.8rem;font-weight:600}.deliverable-field{padding-top:2px}.create-cta{width:100%}.detail-hero{background:linear-gradient(160deg, var(--hero-from), var(--paper-1));gap:16px}.detail-hero__paper-fold{pointer-events:none;mix-blend-mode:soft-light;background:linear-gradient(122deg,#0000 43%,#ffffff6b 45%,#0000 47%);position:absolute;inset:0}.detail-hero--overdue{background:linear-gradient(160deg, var(--coral-50), var(--paper-1))}.detail-hero--paid{background:linear-gradient(160deg, var(--sage-50), var(--paper-1))}.client-line{align-items:center;gap:13px;display:flex}.client-line p{color:var(--ink-500);margin:0 0 4px;font-size:.82rem;font-weight:600}.client-line h2{color:var(--ink-900);letter-spacing:-.03em;margin:0;font-family:Fraunces,Georgia,serif;font-size:1.38rem;font-weight:500}.detail-hero__amount-row{border-top:1px solid var(--paper-3);border-bottom:1px solid var(--paper-3);justify-content:space-between;align-items:flex-end;gap:14px;padding:14px 0;display:flex}.detail-hero__amount-row strong{color:var(--ink-900);letter-spacing:-.045em;margin-top:4px;font-family:Fraunces,Georgia,serif;font-size:2.45rem;font-weight:400;line-height:.95;display:block}.detail-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.detail-stat{background:color-mix(in oklch, white 40%, var(--paper-0));border-radius:16px;min-width:0;padding:12px}.detail-stat span{color:var(--ink-500);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;font-size:.66rem;font-weight:700;display:block}.detail-stat strong{color:var(--ink-900);text-overflow:ellipsis;white-space:nowrap;font-size:.88rem;font-weight:700;display:block;overflow:hidden}.section-title-row{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.segmented-picker{background:var(--paper-2);border-radius:18px;grid-template-columns:repeat(3,1fr);gap:5px;padding:5px;display:grid}.segmented-picker button{color:var(--ink-500);cursor:pointer;background:0 0;border:0;border-radius:14px;padding:10px 6px;font-size:.78rem;font-weight:700}.segmented-picker button.is-selected{color:var(--paper-0);background:var(--ink-900);box-shadow:0 10px 21px #232a3e29}.timeline-list{flex-direction:column;gap:6px;display:flex;position:relative}.timeline-list:before{content:"";background:var(--paper-3);width:1px;position:absolute;top:16px;bottom:16px;left:72px}.timeline-item{z-index:1;width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:16px;grid-template-columns:54px 28px 1fr auto;align-items:center;gap:10px;padding:9px 10px;display:grid;position:relative}.timeline-item--selected{border-color:var(--paper-3);background:color-mix(in oklch, white 42%, var(--paper-0));box-shadow:var(--shadow-card)}.timeline-date{color:var(--ink-500);font-family:JetBrains Mono,ui-monospace,monospace;font-size:.68rem;font-weight:500}.timeline-node{background:var(--paper-1);border:1px solid var(--paper-3);width:28px;height:28px;color:var(--ink-400);border-radius:999px;place-items:center;font-size:.8rem;font-weight:800;display:grid}.timeline-item--sent .timeline-node{color:#fff;background:var(--sage-600);border-color:var(--sage-600)}.timeline-item--now .timeline-node{color:#fff;background:var(--amber-600);border-color:var(--amber-600)}.timeline-item--skipped .timeline-node{color:var(--ink-500);background:var(--paper-2)}.timeline-copy strong{color:var(--ink-900);font-size:.86rem;display:block}.timeline-copy small{color:var(--ink-500);margin-top:2px;font-size:.71rem;font-weight:600;display:block}.timeline-action{color:var(--ink-500);letter-spacing:.06em;text-transform:uppercase;font-size:.69rem;font-weight:700}.quick-actions{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:8px;display:grid}.toggle-button,.paid-button{min-height:58px;color:var(--paper-0);background:var(--ink-900);text-align:left;border:0;border-radius:18px;padding:12px;font-weight:800;box-shadow:0 13px 27px #232a3e24}.toggle-button.is-on{color:var(--amber-600);background:var(--amber-50);box-shadow:none}.toggle-button span,.toggle-button small{display:block}.toggle-button small{opacity:.72;margin-top:3px;font-size:.72rem}.paid-button{background:var(--sage-600);text-align:center}.muted-action{background:var(--paper-2);align-self:stretch;width:100%}@keyframes pulse-once{0%{box-shadow:0 0 #d1513f73}to{box-shadow:0 0 0 12px #d1513f00}}@media (width<=360px){.phone-surface{border-radius:26px;padding:14px}.hero-card{min-height:226px;padding:20px}.invoice-card__main{align-items:flex-start}.invoice-card__row{flex-direction:column;align-items:flex-start;gap:6px}.invoice-card__row--bottom{flex-direction:row;align-items:center}.detail-stat-grid,.quick-actions,.client-picker,.date-row{grid-template-columns:1fr}.timeline-item{grid-template-columns:48px 28px 1fr}.timeline-action{display:none}.timeline-list:before{left:66px}}
