*{ box-sizing:border-box; }

:root{
  --bg:#f6f6f6;
  --text:#111;

  --card:#fff;
  --border:#e7e7e7;
  --border-soft:rgba(0,0,0,0.08);

  --plink:#111;
  --plink-hover:#0b63ce;

  --chip-bg:rgba(0,0,0,0.03);
  --chip-border:rgba(0,0,0,0.12);
  --chip-text:rgba(0,0,0,0.72);

  --chip-hover-bg:rgba(0,0,0,0.06);
  --chip-hover-border:rgba(0,0,0,0.16);

  --chip-active-bg:rgba(90,170,255,0.20);
  --chip-active-border:rgba(90,170,255,0.34);
  --chip-active-text:rgba(0,0,0,0.78);

  --seg-bg:#f5f5f5;
  --seg-hover-bg:#eef5ff;
  --seg-active-bg:#dbeafe;
  --seg-active-border:#93c5fd;
}

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}

.wrap{
  max-width:980px;
  margin:18px auto;
  padding:0 16px;
}

.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px;
  margin-top:10px;
}

.input{
  flex:1;
  min-width:240px;
  padding:10px 12px;
  border:1px solid #ddd;
  border-radius:8px;
  background:#fff;
}

/* =========================
   BUTTONS (base + variants)
   ========================= */

.btn{
  appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;

  padding:10px 14px;
  border-radius:10px;
  border:1px solid transparent;
  background:transparent;
  color:inherit;

  font-family:inherit;
  font-size:13px;
  font-weight:600;
  line-height:1.15;

  cursor:pointer;
  user-select:none;
}

.btn:disabled{ opacity:.6; cursor:not-allowed; }

/* primary (blue) */
.btn--primary,
.btn.btn-primary{
  border-color:#2a67b3;
  background:#2a67b3;
  color:#fff;
}

/* ghost/secondary (white) */
.btn--ghost,
.btn.btn-apply{ /* legacy support: .btn.btn-apply */
  border-color:rgba(0,0,0,0.12);
  background:#fff;
  color:rgba(0,0,0,0.78);
}
.btn--ghost:hover,
.btn.btn-apply:hover{ background:rgba(0,0,0,0.03); }
.btn--ghost:disabled,
.btn.btn-apply:disabled{ opacity:.55; cursor:not-allowed; }
.btn--ghost.is-pending,
.btn.btn-apply.is-pending{ border-color:rgba(42,103,179,0.35); }

/* small size (Apply/Clear) */
.btn--sm{
  padding:8px 12px;
  border-radius:10px;

  font-size:12.5px;
  font-weight:600;
  line-height:1.1;
}

/* legacy support for Clear buttons if they still use link-clear */
#clearFiltersMobile,
#clearFiltersDesktop{
  font-family:inherit;
  font-size:12.5px;
  font-weight:600;
  line-height:1.1;
}

