:root{--dm-bg:#e4f0ed;--dm-surface:#f7fbfa;--dm-text:#16312e;--dm-accent:#0f766e;--dm-accent-strong:#0b5f59;--dm-muted:#315550;--dm-focus:#14b8a6}*{box-sizing:border-box}body{max-width:1100px;margin:0 auto;padding:0 1rem;color:var(--dm-text)}.site-header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;padding:2.5rem 0 1.5rem;border-bottom:3px double var(--dm-text)}h1,h2,h3{letter-spacing:.02em}.site-header h1{margin:.1rem 0;font-size:clamp(2rem,6vw,4rem)}.tagline{margin:.5rem 0 0;color:var(--dm-muted);font-size:1.1rem}.eyebrow{font-size:.72rem;letter-spacing:.16em;font-weight:700;margin:0;color:var(--dm-accent)}.header-actions,.button-row,.form-actions{display:flex;gap:.5rem;flex-wrap:wrap}.tabs{display:flex;gap:.25rem;border-bottom:1px solid var(--dm-text);padding-top:1rem}.tabs button{border:0;border-bottom:3px solid transparent;background:transparent;padding:.75rem 1rem}.tabs button.active{border-color:var(--dm-accent);font-weight:700}.view{padding:2rem 0}.section-heading,.panel-heading{display:flex;justify-content:space-between;gap:1rem;align-items:baseline}.section-heading h2{margin:.25rem 0 1.25rem}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1rem}.stat-card{display:grid;gap:.35rem;padding:1rem;border:2px solid var(--dm-text);box-shadow:4px 4px 0 var(--dm-text)}.stat-card span,.stat-card small{color:var(--dm-muted)}.stat-card strong{font-size:clamp(1.35rem,3vw,2rem)}.report-grid,.data-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}.panel{padding:1.25rem;margin-bottom:1rem}.panel h3{margin-top:0}.bars{display:grid;gap:.65rem}.bar-row{display:grid;grid-template-columns:minmax(90px,1fr) 2fr auto;align-items:center;gap:.65rem;font-size:.9rem}.bar-track{height:1rem;background:rgba(43,36,29,.15);border:1px solid var(--dm-text)}.bar-fill{height:100%;background:var(--dm-accent)}.list-report,.expense-list{display:grid;gap:.5rem}.report-line,.expense-row{display:flex;justify-content:space-between;gap:1rem;padding:.65rem 0;border-bottom:1px dotted var(--dm-muted)}.expense-row small{display:block;color:var(--dm-muted)}.expense-row strong{white-space:nowrap}.empty{color:var(--dm-muted);font-style:italic}.form-panel{max-width:760px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-grid label{display:grid;gap:.35rem}.form-grid .wide{grid-column:1/-1}.form-grid input,.form-grid select,.form-grid textarea{width:100%;font:inherit;padding:.7rem;border:2px solid var(--dm-text);background:var(--dm-surface);color:var(--dm-text)}.form-actions{justify-content:flex-end;margin-top:1rem}.form-message{min-height:1.4em;color:var(--dm-accent)}.file-picker{display:inline-block;border:2px solid var(--dm-text);padding:.6rem 1rem;cursor:pointer}.file-picker input{display:none}.import-preview{margin-top:1rem;padding:1rem;border:1px dashed var(--dm-text)}.danger-zone{border-color:var(--dm-accent)}.danger-zone button{border-color:var(--dm-accent);color:var(--dm-accent)}footer{display:flex;justify-content:space-between;border-top:1px solid var(--dm-text);padding:1rem 0 2rem;color:var(--dm-muted);font-size:.85rem}.receipt-panel{max-width:760px}.ocr-fallback{display:grid;gap:.5rem;margin-top:1rem}.ocr-fallback textarea{width:100%;font:inherit}.items-editor{margin-top:1.5rem;padding-top:1rem;border-top:1px dotted var(--dm-muted)}.item-row{display:grid;grid-template-columns:2fr .7fr 1fr 1.3fr auto;gap:.4rem;margin:.5rem 0}.item-row input,.category-row input,.category-editor>div input{min-width:0;padding:.55rem;border:1px solid var(--dm-text);background:#dff3ef;color:var(--dm-text);font:inherit}.item-row button,.category-row button{padding:.35rem .65rem}.category-editor{display:grid;gap:.5rem}.category-row{display:flex;gap:.5rem}.category-row input{flex:1}.category-editor .button-row input{flex:1;min-width:140px}@media(max-width:680px){.item-row{grid-template-columns:1fr 1fr 1fr auto}.item-row input:first-child{grid-column:1/-1}.item-row input:nth-child(4){grid-column:1/4}}

/* Legibilidad: la textura debe acompañar al texto, no competir con él. */
html{-webkit-font-smoothing:antialiased}body{font-size:16px;line-height:1.5}.tagline,.empty,footer,.stat-card span,.stat-card small,.expense-row small{color:#315550}.panel,.stat-card{background-color:rgba(247,240,227,.9)}.panel p{max-width:70ch;color:#315550}.panel h3,.section-heading h2{color:#23413d}.bar-row,.report-line,.expense-row{color:#23413d}.bar-row strong,.report-line strong,.expense-row strong,.stat-card strong{font-variant-numeric:tabular-nums;color:#23413d}.form-grid label>span{font-weight:700;color:#23413d}.form-grid input,.form-grid select,.form-grid textarea{background-color:#dff3ef;border-color:#28504b}.form-grid input::placeholder,.form-grid textarea::placeholder{color:#315550;opacity:1}.tabs button{color:#315550;font-weight:600}.tabs button.active{color:#0b5f59}.header-actions button,.button-row button,.form-actions button,.section-heading button,.file-picker{color:#23413d;font-weight:700}.bar-track{background-color:rgba(33,26,21,.18)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #0b5f59;outline-offset:3px}@media(max-width:680px){body{padding:0 .85rem}.view{padding-top:1.5rem}.panel{padding:1rem}.site-header h1{font-size:clamp(2rem,12vw,3rem)}.tagline{font-size:1rem}}.ocr-progress{display:flex;align-items:center;gap:.65rem;margin:.5rem 0 1rem;color:var(--dm-muted);font-size:.85rem}.progress-track{height:.7rem;flex:1;overflow:hidden;border:1px solid var(--dm-text);background:rgba(33,26,21,.12)}.progress-fill{height:100%;background:var(--dm-accent);transition:width .45s ease}.ocr-debug{margin:.75rem 0;color:var(--dm-muted);font-size:.82rem}.ocr-debug pre{white-space:pre-wrap;overflow-wrap:anywhere;padding:.75rem;background:#dff3ef;border:1px solid var(--dm-muted)}.form-message.is-processing{color:var(--dm-accent);animation:processing-pulse 1.15s ease-in-out infinite}.form-message.is-processing::after{content:' ·';animation:processing-dots 1.15s steps(3,end) infinite}@keyframes processing-pulse{0%,100%{opacity:.58;transform:translateY(0)}50%{opacity:1;transform:translateY(-1px)}}@keyframes processing-dots{0%{content:' ·'}33%{content:' ··'}66%,100%{content:' ···'}}@media(prefers-reduced-motion:reduce){.form-message.is-processing,.form-message.is-processing::after{animation:none}}

/* Contraste: scanlines muy tenues y tipografía más legible sin perder el estilo retro. */
:root{--dm-scanlines:1;--dm-texture-color:rgba(15,118,110,.025)}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-weight:500}
strong,button,.file-picker,h1,h2,h3{font-weight:700}

body[data-texture-preset="vintage"]{--dm-texture-color:rgba(60,40,20,.07)}

/* UX polish: hierarchy, touch targets and responsive summaries. */
button,.file-picker{min-height:42px;transition:background-color .15s ease,color .15s ease,border-color .15s ease,transform .15s ease}button:hover,.file-picker:hover{border-color:var(--dm-accent);color:var(--dm-accent-strong)}button:active,.file-picker:active{transform:scale(.96)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--dm-focus);outline-offset:3px}.panel,.stat-card{background-color:rgba(247,251,250,.92)}.panel p{color:#315550}.bar-track{background-color:rgba(15,118,110,.14)}.ocr-fallback{padding:1rem;border:1px solid rgba(15,118,110,.35);background:rgba(223,243,239,.7);border-radius:4px}.ocr-fallback label{font-weight:700;color:var(--dm-text)}.ocr-fallback textarea{padding:.7rem;border:2px solid var(--dm-muted);background:#f7fbfa;color:var(--dm-text)}.ocr-fallback button{justify-self:start}.ocr-progress{margin-top:1rem}.ocr-progress span{font-variant-numeric:tabular-nums;min-width:3ch;text-align:right;font-weight:700;color:var(--dm-accent-strong)}.danger-zone{border-color:#9f3d4b}.danger-zone button{border-color:#9f3d4b;color:#9f3d4b}@media(max-width:680px){.stats{grid-template-columns:1fr}.report-grid,.data-grid{grid-template-columns:1fr}.site-header{padding-top:1.5rem}.tabs{overflow-x:auto}.tabs button{flex:0 0 auto}.section-heading,.panel-heading{align-items:flex-start;flex-direction:column;gap:.35rem}.form-actions{justify-content:stretch}.form-actions button{flex:1}.button-row>*{flex:1}.file-picker{text-align:center}}
