/* The approved D world extends into a dedicated public problem browser. */
.home-discovery-search {display:flex; gap:12px; align-items:start; margin-bottom:16px}
.home-discovery-search .feed-search {margin:0; flex:1; min-width:0}
.home-discovery-search>.secondary {flex:none}
.home-categories .category {display:inline-flex; align-items:center; gap:8px; color:var(--muted)}
.home-categories .category:hover {color:var(--ink)}
.home-categories svg {width:16px; height:16px}
.home-selection-note {display:flex; justify-content:space-between; align-items:start; gap:16px; padding-top:16px; color:var(--muted); font-size:13px}
.home-selection-note #result-count {white-space:nowrap; min-height:0}
.home-more {display:grid; justify-items:start; gap:16px; margin-top:32px}
.home-more p {font-size:13px; color:var(--muted)}
.discovery-browser {max-width:1152px; margin-inline:auto}
.browser-layout {display:grid; grid-template-columns:208px minmax(0,1fr); gap:64px; align-items:start}
.browser-sidebar {position:sticky;top:112px;max-height:calc(100dvh - 136px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-gutter:stable;padding-right:4px}
.browser-sidebar h2 {font:600 16px/1.75 var(--body); margin-bottom:12px}
.browser-categories {display:grid; gap:4px}
.browser-categories button {display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:44px; padding:8px 10px; border-radius:12px; color:var(--muted); text-align:left}
.browser-categories button:hover {background:var(--soft); color:var(--ink)}
.browser-categories button[aria-pressed="true"] {background:var(--selected); color:var(--primary); font-weight:600}
.browser-categories small {font-size:13px; font-variant-numeric:tabular-nums}
.browser-sidebar .form-meta {margin-top:24px}
.browser-main {min-width:0}
.browse-search-form {display:flex; align-items:start; gap:12px}
.browse-search-field {display:grid; gap:8px; flex:1; min-width:0}
.browse-search-field label {font-size:13px; color:var(--muted)}
.browse-search-field .search {width:100%; margin:0}
.browse-search-form>.secondary {margin-top:28px; flex:none}
.browse-search-field .search input {min-width:0}
.browse-tags {margin-top:24px}
.browser-sidebar .browse-tags {margin-top:24px;padding-top:16px;border-top:1px solid var(--line)}
.browser-sidebar .browse-tags-heading {gap:8px}
.browser-sidebar .browse-tags-heading h2 {font:600 14px/1.75 var(--body);margin:0}
.browse-tags-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px}
.browse-tags-heading h2 {font:600 14px/1.75 var(--body);color:var(--muted);margin:0}
.browse-tags-heading button {font-size:13px;min-height:44px}
.browse-tag-options {display:flex;flex-wrap:wrap;gap:8px}
.browse-tag {display:inline-flex;align-items:center;gap:8px;min-height:44px;max-width:100%;padding:8px 4px;border:0;border-radius:0;background:transparent;color:var(--muted);font-size:13px;text-align:left;overflow-wrap:anywhere}
.browse-tag:hover {color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.browse-tag[aria-pressed="true"] {background:transparent;color:var(--primary);font-weight:600;text-decoration:underline;text-underline-offset:4px}
.browse-tag small {font-size:12px;font-variant-numeric:tabular-nums}
.card-context a.tag {display:inline-flex;align-items:center;min-height:32px}
.card-context a.tag:hover {text-decoration:underline;text-underline-offset:4px}
.browse-toolbar {display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:24px 0 16px; border-bottom:1px solid var(--line)}
.browse-sort {display:flex; gap:12px; align-items:center; font-size:13px; color:var(--muted)}
.browse-sort select {min-height:44px; padding:8px 12px; border:1px solid var(--control-border); border-radius:12px; background:var(--surface); color:var(--ink); font:inherit; cursor:pointer}
.browse-toolbar output {font-size:13px; color:var(--muted); font-variant-numeric:tabular-nums}
.browse-conditions {display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:16px; font-size:13px; color:var(--muted)}
.browse-conditions p {overflow-wrap:anywhere}
.browse-conditions button {flex:none; min-height:44px}
.browse-condition-list {display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.browse-condition {display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;background:var(--selected);color:var(--primary);text-align:left;overflow-wrap:anywhere;max-width:100%}
.browse-condition:hover {color:var(--primary-hover)}
.browse-condition svg {width:14px;height:14px;flex:none}
.browse-card-list .problem-card {padding:32px 0}
.browse-card-list .problem-card .card-title {font:600 26px/1.5 var(--display); margin-block:16px}
.browse-card-list .card-description {max-width:40em}
.match-note {margin-top:16px; color:var(--muted); font-size:13px}
.browse-pagination {display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding-top:32px}
.browse-pagination a {display:inline-flex; align-items:center; justify-content:center; gap:8px; min-width:44px; min-height:44px; border-radius:12px; padding:8px 12px; color:var(--muted)}
.browse-pagination a:hover {background:var(--soft); color:var(--ink)}
.browse-pagination a[aria-current="page"] {background:var(--primary); color:var(--on-primary)}
.browse-pagination a[aria-disabled="true"] {color:var(--muted); opacity:.55; cursor:default}
.browse-pagination svg {width:16px; height:16px}
.browse-pagination .previous-page svg {transform:rotate(180deg)}
.browse-page-note {margin-top:16px; color:var(--muted); font-size:13px}
.browse-card-list .quiet-empty {padding-block:48px}
.browse-card-list .quiet-empty .form-actions {margin-top:24px}
@media(max-width:950px) {
  .browser-layout {grid-template-columns:176px minmax(0,1fr); gap:32px}
}
@media(max-width:700px) {
  .home-discovery-search {display:block}
  .home-discovery-search>.secondary {margin-top:12px}
  .home-selection-note {display:block}
  .home-selection-note #result-count {margin-top:8px; display:block}
  .browser-layout {display:block}
  .browser-sidebar {position:static;max-height:none;overflow:visible;margin-bottom:24px;padding-right:0;scrollbar-gutter:auto}
  .browser-categories {display:flex; gap:8px; overflow-x:auto; padding-bottom:12px; scrollbar-width:thin}
  .browser-categories button {flex:none; white-space:nowrap; gap:8px; font-size:13px}
  .browser-sidebar .form-meta {display:none}
  .browse-search-form {display:block}
  .browse-search-form>.secondary {margin-top:12px}
  .browse-card-list .problem-card .card-title {font-size:20px}
  .browse-toolbar {gap:8px}
  .browse-conditions {align-items:start}
  .browse-pagination {gap:8px}
}