/* Semantic tokens. Everything below this block refers to these, never to a
   raw colour. To revert the catalogue to the previous blue scheme, change only
   the four --cat-accent-* lines; nothing else in this file knows the hue. */
.cat-page {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 28px 32px 36px;


  --cat-surface:       var(--lmu-white);
  --cat-surface-soft:  var(--lmu-grey-faint);
  --cat-accent-wash:   var(--lmu-green-10);
  --cat-accent-soft:   var(--lmu-green-20);
  /* Ink vs fill are split on purpose. The guide's 100% green is 4.58:1 on
     white — AA, but it drops to 3.49:1 as text on the 20% tint, which fails.
     So official green is used for FILLS (white text on it is 4.58:1, AA) and a
     derived deeper green is used for TEXT, where it clears AA on every surface
     this file produces. The guide's own accessibility requirement is the
     justification for the derived shade. */
  --cat-accent:        var(--lmu-green-deep);    /* ink   — text, icons, rules */
  --cat-accent-fill:   var(--lmu-green);         /* fill  — official 100%      */
  --cat-accent-deep:   var(--lmu-green-deeper);  /* hover/active               */
  --cat-line-faint:    var(--lmu-grey-light);
  --cat-line:          var(--lmu-grey-mid);
  --cat-line-strong:   var(--lmu-grey-midark);
  --cat-text-soft:     var(--lmu-grey-dark);
  --cat-text:          var(--lmu-grey-dark);
  --cat-ink:           var(--lmu-black);

  /* Success is deliberately NOT a separate hue. Under the LMU palette the
     brand colour is green, so a green "success" would be invisible against a
     green UI (#00883A vs the old #27754F measures 1.22:1). The copied state is
     signalled by a filled treatment plus icon and label instead. */
  --cat-ok-surface:    var(--lmu-green);
  --cat-ok-line:       var(--lmu-green);
  --cat-ok-text:       var(--lmu-white);

  /* Red is reserved for genuine errors, matching the guide's Stoermeldungen. */
  --cat-err-surface:   var(--lmu-red-10);
  --cat-err-line:      var(--lmu-red-20);
  --cat-err-text:      var(--lmu-red-deep);

  --cat-peek:          46px;
  --cat-roll:          cubic-bezier(.55, .04, .30, 1);
  --cat-slide:         cubic-bezier(.22, .90, .28, 1);
}

/* TRACE catalogue. Scoped to the existing base.html shell; no global resets. */
.cat-page * {
  box-sizing:border-box;
}

.cat-page:not(.cat-ready) .cat-shutter,
.cat-page:not(.cat-ready) .cat-chevron,
.cat-page:not(.cat-ready) .cat-copy {
  transition: none !important;
}

.cat-page button,.cat-page input,.cat-page textarea {
  font:inherit;
}

.cat-page button {
  cursor:pointer;
}

.cat-page button:disabled {
  cursor:wait;
}

.cat-page [hidden] {
  display:none!important;
}

.cat-page :is(button,a,input,textarea,[tabindex]):focus-visible {
  outline:3px solid var(--cat-line-strong);
  outline-offset:3px;
}

.cat-sr {
  position:absolute!important;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.cat-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:26px;
}

.cat-eyebrow {
  font-size:10px;
  letter-spacing:1.5px;
  font-weight:650;
  color:var(--cat-text-soft);
  margin:0 0 10px;
}

.cat-header h1 {
  font-size:clamp(28px,3vw,42px);
  font-weight:700;
  line-height:1.15;
  letter-spacing:-1.1px;
  margin:0 0 9px;
}

.cat-lede {
  font-size:14px;
  color:var(--cat-text-soft);
  margin:0;
}

.cat-header-icon {
  height:48px;
  width:48px;
  display:grid;
  place-items:center;
  flex:none;
  border:1px solid var(--cat-line-faint);
  border-radius:13px;
  background:var(--cat-surface-soft);
  color:var(--cat-text-soft);
  font-size:24px;
}

.cat-search {
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin-bottom:13px;
}