/* icon-only button (search icon) */
.btn-icon{
  position:absolute;
  top:2px;
  right:2px;
  bottom:2px;

  width:56px;
  padding:0;

  border:0;
  background:transparent;
  color:rgba(0,0,0,0.82);

  border-radius:7px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.btn-icon:hover{
  background:rgba(0,0,0,0.035);
  color:#111;
}

.btn-icon:focus-visible{
  outline:2px solid rgba(42,103,179,0.28);
  outline-offset:2px;
}

.btn-icon .icon{
  width:26px;
  height:26px;
  fill:currentColor;
}

/* loading/disabled */
.btn-icon.is-loading .icon{ opacity:0; }

.btn-icon.is-loading::after{
  content:"";
  width:18px;
  height:18px;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  display:block;
  animation:spin 700ms linear infinite;
}

.btn-icon:disabled{
  cursor:not-allowed;
  opacity:0.55;
  background:transparent;
}

@keyframes spin{ to{ transform:rotate(360deg); } }

.hint{ margin-top:10px; color:#666; font-size:13px; }

.card-hero .hint{
  max-width:720px;
  margin-left:auto;
  margin-right:auto;
}

/* =========================
   HERO (Header + Search)
   ========================= */

.card-hero{ padding:18px; }
.header{
  padding:0;
  margin:0 0 12px;
  position:relative;
}

.site-title{
  color:inherit;
  text-decoration:none;
}

.site-title:hover{
  text-decoration:none;
  opacity:0.92;
}

.site-title:focus-visible{
  outline:2px solid rgba(42,103,179,0.28);
  outline-offset:3px;
  border-radius:6px;
}
.hrow{
  display:flex;
  align-items:baseline;
  gap:10px;
}

.h1{
  margin:0 0 6px;
  font-size:28px;
  font-weight:750;
  letter-spacing:-0.018em;
  color:#1a1a1a;
}
/* subtle accent underline tied to title */
.h1::after{
  content:"";
  display:block;
  width:64px;
  height:2px;
  margin-top:8px;
  border-radius:999px;
  background:rgba(42,103,179,0.22);
}

.sub{
  margin:0;
  color:rgb(89 89 89 / 68%);
  font-size:13.5px;
  line-height:1.4;
  max-width:68ch;
  font-weight:500;
}

.badge{
  display:inline-flex;
  align-items:center;
  height:22px;
  padding:0 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.02em;
  text-transform:uppercase;

  color:rgba(0,0,0,0.72);
  border:1px solid rgba(0,0,0,0.12);
  background:rgba(0,0,0,0.03);
}

/* softer, friendlier badge (no icons) */
.badge--lite{
  height:20px;
  padding:0 10px;
  font-size:11px;
  font-weight:750;
  letter-spacing:0.03em;
  text-transform:uppercase;

  color:rgba(30,79,143,0.92);
  border:1px solid rgba(42,103,179,0.22);
  background:rgba(42,103,179,0.08);
}

/* =========================
   SEARCHBAR (icon inside input)
   ========================= */

.searchbar{
  position:relative;
  display:block;
  max-width:720px;
  margin:0 auto;
}

.input-search{
  width:100%;
  padding-right:62px;
}

.input-search:focus{
  outline:none;
  border-color:rgba(42,103,179,0.45);
  box-shadow:0 0 0 3px rgba(42,103,179,0.14);
}

/* =========================
   FILTERS (master collapse)
   ========================= */

.filters-master{ margin-top:10px; }

/* Filters / Advanced filters summary typography */
.filters-summary{
  list-style:none;
  cursor:pointer;
  user-select:none;
  padding:10px 12px;
  border:1px solid rgba(0,0,0,0.10);
  border-radius:12px;
  background:#fff;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;

  font-family:inherit;
  font-size:13px;
  font-weight:650;
  letter-spacing:0.01em;
}

.filters-summary-right{
  display:flex;
  align-items:center;
  gap:8px;
}

.filters-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:22px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,0.10);
  background:rgba(0,0,0,0.03);
  font-size:12px;
  font-weight:600;
  color:rgba(0,0,0,0.70);
}

.filters-summary::-webkit-details-marker{ display:none; }
.filters-summary::after{
  content:"▾";
  font-size:14px;
  line-height:1;
  opacity:.75;
  transform:translateY(-1px);
}

.filters-master[open] .filters-summary{
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
}
.filters-master[open] .filters-summary::after{ content:"▴"; opacity:.85; }

.filters-master-body{
  border:1px solid rgba(0,0,0,0.10);
  border-top:0;
  border-bottom-left-radius:12px;
  border-bottom-right-radius:12px;
  background:#fff;
  padding:12px;
}

.filters-topbar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}

.filters-topbar-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-shrink:0;
}

/* active filters bar */
.active-filters{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
}

.af-title{
  font-size:12px;
  color:rgba(0,0,0,0.62);
}

