:root{
--ink:#0d2038;
--muted:#3f5068;
--line:rgba(13,32,56,.18);
--panel:#ffffff;
--accent:#0b63d1;
--accent-deep:#08418f;
--shadow:0 22px 52px rgba(13,32,56,.12);
--radius-xl:28px;
--radius-lg:20px;
--radius-md:14px;
}
*{box-sizing:border-box}
body{
margin:0;
font-family:"Plus Jakarta Sans",sans-serif;
font-size:14px;
line-height:1.45;
color:var(--ink);
background:#f4f6fb;
min-height:100vh;
}
body::before{content:none;}
.shell{
position:relative;
max-width:1320px;
margin:0 auto;
padding:14px 14px 36px;
}
.hidden{display:none!important}
.visually-hidden-file-input{
position:absolute;
left:-9999px;
top:auto;
width:1px;
height:1px;
overflow:hidden;
border:0;
opacity:0;
pointer-events:none;
}

body.is-authenticated .guest-only{display:none!important}
.button{
appearance:none;
border:none;
border-radius:999px;
padding:10px 15px;
display:inline-flex;
align-items:center;
justify-content:center;
text-decoration:none;
font:inherit;
font-weight:700;
font-size:14px;
line-height:1.2;
cursor:pointer;
transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}
.button:hover{transform:translateY(-1px)}
.button:active,
.button.is-pressed{
transform:translateY(1px) scale(.985);
box-shadow:0 6px 14px rgba(16,35,63,.14);
filter:saturate(1.06) brightness(.98);
}
.button-primary{
background:linear-gradient(135deg, var(--accent), #2f7fe0);
color:#f8fbff;
box-shadow:0 14px 28px rgba(0,95,204,.22);
}
.button-alert{
background:linear-gradient(135deg, #c53b2b, #e0553b);
color:#fff8f7;
box-shadow:0 14px 28px rgba(197,59,43,.24);
}
.button-ghost{
background:rgba(255,255,255,.88);
color:var(--ink);
border:1px solid var(--line);
}
.button-danger{
background:#fff1f0;
color:#9b2f2a;
border:1px solid rgba(155,47,42,.14);
}
.button-soft{
background:rgba(0,95,204,.08);
color:var(--accent-deep);
border:1px solid rgba(0,95,204,.12);
}
.button-muted{
background:rgba(18,24,33,.08);
color:rgba(18,24,33,.55);
border:1px solid rgba(18,24,33,.12);
box-shadow:none;
}
.button.is-disabled{
background:rgba(18,24,33,.08);
color:rgba(18,24,33,.4);
border:1px solid rgba(18,24,33,.12);
box-shadow:none;
pointer-events:none;
}
.file-input.is-disabled{
background:rgba(18,24,33,.08);
border:1px solid rgba(18,24,33,.12);
box-shadow:none;
}
.file-input.is-disabled span,
.file-input.is-disabled strong,
.file-input.is-disabled small{
color:rgba(18,24,33,.4);
}
.file-input.is-disabled input{
pointer-events:none;
cursor:default;
}
.button:focus-visible{
outline:2px solid rgba(0,95,204,.35);
outline-offset:2px;
}
.text-link{
background:none;
border:none;
padding:0;
font:inherit;
font-weight:700;
color:var(--accent-deep);
cursor:pointer;
}
.hero-signin-link{
display:inline-flex;
align-items:center;
justify-content:center;
padding:10px 16px;
border-radius:999px;
background:rgba(0,95,204,.12);
border:1px solid rgba(0,95,204,.18);
font-weight:800;
box-shadow:0 10px 22px rgba(0,95,204,.08);
}
.site-nav,
.panel,
.hero-copy,
.upload-card,
.pricing-card,
.positioning-strip{
background:var(--panel);
border:1px solid rgba(255,255,255,.58);
box-shadow:var(--shadow);
backdrop-filter:blur(12px);
}
.site-nav{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
align-items:center;
gap:18px;
padding:10px 16px;
border-radius:999px;
margin-bottom:10px;
}
.brand-block{
display:flex;
align-items:center;
gap:16px;
flex:1 1 68%;
min-width:0;
}
.brand-mark{
width:42px;
height:42px;
flex:0 0 auto;
display:block;
object-fit:contain;
}
.brand-copy{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:4px;
min-width:0;
}
.brand-title-row{
display:flex;
align-items:center;
gap:10px;
min-width:0;
}
.brand-copy strong{
display:block;
font-family:"Sora",sans-serif;
font-size:17px;
font-weight:700;
flex:0 0 auto;
white-space:nowrap;
margin-bottom:3px;
}
.brand-copy span{
display:block;
color:var(--muted);
font-size:11px;
}
.brand-copy .brand-tagline{
max-width:none;
line-height:1.3;
white-space:normal;
flex:1 1 auto;
}
.nav-actions{
display:flex;
align-items:center;
gap:8px;
flex-wrap:wrap;
justify-content:flex-end;
flex:0 0 auto;
}
.beta-pill{
display:inline-flex;
align-items:center;
justify-content:center;
padding:4px 9px;
border-radius:999px;
background:linear-gradient(180deg, rgba(26,77,151,.12), rgba(26,77,151,.08));
border:1px solid rgba(26,77,151,.16);
color:#1f4f95;
font-size:11px;
font-weight:700;
letter-spacing:.04em;
line-height:1;
text-transform:lowercase;
white-space:nowrap;
}
.nav-user{
font-size:12px;
color:var(--muted);
}
.auth-panel{
padding:22px 24px 20px;
border-radius:26px;
margin-bottom:18px;
max-width:780px;
margin-left:auto;
margin-right:auto;
background:linear-gradient(180deg, rgba(255,255,255,.97), rgba(246,250,255,.95));
border:1px solid rgba(92,142,225,.14);
box-shadow:0 22px 40px rgba(16,39,78,.1);
}
.account-panel{
padding:12px 14px;
border-radius:18px;
margin-bottom:12px;
}
.account-panel-head{
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:16px;
margin-bottom:10px;
}
.account-panel-head h2{
margin:0;
font-family:"Sora",sans-serif;
font-size:22px;
}
.account-panel-head p{
margin:6px 0 0;
color:var(--muted);
font-size:12px;
max-width:56ch;
}
.account-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:10px;
align-items:start;
}
.account-summary{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:8px;
margin-top:10px;
}
.account-summary .account-stat{
border:1px solid rgba(16,35,63,.12);
border-radius:12px;
padding:10px 12px;
background:rgba(255,255,255,.9);
box-shadow:0 6px 12px rgba(16,35,63,.05);
}
.account-summary .account-stat span{color:#425574;font-weight:700;letter-spacing:.04em;}
.account-summary .account-stat strong{font-weight:800;color:#0a1b31;font-size:15px;}
.billing-summary{
margin-top:12px;
padding:12px 14px;
border-radius:14px;
background:rgba(13,32,56,.04);
border:1px solid rgba(13,32,56,.08);
display:grid;
grid-template-columns:1fr auto;
gap:10px 14px;
align-items:center;
}
.billing-header{
font-size:13px;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
color:#2b3d5a;
}
.billing-lines{
display:flex;
flex-direction:column;
gap:4px;
}
.billing-primary{
font-size:16px;
font-weight:800;
color:#0a1b31;
}
.billing-secondary{
font-size:14px;
font-weight:700;
color:#1f304a;
}
.billing-tertiary{
font-size:13px;
font-weight:600;
color:#4a5b74;
}
.billing-actions{
display:flex;
justify-content:flex-end;
align-items:center;
}
.account-stat{
padding:12px 14px;
border-radius:18px;
background:rgba(0,95,204,.06);
border:1px solid rgba(0,95,204,.12);
}
.account-stat span{
display:block;
font-size:11px;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
color:var(--muted);
margin-bottom:6px;
}
.account-stat strong{
font-size:13px;
font-weight:700;
color:var(--ink);
}
.account-actions{
display:grid;
grid-template-columns:minmax(0,1fr);
gap:12px;
margin-top:14px;
}
.account-actions-row{
display:flex;
align-items:center;
gap:10px;
flex-wrap:wrap;
}
.account-field-note{
margin-top:6px;
font-size:12px;
line-height:1.45;
color:var(--muted);
}
.account-plan-pill{
display:inline-flex;
align-items:center;
justify-content:center;
padding:11px 16px;
border-radius:999px;
border:1px solid rgba(18, 42, 76, .12);
background:rgba(18, 42, 76, .06);
color:var(--ink);
font-weight:700;
font-size:13px;
white-space:nowrap;
}
.account-status-card{
margin-top:12px;
padding:12px 14px;
border-radius:16px;
background:rgba(18,42,76,.04);
border:1px solid rgba(18,42,76,.08);
}
.account-action-status{
margin-top:10px;
}
.auth-panel-head{
display:flex;
justify-content:space-between;
align-items:center;
gap:16px;
margin-bottom:18px;
}
.auth-panel-head h2{
margin:0;
font-family:"Sora",sans-serif;
font-size:28px;
letter-spacing:-.03em;
}
.auth-panel-head p{
margin:4px 0 0;
color:var(--muted);
font-size:13px;
max-width:48ch;
}
.auth-tabs{
display:flex;
gap:10px;
margin-bottom:14px;
max-width:420px;
padding:5px;
border-radius:999px;
background:rgba(14,36,67,.05);
border:1px solid rgba(16,35,63,.08);
}
.tab-button{
flex:1;
padding:11px 14px;
border-radius:999px;
border:1px solid transparent;
background:transparent;
font:inherit;
font-weight:700;
cursor:pointer;
color:var(--muted);
}
.tab-button.active{
background:var(--ink);
color:#fff8f0;
box-shadow:0 12px 22px rgba(16,35,63,.18);
}
.auth-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:14px 16px;
align-items:start;
max-width:none;
}
.field{
display:flex;
flex-direction:column;
gap:6px;
}
.field-row{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:12px;
}
.field-row .field{
padding:0;
}
.password-wrap{
position:relative;
}
.field-wide{grid-column:1/-1}
.field label{
font-size:10px;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
color:var(--muted);
}
.field-note{
margin:0;
font-size:12px;
line-height:1.45;
color:var(--muted);
}
.field input,
.field select,
.field textarea{
width:100%;
padding:10px 13px;
border-radius:16px;
border:1px solid var(--line);
background:rgba(255,255,255,.9);
font:inherit;
color:var(--ink);
outline:none;
}
.field textarea{
min-height:96px;
resize:vertical;
}
.field input::placeholder,
.field textarea::placeholder{
font-size:13px;
}
.password-wrap input{
padding-right:84px;
}
.password-toggle{
position:absolute;
top:50%;
right:12px;
transform:translateY(-50%);
border:none;
background:none;
color:var(--accent-deep);
font:inherit;
font-size:12px;
font-weight:800;
cursor:pointer;
padding:0;
}
.password-toggle:hover{
text-decoration:underline;
}
.auth-actions{
display:flex;
align-items:center;
gap:12px;
flex-wrap:wrap;
justify-content:flex-start;
margin-top:14px;
}
.auth-legal-note{
margin:10px auto 0;
max-width:36ch;
font-size:13px;
line-height:1.5;
color:var(--muted);
text-align:center;
}
.auth-legal-note a{
color:inherit;
text-underline-offset:2px;
}
.auth-legal-note a:hover{
color:var(--accent-deep);
}
.auth-links{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
align-items:center;
gap:10px 14px;
margin-top:2px;
}
.auth-status{
min-height:0;
font-size:12px;
color:var(--muted);
max-width:100%;
line-height:1.55;
white-space:normal;
margin-top:12px;
padding:10px 12px;
border-radius:14px;
background:rgba(0,95,204,.06);
border:1px solid rgba(0,95,204,.1);
}
.auth-panel .field.field-wide{
max-width:none;
padding-top:4px;
}
#authToggleLink{
margin-left:auto;
justify-self:end;
}
.google-signin{
min-width:280px;
}
.google-signin > div{
transform:scale(.94);
transform-origin:left center;
}
.google-signin{
display:flex;
justify-content:flex-start;
}
.hero{
display:grid;
grid-template-columns:1fr;
gap:14px;
align-items:stretch;
margin-bottom:24px;
justify-items:center;
}
.hero-copy,
.upload-card{
border-radius:var(--radius-xl);
padding:20px;
}
.hero-copy{
display:grid;
grid-template-columns:minmax(0, 1.45fr) minmax(250px, .75fr);
grid-template-areas:
"main process"
"actions process";
align-items:center;
gap:22px 28px;
width:min(100%, 1120px);
margin:0 auto;
padding:30px 34px;
background:
linear-gradient(145deg, rgba(10, 27, 54, .98), rgba(22, 53, 99, .94)),
radial-gradient(circle at top right, rgba(68, 156, 255, .28), transparent 42%);
border:1px solid rgba(118, 170, 255, .22);
box-shadow:0 26px 54px rgba(9, 24, 47, .2);
}
.hero-main{
min-width:0;
grid-area:main;
}
.hero-eyebrow,
.upload-kicker{
display:inline-flex;
align-items:center;
gap:8px;
padding:6px 10px;
border-radius:999px;
background:rgba(255,255,255,.12);
color:#d8e6ff;
font-size:11px;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
}
.hero-copy h1{
margin:6px 0 8px;
font-family:"Sora",sans-serif;
font-size:clamp(34px,5vw,60px);
line-height:.96;
letter-spacing:-.035em;
max-width:11ch;
color:#f7fbff;
}
.hero-copy p{
margin:0;
max-width:54ch;
font-size:16px;
line-height:1.55;
color:rgba(241,246,255,.84);
}
.hero-actions{
display:flex;
align-items:center;
gap:10px;
flex-wrap:wrap;
margin-top:18px;
grid-area:actions;
align-self:start;
}
.hero-cta-support{
width:100%;
margin:0 0 2px;
font-size:13px;
font-weight:600;
line-height:1.45;
color:rgba(241,246,255,.82);
}
.hero-actions .button-primary{
box-shadow:0 18px 34px rgba(0, 95, 204, .28);
}
.hero-actions .button-ghost{
background:rgba(255,255,255,.1);
border-color:rgba(255,255,255,.18);
color:#f7fbff;
}
.hero-actions .button-ghost:hover{
background:rgba(255,255,255,.16);
border-color:rgba(255,255,255,.24);
}
.hero-process{
display:flex;
flex-direction:column;
align-items:stretch;
justify-content:center;
gap:8px;
grid-area:process;
width:min(100%, 320px);
justify-self:end;
align-self:center;
}
.hero-flow-pill{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:34px;
width:100%;
padding:6px 12px;
border-radius:999px;
background:rgba(231,240,255,.15);
border:1px solid rgba(214,230,255,.28);
box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
font-size:11px;
font-weight:650;
line-height:1.2;
color:rgba(249,252,255,.98);
white-space:normal;
pointer-events:none;
user-select:none;
text-align:center;
}
.hero-flow-pill-detail{
font-size:11px;
padding-left:10px;
padding-right:10px;
}
.file-input{
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
padding:13px 16px;
border-radius:22px;
background:rgba(255,255,255,.08);
border:1px solid rgba(255,255,255,.18);
overflow:hidden;
}
.file-input.button{
background:linear-gradient(135deg, var(--accent), #2f7fe0);
border:none;
box-shadow:0 14px 28px rgba(0,95,204,.22);
color:#f8fbff;
width:100%;
justify-content:center;
text-align:center;
}
.file-input.button span,
.file-input.button strong,
.file-input.button small{
color:#f8fbff;
}
.file-input.button small{
opacity:.88;
}
.file-input input{
position:absolute;
inset:0;
opacity:0;
cursor:pointer;
}
.file-input strong{
display:block;
font-size:14px;
}
.file-input small{
display:block;
margin-top:2px;
color:rgba(248,251,255,.72);
}
.upload-foot{
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
flex-wrap:wrap;
}
.microcopy{
font-size:12px;
color:rgba(248,251,255,.8);
}
.status-badge{
display:inline-flex;
align-items:center;
gap:8px;
padding:9px 12px;
border-radius:999px;
background:rgba(255,255,255,.1);
color:rgba(248,251,255,.9);
font-size:11px;
font-weight:700;
letter-spacing:.06em;
text-transform:uppercase;
}
.positioning-strip{
border-radius:24px;
padding:15px 22px;
text-align:center;
font-weight:700;
font-size:13px;
margin-bottom:18px;
background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(241,247,255,.96));
border:1px solid rgba(87, 136, 224, .14);
box-shadow:0 14px 26px rgba(8, 23, 46, .08);
width:min(100%, 860px);
margin-left:auto;
margin-right:auto;
}
.positioning-strip p{
margin:0;
font-weight:700;
color:#17345f;
}
.auth-actions-compact{
  margin:18px 0 8px;
  padding:15px 17px;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(242,247,255,.96));
  border:1px solid rgba(11,99,209,.18);
  border-radius:20px;
  box-shadow:0 18px 34px rgba(18,44,82,.09);
  display:flex;
  flex-direction:column;
  gap:11px;
}
.auth-actions-compact .compact-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}
.auth-actions-compact .compact-actions .button{
  min-width:168px;
  min-height:50px;
  padding:13px 18px;
  font-size:16px;
  font-weight:800;
  border-radius:16px;
  box-shadow:0 14px 24px rgba(17,45,84,.10);
}
.auth-actions-compact #uploadReceiptButtonCompact{
  background:linear-gradient(135deg, #0b63d1, #2f86f2);
  box-shadow:0 16px 28px rgba(11,99,209,.24);
}
.auth-actions-compact #stepExtractReceiptButtonCompact{
  border:2px solid rgba(11,99,209,.22);
  background:#ffffff;
}
.auth-actions-compact #stepExtractReceiptButtonCompact:not(:disabled):hover{
  border-color:rgba(11,99,209,.4);
  background:rgba(11,99,209,.06);
}
.auth-actions-compact .compact-helper{
  margin:0;
  color:#365077;
  font-size:14px;
  font-weight:600;
}
.workflow-help-toggle{
width:38px;
height:38px;
border:none;
border-radius:999px;
background:linear-gradient(135deg,#eff6ff,#dcecff);
color:#174377;
font-size:18px;
font-weight:800;
font-family:"Sora",sans-serif;
display:inline-flex;
align-items:center;
justify-content:center;
box-shadow:0 10px 20px rgba(23,67,119,.12);
cursor:pointer;
transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.workflow-help-toggle:hover,
.workflow-help-toggle[aria-expanded="true"]{
transform:translateY(-1px);
background:linear-gradient(135deg,#ffffff,#e4f0ff);
box-shadow:0 14px 24px rgba(23,67,119,.18);
}
.workflow-help-toggle-compact{
width:42px;
height:42px;
flex:0 0 auto;
}
.workflow-help-popover{
position:absolute;
right:0;
top:calc(100% + 12px);
z-index:12;
width:min(430px, calc(100vw - 40px));
padding:16px 18px;
border-radius:22px;
background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(244,248,255,.98));
border:1px solid rgba(17,76,144,.14);
box-shadow:0 24px 40px rgba(15,36,66,.18);
display:grid;
gap:12px;
}
.workflow-help-popover::before{
content:"";
position:absolute;
top:-8px;
right:18px;
width:16px;
height:16px;
background:inherit;
border-left:1px solid rgba(17,76,144,.14);
border-top:1px solid rgba(17,76,144,.14);
transform:rotate(45deg);
border-top-left-radius:4px;
}
.workflow-help-header{
display:flex;
align-items:center;
justify-content:flex-start;
}
.workflow-help-badge{
display:inline-flex;
align-items:center;
padding:6px 10px;
border-radius:999px;
background:rgba(11,99,209,.08);
color:#1b4c88;
font-size:11px;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
}
.workflow-help-list,
.workflow-help-notes{
margin:0;
padding-left:18px;
display:grid;
gap:8px;
color:#233955;
font-size:13px;
line-height:1.45;
}
.workflow-help-list li,
.workflow-help-notes li{
padding-left:2px;
}
.workflow-help-list strong{
display:block;
margin-bottom:2px;
font-size:13px;
color:#102742;
}
.workflow-help-list span{
display:block;
color:#4a6180;
}
.workflow-help-popover-compact{
position:relative;
right:auto;
top:auto;
width:100%;
margin-top:2px;
}
.workflow-help-popover-compact::before{
display:none;
}
.panel{
border-radius:16px;
overflow:hidden;
padding-bottom:12px;
background:#fff;
border:1px solid rgba(16,35,63,.08);
box-shadow:0 10px 26px rgba(16,35,63,.06);
margin-bottom:16px;
}
.panel-head{
padding:14px 16px 0;
}
.panel-head h3{
margin:0;
font-family:"Sora",sans-serif;
font-size:20px;
color:#0a1b31;
}
.faq-panel-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
cursor:pointer;
user-select:none;
padding:18px 18px 10px;
border-bottom:1px solid rgba(16,35,63,.08);
}
.faq-title{
margin:0;
font-family:"Sora",sans-serif;
font-size:30px;
font-weight:800;
letter-spacing:-0.02em;
color:#0f2137;
}
.faq-toggle-icon{
width:38px;
height:38px;
border-radius:999px;
display:inline-flex;
align-items:center;
justify-content:center;
font-size:22px;
font-weight:800;
color:var(--accent-deep);
line-height:1;
background:rgba(11,99,209,.08);
box-shadow:inset 0 0 0 1px rgba(11,99,209,.12);
}
.faq-list{
transition:max-height .22s ease, opacity .22s ease;
overflow:hidden;
}
.faq-list[data-open="false"]{
max-height:0;
opacity:0;
pointer-events:none;
}
.faq-list[data-open="true"]{
max-height:1200px;
opacity:1;
}
.panel-head p{
margin:8px 0 0;
color:#4a5b74;
font-size:12px;
}
#accountCancelPlanButton{display:none!important}
.panel#reportPanel .panel-head h3{
color:#0a1b31;
font-weight:800;
}
.panel#reportPanel .report-page-head{
padding-bottom:2px;
}
.panel#reportPanel .report-page-head h3{
font-size:34px;
font-weight:850;
letter-spacing:-.03em;
}
.panel#reportPanel .panel-head p{
color:#4a5b74;
font-size:12px;
}
.preview-banner{
margin:18px 24px 0;
padding:16px 18px;
border-radius:18px;
background:rgba(0,95,204,.08);
border:1px solid rgba(0,95,204,.14);
display:flex;
justify-content:space-between;
align-items:center;
gap:14px;
flex-wrap:wrap;
}
.usage-indicator{
margin:8px 24px 0;
padding:2px 0 0;
font-size:12px;
font-weight:500;
display:flex;
align-items:center;
gap:10px;
flex-wrap:wrap;
justify-content:flex-start;
}
.usage-summary{
color:var(--muted);
font-weight:500;
}
.usage-value{
color:#0a1b31;
font-weight:800;
}
.usage-upgrade-button{
padding:8px 12px;
font-size:12px;
margin-left:8px;
}
.limit-banner{
margin:14px 24px 0;
padding:14px 16px;
border-radius:16px;
background:#fff0ec;
border:1px solid rgba(160,63,38,.14);
color:#8f321f;
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
flex-wrap:wrap;
}
.report-controls{
display:flex;
align-items:center;
gap:10px;
flex-wrap:wrap;
padding:10px 14px 0;
justify-content:space-between;
position:relative;
}
.report-controls-left,
.report-controls-center,
.report-controls-right{
display:flex;
align-items:center;
gap:10px;
flex-wrap:wrap;
}
.report-total{
font-size:13px;
font-weight:600;
color:var(--muted);
min-width:auto;
text-align:left;
}
.report-controls select,
.report-controls input{
padding:10px 12px;
border-radius:12px;
border:1px solid rgba(16,35,63,.2);
background:#fff;
font-size:15px;
font-weight:600;
color:#0f1f2e;
}
.report-controls input#reportRenameInput{
  font-weight:500;
}
.report-controls input::placeholder,
.report-controls select::placeholder{color:#7d8796;font-weight:500;}
.report-controls .button{font-weight:800; box-shadow:none;}
.report-controls .button-primary{box-shadow:0 10px 18px rgba(0,95,204,.18);}
.report-controls-right .button{margin-left:2px;}

.modal-overlay{
  position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(12,24,48,.28);backdrop-filter:blur(2px);z-index:4000;
}
.modal-overlay.hidden{display:none}
.modal{
  background:#fff;border-radius:16px;box-shadow:0 16px 40px rgba(12,24,48,.18);
  max-width:720px;width:90%;padding:18px 18px 20px;position:relative;border:1px solid rgba(16,35,63,.08);
}
.modal h3{margin:0 0 6px;font-size:20px;color:#0a1b31}
.modal-subtitle{margin:0 0 12px;color:#4a5b74;font-size:13px}
.modal-close{
  position:absolute;top:10px;right:10px;border:none;background:transparent;
  font-size:18px;cursor:pointer;color:#4a5b74;
}
.plan-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
.plan-card{
  border:1px solid rgba(16,35,63,.1);border-radius:14px;padding:12px;background:#f9fbff;
  display:flex;flex-direction:column;gap:10px;min-height:0;
}
.plan-card-head{display:flex;justify-content:space-between;align-items:center}
.plan-name{font-weight:800;font-size:15px;color:#0a1b31}
.plan-price{font-weight:700;font-size:13px;color:#1f60d1}
.plan-points{margin:0;padding-left:18px;color:#1f2e46;font-size:12px;display:flex;flex-direction:column;gap:4px}
.plan-select{width:100%}
.plan-card[data-selected=\"true\"]{border-color:#1f60d1;box-shadow:0 8px 18px rgba(31,96,209,.16)}

/* Dropdown menus for report actions/export */
.menu-sheet{
position:absolute;
top:calc(100% + 8px);
right:0;
min-width:220px;
padding:10px;
border-radius:14px;
background:#fff;
border:1px solid rgba(16,35,63,.12);
box-shadow:0 18px 40px rgba(13,32,56,.14);
display:grid;
gap:8px;
z-index:30;
}
.menu-sheet button{
width:100%;
justify-content:center;
text-align:center;
}
.menu-sheet .button-soft{
background:rgba(0,95,204,.1);
border:1px solid rgba(0,95,204,.2);
color:var(--accent-deep);
box-shadow:none;
}
.preview-banner strong{
display:block;
margin-bottom:4px;
}
.guest-report-summary{
margin-bottom:10px;
padding:14px 16px;
border-radius:16px;
background:rgba(11,99,209,.06);
border:1px solid rgba(11,99,209,.14);
}
.guest-report-total{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
flex-wrap:wrap;
}
.guest-report-total-label{
font-size:12px;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
color:#425574;
}
.guest-report-total-value{
font-size:18px;
font-weight:800;
color:#0a1b31;
}
.table-tools{
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
flex-wrap:wrap;
padding:10px 14px 6px;
border-top:1px solid rgba(16,35,63,.08);
}
.table-tools .auth-actions{
display:flex;
align-items:center;
gap:8px;
flex-wrap:wrap;
}
.inline-input{
padding:10px 13px;
border-radius:14px;
border:1px solid var(--line);
background:#fff;
font:inherit;
font-size:14px;
line-height:1.35;
min-height:46px;
transition:border-color .15s ease, box-shadow .15s ease;
}
.inline-input:focus{
outline:none;
border-color:var(--accent);
box-shadow:0 0 0 3px rgba(0,95,204,.16);
}
.table-tools .auth-actions select,
.table-tools .auth-actions .inline-input{
height:46px;
min-width:180px;
}
.table-tools .auth-actions select,
#reportSelector{
width:100%;
max-width:100%;
min-width:0;
height:46px;
min-height:46px;
line-height:1.25;
padding:10px 38px 10px 12px;
border-radius:14px;
border:1px solid var(--line);
background-color:#fff;
color:#0f1f2e;
font-size:15px;
font-weight:600;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
-webkit-appearance:none;
appearance:none;
background-image:
  linear-gradient(45deg, transparent 50%, #5f6f87 50%),
  linear-gradient(135deg, #5f6f87 50%, transparent 50%);
background-position:
  calc(100% - 18px) calc(50% - 2px),
  calc(100% - 12px) calc(50% - 2px);
background-size:6px 6px, 6px 6px;
background-repeat:no-repeat;
}
.table-tools .auth-actions select:focus,
#reportSelector:focus{
outline:none;
border-color:rgba(0,95,204,.6);
box-shadow:0 0 0 2px rgba(0,95,204,.14);
}
.table-tools .auth-actions select option,
#reportSelector option{
font-size:14px;
font-weight:500;
color:#102033;
background:#fff;
}
.table-tools .auth-actions .inline-input.hidden{
display:none!important;
}
.table-tools .auth-actions{
gap:10px;
}
.table-note{
color:#4a5a73;
font-size:12px;
line-height:1.45;
}
.export-note{
max-width:640px;
line-height:1.4;
}
.export-actions{
display:flex;
flex-direction:column;
align-items:flex-end;
gap:6px;
text-align:right;
}
.export-actions .export-buttons{
display:flex;
gap:10px;
flex-wrap:wrap;
justify-content:flex-end;
}
.archived-section{
margin:16px 0 10px;
padding:0 10px 4px;
}
.archived-limit{
color:#b32d2d;
font-size:13px;
font-weight:700;
}
.archived-list{
display:flex;
flex-direction:column;
gap:6px;
padding:0 10px 10px;
}
.archived-card h5{
margin:0 0 4px;
font-size:15px;
font-weight:800;
color:#0f1f2e;
}
.archived-meta{
color:#546177;
font-size:12px;
font-weight:600;
}
.archived-card{
  background:rgba(255,255,255,.9);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:10px 12px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  min-height:46px;
}
.archived-card h5{
margin:0;
font-size:15px;
font-weight:700;
}
.archived-meta{
display:flex;
align-items:center;
gap:12px;
color:var(--muted);
font-size:12px;
}
.archived-actions{
  display:flex;
  gap:6px;
  margin-left:0;
  margin-top:2px;
  flex-wrap:wrap;
  justify-content:flex-start;
  width:auto;
}
.archived-actions .button,
.archived-actions .button-ghost,
.archived-actions .button-primary,
.archived-actions .button-soft {
  padding:6px 10px;
  font-size:12px;
  min-height:32px;
}
.export-actions{
display:flex;
flex-direction:column;
align-items:flex-end;
gap:6px;
text-align:right;
}
.export-actions .export-buttons{
display:flex;
gap:10px;
flex-wrap:wrap;
justify-content:flex-end;
}
.subsection-head{
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:14px;
padding:0 14px;
flex-wrap:wrap;
}
.subsection-head h4{
margin:0;
font-family:"Sora",sans-serif;
font-size:22px;
color:#0f1f2e;
font-weight:800;
}
.subsection-head p{
margin:6px 0 0;
color:#516079;
font-size:12px;
font-weight:500;
}
.table-summary{
display:block;
padding:0 14px 8px;
line-height:1.45;
}
.unassigned-section{
margin-top:20px;
}
.unassigned-section .panel-head{
padding-bottom:6px;
}
.draft-queue-panel .panel-heading-reset{
font-size:30px;
font-weight:800;
letter-spacing:-.02em;
}
.unassigned-section .panel-heading-reset,
#assignedReportsHead h4{
font-size:22px;
font-weight:800;
letter-spacing:-.02em;
}
.report-section-divider{
display:none;
}
#assignedReportsHead{
display:none !important;
}
.inline-delete{
display:inline-flex;
align-items:center;
justify-content:flex-end;
gap:8px;
flex-wrap:wrap;
min-width:168px;
}
.inline-delete span{
font-size:12px;
font-weight:700;
color:#8f321f;
}
.button-inline{
padding:8px 12px;
font-size:12px;
box-shadow:none;
}
.table-wrap,
.admin-table-wrap{
padding:0 12px;
overflow-x:auto;
}
#reportTableWrap{
margin-top:10px;
border-radius:18px;
background:rgba(248,250,252,.72);
box-shadow:inset 0 0 0 1px rgba(16,35,63,.05);
max-height:680px;
overflow-y:auto;
overscroll-behavior:contain;
}
body:not(.is-authenticated) #reportTableWrap{
max-height:none;
overflow-y:visible;
overscroll-behavior:auto;
}
#archivedList{
max-height:720px;
overflow-y:auto;
overscroll-behavior:contain;
padding-right:4px;
}
table{
width:100%;
border-collapse:separate;
border-spacing:0 8px;
min-width:860px;
}
.admin-table{min-width:720px}
thead th{
text-align:left;
padding:0 14px 8px;
font-size:12px;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
color:#1b2c45;
background:#f2f5fb;
}
tbody tr{
background:rgba(255,255,255,.82);
box-shadow:0 10px 22px rgba(62,46,29,.06);
}
tbody tr:nth-child(even){
background:#f7f9fd;
}
tbody tr:hover{
background:#eef3ff;
box-shadow:0 10px 22px rgba(16,35,63,.12);
}
tbody td{
padding:9px 10px;
border-top:1px solid rgba(31,26,22,.08);
border-bottom:1px solid rgba(31,26,22,.08);
color:#0f1f2e;
font-weight:600;
}
#reportTable tbody td:nth-child(6),
#reportTable tbody td:nth-child(7),
#unassignedTable tbody td:nth-child(7),
#unassignedTable tbody td:nth-child(8){
text-align:right;
font-variant-numeric:tabular-nums;
}
#reportTable tbody td:nth-child(6) input,
#reportTable tbody td:nth-child(7) input{
text-align:right;
font-variant-numeric:tabular-nums;
}
tbody td:first-child{
border-left:1px solid rgba(31,26,22,.08);
border-top-left-radius:12px;
border-bottom-left-radius:12px;
}
tbody td:last-child{
border-right:1px solid rgba(31,26,22,.08);
border-top-right-radius:12px;
border-bottom-right-radius:12px;
}
tbody input{
width:100%;
padding:10px 11px;
border-radius:12px;
border:1px solid rgba(31,26,22,.18);
background:#fff;
font-size:15px;
font-weight:600;
color:#102033;
}
tbody input::placeholder{color:#8a94a6;font-weight:500;}
.report-demo-field{
display:flex;
align-items:center;
width:100%;
min-height:42px;
padding:10px 11px;
border-radius:12px;
border:1px solid rgba(31,26,22,.18);
background:#fff;
font-size:15px;
font-weight:600;
color:#102033;
pointer-events:none;
user-select:none;
}
.report-demo-field-numeric{
justify-content:flex-end;
font-variant-numeric:tabular-nums;
}
.report-demo-muted{
display:inline-flex;
align-items:center;
min-height:42px;
font-size:14px;
font-weight:600;
color:#516079;
pointer-events:none;
user-select:none;
}
.table-wrap input,
.table-wrap select{outline:none;}
.table-wrap input:focus,
.table-wrap select:focus{border-color:rgba(0,95,204,.6);box-shadow:0 0 0 2px rgba(0,95,204,.15);}
.table-wrap select{
width:100%;
padding:10px 11px;
border-radius:12px;
border:1px solid rgba(31,26,22,.18);
background:#fff;
font-size:15px;
font-weight:600;
color:#102033;
}
.empty-state{
padding:28px 24px 10px;
font-size:14px;
color:var(--muted);
}
.app-dialog-backdrop{
position:fixed;
inset:0;
background:rgba(12,24,44,.36);
backdrop-filter:blur(6px);
display:flex;
align-items:center;
justify-content:center;
padding:24px;
z-index:1000;
}
.app-dialog{
width:min(460px, 100%);
background:rgba(255,255,255,.96);
border:1px solid rgba(255,255,255,.72);
box-shadow:0 28px 70px rgba(12,38,84,.24);
border-radius:28px;
padding:22px;
}
.app-dialog-header{
display:flex;
align-items:flex-start;
justify-content:flex-start;
gap:16px;
margin-bottom:12px;
}
.app-dialog-kicker{
display:inline-flex;
align-items:center;
gap:8px;
padding:8px 12px;
border-radius:999px;
background:rgba(0,95,204,.08);
color:var(--accent-deep);
font-size:12px;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
}
.app-dialog h4{
margin:10px 0 6px;
font-family:"Sora",sans-serif;
font-size:24px;
line-height:1;
}
.app-dialog p{
margin:0;
font-size:14px;
line-height:1.6;
color:var(--muted);
}
.app-dialog-body{
display:grid;
gap:12px;
margin-top:6px;
}
.app-dialog-body label{
font-size:13px;
font-weight:700;
color:var(--ink);
}
.app-dialog-body input{
padding:10px 12px;
border-radius:12px;
border:1px solid rgba(16,35,63,.18);
background:#fff;
font-size:14px;
font-weight:600;
color:#0f1f2e;
}
.app-dialog-actions{
display:flex;
justify-content:flex-end;
gap:10px;
margin-top:22px;
}
.review-panel{
display:none;
margin-top:18px;
}
.review-panel.visible{display:block}
.review-content{
display:grid;
grid-template-columns:340px 1fr;
gap:22px;
padding:22px 24px 0;
}
.preview-wrap{
background:linear-gradient(180deg, #f5ede2, #ebe1d3);
border-radius:24px;
padding:18px;
border:1px solid rgba(31,26,22,.08);
}
.preview-frame{
background:#1f1a16;
border-radius:20px;
padding:14px;
}
#receiptPreview{
display:block;
width:100%;
max-height:500px;
object-fit:contain;
border-radius:14px;
}
.review-form{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
}
.review-actions{
display:flex;
align-items:center;
gap:12px;
flex-wrap:wrap;
padding:18px 24px 0;
}
.pricing{
  /* Let the inner pricing grid control layout; the section should span full content width */
  display:block;
  margin-top:14px;
}
.auth-pricing{
margin-top:14px;
}
.pricing-card{
  padding:20px;
  border-radius:24px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  min-width:260px;
}
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(280px,1fr));
  grid-template-areas:
    "free basic pro enterprise"
    "cta cta cta enterprise";
  gap:18px;
  align-items:start;
  width:100%;
}
.pricing-grid .pricing-card{
  height:100%;
}
.pricing-grid .pricing-card[data-plan="free"]{grid-area:free;}
.pricing-grid .pricing-card[data-plan="basic"]{grid-area:basic;}
.pricing-grid .pricing-card[data-plan="pro"]{grid-area:pro;}
.pricing-grid .pricing-card[data-plan="enterprise"]{grid-area:enterprise;}
.pricing-grid .pricing-shared-cta{
  grid-area:cta;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:14px;
  border:1px solid rgba(20,32,60,.12);
  border-radius:14px;
  background:#f8fafc;
}
.pricing-grid .pricing-helper{
  font-size:14px;
  color:#4a5b74;
}
.pricing-grid .pricing-enterprise{
  grid-column:auto;
}
.pricing-card h3{
margin:0;
font-family:"Sora",sans-serif;
font-size:22px;
}
.pricing-price{
font-size:14px;
font-weight:800;
color:var(--accent-deep);
margin:0;
}
.pricing-list{
display:grid;
gap:8px;
color:var(--muted);
font-size:12px;
margin-bottom:6px;
}
.pricing-list div{
padding-left:18px;
position:relative;
}
.pricing-list div::before{
content:"";
position:absolute;
left:0;
top:9px;
width:8px;
height:8px;
border-radius:50%;
background:var(--accent);
}
.pricing-card .button{
margin-top:auto;
align-self:flex-start;
}
.account-upgrade-card{
margin:14px 0 18px;
padding:16px 20px;
border-radius:20px;
background:linear-gradient(135deg,#12294a 0%, #173867 58%, #1c4d89 100%);
border:1px solid rgba(103,156,224,.22);
box-shadow:0 12px 24px rgba(9,28,56,.14);
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
color:#f5f8ff;
}
.account-upgrade-copy{
display:grid;
gap:4px;
max-width:620px;
}
.account-upgrade-kicker{
font-size:10px;
letter-spacing:.12em;
text-transform:uppercase;
font-weight:700;
color:rgba(220,232,255,.72);
}
.account-upgrade-copy strong{
font-size:17px;
line-height:1.2;
font-family:"Sora",sans-serif;
font-weight:700;
color:#fff;
}
.account-upgrade-copy span:last-child{
font-size:13px;
line-height:1.35;
color:rgba(235,242,255,.82);
}
.account-upgrade-card .button{
flex:0 0 auto;
align-self:center;
background:#fff;
color:#163761;
border:none;
box-shadow:none;
padding:12px 18px;
min-height:44px;
}
.account-upgrade-card .button:hover{
background:#f2f6ff;
}
.support-panel{
margin-top:18px;
}
.support-toggle{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
padding:18px 20px;
border:none;
background:transparent;
cursor:pointer;
text-align:left;
}
.support-toggle-copy{
display:grid;
gap:6px;
}
.support-toggle-copy strong{
font-size:17px;
font-family:"Sora",sans-serif;
color:var(--ink);
}
.support-toggle-copy span{
font-size:13px;
color:var(--muted);
}
.support-toggle-indicator{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:108px;
padding:10px 16px;
border-radius:999px;
background:rgba(0,95,204,.08);
border:1px solid rgba(0,95,204,.14);
font-size:12px;
font-weight:800;
color:var(--accent-deep);
}
.support-body{
padding-bottom:24px;
}
.support-form{
padding:24px 24px 0;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
}
.faq-panel{
margin-top:18px;
padding:16px;
background:#fff;
border:1px solid rgba(16,35,63,.08);
box-shadow:0 6px 16px rgba(16,35,63,.05);
opacity:.95;
}
.faq-list{
display:grid;
gap:12px;
margin-top:8px;
}
.faq-item{
border:1px solid rgba(0,95,204,.12);
border-radius:18px;
background:rgba(255,255,255,.72);
overflow:hidden;
}
.faq-item summary{
list-style:none;
cursor:pointer;
padding:16px 18px;
font-size:14px;
font-weight:800;
color:#0f1f2e;
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
}
.faq-item summary::-webkit-details-marker{
display:none;
}
.faq-item summary::after{
content:"+";
font-size:22px;
line-height:1;
color:var(--accent-deep);
flex-shrink:0;
}
.faq-item[open] summary::after{
content:"−";
}
.faq-answer{
padding:0 20px 18px;
color:var(--muted);
line-height:1.7;
}
.faq-answer p{
margin:0 0 12px;
}
.faq-answer p:last-child{
margin-bottom:0;
}
.faq-answer ul{
margin:0;
padding-left:20px;
}
.site-footer{
margin-top:24px;
padding:18px 20px;
border-radius:24px;
background:rgba(255,255,255,.78);
border:1px solid rgba(0,95,204,.1);
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
}
.footer-copy{
display:grid;
gap:4px;
}
.footer-copy strong{
font-size:13px;
color:var(--ink);
}
.footer-copy span{
font-size:12px;
color:var(--muted);
}
.footer-links{
display:flex;
flex-wrap:wrap;
gap:10px 14px;
}
.footer-links a{
font-size:13px;
font-weight:700;
color:var(--accent-deep);
text-decoration:none;
}
.footer-links a:hover{
text-decoration:underline;
}
.admin-grid{
display:grid;
grid-template-columns:340px minmax(0,1fr);
gap:18px;
align-items:start;
}
.admin-sidebar{
position:sticky;
top:18px;
align-self:start;
padding:18px;
border-radius:24px;
background:rgba(255,255,255,.72);
border:1px solid rgba(0,95,204,.1);
}
.admin-form{
padding:0;
display:grid;
grid-template-columns:1fr;
gap:14px;
}
.admin-editing-banner{
grid-column:1/-1;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
padding:12px 14px;
border-radius:16px;
background:rgba(0,95,204,.08);
border:1px solid rgba(0,95,204,.12);
}
.admin-editing-copy{
display:grid;
gap:3px;
}
.admin-editing-copy strong{
font-size:13px;
}
.admin-editing-copy span{
font-size:12px;
color:var(--muted);
}
.admin-help{
grid-column:1/-1;
margin:-2px 0 0;
font-size:13px;
color:var(--muted);
}
.admin-filter-row{
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
padding:0 0 14px;
flex-wrap:wrap;
}
.admin-filter-row .field{
min-width:220px;
}
.admin-filter-row select{
padding:10px 13px;
border-radius:14px;
border:1px solid var(--line);
background:rgba(255,255,255,.92);
font:inherit;
color:var(--ink);
}
.admin-summary-table{
width:100%;
border-collapse:collapse;
background:rgba(0,95,204,.05);
border:1px solid rgba(0,95,204,.12);
border-radius:18px;
overflow:hidden;
}
.admin-summary-table th,
.admin-summary-table td{
padding:12px 14px;
border-bottom:1px solid rgba(0,95,204,.1);
text-align:left;
vertical-align:top;
}
.admin-summary-table tr:last-child th,
.admin-summary-table tr:last-child td{
border-bottom:none;
}
.admin-summary-table th{
width:180px;
font-size:11px;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
color:var(--muted);
background:rgba(255,255,255,.48);
}
.admin-summary-table td{
font-size:14px;
font-weight:700;
color:var(--ink);
}
.admin-summary-row{
background:transparent;
box-shadow:none;
}
.admin-summary-row td{
padding:0 0 12px;
border:none;
}
.admin-summary-row td:first-child,
.admin-summary-row td:last-child{
border:none;
border-radius:0;
}
.admin-form-actions{
padding:16px 0 0;
display:flex;
gap:12px;
flex-wrap:wrap;
}
.admin-form-actions .button{
flex:1 1 160px;
}
.admin-results{
display:grid;
gap:14px;
}
.checkbox-field{
display:flex;
align-items:center;
gap:10px;
padding:14px 16px;
border-radius:16px;
border:1px solid rgba(31,26,22,.12);
background:rgba(255,255,255,.82);
}
.checkbox-field input{width:auto;margin:0}
.admin-table td small{
display:block;
margin-top:4px;
color:var(--muted);
}
.admin-access{
display:flex;
flex-direction:column;
gap:4px;
}
.admin-access strong{
font-size:13px;
}
.admin-access small{
margin:0;
}
.admin-meta{
display:flex;
flex-wrap:wrap;
gap:6px;
}
.admin-chip{
display:inline-flex;
align-items:center;
padding:6px 10px;
border-radius:999px;
background:rgba(0,95,204,.08);
border:1px solid rgba(0,95,204,.12);
font-size:12px;
font-weight:700;
color:var(--accent-deep);
}
.admin-table-scroll{
max-height:720px;
overflow:auto;
padding-right:6px;
}
@media (max-width:1080px){
.hero,
.review-content,
.pricing,
.admin-grid{
grid-template-columns:1fr;
}
.hero-copy{
grid-template-columns:1fr;
grid-template-areas:
"main"
"process"
"actions";
align-items:start;
}
.hero-process{
align-items:flex-start;
justify-content:flex-start;
justify-self:start;
align-self:start;
width:min(100%, 520px);
}
.hero-actions{
margin-top:0;
}
.table-tools .auth-actions select,
.table-tools .auth-actions .inline-input{
flex:1 1 200px;
}
.hero-flow-pill{
min-width:0;
width:auto;
max-width:100%;
white-space:normal;
}
.account-upgrade-card{
  flex-direction:column;
  align-items:flex-start;
}
.workflow-help-popover{
  width:min(100%, 430px);
}
.panel-head h3,
.subsection-head h4{
font-size:28px;
}
.admin-sidebar{
position:static;
}
.auth-grid{
grid-template-columns:1fr;
}
.auth-panel{
max-width:none;
}
.account-grid,
.account-summary,
.billing-summary{
grid-template-columns:1fr;
}
}

@media (max-width:1180px){
  .pricing-grid{
    grid-template-columns:repeat(2,minmax(260px,1fr));
    grid-template-areas:
      "free basic"
      "pro enterprise"
      "cta cta";
  }
}

@media (max-width:900px){
  .pricing-grid{
    grid-template-columns:1fr;
    grid-template-areas:
      "free"
      "basic"
      "pro"
      "cta"
      "enterprise";
  }
}
.draft-queue-panel{
margin-bottom:18px;
}
.draft-queue-list{
display:grid;
grid-template-columns:1fr;
gap:10px;
padding:0 24px 24px;
}
.draft-queue-card{
display:grid;
grid-template-columns:minmax(0, 1.4fr) minmax(220px, .9fr) auto;
align-items:center;
gap:14px;
padding:14px 18px;
border:1px solid rgba(31,26,22,.08);
border-radius:16px;
background:#fff;
box-shadow:0 6px 14px rgba(16,35,63,.04);
}
.draft-queue-card--ready{
display:grid;
grid-template-columns:minmax(0, 1fr) auto;
align-items:center;
padding:12px 18px;
gap:10px;
min-height:72px;
}
.draft-queue-head{
display:contents;
}
.draft-queue-main{
min-width:0;
}
.draft-queue-title{
font-weight:700;
font-size:16px;
color:var(--ink);
overflow-wrap:anywhere;
}
.draft-queue-meta{
display:flex;
flex-wrap:wrap;
gap:8px;
color:var(--muted);
font-size:14px;
align-items:center;
}
.draft-queue-error{
margin-top:4px;
color:#b53f2d;
font-size:13px;
}
.draft-queue-actions{
display:flex;
gap:8px;
align-items:center;
justify-content:flex-end;
flex-shrink:0;
}
.review-report-picker{
display:flex;
flex-wrap:wrap;
gap:10px;
align-items:center;
}
.review-report-picker select{
min-width:240px;
height:46px;
padding:0 44px 0 14px;
border:1px solid rgba(31,26,22,.14);
border-radius:14px;
background:#fff;
color:var(--ink);
font-size:16px;
font-weight:600;
box-shadow:0 1px 2px rgba(16,35,63,.04);
}
#draftNewReportInput{
min-width:240px;
height:46px;
padding:0 14px;
border:1px solid rgba(31,26,22,.14);
border-radius:14px;
background:#fff;
color:var(--ink);
font-size:16px;
font-weight:600;
box-shadow:0 1px 2px rgba(16,35,63,.04);
}
@media (max-width:720px){
.shell{padding:18px 14px 40px}
.shell{
display:flex;
flex-direction:column;
}
.field-row{
  grid-template-columns:1fr;
}
.site-nav{order:0}
#heroSection{order:1}
#positioningStrip{order:2}
#stepsSection{order:3}
#reportPanel{order:5}
#appFaqPanel{order:6}
#pagePricing{order:6}
#supportPanel{order:7}
#faqPanel{order:8}
#siteFooter{order:9}
body.is-authenticated #reportPanel{
  order:5 !important;
}
body.is-authenticated #appFaqPanel{
  order:6 !important;
}
.site-nav{
grid-template-columns:1fr;
gap:14px;
padding:16px;
}
.account-upgrade-card{
  margin:0 0 18px;
  padding:16px;
  border-radius:20px;
}
.account-upgrade-copy strong{
  font-size:16px;
}
.account-upgrade-card .button{
  width:100%;
}
.hero{
  margin-top:12px;
  margin-bottom:24px;
}
#reportPanel{
  margin-top:24px;
}
#archivedSection{
  margin-top:16px;
  margin-bottom:24px;
}
#archivedSection .archived-actions .button,
#archivedSection .archived-actions .button-ghost,
#archivedSection .archived-actions .button-primary,
#archivedSection .archived-actions .button-soft{
  padding:6px 10px;
  font-size:12px;
  min-height:32px;
}
#archivedSection .archived-card{
  padding:10px 10px;
  gap:8px;
}
#archivedSection .archived-meta{
  gap:8px;
  font-size:11px;
}
#faqPanel{
  margin-top:24px;
}
.brand-block{
align-items:flex-start;
gap:12px;
}
.brand-copy{
flex-direction:column;
align-items:flex-start;
gap:6px;
}
.brand-copy strong{
white-space:normal;
}
.brand-copy .brand-tagline{
max-width:100%;
font-size:13px;
line-height:1.35;
}
.hero-copy{
  width:100%;
  max-width:100%;
  grid-template-columns:1fr;
  gap:18px;
  padding:24px 18px;
  overflow:hidden;
}
.hero-copy h1{
  font-size:clamp(28px, 10vw, 44px);
  max-width:8ch;
}
.hero-copy p{
  max-width:100%;
  font-size:15px;
}
.hero-process{
  width:100%;
  align-items:flex-start;
  gap:8px;
}
.hero-actions{
  margin-top:6px;
}
.hero-cta-support{
  font-size:12px;
}
.hero-flow-pill{
  width:min(100%, 300px);
  min-width:220px;
  max-width:100%;
  padding:7px 12px;
  min-height:36px;
  justify-content:flex-start;
  text-align:left;
}
.hero-flow-pill-detail{
  font-size:11px;
}
.site-nav,
.positioning-strip,
.auth-panel,
.account-panel,
.hero-copy,
.pricing-card,
.panel,
.site-footer{
border-radius:22px;
}
.site-nav,
.nav-actions,
.hero-actions,
.upload-foot,
.table-tools,
.review-actions,
.auth-actions,
.auth-links,
.admin-form-actions,
.footer-links{
flex-direction:column;
align-items:stretch;
}
.button,
.file-input{
width:100%;
}
.nav-actions{
display:grid;
grid-template-columns:1fr;
gap:10px;
}
.nav-actions > *{
width:100%;
}
.support-toggle{
padding:18px;
}
.panel-head,
.subsection-head{
padding-left:18px;
padding-right:18px;
}
#authToggleLink{
margin-left:0;
}
.google-signin{
min-width:0;
width:100%;
}
.panel-head h3{
font-size:24px;
}
.subsection-head h4{
font-size:24px;
}
.usage-indicator,
.preview-banner,
.limit-banner{
margin-left:18px;
margin-right:18px;
}
.report-section-divider{
margin:24px 18px;
}
.report-controls,
.table-tools,
.review-actions{
padding-left:18px;
padding-right:18px;
}
.table-tools .auth-actions{
width:100%;
}
.table-tools .auth-actions select,
#reportSelector{
height:44px;
min-height:44px;
padding-top:8px;
padding-bottom:8px;
font-size:14px;
}
#unassignedReportSelector,
#unassignedNewReportInput{
  height:44px;
  min-height:44px;
  max-height:44px;
}
.support-form{
grid-template-columns:1fr;
padding-left:18px;
padding-right:18px;
}
.faq-panel{
padding:18px;
}
.draft-queue-list{
padding-left:18px;
padding-right:18px;
grid-template-columns:1fr;
}
.draft-queue-card{
grid-template-columns:1fr;
align-items:stretch;
gap:10px;
padding:14px 16px;
box-shadow:0 8px 18px rgba(16,35,63,.05);
}
.draft-queue-card--ready{
display:grid;
grid-template-columns:1fr;
justify-content:stretch;
align-items:stretch;
padding:14px 16px;
}
.draft-queue-head{
display:flex;
flex-direction:column;
}
.draft-queue-actions,
.review-report-picker{
justify-content:stretch;
}
.review-report-picker select,
#draftNewReportInput{
width:100%;
min-width:0;
}
.pricing-card .button{
align-self:stretch;
}
.account-actions-row{
flex-direction:column;
align-items:stretch;
}
.account-actions .button{
width:100%;
}
table{
min-width:760px;
}
}