.cat-search-field {
  display:flex;
  align-items:center;
  gap:11px;
  flex:1;
  min-width:min(100%,240px);
  border:1px solid var(--cat-line);
  border-radius:9px;
  padding:0 14px;
  min-height:45px;
  background:var(--cat-surface);
  color:var(--cat-text-soft);
}

.cat-search-field:focus-within {
  border-color:var(--cat-line-strong);
  box-shadow:0 0 0 3px var(--cat-accent-soft);
}

.cat-search-field input {
  border:0;
  outline:none!important;
  box-shadow:none!important;
  background:transparent;
  width:100%;
  padding:11px 0;
  color:var(--cat-ink);
  font-size:13px;
}

.cat-search-field input::placeholder {
  color:var(--cat-text-soft);
}

.cat-button {
  display:inline-flex;
  gap:8px;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:9px 14px;
  min-height:39px;
  border:1px solid var(--cat-line);
  border-radius:8px;
  background:var(--cat-surface);
  color:var(--cat-ink);
  text-decoration:none;
  font-size:12px;
  font-weight:600;
  line-height:1.5;
  transition:background .18s,border-color .18s;
}

.cat-button:hover {
  background:var(--cat-surface-soft);
  border-color:var(--cat-line-strong);
  color:var(--cat-accent-deep);
}

.cat-button--primary {
  background:var(--cat-accent-fill);
  color:white;
  border-color:var(--cat-accent-fill);
}

.cat-button--primary:hover {
  background:var(--cat-accent-deep);
  color:white;
  border-color:var(--cat-accent-deep);
}

.cat-button--disabled {
  color:var(--cat-text-soft);
  background:var(--cat-surface-soft);
  border-color:var(--cat-line-faint);
}

.cat-search>.cat-button {
  min-height:45px;
  padding:10px 23px;
}

.cat-clear {
  font-size:12px;
  color:var(--cat-accent);
  text-decoration:none;
  padding:7px;
}

.cat-filters {
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin-bottom:20px;
}

.cat-filters a {
  display:block;
  border:1px solid var(--cat-line-faint);
  border-radius:999px;
  padding:6px 13px;
  font-size:11px;
  color:var(--cat-text);
  text-decoration:none;
  background:var(--cat-surface);
}

.cat-filters a:hover {
  background:var(--cat-surface-soft);
  border-color:var(--cat-line);
}

.cat-filters a[aria-current=true] {
  background:var(--cat-accent-fill);
  border-color:var(--cat-accent-fill);
  color:var(--cat-surface);
}

.cat-notice {
  display:flex;
  align-items:flex-start;
  gap:10px;
  background:var(--cat-surface-soft);
  border:1px solid var(--cat-line-faint);
  border-radius:9px;
  padding:12px 15px;
  margin-bottom:19px;
  color:var(--cat-text-soft);
  font-size:11px;
  line-height:1.7;
}

.cat-notice>.bi {
  color:var(--cat-text-soft);
  font-size:15px;
}

.cat-notice p {
  margin:0;
}

.cat-results-bar {
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  font-size:11px;
  color:var(--cat-text-soft);
  margin:0 0 22px;
}

.cat-results-bar>span:first-child {
  margin-right:auto;
}

.cat-results-bar strong {
  color:var(--cat-ink);
}

.cat-instructions {
  font-size:10px;
  color:var(--cat-text-soft);
}

.cat-hover-setting {
  display:flex;
  align-items:center;
  gap:6px;
  font-size:10px;
  cursor:pointer;
}

.cat-hover-setting input {
  accent-color:var(--cat-accent-fill);
}

.cat-section {
  margin-bottom:29px;
}

.cat-section-heading {
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:13px;
  flex-wrap:wrap;
}

.cat-section-heading h2 {
  font-size:11px;
  font-weight:650;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:var(--cat-text-soft);
  margin:0;
}

.cat-section-heading span {
  font-size:10px;
  color:var(--cat-text-soft);
}

.cat-section-heading:after {
  content:"";
  flex:1;
  min-width:10px;
  height:1px;
  background:var(--cat-line-faint);
}

.cat-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,350px),1fr));
  gap:20px;
}

