:root { --paper: #ffffff; --paper-2: #f5f1e8; --ink: #1a1814; --ink-soft: #4a463e; --ink-mute: #87806f; --ink-dim: #a8a094; --ink-faint: #c4bdac; --rule: #d9d1bd; --amber: #c64a1a; --amber-soft: #e6d4c2; --card-mint: #E2F0EE; --card-mint-rule: #C8DFDC; --bg: var(--paper-2); --surface: var(--paper); --ink-fade: var(--ink-mute); --accent: var(--amber); --accent-soft: var(--amber-soft); --border: var(--rule); --border-soft: #ece4cf; --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif; --font-serif: 'Newsreader', Georgia, 'Times New Roman', serif; --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace; --sidebar-width: 240px; --rail-width: 420px; --app-max: 1400px; --reading-max: 680px; } * { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; } html, body { font-family: var(--font-sans); background: #ffffff; min-height: 100vh; color: var(--ink); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: 'cv11', 'ss01', 'ss03', 'kern', 'liga', 'calt'; text-rendering: optimizeLegibility; font-variant-numeric: lining-nums; } body { background-color: var(--paper); background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.92' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.10 0 0 0 0 0.09 0 0 0 0 0.08 0 0 0 0.035 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>"); } body { display: flex; align-items: flex-start; justify-content: center; padding: 24px; } .phone-frame { width: 100%; max-width: 720px; background: var(--surface); border-radius: 24px; border: 1px solid var(--border-soft); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.04); overflow: hidden; position: relative; display: flex; flex-direction: column; } @media (max-width: 480px) { body { padding: 0; align-items: stretch; } .phone-frame { width: 100vw; max-width: none; min-height: 100vh; border-radius: 0; border: none; box-shadow: none; } } .app-shell { display: contents; } .desktop-sidebar, .network-rail { display: none; } @media (min-width: 1024px) { body { padding: 0; } .app-shell { display: grid; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); align-items: start; width: 100%; max-width: calc(var(--app-max) - var(--rail-width)); } #main-content { min-width: 0; padding: 26px 28px; } .phone-frame { max-width: none; border-radius: 18px; } .phone-frame .top-nav, .notch { display: none; } .desktop-sidebar { display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; padding: 26px 16px; gap: 6px; background: var(--surface); border-right: 1px solid var(--border-soft); overflow-y: auto; z-index: 20; } .desktop-sidebar-brand { display: block; padding: 2px 12px 16px; } .desktop-sidebar-brand-img { height: 56px; width: auto; display: block; } .desktop-sidebar-nav { display: flex; flex-direction: column; gap: 2px; } .desktop-sidebar-link { display: block; padding: 9px 12px; border-radius: 10px; font-size: 14.5px; font-weight: 500; color: var(--ink-soft); text-decoration: none; transition: background 0.15s ease, color 0.15s ease; } .desktop-sidebar-link:hover { background: var(--bg); color: var(--ink); } .desktop-sidebar-link.is-active { background: var(--bg); color: var(--ink); } .desktop-sidebar-foot { margin-top: auto; display: flex; flex-direction: column; gap: 2px; padding-top: 14px; border-top: 1px solid var(--border-soft); } .desktop-sidebar-foot .desktop-sidebar-link, .desktop-sidebar-foot form { width: 100%; } .desktop-sidebar-foot button { display: block; width: 100%; text-align: left; background: none; border: none; cursor: pointer; padding: 9px 12px; border-radius: 10px; font-family: inherit; font-size: 14.5px; font-weight: 500; color: var(--ink-soft); transition: background 0.15s ease, color 0.15s ease; } .desktop-sidebar-foot button:hover { background: var(--bg); color: var(--ink); } .desktop-sidebar-me { display: flex; align-items: center; gap: 10px; padding: 8px 12px 12px; } .desktop-sidebar-me-name { font-size: 14px; font-weight: 600; color: var(--ink); } .screen-title, .screen-subtitle, .screen-subtitle-sub { max-width: var(--reading-max); } } @media (min-width: 1366px) { .app-shell { grid-template-columns: var(--sidebar-width) minmax(0, 1fr) var(--rail-width); max-width: var(--app-max); } .network-rail { display: block; position: sticky; top: 0; height: 100vh; overflow: hidden auto; padding: 26px 18px; background: var(--surface); border-left: 1px solid var(--border-soft); z-index: 20; } .phone-frame .feed-stream-module { display: none; } } .feed-stream-module { margin: 18px 0; } .network-rail .feed-stream-module { margin: 0; } .feed-stream-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; } .feed-stream-title { font-family: var(--font-serif); font-size: 17px; color: var(--ink); } .feed-stream-all { font-family: var(--font-sans); font-size: 12.5px; color: var(--accent); text-decoration: none; } .feed-stream-empty { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); } .feed-stream-items { display: flex; flex-direction: column; gap: 12px; } .feed-stream-loading { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); padding: 6px 0 2px; } .feed-compact-list { display: flex; flex-direction: column; gap: 8px; } .feed-compact { display: flex; flex-direction: column; gap: 3px; padding: 11px 13px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 12px; text-decoration: none; transition: transform 0.2s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.2s ease; } .feed-compact:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(26, 24, 20, 0.07); } .feed-compact-kind { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); } .feed-compact-headline { font-family: var(--font-sans); font-size: 13.5px; line-height: 1.35; color: var(--ink); } .feed-compact-time { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-soft, var(--ink-mute)); } .feed-compact-roster { display: flex; align-items: center; gap: 7px; margin-top: 1px; } .feed-compact-faces { display: inline-flex; } .feed-compact-face { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; border: 1.5px solid var(--paper); margin-left: -6px; background: var(--surface); } .feed-compact-face:first-child { margin-left: 0; } .feed-compact-roster-count { font-family: var(--font-sans); font-size: 11.5px; font-weight: 600; color: var(--ink-mute); } .notch { height: 8px; flex-shrink: 0; } .app-bar { height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 0 14px; flex-shrink: 0; } .app-bar.hidden { visibility: hidden; } .app-bar-slim { height: 36px; padding: 0 10px; } .app-bar-text-btn { background: none; border: none; cursor: pointer; padding: 6px 8px; font-family: inherit; font-size: 13px; font-weight: 500; color: var(--ink-mute); transition: color 0.15s ease; } .app-bar-text-btn:hover { color: var(--ink); } .icon-btn { background: none; border: none; cursor: pointer; padding: 10px 12px; font-family: inherit; border-radius: 10px; color: var(--ink); font-size: 22px; line-height: 1; font-weight: 300; min-width: 56px; text-align: left; } .skip-btn { font-size: 14px; color: var(--ink-mute); font-weight: 500; text-align: right; } .icon-btn:active { background: var(--bg); } .progress-wrap { display: flex; gap: 5px; align-items: center; } .dot { width: 5px; height: 5px; border-radius: 50%; background: var(--border); transition: all 0.2s ease; } .dot.active { background: var(--ink); width: 18px; border-radius: 3px; } .dot.passed { background: var(--ink); opacity: 0.35; } .screen { display: none; flex-direction: column; padding: 8px 24px 24px; } .screen.active { display: flex; animation: fadeIn 0.4s cubic-bezier(0.4, 0, 0.2, 1); } @keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } } .screen-title { font-family: var(--font-serif); font-size: 34px; font-weight: 400; letter-spacing: -0.022em; line-height: 1.08; margin: 8px 0 14px; color: var(--ink); } .screen-subtitle { font-family: var(--font-serif); font-size: 16px; font-weight: 400; color: var(--ink-soft); line-height: 1.55; letter-spacing: -0.004em; margin-bottom: 28px; } .screen-subtitle-sub { font-size: 13px; color: var(--ink-dim); line-height: 1.5; margin-top: -16px; margin-bottom: 26px; } .legacy-notice { margin: 6px 0 24px; padding: 13px 15px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 14px; text-align: left; } .legacy-notice-lead { margin: 0 0 7px; font-size: 13.5px; font-weight: 600; line-height: 1.4; color: var(--ink); } .legacy-notice-prev { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--ink-soft); } .legacy-notice-prev a { color: var(--amber); font-weight: 600; } .legacy-notice--compact { margin: 10px 0 4px; padding: 0; background: transparent; border: 0; } .bottom-bar { padding: 12px 24px calc(20px + env(safe-area-inset-bottom, 0px)); flex-shrink: 0; background: var(--surface); } .bottom-bar.hidden { display: none; } .cta-btn { width: 100%; height: 56px; background: var(--ink); color: white; border: none; border-radius: 14px; font-size: 15.5px; font-weight: 500; cursor: pointer; font-family: inherit; letter-spacing: -0.005em; transition: opacity 0.3s ease, box-shadow 0.3s ease; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset, 0 2px 10px rgba(26, 24, 20, 0.12); position: relative; } .cta-btn:hover { box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset, 0 4px 14px rgba(26, 24, 20, 0.18); } .cta-btn:active { opacity: 0.88; } a.cta-btn { display: flex; align-items: center; justify-content: center; text-align: center; text-decoration: none; box-sizing: border-box; } .cta-btn-secondary { background: var(--paper); color: var(--ink); border: 1px solid var(--border); box-shadow: none; } .cta-btn-secondary:hover { border-color: var(--ink); box-shadow: 0 2px 8px rgba(26, 24, 20, 0.06); } .photos-edit-recap { margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--border-soft); } .photos-edit-recap-sent { color: var(--ink-mute); font-style: italic; } .cta-btn.is-loading { cursor: progress; pointer-events: none; opacity: 0.92; padding-right: 44px; } .cta-btn.is-loading::after { content: ""; position: absolute; right: 20px; top: 50%; margin-top: -8px; width: 16px; height: 16px; border: 1.5px solid rgba(255, 255, 255, 0.28); border-top-color: rgba(255, 255, 255, 0.92); border-radius: 50%; animation: cta-spin 0.85s linear infinite; } @keyframes cta-spin { to { transform: rotate(360deg); } } @media (prefers-reduced-motion: reduce) { .cta-btn.is-loading::after { animation-duration: 2.4s; } } .welcome-screen { padding-top: 12px; padding-bottom: 24px; } .wordmark { font-size: 17px; font-weight: 600; letter-spacing: -0.3px; color: var(--ink); margin-bottom: 28px; display: flex; align-items: center; gap: 6px; } .wordmark::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); } .steps-list { margin-bottom: auto; } .steps-label { font-size: 11.5px; color: var(--ink-fade); text-transform: uppercase; letter-spacing: 0.7px; font-weight: 600; margin-bottom: 12px; } .step-row { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border-soft); } .step-row:last-of-type { border-bottom: none; } .step-num { width: 22px; height: 22px; border-radius: 50%; background: var(--bg); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; color: var(--ink-mute); flex-shrink: 0; margin-top: 1px; } .step-text { flex: 1; } .step-name { font-size: 14.5px; color: var(--ink); font-weight: 500; } .step-detail { font-size: 12.5px; color: var(--ink-mute); margin-top: 2px; line-height: 1.4; } .step-time { font-size: 12px; color: var(--ink-fade); margin-top: 12px; } .signin-stack { display: flex; flex-direction: column; gap: 9px; margin-top: 20px; } .signin-btn { height: 52px; border-radius: 14px; border: 1px solid var(--border); background: var(--surface); font-size: 15px; font-weight: 500; display: flex; align-items: center; justify-content: center; cursor: pointer; font-family: inherit; color: var(--ink); transition: background 0.15s; } .signin-btn:active { background: var(--bg); } .signin-btn.dark { background: var(--ink); color: white; border-color: var(--ink); } .email-link { text-align: center; font-size: 13.5px; color: var(--ink-mute); cursor: pointer; padding: 12px; } .legal { text-align: center; font-size: 11px; color: var(--ink-fade); line-height: 1.5; margin-top: 4px; } .avatar-block { display: flex; flex-direction: column; align-items: center; margin-bottom: 24px; } .avatar-circle { width: 96px; height: 96px; border-radius: 50%; background: var(--accent-soft); display: flex; align-items: center; justify-content: center; font-size: 38px; font-weight: 600; color: var(--accent); margin-bottom: 8px; cursor: pointer; transition: transform 0.15s; } .avatar-circle:active { transform: scale(0.97); } .avatar-edit { font-size: 12.5px; color: var(--ink-mute); cursor: pointer; padding: 4px 8px; } .field-stack { display: flex; flex-direction: column; gap: 10px; } .field-row { display: flex; gap: 10px; } .field-row > .text-input { flex: 1; } .section-divider { margin: 24px 0 14px; display: flex; align-items: center; gap: 12px; } .section-divider::before, .section-divider::after { content: ''; flex: 1; height: 1px; background: var(--border-soft); } .section-label { font-size: 11.5px; color: var(--ink-fade); text-transform: uppercase; letter-spacing: 0.7px; font-weight: 600; } .text-input { width: 100%; border: 1px solid transparent; background: var(--bg); border-radius: 14px; padding: 14px 16px; font-size: 16px; font-family: inherit; outline: none; color: var(--ink); resize: none; transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease; } .text-input:focus { border-color: var(--ink); background: var(--surface); box-shadow: 0 0 0 4px rgba(26, 24, 20, 0.06); } .text-input::placeholder { color: var(--ink-fade); } .text-input.small { padding: 12px 14px; font-size: 14.5px; } .event-form { display: flex; flex-direction: column; gap: 28px; margin-top: 18px; } .event-form-errors { padding: 10px 14px; background: rgba(217, 119, 6, 0.08); border-left: 2px solid var(--amber); border-radius: 4px; font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); } .event-form-group { border: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; } .event-form-legend { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 6px; padding: 0; } .event-form-field { display: flex; flex-direction: column; gap: 6px; } .event-form-field-narrow { flex: 0 0 90px; } .event-form-field-grow { flex: 1; } .event-form-row { display: flex; gap: 12px; } .event-form-label { font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink); } .event-form-textarea { font-family: var(--font-serif); font-size: 14.5px; line-height: 1.55; resize: vertical; min-height: 60px; } .event-form-hint { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); line-height: 1.45; margin: 0; } .event-form-radio-row { display: flex; flex-wrap: wrap; gap: 16px; } .event-form-radio { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-sans); font-size: 14px; color: var(--ink); cursor: pointer; } .event-form-radio input[type="radio"] { accent-color: var(--amber); } .event-form-poweredit { padding: 12px 14px; background: var(--paper-2); border-radius: 8px; font-style: italic; } .event-form-poweredit code { font-family: var(--font-mono); font-size: 11.5px; padding: 1px 5px; background: rgba(0, 0, 0, 0.05); border-radius: 3px; } .event-form-actions { display: flex; align-items: center; gap: 18px; margin-top: 8px; } .event-form-cancel { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); text-decoration: none; border-bottom: 1px solid rgba(0, 0, 0, 0.12); padding-bottom: 1px; } .event-form-cancel:hover { color: var(--ink); border-bottom-color: rgba(0, 0, 0, 0.4); } .event-admin-edit { font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-mute); text-decoration: none; padding: 4px 8px; border-radius: 4px; } .event-admin-edit:hover { color: var(--ink); background: rgba(0, 0, 0, 0.04); } .events-admin-new { margin: 14px 0 4px; } .events-admin-new-link { font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; color: var(--amber); text-decoration: none; border-bottom: 1px solid var(--amber); padding-bottom: 1px; } .events-admin-new-link:hover { color: var(--ink); border-bottom-color: var(--ink); } .text-input.error { border-color: var(--accent); } .chooser-form { display: flex; flex-direction: column; gap: 22px; margin-top: 18px; } .chooser-preview { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px; border-radius: 12px; background: var(--paper-2); border: 1px solid rgba(0, 0, 0, 0.08); } .chooser-preview-title { font-family: var(--font-serif); font-size: 17px; font-weight: 600; line-height: 1.3; color: var(--ink); margin: 0; width: 100%; background: transparent; border: none; border-bottom: 1px dashed transparent; padding: 2px 0; outline: none; } .chooser-preview-title:hover { border-bottom-color: rgba(0, 0, 0, 0.15); } .chooser-preview-title:focus { border-bottom-color: var(--amber); } .chooser-preview-title::placeholder { color: var(--ink-mute); font-style: italic; font-weight: 400; } .chooser-preview-row { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .chooser-preview-dot { color: var(--ink-mute); opacity: 0.6; } .chooser-group { border: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; } .chooser-legend { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); padding: 0; width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; } .chooser-legend-manage { font-family: var(--font-sans); font-size: 11px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--amber); text-decoration: none; border-bottom: 1px solid rgba(217, 119, 6, 0.4); padding-bottom: 1px; } .chooser-legend-manage:hover { color: var(--ink); border-bottom-color: var(--ink); } .chooser-city-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; } .chooser-city-chip { font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; letter-spacing: 0.02em; color: var(--ink-soft); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 5px 12px; cursor: pointer; transition: color 120ms ease, background 120ms ease, border-color 120ms ease; } .chooser-city-chip:hover { color: var(--ink); border-color: var(--ink-mute); } .chooser-city-chip.is-active { background: rgba(217, 119, 6, 0.12); color: var(--amber); border-color: rgba(217, 119, 6, 0.4); } .chooser-city-prompt { margin: 6px 2px 0; font-style: italic; } .chooser-rows { display: flex; flex-direction: column; gap: 6px; } .chooser-pick-row[hidden] { display: none; } .chooser-pick-row { position: relative; display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: 10px; border: 1px solid rgba(0, 0, 0, 0.12); background: var(--paper); cursor: pointer; transition: border-color 120ms ease, background 120ms ease; } .chooser-pick-row input[type="radio"] { margin-top: 4px; accent-color: var(--amber); } .chooser-pick-row:hover { border-color: rgba(0, 0, 0, 0.28); } .chooser-pick-row:has(input:checked) { border-color: var(--amber); background: rgba(217, 119, 6, 0.06); } .chooser-pick-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; } .chooser-pick-title { font-family: var(--font-sans); font-size: 14.5px; font-weight: 600; color: var(--ink); margin: 0; line-height: 1.35; } .chooser-pick-sub { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); line-height: 1.45; margin: 0; } .chooser-cover-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; } .chooser-cover-tile { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 6px; border-radius: 10px; border: 1px solid rgba(0, 0, 0, 0.12); background: var(--paper); cursor: pointer; } .chooser-cover-tile input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; } .chooser-cover-tile:hover { border-color: rgba(0, 0, 0, 0.28); } .chooser-cover-tile:has(input:checked) { border-color: var(--amber); box-shadow: 0 0 0 1px var(--amber) inset; } .chooser-cover-thumb { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; display: block; } .chooser-cover-thumb-empty { display: flex; align-items: center; justify-content: center; background: var(--paper-2); color: var(--ink-mute); font-family: var(--font-sans); font-size: 13px; } .chooser-cover-name { font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); padding: 0 4px 4px; } .theme-list { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; } .theme-card { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; border-radius: 10px; border: 1px solid rgba(0, 0, 0, 0.1); background: var(--paper); text-decoration: none; color: var(--ink); transition: border-color 120ms ease; } .theme-card:hover { border-color: rgba(0, 0, 0, 0.28); } .theme-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; } .theme-card-name { font-family: var(--font-serif); font-size: 16px; font-weight: 600; } .theme-card-uses { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); } .theme-card-desc { font-family: var(--font-serif); font-size: 13.5px; color: var(--ink-soft); line-height: 1.5; margin: 0; } .theme-card-meta { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); } .cover-library-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; margin-top: 18px; } .cover-library-tile { display: flex; flex-direction: column; gap: 6px; padding: 8px; border-radius: 10px; border: 1px solid rgba(0, 0, 0, 0.1); background: var(--paper); } .cover-library-thumb { width: 100%; aspect-ratio: 16 / 9; border-radius: 6px; object-fit: cover; } .cover-library-row { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; } .cover-library-name { font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--ink); } .cover-library-uses { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); } .cover-library-actions { display: flex; align-items: center; gap: 12px; } .error-text { color: var(--accent); font-size: 12.5px; margin-top: 6px; } .chips-wrap { display: flex; flex-wrap: wrap; gap: 8px; } .chip { padding: 10px 16px; border-radius: 100px; border: 1px solid rgba(0, 0, 0, 0.12); background: transparent; font-size: 13.5px; font-weight: 500; cursor: pointer; font-family: inherit; color: var(--ink); transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease; min-height: 38px; } .chip:active { opacity: 0.7; } .chip.selected { background: var(--ink); border-color: var(--ink); color: var(--paper); } .chip.add { border-style: dashed; color: var(--ink-mute); } .city-cta { width: 100%; height: 46px; background: var(--bg); border: 1px solid var(--border); border-radius: 12px; display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 14px; font-weight: 500; cursor: pointer; margin-bottom: 12px; font-family: inherit; color: var(--ink); } .city-cta:active { background: var(--border-soft); } .combined-section { margin-top: 26px; } .done-content { flex: 1; display: flex; flex-direction: column; padding-top: 4px; } .done-emoji { font-size: 36px; margin-bottom: 4px; } .done-title { font-size: 26px; font-weight: 600; letter-spacing: -0.5px; margin-bottom: 4px; } .done-sub { font-size: 14px; color: var(--ink-mute); margin-bottom: 20px; } .founder-card-bar { background: var(--ink); color: var(--paper); padding: 10px 16px; display: flex; align-items: center; justify-content: space-between; font-family: var(--font-sans); font-size: 11px; font-weight: 500; letter-spacing: 0.12em; } .founder-card-brand { font-family: var(--font-serif); font-size: 13px; font-weight: 500; letter-spacing: 0; display: inline-flex; align-items: center; gap: 6px; } .founder-card-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--amber); display: inline-block; } .founder-card-kind { text-transform: uppercase; color: rgba(255, 255, 255, 0.72); } .founder-card-title, .founder-card-company { font-family: var(--font-serif); font-size: 14px; font-weight: 400; color: var(--ink-soft); line-height: 1.35; margin-top: 2px; overflow-wrap: anywhere; } .founder-card-name.is-placeholder, .founder-card-title.is-placeholder, .founder-card-company.is-placeholder, .founder-card-row-value.is-placeholder { color: var(--ink-fade); } .preview-tappable { cursor: pointer; border-radius: 4px; padding: 2px 4px; margin: 0 -4px; transition: background 0.15s ease, color 0.15s ease; } .preview-tappable:hover { background: rgba(198, 74, 26, 0.08); color: var(--ink); } .founder-card-rule { border: none; border-top: 1px solid var(--border-soft); margin: 14px 0 12px; } .founder-card-empty { font-family: var(--font-sans); font-size: 10.5px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-mute); padding-top: 6px; } .founder-card-photo { position: relative; width: 58px; height: 58px; border-radius: 8px; background: var(--paper-2); border: 1px dashed rgba(0, 0, 0, 0.16); display: flex; align-items: center; justify-content: center; flex-shrink: 0; cursor: pointer; overflow: hidden; } .founder-card-photo-icon { width: 22px; height: 22px; stroke: var(--ink-mute); stroke-width: 1.5; fill: none; } .founder-card-photo-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .founder-card-photo.has-image { border-color: transparent; } .founder-card-photo.has-image .founder-card-photo-icon { display: none; } .founder-card-avatar { width: 56px; height: 56px; border-radius: 50%; background: var(--paper); color: var(--ink-mute); display: flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 20px; font-weight: 500; flex-shrink: 0; overflow: hidden; box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.95), 0 0 0 4px rgba(198, 74, 26, 0.18), 0 4px 14px rgba(26, 24, 20, 0.12); } img.founder-card-avatar-image { display: block; width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background: var(--paper-2); } img.match-avatar-image { display: block; width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background: var(--paper-2); } .founder-card-name-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; margin-bottom: 2px; } .profile-host-tag { font-family: var(--font-sans); font-size: 10px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); padding: 2px 7px; border-radius: 100px; background: var(--amber-soft); } .founder-verified { display: inline-flex; align-items: center; vertical-align: -2px; margin-left: 4px; line-height: 0; } .founder-verified svg { display: block; } .profile-admin { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 12px 0 4px; padding: 10px 14px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 14px; } .profile-admin-state { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--ink); } .profile-admin-state-off { color: var(--ink-mute); font-weight: 500; } .profile-admin-btn { padding: 6px 14px; font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.03em; border-radius: 999px; border: 1px solid var(--border); background: transparent; color: var(--ink); cursor: pointer; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .profile-admin-btn-on { color: #1d9bf0; border-color: rgba(29, 155, 240, 0.4); } .profile-admin-btn-on:hover { background: rgba(29, 155, 240, 0.08); border-color: #1d9bf0; } .profile-admin-btn-danger { color: var(--ink-fade); border-color: var(--border-soft); } .profile-admin-btn-danger:hover { color: #b34c2e; border-color: rgba(179, 76, 46, 0.5); background: rgba(179, 76, 46, 0.04); } .founder-card-socials { display: flex; gap: 16px; margin: 8px 0 0; } .founder-card-social { display: inline-flex; align-items: center; color: var(--ink-mute); text-decoration: none; transition: color 0.15s ease; } .founder-card-social:hover { color: var(--accent); } .founder-card-social .ui-icon svg { width: 15px; height: 15px; } .founder-card-row-tags { gap: 4px; margin-top: 2px; } .founder-card-about { display: flex; flex-direction: column; gap: 5px; } .founder-card-about-line { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; } .founder-card-about-key { font-family: var(--font-sans); font-size: 11px; font-weight: 500; color: var(--ink-fade); flex-shrink: 0; min-width: 42px; } .profile-tags { display: flex; gap: 6px; flex-wrap: wrap; } .profile-tag { padding: 4px 10px; background: var(--bg); border-radius: 100px; font-size: 11.5px; color: var(--ink-mute); font-weight: 500; } .edit-screen { padding: 14px 22px 24px; } .edit-title { font-family: var(--font-serif); font-size: 26px; font-weight: 500; letter-spacing: -0.02em; color: var(--ink); margin: 4px 0 4px; line-height: 1.1; } .edit-subtitle { font-family: var(--font-serif); font-size: 14px; color: var(--ink-mute); margin: 0 0 18px; line-height: 1.45; } .edit-form { display: flex; flex-direction: column; gap: 22px; } .edit-group { display: flex; flex-direction: column; gap: 8px; } .edit-group-label { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-fade); margin-bottom: 2px; } .edit-group-helper { margin: -2px 0 6px; font-family: var(--font-serif); font-size: 13px; color: var(--ink-mute); line-height: 1.45; } .edit-group-helper a { color: var(--ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; } .edit-avatar-slot { position: relative; width: 80px; height: 80px; border-radius: 12px; background: var(--paper-2); border: 1px dashed rgba(0, 0, 0, 0.16); display: flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; } .edit-avatar-slot.has-image { border-color: transparent; } .edit-avatar-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .edit-avatar-placeholder { font-family: var(--font-mono); font-size: 26px; color: var(--ink-fade); } .edit-avatar-btn { display: inline-block; margin-top: 8px; background: none; border: 0; padding: 0; -webkit-appearance: none; appearance: none; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink); cursor: pointer; text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-underline-offset: 3px; align-self: flex-start; } body.dkr .edit-avatar-btn { text-decoration-color: rgba(236, 233, 227, 0.3); } .edit-avatar-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; } .edit-avatar-buttons { display: flex; align-items: center; gap: 16px; margin-top: 8px; } .edit-avatar-status { margin: 8px 0 0; font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--ink-mute); } .edit-avatar-status[hidden] { display: none; } .edit-avatar-status.is-saving { color: var(--amber); } .edit-avatar-status.is-saved { color: var(--ink); } .edit-save-error { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 16px; padding: 10px 14px; background: var(--amber-soft); border: 1px solid var(--amber); border-radius: 10px; font-family: var(--font-sans); font-size: 13px; color: var(--ink); } .edit-save-error[hidden] { display: none; } .edit-save-retry { flex-shrink: 0; padding: 5px 14px; background: var(--amber); color: var(--paper); border: none; border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; cursor: pointer; } .edit-save-retry:hover { filter: brightness(1.06); } body.crop-open { overflow: hidden; } .crop-overlay { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(20, 18, 14, 0.72); } .crop-overlay[hidden] { display: none; } .crop-sheet { width: 100%; max-width: 360px; padding: 20px; border-radius: 16px; background: var(--paper); overflow: hidden; text-align: center; } .crop-title { margin: 0 0 14px; font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: var(--ink); } .crop-mask { position: relative; width: min(72vw, 300px); height: min(72vw, 300px); margin: 0 auto; overflow: hidden; border-radius: 14px; background: #000; touch-action: none; cursor: grab; } .crop-mask:active { cursor: grabbing; } .crop-img { position: absolute; top: 50%; left: 50%; max-width: none; user-select: none; -webkit-user-drag: none; will-change: transform; } .crop-ring { position: absolute; inset: 0; border-radius: 50%; box-shadow: 0 0 0 9999px rgba(20, 18, 14, 0.55); pointer-events: none; } .crop-zoom { width: 100%; max-width: min(72vw, 300px); margin: 18px auto 4px; accent-color: var(--amber); } .crop-actions { display: flex; gap: 10px; margin-top: 16px; } .crop-btn { flex: 1; padding: 11px 14px; border-radius: 10px; font-family: var(--font-sans); font-size: 14px; font-weight: 600; cursor: pointer; border: 1px solid transparent; } .crop-btn-ghost { background: var(--paper); border-color: var(--rule); color: var(--ink-soft); } .crop-btn-ghost:hover { border-color: var(--ink); color: var(--ink); } .crop-btn-primary { background: var(--amber); color: #fff; } .crop-btn-primary:hover { background: #b03f14; } .edit-social { display: flex; align-items: center; gap: 10px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 10px; padding: 8px 12px; transition: border-color 0.15s ease; } .edit-social:focus-within { border-color: var(--ink); } .edit-social-glyph { color: var(--ink-mute); display: inline-flex; align-items: center; flex-shrink: 0; } .edit-social-input { flex: 1; min-width: 0; background: transparent; border: none; outline: none; padding: 4px 0; font-family: var(--font-sans); font-size: 14px; color: var(--ink); } .edit-social-input::placeholder { color: var(--ink-fade); } .edit-textarea { min-height: 80px; resize: vertical; font-family: var(--font-serif); line-height: 1.45; } .edit-chip-row { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; } .edit-chip-row-label { display: flex; align-items: baseline; gap: 8px; font-family: var(--font-serif); font-size: 14px; font-weight: 500; color: var(--ink); letter-spacing: -0.005em; } .edit-chip-row-aside { font-family: var(--font-sans); font-size: 11.5px; font-weight: 400; color: var(--ink-mute); } .edit-chip-row-cap { margin-left: auto; font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-fade); } .edit-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 6px; } .edit-cancel { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); text-decoration: none; padding: 6px 4px; } .edit-cancel:hover { color: var(--ink); } .edit-save { width: auto; flex: 1; min-width: 0; } .edit-done { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 8px 14px; font-family: var(--font-sans); font-size: 14px; font-weight: 500; color: var(--amber); text-decoration: none; border: 1px solid var(--amber); border-radius: 10px; transition: background 0.15s ease, color 0.15s ease; } .edit-done:hover { background: var(--amber-soft); } .autosave-status { display: inline-block; margin-left: 6px; padding: 1px 8px 2px; font-family: var(--font-sans); font-size: 11px; font-weight: 500; letter-spacing: 0.02em; color: var(--ink-mute); background: var(--paper-2); border-radius: 999px; vertical-align: 1px; transition: background 0.18s ease, color 0.18s ease; } .autosave-status.is-saving { color: var(--amber); background: var(--amber-soft); } .autosave-status.is-saved { color: var(--ink); background: var(--paper-2); } .autosave-status.is-error { color: white; background: var(--amber); } .next-list { display: flex; flex-direction: column; margin-top: 4px; } .next-item { display: flex; align-items: center; gap: 10px; padding: 12px 0; border: 0; border-bottom: 1px solid var(--border-soft); background: transparent; text-decoration: none; color: var(--ink); font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; cursor: pointer; transition: color 0.12s ease; } .next-item:last-child { border-bottom: none; } .next-item:hover .next-title { color: var(--amber); } .next-glyph { display: inline-flex; width: 18px; color: var(--ink-mute); flex-shrink: 0; } .next-glyph .ui-icon svg { width: 16px; height: 16px; } .next-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .next-meta { font-size: 11.5px; color: var(--ink-mute); flex-shrink: 0; } .next-arrow { color: var(--ink-fade); font-size: 16px; flex-shrink: 0; } .flash-banner { position: fixed; top: 16px; left: 50%; transform: translateX(-50%); z-index: 100; padding: 11px 18px; border-radius: 12px; font-size: 13.5px; font-weight: 500; box-shadow: 0 8px 24px rgba(0,0,0,0.15); max-width: calc(100vw - 32px); cursor: pointer; opacity: 1; transition: opacity 0.3s ease, transform 0.3s ease; } .flash-banner.is-dismissing { opacity: 0; transform: translate(-50%, -8px); } .flash-notice { background: var(--ink); color: white; } .flash-alert { background: var(--accent); color: white; } .signin-helper { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; padding: 12px 14px; background: var(--bg); border-radius: 12px; font-size: 12.5px; color: var(--ink-mute); line-height: 1.45; } .signin-helper-icon { font-size: 14px; line-height: 1.4; flex-shrink: 0; } .cta-btn:disabled { cursor: progress; } .cta-btn-outline { background: var(--surface); color: var(--ink); border: 1.5px solid var(--border); display: flex; align-items: center; justify-content: center; text-decoration: none; } .sso-signin-form { margin: 0; } .sso-signin-form + .sso-signin-form { margin-top: 8px; } .sso-signin-btn { height: 48px; font-size: 15px; font-weight: 500; gap: 10px; } .sso-signin-icon { flex-shrink: 0; } .signin-divider { display: flex; align-items: center; gap: 12px; margin: 18px 0 16px; color: var(--ink-mute); font-size: 12px; letter-spacing: 0.04em; text-transform: uppercase; } .signin-divider::before, .signin-divider::after { content: ""; flex: 1; height: 1px; background: var(--border-soft); } .check-email-icon { font-size: 56px; text-align: center; margin: 12px 0 14px; animation: bounceIn 0.5s ease; } @keyframes bounceIn { 0% { transform: scale(0.6); opacity: 0; } 60% { transform: scale(1.1); opacity: 1; } 100% { transform: scale(1); } } .check-email-steps { margin-top: 28px; background: var(--bg); border-radius: 16px; padding: 8px 16px; } .check-step { display: flex; align-items: flex-start; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--border-soft); } .check-step:last-child { border-bottom: none; } .check-step-num { width: 22px; height: 22px; border-radius: 50%; background: var(--surface); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; color: var(--ink-mute); flex-shrink: 0; margin-top: 1px; } .check-step-title { font-size: 14px; font-weight: 600; color: var(--ink); } .check-step-detail { font-size: 12.5px; color: var(--ink-mute); margin-top: 2px; line-height: 1.45; } .dev-hint { margin-top: 18px; padding: 10px 14px; background: #fff1e6; border: 1px dashed var(--accent); border-radius: 10px; font-size: 12px; color: var(--accent); text-align: center; } .dev-hint a { color: var(--accent); font-weight: 600; } .skip-link { position: absolute; top: -40px; left: 8px; background: var(--ink); color: white; padding: 8px 14px; border-radius: 8px; font-size: 13px; font-weight: 500; z-index: 1000; text-decoration: none; transition: top 0.2s; } .skip-link:focus { top: 8px; } *:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; border-radius: 4px; } .text-input:focus-visible { outline: none; border-color: var(--ink); background: var(--surface); } .chip:focus-visible { outline-offset: 1px; } .cta-btn:focus-visible { outline-offset: 3px; } .screen-eyebrow { font-family: var(--font-sans); font-size: 13px; color: var(--ink-fade); letter-spacing: 0; font-weight: 500; margin: 12px 0 8px; } .welcome-app-bar { padding: 14px 24px 8px; } .welcome-wordmark-inline { font-family: var(--font-serif); font-size: 16px; font-weight: 600; letter-spacing: -0.3px; color: var(--ink); } .welcome-nav-link { font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; color: var(--ink-mute); text-decoration: none; padding: 4px 8px; border-radius: 4px; } .welcome-nav-link:hover { color: var(--ink); background: rgba(0, 0, 0, 0.04); } .welcome-events { margin: 4px 0 24px; } .welcome-events-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 10px; } .welcome-events-label { font-family: var(--font-sans); font-size: 11.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-mute); } .welcome-events-link { font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-decoration-thickness: 1px; text-underline-offset: 3px; } .welcome-events-link:hover { text-decoration-color: var(--ink); } .event-list.event-list-tight .event-card { padding: 10px 4px; } .welcome-screen { padding: 0; } .welcome-cover { position: relative; height: 300px; background-size: cover; background-position: center; filter: saturate(0.95) contrast(0.97) sepia(0.12); margin: 0; } .welcome-cover-scrim { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(20, 18, 14, 0.12) 0%, rgba(20, 18, 14, 0) 18%), linear-gradient(180deg, rgba(245, 241, 232, 0) 65%, rgba(245, 241, 232, 0.6) 88%, rgba(245, 241, 232, 1) 100%); } .welcome-hero-text { padding: 20px 24px 4px; } .welcome-hero-title { font-family: var(--font-serif); font-weight: 400; font-size: 38px; letter-spacing: -0.026em; line-height: 1.04; color: var(--ink); margin: 0 0 12px; } .welcome-hero-sub { font-family: var(--font-serif); font-weight: 400; font-size: 16px; line-height: 1.55; color: var(--ink-soft); letter-spacing: -0.004em; margin: 0; max-width: 380px; } .welcome-screen > *:not(.welcome-cover) { padding-left: 24px; padding-right: 24px; } .welcome-host-line { display: flex; align-items: center; gap: 12px; margin: 18px 0 18px; padding: 10px 0; border-bottom: 1px solid rgba(0, 0, 0, 0.06); } .welcome-host-line-avatar { width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0; object-fit: cover; background: var(--paper-2); display: flex; align-items: center; justify-content: center; font-family: var(--font-sans); font-weight: 600; font-size: 15px; color: var(--ink-soft); } .welcome-host-line-text { font-family: var(--font-sans); font-size: 13px; color: var(--ink); line-height: 1.4; min-width: 0; } .welcome-host-line-eyebrow { font-weight: 600; font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--amber); margin-right: 6px; } .welcome-host-line-name { font-weight: 600; } .welcome-host-line-role { color: var(--ink-mute); } .welcome-quote { margin: 32px 0 28px; padding-left: 14px; border-left: 2px solid var(--amber); } .welcome-quote-body { font-family: var(--font-serif); font-size: 19px; font-weight: 400; line-height: 1.45; letter-spacing: -0.012em; color: var(--ink); margin: 0 0 10px; } .welcome-quote-author { font-family: var(--font-sans); font-size: 12px; font-weight: 500; letter-spacing: 0.04em; color: var(--ink-mute); margin: 0; } .welcome-past-section { margin: 28px 0 12px; } .welcome-past-section-eyebrow { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 10px; } .welcome-past-strip { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin: 0 -24px; padding: 0 24px; } .welcome-past-strip::-webkit-scrollbar { display: none; } .welcome-past-card { flex: 0 0 132px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: inherit; } .welcome-past-card-cover { width: 132px; height: 132px; border-radius: 12px; background-size: cover; background-position: center; filter: saturate(0.92) brightness(0.97) sepia(0.18); } .welcome-past-card-text { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); line-height: 1.4; } .welcome-past-card-edition { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--amber); margin-right: 4px; } .welcome-join-section { margin: 36px 0 18px; padding: 22px 22px 24px; background: var(--paper-2); border-radius: 18px; } .welcome-join-eyebrow { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 6px; text-align: center; } .welcome-join-helper { font-family: var(--font-serif); font-size: 14px; color: var(--ink-soft); line-height: 1.5; text-align: center; margin: 0 0 14px; } .welcome-masthead { margin: 18px 0 6px; font-family: var(--font-serif); font-size: 13px; color: var(--ink-soft); text-align: center; line-height: 1.55; } .welcome-masthead-link { display: block; margin-top: 4px; color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-underline-offset: 3px; font-size: 12.5px; } .welcome-masthead-link:hover { text-decoration-color: var(--ink); } .welcome-fineprint { font-family: var(--font-sans); font-size: 11px; color: var(--ink-mute); text-align: center; margin: 6px 0 0; } .welcome-fineprint a { color: var(--ink-mute); text-decoration: underline; text-decoration-color: rgba(0, 0, 0, 0.15); text-underline-offset: 2px; } .welcome-fineprint span[aria-hidden="true"] { margin: 0 6px; color: var(--ink-faint); } .welcome-next-card { display: block; margin: 0 0 18px; padding: 16px 16px 14px; background: var(--paper-2); border-radius: 14px; text-decoration: none; color: inherit; transition: transform 0.1s ease, box-shadow 0.15s ease; } .welcome-next-card:hover, .welcome-next-card:focus-visible { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05); } .welcome-next-eyebrow { display: flex; align-items: center; gap: 6px; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 10px; } .welcome-next-headline { font-family: var(--font-serif); font-weight: 500; font-size: 19px; line-height: 1.25; letter-spacing: -0.01em; color: var(--ink); } .welcome-next-edition { font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-mute); letter-spacing: 0; } .welcome-next-meta { margin-top: 4px; font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); } .welcome-next-countdown { color: var(--ink); font-weight: 500; } .welcome-next-going { display: flex; align-items: center; gap: 10px; margin-top: 12px; } .welcome-next-going-count { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .welcome-faces { display: inline-flex; align-items: center; } .welcome-face { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--paper-2); margin-left: -8px; background: var(--paper); object-fit: cover; display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink); } .welcome-face:first-child { margin-left: 0; } .welcome-face-initial { background: var(--paper); color: var(--ink-mute); } .welcome-join { display: flex; flex-direction: column; gap: 8px; margin-bottom: 4px; } .welcome-join-input { padding: 14px 14px; font-size: 15px; } .legal-screen { padding-top: 16px; } .legal-section { margin: 22px 0; } .legal-section h2 { font-family: var(--font-sans); font-size: 13px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 8px; } .legal-section p { font-family: var(--font-serif); font-size: 15px; line-height: 1.6; color: var(--ink-soft); letter-spacing: -0.005em; margin: 0; } .legal-section a { color: var(--amber); text-decoration: none; border-bottom: 1px solid var(--amber); } .legal-section a:hover { color: var(--ink); border-bottom-color: var(--ink); } .welcome-title { font-family: var(--font-serif); font-size: 36px; font-weight: 400; letter-spacing: -0.024em; line-height: 1.06; margin-bottom: 14px; } .welcome-benefits { display: flex; flex-direction: column; gap: 4px; margin-bottom: auto; } .benefit { display: flex; gap: 14px; padding: 14px 4px; border-bottom: 1px solid var(--border-soft); align-items: flex-start; } .benefit:last-child { border-bottom: none; } .benefit-icon { font-size: 22px; width: 36px; text-align: center; flex-shrink: 0; line-height: 1.2; } .benefit-text { flex: 1; } .benefit-title { font-size: 14.5px; font-weight: 600; color: var(--ink); margin-bottom: 2px; } .benefit-detail { font-size: 13px; color: var(--ink-mute); line-height: 1.45; } .bottom-bar-stack { display: flex; flex-direction: column; gap: 8px; align-items: stretch; } .bottom-helper { font-size: 12px; color: var(--ink-fade); text-align: center; line-height: 1.4; } .bottom-helper-faint { color: var(--ink-faint); margin-top: 2px; } .rsvp-soldout { font-size: 15px; font-weight: 600; text-align: center; color: var(--ink); margin: 0 0 6px; } .bottom-helper-sub { display: block; font-size: 11.5px; color: var(--ink-fade); margin-top: 2px; } .rsvp-calendar-row { margin-top: 8px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .rsvp-prepicker { margin: 4px 0 8px; } .rsvp-prepicker-prompt { margin: 0 0 10px; font-family: var(--font-serif); font-size: 14.5px; color: var(--ink); line-height: 1.45; } .rsvp-prepicker-prompt-sub { display: block; margin-top: 2px; font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); } .rsvp-prepicker-submit { width: 100%; height: 50px; margin-top: 8px; } .rsvp-email-book { margin: 4px 0 8px; } .rsvp-email-row { display: flex; gap: 10px; } .rsvp-email-input { flex: 1 1 auto; min-width: 0; height: 50px; } .rsvp-email-submit { flex: 0 0 auto; width: auto; height: 50px; padding: 0 28px; white-space: nowrap; } .rsvp-email-note { margin: 10px 0 0; font-family: var(--font-sans); font-size: 13px; line-height: 1.45; color: var(--ink-mute); } @media (max-width: 560px) { .rsvp-email-row { flex-direction: column; } .rsvp-email-submit { width: 100%; padding: 0; } } body.dkr .rsvp-email-note { color: var(--dkr-muted); } .rsvp-chips { display: flex; flex-wrap: wrap; gap: 8px; } .rsvp-chip { display: inline-flex; align-items: center; padding: 8px 14px; background: var(--paper); border: 1px solid rgba(0, 0, 0, 0.14); border-radius: 999px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink); cursor: pointer; user-select: none; transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease; line-height: 1.2; } .rsvp-chip:hover { border-color: var(--ink); } .rsvp-chip input[type="checkbox"] { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } .rsvp-chip:has(input:checked) { background: var(--ink); border-color: var(--ink); color: var(--paper); } .rsvp-chip:focus-within { outline: 2px solid var(--amber); outline-offset: 2px; } .rsvp-confirmed { margin: 4px 0 8px; padding: 0; background: var(--paper-2); border-radius: 14px; overflow: hidden; } .rsvp-fresh { margin: 8px 0 12px; padding: 0; background: var(--paper-2); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; } .rsvp-fresh > summary { cursor: pointer; list-style: none; } .rsvp-fresh > summary::-webkit-details-marker { display: none; } .rsvp-fresh-head-text { flex: 1; min-width: 0; } .rsvp-fresh-toggle { display: inline-flex; align-items: center; align-self: center; gap: 6px; flex: none; font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); transition: color 0.15s ease; } .rsvp-fresh > summary:hover .rsvp-fresh-toggle { color: var(--ink); } .rsvp-fresh-toggle .ui-icon { display: inline-flex; transition: transform 0.2s ease; } .rsvp-fresh[open] .rsvp-fresh-toggle .ui-icon { transform: rotate(180deg); } .rsvp-fresh-toggle-closed { display: none; } .rsvp-fresh:not([open]) .rsvp-fresh-toggle-open { display: none; } .rsvp-fresh:not([open]) .rsvp-fresh-toggle-closed { display: inline; } .rsvp-fresh:not([open]) > summary { padding-bottom: 16px; } .rsvp-fresh-head { display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px 14px; } .rsvp-fresh-check { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; flex-shrink: 0; background: rgba(198, 74, 26, 0.12); color: var(--amber); border-radius: 50%; } .rsvp-fresh-check .ui-icon svg { width: 16px; height: 16px; } .rsvp-fresh-title { margin: 0; font-family: var(--font-serif); font-size: 18px; font-weight: 500; color: var(--ink); letter-spacing: -0.01em; line-height: 1.2; } .rsvp-fresh-sub { margin: 4px 0 0; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); line-height: 1.5; } .rsvp-fresh-mail-note { margin: 0 18px 14px; font-family: var(--font-sans); font-size: 12.5px; line-height: 1.45; color: var(--ink-mute); } .rsvp-fresh-mail-link { color: var(--amber); text-decoration: none; font-weight: 600; } .rsvp-fresh-mail-link:hover { text-decoration: underline; } .rsvp-fresh-sub strong { color: var(--ink-soft); font-weight: 500; } .rsvp-fresh-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 18px 14px; } .rsvp-fresh-action { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; background: var(--paper); border: 1px solid var(--border); border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink); text-decoration: none; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease; } .rsvp-poster-cta { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 10px 18px 0; padding: 11px 18px; background: var(--amber); border: 1px solid var(--amber); border-radius: 999px; font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--paper); text-decoration: none; cursor: pointer; transition: filter 0.15s ease; } .rsvp-poster-cta:hover { filter: brightness(1.06); } .rsvp-poster-cta .ui-icon { color: var(--paper); } .rsvp-fresh-action:hover { border-color: var(--ink); background: var(--paper-2); } .rsvp-fresh-action .ui-icon { color: var(--ink-mute); } .rsvp-fresh-action:hover .ui-icon { color: var(--ink); } .cal-menu { position: relative; } .cal-menu-summary { list-style: none; } .cal-menu-summary::-webkit-details-marker { display: none; } .cal-menu-summary .ui-icon:last-child svg { width: 13px; height: 13px; transition: transform 0.2s ease; } .cal-menu[open] .cal-menu-summary .ui-icon:last-child svg { transform: rotate(180deg); } .cal-menu-options { position: absolute; top: calc(100% + 6px); left: 0; z-index: 30; display: flex; flex-direction: column; min-width: 168px; padding: 6px; background: var(--paper); border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12); } .cal-menu-option { padding: 9px 11px; border-radius: 7px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink); text-decoration: none; white-space: nowrap; } .cal-menu-option:hover { background: var(--paper-2); } .rsvp-photo-nudge { display: flex; align-items: center; gap: 10px; margin: 0 18px 14px; padding: 10px 12px; background: var(--amber-soft); border: 1px solid rgba(198, 74, 26, 0.18); border-radius: 10px; text-decoration: none; transition: background 0.15s ease; } .rsvp-photo-nudge:hover { background: rgba(198, 74, 26, 0.14); } .rsvp-photo-nudge-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex-shrink: 0; background: var(--paper); border-radius: 8px; color: var(--amber); } .rsvp-photo-nudge-text { flex: 1; min-width: 0; font-family: var(--font-sans); font-size: 12.5px; line-height: 1.45; color: var(--ink-soft); } .rsvp-photo-nudge-text strong { color: var(--ink); font-weight: 600; } .rsvp-photo-nudge-go { flex-shrink: 0; color: var(--ink-mute); } .rsvp-fresh-cancel { display: block; width: 100%; margin: 0; padding: 12px 18px; background: transparent; border: 0; border-top: 1px solid var(--border); font-family: var(--font-sans); font-size: 12px; color: var(--ink-fade); text-align: center; cursor: pointer; text-decoration: underline; text-decoration-color: var(--ink-fade); text-underline-offset: 3px; } .rsvp-fresh-cancel:hover { color: var(--ink-mute); text-decoration-color: var(--ink-mute); } .rsvp-confirmed-bar { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 10px 14px; font-family: var(--font-serif); font-size: 14.5px; color: var(--ink); line-height: 1.3; transition: background 0.15s ease; } .rsvp-confirmed-bar::-webkit-details-marker { display: none; } .rsvp-confirmed-bar:hover { background: rgba(0, 0, 0, 0.02); } .rsvp-confirmed-check { color: var(--amber); display: inline-flex; align-items: center; flex-shrink: 0; } .rsvp-confirmed-text { font-weight: 500; letter-spacing: -0.005em; flex-shrink: 0; } .rsvp-confirmed-sep { color: var(--ink-fade); flex-shrink: 0; } .rsvp-confirmed-preview { font-size: 13.5px; color: var(--ink-soft); flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .rsvp-confirmed-prompt { font-size: 13px; color: var(--ink-mute); font-style: italic; flex: 1 1 auto; min-width: 0; } .rsvp-confirmed-more { margin-left: auto; font-family: var(--font-sans); font-size: 18px; font-weight: 600; color: var(--ink-fade); line-height: 0.5; transition: color 0.15s ease; flex-shrink: 0; } .rsvp-confirmed[open] .rsvp-confirmed-more { color: var(--ink); } .rsvp-confirmed-bar:has(.rsvp-confirmed-preview) .rsvp-confirmed-more, .rsvp-confirmed-bar:has(.rsvp-confirmed-prompt) .rsvp-confirmed-more { margin-left: 0; } .rsvp-confirmed-body { border-top: 1px solid rgba(0, 0, 0, 0.06); } .rsvp-confirmed-intent { padding: 14px 14px 16px; border-top: 1px solid rgba(0, 0, 0, 0.06); } .rsvp-confirmed-menu { display: flex; flex-direction: column; padding: 4px 6px 8px; } .rsvp-confirmed-menu-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 8px; background: transparent; border: 0; font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; color: var(--ink); text-decoration: none; cursor: pointer; text-align: left; transition: background 0.15s ease; } .rsvp-confirmed-menu-item:hover { background: rgba(0, 0, 0, 0.04); } .rsvp-confirmed-menu-item .ui-icon { color: var(--ink-mute); } .rsvp-confirmed-menu-item-danger { color: var(--ink-mute); } .rsvp-confirmed-menu-item-danger:hover { color: #b34c2e; background: rgba(179, 76, 46, 0.04); } .rsvp-confirmed-menu-icon { display: inline-flex; align-items: center; justify-content: center; width: 14px; height: 14px; font-size: 12px; color: var(--ink-mute); } .rsvp-confirmed-menu-item-danger:hover .rsvp-confirmed-menu-icon { color: #b34c2e; } .rsvp-pill { display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink); text-decoration: none; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease; } .rsvp-pill:hover { border-color: var(--ink); background: var(--paper-2); } .rsvp-pill .ui-icon { color: var(--ink-mute); } .rsvp-pill:hover .ui-icon { color: var(--ink); } .rsvp-edit-reasons { margin-top: 4px; padding-top: 8px; border-top: 1px solid rgba(0, 0, 0, 0.06); } .rsvp-edit-reasons-summary { list-style: none; cursor: pointer; display: flex; align-items: baseline; gap: 8px; padding: 4px 0; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); line-height: 1.4; } .rsvp-edit-reasons-summary::-webkit-details-marker { display: none; } .rsvp-edit-reasons-summary::after { content: "›"; margin-left: auto; color: var(--ink-faint); transition: transform 0.15s ease; font-size: 14px; } .rsvp-edit-reasons[open] .rsvp-edit-reasons-summary::after { transform: rotate(90deg); } .rsvp-edit-reasons-current { font-family: var(--font-serif); font-size: 13px; color: var(--ink-soft); flex: 1; } .rsvp-edit-reasons-edit { font-weight: 600; color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-underline-offset: 3px; } .rsvp-edit-reasons-add { font-weight: 500; color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-underline-offset: 3px; } .rsvp-chips-form { padding: 10px 0 4px; display: flex; flex-direction: column; gap: 12px; } .rsvp-chips-save { align-self: flex-start; padding: 8px 16px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; background: var(--ink); color: var(--paper); border: 1px solid var(--ink); border-radius: 999px; cursor: pointer; } .rsvp-chips-save:hover { opacity: 0.9; } .rsvp-confirmed-remove { display: block; width: 100%; margin: 4px 0 0; padding: 6px; background: none; border: none; font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-fade); text-align: center; cursor: pointer; text-decoration: underline; text-decoration-color: var(--ink-fade); text-underline-offset: 3px; } .rsvp-confirmed-remove:hover { color: var(--ink-mute); text-decoration-color: var(--ink-mute); } .rsvp-inline-action { background: none; border: none; padding: 0; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink); cursor: pointer; text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-decoration-thickness: 1px; text-underline-offset: 3px; } .rsvp-inline-action:hover { text-decoration-color: var(--ink); } .rsvp-inline-action:disabled { opacity: 0.7; cursor: progress; } .rsvp-inline-action .ui-icon { margin-right: 4px; opacity: 0.6; vertical-align: -2px; } .ui-icon { display: inline-flex; align-items: center; justify-content: center; line-height: 0; vertical-align: -2px; color: inherit; } .ui-icon svg { display: block; } .bottom-curated-eyebrow { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--amber); text-align: center; margin: 0 0 6px; } .bottom-going-count { display: flex; align-items: center; gap: 10px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-mute); margin: 0 0 14px; } .bottom-going-faces { display: inline-flex; flex-shrink: 0; } .bottom-going-face { width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--paper); margin-left: -8px; object-fit: cover; } .bottom-going-face:first-child { margin-left: 0; } .bottom-going-text { color: var(--ink-soft); } .cta-btn-link { display: flex; align-items: center; justify-content: center; text-decoration: none; } .cta-btn-quiet { background: var(--surface); color: var(--ink); border: 1.5px solid var(--border); height: 46px; font-size: 14.5px; } .cta-btn-quiet:active { background: var(--bg); } .verified-pill { display: inline-flex; align-items: center; gap: 8px; background: var(--accent-soft); color: var(--accent); border-radius: 100px; padding: 7px 14px 7px 10px; font-size: 12.5px; margin-bottom: 18px; align-self: flex-start; } .verified-pill strong { color: var(--accent); font-weight: 600; } .verified-pill-check { width: 18px; height: 18px; border-radius: 50%; background: var(--accent); color: white; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; } .form-errors { background: #fef2ef; border: 1px solid #f4d4c8; color: #9a3412; border-radius: 12px; padding: 10px 14px; font-size: 13px; margin-bottom: 14px; line-height: 1.4; } .field-helper { font-size: 12.5px; color: var(--ink-fade); margin-top: 12px; text-align: center; line-height: 1.45; } .section-helper { font-size: 12px; color: var(--ink-fade); margin-top: 10px; line-height: 1.45; } .chip { transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.08s ease; } .chip:hover { border-color: var(--ink-mute); } .chip.selected:hover { border-color: var(--ink); } .check-email-address { text-align: center; font-size: 16px; font-weight: 600; color: var(--ink); word-break: break-all; margin-bottom: 16px; } .check-email-tip { font-size: 13.5px; color: var(--ink-mute); text-align: center; line-height: 1.5; background: var(--bg); border-radius: 12px; padding: 14px 16px; margin: 0 0 20px; } .check-email-actions { margin-bottom: 14px; } .check-email-open { display: block; text-align: center; margin-bottom: 12px; } .check-email-foot { font-size: 13px; color: var(--ink-mute); text-align: center; line-height: 1.5; } .check-email-foot a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--border); text-underline-offset: 3px; } .check-email-foot a:hover { text-decoration-color: var(--ink); } .welcome-line { margin: 4px 0 12px; font-family: var(--font-serif); font-size: 15px; color: var(--ink); text-align: center; line-height: 1.4; } .profile-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border-soft); } .profile-link { font-size: 12px; color: var(--ink-mute); background: var(--bg); border-radius: 100px; padding: 5px 11px; text-decoration: none; transition: background 0.15s, color 0.15s; } .profile-link:hover { background: var(--ink); color: white; } .signal-stack { display: flex; flex-direction: column; gap: 18px; margin-top: 4px; } .signal-field { display: flex; flex-direction: column; gap: 6px; } .signal-label { font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink); } .signal-textarea { font-family: var(--font-serif); font-size: 14.5px; line-height: 1.45; resize: vertical; min-height: 60px; } .signal-hint { font-size: 12px; color: var(--ink-mute); line-height: 1.4; } .profile-signals { display: flex; flex-direction: column; gap: 18px; margin: 4px 0 22px; } .profile-signal { padding: 0; } .profile-signal-key { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-mute); margin-bottom: 4px; } .profile-signal-body { font-family: var(--font-serif); font-size: 15px; line-height: 1.5; color: var(--ink); } .profile-signal-cta { display: inline-block; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--amber); text-decoration: none; margin-top: 6px; border-bottom: 1px solid var(--amber); padding-bottom: 1px; } .profile-signal-cta:hover { color: var(--ink); border-bottom-color: var(--ink); } .profile-signals-empty { background: #faf8f2; border-radius: 12px; padding: 16px 18px; margin: 4px 0 22px; } .profile-signals-empty-body { font-family: var(--font-serif); font-size: 14px; color: var(--ink-mute); line-height: 1.5; margin-bottom: 8px; } .profile-signals-empty-cta { font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--amber); text-decoration: none; } .feed-event-hero { background: var(--paper-2); border-radius: 14px; padding: 18px 20px 16px; margin: 8px 0 24px; } .feed-event-hero-when { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.16em; font-weight: 600; color: var(--amber); margin-bottom: 6px; } .feed-event-hero-title-link { text-decoration: none; color: inherit; } .feed-event-hero-title { font-family: var(--font-serif); font-size: 22px; font-weight: 600; line-height: 1.2; letter-spacing: -0.4px; margin-bottom: 6px; } .feed-event-hero-meta { font-size: 13px; color: var(--ink-mute); margin-bottom: 14px; } .feed-event-hero-state { font-size: 13px; color: var(--ink); } .feed-event-hero-state-cta { color: var(--amber); text-decoration: none; border-bottom: 1px solid var(--amber); padding-bottom: 1px; font-weight: 500; } .feed-event-hero-cta { margin-top: 4px; } .feed-attendees-section { margin-bottom: 28px; } .feed-attendees-head { font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: var(--ink); margin-bottom: 14px; } .feed-attendees { display: flex; flex-direction: column; gap: 18px; } .feed-attendee { display: flex; gap: 12px; text-decoration: none; color: inherit; align-items: flex-start; padding-bottom: 18px; border-bottom: 1px solid var(--border-soft); } .feed-attendee:last-child { border-bottom: none; padding-bottom: 0; } .feed-attendee:hover .feed-attendee-name { color: var(--amber); } .feed-attendee-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--paper-2); color: var(--ink-mute); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 500; font-family: var(--font-mono); flex-shrink: 0; margin-top: 1px; } .feed-attendee-text { flex: 1; min-width: 0; } .feed-attendee-name { font-family: var(--font-serif); font-size: 15px; font-weight: 500; color: var(--ink); line-height: 1.3; } .feed-attendee-you { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase; background: var(--amber-soft); color: var(--amber); padding: 1px 6px; border-radius: 3px; vertical-align: 2px; margin-left: 4px; } .feed-attendee-meta { font-size: 12.5px; color: var(--ink-mute); margin-top: 2px; } .feed-attendee-intents { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; } .feed-attendee-intent { font-family: var(--font-serif); font-size: 13.5px; color: var(--ink); line-height: 1.45; } .feed-attendee-intent-key { font-family: var(--font-sans); font-size: 11.5px; font-weight: 600; color: var(--ink-mute); text-transform: none; letter-spacing: 0; margin-right: 4px; } .feed-empty-line { font-family: var(--font-serif); font-size: 13.5px; color: var(--ink-mute); } .feed-filter { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; padding: 8px 12px; background: var(--amber-soft); border-radius: 10px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink); } .feed-filter-label { color: var(--ink-mute); } .feed-filter-tag { font-weight: 600; color: var(--amber); } .feed-filter-clear { margin-left: auto; font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--ink-mute); text-decoration: none; } .feed-filter-clear:hover { color: var(--ink); } .feed-directory { margin-top: 8px; padding-top: 22px; border-top: 1px solid var(--border-soft); } .feed-directory-head { font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: var(--ink); margin-bottom: 14px; } .feed-directory-list { display: flex; flex-direction: column; gap: 14px; } .feed-directory-list-cards { gap: 18px; } .feed-directory-card { display: flex; flex-direction: column; gap: 6px; } .feed-directory-row { display: flex; flex-direction: column; gap: 4px; padding: 6px 0; } .feed-directory-row-main { display: flex; gap: 12px; text-decoration: none; color: inherit; align-items: flex-start; } .feed-directory-row-main:hover .feed-attendee-name { color: var(--amber); } .feed-directory-row-main:hover .feed-directory-arrow { color: var(--amber); transform: translateX(2px); } .feed-directory-row .feed-attendee-hoping { margin-left: 52px; } .feed-directory-text { flex: 1; min-width: 0; } .feed-directory-arrow { align-self: center; color: var(--ink-fade); font-size: 18px; flex-shrink: 0; transition: color 0.15s ease, transform 0.15s ease; } .feed-directory-bio { font-family: var(--font-serif); font-size: 13px; color: var(--ink-mute); margin-top: 4px; line-height: 1.45; } .feed-prompt { display: block; border: 1px dashed var(--amber); background: var(--amber-soft); border-radius: 12px; padding: 14px 16px; margin-bottom: 24px; text-decoration: none; color: var(--ink); } .feed-prompt-eyebrow { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.16em; font-weight: 600; color: var(--amber); margin-bottom: 6px; } .feed-prompt-body { font-family: var(--font-serif); font-size: 14px; color: var(--ink); margin-bottom: 6px; line-height: 1.4; } .feed-prompt-cta { font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--amber); } .feed-list { display: flex; flex-direction: column; gap: 28px; } .feed-card { display: flex; flex-direction: column; gap: 14px; padding-bottom: 28px; border-bottom: 1px solid var(--border-soft); } .feed-card:last-child { border-bottom: none; padding-bottom: 0; } .feed-card-head { display: flex; align-items: center; } .feed-card-name-link { display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; } .feed-card-name-link:hover .feed-card-name { color: var(--amber); } .feed-card-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--paper-2); color: var(--ink-mute); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 500; font-family: var(--font-mono); flex-shrink: 0; } .feed-card-name { font-family: var(--font-serif); font-size: 15.5px; font-weight: 500; color: var(--ink); line-height: 1.2; } .feed-card-meta { font-size: 12.5px; color: var(--ink-mute); margin-top: 1px; } .feed-card-signals { display: flex; flex-direction: column; gap: 14px; padding-left: 48px; } .feed-signal {} .feed-signal-key { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-mute); margin-bottom: 4px; } .feed-signal-body { font-family: var(--font-serif); font-size: 14.5px; line-height: 1.5; color: var(--ink); } .feed-signal-cta { display: inline-block; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--amber); text-decoration: none; margin-top: 6px; border-bottom: 1px solid var(--amber); padding-bottom: 1px; } .feed-signal-cta:hover { color: var(--ink); border-bottom-color: var(--ink); } .feed-empty { background: var(--paper-2); border-radius: 12px; padding: 24px; text-align: center; color: var(--ink-mute); font-size: 14px; } .feed-empty-link { color: var(--amber); font-weight: 500; text-decoration: none; } .next-item-disabled { cursor: default; opacity: 0.85; } .next-item-disabled:active { transform: none; border-color: transparent; } .next-tag { font-size: 10.5px; font-weight: 600; color: var(--ink-mute); background: var(--surface); border-radius: 100px; padding: 3px 9px; letter-spacing: 0.4px; text-transform: uppercase; flex-shrink: 0; } .event-screen { padding: 0 !important; } .event-app-bar { position: absolute; top: 32px; left: 0; right: 0; z-index: 5; background: transparent; height: 48px; padding: 0 6px 0 14px; } .icon-btn-light { color: white; text-shadow: 0 1px 3px rgba(0,0,0,0.5); } .icon-btn-right { text-align: right; } .event-cover { position: relative; width: 100%; padding-bottom: 33.333%; background: linear-gradient(135deg, #c2410c 0%, #f97316 60%, #fbbf24 100%); overflow: hidden; flex-shrink: 0; } .event-cover-slim { padding-bottom: 25%; } .event-cover-natural { position: relative; width: 100%; background: var(--paper-2); overflow: hidden; } .event-cover-natural-img { display: block; width: 100%; height: auto; } .event-cover-overlay { position: absolute; inset: 0; background: radial-gradient(circle at 80% 20%, rgba(255,255,255,0.20) 0, transparent 40%), radial-gradient(circle at 20% 80%, rgba(0,0,0,0.18) 0, transparent 40%); pointer-events: none; } .event-cover-admin-edit { position: absolute; top: 10px; right: 10px; z-index: 2; padding: 4px 10px; background: rgba(255, 255, 255, 0.9); color: var(--ink); border-radius: 999px; font-family: var(--font-sans); font-size: 11px; font-weight: 500; letter-spacing: 0.01em; text-decoration: none; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12); transition: background 0.15s ease; } .event-cover-admin-edit:hover { background: #fff; } .event-form-cover-current { margin: 4px 0 8px; border-radius: 10px; overflow: hidden; background: var(--paper-2); } .event-form-cover-img { display: block; width: 100%; height: auto; } .event-form-cover-remove { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); cursor: pointer; user-select: none; } .partner-row { border: 1px solid var(--border); border-radius: 14px; padding: 16px; background: var(--paper); } .partner-row + .partner-row { margin-top: 14px; } .partner-row-logo { display: inline-flex; align-items: center; justify-content: center; background: #2a1640; border-radius: 10px; padding: 12px 16px; margin-bottom: 12px; } .partner-row-logo img { height: 44px; width: auto; object-fit: contain; } .partner-row-meta { display: flex; align-items: center; gap: 20px; margin-top: 12px; } .partner-row-order { display: inline-flex; align-items: center; gap: 8px; } .partner-row-pos { width: 72px; } .partner-library { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 12px; } .partner-lib-item { cursor: pointer; display: block; } .partner-lib-check { position: absolute; opacity: 0; pointer-events: none; } .partner-lib-tile { display: flex; align-items: center; justify-content: center; height: 76px; padding: 12px; background: #2a1640; border: 2px solid transparent; border-radius: 12px; transition: border-color 0.12s ease; } .partner-lib-tile img { max-height: 100%; max-width: 100%; object-fit: contain; } .partner-lib-check:checked + .partner-lib-tile { border-color: var(--amber); box-shadow: 0 0 0 3px rgba(198, 74, 26, 0.18); } .partner-lib-name { display: block; margin-top: 6px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); text-align: center; } .event-title-block { padding: 18px 24px 0; } .event-title-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; } .event-title-meta-sep { color: var(--ink-mute); font-size: 12px; line-height: 1; } .event-title-meta-prep { font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-mute); } .event-edition-mark { font-family: var(--font-mono); font-size: 11.5px; font-weight: 500; letter-spacing: 0.04em; color: var(--ink-mute); } .event-city-kicker { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-mute); text-decoration: underline; text-decoration-color: rgba(0, 0, 0, 0.15); text-decoration-thickness: 1px; text-underline-offset: 3px; } .event-city-kicker:hover { color: var(--ink); text-decoration-color: rgba(0, 0, 0, 0.4); } .event-tagline { font-family: var(--font-serif); font-size: 14.5px; font-weight: 400; line-height: 1.65; color: var(--ink-soft); margin-top: 10px; letter-spacing: -0.005em; } .event-tagline-block { margin-top: 6px; } .event-tagline-block .event-tagline { margin-top: 0; } .event-tagline-rest { font-family: var(--font-serif); font-size: 14.5px; line-height: 1.65; letter-spacing: -0.005em; color: var(--ink-soft); margin-top: 10px; display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; } .event-tagline-rest.is-revealed { display: block; -webkit-line-clamp: unset; line-clamp: unset; overflow: visible; } .event-tagline-rest p { margin: 0 0 12px; } .event-tagline-rest p:last-child { margin-bottom: 0; } .event-tagline-toggle { margin-top: 8px; background: none; border: none; padding: 0; font-family: var(--font-serif); font-size: 14px; font-weight: 400; color: var(--ink-mute); cursor: pointer; text-decoration: underline; text-decoration-color: rgba(0, 0, 0, 0.15); text-decoration-thickness: 1px; text-underline-offset: 3px; } .event-tagline-toggle:hover { color: var(--ink); text-decoration-color: rgba(0, 0, 0, 0.4); } .event-access-tag { font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-mute); background: none; border: none; padding: 0; } .event-external-tag { font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--amber); } .event-external-source { color: var(--amber); text-decoration: underline; text-underline-offset: 2px; text-decoration-color: rgba(198, 74, 26, 0.4); } .event-external-source:hover { text-decoration-color: var(--amber); } .event-external-cta { display: inline-flex; align-items: center; gap: 7px; } .event-external-cta-arrow { display: inline-flex; width: 15px; height: 15px; } .event-access-info { margin: 8px 0 12px; padding: 12px 14px; background: var(--paper-2); border-radius: 10px; font-family: var(--font-serif); font-size: 13.5px; line-height: 1.5; color: var(--ink-mute); } .event-access-info-link { color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.3); text-decoration-thickness: 1px; text-underline-offset: 3px; white-space: nowrap; } .event-access-info-link:hover { text-decoration-color: var(--ink); } .bottom-helper-link { color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.3); text-decoration-thickness: 1px; text-underline-offset: 3px; } .bottom-helper-link:hover { text-decoration-color: var(--ink); } .invite-form-block { display: block; } .invite-form-label { display: block; font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.01em; color: var(--ink-mute); margin-bottom: 6px; text-align: left; } .invite-email-input { display: block; width: 100%; height: 44px; margin-bottom: 8px; font-family: var(--font-sans); font-size: 14px; text-align: left; text-transform: none; letter-spacing: normal; } .invite-form-sub { margin: 8px 0 0; font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-fade); text-align: left; } .invite-form { display: flex; gap: 8px; } .invite-code-input { flex: 1; height: 52px; text-align: center; font-family: var(--font-mono); font-size: 14px; letter-spacing: 0.18em; text-transform: uppercase; } .invite-submit { width: auto; padding: 0 22px; height: 52px; flex-shrink: 0; } .event-host-note { margin: 6px 24px 0; padding: 18px 0 4px; border-top: 1px solid var(--border-soft); } .event-host-note-body { font-family: var(--font-serif); font-size: 15px; font-weight: 400; line-height: 1.6; color: var(--ink); letter-spacing: -0.005em; } .event-host-note-sig { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-mute); margin-top: 12px; } .bottom-watch-btn { display: block; width: 100%; margin-top: 14px; padding: 10px 16px; background: transparent; border: 1px solid rgba(0, 0, 0, 0.14); border-radius: 14px; font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; color: var(--ink-soft); cursor: pointer; transition: border-color 0.18s ease, color 0.18s ease; } .bottom-watch-btn:hover { border-color: var(--ink); color: var(--ink); } .bottom-watching { margin-top: 14px; padding: 10px 16px; border-radius: 14px; background: var(--paper-2); font-family: var(--font-sans); font-size: 13.5px; color: var(--ink); text-align: center; } .bottom-watching-check { color: var(--amber); margin-right: 4px; } .event-past-banner { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 16px 24px calc(20px + env(safe-area-inset-bottom, 0px)); background: var(--paper-2); border-top: 1px solid rgba(0, 0, 0, 0.06); } .event-past-banner-eyebrow { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-mute); } .event-past-banner-when { font-family: var(--font-serif); font-size: 14.5px; color: var(--ink-soft); } .event-brand-footer { margin: 24px 0 4px; padding-top: 16px; border-top: 1px solid var(--border-soft); font-family: var(--font-serif); font-size: 12.5px; color: var(--ink-mute); line-height: 1.5; text-align: center; } .event-brand-footer-link { color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-underline-offset: 3px; margin-left: 4px; } .event-brand-footer-link:hover { text-decoration-color: var(--ink); } .event-top-attendees { display: flex; align-items: center; gap: 12px; margin: 14px 24px 4px; padding: 6px 0; text-decoration: none; color: inherit; border-bottom: 1px solid rgba(0, 0, 0, 0.06); transition: opacity 0.18s ease; } .event-top-attendees:hover { opacity: 0.78; } .event-top-attendees-faces { display: inline-flex; align-items: center; flex-shrink: 0; } .event-top-attendees-face { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; border: 2px solid var(--paper); margin-left: -8px; background: var(--paper); } .event-top-attendees-face:first-child { margin-left: 0; } .event-top-attendees-text { flex: 1 1 auto; font-family: var(--font-sans); font-size: 13.5px; line-height: 1.4; color: var(--ink); } .event-top-attendees-text strong { font-weight: 600; } .event-top-attendees-going { color: var(--ink-mute); } .event-top-attendees-arrow { color: var(--ink-mute); font-size: 18px; line-height: 1; } .event-top-attendees-cta { flex-shrink: 0; padding: 4px 12px; border: 1px solid var(--border); border-radius: 999px; font-family: var(--font-sans); font-size: 11.5px; font-weight: 500; color: var(--ink); letter-spacing: 0.01em; white-space: nowrap; transition: border-color 0.15s ease, background 0.15s ease; } .event-top-attendees:hover .event-top-attendees-cta { border-color: var(--ink-mute); background: rgba(0, 0, 0, 0.03); } .event-rsvp-block { display: flex; flex-direction: column; gap: 8px; margin: 12px 24px 8px; } .event-host-byline-wrap { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 12px 0 6px; border-top: 1px solid var(--border-soft); } .event-host-byline { display: flex; align-items: center; gap: 12px; flex: 1 1 auto; min-width: 0; text-decoration: none; color: inherit; } .event-host-byline-link { transition: opacity 0.15s; } .event-host-byline-link:hover { opacity: 0.78; } .event-host-byline-avatar { width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0; object-fit: cover; background: var(--paper-2); display: flex; align-items: center; justify-content: center; font-family: var(--font-sans); font-weight: 600; color: var(--ink-soft); } .event-host-byline-avatar-initial { font-size: 16px; } .event-host-byline-text { min-width: 0; flex: 1 1 auto; } .event-host-byline-eyebrow { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--amber); margin-bottom: 3px; } .event-host-byline-name { font-family: var(--font-serif); font-size: 16px; font-weight: 500; letter-spacing: -0.008em; color: var(--ink); line-height: 1.2; } .event-host-byline-role { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); margin-top: 2px; } .event-host-byline-socials { display: inline-flex; align-items: center; gap: 4px; flex-shrink: 0; } .event-host-byline-social { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; color: var(--ink-mute); text-decoration: none; transition: color 0.18s ease, background 0.18s ease; } .event-host-byline-social:hover { color: var(--ink); background: var(--paper-2); } .event-outcome { padding: 14px 28px 12px; text-align: center; position: relative; } .event-outcome::before { content: ''; position: absolute; left: 50%; top: 0; width: 32px; height: 1px; background: var(--amber); opacity: 0.55; transform: translateX(-50%); } .event-outcome-body { font-family: var(--font-serif); font-style: italic; font-size: 16px; color: var(--ink-soft); line-height: 1.5; letter-spacing: -0.005em; position: relative; display: inline-block; text-wrap: balance; } .event-outcome-body::before { content: '“'; font-family: var(--font-serif); font-style: normal; font-size: 28px; color: var(--amber); opacity: 0.7; margin-right: 6px; line-height: 0; vertical-align: -7px; } .event-outcome-body::after { content: '”'; font-family: var(--font-serif); font-style: normal; font-size: 28px; color: var(--amber); opacity: 0.7; margin-left: 4px; line-height: 0; vertical-align: -7px; } @keyframes coverKenBurns { from { transform: scale(1.00); } to { transform: scale(1.06); } } @media (prefers-reduced-motion: no-preference) { .event-cover-img { animation: coverKenBurns 40s ease-in-out infinite alternate; transform-origin: center center; } } .event-info { margin: 18px 0 14px; padding: 0 24px; background: transparent; border: 0; } .event-info-row { display: flex; align-items: center; gap: 14px; padding: 6px 0; text-decoration: none; color: inherit; transition: opacity 0.15s ease; } .event-info-row + .event-info-row { margin-top: 4px; } .event-info-row-linked { cursor: pointer; } .event-info-row-linked:hover { opacity: 0.85; } .event-info-tile { width: 44px; height: 44px; flex-shrink: 0; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; background: rgba(198, 74, 26, 0.08); border: 1px solid rgba(198, 74, 26, 0.18); border-radius: 10px; color: var(--amber); opacity: 0.7; } .event-info-tile .ui-icon svg { width: 20px; height: 20px; } .event-info-tile-date { padding: 4px 0; } .event-info-tile-month { font-family: var(--font-sans); font-size: 9.5px; font-weight: 700; letter-spacing: 0.1em; line-height: 1; color: var(--amber); margin-bottom: 2px; } .event-info-tile-day { font-family: var(--font-serif); font-size: 19px; font-weight: 500; line-height: 1; color: var(--ink); letter-spacing: -0.02em; } .event-info-content { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; } .event-info-primary { font-family: var(--font-serif); font-size: 16px; font-weight: 500; color: var(--ink); line-height: 1.3; letter-spacing: -0.005em; } .event-info-secondary { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); line-height: 1.4; } .event-info-arrow { display: inline-block; margin-left: 2px; font-size: 13px; color: var(--ink-fade); transition: color 0.15s ease, transform 0.15s ease; } .event-info-row-linked:hover .event-info-arrow { color: var(--amber); transform: translate(2px, -2px); } .event-countdown-live { display: inline-flex; align-items: center; gap: 5px; margin-left: 2px; padding: 1px 8px 2px; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--amber); background: rgba(198, 74, 26, 0.10); border-radius: 999px; vertical-align: middle; } .event-countdown-live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0 0 rgba(198, 74, 26, 0.7); animation: event-countdown-live-pulse 1.6s ease-out infinite; } @keyframes event-countdown-live-pulse { 0% { box-shadow: 0 0 0 0 rgba(198, 74, 26, 0.6); } 70% { box-shadow: 0 0 0 6px rgba(198, 74, 26, 0); } 100% { box-shadow: 0 0 0 0 rgba(198, 74, 26, 0); } } .event-meta { background: transparent; border: none; border-radius: 0; padding: 4px 0 14px; margin-top: 6px; opacity: 0.9; } .event-meta-row { display: grid; grid-template-columns: 50px 1fr; gap: 10px; padding: 0; margin-bottom: 12px; align-items: baseline; } .event-meta-row:last-child { margin-bottom: 0; } .event-meta-key { font-family: var(--font-sans); font-size: 13px; letter-spacing: 0; text-transform: none; font-weight: 600; color: var(--ink); } .event-meta-value { min-width: 0; } .event-meta-line { font-family: var(--font-serif); font-weight: 400; font-size: 14px; color: var(--ink); line-height: 1.35; letter-spacing: -0.005em; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 0; flex-wrap: wrap; } .event-meta-sub { font-family: var(--font-serif); font-weight: 400; font-size: 12.5px; color: var(--ink-mute); line-height: 1.4; margin-top: 1px; font-variant-numeric: tabular-nums; } .event-meta-locked { color: var(--ink-mute); font-style: italic; } .event-meta-tag { display: inline-block; margin-left: 8px; padding: 1px 7px 2px; border: 1px solid var(--border-soft); border-radius: 999px; background: var(--paper); font-family: var(--font-sans); font-size: 10.5px; font-weight: 500; letter-spacing: 0.02em; color: var(--ink-mute); vertical-align: 2px; line-height: 1.3; } .event-meta-link { font-family: var(--font-sans); font-size: 12.5px; color: var(--amber); text-decoration: none; border-bottom: 1px solid var(--amber); padding-bottom: 0.5px; white-space: nowrap; } .event-meta-link:hover { color: var(--ink); border-bottom-color: var(--ink); } .event-meta-icon { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; min-height: 20px; color: var(--ink-mute); font-family: var(--font-sans); font-size: 13px; line-height: 1; text-decoration: none; margin-left: 2px; transition: color .15s; } .event-meta-icon:hover { color: var(--amber); } .event-cal-icon { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; min-height: 20px; color: var(--ink-mute); font-family: var(--font-sans); font-size: 14px; font-weight: 400; line-height: 1; text-decoration: none; margin-left: 4px; transition: color .15s; } .event-cal-icon:hover { color: var(--amber); } .event-countdown { color: var(--ink-mute); } .event-notes { display: flex; flex-direction: column; gap: 18px; } .event-note { display: flex; flex-direction: column; gap: 4px; } .event-note-key { font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--ink); } .event-note-body { font-family: var(--font-serif); font-size: 14.5px; color: var(--ink-mute); line-height: 1.55; } .event-past-strip { display: flex; gap: 16px; overflow-x: auto; padding-bottom: 6px; margin: 0 -24px; padding-left: 24px; padding-right: 24px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; } .event-past-strip::-webkit-scrollbar { display: none; } .event-past-card { flex: 0 0 min(80vw, 560px); text-decoration: none; color: var(--ink); scroll-snap-align: start; } .event-past-cover { width: 100%; aspect-ratio: 16 / 9; background-color: var(--paper-2); border-radius: 12px; overflow: hidden; } .event-past-cover-img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.25s ease; } .event-past-card:hover .event-past-cover-img { transform: scale(1.03); } .event-past-text { padding-top: 10px; } .event-past-title { font-family: var(--font-serif); font-weight: 500; font-size: 15px; color: var(--ink); line-height: 1.3; } .event-past-more { display: inline-block; margin-top: 14px; } .event-past-meta { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); margin-top: 2px; } .event-map-card { display: flex; align-items: center; gap: 14px; padding: 16px; background: var(--paper-2); border-radius: 12px; text-decoration: none; color: var(--ink); transition: background 0.15s; } .event-map-card:hover { background: #ebe6d6; } .event-map-card-pin { font-size: 20px; flex-shrink: 0; } .event-map-card-text { flex: 1; min-width: 0; } .event-map-card-name { font-family: var(--font-serif); font-weight: 500; font-size: 14.5px; line-height: 1.3; } .event-map-card-sub { font-size: 12.5px; color: var(--ink-mute); margin-top: 2px; } .event-map-card-cta { font-family: var(--font-sans); font-size: 13px; color: var(--amber); font-weight: 500; flex-shrink: 0; } .event-arrival-note { font-family: var(--font-serif); font-style: italic; font-size: 13px; line-height: 1.55; color: var(--ink-dim); margin: 12px 4px 0; padding-left: 12px; border-left: 1px solid rgba(0, 0, 0, 0.1); } .event-intent { background: #faf8f2; border-radius: 12px; padding: 16px 18px; margin-top: 6px; } .event-intent-helper { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); line-height: 1.5; margin: -6px 0 14px; } .event-intent-form .signal-stack { gap: 14px; } .event-intent-save { margin-top: 14px; width: auto; padding: 8px 18px; height: auto; font-size: 13.5px; } .profile-pinned { position: relative; display: block; padding: 10px 28px 10px 12px; background: var(--bg); border: 1px solid var(--border-soft); border-radius: 10px; text-decoration: none; color: inherit; transition: border-color 0.18s ease, transform 0.12s ease; } .profile-pinned:hover { border-color: rgba(0, 0, 0, 0.2); } .profile-pinned:active { transform: scale(0.99); } .profile-pinned-host { display: block; font-family: var(--font-serif); font-size: 15px; font-weight: 500; color: var(--ink); line-height: 1.25; } .profile-pinned-url { display: block; margin-top: 3px; font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); word-break: break-all; line-height: 1.45; } .profile-pinned-arrow { position: absolute; top: 10px; right: 12px; font-size: 13px; color: var(--ink-mute); } @keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } } @media (prefers-reduced-motion: no-preference) { .event-cover { animation: fadeUp 0.5s ease-out both; } .event-title-block { animation: fadeUp 0.5s ease-out 0.1s both; } .event-person-avatar { transition: transform 0.18s ease; } .event-person-link:hover .event-person-avatar, .event-person:hover .event-person-avatar { transform: scale(1.05); } } .event-meta-row .event-cal-link { font-size: 13px; } .event-meta-row .event-cal-link + .event-cal-link::before { content: '·'; color: var(--ink-mute); margin: 0 10px; border: 0; } .event-detail-line { font-family: var(--font-serif); font-weight: 500; font-size: 16px; color: var(--ink); letter-spacing: -0.005em; line-height: 1.3; } .event-detail-sub { font-size: 13px; color: var(--ink-mute); margin-top: 4px; line-height: 1.5; } .event-people { display: flex; flex-direction: column; gap: 10px; } .event-person-tile { display: flex; flex-direction: column; gap: 10px; padding: 12px 14px 14px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; min-width: 0; transition: border-color 0.15s ease; } .event-person-tile:has(.event-person-tile-link:hover) { border-color: rgba(0, 0, 0, 0.2); } .event-person-tile-main { display: flex; align-items: flex-start; gap: 12px; width: 100%; } .event-person-tile-text { flex: 1 1 auto; min-width: 0; } .event-person-tile-link { text-decoration: none; color: inherit; transition: color 0.15s ease; } .event-person-tile-link:hover .event-person-tile-name { color: var(--amber); } .event-person-tile-avatar { width: 72px; height: 72px; border-radius: 50%; background: var(--paper-2); color: var(--ink-mute); display: flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 22px; font-weight: 500; object-fit: cover; overflow: hidden; flex-shrink: 0; } img.event-person-tile-avatar-image { display: block; background: var(--paper-2); } .event-person-tile-name { font-family: var(--font-serif); font-weight: 500; font-size: 14.5px; color: var(--ink); letter-spacing: -0.005em; line-height: 1.3; width: 100%; } .event-person-tile-host-tag { display: inline-block; margin-left: 2px; padding: 1px 6px 2px; font-family: var(--font-sans); font-size: 9.5px; font-weight: 600; color: var(--amber); background: rgba(198, 74, 26, 0.10); border-radius: 4px; vertical-align: middle; letter-spacing: 0.06em; text-transform: uppercase; } .event-person-tile-host-tag-speaker { color: var(--ink); background: rgba(0, 0, 0, 0.08); } .event-person-tile-admin { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; padding-top: 10px; border-top: 1px dashed var(--border); } .feed-directory-card-self { background: radial-gradient(circle at 12% -8%, rgba(198, 74, 26, 0.10) 0%, transparent 42%), linear-gradient(180deg, rgba(255, 255, 255, 0.90) 0%, rgba(255, 255, 255, 0.40) 22%, rgba(255, 255, 255, 0) 58% ), var(--paper-2); border: 1px solid rgba(230, 212, 194, 0.7); border-radius: 28px; padding: 0 4px 14px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 0 0 1px rgba(255, 255, 255, 0.35), 0 1px 2px rgba(26, 24, 20, 0.06), 0 4px 12px rgba(26, 24, 20, 0.05), 0 18px 44px rgba(26, 24, 20, 0.08), 0 36px 72px rgba(198, 74, 26, 0.05); } .feed-directory-card-self .founder-card { background: transparent; border: 0; box-shadow: none; border-radius: 0; margin: 0; } .event-people-featured { padding: 2px 14px; border-radius: 16px; background: rgba(198, 74, 26, 0.045); border: 1px solid rgba(198, 74, 26, 0.13); } .event-people-featured .founder-card, .event-people-featured .event-person-tile { margin: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0.97) 0%, rgba(255, 255, 255, 0.84) 100%), var(--paper-2); border-color: rgba(230, 212, 194, 0.85); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 1px 2px rgba(26, 24, 20, 0.05), 0 10px 30px rgba(26, 24, 20, 0.10); } .event-section-label-going { margin-top: 30px; } #event_participants .feed-directory-list-cards > * { content-visibility: auto; contain-intrinsic-size: auto 84px; } .event-roster-list { gap: 0; } .event-roster-list > .feed-directory-card { border-bottom: 1px solid var(--border); } .event-roster-list > .feed-directory-card:last-child { border-bottom: none; } .event-roster-card { display: flex; align-items: center; gap: 12px; padding: 13px 0; text-decoration: none; } .event-roster-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; display: block; } .event-roster-avatar-initial { display: inline-flex; align-items: center; justify-content: center; background: var(--paper-2); color: var(--ink-mute); font-family: var(--font-serif); font-size: 18px; } .event-roster-text { flex: 1 1 auto; min-width: 0; } .event-roster-name-row { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; } .event-roster-name { font-family: var(--font-serif); font-size: 16px; font-weight: 400; line-height: 1.2; color: var(--ink); } .event-roster-meta { margin-top: 2px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .event-roster-track { display: inline-block; margin-top: 5px; font-family: var(--font-sans); font-size: 11px; font-weight: 600; color: var(--accent); padding: 2px 9px; border-radius: 999px; background: var(--accent-soft); } .event-roster-arrow { flex: 0 0 auto; font-size: 20px; line-height: 1; color: var(--ink-fade); } .event-roster-role { flex: 0 0 auto; font-family: var(--font-sans); font-size: 9.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 2px 7px; border-radius: 999px; background: var(--accent-soft); color: var(--accent); } .event-roster-list > .feed-directory-card-self { margin: 4px 0; padding: 2px 12px; border: 1px solid rgba(198, 74, 26, 0.16); border-radius: 14px; background: rgba(198, 74, 26, 0.05); box-shadow: none; } .roster-tabs { margin-top: 30px; } .roster-tabs .roster-tab-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; } .roster-tab-list { display: flex; gap: 8px; margin-bottom: 16px; } .roster-tab { display: inline-flex; align-items: baseline; gap: 6px; padding: 8px 14px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-mute); cursor: pointer; transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease; } .roster-tab:hover { color: var(--ink); border-color: var(--ink-fade); } .roster-tab .event-section-count { color: inherit; } .roster-tab .event-section-count::before { content: ""; } .roster-tab-input-going:checked ~ .roster-tab-list .roster-tab-going { background: var(--ink); border-color: var(--ink); color: var(--paper); } .roster-tab-input-showcasing:checked ~ .roster-tab-list .roster-tab-showcasing { background: var(--accent); border-color: var(--accent); color: #fff; } .roster-tab-input-going:focus-visible ~ .roster-tab-list .roster-tab-going, .roster-tab-input-showcasing:focus-visible ~ .roster-tab-list .roster-tab-showcasing { outline: 2px solid var(--amber); outline-offset: 2px; } .roster-tab-panel { display: none; } .roster-tab-input-showcasing:checked ~ .roster-panel-showcasing, .roster-tab-input-going:checked ~ .roster-panel-going { display: block; } .event-showcase-note { margin: -4px 0 18px; font-family: var(--font-serif); font-size: 13px; line-height: 1.5; color: var(--ink-mute); max-width: 60ch; } .event-showcase-other-label { margin-top: 28px; } .event-showcase-alllink { text-decoration: underline; } .event-showcase-list { list-style: none; margin: 0; padding: 0; } .event-showcase-item { padding: 18px 0; border-bottom: 1px solid var(--border); } .event-showcase-item:last-child { border-bottom: none; } .event-showcase-support { display: flex; align-items: center; gap: 14px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); } .event-showcase-count { font-family: var(--font-sans); font-size: 11.5px; font-weight: 600; color: var(--ink-mute); } .event-showcase-form { margin: 0; } .event-showcase-btn { appearance: none; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--surface); color: var(--ink-soft); border-radius: 999px; padding: 6px 13px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease; } .event-showcase-btn:hover { border-color: var(--accent); color: var(--accent); } .event-showcase-btn.is-on { background: var(--accent-soft); border-color: var(--accent-soft); color: var(--accent); } .event-showcase-btn.is-on svg { fill: currentColor; } .event-showcase-hint { font-family: var(--font-serif); font-size: 12.5px; color: var(--ink-mute); } a.event-showcase-hint:hover { color: var(--ink); } .screen .demoday-editions { margin: 2px 0 14px; } .demoday-list { list-style: none; margin: 0; padding: 0; } .demoday-item { padding: 18px 0; border-bottom: 1px solid var(--border); } .demoday-item:last-child { border-bottom: none; } .demoday-gallery { display: flex; gap: 12px; margin: 4px 0 20px; padding-bottom: 4px; overflow-x: auto; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; } .demoday-gallery::-webkit-scrollbar { display: none; } .demoday-slide { display: block; position: relative; flex: 0 0 260px; margin: 0; overflow: hidden; border-radius: 14px; background: var(--paper-2); scroll-snap-align: start; text-decoration: none; transition: transform 0.18s ease, box-shadow 0.18s ease; } .demoday-slide:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12); } .demoday-slide-img { display: block; width: 100%; height: 168px; object-fit: cover; } .demoday-slide-city { position: absolute; inset: auto 0 0 0; padding: 22px 12px 10px; font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.04em; color: #fff; background: linear-gradient(to top, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0)); } .demoday-cities-head { margin: 0 0 10px; font-family: var(--font-serif); font-size: 13px; line-height: 1.5; color: var(--ink-mute); } .demoday-upvote-note { margin: 0 0 14px; } .demoday-city-link { color: var(--amber); text-decoration: underline; text-underline-offset: 2px; } .demoday-city-link:hover { text-decoration: none; } .screen .demoday-cities { margin: 0 0 8px; } .demoday-city-section { scroll-margin-top: 12px; } .demoday-city-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; margin: 22px 0 2px; } .demoday-city-heading { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 18px; letter-spacing: -0.01em; color: var(--ink); } .demoday-city-event { display: inline-flex; align-items: center; gap: 3px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--amber); text-decoration: none; } .demoday-city-event:hover { text-decoration: underline; } .demoday-city-event svg { width: 13px; height: 13px; } .showcase-compact-city { margin: 0 0 12px; font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-fade); } .showcase-compact-row { display: flex; align-items: center; gap: 16px; } .showcase-compact-main { flex: 1 1 auto; min-width: 0; } .showcase-compact-upvote { flex: 0 0 auto; } .showcase-compact-idea { margin: 0; font-family: var(--font-serif); font-size: 17px; font-weight: 400; line-height: 1.4; color: var(--ink); overflow-wrap: anywhere; } .showcase-compact-visit { display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--ink-mute); text-decoration: none; } .showcase-compact-visit:hover { color: var(--accent); } .showcase-compact-visit svg { width: 13px; height: 13px; } .showcase-compact-by { display: flex; align-items: center; gap: 9px; margin-top: 8px; } .upvote-box { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; width: 50px; min-height: 50px; padding: 6px 0; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); color: var(--ink-mute); font-family: var(--font-sans); text-decoration: none; cursor: pointer; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .upvote-box-wrap { display: contents; } .upvote-box-form { margin: 0; } .upvote-box svg { width: 16px; height: 16px; } .upvote-box-count { font-size: 12px; font-weight: 700; line-height: 1; } .upvote-box:hover { border-color: var(--accent); color: var(--accent); } .upvote-box.is-on { border-color: var(--accent); color: var(--accent); } .upvote-box.is-on svg { fill: currentColor; } .showcase-compact-by-avatar { flex: 0 0 auto; display: block; } .showcase-compact-by-img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; display: block; } .showcase-compact-by-text { min-width: 0; font-family: var(--font-sans); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .showcase-compact-by-name { font-weight: 600; color: var(--ink); text-decoration: none; } .showcase-compact-by-name:hover { text-decoration: underline; } .showcase-compact-by-meta { color: var(--ink-mute); } .showcase-upvoters { display: flex; align-items: center; flex-wrap: wrap; margin-top: 10px; } .showcase-upvoters:empty { display: none; } .showcase-upvoters-label { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); margin-right: 9px; } .showcase-upvoter { display: inline-flex; margin-right: -6px; text-decoration: none; transition: transform 0.12s ease; } .showcase-upvoter:hover { transform: translateY(-2px); z-index: 2; } .showcase-upvoter-face { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; border: 1.5px solid var(--paper); background: var(--paper-2); box-sizing: border-box; } .showcase-upvoters-toggle:not(:checked) ~ .showcase-upvoter-folded { display: none; } .showcase-upvoters-more { margin-left: 14px; font-family: var(--font-sans); font-size: 11.5px; color: var(--accent); cursor: pointer; } .showcase-upvoters-more:hover { text-decoration: underline; } .showcase-upvoters-toggle:checked ~ .showcase-upvoters-more .showcase-upvoters-more-show, .showcase-upvoters-toggle:not(:checked) ~ .showcase-upvoters-more .showcase-upvoters-more-hide { display: none; } .showcase-upvoters-toggle:focus-visible ~ .showcase-upvoters-more { outline: 2px solid var(--amber); outline-offset: 3px; } .showcase-compact-video { margin-top: 12px; } .event-attendee-self { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 4px 0; } .event-attendee-self-btn { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; background: var(--paper); border: 1px solid var(--border); border-radius: 999px; font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--ink); text-decoration: none; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease; } .event-attendee-self-btn:hover { border-color: var(--ink); background: var(--paper-2); } .event-attendee-self-btn .ui-icon { color: var(--ink-mute); } .event-attendee-self-btn:hover .ui-icon { color: var(--ink); } .event-attendee-self-btn-danger { color: var(--ink-fade); border-color: var(--border-soft); } .event-attendee-self-btn-danger:hover { color: #b34c2e; border-color: rgba(179, 76, 46, 0.5); background: rgba(179, 76, 46, 0.04); } .event-attendee-self-intent { margin: 8px 4px 0; background: var(--paper-2); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; } .event-attendee-self-intent-summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 10px 14px; font-family: var(--font-serif); font-size: 13.5px; color: var(--ink); line-height: 1.4; transition: background 0.15s ease; } .event-attendee-self-intent-summary::-webkit-details-marker { display: none; } .event-attendee-self-intent-summary:hover { background: rgba(0, 0, 0, 0.02); } .event-attendee-self-intent-check { color: var(--amber); font-weight: 600; flex-shrink: 0; } .event-attendee-self-intent-preview { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-soft); } .event-attendee-self-intent-prompt { flex: 1 1 auto; min-width: 0; font-style: italic; color: var(--ink-mute); font-size: 13px; } .event-attendee-self-intent-edit { flex-shrink: 0; margin-left: auto; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--amber); } .event-attendee-self-intent-form { padding: 14px 14px 16px; border-top: 1px solid var(--border); } .event-attendee-admin { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 4px 0; } .event-attendee-admin-btn { display: inline-flex; align-items: center; padding: 4px 10px; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); background: transparent; border: 1px solid var(--border); border-radius: 999px; cursor: pointer; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .event-attendee-admin-btn:hover { border-color: var(--ink-mute); color: var(--ink); } .event-attendee-admin-btn.is-on { color: var(--amber); background: rgba(198, 74, 26, 0.08); border-color: rgba(198, 74, 26, 0.4); } .event-attendee-admin-btn.is-on:hover { background: rgba(198, 74, 26, 0.14); border-color: var(--amber); } .event-attendee-track-form { display: inline-flex; align-items: center; gap: 6px; } .event-attendee-track-input { padding: 4px 10px; font-family: var(--font-sans); font-size: 12px; color: var(--ink); background: var(--surface, #fff); border: 1px solid var(--border); border-radius: 999px; min-width: 150px; } .event-attendee-track-input:focus { outline: none; border-color: var(--amber); } .event-attendee-admin-btn-danger { color: var(--ink-fade); border-color: var(--border-soft); } .event-attendee-admin-btn-danger:hover { color: #b34c2e; border-color: rgba(179, 76, 46, 0.5); background: rgba(179, 76, 46, 0.04); } .feed-directory-card-hidden { opacity: 0.55; border-style: dashed; } .event-admin-add-attendee { margin: 0 0 16px; padding: 12px 14px; border: 1px dashed var(--border); border-radius: 12px; background: rgba(198, 74, 26, 0.04); } .event-admin-add-attendee-label { display: block; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 8px; } .event-admin-add-attendee-row { display: flex; gap: 8px; align-items: stretch; } .event-admin-add-attendee-input { flex: 1 1 auto; min-width: 0; padding: 8px 10px; font-family: var(--font-sans); font-size: 14px; color: var(--ink); background: #fff; border: 1px solid var(--border); border-radius: 8px; } .event-admin-add-attendee-input::placeholder { color: var(--ink-mute); opacity: 0.7; } .event-admin-add-attendee-btn { flex: 0 0 auto; padding: 8px 16px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: #fff; background: var(--amber); border: 1px solid var(--amber); border-radius: 8px; cursor: pointer; transition: background 0.15s ease, border-color 0.15s ease; } .event-admin-add-attendee-btn:hover { background: #a8551b; border-color: #a8551b; } .event-person-tile-admin-btn { display: inline-flex; align-items: center; padding: 4px 10px; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); background: transparent; border: 1px solid var(--border); border-radius: 999px; cursor: pointer; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .event-person-tile-admin-btn:hover { border-color: var(--ink-mute); color: var(--ink); } .event-person-tile-admin-btn.is-on { color: var(--amber); background: rgba(198, 74, 26, 0.08); border-color: rgba(198, 74, 26, 0.4); } .event-person-tile-admin-btn.is-on:hover { background: rgba(198, 74, 26, 0.14); border-color: var(--amber); } .event-person-tile-role { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); margin-top: 3px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .event-person-tile-line { margin: 8px 0 0; font-family: var(--font-serif); font-size: 13px; line-height: 1.45; color: var(--ink); overflow-wrap: anywhere; } .event-person-tile-lead { font-family: var(--font-sans); font-size: 9.5px; font-weight: 600; letter-spacing: 0.06em; color: var(--ink-fade); text-transform: uppercase; margin-right: 6px; } .event-person-tile-line-badge { color: var(--ink-soft); } .event-person-tile-line-ask { color: var(--amber); } .event-person-tile-line-ask .event-person-tile-lead { color: var(--amber); opacity: 0.75; } a.event-person-tile-line-ask { display: block; text-decoration: none; border-bottom: 1px solid transparent; transition: border-color 0.15s ease; } a.event-person-tile-line-ask-link:hover { border-bottom-color: var(--amber); } .event-meta-block { padding: 22px 24px 18px; border-bottom: 1px solid var(--border-soft); } .event-when-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; letter-spacing: 1.4px; color: var(--accent); background: var(--accent-soft); padding: 6px 12px; border-radius: 100px; margin-bottom: 14px; } .event-when-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px rgba(194,65,12,0.18); animation: pulse-accent 1.6s ease-in-out infinite; } @keyframes pulse-accent { 0%, 100% { box-shadow: 0 0 0 4px rgba(194,65,12,0.18); } 50% { box-shadow: 0 0 0 7px rgba(194,65,12,0.06); } } .event-headline { font-family: var(--font-serif); font-size: clamp(28px, 7.5vw, 38px); font-weight: 400; letter-spacing: -0.025em; line-height: 1.08; color: var(--ink); margin-bottom: 14px; text-wrap: balance; } .event-edition-inline { font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--amber); } .event-access-note { margin: 14px 0 8px; font-family: var(--font-serif); font-size: 13.5px; font-weight: 400; color: var(--ink-mute); line-height: 1.55; } .event-access-note-link { color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.3); text-decoration-thickness: 1px; text-underline-offset: 3px; white-space: nowrap; } .event-access-note-link:hover { text-decoration-color: var(--ink); } .event-when-line { font-size: 14px; color: var(--ink-mute); font-weight: 500; } .event-when-zone { font-size: 10.5px; letter-spacing: 0.5px; font-weight: 600; color: var(--ink-fade); margin-left: 2px; } .event-when-sep { margin: 0 6px; color: var(--ink-fade); } .event-body { padding-top: 0; } .event-hero { position: relative; background: linear-gradient(160deg, #7c2d12 0%, #c2410c 45%, #f97316 100%); color: white; padding: 96px 24px 28px; overflow: hidden; isolation: isolate; min-height: 320px; display: flex; flex-direction: column; justify-content: flex-end; } .event-hero-overlay { position: absolute; inset: 0; background: radial-gradient(circle at 85% 15%, rgba(255,255,255,0.18) 0, transparent 35%), radial-gradient(circle at 15% 85%, rgba(0,0,0,0.18) 0, transparent 40%); pointer-events: none; z-index: 0; } .event-hero-image { background-size: cover; background-position: center; background-repeat: no-repeat; min-height: 360px; padding: 96px 24px 24px; } .event-hero-image .event-hero-overlay { background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.0) 35%, rgba(0,0,0,0.0) 50%, rgba(0,0,0,0.55) 85%, rgba(0,0,0,0.78) 100%); } .event-cover-has-image { background: var(--bg); } .event-cover-has-image::before { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http%3A//www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); opacity: 0.10; mix-blend-mode: overlay; z-index: 2; } .event-cover-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(0.95) brightness(0.99) contrast(0.98) sepia(0.08); } .event-cover-has-image::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(20, 18, 14, 0.22) 0%, rgba(20, 18, 14, 0) 20%); z-index: 1; } .event-hero-content { position: relative; z-index: 1; } .event-hero-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; letter-spacing: 1.4px; background: rgba(255,255,255,0.18); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); padding: 6px 12px; border-radius: 100px; margin-bottom: 18px; } .event-hero-dot { width: 6px; height: 6px; border-radius: 50%; background: #fbbf24; box-shadow: 0 0 0 4px rgba(251,191,36,0.25); animation: pulse 1.6s ease-in-out infinite; } @keyframes pulse { 0%, 100% { box-shadow: 0 0 0 4px rgba(251,191,36,0.25); } 50% { box-shadow: 0 0 0 7px rgba(251,191,36,0.10); } } .event-hero-title { font-size: 30px; font-weight: 700; letter-spacing: -0.7px; line-height: 1.12; margin-bottom: 16px; } .event-hero-time { font-size: 14.5px; opacity: 0.92; font-weight: 500; } .event-hero-time-zone { font-size: 11px; letter-spacing: 0.5px; font-weight: 600; opacity: 0.75; margin-left: 2px; } .event-hero-sep { margin: 0 6px; opacity: 0.55; } .event-body { padding: 26px 24px 0; } .event-section { padding: 36px 0 4px; border-top: 1px solid rgba(0, 0, 0, 0.06); } .event-section:first-of-type { padding-top: 0; border-top: none; } .event-section-people .event-people { margin-top: 20px; } .event-audience-toggle { position: absolute; width: 0; height: 0; opacity: 0; pointer-events: none; } .event-audience-rest { display: none; } .event-audience-toggle:checked ~ .event-audience-rest { display: block; } .event-audience-more { display: inline-flex; align-items: center; margin-top: 14px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--amber); cursor: pointer; user-select: none; } .event-audience-more:hover { text-decoration: underline; } .event-audience-toggle:focus-visible ~ .event-audience-more { outline: 2px solid var(--amber); outline-offset: 3px; } .event-audience-more-close { display: none; } .event-audience-toggle:checked ~ .event-audience-more .event-audience-more-open { display: none; } .event-audience-toggle:checked ~ .event-audience-more .event-audience-more-close { display: inline; } .event-rails-sub { margin: -8px 0 22px; font-family: var(--font-sans); font-size: 14px; line-height: 1.5; color: var(--ink-soft); max-width: var(--reading-max); } .event-rail { margin: 0 0 26px; } .event-rail:last-child { margin-bottom: 4px; } .event-rail-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; } .event-rail-title { margin: 0; font-family: var(--font-sans); font-size: 15px; font-weight: 600; color: var(--ink); } .event-rail-all { flex: none; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--amber); text-decoration: none; white-space: nowrap; } .event-rail-scroller { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding: 2px 4px 8px 0; scrollbar-width: none; } .event-rail-scroller::-webkit-scrollbar { display: none; } .event-rail-card { flex: 0 0 auto; width: 200px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 6px; padding: 14px; border: 1px solid var(--border-soft); border-radius: 14px; background: var(--paper); text-decoration: none; transition: border-color 0.15s ease, transform 0.15s ease; } .event-rail-card:hover { border-color: var(--amber-soft); transform: translateY(-1px); } .event-rail-card-media { width: 190px; padding: 0; border: none; background: transparent; border-radius: 0; } .event-rail-card-book { width: 158px; } .event-rail .episode-rail-card { width: min(76vw, 340px); } .event-rails-heading { font-family: var(--font-serif); font-size: 20px; font-weight: 500; color: var(--ink); margin: 0 0 4px; } .event-rail-card-text { width: 210px; min-height: 140px; } .event-rail-card-link { display: flex; flex-direction: column; gap: 6px; text-decoration: none; } .event-rail-card-media .event-rail-card-link .event-rail-card-title { margin-top: 8px; } .event-rail-card .poll-faces { margin-top: 4px; } .event-rail-card .series-actions { margin-top: 6px; flex-wrap: wrap; } .event-rail-card-share { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--amber); } .event-rail-eyebrow { font-family: var(--font-sans); font-size: 10.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-dim); } .event-rail-card-title { font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; line-height: 1.35; color: var(--ink); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .event-rail-card-media .event-rail-card-title { -webkit-line-clamp: 2; margin-top: 8px; } .event-rail-card-meta { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .event-rail-card-brief { font-family: var(--font-sans); font-size: 12px; line-height: 1.4; color: var(--ink-soft); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .event-rail-thumb { display: block; aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; background: var(--border-soft); } .event-rail-thumb-book { aspect-ratio: 2 / 3; background: var(--paper); } .event-rail-thumb-img { width: 100%; height: 100%; object-fit: cover; display: block; } .event-rail-thumb-book .event-rail-thumb-img { object-fit: contain; } .event-rail-thumb-blank { background: var(--border-soft); } .event-rail-card-wrap { position: relative; flex: 0 0 auto; scroll-snap-align: start; } .event-rail-unpin-form { position: absolute; top: 6px; right: 6px; margin: 0; z-index: 2; } .event-rail-unpin { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; padding: 0; border: none; border-radius: 50%; background: rgba(26, 24, 20, 0.72); color: #fff; font-size: 15px; line-height: 1; cursor: pointer; } .event-rail-unpin:hover { background: var(--ink); } .event-rail-add { display: flex; gap: 6px; margin-top: 10px; } .event-rail-add-input { flex: 1 1 auto; min-width: 0; max-width: 280px; height: 34px; padding: 0 10px; border: 1px solid var(--border-soft); border-radius: 9px; font-family: var(--font-sans); font-size: 13px; background: var(--paper); } .event-rail-add-btn { flex: none; height: 34px; padding: 0 14px; border: 1px solid var(--border); border-radius: 9px; background: var(--paper); color: var(--ink); font-family: var(--font-sans); font-size: 13px; font-weight: 600; cursor: pointer; } .event-rail-add-btn:hover { border-color: var(--amber); color: var(--amber); } .event-rail-thumb { position: relative; } .event-rail-card-media .episode-thumb-play { z-index: 1; } .event-rail-scroller-wide .event-rail-card-wrap { width: 300px; } .poll-votable { display: flex; flex-direction: column; gap: 10px; width: 100%; padding: 16px; border: 1px solid var(--border-soft); border-radius: 14px; background: var(--paper); transition: opacity 0.15s ease; } .poll-votable.is-voting { opacity: 0.55; pointer-events: none; } .poll-votable-head { display: flex; flex-direction: column; gap: 6px; text-decoration: none; } .poll-votable-q { font-family: var(--font-sans); font-size: 14px; font-weight: 600; line-height: 1.35; color: var(--ink); } .poll-votable-options { display: flex; flex-direction: column; gap: 8px; } .poll-votable-cta { font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--amber); text-decoration: none; } .poll-votable-other { display: flex; gap: 6px; margin-top: 10px; } .poll-votable-other-input { flex: 1 1 auto; min-width: 0; height: 34px; padding: 0 10px; border: 1px solid var(--border-soft); border-radius: 9px; font-family: var(--font-sans); font-size: 13px; background: var(--paper); } .poll-votable-other-input:focus { outline: none; border-color: var(--amber); } .poll-votable-other-btn { flex: none; height: 34px; padding: 0 14px; border: 1px solid var(--border); border-radius: 9px; background: var(--paper); color: var(--ink); font-family: var(--font-sans); font-size: 13px; font-weight: 600; cursor: pointer; } .poll-votable-other-btn:hover { border-color: var(--amber); color: var(--amber); } .poll-strip-section { margin: 4px 0 30px; } .poll-strip-title { font-family: var(--font-serif); font-size: 18px; color: var(--ink); margin: 0 0 12px; } .event-rail-player { margin-top: 14px; } .event-rail-player-frame { position: relative; aspect-ratio: 16 / 9; width: 100%; border-radius: 12px; overflow: hidden; background: #000; } .event-rail-player-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } .event-rail-player-caption { margin-top: 8px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink-soft); } .episode-rail-card.is-playing { outline: 2px solid var(--amber); outline-offset: 2px; } .event-section-label { display: flex; align-items: baseline; gap: 8px; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 18px; padding-bottom: 0; border-bottom: none; } .event-section-count { background: transparent; color: var(--ink-mute); font-size: 11px; font-weight: 600; padding: 0; border-radius: 0; letter-spacing: 0.14em; text-transform: uppercase; } .event-section-count::before { content: "· "; opacity: 0.5; } .event-venue-card { display: flex; align-items: flex-start; gap: 14px; padding: 0; background: transparent; border: none; border-radius: 0; text-decoration: none; color: var(--ink); margin-top: 0; } .event-venue-card:hover { background: transparent; } .event-venue-card:hover .event-venue-cta { color: var(--ink); border-bottom-color: var(--ink); } .event-venue-card-static { cursor: default; } .event-venue-icon { font-size: 16px; width: auto; height: auto; background: transparent; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; } .event-venue-text { flex: 1; min-width: 0; } .event-venue-name { font-size: 15px; line-height: 1.3; } .event-venue-address { font-size: 13px; color: var(--ink-mute); margin-top: 3px; line-height: 1.45; } .event-venue-cta { display: inline-block; font-family: var(--font-sans); font-size: 12.5px; color: var(--amber); font-weight: 500; margin-top: 8px; border-bottom: 1px solid var(--amber); padding-bottom: 1px; transition: color .15s, border-color .15s; } .event-speakers { display: flex; flex-direction: column; gap: 14px; } .event-speaker { display: flex; gap: 12px; align-items: flex-start; } .event-speaker-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--accent-soft); color: var(--accent); display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 600; flex-shrink: 0; } .event-speaker-text { flex: 1; min-width: 0; } .event-speaker-name { font-size: 14.5px; font-weight: 600; } .event-speaker-role { font-size: 12.5px; color: var(--ink-mute); margin-top: 1px; } .event-speaker-bio { font-size: 13px; color: var(--ink-mute); margin-top: 6px; line-height: 1.5; } .event-about-text { font-size: 14.5px; line-height: 1.6; color: var(--ink); } .event-about-text p { margin-bottom: 10px; } .event-about-text p:last-child { margin-bottom: 0; } .event-agenda { display: flex; flex-direction: column; gap: 16px; } .event-agenda-row { display: grid; grid-template-columns: 92px 1fr; gap: 14px; } .event-agenda-time { font-family: var(--font-sans); font-size: 11.5px; font-weight: 500; color: var(--ink-dim); padding-top: 4px; letter-spacing: 0.01em; } .event-agenda-title { font-family: var(--font-serif); font-size: 15px; font-weight: 400; line-height: 1.35; color: var(--ink); letter-spacing: -0.005em; } .event-agenda-detail { font-family: var(--font-serif); font-size: 13.5px; color: var(--ink-soft); margin-top: 3px; line-height: 1.55; } .event-map { position: relative; width: 100%; padding-bottom: 62%; border-radius: 12px; overflow: hidden; background: var(--paper-2); flex-shrink: 0; } .event-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; filter: saturate(0.9); } .event-map-cta { display: inline-block; margin-top: 10px; font-size: 13px; color: var(--amber); text-decoration: none; border-bottom: 1px solid var(--amber); padding-bottom: 1px; } .event-map-cta:hover { color: var(--ink); border-bottom-color: var(--ink); } .event-participants { display: flex; flex-direction: column; background: transparent; border-radius: 0; padding: 0; } .event-participant { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border-soft); } .event-participant:last-child { border-bottom: none; padding-bottom: 0; } .event-participant:first-child { padding-top: 0; } .event-participant-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--paper-2); color: var(--ink-mute); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; flex-shrink: 0; font-family: var(--font-mono); } .event-participant-text { flex: 1; min-width: 0; } .event-participant-name { font-size: 14px; font-weight: 600; color: var(--ink); line-height: 1.3; } .event-participant-role { font-size: 12.5px; color: var(--ink-mute); margin-top: 1px; line-height: 1.4; } .event-participants-foot { font-size: 12.5px; color: var(--ink-fade); margin-top: 10px; text-align: center; } .event-participants-placeholder { display: flex; align-items: center; gap: 14px; padding: 16px; background: var(--bg); border-radius: 16px; } .event-participants-dots { display: flex; } .event-participant-dot { width: 30px; height: 30px; border-radius: 50%; background: var(--border); border: 2px solid var(--surface); margin-left: -10px; } .event-participant-dot:first-child { margin-left: 0; } .event-participants-text { font-size: 13px; color: var(--ink-mute); line-height: 1.45; flex: 1; } .event-participants-text strong { display: block; color: var(--ink); margin-bottom: 2px; font-weight: 600; } .event-cal-row { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 0 14px; font-size: 13.5px; } .event-cal-link { display: inline-flex; align-items: baseline; font-size: 13.5px; font-weight: 400; text-decoration: none; color: var(--ink); border-bottom: 1px solid var(--rule); padding-bottom: 1px; transition: color .15s, border-color .15s; } .event-cal-link:hover { color: var(--amber); border-bottom-color: var(--amber); } .event-cal-link + .event-cal-link::before { content: '·'; color: var(--ink-faint); margin: 0 14px 0 -14px; border: 0; } .city-rail { margin: 18px 0 22px; padding-top: 18px; border-top: 1px solid var(--border-soft); } .city-rail-head { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "eyebrow eyebrow" "title cta"; align-items: baseline; gap: 4px 12px; margin: 0 0 12px; } .city-rail-eyebrow { grid-area: eyebrow; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-fade); } .city-rail-title { grid-area: title; margin: 0; font-family: var(--font-serif); font-size: 18px; font-weight: 500; letter-spacing: -0.015em; color: var(--ink); } .city-rail-all { grid-area: cta; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--amber); text-decoration: none; white-space: nowrap; } .city-rail-all:hover { text-decoration: underline; } .city-rail-strip { display: flex; gap: 8px; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 4px 24px; margin: 0 -24px; } .city-rail-strip::-webkit-scrollbar { display: none; } .city-tile { flex: 0 0 auto; display: inline-flex; flex-direction: column; gap: 2px; padding: 10px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; text-decoration: none; color: var(--ink); transition: border-color 0.15s ease, transform 0.08s ease; } .city-tile:hover { border-color: var(--ink-mute); } .city-tile:active { transform: scale(0.99); } .city-tile-name { font-family: var(--font-serif); font-size: 14.5px; font-weight: 500; letter-spacing: -0.005em; color: var(--ink); } .city-tile-stats { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); white-space: nowrap; } .cities-list { display: flex; flex-direction: column; gap: 8px; margin: 0 0 18px; } .cities-tile { position: relative; display: block; padding: 14px 36px 14px 16px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; text-decoration: none; color: var(--ink); transition: border-color 0.15s ease, transform 0.08s ease; } .cities-tile:hover { border-color: var(--ink-mute); } .cities-tile:active { transform: scale(0.99); } .cities-tile-name { margin: 0 0 2px; font-family: var(--font-serif); font-size: 17px; font-weight: 500; letter-spacing: -0.01em; } .cities-tile-stats { margin: 0; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .cities-tile-arrow { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: 18px; color: var(--ink-fade); } .brands-facet { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 4px; } .brands-chip-offers.is-active, .brands-chip-offers { border-color: var(--amber-soft); } .brands-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 232px), 1fr)); gap: 14px; margin-top: 18px; } .brands-grid-compact { grid-template-columns: repeat(auto-fill, minmax(min(100%, 190px), 1fr)); } .brand-card { display: flex; flex-direction: column; background: var(--paper); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; text-decoration: none; transition: border-color 0.15s ease, transform 0.12s ease; } .brand-card:hover { border-color: var(--amber); transform: translateY(-2px); } .brand-card-logo, .brand-card-body { text-decoration: none; color: inherit; } .brand-hero-logo { text-decoration: none; } .brand-card-logo { position: relative; display: grid; place-items: center; aspect-ratio: 5 / 2; background: #f5f3ef; padding: 16px; } .brand-card-logo img { max-height: 100%; max-width: 100%; object-fit: contain; } .brand-card-logo-name { font-family: var(--font-serif); font-size: 15px; color: var(--ink-mute); text-align: center; padding: 8px; } .brand-card-logo:has(img) .brand-card-logo-name { display: none; } .brand-card-body { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; } .brand-card-cat { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-mute); } .brand-card-name { font-family: var(--font-serif); font-size: 16px; color: var(--ink); } .brand-card-tag { font-family: var(--font-sans); font-size: 13px; line-height: 1.45; color: var(--ink-soft); } .brand-card-offer { align-self: flex-start; margin-top: 4px; font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); border: 1px solid var(--amber-soft); border-radius: 20px; padding: 3px 9px; } .brand-back { display: inline-block; font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); text-decoration: none; margin-bottom: 16px; } .brand-back:hover { color: var(--amber); } .brand-hero { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; } .brand-hero-logo { position: relative; display: grid; place-items: center; width: 148px; height: 104px; flex: none; background: #f5f3ef; border: 1px solid var(--border); border-radius: 14px; padding: 16px; } .brand-hero-logo img { max-height: 100%; max-width: 100%; object-fit: contain; } .brand-hero-logo-name { font-family: var(--font-serif); font-size: 15px; color: var(--ink-mute); text-align: center; padding: 8px; } .brand-hero-logo:has(img) .brand-hero-logo-name { display: none; } .brand-hero-meta { flex: 1 1 240px; min-width: 0; } .brand-hero-eyebrow { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-mute); margin: 0 0 4px; } .brand-hero-name { font-family: var(--font-serif); font-size: 28px; line-height: 1.1; color: var(--ink); margin: 0; } .brand-hero-tag { font-family: var(--font-sans); font-size: 15px; line-height: 1.5; color: var(--ink-soft); margin: 8px 0 0; } .brand-hero-visit { display: inline-block; margin-top: 12px; font-family: var(--font-mono); font-size: 12px; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--amber); padding-bottom: 2px; } .brand-hero-visit:hover { color: var(--amber); } .brand-offer { margin: 24px 0; padding: 20px; background: var(--paper-2); border: 1px solid var(--amber-soft); border-radius: 14px; } .brand-offer-label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--amber); } .brand-offer-body { font-family: var(--font-sans); font-size: 15px; line-height: 1.55; color: var(--ink); margin: 8px 0 0; } .brand-offer-body p { margin: 0 0 8px; } .brand-section-title { font-family: var(--font-serif); font-size: 18px; color: var(--ink); margin: 28px 0 12px; } .brand-about-body { font-family: var(--font-sans); font-size: 14.5px; line-height: 1.6; color: var(--ink-soft); } .brand-about-body p { margin: 0 0 10px; } .partner-brands { margin: 28px 0 0; padding: 22px 18px 20px; background: var(--paper-2); border-radius: 16px; } .avatar-letter { display: flex; align-items: center; justify-content: center; line-height: 1; font-family: var(--font-serif); font-style: italic; font-weight: 400; color: var(--amber); text-transform: lowercase; background: rgba(198, 74, 26, 0.07); } .hub-home-city { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; text-decoration: none; color: inherit; transition: border-color 0.15s ease; } .hub-home-city:hover { border-color: var(--border); } .hub-home-city-name { font-family: var(--font-serif); font-weight: 500; font-size: 22px; line-height: 1.2; color: var(--ink); } .hub-home-city-stats { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); } .hub-home-city-faces { display: flex; align-items: center; margin-top: 2px; } .hub-home-city-face, .hub-home-city-face-image { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; border: 2px solid var(--paper); margin-left: -8px; background: var(--bg); font-size: 12px; font-weight: 500; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .hub-home-city-face:first-child, .hub-home-city-face-image:first-child { margin-left: 0; } .hub-home-city-who { font-family: var(--font-serif); font-style: italic; font-size: 14px; line-height: 1.4; color: var(--ink-mute); } .hub-home-city-next, .hub-home-city-last { margin-top: 4px; font-family: var(--font-serif); font-style: italic; font-size: 14px; line-height: 1.4; color: var(--ink-mute); } .hub-home-city-last { color: var(--ink-fade); } .hub-latest-bucket { margin: 16px 0 6px; font-family: var(--font-mono); font-size: 11.5px; font-weight: 500; letter-spacing: 0.04em; text-transform: lowercase; color: var(--ink-soft); } .hub-latest-bucket:first-of-type { margin-top: 6px; } .hub-latest-meta-quiet { font-style: italic; color: var(--ink-fade); } .partner-brands-head { margin: 0 0 16px; } .partner-brands-title { margin: 0 0 6px; font-family: var(--font-serif); font-weight: 500; font-size: 20px; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink); } .partner-brands-sub { margin: 0; font-family: var(--font-serif); font-size: 13px; line-height: 1.55; color: var(--ink-mute); } .partner-brands-link { color: var(--amber); text-decoration: none; border-bottom: 1px solid currentColor; } .partner-brands-link:hover { color: var(--ink); } .partner-brands-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; } .partner-brands-tile { position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 5 / 3; padding: 12px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 10px; overflow: hidden; text-decoration: none; color: var(--ink); transition: transform 0.12s ease, box-shadow 0.15s ease, border-color 0.15s ease; } .partner-brands-tile-link:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06); border-color: var(--ink-mute); } .partner-brands-name { font-family: var(--font-serif); font-size: 14px; font-weight: 500; letter-spacing: -0.005em; color: var(--ink); text-align: center; line-height: 1.25; padding: 0 4px; } .partner-brands-logo { position: absolute; inset: 12px; width: calc(100% - 24px); height: calc(100% - 24px); object-fit: contain; background: var(--paper); display: block; } .event-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 4px; } .events-view-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; } .events-view-head { align-items: center; gap: 12px; } .events-view-tabs { display: inline-flex; gap: 4px; margin-bottom: 14px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 3px; } .events-view-tab { font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--ink-mute); padding: 6px 18px; border-radius: 999px; cursor: pointer; white-space: nowrap; transition: background 0.15s ease, color 0.15s ease; } .events-view-tab:hover { color: var(--ink); } .events-view-input-upcoming:checked ~ .events-view-head .events-view-tab-upcoming, .events-view-input-past:checked ~ .events-view-head .events-view-tab-past, .events-view-input-upcoming:checked ~ .events-view-tabs .events-view-tab-upcoming, .events-view-input-past:checked ~ .events-view-tabs .events-view-tab-past { background: var(--ink); color: #fff; } .events-view-admin { display: inline-flex; gap: 10px; } .events-view-panel { display: none; } .events-view-input-upcoming:checked ~ .events-view-panel-upcoming, .events-view-input-past:checked ~ .events-view-panel-past { display: block; } .event-card-row { display: flex; align-items: center; gap: 14px; flex: 1; min-width: 0; } .event-card.event-card-has-snaps { flex-direction: column; align-items: stretch; gap: 0; padding: 0; overflow: hidden; } .event-card.event-card-has-snaps .event-card-row { padding: 18px 18px 16px; } .event-card-snaps { display: flex; gap: 6px; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 12px 18px 16px; border-top: 1px solid var(--border-soft); } .event-card-snaps::-webkit-scrollbar { display: none; } .event-card-snap { height: 100px; width: auto; flex-shrink: 0; border-radius: 8px; background: var(--paper-2); object-fit: cover; display: block; transition: transform 0.12s ease; } .event-card-snap:hover { transform: translateY(-1px); } .event-card { position: relative; display: flex; align-items: center; gap: 14px; padding: 24px 22px 20px; background: radial-gradient(circle at 12% -8%, rgba(198, 74, 26, 0.10) 0%, transparent 42%), linear-gradient(180deg, rgba(255, 255, 255, 0.90) 0%, rgba(255, 255, 255, 0.40) 22%, rgba(255, 255, 255, 0) 58% ), var(--paper-2); border: 1px solid rgba(230, 212, 194, 0.7); border-radius: 28px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 0 0 1px rgba(255, 255, 255, 0.35), 0 1px 2px rgba(26, 24, 20, 0.06), 0 4px 12px rgba(26, 24, 20, 0.05), 0 18px 44px rgba(26, 24, 20, 0.08), 0 36px 72px rgba(198, 74, 26, 0.05); text-decoration: none; color: var(--ink); transition: transform 0.25s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.3s cubic-bezier(0.32, 0.72, 0, 1); } .event-card:hover { transform: translateY(-4px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 0 0 1px rgba(255, 255, 255, 0.4), 0 2px 4px rgba(26, 24, 20, 0.06), 0 8px 20px rgba(26, 24, 20, 0.07), 0 28px 60px rgba(26, 24, 20, 0.12), 0 48px 96px rgba(198, 74, 26, 0.07); } .event-card:active { transform: scale(0.99); } .event-card-when { width: 56px; text-align: center; flex-shrink: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.4)), var(--paper); border: 1px solid rgba(230, 212, 194, 0.6); border-radius: 14px; padding: 10px 0 12px; line-height: 1.1; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 3px rgba(26, 24, 20, 0.04); } .event-card-day { font-family: var(--font-mono); font-size: 10px; font-weight: 600; letter-spacing: 0.12em; color: var(--amber); margin-bottom: 4px; text-transform: uppercase; } .event-card-date { font-family: var(--font-serif); font-size: 32px; font-weight: 500; color: var(--ink); letter-spacing: -0.03em; line-height: 1; } .event-card-month { font-family: var(--font-mono); font-size: 10px; font-weight: 600; letter-spacing: 0.12em; color: var(--ink-mute); margin-top: 4px; text-transform: uppercase; } .event-card-text { flex: 1; min-width: 0; } .event-card-title { font-family: var(--font-serif); font-size: 17px; font-weight: 500; letter-spacing: -0.015em; line-height: 1.2; color: var(--ink); margin-bottom: 6px; } .event-card-meta { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); line-height: 1.45; margin-top: 4px; } .event-card-private { display: inline-block; margin-left: 6px; padding: 1px 7px 2px; font-family: var(--font-sans); font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-mute); background: rgba(0, 0, 0, 0.06); border-radius: 4px; vertical-align: 2px; } .event-card-cancelled { display: inline-block; margin-left: 6px; padding: 1px 7px 2px; font-family: var(--font-sans); font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #b4483f; background: rgba(180, 72, 63, 0.1); border-radius: 4px; vertical-align: 2px; } body.dkr .event-card-cancelled { color: #e39191; background: rgba(190, 70, 70, 0.14); } .event-card-external { display: inline-block; margin-left: 6px; padding: 1px 7px 2px; font-family: var(--font-sans); font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--amber); background: rgba(198, 74, 26, 0.09); border-radius: 4px; vertical-align: 2px; } .event-card-proposed { display: inline-block; margin-left: 6px; padding: 1px 7px 2px; font-family: var(--font-sans); font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--amber); background: rgba(198, 74, 26, 0.09); border-radius: 4px; vertical-align: 2px; } .proposal-panel { display: flex; flex-direction: column; gap: 12px; } .proposal-eyebrow { font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); margin: 0; } .proposal-eyebrow-quiet { color: var(--ink-mute); } .proposal-lead { font-family: var(--font-sans); font-size: 14px; line-height: 1.5; color: var(--ink); margin: 0; } .proposal-progress { display: flex; flex-direction: column; gap: 6px; } .proposal-progress-track { height: 10px; border-radius: 999px; background: var(--paper-2); overflow: hidden; } .proposal-progress-fill { height: 100%; border-radius: 999px; background: var(--accent); min-width: 3px; transition: width 200ms ease; } .proposal-progress-label { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); margin: 0; } .proposal-progress-label strong { color: var(--ink); } .proposal-countdown { font-family: var(--font-sans); font-size: 13px; font-variant-numeric: tabular-nums; color: var(--ink-mute); margin: 0; } .proposal-cta { display: inline-block; align-self: flex-start; padding: 12px 22px; border: none; border-radius: 12px; background: var(--ink); color: var(--paper); font-family: var(--font-sans); font-size: 15px; font-weight: 500; text-decoration: none; cursor: pointer; } .proposal-cta-out { background: var(--paper-2); color: var(--ink); } .proposal-panel form { margin: 0; align-self: flex-start; } .proposal-note { font-family: var(--font-sans); font-size: 14px; color: var(--ink-mute); } .proposal-note p { margin: 4px 0 0; } .proposal-confirmed-banner { font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--amber); margin: 0 0 12px; } .application-panel, .application-admin { display: flex; flex-direction: column; gap: 12px; } .application-form { display: flex; flex-direction: column; gap: 10px; align-self: stretch; } .application-form .proposal-cta { align-self: flex-start; } .application-q-label { font-family: var(--font-sans); font-size: 14px; font-weight: 500; color: var(--ink); } .application-q-input { resize: vertical; } .application-seats { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 22px; letter-spacing: -0.01em; color: var(--ink); font-variant-numeric: tabular-nums; } .application-seats-live { font-family: var(--font-sans); font-size: 13px; font-weight: 600; letter-spacing: 0; color: var(--accent); } .application-seats-live-full { color: var(--ink-mute); font-weight: 500; } .application-waitlist { margin: 10px 0 0; font-family: var(--font-sans); font-size: 13.5px; line-height: 1.5; color: var(--ink-mute); max-width: 46ch; } .application-fit { margin: -4px 0 0; } .application-fit-yes { margin: 0; font-family: var(--font-serif); font-size: 15.5px; line-height: 1.4; color: var(--ink); } .application-fit-no { margin: 5px 0 0; font-family: var(--font-serif); font-size: 15.5px; line-height: 1.4; color: var(--ink-mute); } .application-act { display: flex; flex-direction: column; align-items: flex-start; gap: 9px; margin-top: 2px; } .application-note { margin: 0; font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); } .application-count { margin: 0; font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); } .application-count { margin: 0; font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); } .application-edit { margin-top: 4px; } .application-edit-label { margin: 0; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink); } .application-edit-status { margin: 0; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .application-edit-status.is-saving { color: var(--ink-mute); } .application-edit-status.is-saved { color: var(--accent); } .application-received { color: var(--ink); } .application-declined { color: var(--ink-mute); } .application-gaps { margin: 0; padding-left: 18px; font-family: var(--font-sans); font-size: 14px; color: var(--ink-mute); } .application-gaps li { margin: 2px 0; } .application-queue { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; } .application-queue-row { display: flex; gap: 12px; align-items: flex-start; padding: 12px; background: var(--paper-2); border-radius: 12px; } .application-queue-avatar { flex: 0 0 auto; border-radius: 50%; } .application-queue-body { flex: 1 1 auto; min-width: 0; } .application-queue-name { font-family: var(--font-sans); font-weight: 600; color: var(--ink); } .application-queue-meta { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); } .application-queue-q { margin: 8px 0 0; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--ink-mute); } .application-queue-note { margin: 2px 0 0; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink); line-height: 1.45; } .application-queue-actions { display: flex; flex-direction: column; gap: 6px; flex: 0 0 auto; } .application-queue-actions form { margin: 0; } .application-queue-actions .proposal-cta { padding: 8px 16px; font-size: 13.5px; text-align: center; } .application-declined-list { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--rule); } .application-declined-list .proposal-eyebrow { color: var(--ink-mute); } .application-queue-row.is-declined { opacity: 0.7; } .hub-section { margin-top: 26px; } .hub-welcome { margin: 4px 0 26px; } .hub-welcome-title { margin: 0 0 10px; font-family: var(--font-serif); font-weight: 500; font-size: 26px; line-height: 1.18; letter-spacing: -0.018em; color: var(--ink); } .hub-welcome-body { margin: 0; font-family: var(--font-sans); font-size: 15px; line-height: 1.6; color: var(--ink-soft); } .hub-welcome-body a { color: var(--amber); text-decoration: none; font-weight: 500; border-bottom: 1px solid rgba(198, 74, 26, 0.25); } .hub-welcome-body a:hover { border-bottom-color: var(--amber); } .hub-spotlight { display: grid; margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--border-soft); } .hub-spotlight-item { grid-area: 1 / 1; display: flex; align-items: flex-start; gap: 8px; text-decoration: none; opacity: 0; transform: translateY(4px); transition: opacity 0.5s ease, transform 0.5s ease; pointer-events: none; } .hub-spotlight-item.is-active { opacity: 1; transform: translateY(0); pointer-events: auto; } .hub-spotlight-emoji { flex: none; font-size: 15px; line-height: 1.45; } .hub-spotlight-body { min-width: 0; font-family: var(--font-sans); font-size: 13.5px; line-height: 1.45; font-weight: 500; color: var(--ink-soft); } .hub-spotlight-arrow { color: var(--amber); font-weight: 600; white-space: nowrap; } .hub-spotlight-item:hover .hub-spotlight-body { color: var(--amber); } @media (prefers-reduced-motion: reduce) { .hub-spotlight-item { transition: opacity 0.2s ease; transform: none; } .hub-spotlight-item.is-active { transform: none; } } .hub-fresh-dot { display: inline-block; width: 6px; height: 6px; margin-left: 2px; vertical-align: super; border-radius: 50%; background: var(--amber); animation: hub-fresh-pulse 1.8s ease-in-out infinite; } @keyframes hub-fresh-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.4; transform: scale(0.66); } } @media (prefers-reduced-motion: reduce) { .hub-fresh-dot { animation: none; } } .hub-welcome-actions { margin: 16px 0 0; } .hub-welcome-cta { display: inline-flex; align-items: center; justify-content: center; height: 44px; padding: 0 22px; background: var(--ink); color: var(--paper); border-radius: 12px; font-family: var(--font-sans); font-size: 14px; font-weight: 600; text-decoration: none; } .hub-welcome-cta:active { opacity: 0.85; } .hub-welcome-soon { margin: 12px 0 0; font-family: var(--font-sans); font-size: 13px; line-height: 1.55; color: var(--ink-fade); } .hub-recap { margin-top: 20px; } .hub-recap-strip { display: flex; gap: 18px; overflow-x: auto; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; padding: 4px 20px 14px; margin: 14px -20px 8px; } .hub-recap-strip::-webkit-scrollbar { display: none; } .hub-recap-tile { flex: 0 0 auto; width: min(80vw, 560px); scroll-snap-align: start; text-decoration: none; color: inherit; } .hub-recap-image-wrap { display: block; width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: var(--bg); border: 1px solid var(--border-soft); } .hub-recap-image { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.25s ease; } .hub-recap-tile:hover .hub-recap-image { transform: scale(1.03); } .hub-recap-meta { display: block; margin-top: 8px; } .hub-recap-where { display: block; font-family: var(--font-sans); font-size: 11px; font-weight: 500; letter-spacing: 0.01em; text-transform: uppercase; color: var(--amber); } .hub-recap-title { display: block; margin-top: 2px; font-family: var(--font-serif); font-size: 14px; line-height: 1.3; color: var(--ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .hub-endcap { margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--border-soft); } .hub-endcap-lead { margin: 0 0 12px; font-family: var(--font-serif); font-size: 15px; color: var(--ink-soft); } .hub-endcap-actions { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; } .hub-endcap-link { font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: var(--amber); text-decoration: none; } .hub-endcap-link:hover { text-decoration: underline; } .hub-hero-eyebrow { margin: 0 0 8px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; letter-spacing: 0.005em; color: var(--ink-fade); } .hub-hero { margin: 0 0 16px; font-family: var(--font-serif); font-weight: 500; font-size: 28px; line-height: 1.18; letter-spacing: -0.018em; color: var(--ink); } .hub-primary-cta { display: flex; align-items: center; gap: 14px; padding: 14px 16px; margin: 0 0 28px; background: rgba(198, 74, 26, 0.04); border: 1px solid rgba(198, 74, 26, 0.18); border-radius: 14px; text-decoration: none; color: inherit; transition: border-color 0.15s ease, background 0.15s ease; } .hub-primary-cta:hover { border-color: rgba(198, 74, 26, 0.4); background: rgba(198, 74, 26, 0.06); } .hub-primary-cta-icon { display: none; } .hub-primary-cta-avatar, .hub-primary-cta-avatar-image { flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; } .hub-primary-cta-text { flex: 1; min-width: 0; } .hub-primary-cta-label { display: block; font-family: var(--font-sans); font-size: 12px; font-weight: 500; letter-spacing: 0.005em; color: var(--amber); } .hub-primary-cta-title { display: block; margin-top: 2px; font-family: var(--font-serif); font-weight: 500; font-size: 15px; line-height: 1.35; color: var(--ink); } .hub-primary-cta-arrow { display: none; } .hub-primary-cta-note { display: block; margin-top: 4px; font-family: var(--font-sans); font-size: 12px; line-height: 1.4; color: var(--ink-mute); } .hub-demoday-nudge { display: flex; align-items: center; gap: 12px; margin: 0 0 28px; padding: 13px 15px; background: var(--paper); border: 1px solid rgba(198, 74, 26, 0.22); border-left: 3px solid var(--amber); border-radius: 14px; text-decoration: none; transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease; } .hub-demoday-nudge:hover { background: rgba(198, 74, 26, 0.04); box-shadow: 0 2px 12px rgba(198, 74, 26, 0.09); } .hub-demoday-nudge .rsvp-photo-nudge-icon { background: var(--amber); color: #fff; } .hub-demoday-nudge .rsvp-photo-nudge-go { color: var(--amber); } .hub-since-strip { margin: 0 0 24px; padding: 12px 14px; background: var(--bg); border-radius: 12px; } .hub-since-label { font-family: var(--font-sans); font-size: 12px; font-weight: 500; letter-spacing: 0; color: var(--ink-fade); margin-bottom: 8px; } .hub-since-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; font-family: var(--font-sans); font-size: 13px; color: var(--ink); text-decoration: none; } .hub-since-icon { font-size: 15px; flex-shrink: 0; } .hub-since-text { flex: 1; min-width: 0; } .hub-since-row + .hub-since-row { border-top: 1px solid var(--border-soft); } .hub-city-pills { display: flex; flex-wrap: wrap; gap: 8px; } .hub-home-city + .hub-city-pills { margin-top: 12px; } .events-city-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 32px; } .events-city-link { display: inline-flex; align-items: center; padding: 6px 13px; font-family: var(--font-sans); font-size: 13px; line-height: 1.2; color: var(--ink-soft); text-decoration: none; background: var(--bg); border: 1px solid var(--border-soft); border-radius: 999px; transition: color 120ms ease, border-color 120ms ease, background 120ms ease; } .events-city-link:hover { color: var(--amber); border-color: var(--amber); } .events-city-link.is-active { color: #fff; background: var(--amber); border-color: var(--amber); } @media (max-width: 540px) { .events-city-row { gap: 6px; } .events-city-row .landing-city-pill { padding: 7px 11px; } .events-city-row .landing-city-pill-name { font-size: 12.5px; } } .events-more-link { display: inline-block; margin-top: 14px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--amber); text-decoration: none; } .events-more-link:hover { text-decoration: underline; } .events-week-note { margin: 0 0 28px; padding: 16px 18px 17px; background: radial-gradient(circle at 0% 0%, rgba(198, 74, 26, 0.07) 0%, transparent 60%), rgba(198, 74, 26, 0.035); border: 1px solid var(--amber-soft); border-radius: 14px; } .events-week-note-eyebrow { display: inline-flex; align-items: center; gap: 7px; margin: 0 0 9px; font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--amber); } .events-week-note-eyebrow::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--amber); } .events-week-note-body { font-family: var(--font-serif); font-size: 15.5px; line-height: 1.66; color: var(--ink-soft); } .events-week-note-body p { margin: 0 0 10px; } .events-week-note-body p:last-child { margin-bottom: 0; } .events-week-note-editor { margin: 0 0 32px; } .events-week-note-editor-summary { cursor: pointer; font-family: var(--font-sans); font-size: 12px; color: var(--ink-fade); letter-spacing: 0.01em; } .events-week-note-form { margin-top: 10px; display: flex; flex-direction: column; gap: 10px; } .events-week-note-form textarea { width: 100%; resize: vertical; } .events-week-note-form .cta-btn { align-self: flex-start; } .hub-city-pill { display: inline-flex; align-items: baseline; gap: 8px; padding: 8px 14px; background: var(--bg); border: 1px solid var(--border-soft); border-radius: 999px; text-decoration: none; color: inherit; transition: border-color 0.15s ease, background 0.15s ease; } .hub-city-pill:hover { border-color: var(--border); background: var(--border-soft); } .hub-city-pill-name { font-family: var(--font-serif); font-weight: 500; font-size: 14px; color: var(--ink); letter-spacing: -0.005em; } .hub-city-pill-stat { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-fade); } .landing-hero { padding: 18px 4px 8px; margin: 0 0 4px; } .landing-hero-headline { margin: 0; font-family: var(--font-serif); font-size: 22px; font-weight: 500; letter-spacing: -0.012em; line-height: 1.32; color: var(--ink); } .landing-section { margin: 0 0 18px; } .landing-cities { padding: 4px 0 0; } .landing-city-region { margin: 0 0 14px; } .landing-city-region:last-child { margin-bottom: 0; } .landing-city-region-label { margin: 0 0 8px; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.10em; text-transform: uppercase; color: var(--ink-fade); } .landing-city-pills { display: flex; flex-wrap: wrap; gap: 6px; } .landing-city-pill { position: relative; display: inline-flex; align-items: baseline; gap: 7px; padding: 8px 14px; background: radial-gradient(circle at 14% -30%, rgba(198, 74, 26, 0.09) 0%, transparent 55%), linear-gradient(180deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.30) 50%, rgba(255, 255, 255, 0) 100% ), var(--paper-2); border: 1px solid rgba(230, 212, 194, 0.7); border-radius: 999px; text-decoration: none; color: inherit; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 2px rgba(26, 24, 20, 0.05), 0 4px 12px rgba(26, 24, 20, 0.06), 0 10px 22px rgba(198, 74, 26, 0.04); transition: transform 0.18s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.2s cubic-bezier(0.32, 0.72, 0, 1); } .landing-city-pill:hover { transform: translateY(-2px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 2px 4px rgba(26, 24, 20, 0.06), 0 8px 20px rgba(26, 24, 20, 0.08), 0 18px 36px rgba(198, 74, 26, 0.07); } .landing-city-pill:active { transform: translateY(0) scale(0.99); } .landing-city-pill-quiet { background: linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 80%), var(--paper-2); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 1px 2px rgba(26, 24, 20, 0.03); opacity: 0.85; } .landing-city-pill-quiet:hover { opacity: 1; transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 4px rgba(26, 24, 20, 0.04), 0 6px 14px rgba(26, 24, 20, 0.05); } .landing-city-pill-count { font-family: var(--font-mono); font-size: 11px; font-weight: 700; color: var(--amber); font-variant-numeric: tabular-nums; } .landing-city-pill.is-active { background: var(--amber); border-color: var(--amber); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(26, 24, 20, 0.08), 0 6px 16px rgba(198, 74, 26, 0.18); } .landing-city-pill.is-active .landing-city-pill-name { color: #fff; } .landing-city-pill.is-active:hover { transform: translateY(-1px); } .landing-city-pill-flag { font-size: 14px; line-height: 1; } .landing-city-pill-name { font-family: var(--font-sans); font-weight: 500; font-size: 13px; color: var(--ink); } .landing-city-pill-stat { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.02em; color: var(--ink-fade); } .landing-divider { margin: 22px 0; height: 1px; border: 0; background: var(--border-soft); } .hub-city-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; } @media (max-width: 560px) { .hub-city-strip { display: flex; gap: 12px; overflow-x: auto; margin: 0 -20px; padding: 2px 20px 8px; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; } .hub-city-strip::-webkit-scrollbar { display: none; } .hub-city-tile { flex: 0 0 220px; scroll-snap-align: start; } } .hub-city-tile { min-height: 148px; display: flex; flex-direction: column; gap: 8px; padding: 14px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; text-decoration: none; color: inherit; transition: border-color 0.15s ease; } .hub-city-tile:hover { border-color: var(--border); } .hub-city-tile-sparse { background: var(--bg); border-color: rgba(0, 0, 0, 0.04); } .hub-city-cta { color: var(--amber); font-weight: 600; } .hub-city-name { font-family: var(--font-serif); font-weight: 500; font-size: 17px; color: var(--ink); } .hub-city-stats { font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); } .hub-city-faces { display: flex; align-items: center; gap: 0; margin-top: 2px; } .hub-city-face, .hub-city-face-image { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; border: 2px solid var(--paper); margin-left: -8px; background: var(--bg); font-size: 11px; font-weight: 600; color: var(--ink-soft); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .hub-city-face:first-child, .hub-city-face-image:first-child { margin-left: 0; } .hub-city-who { font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); line-height: 1.4; } .hub-city-next { margin-top: auto; font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .hub-city-next-label { display: inline-block; font-family: var(--font-sans); font-size: 11px; font-weight: 600; color: var(--amber); margin-right: 6px; } .hub-event-tagline { margin-top: 2px; font-family: var(--font-serif); font-style: italic; font-size: 13px; line-height: 1.4; color: var(--ink-mute); } .hub-event-host { margin-top: 6px; font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); } .hub-event-host strong { color: var(--ink); font-weight: 600; } .hub-rsvp-badge { display: inline-block; margin-left: 6px; padding: 2px 10px 3px; border-radius: 999px; background: rgba(198, 74, 26, 0.10); font-family: var(--font-serif); font-style: italic; font-weight: 500; font-size: 13px; color: var(--amber); vertical-align: 1px; white-space: nowrap; } .hub-rsvp-badge-soft { background: rgba(135, 128, 111, 0.10); color: var(--ink-mute); } .event-card-mine { background: radial-gradient(circle at 12% -8%, rgba(198, 74, 26, 0.18) 0%, transparent 48%), linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.32) 24%, rgba(255, 255, 255, 0) 62% ), var(--paper-2); border-color: rgba(198, 74, 26, 0.24); } .event-card-mine-flag { display: none; } .hub-event-momentum { margin-top: 6px; font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--ink-soft); } .hub-empty { margin: 0; padding: 14px 16px; background: var(--bg); border-radius: 12px; font-family: var(--font-serif); font-size: 14px; line-height: 1.5; color: var(--ink-mute); } .hub-empty-link { margin-left: 4px; color: var(--amber); font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; text-decoration: none; white-space: nowrap; } .hub-empty-link:hover { text-decoration: underline; } .hub-me-preview { display: flex; align-items: center; gap: 14px; padding: 14px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; text-decoration: none; color: inherit; transition: border-color 0.15s ease, background 0.15s ease; } .hub-me-preview:hover { border-color: var(--border); background: var(--paper-hover, var(--paper)); } .hub-me-avatar, .hub-me-avatar-image { width: 56px; height: 56px; border-radius: 50%; flex-shrink: 0; object-fit: cover; } .hub-me-text { flex: 1; min-width: 0; } .hub-me-name { font-family: var(--font-serif); font-weight: 500; font-size: 16px; color: var(--ink); display: inline-flex; align-items: center; gap: 4px; } .hub-me-meta { margin-top: 2px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); } .hub-me-hoping { margin-top: 4px; font-family: var(--font-sans); font-size: 12px; color: var(--ink-fade); } .hub-me-pulse { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; } .hub-me-pulse-line { display: block; font-family: var(--font-serif); font-style: italic; font-size: 14px; line-height: 1.5; color: var(--ink-mute); text-decoration: none; transition: color 0.15s ease; } .hub-me-pulse-line:hover { color: var(--ink); } .hub-me-pulse-line strong { color: var(--ink); font-weight: 500; } .hub-latest-list { display: flex; flex-direction: column; gap: 2px; } .hub-latest-row { display: flex; align-items: center; gap: 12px; padding: 10px 4px; border-bottom: 1px solid var(--border-soft); text-decoration: none; color: inherit; } .hub-latest-row:last-child { border-bottom: none; } .hub-latest-avatar, .hub-latest-avatar-image { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; } .hub-latest-text { flex: 1; min-width: 0; } .hub-latest-name { font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; color: var(--ink); display: inline-flex; align-items: center; gap: 4px; } .hub-latest-meta { margin-top: 1px; font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); } .hub-latest-when { font-family: var(--font-sans); font-size: 12px; color: var(--ink-fade); white-space: nowrap; } .gallery-scopes { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; } .gallery-scope { padding: 6px 12px; background: var(--bg); border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-soft); text-decoration: none; transition: background 0.15s ease, color 0.15s ease; } .gallery-scope:hover { background: var(--border-soft); color: var(--ink); } .gallery-scope-admin { background: rgba(198, 74, 26, 0.08); color: var(--amber); } .gallery-scope-admin:hover { background: rgba(198, 74, 26, 0.14); color: var(--amber); } .gallery-marquee { overflow-x: auto; overflow-y: hidden; margin: 0 -24px 36px; -webkit-overflow-scrolling: touch; scrollbar-width: none; } .gallery-marquee::-webkit-scrollbar { display: none; } .gallery-marquee-track { display: flex; gap: 16px; width: max-content; padding: 4px 24px; } .gallery-marquee-image { height: 360px; width: auto; flex-shrink: 0; display: block; border-radius: 12px; background: var(--bg); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06); user-select: none; -webkit-user-drag: none; } @media (max-width: 560px) { .gallery-marquee-image { height: 260px; } } .gallery-events { display: flex; flex-direction: column; gap: 56px; margin-bottom: 40px; } .gallery-event { display: flex; flex-direction: column; gap: 14px; } .gallery-event-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px; } .gallery-event-head-text { flex: 1 1 auto; min-width: 0; } .gallery-event-title { margin: 0; font-family: var(--font-serif); font-size: 22px; font-weight: 500; letter-spacing: -0.015em; line-height: 1.2; color: var(--ink); } .gallery-event-meta { margin: 4px 0 0; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); } .gallery-event-actions { display: inline-flex; align-items: center; gap: 14px; flex-shrink: 0; } .gallery-event-cta { font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--amber); text-decoration: none; white-space: nowrap; background: none; border: none; padding: 0; cursor: pointer; } .gallery-event-cta:hover { text-decoration: underline; } .gallery-event-share { color: var(--ink-soft); } .gallery-event-share:hover { color: var(--amber); } .gallery-event-faces { display: flex; align-items: center; gap: 0; flex-wrap: wrap; } .gallery-event-face, .gallery-event-face-more { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--surface); margin-left: -8px; background: var(--bg); text-decoration: none; transition: transform 0.15s ease; } .gallery-event-face:first-child, .gallery-event-face-more:first-child { margin-left: 0; } .gallery-event-face:hover { transform: translateY(-2px); } .gallery-event-face-image, .gallery-event-face-image-image { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; } .gallery-event-face-more { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; color: var(--ink-soft); letter-spacing: 0.02em; } .gallery-event-strip { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; } .gallery-event-strip-tile { position: relative; display: block; aspect-ratio: 1 / 1; border-radius: 8px; overflow: hidden; background: var(--bg); text-decoration: none; } .gallery-event-strip-image { width: 100%; height: 100%; display: block; object-fit: cover; background: var(--bg); transition: filter 0.2s ease; } .gallery-event-strip-tile:hover .gallery-event-strip-image { filter: brightness(1.04); } .focal-block { margin-top: 14px; width: 100%; max-width: 360px; } .focal-help { margin: 0 0 8px; font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); } .focal-frame { position: relative; width: 100%; padding-bottom: 33.333%; background: var(--bg); border-radius: 10px; overflow: hidden; cursor: default; user-select: none; -webkit-user-select: none; touch-action: pan-y; transition: box-shadow 0.15s ease, outline-color 0.15s ease; outline: 2px solid transparent; } .focal-frame.is-adjusting { cursor: crosshair; touch-action: none; outline-color: var(--amber); box-shadow: 0 0 0 4px rgba(255, 191, 0, 0.18); } .focal-frame-square { padding-bottom: 100%; border-radius: 50%; } .focal-frame-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; -webkit-user-drag: none; } .focal-marker { position: absolute; top: 50%; left: 50%; width: 24px; height: 24px; border-radius: 50%; background: rgba(255, 255, 255, 0.7); border: 2px solid var(--amber); box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.25); transform: translate(-50%, -50%); pointer-events: none; transition: left 0.05s linear, top 0.05s linear, opacity 0.15s ease; opacity: 0; } .focal-frame.is-adjusting .focal-marker { opacity: 1; } .focal-marker::after { content: ""; position: absolute; top: 50%; left: 50%; width: 4px; height: 4px; background: var(--amber); border-radius: 50%; transform: translate(-50%, -50%); } .focal-controls { margin-top: 10px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } .focal-adjust-btn { appearance: none; border: 1px solid var(--border); background: var(--paper); color: var(--ink); font-family: var(--font-sans); font-size: 13px; font-weight: 500; padding: 6px 14px; border-radius: 999px; cursor: pointer; transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease; } .focal-adjust-btn:hover { background: var(--border-soft); border-color: var(--ink-fade); } .focal-frame.is-adjusting ~ .focal-controls .focal-adjust-btn { background: var(--amber); border-color: var(--amber); color: var(--paper); } .focal-zoom { margin-top: 10px; display: inline-flex; align-items: center; gap: 12px; padding: 4px 8px; background: var(--bg); border-radius: 999px; user-select: none; } .focal-zoom-btn { width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--border); background: var(--paper); cursor: pointer; font-family: var(--font-sans); font-size: 16px; font-weight: 500; color: var(--ink); display: inline-flex; align-items: center; justify-content: center; padding: 0; line-height: 1; transition: background 0.15s ease, border-color 0.15s ease; } .focal-zoom-btn:hover { background: var(--border-soft); border-color: var(--ink-fade); } .focal-zoom-btn:active { transform: scale(0.95); } .focal-zoom-label { font-family: var(--font-mono); font-size: 12px; font-weight: 500; color: var(--ink-soft); min-width: 38px; text-align: center; } .curate-events { display: flex; flex-direction: column; gap: 36px; margin-bottom: 40px; } .curate-event { display: flex; flex-direction: column; gap: 12px; padding-bottom: 24px; border-bottom: 1px solid var(--border-soft); } .curate-event:last-child { border-bottom: none; } .curate-event-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; } .curate-event-head-text { flex: 1 1 auto; min-width: 0; } .curate-event-title { margin: 0; font-family: var(--font-serif); font-size: 18px; font-weight: 500; letter-spacing: -0.012em; color: var(--ink); } .curate-event-meta { margin: 4px 0 0; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); } .curate-event-cover-count { color: var(--amber); font-weight: 600; } .curate-event-cta { font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--amber); text-decoration: none; white-space: nowrap; } .curate-event-cta:hover { text-decoration: underline; } .curate-event-form { margin: 0; } .curate-event-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; } .curate-photo { position: relative; display: block; cursor: pointer; border-radius: 8px; overflow: hidden; transition: box-shadow 0.15s ease; } .curate-photo input[type="checkbox"] { position: absolute; opacity: 0; pointer-events: none; } .curate-photo-image { display: block; width: 100%; height: 120px; object-fit: cover; background: var(--bg); transition: filter 0.15s ease; } .curate-photo:hover .curate-photo-image { filter: brightness(1.04); } .curate-photo-badge { position: absolute; top: 6px; left: 6px; width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.45); color: white; font-family: var(--font-sans); font-size: 14px; opacity: 0.5; transition: opacity 0.15s ease, background 0.15s ease, transform 0.15s ease; pointer-events: none; } .curate-photo:hover .curate-photo-badge { opacity: 0.85; } .curate-photo-is-cover, .curate-photo:has(input:checked) { box-shadow: 0 0 0 3px var(--amber); } .curate-photo-is-cover .curate-photo-badge, .curate-photo:has(input:checked) .curate-photo-badge { opacity: 1; background: var(--amber); transform: scale(1.05); } .curate-event-status { margin: 6px 0 0; min-height: 18px; font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-fade); transition: opacity 0.2s ease; } .curate-event-status[data-state="saving"] { color: var(--ink-soft); } .curate-event-status[data-state="saved"] { color: var(--amber); } .curate-event-status[data-state="error"] { color: #c43; } .events-network { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--border-soft); } .events-network-head { display: flex; align-items: baseline; gap: 6px; margin: 0 0 14px; font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: var(--ink); } .events-network-link { margin-left: auto; font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--ink-fade); text-decoration: none; } .events-network-link:hover { color: var(--amber); } .events-network-list { display: flex; flex-direction: column; gap: 14px; } .events-network-row { display: flex; gap: 12px; text-decoration: none; color: inherit; align-items: flex-start; } .events-network-row:hover .feed-attendee-name { color: var(--amber); } .events-network-text { flex: 1; min-width: 0; } .events-more { margin-top: 28px; padding: 14px 16px; background: var(--paper-2); border-radius: 12px; } .events-more-eyebrow { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.04em; color: var(--ink-fade); text-transform: uppercase; margin-bottom: 6px; } .events-more-body { margin: 0; font-family: var(--font-serif); font-size: 13.5px; color: var(--ink-soft); line-height: 1.55; } .events-more-link { color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-underline-offset: 3px; } .events-more-link:hover { text-decoration-color: var(--ink); } .event-card-attendees { display: flex; align-items: center; gap: 8px; margin-top: 8px; } .event-card-faces { display: inline-flex; flex-shrink: 0; } .event-card-face { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; background: var(--paper-2); border: 1.5px solid var(--paper); margin-left: -6px; display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 10px; font-weight: 500; color: var(--ink-mute); } .event-card-face:first-child { margin-left: 0; } .event-card-attendees-text { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .event-card-attendees-text strong { color: var(--ink); font-weight: 600; } .event-card-attendees-going { margin-left: 2px; color: var(--ink-mute); } .event-card-past { opacity: 0.7; } .event-card-past .event-card-when { background: var(--border-soft); } .event-list-divider { font-size: 11.5px; color: var(--ink-fade); text-transform: uppercase; letter-spacing: 0.7px; font-weight: 600; margin: 28px 0 10px; } .empty-events { background: var(--bg); border-radius: 16px; padding: 28px 20px; text-align: center; } .empty-events-icon { font-size: 32px; margin-bottom: 10px; } .empty-events-text { font-size: 13.5px; color: var(--ink-mute); line-height: 1.55; } .empty-events-text strong { display: block; color: var(--ink); margin-bottom: 4px; } .welcome-title, .screen-title, .event-headline, .founder-card-name, .done-title, .welcome-celebrate .screen-title, .event-meta-block .event-headline, .benefit-title, .event-speaker-name, .event-participant-name, .event-card-title, .event-agenda-title, .event-venue-name { font-family: var(--font-serif); font-weight: 500; letter-spacing: -0.005em; } .welcome-title, .event-headline, .done-title, .welcome-celebrate .screen-title { font-weight: 600; } .screen-eyebrow, .event-when-eyebrow, .steps-label, .next-section-label, .event-list-divider, .event-card-day, .event-card-month, .event-meta-label, .event-when-zone, .event-hero-eyebrow, .event-hero-time-zone { font-family: var(--font-mono); } .event-section-count, .next-tag, .event-card-date, .event-agenda-time, .event-when-line, .event-card-meta, .founder-card-role, .event-when-pill { font-variant-numeric: tabular-nums; } .event-about-text a, .welcome-sub a, .benefit-detail a { color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--rule); padding-bottom: 0.5px; transition: color .15s, border-color .15s; } .event-about-text a:hover, .welcome-sub a:hover, .benefit-detail a:hover { color: var(--amber); border-bottom-color: var(--amber); } .founder-card, .event-meta-grid, .event-venue-card, .event-participants, .event-card, .next-item, .profile-tag, .signin-helper, .check-email-tip, .empty-state { border-color: var(--rule); } .onboarding-screen { padding-top: 14px; } .onboarding-section-label { display: block; margin: 18px 0 8px; font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--ink); } .chip.chip-custom { padding-right: 8px; } .chip.chip-custom span[aria-hidden] { opacity: 0.55; margin-left: 2px; } .chip.chip-custom:hover span[aria-hidden] { opacity: 1; } .chip-add-input { flex: 0 0 auto; min-width: 150px; height: 38px; padding: 0 14px; border: 1px dashed rgba(0, 0, 0, 0.18); border-radius: 100px; background: transparent; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink); transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease; } .chip-add-input::placeholder { color: var(--ink-mute); } .chip-add-input:focus { outline: none; border-style: solid; border-color: var(--ink); background: var(--paper); box-shadow: 0 0 0 4px rgba(26, 24, 20, 0.06); } .chip-write-row { margin: 0 0 6px; align-items: center; } .chip-write-input { flex: 1 1 auto; min-width: 220px; height: 44px; padding: 0 16px; border: 1px solid rgba(0, 0, 0, 0.22); border-radius: 100px; background: var(--paper); font-family: var(--font-sans); font-size: 14px; color: var(--ink); transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease; } .chip-write-input::placeholder { color: var(--ink-mute); } .chip-write-input:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 4px rgba(26, 24, 20, 0.08); } .chip-suggest .chips-wrap-suggest { margin-top: 8px; } .chip-suggest:not(.is-suggest-open) .chips-wrap-suggest .chip:not(.selected) { display: none; } .chip-suggest-toggle { display: inline-flex; align-items: center; gap: 7px; margin: 10px 0 2px; padding: 6px 13px; border: 1px solid var(--rule); border-radius: 100px; background: transparent; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-mute); cursor: pointer; transition: color 0.16s ease, border-color 0.16s ease; } .chip-suggest-toggle:hover { color: var(--ink); border-color: var(--ink-soft); } .chip-suggest-toggle::after { content: "+"; font-size: 13px; line-height: 1; } .chip-suggest.is-suggest-open .chip-suggest-toggle::after { content: "\2013"; } body.dkr .chip-suggest-toggle { border-color: var(--dkr-line); color: var(--dkr-muted); } body.dkr .chip-suggest-toggle:hover { border-color: var(--dkr-muted); color: var(--dkr-paper); } .social-input-row { display: flex; align-items: stretch; border: 1px solid var(--border-soft); border-radius: 10px; background: var(--paper-2); overflow: hidden; } .social-input-row:focus-within { border-color: var(--ink); background: var(--surface); } .social-input-prefix { display: inline-flex; align-items: center; padding: 0 4px 0 14px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); white-space: nowrap; background: transparent; } .social-input.text-input { flex: 1; min-width: 0; border: none; background: transparent; padding-left: 2px; } .social-input.text-input:focus { background: transparent; } .onboarding-extras { margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--border-soft); } .onboarding-extras > summary { list-style: none; cursor: pointer; font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; color: var(--ink); padding: 2px 0; } .onboarding-extras > summary::-webkit-details-marker { display: none; } .onboarding-extras > summary::before { content: "+"; display: inline-block; width: 18px; color: var(--ink-mute); font-weight: 400; } .onboarding-extras[open] > summary::before { content: "–"; } .onboarding-extras-hint { color: var(--ink-mute); font-weight: 400; margin-left: 4px; font-size: 12.5px; } .onboarding-extras-stack { margin-top: 14px; } .onboarding-avatar-picker { display: flex; flex-direction: column; align-items: center; margin: 4px 0 22px; } .onboarding-avatar-picker-prominent { margin: 8px 0 26px; } .onboarding-avatar-picker-prominent .onboarding-avatar-slot { width: 108px; height: 108px; } .onboarding-avatar-picker-prominent .onboarding-avatar-empty { font-size: 42px; } .onboarding-avatar-picker-prominent .onboarding-avatar-hint { font-size: 12.5px; color: var(--ink-soft); } .onboarding-avatar-slot, .onboarding-preview-avatar { position: relative; width: 92px; height: 92px; border-radius: 50%; background: var(--paper-2); display: flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; border: 1px dashed rgba(0, 0, 0, 0.18); transition: border-color 0.15s, background 0.15s; } .onboarding-avatar-slot:hover, .onboarding-preview-avatar:hover { border-color: rgba(0, 0, 0, 0.4); } .onboarding-avatar-slot.has-image, .onboarding-preview-avatar.has-image { border: none; background: transparent; } .onboarding-avatar-empty { font-family: var(--font-sans); font-size: 36px; font-weight: 300; color: var(--ink-dim); line-height: 1; } .onboarding-avatar-slot.has-image .onboarding-avatar-empty { display: none; } .onboarding-avatar-preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; } .onboarding-avatar-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; } .onboarding-avatar-hint { margin: 10px 0 0; font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); } .onboarding-preview { display: flex; align-items: center; gap: 16px; padding: 14px 16px; margin: 14px 0 6px; background: var(--paper-2); border-radius: 16px; transition: transform 0.2s ease; } .onboarding-preview-avatar { width: 84px; height: 84px; flex: 0 0 84px; } .onboarding-preview-text { min-width: 0; flex: 1 1 auto; } .onboarding-preview-name { font-family: var(--font-serif); font-weight: 600; font-size: 18px; color: var(--ink); line-height: 1.2; letter-spacing: -0.012em; overflow-wrap: anywhere; } .onboarding-preview-role { margin-top: 4px; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-soft); line-height: 1.4; overflow-wrap: anywhere; } .onboarding-preview-city { margin-top: 6px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-mute); } .onboarding-preview-name.is-placeholder, .onboarding-preview-role.is-placeholder { color: var(--ink-fade); font-weight: 400; } .onboarding-preview-hint { margin: 0 0 18px; font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); text-align: left; } .onboarding-preview-sticky { position: sticky; top: 0; z-index: 5; background: linear-gradient(180deg, #faf6ec 0%, var(--paper-2) 100%); border: 1px solid var(--amber-soft); box-shadow: 0 6px 18px rgba(198, 74, 26, 0.06), 0 1px 0 rgba(255, 255, 255, 0.6) inset; border-radius: 18px; padding: 16px 18px; margin: 12px 0 6px; } .onboarding-section-heading { display: flex; align-items: center; gap: 10px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); margin: 32px 0 14px; padding-bottom: 10px; border-bottom: 1px solid var(--border-soft); } .onboarding-section-heading::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--amber); flex-shrink: 0; } .onboarding-section-heading:first-of-type { margin-top: 20px; } .label-optional { font-family: var(--font-sans); font-weight: 400; font-size: 11px; color: var(--ink-mute); text-transform: none; letter-spacing: 0; margin-left: 6px; } .field-why { margin: 8px 2px 18px; font-family: var(--font-serif); font-size: 13px; font-weight: 400; color: var(--ink-mute); line-height: 1.5; } .field-why-inline { margin: 0; font-size: 12px; } .onboarding-avatar-silhouette { position: absolute; inset: 0; width: 64%; height: 64%; margin: 22% auto 0; pointer-events: none; stroke: var(--amber); stroke-opacity: 0.55; stroke-width: 2.4; fill: none; stroke-linecap: round; stroke-linejoin: round; } .onboarding-preview-avatar.has-image .onboarding-avatar-silhouette, .onboarding-avatar-slot.has-image .onboarding-avatar-silhouette { display: none; } .onboarding-avatar-plus { position: absolute; z-index: 1; bottom: 2px; right: 2px; width: 26px; height: 26px; border-radius: 50%; background: var(--ink); color: var(--paper); display: flex; align-items: center; justify-content: center; font-size: 16px; line-height: 1; font-family: var(--font-sans); font-weight: 400; box-shadow: 0 2px 6px rgba(26, 24, 20, 0.2), 0 0 0 2px var(--paper); } .onboarding-preview-avatar.has-image .onboarding-avatar-plus, .onboarding-avatar-slot.has-image .onboarding-avatar-plus { display: none; } .tag-counter-row { display: flex; align-items: baseline; gap: 10px; margin-top: 8px; flex-wrap: wrap; } .tag-counter { font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--ink-mute); padding: 3px 9px; border-radius: 999px; background: var(--paper-2); white-space: nowrap; } .tag-counter-full { color: var(--ink); background: var(--paper-3, #e9e3d6); } @keyframes tag-counter-buzz { 0% { transform: translateX(0); } 20% { transform: translateX(-3px); } 40% { transform: translateX(3px); } 60% { transform: translateX(-2px); } 80% { transform: translateX(2px); } 100% { transform: translateX(0); } } .tag-counter-buzz { animation: tag-counter-buzz 0.35s ease; } .chips-wrap-custom { margin-top: 10px; } .onboarding-textarea { font-family: var(--font-serif); font-size: 16px; line-height: 1.5; min-height: 72px; resize: vertical; } .field-helper-tight { font-family: var(--font-sans); font-size: 12px; line-height: 1.45; color: var(--ink-dim); margin: -2px 2px 0; } .match-stack { display: flex; flex-direction: column; gap: 0; margin: 0 0 28px; border-top: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); } .match-row { display: flex; align-items: center; gap: 12px; padding: 14px 2px; text-decoration: none; color: inherit; border-bottom: 1px solid var(--border-soft); } .match-row:last-child { border-bottom: none; } .match-row:hover .match-name { color: var(--amber); } .match-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--paper-2); display: flex; align-items: center; justify-content: center; font-family: var(--font-serif); font-size: 15px; font-weight: 500; color: var(--ink); flex-shrink: 0; } .match-text { flex: 1; min-width: 0; } .match-name { font-family: var(--font-serif); font-size: 15px; font-weight: 500; color: var(--ink); letter-spacing: -0.005em; transition: color 0.15s; } .match-meta { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); margin-top: 2px; line-height: 1.4; } .match-tags { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 4px; } .match-tag { font-family: var(--font-sans); font-size: 11px; font-weight: 500; color: var(--ink-mute); background: rgba(0, 0, 0, 0.05); padding: 2px 7px; border-radius: 3px; } .match-tag-shared { color: var(--amber); background: rgba(217, 119, 6, 0.10); } .match-arrow { color: var(--ink-faint); font-size: 22px; font-weight: 400; padding-left: 4px; flex-shrink: 0; } .rsvp-building { margin: 16px 18px 18px; padding: 16px 16px 18px; background: var(--paper-2); border: 1px solid var(--border-soft); border-left: 3px solid var(--accent); border-radius: 12px; } .rsvp-building-head { margin: 0 0 12px; } .rsvp-building-eyebrow { margin: 0 0 4px; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent); } .rsvp-building-title { margin: 0; font-family: var(--font-serif); font-size: 16px; font-weight: 500; color: var(--ink); letter-spacing: -0.005em; } .rsvp-building-sub { margin: 4px 0 0; font-family: var(--font-serif); font-size: 13px; color: var(--ink-soft); line-height: 1.55; max-width: 60ch; } .rsvp-building-form { display: flex; flex-direction: column; gap: 12px; } .rsvp-building-field { display: flex; flex-direction: column; gap: 6px; } .rsvp-building-field-label { font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--ink-soft); letter-spacing: -0.005em; } .rsvp-building-input { width: 100%; } .rsvp-building-field-hint { font-family: var(--font-serif); font-size: 12px; color: var(--ink-mute); line-height: 1.4; } .rsvp-building-actions { margin-top: 2px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } .rsvp-building-save { appearance: none; border: 1px solid var(--accent); background: var(--accent); color: #fff; border-radius: 999px; padding: 9px 18px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; cursor: pointer; transition: opacity 0.15s ease; } .rsvp-building-save:hover { opacity: 0.9; } .rsvp-building-save.is-saving { background: var(--surface); color: var(--accent); } .rsvp-building-save.is-saved { background: var(--surface); color: #2e7d4f; border-color: rgba(46, 125, 79, 0.4); } .rsvp-building-status { margin: 0; font-family: var(--font-serif); font-size: 12.5px; color: var(--ink-mute); transition: color 0.15s ease; } .rsvp-building-status.is-saved { color: #2e7d4f; font-weight: 500; } .rsvp-building-preview { margin-top: 10px; border-radius: 10px; overflow: hidden; aspect-ratio: 16 / 9; background: #000; } .rsvp-building-preview-play { appearance: none; border: 0; margin: 0; padding: 0; display: block; width: 100%; height: 100%; position: relative; cursor: pointer; background: #000; } .rsvp-building-preview-play img { width: 100%; height: 100%; object-fit: cover; display: block; } .rsvp-building-preview-icon { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; } .rsvp-building-preview-frame { width: 100%; height: 100%; border: 0; display: block; } .rsvp-building-rest { border-left-color: var(--border-soft); } .rsvp-building-rest .rsvp-building-eyebrow { color: var(--ink-soft); } .rsvp-building-rest-showed { display: flex; flex-direction: column; gap: 3px; margin: 0; padding: 12px 0 0; border-top: 1px solid var(--border-soft); } .rsvp-building-rest-label { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-soft); } .rsvp-building-rest-line { font-family: var(--font-serif); font-size: 14px; color: var(--ink); } .rsvp-building-rest-where { font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); } .rsvp-prepicker-tagline { margin: 8px 4px 0; text-align: center; line-height: 1.5; } .event-person-tile-body { display: flex; flex-direction: column; gap: 0; width: 100%; padding-left: 0; } .event-person-tile-body .event-person-tile-line:first-child { margin-top: 0; } .event-person-tile-line-socials { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } .event-person-tile-socials { display: inline-flex; align-items: center; gap: 10px; } .event-person-tile-social { display: inline-flex; align-items: center; color: var(--ink-fade); text-decoration: none; transition: color 0.15s ease; } .event-person-tile-social:hover { color: var(--ink); } .event-person-tile-social .ui-icon svg { width: 13px; height: 13px; } .event-person-tile-pinned-link { color: var(--ink); text-decoration: underline; text-decoration-color: var(--border-soft); text-underline-offset: 2px; transition: text-decoration-color 0.15s ease; } .event-person-tile-pinned-link:hover { text-decoration-color: var(--ink); } .event-person-tile-pinned-link span { color: var(--ink-fade); margin-left: 4px; } .event-person-tile-asks { display: flex; flex-direction: column; gap: 6px; width: 100%; padding-left: 0; padding-top: 8px; border-top: 1px dashed var(--border-soft); } .event-person-tile-asks .event-person-tile-line { margin-top: 0; } .event-person-tile-ask { margin-top: 8px; padding: 4px 9px 5px; display: inline-flex; align-items: baseline; gap: 5px; max-width: 100%; background: var(--paper); border: 1px solid var(--amber); border-radius: 999px; font-family: var(--font-sans); font-size: 10.5px; line-height: 1.3; color: var(--amber); } .event-person-tile-ask-key { font-family: var(--font-mono); font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; opacity: 0.85; } .event-person-tile-ask-value { font-weight: 500; white-space: normal; overflow-wrap: anywhere; word-break: break-word; max-width: 100%; flex: 1 1 auto; } a.event-person-tile-ask-link { text-decoration: none; color: var(--amber); transition: background-color 0.15s ease, border-color 0.15s ease; } a.event-person-tile-ask-link:hover { background: var(--amber-soft); } .event-room-read { padding-bottom: 4px; } .event-room-read-eyebrow { display: flex; align-items: baseline; gap: 8px; margin: 4px 0 10px; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-mute); } .event-room-read-head { display: flex; align-items: baseline; gap: 8px; margin: 0 0 12px; font-family: var(--font-serif); font-size: 16px; font-weight: 500; color: var(--ink); letter-spacing: -0.005em; } .event-room-read-head-sub { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; color: var(--ink-fade); letter-spacing: 0.12em; text-transform: lowercase; } .event-room-read-chips { display: flex; flex-wrap: wrap; gap: 6px; } .event-room-read-chip-wrap { display: inline-block; } .event-room-read-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px 5px 8px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink); line-height: 1.3; cursor: pointer; list-style: none; transition: border-color 0.15s ease, background 0.15s ease; } .event-room-read-chip::-webkit-details-marker { display: none; } .event-room-read-chip::marker { content: ""; } .event-room-read-chip:hover { border-color: var(--amber); } .event-room-read-chip-caret { margin-left: 2px; color: var(--ink-mute); font-size: 14px; line-height: 1; transition: transform 0.15s ease, color 0.15s ease; } .event-room-read-chip-wrap[open] .event-room-read-chip { background: var(--amber-soft); border-color: var(--amber); } .event-room-read-chip-wrap[open] .event-room-read-chip-caret { transform: rotate(90deg); color: var(--amber); } .event-room-read-chip-people { list-style: none; margin: 8px 0 4px 8px; padding: 0; display: flex; flex-direction: column; gap: 6px; } .event-room-read-chip-person { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); font-family: var(--font-sans); padding: 6px 10px 6px 6px; border-radius: 10px; background: var(--paper); border: 1px solid var(--border-soft); transition: background 0.15s ease, border-color 0.15s ease; min-width: 0; } .event-room-read-chip-person:hover { background: var(--amber-soft); border-color: var(--amber); } .event-room-read-chip-face, img.event-room-read-chip-face, img.event-room-read-chip-face-image { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background: var(--paper-2); color: var(--ink-mute); display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 13px; font-weight: 500; } .event-room-read-chip-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; } .event-room-read-chip-name { font-family: var(--font-serif); font-size: 14px; font-weight: 500; color: var(--ink); letter-spacing: -0.005em; line-height: 1.2; } .event-room-read-chip-meta { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); line-height: 1.3; overflow-wrap: anywhere; } .event-room-read-chips { align-items: flex-start; } .event-room-read-chip-label { font-weight: 500; } .event-room-read-chip-count { display: inline-flex; align-items: center; justify-content: center; padding: 0; font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: var(--ink-mute); letter-spacing: 0.02em; } .event-asks-head { margin: 0 0 12px; font-family: var(--font-serif); font-size: 16px; font-weight: 500; color: var(--ink); letter-spacing: -0.005em; } .event-asks-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; } .event-asks-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px 5px 8px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink); line-height: 1.3; } .event-asks-pill-label { font-weight: 500; } a.event-asks-pill-link { text-decoration: none; color: inherit; transition: border-color 0.15s ease, background-color 0.15s ease; } a.event-asks-pill-link:hover { border-color: var(--amber); background: var(--amber-soft); } .event-asks-pill-count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; padding: 0 5px; height: 18px; border-radius: 999px; background: var(--amber-soft); color: var(--amber); font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; } .event-asks-list { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 14px; } .event-asks-item { padding-left: 12px; border-left: 2px solid var(--amber-soft); } .event-asks-item-text { display: inline-block; margin: 0; font-family: var(--font-serif); font-size: 14.5px; line-height: 1.4; color: var(--ink); letter-spacing: -0.005em; text-decoration: none; } a.event-asks-item-text-common { border-bottom: 1px solid transparent; transition: color 0.15s ease, border-color 0.15s ease; } a.event-asks-item-text-common:hover { color: var(--amber); border-bottom-color: var(--amber); } .event-asks-item-quote { color: var(--ink-fade); } .event-asks-item-askers { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin-top: 5px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .event-asks-item-dash { color: var(--ink-fade); margin-right: 2px; } .event-asks-item-asker { display: inline-flex; align-items: center; gap: 5px; text-decoration: none; color: var(--ink); padding: 1px 2px; border-radius: 999px; transition: color 0.15s ease; } .event-asks-item-asker:hover { color: var(--amber); } .event-asks-item-asker:hover .event-asks-item-name { text-decoration: underline; } .event-asks-item-face, img.event-asks-item-face, img.event-asks-item-face-image { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background: var(--paper-2); color: var(--ink-mute); display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 10.5px; font-weight: 500; } .event-asks-item-name { font-weight: 500; letter-spacing: -0.005em; } .card-screen { padding: 4px 22px 8px; } .card-eyebrow { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--amber); margin: 14px 0 8px; } .card-title { font-family: var(--font-serif); font-size: 30px; font-weight: 500; letter-spacing: -0.022em; line-height: 1.08; color: var(--ink); margin: 0 0 8px; } .card-subtitle { font-family: var(--font-serif); font-size: 14.5px; font-weight: 400; color: var(--ink-soft); line-height: 1.5; margin: 0 0 18px; } .card-preview-header { display: flex; align-items: baseline; justify-content: space-between; margin: 0 0 8px; } .card-preview-eyebrow { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--amber); } .card-saved { font-family: var(--font-sans); font-size: 11px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-mute); display: inline-flex; align-items: center; gap: 5px; transition: color 0.2s; } .card-saved::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--ink-faint); transition: background 0.2s; } .card-saved.is-saving::before { background: var(--amber); } .card-saved.is-saved::before { background: #5fb37a; } .founder-card { position: relative; background: radial-gradient(circle at 12% -8%, rgba(198, 74, 26, 0.10) 0%, transparent 42%), linear-gradient(180deg, rgba(255, 255, 255, 0.90) 0%, rgba(255, 255, 255, 0.40) 22%, rgba(255, 255, 255, 0) 58% ), var(--paper-2); border: 1px solid rgba(230, 212, 194, 0.7); border-radius: 28px; padding: 18px 22px 20px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 0 0 1px rgba(255, 255, 255, 0.35), 0 1px 2px rgba(26, 24, 20, 0.06), 0 4px 12px rgba(26, 24, 20, 0.05), 0 18px 44px rgba(26, 24, 20, 0.08), 0 36px 72px rgba(198, 74, 26, 0.05); overflow: visible; margin: 6px 0 22px; transition: transform 0.25s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.3s cubic-bezier(0.32, 0.72, 0, 1); flex-shrink: 0; } .founder-card:has(a.founder-card-identity-link:hover) { transform: translateY(-4px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 0 0 1px rgba(255, 255, 255, 0.4), 0 2px 4px rgba(26, 24, 20, 0.06), 0 8px 20px rgba(26, 24, 20, 0.07), 0 28px 60px rgba(26, 24, 20, 0.12), 0 48px 96px rgba(198, 74, 26, 0.07); } .founder-card .founder-card-edit { top: 22px; right: 20px; } .founder-card-body { padding: 0; } .founder-card-identity { display: flex; gap: 12px; align-items: center; } .founder-card-identity-text { flex: 1; min-width: 0; } a.founder-card-identity-link { text-decoration: none; color: inherit; transition: color 0.15s ease; } a.founder-card-identity-link:hover .founder-card-name { color: var(--amber); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; } .founder-card-identity-arrow { margin-left: auto; font-size: 22px; font-weight: 300; color: var(--ink-fade); line-height: 1; transition: transform 0.15s ease, color 0.15s ease; } a.founder-card-identity-link:hover .founder-card-identity-arrow { color: var(--amber); transform: translateX(2px); } .founder-card-name-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; } .founder-card-name { font-family: var(--font-serif); font-size: 21px; font-weight: 500; letter-spacing: -0.018em; line-height: 1.15; color: var(--ink); overflow-wrap: anywhere; } .founder-card-city-eyebrow { margin: 0 0 4px; font-family: var(--font-mono); font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--amber); } .founder-card-meta { margin-top: 2px; font-family: var(--font-serif); font-size: 13px; color: var(--ink-mute); line-height: 1.35; overflow-wrap: anywhere; } .founder-card-bio { margin: 8px 0 0; font-family: var(--font-serif); font-size: 14px; color: var(--ink); line-height: 1.45; overflow-wrap: anywhere; } .founder-card-row { margin-top: 14px; padding-top: 0; border-top: none; } .founder-card-row-label { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; color: var(--ink-mute); letter-spacing: 0.02em; margin-bottom: 2px; } .founder-card-row-value { font-family: var(--font-serif); font-size: 13.5px; font-weight: 400; color: var(--ink); line-height: 1.45; overflow-wrap: anywhere; } .founder-card-about { display: flex; flex-direction: column; gap: 2px; } .founder-card-about-line { display: flex; align-items: baseline; gap: 8px; font-family: var(--font-serif); font-size: 13.5px; line-height: 1.5; overflow-wrap: anywhere; } .founder-card-about-key { flex-shrink: 0; min-width: 44px; font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; color: var(--ink-fade); letter-spacing: 0.02em; } .founder-card-about-value { color: var(--ink); } .founder-card-pinned-row { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border-soft); display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; } .founder-card-pinned-link { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-underline-offset: 3px; overflow-wrap: anywhere; } .founder-card-pinned-link:hover { text-decoration-color: var(--ink); } .founder-card-pinned-link span { color: var(--ink-fade); margin-left: 4px; } .founder-card-edit { position: absolute; top: 8px; right: 8px; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--paper); color: var(--ink-mute); text-decoration: none; transition: background 0.15s ease, color 0.15s ease; z-index: 1; } .founder-card-edit:hover { background: var(--paper-2); color: var(--ink); } .card-section-heading { display: flex; align-items: baseline; gap: 10px; margin: 24px 0 4px; } .card-section-num { font-family: var(--font-mono); font-size: 11.5px; font-weight: 600; color: var(--amber); letter-spacing: 0.08em; } .card-section-title { font-family: var(--font-serif); font-size: 22px; font-weight: 500; letter-spacing: -0.012em; color: var(--ink); } .card-section-sub { font-family: var(--font-serif); font-size: 14px; font-weight: 400; color: var(--ink-soft); line-height: 1.45; margin: 0 0 14px; } .card-more { margin-top: 22px; border-top: 1px solid var(--rule); } .card-more-summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 2px; cursor: pointer; list-style: none; font-family: var(--font-sans); } .card-more-summary::-webkit-details-marker { display: none; } .card-more-label { font-size: 15px; font-weight: 600; color: var(--ink); } .card-more-label::before { content: "+ "; color: var(--amber); font-weight: 700; } .card-more[open] .card-more-label::before { content: "– "; } .card-more-opt { font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); } .card-row-cap { margin-left: 6px; font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-fade); } .card-row-aside { font-family: var(--font-sans); font-size: 12px; font-weight: 400; color: var(--ink-mute); } .photo-row { display: flex; align-items: center; gap: 12px; margin: 6px 0 18px; } .photo-thumb { width: 44px; height: 44px; border-radius: 8px; background: var(--paper-2); border: 1px dashed rgba(0, 0, 0, 0.16); display: flex; align-items: center; justify-content: center; cursor: pointer; } .photo-thumb svg { width: 18px; height: 18px; stroke: var(--ink-mute); stroke-width: 1.5; fill: none; } .photo-btn { display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border-radius: 10px; border: 1px solid var(--amber); color: var(--amber); background: transparent; font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; cursor: pointer; transition: background 0.2s; } .photo-btn:hover { background: rgba(198, 74, 26, 0.06); } .card-field { margin: 0 0 12px; } .card-field-label, .card-field-label-row { display: block; font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin: 0 0 6px; } .card-field-label-row { margin: 18px 0 8px; } .card-input { width: 100%; height: 44px; padding: 0 14px; border-radius: 10px; border: 1px solid var(--amber-soft); background: var(--paper); font-family: var(--font-serif); font-size: 15px; color: var(--ink); transition: border-color 0.2s, box-shadow 0.2s; } .card-input::placeholder { color: var(--ink-fade); } .card-input:focus { outline: none; border-color: var(--amber); box-shadow: 0 0 0 3px rgba(198, 74, 26, 0.08); } .card-socials-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 4px 0 8px; } .card-social { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 10px; border: 1px solid var(--border-soft); border-radius: 10px; background: var(--paper); transition: border-color 0.2s, box-shadow 0.2s; } .card-social:focus-within { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(26, 24, 20, 0.04); } .card-social-icon { width: 16px; height: 16px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--ink-mute); } .card-social-icon svg { width: 100%; height: 100%; stroke: currentColor; stroke-width: 1.5; fill: none; } .card-social-icon svg path[fill="currentColor"] { fill: currentColor; } .card-social-input { flex: 1; min-width: 0; border: none; background: transparent; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink); height: 100%; padding: 0; } .card-social-input::placeholder { color: var(--ink-fade); } .card-social-input:focus { outline: none; } .chip-group { margin: 14px 0 4px; } .chip-group-label { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 8px; } .chip.chip-plus { border-style: dashed; color: var(--ink-soft); } .chip.chip-plus.selected { border-style: solid; color: var(--paper); } .chip-plus-mark { color: var(--ink-mute); margin-right: 4px; font-weight: 400; } .chip.chip-plus.selected .chip-plus-mark { color: var(--paper); } .card-bottom-bar { text-align: center; } .cta-btn-step { width: 100%; height: 54px; border-radius: 14px; font-size: 15.5px; font-weight: 500; font-family: inherit; cursor: pointer; border: none; background: var(--paper-2); color: var(--ink-mute); letter-spacing: -0.005em; transition: background 0.2s, color 0.2s, box-shadow 0.2s; } .cta-btn-step::before { content: "✓"; display: inline-block; margin-right: 8px; font-size: 12px; vertical-align: middle; opacity: 0.55; } .cta-btn-step:disabled { cursor: not-allowed; } .cta-btn-step.is-ready { background: var(--ink); color: var(--paper); box-shadow: 0 2px 10px rgba(26, 24, 20, 0.12); } .cta-btn-step.is-ready::before { opacity: 1; } .cta-btn-step.is-pending { background: var(--paper-2); color: var(--ink-soft); cursor: pointer; } .cta-btn-step.is-pending::before { content: ""; margin-right: 0; } .is-pulsing { animation: card-form-pulse 1.4s ease-out; border-radius: 10px; } @keyframes card-form-pulse { 0% { box-shadow: 0 0 0 0 rgba(198, 74, 26, 0.0); } 20% { box-shadow: 0 0 0 6px rgba(198, 74, 26, 0.18); } 100% { box-shadow: 0 0 0 0 rgba(198, 74, 26, 0.0); } } .card-bottom-hint { margin: 10px 6px 4px; font-family: var(--font-serif); font-size: 12.5px; font-weight: 400; color: var(--ink-mute); line-height: 1.45; } .card-copy-link { display: inline-block; margin: 2px auto 0; padding: 8px 4px; background: none; border: none; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); cursor: pointer; } .card-copy-link:hover { color: var(--ink); } .card-copy-link.is-copied { color: var(--amber); } .top-nav { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--border-soft); background: var(--surface); font-family: var(--font-sans); flex-shrink: 0; flex-wrap: nowrap; position: sticky; top: 0; z-index: 10; } .top-nav-leading { display: inline-flex; align-items: center; } .top-nav-brand { font-family: var(--font-serif); font-size: 18px; font-weight: 500; letter-spacing: -0.012em; color: var(--ink); text-decoration: none; flex-shrink: 0; display: inline-flex; align-items: center; } .top-nav-brand:hover { color: var(--amber); } .top-nav-brand-img { height: 56px; width: auto; display: block; } .top-nav-links { display: flex; align-items: center; gap: 14px; margin-left: 6px; flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; } .top-nav-links::-webkit-scrollbar { display: none; } .top-nav-link { font-size: 13px; font-weight: 500; color: var(--ink-mute); text-decoration: none; white-space: nowrap; padding: 4px 2px; border-bottom: 1.5px solid transparent; transition: color 0.15s ease, border-color 0.15s ease; } .top-nav-link:hover { color: var(--ink); } .top-nav-mode { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); background: transparent; border: 1px solid var(--border); border-radius: 999px; padding: 4px 10px; margin-right: 8px; cursor: pointer; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .top-nav-mode:hover { border-color: var(--ink-mute); color: var(--ink); } .top-nav-mode-admin { background: rgba(198, 74, 26, 0.08); border-color: rgba(198, 74, 26, 0.4); color: var(--amber); } .top-nav-mode-admin:hover { background: rgba(198, 74, 26, 0.14); border-color: var(--amber); color: var(--amber); } .top-nav-link.is-active { color: var(--ink); border-bottom-color: var(--amber); } .top-nav-trailing { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; flex-shrink: 0; } .top-nav-signout { background: none; border: none; cursor: pointer; font-family: inherit; font-size: 12.5px; font-weight: 500; color: var(--ink-fade); padding: 4px 2px; } .top-nav-signout:hover { color: var(--ink); } .top-nav-user { position: relative; display: inline-flex; } .top-nav-user-btn { display: inline-flex; align-items: center; gap: 5px; padding: 3px 8px 3px 3px; border: 1px solid var(--border); background: var(--paper); cursor: pointer; line-height: 0; border-radius: 999px; transition: border-color .16s, background .16s; } .top-nav-user-btn:hover, .top-nav-user-btn[aria-expanded="true"] { border-color: var(--amber); } .top-nav-user-btn:hover .top-nav-avatar, .top-nav-user-btn:hover img.top-nav-avatar-image, .top-nav-user-btn[aria-expanded="true"] .top-nav-avatar, .top-nav-user-btn[aria-expanded="true"] img.top-nav-avatar-image { box-shadow: 0 0 0 2px var(--amber); } .top-nav-user-caret { display: inline-flex; color: var(--ink-fade); transition: transform .16s, color .16s; } .top-nav-user-caret svg { width: 14px; height: 14px; } .top-nav-user-btn:hover .top-nav-user-caret { color: var(--amber); } .top-nav-user-btn[aria-expanded="true"] .top-nav-user-caret { transform: rotate(180deg); color: var(--amber); } .top-nav-menu-head { display: block; padding: 6px 10px 8px; margin-bottom: 4px; border-bottom: 1px solid var(--border); font-family: inherit; font-size: 12px; font-weight: 600; color: var(--ink-fade); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .top-nav-avatar { width: 32px; height: 32px; border-radius: 50%; } img.top-nav-avatar-image { display: block; width: 32px; height: 32px; border-radius: 50%; object-fit: cover; background: var(--paper-2); } .top-nav-menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 60; min-width: 160px; padding: 6px; background: var(--paper); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 8px 24px rgba(26, 24, 20, 0.14); } .top-nav-menu-item { display: block; width: 100%; text-align: left; padding: 8px 10px; border: none; background: none; border-radius: 8px; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 500; color: var(--ink); text-decoration: none; } .top-nav-menu-item:hover { background: var(--paper-2); } .top-nav-menu-signout { color: var(--ink-fade); } .top-nav-icon-btn { background: none; border: none; cursor: pointer; font-family: inherit; font-size: 18px; font-weight: 300; color: var(--ink-mute); padding: 4px 6px; line-height: 1; text-decoration: none; transition: color 0.15s ease; } .top-nav-icon-btn:hover { color: var(--ink); } .top-nav-back { display: inline-flex; align-items: center; gap: 3px; padding: 4px 8px 4px 4px; color: var(--ink-mute); text-decoration: none; font-family: var(--font-sans); transition: color 0.15s ease; } .top-nav-back:hover { color: var(--ink); } .top-nav-back-chevron { font-size: 18px; line-height: 1; font-weight: 300; } .top-nav-back-label { font-size: 13px; font-weight: 500; letter-spacing: 0.01em; } .founder-card-line { margin: 8px 0 0; padding-top: 8px; border-top: 1px solid var(--border-soft); font-family: var(--font-serif); font-size: 14px; line-height: 1.5; color: var(--ink); overflow-wrap: anywhere; } .founder-card-line-lead { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.04em; color: var(--ink-fade); text-transform: uppercase; margin-right: 6px; } .founder-card-line-about { color: var(--ink); } .founder-card-line-hoping { color: var(--ink); } .founder-card-line-pinned { color: var(--ink-mute); } .founder-card-line-bio { color: var(--ink); } .founder-card-intro { margin: 10px 0 0; font-family: var(--font-serif); font-size: 14px; line-height: 1.5; color: var(--ink-soft); overflow-wrap: anywhere; } .founder-card-wants { margin-top: 14px; padding: 13px 15px; border: 1px solid var(--border-soft); border-radius: 12px; background: var(--bg); display: flex; flex-direction: column; gap: 12px; } .founder-card-want { display: flex; flex-direction: column; gap: 7px; } .founder-card-want-label { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); } .founder-card-wants .founder-card-asks-list { margin: 0; } .founder-card-links { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 16px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border-soft); } .founder-card-links .founder-card-socials { margin: 0; } .founder-card-showing { margin-top: 10px; padding: 9px 11px; background: rgba(198, 74, 26, 0.06); border: 1px solid rgba(198, 74, 26, 0.22); border-left: 3px solid var(--accent); border-radius: 10px; color: var(--ink); } .founder-card-line-showing { margin: 0; font-family: var(--font-serif); font-size: 14px; line-height: 1.5; color: var(--ink); overflow-wrap: anywhere; } .founder-card-showing .founder-card-line-lead { color: var(--accent); } .founder-card-showing-video { position: relative; margin-top: 9px; border-radius: 8px; overflow: hidden; aspect-ratio: 16 / 9; background: #000; } .founder-card-showing-facade { display: block; width: 100%; height: 100%; position: relative; } .founder-card-showing-thumb { width: 100%; height: 100%; object-fit: cover; display: block; } .founder-card-showing-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; } .founder-card-showing-video iframe { width: 100%; height: 100%; border: 0; display: block; } .founder-card-showing-event { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); text-decoration: none; } .founder-card-showing-event:hover { color: var(--ink); } .founder-card-showing-sep { color: var(--ink-fade); margin: 0 4px; } .founder-card-showing-link { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink); text-decoration: underline; text-decoration-color: rgba(26, 24, 20, 0.25); text-underline-offset: 3px; overflow-wrap: anywhere; } .founder-card-showing-link:hover { text-decoration-color: var(--ink); } .founder-card-showing-link span { color: var(--ink-fade); margin-left: 4px; } .founder-card-asks-list { margin: 6px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; } .founder-card-ask { position: relative; padding-left: 16px; font-size: 14px; line-height: 1.45; color: var(--ink); } .founder-card-ask::before { content: ""; position: absolute; left: 2px; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--amber); } .founder-card-event { display: flex; align-items: center; gap: 12px; margin-top: 16px; padding: 13px 15px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); text-decoration: none; transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease; } .founder-card-event:hover { border-color: var(--ink-fade); background: var(--bg); box-shadow: 0 6px 18px rgba(26, 24, 20, 0.08); } .founder-card-event-icon { display: flex; flex: none; color: var(--ink-mute); } .founder-card-event-text { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; } .founder-card-event-title { font-family: var(--font-serif); font-size: 15.5px; font-weight: 500; line-height: 1.3; color: var(--ink); letter-spacing: -0.005em; } .founder-card-event-date { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); } .founder-card-event-go { display: flex; flex: none; color: var(--ink-fade); transition: color 0.15s ease, transform 0.15s ease; } .founder-card-event:hover .founder-card-event-go { color: var(--accent); transform: translateX(2px); } .founder-card-line-socials { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } .founder-card-line-socials .founder-card-socials { margin: 0; } img.feed-attendee-avatar, img.feed-attendee-avatar-image { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex-shrink: 0; margin-top: 1px; background: var(--paper-2); display: block; } .feed-attendee-hoping { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 4px; } .feed-attendee-hoping-tag { font-family: var(--font-sans); font-size: 10.5px; font-weight: 500; color: var(--ink-mute); background: var(--paper-2); padding: 2px 8px; border-radius: 999px; line-height: 1.4; } .feed-attendee-hoping-tag-link { text-decoration: none; transition: background 0.15s ease, color 0.15s ease; } .feed-attendee-hoping-tag-link:hover { background: var(--amber-soft); color: var(--amber); } .feed-empty-block { display: flex; flex-direction: column; gap: 16px; padding: 8px 0 4px; } .feed-past-strip { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 4px; margin: 0 -24px; padding-left: 24px; padding-right: 24px; scrollbar-width: none; } .feed-past-strip::-webkit-scrollbar { display: none; } .feed-past-card { display: flex; flex-direction: column; flex-shrink: 0; width: 180px; text-decoration: none; color: inherit; border: 1px solid var(--border-soft); border-radius: 12px; overflow: hidden; transition: border-color 0.15s ease; } .feed-past-card:hover { border-color: rgba(0, 0, 0, 0.2); } .feed-past-card-cover { width: 100%; height: 90px; background: var(--paper-2) center / cover no-repeat; } .feed-past-card-text { padding: 8px 10px 10px; } .feed-past-card-title { font-family: var(--font-serif); font-size: 13px; font-weight: 500; color: var(--ink); line-height: 1.3; margin-bottom: 2px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .feed-past-card-meta { font-family: var(--font-sans); font-size: 11px; color: var(--ink-fade); line-height: 1.3; } .profile-shared { margin: 8px 0 14px; padding: 10px 14px; background: var(--amber-soft); border-radius: 10px; font-family: var(--font-serif); font-size: 13.5px; color: var(--ink); line-height: 1.45; overflow-wrap: anywhere; } .profile-shared-lead { font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.04em; color: var(--amber); text-transform: uppercase; margin-right: 6px; } .profile-completion { display: block; margin: 6px 0 18px; padding: 10px 14px; border: 1px dashed rgba(0, 0, 0, 0.18); border-radius: 10px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); text-decoration: none; text-align: center; transition: border-color 0.15s ease, color 0.15s ease; } .profile-completion:hover { border-color: var(--ink); color: var(--ink); } .profile-completion-cta { color: var(--amber); font-weight: 500; margin-left: 2px; } .card-nudge { margin: 10px 0 18px; padding: 14px 16px; background: var(--amber-soft); border-radius: 12px; } .card-nudge-lead { margin: 0 0 10px; font-family: var(--font-serif); font-size: 14.5px; line-height: 1.45; color: var(--ink); } .card-nudge-actions { display: flex; flex-wrap: wrap; gap: 8px; } .card-nudge-pill { display: inline-flex; align-items: center; padding: 8px 14px; border: 1px solid rgba(198, 74, 26, 0.35); border-radius: 999px; background: var(--paper); font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-soft); text-decoration: none; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .card-nudge-pill:hover { border-color: var(--amber); color: var(--ink); } .card-nudge-pill-primary { background: var(--amber); border-color: var(--amber); color: #fff; } .card-nudge-pill-primary:hover { background: #b03f14; border-color: #b03f14; color: #fff; } .profile-discovery { margin-top: 28px; padding-top: 0; border-top: 0; } .me-activity { margin: 24px 0 0; padding: 0; background: transparent; border-radius: 0; } .me-activity-head { margin: 0 0 10px; } .me-activity-eyebrow { display: block; margin: 0 0 4px; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); } .me-activity-title { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 20px; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink); } .me-activity-summary { margin: 8px 0 18px; font-family: var(--font-serif); font-size: 13.5px; color: var(--ink-soft); line-height: 1.55; } .me-activity-empty { display: block; margin: 4px 0 12px; padding: 12px 14px; border: 1px dashed var(--border); border-radius: 10px; font-family: var(--font-serif); font-size: 13px; color: var(--ink-mute); text-decoration: none; line-height: 1.45; } .me-activity-empty:hover { border-color: var(--ink-mute); color: var(--ink); } .me-activity-empty-cta { font-family: var(--font-sans); font-weight: 500; color: var(--amber); margin-left: 4px; } .me-activity-section + .me-activity-section { margin-top: 22px; } .me-activity-tabs { margin: 4px 0 0; } .me-activity-tab-input { position: absolute; opacity: 0; pointer-events: none; } .me-activity-tab-list { display: flex; gap: 6px; margin: 0 0 14px; padding-bottom: 8px; border-bottom: 1px solid var(--border-soft); } .me-activity-tab { display: inline-flex; align-items: baseline; gap: 6px; padding: 6px 12px; border-radius: 999px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-mute); background: transparent; cursor: pointer; transition: background 0.15s ease, color 0.15s ease; } .me-activity-tab:hover { color: var(--ink); } .me-activity-tab-count { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.02em; color: var(--ink-fade); } .me-activity-tab-list { display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 4px; margin: 0 0 6px; padding-bottom: 0; border-bottom: 0; } .me-activity-tab-list::-webkit-scrollbar { display: none; } .me-activity-tab { white-space: nowrap; flex: 0 0 auto; padding: 6px 12px; font-size: 12.5px; } .me-activity-tab-input-events:checked ~ .me-activity-tab-list label[for=me_activity_tab_events], .me-activity-tab-input-attendees:checked ~ .me-activity-tab-list label[for=me_activity_tab_attendees], .me-activity-tab-input-feed:checked ~ .me-activity-tab-list label[for=me_activity_tab_feed] { background: var(--amber-soft); color: var(--ink); } .me-activity-tab:focus-visible, .me-activity-tab-input:focus-visible + .me-activity-tab-list .me-activity-tab { outline: 2px solid var(--amber); outline-offset: 2px; } .me-activity-tab-panel { display: none; } .me-activity-tab-input-events:checked ~ .me-activity-tab-panel-events, .me-activity-tab-input-attendees:checked ~ .me-activity-tab-panel-attendees, .me-activity-tab-input-feed:checked ~ .me-activity-tab-panel-feed { display: block; } .me-subtabs { margin: 0; } .me-subtab-input { position: absolute; opacity: 0; pointer-events: none; } .me-subtab-list { display: flex; flex-wrap: nowrap; gap: 4px; margin: 0 0 14px; padding: 0; background: transparent; border: none; overflow-x: auto; -webkit-overflow-scrolling: touch; opacity: 0.75; } .me-subtab-list::-webkit-scrollbar { display: none; } .me-subtab { flex: 0 0 auto; display: inline-flex; align-items: baseline; white-space: nowrap; padding: 6px 12px; border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; letter-spacing: 0; color: var(--ink-mute); background: transparent; border: none; cursor: pointer; transition: background 0.15s ease, color 0.15s ease; } .me-subtab:hover { color: var(--ink); } .me-subtab-input-events-upcoming:checked ~ .me-subtab-list .me-subtab-target-events-upcoming, .me-subtab-input-events-past:checked ~ .me-subtab-list .me-subtab-target-events-past, .me-subtab-input-attendees-going:checked ~ .me-subtab-list .me-subtab-target-attendees-going, .me-subtab-input-attendees-went:checked ~ .me-subtab-list .me-subtab-target-attendees-went, .me-subtab-input-attendees-city:checked ~ .me-subtab-list .me-subtab-target-attendees-city { background: var(--amber-soft); color: var(--ink); } .me-subtab-panel { display: none; } .me-subtab-input-events-upcoming:checked ~ .me-subtab-panel-events-upcoming, .me-subtab-input-events-past:checked ~ .me-subtab-panel-events-past, .me-subtab-input-attendees-going:checked ~ .me-subtab-panel-attendees-going, .me-subtab-input-attendees-went:checked ~ .me-subtab-panel-attendees-went, .me-subtab-input-attendees-city:checked ~ .me-subtab-panel-attendees-city { display: block; } .me-participants-group { margin: 20px 0 0; } .me-participants-group:first-of-type { margin-top: 4px; } .me-participants-group-head { margin: 0 0 10px; } .me-participants-group-title { display: flex; align-items: baseline; gap: 8px; margin: 0; padding-bottom: 6px; border-bottom: 1px solid var(--border-soft); font-family: var(--font-serif); font-size: 17px; font-weight: 500; color: var(--ink); letter-spacing: -0.005em; } .me-participants-group-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-fade); letter-spacing: 0.02em; } .me-participants-group-desc { margin: 6px 0 12px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); line-height: 1.45; } .me-participants-extra { display: none; margin-top: 18px; } .me-participants-expand-input:checked ~ .me-participants-list .me-participants-extra { display: flex; flex-direction: column; gap: 18px; } .me-participants-expand-btn { display: inline-block; margin: 12px 0 0; padding: 8px 14px; border-radius: 999px; background: var(--paper-2); font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink); cursor: pointer; transition: background 0.15s ease; } .me-participants-expand-btn:hover { background: var(--paper-3, #ede7d8); } .me-participants-expand-when-expanded { display: none; } .me-participants-expand-input:checked ~ .me-participants-expand-btn .me-participants-expand-when-collapsed { display: none; } .me-participants-expand-input:checked ~ .me-participants-expand-btn .me-participants-expand-when-expanded { display: inline; } .me-scope { margin: 0; } .me-scope-input { position: absolute; opacity: 0; pointer-events: none; } .me-scope-list { display: flex; flex-wrap: nowrap; gap: 3px; margin: 0 0 12px; padding: 0 0 0 12px; opacity: 0.7; overflow-x: auto; -webkit-overflow-scrolling: touch; } .me-scope-list::-webkit-scrollbar { display: none; } .me-scope-label { flex: 0 0 auto; white-space: nowrap; padding: 4px 10px; border-radius: 999px; font-family: var(--font-sans); font-size: 11px; font-weight: 500; color: var(--ink-mute); background: transparent; border: none; cursor: pointer; transition: background 0.15s ease, color 0.15s ease; } .me-scope-label:hover { color: var(--ink); } .me-scope-input-city:checked ~ .me-scope-list label[for=me_scope_events_city], .me-scope-input-region:checked ~ .me-scope-list label[for=me_scope_events_region], .me-scope-input-global:checked ~ .me-scope-list label[for=me_scope_events_global] { background: var(--amber-soft); color: var(--ink); } .me-scope-panel { display: none; } .me-scope-input-city:checked ~ .me-scope-panel-city, .me-scope-input-region:checked ~ .me-scope-panel-region, .me-scope-input-global:checked ~ .me-scope-panel-global { display: block; } .me-explore { margin-top: 28px; } .explore-tabs { margin: 0; } .explore-tab-input, .explore-scope-input { position: absolute; opacity: 0; pointer-events: none; } .explore-tab-list { display: flex; flex-wrap: nowrap; gap: 4px; margin: 0 0 10px; overflow-x: auto; -webkit-overflow-scrolling: touch; } .explore-tab-list::-webkit-scrollbar { display: none; } .explore-tab { flex: 0 0 auto; white-space: nowrap; padding: 6px 12px; border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-mute); background: transparent; border: none; cursor: pointer; transition: background 0.15s ease, color 0.15s ease; } .explore-tab:hover { color: var(--ink); } .explore-tab-input-events:checked ~ .explore-tab-list label[for=explore_tab_events], .explore-tab-input-attendees:checked ~ .explore-tab-list label[for=explore_tab_attendees], .explore-tab-input-feed:checked ~ .explore-tab-list label[for=explore_tab_feed] { background: var(--amber-soft); color: var(--ink); } .explore-scope-list { display: flex; flex-wrap: nowrap; gap: 4px; margin: 0 0 16px; opacity: 0.75; overflow-x: auto; -webkit-overflow-scrolling: touch; } .explore-scope-list::-webkit-scrollbar { display: none; } .explore-scope { flex: 0 0 auto; white-space: nowrap; padding: 6px 12px; border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-mute); background: transparent; border: none; cursor: pointer; transition: background 0.15s ease, color 0.15s ease; } .explore-scope:hover { color: var(--ink); } .explore-scope-input-city:checked ~ .explore-scope-list label[for=explore_scope_city], .explore-scope-input-region:checked ~ .explore-scope-list label[for=explore_scope_region], .explore-scope-input-global:checked ~ .explore-scope-list label[for=explore_scope_global] { background: var(--amber-soft); color: var(--ink); } .explore-tab-input-feed:checked ~ .explore-scope-list { display: none; } .explore-panel { display: none; } .explore-scope-input-city:checked ~ .explore-tab-input-events:checked ~ .explore-panel-events-city, .explore-scope-input-region:checked ~ .explore-tab-input-events:checked ~ .explore-panel-events-region, .explore-scope-input-global:checked ~ .explore-tab-input-events:checked ~ .explore-panel-events-global { display: block; } .explore-scope-input-city:checked ~ .explore-tab-input-attendees:checked ~ .explore-panel-attendees-city, .explore-scope-input-region:checked ~ .explore-tab-input-attendees:checked ~ .explore-panel-attendees-region, .explore-scope-input-global:checked ~ .explore-tab-input-attendees:checked ~ .explore-panel-attendees-global { display: block; } .explore-tab-input-feed:checked ~ .explore-panel-feed { display: block; } .city-tabs { margin: 4px 0 0; } .city-tab-input { position: absolute; opacity: 0; pointer-events: none; } .city-tab-list { display: flex; gap: 6px; margin: 0 0 16px; padding-bottom: 8px; border-bottom: 1px solid var(--border-soft); flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; } .city-tab-list::-webkit-scrollbar { display: none; } .city-tab { display: inline-flex; align-items: baseline; gap: 6px; padding: 6px 12px; border-radius: 999px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-mute); background: transparent; cursor: pointer; white-space: nowrap; flex: 0 0 auto; transition: background 0.15s ease, color 0.15s ease; } .city-tab:hover { color: var(--ink); } .city-tab-count { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.02em; color: var(--ink-fade); } .city-tab-input-upcoming:checked ~ .city-tab-list .city-tab-target-upcoming, .city-tab-input-past:checked ~ .city-tab-list .city-tab-target-past, .city-tab-input-attendees:checked ~ .city-tab-list .city-tab-target-attendees, .city-tab-input-feed:checked ~ .city-tab-list .city-tab-target-feed { background: var(--amber-soft); color: var(--ink); } .city-tab-input-upcoming:checked ~ .city-tab-list .city-tab-target-upcoming .city-tab-count, .city-tab-input-past:checked ~ .city-tab-list .city-tab-target-past .city-tab-count, .city-tab-input-attendees:checked ~ .city-tab-list .city-tab-target-attendees .city-tab-count, .city-tab-input-feed:checked ~ .city-tab-list .city-tab-target-feed .city-tab-count { color: var(--ink-soft); } .city-tab-panel { display: none; } .city-tab-input-upcoming:checked ~ .city-tab-panel-upcoming, .city-tab-input-past:checked ~ .city-tab-panel-past, .city-tab-input-attendees:checked ~ .city-tab-panel-attendees, .city-tab-input-feed:checked ~ .city-tab-panel-feed { display: block; } .city-feed-compose { display: flex; flex-direction: column; gap: 8px; margin: 0 0 20px; padding: 16px; background: linear-gradient(180deg, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0) 70%), var(--paper-2); border: 1px solid var(--border-soft); border-radius: 18px; } .city-feed-compose-title { font-family: var(--font-serif); font-size: 15px; } .city-feed-compose-body { font-family: var(--font-serif); font-size: 14.5px; line-height: 1.45; resize: vertical; min-height: 84px; } .city-feed-compose-link { font-family: var(--font-mono); font-size: 12.5px; } .city-feed-compose-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } .city-feed-compose-sub { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); } .city-feed-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; } .city-feed-item { position: relative; padding: 18px 18px 14px; background: linear-gradient(180deg, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0) 60%), var(--paper-2); border: 1px solid var(--border-soft); border-radius: 18px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 1px 2px rgba(26, 24, 20, 0.04), 0 6px 18px rgba(26, 24, 20, 0.04); } .city-feed-item-title { margin: 0 0 10px; font-family: var(--font-serif); font-size: 24px; font-weight: 600; letter-spacing: -0.022em; line-height: 1.12; color: var(--ink); } .city-feed-item-body { font-family: var(--font-serif); font-size: 14.5px; line-height: 1.55; color: var(--ink); } .city-feed-item-body p { margin: 0 0 6px; } .city-feed-item-body p:last-child { margin-bottom: 0; } .city-feed-item-link { display: inline-block; margin-top: 8px; font-family: var(--font-mono); font-size: 12.5px; color: var(--amber); word-break: break-all; } .city-feed-item-link:hover { text-decoration: underline; } .city-feed-item-meta { margin-top: 10px; font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .city-feed-item-delete { background: none; border: none; padding: 0; margin: 0; font-family: var(--font-mono); font-size: 11px; color: var(--ink-fade); cursor: pointer; } .city-feed-item-delete:hover { color: var(--accent); } .city-feed-compose-file { display: flex; align-items: center; gap: 10px; margin: 0; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .city-feed-compose-file-label { flex-shrink: 0; } .city-feed-compose-file-input { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink); } .city-feed-item.city-feed-item-story { padding: 0; overflow: hidden; } .city-feed-item-content { display: block; } .city-feed-item-content-link { display: block; text-decoration: none; color: inherit; cursor: pointer; transition: transform 0.15s cubic-bezier(0.32, 0.72, 0, 1); } .city-feed-item-content-link:hover .city-feed-item-title, .city-feed-item-content-link:hover .city-feed-story-title { color: var(--accent); } .city-feed-item-content-link:active { transform: scale(0.998); } .feed-permalink { margin: 4px 0 22px; } .feed-permalink-title { margin: 0 0 8px; font-family: var(--font-serif); font-size: 32px; font-weight: 600; letter-spacing: -0.028em; line-height: 1.08; color: var(--ink); } .feed-permalink-meta { margin: 0 0 18px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .feed-permalink-cover { position: relative; margin: 0 0 18px; } .feed-permalink-cover-img, .feed-permalink-cover .city-feed-story-cover-img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 16px; background: var(--paper-2); } .feed-permalink-cover .city-feed-story-facade-wrap { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; } .feed-permalink-cover .city-feed-story-facade .city-feed-story-cover-img { position: absolute; inset: 0; border-radius: 0; aspect-ratio: auto; } .feed-permalink-body { font-family: var(--font-serif); font-size: 16px; line-height: 1.6; color: var(--ink); margin: 0 0 22px; } .feed-permalink-body p { margin: 0 0 14px; } .feed-permalink-body p:last-child { margin-bottom: 0; } .feed-permalink-source { margin: 0 0 22px; } .feed-permalink-source-link { display: inline-block; padding: 12px 20px; border-radius: 999px; background: var(--ink); color: white; text-decoration: none; font-family: var(--font-sans); font-size: 14px; font-weight: 500; transition: background 0.15s ease; } .feed-permalink-source-link:hover { background: var(--accent); } .feed-permalink-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 18px; padding: 14px 16px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 14px; } .feed-permalink-share-label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.10em; text-transform: uppercase; color: var(--ink-mute); margin-right: 4px; } .feed-permalink-share-btn { display: inline-block; padding: 7px 14px; border-radius: 999px; background: var(--paper); border: 1px solid var(--border-soft); color: var(--ink); text-decoration: none; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; cursor: pointer; transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease; } .feed-permalink-share-btn:hover { background: var(--ink); color: white; border-color: var(--ink); } .feed-permalink-share-btn-primary { background: var(--ink); color: white; border-color: var(--ink); } .feed-permalink-share-btn-primary:hover { background: var(--accent); border-color: var(--accent); } .feed-permalink-admin { margin: 18px 0 0; } .feed-permalink-admin-delete { background: none; border: 1px solid var(--border-soft); border-radius: 999px; padding: 6px 14px; font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); cursor: pointer; } .feed-permalink-admin-delete:hover { border-color: var(--accent); color: var(--accent); } .feed-permalink-related { margin: 28px 0 18px; } .feed-permalink-related-head { margin: 0 0 14px; font-family: var(--font-serif); font-size: 18px; font-weight: 500; color: var(--ink); } .city-feed-story-cover { position: relative; padding: 0 22px; } .city-feed-story-cover-img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 14px; background: var(--paper-2); } .city-feed-story-body { padding: 14px 22px 6px; } .city-feed-story-title { margin: 0 0 10px; font-family: var(--font-serif); font-size: 26px; font-weight: 600; letter-spacing: -0.024em; line-height: 1.12; color: var(--ink); } .city-feed-story-title-lead { padding: 22px 22px 14px; margin: 0; } .city-feed-story-facade-wrap { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; } .city-feed-story-facade { position: relative; display: block; width: 100%; height: 100%; text-decoration: none; cursor: pointer; } .city-feed-story-facade .city-feed-story-cover-img { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 0; aspect-ratio: auto; } .city-feed-story-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; transition: transform 0.15s ease, filter 0.15s ease; filter: drop-shadow(0 4px 16px rgba(0, 0, 0, 0.4)); pointer-events: none; } .city-feed-story-facade:hover .city-feed-story-play { transform: translate(-50%, -50%) scale(1.06); } .city-feed-story-facade:hover .city-feed-story-play svg path:first-child { fill: var(--accent); fill-opacity: 0.9; } .city-feed-story-video { position: absolute; inset: 0; width: 100%; height: 100%; border: none; display: block; } .city-feed-story-caption { font-family: var(--font-serif); font-size: 14.5px; line-height: 1.55; color: var(--ink); } .city-feed-story-caption p { margin: 0 0 6px; } .city-feed-story-caption p:last-child { margin-bottom: 0; } .city-feed-item.city-feed-item-story .city-feed-item-link, .city-feed-item.city-feed-item-story .city-feed-item-meta { padding-left: 20px; padding-right: 20px; } .city-feed-item.city-feed-item-story .city-feed-item-meta { padding-bottom: 16px; } .founder-card-context-label { margin-top: 6px; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.10em; text-transform: uppercase; color: var(--amber); } .me-activity-section-label { display: flex; align-items: baseline; gap: 8px; margin: 0 0 4px; padding-bottom: 6px; border-bottom: 1px solid var(--border-soft); font-family: var(--font-sans); font-size: 13px; font-weight: 600; letter-spacing: 0; color: var(--ink); } .me-activity-section-label-text { flex: 0 0 auto; } .me-activity-section-cta { margin-left: auto; font-family: var(--font-sans); font-size: 11.5px; font-weight: 500; letter-spacing: 0.02em; text-transform: none; color: var(--amber); text-decoration: none; } .me-activity-section-cta:hover { text-decoration: underline; } .me-activity-section-count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; padding: 1px 6px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 999px; font-family: var(--font-mono); font-size: 10px; font-weight: 600; color: var(--ink-soft); letter-spacing: 0; } .me-activity-section-desc { margin: 0 0 10px; font-family: var(--font-serif); font-size: 12.5px; line-height: 1.5; color: var(--ink-mute); } .me-activity-list { display: flex; flex-direction: column; gap: 10px; } .me-activity-intent { margin-top: 4px; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.3; } .me-activity-intent-done { color: #5fb37a; } .me-activity-intent-prompt { color: var(--amber); } .discovery-rail { margin: 24px 0 0; padding-top: 18px; border-top: 1px solid var(--border-soft); } .discovery-rail + .discovery-rail { border-top: 1px solid var(--border-soft); } .discovery-rail-head { margin: 0 0 14px; } .discovery-rail-eyebrow { display: inline-flex; align-items: baseline; gap: 8px; margin: 0 0 4px; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-fade); } .discovery-rail-count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; padding: 1px 6px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 999px; font-family: var(--font-mono); font-size: 10px; font-weight: 600; color: var(--ink-soft); letter-spacing: 0; } .discovery-rail-title { display: block; margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 18px; line-height: 1.25; letter-spacing: -0.015em; color: var(--ink); } .discovery-rail-desc { margin: 4px 0 0; font-family: var(--font-serif); font-size: 12.5px; line-height: 1.5; color: var(--ink-mute); } .discovery-rail-strip { display: flex; gap: 10px; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 4px 24px; margin: 0 -24px; } .discovery-rail-strip::-webkit-scrollbar { display: none; } .face-card { flex: 0 0 240px; display: flex; flex-direction: column; gap: 10px; padding: 14px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 12px; text-decoration: none; color: inherit; transition: border-color 0.15s ease, transform 0.12s ease, box-shadow 0.15s ease; } .face-card:hover { border-color: var(--ink-mute); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04); } .face-card-avatar, .face-card-avatar-image { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; background: var(--paper-2); display: inline-flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; } .face-card-text { display: flex; flex-direction: column; gap: 2px; } .face-card-name { font-family: var(--font-serif); font-size: 15px; font-weight: 500; color: var(--ink); line-height: 1.25; letter-spacing: -0.005em; } .face-card-host { display: inline-block; margin-left: 6px; padding: 1px 6px 2px; font-family: var(--font-mono); font-size: 9px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); background: var(--amber-soft); border-radius: 4px; vertical-align: 2px; } .face-card-meta { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); line-height: 1.4; } .face-card-city { margin: 0 0 3px; font-family: var(--font-mono); font-size: 10px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-fade); line-height: 1.4; } .face-card-hoping { margin-top: 4px; font-family: var(--font-serif); font-size: 12px; color: var(--ink-soft); line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .face-card-hoping-lead { font-family: var(--font-mono); font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-fade); margin-right: 4px; } .profile-section-head { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "eyebrow eyebrow" "title cta" "desc desc"; align-items: baseline; gap: 4px 12px; margin: 28px 0 14px; } .profile-section-head:first-child, .screen > .profile-section-head:first-of-type, .screen > section:first-of-type .profile-section-head { margin-top: 0; } .profile-section-eyebrow { grid-area: eyebrow; display: inline-flex; align-items: baseline; gap: 8px; font-family: var(--font-sans); font-size: 12px; font-weight: 500; letter-spacing: 0.01em; color: var(--ink-fade); } .profile-section-count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; padding: 1px 6px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 999px; font-family: var(--font-mono); font-size: 10px; font-weight: 600; color: var(--ink-soft); letter-spacing: 0; } .profile-section-title { grid-area: title; margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 20px; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink); } .profile-section-cta { grid-area: cta; align-self: baseline; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--amber); text-decoration: none; white-space: nowrap; } .profile-section-cta:hover { text-decoration: underline; } .profile-section-desc { grid-area: desc; margin: 2px 0 0; font-family: var(--font-serif); font-size: 12.5px; line-height: 1.5; color: var(--ink-mute); } .static-page { padding: 32px 24px 48px; } .static-page-title { font-family: var(--font-serif); font-weight: 500; font-size: 26px; line-height: 1.2; color: var(--ink); letter-spacing: -0.01em; margin: 0 0 14px; } .static-page-lede { font-family: var(--font-serif); font-size: 17px; line-height: 1.5; color: var(--ink); margin: 0 0 16px; } .static-page-body { font-family: var(--font-serif); font-size: 15.5px; line-height: 1.55; color: var(--ink-mute); margin: 0 0 14px; } .static-page-body a { color: var(--amber); text-decoration: none; } .static-page-body a:hover { text-decoration: underline; } .static-page-back { font-family: var(--font-sans); font-size: 13px; color: var(--amber); text-decoration: none; } .static-page-back:hover { text-decoration: underline; } .event-snapshots { margin: 18px 0 22px; } .event-snapshots-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 14px; padding: 0 18px; } .event-snapshots-title { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 22px; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink); } .event-snapshots-manage { font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--amber); text-decoration: none; } .event-snapshots-manage:hover { text-decoration: underline; } .event-snapshots-empty { display: block; margin: 14px 0; padding: 14px 16px; border: 1px dashed var(--amber); background: var(--amber-soft); border-radius: 12px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--amber); text-align: center; text-decoration: none; } .event-snapshots-empty:hover { background: #f0dfca; } .event-snapshots-list { display: flex; flex-direction: column; gap: 14px; } .event-snapshot { display: block; overflow: hidden; border-radius: 10px; background: var(--paper-2); text-decoration: none; line-height: 0; transition: transform 0.18s ease, box-shadow 0.18s ease; } .event-snapshot:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12); } .event-snapshot-img { display: block; width: 100%; height: auto; background: var(--paper-2); } .event-form-file { display: block; margin-top: 4px; font-family: var(--font-sans); font-size: 13px; } .event-form-photos-existing { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; margin-top: 8px; } .event-form-photo { display: flex; flex-direction: column; gap: 4px; } .event-form-photo-cover { position: relative; display: block; cursor: pointer; border-radius: 8px; overflow: hidden; transition: box-shadow 0.15s ease; } .event-form-photo-cover input[type="checkbox"] { position: absolute; opacity: 0; pointer-events: none; } .event-form-photo-cover img { width: 100%; height: 110px; object-fit: cover; border-radius: 8px; background: var(--paper-2); display: block; transition: filter 0.15s ease; } .event-form-photo-cover-badge { position: absolute; top: 6px; left: 6px; padding: 3px 8px; border-radius: 999px; background: var(--amber); color: white; font-family: var(--font-sans); font-size: 10px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; opacity: 0; transform: translateY(-4px); transition: opacity 0.15s ease, transform 0.15s ease; pointer-events: none; } .event-form-photo-is-cover .event-form-photo-cover, .event-form-photo-cover:has(input:checked) { box-shadow: 0 0 0 2px var(--amber); } .event-form-photo-is-cover .event-form-photo-cover-badge, .event-form-photo-cover:has(input:checked) .event-form-photo-cover-badge { opacity: 1; transform: translateY(0); } .event-form-photo-remove-row { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); cursor: pointer; } .event-form-photo-remove { display: flex; flex-direction: column; gap: 4px; cursor: pointer; } .event-form-photo-remove img { width: 100%; height: 110px; object-fit: cover; border-radius: 8px; background: var(--paper-2); } .photo-uploader { margin-bottom: 20px; } .photo-uploader-input { display: none; } .photo-uploader-drop { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 20px 16px; border: 1.5px dashed var(--border); border-radius: 14px; background: var(--paper-2); cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease; } .photo-uploader-drop.is-dragover { border-color: var(--accent); background: var(--paper); } .photo-uploader-drop .cta-btn { width: auto; min-width: 180px; height: 44px; pointer-events: none; } .photo-uploader-hint { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); margin: 0; } .photo-uploader-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; margin-top: 12px; } .photo-uploader-grid:empty { margin-top: 0; } .photo-tile { position: relative; aspect-ratio: 1 / 1; animation: photo-tile-in 180ms ease both; } @keyframes photo-tile-in { from { opacity: 0; transform: scale(0.96); } to { opacity: 1; transform: none; } } .photo-tile.is-removing { opacity: 0; transform: scale(0.94); transition: opacity 150ms ease, transform 150ms ease; } .photo-tile-media { position: absolute; inset: 0; border-radius: 10px; overflow: hidden; background: var(--paper-2); } .photo-tile-img { width: 100%; height: 100%; object-fit: cover; display: block; } .photo-tile-file { display: none; position: absolute; inset: 0; align-items: center; justify-content: center; background: var(--paper-2); color: var(--ink-faint); } .photo-tile.is-placeholder .photo-tile-img { display: none; } .photo-tile.is-placeholder .photo-tile-file { display: flex; } .photo-tile-file-icon { width: 34px; height: 34px; } .photo-tile-file-name { position: absolute; left: 6px; right: 6px; bottom: 9px; z-index: 2; padding: 2px 5px; border-radius: 5px; background: rgba(255, 255, 255, 0.85); color: var(--ink); font-family: var(--font-sans); font-size: 10px; font-weight: 600; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .photo-tile-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(20, 16, 12, 0.32); opacity: 0; pointer-events: none; transition: opacity 160ms ease; z-index: 1; } .photo-tile.is-uploading .photo-tile-overlay { opacity: 1; } .photo-tile-pct { font-family: var(--font-sans); font-size: 15px; font-weight: 700; color: #fff; letter-spacing: 0.01em; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55); } .photo-tile-progress { position: absolute; left: 0; right: 0; bottom: 0; height: 5px; background: rgba(0, 0, 0, 0.45); opacity: 0; transition: opacity 160ms ease; z-index: 2; } .photo-tile.is-uploading .photo-tile-progress { opacity: 1; } .photo-tile-progress-fill { display: block; width: 0; height: 100%; background: #25d366; box-shadow: 0 0 6px rgba(37, 211, 102, 0.7); transition: width 200ms ease; } .photo-tile-x-form { position: absolute; top: -5px; right: -5px; margin: 0; z-index: 4; } .photo-tile-x { position: absolute; top: -5px; right: -5px; z-index: 4; width: 24px; height: 24px; padding: 0; border: 1px solid rgba(20, 16, 12, 0.1); border-radius: 999px; background: #fff; color: var(--ink); font-family: var(--font-sans); font-size: 19px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.28); transition: background 140ms ease, color 140ms ease, transform 120ms ease; } .photo-tile-x-form .photo-tile-x { position: static; } .photo-tile-x:hover { background: var(--ink); color: #fff; } .photo-tile-x:active { transform: scale(0.9); } .photo-tile-x:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; } .photo-tile-fail { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 8px; background: rgba(16, 12, 10, 0.62); opacity: 0; pointer-events: none; transition: opacity 160ms ease; z-index: 3; } .photo-tile.is-failed .photo-tile-fail { opacity: 1; pointer-events: auto; } .photo-tile-fail-msg { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.02em; color: #fff; text-align: center; } .photo-tile-fail-actions { display: flex; align-items: center; gap: 6px; } .photo-tile-retry { padding: 5px 12px; border: none; border-radius: 999px; background: #fff; color: var(--ink); font-family: var(--font-sans); font-size: 12px; font-weight: 600; cursor: pointer; transition: transform 120ms ease; } .photo-tile-retry:hover { transform: translateY(-1px); } .photo-tile-retry:focus-visible { outline: 2px solid #fff; outline-offset: 2px; } .photo-tile-info { width: 24px; height: 24px; padding: 0; border: 1px solid rgba(255, 255, 255, 0.7); border-radius: 999px; background: transparent; color: #fff; font-family: var(--font-serif); font-size: 13px; font-style: italic; font-weight: 700; line-height: 1; cursor: pointer; } .photo-tile-info:focus-visible { outline: 2px solid #fff; outline-offset: 2px; } .photo-uploader-tooltip { position: fixed; z-index: 9999; display: none; max-width: 300px; padding: 8px 11px; border-radius: 8px; background: var(--ink); color: #fff; font-family: var(--font-sans); font-size: 12px; line-height: 1.4; text-align: left; white-space: normal; word-break: break-word; overflow-wrap: anywhere; box-shadow: 0 8px 28px rgba(0, 0, 0, 0.3); opacity: 0; pointer-events: none; transition: opacity 120ms ease; } .photo-uploader-tooltip::after { content: ""; position: absolute; left: var(--arrow-x, 50%); transform: translateX(-50%); width: 0; height: 0; border: 6px solid transparent; } .photo-uploader-tooltip[data-placement="top"]::after { top: 100%; border-top-color: var(--ink); } .photo-uploader-tooltip[data-placement="bottom"]::after { bottom: 100%; border-bottom-color: var(--ink); } .photo-uploader-deleteall { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border: 1px solid var(--border-soft); border-radius: 999px; background: transparent; color: var(--ink-mute); font-family: var(--font-sans); font-size: 12px; font-weight: 500; line-height: 1; white-space: nowrap; cursor: pointer; transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease; } .photo-uploader-deleteall:hover { color: #b42318; border-color: #e6c7c2; background: rgba(180, 35, 24, 0.06); } .photo-uploader-deleteall:focus-visible { outline: 2px solid #b42318; outline-offset: 2px; } .photo-uploader-deleteall-icon { width: 13px; height: 13px; flex: 0 0 auto; } @media (prefers-reduced-motion: reduce) { .photo-tile, .photo-tile.is-removing, .photo-tile-overlay, .photo-tile-progress, .photo-tile-progress-fill, .photo-tile-fail, .photo-tile-x, .photo-tile-retry, .photo-uploader-tooltip { animation: none !important; transition: none !important; } } .photos-edit { padding: 24px 24px 48px; } .photos-edit-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 0 0 8px; } .photos-edit-head .photos-edit-title { margin: 0; } .photos-edit-head #event-photos-actions { flex: 0 0 auto; } .photos-edit-title { font-family: var(--font-serif); font-weight: 500; font-size: 22px; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink); margin: 0 0 8px; } .photos-edit-sub { font-family: var(--font-serif); font-size: 14px; line-height: 1.5; color: var(--ink-mute); margin: 0 0 18px; } .event-form-actions { display: flex; align-items: center; gap: 14px; margin-top: 18px; } .event-form-danger { margin-top: 36px; padding: 14px 16px; border: 1px solid rgba(179, 76, 46, 0.28); background: rgba(179, 76, 46, 0.04); border-radius: 12px; } .event-form-danger-lead { margin: 0 0 10px; font-family: var(--font-serif); font-size: 13px; line-height: 1.55; color: var(--ink-soft); max-width: 60ch; } .event-form-danger-btn { display: inline-flex; align-items: center; padding: 6px 14px; background: transparent; border: 1px solid rgba(179, 76, 46, 0.5); border-radius: 999px; font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: #b34c2e; cursor: pointer; transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease; } .event-form-danger-btn:hover { background: #b34c2e; border-color: #b34c2e; color: var(--paper); } .me-activity-hero-head { margin: 0 0 10px; } .me-activity-hero-title { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 22px; letter-spacing: -0.015em; color: var(--ink); } .me-activity-band-head { margin: 30px 0 10px; } .me-activity-eyebrow-line { margin: 0 0 4px; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); } .me-activity-band-title { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 18px; letter-spacing: -0.01em; color: var(--ink); } .me-activity-band-lead { margin: 6px 0 0; font-family: var(--font-serif); font-size: 13.5px; line-height: 1.55; color: var(--ink-soft); } .me-activity-band-lead strong { color: var(--ink); font-weight: 500; } .me-activity-band-lead-cta { color: var(--amber); font-family: var(--font-sans); font-weight: 500; text-decoration: none; white-space: nowrap; margin-left: 2px; } .me-activity-band-lead-cta:hover { text-decoration: underline; } .me-activity-band-foot-link { display: inline-block; margin-top: 8px; font-family: var(--font-sans); font-weight: 500; font-size: 13px; color: var(--amber); text-decoration: none; } .me-activity-band-foot-link:hover { text-decoration: underline; } .me-discovery-chips { display: flex; gap: 14px; overflow-x: auto; padding: 6px 2px 14px; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .me-discovery-chips::-webkit-scrollbar { display: none; } .me-discovery-chip { display: flex; flex-direction: column; align-items: center; gap: 4px; flex: 0 0 auto; width: 72px; text-decoration: none; color: var(--ink); } .me-discovery-chip-avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; } .me-discovery-chip-name { font-family: var(--font-sans); font-weight: 500; font-size: 12px; color: var(--ink); text-align: center; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; } .me-discovery-chip-city { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.04em; color: var(--ink-mute); text-align: center; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .me-activity-list { list-style: none; padding: 0; margin: 4px 0 0; display: flex; flex-direction: column; gap: 2px; } .me-activity-list-row { display: flex; align-items: center; gap: 14px; padding: 12px 6px; border-bottom: 1px solid var(--border); text-decoration: none; color: var(--ink); transition: background 0.15s ease; } .me-activity-list-row:hover { background: rgba(198, 74, 26, 0.04); } .me-activity-list-row:last-child { border-bottom: none; } .me-activity-list-date { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 46px; flex-shrink: 0; text-align: center; line-height: 1; } .me-activity-list-day { font-family: var(--font-serif); font-weight: 500; font-size: 20px; color: var(--ink); letter-spacing: -0.02em; } .me-activity-list-mon { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.12em; color: var(--ink-mute); margin-top: 2px; } .me-activity-list-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } .me-activity-list-title { font-family: var(--font-serif); font-size: 15px; font-weight: 500; color: var(--ink); letter-spacing: -0.005em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .me-activity-list-meta { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .me-activity-past-line { margin: 28px 0 0; padding: 14px 4px 0; border-top: 1px solid var(--border); font-family: var(--font-serif); font-size: 13.5px; color: var(--ink-soft); line-height: 1.55; } .me-activity-past-link { font-family: var(--font-sans); font-weight: 500; color: var(--amber); text-decoration: none; margin-left: 4px; } .me-activity-past-link:hover { text-decoration: underline; } .me-activity .me-activity-subhead { margin-top: 26px; } .me-activity .me-activity-subhead .profile-section-title { font-size: 18px; color: var(--ink-soft); } .me-activity-todo { display: flex; align-items: center; gap: 10px; margin: 10px 2px 0; padding: 10px 14px; border: 1px dashed rgba(198, 74, 26, 0.35); border-radius: 12px; background: rgba(198, 74, 26, 0.04); color: var(--ink); text-decoration: none; font-family: var(--font-serif); font-size: 13.5px; line-height: 1.45; transition: background 0.2s ease, border-color 0.2s ease; } .me-activity-todo:hover { background: rgba(198, 74, 26, 0.08); border-color: rgba(198, 74, 26, 0.55); } .me-activity-todo-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--amber); flex-shrink: 0; } .me-activity-todo-text { flex: 1; } .me-activity-todo-arrow { font-family: var(--font-sans); font-weight: 500; color: var(--amber); flex-shrink: 0; } .me-activity-push { display: flex; flex-direction: column; gap: 6px; margin: 6px 0 18px; padding: 16px 18px; border-radius: 14px; background: var(--paper-2); border: 1px solid var(--border); color: var(--ink); text-decoration: none; font-family: var(--font-serif); line-height: 1.5; transition: border-color 0.2s ease, transform 0.2s ease; } .me-activity-push:hover { border-color: var(--ink-mute); transform: translateY(-1px); } .me-activity-push-line { font-size: 14px; color: var(--ink-soft); } .me-activity-push-line strong { color: var(--ink); font-weight: 500; } .me-activity-push-arrow { font-family: var(--font-sans); font-weight: 500; font-size: 13px; color: var(--amber); } .me-activity-faces { display: flex; gap: 14px; overflow-x: auto; padding: 6px 2px 12px; scrollbar-width: none; margin-top: 4px; } .me-activity-faces::-webkit-scrollbar { display: none; } .me-activity-face { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 0 0 auto; width: 64px; text-decoration: none; color: var(--ink); } .me-activity-face-avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; } .me-activity-face-name { font-family: var(--font-sans); font-size: 11.5px; text-align: center; color: var(--ink-soft); line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; } .me-discovery { margin-top: 28px; } .me-discovery-cities-scroll { display: flex; gap: 12px; overflow-x: auto; padding: 6px 2px 14px; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .me-discovery-cities-scroll::-webkit-scrollbar { display: none; } .me-discovery-cities-scroll .city-tile { flex: 0 0 230px; width: 230px; } .me-discovery-cities-more { flex: 0 0 130px; display: flex; align-items: center; justify-content: center; border: 1px dashed var(--border); border-radius: 18px; text-decoration: none; color: var(--ink-soft); background: transparent; transition: border-color 0.2s ease, color 0.2s ease; } .me-discovery-cities-more:hover { border-color: var(--ink-mute); color: var(--ink); } .me-discovery-cities-more-text { font-family: var(--font-sans); font-weight: 500; font-size: 13px; text-align: center; padding: 0 14px; line-height: 1.4; } .me-activity-past { margin-top: 26px; padding: 0; border-top: 1px solid var(--border); } .me-activity-past-summary { list-style: none; cursor: pointer; padding: 12px 4px; font-family: var(--font-sans); font-weight: 500; font-size: 13px; color: var(--ink-soft); display: flex; align-items: center; gap: 8px; } .me-activity-past-summary::-webkit-details-marker { display: none; } .me-activity-past-arrow { display: inline-block; transition: transform 0.2s ease; color: var(--ink-mute); } .me-activity-past[open] .me-activity-past-arrow { transform: rotate(180deg); } .me-activity-past-list { margin-top: 8px; } .city-tiles { display: grid; grid-template-columns: 1fr; gap: 14px; } @media (min-width: 520px) { .city-tiles { grid-template-columns: 1fr 1fr; } } .city-tile { display: flex; flex-direction: column; background: var(--paper-2); border: 1px solid var(--border); border-radius: 18px; overflow: hidden; text-decoration: none; color: var(--ink); transition: transform 0.25s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.3s cubic-bezier(0.32, 0.72, 0, 1), border-color 0.2s ease; box-shadow: 0 1px 2px rgba(26, 24, 20, 0.04); } .city-tile:hover { transform: translateY(-3px); border-color: var(--ink-mute); box-shadow: 0 4px 10px rgba(26, 24, 20, 0.06), 0 18px 32px rgba(26, 24, 20, 0.07); } .city-tile-cover { position: relative; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #e8d6c4, #d4ad8b); overflow: hidden; } .city-tile-cover-img { width: 100%; height: 100%; object-fit: cover; display: block; } .city-tile-cover-veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26, 24, 20, 0) 30%, rgba(26, 24, 20, 0.55) 100%); } .city-tile-cover-text { position: absolute; left: 14px; right: 14px; bottom: 12px; display: flex; align-items: center; gap: 8px; color: #fff; } .city-tile-flag { font-size: 18px; line-height: 1; } .city-tile-name { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 19px; letter-spacing: -0.01em; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4); } .city-tile-body { padding: 12px 14px 14px; } .city-tile-stats { margin: 0; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); font-weight: 500; } .city-tile-line { margin: 4px 0 0; font-family: var(--font-serif); font-size: 12.5px; color: var(--ink-mute); } .city-tile-faces { display: flex; margin: 10px 0 0; padding-left: 4px; } .city-tile-face { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; border: 2px solid var(--paper-2); margin-left: -8px; } .city-tile-face:first-child { margin-left: -4px; } .city-hero-tile { display: flex; flex-direction: column; background: var(--paper-2); border: 1px solid var(--border); border-radius: 22px; overflow: hidden; text-decoration: none; color: var(--ink); margin: 0 0 6px; box-shadow: 0 1px 2px rgba(26, 24, 20, 0.05), 0 14px 36px rgba(26, 24, 20, 0.06); transition: transform 0.25s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.3s cubic-bezier(0.32, 0.72, 0, 1); } .city-hero-tile:hover { transform: translateY(-3px); box-shadow: 0 4px 10px rgba(26, 24, 20, 0.06), 0 24px 52px rgba(26, 24, 20, 0.09); } .city-hero-tile-cover { position: relative; aspect-ratio: 16 / 8; background: linear-gradient(135deg, #e8d6c4, #d4ad8b); overflow: hidden; } .city-hero-tile-cover-img { width: 100%; height: 100%; object-fit: cover; display: block; } .city-hero-tile-cover-veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26, 24, 20, 0) 35%, rgba(26, 24, 20, 0.55) 100%); } .city-hero-tile-cover-text { position: absolute; left: 18px; right: 18px; bottom: 16px; display: flex; align-items: center; gap: 10px; color: #fff; } .city-hero-tile-flag { font-size: 22px; line-height: 1; } .city-hero-tile-name { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 24px; letter-spacing: -0.015em; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45); } .city-hero-tile-body { padding: 14px 18px 18px; } .city-hero-tile-stats { margin: 0; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-soft); } .city-hero-tile-stats strong { color: var(--ink); font-weight: 500; } .city-hero-tile-line { margin: 6px 0 0; font-family: var(--font-serif); font-size: 13.5px; color: var(--ink); line-height: 1.4; } .city-hero-tile-line strong { font-weight: 500; } .city-hero-tile-faces { display: flex; align-items: center; margin-top: 12px; } .city-hero-tile-face { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; border: 2px solid var(--paper-2); margin-left: -10px; } .city-hero-tile-face:first-child { margin-left: 0; } .city-hero-tile-face-more { margin-left: 10px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .city-hero-strip { margin: 0 0 18px; border-radius: 22px; overflow: hidden; background: var(--paper-2); border: 1px solid var(--border); box-shadow: 0 1px 2px rgba(26, 24, 20, 0.05), 0 14px 36px rgba(26, 24, 20, 0.06); } .city-hero-strip-cover { position: relative; aspect-ratio: 16 / 8; background: linear-gradient(135deg, #e8d6c4, #d4ad8b); overflow: hidden; } .city-hero-strip-cover-img { width: 100%; height: 100%; object-fit: cover; display: block; } .city-hero-strip-cover-veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26, 24, 20, 0) 35%, rgba(26, 24, 20, 0.6) 100%); } .city-hero-strip-cover-text { position: absolute; left: 18px; right: 18px; bottom: 16px; display: flex; align-items: center; gap: 10px; color: #fff; } .city-hero-strip-flag { font-size: 24px; line-height: 1; } .city-hero-strip-name { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 26px; letter-spacing: -0.015em; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45); } .city-hero-strip-body { padding: 14px 18px 18px; } .city-hero-strip-stats { margin: 0; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-soft); } .city-hero-strip-stats strong { color: var(--ink); font-weight: 500; } .city-hero-strip-line { margin: 6px 0 0; font-family: var(--font-serif); font-size: 13.5px; color: var(--ink); line-height: 1.4; } .city-hero-strip-line strong { font-weight: 500; } .city-hero-strip-faces { display: flex; align-items: center; margin-top: 12px; } .city-hero-strip-face { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; border: 2px solid var(--paper-2); margin-left: -10px; } .city-hero-strip-face:first-child { margin-left: 0; } .city-hero-strip-face-more { margin-left: 10px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .startup-feed-lead { margin: 0 0 18px; font-family: var(--font-serif); font-size: 17px; line-height: 1.55; color: var(--ink); max-width: 64ch; } .feed-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; font-family: var(--font-sans); font-size: 12.5px; } .feed-chips-tag, .feed-chips-city { margin-top: -4px; } .feed-chip { display: inline-flex; align-items: baseline; gap: 6px; padding: 5px 11px; border-radius: 999px; border: 1px solid var(--border-soft); background: var(--paper); color: var(--ink-soft); text-decoration: none; transition: border-color 120ms ease, background 120ms ease, color 120ms ease; } .feed-chip:hover { border-color: var(--ink-mute); color: var(--ink); } .feed-chip.is-active { background: var(--ink); border-color: var(--ink); color: var(--paper); } .feed-chip-tag, .feed-chip-city { font-size: 12px; padding: 4px 9px; color: var(--ink-mute); } .feed-chip-count { font-size: 11px; font-variant-numeric: tabular-nums; opacity: 0.7; } .feed-chip.is-active .feed-chip-count { opacity: 0.85; } .feed-updates { display: flex; justify-content: center; margin: 4px 0 0; } .feed-new-pill { display: inline-flex; align-items: center; gap: 6px; padding: 7px 16px; border: none; border-radius: 999px; background: var(--accent); color: #fff; font-family: var(--font-sans); font-size: 13px; font-weight: 600; cursor: pointer; box-shadow: 0 2px 10px rgba(198, 74, 26, 0.28); transition: transform 120ms ease, box-shadow 120ms ease; } .feed-new-pill[hidden] { display: none; } .feed-new-pill::before { content: "↑"; font-weight: 700; } .feed-new-pill:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(198, 74, 26, 0.34); } .feed-stream { display: flex; flex-direction: column; gap: 14px; margin-top: 18px; } .feed-pagination { display: flex; justify-content: center; margin: 16px 0 4px; } .feed-pagination:empty { margin: 0; } .feed-load-more { padding: 9px 22px; border: 1px solid var(--border-soft); border-radius: 999px; background: var(--paper); color: var(--ink-soft); font-family: var(--font-sans); font-size: 13px; font-weight: 600; cursor: pointer; transition: border-color 120ms ease, color 120ms ease; } .feed-load-more:hover { border-color: var(--ink-mute); color: var(--ink); } .feed-item { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 12px; } .feed-item:hover { border-color: var(--border); } .feed-item.is-pinned { border-color: var(--amber); background: linear-gradient(0deg, var(--paper), rgba(217, 119, 6, 0.04)); } .feed-item-bare { position: relative; display: flex; flex-direction: column; gap: 0; padding: 0; background: radial-gradient(circle at 12% -8%, rgba(198, 74, 26, 0.10) 0%, transparent 42%), linear-gradient(180deg, rgba(255, 255, 255, 0.86) 0%, rgba(255, 255, 255, 0.50) 50%, rgba(255, 255, 255, 0.30) 100% ), var(--paper-2); border: 1px solid rgba(230, 212, 194, 0.7); border-radius: 28px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 0 0 1px rgba(255, 255, 255, 0.35), 0 1px 2px rgba(26, 24, 20, 0.06), 0 4px 12px rgba(26, 24, 20, 0.05), 0 18px 44px rgba(26, 24, 20, 0.08), 0 36px 72px rgba(198, 74, 26, 0.05); } .feed-item-bare:hover { border-color: rgba(198, 74, 26, 0.35); } .feed-item-bare.is-pinned { border-color: var(--amber); } .feed-item-bare > .founder-card, .feed-item-bare > .feed-event-context, .feed-item-bare > .feed-event-context-link { background: transparent; border: none; border-radius: 0; box-shadow: none; } .feed-item-bare > .founder-card { padding-top: 14px; padding-bottom: 4px; } .feed-item-bare .feed-event-context-head { display: none; } .feed-rsvp-composite-head { font-family: var(--font-sans); font-size: 11.5px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--ink-mute); display: flex; align-items: center; gap: 6px; padding: 14px 24px 0; } .feed-rsvp-composite-head > span:first-child { font-weight: 600; color: var(--ink-soft); } .feed-rsvp-composite-dot { opacity: 0.5; } .feed-rsvp-connector { display: flex; align-items: center; justify-content: flex-start; gap: 8px; margin: 0 24px; padding: 12px 0 6px; border-top: 1px solid rgba(230, 212, 194, 0.7); font-family: var(--font-sans); font-size: 10.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); } .feed-rsvp-connector-text { color: var(--ink-mute); } .feed-rsvp-connector-glyph { font-size: 12px; color: var(--amber); letter-spacing: 0; line-height: 1; } .feed-item-bare .feed-event-context { padding: 0 24px 14px; } .feed-item-bare .feed-event-context-eyebrow { margin-bottom: 4px; } .feed-item-bare .feed-event-context-title { font-size: 15.5px; font-weight: 500; margin-right: 0; margin-bottom: 4px; line-height: 1.3; } .feed-item-bare .feed-event-context-sub { font-size: 12.5px; margin: 0; } .feed-event-context-attendees { display: flex; align-items: center; gap: 10px; margin-top: 12px; } .feed-event-context-faces { display: flex; align-items: center; } .feed-event-context-face, .feed-event-context-face-image { width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--paper-2); margin-right: -8px; } .feed-event-context-face:last-child, .feed-event-context-face-image:last-child { margin-right: 0; } .feed-event-context-going { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-soft); } .feed-event-context-cta { display: inline-flex; align-items: center; justify-content: center; margin: 14px 24px 16px; padding: 9px 18px; border-radius: 999px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; text-decoration: none; text-align: center; transition: background 120ms ease, border-color 120ms ease, color 120ms ease; border: 1px solid transparent; } .feed-event-context-cta-form { margin: 0; padding: 0; display: contents; } .feed-event-context-cta-form button.feed-event-context-cta { cursor: pointer; } .feed-event-context-cta-go { background: var(--ink); color: var(--paper); } .feed-event-context-cta-go:hover { background: var(--amber); color: var(--paper); } .feed-event-context-cta-going { background: rgba(217, 119, 6, 0.08); color: var(--amber); border-color: rgba(217, 119, 6, 0.3); cursor: default; } .feed-event-context-cta-anon { background: var(--paper-2); color: var(--ink-soft); border-color: rgba(0, 0, 0, 0.12); } .feed-event-context-cta-anon:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); } .feed-event-context { position: relative; display: block; background: radial-gradient(circle at 12% -8%, rgba(198, 74, 26, 0.10) 0%, transparent 42%), linear-gradient(180deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.30) 28%, rgba(255, 255, 255, 0) 70% ), var(--paper-2); border: 1px solid rgba(230, 212, 194, 0.7); border-radius: 18px; padding: 16px 20px 14px; text-decoration: none; color: inherit; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 1px 2px rgba(26, 24, 20, 0.05); transition: border-color 120ms ease, box-shadow 120ms ease; } .feed-event-context-link:hover { border-color: rgba(198, 74, 26, 0.35); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 2px 6px rgba(26, 24, 20, 0.08); } .feed-event-context-arrow { position: absolute; top: 50%; right: 14px; transform: translateY(-50%); font-size: 22px; color: var(--ink-mute); line-height: 1; } .feed-event-context-head { display: flex; align-items: center; gap: 6px; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 8px; } .feed-event-context-kind { color: var(--ink-soft); } .feed-event-context-dot { opacity: 0.5; } .feed-event-context-time { letter-spacing: 0.04em; text-transform: none; font-weight: 500; } .feed-event-context-eyebrow { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--amber); margin-bottom: 4px; } .feed-event-context-title { font-family: var(--font-serif); font-size: 18px; font-weight: 600; line-height: 1.25; color: var(--ink); margin: 0 28px 6px 0; } .feed-event-context-sub { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); line-height: 1.45; margin: 0; } .feed-item-new-dot { position: absolute; top: 14px; left: -10px; width: 8px; height: 8px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0 3px var(--paper); } .feed-item-head { display: flex; align-items: center; gap: 10px; } .feed-item-avatar { flex-shrink: 0; } .feed-item-meta { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; } .feed-item-actor { font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--ink); } .feed-item-time { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); } .feed-item-kind-tag { display: inline-block; font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-mute); background: var(--paper-2); padding: 3px 8px; border-radius: 4px; } .feed-item-pin-tag { margin-left: auto; font-size: 13px; } .feed-item-body { display: flex; flex-direction: column; gap: 6px; } .feed-item-link { display: block; text-decoration: none; color: inherit; } .feed-item-link:hover .feed-item-title { color: var(--amber); } .feed-item-title { font-family: var(--font-serif); font-size: 16px; font-weight: 600; line-height: 1.3; color: var(--ink); margin: 0; transition: color 120ms ease; } .feed-item-sub { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); line-height: 1.5; margin: 0; } .feed-item-prose { font-family: var(--font-serif); font-size: 14.5px; color: var(--ink); line-height: 1.55; margin: 2px 0 0; } .feed-item-rollup { display: flex; align-items: center; gap: 0; margin: 0 0 8px; } .feed-item-rsvper-face { border: 2px solid var(--paper); margin-right: -8px; } .feed-item-rsvper-face:last-child { margin-right: 0; } .feed-item-sub-emphasis { color: var(--ink); font-weight: 600; } .feed-item-rsvper-more { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; padding: 0 7px; border-radius: 999px; border: 2px solid var(--paper); background: var(--paper-2); font-family: var(--font-sans); font-size: 11.5px; font-weight: 600; color: var(--ink-soft); margin-left: -8px; } .feed-item-rollup-text { font-family: var(--font-sans); font-size: 13px; color: var(--ink); margin-left: 8px; } .feed-item-photo-strip { display: flex; gap: 6px; margin-top: 4px; } .feed-item-photo { width: 80px; height: 80px; object-fit: cover; border-radius: 6px; flex-shrink: 0; } .feed-item-photo-more { display: inline-flex; align-items: center; justify-content: center; width: 80px; height: 80px; background: var(--paper-2); color: var(--ink-mute); font-family: var(--font-sans); font-size: 14px; border-radius: 6px; } .feed-item-title-link { display: block; color: var(--ink); text-decoration: none; font-family: var(--font-serif); font-size: 19px; font-weight: 600; line-height: 1.25; letter-spacing: -0.018em; margin: 2px 0 10px; } .feed-item-title-link:hover { color: var(--amber); } .feed-item-video { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: var(--paper-2); margin: 8px 0 12px; } .feed-item-video-facade { position: relative; display: block; width: 100%; height: 100%; text-decoration: none; cursor: pointer; } .feed-item-video-cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .feed-item-video-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; transition: transform 0.15s ease, filter 0.15s ease; filter: drop-shadow(0 4px 16px rgba(0, 0, 0, 0.4)); pointer-events: none; } .feed-item-video-facade:hover .feed-item-video-play { transform: translate(-50%, -50%) scale(1.06); } .feed-item-video-facade:hover .feed-item-video-play svg path:first-child { fill: var(--accent); fill-opacity: 0.9; } .feed-item-video-iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } .feed-item-cover-link { display: block; text-decoration: none; } .feed-item-cover { width: 100%; max-height: 360px; object-fit: cover; border-radius: 12px; margin: 8px 0 12px; display: block; } .feed-item-source-link { display: block; text-decoration: none; } .feed-item-source { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); margin: 4px 0 0; } .feed-item-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; } .feed-item-tag { font-family: var(--font-sans); font-size: 11.5px; color: var(--amber); background: rgba(217, 119, 6, 0.07); padding: 2px 8px; border-radius: 999px; } .feed-item-attached { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); font-style: italic; margin: 4px 0 0; } .feed-item-bump-form { display: inline-flex; margin: 10px 0 0; padding: 0; } .feed-item-bump-btn { font-family: var(--font-sans); font-size: 11.5px; font-weight: 600; letter-spacing: 0.04em; color: var(--ink-soft); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 5px 12px; cursor: pointer; transition: color 120ms ease, background 120ms ease, border-color 120ms ease; } .feed-item-bump-btn:hover { color: var(--ink); border-color: var(--ink-mute); } .feed-item-actions:not(:empty) { margin-top: 2px; } .feed-item-actions .series-actions { margin: 0; } .feed-item-rsvp .feed-rsvp-form { margin: 0; } .feed-rsvp-btn { padding: 7px 18px; border: 1px solid rgba(198, 74, 26, 0.35); border-radius: 999px; background: rgba(198, 74, 26, 0.08); color: var(--amber); font-family: var(--font-sans); font-size: 13px; font-weight: 600; cursor: pointer; transition: background 120ms ease, border-color 120ms ease; } .feed-rsvp-btn:hover { background: rgba(198, 74, 26, 0.14); border-color: var(--amber); } .feed-rsvp-btn-link { display: inline-block; text-align: center; text-decoration: none; } .feed-rsvp-btn:disabled { opacity: 0.6; cursor: default; } .feed-rsvp-going { display: inline-flex; align-items: center; gap: 5px; padding: 7px 14px; border-radius: 999px; background: var(--paper-2); color: var(--ink-soft); font-family: var(--font-sans); font-size: 13px; font-weight: 600; } .feed-item-expand { margin-top: 2px; } .feed-item-expand-toggle { display: inline-flex; align-items: center; gap: 5px; padding: 4px 2px; border: none; background: none; cursor: pointer; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--ink-soft); transition: color 120ms ease; } .feed-item-expand-toggle:hover { color: var(--accent); } .feed-item-expand-chevron { font-size: 11px; transition: transform 160ms ease; } .feed-item-expand.is-open .feed-item-expand-chevron { transform: rotate(180deg); } .feed-item-expand-detail[hidden] { display: none; } .feed-detail { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--border-soft); } .feed-detail-prose { margin: 0; font-family: var(--font-serif); font-size: 14.5px; line-height: 1.6; color: var(--ink); } .feed-detail-empty { margin: 0; font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); } .feed-detail-label { margin: 0 0 -4px; font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); } .feed-detail-cta { align-self: flex-start; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--accent); text-decoration: none; } .feed-detail-cta:hover { text-decoration: underline; } .poll-result { display: flex; flex-direction: column; gap: 4px; } .poll-result-form { margin: 0; } .poll-result-vote { width: 100%; display: flex; flex-direction: column; gap: 4px; padding: 6px 8px; margin: 0 -8px; border: none; border-radius: 8px; background: none; text-align: left; cursor: pointer; transition: background 120ms ease; } .poll-result-vote:hover { background: var(--paper-2); } .poll-result.is-mine .poll-result-fill, .poll-result-vote.is-mine .poll-result-fill { background: var(--accent); } .poll-result-tick { color: var(--accent); font-weight: 700; margin-right: 3px; } .poll-result-radio { display: inline-block; width: 13px; height: 13px; margin-right: 6px; vertical-align: -1px; border: 2px solid var(--border); border-radius: 50%; background: transparent; transition: border-color 120ms ease, background 120ms ease; } .poll-result-radio.is-on { border-color: var(--accent); background: var(--accent); box-shadow: inset 0 0 0 2px var(--paper); } .poll-result-vote:hover .poll-result-radio { border-color: var(--accent); } .feed-detail-poll.is-voting { opacity: 0.55; pointer-events: none; } .poll-result-head { display: flex; justify-content: space-between; gap: 10px; font-family: var(--font-sans); font-size: 13px; } .poll-result-label { color: var(--ink); } .poll-result-count { color: var(--ink-mute); font-variant-numeric: tabular-nums; white-space: nowrap; } .poll-result-track { height: 7px; border-radius: 999px; background: var(--paper-2); overflow: hidden; } .poll-result-fill { display: block; height: 100%; border-radius: 999px; background: var(--accent); min-width: 2px; } .feed-detail-facts { display: flex; flex-wrap: wrap; gap: 6px 24px; margin: 0; } .feed-detail-fact { display: flex; flex-direction: column; gap: 1px; } .feed-detail-fact dt { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-mute); } .feed-detail-fact dd { margin: 0; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink); } .feed-detail-roster { display: flex; align-items: center; gap: 10px; } .feed-detail-roster-count { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); } .feed-detail-link { display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--ink); text-decoration: none; word-break: break-word; } .feed-detail-link:hover { color: var(--accent); } .feed-detail-chips { display: flex; flex-wrap: wrap; gap: 6px; } .feed-detail-chip { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border-soft); background: var(--paper-2); font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); } .feed-detail-note { margin: 0; padding-left: 12px; border-left: 2px solid var(--accent-soft); font-family: var(--font-serif); font-size: 14px; line-height: 1.55; color: var(--ink); } .feed-detail-note cite { display: block; margin-top: 2px; font-family: var(--font-sans); font-size: 12px; font-style: normal; color: var(--ink-mute); } .feed-item-founder-row { display: flex; gap: 12px; align-items: center; } .feed-item-founder-body { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; } .feed-item-verified-tag { display: inline-block; font-family: var(--font-sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); background: rgba(217, 119, 6, 0.08); padding: 1px 6px; border-radius: 4px; margin-left: 6px; vertical-align: middle; } .feed-composer { display: flex; flex-direction: column; gap: 10px; margin: 0 0 20px; } .feed-composer-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } .feed-composer-tags-label, .feed-composer-label { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-mute); text-transform: uppercase; letter-spacing: 0.08em; } .feed-composer-tag { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-sans); font-size: 12.5px; } .feed-composer-file { display: flex; flex-direction: column; gap: 4px; font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); } .feed-composer-advanced { border-top: 1px dashed var(--border-soft); padding-top: 10px; } .feed-composer-advanced summary { cursor: pointer; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--ink-soft); } .feed-composer-row { display: flex; flex-direction: column; gap: 4px; margin-top: 12px; } .feed-composer-checkbox { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-sans); font-size: 13px; color: var(--ink); } .feed-composer-hint { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); margin: 0; } .feed-composer-actions { display: flex; justify-content: flex-end; margin-top: 8px; } .startup-feed-compose { display: flex; flex-direction: column; gap: 10px; margin: 0 0 22px; padding: 16px 18px; background: var(--paper-2); border: 1px dashed var(--border); border-radius: 16px; } .startup-feed-compose-file { display: flex; align-items: center; gap: 10px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .startup-feed-compose-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } .startup-feed-compose-tags-label { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-mute); margin-right: 4px; } .startup-feed-compose-tag { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid var(--border); border-radius: 999px; font-family: var(--font-sans); font-size: 12px; color: var(--ink); cursor: pointer; } .startup-feed-compose-tag input { margin: 0; } .startup-feed-compose-actions { display: flex; align-items: center; gap: 10px; } .startup-feed-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; padding: 4px 0 4px; } .startup-feed-tag { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border: 1px solid var(--border); border-radius: 999px; background: var(--paper-2); font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink); text-decoration: none; white-space: nowrap; transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease; } .startup-feed-tag:hover { border-color: var(--ink-mute); } .startup-feed-tag.is-active { background: var(--ink); color: var(--paper); border-color: var(--ink); } .startup-feed-tag-count { font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: var(--ink-mute); } .startup-feed-tag.is-active .startup-feed-tag-count { color: rgba(255, 255, 255, 0.7); } .startup-feed-summary { margin: 0 0 28px; padding: 18px 18px 14px; background: var(--paper-2); border: 1px solid var(--border); border-radius: 16px; } .startup-feed-summary-head { display: flex; align-items: baseline; gap: 10px; margin: 0 0 12px; font-family: var(--font-serif); font-size: 15px; color: var(--ink); } .startup-feed-summary-head strong { font-weight: 500; } .startup-feed-summary-meta { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.04em; color: var(--ink-mute); } .startup-feed-summary-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; } .startup-feed-summary-link { display: flex; gap: 10px; align-items: flex-start; font-family: var(--font-serif); font-size: 14px; line-height: 1.5; color: var(--ink); text-decoration: none; padding: 4px 0; transition: color 0.15s ease; } .startup-feed-summary-link:hover { color: var(--amber); } .startup-feed-summary-arrow { font-family: var(--font-sans); font-weight: 500; color: var(--amber); flex-shrink: 0; } .startup-feed-summary-jump { display: inline-block; margin-top: 12px; padding: 6px 14px; border: 1px solid var(--border); border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink); text-decoration: none; } .startup-feed-summary-jump:hover { border-color: var(--ink-mute); } .startup-feed-stream { margin-top: 12px; } .startup-feed-stream-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 28px; } .startup-feed-stream-item { margin: 0; } .startup-feed-stream-num { margin: 0 0 10px; display: flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-mute); } .startup-feed-stream-tag { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; color: var(--amber); } .startup-feed-stream-post { margin: 0; padding: 0; list-style: none; } .city-hero-strip-compact { background: var(--paper-2); border: 1px solid var(--border); box-shadow: 0 1px 2px rgba(26, 24, 20, 0.04), 0 4px 14px rgba(26, 24, 20, 0.04); } .city-hero-strip-compact .city-hero-strip-body { padding: 18px 18px 16px; } .city-hero-strip-compact-head { display: flex; align-items: baseline; gap: 10px; margin: 0 0 6px; } .city-hero-strip-compact-head .city-hero-strip-flag { font-size: 22px; text-shadow: none; } .city-hero-strip-compact-head .city-hero-strip-name { margin: 0; font-size: 22px; color: var(--ink); text-shadow: none; } .city-thin-intro { margin: 16px 0 24px; padding: 14px 16px; border-radius: 12px; background: rgba(198, 74, 26, 0.05); border: 1px solid rgba(198, 74, 26, 0.18); font-family: var(--font-serif); font-size: 14px; line-height: 1.6; color: var(--ink); max-width: 64ch; } .me-band { margin-top: 28px; } .me-band:first-of-type { margin-top: 16px; } .me-band-intro { margin: 8px 0 16px; font-family: var(--font-serif); font-size: 13.5px; line-height: 1.6; color: var(--ink-soft); max-width: 64ch; } .me-city-band .me-band-eyebrow { margin-bottom: 6px; } .me-city-header { display: flex; align-items: baseline; gap: 12px; margin: 0 0 6px; flex-wrap: wrap; } .me-city-header-flag { font-size: 28px; line-height: 1; flex-shrink: 0; } .me-city-header-name { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 28px; letter-spacing: -0.02em; color: var(--ink); flex: 1 1 auto; } .me-city-header-cta { font-family: var(--font-sans); font-weight: 500; font-size: 13px; color: var(--amber); text-decoration: none; flex-shrink: 0; } .me-city-header-cta:hover { text-decoration: underline; } .me-city-tabs { margin-top: 4px; } .me-band-head { margin: 0 0 14px; } .me-band-eyebrow { margin: 0 0 6px; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); } .me-band-title { margin: 0; font-family: var(--font-serif); font-weight: 500; font-size: 22px; letter-spacing: -0.015em; color: var(--ink); } .me-band-lead { margin: 6px 0 0; font-family: var(--font-serif); font-size: 13.5px; line-height: 1.55; color: var(--ink-soft); } .me-band-empty { padding: 18px 14px; border: 1px dashed var(--border); border-radius: 12px; font-family: var(--font-serif); font-size: 13.5px; color: var(--ink-soft); line-height: 1.5; text-align: center; } .me-band-empty p { margin: 0; } .me-band-empty-link { display: inline-block; margin-top: 8px; font-family: var(--font-sans); font-weight: 500; font-size: 13px; color: var(--amber); text-decoration: none; } .me-band-empty-link:hover { text-decoration: underline; } .me-band-foot-link { display: inline-block; margin-top: 14px; font-family: var(--font-sans); font-weight: 500; font-size: 13px; color: var(--amber); text-decoration: none; } .me-band-foot-link:hover { text-decoration: underline; } .me-cities-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } @media (min-width: 600px) { .me-cities-grid { grid-template-columns: 1fr 1fr 1fr; } } .me-cities-grid-more { margin-top: 12px; } .me-cities-more { margin-top: 14px; } .me-cities-more-summary { list-style: none; cursor: pointer; padding: 10px 14px; border: 1px solid var(--border); border-radius: 999px; font-family: var(--font-sans); font-weight: 500; font-size: 13px; color: var(--ink); display: inline-flex; align-items: center; gap: 8px; transition: border-color 0.2s ease, background 0.2s ease; } .me-cities-more-summary::-webkit-details-marker { display: none; } .me-cities-more-summary:hover { border-color: var(--ink-mute); background: rgba(198, 74, 26, 0.04); } .me-cities-more-arrow { display: inline-block; transition: transform 0.2s ease; color: var(--ink-mute); } .me-cities-more[open] .me-cities-more-arrow { transform: rotate(180deg); } .me-cities-growing { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); } .me-cities-growing-lead { margin: 0 0 12px; font-family: var(--font-serif); font-size: 13px; color: var(--ink-soft); line-height: 1.5; max-width: 64ch; } .me-feed-list { margin-top: 4px; } .share-page-body { background: var(--paper-2); } .share-page { width: 100%; max-width: 720px; margin: 0 auto; padding: 32px 16px 80px; box-sizing: border-box; font-family: var(--font-sans); color: var(--ink); } .share-page-head { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 24px; } .share-page-eyebrow { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); } .share-page-title { margin: 0; font-family: var(--font-serif); font-size: 22px; font-weight: 500; line-height: 1.25; color: var(--ink); } .share-page-toggle { display: inline-flex; background: var(--paper); border: 1px solid var(--border); border-radius: 999px; padding: 4px; gap: 4px; } .share-page-toggle-btn { font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-soft); text-decoration: none; padding: 7px 14px; border-radius: 999px; transition: background 0.15s ease, color 0.15s ease; } .share-page-toggle-btn:hover { color: var(--ink); } .share-page-toggle-btn.is-active { background: var(--ink); color: var(--paper); } .share-page-download { appearance: none; border: 0; background: var(--amber); color: var(--paper); font-family: var(--font-sans); font-size: 14px; font-weight: 600; padding: 12px 22px; border-radius: 999px; cursor: pointer; transition: filter 0.15s ease, transform 0.05s ease; } .share-page-download:hover { filter: brightness(1.05); } .share-page-download:active { transform: scale(0.98); } .poster-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; } .share-page-download.is-ghost { background: transparent; color: var(--ink); border: 1px solid var(--border); text-decoration: none; display: inline-flex; align-items: center; } .share-page-download.is-ghost:hover { background: var(--paper-2); filter: none; } .share-page-download[disabled] { opacity: 0.6; cursor: progress; } .share-page-hint { margin: 0; font-size: 12px; color: var(--ink-soft); } .share-page-head--simple { margin-bottom: 16px; } .share-page-download--block { display: block; width: 100%; margin-top: 16px; text-align: center; font-size: 16px; padding: 16px 22px; } .poster-settings { width: 100%; border: 1px solid var(--border); border-radius: 14px; background: var(--paper); padding: 4px 16px; } .poster-settings > summary { cursor: pointer; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink); padding: 10px 0; list-style: none; } .poster-settings > summary::-webkit-details-marker { display: none; } .poster-settings > summary::before { content: "⚙ "; color: var(--ink-mute); } .poster-settings-form { display: flex; flex-direction: column; gap: 14px; padding: 6px 0 16px; } .poster-set-note { margin: 0; font-family: var(--font-sans); font-size: 12px; line-height: 1.4; color: var(--ink-mute); } .poster-range { width: 100%; accent-color: var(--amber); cursor: pointer; } .poster-set-row { display: flex; gap: 14px; } .poster-set-row > .poster-set-field { flex: 1; min-width: 0; } .poster-set-field { display: flex; flex-direction: column; gap: 6px; } .poster-set-field > span { font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--ink-soft); } .poster-set-check { display: flex; align-items: center; gap: 10px; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink); cursor: pointer; } .poster-settings-form .share-page-download { align-self: flex-start; } .poster-publish { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; width: 100%; padding: 12px 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--paper); } .poster-publish-status { font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-soft); } .poster-publish-status.is-live { color: #1f7a4d; } .poster-publish-btn { appearance: none; margin-left: auto; border: 0; border-radius: 999px; padding: 9px 18px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--paper); background: var(--amber); cursor: pointer; } .poster-publish-btn.is-ghost { background: transparent; color: var(--ink-soft); border: 1px solid var(--border); } .kit-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; } .kit-actions .kit-all { background: var(--ink); color: var(--paper); } .kit-progress { margin: 14px 0 0; font-family: var(--font-mono); font-size: 13px; color: var(--ink-soft); min-height: 18px; } .kit-stage { position: absolute; left: -100000px; top: 0; width: 1080px; } .kit-node { margin-bottom: 1px; } .share-page-back { margin-top: 24px; } .share-page-back-link { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); text-decoration: none; } .share-page-back-link:hover { color: var(--ink); } .share-card-stage { position: relative; width: 100%; max-width: 100%; overflow: hidden; border-radius: 18px; background: var(--paper); box-shadow: 0 4px 24px rgba(26, 24, 20, 0.08); } .share-card-stage--post { aspect-ratio: 1080 / 1350; } .share-card-stage--story { aspect-ratio: 1080 / 1920; } .share-card-stage .share-card, .share-card-stage .poster { transform: scale(var(--share-scale, 0.34)); transform-origin: top left; } .share-card { position: relative; font-family: var(--font-sans); color: var(--ink); background: var(--paper-2); overflow: hidden; isolation: isolate; } .share-card-post { width: 1080px; height: 1350px; } .share-card-story { width: 1080px; height: 1920px; } .share-card-paper { position: absolute; inset: 0; background: radial-gradient(ellipse 90% 55% at 50% -10%, rgba(255, 210, 175, 0.28), transparent 60%), radial-gradient(ellipse 70% 60% at 100% 100%, rgba(198, 74, 26, 0.18), transparent 60%), radial-gradient(ellipse 50% 35% at 0% 100%, rgba(230, 195, 160, 0.22), transparent 70%), linear-gradient(175deg, #fbf5e6 0%, #f5edd8 50%, #ede2c4 100%); z-index: 0; } .share-card-masthead { position: absolute; z-index: 2; display: block; } .share-card-brand { display: block; object-fit: contain; } .share-card-tagline { font-family: var(--font-mono); letter-spacing: 0.14em; color: var(--ink-soft); text-transform: uppercase; } .share-card-context-row { display: flex; align-items: flex-start; margin-bottom: 22px; } .share-card-context { display: inline-block; width: fit-content; font-family: var(--font-sans); font-weight: 700; letter-spacing: 0.10em; text-transform: uppercase; color: var(--amber); background: rgba(198, 74, 26, 0.10); border-radius: 12px; line-height: 1.0; } .share-card-place { margin: 0; font-family: var(--font-sans); font-weight: 500; color: var(--ink-soft); display: flex; align-items: center; } .share-card-event-tag { position: absolute; z-index: 2; display: inline-block; background: rgba(255, 252, 242, 0.88); color: var(--ink-soft); font-family: var(--font-sans); font-weight: 600; letter-spacing: 0.10em; border-radius: 8px; line-height: 1.0; box-shadow: 0 4px 16px rgba(26, 24, 20, 0.10); } .share-card-icon { display: inline-flex; align-items: center; justify-content: center; color: var(--amber); } .share-card-cover { position: absolute; z-index: 1; overflow: hidden; background: var(--border); box-shadow: 0 18px 48px rgba(26, 24, 20, 0.16), 0 0 0 1px rgba(26, 24, 20, 0.06); } .share-card-cover-img { width: 100%; height: 100%; object-fit: cover; display: block; } .share-card-cover-veil { position: absolute; left: 0; right: 0; bottom: 0; height: 30%; background: linear-gradient(to bottom, transparent, rgba(26, 24, 20, 0.45)); pointer-events: none; } .share-card-meta { display: contents; } .share-card-title { margin: 0; font-family: var(--font-serif); font-weight: 600; color: var(--ink); letter-spacing: -0.015em; line-height: 1.1; } .share-card-when { margin: 0; font-family: var(--font-sans); font-weight: 600; color: var(--ink); display: flex; align-items: center; } .share-card-person { position: absolute; z-index: 2; display: flex; align-items: center; gap: 24px; } .share-card-avatar { border-radius: 50%; overflow: hidden; background: var(--border); flex-shrink: 0; box-shadow: 0 0 0 3px var(--amber), 0 8px 22px rgba(26, 24, 20, 0.18); } .share-card-avatar-img { width: 100%; height: 100%; object-fit: cover; display: block; } .share-card-avatar-initial { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-family: var(--font-serif); font-weight: 600; color: var(--ink-soft); background: var(--paper); } .share-card-person-name { font-family: var(--font-serif); font-weight: 600; color: var(--ink); line-height: 1.1; } .share-card-person-byline { font-family: var(--font-sans); font-weight: 500; color: var(--ink-soft); margin-top: 6px; } .share-card-foot { align-self: flex-start; margin-top: auto; display: inline-flex; align-items: center; gap: 14px; background: var(--ink); color: var(--paper); font-family: var(--font-sans); font-weight: 700; letter-spacing: 0.01em; border-radius: 16px; box-shadow: 0 10px 28px rgba(26, 24, 20, 0.22), 0 2px 0 rgba(198, 74, 26, 0.22); } .share-card-foot-arrow { color: var(--amber); font-weight: 700; } .share-card-social { display: flex; align-items: center; } .share-card-faces { display: flex; } .share-card-face { border-radius: 50%; overflow: hidden; background: var(--border); box-shadow: 0 0 0 3px #f5edd8, 0 4px 12px rgba(26, 24, 20, 0.14); } .share-card-face-img { width: 100%; height: 100%; object-fit: cover; display: block; } .share-card-social-text { font-family: var(--font-sans); color: var(--ink-soft); } .share-card-social-text strong { color: var(--ink); font-weight: 700; } .share-card .share-card-masthead { top: 60px; left: 70px; } .share-card .share-card-brand { height: 100px; width: auto; } .share-card .share-card-tagline { font-size: 14px; margin-top: 14px; } .share-card .share-card-person { top: 60px; right: 70px; left: auto; bottom: auto; gap: 20px; max-width: 540px; } .share-card .share-card-avatar { width: 120px; height: 120px; } .share-card .share-card-avatar-initial { font-size: 48px; } .share-card .share-card-person-text { display: flex; flex-direction: column; min-width: 0; } .share-card .share-card-person-name { font-size: 34px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.1; } .share-card .share-card-person-byline { font-size: 22px; margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.2; } .share-card .share-card-cover { left: 70px; right: 70px; border-radius: 30px; } .share-card-post .share-card-cover { top: 220px; height: 540px; } .share-card-story .share-card-cover { top: 280px; height: 760px; } .share-card .share-card-event-tag{ top: auto; left: auto; right: 26px; bottom: 24px; font-size: 20px; padding: 10px 16px; } .share-card .share-card-lower { position: absolute; left: 70px; right: 70px; display: flex; flex-direction: column; } .share-card-post .share-card-lower { top: 790px; bottom: 60px; } .share-card-story .share-card-lower { top: 1080px; bottom: 100px; } .share-card .share-card-context { font-size: 26px; padding: 12px 20px; } .share-card .share-card-title { font-size: 78px; line-height: 0.98; text-wrap: balance; margin: 0; } .share-card .share-card-when { font-size: 34px; margin-top: 32px; gap: 16px; } .share-card .share-card-place { font-size: 28px; margin-top: 10px; gap: 16px; color: var(--ink-soft); } .share-card .share-card-social { margin-top: 36px; gap: 24px; } .share-card .share-card-face { width: 70px; height: 70px; margin-right: -18px; } .share-card .share-card-social-text { font-size: 26px; } .share-card .share-card-foot { margin-top: auto; padding: 22px 36px; font-size: 28px; } .poster { --p-cream: #fdf6ee; --p-cream-soft: rgba(253, 246, 238, 0.74); --p-amber: #f3a563; --p-amber-soft: rgba(243, 165, 99, 0.55); --p-amber-faint: rgba(243, 165, 99, 0.14); --p-amber-ring: rgba(243, 165, 99, 0.85); --p-title-scale: 1; --p-text-scale: 1; position: relative; overflow: hidden; isolation: isolate; font-family: var(--font-sans); color: var(--p-cream); } .poster-post { width: 1080px; height: 1350px; } .poster-story { width: 1080px; height: 1920px; } .poster-bg { position: absolute; inset: 0; z-index: 0; background: radial-gradient(ellipse 80% 42% at 50% -6%, rgba(255, 198, 152, 0.22), transparent 60%), radial-gradient(ellipse 95% 42% at 50% 112%, rgba(198, 74, 26, 0.38), transparent 64%), radial-gradient(ellipse 130% 90% at 50% 42%, transparent 52%, rgba(0, 0, 0, 0.30)), linear-gradient(165deg, #3d1f55 0%, #2a1640 55%, #1c0f2e 100%); } .poster-grain { position: absolute; inset: 0; z-index: 1; background-image: radial-gradient(rgba(255, 255, 255, 0.06) 1.5px, transparent 1.5px); background-size: 26px 26px; pointer-events: none; } .poster-inner { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; align-items: stretch; text-align: center; height: 100%; box-sizing: border-box; } .poster-mid { flex: 1 1 auto; display: flex; flex-direction: column; align-items: stretch; justify-content: space-evenly; width: 100%; } .poster-bottom { display: flex; flex-direction: column; align-items: stretch; } .poster-lockup { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: calc(28px * var(--p-logo-gap, 1)); } .poster-lockup-echai { width: auto; object-fit: contain; align-self: center; } .poster-lockup-partner { width: auto; object-fit: contain; align-self: center; } .poster-head { width: 100%; } .poster-title { margin: 0; font-family: var(--font-sans); font-weight: 800; letter-spacing: -0.02em; line-height: 1.02; color: var(--p-cream); overflow-wrap: break-word; word-break: break-word; max-width: 100%; } .poster-edition { margin: 0; font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.18em; color: var(--p-amber); } .poster-subtitle { margin: 0; font-family: var(--font-sans); font-weight: 500; color: var(--p-cream-soft); max-width: 90%; margin-left: auto; margin-right: auto; } .poster-figure { display: flex; flex-direction: column; align-items: center; width: 100%; } .poster-portrait { align-self: center; border-radius: 40px; overflow: hidden; background: rgba(255, 255, 255, 0.06); border: 4px solid var(--p-amber-ring); box-sizing: border-box; flex-shrink: 0; } .poster-portrait-img { width: 100%; height: 100%; object-fit: cover; display: block; } .poster-portrait-ph { display: flex; align-items: flex-end; justify-content: center; background: rgba(255, 255, 255, 0.1); } .poster-portrait-ph svg { width: 86%; height: 86%; fill: rgba(255, 255, 255, 0.34); } .poster-subject { width: 100%; } .poster-role { display: inline-block; font-family: var(--font-mono); text-transform: uppercase; font-weight: 500; letter-spacing: 0.16em; color: var(--p-amber); border: 1.5px solid var(--p-amber-soft); border-radius: 999px; line-height: 1; } .poster-subject-name { font-family: var(--font-serif); font-weight: 600; color: var(--p-cream); line-height: 1.1; } .poster-subject-byline { font-family: var(--font-sans); font-weight: 500; color: var(--p-cream-soft); } .poster-when-wrap { width: 100%; text-align: center; } .poster-when-wrap::before { content: ""; display: block; height: 2px; margin-left: auto; margin-right: auto; background: var(--p-amber-soft); } .poster-when { display: inline-flex; flex-direction: column; align-items: center; gap: 6px; max-width: 100%; } .poster-when-date { font-family: var(--font-sans); font-weight: 700; color: var(--p-amber); } .poster-when-place { font-family: var(--font-sans); font-weight: 500; color: var(--p-cream-soft); } .poster-foot { align-self: center; white-space: nowrap; font-family: var(--font-sans); font-weight: 700; letter-spacing: 0.01em; color: var(--p-cream); background: var(--p-amber-faint); border: 1.5px solid var(--p-amber-soft); border-radius: 999px; } .poster-post .poster-inner { padding: 70px 72px 64px; } .poster-post .poster-lockup-echai { height: calc(72px * var(--p-logo-scale, 1) * var(--p-logo-own, 1)); } .poster-post .poster-lockup-partner { height: calc(62px * var(--p-logo-scale, 1) * var(--p-logo-own, 1)); max-width: calc(300px * var(--p-logo-own, 1)); } .poster-post .poster-title { font-size: calc(94px * var(--p-title-scale, 1)); max-width: 884px; margin-left: auto; margin-right: auto; } .poster-post .poster-edition { font-size: calc(30px * var(--p-text-scale)); margin-top: 20px; } .poster-post .poster-subtitle { font-size: calc(30px * var(--p-text-scale)); margin-top: 16px; } .poster-post .poster-figure { gap: calc(30px * var(--p-density, 1)); } .poster-post .poster-portrait { width: calc(520px * var(--p-portrait-scale, 1)); height: calc(520px * var(--p-portrait-scale, 1)); } .poster-post .poster-role { font-size: calc(24px * var(--p-text-scale)); padding: 9px 24px; margin-bottom: 22px; } .poster-post .poster-subject-name { font-size: calc(58px * var(--p-text-scale)); } .poster-post .poster-subject-byline { font-size: calc(34px * var(--p-text-scale)); margin-top: 10px; } .poster-post .poster-bottom { gap: calc(30px * var(--p-density, 1)); } .poster-post .poster-when-wrap::before { width: 60px; margin-bottom: 18px; } .poster-post .poster-when { gap: 8px; } .poster-post .poster-when-date { font-size: calc(36px * var(--p-text-scale)); } .poster-post .poster-when-place { font-size: calc(31px * var(--p-text-scale)); } .poster-post .poster-foot { font-size: calc(32px * var(--p-text-scale)); padding: 16px 36px; } .poster-story .poster-inner { padding: 120px 80px 110px; } .poster-story .poster-lockup-echai { height: calc(92px * var(--p-logo-scale, 1) * var(--p-logo-own, 1)); } .poster-story .poster-lockup-partner { height: calc(80px * var(--p-logo-scale, 1) * var(--p-logo-own, 1)); max-width: calc(360px * var(--p-logo-own, 1)); } .poster-story .poster-title { font-size: calc(92px * var(--p-title-scale, 1)); max-width: 868px; margin-left: auto; margin-right: auto; } .poster-story .poster-edition { font-size: calc(40px * var(--p-text-scale)); margin-top: 28px; } .poster-story .poster-subtitle { font-size: calc(36px * var(--p-text-scale)); margin-top: 22px; } .poster-story .poster-figure { gap: calc(40px * var(--p-density, 1)); } .poster-story .poster-portrait { width: calc(720px * var(--p-portrait-scale, 1)); height: calc(720px * var(--p-portrait-scale, 1)); } .poster-story .poster-role { font-size: calc(30px * var(--p-text-scale)); padding: 12px 30px; margin-bottom: 30px; } .poster-story .poster-subject-name { font-size: calc(76px * var(--p-text-scale)); } .poster-story .poster-subject-byline { font-size: calc(44px * var(--p-text-scale)); margin-top: 14px; } .poster-story .poster-bottom { gap: calc(44px * var(--p-density, 1)); } .poster-story .poster-when-wrap::before { width: 80px; margin-bottom: 24px; } .poster-story .poster-when { gap: 10px; } .poster-story .poster-when-date { font-size: calc(46px * var(--p-text-scale)); } .poster-story .poster-when-place { font-size: calc(40px * var(--p-text-scale)); } .poster-story .poster-foot { font-size: calc(40px * var(--p-text-scale)); padding: 20px 46px; } .poster--theme-espresso .poster-bg { background: radial-gradient(ellipse 80% 42% at 50% -6%, rgba(255, 198, 152, 0.18), transparent 60%), radial-gradient(ellipse 95% 42% at 50% 112%, rgba(198, 74, 26, 0.40), transparent 64%), radial-gradient(ellipse 130% 90% at 50% 42%, transparent 52%, rgba(0, 0, 0, 0.34)), linear-gradient(165deg, #312219 0%, #211710 55%, #160f0a 100%); } .poster--theme-plum .poster-bg { background: radial-gradient(ellipse 80% 42% at 50% -6%, rgba(255, 198, 152, 0.16), transparent 60%), radial-gradient(ellipse 95% 42% at 50% 112%, rgba(160, 60, 30, 0.34), transparent 64%), radial-gradient(ellipse 130% 90% at 50% 42%, transparent 52%, rgba(0, 0, 0, 0.30)), linear-gradient(165deg, #4a1f7a 0%, #36165c 55%, #240f3f 100%); } .poster--theme-ink .poster-bg { background: radial-gradient(ellipse 80% 42% at 50% -6%, rgba(255, 198, 152, 0.14), transparent 60%), radial-gradient(ellipse 95% 42% at 50% 112%, rgba(198, 74, 26, 0.30), transparent 64%), radial-gradient(ellipse 130% 90% at 50% 42%, transparent 50%, rgba(0, 0, 0, 0.40)), linear-gradient(165deg, #26242f 0%, #1a1922 55%, #111016 100%); } .poster--accent-teal { --p-amber: #57d0c2; --p-amber-soft: rgba(87, 208, 194, 0.55); --p-amber-faint: rgba(87, 208, 194, 0.14); --p-amber-ring: rgba(87, 208, 194, 0.85); } .poster--accent-magenta { --p-amber: #ef74b0; --p-amber-soft: rgba(239, 116, 176, 0.55); --p-amber-faint: rgba(239, 116, 176, 0.14); --p-amber-ring: rgba(239, 116, 176, 0.85); } .poster--size-fit .poster-title { white-space: nowrap; } .poster-post.poster--size-fit .poster-title { font-size: 132px; } .poster-story.poster--size-fit .poster-title { font-size: 128px; } .poster--shape-circle .poster-portrait { border-radius: 50%; } .poster--shape-wide .poster-portrait-img { object-position: center 32%; } .poster-post.poster--shape-wide .poster-portrait { width: calc(600px * var(--p-portrait-scale, 1)); height: calc(432px * var(--p-portrait-scale, 1)); border-radius: 28px; } .poster-story.poster--shape-wide .poster-portrait { width: calc(820px * var(--p-portrait-scale, 1)); height: calc(590px * var(--p-portrait-scale, 1)); border-radius: 32px; } .poster--frame-plain .poster-portrait { border-color: rgba(255, 255, 255, 0.28); } .poster--frame-none .poster-portrait { border-color: transparent; } .poster--font-serif .poster-title { font-family: var(--font-serif); font-weight: 600; letter-spacing: -0.01em; } .poster--foot-plain .poster-foot { background: none; border: 0; padding-left: 0; padding-right: 0; } .poster--valign-center .poster-mid { justify-content: space-evenly; } .poster--valign-top .poster-mid { justify-content: flex-start; } .poster--valign-bottom .poster-mid { justify-content: flex-end; } .poster--valign-top .poster-mid > * + *, .poster--valign-bottom .poster-mid > * + * { margin-top: calc(54px * var(--p-density, 1)); } .poster--align-left .poster-inner { text-align: left; } .poster--align-left .poster-lockup { justify-content: flex-start; } .poster--align-left .poster-figure { align-items: flex-start; } .poster--align-left .poster-portrait { align-self: flex-start; } .poster--align-left .poster-when-wrap { text-align: left; } .poster--align-left .poster-title { margin-left: 0; } .poster-lockup-sep { display: inline-block; flex: 0 0 auto; } .poster--sep-dot .poster-lockup-sep { width: 8px; height: 8px; border-radius: 50%; background: var(--p-cream-soft); } .poster--sep-line .poster-lockup-sep { width: 2px; align-self: stretch; min-height: 40px; background: rgba(253, 246, 238, 0.4); } .event-attendee-share-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; padding: 6px 12px; font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--ink-soft); text-decoration: none; border-radius: 999px; background: var(--paper-2); border: 1px solid var(--border-soft); transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease; } .event-attendee-share-link:hover { color: var(--ink); border-color: var(--ink-fade); background: var(--paper); } .metric-section { margin: 0 0 34px; } .metric-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; } .metric-section-title { font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin: 0 0 14px; } .metric-section-head .metric-section-title { margin: 0; } .metric-growth { display: flex; gap: 14px; } .metric-growth-item { font-family: var(--font-sans); font-size: 11px; letter-spacing: 0.04em; color: var(--ink-fade); text-transform: uppercase; } .metric-delta { font-family: var(--font-sans); font-size: 11px; font-weight: 600; } .metric-delta.is-up { color: #2e7d32; } .metric-delta.is-down { color: var(--amber); } .metric-delta.is-new { color: var(--amber); } .metric-delta.is-flat { color: var(--ink-fade); } .metric-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 16px; } .metric-tile { display: flex; flex-direction: column; gap: 3px; padding: 12px 10px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 14px; } .metric-tile-num { font-family: var(--font-serif); font-size: 22px; line-height: 1; color: var(--ink); } .metric-tile-lab { font-family: var(--font-sans); font-size: 10px; letter-spacing: 0.04em; color: var(--ink-fade); text-transform: uppercase; } .metric-bars { display: flex; align-items: flex-end; gap: 3px; height: 110px; } .metric-bar-col { flex: 1 1 0; display: flex; align-items: flex-end; justify-content: center; height: 100%; min-width: 0; } .metric-bar { display: block; width: 100%; max-width: 18px; border-radius: 3px 3px 0 0; background: var(--amber-soft); } .metric-bar-founders { background: #c8b6a0; } .metric-bar-rsvps { background: var(--amber); } .metric-bars-caption { margin-top: 8px; font-family: var(--font-sans); font-size: 11px; color: var(--ink-fade); } .metric-table { display: flex; flex-direction: column; } .metric-row { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 8px; padding: 9px 2px; border-bottom: 1px solid var(--border-soft); font-size: 14px; align-items: baseline; } .metric-row-head { font-family: var(--font-sans); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-fade); border-bottom: 1px solid var(--border); } .metric-row.is-muted { color: var(--ink-fade); } .metric-cell-wk, .metric-cell-num { color: var(--ink); } .metric-row.is-muted .metric-cell-wk, .metric-row.is-muted .metric-cell-num { color: var(--ink-fade); } .metric-events { display: flex; flex-direction: column; gap: 8px; } .metric-event { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 14px; text-decoration: none; color: inherit; transition: border-color 0.15s ease; } .metric-event:hover { border-color: var(--amber); } .metric-event-main { flex: 1 1 auto; min-width: 0; } .metric-event-title { font-family: var(--font-serif); font-size: 16px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .metric-event-sub { font-family: var(--font-sans); font-size: 11px; color: var(--ink-fade); } .metric-event-spark { flex: 0 0 84px; width: 84px; } .metric-event-spark .metric-bars { height: 34px; gap: 2px; } .metric-event-spark .metric-bar { max-width: 6px; border-radius: 2px 2px 0 0; } .metric-event-total { flex: 0 0 auto; text-align: right; } .metric-event-total-num { display: block; font-family: var(--font-serif); font-size: 20px; color: var(--ink); line-height: 1; } .metric-event-total-lab { font-family: var(--font-sans); font-size: 9.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-fade); } .metric-inline-link { color: var(--amber); white-space: nowrap; } .metric-section-hint { font-family: var(--font-sans); font-size: 10px; font-weight: 400; letter-spacing: 0.04em; text-transform: none; color: var(--ink-fade); margin-left: 6px; } .metric-tile-link { text-decoration: none; color: inherit; transition: border-color 0.15s ease, background 0.15s ease; } .metric-tile-link:hover { border-color: var(--amber); background: var(--paper); } .metric-bar-col-link { text-decoration: none; cursor: pointer; } .metric-bar-col-link:hover .metric-bar { filter: brightness(0.88); } .metric-row-link { text-decoration: none; color: inherit; cursor: pointer; transition: background 0.15s ease; } .metric-row-link:hover { background: var(--paper-2); } .metric-row.is-peak { background: rgba(198, 74, 26, 0.06); } .metric-cell-go { color: var(--ink-fade); text-align: right; font-size: 15px; } .metric-row-link:hover .metric-cell-go { color: var(--amber); } .metric-drill-link { color: inherit; text-decoration: none; border-bottom: 1px dashed var(--border); } .metric-drill-link:hover { color: var(--amber); border-bottom-color: var(--amber); } .drill-people { display: flex; flex-direction: column; } .drill-person { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 11px 2px; border-bottom: 1px solid var(--border-soft); } .drill-person-main { min-width: 0; } .drill-person-name { font-family: var(--font-serif); font-size: 16px; color: var(--ink); text-decoration: none; } a.drill-person-name:hover { color: var(--amber); } .drill-person-meta { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-mute); margin-top: 1px; } .drill-person-email { color: var(--ink-fade); } .drill-person-event { color: var(--amber); text-decoration: none; } .drill-person-event:hover { text-decoration: underline; } .drill-person-at { flex: 0 0 auto; font-family: var(--font-sans); font-size: 11px; color: var(--ink-fade); white-space: nowrap; font-variant-numeric: tabular-nums; } .ask-compose-collapse { margin: 18px 0; } .ask-compose-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 18px; cursor: pointer; list-style: none; transition: border-color 0.15s ease; } .ask-compose-summary::-webkit-details-marker { display: none; } .ask-compose-summary:hover { border-color: var(--ink-mute); } .ask-compose-summary-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .ask-compose-summary-title { font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: var(--ink); } .ask-compose-summary-hint { font-family: var(--font-sans); font-size: 12px; color: var(--ink-fade); } .ask-compose-summary-icon { flex: 0 0 auto; font-size: 22px; line-height: 1; color: var(--amber); transition: transform 0.18s ease; } .ask-compose-collapse[open] .ask-compose-summary-icon { transform: rotate(45deg); } .ask-compose-collapse[open] .ask-compose-summary { border-radius: 18px 18px 0 0; border-bottom: none; } .ask-compose-collapse[open] .ask-post { margin: 0; border-radius: 0 0 18px 18px; } .ask-post { margin: 18px 0 28px; padding: 16px 16px 14px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 18px; } .ask-post-error { margin-bottom: 10px; font-family: var(--font-sans); font-size: 12.5px; color: #b34c2e; } .ask-compose-label { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-fade); margin: 0 0 8px; } .ask-cats { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; } .ask-cat-btn { padding: 5px 11px; font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--ink-mute); background: var(--paper); border: 1px solid var(--border); border-radius: 999px; cursor: pointer; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .ask-cat-btn:hover { border-color: var(--ink-mute); color: var(--ink); } .ask-cat-btn.is-on { color: var(--amber); background: rgba(198, 74, 26, 0.08); border-color: rgba(198, 74, 26, 0.45); font-weight: 600; } .ask-subs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; padding: 10px; background: rgba(198, 74, 26, 0.04); border: 1px dashed rgba(198, 74, 26, 0.22); border-radius: 12px; } .ask-subs[hidden] { display: none; } .ask-sub { padding: 5px 10px; font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--ink); background: var(--paper); border: 1px solid var(--border); border-radius: 999px; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease; } .ask-sub span { color: var(--amber); font-weight: 700; margin-right: 1px; } .ask-sub:hover { border-color: var(--amber); background: rgba(198, 74, 26, 0.06); } .ask-post-input { width: 100%; padding: 10px 12px; font-family: var(--font-sans); font-size: 14px; line-height: 1.5; color: var(--ink); background: var(--paper); border: 1px solid var(--border); border-radius: 12px; resize: vertical; } .ask-post-input:focus { outline: none; border-color: var(--amber); box-shadow: 0 0 0 1px var(--amber) inset; } .ask-post-input:disabled { background: var(--paper-2); color: var(--ink-fade); } .ask-visibility { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; } .ask-vis { display: flex; align-items: flex-start; gap: 9px; padding: 10px 12px; background: var(--paper); border: 1px solid var(--border); border-radius: 12px; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease; } .ask-vis:hover { border-color: var(--ink-mute); } .ask-vis-input { margin-top: 2px; accent-color: var(--amber); flex: 0 0 auto; } .ask-vis-input:checked ~ .ask-vis-label .ask-vis-title { color: var(--amber); } .ask-vis:has(.ask-vis-input:checked) { border-color: rgba(198, 74, 26, 0.4); background: rgba(198, 74, 26, 0.04); } .ask-vis-label { display: flex; flex-direction: column; gap: 1px; } .ask-vis-title { font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink); } .ask-vis-sub { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-fade); } .ask-vis-disabled { cursor: not-allowed; opacity: 0.55; } .ask-vis-disabled:hover { border-color: var(--border); } .ask-vis-disabled .ask-vis-input { cursor: not-allowed; } .ask-post-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; } .ask-post-remaining { font-family: var(--font-sans); font-size: 11.5px; color: var(--ink-fade); } .ask-post-remaining.is-out { color: var(--amber); } .ask-post-btn { padding: 8px 18px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--paper); background: var(--ink); border: none; border-radius: 999px; cursor: pointer; transition: opacity 0.15s ease; } .ask-post-btn:hover { opacity: 0.88; } .ask-post-btn:disabled { background: var(--border); color: var(--ink-fade); cursor: default; } .ask-section { margin: 0 0 22px; } .ask-section-title { font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin: 0 0 12px; } .ask-section-count { margin-left: 4px; color: var(--ink-fade); } .ask-list { display: flex; flex-direction: column; gap: 14px; } .ask-permalink-eyebrow { margin: 4px 0 14px; } .ask-permalink-back { font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--amber); text-decoration: none; } .ask-permalink-back::before { content: "‹ "; } .ask-permalink-cta { margin-top: 20px; text-align: center; } .ask-permalink-cta-link { font-family: var(--font-sans); font-size: 14px; font-weight: 500; color: var(--ink); text-decoration: none; } .ask-permalink-cta-link:hover { color: var(--amber); } .ask-screen-title { margin-bottom: 6px; } .ask-intro { margin-bottom: 14px; } .ask-tabs { margin: 20px 0 0; } .ask-tab-input { position: absolute; opacity: 0; pointer-events: none; } .ask-tab-list { display: flex; gap: 6px; margin: 0 0 16px; padding-bottom: 8px; border-bottom: 1px solid var(--border-soft); } .ask-tab { display: inline-flex; align-items: baseline; gap: 6px; padding: 7px 14px; border-radius: 999px; font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--ink-mute); cursor: pointer; white-space: nowrap; transition: background 0.15s ease, color 0.15s ease; } .ask-tab:hover { color: var(--ink); } .ask-tab-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-fade); } .ask-tab-input-latest:checked ~ .ask-tab-list .ask-tab-target-latest, .ask-tab-input-partners:checked ~ .ask-tab-list .ask-tab-target-partners { background: var(--amber-soft); color: var(--ink); } .ask-tab-input-latest:checked ~ .ask-tab-list .ask-tab-target-latest .ask-tab-count, .ask-tab-input-partners:checked ~ .ask-tab-list .ask-tab-target-partners .ask-tab-count { color: var(--ink-soft); } .ask-tab-panel { display: none; } .ask-tab-input-latest:checked ~ .ask-tab-panel-latest, .ask-tab-input-partners:checked ~ .ask-tab-panel-partners { display: block; } .ask-empty { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); padding: 8px 2px; } .ask-hidden-tray { margin-top: 26px; } .ask-row { display: flex; align-items: flex-start; gap: 12px; padding: 24px 26px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.4) 28%, rgba(255, 255, 255, 0) 68%), var(--paper-2); border: 1px solid rgba(230, 212, 194, 0.75); border-radius: 22px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 2px rgba(26, 24, 20, 0.05), 0 6px 16px rgba(26, 24, 20, 0.06), 0 18px 40px rgba(26, 24, 20, 0.07); transition: transform 0.25s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.3s cubic-bezier(0.32, 0.72, 0, 1); } .ask-row:hover { transform: translateY(-3px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 2px 4px rgba(26, 24, 20, 0.06), 0 12px 26px rgba(26, 24, 20, 0.08), 0 28px 56px rgba(26, 24, 20, 0.1); } .ask-row-mine { border-color: rgba(198, 74, 26, 0.45); background: linear-gradient(0deg, rgba(198, 74, 26, 0.06), rgba(198, 74, 26, 0.06)), linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 60%), var(--paper-2); box-shadow: inset 3px 0 0 var(--amber), inset 0 1px 0 rgba(255, 255, 255, 0.6), 0 1px 2px rgba(26, 24, 20, 0.05), 0 6px 16px rgba(26, 24, 20, 0.06), 0 18px 40px rgba(26, 24, 20, 0.07); } .ask-row-mine:hover { box-shadow: inset 3px 0 0 var(--amber), inset 0 1px 0 rgba(255, 255, 255, 0.65), 0 2px 4px rgba(26, 24, 20, 0.06), 0 12px 26px rgba(26, 24, 20, 0.08), 0 28px 56px rgba(26, 24, 20, 0.1); } .ask-row-main { flex: 1 1 auto; min-width: 0; } .ask-row-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-bottom: 12px; } .ask-row-cat, .ask-row-private, .ask-row-mine-tag, .ask-row-hidden-tag { display: inline-flex; align-items: center; padding: 4px 11px; border-radius: 999px; font-family: var(--font-sans); font-size: 10px; font-weight: 600; letter-spacing: 0.06em; line-height: 1; text-transform: uppercase; white-space: nowrap; } .ask-row-cat { background: var(--paper); border: 1px solid var(--border-soft); color: var(--ink-soft); } .ask-row-mine-tag { background: var(--amber); color: #fff; font-weight: 700; letter-spacing: 0.07em; box-shadow: 0 1px 2px rgba(198, 74, 26, 0.3); } .ask-row-private, .ask-row-hidden-tag { background: transparent; border: 1px solid var(--border-soft); color: var(--ink-mute); } .ask-row-text { display: block; font-family: var(--font-serif); font-size: 20px; line-height: 1.45; color: var(--ink); text-decoration: none; } a.ask-row-text:hover { color: var(--amber); } .ask-row-by { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; margin-top: 18px; } .ask-row-by-id { display: inline-flex; align-items: center; gap: 12px; min-width: 0; text-decoration: none; } .ask-row-avatar { flex: 0 0 52px; width: 52px; height: 52px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px rgba(26, 24, 20, 0.06), 0 1px 3px rgba(26, 24, 20, 0.1); } .ask-row-by-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .ask-row-by-name { display: inline-flex; align-items: center; gap: 5px; } .ask-row-name { font-family: var(--font-sans); font-size: 15px; font-weight: 600; color: var(--ink); } .ask-row-by-id:hover .ask-row-name { color: var(--amber); } .ask-row-sub { font-family: var(--font-sans); font-size: 13px; color: var(--ink-fade); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ask-row-time { font-family: var(--font-sans); font-size: 12px; color: var(--ink-fade); white-space: nowrap; flex: 0 0 auto; } .ask-row-reach { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-top: 18px; } .ask-row-reach-lead { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-mute); } .ask-row-reach-links { display: inline-flex; align-items: center; gap: 9px; } .ask-row-reach-link { display: inline-flex; align-items: center; justify-content: center; width: 35px; height: 35px; color: var(--ink-soft); border: 1px solid var(--border-soft); border-radius: 50%; background: var(--paper); text-decoration: none; transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease, transform 0.15s ease; } .ask-row-reach-link:hover { color: var(--amber); border-color: rgba(198, 74, 26, 0.5); background: rgba(198, 74, 26, 0.08); transform: translateY(-1px); } .ask-row-reach-link .ui-icon svg { width: 17px; height: 17px; } .ask-row-remove { flex: 0 0 auto; padding: 2px 8px; font-size: 13px; color: var(--ink-fade); background: transparent; border: none; border-radius: 8px; cursor: pointer; transition: color 0.15s ease, background 0.15s ease; } .ask-row-remove:hover { color: #b34c2e; background: rgba(179, 76, 46, 0.06); } .ask-row-controls { flex: 0 0 auto; display: flex; align-items: flex-start; gap: 4px; } .ask-row-mod { flex: 0 0 auto; padding: 2px 9px; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.03em; color: var(--ink-fade); background: transparent; border: 1px solid var(--border-soft); border-radius: 999px; cursor: pointer; white-space: nowrap; transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease; } .ask-row-mod:hover { color: var(--ink); border-color: var(--ink-mute); background: var(--paper-tint, rgba(0, 0, 0, 0.02)); } .ask-row-hidden { opacity: 0.72; } .ask-section-note { margin: -4px 0 12px; font-family: var(--font-sans); font-size: 12.5px; line-height: 1.45; color: var(--ink-fade); } .ask-locked { margin: 16px 0 24px; padding: 16px 18px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 16px; } .ask-locked-title { font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink); margin: 0 0 4px; } .ask-locked-sub { font-family: var(--font-sans); font-size: 12.5px; line-height: 1.55; color: var(--ink-mute); margin: 0; } .ask-locked-link { color: var(--amber); font-weight: 600; text-decoration: none; } .ask-locked-link:hover { text-decoration: underline; } .ask-gate-list { list-style: none; margin: 12px 0 14px; padding: 0; display: flex; flex-direction: column; gap: 7px; } .ask-gate-item { display: flex; align-items: center; gap: 9px; font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); } .ask-gate-item.is-done .ask-gate-label { color: var(--ink-soft); } .ask-gate-item.is-missing .ask-gate-label { color: var(--ink); font-weight: 500; } .ask-gate-tick { flex: 0 0 18px; width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; line-height: 1; border-radius: 50%; } .ask-gate-item.is-done .ask-gate-tick { color: #2e7d57; } .ask-gate-item.is-missing .ask-gate-tick { color: var(--ink-faint); } .ask-gate-btn { display: inline-block; padding: 9px 16px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--paper); background: var(--ink); border-radius: 999px; text-decoration: none; transition: opacity 0.15s ease; } .ask-gate-btn:hover { opacity: 0.88; } .ask-panel { margin: 18px 0; padding: 18px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 18px; } .ask-panel-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; } .ask-panel-title { font-family: var(--font-serif); font-size: 19px; color: var(--ink); margin: 0 0 3px; } .ask-panel-sub { font-family: var(--font-serif); font-size: 12.5px; line-height: 1.5; color: var(--ink-mute); margin: 0; max-width: 46ch; } .ask-panel-all { flex: 0 0 auto; font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--amber); text-decoration: none; white-space: nowrap; } .ask-panel-all:hover { text-decoration: underline; } .ask-panel-list { margin-bottom: 14px; } .ask-panel-list .ask-row { background: var(--paper); } .ask-panel-empty { font-family: var(--font-sans); font-size: 13px; color: var(--ink-fade); margin: 0 0 14px; } .ask-panel-cta { display: inline-block; padding: 9px 18px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: #fff; background: var(--amber); border-radius: 999px; text-decoration: none; transition: transform 120ms ease, box-shadow 120ms ease; } .ask-panel-cta:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(198, 74, 26, 0.25); } .nl-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; } .nl-action { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(0, 0, 0, 0.16); background: var(--paper); font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink); text-decoration: none; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease; } .nl-action:hover { border-color: rgba(0, 0, 0, 0.4); } .nl-action-send { background: var(--ink); color: #fff; border-color: var(--ink); } .nl-action-send:hover { opacity: 0.9; } .nl-action-ai { border-color: var(--amber); color: var(--amber); } .nl-action-ai:hover { background: rgba(198, 74, 26, 0.08); border-color: var(--amber); } .nl-action[disabled] { opacity: 0.5; cursor: default; } .nl-banner { margin-top: 16px; padding: 11px 14px; border-radius: 10px; background: rgba(198, 74, 26, 0.08); border: 1px solid rgba(198, 74, 26, 0.28); font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); line-height: 1.5; } .nl-banner-error { background: rgba(179, 76, 46, 0.06); border-color: rgba(179, 76, 46, 0.4); color: #b34c2e; } .nl-section { margin-top: 8px; } .nl-items { display: flex; flex-direction: column; gap: 10px; } .nl-item { padding: 12px 14px; border-radius: 10px; border: 1px solid rgba(0, 0, 0, 0.1); background: var(--paper); } .nl-item-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; } .nl-item-include { display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); cursor: pointer; } .nl-item-include input[type="checkbox"] { accent-color: var(--amber); width: 16px; height: 16px; } .nl-item-reorder { display: inline-flex; gap: 6px; } .nl-reorder-btn { width: 30px; height: 28px; border-radius: 8px; border: 1px solid rgba(0, 0, 0, 0.14); background: var(--bg); color: var(--ink-soft); font-size: 14px; line-height: 1; cursor: pointer; transition: border-color 0.15s ease, color 0.15s ease; } .nl-reorder-btn:hover { border-color: rgba(0, 0, 0, 0.4); color: var(--ink); } .nl-item-title { margin: 0 0 2px; font-family: var(--font-serif); font-size: 15px; font-weight: 600; color: var(--ink); line-height: 1.35; } .nl-item-meta { margin: 0; font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); line-height: 1.45; } .nl-item-blurb { margin-top: 8px; font-size: 14px; } .nl-item:has(.nl-item-include input:not(:checked)) { opacity: 0.5; } .grid-screen { padding-bottom: 28px; } .grid-map { width: 100%; height: 320px; border: 1px solid var(--rule); border-radius: 14px; overflow: hidden; background: var(--paper-2); margin-bottom: 14px; z-index: 0; } .grid-pin-wrap { background: transparent; border: 0; } .grid-pin { display: block; width: 16px; height: 16px; border-radius: 50%; background: var(--amber); border: 3px solid #fff; box-shadow: 0 1px 4px rgba(26, 24, 20, 0.35); } .grid-popup { font-family: var(--font-sans); line-height: 1.35; } .grid-popup strong { display: block; color: var(--ink); font-size: 14px; } .grid-popup span { display: block; color: var(--ink-soft); font-size: 12.5px; margin-top: 2px; } .grid-popup em { display: block; color: var(--ink-mute); font-size: 11.5px; font-style: normal; margin-top: 3px; } .grid-popup a { display: inline-block; margin-top: 6px; font-size: 12px; font-weight: 600; color: var(--amber); text-decoration: none; } .grid-pin--startup { background: var(--amber); } .grid-pin--vc { background: #2f6f4f; } .grid-pin--incubator { background: #6b4bb3; } .grid-pin--coworking { background: #2b6cb0; } .grid-pin--community { background: #b8860b; } .grid-pin--cafe { background: #8a5a2b; } .cg-map { height: 380px; border-radius: 14px; } .cg-map-wrap { position: relative; margin: 4px 0 12px; } .cg-map-legend { position: absolute; top: 8px; right: 8px; z-index: 500; display: flex; flex-direction: column; gap: 3px; padding: 7px 10px; background: rgba(255, 255, 255, 0.92); border: 1px solid var(--border-soft); border-radius: 10px; box-shadow: 0 1px 4px rgba(26, 24, 20, 0.12); } .cg-legend-item { display: flex; align-items: center; gap: 6px; font-family: var(--font-sans); font-size: 11px; color: var(--ink-soft); } .cg-legend-dot { width: 9px; height: 9px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 1px 2px rgba(26,24,20,.3); } .cg-map-reset { position: absolute; left: 8px; bottom: 8px; z-index: 500; padding: 5px 11px; font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink); background: rgba(255, 255, 255, 0.92); border: 1px solid var(--border-soft); border-radius: 999px; cursor: pointer; } .cg-map-reset:hover { border-color: var(--amber); color: var(--amber); } .cg-map-search { margin: 0 0 10px; } .cg-search-input { width: 100%; box-sizing: border-box; padding: 9px 14px; font-family: var(--font-sans); font-size: 14px; color: var(--ink); background: var(--bg); border: 1px solid var(--border-soft); border-radius: 999px; } .cg-search-input:focus { outline: none; border-color: var(--amber); } .cg-map-loading { position: absolute; inset: 0; z-index: 450; display: flex; align-items: center; justify-content: center; font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); background: var(--paper-2); border-radius: 14px; } .cg-map-loading[hidden] { display: none; } .cg-cluster-wrap, .grid-cluster-wrap { background: transparent; border: 0; } .grid-cluster { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; font-family: var(--font-sans); font-size: 12px; font-weight: 700; color: #fff; background: rgba(198, 74, 26, 0.9); border: 2px solid #fff; border-radius: 50%; box-shadow: 0 1px 5px rgba(26, 24, 20, 0.4); } @media (min-width: 900px) { .cg-grid-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start; } .cg-grid-map-col { position: sticky; top: 12px; } .cg-map { height: 520px; } } .cg-map-chips { margin-bottom: 8px; } .grid-chip[class*="cg-chip--"]::before { content: ""; display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: middle; } .cg-chip--startup::before { background: var(--amber); } .cg-chip--vc::before { background: #2f6f4f; } .cg-chip--incubator::before { background: #6b4bb3; } .cg-chip--coworking::before { background: #2b6cb0; } .cg-chip--community::before { background: #b8860b; } .cg-chip--cafe::before { background: #8a5a2b; } .cg-map-list { margin-top: 10px; } .cg-map-row { display: flex; align-items: center; gap: 10px; padding: 9px 4px; border-bottom: 1px solid var(--border-soft); cursor: pointer; } .cg-map-row.is-focused { background: rgba(198, 74, 26, 0.06); border-radius: 8px; } .cg-map-dot { flex: none; width: 11px; height: 11px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 1px 3px rgba(26, 24, 20, 0.3); } .cg-map-row-body { min-width: 0; flex: 1; } .cg-map-row-name { display: block; font-family: var(--font-sans); font-size: 14px; color: var(--ink); } .cg-map-row-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; } .cg-map-row-area { font-size: 12px; color: var(--ink-mute); } .cg-map-row-dist { font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .02em; color: var(--amber); } .cg-map-row-links { flex: none; display: flex; align-items: center; gap: 12px; } .cg-map-row-link { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-mute); text-decoration: none; white-space: nowrap; } .cg-map-row-link.cg-map-row-dir { color: var(--amber); } .cg-map-row-link:hover { color: var(--amber); text-decoration: underline; } .cg-map-tools { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; } .cg-locate-btn { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: #fff; background: var(--amber); border: 0; border-radius: 999px; cursor: pointer; } .cg-locate-btn:disabled { opacity: .7; cursor: default; } .cg-locate-status { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); } .cg-pin-you { display: block; width: 14px; height: 14px; border-radius: 50%; background: #2b6cb0; border: 3px solid #fff; box-shadow: 0 0 0 4px rgba(43, 108, 176, 0.25); } .cg-nearest-strip { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 4px; } .cg-nearest-item { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; cursor: pointer; text-align: left; } .cg-nearest-item:hover { border-color: var(--amber); } .cg-nearest-dot { flex: none; width: 9px; height: 9px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 1px 2px rgba(26,24,20,.3); } .cg-nearest-text { font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); } .cg-radius-row { margin-bottom: 8px; } .grid-popup-links { display: flex; gap: 10px; margin-top: 6px; } .grid-popup-links a { margin-top: 0 !important; } .grid-popup-detail { display: block; color: var(--ink-soft); font-size: 12px; margin-top: 4px; } .grid-chip-count { font-family: var(--font-mono); font-size: 10px; color: var(--ink-fade); margin-left: 3px; } .grid-chip.is-active .grid-chip-count { color: rgba(255, 255, 255, 0.8); } .cg-hood-row { margin-bottom: 8px; } .cg-map-row-hood { font-family: var(--font-sans); font-size: 11px; color: var(--ink-soft); background: var(--paper-2); border-radius: 4px; padding: 1px 7px; } .cg-map-group { list-style: none; font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-mute); padding: 14px 4px 4px; } .cg-map-group:first-child { padding-top: 2px; } .grid-chips { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 4px; scrollbar-width: none; } .grid-chips::-webkit-scrollbar { display: none; } .grid-chips-stage { margin-bottom: 10px; } .grid-chip { flex: 0 0 auto; font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-soft); background: var(--paper); border: 1px solid var(--rule); border-radius: 999px; padding: 6px 13px; cursor: pointer; white-space: nowrap; transition: background 0.15s, color 0.15s, border-color 0.15s; } .grid-chip:hover { border-color: var(--ink-faint); } .grid-chip.is-active { color: #fff; background: var(--amber); border-color: var(--amber); } .grid-count { font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); margin: 6px 0 12px; letter-spacing: 0.02em; } .grid-list { list-style: none; display: flex; flex-direction: column; gap: 10px; } .grid-card { display: flex; gap: 13px; padding: 13px 14px; background: var(--paper); border: 1px solid var(--rule); border-radius: 13px; cursor: pointer; transition: border-color 0.15s, box-shadow 0.15s, transform 0.1s; } .grid-card:hover { border-color: var(--ink-faint); } .grid-card:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; } .grid-card.is-focused { border-color: var(--amber); box-shadow: 0 0 0 2px var(--amber-soft); } .grid-card-logo { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 11px; overflow: hidden; background: var(--paper-2); border: 1px solid var(--border-soft); display: flex; align-items: center; justify-content: center; } .grid-card-logo img { width: 100%; height: 100%; object-fit: cover; } .grid-card-monogram { font-family: var(--font-serif); font-size: 22px; font-weight: 600; color: var(--ink-mute); } .grid-card-body { min-width: 0; flex: 1; } .grid-card-name { font-size: 15px; font-weight: 600; color: var(--ink); line-height: 1.25; } .grid-card-name-link { color: inherit; text-decoration: none; } .grid-card-name-link:hover { text-decoration: underline; } .grid-card-tagline { font-size: 13px; color: var(--ink-soft); line-height: 1.4; margin-top: 2px; } .grid-card-meta { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); margin-top: 6px; letter-spacing: 0.01em; } .grid-card-sectors { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; } .grid-card-sector { font-size: 11px; font-weight: 500; color: var(--ink-soft); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 6px; padding: 2px 7px; } .grid-card-founder { display: inline-block; margin-top: 8px; font-size: 12px; font-weight: 500; color: var(--amber); text-decoration: none; } .grid-card-founder:hover { text-decoration: underline; } .grid-empty-filter, .grid-blank-sub { color: var(--ink-mute); font-size: 13.5px; } .grid-empty-filter { padding: 18px 4px; text-align: center; } .grid-blank { text-align: center; padding: 40px 12px; } .grid-blank-title { font-family: var(--font-serif); font-size: 18px; color: var(--ink); margin-bottom: 6px; } .grid-admin-cta { display: flex; align-items: center; gap: 14px; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--border-soft); } .grid-admin-link { font-size: 13px; color: var(--ink-mute); text-decoration: none; } .grid-admin-link:hover { text-decoration: underline; } .event-form-field-split { display: flex; gap: 12px; } .event-form-field-split > div { flex: 1; } .event-form-checkboxes { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 6px; } .poll-screen-title { margin-bottom: 6px; } .poll-intro { margin-bottom: 14px; } .poll-mine { margin: 12px 0 22px; padding: 16px 18px; background: var(--paper-2); border: 1px solid var(--amber-soft); border-radius: 16px; } .poll-mine-title { font-family: var(--font-serif); font-size: 15px; color: var(--ink); margin: 0 0 8px; } .poll-mine-list { list-style: none; margin: 0; padding: 0; } .poll-mine-row { border-top: 1px solid var(--border-soft); } .poll-mine-row:first-child { border-top: 0; } .poll-mine-link { display: flex; flex-direction: column; gap: 4px; padding: 11px 0; text-decoration: none; } .poll-mine-q { font-family: var(--font-sans); font-size: 14px; font-weight: 500; line-height: 1.35; color: var(--ink); } .poll-mine-link:hover .poll-mine-q { color: var(--amber); } .poll-mine-picks { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; } .poll-mine-picks-label { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); } .poll-mine-pick { font-family: var(--font-sans); font-size: 12px; color: var(--amber); background: rgba(198, 74, 26, 0.08); border-radius: 20px; padding: 2px 10px; } .poll-empty { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); padding: 8px 2px; } .poll-admin-bar { margin: 14px 0 4px; } .poll-admin-link { font-size: 13px; color: var(--ink-mute); text-decoration: none; } .poll-admin-link:hover { text-decoration: underline; } .poll-index-list { display: flex; flex-direction: column; gap: 14px; } .poll-index-card { display: flex; flex-direction: column; gap: 6px; padding: 20px 22px; text-decoration: none; background: linear-gradient(180deg, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.4) 28%, rgba(255,255,255,0) 68%), var(--paper-2); border: 1px solid rgba(230, 212, 194, 0.75); border-radius: 22px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 1px 2px rgba(26,24,20,0.05), 0 6px 16px rgba(26,24,20,0.06), 0 18px 40px rgba(26,24,20,0.07); transition: transform 0.25s cubic-bezier(0.32,0.72,0,1), box-shadow 0.3s cubic-bezier(0.32,0.72,0,1); } .poll-index-card:hover { transform: translateY(-3px); box-shadow: inset 0 1px 0 rgba(255,255,255,0.95), 0 2px 4px rgba(26,24,20,0.06), 0 12px 26px rgba(26,24,20,0.08), 0 28px 56px rgba(26,24,20,0.1); } .poll-index-q { font-family: var(--font-serif); font-size: 20px; line-height: 1.35; color: var(--ink); } .poll-index-desc { font-size: 14px; color: var(--ink-soft); line-height: 1.5; } .poll-index-meta { font-size: 12px; color: var(--ink-mute); letter-spacing: 0.01em; } .poll-permalink-eyebrow { margin-bottom: 12px; } .poll-permalink-back { font-size: 13px; font-weight: 600; color: var(--ink-mute); text-decoration: none; } .poll-permalink-back:hover { color: var(--amber); } .poll-question { font-family: var(--font-serif); font-size: 26px; line-height: 1.3; color: var(--ink); margin-bottom: 8px; } .poll-desc { font-size: 15px; color: var(--ink-soft); line-height: 1.55; margin-bottom: 10px; } .poll-tally { font-size: 13px; color: var(--ink-mute); margin-bottom: 4px; } .poll-signin-note, .poll-other-locked { font-size: 13.5px; color: var(--ink-mute); margin: 6px 0 2px; } .poll-signin-link { color: var(--amber); font-weight: 600; text-decoration: none; } .poll-signin-link:hover { text-decoration: underline; } .poll-options { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; } .poll-option { display: flex; align-items: flex-start; gap: 14px; padding: 14px 16px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 16px; transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; } .poll-option:hover { box-shadow: 0 4px 14px rgba(26,24,20,0.06); } .poll-option.is-picked { border-color: rgba(198,74,26,0.4); background: linear-gradient(0deg, rgba(198,74,26,0.05), rgba(198,74,26,0.05)), var(--paper); box-shadow: inset 3px 0 0 var(--amber); } .poll-option > form { margin: 0; flex: 0 0 auto; } .poll-toggle { width: 26px; height: 26px; margin-top: 1px; border: 2px solid var(--rule); border-radius: 999px; background: var(--paper); display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; color: #fff; text-decoration: none; transition: background 0.15s ease, border-color 0.15s ease, transform 0.1s ease; } .poll-toggle:hover { border-color: var(--amber); } .poll-toggle:active { transform: scale(0.92); } .poll-toggle.is-on { background: var(--amber); border-color: var(--amber); } .poll-toggle-mark { font-size: 14px; line-height: 1; font-weight: 700; } .poll-option-body { flex: 1 1 auto; min-width: 0; } .poll-option-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; } .poll-option-label { font-family: var(--font-sans); font-size: 15.5px; font-weight: 600; color: var(--ink); } .poll-option-count { flex: 0 0 auto; font-family: var(--font-mono); font-size: 13px; font-variant-numeric: tabular-nums; color: var(--ink-mute); } .poll-faces { display: flex; flex-wrap: wrap; align-items: center; gap: 0; margin-top: 8px; } .poll-face { display: inline-flex; margin-right: -7px; text-decoration: none; transition: transform 0.12s ease; } .poll-face:hover { transform: translateY(-2px); z-index: 2; } .poll-face-avatar { width: 30px; height: 30px; border-radius: 999px; border: 2px solid var(--paper); object-fit: cover; display: block; } .poll-faces-more { margin-left: 14px; font-size: 12px; color: var(--ink-mute); } .poll-other { display: flex; gap: 8px; margin-top: 16px; } .poll-other-input { flex: 1 1 auto; padding: 11px 14px; font-family: var(--font-sans); font-size: 14.5px; color: var(--ink); background: var(--paper); border: 1px solid var(--border-soft); border-radius: 12px; } .poll-other-input:focus { outline: none; border-color: var(--amber); } .poll-other-add { flex: 0 0 auto; padding: 11px 18px; font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: #fff; background: var(--amber); border: none; border-radius: 12px; cursor: pointer; } .poll-other-add:hover { filter: brightness(1.05); } .poll-tabs { margin: 18px 0 0; } .poll-tab-input { position: absolute; opacity: 0; pointer-events: none; } .poll-tab-list { display: flex; gap: 6px; margin: 0 0 16px; padding-bottom: 8px; border-bottom: 1px solid var(--border-soft); } .poll-tab { display: inline-flex; align-items: baseline; gap: 6px; padding: 7px 14px; border-radius: 999px; font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--ink-mute); cursor: pointer; white-space: nowrap; transition: background 0.15s ease, color 0.15s ease; } .poll-tab:hover { color: var(--ink); } .poll-tab-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-faint); } .poll-tab-input-top:checked ~ .poll-tab-list .poll-tab-target-top, .poll-tab-input-latest:checked ~ .poll-tab-list .poll-tab-target-latest, .poll-tab-input-leaders:checked ~ .poll-tab-list .poll-tab-target-leaders { background: var(--amber-soft); color: var(--ink); } .poll-tab-input-top:checked ~ .poll-tab-list .poll-tab-target-top .poll-tab-count, .poll-tab-input-leaders:checked ~ .poll-tab-list .poll-tab-target-leaders .poll-tab-count { color: var(--ink-soft); } .poll-tab-panel { display: none; } .poll-tab-input-top:checked ~ .poll-tab-panel-top, .poll-tab-input-latest:checked ~ .poll-tab-panel-latest, .poll-tab-input-leaders:checked ~ .poll-tab-panel-leaders { display: block; } .poll-cat-chips { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 16px; } .poll-cat-chip { display: inline-flex; align-items: baseline; gap: 6px; padding: 6px 13px; border-radius: 999px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--ink-mute); text-decoration: none; background: var(--paper); border: 1px solid var(--border-soft); transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .poll-cat-chip:hover { color: var(--ink); } .poll-cat-chip.is-active { background: var(--amber-soft); border-color: transparent; color: var(--ink); } .poll-cat-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-faint); } .poll-cat-chip.is-active .poll-cat-count { color: var(--ink-soft); } .poll-index-cat { align-self: flex-start; font-family: var(--font-sans); font-size: 10px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--amber); margin-bottom: 2px; } .poll-board { list-style: none; display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; } .poll-board-row { display: flex; align-items: flex-start; gap: 14px; padding: 14px 16px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 16px; } .poll-board-rank { flex: 0 0 auto; min-width: 22px; padding-top: 3px; font-family: var(--font-mono); font-size: 13px; color: var(--ink-dim); font-variant-numeric: tabular-nums; } .poll-board-body { flex: 1 1 auto; min-width: 0; } .poll-board-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; } .poll-board-name { font-family: var(--font-serif); font-size: 19px; line-height: 1.3; color: var(--ink); } .poll-board-total { flex: 0 0 auto; font-family: var(--font-mono); font-size: 14px; font-weight: 600; color: var(--amber); font-variant-numeric: tabular-nums; } .poll-board-for { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; } .poll-board-tag { display: inline-flex; align-items: baseline; gap: 6px; max-width: 100%; padding: 4px 10px; border-radius: 999px; background: var(--paper-2); border: 1px solid var(--border-soft); font-size: 12px; line-height: 1.3; color: var(--ink-soft); text-decoration: none; } .poll-board-tag:hover { border-color: var(--amber-soft); color: var(--ink); } .poll-board-tag-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .poll-index-card .poll-faces { margin-top: 2px; } .poll-board .poll-faces { margin-top: 8px; } .discovery-block > .ask-panel { margin-top: 0; } .poll-panel-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; } .poll-panel-row { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; text-decoration: none; transition: transform 0.2s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.2s ease; } .poll-panel-row:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(26, 24, 20, 0.07); } .poll-panel-q { font-family: var(--font-serif); font-size: 16.5px; line-height: 1.35; color: var(--ink); } .poll-panel-row .poll-faces { margin-top: 2px; } .poll-panel-meta { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); } .network-pulse .pulse-tab-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; } .pulse-tab-list { display: flex; flex-wrap: wrap; gap: 16px; row-gap: 4px; margin: 0 0 14px; border-bottom: 1px solid var(--border-soft); } .pulse-tab { font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink-mute); cursor: pointer; padding: 0 0 9px; margin-bottom: -1px; border-bottom: 2px solid transparent; transition: color 120ms ease, border-color 120ms ease; } .pulse-tab:hover { color: var(--ink); } .pulse-tab-input-polls:checked ~ .pulse-tab-list .pulse-tab-polls, .pulse-tab-input-asks:checked ~ .pulse-tab-list .pulse-tab-asks, .pulse-tab-input-failcodes:checked ~ .pulse-tab-list .pulse-tab-failcodes, .pulse-tab-input-watchlist:checked ~ .pulse-tab-list .pulse-tab-watchlist, .pulse-tab-input-books:checked ~ .pulse-tab-list .pulse-tab-books, .pulse-tab-input-podcasts:checked ~ .pulse-tab-list .pulse-tab-podcasts, .pulse-tab-input-readingroom:checked ~ .pulse-tab-list .pulse-tab-readingroom, .pulse-tab-input-howiai:checked ~ .pulse-tab-list .pulse-tab-howiai, .pulse-tab-input-demoday:checked ~ .pulse-tab-list .pulse-tab-demoday { color: var(--ink); border-bottom-color: var(--amber); } .pulse-tab-panel { display: none; } .pulse-tab-input-polls:checked ~ .pulse-panel-polls, .pulse-tab-input-asks:checked ~ .pulse-panel-asks, .pulse-tab-input-failcodes:checked ~ .pulse-panel-failcodes, .pulse-tab-input-watchlist:checked ~ .pulse-panel-watchlist, .pulse-tab-input-books:checked ~ .pulse-panel-books, .pulse-tab-input-podcasts:checked ~ .pulse-panel-podcasts, .pulse-tab-input-readingroom:checked ~ .pulse-panel-readingroom, .pulse-tab-input-howiai:checked ~ .pulse-panel-howiai, .pulse-tab-input-demoday:checked ~ .pulse-panel-demoday { display: block; } .pulse-all { display: inline-block; margin-top: 2px; } .failcode-panel-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; } .failcode-panel-row { display: block; padding: 12px 14px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; text-decoration: none; transition: transform 120ms ease, box-shadow 120ms ease; } .failcode-panel-row:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(26, 24, 20, 0.07); } .failcode-panel-by { display: flex; align-items: center; gap: 7px; margin-bottom: 6px; } .failcode-panel-by .failcode-avatar { flex: 0 0 auto; } .failcode-panel-meta { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--amber); } .failcode-panel-title { display: block; font-family: var(--font-serif); font-size: 16px; line-height: 1.35; color: var(--ink); } .failcode-prose-head { margin: 18px 0 8px; font-family: var(--font-sans); font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); } .failcode-prose-list { margin: 0 0 14px; padding-left: 20px; } .failcode-prose-list li { margin: 0 0 9px; font-family: var(--font-serif); font-size: 16px; line-height: 1.6; color: var(--ink-soft); } .failcode-prose-list li::marker { color: var(--amber); } .poll-share-cta { margin: 6px 0 2px; } .poll-share-cta-link { display: inline-flex; align-items: center; gap: 6px; padding: 9px 18px; border-radius: 999px; font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: #fff; background: var(--amber); text-decoration: none; transition: filter 0.15s ease; } .poll-share-cta-link:hover { filter: brightness(1.05); } .poll-share-card { display: flex; } .poll-share-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 14px; background: var(--amber); z-index: 2; } .poll-share-body { position: relative; z-index: 1; flex: 1; display: flex; flex-direction: column; padding: 110px 96px 84px; } .poll-share-eyebrow { font-family: var(--font-sans); font-size: 30px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); } .poll-share-who { display: flex; align-items: center; gap: 36px; margin-top: 66px; } .poll-share-avatar, .poll-share-avatar-image { width: 138px; height: 138px; border-radius: 999px; object-fit: cover; flex: 0 0 auto; } .poll-share-avatar.avatar-letter { display: flex; align-items: center; justify-content: center; background: var(--amber-soft); color: var(--amber); font-family: var(--font-serif); } .poll-share-id { display: flex; flex-direction: column; gap: 10px; min-width: 0; } .poll-share-name { font-family: var(--font-serif); font-size: 60px; line-height: 1.04; color: var(--ink); } .poll-share-sub { font-family: var(--font-sans); font-size: 31px; color: var(--ink-mute); } .poll-share-lead { font-family: var(--font-sans); font-size: 36px; color: var(--ink-soft); margin-top: 80px; } .poll-share-picks { list-style: none; display: flex; flex-wrap: wrap; gap: 20px; margin-top: 28px; padding: 0; } .poll-share-pick { font-family: var(--font-sans); font-size: 42px; font-weight: 600; line-height: 1.05; color: #fff; background: var(--amber); border-radius: 999px; padding: 18px 38px; } .poll-share-for { font-family: var(--font-sans); font-size: 30px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); margin-top: 76px; } .poll-share-q { font-family: var(--font-serif); font-size: 58px; line-height: 1.24; color: var(--ink); margin-top: 16px; } .poll-share-foot { margin-top: auto; display: flex; flex-direction: column; gap: 10px; padding-top: 64px; } .poll-share-brand { font-family: var(--font-sans); font-size: 29px; color: var(--ink-mute); } .poll-share-url { font-family: var(--font-mono); font-size: 27px; color: var(--amber); } .poll-show-cat { margin-bottom: 8px; } .poll-show-cat-link { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--amber); text-decoration: none; } .poll-show-cat-link:hover { text-decoration: underline; } .failcode-post-cta { display: inline-block; margin: 0 0 20px; padding: 10px 18px; font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: #fff; background: var(--amber); border-radius: 999px; text-decoration: none; transition: transform 120ms ease, box-shadow 120ms ease; } .failcode-post-cta:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(198, 74, 26, 0.25); } .failcode-list { display: flex; flex-direction: column; gap: 14px; } .failcode-card { display: block; padding: 18px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 16px; text-decoration: none; transition: transform 120ms ease, box-shadow 120ms ease; } .failcode-card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(26, 24, 20, 0.07); } .failcode-card.is-featured { border-color: var(--amber-soft); background: rgba(198, 74, 26, 0.025); } .failcode-card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; } .failcode-cat { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); } .failcode-pick { font-family: var(--font-sans); font-size: 10px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: #fff; background: var(--amber); border-radius: 999px; padding: 2px 8px; } .failcode-hidden-flag { font-family: var(--font-sans); font-size: 10px; font-weight: 700; text-transform: uppercase; color: var(--ink-mute); border: 1px solid var(--border-soft); border-radius: 999px; padding: 2px 8px; } .failcode-card-title { margin: 0 0 8px; font-family: var(--font-serif); font-size: 19px; line-height: 1.3; color: var(--ink); } .failcode-card-lesson { margin: 0 0 12px; font-family: var(--font-serif); font-size: 14.5px; line-height: 1.5; color: var(--ink-soft); } .failcode-lesson-mark { font-family: var(--font-sans); font-size: 10px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--amber); margin-right: 6px; } .failcode-card-by { display: flex; align-items: center; gap: 8px; } .failcode-card-byname { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .failcode-avatar { border-radius: 50%; flex: 0 0 auto; } .failcode-show { max-width: 100%; } .failcode-show-title { margin: 6px 0 14px; font-family: var(--font-serif); font-size: 26px; line-height: 1.2; letter-spacing: -0.018em; color: var(--ink); } .failcode-show-by { display: flex; align-items: center; gap: 10px; margin: 0 0 22px; text-decoration: none; } .failcode-show-byname { font-family: var(--font-sans); font-size: 14px; color: var(--ink); display: flex; flex-direction: column; } .failcode-show-co { font-size: 12.5px; color: var(--ink-mute); } .failcode-block { margin: 0 0 20px; } .failcode-block-label { margin: 0 0 6px; font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--amber); } .failcode-block-body { font-family: var(--font-serif); font-size: 16px; line-height: 1.65; color: var(--ink-soft); } .failcode-block-body p { margin: 0 0 10px; } .failcode-lessons { margin: 0; padding-left: 18px; font-family: var(--font-serif); font-size: 16px; line-height: 1.6; color: var(--ink); } .failcode-lessons li { margin: 0 0 8px; } .failcode-outcome { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); margin: 0 0 20px; } .failcode-take { margin: 4px 0 20px; padding: 16px 18px; background: rgba(198, 74, 26, 0.04); border: 1px solid var(--amber-soft); border-radius: 14px; } .failcode-take-label { margin: 0 0 8px; font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--amber); } .failcode-take-body { font-family: var(--font-serif); font-size: 15px; line-height: 1.6; color: var(--ink-soft); } .failcode-take-body p { margin: 0 0 8px; } .failcode-admin { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--border-soft); display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-start; } .failcode-admin-btn { font-family: var(--font-sans); font-size: 12px; padding: 7px 13px; border: 1px solid var(--border-soft); border-radius: 999px; background: var(--paper); color: var(--ink-soft); cursor: pointer; } .failcode-admin-take { flex: 1 1 100%; display: flex; flex-direction: column; gap: 8px; margin-top: 6px; } .failcode-admin-take textarea { width: 100%; resize: vertical; } .failcode-admin-take .cta-btn { align-self: flex-start; } .failcode-form { display: flex; flex-direction: column; gap: 18px; } .failcode-field { display: block; } .failcode-field-label { display: block; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 6px; } .failcode-field-optional { font-weight: 400; color: var(--ink-fade); } .failcode-field-hint { margin: 0 0 8px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .failcode-lesson-input { margin-bottom: 8px; } .failcode-submit { align-self: flex-start; } .failcode-form-error { font-family: var(--font-sans); font-size: 13px; color: var(--amber); margin: 0 0 14px; } .top-nav-back { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); text-decoration: none; } .failcode-chips { display: flex; flex-wrap: wrap; gap: 8px; } .failcode-chip { position: relative; cursor: pointer; margin: 0; } .failcode-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; } .failcode-chip span { display: inline-flex; align-items: center; padding: 7px 14px; font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); background: var(--bg); border: 1px solid var(--border-soft); border-radius: 999px; transition: color 120ms ease, border-color 120ms ease, background 120ms ease; } .failcode-chip:hover span { border-color: var(--amber); color: var(--amber); } .failcode-chip:has(input:checked) span { color: #fff; background: var(--amber); border-color: var(--amber); } .failcode-chip input:focus-visible + span { outline: 2px solid var(--amber); outline-offset: 2px; } .failcode-prompt { margin: -6px 0 4px; padding: 12px 14px; font-family: var(--font-serif); font-size: 15.5px; line-height: 1.5; color: var(--ink); background: rgba(198, 74, 26, 0.05); border-left: 3px solid var(--amber); border-radius: 0 10px 10px 0; } .failcode-field-eg { margin: 0 0 8px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .failcode-counter { font-family: var(--font-sans); font-size: 11px; font-weight: 500; color: var(--ink-fade); margin-left: 6px; } .failcode-lessons-field { border: 1px solid var(--border-soft); border-radius: 14px; padding: 14px; } .failcode-lesson-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; } .failcode-lesson-row:last-child { margin-bottom: 0; } .failcode-lesson-num { flex: 0 0 auto; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-sans); font-size: 12px; font-weight: 700; color: var(--amber); background: rgba(198, 74, 26, 0.08); border-radius: 50%; } .failcode-lesson-row .text-input { flex: 1 1 auto; } .failcode-preview { margin: 4px 0 6px; } .failcode-preview-label { margin: 0 0 8px; font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); } .failcode-preview-card { cursor: default; } .failcode-preview-card:hover { transform: none; box-shadow: none; } .failcode-submit-btn { align-self: flex-start; margin-top: 4px; padding: 11px 22px; font-family: var(--font-sans); font-size: 15px; font-weight: 600; color: #fff; background: var(--amber); border: none; border-radius: 999px; cursor: pointer; transition: transform 120ms ease, box-shadow 120ms ease; } .failcode-submit-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(198, 74, 26, 0.25); } .failcode-reassure { margin: 8px 0 0; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .failcode-remove-form { margin-top: 24px; } .failcode-remove { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); background: none; border: none; cursor: pointer; text-decoration: underline; padding: 0; } .failcode-remove:hover { color: var(--amber); } .failcode-mode { display: inline-flex; gap: 4px; padding: 3px; margin-bottom: 2px; background: var(--paper-2); border-radius: 999px; } .failcode-mode-btn { font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink-mute); padding: 6px 15px; border: none; background: none; border-radius: 999px; cursor: pointer; transition: color 120ms ease; } .failcode-mode-btn.is-active { color: var(--ink); background: var(--paper); box-shadow: 0 1px 3px rgba(26, 24, 20, 0.08); } [data-mode="quick"] .failcode-detailed-only { display: none; } [data-mode="detailed"] .failcode-quick-only { display: none; } .failcode-grow { overflow: hidden; resize: none; min-height: 96px; } .poster-editor { padding: 22px 16px 48px; } .poster-subject-pick { margin: 14px 0 4px; } .poster-editor-back { display: inline-block; margin-bottom: 12px; font-size: 13px; } .poster-editor-controls { min-width: 0; } .poster-format-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 2px; } .poster-format-actions form { margin: 0; } .poster-mini-btn { border: 1px solid var(--border-soft); background: var(--paper); color: var(--ink-soft); border-radius: 999px; padding: 7px 14px; font-size: 12.5px; font-weight: 600; cursor: pointer; } .poster-mini-btn:hover { border-color: var(--ink-mute); color: var(--ink); } .poster-mini-btn.is-warn { color: #a23b2c; } .poster-mini-btn.is-warn:hover { border-color: #a23b2c; } .poster-set-field.is-disabled { opacity: 0.45; } .poster-set-field.is-disabled .poster-range { pointer-events: none; } @media (min-width: 920px) { .poster-editor { display: grid; grid-template-columns: minmax(340px, 420px) 1fr; gap: 40px; align-items: start; max-width: 1120px; padding: 30px 30px 56px; } .poster-editor-preview { position: sticky; top: 24px; display: flex; justify-content: center; } .poster-editor-preview .share-card-stage { --share-scale: 0.42; max-width: 453px; } } .poster-editor-preview .share-card-stage { width: 100%; max-width: 378px; margin: 0 auto; } .poster-settings-form { margin-top: 16px; } .poster-set-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 2px 0 4px; } .poster-set-editing { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); } .poster-set-status { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-mute); padding: 3px 11px; border-radius: 999px; background: var(--paper-2); white-space: nowrap; } .poster-set-status.is-saving { color: var(--amber); } .poster-set-status.is-saved { color: #2e7d54; } .poster-set-status.is-error { color: var(--amber); } .poster-set-section { margin: 22px 0 8px; font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--amber); } .poster-set-checks { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; } .poster-advanced { margin-top: 24px; border-top: 1px solid var(--border-soft); padding-top: 6px; } .poster-advanced > summary { cursor: pointer; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink-soft); padding: 8px 0; list-style: none; } .poster-advanced > summary::before { content: "+ "; color: var(--ink-mute); } .poster-advanced[open] > summary::before { content: "− "; } .account-section { margin: 0 0 26px; padding: 16px 16px 18px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 16px; } .account-section--danger { border-color: rgba(162, 59, 44, 0.4); } .account-section-title { margin: 0 0 8px; font-family: var(--font-sans); font-size: 15px; font-weight: 700; color: var(--ink); } .account-section-note { margin: 8px 0 0; font-size: 13px; line-height: 1.5; color: var(--ink-soft); } .account-section-note--warn { margin-top: 10px; padding: 10px 12px; background: var(--paper); border: 1px solid var(--border-soft); border-left: 3px solid var(--amber); border-radius: 10px; color: var(--ink); } .account-section-note--warn code { font-size: 12px; color: var(--ink-soft); } .profile-url-field { display: flex; align-items: stretch; margin-top: 12px; border: 1px solid var(--border-soft); border-radius: 12px; overflow: hidden; background: var(--paper); } .profile-url-prefix { display: flex; align-items: center; padding: 0 4px 0 12px; font-size: 12.5px; color: var(--ink-mute); white-space: nowrap; border-right: 1px solid var(--border-soft); } .profile-url-field .text-input { flex: 1; min-width: 0; border: 0; border-radius: 0; background: transparent; } .account-stat-row { display: flex; gap: 10px; margin: 14px 0 4px; } .account-stat { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 10px 4px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 12px; } .account-stat-num { font-size: 20px; font-weight: 700; color: var(--ink); font-family: var(--font-serif); } .account-stat-label { font-size: 11px; color: var(--ink-mute); margin-top: 2px; } .account-links { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 14px; } .account-link { font-size: 13.5px; font-weight: 600; color: var(--amber); text-decoration: none; } .account-link:hover { text-decoration: underline; } .account-link--danger { color: #a23b2c; } .account-prefs { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; } .account-toggle { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; } .account-toggle-box { margin-top: 3px; width: 18px; height: 18px; flex-shrink: 0; accent-color: var(--amber); } .account-toggle-text { display: flex; flex-direction: column; } .account-toggle-name { font-size: 14px; font-weight: 600; color: var(--ink); } .account-toggle-desc { font-size: 12.5px; color: var(--ink-soft); line-height: 1.45; } .account-btn { appearance: none; border: 0; align-self: flex-start; margin-top: 4px; padding: 10px 18px; background: var(--amber); color: var(--paper); font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; border-radius: 999px; cursor: pointer; text-decoration: none; display: inline-block; } .account-btn:hover { filter: brightness(1.06); } .account-btn--ghost { background: var(--paper); color: var(--ink); border: 1px solid var(--border-soft); } .account-btn--danger { background: #a23b2c; } .account-cat-list, .account-mail-list, .account-delete-list { list-style: none; margin: 10px 0 0; padding: 0; } .account-cat { padding: 10px 0; border-bottom: 1px solid var(--border-soft); } .account-cat:last-child { border-bottom: 0; } .account-cat-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; } .account-cat-name { font-size: 13.5px; font-weight: 600; color: var(--ink); } .account-cat-control { font-size: 11px; color: var(--ink-mute); white-space: nowrap; } .account-cat-desc { margin: 3px 0 0; font-size: 12.5px; color: var(--ink-soft); line-height: 1.45; } .account-mail { display: flex; flex-direction: column; padding: 9px 0; border-bottom: 1px solid var(--border-soft); } .account-mail:last-child { border-bottom: 0; } .account-mail-subject { font-size: 13.5px; color: var(--ink); } .account-mail-meta { font-size: 11.5px; color: var(--ink-mute); margin-top: 2px; } .account-delete-list { margin-top: 4px; } .account-delete-list li { font-size: 13px; color: var(--ink-soft); line-height: 1.5; padding: 4px 0 4px 16px; position: relative; } .account-delete-list li::before { content: "·"; position: absolute; left: 4px; color: var(--ink-mute); } .series-toolbar { margin-top: 16px; } .series-filters { display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; } .series-filters::-webkit-scrollbar { display: none; } .series-filters > * { flex: 0 0 auto; } .series-sort { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-top: 12px; } .series-sort-label { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-mute); margin-right: 4px; } .series-sort-opt { font-family: var(--font-sans); font-size: 12.5px; font-weight: 500; color: var(--ink-mute); text-decoration: none; padding: 4px 10px; border-radius: 999px; transition: color 0.15s ease, background 0.15s ease; } .series-sort-opt:hover { color: var(--ink); } .series-sort-opt.is-on { color: var(--ink); background: var(--paper-2); font-weight: 600; } .series-board { list-style: none; display: flex; flex-direction: column; gap: 10px; margin: 18px 0 0; padding: 0; } .series-board-row { padding: 13px 16px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; } .series-board-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; } .series-board-name { font-family: var(--font-serif); font-size: 19px; line-height: 1.3; color: var(--ink); text-decoration: none; } .series-board-name:hover { color: var(--amber); } .series-board-meta { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ink-mute); margin-top: 3px; } .series-board-row .series-actions { margin-top: 7px; } .series-board-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px 14px; flex-wrap: wrap; margin-top: 9px; } .series-board-foot-spacer { flex: 1 1 auto; } .series-board-foot .poll-faces { margin-top: 0; } .series-empty { font-size: 14px; color: var(--ink-mute); margin-top: 20px; } .series-actions { display: flex; flex-wrap: wrap; gap: 2px 8px; margin-left: -9px; } .series-actions form { margin: 0; } .series-btn-toggle { display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink-mute); background: transparent; border: none; padding: 5px 10px; border-radius: 999px; cursor: pointer; transition: color 0.15s ease, background 0.15s ease; } .series-btn-toggle:hover { color: var(--amber); } .series-btn-ico { font-size: 12px; line-height: 1; } .series-btn-count { font-family: var(--font-mono); font-size: 11.5px; opacity: 0.6; } .series-btn-watched.is-on { color: var(--amber); background: rgba(198, 74, 26, 0.1); } .series-btn-want.is-on { color: var(--ink); background: rgba(26, 24, 20, 0.07); } .series-back { margin-bottom: 12px; } .series-back-link { font-size: 13px; font-weight: 600; color: var(--ink-mute); text-decoration: none; } .series-back-link:hover { color: var(--amber); } .series-show-head { margin-bottom: 6px; } .series-show-band { display: flex; align-items: center; margin: 0 0 14px; padding: 7px 13px; border-radius: 9px; background: linear-gradient(135deg, hsl(var(--fmt-hue) 42% 38%), hsl(calc(var(--fmt-hue) + 14) 46% 26%)); } .series-show-band-fmt { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255, 255, 255, 0.93); } .series-watch { margin-top: 18px; padding: 14px 16px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 14px; } .series-watch-label { display: block; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 6px; } .series-watch-text { font-size: 14px; color: var(--ink-soft); margin-bottom: 10px; } .series-watch-links { display: flex; flex-wrap: wrap; gap: 8px; } .series-watch-btn { display: inline-flex; align-items: center; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--amber); background: var(--paper); border: 1px solid var(--amber-soft); border-radius: 999px; padding: 7px 14px; text-decoration: none; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease; } .series-watch-btn:hover { border-color: var(--amber); background: rgba(198, 74, 26, 0.06); } .series-show-title { font-family: var(--font-serif); font-size: 26px; line-height: 1.25; color: var(--ink); } .series-show-tagline { font-size: 14.5px; color: var(--ink-soft); line-height: 1.5; margin-top: 4px; } .series-show-facts { font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); margin-top: 8px; } .series-show-genres { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; } .series-genre-chip { font-size: 11.5px; font-weight: 500; color: var(--ink-soft); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 3px 10px; } .reading-list { display: flex; flex-direction: column; gap: 12px; margin: 18px 0 0; } .reading-row { background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; overflow: hidden; } .reading-band { display: flex; align-items: center; padding: 6px 14px; min-height: 10px; background: linear-gradient(135deg, hsl(var(--fmt-hue) 42% 38%), hsl(calc(var(--fmt-hue) + 14) 46% 26%)); } .reading-band-cat { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255, 255, 255, 0.93); } .reading-row-body { padding: 14px 16px; } .reading-title { font-family: var(--font-serif); font-size: 19px; line-height: 1.3; color: var(--ink); margin: 0; } .reading-title-link { color: inherit; text-decoration: none; } .reading-title-link:hover { color: var(--amber); } .reading-byline { font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); margin-top: 6px; } .reading-tagline { font-size: 14.5px; color: var(--ink-soft); line-height: 1.5; margin-top: 8px; } .reading-why { font-size: 14px; color: var(--ink-soft); line-height: 1.55; margin-top: 10px; } .reading-why-label { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); margin-right: 4px; } .reading-themes { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; } .reading-row-foot { display: flex; align-items: center; gap: 10px; margin-top: 14px; flex-wrap: wrap; } .reading-save.is-on, .reading-recommend.is-on { color: var(--amber); border-color: var(--amber-soft); background: rgba(198, 74, 26, 0.06); } .reading-recommend.is-static { cursor: default; } .book-board-row { display: flex; align-items: flex-start; gap: 14px; } .book-board-row .series-board-main { flex: 1; min-width: 0; } .book-board-cover-link { flex-shrink: 0; line-height: 0; } .book-board-cover { width: 56px; height: 84px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border-soft); } .book-cover-hero { display: block; max-width: 180px; width: 40%; height: auto; margin: 0 0 16px; border-radius: 10px; border: 1px solid var(--border-soft); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08); } .book-show-subtitle { font-family: var(--font-serif); font-size: 16px; color: var(--ink); margin: 2px 0 4px; line-height: 1.4; } .book-show-author { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); margin: 4px 0 0; } .book-narrative { font-family: var(--font-serif); font-size: 15px; line-height: 1.65; color: var(--ink); margin: 14px 0 0; } .book-narrative p { margin: 0 0 10px; } .book-narrative p:last-child { margin-bottom: 0; } .book-board-author { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); margin: 2px 0 0; } .book-board-oneliner { font-family: var(--font-sans); font-size: 14px; line-height: 1.4; color: var(--ink); margin: 4px 0 0; } .book-board-brief { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; color: var(--ink-mute); margin: 4px 0 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .series-board-reccount { display: inline-flex; align-items: center; gap: 8px; } .series-board-reccount .poll-faces { margin: 0; } .series-board-reccount-label { font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); } .episode-board-row { display: flex; align-items: flex-start; gap: 16px; transition: box-shadow 0.15s ease, border-color 0.15s ease; } .episode-board-row:hover { border-color: var(--border); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06); } .episode-board-row .series-board-main { flex: 1; min-width: 0; display: flex; flex-direction: column; } .episode-board-thumb { position: relative; flex: 0 0 clamp(150px, 34%, 248px); align-self: flex-start; } .episode-thumb-link { display: block; position: relative; line-height: 0; } .episode-thumb-img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; border: 1px solid var(--border-soft); background: var(--paper-2); transition: filter 0.15s ease; } .episode-thumb-blank { display: block; } .episode-thumb-link:hover .episode-thumb-img { filter: brightness(0.94); } .episode-thumb-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; } .episode-thumb-play svg { filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.35)); transform: scale(0.92); transition: transform 0.15s ease; } .episode-thumb-link:hover .episode-thumb-play svg { transform: scale(1.08); } .episode-thumb-dur { position: absolute; right: 6px; bottom: 6px; font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: #fff; background: rgba(0, 0, 0, 0.8); border-radius: 5px; padding: 1px 6px; line-height: 1.5; } .episode-board-row.is-playing { flex-direction: column; align-items: stretch; } .episode-player { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #000; } .episode-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } .episode-board-row.is-playing .series-board-main { flex: none; width: 100%; } .episode-related:empty { display: none; } .episode-board-row.is-playing .episode-related { width: 100%; margin-top: 4px; } .episode-related .episode-rail { margin-bottom: 4px; } .episode-related .episode-rail-title { font-size: 16px; } .episode-card-title { margin: 1px 0 0; } .episode-card-title a { font-family: var(--font-serif); font-size: 16.5px; line-height: 1.3; color: var(--ink); text-decoration: none; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .episode-card-title a:hover { color: var(--amber); } .episode-byline { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); margin: 4px 0 0; } .episode-channel-link { color: var(--ink-soft); text-decoration: none; font-weight: 600; } .episode-channel-link:hover { color: var(--amber); } .episode-dot { margin: 0 5px; opacity: 0.55; } .episode-blurb { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; color: var(--ink-mute); margin: 5px 0 0; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; } .episode-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 9px; } .episode-tag { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.02em; color: var(--amber); background: rgba(198, 74, 26, 0.07); border-radius: 5px; padding: 2px 8px; text-decoration: none; } .episode-tag:hover { background: rgba(198, 74, 26, 0.14); } .episode-card-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--border-soft); } .episode-signal { margin: 0; gap: 8px; } .episode-signal .series-btn-toggle { border: 1px solid var(--border-soft); border-radius: 999px; padding: 5px 13px; background: var(--paper); } .episode-signal .series-btn-toggle:hover { border-color: var(--amber-soft); background: rgba(198, 74, 26, 0.05); } .episode-signal .series-btn-watched.is-on { color: var(--amber); border-color: var(--amber); background: rgba(198, 74, 26, 0.1); } .episode-signal .series-btn-want.is-on { color: var(--ink); border-color: var(--ink-soft); background: rgba(26, 24, 20, 0.06); } .episode-card-actions-right { display: inline-flex; align-items: center; gap: 12px; } .episode-external { font-size: 12px; font-weight: 600; color: var(--ink-mute); text-decoration: none; white-space: nowrap; } .episode-external:hover { color: var(--amber); } .episode-hide { margin: 0; display: inline-flex; } .episode-hide button { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-mute); background: none; border: none; padding: 0; cursor: pointer; transition: color 0.12s ease; } .episode-hide button:hover { color: #b42318; } .episode-leaderboard-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 2px 0 12px; } .episode-leaderboard-title { font-family: var(--font-serif); font-size: 20px; color: var(--ink); } .episode-seeall { font-size: 13px; font-weight: 600; color: var(--amber); text-decoration: none; white-space: nowrap; } .episode-seeall:hover { text-decoration: underline; } .episode-rank-badge { position: absolute; top: 6px; left: 6px; min-width: 22px; height: 22px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 12px; font-weight: 700; color: #fff; background: rgba(0, 0, 0, 0.78); border-radius: 6px; line-height: 1; } .episode-featured .episode-rank-badge { min-width: 26px; height: 26px; font-size: 14px; top: 10px; left: 10px; } .episode-compact .episode-blurb, .episode-compact .episode-tag, .episode-compact .episode-external { display: none; } .episode-compact .episode-card-meta { margin-top: 6px; } .episode-compact .episode-card-actions { margin-top: 9px; padding-top: 9px; } .episode-leaderboard { display: flex; flex-direction: column; gap: 16px; } .episode-featured.episode-compact { gap: 11px; } .episode-featured.episode-compact .episode-card-title a { font-size: 18px; line-height: 1.3; -webkit-line-clamp: 2; } @media (max-width: 560px) { .episode-board-row { flex-direction: column; align-items: stretch; gap: 11px; } .episode-board-thumb { width: 100%; flex: none; } .episode-card-title a { font-size: 16px; } .episode-featured .episode-card-title a { font-size: 19px; } .episode-card-actions { flex-wrap: wrap; gap: 8px; } .episode-leaderboard-title { font-size: 18px; } .episode-facet-strip { padding-bottom: 8px; } } .episode-channel-link { color: var(--ink-soft); text-decoration: none; font-weight: 600; } .episode-channel-link:hover { color: var(--amber); } .episode-sort { margin: 6px 0 12px; } .episode-chip-channels { font-weight: 700; } .episode-listing-head { font-size: 13px; color: var(--ink-mute); margin: 0 0 10px; } .episode-listing-head strong { color: var(--ink); } .episode-listing-head a { color: var(--amber); text-decoration: none; } .channel-list { list-style: none; margin: 6px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; } .channel-item { position: relative; display: flex; align-items: stretch; gap: 6px; } .channel-link { flex: 1 1 auto; min-width: 0; display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 11px 14px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 12px; text-decoration: none; transition: border-color 0.12s ease; } .channel-link:hover { border-color: var(--amber-soft); } .channel-name { font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: var(--ink); } .channel-count { font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); white-space: nowrap; } .channel-delete { display: flex; } .channel-delete button { height: 100%; padding: 0 12px; cursor: pointer; font-size: 13px; font-weight: 700; color: var(--ink-mute); background: var(--paper); border: 1px solid var(--border-soft); border-radius: 12px; transition: color 0.12s ease, border-color 0.12s ease; } .channel-delete button:hover { color: #b42318; border-color: #f0a39a; } .episode-lede { margin-bottom: 14px; } .episode-facet { margin-bottom: 12px; } .episode-facet-strip { padding-bottom: 9px; border-bottom: 1px solid var(--border-soft); } .episode-facet-strip .series-chip { padding-top: 5px; padding-bottom: 5px; } .episode-sort { margin: 10px 0 14px; } .episode-featured { flex-direction: column; align-items: stretch; gap: 13px; } .episode-featured .episode-board-thumb { flex: none; width: 100%; } .episode-featured .episode-card-title a { font-size: 22px; line-height: 1.25; -webkit-line-clamp: 3; } .episode-featured .episode-blurb { font-size: 13.5px; -webkit-line-clamp: 2; } .episode-eyebrow { font-family: var(--font-sans); font-size: 10.5px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--amber); margin: 0 0 3px; } .episode-related[busy], .episode-related[aria-busy="true"] { display: block; } .episode-related[busy]::after, .episode-related[aria-busy="true"]::after { content: "Loading more like this…"; display: block; padding: 12px 0 2px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .episode-thumb-link:focus-visible, .episode-card-title a:focus-visible, .episode-channel-link:focus-visible, .episode-tag:focus-visible, .episode-facet-strip .series-chip:focus-visible, .episode-signal .series-btn-toggle:focus-visible, .channel-link:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; border-radius: 6px; } .episode-rail { margin: 0 0 26px; } .episode-rail-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 10px; } .episode-rail-title { font-family: var(--font-serif); font-size: 19px; line-height: 1.2; color: var(--ink); } .episode-rail-all { font-size: 12.5px; font-weight: 600; color: var(--amber); text-decoration: none; white-space: nowrap; } .episode-rail-all:hover { text-decoration: underline; } .episode-rail-strip { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; scrollbar-width: thin; } .episode-rail-card { flex: 0 0 232px; width: 232px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 6px; text-decoration: none; } .episode-rail-thumb { position: relative; display: block; line-height: 0; } .episode-rail-thumb-img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; border: 1px solid var(--border-soft); transition: border-color 0.12s ease; } .episode-rail-card:hover .episode-rail-thumb-img { border-color: var(--amber-soft); } .episode-rail-card.is-playing .episode-rail-thumb-img { border-color: var(--amber); } .episode-rail-thumb .episode-thumb-play { transition: opacity 0.12s ease; } .episode-rail-indian { position: absolute; top: 6px; left: 6px; font-family: var(--font-sans); font-size: 9.5px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: #fff; background: var(--amber); border-radius: 999px; padding: 2px 7px; line-height: 1.4; } .episode-rail-card-title { font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; line-height: 1.35; color: var(--ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .episode-rail-card-show { font-size: 12px; color: var(--ink-mute); } .episode-rail-rec { display: inline-flex; align-items: center; gap: 6px; margin-top: 1px; } .episode-rail-rec .poll-faces { margin: 0; } .episode-rail-rec-label { font-size: 11px; color: var(--ink-mute); } .episode-rail-player { margin-top: 14px; } .episode-rail-frame { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #000; } .episode-rail-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } .episode-rail-nowplaying { font-family: var(--font-sans); font-size: 13.5px; font-weight: 600; color: var(--ink); margin: 8px 0 0; } .episode-search { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 14px; } .episode-search-input { flex: 1 1 200px; min-width: 0; font-family: var(--font-sans); font-size: 14px; color: var(--ink); background: var(--paper); border: 1px solid var(--border-soft); border-radius: 999px; padding: 9px 16px; } .episode-search-input:focus { outline: none; border-color: var(--amber); } .episode-search-btn { font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: #fff; background: var(--amber); border: none; border-radius: 999px; padding: 9px 16px; cursor: pointer; } .episode-search-clear { font-size: 13px; font-weight: 600; color: var(--ink-mute); text-decoration: none; } .episode-search-clear:hover { color: var(--amber); } .episode-more { display: flex; align-items: center; gap: 12px; margin-top: 16px; } .episode-more-count { font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); } .episode-facet-strip { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch; padding-bottom: 3px; scroll-snap-type: x proximity; } .episode-facet-strip > * { flex: 0 0 auto; white-space: nowrap; scroll-snap-align: start; } .episode-active { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 4px 0 12px; } .episode-active-count { font-family: var(--font-sans); font-size: 13px; font-weight: 700; color: var(--ink); } .episode-active-pill { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--amber); background: rgba(198, 74, 26, 0.08); border: 1px solid var(--amber-soft); border-radius: 999px; padding: 4px 11px; text-decoration: none; max-width: 100%; } .episode-active-pill:hover { background: rgba(198, 74, 26, 0.14); } .episode-active-x { font-size: 11px; opacity: 0.7; } .episode-active-clear { font-size: 12.5px; font-weight: 600; color: var(--ink-mute); text-decoration: none; } .episode-active-clear:hover { color: var(--amber); } .book-facet { margin: 0 0 10px; } .book-facet-label { display: block; font-family: var(--font-sans); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-mute); margin: 0 0 6px; } .book-facet-chips { display: flex; flex-wrap: wrap; gap: 6px; } .book-facet .series-chip:not(.is-active) { color: var(--ink-mute); font-weight: 500; background: var(--paper-2); border-color: var(--border-soft); } .book-facet .series-chip:not(.is-active):hover { color: var(--ink); border-color: var(--border); } .book-facet-summary { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); margin: 2px 0 12px; } .path-strip { margin: 0 0 16px; } .path-cards { display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; } .path-cards::-webkit-scrollbar { display: none; } .path-card { flex: 0 0 auto; width: 220px; display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-radius: 14px; text-decoration: none; background: var(--paper); border: 1px solid var(--border-soft); transition: transform 120ms ease, box-shadow 120ms ease; } .path-card:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06); } .path-card-title { font-family: var(--font-serif); font-size: 15px; color: var(--ink); line-height: 1.3; } .path-card-intro { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); line-height: 1.45; } .path-card-count { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--amber); margin-top: 2px; } .path-show-head { margin: 0 0 16px; } .path-eyebrow { display: inline-block; font-family: var(--font-sans); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--amber); margin-bottom: 4px; } .path-intro { font-family: var(--font-serif); font-size: 15px; line-height: 1.6; color: var(--ink); margin: 6px 0 0; } .path-intro p { margin: 0 0 8px; } .path-count { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); margin: 8px 0 0; } .path-foot { margin-top: 16px; } .series-show-synopsis { font-size: 15px; color: var(--ink-soft); line-height: 1.6; margin-top: 18px; } .series-show-synopsis p { margin-bottom: 10px; } .series-show-credits { margin-top: 16px; display: flex; flex-direction: column; gap: 8px; } .series-credit { display: flex; gap: 8px; font-size: 13.5px; } .series-credit dt { font-weight: 600; color: var(--ink-mute); flex: 0 0 auto; } .series-credit dd { color: var(--ink-soft); } .series-show-external { margin-top: 14px; } .series-external-link { font-size: 13.5px; font-weight: 600; color: var(--amber); text-decoration: none; } .series-external-link:hover { text-decoration: underline; } .series-signal-panel { margin-top: 24px; padding: 18px 18px 20px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 18px; } .series-signal-state { font-size: 13px; font-weight: 600; color: var(--amber); margin-bottom: 10px; } .series-form-label { display: block; font-size: 13px; font-weight: 600; color: var(--ink-soft); margin-bottom: 6px; } .series-form-textarea { width: 100%; box-sizing: border-box; font-family: var(--font-sans); font-size: 14.5px; color: var(--ink); line-height: 1.5; background: var(--paper); border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; resize: vertical; } .series-form-textarea:focus { outline: none; border-color: var(--amber); } .series-form-vis { display: flex; align-items: baseline; gap: 6px; font-size: 12px; color: var(--ink-mute); margin: 8px 0 0; line-height: 1.4; } .series-form-vis-tag { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.05em; text-transform: uppercase; font-weight: 600; color: var(--ink-soft); } .series-btn { display: inline-block; font-family: var(--font-sans); font-size: 14px; font-weight: 600; border-radius: 999px; padding: 9px 18px; cursor: pointer; border: 1px solid transparent; text-decoration: none; transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease; } .series-btn-primary { background: var(--amber); color: #fff; margin-top: 10px; } .series-btn-primary:hover { background: #a93d14; } .series-btn-ghost { background: var(--paper); color: var(--ink); border-color: var(--border); } .series-btn-ghost:hover { border-color: var(--amber); color: var(--amber); } .series-btn-quiet { background: transparent; color: var(--ink-mute); } .series-btn-quiet:hover { color: var(--amber); } .series-signin-note { font-size: 13.5px; color: var(--ink-mute); } .series-signin-note a { color: var(--amber); font-weight: 600; text-decoration: none; } .series-signin-note a:hover { text-decoration: underline; } .series-section { margin-top: 28px; } .series-section-title { font-family: var(--font-serif); font-size: 18px; color: var(--ink); margin-bottom: 12px; } .series-section-count { font-family: var(--font-mono); font-size: 13px; color: var(--ink-mute); } .series-reviews { display: flex; flex-direction: column; gap: 14px; } .series-review { background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; padding: 14px 16px; } .series-review-who { display: flex; align-items: center; gap: 8px; text-decoration: none; margin-bottom: 8px; } .series-review-avatar { width: 36px; height: 36px; border-radius: 999px; object-fit: cover; } .series-review-name { font-size: 14px; font-weight: 600; color: var(--ink); } .series-review-body { font-size: 14.5px; color: var(--ink-soft); line-height: 1.55; } .series-faces { display: flex; flex-wrap: wrap; align-items: center; gap: 0; } .series-face { display: inline-flex; margin-right: -8px; text-decoration: none; transition: transform 0.12s ease; } .series-face:hover { transform: translateY(-2px); z-index: 2; } .series-face-avatar { width: 40px; height: 40px; border-radius: 999px; border: 2px solid var(--paper); object-fit: cover; display: block; } .series-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; margin-bottom: 4px; } .series-chip { display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-soft); text-decoration: none; background: var(--paper); border: 1px solid var(--border); border-radius: 999px; padding: 5px 12px; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .series-chip:hover { border-color: var(--amber); color: var(--amber); } .series-chip.is-active { background: var(--amber); border-color: var(--amber); color: #fff; } .series-chip-count { font-family: var(--font-mono); font-size: 11px; opacity: 0.7; } .series-signal-panel .series-actions { margin: 10px 0 14px; } .series-comment-form { margin-top: 2px; } .series-why { margin-top: 18px; padding: 14px 16px; background: linear-gradient(0deg, rgba(198,74,26,0.05), rgba(198,74,26,0.05)), var(--paper); border: 1px solid var(--amber-soft); border-left: 3px solid var(--amber); border-radius: 12px; } .series-why-label { display: block; font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--amber); margin-bottom: 4px; } .series-why-body { font-size: 14.5px; color: var(--ink-soft); line-height: 1.55; } .series-show-external { display: flex; flex-wrap: wrap; gap: 16px; } .series-form-input { width: 100%; box-sizing: border-box; font-family: var(--font-sans); font-size: 15px; color: var(--ink); background: var(--surface, #fff); border: 1px solid var(--hairline, #e3ddd1); border-radius: 10px; padding: 10px 12px; margin-bottom: 4px; } .series-form-input:focus { outline: none; border-color: var(--amber); } .video-company { font-weight: 600; color: var(--ink-soft); } .video-why { font-style: italic; color: var(--ink-soft); display: block; -webkit-line-clamp: none; overflow: visible; } .video-maker { font-size: 12px; color: var(--ink-mute); } .video-admin-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--rule); } .video-admin-bar form { margin: 0; } .video-admin-tag { font-family: var(--font-sans); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-mute); } .video-admin-btn { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-soft); cursor: pointer; line-height: 1.4; padding: 4px 10px; border-radius: 999px; text-decoration: none; border: 1px solid var(--rule); background: transparent; transition: border-color .15s, color .15s, background .15s; } .video-admin-btn:hover { border-color: var(--accent); color: var(--accent); } .video-admin-btn-danger { color: #e0736a; border-color: rgba(224, 115, 106, 0.4); } .video-admin-btn-danger:hover { background: rgba(224, 115, 106, 0.12); border-color: #e0736a; } .video-x-card { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 6px; width: 100%; aspect-ratio: 16 / 9; box-sizing: border-box; padding: 16px; text-decoration: none; border-radius: 12px; background: linear-gradient(135deg, #15202b, #1c2732); color: #fff; } .video-x-card-company { font-family: var(--font-serif); font-size: 17px; line-height: 1.25; } .video-x-card-cta { font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: #8ec7ff; } .video-player-wrap { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000; margin: 6px 0 16px; } .video-player-facade { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; cursor: pointer; background: #000; display: block; } .video-player-thumb { width: 100%; height: 100%; object-fit: cover; display: block; } .video-player-facade .episode-thumb-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .video-x-native { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 20px; border-radius: 14px; margin: 6px 0 16px; background: linear-gradient(135deg, #15202b, #1c2732); color: #fff; } .video-x-native-company { font-family: var(--font-serif); font-size: 20px; margin: 0; } .video-ig-facade { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; width: 100%; aspect-ratio: 4 / 5; padding: 0; border: 0; cursor: pointer; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #feda75 0%, #fa7e1e 25%, #d62976 50%, #962fbf 75%, #4f5bd5 100%); } .video-ig-facade .episode-thumb-play { position: static; transform: none; } .video-ig-glyph { font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; opacity: 0.95; } .video-ig-player { width: 100%; max-width: 400px; margin-inline: auto; } .video-ig-player iframe { width: 100%; height: min(80vh, 620px); border: 0; display: block; background: #fff; border-radius: 12px; } .video-ig-wrap { aspect-ratio: auto; background: transparent; overflow: visible; max-width: 400px; margin: 6px 0 16px; } .video-board-row.is-playing .episode-board-thumb { flex: none; width: 100%; } .video-show-cat { margin: 0 0 6px; } .video-show-metrics { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); margin-top: 2px; } .video-recommend-hint { font-size: 12.5px; color: var(--ink-mute); margin-top: 8px; } .video-suggest-cta { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); text-align: center; margin: 20px 0 0; } .video-suggest-link { color: var(--amber); font-weight: 600; } body.dkr .video-board-row .episode-rank-badge { display: none; } body.dkr .video-why { color: var(--dkr-soft, #cbb8d6); } body.dkr .video-board-row .episode-byline { color: var(--dkr-muted); } .video-source-link { color: var(--ink-mute); text-decoration: none; } .video-source-link:hover { color: var(--amber); text-decoration: underline; } .video-show-source { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); margin-top: 4px; } .video-board-row.is-loading .episode-thumb-img, .video-player-wrap.is-loading .video-player-thumb { opacity: 0.6; transition: opacity 0.15s; } .video-board-row.is-loading .episode-thumb-play, .video-player-wrap.is-loading .episode-thumb-play { animation: video-pulse 0.9s ease-in-out infinite; } @keyframes video-pulse { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } } .video-section { margin-top: 24px; } .video-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--hairline, #e3ddd1); padding-bottom: 6px; } .video-section-title { font-family: var(--font-serif); font-size: 20px; line-height: 1.2; margin: 0; display: inline-flex; align-items: baseline; gap: 8px; } .video-section-link { color: var(--ink); text-decoration: none; } .video-section-link:hover { color: var(--amber); } .video-section-count { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-mute); font-variant-numeric: tabular-nums; } .video-section-all { font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--amber); text-decoration: none; white-space: nowrap; flex: none; } .video-section-all:hover { text-decoration: underline; } .video-subfilter { display: flex; flex-wrap: nowrap; gap: 6px; margin: 8px 0 2px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 2px; } .video-subfilter::-webkit-scrollbar { display: none; } .video-subfilter-bar { flex-wrap: wrap; overflow: visible; align-items: center; margin: 12px 0 4px; } .video-subfilter-label { font-family: var(--font-sans); font-size: 11px; font-weight: 600; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ink-mute); margin-right: 2px; flex: none; } .video-subchip { flex: none; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); background: transparent; border: 1px solid var(--hairline, #e3ddd1); border-radius: 999px; padding: 3px 10px; text-decoration: none; white-space: nowrap; } .video-subchip:hover { border-color: var(--amber); color: var(--ink); } .video-subchip.is-active { background: var(--amber); border-color: var(--amber); color: #fff; } .video-subchip-count { font-variant-numeric: tabular-nums; opacity: 0.7; margin-left: 2px; } .video-board-compact { gap: 6px; margin-top: 12px; } .video-board-compact .episode-board-thumb { flex: 0 0 clamp(120px, 26%, 176px); } body.dkr .shelf-screen .series-board.video-board-compact > li { padding: 13px 4px 13px 32px; } body.dkr .shelf-screen .series-board.video-board-compact > li::before { top: 14px; width: 24px; font-size: 11px; } body.dkr .video-section-head { border-bottom-color: var(--dkr-line); } body.dkr .video-section-link { color: var(--dkr-paper); } body.dkr .video-section-count, body.dkr .video-subfilter-label { color: var(--dkr-faint); } body.dkr .video-subchip { border-color: var(--dkr-line); color: var(--dkr-muted); } body.dkr .video-subchip:hover { border-color: var(--amber); color: var(--dkr-paper); } body.dkr .video-subchip.is-active { background: var(--amber); border-color: var(--amber); color: #1a1114; } .howiai-compose { margin-top: 18px; padding: 16px 16px 18px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 18px; } .howiai-compose-title { font-family: var(--font-serif); font-size: 17px; color: var(--ink); margin-bottom: 12px; } .howiai-field { display: block; margin-bottom: 12px; } .howiai-field-label { display: block; font-size: 13px; font-weight: 600; color: var(--ink-soft); margin-bottom: 8px; } .howiai-textarea { width: 100%; box-sizing: border-box; font-family: var(--font-sans); font-size: 14.5px; color: var(--ink); line-height: 1.5; background: var(--paper); border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; resize: vertical; } .howiai-textarea:focus { outline: none; border-color: var(--amber); } .howiai-step { margin-bottom: 20px; } .howiai-step:last-of-type { margin-bottom: 14px; } .howiai-step-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border-soft); } .howiai-step-num { font-family: var(--font-serif); font-size: 15px; font-weight: 600; color: var(--amber); } .howiai-step-label { font-family: var(--font-serif); font-size: 15.5px; color: var(--ink); } .howiai-step-opt { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-mute); margin-left: 4px; } .howiai-locked-note { font-size: 13.5px; color: var(--ink-soft); } .howiai-showall { display: inline-block; margin-top: 10px; font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--ink-mute); background: transparent; border: none; cursor: pointer; padding: 0; transition: color 0.15s ease; } .howiai-showall:hover { color: var(--amber); } .howiai-more { margin-top: 14px; } .howiai-more[hidden] { display: none; } .howiai-pick { margin-bottom: 16px; } .howiai-pick-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; } .howiai-pick-head .howiai-field-label { margin-bottom: 0; } .howiai-cat { margin-bottom: 12px; } .howiai-cat[hidden] { display: none; } .howiai-cat-label { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 6px; } .howiai-chips { display: flex; flex-wrap: wrap; gap: 7px; } .howiai-chip { display: inline-flex; align-items: center; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-soft); background: var(--paper); border: 1px solid var(--border); border-radius: 999px; padding: 7px 13px; cursor: pointer; user-select: none; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; } .howiai-chip[hidden] { display: none; } .howiai-chip input { position: absolute; opacity: 0; width: 0; height: 0; } .howiai-chip:hover { border-color: var(--amber); color: var(--amber); } .howiai-chip:has(input:checked) { background: var(--amber); border-color: var(--amber); color: #fff; } .howiai-chip:has(input:focus-visible) { box-shadow: 0 0 0 2px var(--amber-soft); } .howiai-chip-custom:has(input:checked) { background: var(--ink); border-color: var(--ink); } .howiai-write { margin-top: 9px; } .howiai-write .chip-write-input { font-family: var(--font-sans); font-size: 13px; color: var(--ink); background: var(--paper); border: 1px dashed var(--border); border-radius: 999px; padding: 7px 13px; min-width: 220px; max-width: 100%; } .howiai-write .chip-write-input:focus { outline: none; border-color: var(--amber); border-style: solid; } .howiai-rec { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13.5px; color: var(--ink-soft); margin: 11px 0 0; } .howiai-rec input { accent-color: var(--amber); width: 16px; height: 16px; } .howiai-compose-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; } .howiai-count { font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); } .howiai-compose-foot .series-btn-primary { margin-top: 0; } .howiai-compose-foot .series-btn-primary:disabled { opacity: 0.45; cursor: not-allowed; } .howiai-filters { margin-top: 14px; } .howiai-views { margin-top: 18px; } .howiai-view-input { position: absolute; opacity: 0; width: 0; height: 0; } .howiai-view-tabs { display: flex; gap: 20px; margin-bottom: 16px; border-bottom: 1px solid var(--border-soft); } .howiai-view-tab { padding: 0 1px 9px; margin-bottom: -1px; cursor: pointer; font-family: var(--font-serif); font-size: 15.5px; color: var(--ink-mute); border-bottom: 2px solid transparent; transition: color 0.15s ease, border-color 0.15s ease; } .howiai-view-tab:hover { color: var(--ink); } .howiai-view-input-rec:checked ~ .howiai-view-tabs .howiai-view-tab-rec, .howiai-view-input-feed:checked ~ .howiai-view-tabs .howiai-view-tab-feed { color: var(--ink); border-bottom-color: var(--amber); } .howiai-view-panel { display: none; } .howiai-view-input-rec:checked ~ .howiai-view-panel-rec, .howiai-view-input-feed:checked ~ .howiai-view-panel-feed { display: block; } .howiai-view-panel .series-board { margin-top: 0; } .howiai-rank-for { font-size: 13px; color: var(--ink-soft); line-height: 1.5; margin-top: 5px; } .howiai-share { margin-top: 0; } .howiai-share-foot { margin-top: 26px; } .howiai-share-summary { display: inline-flex; align-items: center; cursor: pointer; list-style: none; font-family: var(--font-sans); font-size: 14px; font-weight: 600; color: var(--amber); background: var(--paper); border: 1px solid var(--amber-soft); border-radius: 999px; padding: 9px 18px; transition: background 0.15s ease, border-color 0.15s ease; } .howiai-share-summary::-webkit-details-marker { display: none; } .howiai-share-summary:hover { background: rgba(198, 74, 26, 0.06); border-color: var(--amber); } .howiai-share[open] > .howiai-share-summary { margin-bottom: 12px; } .howiai-share-body .howiai-compose { margin-top: 0; } .howiai-share-signin { margin-top: 0; } .howiai-faq-item { border-bottom: 1px solid var(--hairline, rgba(26, 24, 20, 0.1)); padding: 12px 0; } .howiai-faq-item:first-of-type { border-top: 1px solid var(--hairline, rgba(26, 24, 20, 0.1)); } .howiai-faq-q { font-family: var(--font-sans); font-size: 15px; font-weight: 600; color: var(--ink); cursor: pointer; list-style: none; } .howiai-faq-q::-webkit-details-marker { display: none; } .howiai-faq-q::before { content: "+ "; color: var(--amber); font-family: var(--font-mono); } .howiai-faq-item[open] .howiai-faq-q::before { content: "– "; } .howiai-faq-a { margin-top: 8px; color: var(--ink-mute); font-size: 14px; line-height: 1.6; } .howiai-tool-answer { margin-top: 12px; color: var(--ink); font-size: 15px; line-height: 1.55; } .howiai-rec-badge { font-size: 11.5px; font-weight: 600; color: var(--amber); background: rgba(198, 74, 26, 0.1); border-radius: 999px; padding: 2px 8px; white-space: nowrap; } .howiai-usage-actions { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 2px; } .howiai-usage-rec { font-size: 15px; line-height: 1; color: var(--ink-mute); background: transparent; border: none; cursor: pointer; padding: 2px 4px; } .howiai-usage-rec:hover, .howiai-usage-rec.is-on { color: var(--amber); } .howiai-usages { list-style: none; display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; } .howiai-usage { display: flex; align-items: flex-start; gap: 11px; padding: 13px 14px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; } .howiai-usage-face { flex: 0 0 auto; display: inline-flex; text-decoration: none; } .howiai-usage-avatar { width: 40px; height: 40px; border-radius: 999px; object-fit: cover; display: block; } .howiai-usage-body { flex: 1 1 auto; min-width: 0; } .howiai-usage-head { font-size: 14.5px; color: var(--ink-soft); line-height: 1.5; } .howiai-usage-name { font-weight: 600; color: var(--ink); text-decoration: none; } .howiai-usage-name:hover { color: var(--amber); } .howiai-usage-tool { font-weight: 600; color: var(--amber); text-decoration: none; } .howiai-usage-tool:hover { text-decoration: underline; } .howiai-usage-for { color: var(--ink-mute); } .howiai-usage-note { font-size: 14px; color: var(--ink-soft); line-height: 1.55; margin-top: 5px; } .howiai-usage-remove { flex: 0 0 auto; font-size: 17px; line-height: 1; color: var(--ink-mute); background: transparent; border: none; cursor: pointer; padding: 2px 4px; } .howiai-usage-remove:hover { color: var(--amber); } .howiai-usage form { margin: 0; } .tcls { color: inherit; } .cg-hero { margin-bottom: 12px; } .cg-hero .screen-subtitle { margin-bottom: 0; } .cg-eyebrow { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); margin: 0 0 8px; } .cg-eyebrow-link { color: var(--amber); text-decoration: none; } .cg-eyebrow-link:hover { text-decoration: underline; } .cg-story { max-width: var(--reading-max); margin: 0 0 12px; } .cg-story p { font-family: var(--font-serif); font-size: 16px; line-height: 1.6; color: var(--ink-soft); margin: 0 0 12px; } .cg-section { margin: 24px 0; } .cg-nav + .cg-section { margin-top: 8px; } .cg-section-title { font-family: var(--font-serif); font-size: 21px; font-weight: 600; line-height: 1.25; color: var(--ink); margin: 0 0 6px; letter-spacing: -0.01em; } .cg-section-intro { font-size: 14px; line-height: 1.5; color: var(--ink-mute); margin: 0 0 16px; max-width: var(--reading-max); } .cg-events { display: flex; flex-direction: column; gap: 10px; } .cg-more { display: inline-block; margin-top: 12px; font-size: 13px; font-weight: 500; color: var(--amber); text-decoration: none; } .cg-more:hover { text-decoration: underline; } .cg-filters { margin-bottom: 14px; flex-wrap: wrap; gap: 7px; } .cg-vchips { display: flex; flex-wrap: wrap; gap: 7px; } .cg-kind-head { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-dim); margin: 24px 0 6px; } .cg-kind-count { color: var(--ink-fade); } .cg-list { display: flex; flex-direction: column; } .cg-row { padding: 13px 0; border-bottom: 1px solid var(--border-soft); } .cg-row:last-child { border-bottom: none; } .cg-row-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; } .cg-row-name { font-size: 15px; font-weight: 600; color: var(--ink); } .cg-row-name a { color: inherit; text-decoration: none; } .cg-row-name a:hover { color: var(--amber); } .cg-row-where { flex: 0 0 auto; font-size: 11px; color: var(--ink-dim); } .cg-row-by { font-size: 12px; color: var(--ink-mute); margin: 3px 0 0; } .cg-row-meta { font-family: var(--font-mono); font-size: 11px; color: var(--ink-dim); margin: 3px 0 0; } .cg-row-desc { font-size: 13px; line-height: 1.55; color: var(--ink-soft); margin: 5px 0 0; max-width: var(--reading-max); } .cg-row-links { display: flex; gap: 14px; margin: 7px 0 0; } .cg-row-link { font-family: var(--font-sans); font-size: 12px; font-weight: 600; color: var(--amber); text-decoration: none; } .cg-row-link:hover { text-decoration: underline; } .cg-hoods { display: flex; flex-direction: column; } .cg-hood { padding: 14px 0; border-bottom: 1px solid var(--border-soft); } .cg-hood:last-child { border-bottom: none; } .cg-hood-name { font-family: var(--font-serif); font-size: 17px; font-weight: 600; color: var(--ink); } .cg-hood-blurb { font-size: 14px; line-height: 1.55; color: var(--ink-soft); margin: 5px 0; max-width: var(--reading-max); } .cg-hood-names { font-size: 12px; color: var(--ink-mute); margin: 0; } .cg-cta { background: var(--card-mint); border: 1px solid var(--card-mint-rule); border-radius: 18px; padding: 22px 20px; text-align: center; margin: 30px 0 8px; } .cg-cta-title { font-family: var(--font-serif); font-size: 19px; font-weight: 600; color: var(--ink); margin: 0 0 6px; } .cg-cta-body { font-size: 14px; line-height: 1.55; color: var(--ink-soft); margin: 0 auto 14px; max-width: 460px; } .cg-cta-btn { display: inline-block; background: var(--amber); color: #fff; font-size: 14px; font-weight: 600; text-decoration: none; padding: 10px 20px; border-radius: 999px; } .cg-cta-btn:hover { filter: brightness(0.95); } .cg-nav-wrap { margin: 4px 0 20px; } .cg-nav-toggle { position: absolute; opacity: 0; pointer-events: none; } .cg-nav { display: flex; flex-wrap: wrap; gap: 7px; max-height: 112px; overflow: hidden; transition: max-height 0.2s ease; } .cg-nav-toggle:checked ~ .cg-nav { max-height: 500px; } .cg-nav-fits .cg-nav { max-height: none; overflow: visible; } .cg-nav-more { display: inline-block; margin-top: 9px; font-family: var(--font-sans); font-size: 12px; font-weight: 500; color: var(--amber); cursor: pointer; } .cg-nav-more-off { display: none; } .cg-nav-toggle:checked ~ .cg-nav-more .cg-nav-more-on { display: none; } .cg-nav-toggle:checked ~ .cg-nav-more .cg-nav-more-off { display: inline; } @media (min-width: 1024px) { .cg-nav { max-height: none; overflow: visible; } .cg-nav-more { display: none; } } .cg-navtab { flex: 0 0 auto; display: inline-flex; align-items: baseline; gap: 6px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-soft); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 7px 14px; text-decoration: none; white-space: nowrap; transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease; } .cg-navtab:hover { border-color: var(--amber); color: var(--amber); } .cg-navtab.is-current { background: var(--amber); border-color: var(--amber); color: #fff; } .cg-navtab-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-dim); } .cg-navtab:hover .cg-navtab-count, .cg-navtab.is-current .cg-navtab-count { color: inherit; } .cg-tab-panel { display: none; } .cg-tab-panel.is-active { display: block; } .cg-tab-panel .cg-section:first-child { margin-top: 4px; } .cg-recap { display: flex; gap: 12px; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; margin: 0 -2px; } .cg-recap::-webkit-scrollbar { display: none; } .cg-recap-tile { flex: 0 0 auto; width: 240px; text-decoration: none; } .cg-recap-img { display: block; border-radius: 12px; overflow: hidden; background: var(--paper-2); } .cg-recap-img img { display: block; width: 100%; height: 150px; object-fit: cover; } .cg-recap-date { display: block; margin-top: 8px; font-family: var(--font-mono); font-size: 11px; color: var(--ink-dim); text-transform: uppercase; letter-spacing: 0.03em; } .cg-recap-title { display: block; margin-top: 2px; font-size: 14px; font-weight: 600; color: var(--ink); line-height: 1.35; } .cg-recap-tile:hover .cg-recap-title { color: var(--amber); } .cg-tab-panel-people .feed-directory-card { display: flex; align-items: stretch; } .cg-tab-panel-people .feed-directory-card > .event-roster-card { flex: 1 1 auto; } .cg-person-state { font-family: var(--font-mono); font-size: 9px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink-mute); background: var(--paper-2); border: 1px solid var(--border); border-radius: 999px; padding: 3px 7px; } .cg-count { font-family: var(--font-mono); font-size: 14px; font-weight: 500; color: var(--ink-dim); } .cg-person-admin { display: flex; align-items: center; gap: 6px; margin-left: auto; padding: 0 10px; } .cg-origin { font-family: var(--font-mono); font-size: 9px; text-transform: uppercase; letter-spacing: 0.04em; padding: 3px 7px; border-radius: 999px; border: 1px solid var(--border); } .cg-origin-imported { color: var(--amber); border-color: var(--amber-soft); background: #fbf1e9; } .cg-origin-member { color: var(--ink-mute); background: var(--paper-2); } .cg-actions { position: relative; } .cg-actions-btn { list-style: none; cursor: pointer; font-family: var(--font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink-mute); background: var(--paper-2); border: 1px solid var(--border); border-radius: 999px; padding: 4px 10px; } .cg-actions-btn::-webkit-details-marker { display: none; } .cg-actions[open] .cg-actions-btn { border-color: var(--amber); color: var(--amber); } .cg-actions-pop { position: absolute; right: 0; top: calc(100% + 4px); z-index: 5; min-width: 180px; background: var(--paper); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 6px 24px rgba(26, 24, 20, 0.12); padding: 4px; } .cg-action-form { margin: 0; } .cg-action { display: block; width: 100%; text-align: left; cursor: pointer; font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); background: none; border: none; border-radius: 8px; padding: 7px 10px; } .cg-action:hover { background: var(--paper-2); color: var(--ink); } .cg-action-danger { color: #b3361a; } .cg-action-danger:hover { background: #fbeeea; color: #b3361a; } .cg-more-toggle { position: absolute; opacity: 0; pointer-events: none; } .cg-tab-panel-people .feed-directory-card.cg-row-extra { display: none; } .cg-more-toggle:checked ~ .feed-directory-list .feed-directory-card.cg-row-extra { display: flex; } .cg-more-btn { display: inline-block; margin-top: 14px; font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--amber); background: var(--paper); border: 1px solid var(--border); border-radius: 999px; padding: 8px 16px; cursor: pointer; } .cg-more-btn:hover { border-color: var(--amber); } .cg-more-close { display: none; } .cg-more-toggle:checked ~ .cg-more-btn .cg-more-open { display: none; } .cg-more-toggle:checked ~ .cg-more-btn .cg-more-close { display: inline; } .cg-intro { margin: 0 0 22px; } .cg-context { font-size: 15px; line-height: 1.55; color: var(--ink-soft); max-width: var(--reading-max); margin: 0 0 22px; } .cg-empty { padding: 8px 0 4px; } .cg-empty-lead { font-size: 15px; color: var(--ink-soft); margin: 0 0 4px; } .cg-empty-sub { font-size: 13px; color: var(--ink-mute); margin: 0 0 10px; max-width: var(--reading-max); } .cg-subnav { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 6px; } .cg-subnav-chip { font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 4px 10px; text-decoration: none; white-space: nowrap; } .cg-subnav-chip:hover { border-color: var(--amber); color: var(--amber); } .cg-subnav-count { font-family: var(--font-mono); font-size: 10px; color: var(--ink-dim); } .cg-kind-head[id] { scroll-margin-top: 14px; } .cg-row-name a[target="_blank"]::after { content: "\2197"; margin-left: 3px; font-size: 0.82em; color: var(--ink-dim); } .cg-row-name a[target="_blank"]:hover::after { color: var(--amber); } .cg-navtab:focus-visible, .cg-crumbs-home:focus-visible, .cg-subnav-chip:focus-visible, .cg-vchips .series-chip:focus-visible, .cg-more:focus-visible, .cg-cta-btn:focus-visible, .cg-row-name a:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; border-radius: 6px; } .cg-crumbs { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; font-size: 12px; } .cg-crumbs-home { color: var(--amber); text-decoration: none; font-weight: 500; } .cg-crumbs-home:hover { text-decoration: underline; } .cg-crumbs-sep { color: var(--ink-dim); } .cg-crumbs-current { color: var(--ink-mute); } @media (min-width: 1024px) { .cg-nav-wrap { position: sticky; top: 0; z-index: 20; background: var(--surface); padding-top: 8px; } } .cg-navitem { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 2px; } .cg-nav-admin .cg-nav { max-height: none; overflow: visible; } .cg-nav-admin .cg-nav-more { display: none; } .cg-navmove { display: inline-flex; } .cg-navmove-form { margin: 0; } .cg-navmove-btn { font-family: var(--font-sans); font-size: 13px; line-height: 1; color: var(--ink-mute); background: none; border: none; cursor: pointer; padding: 2px 3px; } .cg-navmove-btn:hover { color: var(--amber); } .cg-admin-bar { margin: 0 0 12px; } .cg-admin-link { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-sans); font-size: 12px; font-weight: 600; letter-spacing: .02em; color: var(--ink-mute); text-decoration: none; border: 1px solid var(--border); border-radius: 999px; padding: 4px 12px; } .cg-admin-link:hover { color: var(--amber); border-color: var(--amber); } .su-lead { margin: 22px 0 4px; } .su-lead-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; } .su-lead-title { font-family: var(--font-serif); font-size: 21px; color: var(--ink); margin: 0; } .su-lead-note { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); } .su-lead-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 292px), 1fr)); gap: 12px; } .su-lead-card { display: flex; flex-direction: column; gap: 8px; padding: 18px; background: var(--paper); border: 1px solid var(--border); border-radius: 14px; text-decoration: none; transition: border-color 0.15s ease, transform 0.12s ease; } .su-lead-card:hover { border-color: var(--amber); transform: translateY(-2px); } .su-lead-cat { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-mute); } .su-lead-q { font-family: var(--font-serif); font-size: 17px; line-height: 1.28; color: var(--ink); } .su-lead-a { font-family: var(--font-sans); font-size: 13.5px; line-height: 1.5; color: var(--ink-soft); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .su-lead-more { font-family: var(--font-mono); font-size: 11px; color: var(--amber); margin-top: auto; } .su-canon-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 268px), 1fr)); gap: 12px; } .su-canon-card { display: flex; flex-direction: column; gap: 7px; padding: 16px; background: var(--paper); border: 1px solid var(--border); border-radius: 14px; text-decoration: none; transition: border-color 0.15s ease, transform 0.12s ease; } .su-canon-card:hover { border-color: var(--amber); transform: translateY(-2px); } .su-canon-kind { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); } .su-canon-title { font-family: var(--font-serif); font-size: 16px; line-height: 1.25; color: var(--ink); } .su-canon-why { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; color: var(--ink-soft); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; } .su-canon-src { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); margin-top: auto; } .su-canon-card:hover .su-canon-src { color: var(--amber); } .su-canon-board { list-style: none; margin: 8px 0 0; padding: 0; } .su-canon-row { display: flex; gap: 13px; padding: 13px 0; border-bottom: 1px solid var(--border-soft); } .su-canon-row:last-child { border-bottom: 0; } .su-canon-rank { flex: none; width: 24px; text-align: center; font-family: var(--font-serif); font-size: 19px; font-weight: 600; color: var(--amber); line-height: 1.25; } .su-canon-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; text-decoration: none; } .su-canon-row-head { display: flex; align-items: baseline; gap: 10px; justify-content: space-between; } .su-canon-row-title { font-family: var(--font-serif); font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--ink); } .su-canon-row-kind { margin-right: 7px; } .su-canon-main:hover .su-canon-row-title { color: var(--amber); } .su-canon-cites { flex: none; font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); white-space: nowrap; } .su-canon-cites b { color: var(--amber); font-weight: 600; } .su-canon-row-why { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); line-height: 1.5; } .su-canon-row-meta { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-canon-body { display: flex; flex-direction: column; gap: 6px; min-width: 0; flex: 1; } .su-rec { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .su-rec-faces { display: inline-flex; align-items: center; } .su-rec-face-link { display: inline-flex; margin-left: -6px; border-radius: 50%; } .su-rec-face-link:first-child { margin-left: 0; } .su-rec-face { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; border: 1.5px solid var(--paper); background: var(--paper-2); box-sizing: border-box; } .su-rec-face.avatar-letter { display: inline-flex; align-items: center; justify-content: center; color: var(--ink-soft); font-family: var(--font-serif); line-height: 1; } .su-rec-form { margin: 0; } .su-rec-btn { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); background: transparent; border: 1px solid var(--border-soft); border-radius: 999px; padding: 4px 11px; transition: border-color 0.15s ease, color 0.15s ease; } .su-rec-btn:hover { border-color: var(--amber); color: var(--ink); } .su-rec-btn.is-on { border-color: var(--amber); color: var(--amber); } .su-rec-ico { font-size: 11px; } .su-rec-count { font-weight: 600; color: var(--amber); } .su-rec-static { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-rec-static .su-rec-ico { color: var(--amber); } .su-seeall { display: inline-block; margin-top: 12px; font-family: var(--font-mono); font-size: 12px; color: var(--amber); text-decoration: none; } .su-seeall:hover { text-decoration: underline; } .su-india { margin: 34px 0; padding: 24px; background: var(--paper-2); border: 1px solid var(--amber-soft); border-radius: 16px; } .su-india-eyebrow { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); } .su-india-title { font-family: var(--font-serif); font-size: 20px; color: var(--ink); margin: 8px 0 6px; } .su-india-note { font-family: var(--font-sans); font-size: 14px; line-height: 1.55; color: var(--ink-soft); margin: 0 0 14px; max-width: 62ch; } .su-india-cta { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--amber); padding-bottom: 2px; } .su-india-cta:hover { color: var(--amber); } .su-browse { margin-top: 34px; } .su-browse-head .su-section-note { margin-top: -8px; } .su-section { margin-top: 32px; } .su-section:first-of-type { margin-top: 24px; } .su-section-title { font-family: var(--font-serif); font-size: 20px; color: var(--ink); margin-bottom: 14px; } .su-section-note { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); margin: -10px 0 14px; } .su-section-link { color: var(--ink); text-decoration: none; } .su-section-link:hover { color: var(--amber); } .su-crumb { display: inline-block; margin-bottom: 10px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink-mute); text-decoration: none; } .su-crumb:hover { color: var(--amber); } .su-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; position: sticky; top: 0; z-index: 5; margin-bottom: 10px; padding: 8px 0; font-family: var(--font-sans); font-size: 13px; background: var(--paper); border-bottom: 1px solid var(--border-soft); } .su-breadcrumb a { color: var(--ink-mute); text-decoration: none; font-weight: 600; } .su-breadcrumb a:hover { color: var(--amber); } .su-breadcrumb-sep { color: var(--ink-faint); } .su-breadcrumb-here { color: var(--ink-soft); font-weight: 600; } .su-filters { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 18px; } .su-filter-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } .su-filter-label { font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); margin-right: 2px; } .su-empty { font-size: 14px; color: var(--ink-mute); margin-top: 8px; } .su-empty a { color: var(--amber); text-decoration: none; } .su-result-count { font-size: 13px; color: var(--ink-mute); margin: 0 0 12px; } .su-result-count a { color: var(--amber); text-decoration: none; font-weight: 600; } .su-result-count a:hover { text-decoration: underline; } .su-section-note a, .wcalc-note a { color: var(--amber); text-decoration: none; font-weight: 600; } .su-section-note a:hover, .wcalc-note a:hover { text-decoration: underline; } .su-medium { margin-bottom: 20px; scroll-margin-top: 16px; } .su-medium-label { display: flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 12px; } .su-medium-label::after { content: ""; flex: 1; height: 1px; background: var(--border-soft); } .su-path-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(208px, 1fr)); gap: 9px; } .su-path-card { display: flex; flex-direction: column; gap: 4px; background: linear-gradient(0deg, rgba(198,74,26,0.05), rgba(198,74,26,0.05)), var(--paper); border: 1px solid var(--amber-soft); border-radius: 12px; padding: 12px 14px; text-decoration: none; transition: border-color 0.15s ease, transform 0.12s ease; } .su-path-card:hover { border-color: var(--amber); transform: translateY(-2px); } .su-path-card-name { font-family: var(--font-serif); font-size: 15.5px; font-weight: 600; line-height: 1.25; color: var(--ink); } .su-path-card-blurb { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .su-path-card-meta { font-family: var(--font-mono); font-size: 10.5px; color: var(--amber); margin-top: 1px; } .su-area-chips { display: flex; flex-wrap: wrap; gap: 8px; } .su-area-chip { display: inline-flex; align-items: baseline; gap: 8px; text-decoration: none; padding: 7px 13px; border: 1px solid var(--border-soft); border-radius: 999px; background: var(--paper); transition: border-color 0.15s ease; } .su-area-chip:hover { border-color: var(--amber); } .su-area-chip-name { font-family: var(--font-sans); font-size: 13px; color: var(--ink); } .su-area-chip-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-path-total { font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); margin: -4px 0 4px; } .su-path { list-style: none; margin: 8px 0 0; padding: 0; } .su-path-step { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--border-soft); } .su-path-step:last-child { border-bottom: 0; } .su-path-num { flex: none; width: 28px; height: 28px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-family: var(--font-serif); font-size: 14px; font-weight: 600; color: #fff; background: var(--amber); } .su-path-body { display: flex; flex-direction: column; gap: 2px; } .su-path-name { font-family: var(--font-serif); font-size: 16px; color: var(--ink); text-decoration: none; } .su-path-name:hover { color: var(--amber); } .su-path-tagline { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-soft); line-height: 1.45; } .su-path-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-path-note { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); line-height: 1.55; margin: 4px 0 10px; max-width: var(--reading-max); } .su-step-name { font-family: var(--font-serif); font-size: 16px; color: var(--ink); } .su-step-answer { margin-top: 8px; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 12px; } .su-step-q { font-family: var(--font-serif); font-size: 14.5px; font-weight: 600; color: var(--ink); text-decoration: none; line-height: 1.35; } .su-step-q:hover { color: var(--amber); } .su-step-a { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); line-height: 1.55; } .su-step-a-label { font-family: var(--font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-mute); margin-right: 4px; } .su-step-res { display: flex; flex-direction: column; gap: 4px; text-decoration: none; padding: 9px 11px; border: 1px solid var(--border-soft); border-radius: 10px; background: var(--paper); transition: border-color 0.15s ease; } .su-step-res:hover { border-color: var(--amber); } .su-step-res-head { display: flex; align-items: center; gap: 8px; } .su-step-res-kind { flex: none; font-size: 14px; } .su-step-res-title { font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink); } .su-step-res-src { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); margin-left: auto; padding-left: 8px; white-space: nowrap; } .su-step-res-why { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); line-height: 1.5; } .su-step-links { display: flex; flex-wrap: wrap; gap: 4px 16px; } .su-step-more { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-mute); text-decoration: none; } .su-step-more:hover { color: var(--amber); } .su-source-item { display: flex; flex-direction: column; } .su-source-answers { margin: -2px 0 2px; padding: 10px 16px 14px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; } .su-source-answers-label { font-family: var(--font-sans); font-size: 10.5px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-mute); } .su-source-answer { font-size: 13.5px; color: var(--amber); text-decoration: none; } .su-source-answer:hover { text-decoration: underline; } .su-source-answer:not(:last-child)::after { content: "·"; color: var(--ink-faint); margin-left: 10px; } .su-crosssell { margin-top: 36px; padding-top: 18px; border-top: 1px solid var(--border-soft); } .su-crosssell-body { font-size: 14px; color: var(--ink-mute); line-height: 1.6; } .su-crosssell-body a { color: var(--amber); text-decoration: none; font-weight: 500; } .su-crosssell-body a:hover { text-decoration: underline; } .d2c-crosslink-theme { margin-bottom: 16px; } .d2c-crosslink-theme:last-child { margin-bottom: 0; } .d2c-crosslink-label { display: block; font-size: 14px; font-weight: 600; color: var(--ink); margin-bottom: 8px; } .su-eyebrow { display: block; margin-bottom: 6px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); } .su-howto { display: flex; align-items: flex-start; gap: 10px; margin: 4px 0 14px; padding: 10px 12px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 12px; } .su-howto-text { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); line-height: 1.5; } .su-howto-dismiss { flex: none; margin-left: auto; font-size: 18px; line-height: 1; color: var(--ink-mute); background: none; border: 0; padding: 0 2px; cursor: pointer; } .su-howto-dismiss:hover { color: var(--amber); } .su-chip-disabled { opacity: 0.4; cursor: default; pointer-events: none; } .su-search { margin: 6px 0 8px; } .su-search-label { display: block; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink-soft); margin-bottom: 8px; } .su-search-box { position: relative; display: flex; align-items: center; } .su-search-input { width: 100%; box-sizing: border-box; font-family: var(--font-sans); font-size: 16px; color: var(--ink); background: var(--paper); border: 1.5px solid var(--border); border-radius: 14px; padding: 14px 42px 14px 16px; } .su-search-input:focus { outline: none; border-color: var(--amber); } .su-search-input::placeholder { color: var(--ink-dim); } .su-search-input::-webkit-search-cancel-button { -webkit-appearance: none; } .su-search-clear { position: absolute; right: 8px; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; font-size: 20px; line-height: 1; color: var(--ink-mute); background: none; border: 0; border-radius: 999px; cursor: pointer; } .su-search-clear:hover { color: var(--ink); background: var(--paper-2); } .su-results { margin: 2px 0 20px; } .su-results-head, .su-results-empty { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); margin: 0 0 10px; } .su-results-list { display: flex; flex-direction: column; gap: 8px; } .su-result { display: flex; flex-direction: column; gap: 3px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; padding: 13px 16px; text-decoration: none; transition: border-color 0.15s ease; } .su-result:hover { border-color: var(--amber); } .su-result-cat { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--amber); } .su-result-q { font-family: var(--font-serif); font-size: 16px; color: var(--ink); line-height: 1.35; } .su-result-a { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); line-height: 1.5; } .su-result.su-result-active { border-color: var(--amber); background: linear-gradient(0deg, rgba(198,74,26,0.04), rgba(198,74,26,0.04)), var(--paper); } .su-result.su-result-active .su-result-q, .su-result:hover .su-result-q { color: var(--amber); } .su-result-meta { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: 5px; } .su-result-pick { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .su-result-pick-kind { margin-right: 5px; } .su-result-n { font-family: var(--font-mono); font-size: 11px; color: var(--amber); white-space: nowrap; flex: none; } .su-results-kbd { font-family: var(--font-mono); font-size: 10px; color: var(--ink-dim); letter-spacing: 0.02em; margin-left: 4px; white-space: nowrap; } .gloss-empty { font-family: var(--font-sans); font-size: 14px; color: var(--ink-mute); margin: 4px 0 18px; } .gloss-section { margin: 0 0 26px; } .gloss-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; } @media (max-width: 560px) { .gloss-list { grid-template-columns: 1fr; } } .gloss-term { display: flex; flex-direction: column; gap: 4px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; padding: 13px 15px; text-decoration: none; transition: border-color 0.15s ease; } .gloss-term:hover { border-color: var(--amber); } .gloss-term-name { font-family: var(--font-sans); font-weight: 700; font-size: 15px; color: var(--ink); } .gloss-term-alias { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.03em; color: var(--ink-mute); } .gloss-term-def { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; color: var(--ink-soft); } .gloss-show-alias { font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); margin: -4px 0 14px; } .gloss-show-def { font-family: var(--font-sans); font-size: 17px; line-height: 1.6; color: var(--ink); margin: 0 0 16px; } .gloss-show-formula { font-family: var(--font-mono); font-size: 14px; color: var(--ink-soft); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 12px; padding: 10px 14px; margin: 0 0 18px; } .gloss-block { margin: 0 0 22px; } .gloss-block p { font-family: var(--font-sans); font-size: 15px; line-height: 1.6; color: var(--ink-soft); margin: 8px 0 0; } .gloss-resources { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; } .gloss-resource { display: flex; flex-direction: column; gap: 4px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; padding: 13px 16px; text-decoration: none; transition: border-color 0.15s ease; } .gloss-resource:hover { border-color: var(--amber); } .gloss-resource-title { font-family: var(--font-sans); font-weight: 700; font-size: 15px; color: var(--ink); } .gloss-resource-title a { color: var(--ink); text-decoration: none; } .gloss-resource-title a:hover { color: var(--amber); } .gloss-resource-meta { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.03em; color: var(--ink-mute); } .gloss-resource-why { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; color: var(--ink-soft); } .gloss-video { position: relative; margin: 2px 0 8px; border-radius: 10px; overflow: hidden; aspect-ratio: 16 / 9; background: #000; } .gloss-video-facade { display: block; width: 100%; height: 100%; } .gloss-video-thumb { width: 100%; height: 100%; object-fit: cover; display: block; } .gloss-video-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; } .gloss-video iframe { width: 100%; height: 100%; border: 0; } .gloss-audio { margin: 2px 0 8px; border-radius: 10px; } .gloss-resource-cta { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.03em; text-transform: uppercase; color: var(--amber); text-decoration: none; margin-top: 4px; } .gloss-resource-cta:hover { text-decoration: underline; } .gloss-resource-domain { color: var(--ink-mute); text-transform: none; letter-spacing: 0; } .gloss-related { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; } .gloss-godeeper { border-top: 1px solid var(--border-soft); padding-top: 18px; margin-top: 26px; } .gloss-godeeper a { color: var(--amber); font-weight: 600; text-decoration: none; } .gloss-godeeper a:hover { text-decoration: underline; } .gloss-mentions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; } .su-topics { display: flex; flex-direction: column; gap: 4px; } .su-topic { border-bottom: 1px solid var(--border-soft); } .su-topic-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 11px 4px; cursor: pointer; list-style: none; } .su-topic-head::-webkit-details-marker { display: none; } .su-topic-head::before { content: "+"; font-family: var(--font-mono); font-size: 14px; color: var(--ink-mute); order: 2; flex: none; width: 14px; text-align: center; } .su-topic[open] > .su-topic-head::before { content: "\2013"; } .su-topic-name { font-family: var(--font-sans); font-size: 14.5px; color: var(--ink); flex: 1; } .su-topic[open] > .su-topic-head .su-topic-name, .su-topic-head:hover .su-topic-name { color: var(--amber); } .su-topic-count { flex: none; font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-topic-questions { display: flex; flex-direction: column; gap: 1px; padding: 2px 0 10px; } .su-topic-q { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 8px 12px; margin: 0 -4px; border-radius: 10px; text-decoration: none; transition: background 0.12s ease; } .su-topic-q:hover { background: var(--paper-2); } .su-topic-q-text { font-family: var(--font-serif); font-size: 14.5px; color: var(--ink-soft); line-height: 1.35; } .su-topic-q:hover .su-topic-q-text { color: var(--amber); } .su-topic-q-count { flex: none; font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-related { display: flex; flex-direction: column; gap: 1px; } .su-related-link { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 8px 12px; margin: 0 -4px; border-radius: 10px; text-decoration: none; transition: background 0.12s ease; } .su-related-link:hover { background: var(--paper-2); } .su-related-q { font-family: var(--font-serif); font-size: 14.5px; color: var(--ink-soft); line-height: 1.35; } .su-related-link:hover .su-related-q { color: var(--amber); } .su-related-n { flex: none; font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-topic-tagline { font-size: 13px; color: var(--ink-mute); line-height: 1.5; margin: 2px 12px 6px; } .su-topic-more { display: inline-block; padding: 6px 12px; margin: 2px 0 0; font-family: var(--font-mono); font-size: 11.5px; color: var(--amber); text-decoration: none; } .su-topic-more:hover { text-decoration: underline; } .su-clusternav { display: flex; flex-wrap: wrap; gap: 7px; position: sticky; top: 0; z-index: 5; margin: 4px 0 22px; padding: 10px 0; background: var(--paper); border-bottom: 1px solid var(--border-soft); } .su-nav-chip { font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--ink-soft); text-decoration: none; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 5px 12px; transition: border-color 0.15s ease, color 0.15s ease; } .su-nav-chip:hover { border-color: var(--amber); color: var(--amber); } .su-nav-chip.is-active { background: var(--amber); border-color: var(--amber); color: #fff; } @media (max-width: 640px) { .su-clusternav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .su-clusternav::-webkit-scrollbar { display: none; } .su-nav-chip { flex: none; white-space: nowrap; } } .su-area { margin-bottom: 24px; scroll-margin-top: 60px; } .su-area-title { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-family: var(--font-serif); font-size: 18px; color: var(--ink); margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid var(--border-soft); } .su-area-count { flex: none; font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-cat-links { display: flex; flex-direction: column; gap: 2px; } .su-cat-link { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 8px 10px; margin: 0 -10px; border-radius: 10px; text-decoration: none; transition: background 0.12s ease; } .su-cat-link:hover { background: var(--paper-2); } .su-cat-link-name { font-family: var(--font-sans); font-size: 14.5px; color: var(--ink); } .su-cat-link:hover .su-cat-link-name { color: var(--amber); } .su-cat-link-count { flex: none; font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-persona-chips { display: flex; flex-wrap: wrap; gap: 8px; } .su-persona-chip { font-family: var(--font-sans); font-size: 13px; font-weight: 500; color: var(--ink-soft); text-decoration: none; background: var(--paper); border: 1px solid var(--border); border-radius: 999px; padding: 6px 13px; transition: border-color 0.15s ease, color 0.15s ease; } .su-persona-chip:hover { border-color: var(--amber); color: var(--amber); } .su-persona-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; } .su-persona-card { display: flex; flex-direction: column; gap: 4px; background: var(--paper); border: 1px solid var(--border); border-radius: 14px; padding: 14px 16px; text-decoration: none; transition: border-color 0.15s ease, transform 0.12s ease; } .su-persona-card:hover { border-color: var(--amber); transform: translateY(-2px); } .su-persona-name { font-family: var(--font-serif); font-size: 16px; color: var(--ink); } .su-persona-tagline { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); line-height: 1.5; } .su-cluster { margin-bottom: 24px; } .su-cluster-title { font-family: var(--font-sans); font-size: 12px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 10px; } .su-cat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; } .su-cat-card { display: flex; flex-direction: column; gap: 3px; background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 12px; padding: 12px 14px; text-decoration: none; transition: border-color 0.15s ease; } .su-cat-card:hover { border-color: var(--amber); } .su-cat-name { font-family: var(--font-serif); font-size: 15.5px; color: var(--ink); } .su-cat-tagline { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); line-height: 1.45; } .su-cat-count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); margin-top: 4px; } .su-q-list { display: flex; flex-direction: column; gap: 10px; } .su-q-row { display: flex; flex-direction: column; gap: 4px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; padding: 14px 16px; text-decoration: none; transition: border-color 0.15s ease; } .su-q-row:hover { border-color: var(--amber); } .su-q-text { font-family: var(--font-serif); font-size: 16px; color: var(--ink); line-height: 1.35; } .su-q-answer { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); line-height: 1.5; } .su-q-meta { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 11px; color: var(--amber); } .su-q-level { font-size: 10px; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ink-mute); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 1px 7px; } .su-question-title { margin-bottom: 4px; } .su-answer { margin-top: 18px; padding: 2px 0 2px 18px; border-left: 3px solid var(--amber); } .su-answer-label { display: block; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 7px; } .su-answer-body { font-family: var(--font-serif); font-size: 18.5px; color: var(--ink-soft); line-height: 1.5; } .su-resources-note { font-size: 13.5px; color: var(--ink-mute); margin: -6px 0 14px; } .su-disclaimer { font-family: var(--font-sans); font-size: 13px; line-height: 1.55; color: var(--ink-mute); border-left: 3px solid var(--line); padding: 2px 0 2px 12px; margin: 0 0 20px; } .wcalc { border: 1px solid var(--line); border-radius: 14px; padding: 18px; margin: 0 0 18px; } .wcalc-title { font-size: 18px; margin: 0 0 4px; } .wcalc-lead { font-family: var(--font-sans); font-size: 14px; color: var(--ink-mute); line-height: 1.5; margin: 0 0 14px; } .wcalc-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; } .wcalc-field { display: flex; flex-direction: column; gap: 5px; font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); } .wcalc-field input { font-size: 15px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: inherit; width: 100%; } .wcalc-out { font-family: var(--font-sans); font-size: 14.5px; line-height: 1.55; margin: 14px 0 0; padding: 12px 14px; border-radius: 10px; background: rgba(0,0,0,.03); } .wcalc-hint { color: var(--ink-mute); } .wcalc-note { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); margin: 10px 0 0; } .su-glance { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 22px; padding-top: 14px; border-top: 1px solid var(--border-soft); } .su-glance-item { font-family: var(--font-mono); font-size: 12px; color: var(--ink-soft); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 4px 11px; font-variant-numeric: tabular-nums; } .su-glance-item b { color: var(--ink); font-weight: 600; } .su-glance-jumps { margin-left: auto; display: flex; flex-wrap: wrap; gap: 6px; } .su-glance-jump { font-family: var(--font-sans); font-size: 12px; text-decoration: none; color: var(--ink-mute); border: 1px solid var(--border-soft); border-radius: 999px; padding: 4px 11px; } .su-glance-jump:hover { color: var(--amber); border-color: var(--amber-soft); } .su-picker { margin-top: 4px; } .su-picker-radio { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; } .su-picker-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; padding-top: 16px; border-top: 1px solid var(--border-soft); } .su-picker-tab { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-family: var(--font-sans); font-size: 14px; color: var(--ink-soft); background: var(--paper); border: 1px solid var(--border); border-radius: 999px; padding: 8px 14px; transition: color .15s, border-color .15s, background .15s; } .su-picker-tab:hover { border-color: var(--amber-soft); color: var(--ink); } .su-picker-ico { font-size: 13px; line-height: 1; opacity: 0.85; } .su-picker-n { font-family: var(--font-mono); font-size: 11px; font-variant-numeric: tabular-nums; color: var(--ink-mute); background: var(--paper-2); border-radius: 999px; padding: 1px 7px; } .su-picker-panel { display: none; } #su-med-watch:checked ~ .su-picker-tabs [for="su-med-watch"], #su-med-listen:checked ~ .su-picker-tabs [for="su-med-listen"], #su-med-read:checked ~ .su-picker-tabs [for="su-med-read"], #su-med-use:checked ~ .su-picker-tabs [for="su-med-use"] { background: var(--amber); border-color: var(--amber); color: #fff; } #su-med-watch:checked ~ .su-picker-tabs [for="su-med-watch"] .su-picker-n, #su-med-listen:checked ~ .su-picker-tabs [for="su-med-listen"] .su-picker-n, #su-med-read:checked ~ .su-picker-tabs [for="su-med-read"] .su-picker-n, #su-med-use:checked ~ .su-picker-tabs [for="su-med-use"] .su-picker-n { background: rgba(255, 255, 255, 0.22); color: #fff; } #su-med-watch:checked ~ .su-picker-panels [data-medium="watch"], #su-med-listen:checked ~ .su-picker-panels [data-medium="listen"], #su-med-read:checked ~ .su-picker-panels [data-medium="read"], #su-med-use:checked ~ .su-picker-panels [data-medium="use"] { display: block; } #su-med-watch:focus-visible ~ .su-picker-tabs [for="su-med-watch"], #su-med-listen:focus-visible ~ .su-picker-tabs [for="su-med-listen"], #su-med-read:focus-visible ~ .su-picker-tabs [for="su-med-read"], #su-med-use:focus-visible ~ .su-picker-tabs [for="su-med-use"] { outline: 2px solid var(--amber); outline-offset: 2px; } .su-resources { display: flex; flex-direction: column; gap: 14px; } .su-resource { background: var(--paper); border: 1px solid var(--border); border-radius: 16px; padding: 16px 18px; } .su-resource-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; } .su-resource-kind { font-family: var(--font-sans); font-size: 12px; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ink-mute); } .su-resource-badges { display: flex; flex-wrap: wrap; gap: 6px; } .su-badge { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.02em; color: var(--ink-mute); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 2px 8px; } .su-badge-india { color: var(--amber); border-color: var(--amber-soft); } .su-resource-verified { font-family: var(--font-sans); font-size: 11px; font-weight: 600; color: #2f7a5b; display: inline-flex; align-items: center; gap: 3px; } .su-resource-title { font-family: var(--font-serif); font-size: 17px; line-height: 1.3; margin-bottom: 2px; } .su-resource-title a { color: var(--ink); text-decoration: none; } .su-resource-title a:hover { color: var(--amber); } .su-resource-source { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); margin-bottom: 2px; } .su-resource-from { font-size: 10.5px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-mute); } .su-resource-pub { font-weight: 600; color: var(--ink-soft); } .su-resource-pub-link { text-decoration: none; } .su-resource-pub-link:hover { color: var(--amber); } .su-resource-by { color: var(--ink-mute); } .su-resource-len { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .su-resource-video { position: relative; margin-top: 12px; border-radius: 12px; overflow: hidden; aspect-ratio: 16 / 9; background: #000; } .su-video-facade { display: block; width: 100%; height: 100%; position: relative; } .su-video-thumb { width: 100%; height: 100%; object-fit: cover; display: block; } .su-video-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; transition: transform 0.15s ease; } .su-video-facade:hover .su-video-play { transform: scale(1.06); } .su-resource-video :is(iframe, .city-feed-story-video) { width: 100%; height: 100%; border: 0; display: block; } .su-resource-audio { margin-top: 12px; border-radius: 12px; border: 0; display: block; width: 100%; } .su-resource-audio-apple { max-height: 175px; } .su-resource-why { margin: 2px 0 14px; font-family: var(--font-serif); font-size: 16.5px; color: var(--ink); line-height: 1.46; } .su-takeaways { margin: 14px 0 0; padding: 0; list-style: none; display: grid; gap: 7px; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-soft); line-height: 1.42; } .su-takeaways li { position: relative; padding-left: 22px; } .su-takeaways li::before { content: ""; position: absolute; left: 2px; top: 5px; width: 9px; height: 5px; border-left: 2px solid var(--amber); border-bottom: 2px solid var(--amber); transform: rotate(-45deg); } .su-resource-cta { display: inline-block; margin-top: 12px; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--amber); text-decoration: none; } .su-resource-cta:hover { text-decoration: underline; } .su-resource-domain { font-family: var(--font-mono); font-size: 11px; font-weight: 500; color: var(--ink-mute); } .quiz-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; } .quiz-card { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; text-decoration: none; transition: border-color 0.15s, transform 0.15s; } .quiz-card:hover { border-color: var(--accent); transform: translateY(-2px); } .quiz-card-count { font-family: var(--font-mono); font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-mute); } .quiz-card-title { font-family: var(--font-serif); font-size: 22px; font-weight: 500; letter-spacing: -0.015em; color: var(--ink); } .quiz-card-intro { font-size: 14px; color: var(--ink-soft); line-height: 1.5; } .quiz-card-cta { margin-top: 6px; font-size: 13px; font-weight: 600; color: var(--accent); } .quiz-empty { color: var(--ink-mute); font-size: 15px; } .quiz-body { margin: 0; background: #14120f; } .quiz-stage { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; background: radial-gradient(120% 90% at 50% 0%, #24201a 0%, #14120f 60%); color: #f3ede1; } .quiz-topbar { display: flex; align-items: center; justify-content: space-between; padding: 16px 24px; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.04em; color: #a89f8c; } .quiz-exit { color: #a89f8c; text-decoration: none; } .quiz-exit:hover { color: #f3ede1; } .quiz-counter { font-variant-numeric: tabular-nums; } .quiz-fs { background: none; border: none; color: #a89f8c; cursor: pointer; font-size: 18px; line-height: 1; padding: 4px; } .quiz-fs:hover { color: #f3ede1; } .quiz-deck { flex: 1; display: flex; align-items: center; justify-content: center; padding: 12px 24px; } .quiz-slide { display: none; width: 100%; max-width: 900px; text-align: center; } .quiz-slide.is-current { display: flex; flex-direction: column; align-items: center; } .quiz-kicker { font-family: var(--font-mono); font-size: 13px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.16em; color: var(--accent); margin: 0 0 20px; } .quiz-cover-title { font-family: var(--font-serif); font-weight: 500; font-size: clamp(38px, 7vw, 76px); line-height: 1.02; letter-spacing: -0.02em; margin: 0; color: #fff; } .quiz-cover-intro { font-family: var(--font-serif); font-size: clamp(17px, 2.4vw, 24px); color: #d8cfbd; line-height: 1.45; margin: 22px 0 0; max-width: 640px; } .quiz-hint { margin: 40px 0 0; font-size: 14px; color: #8f8674; } .quiz-hint kbd { font-family: var(--font-mono); font-size: 12px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); border-radius: 6px; padding: 2px 7px; } .quiz-qnum { font-family: var(--font-mono); font-size: 13px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; color: #8f8674; margin: 0 0 18px; } .quiz-prompt { font-family: var(--font-serif); font-weight: 500; font-size: clamp(28px, 4.6vw, 52px); line-height: 1.1; letter-spacing: -0.018em; margin: 0 0 36px; color: #fff; } .quiz-options { list-style: none; margin: 0 auto; padding: 0; display: grid; gap: 14px; width: 100%; max-width: 760px; } @media (min-width: 720px) { .quiz-options { grid-template-columns: 1fr 1fr; } } .quiz-option { display: flex; align-items: center; gap: 16px; text-align: left; padding: 18px 22px; background: rgba(255,255,255,0.05); border: 1.5px solid rgba(255,255,255,0.12); border-radius: 14px; transition: opacity 0.3s, border-color 0.3s, background 0.3s, transform 0.3s; } .quiz-letter { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: rgba(255,255,255,0.09); font-family: var(--font-mono); font-size: 18px; font-weight: 600; color: #d8cfbd; } .quiz-label { flex: 1; font-size: clamp(17px, 2.2vw, 23px); font-weight: 500; line-height: 1.3; color: #f3ede1; } .quiz-tick { flex: none; font-size: 22px; color: #7ec99f; opacity: 0; } .quiz-question[data-revealed="true"] .quiz-option:not(.is-correct) { opacity: 0.38; } .quiz-question[data-revealed="true"] .quiz-option.is-correct { background: rgba(126,201,159,0.14); border-color: #7ec99f; transform: translateY(-2px); } .quiz-question[data-revealed="true"] .quiz-option.is-correct .quiz-letter { background: #7ec99f; color: #14120f; } .quiz-question[data-revealed="true"] .quiz-option.is-correct .quiz-tick { opacity: 1; } .quiz-note { margin: 26px auto 0; max-width: 620px; font-size: clamp(14px, 1.9vw, 18px); line-height: 1.5; color: #b8af9c; opacity: 0; transition: opacity 0.3s; } .quiz-question[data-revealed="true"] .quiz-note { opacity: 1; } .quiz-answer { margin: 8px auto 0; max-width: 820px; font-family: var(--font-serif); font-weight: 500; font-size: clamp(24px, 3.6vw, 40px); line-height: 1.2; letter-spacing: -0.012em; color: #7ec99f; opacity: 0; transform: translateY(6px); transition: opacity 0.3s, transform 0.3s; } .quiz-question[data-revealed="true"] .quiz-answer { opacity: 1; transform: none; } .quiz-controls { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 18px 24px 26px; } .quiz-btn { font-family: var(--font-sans); font-size: 15px; font-weight: 600; padding: 12px 24px; border-radius: 999px; cursor: pointer; border: 1.5px solid transparent; transition: background 0.15s, border-color 0.15s; } .quiz-btn-ghost { background: none; border-color: rgba(255,255,255,0.18); color: #d8cfbd; } .quiz-btn-ghost:hover { border-color: rgba(255,255,255,0.4); color: #fff; } .quiz-btn-reveal { background: rgba(255,255,255,0.1); color: #f3ede1; } .quiz-btn-reveal:hover { background: rgba(255,255,255,0.18); } .quiz-btn-next { background: var(--accent); color: #fff; } .quiz-btn-next:hover { filter: brightness(1.08); } @font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/inter-400-latin-ext-65edaaef.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/inter-400-latin-1f021a24.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: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/inter-500-latin-ext-65edaaef.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/inter-500-latin-1f021a24.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: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/inter-600-latin-ext-65edaaef.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/inter-600-latin-1f021a24.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: "Newsreader"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/newsreader-400-latin-ext-53136885.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Newsreader"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/newsreader-400-latin-4b499f36.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: "Newsreader"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/newsreader-500-latin-ext-53136885.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Newsreader"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/newsreader-500-latin-4b499f36.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: "Newsreader"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/newsreader-600-latin-ext-53136885.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Newsreader"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/newsreader-600-latin-4b499f36.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: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/jetbrains-mono-400-latin-ext-cc1590e8.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/jetbrains-mono-400-latin-8a992d39.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: "JetBrains Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/jetbrains-mono-500-latin-ext-cc1590e8.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/jetbrains-mono-500-latin-8a992d39.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: "JetBrains Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/jetbrains-mono-600-latin-ext-cc1590e8.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/jetbrains-mono-600-latin-8a992d39.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: "Archivo"; font-style: normal; font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; src: url("/assets/archivo-latin-591a8b69.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: "Archivo"; font-style: normal; font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; src: url("/assets/archivo-latin-ext-a0aa4f2d.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/ibm-plex-mono-400-latin-d13bb5b4.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: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/ibm-plex-mono-400-latin-ext-182606ec.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/ibm-plex-mono-500-latin-deab9c2b.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: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/ibm-plex-mono-500-latin-ext-2cd882f8.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } body.dkr { --dkr-black:#22132b; --dkr-panel:#2c1c38; --dkr-paper:#ece9e3; --dkr-muted:#9b8fa0; --dkr-faint:#8a8090; --dkr-line:#3a2748; --dkr-max:1180px; --dkr-sans:"Archivo", var(--font-sans); --dkr-mono:"IBM Plex Mono", var(--font-mono); --dkr-ease:cubic-bezier(0.16,1,0.3,1); --dkr-track-display:-.02em; --bg:#22132b; --paper:#281735; --paper-2:#301c3e; --surface:#2c1a38; --ink:#ece9e3; --ink-soft:#c9c4ba; --ink-mute:#9b8fa0; --ink-dim:#7c7186; --ink-fade:#554b60; --ink-faint:#5a5064; --rule:#3a2646; --border:#42304e; --border-soft:#33223f; --amber:#e0864a; --amber-soft:#3a2a1e; --accent:#e0864a; --accent-soft:#3a2a1e; --card-mint:#14201e; --card-mint-rule:#243330; display:block; margin:0; padding:0; min-height:100vh; overflow-x:clip; background:var(--dkr-black); color:var(--dkr-paper); font-family:var(--dkr-sans); font-weight:400; line-height:1.5; -webkit-font-smoothing:antialiased; overflow-x:hidden; } body.dkr *{ box-sizing:border-box; } body.dkr::before{ content:""; position:fixed; inset:0; z-index:-2; pointer-events:none; background: radial-gradient(120% 62vh at 50% -8%, rgba(98,58,112,.5) 0%, rgba(50,32,60,.24) 38%, transparent 66%), radial-gradient(140% 120% at 50% 42%, transparent 52%, rgba(0,0,0,.28) 82%, rgba(0,0,0,.44) 100%); } @media (prefers-reduced-motion: no-preference) { body.dkr [data-enlarger-hero] { view-transition-name: enlarger-hero; } ::view-transition-group(enlarger-hero) { animation-duration: 220ms; animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1); } ::view-transition-old(enlarger-hero), ::view-transition-new(enlarger-hero) { height: 100%; object-fit: cover; overflow: clip; } @media (hover: none) { ::view-transition-group(enlarger-hero) { animation-duration: 340ms; } } } body.dkr .dkr-shot img, body.dkr .dkr-pic img{ display:block; width:100%; height:100%; object-fit:cover; } body.dkr .dkr-chrome a, body.dkr .dkr-hero a, body.dkr .dkr-foot a{ color:inherit; text-decoration:none; } body.dkr ::selection{ background:var(--dkr-paper); color:var(--dkr-black); } body.dkr .top-nav, body.dkr .notch{ display:none; } body.dkr .phone-frame{ width:100%; max-width:var(--dkr-max); margin:0 auto; background:transparent; border:0; box-shadow:none; border-radius:0; overflow:visible; } body.dkr #main-content{ min-width:0; padding:0 0 clamp(20px,2.5vw,36px); } body.dkr .phone-frame .screen{ padding-inline:clamp(18px,5vw,64px); } body.dkr .dkr-topbar{ position:sticky; top:0; z-index:60; background:rgba(34,19,43,.82); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom:1px solid var(--dkr-line); } body.dkr .dkr-topbar-inner{ max-width:var(--dkr-max); margin:0 auto; padding:0 clamp(16px,5vw,64px); height:58px; display:flex; align-items:center; gap:clamp(14px,2.5vw,30px); } body.dkr .dkr-topbar-brand{ display:flex; align-items:center; flex:0 0 auto; } body.dkr .dkr-topbar-logo{ height:20px; width:auto; object-fit:contain; opacity:.85; } body.dkr .dkr-topbar-nav{ display:flex; align-items:center; gap:clamp(12px,2vw,24px); flex:1 1 auto; min-width:0; overflow-x:auto; scrollbar-width:none; } body.dkr .dkr-topbar-nav::-webkit-scrollbar{ display:none; } body.dkr .dkr-topbar-link{ font-family:var(--dkr-mono); font-size:11.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--dkr-muted); text-decoration:none; white-space:nowrap; padding:3px 0; border-bottom:1px solid transparent; transition:color .18s ease; } body.dkr .dkr-topbar-link:hover{ color:var(--dkr-paper); } body.dkr .dkr-topbar-link.is-active{ color:var(--dkr-paper); border-bottom-color:var(--amber); } body.dkr .dkr-topbar-end{ display:flex; align-items:center; gap:12px; flex:0 0 auto; margin-left:auto; } body.dkr .dkr-topbar-end form.button_to{ margin:0; display:flex; } body.dkr .dkr-topbar-me{ display:flex; align-items:center; } body.dkr .dkr-topbar-av{ width:30px; height:30px; border-radius:50%; object-fit:cover; } body.dkr .dkr-topbar-ghost, body.dkr .dkr-topbar-ghost:visited{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--dkr-muted); text-decoration:none; background:none; border:0; cursor:pointer; padding:0; white-space:nowrap; transition:color .18s ease; } body.dkr .dkr-topbar-ghost:hover{ color:var(--dkr-paper); } body.dkr .dkr-nav-cb{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; } body.dkr .dkr-burger{ display:none; } @media(max-width:720px){ body.dkr .dkr-topbar-inner{ height:54px; gap:12px; } body.dkr .dkr-topbar-nav{ position:absolute; top:100%; left:0; right:0; z-index:59; flex-direction:column; align-items:stretch; gap:0; background:#180d20; box-shadow:0 16px 40px rgba(0,0,0,.6); border-bottom:1px solid var(--dkr-line); max-height:0; overflow:hidden; opacity:0; pointer-events:none; transition:max-height .3s var(--dkr-ease), opacity .2s ease; } body.dkr .dkr-nav-cb:checked ~ .dkr-topbar-inner .dkr-topbar-nav{ max-height:82vh; opacity:1; pointer-events:auto; padding:4px 0 10px; } body.dkr .dkr-topbar-link{ padding:13px clamp(18px,6vw,28px); border-bottom:1px solid var(--dkr-line); font-size:12.5px; letter-spacing:.1em; } body.dkr .dkr-topbar-nav .dkr-topbar-link:last-child{ border-bottom:0; } body.dkr .dkr-topbar-link.is-active{ border-bottom-color:var(--dkr-line); color:var(--amber); } body.dkr .dkr-topbar-signin, body.dkr .dkr-topbar-theme{ display:inline-flex; } body.dkr .dkr-burger{ display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; cursor:pointer; flex:0 0 auto; } body.dkr .dkr-burger-bars{ position:relative; display:block; width:19px; height:1.6px; background:var(--dkr-paper); transition:background .2s; } body.dkr .dkr-burger-bars::before, body.dkr .dkr-burger-bars::after{ content:""; position:absolute; left:0; width:19px; height:1.6px; background:var(--dkr-paper); transition:transform .22s var(--dkr-ease); } body.dkr .dkr-burger-bars::before{ top:-6px; } body.dkr .dkr-burger-bars::after{ top:6px; } body.dkr .dkr-nav-cb:checked ~ .dkr-topbar-inner .dkr-burger-bars{ background:transparent; } body.dkr .dkr-nav-cb:checked ~ .dkr-topbar-inner .dkr-burger-bars::before{ transform:translateY(6px) rotate(45deg); } body.dkr .dkr-nav-cb:checked ~ .dkr-topbar-inner .dkr-burger-bars::after{ transform:translateY(-6px) rotate(-45deg); } body.dkr .dkr-nav-cb:focus-visible ~ .dkr-topbar-inner .dkr-burger{ outline:2px solid var(--amber); outline-offset:2px; } } body.dkr .event-card, body.dkr .founder-card, body.dkr .feed-item, body.dkr .feed-item-bare, body.dkr .ask-row, body.dkr .event-person-tile, body.dkr .event-people-featured, body.dkr .event-card-snap, body.dkr .feed-directory-card-self, body.dkr .feed-event-context{ background:var(--surface); border-color:var(--border-soft); box-shadow:none; } body.dkr .marq{ position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; background:radial-gradient(120% 120% at 50% 0%, #2c1d36 0%, var(--dkr-black) 68%); } body.dkr .marq-shot{ position:absolute; inset:0; z-index:0; animation:dkr-kb 26s var(--dkr-ease) infinite alternate; } body.dkr .marq-shot img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(1.28) contrast(1.05) brightness(1.06); } body.dkr .marq-shots{ position:absolute; inset:0; z-index:0; } body.dkr .marq-shot-layer{ position:absolute; inset:0; opacity:0; transition:opacity 1.4s var(--dkr-ease); } body.dkr .marq-shot-layer.is-active{ opacity:1; } body.dkr .marq-shot-layer img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(1.28) contrast(1.05) brightness(1.06); object-position:var(--focal, 50% 38%); } body.dkr .marq-shot-layer.is-active img{ animation:dkr-kb 26s var(--dkr-ease) infinite alternate; transform-origin:var(--focal, 50% 38%); } body.dkr .marq-shot-layer.is-still.is-active img{ animation:none; } body.dkr .marq-titles{ display:grid; } body.dkr .marq-titles > .marq-line{ grid-area:1 / 1; align-self:end; opacity:0; transition:opacity .35s var(--dkr-ease); } body.dkr .marq-titles > .marq-line.is-active{ opacity:1; transition:opacity .7s var(--dkr-ease) .55s; } body.dkr .marq-moments{ display:grid; margin-bottom:14px; } body.dkr .marq-moments > .marq-moment{ grid-area:1 / 1; opacity:0; transition:opacity 1s var(--dkr-ease); } body.dkr .marq-moments > .marq-moment.is-active{ opacity:1; } body.dkr .marq-moment{ margin:0; font-family:var(--dkr-sans); font-size:12px; line-height:1.4; letter-spacing:.02em; color:var(--dkr-paper); opacity:.72; max-width:44ch; text-shadow:0 1px 12px rgba(34,19,43,.7); } @media (prefers-reduced-motion: reduce){ body.dkr .marq-shot-layer.is-active img{ animation:none; } body.dkr .marq-shot-layer, body.dkr .marq-titles > .marq-line{ transition:none; } } body.dkr .marq::after{ content:""; position:absolute; inset:0; z-index:1; background: linear-gradient(180deg, rgba(34,19,43,.62) 0%, rgba(34,19,43,.22) 10%, transparent 24%), linear-gradient(180deg, transparent 0%, transparent 26%, rgba(34,19,43,.42) 46%, rgba(34,19,43,.8) 66%, rgba(34,19,43,.97) 84%, rgba(34,19,43,1) 100%); } body.dkr .marq-cap{ position:relative; z-index:2; width:100%; max-width:var(--dkr-max); margin:0 auto; padding:0 clamp(18px,5vw,64px) clamp(48px,8vh,96px); } body.dkr .marq-title{ font-family:var(--dkr-sans); font-weight:640; font-stretch:112%; font-size:clamp(34px,6vw,80px); line-height:1.0; letter-spacing:var(--dkr-track-display); max-width:16ch; text-wrap:balance; margin:0; color:var(--dkr-paper); text-shadow:0 1px 3px rgba(34,19,43,.85), 0 2px 40px rgba(34,19,43,.5); } body.dkr .marq-lead{ margin:20px 0 0; font-family:var(--dkr-sans); font-size:clamp(15px,1.6vw,19px); line-height:1.5; color:var(--dkr-paper); opacity:.92; max-width:46ch; text-shadow:0 1px 14px rgba(34,19,43,.7); } body.dkr .marq-welcome{ margin:13px 0 0; font-family:var(--dkr-sans); font-weight:500; font-size:15px; letter-spacing:0; color:var(--amber); opacity:.92; text-shadow:0 1px 12px rgba(34,19,43,.7); } body.dkr .marq-story{ margin:0; font-family:var(--dkr-sans); font-weight:500; font-size:clamp(24px,5.2vw,34px); line-height:1.08; letter-spacing:-.015em; max-width:22ch; text-wrap:balance; color:var(--dkr-paper); text-shadow:0 1px 3px rgba(34,19,43,.85), 0 2px 34px rgba(34,19,43,.5); } @media(min-width:1024px){ body.dkr .marq-story{ font-weight:600; font-size:clamp(42px,3.7vw,56px); line-height:1.06; letter-spacing:-.02em; max-width:36ch; } } @media(max-width:640px){ body.dkr .marq{ display:block; min-height:0; } body.dkr .marq-shots, body.dkr .marq-shot{ position:relative; inset:auto; aspect-ratio:3/2; width:100%; animation:none; } body.dkr .marq-shot-layer img, body.dkr .marq-shot img{ object-position:var(--focal, 50% 50%); filter:saturate(1.12) contrast(1.04) brightness(1.04); animation:none; } body.dkr .marq-shot-layer.is-active img{ animation:none; } body.dkr .marq::after{ display:none; } body.dkr .marq-shots::after, body.dkr .marq-shot::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:38%; z-index:2; pointer-events:none; background:linear-gradient(180deg, transparent 0%, rgba(34,19,43,.55) 62%, var(--dkr-black) 100%); } body.dkr .marq-cap{ padding:14px max(22px, env(safe-area-inset-right)) calc(40px + env(safe-area-inset-bottom)) max(22px, env(safe-area-inset-left)); } body.dkr .marq-moment, body.dkr .marq-story, body.dkr .marq-tagline, body.dkr .marq-pulse, body.dkr .marq-welcome{ text-shadow:none; } body.dkr .marq-welcome{ margin:10px 0 0; font-size:14px; letter-spacing:0; } body.dkr .marq-story{ font-size:clamp(21px,5.6vw,27px); max-width:22ch; line-height:1.1; } body.dkr .marq-tagline{ font-size:clamp(13px,3.6vw,15px); max-width:36ch; margin-top:10px; } body.dkr .marq-pulse{ margin-top:16px; } body.dkr .marq-actions{ margin-top:22px; gap:16px; } body.dkr .marq-ghost{ min-height:44px; font-size:13px; opacity:1; } body.dkr .marq-scroll{ display:none; } } body.dkr .marq-pulse{ margin-top:24px; font-family:var(--dkr-sans); font-size:13.5px; letter-spacing:0; color:var(--amber); font-variant-numeric:tabular-nums; text-shadow:0 1px 14px rgba(34,19,43,.6); } body.dkr .marq-credit{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:26px; } body.dkr .marq-credit .dkr-mono{ color:var(--dkr-paper); text-shadow:0 1px 14px rgba(34,19,43,.7); } body.dkr .marq-going{ display:flex; align-items:center; gap:10px; } body.dkr .marq-actions{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:34px; } body.dkr .marq-cta{ display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:13px 28px; background:var(--dkr-paper); color:var(--dkr-black); font-family:var(--dkr-sans); font-weight:600; font-size:15px; letter-spacing:0; text-decoration:none; transition:background .18s; } body.dkr .marq-cta:hover{ background:#fff; } body.dkr .marq-ghost{ display:inline-flex; align-items:center; gap:8px; font-family:var(--dkr-sans); font-size:14px; letter-spacing:0; color:var(--dkr-paper); text-decoration:none; opacity:.85; transition:opacity .18s; } body.dkr .marq-ghost:hover{ opacity:1; } body.dkr .marq-scroll{ position:absolute; left:50%; bottom:22px; z-index:2; width:1px; height:34px; background:linear-gradient(var(--dkr-paper), transparent); opacity:.45; } body.dkr .marq-body{ max-width:var(--dkr-max); margin:0 auto; padding:clamp(44px,7vw,88px) clamp(18px,5vw,64px) clamp(48px,7vw,80px); } body.dkr .marq-eb{ display:flex; align-items:center; gap:18px; margin-bottom:6px; } body.dkr .marq-eb-label{ color:var(--dkr-muted); flex:0 0 auto; } body.dkr .marq-eb-rule{ flex:1 1 auto; height:1px; background:var(--dkr-line); } body.dkr .marq-eb-link{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--dkr-muted); text-decoration:none; flex:0 0 auto; transition:color .18s; } body.dkr .marq-eb-link:hover{ color:var(--dkr-paper); } body.dkr .marq-rows{ border-top:1px solid var(--dkr-line); margin-top:20px; } body.dkr .marq-row{ border-bottom:1px solid var(--dkr-line); } body.dkr .marq-row-link{ display:grid; grid-template-columns:clamp(120px,20vw,220px) 1fr auto; align-items:center; gap:clamp(16px,3vw,32px); padding:clamp(16px,2.4vw,26px) 0; text-decoration:none; color:var(--dkr-paper); } body.dkr .marq-row-thumb{ aspect-ratio:16/10; overflow:hidden; background:var(--dkr-panel); } body.dkr .marq-row-thumb img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(1) sepia(.35) hue-rotate(-6deg) contrast(1.05) brightness(.9); transition:filter .5s var(--dkr-ease), transform .5s var(--dkr-ease); } body.dkr .marq-row-link:hover .marq-row-thumb img{ filter:none; transform:scale(1.04); } body.dkr .marq-row-main{ min-width:0; display:flex; flex-direction:column; gap:9px; } body.dkr .marq-row-meta{ color:var(--amber); font-size:11px; letter-spacing:.1em; text-transform:uppercase; } body.dkr .marq-row-title{ font-family:var(--dkr-sans); font-weight:600; font-size:clamp(20px,2.8vw,34px); line-height:1.06; letter-spacing:-.015em; } body.dkr .marq-row-end{ display:flex; align-items:center; gap:16px; flex:0 0 auto; } body.dkr .marq-row-going{ color:var(--dkr-muted); font-size:11px; letter-spacing:.06em; } body.dkr .marq-row-arrow{ color:var(--dkr-muted); font-size:18px; transition:transform .18s, color .18s; } body.dkr .marq-row-link:hover .marq-row-arrow{ transform:translateX(4px); color:var(--dkr-paper); } @media(max-width:620px){ body.dkr .marq-row-link{ grid-template-columns:96px 1fr; gap:16px; } body.dkr .marq-row-end{ display:none; } body.dkr .marq-row-title{ font-size:20px; } } body.dkr .marq-strip-sec{ margin-top:clamp(44px,7vw,84px); } @media(min-width:1024px){ body.dkr .marq-strip-sec{ overflow:hidden; } } body.dkr .marq-strip{ display:flex; gap:14px; overflow-x:auto; scrollbar-width:none; scroll-snap-type:x proximity; padding-bottom:4px; margin-top:20px; } body.dkr .marq-strip::-webkit-scrollbar{ display:none; } @media(min-width:1024px){ body.dkr .marq-strip{ margin-right:calc(50% - 50vw); padding-right:clamp(18px,5vw,64px); } } body.dkr .marq-frame{ flex:0 0 min(78vw,460px); scroll-snap-align:start; text-decoration:none; color:var(--dkr-paper); } body.dkr .marq-frame-shot{ display:block; aspect-ratio:3/2; overflow:hidden; background:var(--dkr-panel); } body.dkr .marq-frame-shot img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(1) sepia(.35) hue-rotate(-6deg) contrast(1.05) brightness(.92); transition:filter .5s var(--dkr-ease); } body.dkr .marq-frame:hover .marq-frame-shot img{ filter:none; } body.dkr .marq-frame-cap{ margin-top:10px; color:var(--dkr-muted); } body.dkr .marq-ledger{ margin-top:clamp(48px,8vw,88px); display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--dkr-line); } body.dkr .marq-ledger-cell{ padding:22px 20px 22px 0; border-right:1px solid var(--dkr-line); } body.dkr .marq-ledger-cell:last-child{ border-right:0; } body.dkr .marq-ledger-l{ color:var(--dkr-faint); display:block; margin-bottom:8px; } body.dkr .marq-ledger-v{ font-family:var(--dkr-sans); font-weight:600; font-size:clamp(26px,3.4vw,42px); font-variant-numeric:tabular-nums; } body.dkr .marq-close{ margin-top:32px; display:flex; align-items:baseline; justify-content:space-between; gap:24px; flex-wrap:wrap; } body.dkr .marq-close-line{ font-family:var(--dkr-sans); font-size:clamp(18px,2vw,24px); color:var(--dkr-paper); max-width:26ch; line-height:1.25; } @media(max-width:620px){ body.dkr .marq-ledger-cell{ padding:16px 12px 16px 0; } body.dkr .marq-ledger-v{ font-size:24px; } } body.dkr .marq-tagline{ margin:16px 0 0; font-family:var(--dkr-sans); font-weight:500; font-size:clamp(14px,1.5vw,18px); line-height:1.4; letter-spacing:.005em; color:var(--dkr-paper); opacity:.96; max-width:42ch; text-shadow:0 1px 12px rgba(34,19,43,.7); } body.dkr .marq-story-solo{ max-width:24ch; } body.dkr .marq.is-member{ min-height:0; display:block; align-items:stretch; } body.dkr .marq.is-member::after{ display:none; } body.dkr .marq.is-member .marq-stage{ position:relative; width:100%; overflow:hidden; height:min(82vh,780px); background:var(--dkr-black); } body.dkr .marq.is-member .marq-shots{ position:absolute; inset:0; } body.dkr .marq.is-member .marq-shot-layer img, body.dkr .marq.is-member .marq-shot img{ object-position:50% 26%; animation:none; } body.dkr .marq.is-member .marq-shot-layer.is-active img{ animation:none; } body.dkr .marq.is-member .marq-stage::after{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none; background:linear-gradient(180deg, transparent 58%, rgba(34,19,43,.08) 78%, rgba(34,19,43,.46) 91%, rgba(34,19,43,.93) 100%); } body.dkr .marq.is-member .marq-onphoto{ position:absolute; left:0; right:0; bottom:0; z-index:3; max-width:var(--dkr-max); margin:0 auto; padding:0 clamp(18px,5vw,64px) clamp(28px,4.4vh,56px); } body.dkr .marq.is-member .marq-kicker{ display:inline-flex; align-items:center; gap:10px; margin-bottom:16px; font-family:var(--dkr-sans); font-size:13px; letter-spacing:.01em; color:var(--dkr-paper); opacity:.92; text-shadow:0 1px 3px rgba(10,5,14,.95), 0 1px 16px rgba(10,5,14,.7); } body.dkr .marq.is-member .marq-kicker::before{ content:""; width:24px; height:1px; background:var(--amber); opacity:.95; } body.dkr .marq.is-member .marq-onphoto .marq-story{ font-size:clamp(30px,3vw,46px); font-weight:600; line-height:1.08; letter-spacing:-.02em; max-width:38ch; text-shadow:0 1px 4px rgba(10,5,14,.96), 0 2px 30px rgba(10,5,14,.6); } body.dkr .marq.is-member .marq-cap{ position:relative; z-index:2; max-width:var(--dkr-max); margin:0 auto; padding:clamp(22px,3.4vh,38px) clamp(18px,5vw,64px) 0; } body.dkr .marq.is-member .marq-welcome{ margin:0; font-weight:600; font-size:clamp(16px,1.7vw,21px); letter-spacing:-.01em; opacity:1; } body.dkr .marq.is-member .marq-subline{ margin:10px 0 0; font-family:var(--dkr-sans); font-size:clamp(14.5px,1.35vw,16.5px); line-height:1.55; color:var(--dkr-muted); max-width:58ch; } body.dkr .marq.is-member .marq-ways{ list-style:none; margin:20px 0 0; padding:0; max-width:min(100%, 830px); display:grid; border-bottom:1px solid rgba(255,255,255,.08); } body.dkr .marq.is-member .marq-ways li{ font-family:var(--dkr-sans); font-size:clamp(14.5px,1.3vw,16px); line-height:1.45; color:rgba(236,233,227,.8); padding:11px 2px; border-top:1px solid rgba(255,255,255,.08); } body.dkr .marq-subline-link{ color:var(--amber); font-weight:500; text-decoration:underline; text-decoration-color:rgba(224,134,74,.4); text-underline-offset:3px; transition:color .16s, text-decoration-color .16s; } body.dkr .marq-subline-link:hover{ color:#eea269; text-decoration-color:#eea269; } body.dkr #where-founders-are-gathering, body.dkr #more-on-echai{ scroll-margin-top:24px; } @media(max-width:640px){ body.dkr .marq.is-member .marq-stage{ height:auto; aspect-ratio:3/2; } body.dkr .marq.is-member .marq-shots::after{ display:none; } body.dkr .marq.is-member .marq-onphoto{ padding:0 22px 18px; } body.dkr .marq.is-member .marq-kicker{ margin-bottom:9px; font-size:12px; } body.dkr .marq.is-member .marq-onphoto .marq-story{ font-size:clamp(21px,5.6vw,28px); letter-spacing:-.015em; max-width:none; text-shadow:0 1px 3px rgba(10,5,14,.96), 0 2px 18px rgba(10,5,14,.65); } body.dkr .marq.is-member .marq-cap{ padding:15px 22px 0; } body.dkr .marq.is-member .marq-welcome{ font-size:16px; } body.dkr .marq.is-member .marq-subline{ font-size:14px; max-width:none; } body.dkr .marq.is-member .marq-ways{ max-width:none; margin:16px 0 0; padding-top:14px; gap:11px; } body.dkr .marq.is-member .marq-ways li{ font-size:14px; } } body.dkr #marq-below{ scroll-margin-top:16px; } body.dkr .marq-partners{ border-top:1px solid var(--dkr-line); background:var(--dkr-black); } body.dkr .marq-partners-inner{ max-width:var(--dkr-max); margin:0 auto; padding:clamp(20px,3.4vw,36px) clamp(18px,5vw,64px); display:flex; align-items:center; gap:clamp(16px,3vw,32px); } body.dkr .marq-partners-label{ flex:0 0 auto; color:var(--dkr-muted); font-size:11px; letter-spacing:.16em; text-transform:uppercase; } body.dkr .marq-partners-row{ display:flex; align-items:center; gap:12px; min-width:0; overflow-x:auto; scrollbar-width:none; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; } body.dkr .marq-partners-row::-webkit-scrollbar{ display:none; } body.dkr .marq-partner{ flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; height:44px; padding:0 16px; background:#fff; border-radius:8px; scroll-snap-align:start; transition:transform .18s var(--dkr-ease); } body.dkr .marq-partner:hover{ transform:translateY(-2px); } body.dkr .marq-partner img{ height:26px; width:auto; max-width:120px; object-fit:contain; display:block; } body.dkr .marq-partner-text{ font-family:var(--dkr-sans); font-weight:600; font-size:13px; color:var(--dkr-black); text-decoration:none; white-space:nowrap; } @media(max-width:640px){ body.dkr .marq-partners-inner{ flex-direction:column; align-items:flex-start; gap:14px; padding:22px; } body.dkr .marq-partners-row{ width:100%; } } body.dkr .mh-body{ position:relative; max-width:var(--dkr-max); margin:0 auto; padding:clamp(44px,6vw,76px) clamp(18px,5vw,64px) 0; } body.dkr .mh-body::before{ content:""; position:absolute; top:-8vh; left:0; right:0; height:60vh; z-index:-1; pointer-events:none; background:radial-gradient(80% 100% at 50% 0%, rgba(32,26,20,.7) 0%, rgba(18,15,12,.35) 34%, transparent 68%); } body.dkr .mh-sec{ margin-top:clamp(44px,6vw,76px); } body.dkr .mh-sec:first-child{ margin-top:0; } body.dkr .mh-eb{ display:flex; align-items:baseline; gap:16px; margin-bottom:24px; } body.dkr .mh-eb-label{ font-family:var(--dkr-sans); font-weight:500; font-size:13px; letter-spacing:.01em; color:var(--dkr-muted); flex:0 0 auto; } body.dkr .mh-eb-rule{ flex:1 1 auto; height:1px; background:linear-gradient(90deg, var(--dkr-line), transparent); } body.dkr .mh-eb-link{ flex:0 0 auto; font-family:var(--dkr-sans); font-size:13px; letter-spacing:0; color:var(--dkr-muted); text-decoration:none; } body.dkr .mh-eb-link:hover{ color:var(--amber); } body.dkr .mh-cityregion{ margin-top:20px; } body.dkr .mh-cityregion:first-child{ margin-top:0; } body.dkr .mh-cityregion-label{ display:block; color:var(--dkr-faint); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:12px; } body.dkr .mh-citygrid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(clamp(150px,20vw,190px),1fr)); gap:1px; background:var(--dkr-line); border:1px solid var(--dkr-line); } body.dkr .mh-citycard{ position:relative; overflow:hidden; display:flex; flex-direction:column; gap:5px; padding:15px 17px; background:var(--dkr-panel); text-decoration:none; transition:background .16s; } body.dkr .mh-citycard:hover{ background:#2f1e3c; } body.dkr .mh-citycard-folded{ display:none; } body.dkr .mh-cities-toggle:checked ~ .mh-citygrid .mh-citycard-folded{ display:flex; } body.dkr .mh-cities-more{ display:inline-block; margin-top:14px; font-family:var(--dkr-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--dkr-muted); cursor:pointer; } body.dkr .mh-cities-more:hover{ color:var(--dkr-paper); } body.dkr .mh-cities-more-hide{ display:none; } body.dkr .mh-cities-toggle:checked ~ .mh-cities-more .mh-cities-more-show{ display:none; } body.dkr .mh-cities-toggle:checked ~ .mh-cities-more .mh-cities-more-hide{ display:inline; } body.dkr .mh-citycard.has-shot{ min-height:96px; justify-content:flex-end; } body.dkr .mh-citycard-shot{ position:absolute; inset:0; z-index:0; } body.dkr .mh-citycard-shot img{ width:100%; height:100%; object-fit:cover; filter:brightness(.66) contrast(1.03) saturate(1.08); transition:filter .5s ease, transform 6s ease; } body.dkr .mh-citycard.has-shot::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(to top, rgba(20,10,26,.95) 0%, rgba(20,10,26,.6) 34%, rgba(20,10,26,.14) 68%, transparent 100%); } body.dkr .mh-citycard.has-shot .mh-citycard-name, body.dkr .mh-citycard.has-shot .mh-citycard-count{ position:relative; z-index:2; text-shadow:0 1px 8px rgba(34,19,43,.75); } body.dkr .mh-citycard.has-shot:hover .mh-citycard-shot img{ filter:brightness(.82) contrast(1.03) saturate(1.14); transform:scale(1.04); } body.dkr .mh-citycard-name{ font-family:var(--dkr-sans); font-weight:500; font-size:15px; color:var(--dkr-paper); } body.dkr .mh-citycard.has-shot .mh-citycard-name{ color:#fff; } body.dkr .mh-citycard-count{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.05em; color:var(--dkr-faint); } body.dkr .mh-citycard-count.is-live{ color:var(--amber); } body.dkr .mh-citycard-more{ display:none; } body.dkr #mh-more-cities:checked ~ .mh-citygrid .mh-citycard-more{ display:flex; } body.dkr .mh-more-btn{ display:inline-flex; align-items:center; gap:8px; margin-top:16px; padding:10px 18px; border:1px solid var(--dkr-line); background:var(--dkr-panel); color:var(--dkr-muted); font-family:var(--dkr-sans); font-size:13px; cursor:pointer; transition:border-color .16s, color .16s; } body.dkr .mh-more-btn:hover{ border-color:#3a2748; color:var(--dkr-paper); } body.dkr .mh-more-hide{ display:none; } body.dkr #mh-more-cities:checked ~ .mh-more-btn .mh-more-show{ display:none; } body.dkr #mh-more-cities:checked ~ .mh-more-btn .mh-more-hide{ display:inline; } body.dkr .mh-hub{ display:grid; grid-template-columns:repeat(auto-fill, minmax(240px,1fr)); gap:14px; } body.dkr .mh-hub-card{ position:relative; display:flex; flex-direction:column; gap:8px; padding:24px; text-decoration:none; border:1px solid #3a254880; overflow:hidden; background:linear-gradient(155deg, #331f42 0%, #271531 55%, #1c0f26 100%); box-shadow:inset 0 1px 0 rgba(255,255,255,.055); transition:border-color .2s, transform .2s, box-shadow .2s; } body.dkr .mh-hub-card::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5; transition:opacity .25s; background:radial-gradient(135% 95% at 100% 0%, rgba(224,134,74,.11) 0%, transparent 56%); } body.dkr .mh-hub-card > *{ position:relative; z-index:1; } body.dkr .mh-hub-card:hover{ border-color:#5f4270; transform:translateY(-3px); box-shadow:0 16px 40px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08); } body.dkr .mh-hub-card:hover::after{ opacity:1; } body.dkr .mh-hub-head{ display:flex; flex-direction:column; gap:5px; padding-right:26px; } body.dkr .mh-hub-name{ font-family:var(--dkr-sans); font-weight:600; font-size:18px; color:var(--dkr-paper); } body.dkr .mh-hub-count{ font-size:10.5px; letter-spacing:.05em; color:var(--amber); } body.dkr .mh-hub-desc{ font-size:13.5px; line-height:1.45; color:var(--dkr-muted); } body.dkr .mh-hub-go{ position:absolute; top:20px; right:20px; color:var(--dkr-faint); transition:color .18s, transform .18s; } body.dkr .mh-hub-card:hover .mh-hub-go{ color:var(--amber); transform:translateX(3px); } body.dkr .mh-hub-peek{ margin:5px 0 1px; } body.dkr .mh-hub-peek ~ .mh-hub-desc{ margin-top:auto; } body.dkr .mh-hub-thumbs{ display:flex; gap:6px; height:54px; overflow:hidden; -webkit-mask-image:linear-gradient(90deg, #000 80%, transparent); mask-image:linear-gradient(90deg, #000 80%, transparent); } body.dkr .mh-hub-thumb{ flex:0 0 auto; height:54px; border-radius:5px; overflow:hidden; border:1px solid rgba(255,255,255,.07); background:#1a0f24; } body.dkr .mh-hub-thumb img{ display:block; height:100%; width:auto; } body.dkr .mh-hub-faces{ display:flex; height:54px; align-items:center; } body.dkr .mh-hub-face{ width:36px; height:36px; border-radius:50%; overflow:hidden; border:2px solid #241530; background:#1a0f24; margin-left:-11px; } body.dkr .mh-hub-face:first-child{ margin-left:0; } body.dkr .mh-hub-face img{ width:100%; height:100%; object-fit:cover; } body.dkr .mh-hub-items{ display:flex; flex-direction:column; justify-content:center; gap:4px; min-height:54px; } body.dkr .mh-hub-item{ position:relative; padding-left:12px; font-size:12px; line-height:1.3; color:var(--dkr-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } body.dkr .mh-hub-item::before{ content:""; position:absolute; left:0; top:.5em; width:4px; height:4px; border-radius:50%; background:var(--amber); opacity:.65; } body.dkr .mh-pulse{ list-style:none; margin:0; padding:0; border-top:1px solid var(--dkr-line); } body.dkr .mh-pulse-row{ border-bottom:1px solid var(--dkr-line); } body.dkr .mh-pulse-link{ display:flex; align-items:center; gap:14px; padding:14px 4px; text-decoration:none; transition:background .16s; } body.dkr .mh-pulse-link:hover{ background:rgba(255,255,255,.015); } body.dkr .mh-pulse-face{ position:relative; flex:0 0 auto; width:44px; height:44px; border-radius:50%; overflow:hidden; background:linear-gradient(150deg, #2c1d36, #1e1128); border:1px solid var(--dkr-line); } body.dkr .mh-pulse-face img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(1) brightness(.92); transition:filter .4s ease; } body.dkr .mh-pulse-link:hover .mh-pulse-face img{ filter:grayscale(0) brightness(1); } body.dkr .mh-pulse-initial{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:var(--dkr-sans); font-weight:600; font-size:16px; color:var(--dkr-muted); } body.dkr .mh-pulse-body{ min-width:0; display:flex; flex-direction:column; gap:4px; } body.dkr .mh-pulse-text{ font-family:var(--dkr-sans); font-size:15px; line-height:1.4; color:var(--dkr-muted); } body.dkr .mh-pulse-name{ font-weight:600; color:var(--dkr-paper); } body.dkr .mh-pulse-item{ color:var(--dkr-paper); } body.dkr .mh-pulse-link:hover .mh-pulse-item{ color:var(--amber); } body.dkr .mh-pulse-time{ font-family:var(--dkr-sans); font-size:12px; letter-spacing:0; color:var(--dkr-faint); } body.dkr .mh-pulse-more{ display:inline-flex; align-items:center; gap:8px; margin-top:16px; font-family:var(--dkr-sans); font-size:14px; color:var(--dkr-muted); text-decoration:none; transition:color .16s; } body.dkr .mh-pulse-more:hover{ color:var(--amber); } body.dkr .mh-brandwall{ max-width:var(--dkr-max); margin:clamp(28px,3.5vw,48px) auto 0; padding:0 clamp(18px,5vw,64px); } body.dkr .mh-brands{ display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--dkr-line); border:1px solid var(--dkr-line); } @media(max-width:760px){ body.dkr .mh-brands{ grid-template-columns:repeat(2,1fr); } } body.dkr .mh-brand{ display:flex; align-items:center; justify-content:center; min-height:104px; padding:18px 24px; background:#e7e2d8; } body.dkr .mh-brand-logo{ max-width:82%; max-height:62px; width:auto; height:auto; object-fit:contain; mix-blend-mode:multiply; transition:transform .18s; } body.dkr .mh-brand:hover .mh-brand-logo{ transform:scale(1.05); } body.dkr .mh-footer{ border-top:1px solid var(--dkr-line); margin-top:0; padding:clamp(38px,5vw,60px) 0 clamp(30px,4vw,44px); } body.dkr .mh-footer-inner{ max-width:var(--dkr-max); margin:0 auto; padding:0 clamp(18px,5vw,64px); } body.dkr .mh-footer-top{ display:flex; justify-content:space-between; gap:32px 48px; flex-wrap:wrap; } body.dkr .mh-footer-brand{ max-width:34ch; } body.dkr .mh-footer-word{ display:inline-block; font-family:var(--font-serif); font-style:italic; font-size:26px; letter-spacing:.01em; color:var(--dkr-paper); text-decoration:none; } body.dkr .mh-footer-tag{ margin:14px 0 0; font-family:var(--dkr-sans); font-size:14px; line-height:1.5; color:var(--dkr-muted); } body.dkr .mh-footer-cols{ display:flex; gap:clamp(30px,5vw,80px); flex-wrap:wrap; } body.dkr .mh-footer-col{ display:flex; flex-direction:column; gap:11px; } body.dkr .mh-footer-col-head{ font-family:var(--dkr-sans); font-size:12px; letter-spacing:.02em; color:var(--dkr-faint); margin-bottom:3px; } body.dkr .mh-footer-col a{ font-family:var(--dkr-sans); font-size:14px; color:var(--dkr-muted); text-decoration:none; transition:color .16s; } body.dkr .mh-footer-col a:hover{ color:var(--amber); } body.dkr .mh-footer-bottom{ display:flex; justify-content:space-between; gap:16px 24px; flex-wrap:wrap; margin-top:clamp(28px,4vw,44px); padding-top:20px; border-top:1px solid var(--dkr-line); } body.dkr .mh-footer-copy{ font-family:var(--dkr-sans); font-size:12.5px; color:var(--dkr-faint); } body.dkr .mh-footer-legal{ display:flex; gap:20px; flex-wrap:wrap; } body.dkr .mh-footer-legal a{ font-family:var(--dkr-sans); font-size:12.5px; color:var(--dkr-faint); text-decoration:none; transition:color .16s; } body.dkr .mh-footer-legal a:hover{ color:var(--dkr-paper); } body.dkr .prog{ max-width:var(--dkr-max); margin:0 auto; padding:clamp(28px,5vw,56px) clamp(18px,5vw,64px) clamp(48px,7vw,80px); } body.dkr .prog-eyebrow{ color:var(--dkr-muted); margin-bottom:18px; } body.dkr .prog-h1{ font-family:var(--dkr-sans); font-weight:640; font-stretch:112%; font-size:clamp(38px,7vw,88px); line-height:1.0; letter-spacing:var(--dkr-track-display); max-width:15ch; text-wrap:balance; margin:0; color:var(--dkr-paper); } body.dkr .prog-standfirst{ margin:22px 0 0; font-family:var(--dkr-sans); font-size:clamp(15px,1.6vw,19px); line-height:1.5; color:var(--dkr-muted); max-width:52ch; } body.dkr .prog-state{ display:flex; align-items:center; flex-wrap:wrap; gap:0 14px; margin-top:clamp(28px,4vw,44px); padding:16px 0; border-top:1px solid var(--dkr-line); border-bottom:1px solid var(--dkr-line); color:var(--dkr-muted); font-variant-numeric:tabular-nums; } body.dkr .prog-dot{ color:var(--dkr-faint); } body.dkr .prog-state-link{ color:inherit; text-decoration:none; border-bottom:1px solid var(--dkr-line); transition:color .16s, border-color .16s; } body.dkr .prog-state-link:hover{ color:var(--amber); border-color:var(--amber); } body.dkr .prog-cities-section{ margin-top:clamp(26px,4vw,42px); } body.dkr .prog-cityregion{ margin-top:22px; } body.dkr .prog-cityregion:first-of-type{ margin-top:0; } body.dkr .prog-cityregion-label{ display:block; color:var(--dkr-faint); font-size:10.5px; letter-spacing:.14em; margin-bottom:12px; } body.dkr .prog-citygrid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:1px; background:var(--dkr-line); border:1px solid var(--dkr-line); } body.dkr .prog-citycard{ position:relative; overflow:hidden; display:flex; flex-direction:column; gap:4px; padding:11px 14px; background:var(--dkr-black); text-decoration:none; transition:background .16s; } body.dkr .prog-citycard:hover{ background:var(--dkr-panel); } body.dkr .prog-citycard.is-active{ background:var(--dkr-panel); box-shadow:inset 2px 0 0 var(--amber); } body.dkr .prog-citycard-name{ font-family:var(--dkr-sans); font-weight:500; font-size:15px; color:var(--dkr-paper); } body.dkr .prog-citycard-count{ font-size:10.5px; letter-spacing:.05em; color:var(--dkr-faint); } body.dkr .prog-citycard-count.is-live{ color:var(--amber); } body.dkr .prog-citycard.has-shot{ min-height:62px; justify-content:flex-end; } body.dkr .prog-citycard-shot{ position:absolute; inset:0; z-index:0; } body.dkr .prog-citycard-shot img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) sepia(.35) hue-rotate(-6deg) brightness(.5) contrast(1.05); transition:filter .5s ease, transform 6s ease; } body.dkr .prog-citycard.has-shot::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(to top, rgba(34,19,43,.92) 0%, rgba(34,19,43,.45) 46%, rgba(34,19,43,.12) 100%); } body.dkr .prog-citycard.has-shot .prog-citycard-name, body.dkr .prog-citycard.has-shot .prog-citycard-count{ position:relative; z-index:2; } body.dkr .prog-citycard.has-shot .prog-citycard-name{ color:#fff; } body.dkr .prog-citycard.has-shot .prog-citycard-count{ color:rgba(255,255,255,.72); } body.dkr .prog-citycard.has-shot .prog-citycard-count.is-live{ color:var(--amber); } body.dkr .prog-citycard.has-shot:hover .prog-citycard-shot img{ filter:grayscale(0) brightness(.72) contrast(1.05); transform:scale(1.04); } body.dkr .prog-view{ margin-top:clamp(32px,5vw,56px); } body.dkr .prog-radio{ position:absolute; opacity:0; pointer-events:none; } body.dkr .prog-tabs{ display:flex; align-items:center; gap:22px; padding-bottom:14px; border-bottom:1px solid var(--dkr-line); } body.dkr .prog-tab{ font-family:var(--dkr-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-faint); cursor:pointer; padding-bottom:2px; border-bottom:1px solid transparent; transition:color .16s; } body.dkr .prog-tab:hover{ color:var(--dkr-muted); } body.dkr #prog_up:checked ~ .prog-tabs .prog-tab-up, body.dkr #prog_past:checked ~ .prog-tabs .prog-tab-past{ color:var(--dkr-paper); border-bottom-color:var(--amber); } body.dkr .prog-tabs-rule{ flex:1 1 auto; } body.dkr .prog-admin-link{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--dkr-muted); text-decoration:none; } body.dkr .prog-admin-link:hover{ color:var(--dkr-paper); } body.dkr .prog-panel{ display:none; } body.dkr #prog_up:checked ~ .prog-panel-up{ display:block; } body.dkr #prog_past:checked ~ .prog-panel-past{ display:block; } body.dkr .prog-bucket-head{ display:flex; align-items:center; gap:16px; margin:clamp(28px,3vw,40px) 0 4px; } body.dkr .prog-bucket-head:first-child{ margin-top:8px; } body.dkr .prog-bucket-label{ color:var(--dkr-paper); font-size:12px; letter-spacing:.16em; flex:0 0 auto; } body.dkr .prog-bucket-rule{ flex:1 1 auto; height:1px; background:var(--dkr-line); } body.dkr .prog-bucket-count{ color:var(--dkr-faint); font-size:11px; letter-spacing:.08em; flex:0 0 auto; } body.dkr .prog-list{ list-style:none; margin:0; padding:0; } body.dkr .prog-row{ border-bottom:1px solid var(--dkr-line); } body.dkr .prog-row-link{ display:grid; grid-template-columns:clamp(58px,7vw,86px) 1fr auto; align-items:center; gap:clamp(16px,3vw,40px); padding:clamp(18px,2.4vw,28px) 0 clamp(18px,2.4vw,28px) clamp(0px,1.4vw,18px); text-decoration:none; color:var(--dkr-paper); } body.dkr .prog-row-rsvp{ display:grid; grid-template-columns:clamp(58px,7vw,86px) 1fr auto; align-items:center; gap:clamp(16px,3vw,40px); padding:clamp(18px,2.4vw,28px) 0 clamp(18px,2.4vw,28px) clamp(0px,1.4vw,18px); } body.dkr .prog-row-open{ display:contents; color:var(--dkr-paper); text-decoration:none; } body.dkr .prog-row-open:hover .prog-title{ color:#fff; } body.dkr .prog-rsvp-wrap{ display:inline-flex; } body.dkr .prog-rsvp-wrap form.button_to{ margin:0; } body.dkr .prog-rsvp{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--dkr-paper); text-decoration:none; padding:9px 15px; border:1px solid var(--dkr-line); background:transparent; cursor:pointer; white-space:nowrap; transition:background .16s, border-color .16s, color .16s; } body.dkr .prog-rsvp:hover{ background:var(--dkr-paper); border-color:var(--dkr-paper); color:var(--dkr-black); } body.dkr .prog-rsvp.is-going{ border-color:transparent; background:transparent; padding-left:0; padding-right:0; color:var(--dkr-muted); cursor:default; white-space:nowrap; } body.dkr .prog-rsvp.is-off{ color:var(--dkr-muted); cursor:default; } body.dkr .prog-rsvp.is-off:hover{ background:transparent; border-color:var(--dkr-line); color:var(--dkr-muted); } body.dkr .prog-rsvp.is-going span{ color:var(--amber); } body.dkr .prog-rsvp.is-going:hover{ background:transparent; color:var(--dkr-muted); } body.dkr .prog-date{ position:relative; display:flex; flex-direction:column; align-items:flex-start; line-height:1; } body.dkr .prog-dow{ color:var(--dkr-muted); font-size:11px; letter-spacing:.14em; margin-bottom:8px; } body.dkr .prog-day{ font-family:var(--dkr-sans); font-weight:300; font-size:clamp(30px,3.6vw,46px); font-variant-numeric:tabular-nums slashed-zero; font-feature-settings:"zero" 1; letter-spacing:-.01em; } body.dkr .prog-mon{ color:var(--dkr-muted); font-size:11px; letter-spacing:.14em; margin-top:7px; } body.dkr .prog-main{ min-width:0; display:flex; flex-direction:column; gap:8px; } body.dkr .prog-next-tag{ color:var(--amber); font-size:10px; letter-spacing:.16em; text-transform:uppercase; } body.dkr .prog-title{ font-family:var(--dkr-sans); font-weight:600; font-size:clamp(20px,2.9vw,36px); line-height:1.1; letter-spacing:-.015em; } body.dkr .prog-credit{ color:var(--dkr-muted); font-size:11.5px; letter-spacing:.06em; } body.dkr .prog-host{ color:var(--dkr-soft, var(--ink-soft)); font-size:11.5px; letter-spacing:.06em; } body.dkr .prog-status{ color:var(--dkr-muted); font-size:11px; letter-spacing:.06em; white-space:nowrap; } body.dkr .prog-status.is-live{ color:var(--amber); } body.dkr .prog-end{ display:flex; align-items:center; gap:16px; flex:0 0 auto; } body.dkr .prog-going{ color:var(--dkr-muted); font-size:11px; letter-spacing:.06em; } body.dkr .prog-arrow{ color:var(--dkr-muted); font-size:18px; transition:transform .18s, color .18s; } body.dkr .prog-row-link:hover .prog-arrow{ transform:translateX(4px); color:var(--dkr-paper); } body.dkr .prog-row-link:hover .prog-title{ color:#fff; } body.dkr .prog-more{ display:inline-block; margin-top:22px; font-family:var(--dkr-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--dkr-muted); text-decoration:none; } body.dkr .prog-more:hover{ color:var(--dkr-paper); } body.dkr .prog-empty{ padding:32px 0; color:var(--dkr-muted); font-size:15px; max-width:46ch; } body.dkr .prog-empty-link{ color:var(--amber); text-decoration:none; white-space:nowrap; } body.dkr .ldg-proposed{ margin-top:clamp(30px,3.5vw,44px); } body.dkr .ledger .ldg-proposed .ldg-edition-head{ margin:0 0 18px; } body.dkr .proposed-note{ margin:0 0 16px; color:var(--dkr-muted); font-size:14px; line-height:1.6; max-width:62ch; } body.dkr .prog-proposed .proposed-note{ margin-top:12px; } body.dkr .prog-proposed-grid, body.dkr .ldg-proposed-grid{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:8px; } body.dkr .prog-proposed-grid > li, body.dkr .ldg-proposed-grid > li{ display:flex; } body.dkr .prog-proposed-city, body.dkr .ldg-proposed-city{ display:flex; flex-wrap:wrap; width:100%; align-items:baseline; justify-content:space-between; gap:4px 10px; padding:12px 14px; border:1px solid var(--dkr-line); border-radius:10px; text-decoration:none; transition:border-color .2s, background-color .2s; } body.dkr .prog-proposed-city:hover, body.dkr .ldg-proposed-city:hover{ border-color:var(--amber); background:rgba(224,134,74,.06); } body.dkr .prog-proposed-name, body.dkr .ldg-proposed-name{ color:var(--dkr-paper); font-family:var(--dkr-sans); font-size:15px; overflow-wrap:break-word; } body.dkr .prog-proposed-count, body.dkr .ldg-proposed-count{ color:var(--dkr-faint); font-size:11px; letter-spacing:.06em; white-space:nowrap; } body.dkr .ldg-proposed-grid > li.ldg-proposed-folded{ display:none; } body.dkr .ldg-proposed-toggle:checked ~ .ldg-proposed-grid > li.ldg-proposed-folded{ display:flex; } body.dkr .ldg-proposed-more{ display:inline-block; margin-top:14px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--dkr-muted); cursor:pointer; } body.dkr .ldg-proposed-more:hover{ color:var(--dkr-paper); } body.dkr .ldg-proposed-more-hide{ display:none; } body.dkr .ldg-proposed-toggle:checked ~ .ldg-proposed-more .ldg-proposed-more-show{ display:none; } body.dkr .ldg-proposed-toggle:checked ~ .ldg-proposed-more .ldg-proposed-more-hide{ display:inline; } body.dkr .proposal-share-line{ margin:14px 0 6px; color:var(--dkr-paper); font-family:var(--dkr-sans); font-size:14px; font-weight:500; } body.dkr .proposal-share{ align-self:flex-start; padding:10px 18px; border:1px solid var(--dkr-line); border-radius:12px; background:transparent; color:var(--dkr-paper); font-family:var(--dkr-sans); font-size:14px; cursor:pointer; transition:border-color .2s, color .2s; } body.dkr .proposal-share:hover{ border-color:var(--amber); color:var(--amber); } body.dkr .proposal-share:disabled{ opacity:.7; cursor:default; } body.dkr .prog-fallback-note{ margin:0 0 clamp(20px,3vw,30px); color:var(--dkr-muted); font-family:var(--dkr-sans); font-size:14px; max-width:52ch; } body.dkr .prog-strip{ display:flex; gap:14px; overflow-x:auto; scrollbar-width:none; scroll-snap-type:x proximity; margin:22px 0 6px; padding-bottom:4px; } body.dkr .prog-strip::-webkit-scrollbar{ display:none; } @media(min-width:1024px){ body.dkr .prog-strip{ margin-right:calc(50% - 50vw); padding-right:clamp(18px,5vw,64px); } } body.dkr .prog-frame{ flex:0 0 min(72vw,360px); scroll-snap-align:start; text-decoration:none; color:var(--dkr-paper); } body.dkr .prog-frame-shot{ display:block; aspect-ratio:3/2; overflow:hidden; background:var(--dkr-panel); } body.dkr .prog-frame-shot img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(1) sepia(.35) hue-rotate(-6deg) contrast(1.04) brightness(.92); transition:filter .5s var(--dkr-ease); } body.dkr .prog-frame:hover .prog-frame-shot img{ filter:none; } body.dkr .prog-frame-cap{ margin-top:9px; color:var(--dkr-muted); } body.dkr .prog-section{ margin-top:clamp(44px,6vw,72px); } body.dkr .prog-eb{ display:flex; align-items:center; gap:18px; margin-bottom:24px; } body.dkr .prog-eb-label{ color:var(--dkr-muted); flex:0 0 auto; } body.dkr .prog-eb-rule{ flex:1 1 auto; height:1px; background:var(--dkr-line); } body.dkr .prog-eb-link{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--dkr-muted); text-decoration:none; flex:0 0 auto; } body.dkr .prog-eb-link:hover{ color:var(--dkr-paper); } body.dkr .prog-faces{ display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:clamp(14px,1.6vw,22px); } body.dkr .prog-face-link{ display:block; text-decoration:none; color:inherit; } body.dkr .evrow-list{ list-style:none; margin:0; padding:0; } body.dkr .evrow{ display:grid; grid-template-columns:clamp(48px,6vw,72px) 1fr; gap:clamp(16px,2.4vw,28px); align-items:start; padding:clamp(18px,2.2vw,26px) 0; border-bottom:1px solid var(--dkr-line); } body.dkr .evrow-date{ display:block; text-decoration:none; color:var(--dkr-paper); padding-top:3px; } body.dkr .evrow-main{ min-width:0; display:flex; flex-direction:column; gap:9px; } body.dkr .evrow-kicker{ align-self:flex-start; color:var(--amber); font-size:11px; letter-spacing:.14em; text-decoration:none; margin-bottom:-2px; transition:color .16s; } body.dkr a.evrow-kicker:hover{ color:#eea269; } body.dkr a.evrow-title{ display:block; text-decoration:none; color:var(--dkr-paper); } body.dkr a.evrow-title:hover{ color:#fff; } body.dkr .evrow-main .prog-credit{ white-space:normal; letter-spacing:.1em; } body.dkr .evrow-meta{ display:flex; flex-direction:column; gap:4px; } body.dkr .evrow-meta-item{ display:block; } body.dkr .evrow-meta-sep{ display:none; } @media(min-width:1024px){ body.dkr .evrow-meta{ flex-direction:row; flex-wrap:wrap; align-items:baseline; } body.dkr .evrow-meta-sep{ display:inline; margin:0 8px; color:var(--dkr-faint); } } body.dkr .evrow-social{ display:flex; flex-wrap:wrap; align-items:center; gap:7px 10px; margin-top:3px; } body.dkr .evrow-note{ font-size:11px; letter-spacing:.1em; color:var(--dkr-muted); } @media(max-width:620px){ body.dkr .prog-row-link{ grid-template-columns:48px 1fr; gap:16px; } body.dkr .prog-end{ display:none; } body.dkr .prog-row-rsvp{ grid-template-columns:44px 1fr; gap:14px 16px; } body.dkr .prog-row-rsvp .prog-end{ grid-column:1 / -1; display:flex; align-items:center; margin-top:2px; } body.dkr .prog-row-rsvp .prog-end .dkr-going-stack, body.dkr .prog-row-rsvp .prog-end .prog-status{ display:none; } body.dkr .prog-rsvp{ padding:9px 16px; font-size:11px; } body.dkr .prog-day{ font-size:26px; } body.dkr .prog-title{ font-size:19px; } } body.dkr .dkr-detail{ max-width:var(--dkr-max); margin-inline:auto; padding:clamp(8px,3vw,20px) clamp(18px,5vw,64px) clamp(48px,7vw,72px); } body.dkr .dkr-detail > *{ max-width:768px; } @media(min-width:1024px){ body.dkr .dkr-detail .dkr-past-section{ max-width:none; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); padding-left:calc((100vw - min(100vw, var(--dkr-max))) / 2 + clamp(18px,5vw,64px)); padding-right:0; } body.dkr .dkr-detail .dkr-past-section .event-past-strip{ margin:0; padding-left:0; padding-right:clamp(18px,5vw,64px); } } body.dkr .dkr-area-invite .dkr-standfirst{ white-space:pre-line; } body.dkr .dkr-detail input, body.dkr .dkr-detail textarea, body.dkr .dkr-detail select{ background:var(--dkr-panel); color:var(--dkr-paper); border-color:var(--dkr-line); } body.dkr .dkr-detail input::placeholder, body.dkr .dkr-detail textarea::placeholder{ color:var(--dkr-faint); } body.dkr .dkr-detail img{ width:auto; height:auto; max-width:100%; } body.dkr .dkr-detail .event-snapshot-img, body.dkr .dkr-detail .event-past-cover-img{ width:100%; height:100%; object-fit:cover; } body.dkr .dkr-detail .cta-btn, body.dkr .dkr-detail .proposal-cta, body.dkr .dkr-detail .rsvp-prepicker-submit{ background:var(--dkr-paper); color:var(--dkr-black); border-color:transparent; } body.dkr .dkr-detail .cta-btn-link, body.dkr .dkr-detail .proposal-cta-out{ background:transparent; color:var(--dkr-paper); border:1px solid var(--dkr-line); } body.dkr .cta-btn:not(.cta-btn-outline):not(.cta-btn-link){ background:var(--dkr-paper); color:var(--dkr-black); box-shadow:0 2px 12px rgba(0,0,0,.4); } body.dkr .cta-btn:not(.cta-btn-outline):not(.cta-btn-link):hover{ background:#fff; } body.dkr .text-input{ background:var(--dkr-panel); border-color:var(--dkr-line); color:var(--dkr-paper); } body.dkr .text-input::placeholder{ color:var(--dkr-faint); } body.dkr .text-input:focus{ border-color:var(--amber); background:#251731; } body.dkr .edit-group-helper a{ color:var(--amber); text-decoration-color:rgba(213,138,74,.5); } body.dkr .edit-group-helper a:hover{ text-decoration-color:var(--amber); } body.dkr .flash-notice{ background:var(--amber); color:#161009; } body.dkr .account-section{ background:var(--dkr-panel); border:1px solid var(--dkr-line); border-radius:10px; } body.dkr .account-section--danger{ border-color:rgba(200,74,26,.4); } body.dkr .account-section-title{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-.01em; color:var(--dkr-paper); } body.dkr .account-section-note, body.dkr .account-toggle-desc, body.dkr .account-cat-desc, body.dkr .account-mail-meta{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .account-stat{ background:#251731; border-color:var(--dkr-line); } body.dkr .account-stat-num{ font-family:var(--dkr-mono); font-weight:400; font-size:22px; color:var(--dkr-paper); } body.dkr .account-stat-label{ font-family:var(--dkr-mono); font-size:9.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .account-link{ color:var(--amber); } body.dkr .account-link--danger{ color:#d0644a; } body.dkr .account-toggle-name, body.dkr .account-cat-name, body.dkr .account-mail-subject{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .account-cat-control{ font-family:var(--dkr-mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .account-cat, body.dkr .account-mail{ border-color:var(--dkr-line); } body.dkr .account-btn--ghost{ background:transparent; color:var(--dkr-paper); border-color:var(--dkr-line); } body.dkr .gallery-scope{ background:var(--dkr-panel); border:1px solid var(--dkr-line); color:var(--dkr-muted); } body.dkr .gallery-scope:hover{ border-color:var(--dkr-muted); color:var(--dkr-paper); } body.dkr .gallery-scope-admin{ color:var(--amber); } body.dkr .gallery-marquee-image{ background:#251731; border:1px solid var(--dkr-line); box-shadow:0 10px 34px rgba(0,0,0,.55); } body.dkr .gallery-event-title{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-.015em; color:var(--dkr-paper); } body.dkr .gallery-event-meta{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.03em; color:var(--dkr-faint); } body.dkr .gallery-event-cta{ font-family:var(--dkr-sans); color:var(--amber); } body.dkr .gallery-event-share{ color:var(--dkr-muted); } body.dkr .gallery-event-share:hover{ color:var(--amber); } body.dkr .gallery-event-face, body.dkr .gallery-event-face-more{ border-color:var(--dkr-black); background:#251731; } body.dkr .gallery-event-face-more{ font-family:var(--dkr-mono); color:var(--dkr-muted); } body.dkr .gallery-event-strip-tile{ background:#251731; border:1px solid var(--dkr-line); } body.dkr .hub-empty{ color:var(--dkr-muted); } body.dkr .hub-empty-link{ color:var(--amber); } body.dkr .dkr-grain{ position:fixed; inset:0; z-index:9; pointer-events:none; opacity:.055; mix-blend-mode:overlay; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); } body.dkr .dkr-mono{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.22em; text-transform:uppercase; font-feature-settings:"zero" 1; font-variant-numeric:slashed-zero tabular-nums; } body.dkr .dkr-muted{ color:var(--dkr-muted); } body.dkr .dkr-flash{ position:fixed; top:0; left:0; right:0; z-index:20; display:flex; justify-content:center; padding:14px; pointer-events:none; } body.dkr .dkr-flash div{ background:var(--dkr-paper); color:var(--dkr-black); font-family:var(--dkr-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; padding:10px 18px; } body.dkr .dkr-chrome{ position:absolute; top:0; left:0; right:0; z-index:8; display:flex; justify-content:space-between; align-items:center; max-width:var(--dkr-max); margin-inline:auto; padding:20px clamp(18px,5vw,64px); } body.dkr .dkr-chrome .dkr-mark{ display:flex; align-items:center; } body.dkr .dkr-logo{ width:auto; height:22px; object-fit:contain; opacity:.6; filter:drop-shadow(0 1px 10px rgba(0,0,0,.9)); transition:opacity .25s; } body.dkr .dkr-mark:hover .dkr-logo{ opacity:.8; } body.dkr .dkr-chrome nav{ display:flex; gap:22px; } body.dkr .dkr-chrome nav a{ color:#fff; font-family:var(--dkr-mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; opacity:.9; text-shadow:0 1px 8px rgba(0,0,0,.7); } @media(max-width:640px){ body.dkr .dkr-chrome nav{ display:none; } } body.dkr .dkr-hero{ position:relative; height:clamp(300px, 46vh, 500px); overflow:hidden; } body.dkr .dkr-hero .dkr-shot{ position:absolute; inset:0; animation:dkr-kb 36s var(--dkr-ease) infinite alternate; } body.dkr .dkr-hero .dkr-shot img{ filter:saturate(1.04) contrast(1.03) brightness(.97); } @keyframes dkr-kb{ from{ transform:scale(1.015); } to{ transform:scale(1.045) translateY(-1%); } } body.dkr .dkr-hero::after{ content:""; position:absolute; inset:0; z-index:2; background: linear-gradient(180deg, rgba(34,19,43,.55) 0%, rgba(34,19,43,.18) 10%, transparent 26%), linear-gradient(180deg, transparent 0%, transparent 44%, rgba(34,19,43,.28) 62%, rgba(34,19,43,.62) 78%, rgba(34,19,43,.9) 91%, rgba(34,19,43,.98) 100%); } body.dkr .dkr-hero .dkr-cap{ position:absolute; z-index:3; left:0; right:0; bottom:clamp(22px,4vh,44px); max-width:var(--dkr-max); margin-inline:auto; padding:0 clamp(18px,5vw,64px); } body.dkr .dkr-cap-row{ display:flex; align-items:center; gap:clamp(15px,2.2vw,24px); } body.dkr .dkr-cap-row h1{ min-width:0; } body.dkr .dkr-datecard{ flex:0 0 auto; width:clamp(70px,8vw,86px); border-radius:9px; overflow:hidden; text-align:center; background:rgba(34,19,43,.5); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border:1px solid rgba(240,238,233,.15); box-shadow:0 12px 34px rgba(0,0,0,.45); } body.dkr .dkr-datecard-dow{ display:block; padding:4px 0; background:var(--amber); color:#161009; font-family:var(--dkr-mono); font-weight:600; font-size:11px; letter-spacing:.16em; } body.dkr .dkr-datecard-day{ display:block; padding-top:8px; font-family:var(--dkr-sans); font-weight:700; font-size:clamp(28px,3.4vw,38px); line-height:1; color:var(--dkr-paper); } body.dkr .dkr-datecard-mon{ display:block; padding:2px 0 9px; font-family:var(--dkr-mono); font-size:11px; letter-spacing:.16em; color:var(--dkr-paper); opacity:.85; } @media(max-width:720px){ body.dkr .dkr-datecard{ width:58px; border-radius:7px; } body.dkr .dkr-datecard-day{ font-size:25px; } } body.dkr .dkr-hero-city{ display:inline-flex; align-items:center; margin-bottom:12px; padding:5px 11px; border-radius:6px; background:rgba(20,10,26,.5); backdrop-filter:blur(3px); font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--amber); text-decoration:none; text-shadow:0 1px 3px rgba(20,10,26,.9); transition:color .16s, background .16s; } body.dkr .dkr-hero-city:hover{ color:#f0a060; } body.dkr .dkr-cover-tools{ position:absolute; z-index:5; top:14px; right:14px; margin:0; display:flex; flex-direction:column; align-items:flex-end; gap:10px; } body.dkr .dkr-cover-adjust{ padding:6px 12px; border-radius:999px; cursor:pointer; background:rgba(34,19,43,.5); backdrop-filter:blur(6px); border:1px solid rgba(240,238,233,.28); font-family:var(--dkr-sans); font-size:12px; color:var(--dkr-paper); opacity:.82; transition:opacity .16s, background .16s; } body.dkr .dkr-cover-adjust:hover{ opacity:1; background:rgba(34,19,43,.72); } body.dkr .dkr-cover-edit{ display:none; align-items:center; gap:8px; padding:6px; border-radius:999px; background:rgba(34,19,43,.62); backdrop-filter:blur(6px); border:1px solid rgba(240,238,233,.22); } body.dkr .dkr-shot.is-adjusting ~ .dkr-cover-tools .dkr-cover-edit{ display:flex; } body.dkr .dkr-cover-zoom{ display:flex; align-items:center; gap:4px; } body.dkr .dkr-cover-zoom-btn{ width:26px; height:26px; border-radius:50%; cursor:pointer; border:1px solid rgba(240,238,233,.28); background:none; color:var(--dkr-paper); font-size:15px; line-height:1; display:flex; align-items:center; justify-content:center; } body.dkr .dkr-cover-zoom-btn:hover{ background:rgba(240,238,233,.12); } body.dkr .dkr-cover-zoom-label{ min-width:38px; text-align:center; font-family:var(--dkr-sans); font-size:12px; color:var(--dkr-paper); } body.dkr .dkr-cover-save{ padding:6px 14px; border-radius:999px; cursor:pointer; border:0; background:var(--amber); color:#161009; font-family:var(--dkr-sans); font-weight:600; font-size:12px; } body.dkr .dkr-cover-save:hover{ background:#eea269; } body.dkr .dkr-shot.is-adjusting{ animation:none; cursor:crosshair; touch-action:none; } body.dkr .dkr-shot img{ -webkit-user-drag:none; } body.dkr .dkr-shot.is-adjusting .focal-marker{ opacity:1; } body.dkr .dkr-hero::after{ pointer-events:none; } body.dkr .dkr-shot.is-adjusting ~ .dkr-cap{ pointer-events:none; } body.dkr .dkr-cover-otherview{ position:absolute; z-index:5; left:16px; bottom:16px; display:none; pointer-events:none; } body.dkr .dkr-shot.is-adjusting ~ .dkr-cover-otherview{ display:block; } body.dkr .dkr-cover-otherview-label{ display:block; margin-bottom:6px; font-family:var(--dkr-sans); font-size:11px; color:var(--dkr-paper); text-shadow:0 1px 4px rgba(34,19,43,.85); } body.dkr .dkr-cover-otherview-frame{ width:150px; aspect-ratio:4/3; overflow:hidden; border:1px solid rgba(240,238,233,.5); box-shadow:0 8px 24px rgba(34,19,43,.55); background:var(--dkr-panel); } body.dkr .dkr-cover-otherview-frame img{ width:100%; height:100%; object-fit:cover; display:block; } body.dkr .dkr-cover-otherview .ov-on-mobile{ display:none; } @media(max-width:720px){ body.dkr .dkr-cover-otherview .ov-on-desktop{ display:none; } body.dkr .dkr-cover-otherview .ov-on-mobile{ display:inline; } body.dkr .dkr-cover-otherview-frame{ width:210px; aspect-ratio:7/2; } } @media(max-width:720px){ body.dkr .dkr-hero{ height:clamp(184px,27vh,240px); } body.dkr .dkr-hero .dkr-cap{ bottom:16px; } } body.dkr .dkr-hero .dkr-kick{ color:var(--dkr-paper); opacity:.85; margin-bottom:20px; } body.dkr .dkr-hero h1{ font-weight:600; font-size:clamp(30px,5.4vw,68px); line-height:1.02; letter-spacing:-.02em; max-width:19ch; text-wrap:balance; margin:0; text-shadow:0 1px 3px rgba(34,19,43,.85), 0 2px 30px rgba(34,19,43,.55); } body.dkr .dkr-hero .dkr-cap .dkr-mono{ text-shadow:0 1px 16px rgba(34,19,43,.6); } body.dkr .dkr-hero .dkr-credit{ display:flex; gap:22px; flex-wrap:wrap; margin-top:26px; } body.dkr .dkr-hero .dkr-credit span{ color:var(--dkr-muted); } body.dkr .dkr-credit-row{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; margin-top:24px; } body.dkr .dkr-chip{ font-family:var(--dkr-sans); font-weight:600; font-size:12.5px; letter-spacing:.01em; color:var(--dkr-black); background:var(--dkr-paper); padding:6px 13px; border-radius:100px; } body.dkr .dkr-credit-date{ font-family:var(--dkr-sans); font-size:13px; letter-spacing:.01em; text-transform:none; color:var(--dkr-paper); opacity:.9; } body.dkr .dkr-going{ display:inline-flex; align-items:center; gap:11px; } body.dkr .dkr-going-stack{ display:inline-flex; } body.dkr .dkr-going-av{ width:30px; height:30px; border-radius:50%; object-fit:cover; margin-left:-10px; box-shadow:0 0 0 2px rgba(34,19,43,.85); } body.dkr .dkr-going-av:first-child{ margin-left:0; } body.dkr .dkr-going .dkr-mono{ font-family:var(--dkr-sans); font-size:13px; letter-spacing:.01em; text-transform:none; color:var(--amber); } body.dkr .dkr-going-lg .dkr-going-av{ width:36px; height:36px; box-shadow:0 0 0 2px var(--dkr-black); } body.dkr .dkr-going-lg .dkr-mono{ color:var(--dkr-paper); opacity:1; } body.dkr .dkr-invite-grid{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,0.9fr); gap:clamp(28px,5vw,64px); align-items:start; } body.dkr .dkr-invite-grid-solo{ grid-template-columns:minmax(0,1fr); } @media(max-width:860px){ body.dkr .dkr-invite-grid{ grid-template-columns:1fr; } } body.dkr .dkr-join-card{ border:1px solid var(--dkr-line); padding:clamp(20px,3vw,28px); background:rgba(255,255,255,.025); backdrop-filter:blur(4px); } body.dkr .dkr-join-card .dkr-eyebrow{ margin-bottom:18px; } body.dkr .dkr-join-cta{ display:block; text-align:center; background:var(--dkr-paper); color:var(--dkr-black); font-family:var(--dkr-sans); font-weight:600; letter-spacing:0; font-size:15px; padding:15px; text-decoration:none; transition:background .3s var(--dkr-ease); } body.dkr .dkr-join-cta:hover{ background:#fff; } body.dkr .dkr-join-cta-going{ display:flex; align-items:center; justify-content:center; gap:8px; background:transparent; color:var(--dkr-paper); border:1px solid var(--dkr-line); } body.dkr .dkr-join-cta-going:hover{ background:rgba(255,255,255,.04); border-color:var(--dkr-paper); } body.dkr .dkr-join-cta-off{ background:transparent; color:var(--dkr-muted); border:1px solid var(--dkr-line); cursor:default; } body.dkr .dkr-join-wrap{ display:block; } body.dkr .dkr-join-wrap form{ margin:0; } body.dkr .dkr-join-cta-done{ display:flex; align-items:center; justify-content:center; gap:8px; background:transparent; color:var(--dkr-paper); border:1px solid var(--dkr-line); } body.dkr .dkr-join-cancel-form{ margin:0; } body.dkr .dkr-join-cancel{ display:block; width:100%; margin-top:10px; padding:6px; background:transparent; border:0; color:var(--dkr-faint); font-family:var(--dkr-sans); font-size:12px; letter-spacing:.01em; text-decoration:none; cursor:pointer; transition:color .2s var(--dkr-ease); } body.dkr .dkr-join-cancel:hover{ color:var(--dkr-muted); text-decoration:underline; text-underline-offset:3px; } body.dkr .dkr-join-check{ display:inline-flex; color:var(--amber); } body.dkr .dkr-join-check svg{ width:14px; height:14px; } body.dkr .dkr-join-note{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.05em; color:var(--dkr-muted); margin:14px 0 0; text-align:center; } body.dkr .dkr-join-context{ font-family:var(--dkr-sans); font-size:13px; line-height:1.5; color:var(--dkr-muted); margin:12px 0 0; text-align:center; } body.dkr .dkr-showcase-cta{ display:block; margin-top:12px; padding:14px 16px; background:rgba(198,74,26,.08); border:1px solid rgba(198,74,26,.30); color:var(--dkr-paper); text-decoration:none; transition:background .16s, border-color .16s; } body.dkr .dkr-showcase-cta:hover{ background:rgba(198,74,26,.14); border-color:rgba(198,74,26,.5); } body.dkr .dkr-showcase-cta-title{ display:block; font-family:var(--dkr-sans); font-weight:600; font-size:14px; } body.dkr .dkr-showcase-cta-arrow{ color:var(--amber); } body.dkr .dkr-showcase-cta-sub{ display:block; margin-top:5px; font-family:var(--dkr-sans); font-weight:500; font-size:12px; line-height:1.45; color:var(--dkr-muted); } body.dkr .dkr-showcase-lead{ scroll-margin-top:84px; max-width:var(--dkr-max); margin-inline:auto; padding:clamp(20px,2.4vw,30px) clamp(18px,5vw,64px) 0; } body.dkr .dkr-showcase-lead .rsvp-building{ margin:0; } body.dkr .dkr-columns{ display:grid; grid-template-columns:minmax(0,1fr) 340px; grid-template-areas:"invite rail" "hosts rail" "going rail"; column-gap:clamp(36px,4.5vw,72px); align-items:start; max-width:var(--dkr-max); margin-inline:auto; padding:clamp(20px,2vw,30px) clamp(18px,5vw,64px) 0; } body.dkr .dkr-columns-solo{ grid-template-columns:minmax(0,1fr); grid-template-areas:"invite" "hosts" "going"; } body.dkr .dkr-area-invite{ grid-area:invite; } body.dkr .dkr-area-hosts{ grid-area:hosts; padding-top:clamp(30px,3.5vw,46px); } body.dkr .dkr-area-going{ grid-area:going; padding-top:clamp(30px,3.5vw,46px); } body.dkr .dkr-area-rail{ grid-area:rail; } body.dkr .dkr-rail-card{ position:sticky; top:84px; border:1px solid var(--dkr-line); padding:clamp(20px,2vw,26px); background:rgba(255,255,255,.03); backdrop-filter:blur(6px); } body.dkr .dkr-rail-card .dkr-eyebrow{ margin-bottom:18px; } body.dkr .dkr-rail-fit{ font-size:14px; line-height:1.5; color:var(--dkr-paper); opacity:.82; margin:0 0 18px; } body.dkr .dkr-rail-momentum{ margin:0 0 18px; font-family:var(--dkr-sans); font-size:13px; color:var(--amber); } body.dkr .dkr-rail-links{ display:flex; flex-direction:column; margin-top:20px; padding-top:6px; border-top:1px solid var(--dkr-line); } body.dkr .dkr-rail-link{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 0; font-family:var(--dkr-sans); font-size:14px; letter-spacing:0; color:var(--dkr-muted); text-decoration:none; transition:color .2s; } body.dkr .dkr-rail-links button.dkr-rail-link{ width:100%; background:none; border:0; cursor:pointer; font:inherit; text-align:left; color:var(--amber); } body.dkr .dkr-rail-links button.dkr-rail-link:hover{ color:#eea269; } body.dkr .dkr-rail-link + .dkr-rail-link{ border-top:1px solid var(--dkr-line); } body.dkr .dkr-rail-link:hover{ color:var(--dkr-paper); } body.dkr .dkr-rail-arrow{ flex:none; opacity:.6; transition:transform .2s var(--dkr-ease); } body.dkr .dkr-rail-link:hover .dkr-rail-arrow{ transform:translateX(3px); opacity:1; } body.dkr .dkr-photo-admin{ max-width:var(--dkr-max); margin-inline:auto; padding:clamp(20px,3vw,30px) clamp(18px,5vw,64px) 0; } body.dkr .dkr-photo-nudge{ display:flex; align-items:center; gap:14px; margin:0; padding:15px 20px; border:1px solid var(--dkr-line); background:var(--dkr-panel); text-decoration:none; transition:border-color .2s; } body.dkr .dkr-photo-nudge:hover{ border-color:var(--amber); } body.dkr .dkr-photo-nudge-icon{ flex:none; display:flex; color:var(--amber); } body.dkr .dkr-photo-nudge-icon svg{ width:20px; height:20px; } body.dkr .dkr-photo-nudge-text{ flex:1; font-family:var(--dkr-sans); font-size:14px; line-height:1.5; color:var(--dkr-muted); } body.dkr .dkr-photo-nudge-text strong{ color:var(--dkr-paper); font-weight:600; } body.dkr .dkr-photo-nudge-go{ flex:none; color:var(--dkr-muted); transition:transform .2s var(--dkr-ease); } body.dkr .dkr-photo-nudge:hover .dkr-photo-nudge-go{ transform:translateX(3px); color:var(--amber); } body.dkr .dkr-going-lg .dkr-going-av{ width:38px; height:38px; margin-left:-12px; box-shadow:0 0 0 2px var(--dkr-panel); } body.dkr .dkr-going-lg .dkr-going-av:first-child{ margin-left:0; } @media(max-width:900px){ body.dkr .dkr-columns{ grid-template-columns:1fr; grid-template-areas:"rail" "invite" "hosts" "going"; } body.dkr .dkr-rail-card{ position:static; } body.dkr .dkr-area-rail{ padding-top:clamp(24px,5vw,32px); } body.dkr .dkr-area-invite{ padding-top:clamp(30px,6vw,44px); } body.dkr .dkr-area-hosts, body.dkr .dkr-area-going{ padding-top:clamp(36px,7vw,52px); } body.dkr .dkr-rail-card{ border:0; padding:0; background:none; backdrop-filter:none; } body.dkr .dkr-area-rail .dkr-rail-links{ display:none; } } body.dkr .dkr-scrolldot{ position:absolute; z-index:3; left:50%; bottom:20px; transform:translateX(-50%); width:1px; height:38px; background:linear-gradient(var(--dkr-paper),transparent); opacity:.5; animation:dkr-drop 2.4s ease-in-out infinite; transform-origin:top; } @keyframes dkr-drop{ 0%,100%{ opacity:.15; transform:translateX(-50%) scaleY(.5); } 50%{ opacity:.6; transform:translateX(-50%) scaleY(1); } } body.dkr .dkr-ledger{ display:grid; grid-template-columns:repeat(3,1fr); max-width:var(--dkr-max); margin-inline:auto; } body.dkr .dkr-ledger .dkr-cell{ padding:clamp(18px,2.4vw,30px) clamp(16px,3vw,30px); border-right:1px solid var(--dkr-line); border-bottom:1px solid var(--dkr-line); } body.dkr .dkr-ledger .dkr-cell:last-child{ border-right:none; } body.dkr .dkr-ledger .dkr-cell:first-child{ padding-left:clamp(18px,5vw,64px); } body.dkr .dkr-ledger .dkr-cell:last-child{ padding-right:clamp(18px,5vw,64px); } body.dkr .dkr-ledger .dkr-l{ color:var(--dkr-faint); margin-bottom:12px; font-family:var(--dkr-sans); font-size:12px; letter-spacing:.01em; text-transform:none; } body.dkr .dkr-ledger .dkr-v{ font-weight:600; font-size:clamp(18px,2.4vw,27px); letter-spacing:-.01em; font-variant-numeric:tabular-nums; } body.dkr .dkr-ledger .dkr-where-addr{ display:block; margin-top:7px; font-size:14px; font-weight:400; letter-spacing:0; line-height:1.4; color:var(--dkr-muted); } body.dkr .dkr-ledger .dkr-where-link{ color:inherit; text-decoration:none; transition:color .16s; } body.dkr .dkr-ledger .dkr-where-link:hover{ color:var(--amber); } body.dkr .dkr-ledger .dkr-where-link:hover .dkr-where-addr{ color:var(--amber); } body.dkr .dkr-notice{ display:flex; align-items:baseline; gap:clamp(12px,2vw,18px); max-width:var(--dkr-max); margin-inline:auto; padding:clamp(15px,2.2vw,20px) clamp(18px,5vw,64px); background:rgba(198,74,26,.10); border-left:3px solid var(--amber); border-bottom:1px solid var(--dkr-line); } body.dkr .dkr-notice-mark{ flex:none; color:var(--amber); font-size:12px; letter-spacing:.08em; text-transform:uppercase; } body.dkr .dkr-notice-text{ color:var(--dkr-paper); font-size:clamp(15px,1.8vw,18px); line-height:1.5; } body.dkr .dkr-notice-text p{ margin:0; } body.dkr .dkr-notice-text p + p{ margin-top:.45em; } body.dkr .dkr-notice-text a{ color:var(--amber); text-decoration:underline; } body.dkr .dkr-notice-off{ background:rgba(190,70,70,.12); border-left-color:#c65a5a; } body.dkr .dkr-notice-off .dkr-notice-mark{ color:#e39191; } @media(max-width:720px){ body.dkr .dkr-ledger{ grid-template-columns:1fr 1fr; } body.dkr .dkr-ledger .dkr-cell{ padding:14px 18px; } body.dkr .dkr-ledger .dkr-cell:first-child{ padding-left:18px; } body.dkr .dkr-ledger .dkr-cell:last-child{ padding-right:18px; } body.dkr .dkr-ledger .dkr-l{ margin-bottom:6px; } body.dkr .dkr-ledger .dkr-v{ font-size:18px; } body.dkr .dkr-ledger .dkr-cell:nth-child(2){ border-right:none; } body.dkr .dkr-ledger .dkr-cell:nth-child(1), body.dkr .dkr-ledger .dkr-cell:nth-child(2){ border-bottom:1px solid var(--dkr-line); } body.dkr .dkr-ledger .dkr-cell:nth-child(3){ grid-column:1 / -1; border-right:none; } } body.dkr .dkr-recap{ max-width:var(--dkr-max); margin:clamp(24px,3.5vw,44px) auto 0; padding:0 clamp(18px,5vw,64px); } body.dkr .dkr-recap-shots{ display:grid; grid-template-columns:repeat(3,1fr); gap:3px; } body.dkr .dkr-recap-shot{ aspect-ratio:4/3; overflow:hidden; background:var(--dkr-panel); } body.dkr .dkr-recap-shot img{ width:100%; height:100%; object-fit:cover; filter:brightness(.95) saturate(1.05); transition:filter .4s ease, transform 6s ease; } body.dkr .dkr-recap-shot:hover img{ filter:brightness(1.03) saturate(1.12); transform:scale(1.03); } @media(max-width:640px){ body.dkr .dkr-recap-shots{ grid-template-columns:repeat(2,1fr); } } @media(max-width:600px){ body.dkr .dkr-detail, body.dkr .dkr-columns, body.dkr .dkr-recap{ padding-left:clamp(18px,5vw,64px); padding-right:clamp(18px,5vw,64px); } body.dkr .dkr-hero .dkr-cap{ padding-left:clamp(18px,5vw,64px); padding-right:clamp(18px,5vw,64px); } body.dkr .dkr-detail .mh-brands, body.dkr .dkr-recap-shots{ margin-inline:calc(clamp(18px,5vw,64px) * -1); border-inline:0; } body.dkr .dkr-ledger .dkr-cell{ padding-left:12px; padding-right:12px; } body.dkr .dkr-ledger .dkr-cell:first-child{ padding-left:clamp(18px,5vw,64px); } body.dkr .dkr-ledger .dkr-cell:last-child{ padding-right:clamp(18px,5vw,64px); } body.dkr .dkr-rail-card .dkr-eyebrow{ margin-bottom:12px; } body.dkr .dkr-area-rail .dkr-going-lg{ margin-bottom:14px; } body.dkr .dkr-area-rail .dkr-going-lg .dkr-going-av{ width:32px; height:32px; } body.dkr .dkr-rail-momentum, body.dkr .dkr-rail-fit{ margin-bottom:14px; font-size:12.5px; } body.dkr .dkr-join-cta{ padding:18px; font-size:16.5px; } } body.dkr .dkr-handoff{ display:flex; align-items:center; gap:16px; margin:clamp(22px,3vw,34px) 0 0; padding:clamp(18px,2.4vw,26px) clamp(20px,2.5vw,28px); border:1px solid #33214a84; overflow:hidden; background:linear-gradient(155deg,#301d3c 0%,#221331 60%,#1a0f24 100%); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); text-decoration:none; transition:border-color .2s, transform .2s; } body.dkr .dkr-handoff:hover{ border-color:#5f4270; transform:translateY(-2px); } body.dkr .dkr-handoff-eyebrow{ flex:0 0 auto; font-family:var(--dkr-sans); font-size:12px; color:var(--amber); } body.dkr .dkr-handoff-title{ flex:1 1 auto; font-family:var(--dkr-sans); font-weight:500; font-size:clamp(15px,1.5vw,18px); line-height:1.35; color:var(--dkr-paper); } body.dkr .dkr-handoff-arrow{ flex:0 0 auto; color:var(--dkr-muted); font-size:18px; transition:transform .2s, color .2s; } body.dkr .dkr-handoff:hover .dkr-handoff-arrow{ transform:translateX(4px); color:var(--amber); } @media(max-width:560px){ body.dkr .dkr-handoff{ flex-wrap:wrap; gap:6px 12px; } body.dkr .dkr-handoff-title{ flex:1 0 100%; order:3; } } body.dkr .dkr-pad{ padding:clamp(56px,10vw,120px) clamp(18px,5vw,64px); max-width:var(--dkr-max); margin-inline:auto; } body.dkr .dkr-pad.dkr-tight{ padding-top:0; } body.dkr .dkr-standfirst{ max-width:58ch; color:var(--dkr-paper); opacity:.82; font-size:clamp(16px,1.6vw,19px); line-height:1.62; margin:22px 0 0; } body.dkr .dkr-more-toggle{ position:absolute; width:0; height:0; opacity:0; pointer-events:none; } body.dkr .dkr-clamp{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:5; line-clamp:5; overflow:hidden; } body.dkr .dkr-more-toggle:checked ~ .dkr-clamp{ -webkit-line-clamp:unset; line-clamp:unset; } body.dkr .dkr-more-label{ display:inline-block; margin-top:14px; font-family:var(--dkr-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--dkr-paper); opacity:.8; cursor:pointer; } body.dkr .dkr-more-label::after{ content:"Read more \2192"; } body.dkr .dkr-more-toggle:checked ~ .dkr-more-label::after{ content:"Read less"; } body.dkr .dkr-more-label:hover{ opacity:1; } body.dkr .partner-brands-tile{ opacity:1; } body.dkr .dkr-detail .partner-brands-grid{ grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:10px; } body.dkr .dkr-detail .partner-brands-tile{ aspect-ratio:16 / 9; } body.dkr .dkr-detail .partner-brands-logo{ inset:16px; } @media(max-width:600px){ body.dkr .dkr-detail .partner-brands-grid{ grid-template-columns:1fr 1fr; } } body.dkr .event-past-strip{ align-items:flex-start; } body.dkr .dkr-eyebrow{ color:var(--dkr-muted); margin-bottom:clamp(26px,4vw,44px); display:flex; align-items:center; gap:16px; font-family:var(--dkr-sans); font-weight:500; font-size:13px; letter-spacing:.01em; text-transform:none; } body.dkr .event-section-label{ font-family:var(--dkr-sans); font-size:13px; font-weight:500; letter-spacing:.01em; text-transform:none; } body.dkr .dkr-eyebrow::after{ content:""; flex:1; height:1px; background:var(--dkr-line); } body.dkr .dkr-lede{ max-width:24ch; font-weight:600; font-size:clamp(24px,3.6vw,40px); line-height:1.14; letter-spacing:-.015em; text-wrap:balance; margin:0; } body.dkr .dkr-lede + p{ max-width:52ch; color:var(--dkr-muted); margin:22px 0 0; font-size:16px; } body.dkr .dkr-faces{ display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:clamp(18px,3.5vw,30px); } body.dkr .dkr-faces::-webkit-scrollbar{ display:none; } @media(max-width:600px){ body.dkr .dkr-faces{ grid-template-columns:repeat(2, 1fr); gap:22px 14px; } body.dkr .dkr-face .dkr-n{ font-size:15px; margin-top:12px; } body.dkr .dkr-face .dkr-r{ font-size:12px; } body.dkr .dkr-face-socials{ gap:13px; margin-top:10px; } body.dkr .dkr-face-social svg{ width:17px; height:17px; } } body.dkr .dkr-roster-toggle:not(:checked) ~ .dkr-faces .dkr-face-extra{ display:none; } body.dkr .dkr-roster-more{ display:inline-flex; margin-top:clamp(18px,2.5vw,26px); cursor:pointer; font-family:var(--dkr-sans); font-size:13px; color:var(--amber); transition:color .16s; } body.dkr .dkr-roster-more:hover{ color:#eea269; } body.dkr .dkr-roster-more .dkr-roster-more-hide{ display:none; } body.dkr .dkr-roster-toggle:checked ~ .dkr-roster-more .dkr-roster-more-show{ display:none; } body.dkr .dkr-roster-toggle:checked ~ .dkr-roster-more .dkr-roster-more-hide{ display:inline; } body.dkr .dkr-going-tab-input{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; } body.dkr .dkr-going-tablist{ display:flex; align-items:flex-end; gap:clamp(20px,3vw,32px); border-bottom:1px solid var(--dkr-line); margin-bottom:clamp(20px,3vw,30px); } body.dkr .dkr-going-tab{ cursor:pointer; font-family:var(--dkr-sans); font-weight:500; font-size:13px; letter-spacing:.01em; color:var(--dkr-faint); padding-bottom:12px; margin-bottom:-1px; border-bottom:2px solid transparent; transition:color .16s; display:inline-flex; align-items:center; gap:7px; } body.dkr .dkr-going-tab:hover{ color:var(--dkr-muted); } body.dkr .dkr-going-tab-n{ font-family:var(--dkr-mono); font-size:11px; color:var(--dkr-faint); font-variant-numeric:tabular-nums; } body.dkr .dkr-going-tab-input-roster:focus-visible ~ .dkr-going-tablist .dkr-going-tab-roster, body.dkr .dkr-going-tab-input-showcase:focus-visible ~ .dkr-going-tablist .dkr-going-tab-showcase{ outline:2px solid var(--amber); outline-offset:3px; } body.dkr .dkr-going-tab-input-roster:checked ~ .dkr-going-tablist .dkr-going-tab-roster, body.dkr .dkr-going-tab-input-showcase:checked ~ .dkr-going-tablist .dkr-going-tab-showcase{ color:var(--dkr-paper); border-bottom-color:var(--dkr-paper); } body.dkr .dkr-going-tab-input-roster:checked ~ .dkr-going-tablist .dkr-going-tab-roster .dkr-going-tab-n, body.dkr .dkr-going-tab-input-showcase:checked ~ .dkr-going-tablist .dkr-going-tab-showcase .dkr-going-tab-n{ color:var(--dkr-muted); } body.dkr .dkr-going-panel{ display:none; } body.dkr .dkr-going-tab-input-roster:checked ~ .dkr-going-panel-roster{ display:block; } body.dkr .dkr-going-tab-input-showcase:checked ~ .dkr-going-panel-showcase{ display:block; } body.dkr .dkr-showcase-ledger{ max-width:none; margin:0; padding:0; } body.dkr .dkr-showcase-ledger.ledger .ldg-city-head{ margin-top:0; } body.dkr .dkr-showcase-ledger.ledger .ldg-city-heading{ font-size:18px; } body.dkr .dkr-showcase-ledger.ledger .ldg-note{ margin-top:8px; } body.dkr .dkr-showcase-ledger.ledger .ldg-list{ margin-top:14px; } body.dkr .dkr-showcase-ledger.ledger .ldg-item{ padding-top:16px; padding-bottom:16px; } body.dkr .dkr-showcase-ledger.ledger .ldg-item::before{ top:18px; } body.dkr .dkr-showcase-ledger .dkr-showcase-ledger-other{ margin-top:clamp(22px,3vw,32px); } body.dkr .dkr-face{ width:auto; } body.dkr .dkr-face{ cursor:pointer; position:relative; } body.dkr .dkr-face-hide{ position:absolute; top:6px; right:6px; z-index:4; margin:0; } body.dkr .dkr-face-hide-btn{ padding:3px 9px; border-radius:999px; border:1px solid rgba(240,238,233,.3); background:rgba(34,19,43,.62); color:var(--dkr-paper); font-family:var(--dkr-sans); font-size:11px; line-height:1.4; cursor:pointer; opacity:.62; transition:opacity .16s, background .16s; } body.dkr .dkr-face:hover .dkr-face-hide-btn{ opacity:1; } body.dkr .dkr-face-hide-btn:hover{ background:rgba(34,19,43,.85); } body.dkr .dkr-face.is-hidden{ opacity:.5; } body.dkr .dkr-face.is-hidden .dkr-face-hide-btn{ opacity:1; } body.dkr .dkr-face .dkr-pic{ position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--dkr-panel); filter:grayscale(1) sepia(.35) hue-rotate(-6deg) contrast(1.05) brightness(.95); transition:filter .5s var(--dkr-ease); } body.dkr .dkr-face .dkr-pic img{ position:absolute; inset:0; z-index:1; } body.dkr .dkr-face:hover .dkr-pic, body.dkr .dkr-face.is-lit .dkr-pic{ filter:grayscale(0) contrast(1.02) brightness(1); } body.dkr .dkr-face .dkr-mono-mark{ position:absolute; inset:0; z-index:0; display:flex; align-items:center; justify-content:center; background:linear-gradient(150deg, #2a1b33 0%, #1e1128 100%); color:var(--dkr-muted); font-family:var(--dkr-sans); font-weight:600; font-size:clamp(26px,4vw,36px); letter-spacing:.02em; box-shadow:inset 0 1px 0 rgba(255,255,255,.03); } body.dkr .dkr-face .dkr-n{ font-weight:600; font-size:15px; margin-top:14px; } body.dkr .dkr-face .dkr-r{ color:var(--dkr-muted); font-family:var(--dkr-sans); font-size:12px; letter-spacing:0; margin-top:4px; } body.dkr .dkr-face-socials{ display:flex; align-items:center; gap:13px; margin-top:11px; } body.dkr .dkr-face-social{ color:var(--dkr-faint); display:inline-flex; transition:color .15s; } body.dkr .dkr-face-social:hover{ color:var(--amber); } body.dkr .dkr-face-social svg{ width:17px; height:17px; } body.dkr .dkr-face-role{ font-family:var(--dkr-sans); font-weight:500; font-size:11.5px; letter-spacing:.01em; color:var(--accent); margin-top:14px; } body.dkr .dkr-face-role + .dkr-n{ margin-top:4px; } body.dkr .dkr-faces-lead .dkr-n{ font-size:16px; } body.dkr .dkr-face-manage{ margin-top:10px; } body.dkr .dkr-face-manage-btn{ display:inline-flex; align-items:center; cursor:pointer; list-style:none; font-family:var(--dkr-sans); font-size:11px; letter-spacing:.04em; color:var(--dkr-faint); border:1px solid rgba(240,238,233,.18); border-radius:999px; padding:2px 10px; transition:color .16s, border-color .16s; } body.dkr .dkr-face-manage-btn::-webkit-details-marker{ display:none; } body.dkr .dkr-face-manage[open] .dkr-face-manage-btn, body.dkr .dkr-face-manage-btn:hover{ color:var(--dkr-paper); border-color:rgba(240,238,233,.4); } body.dkr .dkr-face-manage-pop{ display:flex; flex-direction:column; align-items:flex-start; gap:6px; margin-top:8px; } body.dkr .dkr-face-manage-tag{ font-family:var(--dkr-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .dkr-face-manage-form{ margin:0; } body.dkr .dkr-face-manage-act{ background:none; border:none; padding:0; cursor:pointer; font-family:var(--dkr-sans); font-size:12px; color:var(--amber); text-align:left; transition:color .16s; } body.dkr .dkr-face-manage-act:hover{ color:#eea269; } body.dkr .dkr-face-manage-danger{ color:#d98a6a; } body.dkr .dkr-face-manage-danger:hover{ color:#e6a086; } body.dkr .dkr-face-link{ display:block; color:inherit; text-decoration:none; } body.dkr .founder-verified svg path{ fill:var(--accent); } body.dkr .dkr-face .founder-verified{ vertical-align:-1px; } body.dkr .dkr-face-track{ display:inline-block; margin-top:9px; font-family:var(--dkr-sans); font-size:11px; font-weight:500; letter-spacing:.01em; color:var(--accent); padding:3px 10px; border-radius:999px; border:1px solid rgba(224,134,74,.42); background:rgba(224,134,74,.1); } body.dkr .dkr-role-row{ display:flex; gap:6px; } body.dkr .dkr-role-pill{ background:none; cursor:pointer; font-family:var(--dkr-sans); font-size:11px; letter-spacing:.03em; color:var(--dkr-faint); border:1px solid rgba(240,238,233,.24); border-radius:999px; padding:3px 11px; transition:color .16s, border-color .16s, background .16s; } body.dkr .dkr-role-pill:hover{ color:var(--dkr-paper); border-color:rgba(240,238,233,.5); } body.dkr .dkr-role-pill.is-on{ color:#221327; background:var(--accent); border-color:var(--accent); font-weight:600; } body.dkr .dkr-face-track-form{ display:flex; align-items:center; gap:6px; margin:0; } body.dkr .dkr-face-track-input{ font-family:var(--dkr-sans); font-size:12px; color:var(--dkr-paper); background:rgba(240,238,233,.06); border:1px solid rgba(240,238,233,.22); border-radius:6px; padding:3px 8px; min-width:130px; } body.dkr .dkr-face-track-input:focus{ outline:none; border-color:var(--amber); } body.dkr .dkr-face-track-input::placeholder{ color:var(--dkr-faint); } body.dkr .dkr-admin-add{ margin:0 0 clamp(20px,3vw,32px); } body.dkr .dkr-admin-add .event-admin-add-attendee{ margin:0; } body.dkr .dkr-admin-add .event-admin-add-attendee-label{ display:block; margin-bottom:8px; font-family:var(--dkr-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .dkr-admin-add .event-admin-add-attendee-row{ display:flex; gap:8px; flex-wrap:wrap; } body.dkr .dkr-admin-add .event-admin-add-attendee-input{ flex:1 1 240px; font-family:var(--dkr-sans); font-size:13px; color:var(--dkr-paper); background:rgba(240,238,233,.06); border:1px solid rgba(240,238,233,.22); border-radius:8px; padding:8px 12px; } body.dkr .dkr-admin-add .event-admin-add-attendee-input:focus{ outline:none; border-color:var(--amber); } body.dkr .dkr-admin-add .event-admin-add-attendee-input::placeholder{ color:var(--dkr-faint); } body.dkr .dkr-admin-add .event-admin-add-attendee-btn{ cursor:pointer; font-family:var(--dkr-sans); font-size:13px; font-weight:600; color:#221327; background:var(--accent); border:none; border-radius:8px; padding:8px 18px; } body.dkr .dkr-admin-add .event-admin-add-attendee-btn:hover{ background:#eea269; } body.dkr .dkr-calloff{ margin-top:14px; padding-top:14px; border-top:1px solid var(--dkr-line); } body.dkr .dkr-calloff-label{ display:block; margin:0 0 8px; font-family:var(--dkr-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:#e39191; } body.dkr .dkr-calloff-row{ display:flex; gap:8px; flex-wrap:wrap; } body.dkr .dkr-calloff-input{ flex:1 1 240px; font-family:var(--dkr-sans); font-size:13px; color:var(--dkr-paper); background:rgba(240,238,233,.06); border:1px solid rgba(240,238,233,.22); border-radius:8px; padding:8px 12px; } body.dkr .dkr-calloff-input:focus{ outline:none; border-color:#c65a5a; } body.dkr .dkr-calloff-input::placeholder{ color:var(--dkr-faint); } body.dkr .dkr-calloff-btn, body.dkr .dkr-calloff-undo{ cursor:pointer; font-family:var(--dkr-sans); font-size:13px; font-weight:600; color:#f4e4e4; background:#8f3a3a; border:none; border-radius:8px; padding:8px 18px; } body.dkr .dkr-calloff-btn:hover, body.dkr .dkr-calloff-undo:hover{ background:#a34545; } body.dkr .dkr-calloff-hint{ margin:8px 0 0; font-family:var(--dkr-sans); font-size:12px; color:var(--dkr-faint); } body.dkr .dkr-calloff-undo{ margin-top:10px; } body.dkr .showcase-desk{ margin-top:14px; padding-top:14px; border-top:1px solid var(--dkr-line); } body.dkr .showcase-desk .proposal-eyebrow{ margin:0 0 6px; font-family:var(--dkr-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--amber); } body.dkr .showcase-desk-note, body.dkr .showcase-desk-empty{ margin:0 0 12px; font-family:var(--dkr-sans); font-size:12px; line-height:1.5; color:var(--dkr-faint); max-width:56ch; } body.dkr .showcase-desk-queue{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; } body.dkr .showcase-desk-row{ display:flex; align-items:flex-start; gap:12px; padding:12px; background:rgba(240,238,233,.04); border:1px solid var(--dkr-line); border-radius:10px; } body.dkr .showcase-desk-row.is-answered{ opacity:.62; } body.dkr .showcase-desk-body{ flex:1; min-width:0; } body.dkr .showcase-desk-body .application-queue-name{ font-family:var(--dkr-sans); font-size:14px; font-weight:600; color:var(--dkr-paper); } body.dkr .showcase-desk-body .application-queue-name a{ color:inherit; text-decoration:none; border-bottom:1px solid transparent; } body.dkr .showcase-desk-body .application-queue-name a:hover{ border-bottom-color:var(--amber); } body.dkr .showcase-desk-body .application-queue-meta{ font-family:var(--dkr-sans); font-size:12px; color:var(--dkr-faint); margin-top:2px; } body.dkr .showcase-desk-answer{ margin-left:8px; font-family:var(--dkr-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--amber); } body.dkr .showcase-desk-line{ margin:6px 0 0; font-family:var(--dkr-sans); font-size:13.5px; line-height:1.45; color:var(--dkr-paper); } body.dkr .showcase-desk-link{ display:inline-block; margin:6px 10px 0 0; font-family:var(--dkr-mono); font-size:11.5px; color:var(--dkr-muted); text-decoration:none; } body.dkr .showcase-desk-link:hover{ color:var(--amber); } body.dkr .showcase-desk .application-queue-actions .proposal-cta{ cursor:pointer; font-family:var(--dkr-sans); font-size:12.5px; font-weight:600; color:#221327; background:var(--accent); border:none; border-radius:8px; padding:7px 14px; white-space:nowrap; } body.dkr .showcase-desk .application-queue-actions .proposal-cta:hover{ background:#eea269; } body.dkr .showcase-desk .application-queue-actions .proposal-cta-out{ color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); } body.dkr .showcase-desk .application-queue-actions .proposal-cta-out:hover{ color:var(--dkr-paper); background:transparent; border-color:var(--dkr-muted); } @media(max-width:640px){ body.dkr .showcase-desk-row{ flex-wrap:wrap; } } body.dkr .dkr-sheet{ display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:1fr; gap:6px; } body.dkr .dkr-sheet .dkr-scell{ position:relative; overflow:hidden; background:var(--dkr-panel); aspect-ratio:1/1; } body.dkr .dkr-sheet .dkr-scell img{ filter:grayscale(.25) contrast(1.03) brightness(.86); transition:transform .8s var(--dkr-ease), filter .6s var(--dkr-ease); } body.dkr .dkr-sheet .dkr-scell:hover img{ transform:scale(1.06); filter:grayscale(0) brightness(1); } body.dkr .dkr-sheet .dkr-scell .dkr-tag{ position:absolute; left:10px; bottom:9px; z-index:2; font-family:var(--dkr-mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:#fff; text-shadow:0 1px 8px rgba(0,0,0,.9); opacity:0; transition:opacity .4s; } body.dkr .dkr-sheet .dkr-scell::after{ content:""; position:absolute; inset:0; background:linear-gradient(transparent 55%, rgba(0,0,0,.6)); opacity:0; transition:opacity .4s; } body.dkr .dkr-sheet .dkr-scell:hover .dkr-tag, body.dkr .dkr-sheet .dkr-scell:hover::after{ opacity:1; } body.dkr .dkr-sheet .dkr-wide{ grid-column:span 3; grid-row:span 2; aspect-ratio:auto; } body.dkr .dkr-sheet .dkr-tall{ grid-column:span 3; aspect-ratio:auto; } @media(max-width:720px){ body.dkr .dkr-sheet{ grid-template-columns:repeat(2,1fr); } body.dkr .dkr-sheet .dkr-wide, body.dkr .dkr-sheet .dkr-tall{ grid-column:span 2; grid-row:auto; aspect-ratio:16/10; } } body.dkr .dkr-act{ display:flex; align-items:center; gap:clamp(18px,3vw,34px); flex-wrap:wrap; border-top:1px solid var(--dkr-line); padding-top:clamp(40px,6vw,64px); } body.dkr .dkr-btn{ display:inline-block; text-align:center; text-decoration:none; background:transparent; color:var(--dkr-paper); border:1px solid var(--dkr-paper); font-family:var(--dkr-sans); font-weight:600; letter-spacing:.16em; text-transform:uppercase; font-size:12px; padding:17px 34px; cursor:pointer; transition:.35s var(--dkr-ease); } body.dkr .dkr-btn:hover{ background:var(--dkr-paper); color:var(--dkr-black); } body.dkr .dkr-btn-solid{ background:var(--dkr-paper); color:var(--dkr-black); } body.dkr .dkr-btn-solid:hover{ background:#fff; } body.dkr .dkr-act form{ margin:0; } body.dkr .dkr-note{ color:var(--dkr-muted); font-size:15px; max-width:34ch; } body.dkr .dkr-confirmed{ display:flex; align-items:center; gap:12px; font-weight:600; font-size:15px; } body.dkr .dkr-confirmed .dkr-dot{ width:8px; height:8px; border-radius:50%; background:#6f9b6b; } body.dkr .dkr-cancel{ background:none; border:none; color:var(--dkr-muted); font-family:var(--dkr-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; text-decoration:underline; text-underline-offset:3px; cursor:pointer; padding:0; } body.dkr .dkr-apply{ max-width:620px; } body.dkr .dkr-apply .dkr-eyebrow{ margin-bottom:20px; } body.dkr .dkr-apply-seats{ font-family:var(--dkr-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-muted); margin:0 0 22px; } body.dkr .dkr-apply-fit{ margin:0 0 26px; } body.dkr .dkr-fit-yes{ font-size:clamp(19px,2.4vw,26px); font-weight:600; line-height:1.25; letter-spacing:-.01em; margin:0 0 10px; } body.dkr .dkr-fit-no{ color:var(--dkr-muted); font-size:15px; line-height:1.5; margin:0 0 4px; } body.dkr .dkr-apply-lead{ font-size:17px; color:var(--dkr-paper); margin:0 0 20px; max-width:46ch; } body.dkr .dkr-apply-note{ color:var(--dkr-muted); font-size:13.5px; margin:0 0 16px; } body.dkr .dkr-apply-gaps{ color:var(--dkr-muted); font-size:15px; margin:0 0 20px; padding-left:18px; } body.dkr .dkr-apply-gaps li{ margin-bottom:6px; } body.dkr .dkr-apply-form{ display:flex; flex-direction:column; } body.dkr .dkr-q-label{ font-weight:600; font-size:15px; margin:18px 0 8px; } body.dkr .dkr-q-input{ width:100%; background:var(--dkr-panel); border:1px solid var(--dkr-line); color:var(--dkr-paper); font-family:var(--dkr-sans); font-size:15px; line-height:1.5; padding:12px 14px; resize:vertical; border-radius:2px; } body.dkr .dkr-q-input::placeholder{ color:var(--dkr-faint); } body.dkr .dkr-q-input:focus{ outline:none; border-color:var(--dkr-paper); } body.dkr .dkr-apply-form .dkr-apply-note{ margin:18px 0 16px; } body.dkr .dkr-apply-form .dkr-btn{ align-self:flex-start; } body.dkr .dkr-closing{ position:relative; height:88svh; min-height:520px; overflow:hidden; } body.dkr .dkr-closing .dkr-shot{ position:absolute; inset:0; } body.dkr .dkr-closing .dkr-shot img{ filter:contrast(1.03) brightness(.78) saturate(1.02); } body.dkr .dkr-closing::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(34,19,43,.7), transparent 40%, rgba(34,19,43,.85)); } body.dkr .dkr-closing .dkr-ccap{ position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; justify-content:flex-end; padding:clamp(30px,6vw,72px) clamp(18px,5vw,64px); } body.dkr .dkr-closing h2{ font-weight:600; font-size:clamp(26px,4.4vw,52px); line-height:1.06; letter-spacing:-.015em; max-width:20ch; text-wrap:balance; margin:0; } body.dkr .dkr-closing .dkr-sub{ color:var(--dkr-muted); margin-top:18px; } body.dkr .dkr-foot{ padding:38px clamp(18px,5vw,64px); max-width:var(--dkr-max); margin-inline:auto; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; border-top:1px solid var(--dkr-line); } body.dkr .dkr-foot span{ color:var(--dkr-faint); font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; } body.dkr .dkr-rev{ opacity:0; transform:translateY(22px); transition:opacity 1s var(--dkr-ease), transform 1s var(--dkr-ease); } body.dkr .dkr-rev.dkr-in{ opacity:1; transform:none; } @media(prefers-reduced-motion:reduce){ body.dkr .dkr-rev{ opacity:1; transform:none; transition:none; } body.dkr .dkr-hero .dkr-shot, body.dkr .dkr-scrolldot{ animation:none; } } body.dkr .shelf-screen .screen-title{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.015em; color:var(--dkr-paper); } body.dkr .shelf-screen .screen-subtitle{ color:var(--dkr-muted); } body.dkr .cities-screen .screen-title{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.015em; color:var(--dkr-paper); } body.dkr .landing-cities .landing-city-region-label{ color:var(--dkr-faint); } body.dkr .landing-cities .landing-city-pill{ background:var(--dkr-panel); border:1px solid var(--dkr-line); box-shadow:none; color:var(--dkr-paper); } body.dkr .landing-cities .landing-city-pill:hover{ transform:none; border-color:var(--amber); box-shadow:none; } body.dkr .landing-cities .landing-city-pill-quiet{ opacity:.5; box-shadow:none; } body.dkr .landing-cities .landing-city-pill-quiet:hover{ opacity:1; transform:none; box-shadow:none; } body.dkr .landing-cities .landing-city-pill-count{ color:var(--amber); } body.dkr .city-guide-screen .screen-title{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.015em; color:var(--dkr-paper); } body.dkr .cg-section-title, body.dkr .cg-cta-title, body.dkr .cg-hood-name{ font-family:var(--dkr-sans); } body.dkr .city-guide-screen .event-roster-name, body.dkr .city-guide-screen .event-person-tile-name{ font-family:var(--dkr-sans); } body.dkr .city-guide-screen .events-view-tabs{ background:var(--dkr-panel); border-color:var(--dkr-line); } body.dkr .city-guide-screen .events-view-tab{ color:var(--dkr-muted); } body.dkr .city-guide-screen .events-view-tab:hover{ color:var(--dkr-paper); } body.dkr .city-guide-screen .events-view-input-upcoming:checked ~ .events-view-head .events-view-tab-upcoming, body.dkr .city-guide-screen .events-view-input-past:checked ~ .events-view-head .events-view-tab-past, body.dkr .city-guide-screen .events-view-input-upcoming:checked ~ .events-view-tabs .events-view-tab-upcoming, body.dkr .city-guide-screen .events-view-input-past:checked ~ .events-view-tabs .events-view-tab-past{ background:var(--amber); color:#161009; } body.dkr .cg-ev-radio{ position:absolute; width:0; height:0; opacity:0; pointer-events:none; } body.dkr .cg-ev-tabs{ display:flex; gap:22px; margin:0 0 16px; } body.dkr .cg-ev-tab{ font-size:12px; letter-spacing:.08em; color:var(--dkr-faint); cursor:pointer; padding-bottom:7px; border-bottom:1px solid transparent; transition:color .16s, border-color .16s; } body.dkr .cg-ev-tab:hover{ color:var(--dkr-muted); } body.dkr .cg-ev-radio-up:checked ~ .cg-ev-tabs .cg-ev-tab-up{ color:var(--dkr-paper); border-bottom-color:var(--amber); } body.dkr .cg-ev-radio-past:checked ~ .cg-ev-tabs .cg-ev-tab-past{ color:var(--dkr-paper); border-bottom-color:var(--amber); } body.dkr .cg-ev-panel-past{ display:none; } body.dkr .cg-ev-radio-past:checked ~ .cg-ev-panel-up{ display:none; } body.dkr .cg-ev-radio-past:checked ~ .cg-ev-panel-past{ display:block; } body.dkr .cg-past-list{ display:flex; flex-direction:column; gap:clamp(22px,3vw,34px); } body.dkr a.cg-past{ display:block; text-decoration:none; color:var(--dkr-paper); border-bottom:1px solid var(--dkr-line); padding-bottom:clamp(22px,3vw,34px); } body.dkr .cg-past-list a.cg-past:last-child{ border-bottom:0; padding-bottom:0; } body.dkr .cg-past-shots{ display:flex; gap:6px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; margin-bottom:14px; } body.dkr .cg-past-shots::-webkit-scrollbar{ display:none; } body.dkr .cg-past-shot{ flex:0 0 auto; width:clamp(190px,24vw,280px); aspect-ratio:4/3; overflow:hidden; scroll-snap-align:start; background:var(--dkr-panel); border-radius:2px; } body.dkr .cg-past-shot img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s var(--dkr-ease); } body.dkr a.cg-past:hover .cg-past-shot img{ transform:scale(1.03); } body.dkr .cg-past-date{ display:block; font-size:11px; letter-spacing:.1em; color:var(--dkr-faint); } body.dkr a.cg-past .cg-past-title{ display:block; font-family:var(--dkr-sans); font-weight:600; font-size:clamp(17px,2vw,22px); letter-spacing:-.01em; color:var(--dkr-paper); margin-top:6px; transition:color .16s; } body.dkr a.cg-past:hover .cg-past-title{ color:#fff; } body.dkr .cgc-grid{ display:grid; grid-template-columns:1fr; gap:14px; } @media(min-width:720px){ body.dkr .cgc-grid{ grid-template-columns:1fr 1fr; } } body.dkr .cgc-card{ position:relative; overflow:hidden; display:flex; align-items:flex-end; min-height:220px; border:1px solid var(--dkr-line); background:var(--dkr-panel); text-decoration:none; transition:border-color .2s; } body.dkr .cgc-card:hover{ border-color:rgba(240,238,233,.3); } body.dkr .cgc-shot{ position:absolute; inset:0; z-index:0; } body.dkr .cgc-shot img{ width:100%; height:100%; object-fit:cover; filter:grayscale(.25) brightness(.46); transition:filter .5s ease, transform 6s ease; } body.dkr .cgc-card.has-shot::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(34,19,43,.35) 0%, rgba(34,19,43,.35) 34%, rgba(34,19,43,.78) 74%, rgba(34,19,43,.97) 100%); } body.dkr .cgc-card.has-shot:hover .cgc-shot img{ filter:grayscale(0) brightness(.56); transform:scale(1.03); } body.dkr .cgc-card.is-mine{ border-color:rgba(224,134,74,.5); } body.dkr .cgc-body{ position:relative; z-index:2; display:flex; flex-direction:column; gap:7px; padding:clamp(18px,2.5vw,24px); width:100%; } body.dkr .cgc-card.has-shot .cgc-date, body.dkr .cgc-card.has-shot .cgc-meta{ text-shadow:0 1px 6px rgba(34,19,43,.85); } body.dkr .cgc-card.has-shot .cgc-title{ text-shadow:0 1px 10px rgba(34,19,43,.7); } body.dkr .cgc-date{ color:var(--amber); font-size:11px; } body.dkr .cgc-title{ font-family:var(--dkr-sans); font-weight:600; font-size:clamp(18px,2.2vw,23px); line-height:1.15; color:var(--dkr-paper); } body.dkr .cgc-meta{ color:var(--dkr-paper); opacity:.82; font-size:11px; } body.dkr .cgc-going{ display:flex; align-items:center; gap:10px; margin-top:2px; } body.dkr .cgc-count{ color:var(--dkr-paper); font-size:11px; opacity:.85; } body.dkr .cgc-cta{ font-family:var(--dkr-sans); font-size:13px; color:var(--amber); margin-top:6px; } body.dkr .cgc-cta.is-mine{ color:var(--dkr-paper); } body.dkr .cg-nav-wrap{ background:none; border-bottom:1px solid var(--dkr-line); margin:4px 0 clamp(18px,2.4vw,26px); } body.dkr .cg-nav{ display:flex; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; gap:clamp(15px,2vw,26px); max-height:none; padding-bottom:0; } body.dkr .cg-nav::-webkit-scrollbar{ display:none; } body.dkr .cg-nav-more{ display:none; } body.dkr .cg-navtab{ background:none; border:none; border-radius:0; padding:0 0 13px; border-bottom:1.5px solid transparent; color:var(--dkr-faint); font-family:var(--dkr-sans); font-size:13px; letter-spacing:.01em; white-space:nowrap; } body.dkr .cg-navtab:hover{ background:none; border-color:transparent; border-bottom-color:transparent; color:var(--dkr-paper); } body.dkr .cg-navtab.is-current{ background:none; color:var(--dkr-paper); border-bottom-color:var(--amber); } body.dkr .cg-admin-link{ color:var(--dkr-muted); border-color:var(--dkr-line); } body.dkr .cg-admin-link:hover{ color:var(--amber); border-color:var(--amber); } body.dkr .cg-hero-eyebrow{ color:var(--dkr-muted); margin:0 0 clamp(12px,1.6vw,16px); } body.dkr .city-guide-screen .cg-hero{ margin-bottom:clamp(16px,2.4vw,22px); } body.dkr .city-guide-screen .cg-hero .screen-title{ font-size:clamp(34px,5.4vw,60px); line-height:1.02; letter-spacing:-.025em; } body.dkr .city-guide-screen .cg-hero .screen-subtitle{ font-family:var(--dkr-sans); font-size:clamp(15px,1.7vw,18px); line-height:1.5; color:var(--dkr-paper); opacity:.9; margin-top:clamp(14px,2vw,18px); max-width:54ch; } body.dkr .city-guide-screen .cg-context{ font-family:var(--dkr-sans); font-size:15px; line-height:1.6; color:var(--dkr-muted); max-width:66ch; margin:clamp(12px,1.6vw,16px) 0 0; padding-bottom:clamp(24px,3.5vw,34px); border-bottom:1px solid var(--dkr-line); } body.dkr .city-guide-screen .cg-list{ max-width:820px; } body.dkr .city-guide-screen .cg-row{ padding:15px 0; } body.dkr .city-guide-screen .cg-row-name{ font-size:16px; } body.dkr .city-guide-screen .cg-row-where{ font-family:var(--dkr-mono); font-size:10px; letter-spacing:.04em; color:var(--dkr-faint); text-transform:uppercase; } body.dkr .city-guide-screen .cg-row-desc{ max-width:70ch; } body.dkr .city-guide-screen .cg-roster, body.dkr .city-guide-screen .cg-tab-panel-people .event-roster-list{ max-width:820px; } body.dkr .city-guide-screen .event-roster-name{ font-size:16px; } body.dkr .city-guide-screen .cg-person-admin{ max-width:820px; } body.dkr .marq.cg-moments{ width:100vw; max-width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); margin-top:-8px; margin-bottom:clamp(8px,1.2vw,16px); } body.dkr .city-guide-screen .cg-overture{ margin-top:clamp(26px,3.4vw,38px); } body.dkr .cg-secnav{ position:sticky; top:58px; z-index:20; background:rgba(34,19,43,.9); backdrop-filter:blur(10px); border-bottom:1px solid var(--dkr-line); } body.dkr .cg-secnav-track{ display:flex; gap:clamp(15px,2vw,26px); overflow-x:auto; scrollbar-width:none; padding:13px 1px; } body.dkr .cg-secnav-track::-webkit-scrollbar{ display:none; } body.dkr a.cg-secnav-chip{ flex:0 0 auto; font-family:var(--dkr-sans); font-size:13px; letter-spacing:.01em; color:var(--dkr-faint); text-decoration:none; white-space:nowrap; padding-bottom:6px; border-bottom:1.5px solid transparent; transition:color .16s, border-color .16s; } body.dkr a.cg-secnav-chip:hover{ color:var(--dkr-paper); } body.dkr a.cg-secnav-chip.is-active{ color:var(--dkr-paper); border-bottom-color:var(--amber); } body.dkr .city-guide-screen .cg-spine .cg-secnav + .cg-sec{ margin-top:clamp(18px,2.4vw,26px); } body.dkr a.cg-seeall{ display:inline-flex; align-items:center; gap:8px; margin-top:clamp(18px,2.4vw,26px); font-family:var(--dkr-sans); font-size:14px; font-weight:500; color:var(--amber); text-decoration:none; transition:gap .16s, color .16s; } body.dkr a.cg-seeall:hover{ gap:12px; color:#eea269; } body.dkr .city-guide-screen .cg-overture-grid{ grid-template-columns:repeat(auto-fill, minmax(210px,1fr)); gap:12px; } body.dkr .city-guide-screen .cg-overture-card{ padding:16px 18px; } body.dkr .city-guide-screen .cg-overture-card .mh-hub-name{ font-size:16px; } body.dkr .city-guide-screen .cg-jump{ position:sticky; top:0; z-index:6; display:flex; flex-wrap:wrap; gap:6px; padding:12px 0 10px; margin:clamp(26px,3.4vw,38px) 0 4px; background:linear-gradient(to bottom, var(--dkr-black) 72%, rgba(34,19,43,.86) 100%); backdrop-filter:blur(3px); } body.dkr .city-guide-screen .cg-jump-link{ display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border:1px solid var(--dkr-line); border-radius:2px; font-size:10.5px; letter-spacing:.06em; color:var(--dkr-muted); text-decoration:none; transition:border-color .16s, color .16s; } body.dkr .city-guide-screen .cg-jump-link:hover{ border-color:var(--amber); color:var(--dkr-paper); } body.dkr .city-guide-screen .cg-jump-count{ color:var(--dkr-faint); } body.dkr .city-guide-screen .cg-spine .cg-sec{ scroll-margin-top:120px; } body.dkr .city-guide-screen .cg-spine .cg-sec:first-child{ margin-top:clamp(10px,1.4vw,18px); } body.dkr .city-guide-screen .cg-sec .cg-list{ max-width:none; } @media (min-width:900px){ body.dkr .city-guide-screen .cg-sec .cg-list{ display:grid; grid-template-columns:1fr 1fr; column-gap:40px; } body.dkr .city-guide-screen .cg-sec .cg-hoods{ grid-template-columns:1fr 1fr 1fr; } } .cg-receipt{ display:flex; flex-wrap:wrap; align-items:baseline; gap:5px 10px; margin:0 0 9px 58px; font-family:ui-monospace, "SFMono-Regular", Menlo, monospace; font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; line-height:1.4; } .cg-receipt-cred{ color:#b5642e; font-weight:600; } .cg-receipt-at{ color:#9a9186; text-decoration:none; } .cg-receipt-at:hover{ color:#5f574c; } body.dkr .cg-receipt{ font-family:var(--dkr-mono); } body.dkr .cg-receipt-cred{ color:var(--amber); font-weight:400; } body.dkr .cg-receipt-at{ color:var(--dkr-faint); } body.dkr .cg-receipt-at:hover{ color:var(--dkr-paper); } .cg-person-card{ display:flex; flex-direction:column; } .cg-person-card .event-roster-card{ flex:0 0 auto; } .cg-kind-intent{ font-size:14px; line-height:1.5; color:#6b6157; max-width:60ch; margin:-2px 0 14px; } body.dkr .city-guide-screen .cg-kind-intent{ font-family:var(--dkr-sans); color:var(--dkr-muted); } .cg-startup-search{ display:block; width:100%; max-width:440px; margin:4px 0 16px; padding:10px 14px; font-size:15px; border:1px solid #d8d2c4; border-radius:4px; background:#fff; color:#2a1b33; } .cg-startup-search:focus{ outline:none; border-color:#b5642e; } .cg-startup-count{ font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:#9a9186; margin:12px 0 16px; } body.dkr .city-guide-screen .cg-startup-search{ background:var(--dkr-panel); border-color:var(--dkr-line); color:var(--dkr-paper); } body.dkr .city-guide-screen .cg-startup-search::placeholder{ color:var(--dkr-faint); } body.dkr .city-guide-screen .cg-startup-search:focus{ border-color:var(--amber); } body.dkr .city-guide-screen .cg-startup-count{ font-family:var(--dkr-mono); color:var(--dkr-faint); } .cg-hood-ledger{ display:flex; flex-wrap:wrap; gap:3px 9px; margin:10px 0 8px; font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:#8a8175; } .cg-hood-ledger span:not(:first-child)::before{ content:"· "; color:#c4bca9; } .cg-hood-strong{ font-size:13px; color:#6b6157; margin:0 0 12px; } .cg-hood-chips{ display:flex; flex-wrap:wrap; gap:6px; } .cg-hood-chip{ font-size:12px; padding:3px 10px; border:1px solid #e0dacb; border-radius:3px; color:#4a4238; } body.dkr .city-guide-screen .cg-hood-ledger{ font-family:var(--dkr-mono); color:var(--amber); } body.dkr .city-guide-screen .cg-hood-ledger span:not(:first-child)::before{ color:var(--dkr-faint); } body.dkr .city-guide-screen .cg-hood-strong{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .city-guide-screen .cg-hood-chip{ border-color:var(--dkr-line); color:var(--dkr-muted); } .cg-elsewhere-events{ margin-top:clamp(22px,3vw,32px); } .cg-elsewhere-eyebrow{ font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:#9a9186; margin:0 0 12px; } .cg-elsewhere-strip{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px; -webkit-overflow-scrolling:touch; } .cg-elsewhere-card{ scroll-snap-align:start; flex:0 0 auto; width:230px; display:flex; flex-direction:column; gap:7px; padding:16px 18px; border:1px solid #e0dacb; border-radius:6px; text-decoration:none; transition:border-color .16s, transform .16s; } .cg-elsewhere-card:hover{ border-color:#b5642e; transform:translateY(-2px); } .cg-elsewhere-city{ font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:#b5642e; } .cg-elsewhere-title{ font-size:15px; line-height:1.35; color:#2a1b33; } body.dkr .city-guide-screen .cg-elsewhere-eyebrow{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .city-guide-screen .cg-elsewhere-card{ border-color:var(--dkr-line); background:var(--dkr-panel); } body.dkr .city-guide-screen .cg-elsewhere-card:hover{ border-color:var(--amber); } body.dkr .city-guide-screen .cg-elsewhere-city{ font-family:var(--dkr-mono); color:var(--amber); } body.dkr .city-guide-screen .cg-elsewhere-title{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .shelf-screen .series-chip{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; border:1px solid var(--dkr-line); border-radius:0; color:var(--dkr-muted); background:transparent; padding:7px 12px; transition:color .16s, border-color .16s, background .16s; } body.dkr .shelf-screen .series-chip:hover{ color:var(--dkr-paper); border-color:var(--dkr-muted); background:transparent; } body.dkr .shelf-screen .series-chip.is-active{ color:var(--dkr-black); background:var(--dkr-paper); border-color:var(--dkr-paper); } body.dkr .shelf-screen .series-chip-count{ font-family:var(--dkr-mono); opacity:.6; } body.dkr .shelf-screen .series-sort-label{ color:var(--dkr-faint); } body.dkr .shelf-screen .series-sort-opt{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); border-radius:0; padding:4px 8px; } body.dkr .shelf-screen .series-sort-opt:hover{ color:var(--dkr-paper); background:transparent; } body.dkr .shelf-screen .series-sort-opt.is-on{ color:var(--amber); background:transparent; font-weight:500; } body.dkr .shelf-screen .series-board{ counter-reset:shelf; gap:0; margin-top:22px; border-top:1px solid var(--dkr-line); } body.dkr .shelf-screen .series-board > li{ position:relative; background:transparent; border:0; border-bottom:1px solid var(--dkr-line); border-radius:0; padding:20px 4px 20px 58px; transition:background .18s; } body.dkr .shelf-screen .series-board > li:hover{ background:rgba(255,255,255,.014); } body.dkr .shelf-screen .series-board > li[style*="--tally"]::after, body.dkr .ledger .ldg-item[style*="--tally"]::after{ content:""; position:absolute; left:0; bottom:-1px; height:2px; width:calc(var(--tally, 0) * 100%); background:var(--dkr-faint); transform-origin:left center; } body.dkr .shelf-screen .series-board > li.is-tally-lead[style*="--tally"]::after, body.dkr .ledger .ldg-item.is-tally-lead[style*="--tally"]::after{ background:var(--amber); } @media (prefers-reduced-motion: no-preference){ body.dkr .shelf-screen .series-board > li[style*="--tally"]::after, body.dkr .ledger .ldg-item[style*="--tally"]::after{ animation:dkr-tally-in .55s var(--dkr-ease) both; } @keyframes dkr-tally-in{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } } } body.dkr .tally-cap{ position:absolute; left:max(96px, calc(var(--tally, 0) * 100%)); bottom:3px; transform:translateX(-100%); padding-right:7px; font-family:var(--dkr-mono); font-size:9px; letter-spacing:.08em; color:var(--amber); white-space:nowrap; opacity:0; transition:opacity .2s var(--dkr-ease); pointer-events:none; } @media (hover: hover){ body.dkr .series-board-row:hover .tally-cap, body.dkr .ldg-item:hover .tally-cap{ opacity:.9; } } body.dkr .editors-ring{ position:absolute; inset:-9px -13px; pointer-events:none; z-index:4; } body.dkr .editors-ring-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; } body.dkr .editors-ring-path{ stroke:var(--amber); stroke-width:2; stroke-linecap:round; fill:none; stroke-dasharray:100; stroke-dashoffset:0; opacity:.92; } body.dkr .editors-ring-note{ position:absolute; top:-15px; left:50%; transform:translateX(-50%); font-size:8.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--amber); white-space:nowrap; opacity:.9; } @media (hover: none){ body.dkr .editors-ring-path{ stroke-width:3; } } @media (prefers-reduced-motion: no-preference){ body.dkr .editors-ring-path{ animation:dkr-ring-draw 1s var(--dkr-ease) .2s backwards; } @keyframes dkr-ring-draw{ from{ stroke-dashoffset:100; } to{ stroke-dashoffset:0; } } } @media (prefers-reduced-motion: no-preference){ body.dkr .ink-beat{ animation:dkr-ink-beat .4s var(--dkr-ease); } @keyframes dkr-ink-beat{ 0%{ box-shadow:0 0 0 0 rgba(224,134,74,.42); } 30%{ transform:scale(.955); } 100%{ box-shadow:0 0 0 9px rgba(224,134,74,0); transform:scale(1); } } } body.dkr .next-door{ margin-top:64px; } body.dkr .next-door-eb{ display:flex; align-items:center; gap:16px; margin-bottom:2px; } body.dkr .next-door-label{ flex:0 0 auto; color:var(--dkr-faint); } body.dkr .next-door-rule{ flex:1; height:1px; background:var(--dkr-line); } body.dkr .next-door-rows{ border-top:1px solid var(--dkr-line); } body.dkr .next-door-row{ display:grid; grid-template-columns:1fr auto; align-items:center; column-gap:20px; row-gap:5px; padding:20px 2px; border-bottom:1px solid var(--dkr-line); text-decoration:none; } body.dkr .next-door-name{ grid-column:1; grid-row:1; font-family:var(--dkr-sans); font-weight:600; font-size:19px; line-height:1.2; color:var(--dkr-paper); transition:color .16s; } body.dkr .next-door-dek{ grid-column:1; grid-row:2; font-size:14px; color:var(--dkr-muted); } body.dkr .next-door-go{ grid-column:2; grid-row:1 / 3; align-self:center; color:var(--dkr-faint); transition:transform .2s var(--dkr-ease), color .2s; } body.dkr .next-door-row:hover .next-door-name{ color:#fff; } body.dkr .next-door-row:hover .next-door-go{ transform:translateX(4px); color:var(--dkr-paper); } body.dkr .next-door-signoff{ margin:26px 0 0; color:var(--dkr-faint); text-align:center; } body.dkr .shelf-family{ display:flex; gap:24px; align-items:baseline; margin:0 0 24px; padding-bottom:13px; border-bottom:1px solid var(--dkr-line); overflow-x:auto; scrollbar-width:none; } body.dkr .shelf-family::-webkit-scrollbar{ display:none; } body.dkr .shelf-family-item{ display:inline-flex; align-items:baseline; gap:6px; flex:0 0 auto; text-decoration:none; color:var(--dkr-faint); transition:color .16s; } body.dkr .shelf-family-item:hover{ color:var(--dkr-paper); } body.dkr .shelf-family-name{ font-family:var(--dkr-sans); font-weight:500; font-size:14px; letter-spacing:.01em; } body.dkr .shelf-family-count{ font-size:10px; color:var(--dkr-faint); } body.dkr .shelf-family-item.is-here{ color:var(--dkr-paper); cursor:default; } body.dkr .shelf-family-item.is-here .shelf-family-name{ font-weight:600; } body.dkr .shelf-family-item.is-here .shelf-family-count{ color:var(--amber); } body.dkr .take-lead{ margin:20px 0 30px; } body.dkr .take-lead-quote{ position:relative; margin:0; font-family:var(--dkr-sans); font-weight:500; font-size:clamp(21px,2.9vw,29px); line-height:1.3; letter-spacing:-.01em; color:var(--dkr-paper); text-wrap:balance; } body.dkr .take-lead-quote::before{ content:"\201C"; position:absolute; left:-.52em; top:.06em; color:var(--amber); font-size:1.5em; line-height:1; } body.dkr .take-lead-by{ margin-top:14px; color:var(--dkr-faint); } @media (max-width: 560px){ body.dkr .take-lead-quote{ padding-left:.6em; } body.dkr .take-lead-quote::before{ left:-.05em; } } body.dkr .shelf-screen .series-board > li::before{ counter-increment:shelf; content:counter(shelf,decimal-leading-zero); position:absolute; left:0; top:22px; width:42px; font-family:var(--dkr-mono); font-size:12px; letter-spacing:.02em; color:var(--dkr-faint); font-variant-numeric:tabular-nums; } body.dkr .shelf-screen .series-board > li:first-child::before{ color:var(--amber); } body.dkr .shelf-screen .series-board-name{ font-family:var(--dkr-sans); font-weight:600; font-size:21px; line-height:1.25; color:var(--dkr-paper); } body.dkr .shelf-screen .series-board-name:hover{ color:var(--amber); } body.dkr .shelf-screen .series-board-meta{ color:var(--dkr-faint); } body.dkr .shelf-screen .series-empty{ color:var(--dkr-muted); } body.dkr .shelf-screen .series-btn-toggle{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); border-radius:0; padding:6px 9px; } body.dkr .shelf-screen .series-btn-toggle:hover{ color:var(--dkr-paper); } body.dkr .shelf-screen .series-btn-count{ font-family:var(--dkr-mono); } body.dkr .shelf-screen .series-btn-watched.is-on{ color:var(--amber); background:rgba(224,134,74,.1); } body.dkr .shelf-screen .series-btn-want.is-on{ color:var(--dkr-paper); background:rgba(255,255,255,.06); } body.dkr .shelf-screen .series-watch-btn{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--dkr-muted); border:1px solid var(--dkr-line); border-radius:0; background:transparent; } body.dkr .shelf-screen .series-watch-btn:hover{ color:var(--dkr-black); background:var(--dkr-paper); border-color:var(--dkr-paper); } body.dkr .shelf-screen .book-board-cover{ width:60px; height:90px; border-radius:2px; border-color:var(--dkr-line); filter:grayscale(1) sepia(.35) hue-rotate(-6deg) brightness(.82) contrast(1.04); transition:filter .45s ease; } body.dkr .shelf-screen .book-board-row:hover .book-board-cover{ filter:grayscale(0) brightness(1) contrast(1.04); } body.dkr .shelf-screen .book-board-author{ color:var(--dkr-muted); } body.dkr .shelf-screen .book-board-oneliner{ color:var(--dkr-paper); } body.dkr .shelf-screen .book-board-brief{ color:var(--dkr-muted); } body.dkr .shelf-screen .series-board-reccount-label{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .shelf-screen .book-facet-label{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .shelf-podcasts .series-board > li{ padding-left:4px; } body.dkr .shelf-podcasts .series-board > li::before{ content:none; } body.dkr .shelf-podcasts .episode-thumb-img{ border-radius:2px; border-color:var(--dkr-line); background:var(--dkr-panel); filter:grayscale(1) sepia(.35) hue-rotate(-6deg) brightness(.84) contrast(1.03); transition:filter .45s ease; } body.dkr .shelf-podcasts .episode-thumb-link:hover .episode-thumb-img{ filter:grayscale(0) brightness(1) contrast(1.03); } body.dkr .shelf-podcasts .episode-board-row:hover{ box-shadow:none; } body.dkr .shelf-podcasts .episode-card-title a{ font-family:var(--dkr-sans); font-weight:600; font-size:17px; color:var(--dkr-paper); } body.dkr .shelf-podcasts .episode-card-title a:hover{ color:var(--amber); } body.dkr .shelf-podcasts .episode-byline{ color:var(--dkr-muted); } body.dkr .shelf-podcasts .episode-channel-link{ color:var(--dkr-paper); } body.dkr .shelf-podcasts .episode-channel-link:hover{ color:var(--amber); } body.dkr .shelf-podcasts .episode-blurb{ color:var(--dkr-faint); } body.dkr .shelf-podcasts .episode-tag{ font-family:var(--dkr-mono); font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; padding:3px 8px; } body.dkr .shelf-podcasts .episode-tag:hover{ color:var(--dkr-paper); background:transparent; border-color:var(--dkr-muted); } body.dkr .shelf-podcasts .episode-card-actions{ border-top-color:var(--dkr-line); } body.dkr .shelf-podcasts .episode-signal .series-btn-toggle{ border:1px solid var(--dkr-line); border-radius:0; background:transparent; padding:6px 11px; } body.dkr .shelf-podcasts .episode-signal .series-btn-toggle:hover{ border-color:var(--dkr-muted); background:transparent; color:var(--dkr-paper); } body.dkr .shelf-podcasts .episode-signal .series-btn-watched.is-on{ color:var(--amber); border-color:var(--amber); background:rgba(224,134,74,.1); } body.dkr .shelf-podcasts .episode-signal .series-btn-want.is-on{ color:var(--dkr-paper); border-color:var(--dkr-muted); background:rgba(255,255,255,.05); } body.dkr .shelf-podcasts .episode-external{ color:var(--dkr-muted); } body.dkr .shelf-podcasts .episode-external:hover{ color:var(--amber); } body.dkr .shelf-podcasts .episode-leaderboard-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .shelf-podcasts .episode-listing-head{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .shelf-podcasts .episode-more-count{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .shelf-podcasts .episode-rank-badge{ background:rgba(34,19,43,.82); } body.dkr .shelf-podcasts .episode-featured:first-child .episode-rank-badge{ background:var(--amber); color:var(--dkr-black); } body.dkr .shelf-podcasts .episode-search-input{ background:var(--dkr-panel); border:1px solid var(--dkr-line); color:var(--dkr-paper); border-radius:0; } body.dkr .shelf-podcasts .episode-search-input::placeholder{ color:var(--dkr-faint); } body.dkr .shelf-podcasts .episode-search-btn{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; background:var(--dkr-paper); color:var(--dkr-black); border:0; border-radius:0; } body.dkr .shelf-podcasts .episode-search-clear{ color:var(--dkr-muted); } body.dkr .shelf-reading .reading-list{ gap:0; border-top:1px solid var(--dkr-line); margin-top:22px; } body.dkr .shelf-reading .reading-row{ background:transparent; border:0; border-bottom:1px solid var(--dkr-line); border-radius:0; overflow:visible; padding:22px 0; transition:background .18s; } body.dkr .shelf-reading .reading-row:hover{ background:rgba(255,255,255,.014); } body.dkr .shelf-reading .reading-band{ background:none; padding:0; min-height:0; margin-bottom:9px; } body.dkr .shelf-reading .reading-band-cat{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .shelf-reading .reading-row-body{ padding:0; } body.dkr .shelf-reading .reading-title{ font-family:var(--dkr-sans); font-weight:600; font-size:21px; line-height:1.25; color:var(--dkr-paper); } body.dkr .shelf-reading .reading-title-link{ color:var(--dkr-paper); } body.dkr .shelf-reading .reading-title-link:hover{ color:var(--amber); } body.dkr .shelf-reading .reading-byline{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .shelf-reading .reading-tagline{ color:var(--dkr-muted); } body.dkr .shelf-reading .reading-why{ color:var(--dkr-muted); } body.dkr .shelf-reading .reading-why-label{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--amber); } body.dkr .shelf-reading .series-genre-chip{ font-family:var(--dkr-mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; padding:3px 8px; } body.dkr .shelf-reading .reading-save.is-on, body.dkr .shelf-reading .reading-recommend.is-on{ color:var(--amber); border-color:transparent; background:rgba(224,134,74,.1); } body.dkr .shelf-reading .series-sort-label{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-faint); margin-right:2px; } body.dkr .shelf-reading .series-topics{ margin-top:10px; } body.dkr .cs{ max-width:var(--dkr-max); margin:0 auto; padding:clamp(20px,3vw,40px) clamp(16px,3vw,32px) 60px; } body.dkr .cs-mast{ margin-bottom:clamp(20px,3vw,30px); } body.dkr .cs-eyebrow{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .cs-h1{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.02em; font-size:clamp(38px,6vw,66px); line-height:1.02; color:var(--dkr-paper); margin:10px 0 0; } body.dkr .cs-standfirst{ max-width:var(--reading-max,640px); color:var(--dkr-muted); font-size:clamp(15px,1.5vw,17px); line-height:1.5; margin:14px 0 0; } body.dkr .cs-state{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; font-size:11.5px; letter-spacing:.03em; text-transform:uppercase; color:var(--dkr-faint); padding:16px 0; border-top:1px solid var(--dkr-line); border-bottom:1px solid var(--dkr-line); } body.dkr .cs-dot{ opacity:.5; } body.dkr .cs-filter{ display:flex; align-items:center; gap:10px; margin-top:22px; font-size:11px; letter-spacing:.04em; text-transform:uppercase; } body.dkr .cs-filter-label{ color:var(--dkr-faint); } body.dkr .cs-filter-tag{ color:var(--dkr-black); background:var(--amber); padding:3px 9px; } body.dkr .cs-filter-clear{ color:var(--dkr-muted); text-decoration:none; } body.dkr .cs-filter-clear:hover{ color:var(--dkr-paper); } body.dkr .cs-section{ margin-top:clamp(26px,4vw,44px); } body.dkr .cs-eb{ display:flex; align-items:baseline; gap:16px; margin-bottom:20px; } body.dkr .cs-eb-label{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--dkr-muted); flex:0 0 auto; } body.dkr .cs-eb-rule{ flex:1 1 auto; height:1px; background:var(--dkr-line); } body.dkr .cs-eb-link{ flex:0 0 auto; font-family:var(--dkr-mono); font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--dkr-muted); text-decoration:none; } body.dkr .cs-eb-link:hover{ color:var(--amber); } body.dkr .cs-sheet{ display:grid; grid-template-columns:repeat(auto-fill, minmax(clamp(110px,13vw,146px),1fr)); gap:clamp(16px,1.8vw,26px); } body.dkr .cs-frame{ position:relative; display:block; text-decoration:none; color:inherit; } body.dkr .cs-sheet .dkr-pic{ border:1px solid var(--dkr-line); } body.dkr .cs-frame:hover .dkr-pic{ border-color:var(--dkr-faint); } body.dkr .cs-more-toggle{ position:absolute; opacity:0; pointer-events:none; } body.dkr .cs-sheet-rest{ display:none; margin-top:clamp(16px,1.8vw,26px); } body.dkr .cs-more-toggle:checked ~ .cs-sheet-rest{ display:grid; } body.dkr .cs-more-btn{ display:inline-block; margin-top:clamp(20px,2.6vw,30px); font-family:var(--dkr-mono); font-size:12px; letter-spacing:.04em; color:var(--amber); cursor:pointer; transition:color .16s; } body.dkr .cs-more-btn:hover{ color:#eea269; } body.dkr .cs-more-close{ display:none; } body.dkr .cs-more-toggle:checked ~ .cs-more-btn .cs-more-open{ display:none; } body.dkr .cs-more-toggle:checked ~ .cs-more-btn .cs-more-close{ display:inline; } body.dkr .cs-empty{ color:var(--dkr-muted); margin-top:24px; } body.dkr .cs-empty-link{ color:var(--amber); text-decoration:none; } body.dkr .cs-empty{ color:var(--dkr-muted); margin-top:24px; } body.dkr .cs-empty-link{ color:var(--amber); text-decoration:none; } body.dkr .pf{ max-width:var(--dkr-max); margin:0 auto; padding:clamp(20px,3vw,40px) clamp(16px,3vw,32px) 28px; } body.dkr .pf-welcome{ font-size:12px; letter-spacing:.02em; color:var(--amber); margin-bottom:18px; } body.dkr .pf-shared{ font-size:11.5px; letter-spacing:.02em; text-transform:uppercase; color:var(--dkr-muted); margin-bottom:18px; } body.dkr .pf-hero{ display:grid; grid-template-columns:clamp(190px,26vw,290px) 1fr; gap:clamp(24px,4vw,54px); align-items:start; } body.dkr .pf-portrait{ position:relative; aspect-ratio:4/5; overflow:hidden; border:1px solid var(--dkr-line); background:var(--dkr-panel); } body.dkr .pf-portrait img{ position:absolute; inset:0; z-index:1; width:100%; height:100%; object-fit:cover; filter:grayscale(1) sepia(.35) hue-rotate(-6deg) contrast(1.04) brightness(.96); transition:filter .6s var(--dkr-ease); } body.dkr .pf-portrait:hover img{ filter:grayscale(0) contrast(1.02) brightness(1); } body.dkr .pf-portrait-mark{ position:absolute; inset:0; z-index:0; display:flex; align-items:center; justify-content:center; background:linear-gradient(150deg, #2a1b33 0%, #1e1128 100%); color:var(--dkr-muted); font-family:var(--dkr-sans); font-weight:600; font-size:64px; box-shadow:inset 0 1px 0 rgba(255,255,255,.03); } body.dkr .pf-headline{ padding-top:4px; } body.dkr .pf-city{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .pf-name{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.015em; font-size:clamp(32px,4.6vw,52px); line-height:1.03; color:var(--dkr-paper); margin:8px 0 0; display:flex; align-items:center; gap:10px; flex-wrap:wrap; } body.dkr .pf-meta{ font-size:12px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); margin-top:12px; } body.dkr .pf-about{ max-width:46ch; color:var(--dkr-paper); font-size:clamp(15px,1.5vw,17px); line-height:1.55; margin:16px 0 0; } body.dkr .pf-links{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-top:20px; } body.dkr .pf-social{ color:var(--dkr-muted); display:inline-flex; transition:color .15s; } body.dkr .pf-social:hover{ color:var(--amber); } body.dkr .pf-social svg{ width:20px; height:20px; } body.dkr .pf-pinned{ font-size:11px; letter-spacing:.03em; color:var(--dkr-muted); text-decoration:none; } body.dkr .pf-pinned:hover{ color:var(--amber); } body.dkr .pf-edit{ display:inline-block; margin-top:22px; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--dkr-paper); text-decoration:none; border:1px solid var(--dkr-line); padding:9px 16px; transition:background .16s, color .16s, border-color .16s; } body.dkr .pf-edit:hover{ background:var(--dkr-paper); color:var(--dkr-black); border-color:var(--dkr-paper); } body.dkr .pf-block{ max-width:var(--reading-max,660px); margin-top:clamp(28px,4vw,44px); padding-top:clamp(24px,3vw,34px); border-top:1px solid var(--dkr-line); } body.dkr .pf-block-label{ display:block; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-faint); margin-bottom:12px; } body.dkr .pf-prose{ color:var(--dkr-paper); font-size:15.5px; line-height:1.65; } body.dkr .pf-prose p{ margin:0 0 10px; } body.dkr .pf-wants{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:clamp(20px,3vw,40px); } body.dkr .pf-want-list{ list-style:none; padding:0; margin:0; } body.dkr .pf-want-list li{ color:var(--dkr-paper); font-size:15px; line-height:1.5; padding:6px 0 6px 16px; position:relative; border-bottom:1px solid var(--dkr-line); } body.dkr .pf-want-list li::before{ content:"›"; position:absolute; left:0; color:var(--amber); } body.dkr .pf-want-list li:last-child{ border-bottom:0; } body.dkr .pf-showing{ border-top-color:var(--amber); } body.dkr .pf-showing .pf-block-label{ color:var(--amber); } body.dkr .pf-showing-line{ color:var(--dkr-paper); font-size:16px; line-height:1.5; margin:0; } body.dkr .pf-showing-event{ color:var(--dkr-muted); text-decoration:none; } body.dkr .pf-showing-link{ color:var(--dkr-paper); text-decoration:none; border-bottom:1px solid var(--amber); } body.dkr .pf-showing-video{ position:relative; margin-top:16px; max-width:420px; aspect-ratio:16/9; overflow:hidden; border:1px solid var(--dkr-line); cursor:pointer; } body.dkr .pf-showing-thumb{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) sepia(.35) hue-rotate(-6deg) brightness(.85); transition:filter .4s; } body.dkr .pf-showing-video:hover .pf-showing-thumb{ filter:grayscale(0) brightness(1); } body.dkr .pf-showing-play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:34px; color:#fff; text-shadow:0 2px 8px rgba(0,0,0,.6); } body.dkr .pf-nudge, body.dkr .pf-admin{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:30px; padding-top:22px; border-top:1px solid var(--dkr-line); font-size:11px; letter-spacing:.03em; } body.dkr .pf-nudge-lead{ color:var(--dkr-muted); text-transform:none; letter-spacing:0; font-size:13px; } body.dkr .pf-nudge-actions{ display:flex; flex-wrap:wrap; gap:8px; } body.dkr .pf-nudge-pill, body.dkr .pf-admin-btn{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--dkr-paper); text-decoration:none; border:1px solid var(--dkr-line); background:transparent; padding:7px 12px; cursor:pointer; } body.dkr .pf-nudge-pill:hover, body.dkr .pf-admin-btn:hover{ border-color:var(--dkr-muted); } body.dkr .pf-admin form{ margin:0; display:inline-flex; } body.dkr .pf-admin-state{ text-transform:uppercase; color:var(--dkr-muted); } body.dkr .pf-admin-off{ color:var(--dkr-faint); } body.dkr .pf-more{ margin-top:clamp(30px,4vw,48px); } @media(max-width:640px){ body.dkr .pf-hero{ grid-template-columns:1fr; gap:22px; } body.dkr .pf-portrait{ max-width:220px; } } body.dkr .register{ max-width:860px; margin:0 auto; padding:clamp(20px,3vw,44px) clamp(16px,3vw,28px) 60px; } body.dkr .reg-eyebrow{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .reg-lede{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.01em; font-size:clamp(19px,2.4vw,26px); line-height:1.3; color:var(--dkr-paper); margin:8px 0 0; max-width:34ch; } body.dkr .reg-standfirst{ max-width:56ch; color:var(--dkr-muted); font-size:clamp(14px,1.4vw,16px); line-height:1.55; margin:14px 0 0; } @media (min-width:768px){ body.dkr .register .feed-item{ padding:24px 28px; border-radius:18px; } body.dkr .register .feed-item-title, body.dkr .register .feed-item-title-link{ font-size:23px; } body.dkr .register .feed-item-prose{ font-size:16.5px; line-height:1.62; } body.dkr .register .clip-tweet{ padding:16px 18px; } body.dkr .register .clip-tweet-text{ font-size:16.5px; line-height:1.55; } body.dkr .register .clip-tweet-name{ font-size:15px; } } body.dkr .register .feed-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; padding:0; } body.dkr .register .feed-chip{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; padding:6px 11px; text-decoration:none; } body.dkr .register .feed-chip:hover{ color:var(--dkr-paper); border-color:var(--dkr-muted); } body.dkr .register .feed-chip.is-active{ color:var(--dkr-black); background:var(--dkr-paper); border-color:var(--dkr-paper); } body.dkr .register .feed-chip-count{ opacity:.6; } body.dkr .register .feed-new-pill{ font-family:var(--dkr-mono); font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--dkr-black); background:var(--amber); border:0; border-radius:0; padding:8px 15px; cursor:pointer; margin-top:16px; } body.dkr .register .feed-stream{ margin-top:24px; border-top:0; display:flex; flex-direction:column; gap:14px; } body.dkr .register .feed-item{ position:relative; background:var(--dkr-panel); border:1px solid var(--dkr-line); border-radius:16px; box-shadow:0 1px 2px rgba(0,0,0,.28); padding:16px 18px; transition:border-color .16s ease; } body.dkr .register .feed-item:hover{ border-color:var(--dkr-muted); } body.dkr .register .feed-item.is-new{ border-color:rgba(198,74,26,.42); } body.dkr .register .feed-item.is-pinned{ border-color:var(--amber); box-shadow:0 0 0 1px rgba(198,74,26,.35); } body.dkr .register .feed-item-body{ gap:9px; } body.dkr .register .feed-item-new-dot{ position:absolute; right:16px; top:18px; width:7px; height:7px; border-radius:50%; background:var(--amber); box-shadow:0 0 0 3px rgba(198,74,26,.18); } body.dkr .register .feed-item-head{ display:flex; align-items:center; gap:11px; margin-bottom:12px; } body.dkr .register .feed-item-avatar{ filter:grayscale(.25); border:1px solid var(--dkr-line); } body.dkr .register .feed-item-meta{ display:flex; flex-direction:column; gap:2px; } body.dkr .register .feed-item-actor{ font-family:var(--dkr-sans); font-weight:600; font-size:14px; color:var(--dkr-paper); } body.dkr .register .feed-item-kind-tag{ font-family:var(--dkr-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--dkr-muted); background:rgba(255,255,255,.04); border:1px solid var(--dkr-line); border-radius:999px; padding:3px 10px; } body.dkr .register .feed-item-time{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.03em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .register .feed-item-pin-tag{ margin-left:auto; } body.dkr .register .feed-item-link{ display:block; text-decoration:none; color:inherit; } body.dkr .register .feed-item-title, body.dkr .register .feed-item-title-link{ font-family:var(--dkr-sans); font-weight:600; font-size:18px; line-height:1.3; color:var(--dkr-paper); text-decoration:none; } body.dkr .register .feed-item-link:hover .feed-item-title, body.dkr .register .feed-item-title-link:hover{ color:var(--amber); } body.dkr .register .feed-item-sub{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.02em; color:var(--dkr-faint); margin-top:6px; } body.dkr .register .feed-item-sub-emphasis{ color:var(--dkr-muted); } body.dkr .register .feed-item-prose{ color:var(--dkr-muted); font-size:14.5px; line-height:1.55; margin-top:8px; } body.dkr .feed-item-prose a{ color:var(--amber); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:2px; } body.dkr .feed-item-prose a:hover{ color:var(--dkr-paper); } body.dkr .register .feed-item-ask-body{ color:var(--dkr-paper); font-size:16px; line-height:1.5; } body.dkr .register .feed-item-tag{ font-family:var(--dkr-mono); font-size:10px; letter-spacing:.03em; text-transform:uppercase; color:var(--dkr-muted); background:rgba(255,255,255,.04); border:1px solid var(--dkr-line); border-radius:999px; padding:3px 9px; } body.dkr .register .feed-item-source{ font-family:var(--dkr-mono); font-size:11px; color:var(--dkr-muted); } body.dkr .register .feed-item-clip-source{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--amber); } body.dkr .register .clip-tweet{ margin-top:12px; border:1px solid var(--dkr-line); border-radius:14px; padding:14px 15px; background:rgba(255,255,255,.02); } body.dkr .register .clip-tweet-head{ display:flex; align-items:center; gap:10px; } body.dkr .register .clip-tweet-avatar{ width:40px; height:40px; border-radius:50%; object-fit:cover; border:1px solid var(--dkr-line); } body.dkr .register .clip-tweet-id{ display:flex; flex-direction:column; line-height:1.2; min-width:0; } body.dkr .register .clip-tweet-name{ font-family:var(--dkr-sans); font-weight:600; font-size:14px; color:var(--dkr-paper); } body.dkr .register .clip-tweet-handle{ font-family:var(--dkr-mono); font-size:12px; color:var(--dkr-faint); } body.dkr .register .clip-tweet-logo{ margin-left:auto; color:var(--dkr-muted); display:flex; } body.dkr .register .clip-tweet-logo:hover{ color:var(--dkr-paper); } body.dkr .register .clip-tweet-text{ margin-top:10px; color:var(--dkr-paper); font-size:15px; line-height:1.5; } body.dkr .register .clip-tweet-text p{ margin:0 0 8px; } body.dkr .register .clip-tweet-text p:last-child{ margin-bottom:0; } body.dkr .register .clip-tweet-media{ position:relative; margin-top:12px; border-radius:12px; overflow:hidden; border:1px solid var(--dkr-line); background:#000; } body.dkr .register .clip-tweet-facade{ display:block; width:100%; padding:0; border:0; background:#000; cursor:pointer; position:relative; } body.dkr .register .clip-tweet-poster{ display:block; width:100%; height:auto; } body.dkr .register .clip-tweet-facade .feed-item-video-play{ position:absolute; inset:0; margin:auto; width:60px; height:42px; display:flex; align-items:center; justify-content:center; } body.dkr .register .clip-tweet-media .episode-player, body.dkr .register .clip-tweet-media video{ width:100%; display:block; } body.dkr .register .clip-tweet-photos{ margin-top:12px; display:grid; gap:3px; border-radius:12px; overflow:hidden; } body.dkr .register .clip-tweet-photos-1{ grid-template-columns:1fr; } body.dkr .register .clip-tweet-photos-2, body.dkr .register .clip-tweet-photos-3, body.dkr .register .clip-tweet-photos-4{ grid-template-columns:1fr 1fr; } body.dkr .register .clip-tweet-photo{ width:100%; height:100%; object-fit:cover; display:block; aspect-ratio:16/10; } body.dkr .register .clip-tweet-gallery-head{ margin-top:14px; font-family:var(--dkr-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .register .clip-tweet-gallery{ margin-top:12px; display:flex; flex-direction:column; gap:18px; } body.dkr .register .clip-tweet-shot{ margin:0; } body.dkr .register .clip-tweet-shot-img{ display:block; width:100%; height:auto; border-radius:10px; border:1px solid var(--dkr-line); background:#fff; } body.dkr .register .clip-tweet-shot-cap{ margin-top:9px; font-family:var(--dkr-sans); font-size:13px; line-height:1.5; color:var(--dkr-muted); } body.dkr .register .clip-tweet-permalink{ display:inline-block; margin-top:12px; font-family:var(--dkr-mono); font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--dkr-muted); text-decoration:none; } body.dkr .register .clip-tweet-permalink:hover{ color:var(--amber); } body.dkr .register .clip-tweet-shot-img, body.dkr .register .clip-tweet-poster, body.dkr .register .clip-tweet-photo, body.dkr .register .feed-item-video-cover, body.dkr .register .feed-item-cover{ filter:brightness(.84) contrast(1.02); transition:filter .2s ease; } body.dkr .register .clip-tweet-shot a:hover .clip-tweet-shot-img, body.dkr .register .clip-tweet-photo-link:hover .clip-tweet-photo, body.dkr .register .clip-tweet-facade:hover .clip-tweet-poster, body.dkr .register .feed-item-video-facade:hover .feed-item-video-cover, body.dkr .register .feed-item-cover-link:hover .feed-item-cover{ filter:none; } body.dkr .register .feed-item-permalink{ display:inline-block; margin-top:12px; font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-faint); text-decoration:none; } body.dkr .register .feed-item-permalink:hover{ color:var(--amber); } body.dkr .clip-show .reg-eyebrow{ margin-bottom:20px; } body.dkr .clip-show-kicker-link{ color:var(--dkr-faint); text-decoration:none; } body.dkr .clip-show-kicker-link:hover{ color:var(--dkr-paper); } body.dkr .clip-show-related{ margin-top:28px; padding-top:20px; border-top:1px solid var(--dkr-line); } body.dkr .clip-show-related-label{ display:block; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--dkr-faint); margin-bottom:10px; } body.dkr .clip-show-related ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; } body.dkr .clip-show-related-link{ color:var(--dkr-muted); text-decoration:none; font-size:15px; } body.dkr .clip-show-related-link:hover{ color:var(--amber); } body.dkr .clip-show-back{ margin-top:28px; } body.dkr .register .feed-item-attached{ font-family:var(--dkr-mono); font-size:11px; color:var(--dkr-faint); margin-top:8px; } body.dkr .register .feed-item-cover-link, body.dkr .register .feed-item-video{ display:block; margin-top:4px; border-radius:12px; overflow:hidden; } body.dkr .register .feed-item-cover, body.dkr .register .feed-item-video-cover{ display:block; width:100%; border:1px solid var(--dkr-line); border-radius:12px; filter:none; } body.dkr .register .feed-item-rollup{ display:flex; } body.dkr .register .feed-item-rsvper-face{ filter:grayscale(1) sepia(.35) hue-rotate(-6deg); } body.dkr .register .feed-item-actions{ margin-top:12px; } body.dkr .register .feed-rsvp-btn{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--dkr-paper); background:transparent; border:1px solid var(--dkr-line); border-radius:0; padding:8px 14px; cursor:pointer; } body.dkr .register .feed-rsvp-btn:hover{ background:var(--dkr-paper); color:var(--dkr-black); border-color:var(--dkr-paper); } body.dkr .register .feed-rsvp-going{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--amber); } body.dkr .register .feed-rsvp-off{ color:var(--dkr-muted); } body.dkr .register .event-showcase-btn{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; padding:6px 11px; cursor:pointer; } body.dkr .register .event-showcase-btn.is-on{ color:var(--amber); border-color:var(--amber); background:rgba(224,134,74,.1); } body.dkr .register .event-showcase-count{ font-family:var(--dkr-mono); font-size:11px; color:var(--dkr-muted); } body.dkr .register .event-showcase-hint{ font-family:var(--dkr-mono); font-size:10.5px; color:var(--dkr-faint); } body.dkr .register .series-btn-toggle{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); border:1px solid var(--dkr-line); border-radius:0; background:transparent; padding:6px 10px; } body.dkr .register .series-btn-toggle:hover{ color:var(--dkr-paper); border-color:var(--dkr-muted); } body.dkr .register .series-btn-watched.is-on, body.dkr .register .series-btn-want.is-on{ color:var(--amber); border-color:var(--amber); background:rgba(224,134,74,.1); } body.dkr .register .feed-item-expand-toggle{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:0; cursor:pointer; padding:8px 0 0; } body.dkr .register .feed-item-expand-toggle:hover{ color:var(--dkr-paper); } body.dkr .register .feed-load-more{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--dkr-paper); background:transparent; border:1px solid var(--dkr-line); border-radius:0; padding:11px 18px; display:inline-block; text-decoration:none; margin-top:24px; } body.dkr .register .feed-load-more:hover{ background:var(--dkr-paper); color:var(--dkr-black); border-color:var(--dkr-paper); } body.dkr .register .reg-empty{ color:var(--dkr-muted); margin-top:32px; line-height:1.55; } body.dkr .register .reg-empty-link{ color:var(--amber); text-decoration:none; } body.dkr .register .story-strip{ display:flex; gap:6px; margin-top:12px; } body.dkr .register .story-strip-cell{ flex:1 1 0; aspect-ratio:1/1; border-radius:8px; overflow:hidden; border:1px solid var(--dkr-line); } body.dkr .register .story-strip-img{ width:100%; height:100%; object-fit:cover; display:block; filter:none; } body.dkr .story-show .reg-eyebrow{ margin-bottom:20px; } body.dkr .story-show-head{ margin-bottom:8px; } body.dkr .story-show-title{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.02em; font-size:clamp(26px,3.4vw,40px); line-height:1.06; color:var(--dkr-paper); margin:0; } body.dkr .story-show-intro{ max-width:60ch; color:var(--dkr-muted); font-size:clamp(15px,1.5vw,17px); line-height:1.6; margin:14px 0 0; } body.dkr .story-show-count{ font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--dkr-faint); margin:14px 0 0; } body.dkr .story-posts{ list-style:none; margin:28px 0 0; padding:0; display:flex; flex-direction:column; gap:0; } body.dkr .story-post{ padding:24px 0; border-top:1px solid var(--dkr-line); } body.dkr .story-post:first-child{ border-top:0; padding-top:4px; } body.dkr .story-post-commentary{ color:var(--dkr-paper); font-size:15.5px; line-height:1.6; margin:0 0 12px; } body.dkr .story-post-caption{ font-size:11px; color:var(--dkr-faint); margin:10px 0 0; } body.dkr .story-post-source{ color:var(--dkr-muted); } body.dkr .story-post-link{ color:var(--dkr-muted); text-decoration:none; } body.dkr .story-post-link:hover{ color:var(--amber); } body.dkr .prompt-show .reg-eyebrow{ margin-bottom:20px; } body.dkr .prompt-head{ margin-bottom:28px; } body.dkr .prompt-question{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.02em; font-size:clamp(26px,3.4vw,40px); line-height:1.08; color:var(--dkr-paper); margin:0; max-width:22ch; } body.dkr .prompt-intro{ max-width:60ch; color:var(--dkr-muted); font-size:clamp(15px,1.5vw,17px); line-height:1.6; margin:14px 0 0; } body.dkr .prompt-count{ font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--dkr-faint); margin:14px 0 0; } body.dkr .prompt-answer-label{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--dkr-faint); margin:0 0 12px; padding:0; } body.dkr .prompt-chips{ display:flex; flex-wrap:wrap; gap:8px; border:0; margin:0; padding:0; } body.dkr .prompt-chip{ font-family:var(--dkr-sans); font-size:14.5px; line-height:1.35; text-align:left; color:var(--dkr-paper); background:var(--dkr-panel); border:1px solid var(--dkr-line); border-radius:999px; padding:11px 16px; cursor:pointer; transition:background .18s var(--dkr-ease), border-color .18s var(--dkr-ease), color .18s var(--dkr-ease); } body.dkr .prompt-chip:hover{ background:var(--dkr-paper); color:var(--dkr-black); border-color:var(--dkr-paper); } body.dkr .prompt-chip-radio{ display:inline-flex; align-items:center; gap:8px; } body.dkr .prompt-chip-radio:hover{ background:var(--dkr-panel); color:var(--dkr-paper); border-color:var(--amber); } body.dkr .prompt-chip-radio input{ accent-color:var(--amber); margin:0; } body.dkr .prompt-chip-radio:has(input:checked){ border-color:var(--amber); background:#2f1d3c; } body.dkr .prompt-write{ margin-top:26px; } body.dkr .prompt-write-nudge{ color:var(--dkr-muted); font-size:14px; line-height:1.55; margin:0 0 14px; max-width:52ch; } body.dkr .prompt-write-toggle{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--amber); cursor:pointer; list-style:none; display:inline-block; padding:4px 0; } body.dkr .prompt-write-toggle::-webkit-details-marker{ display:none; } body.dkr .prompt-write-toggle:hover{ color:var(--dkr-paper); } body.dkr .prompt-write-body{ display:flex; flex-direction:column; gap:12px; margin-top:14px; max-width:56ch; } body.dkr .prompt-write-body .cta-btn{ align-self:flex-start; } body.dkr .prompt-mine{ border:1px solid var(--dkr-line); border-radius:16px; padding:18px; background:var(--dkr-panel); } body.dkr .prompt-mine-label{ font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--dkr-faint); margin:0 0 8px; } body.dkr .prompt-mine .prompt-response{ border-top:0; padding:0; } body.dkr .prompt-gate{ border:1px solid var(--dkr-line); border-radius:16px; padding:18px; background:var(--dkr-panel); } body.dkr .prompt-gate-text{ color:var(--dkr-muted); font-size:15px; line-height:1.55; margin:0 0 12px; } body.dkr .prompt-responses{ margin-top:36px; } body.dkr .prompt-response{ padding:24px 0; border-top:1px solid var(--dkr-line); } body.dkr .prompt-responses .prompt-response:first-child{ border-top:0; padding-top:4px; } body.dkr .prompt-response-answer{ font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--amber); margin:0; } body.dkr .prompt-response-friend{ font-family:var(--dkr-sans); font-weight:600; font-size:19px; line-height:1.25; color:var(--dkr-paper); margin:10px 0 0; } body.dkr .prompt-response-body{ color:var(--dkr-paper); font-size:15.5px; line-height:1.62; margin:10px 0 0; max-width:62ch; } body.dkr .prompt-response-by{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:14px; } body.dkr .prompt-response-founder{ display:inline-flex; align-items:center; gap:8px; text-decoration:none; color:var(--dkr-paper); } body.dkr .prompt-response-founder:hover .prompt-response-name{ color:var(--amber); } body.dkr .prompt-response-avatar{ width:32px; height:32px; border-radius:50%; object-fit:cover; filter:grayscale(.25); } body.dkr .prompt-response-name{ font-size:14px; font-weight:600; color:var(--dkr-paper); display:inline-flex; align-items:center; gap:4px; transition:color .18s var(--dkr-ease); } body.dkr .prompt-response-role{ font-size:12.5px; color:var(--dkr-faint); } body.dkr .prompt-response-remove{ margin-left:auto; font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--dkr-faint); background:transparent; border:1px solid var(--dkr-line); border-radius:999px; padding:5px 12px; cursor:pointer; } body.dkr .prompt-response-remove:hover{ color:var(--dkr-paper); border-color:var(--dkr-paper); } body.dkr .ledger{ max-width:1040px; margin:0 auto; padding:clamp(20px,3vw,40px) clamp(16px,3vw,28px) 60px; } @media(min-width:1024px){ body.dkr .ledger .ldg-item{ padding-top:26px; padding-bottom:26px; } body.dkr .ledger .showcase-compact-idea{ font-size:22px; } body.dkr .ledger .showcase-compact-video{ max-width:460px; } } body.dkr .ldg-eyebrow{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .ldg-h1{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.02em; font-size:clamp(36px,5.5vw,60px); line-height:1.02; color:var(--dkr-paper); margin:10px 0 0; } body.dkr .ldg-standfirst{ max-width:56ch; color:var(--dkr-muted); font-size:clamp(14px,1.4vw,16px); line-height:1.55; margin:14px 0 0; } body.dkr .ldg-explain{ margin-top:clamp(30px,4vw,44px); padding-top:clamp(26px,3.4vw,36px); border-top:1px solid var(--dkr-line); } body.dkr .ldg-explain-lede{ max-width:62ch; color:var(--dkr-paper); font-family:var(--dkr-sans); font-size:clamp(15px,1.5vw,17px); line-height:1.6; margin:0; } body.dkr .ldg-facets{ margin:clamp(24px,3.4vw,36px) 0 0; display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,52px); } body.dkr .ldg-facet{ display:flex; flex-direction:column; gap:9px; } body.dkr .ldg-facet-label{ font-size:12px; letter-spacing:.02em; text-transform:none; color:var(--amber); } body.dkr .ldg-facet-b{ color:var(--dkr-muted); font-family:var(--dkr-sans); font-size:14.5px; line-height:1.6; margin:0; max-width:46ch; } body.dkr .ldg-explain-foot{ margin:clamp(20px,2.6vw,28px) 0 0; color:var(--dkr-faint); font-family:var(--dkr-sans); font-size:13.5px; line-height:1.6; max-width:62ch; } @media(max-width:640px){ body.dkr .ldg-facets{ grid-template-columns:1fr; gap:22px; } } body.dkr .ledger .series-filters{ display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; } body.dkr .ledger .series-chip{ font-family:var(--dkr-mono); font-size:12px; letter-spacing:.01em; text-transform:none; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; padding:6px 11px; text-decoration:none; } body.dkr .ledger .series-chip:hover{ color:var(--dkr-paper); border-color:var(--dkr-muted); } body.dkr .ledger .series-chip.is-active{ color:var(--dkr-black); background:var(--dkr-paper); border-color:var(--dkr-paper); } body.dkr .ledger .series-chip-count{ opacity:.6; } body.dkr .ledger .ldg-editions{ padding-bottom:16px; border-bottom:1px solid var(--dkr-line); } body.dkr .ledger .demoday-gallery{ display:flex; gap:1px; overflow-x:auto; margin-top:22px; scrollbar-width:none; } body.dkr .ledger .demoday-gallery::-webkit-scrollbar{ display:none; } body.dkr .ledger .demoday-slide{ position:relative; flex:0 0 auto; width:clamp(180px,28vw,240px); aspect-ratio:16/10; overflow:hidden; } body.dkr .ledger .demoday-slide-img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) sepia(.35) hue-rotate(-6deg) brightness(.7); transition:filter .5s ease; } body.dkr .ledger .demoday-slide:hover .demoday-slide-img{ filter:grayscale(0) brightness(.92); } body.dkr .ledger .demoday-slide-city{ position:absolute; left:8px; bottom:8px; font-family:var(--dkr-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-paper); background:rgba(34,19,43,.6); padding:2px 6px; } body.dkr .ledger .ldg-edition-head{ margin-top:clamp(20px,2.6vw,28px); } body.dkr .ledger .ldg-edition-lead{ font-family:var(--dkr-sans); font-weight:600; font-size:clamp(18px,2vw,22px); color:var(--dkr-paper); margin:0; } body.dkr .ledger .ldg-edition-meta{ font-size:12.5px; letter-spacing:.01em; text-transform:none; color:var(--dkr-faint); margin:8px 0 0; } body.dkr .ledger .ldg-oneliner{ color:var(--dkr-muted); font-size:15px; line-height:1.6; margin-top:20px; } body.dkr .ledger .ldg-city-link{ color:var(--amber); text-decoration:none; } body.dkr .ledger .ldg-note{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.02em; color:var(--dkr-faint); margin-top:14px; } body.dkr .ledger .ldg-note-link{ color:var(--dkr-muted); } body.dkr .ledger .ldg-city-head{ display:flex; align-items:baseline; gap:14px; margin-top:24px; } body.dkr .ledger .ldg-city-heading{ font-family:var(--dkr-sans); font-weight:600; font-size:22px; color:var(--dkr-paper); } body.dkr .ledger .ldg-city-event{ font-size:12px; letter-spacing:.01em; text-transform:none; color:var(--dkr-muted); text-decoration:none; } body.dkr .ledger .ldg-events{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px; margin-top:22px; } body.dkr .ledger .ldg-event{ position:relative; display:flex; flex-direction:column; gap:5px; padding:18px 19px; text-decoration:none; overflow:hidden; border:1px solid #3a254880; background:linear-gradient(155deg, #331f42 0%, #271531 55%, #1c0f26 100%); box-shadow:inset 0 1px 0 rgba(255,255,255,.055); transition:border-color .2s, transform .2s, box-shadow .2s; } body.dkr .ledger .ldg-event::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5; transition:opacity .25s; background:radial-gradient(135% 95% at 100% 0%, rgba(224,134,74,.11) 0%, transparent 56%); } body.dkr .ledger .ldg-event > *{ position:relative; z-index:1; } body.dkr .ledger .ldg-event:hover{ border-color:#5f4270; transform:translateY(-3px); box-shadow:0 16px 40px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08); } body.dkr .ledger .ldg-event:hover::after{ opacity:1; } body.dkr .ledger .ldg-event-city{ font-family:var(--dkr-sans); font-weight:600; font-size:16px; color:var(--dkr-paper); padding-right:24px; } body.dkr .ledger .ldg-event-date{ font-size:12px; letter-spacing:.01em; text-transform:none; color:var(--dkr-muted); } body.dkr .ledger .ldg-event-venue{ font-size:12.5px; line-height:1.4; color:var(--dkr-faint); } body.dkr .ledger .ldg-event-stats{ font-size:11.5px; letter-spacing:.01em; text-transform:none; color:var(--amber); margin-top:2px; } body.dkr .ledger .ldg-event-go{ position:absolute; top:16px; right:16px; color:var(--dkr-faint); transition:color .18s, transform .18s; } body.dkr .ledger .ldg-event:hover .ldg-event-go{ color:var(--amber); transform:translateX(3px); } body.dkr .ledger .ldg-list{ list-style:none; counter-reset:rank; margin:26px 0 0; padding:0; border-top:1px solid var(--dkr-line); } body.dkr .ledger .ldg-item{ position:relative; border-bottom:1px solid var(--dkr-line); padding:22px 0 22px 58px; } body.dkr .ledger .ldg-item::before{ counter-increment:rank; content:counter(rank,decimal-leading-zero); position:absolute; left:0; top:24px; width:42px; font-family:var(--dkr-mono); font-size:13px; letter-spacing:.02em; color:var(--dkr-faint); font-variant-numeric:tabular-nums; } body.dkr .ledger .ldg-item:first-child::before{ color:var(--amber); } body.dkr .showcase-compact-stage{ font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--amber); margin:0 0 7px; } body.dkr .ledger .showcase-compact-city{ font-family:var(--dkr-mono); font-size:11.5px; letter-spacing:.02em; text-transform:none; color:var(--dkr-faint); margin:0 0 10px; } body.dkr .ledger .showcase-compact-row{ display:flex; align-items:flex-start; gap:16px; } body.dkr .ledger .showcase-compact-main{ flex:1; min-width:0; } body.dkr .ledger .showcase-compact-idea{ font-family:var(--dkr-sans); font-weight:600; font-size:19px; line-height:1.3; color:var(--dkr-paper); margin:0; } body.dkr .ledger .showcase-compact-visit{ display:inline-flex; align-items:center; gap:4px; font-family:var(--dkr-mono); font-size:12px; letter-spacing:.01em; text-transform:none; color:var(--dkr-muted); text-decoration:none; margin-top:8px; } body.dkr .ledger .showcase-compact-visit:hover{ color:var(--amber); } body.dkr .ledger .showcase-compact-visit svg{ width:12px; height:12px; } body.dkr .ledger .showcase-compact-by{ display:flex; align-items:flex-start; gap:9px; margin-top:12px; } body.dkr .ledger .showcase-compact-by-img{ filter:grayscale(1) sepia(.35) hue-rotate(-6deg); border:1px solid var(--dkr-line); } body.dkr .ledger .showcase-compact-by-text{ white-space:normal; overflow:visible; line-height:1.45; } body.dkr .ledger .showcase-compact-by-name{ font-family:var(--dkr-sans); font-weight:500; font-size:14px; color:var(--dkr-paper); text-decoration:none; } body.dkr .ledger .showcase-compact-by-name:hover{ color:var(--amber); } body.dkr .ledger .showcase-compact-by-meta{ font-family:var(--dkr-mono); font-size:12px; letter-spacing:.01em; text-transform:none; color:var(--dkr-muted); } body.dkr .showcase-upvoters-label{ font-family:var(--dkr-mono); font-size:11.5px; letter-spacing:.01em; text-transform:none; color:var(--dkr-faint); } body.dkr .showcase-upvoter-face{ border-color:var(--dkr-black); } body.dkr .showcase-upvoter-face.avatar-letter{ background:var(--dkr-line); color:var(--dkr-paper); } body.dkr .showcase-upvoter-face-image{ filter:grayscale(1) sepia(.35) hue-rotate(-6deg); } body.dkr .showcase-upvoter:hover .showcase-upvoter-face-image{ filter:grayscale(0) brightness(1); } body.dkr .showcase-upvoters-more{ font-family:var(--dkr-mono); font-size:11.5px; color:var(--amber); } body.dkr .showcase-upvoters-more:hover{ color:#eea269; text-decoration:none; } body.dkr .ledger .showcase-compact-upvote{ flex:0 0 auto; } body.dkr .ledger .upvote-box{ display:inline-flex; flex-direction:column; align-items:center; gap:2px; font-family:var(--dkr-mono); color:var(--dkr-faint); background:transparent; border:none; padding:4px 8px; cursor:pointer; text-decoration:none; min-width:40px; transition:color .16s; } body.dkr .ledger .upvote-box:hover{ color:var(--dkr-paper); } body.dkr .ledger .upvote-box.is-on{ color:var(--amber); } body.dkr .ledger .upvote-box svg{ width:18px; height:18px; } body.dkr .ledger .upvote-box-count{ font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; } body.dkr .ledger .showcase-compact-video{ margin-top:14px; max-width:360px; aspect-ratio:16/9; overflow:hidden; border:1px solid var(--dkr-line); } body.dkr .ledger .showcase-compact-video .founder-card-showing-thumb{ filter:grayscale(1) sepia(.35) hue-rotate(-6deg) brightness(.85); transition:filter .4s; } body.dkr .ledger .showcase-compact-video:hover .founder-card-showing-thumb{ filter:grayscale(0) brightness(1); } body.dkr .howiai-dark{ max-width:var(--dkr-max); margin:0 auto; padding:clamp(20px,3vw,40px) clamp(16px,3vw,28px) 60px; } body.dkr .howiai-dark .hia-eyebrow{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .howiai-dark .hia-signin{ color:var(--dkr-muted); margin-top:18px; } body.dkr .howiai-dark .hia-signin a{ color:var(--amber); } body.dkr .howiai-dark .howiai-share{ margin-top:22px; } body.dkr .howiai-dark .howiai-share-summary{ display:inline-block; font-family:var(--dkr-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--dkr-paper); background:transparent; border:1px solid var(--dkr-line); border-radius:0; padding:9px 15px; cursor:pointer; text-decoration:none; } body.dkr .howiai-dark .howiai-share-summary:hover{ background:var(--dkr-paper); color:var(--dkr-black); border-color:var(--dkr-paper); } body.dkr .howiai-dark .howiai-share-body{ margin-top:16px; border:1px solid var(--dkr-line); padding:clamp(16px,2.5vw,26px); } body.dkr .howiai-dark .howiai-share-foot{ margin-top:28px; } body.dkr .howiai-dark .howiai-view-tabs{ display:flex; gap:24px; margin-top:26px; border-bottom:1px solid var(--dkr-line); } body.dkr .howiai-dark .howiai-view-tab{ font-family:var(--dkr-sans); font-weight:600; font-size:15px; color:var(--dkr-faint); padding:0 0 12px; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; } body.dkr .howiai-dark .howiai-view-tab:hover{ color:var(--dkr-muted); } body.dkr .howiai-dark .howiai-view-input-rec:checked ~ .howiai-view-tabs .howiai-view-tab-rec, body.dkr .howiai-dark .howiai-view-input-feed:checked ~ .howiai-view-tabs .howiai-view-tab-feed{ color:var(--dkr-paper); border-bottom-color:var(--amber); } body.dkr .howiai-dark .howiai-view-panel{ margin-top:4px; } body.dkr .howiai-dark .howiai-rank-for{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.02em; color:var(--dkr-muted); margin-top:6px; } body.dkr .howiai-dark .series-board-foot img{ filter:grayscale(1) sepia(.35) hue-rotate(-6deg); } body.dkr .howiai-dark .howiai-usages{ list-style:none; margin:18px 0 0; padding:0; border-top:1px solid var(--dkr-line); } body.dkr .howiai-dark .howiai-usage{ display:flex; gap:14px; align-items:flex-start; padding:18px 0; background:transparent; border:0; border-bottom:1px solid var(--dkr-line); border-radius:0; box-shadow:none; } body.dkr .howiai-dark .howiai-usage-avatar{ filter:grayscale(1) sepia(.35) hue-rotate(-6deg); border:1px solid var(--dkr-line); } body.dkr .howiai-dark .howiai-usage-head{ font-size:15px; line-height:1.5; color:var(--dkr-muted); } body.dkr .howiai-dark .howiai-usage-name{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); text-decoration:none; } body.dkr .howiai-dark .howiai-usage-name:hover{ color:var(--amber); } body.dkr .howiai-dark .howiai-usage-tool{ font-weight:600; color:var(--dkr-paper); text-decoration:none; } body.dkr .howiai-dark .howiai-usage-for{ color:var(--dkr-muted); } body.dkr .howiai-dark .howiai-rec-badge{ font-family:var(--dkr-mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase; color:var(--amber); background:transparent; border:0; padding:0; } body.dkr .howiai-dark .howiai-usage-note{ color:var(--dkr-faint); font-size:14px; line-height:1.5; margin-top:6px; } body.dkr .howiai-dark .howiai-usage-remove{ color:var(--dkr-faint); background:transparent; border:0; cursor:pointer; } body.dkr .howiai-dark .howiai-usage-remove:hover{ color:var(--dkr-paper); } body.dkr .howiai-dark .howiai-step{ margin-top:22px; } body.dkr .howiai-dark .howiai-step-num{ font-family:var(--dkr-mono); color:var(--amber); } body.dkr .howiai-dark .howiai-step-label{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .howiai-dark .howiai-step-opt{ font-family:var(--dkr-mono); font-size:10px; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .howiai-dark .howiai-cat-label{ font-family:var(--dkr-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .howiai-dark .howiai-chip{ border:1px solid var(--dkr-line); border-radius:0; background:transparent; color:var(--dkr-muted); } body.dkr .howiai-dark .howiai-chip:hover{ border-color:var(--dkr-muted); color:var(--dkr-paper); } body.dkr .howiai-dark .howiai-chip:has(input:checked){ background:var(--dkr-paper); border-color:var(--dkr-paper); color:var(--dkr-black); } body.dkr .howiai-dark .howiai-showall{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:0; cursor:pointer; } body.dkr .howiai-dark .howiai-showall:hover{ color:var(--amber); } body.dkr .howiai-dark .chip-write-input, body.dkr .howiai-dark .howiai-textarea{ background:var(--dkr-panel); border:1px solid var(--dkr-line); border-radius:0; color:var(--dkr-paper); } body.dkr .howiai-dark .chip-write-input::placeholder, body.dkr .howiai-dark .howiai-textarea::placeholder{ color:var(--dkr-faint); } body.dkr .howiai-dark .chip-write-input:focus, body.dkr .howiai-dark .howiai-textarea:focus{ outline:none; border-color:var(--amber); } body.dkr .howiai-dark .howiai-rec-face{ color:var(--dkr-muted); } body.dkr .howiai-dark .howiai-count{ font-family:var(--dkr-mono); font-size:11px; color:var(--dkr-faint); } body.dkr .howiai-dark .series-btn-primary{ background:var(--amber); color:var(--dkr-black); border:0; border-radius:0; font-family:var(--dkr-mono); font-size:12px; letter-spacing:.05em; text-transform:uppercase; } body.dkr .howiai-dark .series-btn-primary:hover{ background:#f0a060; } body.dkr .su-page .screen-title, body.dkr .su-page .su-question-title{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.015em; color:var(--dkr-paper); } body.dkr .su-page .screen-subtitle{ color:var(--dkr-muted); } body.dkr .su-page .su-eyebrow{ font-family:var(--dkr-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .su-page .su-breadcrumb{ background:var(--dkr-black); border-bottom:1px solid var(--dkr-line); font-family:var(--dkr-mono); font-size:11px; letter-spacing:.03em; text-transform:uppercase; } body.dkr .su-page .su-breadcrumb a{ color:var(--dkr-muted); } body.dkr .su-page .su-breadcrumb a:hover{ color:var(--amber); } body.dkr .su-page .su-breadcrumb-sep, body.dkr .su-page .su-breadcrumb-here{ color:var(--dkr-faint); } body.dkr .su-page .su-answer{ background:transparent; border:0; border-left:2px solid var(--amber); padding-left:18px; } body.dkr .su-page .su-answer-label{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--amber); } body.dkr .su-page .su-answer-body{ color:var(--dkr-paper); } body.dkr .su-page .su-section-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .su-section-note{ color:var(--dkr-muted); } body.dkr .su-page .su-glance-item{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-glance-item b{ color:var(--dkr-paper); } body.dkr .su-page .su-glance-jump{ font-family:var(--dkr-mono); font-size:11px; text-transform:uppercase; color:var(--dkr-muted); } body.dkr .su-page .su-glance-jump:hover{ color:var(--amber); } body.dkr .su-page .su-medium-label{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .su-page .su-resource{ background:transparent; border:0; border-bottom:1px solid var(--dkr-line); border-radius:0; padding:24px 0; } body.dkr .su-page .su-resource-kind{ font-family:var(--dkr-mono); color:var(--dkr-muted); } body.dkr .su-page .su-badge{ font-family:var(--dkr-mono); color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-badge-india{ color:var(--amber); border-color:var(--amber); } body.dkr .su-page .su-resource-verified{ font-family:var(--dkr-mono); font-size:10.5px; color:var(--dkr-faint); } body.dkr .su-page .su-resource-why-label{ display:block; font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--amber); margin-bottom:4px; } body.dkr .su-page .su-resource-why{ color:var(--dkr-paper); font-size:15px; line-height:1.55; } body.dkr .su-page .su-resource-title{ font-family:var(--dkr-sans); font-weight:600; font-size:17px; } body.dkr .su-page .su-resource-title a{ color:var(--dkr-paper); text-decoration:none; } body.dkr .su-page .su-resource-title a:hover{ color:var(--amber); } body.dkr .su-page .gloss-resource-title a{ color:var(--dkr-paper); text-decoration:none; } body.dkr .su-page .gloss-resource-title a:hover{ color:var(--amber); } body.dkr .su-page .su-resource-source{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.02em; color:var(--dkr-faint); } body.dkr .su-page .su-resource-pub, body.dkr .su-page .su-resource-pub-link{ color:var(--dkr-muted); } body.dkr .su-page .su-resource-pub-link:hover{ color:var(--amber); } body.dkr .su-page .su-section-note a, body.dkr .su-page .wcalc-note a{ color:var(--amber); text-decoration:none; font-weight:600; } body.dkr .su-page .su-section-note a:hover, body.dkr .su-page .wcalc-note a:hover{ text-decoration:underline; } body.dkr .su-page .su-resource-video{ border:1px solid var(--dkr-line); border-radius:2px; overflow:hidden; } body.dkr .su-page .su-video-thumb{ filter:grayscale(1) sepia(.35) hue-rotate(-6deg) brightness(.85); transition:filter .4s; } body.dkr .su-page .su-resource-video:hover .su-video-thumb{ filter:grayscale(0) brightness(1); } body.dkr .su-page .su-takeaways li{ color:var(--dkr-muted); } body.dkr .su-page .su-resource-cta{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-paper); border:1px solid var(--dkr-line); border-radius:0; background:transparent; } body.dkr .su-page .su-resource-cta:hover{ background:var(--dkr-paper); color:var(--dkr-black); border-color:var(--dkr-paper); } body.dkr .su-page .su-resource-domain{ color:var(--dkr-faint); } body.dkr .su-page .su-q-row{ background:transparent; border:0; border-bottom:1px solid var(--dkr-line); border-radius:0; box-shadow:none; } body.dkr .su-page .su-q-row:hover{ background:rgba(255,255,255,.02); } body.dkr .su-page .su-q-text{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .su-q-row:hover .su-q-text{ color:var(--amber); } body.dkr .su-page .su-q-answer{ color:var(--dkr-muted); } body.dkr .su-page .su-q-meta{ font-family:var(--dkr-mono); font-size:11px; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .su-page .su-q-level{ font-family:var(--dkr-mono); color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .series-chip{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .series-chip:hover{ color:var(--dkr-paper); border-color:var(--dkr-muted); } body.dkr .su-page .series-chip.is-active{ color:var(--dkr-black); background:var(--dkr-paper); border-color:var(--dkr-paper); } body.dkr .su-page .su-filters-label, body.dkr .su-page .su-filter-label{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .su-page .su-howto{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; color:var(--dkr-muted); } body.dkr .su-page .su-howto-dismiss{ color:var(--dkr-faint); } body.dkr .su-page .su-clusternav{ background:var(--dkr-black); border-bottom:1px solid var(--dkr-line); } body.dkr .su-page .su-nav-chip{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-nav-chip:hover{ color:var(--dkr-paper); border-color:var(--dkr-muted); } body.dkr .su-page .su-nav-chip.is-active{ color:var(--dkr-black); background:var(--amber); border-color:var(--amber); } body.dkr .su-page .su-area-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); border-bottom:1px solid var(--dkr-line); } body.dkr .su-page .su-area-count{ font-family:var(--dkr-mono); font-size:11px; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .su-page .su-cat-link{ border-bottom:1px solid var(--dkr-line); background:transparent; } body.dkr .su-page .su-cat-link:hover{ background:rgba(255,255,255,.02); } body.dkr .su-page .su-cat-link-name{ font-family:var(--dkr-sans); font-weight:500; color:var(--dkr-paper); } body.dkr .su-page .su-cat-link-count{ font-family:var(--dkr-mono); font-size:11px; color:var(--dkr-faint); } body.dkr .su-page .su-persona-card{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-persona-card:hover{ border-color:var(--dkr-muted); } body.dkr .su-page .su-path-card{ background:rgba(255,255,255,0.025); border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-path-card:hover{ border-color:var(--amber); background:rgba(255,255,255,0.05); } body.dkr .su-page .su-persona-chip{ font-family:var(--dkr-mono); font-size:11px; text-transform:uppercase; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-persona-chip:hover{ color:var(--dkr-paper); border-color:var(--dkr-muted); } body.dkr .su-page .su-area-chip{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-area-chip:hover{ border-color:var(--dkr-muted); } body.dkr .su-page .su-area-chip-name{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .su-page .su-area-chip-count{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-path-num{ color:var(--amber); font-family:var(--dkr-mono); } body.dkr .su-page .su-step-name{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .su-step-answer{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-step-q{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .su-page .su-step-a{ color:var(--dkr-muted); } body.dkr .su-page .su-path-note, body.dkr .su-page .su-step-res-why{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .su-page .su-step-a-label{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-step-res{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-step-res:hover{ border-color:var(--dkr-muted); } body.dkr .su-page .su-step-res-title{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .su-page .su-step-res-src, body.dkr .su-page .su-step-more{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-lead-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .su-lead-note{ color:var(--dkr-muted); } body.dkr .su-page .su-lead-card, body.dkr .su-page .su-canon-card{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-lead-card:hover, body.dkr .su-page .su-canon-card:hover{ border-color:var(--dkr-muted); transform:none; } body.dkr .su-page .su-lead-cat, body.dkr .su-page .su-canon-kind{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-lead-q, body.dkr .su-page .su-canon-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .su-lead-a, body.dkr .su-page .su-canon-why{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .su-page .su-lead-more, body.dkr .su-page .su-canon-src{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-canon-card:hover .su-canon-src{ color:var(--amber); } body.dkr .su-page .su-canon-row{ border-bottom:1px solid var(--dkr-line); } body.dkr .su-page .su-canon-row-title{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .su-page .su-canon-row-why{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .su-page .su-rec-btn{ border:1px solid var(--dkr-line); color:var(--dkr-muted); } body.dkr .su-page .su-rec-btn:hover{ border-color:var(--amber); color:var(--dkr-paper); } body.dkr .su-page .su-rec-btn.is-on{ border-color:var(--amber); color:var(--amber); } body.dkr .su-page .su-rec-static{ font-family:var(--dkr-mono); color:var(--dkr-muted); } body.dkr .su-page .su-canon-row-meta, body.dkr .su-page .su-canon-cites{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-india{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-india-eyebrow{ font-family:var(--dkr-mono); color:var(--amber); } body.dkr .su-page .su-india-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .su-india-note{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .su-page .su-india-cta{ font-family:var(--dkr-mono); color:var(--dkr-paper); border-bottom-color:var(--amber); } body.dkr .su-page .su-india-cta:hover{ color:var(--amber); } body.dkr .su-page .su-search-label{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .su-page .su-search-input{ background:var(--dkr-panel); border:1px solid var(--dkr-line); border-radius:0; color:var(--dkr-paper); } body.dkr .su-page .su-search-input::placeholder{ color:var(--dkr-faint); } body.dkr .su-page .su-search-input:focus{ outline:none; border-color:var(--amber); } body.dkr .su-page .su-search-clear{ color:var(--dkr-faint); } body.dkr .su-page .su-search-clear:hover{ color:var(--dkr-paper); background:transparent; } body.dkr .su-page .su-results-head, body.dkr .su-page .su-results-empty{ font-family:var(--dkr-mono); font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:var(--dkr-faint); } body.dkr .su-page .su-result{ background:transparent; border:0; border-bottom:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .su-result:hover{ background:rgba(255,255,255,.02); } body.dkr .su-page .su-result-cat{ font-family:var(--dkr-mono); color:var(--amber); } body.dkr .su-page .su-result-q{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .su-result:hover .su-result-q{ color:var(--amber); } body.dkr .su-page .su-result-a{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .su-page .su-result.su-result-active{ background:rgba(255,255,255,.03); border-bottom-color:var(--amber); } body.dkr .su-page .su-result.su-result-active .su-result-q{ color:var(--amber); } body.dkr .su-page .su-result-pick{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-result-n{ font-family:var(--dkr-mono); color:var(--amber); } body.dkr .su-page .su-results-kbd{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-topic{ border-bottom:1px solid var(--dkr-line); } body.dkr .su-page .su-topic-head::before{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-topic-name{ font-family:var(--dkr-sans); font-weight:500; color:var(--dkr-paper); } body.dkr .su-page .su-topic-count{ font-family:var(--dkr-mono); font-size:11px; color:var(--dkr-faint); } body.dkr .su-page .su-topic-q:hover{ background:rgba(255,255,255,.02); } body.dkr .su-page .su-topic-q-text{ font-family:var(--dkr-sans); font-weight:400; color:var(--dkr-muted); } body.dkr .su-page .su-topic-q:hover .su-topic-q-text{ color:var(--amber); } body.dkr .su-page .su-topic-q-count{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-related-link:hover{ background:rgba(255,255,255,.02); } body.dkr .su-related-q{ font-family:var(--dkr-sans); font-weight:400; color:var(--dkr-muted); } body.dkr .su-related-link:hover .su-related-q{ color:var(--amber); } body.dkr .su-related-n{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .su-topic-tagline{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .su-page .su-topic-more{ font-family:var(--dkr-mono); color:var(--amber); } body.dkr .su-page .su-disclaimer{ font-family:var(--dkr-sans); color:var(--dkr-muted); border-left-color:var(--dkr-line, rgba(255,255,255,.14)); } body.dkr .su-page .wcalc{ border-color:var(--dkr-line, rgba(255,255,255,.12)); background:rgba(255,255,255,.02); } body.dkr .su-page .wcalc-lead, body.dkr .su-page .wcalc-field, body.dkr .su-page .wcalc-note, body.dkr .su-page .wcalc-hint{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .su-page .wcalc-field input{ background:rgba(255,255,255,.04); border-color:var(--dkr-line, rgba(255,255,255,.16)); color:var(--dkr-paper, #f4f0e8); } body.dkr .su-page .wcalc-out{ background:rgba(255,255,255,.05); color:var(--dkr-paper, #f4f0e8); } body.dkr .su-page .su-takeaways li::before{ color:var(--dkr-faint); } body.dkr .screen-subtitle, body.dkr .series-section-title, body.dkr .su-page .su-answer-body, body.dkr .su-page .su-resource-why, body.dkr .su-page .su-path-card-name, body.dkr .register .feed-item-prose, body.dkr .cs-standfirst, body.dkr .reg-standfirst, body.dkr .ldg-standfirst{ font-family:var(--dkr-sans); } @media(max-width:640px){ body.dkr .cs, body.dkr .register, body.dkr .ledger, body.dkr .howiai-dark, body.dkr .pf, body.dkr .mh-body, body.dkr .prog{ max-width:100%; } body.dkr .cs-state, body.dkr .prog-state{ flex-wrap:wrap; gap:6px 12px; font-size:10.5px; } body.dkr .cs-h1{ font-size:clamp(34px,11vw,44px); } body.dkr .cs-sheet{ grid-template-columns:repeat(auto-fill, minmax(clamp(96px,29vw,130px),1fr)); gap:14px; } body.dkr .register .feed-item{ padding:18px 0 18px 20px; } body.dkr .ledger .ldg-item{ padding-left:40px; } body.dkr .ledger .ldg-item::before{ width:30px; font-size:11px; top:23px; } body.dkr .ledger .showcase-compact-row{ gap:12px; } body.dkr .ledger .showcase-compact-idea{ font-size:17px; } body.dkr .ledger .demoday-slide{ width:clamp(150px,58vw,200px); } body.dkr .howiai-dark .hia-signin{ font-size:12px; } body.dkr .howiai-dark .howiai-view-tabs{ gap:18px; } body.dkr .su-page .screen-title, body.dkr .su-page .su-question-title{ font-size:clamp(26px,7.6vw,34px); line-height:1.1; } body.dkr .su-page .su-clusternav, body.dkr .su-page .su-breadcrumb{ top:54px; } body.dkr .su-page .su-resource{ padding:20px 0; } body.dkr .mh-hub{ grid-template-columns:1fr; } body.dkr .marq-ledger{ grid-template-columns:1fr 1fr; } } body.dkr .partner-brands{ background:transparent; border:0; border-top:1px solid var(--dkr-line); border-radius:0; padding:clamp(28px,4vw,40px) 0 0; margin-top:clamp(40px,6vw,64px); } body.dkr .partner-brands-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .partner-brands-sub{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .brands-screen .screen-title{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-0.015em; color:var(--dkr-paper); } body.dkr .brands-screen .screen-subtitle{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .brand-card{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .brand-card:hover{ border-color:var(--dkr-muted); transform:none; } body.dkr .brand-card-cat{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .brand-card-name{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .brand-card-tag{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .brand-card-offer{ color:var(--amber); border-color:var(--dkr-line); } body.dkr .brand-card-logo-name, body.dkr .brand-hero-logo-name{ color:#807a70; } body.dkr .brand-back{ font-family:var(--dkr-mono); color:var(--dkr-muted); } body.dkr .brand-back:hover{ color:var(--amber); } body.dkr .brand-hero-logo{ border:1px solid var(--dkr-line); border-radius:0; } body.dkr .brand-hero-eyebrow{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .brand-hero-name{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .brand-hero-tag{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .brand-hero-visit{ font-family:var(--dkr-mono); color:var(--dkr-paper); border-bottom-color:var(--amber); } body.dkr .brand-hero-visit:hover{ color:var(--amber); } body.dkr .brand-offer{ background:transparent; border:1px solid var(--amber); border-radius:0; } body.dkr .brand-offer-label{ font-family:var(--dkr-mono); color:var(--amber); } body.dkr .brand-offer-body{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .brand-section-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .brand-about-body{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .poll-screen-title{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-.015em; color:var(--dkr-paper); } body.dkr .poll-intro{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .poll-empty{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .poll-admin-link{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-muted); } body.dkr .poll-mine{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .poll-mine-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .poll-mine-row{ border-top-color:var(--dkr-line); } body.dkr .poll-mine-q{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .poll-mine-link:hover .poll-mine-q{ color:var(--amber); } body.dkr .poll-mine-picks-label{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .poll-mine-pick{ font-family:var(--dkr-sans); color:var(--amber); background:transparent; border:1px solid var(--dkr-line); } body.dkr .poll-cat-chip{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; font-weight:400; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .poll-cat-chip:hover{ color:var(--dkr-paper); border-color:var(--dkr-muted); } body.dkr .poll-cat-chip.is-active{ color:var(--dkr-black); background:var(--dkr-paper); border-color:var(--dkr-paper); } body.dkr .poll-cat-count{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .poll-cat-chip.is-active .poll-cat-count{ color:var(--dkr-black); opacity:.55; } body.dkr .poll-strip-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .poll-tab-list{ border-bottom-color:var(--dkr-line); } body.dkr .poll-tab{ font-family:var(--dkr-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase; font-weight:400; color:var(--dkr-faint); border-radius:0; } body.dkr .poll-tab:hover{ color:var(--dkr-paper); } body.dkr .poll-tab-count{ font-family:var(--dkr-mono); color:inherit; opacity:.6; } body.dkr .poll-tab-input-top:checked ~ .poll-tab-list .poll-tab-target-top, body.dkr .poll-tab-input-latest:checked ~ .poll-tab-list .poll-tab-target-latest, body.dkr .poll-tab-input-leaders:checked ~ .poll-tab-list .poll-tab-target-leaders{ background:transparent; color:var(--dkr-paper); box-shadow:inset 0 -2px 0 var(--dkr-paper); } body.dkr .poll-index-card{ background:transparent; border:0; border-bottom:1px solid var(--dkr-line); border-radius:0; box-shadow:none; padding:20px 2px; } body.dkr .poll-index-card:hover{ transform:none; box-shadow:none; background:rgba(255,255,255,.02); } body.dkr .poll-index-cat{ font-family:var(--dkr-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .poll-index-q{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .poll-index-desc{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .poll-index-meta{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.02em; color:var(--dkr-faint); } body.dkr .poll-board-row{ background:transparent; border:0; border-bottom:1px solid var(--dkr-line); border-radius:0; padding:18px 2px; } body.dkr .poll-board-rank{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .poll-board-name{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .poll-board-total{ font-family:var(--dkr-mono); color:var(--dkr-paper); } body.dkr .poll-board-tag{ font-family:var(--dkr-mono); font-size:11px; color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .poll-board-tag:hover{ border-color:var(--dkr-muted); color:var(--dkr-paper); } body.dkr .poll-board-tag-count{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .poll-votable{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .poll-votable-q{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .poll-votable-cta{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-muted); } body.dkr .poll-votable-cta:hover{ color:var(--amber); } body.dkr .poll-votable-other-input{ background:var(--dkr-panel); border:1px solid var(--dkr-line); border-radius:0; color:var(--dkr-paper); } body.dkr .poll-votable-other-input::placeholder{ color:var(--dkr-faint); } body.dkr .poll-votable-other-btn{ font-family:var(--dkr-mono); font-size:11px; text-transform:uppercase; color:var(--dkr-paper); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .poll-votable-other-btn:hover{ background:var(--dkr-paper); color:var(--dkr-black); border-color:var(--dkr-paper); } body.dkr .poll-result-vote:hover{ background:rgba(255,255,255,.03); } body.dkr .poll-result-label{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .poll-result-count{ font-family:var(--dkr-mono); font-size:12px; color:var(--dkr-faint); } body.dkr .poll-result-track{ background:var(--dkr-line); } body.dkr .poll-result-fill{ background:var(--dkr-faint); } body.dkr .poll-result.is-mine .poll-result-fill, body.dkr .poll-result-vote.is-mine .poll-result-fill{ background:var(--amber); } body.dkr .poll-result-radio{ border-color:var(--dkr-muted); } body.dkr .poll-result-radio.is-on{ border-color:var(--amber); background:var(--amber); box-shadow:inset 0 0 0 2px var(--dkr-black); } body.dkr .poll-result-vote:hover .poll-result-radio{ border-color:var(--amber); } body.dkr .poll-result-tick{ color:var(--amber); } body.dkr .poll-permalink-back{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--dkr-muted); } body.dkr .poll-permalink-back:hover{ color:var(--amber); } body.dkr .poll-show-cat-link{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .poll-question{ font-family:var(--dkr-sans); font-weight:600; letter-spacing:-.015em; color:var(--dkr-paper); } body.dkr .poll-desc{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .poll-tally{ font-family:var(--dkr-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--dkr-faint); } body.dkr .poll-share-cta-link, body.dkr .poll-signin-link{ color:var(--amber); font-family:var(--dkr-mono); font-size:12px; } body.dkr .poll-signin-note, body.dkr .poll-other-locked{ font-family:var(--dkr-sans); color:var(--dkr-muted); } body.dkr .poll-option{ background:transparent; border:0; border-bottom:1px solid var(--dkr-line); border-radius:0; } body.dkr .poll-option:hover{ box-shadow:none; } body.dkr .poll-option.is-picked{ background:transparent; border-color:transparent; box-shadow:inset 3px 0 0 var(--amber); } body.dkr .poll-option-label{ font-family:var(--dkr-sans); font-weight:500; color:var(--dkr-paper); } body.dkr .poll-option-count{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .poll-toggle{ background:transparent; border:2px solid var(--dkr-muted); color:var(--dkr-black); } body.dkr .poll-toggle:hover{ border-color:var(--amber); } body.dkr .poll-toggle.is-on{ background:var(--amber); border-color:var(--amber); } body.dkr .poll-other-input{ background:var(--dkr-panel); border:1px solid var(--dkr-line); border-radius:0; color:var(--dkr-paper); } body.dkr .poll-other-input::placeholder{ color:var(--dkr-faint); } body.dkr .poll-other-add{ font-family:var(--dkr-mono); font-size:12px; text-transform:uppercase; color:var(--dkr-black); background:var(--dkr-paper); border:0; border-radius:0; } body.dkr .poll-other-add:hover{ filter:brightness(.92); } body.dkr .poll-face-avatar{ filter:grayscale(1) sepia(.35) hue-rotate(-6deg); border-color:var(--dkr-black); } body.dkr .poll-faces-more{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .partner-brands-link{ color:var(--amber); border-bottom-color:var(--dkr-line); } body.dkr .partner-brands-tile{ background:#e7e2d8; border:1px solid #d7d0c3; border-radius:6px; } body.dkr .partner-brands-tile:hover{ border-color:#c6bdac; transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,.45); } body.dkr .partner-brands-name{ font-family:var(--dkr-sans); color:#3d2a4a; } body.dkr .partner-brands-logo{ background:#e7e2d8; filter:none; opacity:1; } body.dkr .event-map-card{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; color:var(--dkr-paper); } body.dkr .event-map-card:hover{ background:rgba(255,255,255,.02); } body.dkr .event-map-card-name{ font-family:var(--dkr-sans); color:var(--dkr-paper); } body.dkr .event-map-card-sub{ color:var(--dkr-muted); } body.dkr .dkr-going-av, body.dkr .feed-item-rsvper-face, body.dkr .poll-face img, body.dkr .poll-face .avatar-letter, body.dkr .showcase-compact-by-img{ filter:grayscale(1) sepia(.35) hue-rotate(-6deg); border-color:var(--dkr-line); box-shadow:none; } body.dkr .avatar-letter{ font-family:var(--dkr-sans); font-style:normal; font-weight:600; color:var(--dkr-muted); background:linear-gradient(150deg, #2a1b33, #1e1128); } body.dkr .showcase-compact-by-img{ border-radius:2px; } body.dkr .showcase-compact-by:hover .showcase-compact-by-img{ filter:grayscale(0) contrast(1.02) brightness(1); } body.dkr .pf-portrait.is-lit img{ filter:grayscale(0) contrast(1.02) brightness(1); } body.dkr .series-empty, body.dkr .hub-empty{ text-align:center; color:var(--dkr-muted); font-size:15px; line-height:1.6; padding:clamp(44px,9vw,88px) clamp(20px,6vw,40px); margin-top:26px; border:1px solid var(--dkr-line); background:linear-gradient(180deg, rgba(255,255,255,.012), transparent); } body.dkr .series-empty a, body.dkr .hub-empty a, body.dkr .hub-empty-link, body.dkr .series-empty-link{ color:var(--amber); text-decoration:none; } body.dkr .howiai-view-input-rec:focus-visible ~ .howiai-view-tabs .howiai-view-tab-rec, body.dkr .howiai-view-input-feed:focus-visible ~ .howiai-view-tabs .howiai-view-tab-feed, body.dkr #prog_up:focus-visible ~ .prog-tabs .prog-tab-up, body.dkr #prog_past:focus-visible ~ .prog-tabs .prog-tab-past{ outline:2px solid var(--amber); outline-offset:3px; } body.dkr .shelf-podcasts .episode-thumb-dur{ border-radius:0; font-family:var(--dkr-mono); font-weight:500; letter-spacing:.03em; background:rgba(34,19,43,.82); } body.dkr .shelf-podcasts .episode-thumb-play svg{ opacity:.85; } .hfa-page { } .hfa-stats { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 2px 0 16px; } .hfa-stat { font-family: var(--font-sans); font-size: 13px; color: var(--ink-mute); } .hfa-stat b { font-family: var(--font-serif); font-size: 15px; color: var(--ink); font-weight: 600; } .hfa-search { margin: 6px 0 18px; } .hfa-search-label { display: block; font-family: var(--font-sans); font-size: 13px; font-weight: 600; color: var(--ink-soft); margin-bottom: 8px; } .hfa-search-box { position: relative; display: flex; align-items: center; } .hfa-search-input { width: 100%; box-sizing: border-box; font-family: var(--font-sans); font-size: 16px; color: var(--ink); background: var(--paper); border: 1.5px solid var(--border); border-radius: 14px; padding: 14px 42px 14px 16px; } .hfa-search-input:focus { outline: none; border-color: var(--amber); } .hfa-search-input::placeholder { color: var(--ink-dim); } .hfa-search-input::-webkit-search-cancel-button { -webkit-appearance: none; } .hfa-search-clear { position: absolute; right: 8px; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; font-size: 20px; line-height: 1; color: var(--ink-mute); background: none; border: 0; border-radius: 999px; cursor: pointer; } .hfa-search-clear:hover { color: var(--ink); background: var(--paper-2); } .hfa-search-empty { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); margin: 10px 2px 0; } .hfa-linkbtn { font: inherit; color: var(--amber); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; } .hfa-theme { margin-bottom: 26px; } .hfa-theme-title { font-family: var(--font-serif); font-size: 18px; color: var(--ink); margin: 0 0 12px; padding-bottom: 6px; border-bottom: 1px solid var(--border-soft); } .hfa-topics { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; } .hfa-topic { background: var(--paper); border: 1px solid var(--border-soft); border-radius: 16px; padding: 14px 16px 6px; } .hfa-topic-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 6px; } .hfa-topic-name { font-family: var(--font-sans); font-size: 15px; font-weight: 700; color: var(--ink); text-decoration: none; } .hfa-topic-name:hover { color: var(--amber); } .hfa-topic-count { flex: none; font-family: var(--font-mono); font-size: 10.5px; color: var(--ink-mute); } .hfa-topic-qs { list-style: none; margin: 0; padding: 0; } .hfa-q { border-top: 1px solid var(--border-soft); } .hfa-q-link { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 9px 0; text-decoration: none; } .hfa-q-link .hfa-q-count { flex: none; font-family: var(--font-mono); font-size: 10.5px; color: var(--ink-mute); } .hfa-q-link { color: var(--ink-soft); font-family: var(--font-serif); font-size: 14px; line-height: 1.35; } .hfa-q-link:hover { color: var(--amber); } .hfa-breadcrumb { margin-bottom: 10px; } .hfa-breadcrumb a { color: var(--ink-mute); text-decoration: none; font-family: var(--font-sans); font-weight: 600; font-size: 13px; } .hfa-breadcrumb a:hover { color: var(--amber); } .hfa-eyebrow { display: block; margin-bottom: 6px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-mute); } .hfa-topic-title { line-height: 1.2; } .hfa-question { margin: 22px 0; padding-top: 18px; border-top: 1px solid var(--border-soft); scroll-margin-top: 70px; } .hfa-question:first-of-type { border-top: 0; padding-top: 6px; } .hfa-question-title { font-family: var(--font-serif); font-size: 19px; color: var(--ink); line-height: 1.3; margin: 0 0 10px; } .hfa-anchor { color: var(--ink-faint); text-decoration: none; font-size: 15px; margin-left: 6px; } .hfa-anchor:hover { color: var(--amber); } .hfa-answer { font-family: var(--font-sans); font-size: 15px; color: var(--ink-soft); line-height: 1.6; margin: 0 0 16px; } .hfa-resources { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; } .hfa-resource { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 16px; padding: 14px 15px; } .hfa-resource-title { font-family: var(--font-serif); font-size: 15.5px; line-height: 1.35; margin: 0; } .hfa-resource-title a { color: var(--ink); text-decoration: none; } .hfa-resource-title a:hover { color: var(--amber); text-decoration: underline; } .hfa-resource-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 0; } .hfa-resource-creator { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-soft); font-weight: 600; } .hfa-resource-date { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .hfa-resource-why { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); line-height: 1.55; margin: 0; } .hfa-resource-cta { margin-top: auto; font-family: var(--font-sans); font-size: 12.5px; font-weight: 600; color: var(--amber); text-decoration: none; } .hfa-resource-cta:hover { text-decoration: underline; } .hfa-resource-domain { color: var(--ink-mute); font-weight: 500; } .hfa-thumb { position: relative; display: block; width: 100%; border-radius: 12px; overflow: hidden; line-height: 0; } .hfa-thumb-img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; } .hfa-thumb-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: 0.92; transition: opacity 0.15s ease; } .hfa-thumb:hover .hfa-thumb-play { opacity: 1; } .hfa-badge { display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.03em; text-transform: uppercase; font-weight: 600; padding: 3px 9px; border-radius: 999px; border: 1px solid transparent; } .hfa-badge-icon { font-size: 11px; line-height: 1; } .hfa-badge-video { background: #fbe9e7; color: #b3261e; border-color: #f3c9c3; } .hfa-badge-thread { background: #e8ecfb; color: #3a49b8; border-color: #cdd6f5; } .hfa-badge-article { background: #e4f3ec; color: #1f7a52; border-color: #c7e6d5; } .hfa-badge-podcast { background: #f0e8fb; color: #6b3fb0; border-color: #ddccf3; } .hfa-badge-guide { background: #fdefdc; color: #b26a12; border-color: #f4ddba; } .hfa-badge-tool { background: #e6eef2; color: #3a5b70; border-color: #ccdde6; } .hfa-badge-course { background: #eaf2df; color: #4d7018; border-color: #d3e4bd; } .hfa-question-list { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; } .hfa-question-card { display: flex; flex-direction: column; gap: 5px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 16px; padding: 14px 16px; text-decoration: none; transition: border-color 0.15s ease; } .hfa-question-card:hover { border-color: var(--amber); } .hfa-question-q { font-family: var(--font-serif); font-size: 16px; color: var(--ink); line-height: 1.35; overflow-wrap: anywhere; } .hfa-question-card:hover .hfa-question-q { color: var(--amber); } .hfa-question-a { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); line-height: 1.55; } .hfa-question-more { font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .hfa-question-h1 { line-height: 1.2; overflow-wrap: anywhere; } .hfa-answer-block { background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 16px; padding: 14px 16px; margin: 6px 0 20px; } .hfa-answer { font-family: var(--font-sans); font-size: 15px; color: var(--ink-soft); line-height: 1.6; margin: 0; } .hfa-answer-note { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); line-height: 1.5; margin: 8px 0 0; } .hfa-section { margin: 22px 0; } .hfa-section-title { font-family: var(--font-serif); font-size: 17px; color: var(--ink); margin: 0 0 12px; } .hfa-section-note { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); line-height: 1.5; margin: -4px 0 14px; } .hfa-section-note b { color: var(--ink); font-weight: 600; } .hfa-sibling-list { list-style: none; margin: 0; padding: 0; } .hfa-breadcrumb-sep { color: var(--ink-faint); margin: 0 4px; } .hfa-video { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #000; line-height: 0; } .hfa-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } .hfa-video-facade { position: absolute; inset: 0; display: block; cursor: pointer; } .hfa-video-thumb { width: 100%; height: 100%; object-fit: cover; } .hfa-video-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: 0.92; transition: opacity 0.15s ease; } .hfa-video-facade:hover .hfa-video-play { opacity: 1; } .hfa-audio { width: 100%; max-width: 100%; border: 0; border-radius: 12px; } .hfa-resource-title a { overflow-wrap: anywhere; } .hfa-topics > *, .hfa-resources > * { min-width: 0; } .hfa-resource, .hfa-topic { max-width: 100%; overflow: hidden; } .hfa-page img, .hfa-page iframe { max-width: 100%; } @media (max-width: 640px) { .hfa-topics, .hfa-resources { grid-template-columns: 1fr; } .hfa-stats { gap: 6px 12px; } .hfa-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; row-gap: 2px; } .hfa-q-link { padding: 11px 0; } .hfa-question-card { padding: 15px 16px; } } .gtm-levels { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; } .gtm-level { display: flex; align-items: flex-start; gap: 14px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; padding: 15px 16px; text-decoration: none; transition: border-color 0.15s ease; } .gtm-level:hover { border-color: var(--amber); } .gtm-level-step { flex: none; width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--paper-2); border: 1px solid var(--border-soft); font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); } .gtm-level:hover .gtm-level-step { border-color: var(--amber); color: var(--amber); } .gtm-level-body { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; } .gtm-level-name { font-family: var(--font-sans); font-weight: 700; font-size: 16px; color: var(--ink); } .gtm-level-short { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ink-mute); } .gtm-level-blurb { font-family: var(--font-sans); font-size: 13.5px; line-height: 1.5; color: var(--ink-soft); } .gtm-level-count { flex: none; font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .gtm-people { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; } @media (max-width: 560px) { .gtm-people { grid-template-columns: 1fr; } } .gtm-person { display: flex; flex-direction: column; gap: 7px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 14px; padding: 14px 15px; text-decoration: none; transition: border-color 0.15s ease; } .gtm-person:hover { border-color: var(--amber); } .gtm-person-head { display: flex; align-items: center; gap: 10px; } .gtm-person-avatar { flex: none; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; } .gtm-person-initials { display: flex; align-items: center; justify-content: center; background: var(--paper-2); border: 1px solid var(--border-soft); font-family: var(--font-mono); font-size: 13px; color: var(--ink-mute); } .gtm-person-id { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; } .gtm-person-name { font-family: var(--font-sans); font-weight: 700; font-size: 15px; color: var(--ink); } .gtm-person-meta { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.03em; color: var(--ink-mute); } .gtm-person-echai { flex: none; font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--amber); border: 1px solid var(--amber); border-radius: 999px; padding: 2px 7px; } .gtm-person-headline { font-family: var(--font-sans); font-size: 13.5px; line-height: 1.5; color: var(--ink); } .gtm-person-why { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; color: var(--ink-soft); } .gtm-person-tags { display: flex; flex-wrap: wrap; gap: 5px; } .gtm-person-tag { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-mute); background: var(--paper-2); border: 1px solid var(--border-soft); border-radius: 999px; padding: 2px 7px; } .gtm-leader-head { display: flex; align-items: center; gap: 14px; margin-bottom: 4px; } .gtm-leader-head .screen-title { margin: 0; } .gtm-leader-avatar { flex: none; width: 60px; height: 60px; border-radius: 50%; object-fit: cover; font-size: 20px; } .gtm-leader-meta { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.03em; color: var(--ink-mute); margin: 3px 0 0; } .gtm-leader-bio { font-family: var(--font-sans); font-size: 15px; line-height: 1.6; color: var(--ink-soft); margin: 10px 0 0; } .gtm-leader-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; } .gtm-leader-link { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.03em; text-transform: uppercase; color: var(--amber); text-decoration: none; border: 1px solid var(--border-soft); border-radius: 999px; padding: 7px 13px; } .gtm-leader-link:hover { border-color: var(--amber); } .gtm-policy { border-top: 1px solid var(--border-soft); margin-top: 30px; padding-top: 20px; } .gtm-policy-title { font-family: var(--font-sans); font-weight: 700; font-size: 15px; color: var(--ink); margin: 0 0 10px; } .gtm-policy p, .gtm-policy-note { font-family: var(--font-sans); font-size: 13px; line-height: 1.6; color: var(--ink-mute); margin: 0 0 10px; } .gtm-policy-note { border-top: 1px solid var(--border-soft); margin-top: 28px; padding-top: 16px; } .gtm-policy a, .gtm-policy-note a { color: var(--amber); text-decoration: none; } .gtm-policy a:hover, .gtm-policy-note a:hover { text-decoration: underline; } body.dkr .su-page .gtm-level{ background:rgba(255,255,255,0.025); border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .gtm-level:hover{ border-color:var(--amber); background:rgba(255,255,255,0.05); } body.dkr .su-page .gtm-level-step{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .gtm-level:hover .gtm-level-step{ border-color:var(--amber); color:var(--amber); } body.dkr .su-page .gtm-level-name{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .gtm-level-short{ font-family:var(--dkr-mono); letter-spacing:.12em; color:var(--amber); } body.dkr .su-page .gtm-level-blurb{ color:var(--dkr-muted); } body.dkr .su-page .gtm-level-count{ font-family:var(--dkr-mono); font-size:11px; color:var(--dkr-faint); } body.dkr .su-page .gtm-person{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .gtm-person:hover{ border-color:var(--amber); background:rgba(255,255,255,.02); } body.dkr .su-page .gtm-person-initials{ background:transparent; border:1px solid var(--dkr-line); font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .gtm-person-name{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .gtm-person:hover .gtm-person-name{ color:var(--amber); } body.dkr .su-page .gtm-person-meta{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .gtm-person-echai{ font-family:var(--dkr-mono); color:var(--amber); border-color:var(--amber); border-radius:0; } body.dkr .su-page .gtm-person-headline{ color:var(--dkr-paper); } body.dkr .su-page .gtm-person-why{ color:var(--dkr-muted); } body.dkr .su-page .gtm-person-tag{ font-family:var(--dkr-mono); color:var(--dkr-muted); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .gtm-leader-avatar{ border:1px solid var(--dkr-line); } body.dkr .su-page .gtm-leader-meta{ font-family:var(--dkr-mono); color:var(--dkr-faint); } body.dkr .su-page .gtm-leader-bio{ color:var(--dkr-muted); } body.dkr .su-page .gtm-leader-link{ font-family:var(--dkr-mono); color:var(--dkr-paper); background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .gtm-leader-link:hover{ background:var(--dkr-paper); color:var(--dkr-black); border-color:var(--dkr-paper); } body.dkr .su-page .gtm-policy{ border-top:1px solid var(--dkr-line); } body.dkr .su-page .gtm-policy-title{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .gtm-policy p, body.dkr .su-page .gtm-policy-note{ color:var(--dkr-faint); } body.dkr .su-page .gtm-policy-note{ border-top:1px solid var(--dkr-line); } body.dkr .su-page .gtm-policy a, body.dkr .su-page .gtm-policy-note a{ color:var(--amber); } .gtm-sources { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; } @media (max-width: 560px) { .gtm-sources { grid-template-columns: 1fr; } } .gtm-source { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 12px; padding: 11px 14px; text-decoration: none; transition: border-color 0.15s ease; } .gtm-source:hover { border-color: var(--amber); } .gtm-source-name { font-family: var(--font-sans); font-weight: 600; font-size: 14.5px; color: var(--ink); } .gtm-source-meta { flex: none; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.03em; color: var(--ink-mute); } .su-seeall-line { margin: 18px 0 0; } body.dkr .su-page .gtm-source{ background:transparent; border:1px solid var(--dkr-line); border-radius:0; } body.dkr .su-page .gtm-source:hover{ border-color:var(--amber); background:rgba(255,255,255,.02); } body.dkr .su-page .gtm-source-name{ font-family:var(--dkr-sans); font-weight:600; color:var(--dkr-paper); } body.dkr .su-page .gtm-source:hover .gtm-source-name{ color:var(--amber); } body.dkr .su-page .gtm-source-meta{ font-family:var(--dkr-mono); color:var(--dkr-faint); } .spk-desk { max-width: 760px; margin: 0 auto; padding: 8px 0 56px; } .spk-head { padding-bottom: 22px; border-bottom: 1px solid var(--border-soft); } .spk-eyebrow { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 8px; } .spk-title { font-family: var(--font-serif); font-weight: 500; font-size: 26px; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink); margin: 0 0 6px; } .spk-when { font-family: var(--font-sans); font-size: 14px; color: var(--ink-mute); margin: 0; } .spk-tally { font-family: var(--font-sans); font-size: 13px; color: var(--ink-soft); margin: 12px 0 0; } .spk-tally strong { color: var(--amber); font-weight: 600; } .spk-form { display: block; margin: 0; } .spk-errors { font-family: var(--font-sans); font-size: 13.5px; color: var(--amber); border-left: 2px solid var(--amber); padding: 8px 12px; margin: 22px 0 0; background: rgba(224, 134, 74, 0.07); } .spk-step { padding: 26px 0; border-bottom: 1px solid var(--border-soft); } .spk-step-title { display: flex; align-items: center; gap: 10px; font-family: var(--font-sans); font-weight: 600; font-size: 15px; color: var(--ink); margin: 0 0 4px; } .spk-step-n { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; flex: none; border-radius: 999px; border: 1px solid var(--border); font-family: var(--font-mono); font-size: 11px; color: var(--ink-mute); } .spk-restore { margin-left: auto; font-family: var(--font-sans); font-size: 12px; color: var(--ink-mute); background: transparent; border: 1px solid var(--border-soft); border-radius: 999px; padding: 4px 11px; cursor: pointer; transition: border-color 0.12s ease, color 0.12s ease; } .spk-restore:hover { border-color: var(--amber); color: var(--amber); } .spk-restore[hidden] { display: none; } .spk-hint { font-family: var(--font-sans); font-size: 12.5px; line-height: 1.55; color: var(--ink-mute); margin: 6px 0 0; } .spk-hint code { font-family: var(--font-mono); font-size: 11.5px; color: var(--amber); background: rgba(224, 134, 74, 0.08); border-radius: 3px; padding: 1px 4px; } .spk-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; } @media (max-width: 620px) { .spk-fields { grid-template-columns: 1fr; } } .spk-field { display: block; margin-top: 16px; } .spk-fields .spk-field { margin-top: 0; } .spk-label { display: block; font-family: var(--font-sans); font-size: 12px; font-weight: 500; letter-spacing: 0.02em; color: var(--ink-mute); margin-bottom: 6px; } .spk-input, .spk-letter { display: block; width: 100%; box-sizing: border-box; background: var(--paper); border: 1px solid var(--border-soft); border-radius: 8px; padding: 11px 13px; font-family: var(--font-sans); font-size: 14.5px; color: var(--ink); transition: border-color 0.12s ease; } .spk-input:focus, .spk-letter:focus { outline: none; border-color: var(--amber); } .spk-input::placeholder { color: var(--ink-fade); } .spk-input-mono { font-family: var(--font-mono); font-size: 13px; } .spk-letter { min-height: 340px; line-height: 1.65; font-size: 14.5px; } trix-toolbar .trix-button-row { flex-wrap: wrap; } trix-toolbar .trix-button-group { border: 1px solid var(--border-soft); border-radius: 8px; margin-bottom: 8px; background: var(--paper); } trix-toolbar .trix-button { border-bottom: 0; color: var(--ink-soft); background: transparent; } trix-toolbar .trix-button:not(:disabled):hover { background: rgba(224, 134, 74, 0.12); } trix-toolbar .trix-button.trix-active { background: var(--amber); color: #1a1008; } trix-toolbar .trix-button--icon::before { filter: invert(88%); } trix-toolbar .trix-dialog { background: var(--paper); border: 1px solid var(--border-soft); color: var(--ink); } trix-toolbar .trix-input--dialog { background: var(--surface); border: 1px solid var(--border-soft); color: var(--ink); } .spk-letter a { color: var(--amber); } .spk-letter strong { color: var(--ink); } .spk-signoff { margin-top: 18px; } .spk-signoff summary { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); cursor: pointer; list-style: none; display: inline-flex; align-items: center; gap: 6px; } .spk-signoff summary::before { content: "+"; font-family: var(--font-mono); color: var(--ink-dim); } .spk-signoff[open] summary::before { content: "\2212"; } .spk-signoff summary::-webkit-details-marker { display: none; } .spk-signoff-body, .spk-sent-body { font-family: var(--font-sans); font-size: 13px; line-height: 1.6; color: var(--ink-mute); background: var(--paper); border: 1px solid var(--border-soft); border-radius: 8px; padding: 14px; margin: 10px 0 0; overflow-wrap: anywhere; } .spk-signoff-body a, .spk-sent-body a { color: var(--amber); } .spk-sent-body strong { color: var(--ink-soft); } .spk-send { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 26px 0 0; } .spk-send .spk-hint { margin: 0; } .spk-send-btn { font-family: var(--font-sans); font-weight: 600; font-size: 14.5px; background: var(--amber); color: #1a1008; border: 0; border-radius: 999px; padding: 12px 26px; cursor: pointer; transition: opacity 0.12s ease; } .spk-send-btn:hover { opacity: 0.9; } .spk-ledger { padding-top: 34px; } .spk-ledger-title { font-family: var(--font-sans); font-weight: 600; font-size: 15px; color: var(--ink); margin: 0 0 4px; } .spk-empty { font-family: var(--font-sans); font-size: 13.5px; color: var(--ink-mute); margin: 10px 0 0; } .spk-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--border-soft); } .spk-row-main { min-width: 0; } .spk-row-top { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; } .spk-name { font-family: var(--font-sans); font-weight: 600; font-size: 15px; color: var(--ink); } .spk-status { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-mute); border: 1px solid var(--border-soft); border-radius: 999px; padding: 2px 8px; } .spk-status-accepted { color: var(--amber); border-color: var(--amber); } .spk-status-declined { color: var(--ink-dim); } .spk-tag { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.06em; color: var(--ink-dim); } .spk-meta { font-family: var(--font-sans); font-size: 12.5px; color: var(--ink-mute); margin-top: 4px; } .spk-sent { margin-top: 8px; } .spk-sent summary { font-family: var(--font-sans); font-size: 12px; color: var(--ink-dim); cursor: pointer; list-style: none; } .spk-sent summary:hover { color: var(--amber); } .spk-sent summary::-webkit-details-marker { display: none; } .spk-actions { display: grid; grid-template-columns: repeat(2, 106px); gap: 6px; flex: none; } .spk-actions form { margin: 0; } .spk-action { width: 100%; font-family: var(--font-sans); font-size: 12px; color: var(--ink-soft); background: transparent; border: 1px solid var(--border-soft); border-radius: 999px; padding: 5px 10px; cursor: pointer; transition: border-color 0.12s ease, color 0.12s ease; } .spk-action:hover { border-color: var(--amber); color: var(--amber); } .spk-action-quiet { color: var(--ink-dim); } @media (max-width: 620px) { .spk-row { flex-direction: column; gap: 10px; } .spk-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; } } .spk-suggest { padding: 8px 0 28px; border-bottom: 1px solid var(--border-soft); margin-bottom: 26px; } .spk-suggest-title { font-family: var(--font-sans); font-weight: 600; font-size: 15px; color: var(--ink); margin: 0 0 4px; } .spk-suggest-list { list-style: none; margin: 14px 0 0; padding: 0; counter-reset: spk-suggest; } .spk-suggest-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 12px 0; border-top: 1px solid var(--border-soft); } .spk-suggest-main { min-width: 0; display: flex; flex-direction: column; } .spk-suggest-row .spk-actions { grid-template-columns: 106px; align-items: start; } .spk-suggest-row .spk-action { display: inline-block; text-align: center; text-decoration: none; } .spk-suggest-link { color: var(--ink-mute); text-decoration: none; margin-right: 10px; } .spk-suggest-link:hover { color: var(--amber); } @media (max-width: 620px) { .spk-suggest-row { flex-direction: column; gap: 8px; } .spk-suggest-row .spk-actions { grid-template-columns: minmax(0, 1fr); width: 100%; } } .spk-desk-link { color: var(--amber); text-decoration: none; border-bottom: 1px solid transparent; } .spk-desk-link:hover { border-bottom-color: var(--amber); } .spk-open { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-dim); } .spk-open.is-open { color: var(--amber); }