/* Критические стили: загружаются до основного бандла и работают без JS */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('/fonts/manrope-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('/fonts/manrope-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/cormorant-garamond-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/cormorant-garamond-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --bg: #f0f0f2;
  --fg: #1e1f24;
  --panel-bg: #ffffff;
  --input-bg: #f6f6f8;
  --border: #d0d0d6;
  --muted: #6a6d75;
  --accent: #3d6fe0;
  --panel-trans: rgba(255, 255, 255, 0.72);
  --nav-bg: #f0f0f2;
  --nav-fg: #1e1f24;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #1e1f24;
    --fg: #e8e8ea;
    --panel-bg: #2a2c33;
    --panel-trans: rgba(42, 44, 51, 0.72);
    --input-bg: #1e1f24;
    --border: #444;
    --muted: #9aa;
    --nav-bg: #2a2c33;
    --nav-fg: #e8e8ea;
  }
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: system-ui, sans-serif;
  background: var(--bg);
  color: var(--fg);
}
.hidden { display: none !important; }
.panel {
  max-width: 420px;
  margin: 60px auto;
  padding: 24px;
  background: var(--panel-bg);
  border-radius: 10px;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.row { display: flex; gap: 10px; align-items: center; }
input, textarea, select, button {
  padding: 10px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--input-bg);
  color: var(--fg);
  font-size: 14px;
}
button { cursor: pointer; background: var(--accent); border: none; color: #fff; }
button:disabled { background: #888; cursor: default; }
button.danger { background: #c0392b; }
.error { color: #ff6b6b; }
.hint { color: var(--muted); font-size: 12px; }
.role-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.check { font-size: 13px; color: var(--muted); display: flex; gap: 6px; align-items: center; }
.check input { width: auto; }

/* Серверная версия публичной персоны: видна до загрузки SPA и без JavaScript */
.person-seo {
  min-height: 100vh;
  background:
    radial-gradient(600px 420px at 90% 0%, rgba(210,178,115,.09), transparent 65%),
    #0A1322;
  color: #EDF2FA;
  font-family: 'Manrope', system-ui, sans-serif;
}
.person-seo-wrap { max-width: 920px; margin: 0 auto; padding: 56px 28px; }
.person-seo-head { display: flex; align-items: center; gap: 32px; margin-bottom: 36px; }
.person-seo-photo {
  width: 180px; height: 180px; flex: none; object-fit: cover;
  border: 4px solid #D2B273; border-radius: 50%; background: #152036;
}
.person-seo-brand { color: #D2B273; font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.person-seo h1 { margin: 10px 0; font-family: 'Cormorant Garamond', Georgia, serif; font-size: 44px; line-height: 1.1; }
.person-seo-role { margin: 0 0 7px; color: #D2B273; font-size: 14px; font-weight: 700; }
.person-seo-dates { margin: 0; color: #8FA0BC; font-size: 14px; }
.person-seo-section {
  margin-top: 20px; padding: 28px 30px; border: 1px solid #33415E; border-radius: 18px;
  background: rgba(21,32,54,.82);
}
.person-seo-section h2 { margin: 0 0 16px; font-size: 19px; }
.person-seo-section p { margin: 0; color: #C8D2E4; font-size: 14px; line-height: 1.75; }
.person-seo-events { list-style: none; margin: 0; padding: 0; }
.person-seo-events li { display: flex; gap: 20px; padding: 13px 0; border-bottom: 1px solid rgba(51,65,94,.65); }
.person-seo-events li:last-child { border-bottom: 0; padding-bottom: 0; }
.person-seo-events time, .person-seo-event-date { min-width: 120px; color: #D2B273; font-size: 13px; font-weight: 800; }
.person-seo-events li > span:last-child { color: #C8D2E4; font-size: 14px; line-height: 1.55; }
.person-seo-footer { margin: 30px 0 0; font-size: 13px; }
.person-seo-footer a { color: #8FC2F5; }
@media (max-width: 640px) {
  .person-seo-wrap { padding: 36px 18px; }
  .person-seo-head { align-items: flex-start; flex-direction: column; gap: 22px; }
  .person-seo-photo { width: 132px; height: 132px; }
  .person-seo h1 { font-size: 36px; }
  .person-seo-section { padding: 22px 20px; }
  .person-seo-events li { flex-direction: column; gap: 5px; }
}