.cat-card {
  position:relative;
  background:var(--cat-surface);
  border:1px solid var(--cat-line-faint);
  border-radius:13px;
  overflow:hidden;
  min-width:0;
  transition:border-color .3s,box-shadow .3s,transform .4s var(--cat-roll);
}

.cat-card:hover {
  border-color:var(--cat-line);
  box-shadow:0 10px 24px #153a7010;
}

.cat-front {
  padding:19px 19px 15px;
  display:flex;
  flex-direction:column;
  min-width:0;
}

.cat-card-heading {
  display:flex;
  align-items:flex-start;
  gap:11px;
}

.cat-study-icon {
  width:37px;
  height:37px;
  display:grid;
  place-items:center;
  background:var(--cat-accent-wash);
  color:var(--cat-text);
  border-radius:9px;
  font-size:19px;
  flex:none;
}

.cat-card h3 {
  font-size:15px;
  font-weight:650;
  line-height:1.4;
  margin:0 0 3px;
  letter-spacing:-.2px;
  overflow-wrap:anywhere;
}

.cat-institution {
  font-size:11px;
  line-height:1.6;
  margin:0;
  color:var(--cat-text);
  overflow-wrap:anywhere;
}

.cat-meta {
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:17px 0 19px;
  padding-top:13px;
  border-top:1px solid var(--cat-line-faint);
}

.cat-meta p {
  display:flex;
  gap:7px;
  margin:0;
  font-size:11px;
  color:var(--cat-text);
  line-height:1.6;
  overflow-wrap:anywhere;
}

.cat-meta .bi {
  color:var(--cat-line-strong);
  flex:none;
}

.cat-date-kind {
  font-size:9px;
  color:var(--cat-line-strong);
}

.cat-front-actions {
  margin-top:auto;
  padding-top:8px;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:7px;
}

.cat-study-details {
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 10px;
  border:1px solid var(--cat-accent-fill);
  border-radius:8px;
  background:var(--cat-accent-fill);
  color:var(--cat-surface);
  text-decoration:none;
  line-height:1.25;
  transition:background .18s,border-color .18s,color .18s;
}

.cat-study-details:hover {
  background:var(--cat-accent-deep);
  border-color:var(--cat-accent-deep);
  color:var(--cat-surface);
}

.cat-study-details-icon {
  flex:none;
  font-size:15px;
}

.cat-study-details-copy {
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
}

.cat-study-details-copy strong {
  font-size:11px;
  font-weight:650;
}

.cat-study-details-copy small {
  display:flex;
  align-items:center;
  gap:5px;
  font-size:9px;
  font-weight:600;
  line-height:1.3;
}

.cat-study-details-arrow {
  flex:none;
  font-size:11px;
}

.cat-study-details--login {
  background:var(--cat-surface-soft);
  border-color:var(--cat-line);
  color:var(--cat-ink);
}

.cat-study-details--login:hover {
  background:var(--cat-accent-wash);
  border-color:var(--cat-accent);
  color:var(--cat-accent-deep);
}

.cat-study-details--login .cat-study-details-copy small {
  color:var(--cat-text-soft);
}

.cat-study-details--restricted {
  background:var(--cat-surface-soft);
  border-color:var(--cat-line-faint);
  color:var(--cat-text-soft);
}

.cat-study-page-link {
  display:inline-flex;
  align-items:center;
  align-self:flex-start;
  gap:6px;
  padding:2px 3px;
  color:var(--cat-text);
  font-size:10px;
  font-weight:600;
  line-height:1.5;
  text-decoration:none;
}

.cat-study-page-link:hover {
  color:var(--cat-accent-deep);
  text-decoration:underline;
}

.cat-shutter {
  background:var(--cat-surface);
}

.cat-handle {
  width:100%;
  height:var(--cat-peek);
  display:flex;
  align-items:center;
  gap:9px;
  position:relative;
  padding:6px 14px 0;
  border:0;
  border-top:2px solid var(--cat-line-strong);
  border-radius:0;
  background:var(--cat-accent-wash);
  text-align:left;
  color:var(--cat-ink);
  line-height:1.4;
}