.af-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.af-tag{
  appearance:none;
  border:1px solid rgba(90,170,255,0.34);
  background:rgba(90,170,255,0.16);
  color:rgba(0,0,0,0.78);
  border-radius:999px;
  padding:6px 10px;
  font:inherit;
  font-size:12px;
  font-weight:600;
  letter-spacing:0.01em;
  cursor:pointer;
  white-space:nowrap;
}
.af-tag:hover{
  border-color:rgba(90,170,255,0.48);
  background:rgba(90,170,255,0.22);
}
.af-x{ margin-left:6px; font-weight:700; opacity:.75; }

/* cards inside master */
.filters-card{
  background:var(--card);
  border:1px solid var(--border-soft);
  border-radius:12px;
  padding:14px;
  margin-top:10px;
  box-shadow:0 1px 0 rgba(0,0,0,0.03);
}

.filters{ display:grid; gap:12px; }

/* Filter labels (DDR, Capacity...) */
.filter-label{
  font-family:inherit;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:0.02em;
  color:rgba(0,0,0,0.72);
}

.filter-row{
  padding:10px 0;
  border-top:1px solid rgba(0,0,0,0.06);
}
.filter-row:first-child{ border-top:0; }

.filters-details{ display:block; margin-top:10px; }

.filters-summary.filters-summary-inner{
  border-radius:12px;
  margin-top:8px;
}
.filters-details[open] .filters-summary.filters-summary-inner{
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
}
.filters-details[open] .filters-summary.filters-summary-inner::after{ content:"▴"; opacity:.85; }
.filters-details .filters-card{
  border-top-left-radius:0;
  border-top-right-radius:0;
  margin-top:0;
}

/* chips */
.chip{
  appearance:none;
  font-family:inherit;
  font-size:12.5px;
  font-weight:500;
  letter-spacing:0.01em;

  padding:10px 16px;
  min-height:36px;
  line-height:1;

  border-radius:16px;
  border:1px solid var(--chip-border);
  background:var(--chip-bg);
  color:var(--chip-text);

  cursor:pointer;
  user-select:none;

  transform:none !important;
  transition:background 120ms ease,border-color 120ms ease,box-shadow 120ms ease,color 120ms ease;
}
.chip:hover{ background:var(--chip-hover-bg); border-color:var(--chip-hover-border); }
.chip:focus,.chip:focus-visible{ outline:none !important; }

.chip.is-active{
  background:var(--chip-active-bg);
  border-color:var(--chip-active-border);
  color:var(--chip-active-text);
  box-shadow:inset 0 0 0 1px rgba(90,170,255,0.18);
}

/* segmented groups */
.seg{ display:inline-flex; gap:0; flex-wrap:nowrap; }

.seg .chip{
  border-radius:0 !important;
  border-left-width:0 !important;
  background:var(--seg-bg) !important;
  color:#111 !important;

  min-height:34px !important;
  padding:8px 12px !important;

  font-size:12px !important;
  font-weight:600 !important;
  letter-spacing:0.02em;

  box-shadow:none !important;
}

.seg .chip:first-child{ border-left-width:1px !important; }
.seg .chip:hover{ background:var(--seg-hover-bg) !important; }

.seg .chip.is-active{
  background:var(--seg-active-bg) !important;
  border-color:var(--seg-active-border) !important;
  color:#0b63ce !important;
  z-index:1;
}

.seg.seg-wrap{
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
.seg.seg-wrap::-webkit-scrollbar{ height:8px; }
.seg.seg-wrap::-webkit-scrollbar-thumb{ background:rgba(0,0,0,0.12); border-radius:999px; }
.seg.seg-wrap::-webkit-scrollbar-track{ background:transparent; }

.seg-2row{
  display:inline-flex;
  max-width:100%;
  overflow:hidden;
  border-radius:0;
}

/* small chips only inside filters */
#filtersMaster .chip{
  font-size:12.5px;
  letter-spacing:0.01em;
  padding:8px 12px;
  min-height:34px;
}
#filtersMaster .seg .chip{
  padding:7px 10px !important;
  min-height:32px !important;
}

