@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:wght@500;700&display=swap');
:root{--bg:#eef1f4;--card:#fff;--ink:#1b2430;--mute:#5b6675;--line:#d5dbe2;--acc:#7a1f2b;--acc-ink:#fff;--late:#b3261e}
@media(prefers-color-scheme:dark){:root{--bg:#141a22;--card:#1d2530;--ink:#e8ecf1;--mute:#98a3b2;--line:#2f3a48;--acc:#d98a94;--acc-ink:#1b1015;--late:#ff8a80}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif}
h1,h2,.brand{font-family:"Source Serif 4",Georgia,serif}
h1{font-size:2rem;margin:.2em 0}h2{font-size:1.3rem;margin:1.6em 0 .5em}
header{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.5rem;padding:.8rem 1.2rem;background:var(--card);border-bottom:1px solid var(--line)}
.brand{font-size:1.25rem;color:var(--acc)}
nav{display:flex;flex-wrap:wrap;gap:.2rem}
nav a,.tabs a{padding:.35rem .7rem;border-radius:6px;color:var(--mute);text-decoration:none}
nav a.on,.tabs a.on{background:var(--acc);color:var(--acc-ink)}
nav a:hover,.tabs a:hover{color:var(--ink)}
main{max-width:960px;margin:0 auto;padding:1.2rem}
a{color:var(--acc)}
.lead{color:var(--mute);margin-top:0}
.empty{color:var(--mute)}
table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:8px;overflow:hidden;display:block;overflow-x:auto}
th,td{padding:.6rem .8rem;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
th{font-weight:600;color:var(--mute);font-size:.9rem}
.late{color:var(--late);font-weight:600}
input,select,textarea,button{font:inherit;color:inherit}
input,select,textarea{width:100%;padding:.55rem .7rem;background:var(--card);border:1px solid var(--line);border-radius:6px}
input:focus,select:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
button{padding:.55rem 1rem;background:var(--acc);color:var(--acc-ink);border:0;border-radius:6px;cursor:pointer;font-weight:600}
button.link{background:none;color:var(--acc);padding:0;font-weight:400;text-decoration:underline}
.card{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:1rem;margin:1rem 0}
summary{cursor:pointer;font-weight:600}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:.8rem}
.grid .wide,.grid button{grid-column:1/-1}.grid button{justify-self:start}
label{display:block;font-size:.9rem;color:var(--mute)}label input,label select,label textarea{margin-top:.2rem;color:var(--ink)}
.inline{display:flex;flex-wrap:wrap;gap:.6rem;margin:.8rem 0}.inline input,.inline select{width:auto;flex:1 1 160px}
.filter{margin:.8rem 0}
.tabs{display:flex;flex-wrap:wrap;gap:.2rem}
.pill{padding:.1rem .6rem;border-radius:99px;font-size:.85rem;background:var(--line)}
.s-open{background:#d6ecd9;color:#1d5a2b}.s-pending{background:#fbe9c0;color:#7a5200}.s-closed{background:#dfe3e8;color:#4a5563}.s-onhold{background:#e3dbf3;color:#4b2f85}
.note{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--acc);border-radius:6px;padding:.7rem 1rem;margin:.6rem 0}
.note p{margin:.3rem 0}.note small,.doc small,.hit small{color:var(--mute)}
.note form,.doc form{display:inline}.doc{display:flex;gap:.8rem;align-items:center}
.desc{max-width:70ch}.danger{margin-top:2.5rem}.err{color:var(--late)}
.src li{margin:.3rem 0}
.act{display:flex;gap:1rem}
.login{display:grid;place-items:center;min-height:100vh}.box{background:var(--card);padding:2rem;border-radius:10px;border:1px solid var(--line);width:min(360px,92vw);display:grid;gap:.8rem}
@media(max-width:600px){.grid{grid-template-columns:1fr}}
.flash{background:#d6ecd9;color:#1d5a2b;padding:.6rem 1rem;border-radius:6px;margin-bottom:1rem}
.totals{font-weight:600;text-align:right;margin:.4rem 0}
.who{color:var(--mute);font-size:.9rem;margin-left:auto}

.hp{position:absolute;left:-9999px;width:1px}
.box a{font-size:.9rem;text-align:center}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.8rem;margin:1rem 0}
.gallery figure{margin:0;background:var(--card);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.gallery img{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.gallery figcaption{padding:.4rem .6rem;font-size:.85rem;word-break:break-word}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.88);display:grid;place-items:center;z-index:10;cursor:zoom-out}
.lightbox img{max-width:94vw;max-height:94vh}

.s-draft{background:#e3e7ec;color:#4a5563}.s-sent{background:#fbe9c0;color:#7a5200}.s-paid{background:#d6ecd9;color:#1d5a2b}.s-void{background:#f3d6d3;color:#8a1c14}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;margin:.8rem 0}
.cal>b{text-align:center;font-size:.8rem;color:var(--mute)}
.cal>div{min-height:72px;background:var(--card);border:1px solid var(--line);padding:2px 3px;font-size:.72rem;overflow:hidden;word-break:break-word}
.cal>div.blank{background:none;border:0}.cal>div.today{border:2px solid var(--acc)}.cal i{display:block;font-style:normal;font-weight:600;color:var(--mute)}
.cal span,.cal a{display:block}.cal .done{text-decoration:line-through;color:var(--mute)}
.invoice{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:1.2rem}
@media print{header,.noprint,.flash{display:none!important}body{background:#fff;color:#000}.invoice{border:0;padding:0}main{max-width:none}}
