/* 页面全部采用同一 H5 骨架，只有中间内容区纵向滚动 */
.eyebrow, .eco-eyebrow, .section-index { color: var(--color-text-tertiary); font-size: var(--font-size-caption); margin-bottom: var(--space-2); }
.breadcrumb { display: none; }
.searchbox { display: flex; align-items: center; gap: var(--space-2); height: 44px; background: var(--color-surface); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-button); padding-left: var(--space-3); margin-bottom: var(--space-3); }
.searchbox > svg { width: 18px; color: var(--color-text-tertiary); }
.searchbox input { flex: 1; width: 0; border: 0 !important; padding: 0; height: 42px; font-size: var(--font-size-label) !important; }
.searchbox .btn { width: auto; min-height: 42px; border: 0; background: transparent; color: var(--color-brand); padding: 0 var(--space-3); }
.searchbox:focus-within { outline: 2px solid var(--color-brand); outline-offset: 2px; }
.searchbox input:focus-visible { outline: none; }
.h5-home-intro { padding: var(--space-4); }
.h5-brand { display: flex; align-items: center; gap: var(--space-3); }
.h5-brand img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.h5-brand p { font-size: var(--font-size-meta); color: var(--color-text-secondary); margin: 2px 0 0; }
.h5-home-poster { width: 100%; aspect-ratio: 1672/941; object-fit: contain; border-radius: var(--radius-button); margin-top: var(--space-3); }
.h5-home-intro > p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.h5-section { margin-top: var(--space-5); }
.h5-section .section-heading a { min-height: 44px; display: inline-flex; align-items: center; gap: var(--space-1); color: var(--color-brand); font-size: var(--font-size-label); }
.quick-links { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: var(--color-surface); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); padding: var(--space-3) 0; margin-bottom: var(--space-3); }
.quick-link { min-height: 48px; display: flex; flex-direction: column; gap: var(--space-1); align-items: center; font-size: var(--font-size-meta); }
.quick-icon { color: var(--color-brand); display: flex; }
.portal-arrow { display: none; }
.project-row, .resource-row { padding: var(--space-4); border-bottom: var(--hairline) solid var(--color-divider); display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: var(--space-3); row-gap: var(--space-2); min-height: var(--size-row-min); }
.project-row:last-child, .resource-row:last-child { border-bottom: 0; }
.project-title { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.project-title h3, .project-title h1 { flex: 1; min-width: 0; }
.project-title h3 a { display: block; padding-right: var(--space-4); position: relative; }
.project-title h3 a::after, .archive-body h3 a::after, .member-card-footer a::after, .resource-link::after { content: ''; width: 6px; height: 6px; border-top: 1px solid var(--color-text-tertiary); border-right: 1px solid var(--color-text-tertiary); transform: rotate(45deg); display: inline-block; margin-left: var(--space-2); }
.project-title h3 a::after { position: absolute; right: 2px; top: 9px; }
.project-summary, .project-row p, .resource-row p { color: var(--color-text-secondary); font-size: var(--font-size-label); margin: var(--space-2) 0; }
.project-row .row-end { grid-column: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2); }
.project-row .row-actions { display: flex; align-items: center; gap: var(--space-2); }
.project-row .row-end > a, .resource-link { min-height: 44px; font-size: var(--font-size-label); color: var(--color-brand); display: flex; align-items: center; }
.project-like { min-height: 44px; display: inline-flex; align-items: center; gap: var(--space-1); color: var(--color-text-secondary); font-size: var(--font-size-meta); padding: 0 var(--space-2); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-button); background: var(--color-surface); }
.project-like[aria-pressed=true] { color: var(--color-brand); background: var(--color-brand-light); }
.project-like svg { width: 16px; height: 16px; }
.filters { display: none; }
.h5-filter-sheet .filters { display: block; }
.h5-filter-sheet .filters-head { display: none; }
.filter-group { margin: 0 0 var(--space-5); }
.filter-group legend { margin-bottom: var(--space-3); }
.single-chip-options, .daily-choice-list, .filter-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.filter-chips { margin-bottom: var(--space-3); }
.single-chip-options label, .daily-choice-list label { position: relative; display: flex; min-height: 30px; }
.single-chip-options input, .daily-choice-list input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.single-chip-options span, .daily-choice-list span { min-height: var(--size-chip); border-radius: var(--radius-chip); padding: 0 var(--space-3); display: flex; align-items: center; background: var(--color-page); color: var(--color-text-secondary); font-size: var(--font-size-label); }
.single-chip-options input:checked + span { background: var(--color-brand); color: var(--color-surface); font-weight: var(--font-weight-medium); }
.daily-choice-list input:checked + span { background: var(--color-brand-light); color: var(--color-brand); font-weight: var(--font-weight-medium); }
.single-chip-options input:focus-visible + span, .daily-choice-list input:focus-visible + span { outline: 2px solid var(--color-brand); outline-offset: 3px; }
.results-top { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); font-size: var(--font-size-meta); margin-bottom: var(--space-3); flex-wrap: wrap; }
.results-top select { width: auto; font-size: var(--font-size-label); }
.result-end, .results-count { font-size: var(--font-size-meta); text-align: center; color: var(--color-text-tertiary); margin: var(--space-4) 0; }
.detail-header { background: var(--color-surface); padding: var(--space-4); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); margin-bottom: var(--space-3); }
.detail-identity { display: flex; gap: var(--space-3); align-items: flex-start; }
.detail-identity > div:last-child { flex: 1; min-width: 0; }
.detail-header .detail-actions { margin-top: var(--space-4); }
.reading section, .archive-reading > section { margin: var(--space-5) 0; }
.reading section:first-child { margin-top: 0; }
.reading p, .archive-reading p { overflow-wrap: anywhere; }
.reading h2, .archive-reading h2 { margin-bottom: var(--space-2); }
.article-lead { color: var(--color-text-secondary); }
.attachment, .team-member { padding: var(--space-3) 0; border-bottom: var(--hairline) solid var(--color-divider); }
.attachment { display: flex; gap: var(--space-2); flex-wrap: wrap; align-items: center; }
.team-member:last-child { border-bottom: 0; }
.team-member .member-line > div > span { display: block; }
.team-member p, .need-mini p, .side-note p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.side-note { padding: var(--space-4); }
.timeline { border-left: var(--hairline) solid var(--color-divider); padding-left: var(--space-3); }
.timeline time { font-size: var(--font-size-meta); color: var(--color-text-tertiary); }
.retrospective > div { border-top: var(--hairline) solid var(--color-divider); padding-top: var(--space-3); margin-top: var(--space-3); }
.demo-surface { border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); overflow: hidden; }
.demo-toolbar, .demo-content { padding: var(--space-3); }
.demo-toolbar { background: var(--color-page); font-size: var(--font-size-meta); display: flex; justify-content: space-between; }
.time-options, .demo-slots { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-3) 0; }
.time-options span, .demo-slots label { padding: var(--space-2); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-button); font-size: var(--font-size-label); }
.time-options .selected { background: var(--color-brand-light); color: var(--color-brand); }
.cohort-tabs, .segment-tabs, .large-tabs { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-3) 0; }
.cohort-tabs button, .segment-tabs button, .large-tabs a { min-height: 30px; border-radius: var(--radius-chip); padding: 0 var(--space-3); background: var(--color-surface); border: var(--hairline) solid var(--color-divider); font-size: var(--font-size-label); display: flex; align-items: center; }
.cohort-tabs .active, .segment-tabs .active, .large-tabs .active { background: var(--color-brand); color: var(--color-surface); border-color: var(--color-brand); font-weight: var(--font-weight-medium); }
.archive-grid, .archive-editorial, .archive-collection, .members-grid, .member-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-3); }
.archive-card { background: var(--color-surface); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); overflow: hidden; }
.archive-cover { display: block; aspect-ratio: 16/9; background: var(--color-page); }
.archive-cover img { width: 100%; height: 100%; object-fit: contain; }
.archive-body { padding: var(--space-4); }
.archive-body > p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.archive-type-row { display: flex; gap: var(--space-2); align-items: center; font-size: var(--font-size-meta); color: var(--color-brand); margin-bottom: var(--space-2); }
.archive-rest, .collection-block { margin-top: var(--space-3); }
.real-archive-photo { margin: var(--space-4) 0; }
figcaption { color: var(--color-text-secondary); font-size: var(--font-size-meta); margin-top: var(--space-2); }
.article-bottom { display: flex; flex-wrap: wrap; gap: var(--space-2); padding-top: var(--space-4); border-top: var(--hairline) solid var(--color-divider); }
details { margin-top: var(--space-3); }
summary { cursor: pointer; min-height: 48px; padding: var(--space-3) 0; font-size: var(--font-size-label); }
.archive-sources, .profile-sources { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.archive-sources a, .profile-sources a { color: var(--color-brand); overflow-wrap: anywhere; }
.resource-symbol { width: 44px; height: 44px; background: var(--color-brand-light); color: var(--color-brand); border-radius: var(--radius-button); display: flex; align-items: center; justify-content: center; }
.resource-link { grid-column: 2; }
.condition { font-size: var(--font-size-meta); color: var(--color-text-secondary); margin-bottom: var(--space-2); }
.resource-filterbar, .member-filterbar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin-bottom: var(--space-3); }
.resource-filterbar .searchbox, .member-filterbar .searchbox { grid-column: 1/-1; margin-bottom: 0; }
.select-filter { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.select-filter select { margin-top: var(--space-1); font-size: var(--font-size-label); }
.member-card { padding: var(--space-4); }
.member-card p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.member-card-footer { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; gap: var(--space-2); border-top: var(--hairline) solid var(--color-divider); margin-top: var(--space-3); padding-top: var(--space-2); font-size: var(--font-size-meta); }
.member-card-footer a { display: flex; align-items: center; min-height: 44px; color: var(--color-brand); }
.member-card .avatar { width: 48px; height: 48px; }
.alumni-profile-hero, .profile-header { padding: var(--space-4); margin-bottom: var(--space-3); background: var(--color-surface); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); }
.alumni-profile-photo { margin: var(--space-4) 0 0; }
.alumni-profile-photo img { width: 100%; max-height: 320px; object-fit: contain; border-radius: var(--radius-button); }
.alumni-profile-photo figcaption { font-size: var(--font-size-caption); }
.alumni-profile-role, .alumni-profile-lead { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.alumni-profile-meta, .member-birthday, .profile-birthday { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; color: var(--color-text-secondary); font-size: var(--font-size-meta); }
.alumni-profile-interests { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }
.alumni-profile-interests span { background: var(--color-page); color: var(--color-text-secondary); border-radius: var(--radius-chip); min-height: 30px; padding: 4px 12px; font-size: var(--font-size-meta); }
.alumni-section { background: var(--color-surface); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); padding: var(--space-4); margin-bottom: var(--space-3); }
.alumni-section-head, .profile-story-head { display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.alumni-section-head span, .profile-story-head span, .profile-source-note, .profile-data-note { font-size: var(--font-size-meta); color: var(--color-text-tertiary); }
.profile-story p, .profile-contribution p, .profile-timeline p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.profile-contribution, .profile-timeline > li, .profile-story, .profile-experience-row { border-top: var(--hairline) solid var(--color-divider); padding-top: var(--space-3); margin-top: var(--space-3); }
.profile-timeline { list-style: none; padding: 0; }
.profile-timeline time { font-size: var(--font-size-meta); color: var(--color-brand); }
.profile-contact-note, .contact-closed, .message-profile-note { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.profile-source-link svg { width: 14px; height: 14px; vertical-align: middle; }
.center-item { padding: var(--space-4); }
.center-item p { color: var(--color-text-secondary); font-size: var(--font-size-label); }
.center-title { margin: var(--space-4) 0 var(--space-3); }
.two-cols { display: grid; grid-template-columns: 1fr; gap: var(--space-4); }
.publish-stepper, .steps { display: flex; gap: var(--space-3); color: var(--color-text-secondary); font-size: var(--font-size-label); margin: var(--space-4) 0; }
.publish-stepper .active, .steps .active { color: var(--color-brand); font-weight: var(--font-weight-medium); }
.optional { font-style: normal; color: var(--color-text-tertiary); font-size: var(--font-size-meta); }
.spaced-title, .guide-section { margin-top: var(--space-5); }
.guide-section > h2 { margin-bottom: var(--space-3); }
.state-grid, .admin-grid, .review-questions { display: grid; gap: var(--space-3); grid-template-columns: 1fr; }
.login-page { padding: var(--space-6) var(--space-3); }
.login-card { border-radius: var(--radius-card); background: var(--color-surface); padding: var(--space-5); border: var(--hairline) solid var(--color-divider); }
.login-card .btn { margin-top: var(--space-3); width: 100%; }
.login-card > svg { color: var(--color-brand); }
.daily-home { padding: var(--space-4); }
.daily-section-head, .daily-subheading, .daily-page-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2); margin-bottom: var(--space-3); }
.daily-section-head > .btn { width: 100%; }
.daily-kicker { display: flex; align-items: center; gap: var(--space-2); color: var(--color-text-secondary); font-size: var(--font-size-meta); }
.daily-kicker svg, .daily-subheading > svg { color: var(--color-brand); }
.daily-panel-title { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); }
.daily-panel-title > span { font-size: var(--font-size-caption); color: var(--color-text-tertiary); }
.daily-home-panel + .daily-home-panel { border-top: var(--hairline) solid var(--color-divider); padding-top: var(--space-4); margin-top: var(--space-4); }
.daily-person { padding: var(--space-3) 0; border-bottom: var(--hairline) solid var(--color-divider); }
.daily-person-top { display: flex; align-items: center; gap: var(--space-3); }
.daily-person-top p, .daily-person-bio, .daily-need p { color: var(--color-text-secondary); font-size: var(--font-size-label); }
.daily-person-top p { margin: 2px 0; }
.daily-match-reasons { margin: var(--space-2) 0; }
.daily-person-note, .daily-need-meta, .daily-need-footer, .daily-home-foot { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.daily-person-actions, .daily-need-footer, .daily-home-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2); }
.daily-link, .daily-home-foot a { display: inline-flex; gap: var(--space-1); align-items: center; min-height: 44px; color: var(--color-brand); font-size: var(--font-size-label); }
.daily-birthday-empty { color: var(--color-text-secondary); font-size: var(--font-size-label); }
.daily-birthday-empty > svg { color: var(--color-text-tertiary); margin-bottom: var(--space-2); }
.daily-birthday-empty h3 { color: var(--color-text-primary); }
.daily-need-meta { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-2); }
.daily-birthday-person { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; padding: var(--space-3) 0; }
.daily-full-panel { padding: var(--space-4); margin: var(--space-3) 0; }
.daily-profile-summary { display: flex; gap: var(--space-2); flex-wrap: wrap; align-items: center; margin: var(--space-4) 0; font-size: var(--font-size-meta); }
.daily-profile-summary small { flex-basis: 100%; font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.daily-member-grid { background: var(--color-surface); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); padding: 0 var(--space-4); }
.daily-wechat-reserve { border: var(--hairline) solid var(--color-divider); background: var(--color-surface); border-radius: var(--radius-card); padding: var(--space-4); }
.daily-wechat-reserve > div { display: flex; gap: var(--space-3); align-items: center; flex-wrap: wrap; }
.daily-wechat-reserve p, .daily-time-select small, .daily-form-note { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.daily-choice-group legend { margin-bottom: var(--space-3); }
.daily-birthday-inputs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin: var(--space-3) 0; }
.daily-notice-heading, .daily-notice-section, .daily-notice-footer { margin: var(--space-3) 0; }
.message-page-title { display: flex; justify-content: flex-end; margin-bottom: var(--space-3); }
.message-page-title > div:first-child { display: none; }
.message-page-title > div:last-child { display: flex; gap: var(--space-2); flex-wrap: wrap; width: 100%; }
.message-page-title .primary { flex: 1; }
.message-demo-notice, .opportunity-demo-note { display: flex; align-items: flex-start; gap: var(--space-2); color: var(--color-text-secondary); font-size: var(--font-size-meta); margin: 0 0 var(--space-3); }
.message-demo-notice svg, .opportunity-demo-note svg { width: 16px; height: 16px; }
.message-inbox, .message-conversation, .message-welcome { background: var(--color-surface); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); }
.message-inbox-title { padding: var(--space-4); display: flex; align-items: center; justify-content: space-between; font-size: var(--font-size-meta); color: var(--color-text-secondary); border-bottom: var(--hairline) solid var(--color-divider); }
.message-thread { display: flex; gap: var(--space-3); min-height: 48px; padding: var(--space-4); border-bottom: var(--hairline) solid var(--color-divider); align-items: flex-start; }
.message-thread:last-child { border-bottom: 0; }
.message-thread > div { flex: 1; min-width: 0; }
.message-thread-title { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.message-thread-title::after { content: ''; width: 6px; height: 6px; border-top: 1px solid var(--color-text-tertiary); border-right: 1px solid var(--color-text-tertiary); transform: rotate(45deg); }
.message-thread p { margin: var(--space-1) 0; font-size: var(--font-size-label); color: var(--color-text-secondary); overflow-wrap: anywhere; }
.message-thread time { font-size: var(--font-size-meta); color: var(--color-text-tertiary); }
.message-welcome { padding: var(--space-4); margin-top: var(--space-3); }
.message-welcome p { color: var(--color-text-secondary); font-size: var(--font-size-label); }
.message-welcome-icon { color: var(--color-brand); margin-bottom: var(--space-2); }
.message-list-empty, .message-conversation-empty { padding: var(--space-6); color: var(--color-text-secondary); text-align: center; }
.has-conversation .message-inbox, .h5-shell-chat .message-page-title, .message-back { display: none; }
.message-conversation-heading { padding: var(--space-3); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-2); border-bottom: var(--hairline) solid var(--color-divider); }
.message-peer { display: flex; align-items: center; gap: var(--space-2); }
.message-peer p { font-size: var(--font-size-meta); color: var(--color-text-secondary); margin: 0; }
.message-history { padding: var(--space-4); }
.message-bubble-row { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-1); margin-bottom: var(--space-4); }
.message-bubble-row.outgoing { align-items: flex-end; }
.message-bubble { max-width: 92%; background: var(--color-page); border-radius: var(--radius-card); padding: var(--space-3); overflow-wrap: anywhere; }
.outgoing .message-bubble { background: var(--color-brand-light); }
.message-bubble p { margin: 0; }
.message-kind { display: block; color: var(--color-brand); font-size: var(--font-size-meta); margin-bottom: var(--space-1); }
.message-bubble-meta { display: flex; flex-wrap: wrap; gap: var(--space-2); color: var(--color-text-tertiary); font-size: var(--font-size-caption); }
.message-reply { display: flex; gap: var(--space-2); align-items: center; height: 44px; }
.message-reply textarea { flex: 1; min-width: 0; height: 36px; min-height: 36px; max-height: 36px; resize: none; padding: 5px 8px; line-height: 1.5; background: var(--color-page); border-color: var(--color-divider); }
.message-reply-actions { display: flex; gap: var(--space-1); align-items: center; height: 44px; }
.message-reply-actions .btn.primary { width: auto; padding: 0 var(--space-3); }
.message-reply-actions .btn.text { width: 36px; padding: 0; }
#message-reply-count { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
.message-send-error { color: var(--color-brand); font-size: var(--font-size-meta); background: var(--color-brand-light); padding: var(--space-2); border-radius: var(--radius-button); }
.message-reply .message-send-error { position: absolute; bottom: var(--chatbar-height); left: var(--space-3); right: var(--space-3); }
.message-compose-form > label { display: block; margin: var(--space-3) 0 var(--space-2); font-size: var(--font-size-label); font-weight: var(--font-weight-medium); }
.message-compose-context, .message-compose-foot { display: flex; flex-wrap: wrap; gap: var(--space-2); color: var(--color-text-secondary); font-size: var(--font-size-meta); margin: var(--space-3) 0; }
.message-compose-context a, .cooperation-message-source { color: var(--color-brand); }
.message-test-control { display: flex; align-items: center; gap: var(--space-2); }
.message-profile-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-top: var(--space-3); }
.opportunity-page-heading > div:last-child { display: flex; flex-wrap: wrap; gap: var(--space-2); width: 100%; }
.opportunity-role-panel { padding: var(--space-3); margin-bottom: var(--space-3); background: var(--color-surface); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); }
.opportunity-role-panel h2 { margin-bottom: var(--space-2); }
.opportunity-role-options { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.opportunity-role-options button { min-height: 30px; padding: 0 var(--space-3); border-radius: var(--radius-chip); background: var(--color-page); font-size: var(--font-size-label); }
.opportunity-role-options .active { background: var(--color-brand); color: var(--color-surface); font-weight: var(--font-weight-medium); }
.opportunity-role-panel p { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.opportunity-list-heading { display: flex; align-items: center; justify-content: space-between; padding: var(--space-4); border-bottom: var(--hairline) solid var(--color-divider); font-size: var(--font-size-meta); }
.opportunity-row { display: flex; flex-direction: column; min-height: 48px; gap: var(--space-2); padding: var(--space-4); border-bottom: var(--hairline) solid var(--color-divider); }
.opportunity-row:last-child { border-bottom: 0; }
.opportunity-row.active { background: var(--color-brand-light); }
.opportunity-row-top, .opportunity-row-meta, .opportunity-record-heading, .opportunity-record-meta { display: flex; gap: var(--space-2); align-items: center; justify-content: space-between; flex-wrap: wrap; }
.opportunity-row-top strong { flex: 1; }
.opportunity-row-top::after { content: ''; width: 6px; height: 6px; border-top: 1px solid var(--color-text-tertiary); border-right: 1px solid var(--color-text-tertiary); transform: rotate(45deg); }
.opportunity-row > p, .opportunity-row small, .opportunity-row-meta, .opportunity-record-meta, .opportunity-record-note { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.opportunity-row > p { margin: 0; }
.opportunity-detail { padding: var(--space-4); margin-top: var(--space-3); }
.opportunity-detail .empty { padding: 0; }
.opportunity-record-heading { margin-bottom: var(--space-3); }
.opportunity-summary, .opportunity-fields { margin: var(--space-4) 0; }
.opportunity-fields { display: grid; gap: var(--space-3); }
.opportunity-field { border-top: var(--hairline) solid var(--color-divider); padding-top: var(--space-3); }
.opportunity-field > span, .opportunity-field dt { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.opportunity-field p, .opportunity-field dd { margin: var(--space-1) 0; }
.opportunity-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-4) 0; }
.opportunity-actions .primary { flex-basis: 100%; }
.opportunity-timeline { margin-top: var(--space-4); border-top: var(--hairline) solid var(--color-divider); padding-top: var(--space-4); }
.opportunity-timeline article, .opportunity-event { margin: var(--space-3) 0; padding-left: var(--space-3); border-left: var(--hairline) solid var(--color-divider); }
.opportunity-timeline time { color: var(--color-text-tertiary); font-size: var(--font-size-caption); }
.opportunity-timeline p { font-size: var(--font-size-label); }
.opportunity-home-entry { display: inline-flex; gap: var(--space-2); align-items: center; color: var(--color-brand); min-height: 44px; }
.opportunity-form-note, .opportunity-compose-context { font-size: var(--font-size-meta); color: var(--color-text-secondary); margin-bottom: var(--space-3); }
.opportunity-compose-form label > span { display: block; margin-bottom: var(--space-2); }
.opportunity-compose-form label { display: block; margin: var(--space-3) 0; }
.opportunity-test-control { display: flex !important; align-items: center; gap: var(--space-2); font-size: var(--font-size-meta); }
.opportunity-search { margin: var(--space-3) 0; }
.opportunity-count { font-size: var(--font-size-meta); }
.memory-space { margin-bottom: var(--space-5); background: var(--color-surface); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); overflow: hidden; }
.memory-stage { position: relative; height: 320px; overflow: hidden; }
.memory-canvas { width: 100%; height: 100%; display: block; touch-action: pan-y; }
.memory-hit-areas { position: absolute; inset: 0; pointer-events: none; }
.memory-hit { position: absolute; pointer-events: auto; background: transparent; padding: 0; border: 0; opacity: 0; }
.memory-hit:focus-visible { opacity: 1; background: transparent; }
.memory-center { position: absolute; left: 50%; top: 50%; translate: -50% -50%; min-height: 44px; padding: 0 12px; border-radius: var(--radius-button); color: var(--color-brand); background: var(--color-surface); border: var(--hairline) solid var(--color-divider); font-size: var(--font-size-label); }
.memory-loading { position: absolute; inset: 0; padding: var(--space-4); display: flex; align-items: center; justify-content: center; flex-direction: column; background: var(--color-surface); color: var(--color-text-secondary); font-size: var(--font-size-meta); }
.memory-caption { display: none; padding: var(--space-3) var(--space-4); border-top: var(--hairline) solid var(--color-divider); }
.memory-caption.is-visible { display: block; }
.memory-caption-year { color: var(--color-brand); font-size: var(--font-size-meta); }
.memory-caption p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.memory-caption a { min-height: 44px; color: var(--color-brand); display: flex; align-items: center; font-size: var(--font-size-label); }
.memory-toolbar { display: flex; flex-wrap: wrap; gap: var(--space-2); padding: var(--space-3); border-top: var(--hairline) solid var(--color-divider); }
.memory-toolbar .primary { flex-basis: 100%; }
.memory-toolbar select { flex: 1; width: 0; font-size: var(--font-size-label); }
.memory-stage[data-renderer=fallback] { height: auto; min-height: 320px; }
.memory-stage[data-renderer=fallback] .memory-loading { position: static; display: block; }
.memory-fallback { display: grid; grid-template-columns: 1fr; gap: var(--space-3); margin-top: var(--space-3); }
.memory-fallback img { width: 100%; aspect-ratio: 16/9; object-fit: contain; }
.memory-list-heading { display: flex; flex-wrap: wrap; gap: var(--space-2); justify-content: space-between; font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.network-layout { display: grid; gap: var(--space-3); }
.innovation-network { margin: var(--space-4) 0; }
.network-stage, .network-canvas { position: relative; height: 320px; background: var(--color-surface); border-radius: var(--radius-card); border: var(--hairline) solid var(--color-divider); overflow: hidden; }
.network-lines { width: 100%; height: 100%; position: absolute; inset: 0; color: var(--color-divider); }
.network-lines path { stroke: var(--color-divider); stroke-width: 1; }
.network-node { position: absolute; left: var(--nx); top: var(--ny); translate: -50% -50%; display: flex; flex-direction: column; align-items: center; gap: var(--space-1); font-size: var(--font-size-caption); max-width: 90px; }
.network-node .node-core { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--color-brand-light); color: var(--color-brand); overflow: hidden; }
.network-node img { width: 100%; height: 100%; object-fit: cover; }
.network-node[aria-pressed=true] .node-core { outline: 2px solid var(--color-brand); }
.network-hub, .network-orbit, .network-stage-label, .network-stage-hint, .network-canvas-caption { display: none; }
.network-detail { background: var(--color-surface); padding: var(--space-4); border-radius: var(--radius-card); border: var(--hairline) solid var(--color-divider); }
.network-detail p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.network-detail .btn { margin-top: var(--space-2); }
.network-relations { display: grid; gap: var(--space-2); margin: var(--space-3) 0; }
.network-relations a { min-height: 48px; display: flex; align-items: center; gap: var(--space-2); border-bottom: var(--hairline) solid var(--color-divider); font-size: var(--font-size-label); }
.network-relations svg { margin-left: auto; color: var(--color-text-tertiary); }
.network-stat, .network-legend, .network-count, .node-type, .relationship-note { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.network-legend { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.network-detail-top { display: flex; gap: var(--space-3); align-items: center; margin-bottom: var(--space-3); }
.contact-demo code { display: block; overflow-wrap: anywhere; font-family: var(--font-family); font-size: var(--font-size-label); }
.network-toolbar, .opportunity-tabs { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-3) 0; }
.network-toolbar button, .opportunity-tabs a { display: inline-flex; align-items: center; gap: var(--space-1); min-height: 30px; padding: 0 var(--space-3); border-radius: var(--radius-chip); background: var(--color-surface); border: var(--hairline) solid var(--color-divider); font-size: var(--font-size-label); }
.network-toolbar .active, .opportunity-tabs .active { background: var(--color-brand); color: var(--color-surface); border-color: var(--color-brand); font-weight: var(--font-weight-medium); }
.network-data-note, .network-detail-meta, .network-relation-note, .interest-demo-note { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.interest-ranking { display: none; }
.node-label { max-width: 78px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.network-relations { list-style: none; padding: 0; }
.network-relations li { border-top: var(--hairline) solid var(--color-divider); display: flex; align-items: center; gap: var(--space-2); min-height: 48px; }
.network-relations li > span { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.network-relations button { color: var(--color-brand); font-size: var(--font-size-label); min-height: 44px; text-align: left; }
.alumni-role, .alumni-bio, .alumni-contribution p, .alumni-timeline p { color: var(--color-text-secondary); font-size: var(--font-size-label); }
.alumni-cohort, .member-birthday { font-size: var(--font-size-meta); color: var(--color-text-secondary); margin: var(--space-2) 0; }
.alumni-interests { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }
.alumni-interests span { min-height: 30px; padding: 4px 12px; border-radius: var(--radius-chip); background: var(--color-page); color: var(--color-text-secondary); font-size: var(--font-size-meta); }
.alumni-contribution { display: flex; gap: var(--space-3); padding: var(--space-3) 0; border-bottom: var(--hairline) solid var(--color-divider); }
.alumni-contribution > span { font-size: var(--font-size-meta); color: var(--color-text-tertiary); }
.alumni-timeline { list-style: none; padding: 0; }
.alumni-timeline li { padding: var(--space-3) 0; border-bottom: var(--hairline) solid var(--color-divider); }
.alumni-year, .timeline-source { color: var(--color-brand); font-size: var(--font-size-meta); }
.alumni-profile-aside > section { border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); background: var(--color-surface); padding: var(--space-4); margin-bottom: var(--space-3); }
.alumni-profile-aside dt { font-size: var(--font-size-meta); color: var(--color-text-secondary); margin-top: var(--space-3); }
.alumni-profile-aside dd { margin: var(--space-1) 0; font-size: var(--font-size-label); }
.profile-photo-placeholder { min-height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--color-brand-light); color: var(--color-brand); border-radius: var(--radius-card); margin-top: var(--space-3); }
.profile-photo-placeholder p { font-size: var(--font-size-meta); }
.opportunity-status.is-active { background: var(--color-ok-surface); color: var(--color-ok-text); }
.opportunity-status.is-pending { background: var(--color-warn-surface); color: var(--color-warn-text); }
.opportunity-status.is-discussing { background: var(--color-brand-light); color: var(--color-brand); }
.opportunity-dot { width: 7px; height: 7px; background: var(--color-brand); border-radius: 50%; display: inline-block; }
.opportunity-row-head, .opportunity-row-foot, .opportunity-detail-heading, .opportunity-history-heading, .opportunity-side-title { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2); }
.opportunity-kind { font-size: var(--font-size-meta); color: var(--color-text-secondary); display: flex; align-items: center; gap: var(--space-1); }
.opportunity-row h2 a { display: block; padding-right: var(--space-4); position: relative; }
.opportunity-row h2 a::after { content: ''; width: 6px; height: 6px; position: absolute; right: 2px; top: 9px; border-top: 1px solid var(--color-text-tertiary); border-right: 1px solid var(--color-text-tertiary); transform: rotate(45deg); }
.opportunity-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.opportunity-summary > div { background: var(--color-surface); border: var(--hairline) solid var(--color-divider); padding: var(--space-3); border-radius: var(--radius-card); }
.opportunity-summary span { display: block; font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.opportunity-summary strong { font-size: var(--font-size-title); }
.opportunity-inbox { padding: var(--space-3) 0 0; }
.opportunity-tabs { padding: 0 var(--space-3); }
.opportunity-search { display: flex; align-items: center; gap: var(--space-2); padding: 0 var(--space-3); }
.opportunity-search input { flex: 1; width: 0; font-size: var(--font-size-label) !important; }
.opportunity-search button { min-height: 44px; color: var(--color-brand); font-size: var(--font-size-label); }
.opportunity-list-note { padding: 0 var(--space-4); color: var(--color-text-secondary); font-size: var(--font-size-meta); }
.opportunity-sidebar { margin-top: var(--space-3); }
.opportunity-side-item { display: block; min-height: 48px; border-bottom: var(--hairline) solid var(--color-divider); padding: var(--space-3) 0; font-size: var(--font-size-label); }
.opportunity-side-item > div { display: flex; flex-wrap: wrap; gap: var(--space-2); justify-content: space-between; color: var(--color-text-secondary); font-size: var(--font-size-meta); }
.opportunity-side-item svg { width: 14px; height: 14px; vertical-align: middle; }
.opportunity-detail-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-top: var(--space-4); }
.opportunity-detail-actions > .primary { flex-basis: 100%; }
.opportunity-brief { margin: var(--space-4) 0; }
.opportunity-brief > div { padding: var(--space-3) 0; border-bottom: var(--hairline) solid var(--color-divider); }
.opportunity-brief dt { color: var(--color-text-secondary); font-size: var(--font-size-meta); }
.opportunity-brief dd { margin: var(--space-1) 0 0; overflow-wrap: anywhere; }
.opportunity-source-link { color: var(--color-brand); display: flex; gap: var(--space-2); align-items: center; min-height: 44px; font-size: var(--font-size-label); }
.opportunity-history { margin-top: var(--space-4); }
.opportunity-history ol { padding: 0; list-style: none; }
.opportunity-history li { padding: var(--space-3) 0; border-bottom: var(--hairline) solid var(--color-divider); }
.opportunity-history-heading time, .opportunity-history-actor { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.opportunity-history p, .opportunity-row-foot { font-size: var(--font-size-label); }
.opportunity-unavailable { font-size: var(--font-size-label); background: var(--color-brand-light); color: var(--color-brand); padding: var(--space-3); border-radius: var(--radius-button); }
.opportunity-role-panel > div { display: flex; gap: var(--space-2); align-items: center; }
.opportunity-role-mark { color: var(--color-brand); }
.eco-directory-head { margin-bottom: var(--space-3); }
.eco-directory-head h1, .daily-page-heading h1 { display: none; }
.eco-directory-head p, .daily-page-heading > div > p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.daily-login-notice ul { list-style: none; padding: 0; }
.daily-login-notice li { display: flex; align-items: center; gap: var(--space-3); min-height: 48px; border-bottom: var(--hairline) solid var(--color-divider); }
.daily-login-notice svg { color: var(--color-brand); }
#toast.visible { display: block; }
.page-title > .opportunity-page-actions { width: 100%; }
.h5-card.h5-menu-list .h5-list-row { padding-left: var(--space-4); padding-right: var(--space-4); }
.project-row-link { display: flex; align-items: flex-start; gap: var(--space-3); grid-column: 1/-1; min-height: 48px; }
.project-row-link > .project-main { flex: 1; min-width: 0; }
.cooperation-target { padding: var(--space-3); background: var(--color-page); border-radius: var(--radius-card); margin-bottom: var(--space-3); }
.cooperation-target > span, .cooperation-counter, .cooperation-save-status { font-size: var(--font-size-meta); color: var(--color-text-secondary); }
.cooperation-target p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.cooperation-error { background: var(--color-brand-light); color: var(--color-brand); border-radius: var(--radius-button); padding: var(--space-3); font-size: var(--font-size-label); }
.cooperation-test { font-size: var(--font-size-meta); }
.state-example > p, .review-question p { font-size: var(--font-size-label); color: var(--color-text-secondary); }
.upload-box { padding: var(--space-4); border: var(--hairline) solid var(--color-divider); border-radius: var(--radius-card); }
.empty .btn:not(.primary) { width: 100%; }
@media (min-width: 600px) { .archive-grid, .archive-collection, .archive-editorial, .members-grid, .member-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .two-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } .memory-stage { height: 400px; } }
@media (max-width: 359px) { .page { padding-left: var(--space-2); padding-right: var(--space-2); } .project-row, .resource-row, .panel, .h5-card { padding: var(--space-3); } .project-row .row-end { grid-column: 1/-1; } .message-reply { gap: var(--space-1); } .message-reply-actions .btn.primary { padding: 0 var(--space-2); } .memory-stage { height: 280px; } }
