:root{
  --ase-bg:#f7f5f1;
  --ase-panel:#ffffff;
  --ase-panel-soft:#fbfaf7;
  --ase-text:#27231f;
  --ase-muted:#81786f;
  --ase-line:#e7e0d7;
  --ase-line-strong:#d8cec2;
  --ase-accent:#8a6a49;
  --ase-accent-dark:#4d3c31;
  --ase-shadow:0 18px 44px rgba(49,39,31,.08);
  --ase-shadow-soft:0 8px 24px rgba(49,39,31,.06);
  --ase-radius:18px;
  --ase-radius-sm:12px;
}

*{box-sizing:border-box}

body{
  margin:0;
  background:
    radial-gradient(circle at 8% 0%, rgba(155,120,82,.08), transparent 28%),
    linear-gradient(180deg,#fbfaf7 0%,var(--ase-bg) 100%);
  color:var(--ase-text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
  letter-spacing:.01em;
}

a{
  color:inherit;
  text-decoration:none;
}

a:hover{
  color:var(--ase-accent);
}

header,
.topbar,
.site-header,
.admin-header{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(255,255,255,.88);
  backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--ase-line);
  box-shadow:0 8px 30px rgba(0,0,0,.035);
}

header > *,
.topbar > *,
.site-header > *,
.admin-header > *{
  max-width:1320px;
  margin:0 auto;
}

nav,
.nav,
.tabs{
  display:flex;
  align-items:center;
  gap:6px;
}

nav a,
.nav a,
.tabs a{
  display:inline-flex;
  align-items:center;
  min-height:46px;
  padding:0 14px;
  border-radius:999px;
  color:#5f564e;
  font-size:14px;
  font-weight:650;
}

nav a:hover,
.nav a:hover,
.tabs a:hover{
  background:#f0ebe3;
  color:var(--ase-accent-dark);
}

nav a.active,
.nav a.active,
.tabs a.active,
nav a[aria-current="page"]{
  background:#efe5da;
  color:var(--ase-accent-dark);
}

main,
.container,
.wrap,
.page{
  max-width:1320px;
  margin:0 auto;
  padding:28px 28px 72px;
}

h1{
  margin:0 0 20px;
  font-size:30px;
  line-height:1.2;
  letter-spacing:-.02em;
  color:#1f1c19;
}

h2{
  margin:24px 0 14px;
  font-size:22px;
  line-height:1.28;
}

p{
  line-height:1.72;
}

form{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 24px;
  padding:16px;
  background:rgba(255,255,255,.86);
  border:1px solid var(--ase-line);
  border-radius:var(--ase-radius);
  box-shadow:var(--ase-shadow-soft);
}

input,
select,
textarea{
  min-height:42px;
  border:1px solid var(--ase-line-strong);
  border-radius:12px;
  background:#fff;
  color:var(--ase-text);
  font-size:14px;
  outline:none;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

input,
select{
  padding:0 13px;
}

textarea{
  padding:12px 13px;
}

input:focus,
select:focus,
textarea:focus{
  border-color:#9b7b5b;
  box-shadow:0 0 0 4px rgba(138,106,73,.12);
}

button,
.btn,
input[type="submit"],
form a[href*="clear"],
form a[href*="reset"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 18px;
  border:0;
  border-radius:12px;
  background:var(--ase-accent-dark);
  color:#fff;
  font-weight:750;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}

button:hover,
.btn:hover,
input[type="submit"]:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(77,60,49,.18);
  background:#3f3128;
  color:#fff;
}

form a[href*="clear"],
form a[href*="reset"],
a[href*="clear"]{
  background:transparent;
  color:var(--ase-muted);
  box-shadow:none;
  font-weight:650;
}

form a[href*="clear"]:hover,
a[href*="clear"]:hover{
  background:#f0ebe3;
  color:var(--ase-accent-dark);
}

.grid,
.cards,
.product-grid,
.list{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(238px,1fr));
  gap:22px;
  align-items:stretch;
}

.card,
.product-card,
.item,
.product-item,
article{
  background:rgba(255,255,255,.92);
  border:1px solid var(--ase-line);
  border-radius:var(--ase-radius);
  box-shadow:var(--ase-shadow-soft);
  overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.card:hover,
.product-card:hover,
.item:hover,
.product-item:hover,
article:hover{
  transform:translateY(-3px);
  box-shadow:var(--ase-shadow);
  border-color:#d5c5b3;
}

.card img,
.product-card img,
.item img,
.product-item img,
article img{
  display:block;
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:contain;
  background:linear-gradient(180deg,#fff 0%,#f6f2eb 100%);
  padding:14px;
}

.card h3,
.product-card h3,
.item h3,
.product-item h3,
article h3{
  margin:14px 16px 8px;
  font-size:18px;
  line-height:1.35;
  color:var(--ase-accent);
}

.card div,
.product-card div,
.item div,
.product-item div,
article div{
  line-height:1.55;
}

.badge,
.tag,
.pill,
.status,
[class*="badge"]{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:24px;
  padding:0 9px;
  border-radius:999px;
  background:#f0ebe3;
  color:#74583f;
  font-size:12px;
  font-weight:700;
}

table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
  border:1px solid var(--ase-line);
  border-radius:var(--ase-radius);
  overflow:hidden;
  box-shadow:var(--ase-shadow-soft);
}

th{
  background:#f3eee7;
  color:#5b4d40;
  font-size:13px;
  font-weight:800;
  text-align:left;
}

th,
td{
  padding:13px 14px;
  border-bottom:1px solid var(--ase-line);
  vertical-align:middle;
}

tr:last-child td{
  border-bottom:0;
}

tr:hover td{
  background:#fbf8f3;
}

td img{
  width:58px;
  height:58px;
  border-radius:12px;
  object-fit:contain;
  background:#f7f3ed;
  border:1px solid var(--ase-line);
}

.empty,
.empty-state,
.no-results{
  margin:34px auto;
  max-width:520px;
  padding:44px 28px;
  text-align:center;
  color:var(--ase-muted);
  background:#fff;
  border:1px dashed #d8cec2;
  border-radius:var(--ase-radius);
}

.multi-filter summary{
  border-radius:12px !important;
  border-color:var(--ase-line-strong) !important;
}

.multi-filter-panel{
  border-radius:14px !important;
  box-shadow:var(--ase-shadow) !important;
}

dt{
  color:var(--ase-muted);
  font-size:13px;
}

dd{
  margin:0 0 12px;
  font-weight:700;
}

@media (max-width:760px){
  main,
  .container,
  .wrap,
  .page{
    padding:20px 14px 56px;
  }

  form{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    padding:12px;
  }

  input,
  select,
  button,
  .btn{
    width:100%;
  }

  .grid,
  .cards,
  .product-grid,
  .list{
    grid-template-columns:1fr 1fr;
    gap:14px;
  }

  h1{
    font-size:24px;
  }

  table{
    display:block;
    overflow-x:auto;
  }
}