@media (max-width:480px){
#reportTotalDisplay{
  display:none !important;
}
#reportTableWrap,
#unassignedSection{
  overflow-x:visible;
}
#reportTable,
#unassignedTable{
  min-width:0 !important;
  width:100%;
  table-layout:fixed;
  border-spacing:0;
}
#reportTable thead,
#unassignedTable thead{
  display:none;
}
#reportTable tbody,
#unassignedTable tbody{
  display:grid;
  gap:8px;
}
#reportTable tbody tr,
#unassignedTable tbody tr{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:4px 10px;
  margin:0;
  padding:10px 12px;
  border:1px solid rgba(31,26,22,.1);
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 18px rgba(16,35,63,.06);
}
#reportTable tbody td,
#unassignedTable tbody td{
  padding:0;
  border:none;
  background:transparent;
  min-width:0;
  white-space:normal;
  overflow-wrap:anywhere;
  box-shadow:none;
}

/* Report table mobile row layout:
   line 1 -> merchant | amount
   line 2 -> date | category
*/
#reportTable tbody tr{
  grid-template-areas:
    "merchant merchant amount"
    "date category category"
    "image . remove";
}
#reportTable tbody td:nth-child(3){grid-area:merchant;}
#reportTable tbody td:nth-child(6){grid-area:amount; justify-self:end; text-align:right;}
#reportTable tbody td:nth-child(1){grid-area:date;}
#reportTable tbody td:nth-child(4){grid-area:category;}
#reportTable tbody td:nth-child(8){grid-area:image;}
#reportTable tbody td:nth-child(9){grid-area:remove; justify-self:end;}
#reportTable tbody td:nth-child(2),
#reportTable tbody td:nth-child(5),
#reportTable tbody td:nth-child(7){
  display:none;
}

