:root{--ink:#292c32;--paper:#fff;--line:#d9dfe3;--accent:#3f86b0;--accent-strong:#2d6d93;--accent-border:#c7dcea;--accent-tint:#eef5fa;--accent-tint-hover:#e0eef7;--btn-text:#3c4a52;--danger:#a8503f;--danger-strong:#c0392b;--danger-tint:#fbe9e5;--bg:#edf1f3;--surface:#fff;--surface-2:#f9fafb;--surface-3:#fff;--muted:#707880;--faint:#8a9298;--input-border:#d7dde1;--grad-a:#3d80a5;--grad-b:#2d6d93;--login-grad-a:#eef4f7;--login-grad-b:#dde8ee;--bar-bg:#ffffffe6;--shadow:0 18px 60px #28333a1b;--card-shadow:0 22px 60px #28333a26;color-scheme:light}html[data-theme="dark"]{--ink:#e8edf1;--line:#2b3540;--accent:#7db6d9;--accent-strong:#5f9fc7;--accent-border:#35566c;--accent-tint:#22333f;--accent-tint-hover:#2a3f4f;--btn-text:#c7d3dc;--danger:#e0897b;--danger-strong:#f08a76;--danger-tint:#3a2622;--bg:#10161c;--surface:#1a222b;--surface-2:#202a34;--surface-3:#151d25;--muted:#9aa8b3;--faint:#7f8d98;--input-border:#35424e;--grad-a:#4f97c2;--grad-b:#3a82ad;--login-grad-a:#131a21;--login-grad-b:#0e141a;--bar-bg:#1a222be8;--shadow:0 18px 60px #00000066;--card-shadow:0 22px 60px #00000080;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Myriad Pro",Myriad,"Segoe UI",Arial,sans-serif;font-weight:400}button,input{font:inherit}.app-shell{min-height:100vh;display:grid;grid-template-columns:minmax(360px,490px) 1fr}.editor-panel{height:100vh;overflow-y:auto;padding:34px 36px 40px;background:var(--surface);border-right:1px solid var(--line)}.editor-heading{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding-bottom:26px;border-bottom:1px solid var(--line)}.eyebrow{margin:0 0 7px;color:var(--accent);font-size:11px;font-weight:700;letter-spacing:.18em}.editor-heading h1{margin:0;font-size:30px;letter-spacing:-.035em}.editor-heading p:last-child{max-width:340px;margin:8px 0 0;color:var(--muted);font-size:13px;line-height:1.55}.btn-icon{color:var(--accent);font-weight:700}.icon-button,.secondary-button{border:1px solid var(--accent-border);background:var(--surface-3);color:var(--btn-text);border-radius:7px;cursor:pointer;transition:background .15s,border-color .15s,color .15s,box-shadow .15s}.icon-button{width:38px;height:38px;font-size:22px;color:var(--accent)}.secondary-button{padding:7px 11px}.icon-button:hover,.secondary-button:hover{border-color:var(--accent);background:var(--accent-tint-hover);box-shadow:0 2px 10px #2d6d9324}.icon-button:active,.secondary-button:active{background:var(--accent-tint);box-shadow:none;transform:translateY(1px)}.icon-button:focus-visible,.secondary-button:focus-visible,.remove-button:focus-visible,.download-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.remove-button{height:30px;border:0;border-radius:7px;color:var(--danger);background:transparent;font-size:20px;cursor:pointer;transition:background .15s,color .15s}.remove-button:hover:not(:disabled){background:var(--danger-tint);color:var(--danger-strong)}.remove-button:disabled{opacity:.35;cursor:not-allowed}.form-section{padding:25px 0;border-bottom:1px solid var(--line)}.form-section h2{margin:0 0 16px;font-size:13px}label{display:block;margin-top:13px;color:var(--muted);font-size:11px;font-weight:700}input{width:100%;height:41px;margin-top:7px;padding:0 11px;border:1px solid var(--input-border);border-radius:7px;color:var(--ink);background:var(--surface-3);outline:none}input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #8bb3cb27}.section-title-row{display:flex;align-items:center;justify-content:space-between}.section-title-row h2{margin:0}.item-editor-list{display:grid;gap:12px;margin-top:16px}.item-editor{display:grid;grid-template-columns:26px minmax(110px,1.5fr) minmax(82px,.9fr) .48fr .75fr 28px;gap:8px;align-items:end;padding:12px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2)}.item-editor label{margin:0}.item-editor input{height:36px;background:var(--surface-3)}.item-number{align-self:center;color:var(--faint);font-size:10px;font-weight:700}.compact-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.compact-grid h2,.compact-grid .full{grid-column:1/-1}.download-button{width:100%;height:48px;margin-top:25px;border:0;border-radius:8px;background:linear-gradient(100deg,var(--grad-a),var(--grad-b));color:#fff;font-weight:700;cursor:pointer;box-shadow:0 4px 14px #2d6d9326;transition:box-shadow .15s,transform .1s,filter .15s}.download-button:hover{filter:brightness(.92);box-shadow:0 10px 24px #2d6d9340}.download-button:active{transform:translateY(1px);box-shadow:0 3px 10px #2d6d9326}.download-button .btn-icon{color:#fff}.print-note{margin:10px 0 0;color:var(--faint);text-align:center;font-size:11px}.preview-stage{min-width:0;overflow:auto;padding:24px 40px 56px;scrollbar-gutter:stable;background:#edf1f3;color:#292c32;--ink:#292c32;--paper:#fff;--faint:#7f8a91;--shadow:0 18px 60px #28333a1b}.preview-label{width:min(100%,750px);display:flex;justify-content:space-between;gap:12px;margin:0 auto 14px;color:var(--faint);font-size:10px;font-weight:700;letter-spacing:.16em}.preview-fit{width:750px;height:1052px;margin:0 auto}.invoice-paper{position:relative;width:750px;height:1052px;margin:0 auto;overflow:hidden;background:var(--paper) url("invoice-background.png") center/100% 100% no-repeat;box-shadow:var(--shadow);padding:9.8% 7.25% 0;transform-origin:top left}.invoice-header{display:grid;grid-template-columns:.85fr 1.3fr;align-items:end}.recipient{display:flex;flex-direction:column;padding-left:2%;padding-bottom:3.6%}.recipient>span:first-child{font-size:17px}.recipient strong{margin-top:4px;font-size:48px;font-weight:700;line-height:1;letter-spacing:-.03em}.recipient>span:last-child{margin-top:7px;font-size:17px}.invoice-title{text-align:right}.invoice-title h2{margin:0;font-size:101px;font-weight:700;line-height:.9;letter-spacing:-.055em}.invoice-title time{display:block;margin-top:26px;font-size:17px}.invoice-table-wrap{height:282px;overflow:hidden}.invoice-table{width:100%;table-layout:fixed;margin-top:21px;border-collapse:collapse;font-size:15px}.invoice-table th{height:54px;background:#231f20;color:#fff;font-size:18px;font-weight:400;text-align:center}.invoice-table th:first-child{width:50%;border-radius:15px 0 0 15px}.invoice-table th:last-child{border-radius:0 15px 15px 0}.invoice-table.has-duration th:first-child{width:42%}.invoice-table.has-duration th:nth-child(2){width:20%}.invoice-table td{padding:2px 8px;text-align:center;white-space:normal}.invoice-table tbody tr{height:203px}.totals-area{display:grid;grid-template-columns:1fr 1.03fr;gap:39px;align-items:center}.breakdown{margin:0;padding:25px 0;border-top:1px solid #34363a;border-bottom:1px solid #34363a}.breakdown div{display:grid;grid-template-columns:minmax(0,1fr) 14px minmax(60px,auto);align-items:baseline;gap:6px;margin:13px 0;font-size:17px}.breakdown div>span{text-align:center}.breakdown dd{margin:0;text-align:right}.grand-total{height:129px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:15px;background:linear-gradient(100deg,#91b8cf,#75a5c1);color:#fff}.grand-total span{font-size:22px}.grand-total strong{font-size:62px;font-weight:700;line-height:1}.invoice-notes{display:grid;grid-template-columns:.9fr 1.1fr;gap:61px;margin:6.5% 4.4% 0}.invoice-notes h3{margin:0 0 26px;font-size:23px;font-weight:700}.invoice-notes p{margin:0;font-size:15px;line-height:1.65}.invoice-footer{position:absolute;left:7.25%;right:7.25%;bottom:6.5%;display:flex;justify-content:flex-end;padding-top:18px;border-top:1px solid #5f6265;text-align:right}.invoice-footer>div{display:flex;flex-direction:column;align-items:flex-end}.invoice-footer strong{font-size:31px;font-weight:700}.invoice-footer span{margin-top:5px;font-size:14px}.item-count-2 tbody tr{height:101px}.item-count-3 tbody tr{height:67px}.item-count-4 tbody tr{height:50px}.item-count-5,.item-count-6,.item-count-7,.item-count-8,.item-count-9,.item-count-10{padding-top:6.5%}.item-count-5 .invoice-table-wrap,.item-count-6 .invoice-table-wrap,.item-count-7 .invoice-table-wrap,.item-count-8 .invoice-table-wrap,.item-count-9 .invoice-table-wrap,.item-count-10 .invoice-table-wrap{height:355px}.item-count-5 tbody tr{height:54px}.item-count-6 tbody tr{height:45px}.item-count-7 tbody tr{height:38px}.item-count-8 tbody tr{height:34px}.item-count-9 tbody tr{height:30px}.item-count-10 tbody tr{height:27px}.item-count-6 .invoice-table,.item-count-7 .invoice-table,.item-count-8 .invoice-table,.item-count-9 .invoice-table,.item-count-10 .invoice-table{font-size:11px}.item-count-5 .invoice-notes,.item-count-6 .invoice-notes,.item-count-7 .invoice-notes,.item-count-8 .invoice-notes,.item-count-9 .invoice-notes,.item-count-10 .invoice-notes{margin-top:2.5%}.item-count-5 .breakdown,.item-count-6 .breakdown,.item-count-7 .breakdown,.item-count-8 .breakdown,.item-count-9 .breakdown,.item-count-10 .breakdown{padding-block:17px}.item-count-5 .breakdown div,.item-count-6 .breakdown div,.item-count-7 .breakdown div,.item-count-8 .breakdown div,.item-count-9 .breakdown div,.item-count-10 .breakdown div{margin-block:9px}.item-count-5 .grand-total,.item-count-6 .grand-total,.item-count-7 .grand-total,.item-count-8 .grand-total,.item-count-9 .grand-total,.item-count-10 .grand-total{height:112px}.item-count-5 .totals-area,.item-count-6 .totals-area,.item-count-7 .totals-area,.item-count-8 .totals-area,.item-count-9 .totals-area,.item-count-10 .totals-area{margin-top:14px}@media(max-width:1000px){.app-shell{grid-template-columns:1fr}.editor-panel{height:auto;overflow:visible}.preview-stage{padding:28px 20px 60px}}@media(max-width:560px){.editor-panel{padding:26px 20px 34px}.item-editor{grid-template-columns:24px 1fr 1fr 28px}.item-editor .wide,.item-editor .duration-field{grid-column:2/-1}.invoice-paper{min-height:0}.invoice-notes{margin-top:7%}}@page{size:A4;margin:0}@media print{:root{--ink:#292c32;--paper:#fff;color-scheme:light}body{background:#fff}.print-hidden{display:none!important}.app-shell,.preview-stage{display:block;min-height:0;padding:0;overflow:visible;background:#fff}.preview-fit{width:auto!important;height:auto!important}.invoice-paper{width:210mm;height:297mm;min-height:0;aspect-ratio:auto;margin:0;transform:none!important;box-shadow:none;print-color-adjust:exact;-webkit-print-color-adjust:exact}}
[hidden]{display:none!important}
.auth-locked .app-shell,.auth-locked .user-bar{visibility:hidden}
.login-screen{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(160deg,var(--login-grad-a),var(--login-grad-b))}
.login-card{position:relative;width:min(100%,400px);padding:40px 38px;border-radius:18px;background:var(--surface);box-shadow:var(--card-shadow);text-align:center}
.login-card .eyebrow{margin-bottom:8px}
.login-card h1{margin:0;font-size:30px;letter-spacing:-.035em}
.login-sub{margin:12px 0 26px;color:var(--muted);font-size:13px;line-height:1.55}
.google-button{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;height:48px;border:1px solid #d7dde1;border-radius:8px;background:#fff;color:#3c4043;font-weight:700;cursor:pointer;transition:background .15s,box-shadow .15s}
.google-button:hover:not(:disabled){background:#f6f8f9;box-shadow:0 2px 8px #28333a1f}
.google-button:disabled{opacity:.65;cursor:progress}
.google-button svg{width:19px;height:19px}
.google-button.is-loading svg{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.login-error{min-height:16px;margin:14px 0 0;color:var(--danger-strong);font-size:12px;line-height:1.5}
.login-note{margin:10px 0 0;color:var(--faint);font-size:12px}
.user-bar{position:fixed;top:16px;right:20px;z-index:40;display:flex;align-items:center;gap:10px;padding:7px 8px 7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--bar-bg);backdrop-filter:blur(6px);box-shadow:0 6px 18px #28333a1a}
.user-chip{display:flex;align-items:center;gap:8px;max-width:230px;color:var(--btn-text);font-size:12px;font-weight:700}
.user-chip>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:#4caf7d}
.user-bar .secondary-button{padding:6px 12px;border-radius:999px}
@media print{.login-screen,.user-bar{display:none!important}}
@media(max-width:560px){.user-bar{top:10px;right:10px;padding-left:10px}.user-chip{max-width:120px;font-size:11px}}.heading-actions{display:flex;gap:8px}.login-theme-toggle{position:absolute;top:14px;right:14px;width:34px;height:34px;font-size:16px}body,.editor-panel,.login-card,.item-editor,input,.user-bar{transition:background-color .25s ease,color .25s ease,border-color .25s ease}.preview-stage,.preview-stage *{transition:none}
