:root { --ink:#1c2f32; --paper:#f5f5f2; --cyan:#279ead; --magenta:#a93c6a; --muted:#677579; --line:#d8dfdd; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; } button,input,select,textarea { font:inherit; }
.site-header { background:var(--ink); color:white; padding:1.1rem max(1.25rem,calc((100% - 1120px)/2)); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { text-decoration:none; font-size:1.3rem; letter-spacing:.08em; font-weight:700; }.brand span { color:#88d8df; }.brand small { display:block; font-size:.63rem; letter-spacing:.18em; opacity:.7; }
.container { max-width:1120px; padding:2rem 1.25rem 4rem; margin:auto; }.hero { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:1.6rem; }.hero h1 { margin:0; font-size:clamp(2rem,5vw,3.7rem); letter-spacing:-.05em; }.hero p { margin:.35rem 0 0; color:var(--muted); }
.button { display:inline-block; border:0; border-radius:4px; background:var(--cyan); color:#082126; padding:.62rem .85rem; cursor:pointer; text-decoration:none; font-weight:700; }.button.secondary { background:white; color:var(--ink); border:1px solid var(--line); }.button.danger { background:var(--magenta); color:white; }
.filters,.form-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; }.filters { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:1rem 0; margin-bottom:1.5rem; } label { display:grid; gap:.3rem; font-size:.84rem; font-weight:650; } input,select,textarea { width:100%; border:1px solid var(--line); border-radius:4px; padding:.55rem; background:white; color:var(--ink); } textarea { min-height:100px; resize:vertical; }.wide { grid-column:span 2; }.full { grid-column:1/-1; }
.count { color:var(--muted); margin:0 0 .75rem; font-size:.9rem; }.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(225px,1fr)); gap:1rem; }.card { background:#fff; border:1px solid var(--line); text-decoration:none; display:flex; flex-direction:column; min-height:250px; }.thumb { height:150px; background:#dfe8e7; display:grid; place-items:center; color:var(--muted); overflow:hidden; }.thumb img { width:100%; height:100%; object-fit:cover; }.card-body { padding:1rem; }.eyebrow { color:var(--magenta); text-transform:uppercase; font-size:.7rem; font-weight:800; letter-spacing:.08em; }.card h2 { margin:.25rem 0 .6rem; font-size:1.15rem; }.meta { color:var(--muted); font-size:.88rem; }.pill { display:inline-block; font-size:.75rem; border:1px solid var(--line); border-radius:99px; padding:.14rem .5rem; margin-top:.7rem; }.item { display:grid; grid-template-columns:minmax(220px,340px) 1fr; gap:2rem; background:white; border:1px solid var(--line); padding:1.25rem; }.item h1 { margin:0 0 .25rem; }.details { display:grid; grid-template-columns:repeat(2,1fr); gap:.6rem 1rem; margin:1.2rem 0; }.details div { border-bottom:1px solid var(--line); padding-bottom:.45rem; }.details dt { font-size:.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:.07em; }.details dd { margin:.15rem 0 0; }.alert { background:#fae7ef; border-left:4px solid var(--magenta); padding:.75rem; margin-bottom:1rem; }.login { max-width:400px; margin:10vh auto; background:white; padding:2rem; border:1px solid var(--line); }.actions { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1.3rem; }.empty { border:1px dashed var(--line); color:var(--muted); padding:3rem; text-align:center; }
@media (max-width:720px) { .filters,.form-grid { grid-template-columns:1fr 1fr; }.wide { grid-column:span 2; }.item { grid-template-columns:1fr; }.site-header,.hero { align-items:flex-start; flex-direction:column; }.full { grid-column:1/-1; } }