@import "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600&family=DM+Sans:wght@400;500;600&display=swap";:root{--bg:#f7f3ee;--surface:#fff;--surface-muted:#faf8f5;--border:#e8dfd4;--text:#2c2419;--text-muted:#7a6f63;--accent:#b8860b;--accent-soft:#f5ead6;--accent-dark:#8b6914;--danger:#b54a4a;--shadow:0 8px 30px #2c24190f;--radius:14px;--font-body:"DM Sans", system-ui, sans-serif;--font-display:"Cormorant Garamond", Georgia, serif}*{box-sizing:border-box}body{min-height:100dvh;font-family:var(--font-body);color:var(--text);background:radial-gradient(circle at top left, #fff8ef 0%, transparent 40%), var(--bg);-webkit-text-size-adjust:100%;margin:0;overflow-x:hidden}button,input{font:inherit;touch-action:manipulation}.app-nav-mobile{display:none}.app{min-height:100vh}.header-actions{align-items:center;gap:.75rem;display:flex}.app-nav-desktop{display:flex}.sync-pill{border:1px solid var(--border);background:var(--surface-muted);color:var(--text-muted);border-radius:999px;padding:.35rem .7rem;font-size:.78rem;font-weight:600}.sync-pill.sync-synced{color:#2f6b3b;background:#e8f5eb;border-color:#b8dfc2}.sync-pill.sync-error{color:var(--danger);background:#fdeaea;border-color:#efcaca}.app-loading{background:var(--bg);place-items:center;min-height:100vh;display:grid}.app-loading-card{border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);flex-direction:column;align-items:center;gap:.75rem;padding:2rem;display:flex}.settings-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1rem;padding:1.1rem}.settings-section h3{font-family:var(--font-display);margin:0 0 .5rem;font-size:1.35rem}.secret-row{grid-template-columns:1fr auto;gap:.65rem;display:grid}.sync-status{background:var(--surface-muted);border:1px solid var(--border);border-radius:10px;flex-direction:column;gap:.25rem;margin-top:.85rem;padding:.75rem .85rem;font-size:.88rem;display:flex}.sync-status.sync-synced{background:#e8f5eb;border-color:#b8dfc2}.sync-status.sync-error{background:#fdeaea;border-color:#efcaca}.app-header{border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;background:#ffffffd9;justify-content:space-between;align-items:center;gap:2rem;padding:1.25rem 2rem;display:flex;position:sticky;top:0}.brand{align-items:center;gap:1rem;display:flex}.brand-mark{background:var(--accent-soft);width:48px;height:48px;color:var(--accent-dark);font-family:var(--font-display);text-transform:lowercase;border-radius:50%;place-items:center;font-size:1.1rem;font-weight:600;display:grid}.brand h1{font-family:var(--font-display);margin:0;font-size:1.75rem;font-weight:600;line-height:1.1}.brand p{color:var(--text-muted);margin:.15rem 0 0;font-size:.85rem}.app-nav{background:var(--surface-muted);border:1px solid var(--border);border-radius:999px;gap:.5rem;padding:.35rem;display:flex}.app-nav button{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:999px;padding:.55rem 1.1rem;transition:all .2s}.app-nav button.active,.app-nav button:hover{background:var(--surface);color:var(--text);box-shadow:0 2px 8px #2c24190f}.app-content{padding:1.5rem 2rem 2rem}.page{max-width:960px}.page-header h2,.pricing-header h2{font-family:var(--font-display);margin:0;font-size:2rem}.page-header p{color:var(--text-muted);margin:.35rem 0 0}.btn-primary,.btn-secondary,.btn-text,.btn-icon{cursor:pointer;border:none;transition:all .2s}.btn-primary{background:var(--accent);color:#fff;border-radius:10px;padding:.65rem 1.2rem;font-weight:600}.btn-primary:hover:not(:disabled){background:var(--accent-dark)}.btn-primary:disabled{opacity:.45;cursor:not-allowed}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:.65rem 1.2rem}.btn-secondary:hover:not(:disabled){background:var(--surface-muted)}.btn-secondary:disabled{opacity:.45;cursor:not-allowed}.btn-sm{padding:.45rem .85rem;font-size:.9rem}.btn-text{color:var(--accent-dark);background:0 0;padding:.35rem 0;font-weight:500}.btn-icon{background:var(--surface-muted);width:44px;min-width:44px;height:44px;min-height:44px;color:var(--text-muted);border-radius:8px;font-size:1.25rem;line-height:1}.btn-icon:hover{color:var(--danger);background:#f0e4d8}.form-group{flex-direction:column;gap:.4rem;display:flex}.form-group label{color:var(--text-muted);font-size:.85rem;font-weight:500}.form-group input,.cost-line input,.expense-row input{border:1px solid var(--border);background:var(--surface);width:100%;color:var(--text);border-radius:10px;padding:.65rem .8rem}.form-group input:focus,.cost-line input:focus,.expense-row input:focus{outline:2px solid var(--accent-soft);border-color:var(--accent)}.form-row{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.pricing-page{grid-template-columns:280px 1fr;gap:1.5rem;min-height:calc(100vh - 120px);display:grid}.product-sidebar{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);align-self:start;padding:1rem;position:sticky;top:96px}.sidebar-header{justify-content:space-between;align-items:center;margin-bottom:.75rem;display:flex}.sidebar-header h2{font-family:var(--font-display);margin:0;font-size:1.4rem}.product-list{flex-direction:column;gap:.35rem;margin:0;padding:0;list-style:none;display:flex}.product-list-row{align-items:stretch;gap:.35rem;display:flex}.product-list-row .product-list-item{flex:1;min-width:0}.product-delete-btn{flex-shrink:0;align-self:center}.btn-danger:hover{color:var(--danger);background:#fdeaea;border-color:#efcaca}.btn-secondary.btn-danger{color:var(--danger)}.product-list-item{cursor:pointer;text-align:left;background:0 0;border:1px solid #0000;border-radius:10px;flex-direction:column;align-items:flex-start;gap:.15rem;width:100%;padding:.75rem .85rem;display:flex}.product-list-item:hover,.product-list-item.active{background:var(--accent-soft);border-color:#ead9bc}.product-name{font-weight:600}.product-price{color:var(--text-muted);font-size:.85rem}.pricing-main{flex-direction:column;gap:1rem;display:flex}.pricing-header{justify-content:space-between;align-items:center;gap:1rem;display:flex}.pricing-actions{gap:.75rem;display:flex}.unsaved-badge{color:#9a6b00;vertical-align:middle;background:#fff0d6;border-radius:999px;margin-left:.75rem;padding:.2rem .55rem;font-size:.75rem;font-weight:600;display:inline-block}.pricing-layout{grid-template-columns:1.1fr .9fr;gap:1rem;display:grid}.product-form,.breakdown-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.25rem}.product-form{flex-direction:column;gap:1.25rem;display:flex}.cost-lines-header,.expense-section-header{justify-content:space-between;align-items:center;margin-bottom:.65rem;display:flex}.cost-lines h4,.labor-inputs h4,.breakdown-panel h4{margin:0;font-size:.95rem;font-weight:600}.cost-lines-total,.expense-section-header span{color:var(--text-muted);font-size:.9rem}.cost-line,.expense-row{align-items:center;gap:.5rem;margin-bottom:.5rem;display:grid}.cost-line{grid-template-columns:1fr minmax(88px,110px) 44px}.expense-row{grid-template-columns:1fr minmax(88px,120px) auto 44px}.expense-currency{color:var(--text-muted);font-size:.85rem}.breakdown-panel h3{font-family:var(--font-display);margin:0 0 1rem;font-size:1.5rem}.breakdown-panel section{border-bottom:1px solid var(--border);padding:.85rem 0}.breakdown-panel section:last-child{border-bottom:none}.breakdown-row{justify-content:space-between;gap:1rem;padding:.3rem 0;font-size:.92rem;display:flex}.breakdown-row.indent{color:var(--text-muted);padding-left:.75rem}.breakdown-row.muted{color:var(--text-muted);font-size:.88rem}.breakdown-row.bold{color:var(--text);font-weight:600}.breakdown-row.highlight{background:var(--accent-soft);border-radius:10px;margin-top:.35rem;padding:.65rem .75rem;font-size:1rem}.summary-section{background:var(--surface-muted);border-radius:0 0 var(--radius) var(--radius);margin:0 -1.25rem -1.25rem;padding:1rem 1.25rem 1.25rem!important}.definitions{border-top:1px solid var(--border);flex-direction:column;gap:.65rem;margin-top:1rem;padding-top:1rem;display:flex}.definition-box{background:var(--surface);border:1px solid var(--border);color:var(--text-muted);border-radius:10px;padding:.75rem .85rem;font-size:.85rem;line-height:1.45}.definition-box strong{color:var(--text);margin-bottom:.25rem;font-size:.88rem;display:block}.definition-box p{margin:0}.markup-section{background:var(--surface-muted);border:1px solid var(--border);border-radius:12px;padding:1rem}.markup-header{justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:.75rem;display:flex}.markup-header h4{margin:0 0 .25rem;font-size:.95rem;font-weight:600}.field-hint{color:var(--text-muted);margin:0;font-size:.8rem;line-height:1.4}.markup-value span{background:var(--accent-soft);color:var(--accent-dark);border-radius:999px;padding:.35rem .7rem;font-size:.95rem;font-weight:600;display:inline-block}.markup-presets{flex-wrap:wrap;gap:.45rem;margin-bottom:.85rem;display:flex}.markup-preset{border:1px solid var(--border);background:var(--surface);color:var(--text-muted);cursor:pointer;border-radius:999px;padding:.45rem .75rem;font-size:.88rem;font-weight:500}.markup-preset:hover,.markup-preset.active{background:var(--accent-soft);color:var(--accent-dark);border-color:#ead9bc}.markup-custom{margin-bottom:.5rem}.input-prefix{align-items:center;gap:.35rem;display:flex}.input-prefix span{color:var(--text-muted);font-weight:600}.markup-summary{border-top:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:.45rem .75rem;padding-top:.65rem;font-size:.88rem;display:flex}.markup-summary strong{color:var(--accent-dark)}.markup-summary-extra{color:var(--text-muted);font-size:.82rem}.final-price-banner{border-radius:var(--radius);background:linear-gradient(135deg,#fff8ef,#f5ead6);border:1px solid #ead9bc;justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.final-price-banner span{color:var(--text-muted)}.final-price-banner strong{font-family:var(--font-display);color:var(--accent-dark);font-size:2rem}.mobile-save-bar{display:none}.empty-state{background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius);min-height:320px;color:var(--text-muted);place-items:center;gap:1rem;display:grid}.percentages-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.1rem 1.25rem}.percentages-panel-header{margin-bottom:.85rem}.percentages-panel-header h3{font-family:var(--font-display);margin:0;font-size:1.35rem}.percentages-panel-header .field-hint{margin:.35rem 0 0}.percentages-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:.75rem 1rem;display:grid}.percentages-panel-compact{padding:.85rem 1rem}.percentages-panel-compact .percentages-panel-header{margin-bottom:.65rem}.percentages-panel-compact .percentages-panel-header h3{font-size:1.05rem;font-family:var(--font-body);font-weight:600}.percentage-field label{font-size:.78rem}.percentage-field .input-suffix input{min-height:40px;padding:.55rem .65rem}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.5rem;display:grid}.input-suffix{align-items:center;gap:.5rem;display:flex}.input-suffix span{color:var(--text-muted)}.settings-note{border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);color:var(--text-muted);margin:1.5rem 0;padding:1rem 1.1rem;font-size:.92rem}.settings-note p{margin:.35rem 0}.settings-page .btn-secondary{margin-top:.5rem}.expense-summary-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:1.5rem 0;display:grid}.summary-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1rem 1.1rem}.summary-card.highlight{background:var(--accent-soft);border-color:#ead9bc}.summary-label{color:var(--text-muted);margin-bottom:.35rem;font-size:.85rem;display:block}.summary-value{font-family:var(--font-display);font-size:1.6rem;font-weight:600}.expense-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1rem;padding:1.1rem}.expense-section h3{font-family:var(--font-display);margin:0;font-size:1.35rem}@media (width<=1100px){.pricing-page{grid-template-columns:1fr}.product-sidebar{position:static}.pricing-layout,.settings-grid,.expense-summary-cards{grid-template-columns:1fr}.percentages-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=768px){:root{--radius:12px}.app-header{padding:.85rem 1rem;padding-top:max(.85rem, env(safe-area-inset-top));flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.65rem}.brand{flex:1;gap:.65rem;min-width:0}.brand-mark{flex-shrink:0;width:40px;height:40px;font-size:1rem}.brand h1{font-size:1.25rem}.brand p{font-size:.75rem}.brand-text{min-width:0}.app-nav-desktop{display:none}.app-nav-mobile{z-index:20;padding:.35rem .5rem;padding-bottom:max(.35rem, env(safe-area-inset-bottom));border-top:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffffff5;grid-template-columns:repeat(3,1fr);display:grid;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 20px #2c24190f}.app-nav-mobile button{color:var(--text-muted);background:0 0;border:none;border-radius:10px;min-height:44px;padding:.65rem .35rem;font-size:.82rem;font-weight:600}.app-nav-mobile button.active{background:var(--accent-soft);color:var(--accent-dark)}.app-content{padding:1rem .85rem 5.5rem;padding-bottom:calc(5.5rem + env(safe-area-inset-bottom))}.page-header h2,.pricing-header h2{font-size:1.55rem}.page{max-width:none}.form-group input,.cost-line input,.expense-row input,.secret-row input{min-height:44px;padding:.75rem .85rem;font-size:16px}.btn-primary,.btn-secondary{min-height:44px;padding:.75rem 1rem}.markup-preset{min-height:40px;padding:.5rem .85rem}.product-sidebar{border-radius:12px;padding:.85rem}.product-list{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-direction:row;gap:.5rem;padding-bottom:.25rem;overflow-x:auto}.product-list::-webkit-scrollbar{display:none}.product-list-row{scroll-snap-align:start;flex:none;min-width:148px;padding-right:2.5rem;position:relative}.product-list-item{min-height:64px;padding:.7rem .8rem}.product-delete-btn{position:absolute;top:50%;right:0;transform:translateY(-50%)}.pricing-main{padding-bottom:3.75rem}.pricing-header .pricing-actions{display:none}.pricing-header{flex-direction:column;align-items:stretch;gap:.35rem}.unsaved-badge{margin-top:.35rem;margin-left:0}.pricing-layout{gap:.85rem}.product-form,.breakdown-panel,.settings-section,.expense-section,.summary-card{padding:1rem}.breakdown-row{gap:.65rem;font-size:.88rem}.breakdown-row span:first-child{flex:1;min-width:0;padding-right:.25rem}.breakdown-row span:last-child{white-space:nowrap;flex-shrink:0}.breakdown-row.highlight{font-size:.95rem}.summary-section{margin:0 -1rem -1rem;padding:.85rem 1rem 1rem!important}.definition-box{font-size:.82rem}.final-price-banner{flex-direction:column;align-items:flex-start;gap:.35rem;padding:.9rem 1rem}.final-price-banner strong{font-size:1.65rem}.mobile-save-bar{left:.85rem;right:.85rem;bottom:calc(4.25rem + env(safe-area-inset-bottom));z-index:15;border:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff7;border-radius:12px;justify-content:space-between;align-items:center;gap:.75rem;padding:.65rem .75rem;display:flex;position:fixed;box-shadow:0 8px 24px #2c24191f}.mobile-save-bar.is-saved{opacity:.95}.mobile-save-bar.is-unsaved{background:linear-gradient(135deg,#fffaf2,#fff);border-color:#ead9bc}.mobile-save-label{color:var(--text-muted);min-width:0;font-size:.82rem;font-weight:600}.mobile-save-bar.is-unsaved .mobile-save-label{color:#9a6b00}.mobile-save-actions{flex-shrink:0;gap:.45rem;display:flex}.secret-row{grid-template-columns:1fr}.secret-row .btn-primary{width:100%}.expense-row{grid-template-columns:1fr minmax(88px,120px) 44px}.expense-currency{display:none}.expense-summary-cards{gap:.75rem}.summary-value{font-size:1.35rem}.markup-header{flex-direction:column;align-items:stretch}.markup-value{align-self:flex-start}.percentages-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.percentage-field .input-suffix input{min-height:44px;font-size:16px}}@media (width<=480px){.form-row{grid-template-columns:1fr}.cost-line{grid-template-columns:1fr 44px;grid-template-areas:"name delete""cost cost"}.cost-line input:first-of-type{grid-area:name}.cost-line input:nth-of-type(2){grid-area:cost}.cost-line .btn-icon{grid-area:delete}.settings-grid{grid-template-columns:1fr}.percentages-grid{grid-template-columns:1fr 1fr}}