/* AUREN: an optical A above a horizon, set against quiet editorial surfaces. */
.brand-mark:has(img), #sidebar .brand-mark:has(img), .mobile-brand .brand-mark:has(img) {
  display: grid !important; padding: 0 !important; overflow: hidden; border: 0 !important;
  border-radius: 11px !important; background: transparent !important; box-shadow: none !important;
}
.brand-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.auth-brand .brand-mark { width: 48px; height: 48px; border-radius: 13px !important; }
.auth-wordmark { display: flex; gap: 12px; align-items: baseline; letter-spacing: .24em; }
.auth-wordmark span, .auth-brand-name span { font-family: var(--serif); font-size: .78em; font-weight: 500; letter-spacing: .04em; }
.auth-brand-name { display: flex; gap: 9px; align-items: baseline; font-size: 16px; letter-spacing: .18em; }
#sidebar .brand-name { display: flex; gap: 7px; align-items: baseline; font-size: 15px; font-weight: 670; letter-spacing: .15em; white-space: nowrap; }
#sidebar .brand-name em, .mobile-brand strong em { font-family: var(--serif); font-size: .72em; font-style: normal; font-weight: 500; letter-spacing: 0; }
#sidebar .brand-sub { font-size: 7px; letter-spacing: .14em; }
.mobile-brand strong { display: flex; gap: 5px; align-items: baseline; font-size: 12px; letter-spacing: .17em; }
.mobile-brand small { letter-spacing: .1em; }
.studio-location > span { font-weight: 650; letter-spacing: .15em; }