.cat-grip {
  position:absolute;
  top:5px;
  left:calc(50% - 12px);
  height:2px;
  width:24px;
  background:var(--cat-line);
  border-radius:2px;
}

.cat-handle-label {
  font-size:11px;
  font-weight:650;
  flex:none;
}

.cat-handle-summary {
  font-size:10px;
  font-weight:400;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex:1;
  border-left:1px solid var(--cat-line);
  padding-left:9px;
  color:var(--cat-text-soft);
}

.cat-chevron {
  font-size:12px;
  transition:transform .58s var(--cat-roll);
}

.cat-body {
  padding:12px 14px 14px;
  display:flex;
  flex-direction:column;
  min-height:240px;
  background:linear-gradient(145deg,var(--cat-surface),var(--cat-accent-wash));
}

.cat-shutter-title {
  font-size:11px;
  font-weight:650;
  margin:0 0 10px;
  color:var(--cat-text-soft);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.cat-design-toolbar {
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:7px;
  min-height:31px;
}

.cat-copy {
  display:flex;
  align-items:center;
  gap:7px;
  border:1px solid var(--cat-line);
  border-left:0;
  background:var(--cat-accent-wash);
  color:var(--cat-accent-deep);
  border-radius:0 7px 7px 0;
  padding:7px 12px 7px 14px;
  margin-left:-14px;
  font-size:11px;
  line-height:1.4;
  font-weight:600;
}

.cat-copy:hover {
  background:var(--cat-accent-soft);
}

/* Copied state. Deliberately signalled by FILL, not by hue: under the LMU
   palette the brand colour is green, so a green-on-pale "success" tint would be
   almost indistinguishable from the button's normal state. Filled green with
   white text is unmistakable, and the icon and label change too, so the state
   never depends on colour perception alone. */
.cat-copy.is-copied {
  color:var(--cat-ok-text);
  background:var(--cat-ok-surface);
  border-color:var(--cat-ok-line);
  font-weight:650;
}

.cat-copy.is-error {
  color:var(--cat-err-text);
  background:var(--cat-err-surface);
  border-color:var(--cat-err-line);
}

.cat-copy:disabled {
  opacity:.75;
}

.cat-expand {
  margin-left:auto;
  background:none;
  border:0;
  color:var(--cat-text-soft);
  font-size:10px;
  padding:5px;
  display:flex;
  align-items:center;
  gap:4px;
}

.cat-expand:hover {
  color:var(--cat-accent-deep);
}

.cat-tree-scroll {
  min-height:85px;
  overflow:auto;
  flex:1;
  scrollbar-width:thin;
  scrollbar-color:var(--cat-line) transparent;
  overscroll-behavior:contain;
  border-radius:5px;
}

.cat-tree-scroll svg {
  display:block;
  min-width:420px;
  width:100%;
  height:auto;
}

.cat-tree-heading {
  font:7px system-ui,sans-serif;
  fill:var(--cat-text-soft);
  letter-spacing:.35px;
}

.cat-tree-wire {
  fill:none;
  stroke:var(--cat-line);
  stroke-width:1.2;
}

.cat-tree-node rect {
  fill:var(--cat-surface-soft);
  stroke:var(--cat-line-faint);
  stroke-width:1;
}

.cat-tree-node text {
  font:10px system-ui,sans-serif;
  fill:var(--cat-ink);
}

.cat-tree-node--root rect {
  fill:var(--cat-accent-fill);
  stroke:var(--cat-accent-fill);
}

.cat-tree-node--root text {
  fill:var(--cat-surface);
  font-weight:600;
}

.cat-tree-node--arm rect {
  fill:var(--cat-accent-soft);
  stroke:var(--cat-line);
}

.cat-tree-node--event rect {
  fill:var(--cat-ok-surface);
  stroke:var(--cat-ok-line);
}

.cat-tree-node--more rect {
  fill:var(--cat-surface-soft);
  stroke:var(--cat-line-faint);
}

.cat-tree-node--more text {
  fill:var(--cat-text-soft);
  font-size:9px;
}

.cat-tree-count {
  fill:var(--cat-accent)!important;
  font-size:10px!important;
  font-weight:650!important;
}

.cat-tree-legend {
  display:flex;
  flex-wrap:wrap;
  gap:6px 12px;
  padding-top:8px;
  margin-top:7px;
  border-top:1px solid var(--cat-line-faint);
  font-size:9px;
  color:var(--cat-text-soft);
}

.cat-back-link {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:var(--cat-text);
  font-size:10px;
  font-weight:600;
  text-decoration:none;
  padding-top:10px;
  margin-top:auto;
}

.cat-back-link:hover {
  color:var(--cat-accent);
  text-decoration:underline;
}

.cat-lockbox {
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:12px 18px;
  color:var(--cat-text-soft);
}

.cat-lockbox>.bi {
  font-size:26px;
  color:var(--cat-line-strong);
  margin-bottom:7px;
}

.cat-lockbox h4 {
  font-size:13px;
  font-weight:650;
  color:var(--cat-text);
  margin:0 0 7px;
}

.cat-lockbox p {
  font-size:11px;
  line-height:1.7;
  max-width:235px;
  margin:0;
}

/* Progressive enhancement: content stays in normal flow when JavaScript is absent. */
.cat-enhanced .cat-card {
  height:340px;
}

.cat-enhanced .cat-front {
  height:100%;
  padding-bottom:calc(var(--cat-peek) + 16px);
  overflow:auto;
}

.cat-enhanced .cat-shutter {
  position:absolute;
  inset:0;
  transform:translateY(calc(100% - var(--cat-peek)));
  transition:transform .58s var(--cat-roll);
  box-shadow:0 -6px 20px #1b43800b;
  z-index:2;
}

.cat-enhanced .cat-body {
  height:calc(100% - var(--cat-peek));
  min-height:0;
}

.cat-enhanced .cat-card.is-open .cat-shutter {
  transform:translateY(0);
}

.cat-enhanced .cat-card.is-open .cat-chevron {
  transform:rotate(180deg);
}

.cat-enhanced .cat-copy {
  transform:translateX(-112%);
  opacity:0;
  transition:transform .42s var(--cat-roll),opacity .25s;
}

.cat-enhanced .cat-card.is-open .cat-copy {
  transform:translateX(0);
  opacity:1;
  transition-delay:.18s;
}

.cat-handle:focus-visible {
  outline-offset:-4px!important;
}

.cat-empty {
  text-align:center;
  border:1px dashed var(--cat-line);
  border-radius:12px;
  background:var(--cat-surface-soft);
  padding:40px 20px;
  color:var(--cat-text-soft);
}

.cat-empty>.bi {
  font-size:27px;
}

.cat-empty h2 {
  font-size:20px;
  margin:14px 0 8px;
}

.cat-empty p {
  font-size:13px;
}

.cat-pagination {
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin:30px 0;
}

.cat-pagination a {
  border:1px solid var(--cat-line-faint);
  background:var(--cat-surface);
  color:var(--cat-text);
  padding:7px 12px;
  border-radius:7px;
  text-decoration:none;
  font-size:12px;
}

.cat-pagination a[aria-current=page] {
  background:var(--cat-accent-fill);
  color:var(--cat-surface);
  border-color:var(--cat-accent-fill);
}

.cat-footnote {
  font-size:10px;
  color:var(--cat-text-soft);
  border-top:1px solid var(--cat-line-faint);
  padding-top:16px;
  line-height:1.7;
  margin:27px 0 0;
}

.cat-dialog {
  border:1px solid var(--cat-line-faint);
  background:var(--cat-surface);
  border-radius:15px;
  color:var(--cat-ink);
  padding:0;
  width:min(920px,calc(100% - 28px));
  max-height:88vh;
  box-shadow:0 24px 90px #12346138;
}

.cat-dialog::backdrop {
  background:#182e4f75;
  backdrop-filter:blur(4px);
}

.cat-dialog-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:17px 21px;
  border-bottom:1px solid var(--cat-line-faint);
}

