/* Knowledge Plaza — bright editorial discovery, inspired by premium AI product pages. */
.knowledge-page {
  --kp-ink: #101117;
  --kp-subtle: #606675;
  --kp-muted: #8b91a0;
  --kp-line: rgba(20, 24, 36, .09);
  --kp-blue: #3278f6;
  --kp-violet: #8066f6;
  --kp-paper: #f6f7fa;
  background:
    radial-gradient(circle at 82% 3%, rgba(139, 188, 255, .2), transparent 23%),
    radial-gradient(circle at 62% 10%, rgba(179, 157, 255, .14), transparent 21%),
    linear-gradient(180deg, #fcfcfd 0, var(--kp-paper) 38%, #f7f8fa 100%);
  color: var(--kp-ink);
  font-family: Inter, "SF Pro Display", "PingFang SC", system-ui, sans-serif;
}

.knowledge-page::before {
  position: fixed;
  top: -180px;
  right: -100px;
  width: 520px;
  height: 520px;
  border: 0;
  border-radius: 45% 55% 63% 37%;
  background:
    radial-gradient(circle at 38% 40%, rgba(255, 255, 255, .9), transparent 15%),
    radial-gradient(circle at 44% 52%, rgba(112, 198, 255, .34), transparent 34%),
    radial-gradient(circle at 64% 44%, rgba(148, 111, 255, .28), transparent 38%);
  box-shadow: none;
  filter: blur(22px);
  opacity: .72;
  animation: knowledge-aurora 14s ease-in-out infinite alternate;
}

.knowledge-page-inner {
  width: min(1240px, 100%);
  padding: clamp(28px, 4vw, 52px) clamp(20px, 4.6vw, 64px) 88px;
}

.knowledge-back {
  min-height: 34px;
  margin-bottom: 18px;
  padding: 0 11px 0 8px;
  border: 1px solid var(--kp-line);
  border-radius: 999px;
  background: rgba(255, 255, 255, .65);
  color: #6f7583;
  backdrop-filter: blur(12px);
  transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}
.knowledge-back:hover,
.knowledge-back:focus-visible {
  border-color: rgba(50, 120, 246, .28);
  outline: none;
  background: #fff;
  color: var(--kp-ink);
  transform: translateX(-2px);
}

.knowledge-top {
  min-height: 224px;
  align-items: center;
  margin-bottom: 22px;
  padding: clamp(28px, 4vw, 48px);
  border: 1px solid rgba(255, 255, 255, .88);
  border-radius: 28px;
  background:
    linear-gradient(105deg, rgba(255, 255, 255, .98) 0 49%, rgba(255, 255, 255, .72) 68%, rgba(235, 242, 255, .58) 100%);
  box-shadow: 0 24px 70px rgba(42, 50, 76, .08), inset 0 0 0 1px rgba(23, 28, 43, .035);
  backdrop-filter: blur(20px);
}

.knowledge-top::before {
  position: absolute;
  right: clamp(25px, 8vw, 105px);
  width: clamp(130px, 17vw, 220px);
  aspect-ratio: 1;
  border-radius: 44% 56% 61% 39% / 51% 38% 62% 49%;
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, .96) 0 6%, transparent 7%),
    radial-gradient(circle at 38% 38%, #bbf1e8, transparent 29%),
    radial-gradient(circle at 68% 28%, #bdd8ff, transparent 34%),
    radial-gradient(circle at 55% 70%, #d8c4ff, transparent 42%),
    #dce9ff;
  box-shadow: inset 16px 14px 40px rgba(255, 255, 255, .54), 0 28px 65px rgba(100, 119, 207, .2);
  content: "";
  filter: saturate(.92);
  opacity: .9;
  transform: rotate(-9deg);
  animation: knowledge-float 7s ease-in-out infinite;
}

.knowledge-top::after {
  top: auto;
  right: clamp(55px, 12vw, 155px);
  bottom: 15px;
  width: clamp(100px, 15vw, 190px);
  height: 24px;
  border-radius: 50%;
  background: rgba(91, 110, 185, .16);
  filter: blur(15px);
  opacity: .55;
}

.knowledge-top > div { max-width: min(650px, 64%); }
.knowledge-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #697083;
  font-size: 10px;
  letter-spacing: .18em;
}
.knowledge-kicker::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--kp-blue), var(--kp-violet));
  box-shadow: 0 0 0 4px rgba(70, 112, 246, .09);
  content: "";
}
.knowledge-top h1 {
  margin: 13px 0 10px;
  color: #08090c;
  font-family: Inter, "SF Pro Display", "PingFang SC", system-ui, sans-serif;
  font-size: clamp(38px, 5vw, 64px);
  font-weight: 720;
  letter-spacing: -.065em;
}
.knowledge-top p {
  max-width: 585px;
  color: #5f6573;
  font-size: 14px;
  line-height: 1.8;
}