/* The model library has one dark brand header and a calm comparison surface. */
.model-panel-scrim { position: fixed; inset: 0; z-index: 199; background: rgba(10, 23, 37, .27); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); }
.model-panel-scrim[hidden] { display: none !important; }
#modelPanel {
  --catalog-paper: #f6f7f8; --catalog-surface: #fff; --catalog-ink: #1d2c3b;
  --catalog-muted: #6b7a89; --catalog-line: #e2e7eb; --catalog-gold: #ad8e61;
  display: flex; width: min(880px, calc(100vw - 24px)); height: min(650px, calc(100dvh - 24px)); max-width: calc(100vw - 24px);
  max-height: min(650px, calc(100dvh - 24px)); overflow: hidden; flex-direction: column;
  border: 1px solid #d9e0e6; border-radius: 21px; background: var(--catalog-surface);
  box-shadow: 0 30px 90px rgba(22, 35, 53, .19), 0 4px 16px rgba(22, 35, 53, .06);
  color: var(--catalog-ink); backdrop-filter: none; -webkit-backdrop-filter: none;
  animation: auren-panel-in .2s cubic-bezier(.2,.8,.2,1) both;
}
#modelPanel[hidden] { display: none !important; }
@keyframes auren-panel-in { from { opacity: 0; transform: translateY(7px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }
#modelPanel .model-panel-head {
  position: relative; display: flex; min-height: 112px; padding: 21px 28px 19px;
  align-items: flex-start; justify-content: space-between; flex: 0 0 auto; overflow: hidden;
  border: 0; background: #1a2a3b; color: #f4f5f4; font-family: var(--sans); letter-spacing: 0; text-transform: none;
}
#modelPanel .model-panel-head::after {
  content: ""; position: absolute; right: 75px; top: -120px; width: 270px; height: 270px;
  border: 1px solid rgba(227, 222, 210, .12); border-radius: 50%; box-shadow: 0 0 0 46px rgba(227, 222, 210, .035); pointer-events: none;
}
#modelPanel .model-eyebrow { display: block; margin-bottom: 9px; color: #bea988; font: 600 9px/1 var(--mono); letter-spacing: .18em; }
#modelPanel .model-panel-head h2 { position: relative; margin: 0; color: #fbfbf9; font-size: 22px; font-weight: 580; line-height: 1.2; letter-spacing: -.035em; }
#modelPanel .model-panel-head p { position: relative; margin: 7px 0 0; color: #b9c5cf; font-size: 11px; line-height: 1.5; }
#modelPanel .model-panel-close { position: relative; z-index: 1; display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(255,255,255,.18); border-radius: 9px; color: #e5ebf0; font: 23px/1 var(--sans); transition: background .16s ease, transform .16s ease; }
#modelPanel .model-panel-close:hover { background: rgba(255,255,255,.12); transform: rotate(90deg); }
#modelPanel .model-picker-toolbar { display: flex; flex: 0 0 auto; gap: 12px; padding: 17px 20px 12px; align-items: center; background: var(--catalog-surface); }
#modelPanel .model-kind-switch { display: flex; flex: 0 0 auto; gap: 3px; padding: 3px; border: 1px solid var(--catalog-line); border-radius: 10px; background: var(--catalog-paper); }
#modelPanel .model-kind-switch button { min-width: 83px; min-height: 34px; padding: 0 11px; border-radius: 7px; color: var(--catalog-muted); font-size: 11px; font-weight: 600; transition: background .17s ease, color .17s ease, box-shadow .17s ease; }
#modelPanel .model-kind-switch button:hover { color: var(--catalog-ink); }
#modelPanel .model-kind-switch button[aria-pressed="true"] { background: var(--catalog-surface); color: var(--catalog-ink); box-shadow: 0 1px 4px rgba(19,38,56,.12); }
#modelPanel .model-search { display: flex; height: 41px; min-width: 0; flex: 1; gap: 10px; padding: 0 11px; align-items: center; border: 1px solid var(--catalog-line); border-radius: 10px; background: var(--catalog-paper); color: var(--catalog-muted); transition: border-color .16s ease, box-shadow .16s ease; }
#modelPanel .model-search:focus-within { border-color: #9baec0; box-shadow: 0 0 0 3px rgba(91,119,145,.11); }
#modelPanel .model-search svg { width: 16px; height: 16px; flex: 0 0 auto; }
#modelPanel .model-search input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; color: var(--catalog-ink); font: 12px var(--sans); }
#modelPanel .model-search input::placeholder { color: #98a5b0; }
#modelPanel .model-search kbd { border: 1px solid var(--catalog-line); border-radius: 4px; padding: 2px 5px; color: var(--catalog-muted); font: 10px var(--mono); }
#modelPanel .model-filter-bar { display: flex; flex: 0 0 auto; gap: 12px; padding: 0 20px 12px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--catalog-line); }
#modelPanel .model-filters { display: flex; min-width: 0; gap: 5px; overflow-x: auto; scrollbar-width: none; }
#modelPanel .model-filters::-webkit-scrollbar { display: none; }
#modelPanel .model-filters button { flex: 0 0 auto; padding: 6px 10px; border: 1px solid transparent; border-radius: 7px; color: var(--catalog-muted); font-size: 10px; font-weight: 560; white-space: nowrap; transition: background .16s ease, color .16s ease; }
#modelPanel .model-filters button:hover { background: var(--catalog-paper); color: var(--catalog-ink); }
#modelPanel .model-filters button[aria-pressed="true"] { border-color: #cad6dd; background: #eaf0f3; color: #273e52; }
#modelPanel .model-count { flex: 0 0 auto; color: var(--catalog-muted); font: 10px var(--mono); white-space: nowrap; }
#modelPanel .model-picker-body { display: grid; min-height: 0; flex: 1 1 auto; grid-template-columns: minmax(0,1fr) minmax(310px, .84fr); background: var(--catalog-paper); }
#modelPanel #modelList { display: block; min-height: 0; padding: 13px 14px 20px 20px; overflow-y: auto; scrollbar-gutter: stable; overscroll-behavior: contain; }
#modelPanel .model-group { padding: 9px 7px 10px; color: #8b98a3; font: 650 9px var(--mono); letter-spacing: .14em; text-transform: uppercase; }
#modelPanel .model-item-wrap { display: flex; min-width: 0; margin-bottom: 7px; align-items: center; border: 1px solid var(--catalog-line); border-radius: 12px; background: var(--catalog-surface); transition: border-color .17s ease, background .17s ease, box-shadow .17s ease; }
#modelPanel .model-item-wrap:hover, #modelPanel .model-item-wrap.previewing { border-color: #adbec9; box-shadow: 0 4px 15px rgba(28,48,65,.06); }
#modelPanel .model-item-wrap.selected { border-color: #b6c6cf; background: #f3f6f7; box-shadow: inset 3px 0 #a88c63; }
#modelPanel #modelList .model-item { display: flex; min-width: 0; min-height: 66px; flex: 1 1 auto; gap: 12px; padding: 9px 4px 9px 11px; align-items: center; border: 0; border-radius: 12px; background: transparent !important; box-shadow: none; color: var(--catalog-ink); text-align: left; transform: none; }
#modelPanel #modelList .model-item:focus-visible, #modelPanel .model-favorite:focus-visible, #modelPanel .model-preview-btn:focus-visible, #modelPanel button:focus-visible { outline: 2px solid #66849a; outline-offset: -2px; }
#modelPanel .model-tile-mark { display: grid; width: 39px; height: 39px; flex: 0 0 auto; place-items: center; border: 1px solid #dae2e7; border-radius: 10px; background: #eef2f4; color: #3c576d; font: 650 18px/1 var(--serif); }
#modelPanel .model-item-main { display: grid; min-width: 0; gap: 4px; flex: 1; }
#modelPanel .model-item-name { display: block; overflow: hidden; color: var(--catalog-ink) !important; font-size: 12px; font-weight: 650; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
#modelPanel .model-item-sub { display: block; overflow: hidden; color: var(--catalog-muted); font-size: 10px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
#modelPanel .model-item-tail { display: flex; min-width: 0; flex: 0 0 auto; gap: 5px; align-items: center; }
#modelPanel .model-item-tail small { padding: 4px 6px; border-radius: 5px; background: var(--catalog-paper); color: var(--catalog-muted); font-size: 9px; white-space: nowrap; }
#modelPanel .model-check { width: 16px; height: 16px; color: #8b704b; opacity: 0; }
#modelPanel .model-item-wrap.selected .model-check { opacity: 1; }
#modelPanel .model-favorite, #modelPanel .model-preview-btn { flex: 0 0 auto; width: 31px; height: 34px; margin-right: 4px; border-radius: 7px; color: #9ca8ae; font-size: 20px; line-height: 1; }
#modelPanel .model-favorite:hover, #modelPanel .model-favorite[aria-pressed="true"] { color: #ad8e61; background: #f7f3eb; }
#modelPanel .model-preview-btn { display: none; font-size: 11px; }
#modelPanel .model-empty { display: grid; min-height: 210px; padding: 22px; place-content: center; gap: 8px; text-align: center; color: var(--catalog-muted); }
#modelPanel .model-empty strong { color: var(--catalog-ink); font-size: 14px; }
#modelPanel .model-empty span { font-size: 11px; line-height: 1.6; }
#modelPanel .model-detail { display: flex; min-width: 0; min-height: 0; padding: 27px 27px 23px; flex-direction: column; overflow-y: auto; border-left: 1px solid var(--catalog-line); background: var(--catalog-surface); }
#modelPanel .model-detail-back { display: none; }
#modelPanel .model-detail-index { display: block; margin-bottom: 16px; color: var(--catalog-gold); font: 650 9px var(--mono); letter-spacing: .14em; text-transform: uppercase; }
#modelPanel .model-detail h3 { margin: 0; color: var(--catalog-ink); font-size: 24px; font-weight: 620; letter-spacing: -.035em; line-height: 1.2; }
#modelPanel .model-detail-lede { margin: 10px 0 16px; color: var(--catalog-muted); font-size: 12px; line-height: 1.65; }
#modelPanel .model-feature-list { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 21px; }
#modelPanel .model-feature-list span { padding: 5px 7px; border: 1px solid var(--catalog-line); border-radius: 6px; color: #42596c; font-size: 10px; }
#modelPanel .model-detail dl { display: grid; gap: 0; margin: 0; }
#modelPanel .model-detail dl div { display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 9px; padding: 12px 0; border-top: 1px solid var(--catalog-line); }
#modelPanel .model-detail dt { color: #91a0aa; font-size: 10px; font-weight: 650; }
#modelPanel .model-detail dd { margin: 0; color: var(--catalog-ink); font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
#modelPanel .model-detail-use { display: flex; width: 100%; min-height: 43px; margin-top: auto; padding: 0 13px; gap: 12px; align-items: center; justify-content: space-between; border-radius: 9px; background: #20374b; color: #fff; font-size: 11px; font-weight: 620; transition: background .16s ease, transform .16s ease; }
#modelPanel .model-detail-use:hover { background: #2b4a61; transform: translateY(-1px); }
#modelPanel .model-detail-use span { font-size: 17px; font-weight: 400; }
#modelPanel .model-picker-foot { display: flex; min-height: 35px; padding: 0 20px; flex: 0 0 auto; align-items: center; justify-content: space-between; border-top: 1px solid var(--catalog-line); background: var(--catalog-surface); color: #93a0aa; font-size: 9px; }
#modelPanel .model-picker-foot i { font-style: normal; margin: 0 5px; }

