/* Learning Center: public read-only prototype */
.learning-center-page { background: var(--bg-primary); }
.learning-overview-page .map-section, .learning-overview-page .problem-bank-section { display: none; }
.learning-center-page main { position: relative; z-index: 1; }
.learning-center-page .navbar { background: rgba(15, 23, 42, .95); backdrop-filter: blur(12px); }
.learning-hero { min-height: 620px; padding: 150px 0 84px; background: radial-gradient(circle at 75% 42%, rgba(99,102,241,.2), transparent 30%), linear-gradient(135deg, #0b1225 0%, #121d39 60%, #18244a 100%); overflow: hidden; }
.learning-hero .container { display: grid; grid-template-columns: 1fr 420px; gap: 48px; align-items: center; }
.learning-hero-copy { max-width: 680px; }
.eyebrow { display: inline-flex; align-items: center; color: #a5b4fc; font-size: .74rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.learning-hero h1 { margin: 18px 0 20px; font-size: clamp(2.8rem, 7vw, 5.5rem); line-height: 1.08; letter-spacing: -.05em; color: #f8fafc; }
.learning-hero p { max-width: 600px; color: #c4cde0; font-size: 1.1rem; line-height: 1.9; }
.learning-hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.learning-hero-signal { position: relative; height: 360px; display: grid; place-items: center; }
.signal-core { width: 140px; height: 140px; border: 2px solid #818cf8; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: #e0e7ff; background: rgba(30,41,59,.9); box-shadow: 0 0 60px rgba(99,102,241,.35); z-index: 2; }
.signal-core i { font-size: 2rem; color: #a5b4fc; }
.signal-core span { font-size: .84rem; font-weight: 700; }
.signal-orbit { position: absolute; border: 1px solid rgba(129,140,248,.38); border-radius: 50%; transform: rotate(-20deg); }
.signal-orbit-one { width: 280px; height: 180px; }
.signal-orbit-two { width: 360px; height: 260px; transform: rotate(50deg); border-color: rgba(99,102,241,.26); }
.signal-node { position: absolute; padding: 8px 13px; border: 1px solid rgba(165,180,252,.42); border-radius: 999px; color: #dbeafe; background: rgba(15,23,42,.75); font-size: .8rem; box-shadow: 0 8px 20px rgba(0,0,0,.2); }
.signal-node-map { top: 26px; left: 32px; }.signal-node-docs { top: 55px; right: 22px; }.signal-node-problems { bottom: 48px; left: 18px; }.signal-node-blog { bottom: 28px; right: 40px; }
.section-padding { padding: 96px 0; }
.learning-hub { background: var(--bg-primary); }
.section-heading { display: flex; justify-content: space-between; gap: 24px; align-items: end; margin-bottom: 32px; }
.compact-heading { display: block; text-align: center; margin-bottom: 36px; }.compact-heading h2, .section-heading h2 { margin-top: 10px; color: var(--text-primary); font-size: clamp(1.75rem, 3vw, 2.6rem); letter-spacing: -.03em; }.section-heading p { margin-top: 8px; color: var(--text-secondary); }
.learning-hub-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.learning-hub-card { min-height: 156px; padding: 24px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; border: 1px solid var(--border-primary); border-radius: 18px; background: var(--bg-secondary); color: var(--text-primary); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.learning-hub-card:hover { color: var(--text-primary); transform: translateY(-5px); border-color: var(--primary-400); box-shadow: var(--shadow-glow-sm); }.learning-hub-card > span:not(.hub-icon) { display: grid; gap: 6px; }.learning-hub-card strong { font-size: 1.08rem; }.learning-hub-card small { color: var(--text-secondary); }.hub-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: white; background: var(--primary-gradient); }.hub-arrow { align-self: end; color: var(--primary-400); }.hub-docs .hub-icon { background: linear-gradient(135deg,#0ea5e9,#2563eb); }.hub-problems .hub-icon { background: linear-gradient(135deg,#f59e0b,#f97316); }.hub-blog .hub-icon { background: linear-gradient(135deg,#10b981,#059669); }
.map-section { background: linear-gradient(180deg, var(--bg-primary), var(--bg-secondary)); }.map-heading { align-items: center; }.map-controls { display: flex; gap: 8px; padding: 6px; border: 1px solid var(--border-primary); border-radius: 999px; background: var(--bg-secondary); }.map-controls button { min-width: 40px; height: 34px; border: 0; border-radius: 999px; color: var(--text-primary); background: transparent; cursor: pointer; }.map-controls button:hover { color: white; background: var(--primary-gradient); }
.map-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; }.map-shell { position: relative; min-height: 600px; overflow: hidden; border: 1px solid var(--border-primary); border-radius: 24px; background: radial-gradient(circle at 50% 50%, rgba(99,102,241,.13), transparent 42%), #0d172c; box-shadow: var(--shadow-xl); }.map-viewport { height: 600px; overflow: hidden; cursor: grab; touch-action: none; }.map-viewport.is-dragging { cursor: grabbing; }.map-stage { position: relative; width: 1000px; height: 560px; transform-origin: center center; transition: transform .18s ease; }.map-lines { position: absolute; inset: 0; width: 100%; height: 100%; }.map-line { fill: none; stroke-width: 3; stroke-dasharray: 8 9; opacity: .62; }.line-foundation { stroke: #60a5fa; }.line-structure { stroke: #c084fc; }.line-graph { stroke: #fb923c; }.line-dp { stroke: #34d399; }.map-node { position: absolute; min-width: 164px; padding: 15px 20px; border: 1px solid rgba(165,180,252,.38); border-radius: 16px; color: #eef2ff; background: rgba(30,41,59,.96); text-align: left; font: inherit; font-weight: 800; cursor: pointer; box-shadow: 0 12px 28px rgba(0,0,0,.22); transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }.map-node:hover, .map-node:focus-visible { transform: translateY(-4px); border-color: #a5b4fc; box-shadow: 0 0 28px rgba(99,102,241,.35); outline: none; }.map-node span { display: block; margin-top: 5px; color: #94a3b8; font-size: .72rem; font-weight: 500; }.map-node-root { left: 418px; top: 44px; text-align: center; border-color: #818cf8; }.map-node-foundation { left: 108px; top: 214px; border-color: #60a5fa; }.map-node-structure { left: 728px; top: 214px; border-color: #c084fc; }.map-node-prefix { left: 300px; top: 385px; border-color: #60a5fa; }.map-node-tree { left: 600px; top: 385px; border-color: #c084fc; }.map-node-dp { left: 418px; top: 482px; border-color: #34d399; }.map-node-graph { left: 520px; top: 482px; border-color: #fb923c; }.map-legend { position: absolute; z-index: 2; top: 18px; left: 22px; display: flex; flex-wrap: wrap; gap: 12px; color: #aab7cd; font-size: .72rem; }.map-legend span { display: inline-flex; align-items: center; gap: 6px; }.legend-dot { width: 8px; height: 8px; border-radius: 50%; }.legend-foundation { background: #60a5fa; }.legend-structure { background: #c084fc; }.legend-graph { background: #fb923c; }.legend-dp { background: #34d399; }.map-zoom-layer { position: absolute; right: 26px; top: 18px; color: #64748b; font-size: .7rem; }.map-detail { min-height: 300px; padding: 28px; align-self: start; border: 1px solid var(--border-primary); border-radius: 20px; background: var(--bg-secondary); }.map-detail h3 { margin-top: 16px; color: var(--text-primary); font-size: 1.35rem; }.map-detail p { margin-top: 12px; color: var(--text-secondary); line-height: 1.8; }.map-detail-links { display: grid; gap: 10px; margin-top: 26px; }.detail-link { display: flex; align-items: center; gap: 10px; padding: 11px 13px; border: 1px solid var(--border-primary); border-radius: 10px; color: var(--text-primary); font-size: .86rem; }.detail-link:hover { border-color: var(--primary-400); color: var(--primary-300); }.detail-link i { color: var(--primary-400); }
.problem-bank-section { background: var(--bg-primary); }.problem-heading { align-items: center; }.data-status { display: inline-flex; align-items: center; gap: 8px; padding: 9px 13px; border: 1px solid rgba(16,185,129,.3); border-radius: 999px; color: #6ee7b7; background: rgba(16,185,129,.08); font-size: .78rem; }.data-status i { font-size: .48rem; }.problem-toolbar { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 16px; border: 1px solid var(--border-primary); border-radius: 16px 16px 0 0; background: var(--bg-secondary); }.stage-tabs, .filter-row { display: flex; flex-wrap: wrap; gap: 8px; }.stage-tab, .filter-chip { padding: 9px 13px; border: 1px solid var(--border-primary); border-radius: 999px; color: var(--text-secondary); background: transparent; font: inherit; font-size: .8rem; cursor: pointer; }.stage-tab:hover, .stage-tab.is-active, .filter-chip:hover, .filter-chip.is-active { border-color: var(--primary-400); color: var(--primary-300); background: rgba(99,102,241,.12); }.problem-search { display: flex; align-items: center; min-width: 260px; gap: 9px; padding: 0 12px; border: 1px solid var(--border-primary); border-radius: 999px; color: var(--text-secondary); }.problem-search input { width: 100%; padding: 10px 0; border: 0; outline: 0; color: var(--text-primary); background: transparent; font: inherit; font-size: .82rem; }.search-hint { color: var(--text-tertiary); font-size: .7rem; }.filter-row { padding: 14px 16px; border-right: 1px solid var(--border-primary); border-bottom: 1px solid var(--border-primary); border-left: 1px solid var(--border-primary); background: var(--bg-secondary); }.problem-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }.problem-topic-card { position: relative; overflow: hidden; padding: 24px; border: 1px solid var(--border-primary); border-radius: 18px; background: var(--bg-secondary); }.problem-topic-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--topic-accent, #818cf8); }.topic-foundation { --topic-accent: #60a5fa; }.topic-structure { --topic-accent: #c084fc; }.topic-graph { --topic-accent: #fb923c; }.topic-dp { --topic-accent: #34d399; }.topic-card-top, .topic-card-title, .topic-card-footer { display: flex; justify-content: space-between; gap: 12px; align-items: center; }.topic-stage, .topic-label { color: var(--topic-accent); font-size: .72rem; font-weight: 700; }.topic-label { color: var(--text-tertiary); }.topic-card-title { margin-top: 17px; align-items: end; }.topic-domain { color: var(--text-tertiary); font-size: .75rem; }.topic-card-title h3 { margin-top: 3px; color: var(--text-primary); font-size: 1.3rem; }.topic-count { color: var(--text-secondary); font-size: .8rem; }.problem-topic-card p { min-height: 50px; margin-top: 13px; color: var(--text-secondary); font-size: .83rem; line-height: 1.8; }.topic-problems { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }.problem-pill { display: inline-flex; align-items: center; gap: 7px; padding: 7px 9px; border: 1px solid var(--border-primary); border-radius: 8px; color: var(--text-primary); background: rgba(99,102,241,.06); font-size: .78rem; }.problem-pill:hover { border-color: var(--topic-accent); color: var(--topic-accent); }.problem-pill i { font-size: .65rem; color: var(--text-tertiary); }.topic-card-footer { margin-top: 20px; padding-top: 15px; border-top: 1px solid var(--border-primary); color: var(--text-tertiary); font-size: .7rem; }.topic-submit { color: var(--primary-400); }.empty-state { padding: 70px 20px; text-align: center; color: var(--text-secondary); }.empty-state i { font-size: 2rem; color: var(--primary-400); }.empty-state h3 { margin-top: 10px; color: var(--text-primary); }

/* 洛谷难度色：颜色来自题目难度，不和原 Excel 的教学阶段色混用。 */
.problem-pill[class*="problem-difficulty-"] { font-weight: 700; transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.problem-pill.problem-difficulty-red { --problem-color: #fe4c61; }
.problem-pill.problem-difficulty-orange { --problem-color: #f39c11; }
.problem-pill.problem-difficulty-yellow { --problem-color: #ffc116; }
.problem-pill.problem-difficulty-green { --problem-color: #52c41a; }
.problem-pill.problem-difficulty-cyan { --problem-color: #13c2c2; }
.problem-pill.problem-difficulty-blue { --problem-color: #3498db; }
.problem-pill.problem-difficulty-purple { --problem-color: #9d3dcf; }
.problem-pill.problem-difficulty-black { --problem-color: #7f8fa6; }
.problem-pill[class*="problem-difficulty-"]:hover,
.problem-pill[class*="problem-difficulty-"]:focus-visible { border-color: var(--problem-color); color: var(--problem-color); background: color-mix(in srgb, var(--problem-color) 16%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--problem-color) 18%, transparent); }
.difficulty-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 9px 14px; padding: 13px 16px; border-right: 1px solid var(--border-primary); border-bottom: 1px solid var(--border-primary); border-left: 1px solid var(--border-primary); color: var(--text-tertiary); background: var(--bg-secondary); font-size: .72rem; }
.difficulty-legend-title { margin-right: 2px; color: var(--text-secondary); font-weight: 700; }
.difficulty-legend-item { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.difficulty-legend-swatch { width: 9px; height: 9px; border-radius: 50%; box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 18%, transparent); }
.difficulty-filters .filter-chip[data-difficulty="red"].is-active { border-color: #fe4c61; color: #fe4c61; }
.difficulty-filters .filter-chip[data-difficulty="orange"].is-active { border-color: #f39c11; color: #f39c11; }
.difficulty-filters .filter-chip[data-difficulty="yellow"].is-active { border-color: #ffc116; color: #ffc116; }
.difficulty-filters .filter-chip[data-difficulty="green"].is-active { border-color: #52c41a; color: #52c41a; }
.difficulty-filters .filter-chip[data-difficulty="cyan"].is-active { border-color: #13c2c2; color: #13c2c2; }
.difficulty-filters .filter-chip[data-difficulty="blue"].is-active { border-color: #3498db; color: #3498db; }
.difficulty-filters .filter-chip[data-difficulty="purple"].is-active { border-color: #9d3dcf; color: #9d3dcf; }
.difficulty-filters .filter-chip[data-difficulty="black"].is-active { border-color: #7f8fa6; color: #7f8fa6; }
.difficulty-red { color: #fe4c61; background: #fe4c61; }
.difficulty-orange { color: #f39c11; background: #f39c11; }
.difficulty-yellow { color: #ffc116; background: #ffc116; }
.difficulty-green { color: #52c41a; background: #52c41a; }
.difficulty-cyan { color: #13c2c2; background: #13c2c2; }
.difficulty-blue { color: #3498db; background: #3498db; }
.difficulty-purple { color: #9d3dcf; background: #9d3dcf; }
.difficulty-black { color: #7f8fa6; background: #7f8fa6; }
.problem-item { display: inline-flex; align-items: stretch; gap: 3px; }
.problem-write-link { display: inline-flex; align-items: center; justify-content: center; width: 25px; border: 1px solid var(--border-primary); border-radius: 7px; color: var(--text-tertiary); background: rgba(99,102,241,.04); font-size: .68rem; }
.problem-write-link:hover { border-color: var(--primary-400); color: var(--primary-400); background: rgba(99,102,241,.12); }
.learning-footer { margin-top: 0; }.learning-footer .footer-bottom { display: flex; justify-content: space-between; gap: 20px; align-items: center; }
@media (max-width: 1000px) { .learning-hero .container { grid-template-columns: 1fr; }.learning-hero-signal { max-width: 500px; width: 100%; margin: 0 auto; }.learning-hub-grid { grid-template-columns: repeat(2, 1fr); }.map-layout { grid-template-columns: 1fr; }.map-detail { min-height: auto; }.problem-toolbar { align-items: stretch; flex-direction: column; }.problem-search { min-width: 0; } }
@media (max-width: 680px) { .learning-hero { min-height: auto; padding-top: 120px; }.learning-hero h1 { font-size: 2.8rem; }.learning-hero-signal { transform: scale(.78); margin: -24px auto -30px; }.section-padding { padding: 70px 0; }.learning-hub-grid, .problem-grid { grid-template-columns: 1fr; }.section-heading, .problem-heading { align-items: start; flex-direction: column; }.map-shell, .map-viewport { min-height: 480px; height: 480px; }.map-stage { transform-origin: 50% 40%; }.map-legend { right: 18px; }.map-zoom-layer { display: none; }.learning-footer .footer-bottom { align-items: start; flex-direction: column; } }

/* Galaxy map v2: semantic zoom with circular knowledge nodes */
.galaxy-layout { align-items: stretch; }
.galaxy-shell { position: relative; min-height: 650px; overflow: hidden; border: 1px solid rgba(129,140,248,.25); border-radius: 26px; background: radial-gradient(circle at 50% 50%, rgba(99,102,241,.2), transparent 24%), radial-gradient(circle at 22% 28%, rgba(14,165,233,.1), transparent 20%), #091326; box-shadow: 0 24px 70px rgba(2,6,23,.4); }
.galaxy-shell::before, .galaxy-shell::after { content: ''; position: absolute; border-radius: 50%; pointer-events: none; filter: blur(1px); }
.galaxy-shell::before { width: 2px; height: 2px; top: 18%; left: 14%; background: #fff; box-shadow: 80px 110px #bfdbfe, 240px 50px #c4b5fd, 420px 150px #fde68a, 620px 78px #bae6fd, 790px 240px #fff, 920px 130px #c4b5fd, 180px 480px #fff, 700px 510px #bae6fd, 970px 430px #fde68a; opacity: .65; }
.galaxy-shell::after { width: 4px; height: 4px; top: 54%; left: 9%; background: #818cf8; box-shadow: 190px -260px #60a5fa, 520px -180px #fb923c, 850px -240px #34d399, 1020px -70px #c084fc, 430px 290px #f472b6; opacity: .38; }
.galaxy-legend { z-index: 5; color: #cbd5e1; }
.legend-j { background: #22d3ee; box-shadow: 0 0 9px rgba(34,211,238,.75); }.legend-s { background: #facc15; box-shadow: 0 0 9px rgba(250,204,21,.65); }.legend-noi { background: #c084fc; box-shadow: 0 0 9px rgba(192,132,252,.75); }.legend-empty { background: #64748b; }
.galaxy-stage { position: relative; width: 1200px; height: 760px; transform-origin: 50% 50%; transition: transform .42s cubic-bezier(.22,1,.36,1); }
.galaxy-lines { position: absolute; inset: 0; width: 1200px; height: 760px; overflow: visible; }
.galaxy-line { fill: none; stroke-width: 2; stroke-dasharray: 3 10; stroke-linecap: round; opacity: .52; animation: galaxyLineFlow 8s linear infinite; }
.line-blue { stroke: #60a5fa; }.line-orange { stroke: #fb923c; }.line-green { stroke: #34d399; }.line-purple { stroke: #c084fc; }.line-yellow { stroke: #facc15; }.line-pink { stroke: #f472b6; }
@keyframes galaxyLineFlow { to { stroke-dashoffset: -78; } }
.galaxy-nodes { position: absolute; inset: 0; }
.galaxy-node { --node-color: #60a5fa; --node-size: 110px; position: absolute; z-index: 2; width: var(--node-size); min-width: var(--node-size); height: var(--node-size); padding: 0; border: 0; border-radius: 50%; color: #f8fafc; background: transparent; font: inherit; cursor: pointer; transform: translate(-50%, -50%); transition: left .65s cubic-bezier(.22,1,.36,1), top .65s cubic-bezier(.22,1,.36,1), transform .25s ease, filter .25s ease; }
.galaxy-node:hover, .galaxy-node:focus-visible { z-index: 4; transform: translate(-50%, -50%) scale(1.1); filter: brightness(1.24); outline: none; }
.galaxy-node-orb { position: absolute; inset: 12%; display: grid; place-items: center; border: 2px solid var(--node-color); border-radius: 50%; background: radial-gradient(circle at 36% 28%, rgba(255,255,255,.55), rgba(255,255,255,.08) 19%, color-mix(in srgb, var(--node-color) 30%, #0f172a) 68%, #0b1224 100%); box-shadow: 0 0 0 7px color-mix(in srgb, var(--node-color) 9%, transparent), 0 0 28px color-mix(in srgb, var(--node-color) 55%, transparent), inset 0 0 22px color-mix(in srgb, var(--node-color) 32%, transparent); animation: galaxyPulse 4s ease-in-out infinite; }
.galaxy-node-icon { color: color-mix(in srgb, var(--node-color) 80%, white); font-size: 1.25rem; font-style: normal; text-shadow: 0 0 12px var(--node-color); }
.galaxy-node-label { position: absolute; top: calc(100% + 7px); left: 50%; width: 180px; transform: translateX(-50%); color: #e2e8f0; font-size: .82rem; font-weight: 800; line-height: 1.35; text-shadow: 0 2px 10px #020617; }
.galaxy-node-caption { position: absolute; top: calc(100% + 31px); left: 50%; width: 190px; transform: translateX(-50%); color: #94a3b8; font-size: .66rem; line-height: 1.3; }
.galaxy-node-root, .galaxy-node-domain-root { --node-color: #a5b4fc; --node-size: 168px; }.galaxy-node-domain { --node-color: #60a5fa; --node-size: 128px; }.galaxy-node-topic { --node-size: 112px; }.galaxy-node-leaf { --node-size: 84px; }.galaxy-domain-blue { --node-color: #60a5fa; }.galaxy-domain-orange { --node-color: #fb923c; }.galaxy-domain-green { --node-color: #34d399; }.galaxy-domain-purple { --node-color: #c084fc; }.galaxy-domain-yellow { --node-color: #facc15; }.galaxy-domain-pink { --node-color: #f472b6; }.galaxy-stage-j .galaxy-node-orb { border-style: solid; }.galaxy-stage-s .galaxy-node-orb { border-style: double; border-width: 4px; }.galaxy-stage-noi .galaxy-node-orb { border-style: dashed; }
.galaxy-node.is-pending { --node-color: #64748b; opacity: .76; }.galaxy-node.is-pending .galaxy-node-orb { box-shadow: 0 0 0 7px rgba(100,116,139,.08), 0 0 20px rgba(100,116,139,.25); }.galaxy-node.is-pending .galaxy-node-caption::after { content: ' · 待补充'; color: #94a3b8; }
@keyframes galaxyPulse { 0%, 100% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--node-color) 9%, transparent), 0 0 22px color-mix(in srgb, var(--node-color) 42%, transparent), inset 0 0 18px color-mix(in srgb, var(--node-color) 28%, transparent); } 50% { box-shadow: 0 0 0 11px color-mix(in srgb, var(--node-color) 5%, transparent), 0 0 36px color-mix(in srgb, var(--node-color) 62%, transparent), inset 0 0 28px color-mix(in srgb, var(--node-color) 36%, transparent); } }
.galaxy-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: -8px 0 16px; color: #94a3b8; font-size: .78rem; }.galaxy-breadcrumb button { padding: 0; border: 0; color: #a5b4fc; background: transparent; font: inherit; cursor: pointer; }.galaxy-breadcrumb .is-current { color: var(--text-primary); font-weight: 700; }.breadcrumb-divider { color: #475569; }.breadcrumb-hint { margin-left: auto; color: #64748b; }
.galaxy-tip { position: absolute; z-index: 5; right: 22px; bottom: 18px; display: inline-flex; align-items: center; gap: 8px; color: #64748b; font-size: .72rem; }.galaxy-tip i { color: #a5b4fc; }.galaxy-detail .detail-status { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; color: #a5b4fc; font-size: .74rem; }.detail-status i { font-size: .46rem; }.detail-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px; }.detail-meta span { padding: 6px 9px; border: 1px solid var(--border-primary); border-radius: 7px; color: var(--text-secondary); font-size: .7rem; }.detail-meta .detail-pending { color: #fbbf24; border-color: rgba(251,191,36,.3); }
@media (max-width: 680px) { .galaxy-shell, .map-viewport { min-height: 500px; height: 500px; }.galaxy-stage { transform-origin: 50% 45%; }.galaxy-node-label { width: 150px; font-size: .72rem; }.galaxy-node-caption { width: 150px; font-size: .6rem; }.galaxy-tip { right: 12px; left: 12px; justify-content: center; }.breadcrumb-hint { width: 100%; margin-left: 0; }.galaxy-node-domain { --node-size: 108px; }.galaxy-node-topic { --node-size: 94px; }.galaxy-node-leaf { --node-size: 70px; } }