:root {
  color-scheme: light;
  --canvas: #fcfcf8;
  --surface: #f6f7f5;
  --surface-strong: #eceeeb;
  --ink: rgba(0, 0, 0, 0.94);
  --ink-soft: rgba(0, 0, 0, 0.62);
  --ink-faint: rgba(0, 0, 0, 0.42);
  --line: rgba(0, 0, 0, 0.11);
  --line-strong: rgba(0, 0, 0, 0.23);
  --accent: #2f6feb;
  --accent-hover: #245ac4;
  --accent-soft: #edf4ff;
  --coral: #ff7468;
  --coral-soft: #fff0ed;
  --lemon: #ffd65a;
  --lemon-soft: #fff8d6;
  --mint: #9ddfbd;
  --mint-soft: #edf9f2;
  --lavender: #b9a7ff;
  --lavender-soft: #f1edff;
  --sky-soft: #edf8fd;
  --rank-gold: #b57b12;
  --rank-gold-bright: #e2b532;
  --rank-gold-soft: #fff4c7;
  --rank-silver: #bec2c9;
  --rank-bronze: #b77c42;
  --rank-green: #68aa76;
  --rank-teal: #3fa59d;
  --rank-blue: #4777c7;
  --rank-red: #cf625b;
  --rank-gray: #85878b;
  --sage: #e5f1df;
  --sand: #fbf3db;
  --danger: #c43c2f;
  --danger-soft: #fff0ed;
  --glass: rgba(255, 255, 255, 0.76);
  --glass-strong: rgba(255, 255, 255, 0.9);
  --surface-translucent: rgba(255, 255, 255, 0.7);
  --surface-elevated: rgba(255, 255, 255, 0.92);
  --light-blue: #eaf2ff;
  --light-peach: #fff0e7;
  --radius-small: 14px;
  --radius-medium: 22px;
  --radius-large: 32px;
  --display: "Avenir Next", "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --sans: "Avenir Next", "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --shadow-soft: 0 18px 48px rgba(15, 15, 15, 0.07);
  --shadow-float: 0 28px 90px rgba(36, 48, 70, 0.11), 0 4px 20px rgba(36, 48, 70, 0.05);
  --shadow-stage: 0 42px 110px rgba(49, 65, 91, 0.12), 0 10px 34px rgba(49, 65, 91, 0.06);
  --shadow-card: 0 20px 55px rgba(40, 55, 81, 0.09), 0 2px 12px rgba(40, 55, 81, 0.04);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

* { box-sizing: border-box; }
html, body { overflow-x: clip; }
html { background: var(--canvas); color: var(--ink); font-family: var(--sans); font-size: 20px; scroll-behavior: smooth; }
body { min-width: 320px; min-height: 100vh; margin: 0; background: radial-gradient(circle at 85% 8%, rgba(234, 242, 255, 0.72), transparent 31rem), linear-gradient(145deg, #fbfcff 0%, var(--canvas) 45%, #fffaf4 100%); background-attachment: fixed; font-size: 20px; line-height: 1.6; }
body.landing-mode { background: radial-gradient(ellipse at 16% 4%, rgba(255, 226, 141, 0.3), transparent 33rem), radial-gradient(ellipse at 88% 12%, rgba(186, 211, 255, 0.42), transparent 36rem), radial-gradient(ellipse at 54% 34%, rgba(255, 224, 209, 0.22), transparent 34rem), var(--canvas); background-attachment: fixed; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button, label, select { -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible, label:has(input:focus-visible) { outline: 3px solid rgba(47, 111, 235, 0.26); outline-offset: 3px; }
.view h1[tabindex="-1"]:focus { outline: none; }
[hidden] { display: none !important; }
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 300; padding: 10px 14px; transform: translateY(-160%); border-radius: 6px; background: var(--ink); color: white; }
.skip-link:focus { transform: translateY(0); }

.site-header { position: sticky; top: 12px; z-index: 100; width: min(1320px, calc(100% - 32px)); min-height: 68px; margin: 12px auto 0; padding: 8px 10px 8px 14px; display: flex; align-items: center; gap: 24px; border: 1px solid rgba(255, 255, 255, 0.94); border-radius: var(--radius-medium); background: rgba(255, 255, 255, 0.74); box-shadow: 0 10px 34px rgba(35, 46, 66, 0.08); backdrop-filter: blur(22px) saturate(1.25); }
.wordmark { display: inline-flex; align-items: center; gap: 11px; color: inherit; text-decoration: none; white-space: nowrap; }
.wordmark strong { font-size: 20px; font-weight: 700; letter-spacing: -0.01em; }
.wordmark-mark { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(47, 111, 235, 0.72); border-radius: 13px; background: linear-gradient(145deg, #3778ef, #2863d6); color: white; font-size: 20px; font-weight: 800; box-shadow: 4px 5px 0 rgba(255, 214, 90, 0.82); }
.site-nav { display: flex; align-items: center; gap: 22px; margin-left: auto; }
.site-nav a { color: var(--ink-soft); font-size: 20px; font-weight: 600; text-decoration: none; }
.site-nav a:hover { color: var(--ink); }
.header-actions { display: flex; align-items: center; gap: 14px; margin-left: auto; }
.site-nav + .header-actions { margin-left: 6px; }
.privacy-pill { display: none; align-items: center; gap: 8px; color: var(--ink-soft); font-size: 20px; white-space: nowrap; }
.privacy-pill span { width: 7px; height: 7px; border-radius: 50%; background: #2f9e62; box-shadow: 0 0 0 4px rgba(47, 158, 98, 0.1); }
.header-button { min-height: 48px; padding: 0 20px; border: 1px solid var(--ink); border-radius: 999px; background: var(--ink); color: white; font-size: 20px; font-weight: 700; cursor: pointer; transition: background 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease; }
.header-button:hover { border-color: #252525; background: #252525; box-shadow: 0 8px 22px rgba(0, 0, 0, 0.16); transform: translateY(-1px); }
body:not(.landing-mode) .site-nav, body:not(.landing-mode) .header-button { display: none; }
body:not(.landing-mode) .privacy-pill { display: none; }
body:not(.landing-mode) .header-actions { margin-left: auto; }
.flow-status { width: 280px; display: grid; gap: 8px; }
.flow-status > span { overflow: hidden; color: var(--ink-soft); font-size: 20px; font-weight: 700; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.flow-status-meter { height: 3px; overflow: hidden; border-radius: 999px; background: var(--surface-strong); }
.flow-status-meter i { width: 20%; height: 100%; display: block; border-radius: inherit; background: var(--accent); transition: width 0.22s ease; }

.view { width: min(1240px, calc(100% - 48px)); margin: 0 auto; padding: 72px 0 112px; }
.narrow-view { width: min(900px, calc(100% - 48px)); }
.view-active { animation: reveal 0.34s cubic-bezier(0.2, 0.78, 0.25, 1) both; }
@keyframes reveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.eyebrow, .section-kicker { margin: 0 0 14px; color: var(--accent); font-size: 20px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.section-kicker { margin-bottom: 6px; color: var(--ink-faint); }
h1, h2, h3, p { text-wrap: pretty; }
h1 em, h2 em { display: inline-block; color: var(--accent); font-style: normal; }

/* Public landing page */
.landing-view { padding-top: 0; }
.landing-hero { position: relative; isolation: isolate; padding: clamp(72px, 8vw, 108px) 0 78px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.landing-hero::before, .landing-hero::after { content: ""; position: absolute; z-index: -1; pointer-events: none; }
.landing-hero::before { top: 10%; left: -6%; width: 300px; height: 300px; border-radius: 50%; background: rgba(255, 208, 95, 0.34); filter: blur(56px); opacity: 0.76; }
.landing-hero::after { top: 15%; right: -7%; width: 360px; height: 280px; border-radius: 50%; background: rgba(145, 187, 255, 0.3); filter: blur(62px); opacity: 0.8; }
.hero-copy-block { width: 100%; display: flex; flex-direction: column; align-items: center; }
.hero-label { margin: 0 0 26px; padding: 10px 17px; display: inline-flex; align-items: center; gap: 9px; border: 1px solid rgba(181, 123, 18, 0.2); border-radius: 999px; background: rgba(255, 251, 231, 0.76); box-shadow: 0 8px 24px rgba(74, 60, 24, 0.06); color: var(--ink-soft); font-size: 20px; font-weight: 700; letter-spacing: 0.04em; backdrop-filter: blur(14px); }
.hero-label > span:first-child { font-size: 20px; line-height: 1; }
.hero-medals { margin-left: 2px; letter-spacing: 0.02em; opacity: 0.86; }
.landing-hero h1 { max-width: 1100px; margin: 0; font-family: var(--display); font-size: clamp(62px, 7.8vw, 96px); font-weight: 650; letter-spacing: -0.058em; line-height: 0.99; }
.hero-statement { max-width: 900px; margin: 30px 0 0; color: rgba(0, 0, 0, 0.82); font-size: clamp(24px, 2.2vw, 30px); font-weight: 580; letter-spacing: -0.02em; line-height: 1.45; }
.hero-body { width: min(1180px, 100%); margin-top: 54px; padding: clamp(16px, 2.2vw, 26px); display: grid; grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr); gap: clamp(20px, 3vw, 36px); align-items: stretch; border: 1px solid rgba(255, 255, 255, 0.92); border-radius: var(--radius-large); background: rgba(255, 255, 255, 0.62); box-shadow: var(--shadow-float); text-align: left; backdrop-filter: blur(22px) saturate(1.15); }
.hero-entry-column { min-width: 0; padding: clamp(10px, 2vw, 22px); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.landing-lead { max-width: 620px; margin: 0; color: var(--ink-soft); font-size: 22px; line-height: 1.7; }
.hero-illustration { min-width: 0; margin: 0; overflow: hidden; display: grid; grid-template-rows: 1fr auto; border: 1px solid rgba(255, 255, 255, 0.8); border-radius: 24px; background: #fbf5e8; box-shadow: 0 18px 46px rgba(31, 41, 58, 0.11); }
.hero-illustration img { width: 100%; height: 100%; min-height: 360px; display: block; object-fit: cover; object-position: center; }
.hero-illustration figcaption { padding: 15px 18px 17px; border-top: 1px solid rgba(0, 0, 0, 0.08); background: rgba(255, 255, 255, 0.88); color: var(--ink-soft); font-size: 20px; line-height: 1.5; backdrop-filter: blur(12px); }
.hero-actions { margin-top: 30px; display: flex; align-items: center; gap: 22px; }
.primary-button, .secondary-button { min-height: 58px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 0 22px; border: 1px solid var(--ink); border-radius: var(--radius-small); background: var(--ink); color: white; font-size: 20px; font-weight: 700; cursor: pointer; transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; }
.primary-button { border-color: var(--accent); background: var(--accent); }
.primary-button:hover:not(:disabled) { border-color: var(--accent-hover); background: var(--accent-hover); box-shadow: 0 10px 24px rgba(47, 111, 235, 0.22); transform: translateY(-2px); }
.secondary-button:hover:not(:disabled) { border-color: #2d2d2d; background: #2d2d2d; transform: translateY(-2px); }
.primary-button:disabled, .secondary-button:disabled { cursor: not-allowed; opacity: 0.38; }
.primary-button[aria-busy="true"] { position: relative; overflow: hidden; cursor: progress; opacity: 1; }
.primary-button[aria-busy="true"]::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 22%, rgba(255, 255, 255, 0.34) 46%, transparent 70%); transform: translateX(-120%); animation: button-sweep 1.15s ease-in-out infinite; pointer-events: none; }
@keyframes button-sweep { to { transform: translateX(120%); } }
.primary-button svg, .text-button svg { width: 17px; height: 17px; fill: currentColor; }
.hero-button { min-height: 52px; padding: 0 23px; background: var(--accent); border-color: var(--accent); font-size: 20px; }
.hero-button:hover:not(:disabled) { border-color: var(--accent-hover); background: var(--accent-hover); }
.secondary-link { color: var(--ink); font-size: 20px; font-weight: 700; text-underline-offset: 5px; }
.hero-access { width: 100%; margin-top: 26px; padding: 22px; border: 1px solid rgba(47, 111, 235, 0.18); border-radius: var(--radius-medium); background: var(--glass-strong); box-shadow: 0 16px 44px rgba(42, 61, 92, 0.09); text-align: left; backdrop-filter: blur(16px); }
.hero-access > label { display: block; margin: 0 0 9px; font-size: 20px; font-weight: 750; }
.hero-access-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.hero-access-row input { min-width: 0; height: 60px; padding: 0 16px; border: 1px solid rgba(0, 0, 0, 0.18); border-radius: var(--radius-small); background: rgba(255, 255, 255, 0.86); color: var(--ink); font-size: 20px; font-weight: 650; letter-spacing: 0.04em; text-transform: uppercase; transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease; }
.hero-access-row input:focus { border-color: var(--accent); background: #fff; box-shadow: 0 0 0 4px rgba(47, 111, 235, 0.1); }
.hero-access-row input[aria-invalid="true"] { border-color: var(--danger); background: var(--danger-soft); box-shadow: 0 0 0 3px rgba(196, 60, 47, 0.1); }
.hero-access-row .primary-button { min-height: 58px; padding-inline: 22px; white-space: nowrap; }
.hero-access-hint { margin: 9px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.55; }
.hero-access-status { margin: 8px 0 0; color: #2459be; font-size: 20px; font-weight: 700; line-height: 1.5; }
.hero-access-status:empty { display: none; }
.hero-access-error { min-height: 0; margin: 6px 0 0; }
.hero-access-error:empty { display: none; }
.credential-legend { margin-top: 16px; padding-top: 16px; display: grid; grid-template-columns: 1fr; gap: 10px; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 20px; line-height: 1.5; }
.credential-legend span { display: grid; gap: 2px; }
.credential-legend b { color: var(--ink); font-size: 20px; }
.hero-method-link { margin-top: 20px; color: var(--ink-soft); }
.hero-facts { width: min(1180px, 100%); margin: 46px 0 0; padding: 24px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); list-style: none; }
.hero-facts li { min-width: 0; padding: 0 26px; display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; align-items: center; text-align: left; }
.hero-facts li + li { border-left: 1px solid var(--line); }
.hero-facts li > span { grid-row: 1 / 3; color: var(--accent); font-size: 20px; font-weight: 800; }
.hero-facts strong { font-size: 20px; }
.hero-facts small { color: var(--ink-soft); font-size: 20px; line-height: 1.4; }
.rating-spectrum { width: min(1180px, 100%); margin-top: 44px; padding: 28px 32px 26px; border: 1px solid rgba(255, 255, 255, 0.86); border-radius: var(--radius-medium); background: linear-gradient(105deg, rgba(255, 255, 255, 0.86), var(--sky-soft) 50%, var(--rank-gold-soft)); box-shadow: 0 16px 42px rgba(34, 47, 68, 0.07); text-align: left; }
.spectrum-topline, .spectrum-bottom { display: flex; align-items: center; justify-content: space-between; gap: 24px; color: var(--ink-soft); font-size: 20px; font-weight: 700; letter-spacing: 0.04em; }
.spectrum-scale { margin: 25px 0 23px; display: grid; grid-template-columns: 78px 1fr 78px; gap: 18px; align-items: center; }
.spectrum-low, .spectrum-high { font-size: 20px; font-weight: 800; text-align: center; }
.spectrum-low { color: var(--rank-gray); }
.spectrum-high { color: var(--rank-gold); }
.spectrum-track { display: grid; grid-template-columns: repeat(11, 1fr); gap: 5px; }
.spectrum-track i { height: 34px; border-radius: 3px; background: var(--rank-gray); }
.spectrum-track i:nth-child(2) { background: #a5a4a1; }
.spectrum-track i:nth-child(3) { background: var(--rank-red); }
.spectrum-track i:nth-child(4) { background: #dc756d; }
.spectrum-track i:nth-child(5) { background: var(--rank-blue); }
.spectrum-track i:nth-child(6) { background: #4a91c8; }
.spectrum-track i:nth-child(7) { background: var(--rank-teal); }
.spectrum-track i:nth-child(8) { background: var(--rank-green); }
.spectrum-track i:nth-child(9) { background: var(--rank-bronze); }
.spectrum-track i:nth-child(10) { background: var(--rank-silver); }
.spectrum-track i:nth-child(11) { background: var(--rank-gold-bright); }
.spectrum-bottom { padding-top: 18px; border-top: 1px solid var(--line); }
.spectrum-bottom div { display: grid; gap: 2px; }
.spectrum-bottom div:last-child { text-align: right; }
.spectrum-bottom strong { color: var(--ink); font-size: 20px; }
.spectrum-bottom span { font-weight: 400; }

.landing-section { scroll-margin-top: 92px; padding: 104px 0; border-top: 1px solid var(--line); content-visibility: auto; contain-intrinsic-size: auto 880px; }
.section-heading { max-width: 850px; margin-bottom: 54px; }
.section-heading h2, .invite-intro h2, .privacy-section h2, .ethos-heading h2, .landing-cta h2 { margin: 0; font-family: var(--display); font-size: clamp(42px, 5vw, 64px); font-weight: 650; letter-spacing: -0.055em; line-height: 1.08; }
.section-heading > p:last-child, .invite-intro > p, .privacy-section > div:last-child > p { max-width: 760px; margin-top: 22px; color: var(--ink-soft); font-size: 20px; line-height: 1.8; }
.board-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.board-card { min-height: 540px; padding: clamp(30px, 4vw, 48px); border: 1px solid rgba(255, 255, 255, 0.82); border-radius: 28px; background: var(--surface); box-shadow: 0 16px 48px rgba(35, 47, 67, 0.06); transition: transform 0.18s ease, box-shadow 0.18s ease; }
.board-card:hover { transform: translateY(-4px); box-shadow: 0 26px 62px rgba(32, 43, 63, 0.11); }
.company-board-card { background: var(--lemon-soft); }
.institution-board-card { background: var(--lavender-soft); }
.board-card-top { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: clamp(22px, 4vw, 44px); }
.board-index { padding-top: 13px; font-size: 20px; font-weight: 800; }
.eligibility-block { min-height: 112px; padding: 15px 17px; display: grid; align-content: center; gap: 8px; border: 1px solid rgba(181, 123, 18, 0.18); border-radius: 18px; background: rgba(255, 255, 255, 0.7); }
.eligibility-block small { color: var(--ink-soft); font-size: 20px; font-weight: 650; line-height: 1.45; }
.eligibility-block strong { font-size: 20px; font-weight: 800; line-height: 1.4; }
.eligibility-founder { border-color: rgba(47, 111, 235, 0.2); }
.paper-tag { padding: 6px 9px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--canvas); color: var(--ink-soft); font-size: 20px; font-weight: 700; }
.board-card h3 { margin: 42px 0 0; font-family: var(--display); font-size: clamp(35px, 3.4vw, 48px); font-weight: 650; letter-spacing: -0.045em; }
.board-question { max-width: 500px; min-height: 58px; margin: 18px 0 28px; font-size: 20px; font-weight: 650; line-height: 1.55; }
.board-card ul { margin: 0; padding: 22px 0 0 20px; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 20px; line-height: 1.8; }
.board-card li + li { margin-top: 8px; }

.ethos-section { display: grid; grid-template-columns: minmax(300px, 0.75fr) minmax(0, 1.25fr); gap: clamp(52px, 8vw, 120px); align-items: start; }
.ethos-heading { position: sticky; top: 104px; }
.ethos-copy { padding-top: 2px; }
.ethos-lead { margin: 0 0 48px; font-size: clamp(22px, 2.4vw, 32px); font-weight: 590; letter-spacing: -0.025em; line-height: 1.48; }
.ethos-notes { display: grid; gap: 10px; }
.ethos-notes article { padding: 28px 26px; display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 10px 24px; align-items: baseline; border: 1px solid rgba(255, 255, 255, 0.84); border-radius: var(--radius-medium); box-shadow: 0 12px 38px rgba(35, 47, 67, 0.05); }
.ethos-notes article p { grid-column: 2; }
.ethos-notes article:nth-child(1) { background: var(--coral-soft); }
.ethos-notes article:nth-child(2) { background: var(--mint-soft); }
.ethos-notes article:nth-child(3) { background: var(--lavender-soft); }
.ethos-notes span { color: var(--accent); font-size: 20px; font-weight: 800; letter-spacing: 0.08em; }
.ethos-notes h3 { margin: 0; font-size: 20px; font-weight: 700; line-height: 1.4; }
.ethos-notes p { margin: 0; color: var(--ink-soft); font-size: 20px; line-height: 1.8; }

.methodology-section { position: relative; }
.method-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.method-card { min-height: 380px; padding: 30px; border: 1px solid rgba(255, 255, 255, 0.82); border-radius: var(--radius-medium); background: var(--glass-strong); box-shadow: 0 14px 42px rgba(35, 47, 67, 0.05); }
.method-card:nth-child(2) { background: var(--coral-soft); }
.method-card:nth-child(3) { background: var(--lemon-soft); }
.method-card:nth-child(4) { background: var(--mint-soft); }
.method-card-wide { min-height: 360px; grid-column: 1 / -1; padding: clamp(30px, 5vw, 52px); background: linear-gradient(120deg, var(--lavender-soft), var(--sky-soft)); color: var(--ink); }
.method-card-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--line); color: var(--ink-soft); font-size: 20px; font-weight: 700; letter-spacing: 0.05em; }
.method-card-wide .method-card-head { border-color: var(--line); color: var(--ink-soft); }
.method-card-head b { color: var(--accent); font-weight: 700; }
.method-card-wide .method-card-head b { color: var(--accent); }
.method-card h3 { margin: 34px 0 18px; font-size: 23px; font-weight: 650; letter-spacing: -0.025em; line-height: 1.35; }
.method-card-wide h3 { max-width: 760px; margin-top: 42px; font-size: clamp(32px, 4vw, 48px); line-height: 1.16; }
.method-card p { margin: 0; color: var(--ink-soft); font-size: 20px; line-height: 1.75; }
.method-card-wide ul { max-width: 920px; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 42px; list-style: none; }
.method-card-wide li { position: relative; padding-left: 18px; color: var(--ink-soft); font-size: 20px; line-height: 1.65; }
.method-card-wide li::before { content: ""; position: absolute; top: 0.72em; left: 0; width: 6px; height: 6px; border-radius: 50%; background: var(--coral); }
.method-footnote { margin-top: 30px !important; padding-top: 22px; border-top: 1px solid var(--line); color: var(--ink-soft) !important; }
.composite-note { margin-top: 14px; padding: 26px 28px; display: grid; grid-template-columns: 250px 1fr; gap: 34px; align-items: start; border-radius: var(--radius-medium); background: linear-gradient(120deg, rgba(241, 237, 255, 0.92), rgba(237, 248, 253, 0.9)); box-shadow: 0 14px 42px rgba(35, 47, 67, 0.05); }
.composite-note span { font-size: 20px; font-weight: 750; }
.composite-note p { margin: 0; color: var(--ink-soft); font-size: 20px; line-height: 1.75; }

.invite-section { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(440px, 1.1fr); gap: clamp(54px, 8vw, 118px); align-items: start; }
.invite-intro { position: sticky; top: 104px; }
.rule-callout { margin-top: 30px; padding: 22px; border-left: 3px solid var(--coral); border-radius: 0 8px 8px 0; background: var(--lemon-soft); }
.rule-callout strong { display: block; margin-bottom: 8px; font-size: 20px; }
.rule-callout p { margin: 0; color: var(--ink-soft); font-size: 20px; line-height: 1.75; }
.invite-type-guide { margin-bottom: 26px; display: grid; gap: 10px; }
.invite-type-guide article { padding: 22px; display: grid; gap: 7px; border: 1px solid var(--line); border-radius: 10px; background: var(--lavender-soft); }
.invite-type-guide article:last-child { background: var(--lemon-soft); }
.invite-type-guide span { color: var(--accent); font-size: 20px; font-weight: 800; letter-spacing: 0.05em; }
.invite-type-guide strong { font-size: 20px; }
.invite-type-guide p { margin: 0; color: var(--ink-soft); font-size: 20px; line-height: 1.7; }
.invite-steps { margin: 0; padding: 0; list-style: none; }
.invite-steps li { min-height: 116px; display: grid; grid-template-columns: 48px 1fr; gap: 22px; padding: 25px 0; border-bottom: 1px solid var(--line); }
.invite-steps li:first-child { border-top: 1px solid var(--line); }
.invite-steps li > span { padding-top: 4px; color: var(--accent); font-size: 20px; font-weight: 800; }
.invite-steps strong { font-size: 20px; font-weight: 650; }
.invite-steps p { margin: 8px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.7; }
.invite-principles { grid-column: 2; padding: 24px; border: 1px solid var(--line); border-radius: 10px; background: var(--mint-soft); }
.invite-principles > strong { font-size: 20px; }
.invite-principles ul { margin: 14px 0 0; padding-left: 18px; color: var(--ink-soft); font-size: 20px; line-height: 1.8; }
.invite-principles li + li { margin-top: 4px; }

.privacy-section { display: grid; grid-template-columns: minmax(330px, 0.85fr) minmax(0, 1.15fr); gap: clamp(54px, 8vw, 116px); align-items: center; }
.privacy-visual { min-height: 420px; padding: 48px; display: grid; grid-template-columns: 1fr 50px 1fr; align-items: center; border: 1px solid var(--line); border-radius: 14px; background: var(--lavender-soft); }
.privacy-visual div { aspect-ratio: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--lemon-soft); text-align: center; }
.privacy-visual div:last-child { border-color: rgba(47, 111, 235, 0.28); background: var(--mint-soft); }
.privacy-visual span { font-size: 20px; font-weight: 700; }
.privacy-visual b { color: var(--ink-soft); font-size: 20px; }
.privacy-visual i { height: 3px; border-radius: 999px; background: var(--coral); }
.check-list { margin: 28px 0 0; padding: 0; list-style: none; }
.check-list li { position: relative; padding: 14px 0 14px 26px; border-bottom: 1px solid var(--line); font-size: 20px; line-height: 1.65; }
.check-list li::before { content: "✓"; position: absolute; top: 14px; left: 2px; color: var(--accent); font-weight: 800; }
.landing-cta { position: relative; overflow: hidden; margin: 72px 0 8px; padding: clamp(58px, 8vw, 94px) 28px; border: 1px solid rgba(255, 255, 255, 0.86); border-radius: var(--radius-large); background: linear-gradient(105deg, rgba(255, 248, 214, 0.92), rgba(241, 237, 255, 0.92) 55%, rgba(237, 249, 242, 0.94)); box-shadow: var(--shadow-float); color: var(--ink); text-align: center; }
.landing-cta::before, .landing-cta::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.landing-cta::before { width: 110px; height: 110px; left: -28px; bottom: -48px; background: var(--coral); opacity: 0.72; }
.landing-cta::after { width: 84px; height: 84px; right: 24px; top: -38px; background: var(--lemon); opacity: 0.9; }
.landing-cta .eyebrow { color: var(--accent); }
.landing-cta h2 { max-width: 850px; margin-inline: auto; }
.landing-cta p:not(.eyebrow) { margin: 18px 0 30px; color: var(--ink-soft); font-size: 20px; }

/* Entry and common forms */
.entry-view { padding-top: 34px; display: grid; grid-template-columns: minmax(300px, 0.72fr) minmax(570px, 1.28fr); column-gap: clamp(36px, 5vw, 76px); align-items: start; }
.page-back { grid-column: 1 / -1; margin-bottom: 34px; }
.entry-hero { position: sticky; top: 108px; display: grid; gap: 26px; }
.entry-hero h1, .compact-hero h1, .rating-intro h1, .complete-card h1 { margin: 0; font-family: var(--display); font-weight: 650; letter-spacing: -0.055em; line-height: 1.06; }
.entry-hero h1 { font-size: clamp(48px, 4.8vw, 68px); }
.hero-copy { max-width: 460px; margin: 22px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.75; }
.rule-stamp { width: fit-content; min-width: 180px; padding: 16px 18px; display: grid; gap: 5px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.rule-stamp strong { font-size: 20px; }
.rule-stamp span { color: var(--ink-soft); font-size: 20px; }
.entry-card { width: 100%; margin: 0; padding: clamp(26px, 3vw, 36px); border: 1px solid rgba(255, 255, 255, 0.9); border-radius: 26px; background: var(--glass-strong); box-shadow: var(--shadow-float); backdrop-filter: blur(18px); }
.entry-field { display: grid; grid-template-columns: 180px 1fr; align-items: center; gap: 10px 18px; }
.entry-field label, fieldset legend, .dialog-card > label { font-size: 20px; font-weight: 750; letter-spacing: 0.03em; }
.entry-field input, .endorsement-field input, .endorsement-field select, .endorsement-field textarea, .new-name-row input { width: 100%; border: 1px solid var(--line-strong); border-radius: 7px; background: var(--canvas); color: var(--ink); }
.entry-field input { height: 54px; padding: 0 16px; letter-spacing: 0.08em; text-transform: uppercase; }
.entry-field input[readonly] { border-color: var(--line); background: var(--surface); color: var(--ink-soft); cursor: default; }
.entry-field input[aria-invalid="true"] { border-color: var(--danger); background: var(--danger-soft); box-shadow: 0 0 0 3px rgba(196, 60, 47, 0.1); }
.entry-field p { grid-column: 2; margin: 0; color: var(--ink-soft); font-size: 20px; }
.verified-code-row { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.verified-invite-status { min-height: 50px; padding: 0 14px; display: inline-flex; align-items: center; gap: 9px; border-radius: 999px; background: var(--sage); color: #2f7a4e; font-size: 20px; font-weight: 750; white-space: nowrap; }
.verified-invite-status i { width: 7px; height: 7px; border-radius: 50%; background: #2f9e62; box-shadow: 0 0 0 3px rgba(47, 158, 98, 0.12); }
.verified-invite-scope { padding: 12px 14px; border-left: 3px solid var(--accent); border-radius: 0 7px 7px 0; background: var(--accent-soft); color: var(--ink) !important; font-weight: 700; line-height: 1.55; }
.verified-invite-scope.scope-company { border-left-color: var(--rank-green); background: var(--mint-soft); }
.identity-fieldset, .board-fieldset { margin: 27px 0 22px; padding: 0; border: 0; }
.identity-fieldset legend, .board-fieldset legend { margin-bottom: 12px; }
.identity-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.identity-option { position: relative; min-height: 170px; display: grid; align-content: space-between; padding: 18px; border: 1px solid rgba(0, 0, 0, 0.09); border-radius: 18px; background: rgba(246, 247, 245, 0.76); cursor: pointer; transition: border-color 0.14s ease, background 0.14s ease, transform 0.14s ease, box-shadow 0.14s ease; }
.identity-option:hover { border-color: rgba(47, 111, 235, 0.34); box-shadow: 0 12px 30px rgba(38, 52, 76, 0.08); transform: translateY(-2px); }
.identity-option:has(input:checked) { border-color: var(--accent); background: var(--accent); color: white; }
.identity-option input { position: absolute; opacity: 0; pointer-events: none; }
.identity-index { justify-self: end; color: var(--ink-faint); font-size: 20px; font-weight: 700; }
.identity-option:has(input:checked) .identity-index, .identity-option:has(input:checked) small { color: rgba(255, 255, 255, 0.62); }
.identity-option strong { font-size: 20px; }
.identity-option small { color: var(--ink-soft); font-size: 20px; }
.board-fieldset { margin-top: 25px; }
.board-step-hint { margin: -2px 0 13px; color: var(--ink-soft); font-size: 20px; line-height: 1.55; transition: color 0.18s ease; }
.board-fieldset-waiting .board-step-hint { color: var(--ink-faint); }
.board-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.board-option { position: relative; min-height: 138px; padding: 18px; display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: center; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); cursor: pointer; transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease, transform 0.18s ease; }
.board-option:not(.board-option-locked):hover { border-color: var(--line-strong); transform: translateY(-2px); }
.board-option b { grid-column: 2; }
.board-option input { position: absolute; opacity: 0; }
.board-option > span:first-of-type { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 8px; font-size: 20px; font-weight: 800; }
.board-option > span:nth-of-type(2) { display: grid; gap: 5px; }
.board-option strong { font-size: 20px; }
.board-option small { color: var(--ink-soft); font-size: 20px; }
.board-option b { color: var(--ink-faint); font-size: 20px; }
.board-option:has(input:checked) { border-color: rgba(47, 111, 235, 0.5); background: var(--accent-soft); box-shadow: inset 0 0 0 1px rgba(47, 111, 235, 0.15); }
.board-option:has(input:checked) > span:first-of-type { border-color: var(--accent); background: var(--accent); color: white; }
.board-option:has(input:checked) b { color: var(--accent); }
.board-option-locked { cursor: not-allowed; opacity: 0.52; }
.board-option-waiting { border-style: dashed; background: color-mix(in srgb, var(--surface) 74%, var(--canvas)); opacity: 0.62; }
.board-option-waiting > span:first-of-type { background: transparent; color: var(--ink-faint); }
.wide-button { width: 100%; }
.legal-note { margin: 14px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.6; text-align: center; }
.form-error { min-height: 20px; margin: 12px 0; color: var(--danger); font-size: 20px; line-height: 1.5; }

/* Four-task participation hub */
.task-hub-view { width: min(1120px, calc(100% - 48px)); }
.task-hub-hero { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 64px; align-items: end; }
.task-hub-hero .back-button { margin-bottom: 30px; }
.task-hub-hero h1 { margin: 0; font-family: var(--display); font-size: clamp(48px, 5.6vw, 74px); font-weight: 650; letter-spacing: -0.06em; line-height: 1.04; }
.task-hub-hero > div > p:last-child { max-width: 760px; margin: 24px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.75; }
.task-identity-card { min-height: 180px; padding: 24px; display: grid; align-content: center; gap: 5px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(145deg, var(--lemon-soft), var(--canvas)); box-shadow: 9px 9px 0 rgba(181, 123, 18, 0.12); }
.task-identity-card span, .task-identity-card small { color: var(--ink-soft); font-size: 20px; }
.task-identity-card strong { font-size: 30px; letter-spacing: -0.03em; }
.task-grid { margin-top: 54px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.task-card { position: relative; overflow: hidden; min-height: 280px; padding: 28px; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto 1fr auto auto; gap: 14px 18px; align-items: start; border: 1px solid rgba(255, 255, 255, 0.84); border-radius: 24px; color: var(--ink); text-align: left; cursor: pointer; box-shadow: 0 16px 42px rgba(20, 30, 48, 0.07); transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, opacity 0.18s ease; }
.task-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(112deg, transparent 35%, rgba(255, 255, 255, 0.42) 52%, transparent 68%); opacity: 0; transform: translateX(-50%); transition: opacity 0.18s ease, transform 0.42s ease; pointer-events: none; }
.task-card:hover:not(:disabled) { transform: translateY(-4px); border-color: rgba(255, 255, 255, 0.96); box-shadow: 0 26px 58px rgba(20, 30, 48, 0.12); }
.task-card:hover:not(:disabled)::after { opacity: 1; transform: translateX(50%); }
.task-card-anonymous:nth-child(1) { background: linear-gradient(145deg, var(--lemon-soft), var(--canvas) 68%); }
.task-card-real:nth-child(2) { background: linear-gradient(145deg, var(--mint-soft), var(--canvas) 68%); }
.task-card-anonymous:nth-child(3) { background: linear-gradient(145deg, var(--lavender-soft), var(--canvas) 68%); }
.task-card-real:nth-child(4) { background: linear-gradient(145deg, var(--coral-soft), var(--canvas) 68%); }
.task-number { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 10px; background: rgba(255, 255, 255, 0.72); font-size: 20px; font-weight: 800; }
.task-privacy { justify-self: end; padding: 7px 11px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255, 255, 255, 0.78); color: var(--ink-soft); font-size: 20px; font-weight: 750; }
.task-card > strong { grid-column: 1 / -1; align-self: end; font-size: clamp(27px, 3vw, 36px); letter-spacing: -0.04em; line-height: 1.25; }
.task-card > small { grid-column: 1 / -1; color: var(--ink-soft); font-size: 20px; line-height: 1.55; }
.task-card > b { grid-column: 1 / -1; padding-top: 14px; border-top: 1px solid var(--line); color: var(--accent); font-size: 20px; }
.task-card-complete { border-color: rgba(47, 158, 98, 0.46); box-shadow: inset 0 0 0 2px rgba(47, 158, 98, 0.12); }
.task-card-complete > b { color: #2f7a4e; }
.task-card-locked { cursor: not-allowed; filter: grayscale(0.35); opacity: 0.5; box-shadow: none; }
.task-card-locked > b { color: var(--ink-faint); }
.task-privacy-note { margin-top: 18px; padding: 22px 24px; display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: start; border: 1px solid rgba(47, 111, 235, 0.18); border-radius: 12px; background: var(--accent-soft); }
.task-privacy-note > span { font-size: 30px; }
.task-privacy-note strong { font-size: 20px; }
.task-privacy-note p { margin: 4px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.65; }
.task-hub-footer { margin-top: 20px; padding: 24px; display: flex; align-items: center; justify-content: space-between; gap: 28px; border: 1px solid rgba(255, 255, 255, 0.86); border-radius: var(--radius-medium); background: var(--glass); box-shadow: 0 14px 38px rgba(35, 47, 67, 0.05); backdrop-filter: blur(16px); }
.task-hub-footer > div { display: grid; gap: 4px; }
.task-hub-footer strong { font-size: 22px; }
.task-hub-footer span { color: var(--ink-soft); font-size: 20px; }
.task-hub-footer .primary-button { flex: 0 0 auto; }

/* Pool selection */
.compact-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 44px; }
.compact-hero h1, .rating-intro h1 { font-size: clamp(40px, 5vw, 66px); }
.compact-hero p:not(.eyebrow), .rating-intro > p:last-child { max-width: 700px; margin: 18px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.75; }
.back-button, .quiet-button, .text-button { border: 0; background: none; cursor: pointer; font-weight: 700; }
.back-button { min-height: 44px; padding: 0; color: var(--ink-soft); font-size: 20px; white-space: nowrap; }
.back-button:hover { color: var(--ink); }
.selection-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 20px; align-items: start; }
.pool-panel, .selection-summary { border: 1px solid rgba(255, 255, 255, 0.9); border-radius: var(--radius-medium); background: var(--glass-strong); box-shadow: 0 18px 52px rgba(35, 47, 67, 0.07); backdrop-filter: blur(16px); }
.pool-panel { padding: clamp(20px, 3vw, 30px); }
.selection-summary { position: sticky; top: 100px; padding: 26px; background: rgba(246, 247, 245, 0.84); }
.pool-toolbar, .summary-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.pool-toolbar h2, .summary-heading h2 { margin: 0; font-size: 24px; }
.text-button { min-height: 44px; display: inline-flex; align-items: center; gap: 7px; color: var(--accent); font-size: 20px; }
.quiet-button { min-height: 44px; color: var(--ink-soft); font-size: 20px; }
.quiet-button:disabled { opacity: 0.35; }
.search-box { min-height: 64px; margin-top: 25px; padding: 0 16px; display: flex; align-items: center; gap: 12px; border: 1px solid rgba(0, 0, 0, 0.17); border-radius: var(--radius-small); background: rgba(255, 255, 255, 0.88); transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease; }
.search-box:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(47, 111, 235, 0.13); }
.search-box svg { width: 20px; height: 20px; fill: none; stroke: currentColor; }
.search-box input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; }
.search-box input { min-height: 44px; }
.search-box kbd { padding: 3px 6px; border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 4px; color: var(--ink-soft); font-size: 20px; }
.company-discovery-filters { margin-top: 24px; padding: 18px; border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 18px; background: rgba(246, 247, 245, 0.78); }
.filter-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.filter-heading > div { display: flex; align-items: center; gap: 12px; }
.filter-heading strong { font-size: 20px; }
.filter-heading span { color: var(--ink-soft); font-size: 20px; }
.filter-reset { min-height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--canvas); color: var(--accent); font: inherit; font-size: 20px; font-weight: 700; cursor: pointer; }
.filter-reset:hover:not(:disabled) { border-color: var(--accent); background: var(--sky-soft); }
.filter-reset:disabled { opacity: 0.38; cursor: not-allowed; }
.filter-selects { margin-top: 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 10px; }
.filter-selects label { min-width: 0; display: grid; gap: 7px; color: var(--ink-soft); font-size: 20px; }
.filter-selects select { min-height: 56px; padding: 0 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--canvas); color: var(--ink); font-size: 20px; }
.company-name-search { margin-top: 14px; }
.search-priority-hint { margin: 7px 2px 0; color: var(--ink-faint); font-size: 20px; line-height: 1.45; }
.filter-chips { margin-top: 13px; display: flex; flex-wrap: wrap; gap: 7px; }
.filter-button { min-height: 50px; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--canvas); color: var(--ink-soft); font-size: 20px; cursor: pointer; }
.filter-button[aria-pressed="true"] { border-color: var(--accent); background: var(--accent); color: white; }
.pool-status { margin: 18px 0 10px; color: var(--ink-soft); font-size: 20px; }
.inline-add, .load-more { width: 100%; min-height: 58px; border: 1px dashed var(--line-strong); border-radius: 8px; background: var(--surface); color: var(--ink-soft); font-size: 20px; cursor: pointer; }
.inline-add { margin-bottom: 10px; color: var(--accent); }
.load-more { margin-top: 12px; }
.entity-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.company-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.entity-option { min-height: 150px; padding: 18px; display: grid; gap: 12px; align-content: space-between; border: 1px solid rgba(0, 0, 0, 0.09); border-radius: 17px; background: rgba(255, 255, 255, 0.86); color: var(--ink); text-align: left; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease; }
.entity-option:hover { border-color: rgba(47, 111, 235, 0.28); background: #fff; box-shadow: 0 12px 26px rgba(35, 47, 67, 0.07); transform: translateY(-2px); }
.entity-option[aria-pressed="true"] { border-color: rgba(47, 111, 235, 0.5); background: var(--accent-soft); box-shadow: inset 0 0 0 1px rgba(47, 111, 235, 0.14); }
.entity-topline { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.entity-topline strong { font-size: 20px; line-height: 1.35; }
.entity-subtitle { color: var(--ink-soft); font-size: 20px; line-height: 1.4; }
.tag-row { display: flex; flex-wrap: wrap; gap: 4px; }
.tag-row > span { padding: 3px 5px; border-radius: 3px; background: var(--surface-strong); color: var(--ink-soft); font-size: 20px; }
.provisional-note { color: var(--accent); font-size: 20px; font-weight: 700; }
.option-check { width: 18px; height: 18px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 50%; background: var(--canvas); }
.option-check svg { width: 11px; height: 11px; opacity: 0; }
.entity-option[aria-pressed="true"] .option-check { border-color: var(--accent); background: var(--accent); color: white; }
.entity-option[aria-pressed="true"] .option-check svg { opacity: 1; fill: currentColor; }
.selected-empty { min-height: 170px; display: grid; place-items: center; align-content: center; color: var(--ink-soft); font-size: 20px; }
.empty-orbit { width: 48px; height: 48px; border: 1px solid var(--line); border-radius: 8px; background: var(--canvas); }
.selected-list { margin: 18px 0; padding: 0; display: grid; gap: 7px; list-style: none; }
.selected-list li { min-height: 58px; padding: 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--canvas); font-size: 20px; }
.selected-list button { width: 44px; height: 44px; display: grid; place-items: center; flex: 0 0 auto; border: 0; background: none; color: var(--ink-soft); cursor: pointer; }
.selected-list button svg { width: 18px; height: 18px; }
.confirmation-row { margin: 18px 0; padding: 14px; display: grid; grid-template-columns: auto 1fr; gap: 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--canvas); font-size: 20px; line-height: 1.65; cursor: pointer; }
.confirmation-row input { margin-top: 2px; accent-color: var(--accent); }

/* Rating cards and endorsements */
.step-header { position: sticky; top: 94px; z-index: 40; margin: -16px 0 54px; padding: 13px 18px; display: flex; justify-content: space-between; border: 1px solid rgba(255, 255, 255, 0.9); border-radius: 18px; background: rgba(255, 255, 255, 0.78); box-shadow: 0 10px 30px rgba(35, 47, 67, 0.06); backdrop-filter: blur(18px); }
.step-header p { margin: 0; color: var(--ink-soft); font-size: 20px; }
.rating-intro { margin-bottom: 42px; }
.rating-list { display: grid; gap: 16px; }
.score-card { padding: clamp(24px, 4vw, 38px); border: 1px solid rgba(255, 255, 255, 0.9); border-radius: var(--radius-medium); background: var(--glass-strong); box-shadow: 0 18px 52px rgba(35, 47, 67, 0.08); backdrop-filter: blur(16px); }
.score-card > header { display: grid; grid-template-columns: 52px 1fr; gap: 12px; align-items: baseline; margin-bottom: 30px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.score-card header p { grid-column: 2; }
.score-card > header > span { color: var(--accent); font-size: 20px; font-weight: 800; }
.score-card h2 { margin: 0; font-size: 24px; font-weight: 650; }
.score-card header p { margin: 0; color: var(--ink-soft); font-size: 20px; }
.score-question { margin: 0 0 8px; font-size: 20px; font-weight: 750; }
.score-hint { margin: 0 0 15px; color: var(--ink-soft); font-size: 20px; line-height: 1.5; }
.score-scale { display: grid; grid-template-columns: repeat(11, 1fr); gap: 5px; }
.score-button { min-width: 0; min-height: 58px; border: 1px solid rgba(0, 0, 0, 0.09); border-radius: 12px; background: rgba(246, 247, 245, 0.88); font-size: 20px; cursor: pointer; transition: border-color 0.14s ease, background 0.14s ease, transform 0.14s ease, box-shadow 0.14s ease; }
.score-button:hover { border-color: var(--line-strong); }
.score-button[aria-checked="true"] { border-color: var(--accent); background: var(--accent); box-shadow: 0 8px 20px rgba(47, 111, 235, 0.24); color: white; font-weight: 800; transform: translateY(-2px); }
.score-scale-accent .score-button[aria-checked="true"] { border-color: var(--accent); background: var(--accent); }
.scale-anchors { margin-top: 7px; display: flex; justify-content: space-between; color: var(--ink-soft); font-size: 20px; }
.institution-score-block + .institution-score-block { margin-top: 28px; padding-top: 28px; border-top: 1px solid var(--line); }
.endorsement-hub { margin-top: 18px; padding: clamp(24px, 4vw, 38px); border: 1px solid rgba(216, 197, 123, 0.6); border-radius: var(--radius-medium); background: linear-gradient(145deg, rgba(255, 253, 244, 0.94) 0%, rgba(255, 255, 255, 0.9) 56%); box-shadow: 0 20px 58px rgba(48, 44, 29, 0.08); }
.endorsement-hub > header { margin-bottom: 20px; }
.endorsement-hub > header > span { color: #8a6813; font-size: 20px; font-weight: 800; letter-spacing: 0.06em; }
.endorsement-hub h2 { margin: 7px 0 8px; font-size: 28px; letter-spacing: -0.025em; }
.endorsement-hub > header p { margin: 0; color: var(--ink-soft); font-size: 20px; line-height: 1.6; }
.endorsement-target-search { width: 100%; min-height: 62px; padding: 0 16px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--canvas); color: var(--ink); font-size: 20px; }
.endorsement-target-search:focus { outline: 3px solid var(--accent-soft); border-color: var(--accent); }
.endorsement-target-list { margin-top: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.endorsement-target-option { min-height: 62px; padding: 11px 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--canvas); color: var(--ink); text-align: left; cursor: pointer; }
.endorsement-target-option:hover { border-color: var(--line-strong); background: var(--surface); }
.endorsement-target-option[aria-selected="true"] { border-color: var(--accent); box-shadow: inset 3px 0 0 var(--accent); }
.endorsement-target-option strong { overflow: hidden; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; }
.endorsement-target-option span { flex: 0 0 auto; color: var(--ink-soft); font-size: 20px; }
.endorsement-target-option[aria-selected="true"] span { color: var(--accent); font-weight: 750; }
.endorsement-target-empty { grid-column: 1 / -1; margin: 0; padding: 16px; color: var(--ink-soft); font-size: 20px; text-align: center; }
.endorsement-form-host:not(:empty) { margin-top: 18px; }
.endorsement-box { margin-top: 28px; border: 1px solid rgba(0, 0, 0, 0.09); border-radius: 18px; background: var(--surface); overflow: hidden; }
.endorsement-form-card { margin-top: 0; background: var(--canvas); }
.endorsement-form-head { min-height: 88px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.endorsement-form-head > div { min-width: 0; }
.endorsement-form-head span { color: var(--ink-soft); font-size: 20px; }
.endorsement-form-head h3 { margin: 3px 0 0; overflow: hidden; font-size: 24px; text-overflow: ellipsis; white-space: nowrap; }
.endorsement-cancel { min-height: 48px; padding: 0 13px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 7px; background: var(--canvas); color: var(--ink-soft); font-size: 20px; cursor: pointer; }
.endorsement-cancel:hover { border-color: var(--line-strong); color: var(--ink); }
.endorsement-toggle { min-height: 92px; padding: 18px; display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; cursor: pointer; }
.endorsement-toggle input { width: 18px; height: 18px; accent-color: var(--accent); }
.endorsement-toggle > span { display: grid; gap: 3px; }
.endorsement-toggle strong { font-size: 20px; }
.endorsement-toggle small { color: var(--ink-soft); font-size: 20px; line-height: 1.4; }
.endorsement-toggle b { color: var(--accent); font-size: 20px; }
.endorsement-panel { padding: 22px; border-top: 1px solid var(--line); background: var(--canvas); }
.endorsement-notice { margin: 0 0 18px; padding: 12px; border-left: 3px solid var(--accent); border-radius: 0 6px 6px 0; background: var(--accent-soft); font-size: 20px; line-height: 1.6; }
.endorsement-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.endorsement-field { display: grid; gap: 6px; color: var(--ink-soft); font-size: 20px; }
.endorsement-field input { min-height: 56px; padding: 0 12px; }
.endorsement-field select { min-height: 56px; padding: 0 12px; font-size: 20px; }
.endorsement-field textarea { min-height: 92px; padding: 10px 11px; resize: vertical; line-height: 1.55; }
.endorsement-field-wide { grid-column: 1 / -1; }
.praise-tag-field { min-width: 0; margin: 4px 0 2px; padding: 0; border: 0; }
.praise-tag-field legend { padding: 0; color: var(--ink); font-size: 20px; font-weight: 750; }
.praise-tag-helper { margin-top: 6px; display: flex; justify-content: space-between; gap: 14px; color: var(--ink-soft); font-size: 20px; line-height: 1.5; }
.praise-tag-helper strong { flex: 0 0 auto; color: var(--accent); font-size: 20px; }
.praise-tag-list { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.praise-tag { min-height: 48px; padding: 8px 13px; border: 1px solid var(--line); border-radius: 999px; background: var(--canvas); color: var(--ink-soft); font-size: 20px; line-height: 1.3; cursor: pointer; }
.praise-tag:hover { border-color: var(--line-strong); color: var(--ink); }
.praise-tag[aria-pressed="true"] { border-color: #b69220; background: var(--sand); color: #5f4810; box-shadow: inset 0 0 0 1px rgba(182, 146, 32, 0.14); font-weight: 750; }
.praise-tag-expand { min-height: 46px; margin-top: 8px; padding: 0; border: 0; background: none; color: var(--accent); font-size: 20px; font-weight: 700; cursor: pointer; }
.endorsement-confirmations { margin-top: 16px; display: grid; gap: 10px; }
.endorsement-confirmation { display: grid; grid-template-columns: auto 1fr; gap: 9px; align-items: start; font-size: 20px; line-height: 1.6; cursor: pointer; }
.endorsement-confirmation input { margin-top: 2px; accent-color: var(--accent); }
.wechat-verification { margin-top: 16px; padding: 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid rgba(114, 87, 181, 0.28); border-radius: 18px; background: linear-gradient(145deg, #f8f6ff, #f1f5ff); }
.wechat-verification.is-verified { border-color: #88bd91; background: #ecf8ef; }
.wechat-verification > div { display: grid; gap: 5px; }
.wechat-verification strong, .wechat-verification span { font-size: 20px; }
.wechat-verification span { color: var(--ink-soft); line-height: 1.5; }
.wechat-verification button { min-height: 52px; padding: 0 20px; flex: 0 0 auto; border: 1px solid var(--ink); border-radius: 8px; background: var(--ink); color: #fff; font-size: 20px; font-weight: 750; cursor: pointer; }
.wechat-qr { display: grid; justify-items: center; gap: 12px; flex: 0 0 auto; }
.wechat-qr img { width: min(240px, 100%); height: auto; padding: 8px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.wechat-qr > div { display: flex; justify-content: center; }
.wechat-verification .wechat-secondary-action { min-height: 44px; padding: 0 16px; background: #fff; color: var(--ink); font-size: 20px; }
.wechat-avatar { width: 72px; height: 72px; flex: 0 0 72px; border: 2px solid #fff; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px var(--line-strong), 0 6px 18px rgba(31, 29, 26, .1); object-fit: cover; }
.wechat-profile-heading { display: flex; align-items: center; gap: 16px; }
.wechat-profile-heading > div { display: grid; gap: 5px; }
.real-name-entry-gate { max-width: 980px; margin: 0 auto 28px; }
.endorsement-identity-gate { padding: clamp(24px, 4vw, 42px); border: 1px solid rgba(207, 200, 234, 0.74); border-radius: 26px; background: linear-gradient(145deg, rgba(255, 255, 255, 0.94) 0%, rgba(247, 243, 255, 0.94) 100%); box-shadow: var(--shadow-float); }
.endorsement-identity-gate.is-ready { border-color: #98c8a1; background: linear-gradient(145deg, #fff 0%, #eef9f0 100%); }
.endorsement-identity-gate > header > span { color: #7257b5; font-size: 20px; font-weight: 800; letter-spacing: .04em; }
.endorsement-identity-gate > header h2 { margin: 8px 0 10px; font-size: clamp(30px, 4vw, 44px); line-height: 1.14; letter-spacing: -.035em; }
.endorsement-identity-gate > header p { max-width: 800px; margin: 0; color: var(--ink-soft); font-size: 20px; line-height: 1.65; }
.endorsement-profile-card { margin-top: 22px; padding: 22px; border: 1px solid rgba(0, 0, 0, 0.13); border-radius: 18px; background: rgba(255, 255, 255, 0.9); }
.endorsement-profile-card > div:first-child { display: grid; gap: 5px; margin-bottom: 18px; }
.endorsement-profile-card > div:first-child strong, .endorsement-profile-card > div:first-child span { font-size: 20px; }
.endorsement-profile-card > div:first-child span { color: var(--ink-soft); line-height: 1.55; }
.endorsement-profile-actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 18px; }
.endorsement-profile-actions .form-error { margin: 0; }
.endorsement-profile-summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 22px; padding: 20px; border: 1px solid #98c8a1; border-radius: 18px; background: rgba(255, 255, 255, 0.9); }
.endorsement-profile-summary > div { display: grid; gap: 5px; }
.endorsement-profile-summary > .wechat-profile-heading { display: flex; }
.endorsement-profile-summary strong, .endorsement-profile-summary span { font-size: 20px; }
.endorsement-profile-summary span { color: var(--ink-soft); line-height: 1.5; }
.endorsement-error { min-height: 16px; margin: 10px 0 0; color: var(--danger); font-size: 20px; }
.rating-footer { margin-top: 26px; display: flex; justify-content: flex-end; gap: 10px; }
.secondary-button { background: var(--canvas); color: var(--ink); }
.secondary-button:hover:not(:disabled) { background: var(--surface); }
.submit-all { margin-top: 26px; }

.wechat-complete-page { min-height: 100vh; padding: 24px; display: grid; place-items: center; background: #f7f4ed; }
.wechat-complete-card { width: min(620px, 100%); padding: clamp(32px, 7vw, 64px); display: grid; gap: 20px; border: 1px solid var(--line-strong); border-radius: 16px; background: #fff; box-shadow: var(--shadow-soft); text-align: center; }
.wechat-complete-card > span { width: 64px; height: 64px; margin: 0 auto; display: grid; place-items: center; border-radius: 50%; background: #e7f5e9; color: #247038; font-size: 34px; font-weight: 850; }
.wechat-complete-card > span.is-error { background: #fde8e6; color: #b42318; }
.wechat-complete-card h1 { margin: 0; font-size: clamp(34px, 7vw, 54px); }
.wechat-complete-card p, .wechat-complete-card button { font-size: 20px; }
.wechat-complete-card p { margin: 0; color: var(--ink-soft); line-height: 1.6; }
.wechat-complete-card button { min-height: 54px; border: 0; border-radius: 8px; background: var(--ink); color: #fff; font-weight: 750; cursor: pointer; }
.wechat-complete-card .wechat-complete-fallback { font-size: 20px; color: var(--ink-muted); }

/* Private result dashboard, dialog, footer */
.dashboard-view { width: min(1120px, calc(100% - 48px)); }
.dashboard-topbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; }
.dashboard-topbar h1 { margin: 0; font-family: var(--display); font-size: clamp(48px, 6vw, 76px); font-weight: 650; letter-spacing: -0.055em; line-height: 1.06; }
.complete-card { padding: clamp(30px, 6vw, 60px); border: 1px solid var(--line); border-radius: 12px; background: var(--canvas); box-shadow: var(--shadow-soft); text-align: center; }
.success-mark { width: 64px; height: 64px; margin: 0 auto 22px; display: grid; place-items: center; border-radius: 50%; background: var(--sage); color: #2f7a4e; }
.success-mark svg { width: 28px; height: 28px; fill: currentColor; }
.complete-card h1 { font-size: clamp(48px, 7vw, 76px); }
.complete-summary { max-width: 760px; margin: 22px 0 34px; color: var(--ink-soft); font-size: 20px; line-height: 1.7; }
.private-code-card { margin-bottom: 16px; padding: clamp(25px, 4vw, 38px); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: center; border-radius: 12px; background: var(--ink); color: white; }
.private-code-card .section-kicker { color: #8dc5ff; }
.private-code-card h2 { margin: 0; font-size: clamp(24px, 3vw, 34px); letter-spacing: -0.035em; }
.private-code-card p:not(.section-kicker) { max-width: 590px; margin: 12px 0 0; color: rgba(255, 255, 255, 0.64); font-size: 20px; line-height: 1.7; }
.private-code-value { min-width: 330px; display: grid; gap: 11px; }
.private-code-value code { min-height: 68px; padding: 0 18px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.24); border-radius: 8px; background: rgba(255, 255, 255, 0.08); font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: 24px; font-weight: 800; letter-spacing: 0.12em; }
.private-code-value .primary-button { border-color: white; background: white; color: var(--ink); }
.private-code-value .primary-button:hover:not(:disabled) { border-color: #e5e5e5; background: #e5e5e5; }
.dashboard-grid { margin-bottom: 16px; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, 0.7fr); gap: 16px; align-items: stretch; }
.dashboard-panel { padding: clamp(24px, 3vw, 34px); border: 1px solid rgba(255, 255, 255, 0.9); border-radius: var(--radius-medium); background: var(--glass-strong); box-shadow: 0 18px 52px rgba(35, 47, 67, 0.07); }
.dashboard-panel-head, .codes-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.dashboard-panel h2, .codes-panel h2 { margin: 0; font-size: 22px; letter-spacing: -0.025em; }
.status-dot { padding: 6px 9px; border-radius: 999px; background: var(--sand); color: #6e5921; font-size: 20px; font-weight: 750; white-space: nowrap; }
.result-board { margin-top: 28px; }
.result-board + .result-board { padding-top: 26px; border-top: 1px solid var(--line); }
.result-board h3 { margin: 0 0 11px; color: var(--ink-soft); font-size: 20px; font-weight: 750; letter-spacing: 0.06em; }
.personal-results-list { display: grid; gap: 7px; }
.personal-result { min-height: 66px; padding: 13px 14px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.personal-result-copy { min-width: 0; display: grid; gap: 5px; }
.personal-result strong { font-size: 20px; }
.personal-result small { color: var(--ink-soft); font-size: 20px; line-height: 1.5; }
.endorsement-byline { display: flex; align-items: center; gap: 10px; color: var(--ink); font-size: 20px; font-weight: 750; }
.wechat-avatar.wechat-avatar-small { width: 42px; height: 42px; flex-basis: 42px; border-width: 1px; box-shadow: 0 0 0 1px var(--line); }
.personal-result-scores { display: flex; gap: 8px; }
.personal-score { min-width: 55px; padding: 7px 8px; display: grid; gap: 2px; border-left: 1px solid var(--line); text-align: right; }
.personal-score b { color: var(--accent); font-size: 20px; }
.personal-score span { color: var(--ink-soft); font-size: 20px; white-space: nowrap; }
.personal-results-empty { margin: 0; padding: 18px; border: 1px dashed var(--line); border-radius: 7px; color: var(--ink-soft); font-size: 20px; text-align: center; }
.aggregate-panel { background: var(--surface); }
.aggregate-empty { min-height: 330px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.aggregate-empty > span { font-size: 30px; }
.aggregate-empty h3 { margin: 22px 0 10px; font-size: 22px; letter-spacing: -0.025em; }
.aggregate-empty p { margin: 0; color: var(--ink-soft); font-size: 20px; line-height: 1.75; }
.aggregate-empty strong { margin-top: 24px; padding-top: 18px; width: 100%; border-top: 1px solid var(--line); font-size: 20px; }
.codes-panel { padding: clamp(24px, 3vw, 34px); border: 1px solid var(--line); border-radius: 12px; background: var(--surface); text-align: left; }
.codes-panel h2 { margin: 0; font-size: 20px; }
.codes-panel-heading > div { display: grid; gap: 7px; }
.code-status-summary { color: var(--ink-soft); font-size: 20px; font-weight: 700; }
.sharing-responsibility { margin-top: 24px; padding: 24px; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; border: 1px solid rgba(47, 111, 235, 0.24); border-radius: 10px; background: var(--accent-soft); }
.sharing-responsibility > span { font-size: 30px; line-height: 1; }
.sharing-responsibility strong { display: block; font-size: 20px; }
.sharing-responsibility p { margin: 7px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.7; }
.code-groups { margin-top: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.code-group { min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: 10px; background: var(--canvas); }
.founder-code-group { background: linear-gradient(145deg, var(--lavender-soft), var(--canvas) 48%); }
.company-code-group { background: linear-gradient(145deg, var(--lemon-soft), var(--canvas) 48%); }
.code-group > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.code-group > header > div { display: grid; gap: 5px; }
.code-group > header span { color: var(--accent); font-size: 20px; font-weight: 800; letter-spacing: 0.05em; }
.company-code-group > header span { color: #527d31; }
.code-group h3 { margin: 0; font-size: 22px; line-height: 1.4; }
.code-group header small { color: var(--ink-soft); font-size: 20px; font-weight: 700; }
.code-group .text-button { flex: 0 0 auto; }
.recipient-rules { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.recipient-rules > strong { font-size: 20px; }
.recipient-rules ul { margin: 10px 0 0; padding-left: 21px; color: var(--ink-soft); font-size: 20px; line-height: 1.7; }
.recipient-rules li + li { margin-top: 6px; }
.codes-grid { margin-top: 20px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.code-group .codes-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.code-item { min-width: 0; min-height: 72px; padding: 12px; display: grid; gap: 4px; place-items: center; border: 1px solid var(--line); border-radius: 7px; background: var(--canvas); font-family: ui-monospace, monospace; font-size: 20px; font-weight: 800; letter-spacing: 0.06em; text-align: center; cursor: pointer; }
.code-item small { color: var(--ink-soft); font-family: var(--sans); font-size: 20px; font-weight: 650; letter-spacing: 0; }
.code-item:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.code-item-used { text-decoration: line-through; cursor: default; opacity: 0.45; }
.codes-note { margin: 14px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.6; }
.site-footer { width: min(1240px, calc(100% - 48px)); margin: 0 auto; padding: 25px 0 34px; display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 20px; }
body:not(.landing-mode) .site-footer { display: none; }
.add-dialog { width: min(650px, calc(100% - 32px)); padding: 0; border: 0; background: transparent; }
.add-dialog::backdrop, .privacy-exit-dialog::backdrop, .submit-review-dialog::backdrop { background: rgba(0, 0, 0, 0.48); backdrop-filter: blur(4px); }
.dialog-card { position: relative; padding: 34px; border: 1px solid rgba(255, 255, 255, 0.92); border-radius: 26px; background: rgba(255, 255, 255, 0.94); box-shadow: var(--shadow-float); backdrop-filter: blur(18px); }
.dialog-card h2 { margin: 0 0 26px; font-size: 28px; }
.dialog-close { position: absolute; top: 15px; right: 15px; width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 6px; background: none; cursor: pointer; }
.dialog-close:hover { background: var(--surface); }
.dialog-close svg { width: 18px; height: 18px; }
.new-name-row { margin-top: 8px; display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.new-name-row input { height: 50px; padding: 0 12px; }
.match-result { margin-top: 18px; display: grid; gap: 8px; }
.match-result h3 { margin: 4px 0; font-size: 20px; }
.match-candidate, .create-candidate { min-height: 62px; padding: 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); text-align: left; cursor: pointer; }
.match-candidate span, .create-candidate span { display: grid; gap: 3px; }
.match-candidate small, .create-candidate small { color: var(--ink-soft); font-size: 20px; }
.mobile-action { display: none; }
.privacy-exit-dialog { width: min(680px, calc(100% - 32px)); padding: 0; border: 0; background: transparent; }
.privacy-exit-dialog.dialog-fallback-open { position: fixed; inset: 0; z-index: 1000; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 16px; display: grid; place-items: center; overflow: auto; background: rgba(0, 0, 0, 0.48); backdrop-filter: blur(4px); }
.privacy-exit-dialog.dialog-fallback-open .privacy-exit-card { width: min(680px, 100%); }
body.dialog-open { overflow: hidden; }
.privacy-exit-card { padding: clamp(28px, 5vw, 46px); border: 1px solid var(--line); border-radius: 16px; background: var(--canvas); box-shadow: 0 30px 90px rgba(0, 0, 0, 0.22); }
.privacy-exit-icon { width: 64px; height: 64px; margin-bottom: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--accent-soft); font-size: 34px; }
.privacy-exit-card h2 { margin: 0; font-size: clamp(34px, 5vw, 48px); letter-spacing: -0.045em; line-height: 1.12; }
.privacy-exit-card > p:not(.eyebrow):not(.form-error) { margin: 20px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.72; }
.privacy-exit-card ul { margin: 20px 0; padding: 18px 18px 18px 42px; border-radius: 10px; background: var(--mint-soft); color: var(--ink-soft); font-size: 20px; line-height: 1.7; }
.privacy-exit-card > div:last-child { display: flex; justify-content: flex-end; gap: 10px; }
.submit-review-dialog { width: min(720px, calc(100% - 32px)); padding: 0; border: 0; background: transparent; }
.submit-review-dialog.dialog-fallback-open { position: fixed; inset: 0; z-index: 1000; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 16px; display: grid; place-items: center; overflow: auto; background: rgba(0, 0, 0, 0.48); backdrop-filter: blur(4px); }
.submit-review-dialog.dialog-fallback-open .submit-review-card { width: min(720px, 100%); }
.submit-review-card { padding: clamp(28px, 5vw, 46px); border: 1px solid var(--line); border-radius: 16px; background: var(--canvas); box-shadow: 0 30px 90px rgba(0, 0, 0, 0.22); }
.submit-review-icon { width: 64px; height: 64px; margin-bottom: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--mint-soft); color: #20804e; font-size: 34px; font-weight: 850; }
.submit-review-card h2 { margin: 0; font-size: clamp(34px, 5vw, 48px); letter-spacing: -0.045em; line-height: 1.12; }
.submit-review-card > p:not(.eyebrow):not(.submit-review-warning) { margin: 20px 0 0; color: var(--ink-soft); font-size: 20px; line-height: 1.72; }
.submit-review-list { margin: 24px 0 0; padding: 0; display: grid; gap: 10px; list-style: none; }
.submit-review-list li { min-height: 64px; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); font-size: 20px; }
.submit-review-list li span { color: #20804e; font-weight: 760; white-space: nowrap; }
.submit-review-warning { margin: 16px 0 0; padding: 16px; border: 1px solid #edc266; border-radius: 10px; background: var(--lemon-soft); color: var(--ink-soft); font-size: 20px; line-height: 1.65; }
.submit-review-actions { margin-top: 26px; display: flex; justify-content: flex-end; gap: 10px; }
.toast { position: fixed; left: 50%; bottom: 24px; z-index: 250; max-width: calc(100% - 32px); padding: 11px 16px; transform: translate(-50%, 30px); border-radius: 7px; background: var(--ink); color: white; opacity: 0; pointer-events: none; font-size: 20px; transition: opacity 0.2s ease, transform 0.2s ease; }
.toast-visible { opacity: 1; transform: translate(-50%, 0); }

/* Ambient Product Stage — a quieter, more spatial visual system across the app */
body[data-view] { position: relative; isolation: isolate; background: linear-gradient(180deg, #fbfcff 0%, #fcfcf8 42%, #fffaf4 100%); }
body[data-view]::before { content: ""; position: fixed; z-index: -1; top: -20vh; left: 50%; width: min(1120px, 94vw); height: 720px; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle at 28% 42%, rgba(167, 202, 255, 0.34), transparent 34%), radial-gradient(circle at 70% 32%, rgba(255, 219, 132, 0.28), transparent 31%), radial-gradient(circle at 52% 74%, rgba(176, 229, 203, 0.22), transparent 34%); filter: blur(22px); opacity: 0.74; pointer-events: none; animation: ambient-rise 14s var(--ease-out) both; }
body[data-view="company-selection"]::before, body[data-view="company-rating"]::before { background: radial-gradient(circle at 25% 40%, rgba(255, 220, 121, 0.3), transparent 34%), radial-gradient(circle at 72% 34%, rgba(174, 215, 255, 0.3), transparent 32%), radial-gradient(circle at 52% 74%, rgba(176, 229, 203, 0.2), transparent 34%); }
body[data-view="institution-selection"]::before, body[data-view="institution-rating"]::before { background: radial-gradient(circle at 26% 40%, rgba(196, 180, 255, 0.3), transparent 34%), radial-gradient(circle at 74% 34%, rgba(177, 214, 255, 0.28), transparent 32%), radial-gradient(circle at 52% 74%, rgba(255, 213, 195, 0.18), transparent 34%); }
@keyframes ambient-rise { from { opacity: 0; transform: translate(-50%, 32px) scale(0.96); } to { opacity: 0.74; transform: translate(-50%, 0) scale(1); } }

.site-header { top: 14px; min-height: 66px; padding: 7px 9px 7px 12px; border-color: rgba(255, 255, 255, 0.72); background: rgba(255, 255, 255, 0.66); box-shadow: 0 12px 40px rgba(45, 59, 84, 0.07), inset 0 1px 0 rgba(255, 255, 255, 0.82); backdrop-filter: blur(26px) saturate(1.35); }
.wordmark-mark { border: 0; background: linear-gradient(145deg, #4b82ef, #245fd3); box-shadow: 3px 4px 0 rgba(255, 214, 90, 0.82), 0 9px 20px rgba(47, 111, 235, 0.2); }
.wordmark { min-height: 44px; }
.secondary-link { min-height: 44px; display: inline-flex; align-items: center; }
.site-nav a { position: relative; padding: 9px 0; transition: color 0.2s var(--ease-out); }
.site-nav a::after { content: ""; position: absolute; right: 0; bottom: 3px; left: 0; height: 2px; transform: scaleX(0); border-radius: 99px; background: var(--ink); transition: transform 0.24s var(--ease-out); }
.site-nav a:hover::after { transform: scaleX(1); }
.header-button, .primary-button { border-color: #15171a; background: #15171a; box-shadow: 0 8px 20px rgba(20, 23, 30, 0.13); }
.header-button:hover, .primary-button:hover:not(:disabled) { border-color: #2b2e33; background: #2b2e33; box-shadow: 0 13px 28px rgba(20, 23, 30, 0.18); }
.flow-status-meter { height: 4px; background: rgba(17, 24, 39, 0.08); }
.flow-status-meter i { background: linear-gradient(90deg, #2f6feb, #70a4ff); transition: width 0.42s var(--ease-out); }

.view { padding-top: 82px; }
.view-active { animation: reveal 0.46s var(--ease-out) both; }
@keyframes reveal { from { opacity: 0; transform: translateY(14px) scale(0.995); } to { opacity: 1; transform: translateY(0) scale(1); } }
.eyebrow, .section-kicker { letter-spacing: 0.12em; }
.page-back, .back-button { transition: color 0.2s ease, transform 0.2s var(--ease-out); }
.page-back:hover, .back-button:hover { transform: translateX(-3px); }

.landing-hero { padding-top: clamp(84px, 9vw, 124px); }
.landing-hero::before { background: rgba(255, 215, 116, 0.28); filter: blur(72px); }
.landing-hero::after { background: rgba(145, 187, 255, 0.28); filter: blur(78px); }
.hero-label { margin-bottom: 30px; border-color: rgba(255, 255, 255, 0.9); background: rgba(255, 255, 255, 0.68); box-shadow: 0 12px 34px rgba(50, 62, 83, 0.06); }
.landing-hero h1 { max-width: 1140px; font-weight: 620; letter-spacing: -0.065em; }
.hero-statement { max-width: 780px; color: rgba(0, 0, 0, 0.72); font-weight: 540; }
.hero-body { position: relative; overflow: hidden; margin-top: 64px; padding: clamp(18px, 2.3vw, 28px); gap: clamp(26px, 3vw, 42px); border-color: rgba(255, 255, 255, 0.82); background: linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(246, 249, 255, 0.64)); box-shadow: var(--shadow-stage); }
.hero-body::before { content: ""; position: absolute; top: 0; right: 18%; left: 18%; height: 1px; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.96), transparent); }
.hero-entry-column { position: relative; z-index: 1; }
.hero-illustration { border-color: rgba(255, 255, 255, 0.94); border-radius: 27px; box-shadow: 0 24px 66px rgba(37, 50, 73, 0.13); transform: rotate(0.45deg); transition: transform 0.5s var(--ease-out), box-shadow 0.5s var(--ease-out); }
.hero-body:hover .hero-illustration { transform: rotate(0deg) translateY(-3px); box-shadow: 0 30px 78px rgba(37, 50, 73, 0.16); }
.hero-illustration figcaption { background: rgba(255, 255, 255, 0.78); }
.hero-access { border-color: rgba(255, 255, 255, 0.86); border-radius: 24px; background: rgba(255, 255, 255, 0.76); box-shadow: var(--shadow-card); }
.hero-access-row input { height: 64px; border-color: rgba(23, 31, 45, 0.12); border-radius: 16px; background: rgba(250, 251, 253, 0.92); }
.hero-access-row input:focus { box-shadow: 0 0 0 5px rgba(47, 111, 235, 0.1), 0 12px 30px rgba(40, 61, 98, 0.08); }
.hero-access-row .primary-button { min-height: 60px; border-radius: 16px; }
.hero-facts { margin-top: 54px; border-color: rgba(0, 0, 0, 0.08); }
.rating-spectrum { border-color: rgba(255, 255, 255, 0.88); border-radius: 28px; background: linear-gradient(120deg, rgba(255, 255, 255, 0.78), rgba(238, 247, 255, 0.8) 50%, rgba(255, 245, 205, 0.78)); box-shadow: var(--shadow-card); }
.spectrum-track i { border-radius: 999px; }
.landing-section { border-top-color: rgba(0, 0, 0, 0.07); }
.section-heading { margin-bottom: 64px; }
.board-cards { gap: 22px; }
.board-card { overflow: hidden; border-color: rgba(255, 255, 255, 0.86); border-radius: 32px; box-shadow: var(--shadow-card); }
.board-card:hover { transform: translateY(-7px); box-shadow: var(--shadow-stage); }
.eligibility-block, .ethos-notes article, .method-card, .invite-steps li { border-color: rgba(255, 255, 255, 0.8); background-color: rgba(255, 255, 255, 0.68); box-shadow: var(--shadow-card); }
.ethos-notes article, .method-card { border-radius: 26px; }
.landing-cta { overflow: hidden; border-radius: 34px; background: linear-gradient(145deg, #13161c, #252c37); box-shadow: 0 34px 90px rgba(25, 30, 41, 0.2); }

.entry-view { padding-top: 54px; }
.entry-hero h1, .task-hub-hero h1, .compact-hero h1, .rating-intro h1, .dashboard-topbar h1 { font-weight: 620; letter-spacing: -0.065em; }
.rule-stamp { border-color: rgba(255, 255, 255, 0.86); border-radius: 18px; background: rgba(255, 255, 255, 0.58); box-shadow: var(--shadow-card); backdrop-filter: blur(18px); }
.entry-card { position: relative; overflow: hidden; padding: clamp(30px, 3.4vw, 42px); border-color: rgba(255, 255, 255, 0.86); border-radius: var(--radius-large); background: var(--surface-translucent); box-shadow: var(--shadow-stage); backdrop-filter: blur(24px) saturate(1.2); }
.entry-card::before { content: ""; position: absolute; top: -120px; right: -80px; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgba(171, 201, 255, 0.25), transparent 68%); pointer-events: none; }
.entry-field input, .endorsement-field input, .endorsement-field select, .endorsement-field textarea, .new-name-row input { border-color: rgba(28, 35, 48, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.82); transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; }
.entry-field input:focus, .endorsement-field input:focus, .endorsement-field select:focus, .endorsement-field textarea:focus, .new-name-row input:focus { border-color: var(--accent); background: white; box-shadow: 0 0 0 5px rgba(47, 111, 235, 0.1); outline: 0; }
.identity-options { gap: 14px; }
.identity-option { overflow: hidden; min-height: 180px; padding: 20px; border-color: rgba(255, 255, 255, 0.82); border-radius: 22px; background: rgba(255, 255, 255, 0.65); box-shadow: 0 10px 30px rgba(43, 57, 82, 0.05); }
.identity-option::before { content: ""; position: absolute; right: -26px; bottom: -38px; width: 110px; height: 110px; border-radius: 50%; background: rgba(47, 111, 235, 0.07); transition: transform 0.35s var(--ease-out); }
.identity-option:hover::before { transform: scale(1.35); }
.identity-option:has(input:checked) { border-color: #191c22; background: linear-gradient(145deg, #171a20, #282e38); box-shadow: 0 22px 48px rgba(24, 30, 41, 0.2); transform: translateY(-3px); }
.identity-option:has(input:checked)::after { content: "✓"; position: absolute; right: 16px; bottom: 16px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: white; color: #171a20; font-size: 20px; font-weight: 850; }
.board-option { border-color: rgba(255, 255, 255, 0.82); border-radius: 18px; background: rgba(255, 255, 255, 0.62); }
.board-option:has(input:checked) { border-color: rgba(47, 111, 235, 0.42); background: rgba(235, 243, 255, 0.86); box-shadow: var(--shadow-card); }

.task-hub-hero { align-items: center; }
.task-identity-card { min-height: 190px; border-color: rgba(255, 255, 255, 0.86); border-radius: 26px; background: linear-gradient(145deg, rgba(255, 248, 214, 0.92), rgba(255, 255, 255, 0.72)); box-shadow: var(--shadow-card); }
.task-grid { gap: 22px; }
.task-card { isolation: isolate; min-height: 294px; padding: 30px; border-color: rgba(255, 255, 255, 0.88); border-radius: 30px; box-shadow: var(--shadow-card); transition: transform 0.32s var(--ease-out), box-shadow 0.32s var(--ease-out), border-color 0.2s ease, opacity 0.2s ease; }
.task-card::before { content: ""; position: absolute; z-index: -1; top: -56px; right: -46px; width: 190px; height: 190px; border-radius: 50%; background: rgba(255, 255, 255, 0.48); box-shadow: 0 0 80px rgba(255, 255, 255, 0.34); transition: transform 0.5s var(--ease-out); }
.task-card:hover:not(:disabled) { transform: translateY(-7px) scale(1.005); box-shadow: var(--shadow-stage); }
.task-card:hover:not(:disabled)::before { transform: scale(1.16) translate(-8px, 8px); }
.task-number { width: 54px; height: 54px; border-color: rgba(255, 255, 255, 0.84); border-radius: 16px; background: rgba(255, 255, 255, 0.7); box-shadow: 0 8px 22px rgba(40, 52, 73, 0.06); }
.task-privacy { border-color: rgba(255, 255, 255, 0.9); background: rgba(255, 255, 255, 0.68); }
.task-card > b { border-top-color: rgba(0, 0, 0, 0.08); }
.task-privacy-note, .task-hub-footer { border-color: rgba(255, 255, 255, 0.84); border-radius: 24px; background: rgba(255, 255, 255, 0.66); box-shadow: var(--shadow-card); backdrop-filter: blur(20px); }

.compact-hero { margin-bottom: 52px; }
.selection-layout { gap: 24px; }
.pool-panel, .selection-summary { border-color: rgba(255, 255, 255, 0.84); border-radius: 30px; background: var(--surface-translucent); box-shadow: var(--shadow-stage); backdrop-filter: blur(24px) saturate(1.18); }
.selection-summary { top: 102px; background: rgba(246, 248, 251, 0.76); }
.company-discovery-filters { border-color: rgba(255, 255, 255, 0.84); border-radius: 22px; background: rgba(244, 247, 251, 0.68); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88); }
.filter-selects select { border-color: rgba(22, 30, 44, 0.1); border-radius: 13px; background: rgba(255, 255, 255, 0.86); }
.search-box { min-height: 70px; border-color: rgba(25, 33, 47, 0.12); border-radius: 18px; background: rgba(255, 255, 255, 0.84); box-shadow: 0 10px 30px rgba(40, 55, 81, 0.05); }
.company-name-search { position: relative; margin-top: 18px; border-color: rgba(47, 111, 235, 0.2); background: rgba(255, 255, 255, 0.94); box-shadow: 0 16px 38px rgba(47, 79, 133, 0.08); }
.search-box:focus-within { border-color: rgba(47, 111, 235, 0.56); background: white; box-shadow: 0 0 0 5px rgba(47, 111, 235, 0.1), 0 18px 42px rgba(47, 79, 133, 0.1); }
.pool-status { width: fit-content; min-height: 44px; padding: 7px 12px; display: inline-flex; align-items: center; border: 1px solid rgba(255, 255, 255, 0.88); border-radius: 999px; background: rgba(255, 255, 255, 0.62); }
.filter-reset { min-height: 44px; }
.filter-button { border-color: rgba(22, 30, 44, 0.1); background: rgba(255, 255, 255, 0.74); transition: transform 0.18s var(--ease-out), color 0.18s ease, background 0.18s ease; }
.filter-button:hover { transform: translateY(-2px); }
.filter-button[aria-pressed="true"] { border-color: #181b20; background: #181b20; }
.entity-grid { gap: 14px; }
.entity-option { min-height: 158px; padding: 20px; border-color: rgba(255, 255, 255, 0.88); border-radius: 22px; background: rgba(255, 255, 255, 0.7); box-shadow: 0 8px 24px rgba(42, 55, 78, 0.045); transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out), border-color 0.18s ease, background 0.18s ease; }
.entity-option:hover { border-color: rgba(255, 255, 255, 0.98); box-shadow: var(--shadow-card); transform: translateY(-4px); }
.entity-option[aria-pressed="true"] { border-color: rgba(47, 111, 235, 0.34); background: linear-gradient(145deg, rgba(232, 241, 255, 0.96), rgba(255, 255, 255, 0.9)); box-shadow: 0 18px 44px rgba(47, 83, 143, 0.12); }
.tag-row > span { padding: 5px 8px; border-radius: 999px; background: rgba(35, 46, 63, 0.055); }
.selected-list li, .confirmation-row { border-color: rgba(255, 255, 255, 0.9); border-radius: 14px; background: rgba(255, 255, 255, 0.78); }
.inline-add, .load-more { border-radius: 15px; background: rgba(255, 255, 255, 0.62); }

.step-header { top: 96px; border-color: rgba(255, 255, 255, 0.8); border-radius: 999px; background: rgba(255, 255, 255, 0.7); box-shadow: 0 12px 34px rgba(40, 54, 79, 0.07); backdrop-filter: blur(24px) saturate(1.2); }
.rating-list { gap: 22px; }
.score-card { position: relative; overflow: hidden; border-color: rgba(255, 255, 255, 0.86); border-radius: 30px; background: var(--surface-translucent); box-shadow: var(--shadow-card); backdrop-filter: blur(22px); }
.score-card::after { content: ""; position: absolute; top: -80px; right: -80px; width: 190px; height: 190px; border-radius: 50%; background: radial-gradient(circle, rgba(167, 202, 255, 0.24), transparent 68%); pointer-events: none; }
.score-card > header { position: relative; z-index: 1; border-bottom-color: rgba(0, 0, 0, 0.08); }
.score-scale { gap: 8px; }
.score-button { border-color: rgba(20, 28, 42, 0.1); border-radius: 14px; background: rgba(255, 255, 255, 0.78); transition: transform 0.18s var(--ease-out), box-shadow 0.18s var(--ease-out), border-color 0.18s ease, background 0.18s ease; }
.score-button:hover { transform: translateY(-3px); box-shadow: 0 10px 22px rgba(40, 54, 79, 0.09); }
.score-button[aria-pressed="true"] { border-color: #171a20; background: #171a20; color: white; box-shadow: 0 12px 26px rgba(23, 26, 32, 0.2); transform: translateY(-2px); }
.endorsement-panel, .endorsement-form-card { border-color: rgba(255, 255, 255, 0.86); border-radius: 22px; background: rgba(255, 255, 255, 0.7); }
.endorsement-identity-gate { border-color: rgba(255, 255, 255, 0.86); border-radius: 32px; background: linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(243, 239, 255, 0.76)); box-shadow: var(--shadow-stage); backdrop-filter: blur(24px); }
.endorsement-profile-card { border-color: rgba(255, 255, 255, 0.92); border-radius: 24px; background: rgba(255, 255, 255, 0.78); box-shadow: var(--shadow-card); }
.endorsement-profile-summary { border-color: rgba(97, 176, 117, 0.36); border-radius: 24px; background: rgba(255, 255, 255, 0.78); box-shadow: var(--shadow-card); }
.wechat-verification { border-color: rgba(121, 93, 186, 0.18); border-radius: 24px; background: linear-gradient(145deg, rgba(248, 246, 255, 0.9), rgba(238, 245, 255, 0.86)); }
.wechat-avatar { box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.92), 0 12px 30px rgba(31, 38, 54, 0.14); }
.praise-tag { border-color: rgba(25, 33, 47, 0.1); background: rgba(255, 255, 255, 0.74); }
.praise-tag[aria-pressed="true"] { border-color: rgba(181, 123, 18, 0.25); background: linear-gradient(145deg, #fff4c8, #fffaf0); box-shadow: 0 8px 20px rgba(145, 102, 18, 0.09); }

.wechat-complete-page { background: radial-gradient(circle at 50% 12%, rgba(167, 202, 255, 0.34), transparent 38rem), linear-gradient(180deg, #fbfcff, #faf7f0); }
.wechat-complete-card { border-color: rgba(255, 255, 255, 0.9); border-radius: 32px; background: rgba(255, 255, 255, 0.84); box-shadow: var(--shadow-stage); backdrop-filter: blur(22px); }
.wechat-complete-card button { border-radius: 15px; }
.private-code-card { overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 30px; background: radial-gradient(circle at 90% 20%, rgba(89, 135, 230, 0.32), transparent 32%), linear-gradient(145deg, #12151b, #252c38); box-shadow: 0 32px 84px rgba(25, 31, 43, 0.22); }
.dashboard-topbar .back-button { padding: 8px 15px; border: 1px solid rgba(25, 33, 47, 0.1); border-radius: 999px; background: rgba(255, 255, 255, 0.66); box-shadow: 0 8px 24px rgba(42, 55, 78, 0.05); }
.private-code-value code { border-color: rgba(255, 255, 255, 0.16); border-radius: 16px; background: rgba(255, 255, 255, 0.09); }
.dashboard-grid { gap: 22px; }
.dashboard-panel, .codes-panel { border-color: rgba(255, 255, 255, 0.86); border-radius: 30px; background: var(--surface-translucent); box-shadow: var(--shadow-card); backdrop-filter: blur(22px); }
.aggregate-panel { background: linear-gradient(145deg, rgba(247, 247, 244, 0.8), rgba(238, 244, 255, 0.72)); }
.personal-result, .code-group, .sharing-responsibility { border-color: rgba(255, 255, 255, 0.9); border-radius: 18px; background-color: rgba(255, 255, 255, 0.7); box-shadow: 0 9px 26px rgba(42, 55, 78, 0.045); }
.code-item { border-color: rgba(26, 33, 46, 0.1); border-radius: 14px; background: rgba(255, 255, 255, 0.82); transition: transform 0.18s var(--ease-out), box-shadow 0.18s var(--ease-out), border-color 0.18s ease; }
.code-item:hover:not(:disabled) { box-shadow: 0 12px 26px rgba(47, 75, 122, 0.1); transform: translateY(-3px); }

.add-dialog::backdrop, .privacy-exit-dialog::backdrop, .submit-review-dialog::backdrop { background: rgba(20, 24, 31, 0.38); backdrop-filter: blur(14px) saturate(0.9); }
.dialog-card { border-radius: var(--radius-large); background: rgba(255, 255, 255, 0.9); box-shadow: var(--shadow-stage); backdrop-filter: blur(28px) saturate(1.2); }
.dialog-close { width: 44px; height: 44px; border-radius: 12px; }
.privacy-exit-card, .submit-review-card { border-color: rgba(255, 255, 255, 0.9); border-radius: var(--radius-large); background: rgba(255, 255, 255, 0.92); box-shadow: var(--shadow-stage); backdrop-filter: blur(28px); }
.submit-review-list li, .submit-review-warning, .privacy-exit-card ul { border-radius: 16px; }
.toast { padding: 13px 20px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 999px; background: rgba(19, 22, 28, 0.94); box-shadow: 0 18px 48px rgba(14, 18, 25, 0.22); backdrop-filter: blur(16px); transition: opacity 0.28s ease, transform 0.36s var(--ease-out); }

@media (max-width: 1080px) {
  .site-nav { display: none; }
  .entry-view { grid-template-columns: minmax(270px, 0.68fr) minmax(520px, 1.32fr); column-gap: 30px; }
  .entry-hero h1 { font-size: 52px; }
  .selection-layout { grid-template-columns: minmax(0, 1fr) 340px; }
  .entity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .privacy-visual { padding: 34px; }
  .ethos-notes article { grid-template-columns: 130px minmax(0, 1fr); gap: 10px 18px; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .aggregate-empty { min-height: 250px; }
  .codes-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .code-groups { grid-template-columns: 1fr; }
  .code-group .codes-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .site-header { min-height: 68px; padding: 8px 14px; }
  .privacy-pill { display: none; }
  .header-actions { margin-left: auto; }
  .entry-view { grid-template-columns: 1fr; }
  .entry-hero { position: static; margin-bottom: 30px; }
  .entry-card { max-width: 680px; }
  .task-hub-hero { grid-template-columns: 1fr; gap: 26px; }
  .task-identity-card { min-height: 0; }
  .task-grid { grid-template-columns: 1fr; }
  .landing-hero { min-height: auto; padding: 70px 0 64px; }
  .landing-hero h1 { font-size: clamp(58px, 11vw, 82px); }
  .hero-body { grid-template-columns: 1fr; }
  .hero-entry-column { width: 100%; }
  .hero-illustration img { min-height: 320px; }
  .rating-spectrum { margin-top: 48px; }
  .board-cards, .invite-section, .privacy-section, .ethos-section { grid-template-columns: 1fr; }
  .method-grid { grid-template-columns: 1fr; }
  .method-card-wide, .invite-principles { grid-column: 1; }
  .method-card { min-height: 0; }
  .method-card-wide ul { grid-template-columns: 1fr; }
  .invite-intro { position: static; }
  .ethos-heading { position: static; }
  .privacy-visual { max-width: 560px; width: 100%; }
  .selection-layout { grid-template-columns: 1fr; }
  .selection-summary { position: static; }
  .selection-summary .wide-button { display: none; }
  .mobile-action { position: fixed; left: 0; right: 0; bottom: 0; z-index: 120; min-height: 74px; padding: 10px max(16px, env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom)); align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); background: rgba(255, 255, 255, 0.96); backdrop-filter: blur(12px); }
  .mobile-action:not([hidden]) { display: flex; }
  .mobile-action > div { display: grid; }
  .mobile-action strong { font-size: 22px; }
  .mobile-action span { color: var(--ink-soft); font-size: 20px; }
  .mobile-action .primary-button { min-height: 46px; }
}

@media (max-width: 620px) {
  .view, .narrow-view { width: min(100% - 28px, 1240px); padding: 40px 0 92px; }
  .landing-view { padding-top: 0; }
  .site-header { top: 8px; width: calc(100% - 20px); margin-top: 8px; gap: 12px; padding-inline: 12px; border-radius: 18px; }
  .header-button { min-height: 50px; padding: 0 16px; font-size: 20px; }
  .flow-status { width: min(42vw, 150px); gap: 5px; }
  .flow-status > span { font-size: 20px; }
  .wordmark { gap: 9px; }
  .wordmark-mark { width: 42px; height: 42px; }
  .wordmark strong { font-size: 20px; }
  .landing-hero { padding: 54px 0 56px; }
  .hero-label { max-width: 100%; margin-bottom: 18px; font-size: 20px; letter-spacing: 0; }
  .landing-hero h1 { font-size: clamp(46px, 14vw, 62px); letter-spacing: -0.075em; }
  .landing-hero h1 span { margin-top: 7px; font-size: 0.75em; }
  .hero-statement { margin-top: 24px; font-size: 22px; }
  .hero-body { margin-top: 34px; padding: 12px; gap: 14px; border-radius: 24px; }
  .hero-entry-column { padding: 8px; }
  .landing-lead { margin-top: 0; font-size: 20px; line-height: 1.65; }
  .hero-access { margin-top: 24px; padding: 18px; box-shadow: 0 12px 30px rgba(35, 47, 67, 0.07); }
  .hero-access-row { grid-template-columns: 1fr; }
  .hero-access-row input { height: 54px; font-size: 20px; }
  .hero-access-row .primary-button { min-height: 52px; width: 100%; }
  .credential-legend { grid-template-columns: 1fr; gap: 10px; }
  .hero-illustration { border-radius: 18px; box-shadow: 0 14px 34px rgba(31, 41, 58, 0.1); }
  .hero-illustration img { min-height: 230px; aspect-ratio: 1.48; }
  .hero-actions { width: 100%; align-items: stretch; flex-direction: column; gap: 14px; }
  .hero-button { width: 100%; }
  .secondary-link { align-self: center; }
  .hero-facts { margin-top: 34px; grid-template-columns: 1fr; }
  .hero-facts li { padding: 18px 0; grid-template-columns: 38px 1fr; }
  .hero-facts li + li { border-top: 1px solid var(--line); border-left: 0; }
  .rating-spectrum { margin-top: 40px; padding: 22px 16px 20px; }
  .spectrum-scale { grid-template-columns: 64px 1fr 64px; gap: 8px; }
  .spectrum-track { gap: 2px; }
  .spectrum-track i { height: 28px; }
  .spectrum-low, .spectrum-high { font-size: 20px; }
  .spectrum-bottom { align-items: flex-start; }
  .landing-section { padding: 78px 0; }
  .section-heading { margin-bottom: 38px; }
  .section-heading h2, .invite-intro h2, .privacy-section h2, .ethos-heading h2, .landing-cta h2 { font-size: 39px; }
  .section-heading > p:last-child, .invite-intro > p, .privacy-section > div:last-child > p { font-size: 20px; }
  .board-card { min-height: 0; padding: 26px 22px; }
  .board-card-top { grid-template-columns: 1fr; gap: 12px; }
  .board-index { padding-top: 0; }
  .eligibility-block { min-height: 0; }
  .board-card h3 { margin-top: 38px; font-size: 34px; }
  .board-question { min-height: 0; font-size: 20px; }
  .ethos-section { gap: 34px; }
  .ethos-lead { margin-bottom: 30px; font-size: 21px; }
  .ethos-notes article { grid-template-columns: 1fr; gap: 8px; }
  .ethos-notes article p { grid-column: 1; }
  .method-card, .method-card-wide { padding: 24px 20px; }
  .method-card-wide h3 { margin-top: 34px; font-size: 30px; }
  .method-card h3 { font-size: 21px; }
  .composite-note { grid-template-columns: 1fr; gap: 12px; padding: 22px 20px; }
  .invite-section { gap: 42px; }
  .invite-steps li { grid-template-columns: 36px 1fr; gap: 14px; }
  .invite-principles { margin-top: -16px; }
  .privacy-section { gap: 42px; }
  .privacy-visual { min-height: 300px; padding: 24px 14px; grid-template-columns: 1fr 24px 1fr; }
  .privacy-visual span { font-size: 20px; }
  .landing-cta { margin-top: 36px; padding: 54px 18px; }
  .site-footer { width: calc(100% - 28px); flex-direction: column; gap: 8px; }
  .page-back { margin-bottom: 30px; }
  .entry-hero { grid-template-columns: 1fr; margin-bottom: 24px; }
  .entry-hero h1, .compact-hero h1, .rating-intro h1 { font-size: 42px; }
  .rule-stamp { display: none; }
  .entry-card { margin-top: 0; padding: 22px 18px; box-shadow: none; }
  .entry-field { grid-template-columns: 1fr; }
  .entry-field p { grid-column: 1; }
  .verified-code-row { grid-template-columns: 1fr; }
  .verified-invite-status { justify-self: start; }
  .verified-invite-status { padding-inline: 9px; }
  .identity-options, .board-options { grid-template-columns: 1fr; }
  .identity-option { min-height: 124px; grid-template-columns: 42px 1fr; align-items: center; align-content: center; column-gap: 12px; }
  .identity-index { grid-row: 1 / 3; justify-self: start; }
  .identity-option strong { font-size: 20px; }
  .task-hub-view { width: min(100% - 28px, 1120px); }
  .task-hub-hero h1 { font-size: 42px; }
  .task-grid { margin-top: 34px; }
  .task-card { min-height: 240px; padding: 22px 18px; }
  .task-privacy { padding: 5px 9px; }
  .task-card > strong { font-size: 28px; }
  .task-privacy-note { grid-template-columns: 1fr; padding: 20px 18px; }
  .task-hub-footer { align-items: stretch; flex-direction: column; padding: 20px 18px; }
  .task-hub-footer .primary-button { width: 100%; }
  .submit-review-list li { align-items: flex-start; flex-direction: column; gap: 4px; }
  .submit-review-actions { align-items: stretch; flex-direction: column-reverse; }
  .submit-review-actions button { width: 100%; }
  .compact-hero { align-items: flex-start; flex-direction: column; margin-bottom: 30px; }
  .pool-panel { padding: 17px; }
  .filter-heading { align-items: flex-start; flex-direction: column; gap: 3px; }
  .filter-heading > div { width: 100%; justify-content: space-between; }
  .filter-selects { grid-template-columns: 1fr; }
  .filter-selects label { grid-template-columns: 1fr; align-items: stretch; }
  .entity-grid, .company-grid { grid-template-columns: 1fr; }
  .entity-option { min-height: 68px; }
  .step-header { top: 76px; margin: -12px 0 34px; padding: 12px 0; }
  .score-card { padding: 22px 16px; box-shadow: none; }
  .score-card > header { grid-template-columns: 34px 1fr; }
  .score-card header p { grid-column: 2; }
  .score-scale { grid-template-columns: repeat(6, 1fr); gap: 6px; }
  .score-button { height: 46px; aspect-ratio: auto; font-size: 20px; }
  .endorsement-toggle { grid-template-columns: auto 1fr; }
  .endorsement-toggle b { display: none; }
  .endorsement-panel { padding: 16px; }
  .endorsement-grid { grid-template-columns: 1fr; }
  .endorsement-field-wide { grid-column: 1; }
  .endorsement-target-list { grid-template-columns: 1fr; }
  .endorsement-form-head { align-items: flex-start; flex-direction: column; }
  .endorsement-cancel { width: 100%; }
  .wechat-verification { align-items: stretch; flex-direction: column; }
  .wechat-profile-heading { align-items: flex-start; }
  .endorsement-identity-gate { padding: 22px 18px; }
  .endorsement-profile-card { padding: 18px 14px; }
  .endorsement-profile-actions, .endorsement-profile-summary { align-items: stretch; flex-direction: column; }
  .endorsement-profile-actions button, .endorsement-profile-summary button { width: 100%; }
  .rating-footer { flex-direction: column-reverse; }
  .rating-footer > * { width: 100%; }
  .dashboard-view { width: min(100% - 28px, 1120px); }
  .dashboard-topbar { align-items: flex-start; flex-direction: column; }
  .dashboard-topbar h1 { font-size: 46px; }
  .private-code-card { grid-template-columns: 1fr; gap: 24px; }
  .private-code-value { min-width: 0; width: 100%; }
  .private-code-value code { font-size: clamp(20px, 6vw, 23px); }
  .dashboard-panel-head, .codes-panel-heading { align-items: flex-start; flex-direction: column; }
  .sharing-responsibility { grid-template-columns: 1fr; }
  .code-group { padding: 20px 16px; }
  .code-group > header { flex-direction: column; }
  .code-group .text-button { width: 100%; justify-content: flex-start; }
  .personal-result { grid-template-columns: 1fr; }
  .personal-result-scores { justify-content: flex-start; }
  .personal-score { border-left: 0; border-right: 1px solid var(--line); text-align: left; }
  .codes-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .code-group .codes-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .code-item { min-height: 76px; padding: 10px 6px; }
  .code-action-hint { display: none; }
  .dialog-card { padding: 28px 18px; }
  .privacy-exit-card { padding: 28px 18px; }
  .privacy-exit-card > div:last-child { align-items: stretch; flex-direction: column-reverse; }
  .privacy-exit-card button { width: 100%; }
  .new-name-row { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  body[data-view]::before { top: -12vh; width: 150vw; height: 560px; filter: blur(28px); opacity: 0.56; }
  .site-header { border-color: rgba(255, 255, 255, 0.72); background: rgba(255, 255, 255, 0.74); box-shadow: 0 10px 30px rgba(42, 55, 78, 0.07); backdrop-filter: blur(24px) saturate(1.25); }
  .view, .narrow-view { padding-top: 48px; }
  .landing-hero { padding-top: 64px; }
  .hero-body { padding: 11px; border-radius: 26px; box-shadow: 0 26px 72px rgba(43, 57, 82, 0.11); }
  .hero-illustration { border-radius: 21px; transform: none; }
  .hero-body:hover .hero-illustration { transform: none; }
  .hero-access { border-radius: 21px; box-shadow: 0 14px 36px rgba(42, 55, 78, 0.07); }
  .hero-access-row input, .hero-access-row .primary-button { border-radius: 14px; }
  .rating-spectrum, .board-card, .ethos-notes article, .method-card, .landing-cta { border-radius: 24px; }
  .entry-card { padding: 24px 18px; border-radius: 26px; box-shadow: 0 24px 64px rgba(43, 57, 82, 0.1); }
  .identity-option { border-radius: 20px; box-shadow: 0 10px 28px rgba(43, 57, 82, 0.055); }
  .task-card { min-height: 248px; border-radius: 25px; box-shadow: 0 16px 40px rgba(43, 57, 82, 0.075); }
  .task-card:hover:not(:disabled) { transform: none; box-shadow: 0 16px 40px rgba(43, 57, 82, 0.075); }
  .task-privacy-note, .task-hub-footer { border-radius: 21px; }
  .pool-panel, .selection-summary { border-radius: 25px; box-shadow: 0 22px 58px rgba(43, 57, 82, 0.085); }
  .company-discovery-filters { border-radius: 19px; }
  .search-box { min-height: 64px; border-radius: 16px; }
  .entity-option { min-height: 116px; border-radius: 19px; box-shadow: 0 8px 24px rgba(42, 55, 78, 0.045); }
  .step-header { top: 78px; padding-inline: 14px; border-radius: 20px; }
  .score-card { padding: 24px 17px; border-radius: 25px; box-shadow: 0 18px 46px rgba(43, 57, 82, 0.075); }
  .score-button { min-height: 48px; border-radius: 12px; }
  .endorsement-identity-gate, .wechat-complete-card, .dashboard-panel, .codes-panel, .private-code-card, .dialog-card, .privacy-exit-card, .submit-review-card { border-radius: 25px; }
  .endorsement-profile-card, .endorsement-profile-summary, .wechat-verification { border-radius: 20px; }
  .mobile-action { border-top-color: rgba(255, 255, 255, 0.76); background: rgba(255, 255, 255, 0.82); box-shadow: 0 -12px 36px rgba(42, 55, 78, 0.08); backdrop-filter: blur(24px) saturate(1.25); }
  .toast { bottom: calc(18px + env(safe-area-inset-bottom)); width: max-content; max-width: calc(100% - 28px); text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}