html[data-theme="dark"] #modelPanel { --catalog-paper:#1b2531; --catalog-surface:#202d3a; --catalog-ink:#edf2f5; --catalog-muted:#a2b1bd; --catalog-line:#364654; border-color:#3b4b5a; }
html[data-theme="dark"] #modelPanel .model-panel-head { background:#121e2a; }
html[data-theme="dark"] #modelPanel .model-item-wrap.selected { background:#293a47; }
html[data-theme="dark"] #modelPanel .model-tile-mark { background:#304456; border-color:#43596b; color:#e0eaf0; }
html[data-theme="dark"] #modelPanel .model-filters button[aria-pressed="true"] { background:#344858; border-color:#4b6171; color:#e9f0f3; }
html[data-theme="dark"] #modelPanel .model-item-tail small { background:#293844; }
html[data-theme="dark"] #modelPanel .model-feature-list span { color:#c9d8e0; }
html[data-theme="dark"] #modelPanel .model-favorite:hover, html[data-theme="dark"] #modelPanel .model-favorite[aria-pressed="true"] { background:#3b3934; }

@media (max-width: 760px) {
  #modelPanel { position: fixed !important; inset: max(8px, env(safe-area-inset-top)) 8px max(8px, env(safe-area-inset-bottom)) !important; width: auto !important; height: auto !important; max-width: none !important; max-height: none !important; border-radius: 17px; }
  #modelPanel .model-panel-head { min-height: 91px; padding: 18px 18px 14px; }
  #modelPanel .model-panel-head h2 { font-size: 19px; }
  #modelPanel .model-panel-head p { display: none; }
  #modelPanel .model-picker-toolbar { padding: 13px 13px 9px; gap: 8px; }
  #modelPanel .model-kind-switch button { min-width: 64px; padding: 0 7px; font-size: 10px; }
  #modelPanel .model-search kbd { display: none; }
  #modelPanel .model-filter-bar { padding: 0 13px 10px; }
  #modelPanel .model-count { display: none; }
  #modelPanel .model-picker-body { display: block; overflow: hidden; }
  #modelPanel #modelList { height: 100%; padding: 10px 11px 20px; }
  #modelPanel .model-detail { display: none; height: 100%; border-left: 0; padding: 21px 20px; }
  #modelPanel.detail-open #modelList { display: none; }
  #modelPanel.detail-open .model-detail { display: flex; }
  #modelPanel .model-detail-back { display: inline-flex; width: max-content; margin-bottom: 16px; padding: 6px 0; color: var(--catalog-muted); font-size: 11px; }
  #modelPanel .model-preview-btn { display: grid; place-items: center; margin-right: 5px; }
  #modelPanel .model-picker-foot { min-height: 30px; padding: 0 13px; }
  #modelPanel .model-picker-foot span:last-child { display: none; }
}
@media (max-width: 390px) {
  #modelPanel .model-picker-toolbar { flex-wrap: wrap; }
  #modelPanel .model-kind-switch, #modelPanel .model-search { width: 100%; }
  #modelPanel .model-item-tail small { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  #modelPanel { animation: none; }
  #modelPanel :is(button,.model-item-wrap) { transition: none !important; }
  #modelPanel .model-panel-close:hover, #modelPanel .model-detail-use:hover { transform: none; }
}