.cat-dialog-header h2 {
  font-size:18px;
  font-weight:650;
  margin:0;
  line-height:1.4;
}

.cat-dialog-header button {
  width:32px;
  height:32px;
  border:0;
  border-radius:7px;
  background:var(--cat-surface-soft);
  color:var(--cat-text-soft);
  font-size:14px;
  flex:none;
}

.cat-dialog-content {
  padding:20px 22px;
  font-size:12px;
  line-height:1.7;
}

.cat-dialog-content .cat-tree-scroll {
  max-height:420px;
  overflow:auto;
  margin-bottom:20px;
}

.cat-dialog-content svg {
  max-height:none;
}

.cat-dialog-content h3 {
  font-size:13px;
  font-weight:650;
}

.cat-dialog-content ul {
  padding-left:16px;
  list-style:none;
}

.cat-dialog-content li {
  padding:3px 0;
  overflow-wrap:anywhere;
}

.cat-dialog-content .cat-depth-1 {
  margin-left:19px;
}

.cat-dialog-content .cat-depth-2 {
  margin-left:38px;
}

.cat-dialog-content .cat-depth-3 {
  margin-left:57px;
}

.cat-dialog-content li:before {
  content:'•';
  color:var(--cat-line-strong);
  margin-right:7px;
}

.cat-dialog--copy {
  max-width:780px;
}