#clearFiltersMobile{ display:none; }
#clearFiltersDesktop{ display:inline-block; }

@media (max-width:880px){
  #clearFiltersMobile{ display:inline-block; }
  #clearFiltersDesktop{ display:none; }
}

@media (max-width:640px){
  :root{ --results-table-minh:760px; }

  .filters-topbar{ flex-direction:column; align-items:stretch; }
  .filters-topbar-actions{ justify-content:flex-end; }
  .wrap{ margin:2px auto; padding:0 12px; }
  .sub{ font-size:13px; }
}

[hidden]{ display:none !important; }

/* =========================
   RESULTS
   ========================= */

.results-body{
  min-height: clamp(520px, calc(100vh - 380px), 980px);
}

.results-head{
  display:flex;
  gap:14px;
  align-items:flex-start;
  justify-content:space-between;
  padding:10px 4px 12px;
  border-bottom:1px solid rgba(0,0,0,0.06);
  margin-bottom:10px;
}

.results-hrow{
  display:flex;
  align-items:baseline;
  gap:10px;
  flex-wrap:wrap;
}

.results-title h2{
  margin:0;
  font-size:19px;
  font-weight:800;
  letter-spacing:-0.012em;
  color:#1a1a1a;
}

.results-sub{
  margin:6px 0 0;
  color:rgba(0,0,0,0.62);
  font-size:13px;
  line-height:1.35;
  max-width:72ch;
}

.results-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  margin-left:auto;
}

.status{ font-size:13px; color:#333; margin:0; min-height:0; }
.status.is-loading,.status.is-error,.status.is-stale{ margin:10px 0 0; min-height:24px; }
.status.is-muted{ display:none; }
.status.is-error{ color:#8a1f1f; }
.status.is-stale{ color:rgba(0,0,0,0.62); }
.status.is-loading{ color:rgba(0,0,0,0.62); }

.results-controls{
  display:flex;
  align-items:center;
  gap:8px;

  padding:6px 8px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,0.10);
  background:rgba(0,0,0,0.015);
}

.sort-label{
  font-size:12px;
  font-weight:650;
  color:rgba(0,0,0,0.62);
}

.select{
  font:inherit;
  font-size:13px;
  padding:8px 10px;
  border:1px solid rgba(0,0,0,0.12);
  border-radius:10px;
  background:#fff;
}

@media (max-width:640px){
  .results-head{ flex-direction:column; }
  .results-meta{
    justify-content:flex-start;
    margin-left:0;
    width:100%;
  }
  .results-controls{ width:100%; justify-content:space-between; }
}

/* CLS-safe “mini status pill” */
.results-note{
  min-height:20px;
  margin-top:8px;

  display:inline-flex;
  align-items:center;

  padding:3px 8px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,0.10);
  background:rgba(0,0,0,0.02);

  color:rgba(0,0,0,0.62);
  font-size:12.5px;
  line-height:20px;
  max-width:100%;
}
.results-note__text{
  display:inline-block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
}

/* skeleton rows (CLS stability) */
.empty-cell{
  padding:16px 10px;
  color:rgba(0,0,0,0.62);
  font-size:13px;
}

