:root {
  color-scheme: light;
  --bg: #ffffff; --text: #171717; --muted: #737373; --line: #dedede;
  --accent: #171717; --surface: #f4f4f4; --selection: #dedede;
  background: var(--bg);
  color: var(--text);
  font-family: Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
body { margin: 0; }
main {
  width: min(100% - 64px, 620px);
  margin: clamp(100px, 27vh, 280px) auto 80px;
}
.signature {
  color: var(--accent);
  font: italic 36px / 1 Georgia, 'Times New Roman', serif;
  margin-bottom: 48px;
}
h1 {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 400;
  font-size: clamp(23px, 5.8vw, 42px);
  letter-spacing: -1.2px;
  line-height: 1.25;
  margin: 0 0 14px;
  overflow-wrap: anywhere;
}
p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
  white-space: pre-line;
}
a {
  display: inline-block;
  color: var(--text);
  font-size: 14px;
  line-height: 1.6;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--line);
}
a:hover { color: var(--accent); text-decoration-color: currentColor; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; }
.contacts { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 30px; }
.content-section { margin-top: 56px; }
h2 { margin: 0 0 18px; color: var(--muted); font-size: 12px; font-weight: 400; }
.links { list-style: none; padding: 0; margin: 0; }
.links li + li { margin-top: 14px; }
.links a, .contacts a { overflow-wrap: anywhere; max-width: 100%; }
.video { padding: 15px 0; border-top: 1px solid var(--line); }
.video:last-child { border-bottom: 1px solid var(--line); }
.video-toggle {
  width: 100%; padding: 4px 0; border: 0; background: none; color: var(--text);
  font: 14px / 1.6 Arial, Helvetica, sans-serif; cursor: pointer;
  display: flex; align-items: baseline; gap: 14px; text-align: left;
}
.video-toggle:hover { color: var(--accent); }
.play-mark { color: var(--accent); font-size: 11px; flex-shrink: 0; }
.video-title { overflow-wrap: anywhere; min-width: 0; }
.video-player { margin-top: 16px; }
.video-player iframe { display: block; width: 100%; aspect-ratio: 16 / 9; min-height: 200px; border: 0; background: var(--surface); }
.video-source { font-size: 12px; margin-top: 12px; }
[hidden] { display: none; }
::selection { background: var(--selection); }
@media (max-width: 480px) {
  main { width: calc(100% - 48px); margin-top: 23vh; }
  .signature { margin-bottom: 36px; font-size: 30px; }
  h1 { letter-spacing: -.6px; }
}

:root[data-theme="dark"] { color-scheme: dark; --bg: #101010; --text: #f5f5f5; --muted: #a0a0a0; --line: #383838; --accent: #f5f5f5; --surface: #202020; --selection: #454545; }
.theme-toggle { position: absolute; top: 24px; right: 28px; padding: 8px 0; border: 0; background: none; color: var(--muted); font: 12px/1.5 Arial,sans-serif; cursor: pointer; }
.theme-toggle:hover { color: var(--text); }
.preview-note { padding-right: 150px !important; }
@media(max-width:480px){.theme-toggle{top:18px;right:24px}.preview-note{padding-right:125px!important}}

.contact-text { font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; max-width: 100%; user-select: text; }

.featured-link { margin-top: 20px; }
.copy-email, .more-videos { border: 0; padding: 0; background: none; color: var(--text); font: inherit; cursor: pointer; text-align: left; }
.copy-email { user-select: text; }
.copy-notice { margin-left: 8px; font-size: 12px; color: var(--muted); }
.more-videos { margin-top: 20px; font-size: 12px; color: var(--muted); }