.cat-dialog textarea {
  display:block;
  width:100%;
  min-height:260px;
  max-height:45vh;
  resize:vertical;
  background:var(--cat-surface-soft);
  border:1px solid var(--cat-line-faint);
  border-radius:8px;
  color:var(--cat-ink);
  padding:13px;
  font:11px/1.65 ui-monospace,monospace;
}

.cat-dialog-actions {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:15px;
}

.cat-copy-help {
  font-size:10px;
  color:var(--cat-text-soft);
  margin-top:15px;
}

@media(hover:hover) and (pointer:fine) {
  .cat-card:hover {
    transform:translateY(-2px);
  }

}

@media(max-width:720px) {
  .cat-page {
    padding:23px 16px 30px;
  }

  .cat-header {
    gap:12px;
    margin-bottom:22px;
  }

  .cat-header h1 {
    font-size:30px;
  }

  .cat-lede {
    font-size:12px;
  }

  .cat-header-icon {
    width:39px;
    height:39px;
    font-size:20px;
  }

  .cat-eyebrow {
    font-size:9px;
  }

  .cat-search-field {
    min-height:41px;
  }

  .cat-search-field input {
    font-size:11px;
  }

  .cat-search>.cat-button {
    min-height:41px;
    padding:9px 13px;
  }

  .cat-filters {
    gap:5px;
  }

  .cat-filters a {
    font-size:10px;
    padding:6px 10px;
  }

  .cat-results-bar {
    gap:9px;
  }

  .cat-instructions {
    display:none;
  }

  .cat-section-heading {
    gap:7px;
  }

  .cat-section-heading h2 {
    font-size:10px;
  }

  .cat-section-heading span {
    font-size:9px;
  }

  .cat-grid {
    gap:15px;
  }

  .cat-enhanced .cat-card {
    height:330px;
  }

  .cat-dialog-content {
    padding:17px;
  }

  .cat-dialog-header {
    padding:15px 17px;
  }

}


/* ============================================================
   Catalogue readability + shutter affordance
   Keep the study title and institution at their existing sizes.
   ============================================================ */

.cat-page .cat-meta p {
  font-size:14px;
}

.cat-page .cat-date-kind {
  font-size:12px;
}

.cat-page .cat-study-details-copy strong {
  font-size:13px;
}

.cat-page .cat-study-details-copy small {
  font-size:11px;
}

.cat-page .cat-study-page-link {
  font-size:12px;
}

.cat-page .cat-handle-label {
  font-size:13px;
}

.cat-page .cat-handle-summary {
  font-size:12px;
}

.cat-page .cat-shutter-title {
  font-size:13px;
}

.cat-page .cat-copy {
  font-size:13px;
}

.cat-page .cat-expand {
  font-size:12px;
}

.cat-page .cat-tree-heading {
  font-size:9px;
}

