:root { --ink:#11203e; --muted:#62718d; --line:#dce4ef; --blue:#2e5fed; --blue-dark:#2049bd; --surface:#ffffff; --ground:#f4f7fb; --green:#157a51; --yellow:#9a6500; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--ink); background:var(--ground); }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:linear-gradient(135deg,#f6f9ff 0%,#eef3fb 100%); }
button,input,textarea { font:inherit; } button { cursor:pointer; } [hidden] { display:none !important; }
.app-shell { min-height:100vh; }.brand { color:var(--ink); text-decoration:none; font-size:1.45rem; font-weight:800; letter-spacing:0; }.brand span { color:var(--blue); }
.auth-view { min-height:100vh; display:grid; grid-template-columns:minmax(260px,1fr) minmax(360px,510px); align-items:center; gap:clamp(40px,9vw,160px); padding:clamp(28px,8vw,130px); background:radial-gradient(circle at 12% 12%,#dbe6ff 0,transparent 32%),linear-gradient(135deg,#f9fbff 20%,#eaf1fb); }.auth-view>.brand { align-self:start; }
.auth-card,.form-section,.archive-table-wrap,.audit-section { background:rgba(255,255,255,.91); border:1px solid rgba(196,210,230,.8); box-shadow:0 18px 54px rgba(43,71,120,.09); border-radius:12px; }.auth-card { padding:42px; }.auth-card h1,.page-intro h1 { font-size:clamp(1.8rem,3vw,2.65rem); line-height:1.06; margin:8px 0 16px; letter-spacing:0; }.auth-card>p,.page-intro p { color:var(--muted); line-height:1.6; }
.eyebrow { margin:0; color:var(--blue); font-size:.76rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }.stack-form { display:grid; gap:16px; margin-top:28px; }.auth-switch,.auth-footer { display:flex; align-items:center; gap:7px; margin-top:20px; color:var(--muted); font-size:.9rem; }.auth-footer { border-top:1px solid #e0e8f3; padding-top:18px; }.auth-footer a,.legal-link,.text-button { color:#244dcc; font-weight:800; text-decoration:none; }.text-button { border:0; padding:0; background:transparent; }.legal-link { font-size:.85rem; }
.consent-field { grid-template-columns:20px 1fr; align-items:start; gap:10px; color:#53647e; font-size:.82rem; font-weight:500; line-height:1.5; }.consent-field input { width:18px; height:18px; margin:2px 0 0; accent-color:var(--blue); }.consent-field a { color:#244dcc; font-weight:800; }
label { display:grid; gap:7px; color:#2e3e5d; font-weight:700; font-size:.88rem; } input,textarea { width:100%; border:1px solid #c8d4e4; border-radius:7px; padding:12px 13px; color:var(--ink); background:#fff; outline:none; transition:border-color .15s,box-shadow .15s; } textarea { resize:vertical; min-height:70px; } input:focus,textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(46,95,237,.13); }
.button { border:0; border-radius:7px; padding:10px 16px; font-weight:800; color:var(--ink); background:#eaf0fa; }.button--primary { color:white; background:var(--blue); box-shadow:0 12px 22px rgba(46,95,237,.2); }.button--primary:hover { background:var(--blue-dark); }.button--secondary { background:#eaf0ff; color:#244dcc; }.button--quiet { background:transparent; color:var(--muted); }.button--large { padding:14px 22px; font-size:1rem; }.button:disabled { cursor:not-allowed; opacity:.65; }
.form-error { color:#b42318; background:#fff0ef; border:1px solid #ffd0cc; border-radius:7px; padding:10px 12px; margin:0; }.topbar { height:70px; padding:0 clamp(20px,5vw,70px); border-bottom:1px solid var(--line); background:rgba(255,255,255,.86); display:flex; align-items:center; justify-content:space-between; }.topbar__right { display:flex; align-items:center; gap:14px; color:var(--muted); font-size:.9rem; }
.workspace { max-width:1480px; margin:auto; padding:34px clamp(20px,4vw,62px); display:grid; grid-template-columns:195px minmax(0,1fr); gap:38px; }.sidebar { display:flex; flex-direction:column; gap:7px; }.nav-item { text-align:left; border:0; padding:11px 13px; color:#54647e; font-weight:700; background:transparent; border-radius:7px; }.nav-item.is-active { background:#e4ecff; color:#2049bd; }.count { float:right; font-size:.78rem; padding:2px 7px; background:white; border-radius:999px; }.sidebar__note { margin-top:25px; padding:13px; border-left:2px solid #b8c8e8; color:var(--muted); font-size:.78rem; line-height:1.55; }
.content { min-width:0; }.page-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:25px; }.page-intro h1 { margin-bottom:8px; }.page-intro p { margin:0; }.receipt-form { display:grid; gap:16px; }.form-section { padding:24px; }.form-section h2,.audit-section h2 { margin:0 0 20px; font-size:1.08rem; }.form-section h2 span { color:var(--muted); font-size:.78rem; font-weight:600; }.form-grid { display:grid; gap:16px; }.form-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }.form-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }.form-section label+label { margin-top:16px; }.form-grid+label { margin-top:16px; }.money-input { display:flex; align-items:center; border:1px solid #c8d4e4; border-radius:7px; background:white; overflow:hidden; }.money-input:focus-within { border-color:var(--blue); box-shadow:0 0 0 3px rgba(46,95,237,.13); }.money-input input { border:0; box-shadow:none !important; }.money-input span { padding-right:12px; color:var(--muted); font-size:.83rem; } output { min-height:45px; padding:12px 13px; display:block; border-radius:7px; color:var(--blue-dark); background:#eaf0ff; font-size:1.06rem; font-weight:800; }.upload-field { grid-template-columns:40px 1fr; align-items:center; padding:16px; border:1px dashed #aabbd5; border-radius:8px; cursor:pointer; background:#fafcff; }.upload-field input { display:none; }.upload-field__icon { width:32px; height:32px; display:grid; place-items:center; color:var(--blue); background:#e5edff; border-radius:50%; font-size:1.45rem; font-weight:400; }.upload-field strong,.upload-field small { display:block; }.upload-field small,.upload-name { color:var(--muted); font-size:.78rem; font-weight:500; }.upload-name { min-height:1em; margin:10px 0 0; }.form-actions { display:flex; justify-content:flex-end; align-items:center; gap:16px; }
.metric-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:20px; }.metric-card,.dashboard-section { background:rgba(255,255,255,.91); border:1px solid rgba(196,210,230,.8); box-shadow:0 18px 54px rgba(43,71,120,.07); border-radius:10px; }.metric-card { min-height:142px; padding:22px; display:flex; flex-direction:column; justify-content:space-between; }.metric-card span,.metric-card small,.section-heading span { color:var(--muted); font-size:.84rem; }.metric-card strong { color:var(--ink); font-size:1.85rem; letter-spacing:0; }.dashboard-section { overflow:hidden; }.section-heading { padding:20px 22px 0; display:flex; align-items:baseline; justify-content:space-between; gap:12px; }.section-heading h2 { margin:0; font-size:1.08rem; }
.archive-intro { align-items:center; }.archive-table-wrap { overflow:auto; }.archive-table { width:100%; border-collapse:collapse; min-width:720px; }.archive-table th,.archive-table td { padding:15px 16px; text-align:left; border-bottom:1px solid var(--line); font-size:.9rem; }.archive-table th { color:#61708a; font-size:.74rem; text-transform:uppercase; letter-spacing:.05em; }.archive-table tr:last-child td { border-bottom:0; }.archive-table input { width:17px; height:17px; }.status { display:inline-flex; padding:5px 8px; border-radius:999px; font-size:.74rem; font-weight:800; }.status--provided { color:var(--green); background:#e6f7f0; }.status--open { color:var(--yellow); background:#fff4dc; }.row-actions { display:flex; gap:8px; }.row-actions a,.row-actions button { color:#2753d4; border:0; background:transparent; font-weight:800; text-decoration:none; padding:4px; }.empty-state { padding:38px; color:var(--muted); text-align:center; }.audit-section { margin-top:20px; padding:22px; }.audit-list { display:grid; gap:10px; }.audit-entry { display:flex; justify-content:space-between; gap:15px; color:var(--muted); font-size:.83rem; padding-bottom:10px; border-bottom:1px solid #eef1f5; }.audit-entry strong { color:var(--ink); }.toast { position:fixed; right:25px; bottom:25px; max-width:340px; padding:13px 16px; color:white; background:var(--ink); border-radius:8px; box-shadow:0 18px 45px rgba(9,21,48,.25); }.toast.is-error { background:#a42d25; }
.signature-section { margin-top:18px; padding:14px; border:1px solid #c8d4e4; border-radius:8px; background:#fbfcff; }.signature-section__head { display:flex; justify-content:space-between; align-items:center; gap:14px; margin:0 0 10px; }.signature-section__head strong,.signature-section__head span { display:block; }.signature-section__head span { margin-top:3px; color:var(--muted); font-size:.78rem; font-weight:500; }.signature-pad { display:block; width:100%; height:150px; border:1px dashed #9fb1cc; border-radius:6px; background:white; cursor:crosshair; touch-action:none; }.signature-pad:focus { outline:3px solid rgba(46,95,237,.16); border-color:var(--blue); }
@media (max-width:850px) { .auth-view { grid-template-columns:1fr; gap:42px; padding:30px 22px; }.auth-view>.brand { align-self:auto; }.workspace { grid-template-columns:1fr; gap:20px; padding:24px 18px; }.sidebar { flex-direction:row; align-items:center; }.sidebar__note { display:none; }.form-grid.two,.form-grid.three,.metric-grid { grid-template-columns:1fr; }.page-intro { align-items:flex-start; flex-direction:column; }.topbar { padding:0 18px; } }

/* Public product page */
.auth-view { display:block; min-height:100vh; padding:0 5vw 32px; overflow:hidden; color:#f8fbff; background-color:#111a3f; background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px),radial-gradient(circle at 5% 8%,#4939d3 0,transparent 30%),radial-gradient(circle at 76% 20%,rgba(16,201,187,.78) 0,transparent 23%),radial-gradient(circle at 96% 75%,rgba(255,104,64,.76) 0,transparent 30%),linear-gradient(135deg,#17154a 0%,#0c1432 55%,#11152e 100%); background-size:36px 36px,36px 36px,auto,auto,auto,auto; }
.marketing-nav { max-width:1540px; height:116px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:26px; }.marketing-brand { color:white; text-decoration:none; display:flex; align-items:center; gap:13px; font-size:1.45rem; font-weight:800; }.marketing-brand>span:last-child>span { color:#a7a2ff; }.brand-mark { width:29px; height:31px; display:grid; place-items:center; color:#19224c; background:white; clip-path:polygon(0 0,100% 0,100% 100%,75% 86%,50% 100%,25% 86%,0 100%); font-size:1.25rem; line-height:1; }.marketing-nav nav { display:flex; align-items:center; gap:35px; }.marketing-nav nav a { color:rgba(238,244,255,.73); text-decoration:none; font-size:.93rem; font-weight:650; }.marketing-nav nav a:last-child { color:#111a3f; background:white; padding:13px 21px; border-radius:999px; }
.hero-layout { max-width:1400px; min-height:650px; margin:58px auto 0; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(420px,.9fr); align-items:center; gap:30px; }.hero-copy { padding:20px 0 36px; }.hero-badge { width:max-content; max-width:100%; display:flex; align-items:center; gap:10px; margin:0 0 32px; padding:9px 17px; color:#dedcff; border:1px solid rgba(213,211,255,.29); border-radius:999px; background:rgba(255,255,255,.08); font-size:.84rem; font-weight:750; }.hero-badge span { width:9px; height:9px; border-radius:50%; background:#25d7cb; box-shadow:0 0 16px #25d7cb; }.hero-copy h1 { margin:0; max-width:710px; color:white; font-size:clamp(3.3rem,5.3vw,5.8rem); font-weight:800; line-height:.98; letter-spacing:0; }.hero-copy h1 em { color:#ff7755; font-style:normal; }.hero-text { max-width:660px; margin:32px 0 38px; color:rgba(239,244,255,.76); font-size:1.12rem; line-height:1.55; }.feature-pills { display:flex; flex-wrap:wrap; gap:14px; }.feature-pills span { display:inline-flex; align-items:center; gap:10px; padding:13px 17px; border:1px solid rgba(228,233,255,.16); border-radius:10px; background:rgba(255,255,255,.08); color:#f5f7ff; font-size:.88rem; font-weight:750; }.feature-pills b { width:28px; height:28px; display:grid; place-items:center; color:white; border-radius:8px; background:#7555ef; font-size:1rem; }.feature-pills span:nth-child(2) b { background:#22cfc5; }.feature-pills span:nth-child(3) b { background:#ff785b; }
.receipt-visual { position:relative; min-height:495px; }.receipt-paper,.back-receipt { position:absolute; width:365px; padding:28px; border-radius:17px; background:#f9fbff; color:#192442; box-shadow:0 30px 60px rgba(0,0,0,.27); }.back-receipt { opacity:.66; height:250px; color:#283650; }.back-receipt strong,.back-receipt small { display:block; }.back-receipt p { padding:10px 0; margin:5px 0; border-bottom:1px dashed #9caac2; font-size:.8rem; }.back-receipt--one { top:34px; left:95px; transform:rotate(-7deg); background:#e3f5ff; }.back-receipt--two { right:28px; bottom:37px; transform:rotate(8deg); background:#f3ece9; }.receipt-paper { z-index:2; top:103px; left:135px; transform:rotate(-1.5deg); }.receipt-paper header { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }.receipt-paper strong,.receipt-paper small { display:block; }.receipt-paper strong { font-size:1.07rem; }.receipt-paper small { color:#7b8aa5; margin-top:5px; font-size:.72rem; }.receipt-status { padding:7px 9px; color:#13a86e; border:3px solid #1db77c; border-radius:7px; transform:rotate(11deg); font-size:.68rem; font-weight:850; }.receipt-paper dl { margin:22px 0 0; }.receipt-paper dl div { display:flex; justify-content:space-between; gap:14px; padding:8px 0; border-bottom:1px dashed #d8e0eb; font-size:.8rem; }.receipt-paper dt { color:#7989a3; }.receipt-paper dd { margin:0; text-align:right; }.receipt-paper .receipt-total { border:0; color:#111a3f; font-size:.92rem; font-weight:850; }.receipt-paper .receipt-total dt { color:#111a3f; }.secure-orb { position:absolute; z-index:3; right:38px; bottom:6px; width:142px; height:142px; display:grid; place-content:center; color:white; border-radius:50%; background:linear-gradient(135deg,#744df2,#432be2); box-shadow:0 19px 45px rgba(42,27,165,.45); font-size:4.3rem; text-align:center; }.secure-orb small { display:block; margin-top:-5px; font-size:.53rem; font-weight:850; letter-spacing:.08em; }
.marketing-auth-card { position:relative; z-index:5; max-width:1400px; margin:0 auto; padding:40px 46px; display:grid; grid-template-columns:minmax(270px,.85fr) minmax(480px,1.15fr); gap:55px; color:#15203d; border:1px solid rgba(255,255,255,.55); border-radius:27px; background:linear-gradient(112deg,#fff 0%,#fbfaff 59%,#f5f1ff 100%); box-shadow:0 30px 80px rgba(5,8,30,.35),inset 0 1px 0 rgba(255,255,255,.9); }.marketing-auth-card::before { content:""; position:absolute; inset:0 auto 0 0; width:6px; border-radius:27px 0 0 27px; background:linear-gradient(#6f4df2,#fc6384); }.auth-logo-lockup { display:flex; align-items:center; gap:9px; margin-bottom:21px; color:#17214a; font-size:1.05rem; font-weight:850; }.auth-logo-lockup .brand-mark { width:25px; height:27px; color:white; background:#6045e5; font-size:1rem; }.auth-logo-lockup span:last-child span { color:#7659ec; }.auth-intro .eyebrow { color:#7555ef; }.auth-intro h2 { max-width:390px; margin:12px 0 13px; font-size:1.72rem; line-height:1.15; letter-spacing:0; }.auth-intro p:not(.eyebrow) { margin:0; color:#71819a; line-height:1.55; }.auth-security { display:block; margin-top:23px; color:#1aae70; font-size:.84rem; font-weight:800; }.auth-form-area { min-width:0; }.inline-login-form { display:grid; grid-template-columns:1fr 1fr auto; gap:14px; align-items:end; }.inline-login-form label { color:#394668; font-size:.78rem; }.inline-login-form input,.marketing-auth-card .registration-form input { min-height:52px; background:#f8f7ff; border-color:#ded8fa; }.inline-login-form input:focus,.marketing-auth-card .registration-form input:focus { border-color:#7659ec; box-shadow:0 0 0 3px rgba(118,89,236,.14); }.inline-login-form .button,.marketing-auth-card .registration-form .button--primary { min-height:52px; padding:12px 22px; white-space:nowrap; background:linear-gradient(120deg,#ff745f,#fd4f8d); box-shadow:0 15px 27px rgba(247,77,128,.25); }.inline-login-form .button:hover,.marketing-auth-card .registration-form .button--primary:hover { background:linear-gradient(120deg,#ff674f,#f73c78); }.inline-login-form .button span,.registration-form .button span { margin-left:8px; font-size:1.2em; }.form-error--wide { grid-column:1/-1; }.marketing-auth-card .auth-switch { margin-top:14px; font-size:.83rem; }.marketing-auth-card .text-button,.marketing-auth-card .auth-footer a { color:#684ce7; }.marketing-auth-card .auth-footer { margin-top:17px; padding-top:14px; }.marketing-auth-card .stack-form { margin-top:0; }.marketing-auth-card .registration-form { max-width:520px; }.marketing-footer { max-width:1400px; margin:46px auto 0; padding:0 0 7px; display:flex; justify-content:center; gap:42px; color:rgba(241,245,255,.6); font-size:.82rem; }.marketing-footer span::before { content:""; display:inline-block; width:6px; height:6px; margin:0 9px 2px 0; border-radius:50%; background:#26d7c8; }
@media (max-width:1000px) { .marketing-nav { height:88px; }.marketing-nav nav { gap:18px; }.hero-layout { min-height:0; grid-template-columns:1fr; margin-top:38px; }.hero-copy { padding-bottom:0; }.receipt-visual { width:min(600px,100%); margin:0 auto; }.marketing-auth-card { grid-template-columns:1fr; gap:25px; }.auth-intro h2 { max-width:620px; }.inline-login-form { grid-template-columns:1fr 1fr auto; } }
@media (max-width:650px) { .auth-view { padding:0 18px 26px; background-size:28px 28px,28px 28px,auto,auto,auto,auto; }.marketing-nav { height:78px; }.marketing-nav nav a:not(:last-child) { display:none; }.marketing-brand { font-size:1.18rem; }.hero-layout { margin-top:20px; }.hero-badge { margin-bottom:22px; font-size:.74rem; }.hero-copy h1 { font-size:clamp(2.65rem,14vw,4.2rem); }.hero-text { margin:24px 0; font-size:1rem; }.feature-pills { gap:8px; }.feature-pills span { padding:10px 11px; font-size:.73rem; }.feature-pills b { width:23px; height:23px; }.receipt-visual { min-height:350px; transform:scale(.8); transform-origin:top center; margin-bottom:-67px; }.receipt-paper { left:50%; top:72px; transform:translateX(-50%) rotate(-1.5deg); }.back-receipt--one { left:10px; top:18px; }.back-receipt--two { right:4px; bottom:16px; }.secure-orb { right:6px; bottom:0; }.marketing-auth-card { padding:27px 22px; border-radius:18px; }.auth-intro h2 { font-size:1.42rem; }.inline-login-form { grid-template-columns:1fr; gap:12px; }.inline-login-form .button { width:100%; }.marketing-footer { display:none; }.topbar__right .legal-link { display:none; } }