.row-skel td{ border-top:1px solid #eee; }
.skel{
  display:inline-block;
  background:rgba(0,0,0,0.06);
  border-radius:999px;
}
.skel--logo{ width:34px; height:16px; border-radius:6px; }
.skel--thumb{
  width:48px;
  height:48px;
  border-radius:10px;
}
.skel--title{ width:min(520px, 70%); height:14px; border-radius:8px; }
.skel--chip{ width:52px; height:16px; border-radius:999px; margin-right:6px; }
.skel--chip-sm{ width:40px; }
.skel--price{ width:74px; height:14px; border-radius:8px; }
.skel--btn{ width:56px; height:28px; border-radius:999px; }

/* subtle pulse; disabled for reduced-motion below */
@keyframes pulse{
  0%,100%{ opacity:0.75; }
  50%{ opacity:0.45; }
}
.row-skel .skel{ animation:pulse 1.2s ease-in-out infinite; }

/* Reserve enough space so results don't push About/Footer on load */
.table{ min-height: 720px; }
@media (max-width:640px){
  .table{ min-height: 640px; }
}


.sort-help{
  margin-top:6px;
  font-size:12.5px;
  color:rgba(0,0,0,0.62);
  line-height:1.35;
  max-width:40ch;
}
/* table */

.table{ width:100%; min-height:var(--results-table-minh); border-collapse:collapse; }
.table th,.table td{ border-top:1px solid #eee; padding:10px; vertical-align:middle; }
.table thead th{
  border-top:none;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#444;
}
.table thead th.right{ text-align:right; }

.right{ text-align:right; white-space:nowrap; }


/* empty / error row */
.empty-row td{
  padding:18px 10px;
  border-top:1px solid rgba(0,0,0,0.06);
}
.empty-box{
  display:flex;
  flex-direction:column;
  gap:6px;
  max-width:70ch;
}
.empty-title{
  font-weight:700;
  color:rgba(0,0,0,0.78);
}
.empty-sub{
  color:rgba(0,0,0,0.60);
  font-size:12.5px;
  line-height:1.35;
}

/* SOURCE COLUMN */
.cell-source{
  width:64px;
  text-align:center;
  vertical-align:middle;
  white-space:nowrap;
}

.source-logo{
  width:36px;
  height:22px;
  display:inline-block;
  object-fit:contain;
  opacity:0.95;
}

.cell-product{ width:100%; min-width:0; }
.product-wrap{ display:flex; align-items:flex-start; gap:10px; min-width:0; }

.thumb{
  width:48px;
  height:48px;
  object-fit:contain;
  background:#fff;
  border:1px solid rgba(0,0,0,0.08);
  border-radius:10px;
  flex-shrink:0;
}

.product-link{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  min-width:0;
  word-break:break-word;

  color:var(--plink);
  font-size:14px;
  line-height:1.25;
  font-weight:500;
  text-decoration:none !important;
}
.product-link:hover{
  color:var(--plink-hover);
  text-decoration:underline !important;
  text-underline-offset:2px;
}

.product-text{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.product-meta{ display:flex; gap:6px; flex-wrap:wrap; }

.meta-chip{
  padding:3px 7px;
  font-size:11.5px;
  border-radius:999px;
  background:rgba(0,0,0,0.04);
  border:1px solid rgba(0,0,0,0.10);
  color:rgba(0,0,0,0.60);
}
.meta-chip.is-active{
  background:rgba(42,103,179,0.14);
  border-color:rgba(42,103,179,0.35);
  color:#1e4f8f;
  font-weight:600;
}

/* price area */
.price-val{ white-space:nowrap; }

.price-wrap{
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;

  padding:6px 8px;
  border-radius:12px;
  border:1px solid transparent;
  background:transparent;

  transition: background 120ms ease, border-color 120ms ease;
}

.price-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:28px;
  padding:0 10px;

  font-size:12.5px;
  font-weight:650;
  letter-spacing:0.01em;

  color:#1e4f8f;
  text-decoration:none;

  border:1px solid rgba(42,103,179,0.20);
  background:rgba(42,103,179,0.08);
  border-radius:999px;

  transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}
.price-pill:hover{
  background:rgba(42,103,179,0.16);
  border-color:rgba(42,103,179,0.30);
  color:#153d6f;
}

@media (hover:hover){
  .table tbody tr{ transition: background 120ms ease; }
  .table tbody tr:hover td{ background: rgba(0,0,0,0.02); }

  .table tbody tr:hover td.right .price-wrap{
    background:rgba(42,103,179,0.06);
    border-color:rgba(42,103,179,0.14);
  }

  .table tbody tr:hover .cell-product{ cursor:pointer; }
  .table tbody tr:hover .product-link{ text-decoration:underline; }
}

.note{
  margin-top:12px;
  padding:10px 12px;
  border:1px solid rgba(0,0,0,0.10);
  border-radius:12px;
  background:rgba(0,0,0,0.02);
  color:rgba(0,0,0,0.66);
  font-size:12.5px;
  line-height:1.35;
}
.note strong{ color:rgba(0,0,0,0.78); }

#status{ min-height:0; }
#aboutPrices, #aboutPrices.note{ min-height:80px; }
footer.footer{ min-height:44px; }

.footer{ margin:14px 0 30px; color:#666; }

/* MOBILE */
@media (max-width:640px){
  .table{ table-layout:fixed; width:100%; }
  .table th,.table td{ padding:10px 8px; }

  .table thead th{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .table thead th:nth-child(1),
  .table tbody td:nth-child(1){
    width:42px !important;
    padding-left:6px !important;
    padding-right:6px !important;
  }
  .cell-source{ width:42px !important; }
  .source-logo{ width:28px; height:18px; }

  .thumb{ display:none; }

  .table thead th:nth-child(3),
  .table tbody td:nth-child(3){
    width:96px !important;
    padding-left:6px !important;
    padding-right:6px !important;
  }

  td.right{ white-space:normal; }

  .price-wrap{
    display:flex;
    width:100%;
    flex-direction:column;
    align-items:flex-end;
    justify-content:flex-start;
    gap:6px;
    padding:0;
    border:0;
    background:transparent;
  }

  .price-pill{
    height:24px;
    padding:0 9px;
    font-size:12px;
  }
}




@media (max-width:640px){
  /* Compact meta bar: results count left, sort right (single row) */
  .results-meta{
    width:100%;
    display:flex;
    flex-wrap:nowrap;          /* critical: prevent 2-row wrap */
    justify-content:space-between;
    align-items:center;
    gap:10px;
    margin-top:10px;
  }

  /* If label still exists, hide visually on mobile */
  .sort-label{ display:none; }

  /* resultsNote becomes a compact pill */
  .results-note{
    margin-top:0;
    min-height:0;
    line-height:1;
    flex:0 1 auto;
    max-width:58%;
  }
  .results-note__text{
    display:inline-flex;
    align-items:center;
    height:24px;
    padding:0 10px;
    border-radius:999px;
    border:1px solid rgba(0,0,0,0.10);
    background:rgba(0,0,0,0.03);
    font-size:12px;
    color:rgba(0,0,0,0.70);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:100%;
  }

  .results-controls{
    flex-shrink:0;
    margin-left:auto;
    gap:0;
  }

  .select{
    font-size:12.5px;
    padding:7px 10px;
    border-radius:12px;
  }
}


@media (max-width:640px){
  /* Mobile: keep results header compact (hide count + sort) */
  #resultsNote{ display:none !important; }
  .results-controls{ display:none !important; }
}

/* =========================
   A11Y: prefers-reduced-motion
   ========================= */

@media (prefers-reduced-motion: reduce){
  *{
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
    scroll-behavior:auto !important;
  }

  .btn-icon.is-loading::after{ animation:none !important; }
  .btn-icon.is-loading .icon{ opacity:1 !important; }
  .row-skel .skel{ animation:none !important; }
}

/* status action buttons */
.status-actions{
  margin-top:10px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.empty-state{
  padding:18px 10px;
  color:rgba(0,0,0,0.70);
  font-size:13px;
  line-height:1.45;
}
.empty-title{
  font-weight:700;
  color:rgba(0,0,0,0.78);
  margin-bottom:6px;
}
.empty-actions{
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* standalone about card at page bottom */
.note-card{ padding:0; }
.note-card .note{ margin-top:0; }