.cat-page .cat-tree-node text {
  font-size:12px;
}

.cat-page .cat-tree-node--more text {
  font-size:11px;
}

.cat-page .cat-tree-count {
  font-size:12px!important;
}

.cat-page .cat-tree-legend {
  font-size:11px;
}

.cat-page .cat-lockbox h4 {
  font-size:15px;
}

.cat-page .cat-lockbox p {
  font-size:13px;
}

.cat-page .cat-copy-status:not(.cat-sr) {
  font-size:12px;
}

/* Catalogue navigation and section guidance should remain comfortably readable. */
.cat-page .cat-results-bar {
  font-size:13px;
}

.cat-page .cat-instructions {
  font-size:12px;
}

.cat-page .cat-hover-setting {
  font-size:12px;
}

.cat-page .cat-section-heading h2 {
  font-size:13px;
}

.cat-page .cat-section-heading span {
  font-size:12px;
}

/* Slightly larger chevron plus a gentle discovery cue while closed. */
.cat-page .cat-chevron {
  display:inline-block;
  font-size:15px;
  transition:transform .58s var(--cat-roll);
}

.cat-enhanced .cat-card:not(.is-open) .cat-chevron {
  animation:cat-chevron-hint 1.6s ease-in-out infinite;
}

@keyframes cat-chevron-hint {
  0%, 100% {
    transform:translateY(0);
  }

  45% {
    transform:translateY(-5px);
  }

  70% {
    transform:translateY(2px);
  }
}


/* Stronger shutter affordance: a compact double-chevron control. */
.cat-page .cat-chevron {
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  flex:none;
  border-radius:50%;
  background:var(--cat-accent-soft);
  color:var(--cat-accent-deep);
  font-size:16px;
  transition:transform .58s var(--cat-roll), background .18s;
}

.cat-page .cat-handle:hover .cat-chevron {
  background:var(--cat-accent-wash);
}

/* Sequential "shooting star" along the top edge of each shutter.
   Each card receives its delay from catalogue.js. */
.cat-pulse-ready .cat-card .cat-handle::after {
  content:"";
  position:absolute;
  z-index:3;
  pointer-events:none;

  top:-4px;
  left:-90px;
  width:82px;
  height:6px;
  border-radius:999px;
  opacity:0;

  background:
    radial-gradient(
      circle at 96% 50%,
      var(--cat-surface) 0 1.5px,
      var(--cat-accent-fill) 2px 3px,
      transparent 3.5px
    ),
    linear-gradient(
      90deg,
      transparent 0%,
      var(--cat-accent-soft) 52%,
      var(--cat-accent-fill) 100%
    );

  filter:drop-shadow(0 0 3px var(--cat-accent-soft));

  animation:cat-shutter-tracer
            var(--cat-pulse-cycle, 14s)
            linear
            infinite;

  animation-delay:var(--cat-pulse-delay, 1s);
}

@keyframes cat-shutter-tracer {
  0% {
    left:-90px;
    opacity:0;
  }

  .5% {
    opacity:.9;
  }

  5% {
    left:calc(100% + 8px);
    opacity:.9;
  }

  6%, 100% {
    left:calc(100% + 8px);
    opacity:0;
  }
}


/* ============================================================
   Impulse stop + finale
   ============================================================ */

.cat-impulse-footer {
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  margin-top:12px;
}

.cat-impulse-stop {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:10px 17px;
  border:1px solid var(--cat-err-line);
  border-radius:999px;
  background:var(--cat-err-surface);
  color:var(--cat-err-text);
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  transition:
    color .18s,
    border-color .18s,
    background .18s,
    transform .18s,
    box-shadow .18s;
}

.cat-impulse-stop:hover {
  color:var(--cat-err-text);
  border-color:var(--lmu-red);
  background:var(--lmu-red-20);
  transform:translateY(-2px);
  box-shadow:0 5px 14px #d7191926;
}

.cat-impulse-stop:disabled {
  cursor:default;
  transform:none;
  opacity:.72;
}

.cat-impulse-stop .bi {
  font-size:14px;
}