/* Unassigned table mobile row layout:
   line 1 -> merchant | amount
   line 2 -> date | category
*/
#unassignedTable tbody tr{
  grid-template-areas:
    "merchant merchant amount"
    "date category category"
    "select image remove";
}
#unassignedTable tbody td:nth-child(4){grid-area:merchant;}
#unassignedTable tbody td:nth-child(7){grid-area:amount; justify-self:end; text-align:right;}
#unassignedTable tbody td:nth-child(2){grid-area:date;}
#unassignedTable tbody td:nth-child(5){grid-area:category;}
#unassignedTable tbody td:nth-child(1){grid-area:select;}
#unassignedTable tbody td:nth-child(9){grid-area:image;}
#unassignedTable tbody td:nth-child(10){grid-area:remove; justify-self:end;}
#unassignedTable tbody td:nth-child(3),
#unassignedTable tbody td:nth-child(6),
#unassignedTable tbody td:nth-child(8){
  display:none;
}

/* Keep mobile rows readable and prevent clipped micro-text */
#reportTable tbody td:nth-child(3) input,
#reportTable tbody td:nth-child(6) input,
#reportTable tbody td:nth-child(1) input,
#reportTable tbody td:nth-child(3) .report-demo-field,
#reportTable tbody td:nth-child(6) .report-demo-field,
#reportTable tbody td:nth-child(1) .report-demo-field{
  border:none;
  background:transparent;
  padding:0;
  min-height:0;
  height:auto;
  border-radius:0;
  box-shadow:none;
}
#reportTable tbody td:nth-child(3) input{
  font-size:15px;
  font-weight:700;
  line-height:1.35;
}
#reportTable tbody td:nth-child(3) .report-demo-field{
  font-size:15px;
  font-weight:700;
  line-height:1.35;
}
#reportTable tbody td:nth-child(6) input{
  font-size:15px;
  font-weight:800;
  text-align:right;
}
#reportTable tbody td:nth-child(6) .report-demo-field{
  font-size:15px;
  font-weight:800;
  justify-content:flex-end;
  text-align:right;
}
#reportTable tbody td:nth-child(1) input{
  font-size:12px;
  color:#516079;
}
#reportTable tbody td:nth-child(1) .report-demo-field{
  font-size:12px;
  color:#516079;
}
#reportTable tbody td:nth-child(4) select{
  border:none;
  background:transparent;
  padding:0 16px 0 0;
  height:auto;
  min-height:0;
  font-size:12px;
  font-weight:600;
  color:#516079;
  text-align:left;
  border-radius:0;
  box-shadow:none;
}
#reportTable tbody td:nth-child(4) .report-demo-field{
  border:none;
  background:transparent;
  padding:0;
  min-height:0;
  height:auto;
  font-size:12px;
  font-weight:600;
  color:#516079;
  text-align:left;
  border-radius:0;
  box-shadow:none;
}
#reportTable tbody td:nth-child(4){
  justify-self:end;
}

#unassignedTable tbody td:nth-child(4){
  font-size:15px;
  font-weight:700;
  line-height:1.35;
}
#unassignedTable tbody td:nth-child(7){
  font-size:15px;
  font-weight:800;
}
#unassignedTable tbody td:nth-child(2),
#unassignedTable tbody td:nth-child(5){
  font-size:12px;
  color:#516079;
}
#unassignedTable tbody td:nth-child(5){
  justify-self:end;
}

/* Compact action controls in mobile list rows */
#reportTable tbody td:nth-child(8) .button,
#reportTable tbody td:nth-child(9) .button,
#unassignedTable tbody td:nth-child(9) .button,
#unassignedTable tbody td:nth-child(10) .button{
  min-height:30px;
  padding:6px 10px;
  font-size:12px;
  border-radius:10px;
  width:auto;
}
#unassignedTable tbody td:nth-child(1) input[type="checkbox"]{
  width:18px;
  height:18px;
}
}