.knowledge-daily {
  position: relative;
  overflow: hidden;
  margin-bottom: 22px;
  padding: clamp(22px, 3vw, 34px);
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 24px;
  background:
    radial-gradient(circle at 88% -20%, rgba(79, 126, 255, .38), transparent 33%),
    radial-gradient(circle at 10% 120%, rgba(132, 91, 255, .24), transparent 32%),
    linear-gradient(145deg, #141929, #0d111d 70%);
  box-shadow: 0 26px 70px rgba(20, 25, 45, .16), inset 0 1px 0 rgba(255, 255, 255, .055);
  color: #fff;
}

.knowledge-daily::before {
  position: absolute;
  top: -100px;
  right: 6%;
  width: 300px;
  height: 210px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(113, 100, 255, .2), transparent 68%);
  content: "";
  filter: blur(18px);
  pointer-events: none;
}

.knowledge-daily > * { position: relative; z-index: 1; }
.knowledge-daily-eyebrow { color: #8e9ab5; letter-spacing: .2em; }
.knowledge-daily-head strong { color: #fff; font-size: 17px; }
.knowledge-daily-head > div:first-child > span:not(.knowledge-daily-eyebrow) { color: #747f97; }
.knowledge-daily-head h2 {
  margin-top: 10px;
  color: #fff;
  font-size: clamp(22px, 2.4vw, 32px);
  font-weight: 650;
  letter-spacing: -.035em;
}
.knowledge-daily-intro { color: #aab2c4; font-size: 13px; }
.knowledge-daily-actions { gap: 8px; }
.knowledge-daily-head button {
  min-height: 36px;
  padding: 0 13px;
  border-color: rgba(255, 255, 255, .12);
  border-radius: 10px;
  background: rgba(255, 255, 255, .055);
  color: #bcc3d2;
  backdrop-filter: blur(10px);
}
.knowledge-daily-head button:hover,
.knowledge-daily-head button:focus-visible {
  border-color: rgba(147, 135, 255, .48);
  background: rgba(133, 112, 255, .14);
  color: #fff;
}

.knowledge-daily-board { gap: 10px; }
.knowledge-daily-card {
  padding: 16px 17px 15px;
  border-color: rgba(255, 255, 255, .085);
  border-radius: 13px;
  background: rgba(255, 255, 255, .045);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
  backdrop-filter: blur(9px);
}
.knowledge-daily-card:hover {
  border-color: rgba(138, 128, 255, .36);
  background: rgba(255, 255, 255, .07);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .13);
  transform: translateY(-2px);
}
.knowledge-daily-index { color: #626d84; }
.knowledge-daily-title a,
.knowledge-daily-title strong { color: #f6f7fb; }
.knowledge-daily-title a:hover { color: #bbb3ff; text-decoration: none; }
.knowledge-daily-stars { color: #818ca3; }
.knowledge-daily-row { color: #b8bfcd; }
.knowledge-daily-row b { color: #6f7b92; }
.knowledge-daily-stack {
  border-color: rgba(255, 255, 255, .1);
  border-radius: 999px;
  background: rgba(139, 124, 255, .07);
  color: #9fa8bc;
}
.knowledge-daily-open { color: #9ea8bc; }
.knowledge-daily-open:hover { color: #fff; }
.knowledge-daily-loading,
.knowledge-daily-empty { color: #8792a8; }
.knowledge-daily-spinner { border-color: rgba(255, 255, 255, .16); border-top-color: #9b90ff; }
.knowledge-daily-body {
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 12px;
  background: rgba(6, 9, 18, .38);
  color: #bfc5d2;
}
.knowledge-daily-body :is(h1, h2, h3) { color: #fff; }

.knowledge-search {
  grid-template-columns: minmax(0, 1fr) 150px 140px auto;
  gap: 8px;
  padding: 9px;
  border-color: rgba(19, 24, 38, .08);
  border-radius: 16px;
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 14px 38px rgba(34, 42, 66, .07), inset 0 1px 0 #fff;
  backdrop-filter: blur(18px);
}
.knowledge-search:focus-within {
  border-color: rgba(70, 112, 246, .3);
  box-shadow: 0 18px 48px rgba(47, 72, 137, .1), 0 0 0 3px rgba(50, 120, 246, .06);
}
.knowledge-search input,
.knowledge-search select {
  min-height: 42px;
  border-color: transparent;
  border-radius: 10px;
  background: #f4f5f8;
  color: var(--kp-ink);
  font-size: 12px;
}
.knowledge-search input:focus,
.knowledge-search select:focus { border-color: rgba(50, 120, 246, .24); background: #fff; }
.knowledge-search button,
.knowledge-analyze-button {
  min-height: 42px;
  border: 1px solid #171921;
  border-radius: 11px;
  background: #11131a;
  box-shadow: 0 8px 18px rgba(17, 19, 26, .15);
  color: #fff;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.knowledge-search button:hover:not(:disabled),
.knowledge-search button:focus-visible,
.knowledge-analyze-button:hover:not(:disabled),
.knowledge-analyze-button:focus-visible {
  outline: none;
  background: #272b36;
  box-shadow: 0 11px 24px rgba(17, 19, 26, .2);
  transform: translateY(-1px);
}

.knowledge-status { color: var(--kp-muted); }
.knowledge-toolbar { margin: 27px 2px 13px; }
.knowledge-toolbar strong { color: var(--kp-ink); font-size: 16px; }
.knowledge-toolbar span { color: var(--kp-muted); }

.knowledge-grid { gap: 14px; }
.knowledge-card {
  position: relative;
  min-height: 218px;
  overflow: hidden;
  padding: 19px;
  border-color: rgba(20, 24, 36, .08);
  border-radius: 16px;
  background: rgba(255, 255, 255, .91);
  box-shadow: 0 7px 24px rgba(30, 38, 62, .045);
}
.knowledge-card::before {
  position: absolute;
  top: 0;
  right: 18px;
  left: 18px;
  height: 2px;
  border-radius: 0 0 2px 2px;
  background: linear-gradient(90deg, transparent, rgba(50, 120, 246, .45), rgba(128, 102, 246, .38), transparent);
  content: "";
  opacity: 0;
  transition: opacity .2s ease;
}
.knowledge-card:hover {
  border-color: rgba(72, 102, 176, .16);
  box-shadow: 0 18px 42px rgba(30, 38, 62, .09);
  transform: translateY(-3px);
}
.knowledge-card:hover::before { opacity: 1; }
.knowledge-card h3 { color: #161820; font-size: 15px; }
.knowledge-card p { color: #686e7c; font-size: 12px; }
.knowledge-tags span {
  padding: 4px 7px;
  border-color: rgba(50, 120, 246, .09);
  border-radius: 999px;
  background: rgba(50, 120, 246, .045);
  color: #727a8c;
}
.knowledge-star { color: #b1b5c0; }
.knowledge-star:hover,
.knowledge-star:focus-visible { outline: none; color: #8b72eb; }
.knowledge-star.active { color: #8b72eb; }
.knowledge-card-meta { color: #9298a5; }
.knowledge-card-meta strong { color: #5c6371; }
.knowledge-card-actions button {
  min-height: 34px;
  border-color: rgba(19, 24, 38, .09);
  border-radius: 9px;
  background: #f6f7f9;
  color: #626978;
}
.knowledge-card-actions button:hover,
.knowledge-card-actions button:focus-visible { border-color: rgba(50, 120, 246, .25); outline: none; background: #fff; color: #22252e; }
.knowledge-card-actions button.primary { border-color: #191b23; background: #191b23; color: #fff; }
.knowledge-card-actions button.primary:hover { background: #2e3240; }

.knowledge-empty {
  border-color: rgba(37, 46, 70, .11);
  border-radius: 16px;
  background: rgba(255, 255, 255, .64);
  color: var(--kp-muted);
}
.knowledge-empty strong { color: var(--kp-ink); }

.knowledge-detail {
  padding: clamp(20px, 3vw, 30px);
  border-color: rgba(20, 24, 36, .08);
  border-radius: 20px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 22px 55px rgba(35, 43, 68, .08);
}
.knowledge-detail h2 { color: var(--kp-ink); font-size: 24px; letter-spacing: -.03em; }
.knowledge-detail-head p { color: var(--kp-subtle); }
.knowledge-detail-close { color: var(--kp-muted); }
.knowledge-detail-close:hover,
.knowledge-detail-close:focus-visible { outline: none; color: var(--kp-ink); }
.knowledge-detail-stats { gap: 20px; color: var(--kp-muted); }
.knowledge-detail-stats b { color: var(--kp-ink); }
.knowledge-detail-label { color: #767d8c; }
.knowledge-readme,
.knowledge-tree {
  border-color: rgba(20, 24, 36, .08);
  border-radius: 12px;
  background: #f6f7f9;
  color: #5e6574;
}
.knowledge-detail-actions button {
  min-height: 38px;
  border-color: rgba(20, 24, 36, .1);
  border-radius: 10px;
  background: #f6f7f9;
  color: #5d6574;
}
.knowledge-detail-actions button:hover,
.knowledge-detail-actions button:focus-visible { border-color: rgba(50, 120, 246, .25); outline: none; background: #fff; color: var(--kp-ink); }
.knowledge-detail-actions .primary { border-color: #171921; background: #171921; color: #fff; }
.knowledge-analysis {
  border-color: rgba(20, 24, 36, .08);
  border-radius: 13px;
  background: #f7f8fa;
  color: #5c6372;
}

@keyframes knowledge-aurora {
  from { transform: translate3d(0, 0, 0) rotate(-5deg); }
  to { transform: translate3d(-20px, 18px, 0) rotate(5deg); }
}
@keyframes knowledge-float {
  0%, 100% { transform: translateY(0) rotate(-9deg); }
  50% { transform: translateY(-8px) rotate(-5deg); }
}

@media (max-width: 900px) {
  .knowledge-top { min-height: 200px; }
  .knowledge-top::before { right: 30px; opacity: .66; }
  .knowledge-top > div { max-width: 72%; }
  .knowledge-search { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
  .knowledge-page-inner { padding-inline: 14px; }
  .knowledge-top { min-height: auto; padding: 26px 22px; border-radius: 20px; }
  .knowledge-top > div { max-width: 100%; }
  .knowledge-top::before { top: -40px; right: -55px; width: 150px; opacity: .35; }
  .knowledge-top h1 { font-size: 38px; }
  .knowledge-top p { font-size: 13px; }
  .knowledge-daily { padding: 20px 15px; border-radius: 18px; }
  .knowledge-daily-head { flex-direction: column; }
  .knowledge-daily-actions { width: 100%; }
  .knowledge-daily-actions button { min-height: 40px; }
  .knowledge-daily-card { padding-inline: 14px; }
  .knowledge-daily-bottom { margin-left: 31px; }
  .knowledge-search { grid-template-columns: 1fr; border-radius: 14px; }
  .knowledge-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .knowledge-page::before,
  .knowledge-top::before,
  .knowledge-daily,
  .knowledge-daily-card { animation: none; }
}

/* Light recommendation board: hierarchy comes from layout, borders and motion. */
.knowledge-daily {
  border-color: rgba(52, 64, 94, .09);
  background:
    radial-gradient(circle at 88% -24%, rgba(164, 193, 255, .38), transparent 34%),
    radial-gradient(circle at 6% 118%, rgba(209, 188, 255, .3), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(244, 247, 255, .94));
  box-shadow: 0 23px 62px rgba(40, 52, 82, .09), inset 0 1px 0 #fff;
  color: #1d2029;
}
.knowledge-daily::before {
  background: radial-gradient(circle, rgba(133, 155, 244, .16), transparent 68%);
}
.knowledge-daily-eyebrow { color: #7e8493; }
.knowledge-daily-head strong { color: #1a1d25; }
.knowledge-daily-head > div:first-child > span:not(.knowledge-daily-eyebrow) { color: #969ba7; }
.knowledge-daily-head h2 { color: #15171e; }
.knowledge-daily-intro { color: #626978; }
.knowledge-daily-head button {
  border-color: rgba(35, 43, 65, .1);
  background: rgba(255, 255, 255, .72);
  color: #626978;
  box-shadow: 0 5px 15px rgba(43, 53, 80, .04);
}
.knowledge-daily-head button:hover,
.knowledge-daily-head button:focus-visible {
  border-color: rgba(112, 101, 216, .28);
  background: #fff;
  color: #51498f;
}
.knowledge-daily-card {
  border-color: rgba(39, 47, 70, .085);
  background: rgba(255, 255, 255, .72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 6px 18px rgba(47, 57, 87, .025);
}
.knowledge-daily-card:hover {
  border-color: rgba(112, 101, 216, .2);
  background: #fff;
  box-shadow: 0 14px 32px rgba(48, 57, 87, .075);
}
.knowledge-daily-index { color: #9a9fab; }
.knowledge-daily-title a,
.knowledge-daily-title strong { color: #20232c; }
.knowledge-daily-title a:hover { color: #6258b6; }
.knowledge-daily-stars { color: #9298a6; }
.knowledge-daily-row { color: #5e6574; }
.knowledge-daily-row b { color: #9096a3; }
.knowledge-daily-stack {
  border-color: rgba(112, 101, 216, .1);
  background: rgba(112, 101, 216, .055);
  color: #757b89;
}
.knowledge-daily-open { color: #737988; }
.knowledge-daily-open:hover { color: #4e4790; }
.knowledge-daily-loading,
.knowledge-daily-empty { color: #8c92a0; }
.knowledge-daily-spinner { border-color: #d9dce5; border-top-color: #766bd0; }
.knowledge-daily-body {
  border-color: rgba(39, 47, 70, .085);
  background: rgba(255, 255, 255, .7);
  color: #5d6472;
}
.knowledge-daily-body :is(h1, h2, h3) { color: #242730; }