/* Shared visual layer; scientific content and source images remain unchanged. */
body{background:#faf6ef}
.library-switch{padding-top:16px;padding-bottom:14px}
.library-choice{background:#fffdf9;border-color:#e9dac7;box-shadow:0 3px 12px #68431c06}
.library-choice.active{background:linear-gradient(145deg,#fff6e8,#f5dec0);box-shadow:inset 0 3px #ca772f,0 5px 15px #8f521013}
.panel{background:#fffefb;border-color:#e8dccd;box-shadow:0 4px 20px #60401c08}
.panel .toolbar{padding-top:16px;padding-bottom:9px;gap:10px}
.panel .chiprow{border-top:1px solid #f2e9de;padding-top:12px;padding-bottom:14px}
.panel input[type=search],.panel select{border-color:#deceb9;border-radius:10px;background:#fff;min-height:42px}
.panel input[type=search]::placeholder{color:#92816d}
.panel .grpbtn,.panel .chip{background:#fffcf7;border-color:#e5d6c3;color:#755130;min-height:36px}
.panel .grpbtn.active,.panel .grpbtn.open,.panel .chip.active{background:#884610;color:#fff;border-color:#884610}
.card{background:#fffefa;border:1px solid #e8ddcf;border-radius:17px;box-shadow:0 4px 14px #56351407;transition:box-shadow .18s ease,border-color .18s ease,transform .18s ease}
.card .card-body{padding:18px;gap:10px}
.card .card-title{color:#513218;line-height:1.55;letter-spacing:.01em}
.card .meta{color:#8a7661;font-size:11.5px;line-height:1.6}
.card .facts{padding-top:10px;border-top:1px solid #efe5d9;row-gap:7px}
.card .flb,.card .fk{color:#9b7c5e}
.card .fvv{color:#4f4438;line-height:1.65}
.card .tag{border:1px solid #eee0ce;background:#fbf2e4;color:#87592e;border-radius:7px;padding:3px 8px;font-size:10.5px;line-height:1.5}
.card .jif{border:1px solid #e5c58c;background:#fff0cd;color:#825017;box-shadow:none;font-variant-numeric:tabular-nums}
.equipment-kind{background:#f7f1e8;border-color:#e6dac9;color:#80654a}
.equipment-photo{border-color:#eee5da;border-radius:13px;background:#fff;box-shadow:0 3px 12px #75512708}
.detail-table{border-color:#e4d5c2;box-shadow:0 3px 14px #70471505}
.detail-table td{padding:12px 14px;line-height:1.8}
.detail-table tr:not(.sec):nth-child(even) td{background:#fffcf7}
.detail-table td:first-child{color:#805b36}
.detail-table tr.sec td{background:#f6ead8;color:#72461f;font-size:13.5px;letter-spacing:.035em}
.platform-empty{border-style:solid;border-color:#e8d8c2;background:linear-gradient(145deg,#fffdfa,#faf0e2);box-shadow:0 7px 25px #67421908;line-height:1.8}
.platform-empty strong{font-weight:700;letter-spacing:.015em}
.pagination button{min-width:40px;height:40px;border-color:#e3d2bd;border-radius:11px}
.contact-card{border-color:#e5d4bb;box-shadow:0 8px 26px #6c45110a}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #b56828;outline-offset:3px}
header button:focus-visible{outline-color:#ffdaa3}
@media(hover:hover){.card:hover{border-color:#d7b890;box-shadow:0 10px 28px #68411512;transform:translateY(-2px)}.panel .grpbtn:hover,.panel .chip:hover{border-color:#c69460}}
@media(max-width:760px){.library-switch{padding-top:12px;padding-bottom:12px}.library-choice{flex-basis:66%;min-height:78px}.panel .toolbar{padding:13px 12px 9px}.panel .chiprow{padding:11px 12px 13px;gap:8px}.panel .grpbtn,.panel .chip{min-height:40px;padding:8px 13px}.card .card-body{padding:17px}.card .card-title{font-size:14px}.detail-table td{padding:10px 11px;font-size:12.5px}.detail-table tr.sec td{font-size:12.5px}.platform-empty{padding:30px 22px}}

/* Compact equal-height research cards: keep the experimental sequence visible
   while removing the large flex spacer above the image/tag footer. */
@media(min-width:761px){
  .grid{grid-auto-rows:430px;gap:14px;padding-top:14px;padding-bottom:48px}
  .grid>.card{height:430px;min-height:0}
  .process-flow>.intel-card{height:430px;min-height:0}
}
.card .card-body{gap:6px;padding:12px 14px 10px}
.card .fields{gap:2px 9px;padding:7px 10px;line-height:1.45}
.card .facts{padding-top:7px;row-gap:5px}
.card-bottom{min-height:112px;margin-top:8px}
.card-img.side{width:144px;min-height:112px}
@media(max-width:760px){
  .grid{grid-auto-rows:410px;gap:12px;padding-top:12px;padding-bottom:40px}
  .grid>.card{height:410px;min-height:0}
  .process-flow>.intel-card{height:410px;min-height:0}
  .card .card-body{padding:11px 12px 9px;gap:5px}
  .card-bottom{min-height:100px;margin-top:7px}
  .card-img.side{width:124px;min-height:100px}
}
@media(prefers-reduced-motion:reduce){.card,.library-choice,.source-choice{transition:none}.card:hover{transform:none}}

.filter-more{width:100%;font-size:12.5px;color:#87592e}.filter-more summary{cursor:pointer;padding:6px 0}.filter-options{display:flex;flex-wrap:wrap;gap:8px;padding-top:8px;max-height:220px;overflow:auto}.panel .subrow{max-height:280px;overflow:auto}.panel .chip:disabled{opacity:.4;cursor:default}.selected-filters{border-color:#dbad7a!important;background:#fff5e6!important}.selected-filters .chip{max-width:100%;overflow-wrap:anywhere}

/* Toolbar fields already have a visible focus border and shadow. Avoid a second outer ring. */
.panel .toolbar input[type=search]:focus-visible,
.panel .toolbar select:focus-visible{outline:none;border-color:var(--accent,#e8762b);box-shadow:0 0 0 2px rgba(232,118,43,.16)}


/* ==========================================================================
   制剂工艺图谱 11 步端到端流程卡片与六层知识导航弹窗优化
   ========================================================================== */
.modal.workflow-stage-modal {
  max-width: 980px;
  padding: 28px 32px 36px;
}
.stage-stats-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 16px;
}
.stage-stat-badge {
  display: inline-flex;
  align-items: center;
  font-size: 12.5px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  background: #fdf7f0;
  border: 1px solid #e7d5c2;
  color: #7a461b;
}
.stage-nav-anchors {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  background: #faf3ea;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid #ebd9c5;
  margin-bottom: 20px;
}
.stage-nav-anchors a {
  display: inline-block;
  padding: 5px 10px;
  font-size: 12.5px;
  font-weight: 650;
  color: #8c4c1a;
  text-decoration: none;
  border-radius: 6px;
  transition: all 0.15s ease;
}
.stage-nav-anchors a:hover {
  background: #f1dfca;
  color: #5c2c07;
}
.stage-section-block {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid #ebd9c5;
}
.stage-section-title {
  font-size: 16px;
  font-weight: 700;
  color: #4a280d;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}
.stage-section-title .sec-num {
  color: #c25e17;
  font-size: 17px;
}
.stage-section-sub {
  font-size: 12.5px;
  color: #7c6853;
  margin-bottom: 12px;
}
.stage-gap-alert-box {
  background: #fff8f1;
  border: 1px solid #fed7aa;
  border-left: 4px solid #ea580c;
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 14px;
  font-size: 13px;
  line-height: 1.6;
  color: #9a3412;
}
.stage-case-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 480px;
  overflow-y: auto;
  padding-right: 6px;
}
.stage-case-card {
  border: 1px solid #ebd8c4;
  background: #fffdfb;
  border-radius: 10px;
  padding: 12px 14px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.stage-case-card:hover {
  border-color: #c27d38;
  background: #fff9f2;
  box-shadow: 0 3px 10px rgba(138, 75, 24, 0.08);
  transform: translateY(-1px);
}
.case-card-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 6px;
}
.case-card-title {
  font-size: 14px;
  font-weight: 700;
  color: #2b1807;
  line-height: 1.4;
}
.case-card-meta {
  font-size: 11.5px;
  color: #8c7355;
  white-space: nowrap;
}
.case-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 8px;
}
.tag-pill {
  font-size: 11px;
  padding: 1.5px 7px;
  border-radius: 4px;
  background: #f4ece2;
  color: #634b34;
  border: 0.5px solid #e5d7c7;
}
.case-card-facts {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 12.5px;
  line-height: 1.5;
  color: #3b2b1d;
}
.case-fact-row {
  display: flex;
  gap: 8px;
}
.case-fact-k {
  min-width: 60px;
  color: #82582e;
  font-weight: 650;
  flex-shrink: 0;
}
.case-fact-v {
  flex: 1;
  color: #3d2b1a;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.case-card-footer {
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px dashed #eedfcb;
  text-align: right;
}
.case-card-action {
  font-size: 12px;
  color: #b45309;
  font-weight: 650;
}
.stage-eq-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px;
  max-height: 440px;
  overflow-y: auto;
  padding-right: 6px;
}
.stage-eq-card {
  display: flex;
  gap: 10px;
  border: 1px solid #ebd8c4;
  background: #fffdfb;
  border-radius: 10px;
  padding: 10px;
  cursor: pointer;
  transition: all 0.15s ease;
  align-items: center;
}
.stage-eq-card:hover {
  border-color: #c27d38;
  background: #fff9f2;
  box-shadow: 0 3px 10px rgba(138, 75, 24, 0.08);
  transform: translateY(-1px);
}
.stage-eq-thumb {
  width: 72px;
  height: 72px;
  object-fit: contain;
  background: #ffffff;
  border-radius: 6px;
  border: 1px solid #f0e4d6;
  flex-shrink: 0;
}
.stage-eq-thumb-placeholder {
  width: 72px;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f7efe6;
  color: #9e846e;
  font-size: 12px;
  border-radius: 6px;
  flex-shrink: 0;
}
.stage-eq-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}
.stage-eq-name {
  font-size: 12.5px;
  font-weight: 700;
  color: #2b1807;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.stage-eq-vendor {
  font-size: 11px;
  color: #8c7355;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.stage-eq-badges {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin: 2px 0;
}
.stage-eq-badges .eq-tag {
  font-size: 10px;
  padding: 1px 5px;
  background: #f4ece2;
  border-radius: 3px;
  color: #6a4f35;
}
.stage-eq-purpose {
  font-size: 11px;
  color: #523f2d;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.stage-eq-action {
  font-size: 11px;
  color: #b45309;
  font-weight: 650;
  margin-top: 2px;
}
.stage-gap-desc-box {
  background: #fdfaf5;
  border: 1px solid #ebd9c5;
  border-left: 3px solid #b45309;
  border-radius: 6px;
  padding: 10px 14px;
  color: #6a3c14;
  line-height: 1.6;
  font-size: 13px;
}
.stage-empty-hint {
  padding: 20px;
  text-align: center;
  color: #8c7355;
  font-size: 13px;
  background: #faf4eb;
  border-radius: 8px;
}
.modal-nav-breadcrumb {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
  padding: 6px 12px;
  background: #fff6ed;
  border: 1px solid #fcd34d;
  border-radius: 6px;
}
.modal-nav-breadcrumb .btn-breadcrumb {
  background: none;
  border: none;
  font-size: 13px;
  font-weight: 700;
  color: #b45309;
  cursor: pointer;
  padding: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.modal-nav-breadcrumb .btn-breadcrumb:hover {
  text-decoration: underline;
  color: #78350f;
}


.stage-guide-box {
  background: #fdfaf5;
  border: 1px solid #e8d7c4;
  border-left: 4px solid #b45309;
  border-radius: 8px;
  padding: 11px 15px;
  margin-bottom: 14px;
  font-size: 13px;
  line-height: 1.6;
  color: #6a3c14;
}
.stage-guide-box strong {
  color: #873d06;
  margin-right: 6px;
}

/* One result-count treatment for all module toolbars. */
.panel .toolbar .count{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:164px;min-height:32px;padding:5px 12px;flex-shrink:0;font-size:12.5px;font-weight:700;line-height:1.4;font-variant-numeric:tabular-nums;white-space:nowrap}

/* Cross-module knowledge graph exploration bar */
.cross-module-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  background: #fdfaf5;
  border: 1px solid #ebd9c5;
  border-radius: 8px;
  padding: 8px 14px;
  margin: 12px 0 16px;
  font-size: 13px;
}
.cross-bar-label {
  font-weight: 700;
  color: #8c4c1a;
  white-space: nowrap;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.cross-bar-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.cross-link-pill {
  background: #ffffff;
  border: 1px solid #dfcebe;
  color: #633e21;
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.15s ease;
  line-height: 1.4;
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  font-weight: 500;
}
.cross-link-pill:hover {
  background: #f9efe3;
  border-color: #ca772f;
  color: #9a4a08;
  transform: translateY(-1px);
  box-shadow: 0 2px 6px rgba(154, 74, 8, 0.08);
}


/* Native sort controls: presentation only; keep native options and events. */
.panel .toolbar select{
  -webkit-appearance:none;appearance:none;
  padding:10px 38px 10px 14px;
  border:1.5px solid #deceb9;border-radius:12px;
  background-color:#fffdf9;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%239b7c5e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:16px 16px;
  color:#514335;font-family:inherit;font-size:13px;font-weight:600;line-height:1.5;
  min-height:42px;box-sizing:border-box;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.panel .toolbar select:hover{border-color:#bd976e}
.panel .toolbar select:focus,.panel .toolbar select:focus-visible{
  outline:none;border-color:#ba8b5d;box-shadow:0 0 0 2px rgba(186,139,93,.18);
}
@media(forced-colors:active){.panel .toolbar select{-webkit-appearance:auto;appearance:auto;background-image:none}.panel .toolbar select:focus-visible{outline:2px solid Highlight;outline-offset:2px}}

/* Style the native popup as well, where customizable selects are supported. */
@supports (appearance:base-select){
  .panel .toolbar select,.panel .toolbar select::picker(select){appearance:base-select}
  .panel .toolbar select{background-image:none;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px}
  .panel .toolbar select::picker-icon{color:#9b7c5e;transition:rotate .15s ease}
  .panel .toolbar select:open::picker-icon{rotate:180deg}
  .panel .toolbar select::picker(select){
    margin-top:6px;padding:8px;border:1px solid #e4d1ba;border-radius:14px;
    background:#fffdf9;color:#514335;box-shadow:0 10px 28px #5b35151a;
    max-height:min(340px,60vh);overflow:auto;font-family:inherit;
  }
  .panel .toolbar select option{display:flex;align-items:center;gap:12px;min-height:44px;padding:12px;border-radius:9px;background:transparent;color:#514335;font-family:inherit;font-size:13px;line-height:1.5;white-space:normal;cursor:pointer}
  .panel .toolbar select option:hover,.panel .toolbar select option:focus{background:#faf3e9;outline:none}
  .panel .toolbar select option:checked{background:#f8eddd;font-weight:700}
  .panel .toolbar select option::checkmark{order:2;margin-left:auto;color:#a9692b;content:"✓"}
}