.cat-impulse-free {
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  margin:0;
  padding:7px 11px;
  color:var(--cat-accent-deep);
  font-size:13px;
  opacity:0;
  transform:translateY(5px) scale(.96);
  transition:
    opacity .4s ease,
    transform .5s var(--cat-roll);
}

.cat-impulse-free .bi {
  font-size:15px;
}

.cat-impulse-free.is-visible {
  opacity:1;
  transform:translateY(0) scale(1);
}


/* Tiny physical response when the runaway impulse reaches the control. */
.cat-impulse-free.is-impact {
  animation:cat-impulse-impact .48s cubic-bezier(.36,.07,.19,.97);
}

@keyframes cat-impulse-impact {
  0% {
    transform:translateY(0) translateX(0) scale(1);
  }

  18% {
    transform:translateY(0) translateX(-4px) scale(1.035);
  }

  36% {
    transform:translateY(0) translateX(4px) scale(.99);
  }

  54% {
    transform:translateY(0) translateX(-2px) scale(1.015);
  }

  72% {
    transform:translateY(0) translateX(2px) scale(1);
  }

  100% {
    transform:translateY(0) translateX(0) scale(1);
  }
}


/* Stop the normal repeating impulse while its final lap runs. */
.cat-pulse-finishing.cat-pulse-ready
.cat-card .cat-handle::after {
  animation:none!important;
  opacity:0;
}


/* One deliberate shooting-star sweep per card. */
.cat-pulse-finishing
.cat-card.cat-pulse-once
.cat-handle::after {
  animation:cat-shutter-tracer-once .78s cubic-bezier(.22,.75,.30,1) 1!important;
}

@keyframes cat-shutter-tracer-once {
  0% {
    left:-90px;
    opacity:0;
  }

  10% {
    opacity:.95;
  }

  88% {
    left:calc(100% + 8px);
    opacity:.95;
  }

  100% {
    left:calc(100% + 8px);
    opacity:0;
  }
}


/* The final impulse leaves the last card and flies into the control. */
.cat-runaway-pulse {
  position:fixed;
  z-index:10000;
  pointer-events:none;
  width:72px;
  height:7px;
  border-radius:999px;

  background:
    radial-gradient(
      circle at 96% 50%,
      var(--lmu-white) 0 1.5px,
      var(--lmu-green) 2px 3.5px,
      transparent 4px
    ),
    linear-gradient(
      90deg,
      transparent 0%,
      var(--lmu-green-20) 54%,
      var(--lmu-green) 100%
    );

  filter:drop-shadow(0 0 4px var(--lmu-green-20));
}


/* Mobile: large tap target, full-width finish control and a shorter comet.
   The normal card ordering naturally becomes top-to-bottom on one-column grids. */
@media(max-width:720px) {
  .cat-impulse-footer {
    min-height:52px;
    justify-content:stretch;
    margin-top:14px;
  }

  .cat-impulse-stop,
  .cat-impulse-free {
    width:100%;
    min-height:44px;
    justify-content:center;
  }

  .cat-impulse-stop {
    min-height:46px;
    padding:10px 14px;
    font-size:14px;
  }

  .cat-pulse-finishing
  .cat-card.cat-pulse-once
  .cat-handle::after {
    animation-duration:.56s!important;
  }

  .cat-impulse-free {
    font-size:14px;
  }

  .cat-runaway-pulse {
    width:48px;
    height:6px;
  }
}

@media(prefers-reduced-motion:reduce) {
  .cat-page .cat-card,.cat-page .cat-shutter,.cat-page .cat-chevron,.cat-page .cat-copy,.cat-page .cat-button,.cat-page .cat-handle::after {
    transition:none!important;
    animation:none!important;
  }

  .cat-page .cat-card:hover {
    transform:none;
  }

}


/* Visible AI Context errors use the same LMU red treatment as the button. */
.cat-copy-status:not(.cat-sr) {
  display:block;
  margin-top:8px;
  padding:7px 9px;
  border:1px solid var(--cat-err-line);
  border-radius:7px;
  background:var(--cat-err-surface);
  color:var(--cat-err-text);
  font-size:10px;
  line-height:1.45;
}