:root { --green:#246b45; --green-dark:#174c31; --mint:#e9f3ec; --ink:#1c2520; --muted:#6d776f; --line:#e1e6e2; --surface:#fff; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; font-family:system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--ink); background:#f5f7f3; }
body { padding-bottom:84px; }
.app-header { height:64px; display:flex; align-items:center; gap:10px; max-width:1060px; margin:auto; padding:0 20px; font-weight:800; font-size:1.05rem; background:#fff; }
.header-logo { width:30px; height:30px; border-radius:8px; object-fit:cover; }
.app-shell { min-height:100vh; }
.app-main { max-width:1060px; margin:auto; padding:24px 16px 60px; }
.search-card { background:linear-gradient(135deg,#fff 45%,#edf5ed); border:1px solid var(--line); border-radius:24px; padding:28px; box-shadow:0 12px 36px rgba(24,61,39,.06); }
.eyebrow { color:var(--green); font-size:.76rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
h1 { font-size:clamp(1.8rem,5vw,2.7rem); line-height:1.18; margin:8px 0 26px; } h1 strong { color:var(--green); }
.form-grid { display:grid; gap:16px; grid-template-columns:repeat(2,minmax(0,1fr)); }
label { display:grid; gap:7px; color:#3d4740; font-size:.84rem; font-weight:700; }
.form-control,.form-select { min-height:48px; border-color:#d8dfda; border-radius:11px; background-color:#fff; }
.form-control:focus,.form-select:focus { border-color:var(--green); box-shadow:0 0 0 .2rem rgba(36,107,69,.12); }
.search-actions { display:flex; gap:10px; margin-top:20px; }
.btn-search { min-height:50px; flex:1; border:0; border-radius:12px; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; gap:8px; color:#fff; background:var(--green); font-weight:800; text-decoration:none; }
.btn-search:hover { background:var(--green-dark); color:#fff; }.btn-search:disabled { opacity:.6; }
.btn-favorite { width:52px; border:1px solid #cfd9d1; border-radius:12px; color:var(--green); background:#fff; font-size:1.7rem; }
.notice { margin:18px 0; padding:18px 20px; display:grid; gap:4px; border-radius:14px; color:#255e3e; background:#e8f3eb; }.notice span { color:#547060; }.notice.error { color:#8a2d2d; background:#fff0ef; }.validation { color:#a33; margin-bottom:16px; }
.results-head { display:flex; align-items:end; justify-content:space-between; gap:16px; margin:36px 2px 16px; }.results-head h2 { margin:4px 0 0; }.sort-select { width:auto; min-width:180px; }
.summary-grid { display:grid; grid-template-columns:repeat(4,1fr); background:var(--green-dark); color:#fff; border-radius:18px; overflow:hidden; }.summary-grid div { padding:19px; border-right:1px solid rgba(255,255,255,.12); display:grid; gap:4px; }.summary-grid span { opacity:.7; font-size:.78rem; }.summary-grid strong { font-size:1.15rem; }
.filters { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:14px 0; }.auction-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.auction-card { padding:21px; border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:0 5px 18px rgba(35,60,42,.04); }.card-top { display:flex; align-items:start; justify-content:space-between; gap:12px; }.category { color:var(--muted); font-size:.73rem; }.auction-card h3 { margin:3px 0 0; font-size:1.22rem; }.price { color:var(--green); white-space:nowrap; font-size:1.55rem; }.auction-time { margin-top:16px; font-weight:700; }.market { margin-top:4px; color:var(--muted); font-size:.86rem; }
.auction-card dl { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:18px 0 0; padding-top:16px; border-top:1px solid var(--line); }.auction-card dl div { min-width:0; }.auction-card dt { color:var(--muted); font-size:.72rem; }.auction-card dd { margin:3px 0 0; font-size:.87rem; font-weight:700; overflow-wrap:anywhere; }
.bottom-nav { position:fixed; z-index:10; bottom:0; left:0; right:0; height:72px; display:flex; justify-content:center; gap:min(12vw,100px); border-top:1px solid var(--line); background:rgba(255,255,255,.96); backdrop-filter:blur(12px); }.bottom-nav a { min-width:76px; padding:9px 5px; display:grid; place-items:center; gap:1px; color:#768078; font-size:.72rem; font-weight:700; text-decoration:none; }.bottom-nav a span { font-size:1.3rem; line-height:1; }.bottom-nav a.active { color:var(--green); }
.page-title { margin:8px 0 24px; }.page-title h1 { margin:7px 0; }.page-title p { color:var(--muted); }.settings-card { max-width:600px; display:grid; gap:17px; padding:24px; border:1px solid var(--line); border-radius:18px; background:#fff; }.saved { margin:0; color:var(--green); text-align:center; font-weight:700; }
.empty-state { padding:60px 20px; text-align:center; border:1px dashed #ccd6cf; border-radius:18px; background:#fff; }.empty-state>span { color:var(--green); font-size:3rem; }.empty-state .btn-search { max-width:220px; margin:20px auto 0; }.preset-list { display:grid; gap:10px; }.preset-list article { display:flex; justify-content:space-between; align-items:center; padding:8px 12px 8px 8px; border:1px solid var(--line); border-radius:14px; background:#fff; }.preset-list .preset-load { flex:1; display:grid; gap:4px; padding:10px; border:0; text-align:left; background:transparent; color:var(--text); }.preset-list .preset-load:hover strong { color:var(--green); }.preset-list article span { color:var(--muted); font-size:.8rem; }.preset-list .preset-delete { border:0; padding:10px; background:transparent; color:#999; font-size:1.4rem; }
#blazor-error-ui { display:none; position:fixed; bottom:72px; left:0; right:0; padding:12px; background:#ffecb5; z-index:20; }.dismiss { float:right; cursor:pointer; }
@media (max-width:700px) { .app-header { height:56px; }.app-main { padding:14px 12px 40px; }.search-card { padding:22px 18px; border-radius:19px; }.form-grid { grid-template-columns:1fr; gap:13px; }.summary-grid { grid-template-columns:1fr 1fr; }.summary-grid div { border-bottom:1px solid rgba(255,255,255,.12); }.auction-list { grid-template-columns:1fr; }.results-head { align-items:stretch; flex-direction:column; }.sort-select { width:100%; }.auction-card dl { grid-template-columns:repeat(2,1fr); }.filters { grid-template-columns:1fr; }.price { font-size:1.35rem; } }