/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-blue-50: oklch(97% 0.014 254.604);
    --color-blue-800: oklch(42.4% 0.199 265.638);
    --color-stone-50: oklch(98.5% 0.001 106.423);
    --color-stone-200: oklch(92.3% 0.003 48.717);
    --color-stone-300: oklch(86.9% 0.005 56.366);
    --color-stone-600: oklch(44.4% 0.011 73.639);
    --color-stone-800: oklch(26.8% 0.007 34.298);
    --spacing: 0.25rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --radius-sm: 0.25rem;
    --radius-lg: 0.5rem;
    --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --ease-in: cubic-bezier(0.4, 0, 1, 1);
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --animate-spin: spin 1s linear infinite;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
  }
}

/* Theme builder live preview (mirrors assets/css/app.css; retained for the running dev server). */
.theme-builder-workspace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(20rem, .9fr); gap: 1.5rem; align-items: start; }
.theme-builder-controls { min-width: 0; }
.theme-preview-pane { min-width: 0; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-soft); }
.theme-preview-heading { display: flex; align-items: start; justify-content: space-between; gap: .75rem; margin-bottom: .85rem; }
.theme-preview-heading h2 { margin: .08rem 0 0; font-size: 1.2rem; }
.theme-preview-status { max-width: 10rem; color: var(--ink-faint); font-size: .72rem; line-height: 1.35; text-align: right; }
.theme-profile-preview { overflow: hidden; border-radius: .7rem; background-color: var(--canvas); color: var(--ink); isolation: isolate; }
.theme-preview-cover.profile-cover { grid-template-columns: 3.35rem minmax(0, 1fr); gap: .7rem; min-height: 8.75rem; padding: .8rem; border-radius: .7rem .7rem 0 0; box-shadow: none; }
.theme-profile-preview .theme-preview-cover::after { background: linear-gradient(100deg, color-mix(in srgb, var(--primary) 82%, transparent), color-mix(in srgb, var(--accent) 38%, transparent)) !important; }
.theme-preview-cover .profile-avatar-wrap, .theme-preview-cover .profile-avatar-photo { width: 3.35rem; height: 3.35rem; }
.theme-preview-cover .profile-avatar-photo { border-width: 2px; }
.theme-preview-cover .profile-title h1 { font-size: 1.05rem; }
.theme-preview-cover .profile-title p { margin-top: .18rem; font-size: .69rem; }
.theme-preview-cover .profile-summary { font-size: .62rem !important; }
.theme-preview-tabs { margin: .6rem; font-size: .68rem; pointer-events: none; }
.theme-preview-tabs span { flex: 0 0 auto; padding: .3rem .45rem; border-radius: .4rem; color: var(--ink-soft); font-weight: 700; }
.theme-preview-tabs .selected { background: var(--surface); color: var(--primary); box-shadow: var(--shadow-sm); }
.theme-preview-content { display: grid; grid-template-columns: minmax(6.5rem, .6fr) minmax(0, 1.4fr); gap: .55rem; padding: 0 .6rem .6rem; }
.theme-preview-content .panel { min-width: 0; padding: .6rem !important; }
.theme-preview-content .profile-info h2 { margin: 0 0 .35rem; font-size: .78rem; }
.theme-preview-content .profile-info p { margin: 0; font-size: .63rem; line-height: 1.35; }
.theme-preview-content .wall-post { margin: 0; }
.theme-preview-content .wall-post-head { gap: .35rem; }
.theme-preview-content .sn-avatar-sm { width: 1.55rem; height: 1.55rem; }
.theme-preview-content .wall-author { font-size: .67rem; }
.theme-preview-content .wall-time { font-size: .57rem; }
.theme-preview-content .wall-body { margin-top: .45rem; font-size: .68rem; line-height: 1.4; }
.theme-preview-content .wall-actions { gap: .35rem; margin-top: .45rem; padding-top: .4rem; font-size: .59rem; }
.theme-profile-preview.theme-header-split .theme-preview-cover { min-height: 11rem; align-items: center; }
.theme-profile-preview.theme-header-compact .theme-preview-cover { min-height: 5.8rem; }
.theme-profile-preview.theme-frame-chrome .panel { border: 2px solid var(--primary); box-shadow: 3px 3px 0 color-mix(in srgb, var(--accent) 42%, transparent); }
.theme-profile-preview.theme-frame-sticker .panel { border: 2px dashed var(--accent); box-shadow: 2px 2px 0 color-mix(in srgb, var(--primary) 25%, transparent); transform: rotate(-.2deg); }
.theme-profile-preview.theme-density-compact .theme-preview-content { gap: .35rem; }
.theme-profile-preview.theme-density-compact .theme-preview-content .panel { padding: .45rem !important; }
.theme-profile-preview.theme-density-spacious .theme-preview-content { gap: .8rem; }
.theme-profile-preview.theme-density-spacious .theme-preview-content .panel { padding: .8rem !important; }
.theme-profile-preview.theme-decoration-hearts .theme-preview-cover::before, .theme-profile-preview.theme-decoration-sparkles .theme-preview-cover::before { right: .55rem; top: .35rem; font-size: .8rem; letter-spacing: .16rem; }
.theme-profile-preview.theme-decoration-tape .theme-preview-cover::before { inset: -.45rem auto auto 46%; width: 4.2rem; height: .85rem; }
.theme-profile-preview.theme-type-pixel h1, .theme-profile-preview.theme-type-pixel h2, .theme-profile-preview.theme-type-pixel h3 { font-family: monospace; letter-spacing: .03em; }
.theme-profile-preview.theme-type-zine h1, .theme-profile-preview.theme-type-zine h2 { font-family: Georgia, serif; font-style: italic; }
@media (max-width: 900px) { .theme-builder-workspace { grid-template-columns: 1fr; }.theme-preview-pane { order: 2; }.theme-preview-status { max-width: none; } }
.theme-profile-preview.theme-background-plain { background-image: none; }.theme-profile-preview.theme-background-grid { background-image: linear-gradient(color-mix(in srgb, var(--primary) 16%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--primary) 16%, transparent) 1px, transparent 1px); background-size: 20px 20px; }.theme-profile-preview.theme-background-stars { background-image: radial-gradient(circle at 20% 22%, var(--accent) 0 1px, transparent 2px), radial-gradient(circle at 75% 35%, var(--primary) 0 1px, transparent 2px), radial-gradient(circle at 45% 80%, var(--accent) 0 1px, transparent 2px); background-size: 72px 86px; }.theme-profile-preview.theme-background-dots { background-image: radial-gradient(var(--primary) 1px, transparent 1px); background-size: 12px 12px; }.theme-profile-preview.theme-decoration-hearts .theme-preview-cover::before, .theme-profile-preview.theme-decoration-sparkles .theme-preview-cover::before { position: absolute; z-index: 2; right: .55rem; top: .35rem; color: white; font-size: .8rem; letter-spacing: .16rem; }.theme-profile-preview.theme-decoration-hearts .theme-preview-cover::before { content: "♥ ♥ ♥"; }.theme-profile-preview.theme-decoration-sparkles .theme-preview-cover::before { content: "✦ ✦ ✦"; }.theme-profile-preview.theme-decoration-tape .theme-preview-cover::before { position: absolute; z-index: 2; inset: -.45rem auto auto 46%; width: 4.2rem; height: .85rem; background: rgb(255 244 180 / 72%); content: ""; transform: rotate(3deg); }

/* Recovery copy of the curated theme rules. Source of truth: assets/css/app.css. */
.theme-midnight { --primary: #5b5bd6; --accent: #f472b6; --surface-soft: #eef0ff; }.theme-candy { --primary: #db2777; --accent: #7c3aed; --surface-soft: #fff0f7; }.theme-ocean { --primary: #0369a1; --accent: #0891b2; --surface-soft: #ecfeff; }.theme-lime { --primary: #4d7c0f; --accent: #ca8a04; --surface-soft: #f7fee7; }.theme-sunset { --primary: #c2410c; --accent: #e11d48; --surface-soft: #fff7ed; }.theme-mono { --primary: #334155; --accent: #111827; --surface-soft: #f1f5f9; }
.profile-page.profile-theme #profile-cover { border: 3px solid var(--accent) !important; box-shadow: 0 0 0 5px color-mix(in srgb, var(--primary) 18%, transparent), 9px 9px 0 color-mix(in srgb, var(--accent) 38%, transparent) !important; }.profile-page.profile-theme #profile-cover::after { background: linear-gradient(100deg, color-mix(in srgb, var(--primary) 78%, transparent), color-mix(in srgb, var(--accent) 32%, transparent)) !important; }.profile-page.profile-theme.theme-header-split #profile-cover { min-height: 21rem !important; align-items: center !important; }.profile-page.profile-theme.theme-header-compact #profile-cover { min-height: 8rem !important; }.profile-page.profile-theme.theme-background-grid { background-image: linear-gradient(color-mix(in srgb, var(--primary) 16%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--primary) 16%, transparent) 1px, transparent 1px) !important; background-size: 20px 20px !important; }.profile-page.profile-theme.theme-frame-chrome .panel, .profile-page.profile-theme.theme-frame-chrome .rail-box { border: 2px solid var(--primary) !important; box-shadow: 5px 5px 0 color-mix(in srgb, var(--accent) 42%, transparent) !important; }.profile-page.profile-theme.theme-frame-sticker .panel, .profile-page.profile-theme.theme-frame-sticker .rail-box { border: 2px dashed var(--accent) !important; box-shadow: 3px 3px 0 color-mix(in srgb, var(--primary) 25%, transparent) !important; }.profile-page.profile-theme.theme-decoration-tape #profile-cover::before { position: absolute; z-index: 5; inset: -.7rem auto auto 42%; width: 7rem; height: 1.5rem; background: rgb(255 244 180 / 72%); content: ""; transform: rotate(3deg); }.profile-page.profile-theme.theme-candy #profile-cover::after { background: linear-gradient(110deg, rgb(190 24 93 / 76%), rgb(124 58 237 / 38%)) !important; }.profile-page.profile-theme.theme-ocean #profile-cover::after { background: linear-gradient(110deg, rgb(3 105 161 / 76%), rgb(8 145 178 / 38%)) !important; }.profile-page.profile-theme.theme-lime #profile-cover::after { background: linear-gradient(110deg, rgb(77 124 15 / 76%), rgb(202 138 4 / 38%)) !important; }.profile-page.profile-theme.theme-sunset #profile-cover::after { background: linear-gradient(110deg, rgb(194 65 12 / 76%), rgb(225 29 72 / 38%)) !important; }
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .visible {
    visibility: visible;
  }
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .z-50 {
    z-index: 50;
  }
  .container {
    width: 100%;
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
  }
  .mt-1\.5 {
    margin-top: calc(var(--spacing) * 1.5);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mb-1 {
    margin-bottom: calc(var(--spacing) * 1);
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .ml-1 {
    margin-left: calc(var(--spacing) * 1);
  }
  .hero-academic-cap {
    --hero-academic-cap: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M4.26%2010.147a60.438%2060.438%200%200%200-.491%206.347A48.62%2048.62%200%200%201%2012%2020.904a48.62%2048.62%200%200%201%208.232-4.41%2060.46%2060.46%200%200%200-.491-6.347m-15.482%200a50.636%2050.636%200%200%200-2.658-.813A59.906%2059.906%200%200%201%2012%203.493a59.903%2059.903%200%200%201%2010.399%205.84c-.896.248-1.783.52-2.658.814m-15.482%200A50.717%2050.717%200%200%201%2012%2013.489a50.702%2050.702%200%200%201%207.74-3.342M6.75%2015a.75.75%200%201%200%200-1.5.75.75%200%200%200%200%201.5Zm0%200v-3.675A55.378%2055.378%200%200%201%2012%208.443m-7.007%2011.55A5.981%205.981%200%200%200%206.75%2015.75v-1.5%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-academic-cap);
    mask: var(--hero-academic-cap);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-archive-box {
    --hero-archive-box: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m20.25%207.5-.625%2010.632a2.25%202.25%200%200%201-2.247%202.118H6.622a2.25%202.25%200%200%201-2.247-2.118L3.75%207.5M10%2011.25h4M3.375%207.5h17.25c.621%200%201.125-.504%201.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621%200-1.125.504-1.125%201.125v1.5c0%20.621.504%201.125%201.125%201.125Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-archive-box);
    mask: var(--hero-archive-box);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-arrow-left {
    --hero-arrow-left: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M10.5%2019.5%203%2012m0%200%207.5-7.5M3%2012h18%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-arrow-left);
    mask: var(--hero-arrow-left);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-arrow-left-on-rectangle {
    --hero-arrow-left-on-rectangle: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M15.75%209V5.25A2.25%202.25%200%200%200%2013.5%203h-6a2.25%202.25%200%200%200-2.25%202.25v13.5A2.25%202.25%200%200%200%207.5%2021h6a2.25%202.25%200%200%200%202.25-2.25V15M12%209l-3%203m0%200%203%203m-3-3h12.75%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-arrow-left-on-rectangle);
    mask: var(--hero-arrow-left-on-rectangle);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-arrow-path {
    --hero-arrow-path: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M16.023%209.348h4.992v-.001M2.985%2019.644v-4.992m0%200h4.992m-4.993%200%203.181%203.183a8.25%208.25%200%200%200%2013.803-3.7M4.031%209.865a8.25%208.25%200%200%201%2013.803-3.7l3.181%203.182m0-4.991v4.99%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-arrow-path);
    mask: var(--hero-arrow-path);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-arrow-path-rounded-square {
    --hero-arrow-path-rounded-square: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M19.5%2012c0-1.232-.046-2.453-.138-3.662a4.006%204.006%200%200%200-3.7-3.7%2048.678%2048.678%200%200%200-7.324%200%204.006%204.006%200%200%200-3.7%203.7c-.017.22-.032.441-.046.662M19.5%2012l3-3m-3%203-3-3m-12%203c0%201.232.046%202.453.138%203.662a4.006%204.006%200%200%200%203.7%203.7%2048.656%2048.656%200%200%200%207.324%200%204.006%204.006%200%200%200%203.7-3.7c.017-.22.032-.441.046-.662M4.5%2012l3%203m-3-3-3%203%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-arrow-path-rounded-square);
    mask: var(--hero-arrow-path-rounded-square);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-arrow-up-tray {
    --hero-arrow-up-tray: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M3%2016.5v2.25A2.25%202.25%200%200%200%205.25%2021h13.5A2.25%202.25%200%200%200%2021%2018.75V16.5m-13.5-9L12%203m0%200%204.5%204.5M12%203v13.5%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-arrow-up-tray);
    mask: var(--hero-arrow-up-tray);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-arrow-uturn-left {
    --hero-arrow-uturn-left: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M9%2015%203%209m0%200%206-6M3%209h12a6%206%200%200%201%200%2012h-3%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-arrow-uturn-left);
    mask: var(--hero-arrow-uturn-left);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-bars-3 {
    --hero-bars-3: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M3.75%206.75h16.5M3.75%2012h16.5m-16.5%205.25h16.5%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-bars-3);
    mask: var(--hero-bars-3);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-bell {
    --hero-bell: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M14.857%2017.082a23.848%2023.848%200%200%200%205.454-1.31A8.967%208.967%200%200%201%2018%209.75V9A6%206%200%200%200%206%209v.75a8.967%208.967%200%200%201-2.312%206.022c1.733.64%203.56%201.085%205.455%201.31m5.714%200a24.255%2024.255%200%200%201-5.714%200m5.714%200a3%203%200%201%201-5.714%200%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-bell);
    mask: var(--hero-bell);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-bell-alert {
    --hero-bell-alert: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M14.857%2017.082a23.848%2023.848%200%200%200%205.454-1.31A8.967%208.967%200%200%201%2018%209.75V9A6%206%200%200%200%206%209v.75a8.967%208.967%200%200%201-2.312%206.022c1.733.64%203.56%201.085%205.455%201.31m5.714%200a24.255%2024.255%200%200%201-5.714%200m5.714%200a3%203%200%201%201-5.714%200M3.124%207.5A8.969%208.969%200%200%201%205.292%203m13.416%200a8.969%208.969%200%200%201%202.168%204.5%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-bell-alert);
    mask: var(--hero-bell-alert);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-bookmark {
    --hero-bookmark: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M17.593%203.322c1.1.128%201.907%201.077%201.907%202.185V21L12%2017.25%204.5%2021V5.507c0-1.108.806-2.057%201.907-2.185a48.507%2048.507%200%200%201%2011.186%200Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-bookmark);
    mask: var(--hero-bookmark);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-briefcase {
    --hero-briefcase: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M20.25%2014.15v4.25c0%201.094-.787%202.036-1.872%202.18-2.087.277-4.216.42-6.378.42s-4.291-.143-6.378-.42c-1.085-.144-1.872-1.086-1.872-2.18v-4.25m16.5%200a2.18%202.18%200%200%200%20.75-1.661V8.706c0-1.081-.768-2.015-1.837-2.175a48.114%2048.114%200%200%200-3.413-.387m4.5%208.006c-.194.165-.42.295-.673.38A23.978%2023.978%200%200%201%2012%2015.75c-2.648%200-5.195-.429-7.577-1.22a2.016%202.016%200%200%201-.673-.38m0%200A2.18%202.18%200%200%201%203%2012.489V8.706c0-1.081.768-2.015%201.837-2.175a48.111%2048.111%200%200%201%203.413-.387m7.5%200V5.25A2.25%202.25%200%200%200%2013.5%203h-3a2.25%202.25%200%200%200-2.25%202.25v.894m7.5%200a48.667%2048.667%200%200%200-7.5%200M12%2012.75h.008v.008H12v-.008Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-briefcase);
    mask: var(--hero-briefcase);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-calendar-days {
    --hero-calendar-days: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M6.75%203v2.25M17.25%203v2.25M3%2018.75V7.5a2.25%202.25%200%200%201%202.25-2.25h13.5A2.25%202.25%200%200%201%2021%207.5v11.25m-18%200A2.25%202.25%200%200%200%205.25%2021h13.5A2.25%202.25%200%200%200%2021%2018.75m-18%200v-7.5A2.25%202.25%200%200%201%205.25%209h13.5A2.25%202.25%200%200%201%2021%2011.25v7.5m-9-6h.008v.008H12v-.008ZM12%2015h.008v.008H12V15Zm0%202.25h.008v.008H12v-.008ZM9.75%2015h.008v.008H9.75V15Zm0%202.25h.008v.008H9.75v-.008ZM7.5%2015h.008v.008H7.5V15Zm0%202.25h.008v.008H7.5v-.008Zm6.75-4.5h.008v.008h-.008v-.008Zm0%202.25h.008v.008h-.008V15Zm0%202.25h.008v.008h-.008v-.008Zm2.25-4.5h.008v.008H16.5v-.008Zm0%202.25h.008v.008H16.5V15Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-calendar-days);
    mask: var(--hero-calendar-days);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-camera {
    --hero-camera: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M6.827%206.175A2.31%202.31%200%200%201%205.186%207.23c-.38.054-.757.112-1.134.175C2.999%207.58%202.25%208.507%202.25%209.574V18a2.25%202.25%200%200%200%202.25%202.25h15A2.25%202.25%200%200%200%2021.75%2018V9.574c0-1.067-.75-1.994-1.802-2.169a47.865%2047.865%200%200%200-1.134-.175%202.31%202.31%200%200%201-1.64-1.055l-.822-1.316a2.192%202.192%200%200%200-1.736-1.039%2048.774%2048.774%200%200%200-5.232%200%202.192%202.192%200%200%200-1.736%201.039l-.821%201.316Z%22%2F%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M16.5%2012.75a4.5%204.5%200%201%201-9%200%204.5%204.5%200%200%201%209%200ZM18.75%2010.5h.008v.008h-.008V10.5Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-camera);
    mask: var(--hero-camera);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-chat-bubble-left {
    --hero-chat-bubble-left: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M2.25%2012.76c0%201.6%201.123%202.994%202.707%203.227%201.087.16%202.185.283%203.293.369V21l4.076-4.076a1.526%201.526%200%200%201%201.037-.443%2048.282%2048.282%200%200%200%205.68-.494c1.584-.233%202.707-1.626%202.707-3.228V6.741c0-1.602-1.123-2.995-2.707-3.228A48.394%2048.394%200%200%200%2012%203c-2.392%200-4.744.175-7.043.513C3.373%203.746%202.25%205.14%202.25%206.741v6.018Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-chat-bubble-left);
    mask: var(--hero-chat-bubble-left);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-chat-bubble-left-right {
    --hero-chat-bubble-left-right: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M20.25%208.511c.884.284%201.5%201.128%201.5%202.097v4.286c0%201.136-.847%202.1-1.98%202.193-.34.027-.68.052-1.02.072v3.091l-3-3c-1.354%200-2.694-.055-4.02-.163a2.115%202.115%200%200%201-.825-.242m9.345-8.334a2.126%202.126%200%200%200-.476-.095%2048.64%2048.64%200%200%200-8.048%200c-1.131.094-1.976%201.057-1.976%202.192v4.286c0%20.837.46%201.58%201.155%201.951m9.345-8.334V6.637c0-1.621-1.152-3.026-2.76-3.235A48.455%2048.455%200%200%200%2011.25%203c-2.115%200-4.198.137-6.24.402-1.608.209-2.76%201.614-2.76%203.235v6.226c0%201.621%201.152%203.026%202.76%203.235.577.075%201.157.14%201.74.194V21l4.155-4.155%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-chat-bubble-left-right);
    mask: var(--hero-chat-bubble-left-right);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-check {
    --hero-check: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m4.5%2012.75%206%206%209-13.5%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-check);
    mask: var(--hero-check);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-check-circle {
    --hero-check-circle: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M9%2012.75%2011.25%2015%2015%209.75M21%2012a9%209%200%201%201-18%200%209%209%200%200%201%2018%200Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-check-circle);
    mask: var(--hero-check-circle);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-cog-6-tooth {
    --hero-cog-6-tooth: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M9.594%203.94c.09-.542.56-.94%201.11-.94h2.593c.55%200%201.02.398%201.11.94l.213%201.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257%201.075.124l1.217-.456a1.125%201.125%200%200%201%201.37.49l1.296%202.247a1.125%201.125%200%200%201-.26%201.431l-1.003.827c-.293.241-.438.613-.43.992a7.723%207.723%200%200%201%200%20.255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26%201.43l-1.298%202.247a1.125%201.125%200%200%201-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47%206.47%200%200%201-.22.128c-.331.183-.581.495-.644.869l-.213%201.281c-.09.543-.56.94-1.11.94h-2.594c-.55%200-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52%206.52%200%200%201-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125%201.125%200%200%201-1.369-.49l-1.297-2.247a1.125%201.125%200%200%201%20.26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932%206.932%200%200%201%200-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125%201.125%200%200%201-.26-1.43l1.297-2.247a1.125%201.125%200%200%201%201.37-.491l1.216.456c.356.133.751.072%201.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z%22%2F%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M15%2012a3%203%200%201%201-6%200%203%203%200%200%201%206%200Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-cog-6-tooth);
    mask: var(--hero-cog-6-tooth);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-computer-desktop {
    --hero-computer-desktop: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M9%2017.25v1.007a3%203%200%200%201-.879%202.122L7.5%2021h9l-.621-.621A3%203%200%200%201%2015%2018.257V17.25m6-12V15a2.25%202.25%200%200%201-2.25%202.25H5.25A2.25%202.25%200%200%201%203%2015V5.25m18%200A2.25%202.25%200%200%200%2018.75%203H5.25A2.25%202.25%200%200%200%203%205.25m18%200V12a2.25%202.25%200%200%201-2.25%202.25H5.25A2.25%202.25%200%200%201%203%2012V5.25%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-computer-desktop);
    mask: var(--hero-computer-desktop);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-exclamation-circle {
    --hero-exclamation-circle: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M12%209v3.75m9-.75a9%209%200%201%201-18%200%209%209%200%200%201%2018%200Zm-9%203.75h.008v.008H12v-.008Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-exclamation-circle);
    mask: var(--hero-exclamation-circle);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-eye {
    --hero-eye: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M2.036%2012.322a1.012%201.012%200%200%201%200-.639C3.423%207.51%207.36%204.5%2012%204.5c4.638%200%208.573%203.007%209.963%207.178.07.207.07.431%200%20.639C20.577%2016.49%2016.64%2019.5%2012%2019.5c-4.638%200-8.573-3.007-9.963-7.178Z%22%2F%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M15%2012a3%203%200%201%201-6%200%203%203%200%200%201%206%200Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-eye);
    mask: var(--hero-eye);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-flag {
    --hero-flag: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M3%203v1.5M3%2021v-6m0%200%202.77-.693a9%209%200%200%201%206.208.682l.108.054a9%209%200%200%200%206.086.71l3.114-.732a48.524%2048.524%200%200%201-.005-10.499l-3.11.732a9%209%200%200%201-6.085-.711l-.108-.054a9%209%200%200%200-6.208-.682L3%204.5M3%2015V4.5%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-flag);
    mask: var(--hero-flag);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-heart {
    --hero-heart: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M21%208.25c0-2.485-2.099-4.5-4.688-4.5-1.935%200-3.597%201.126-4.312%202.733-.715-1.607-2.377-2.733-4.313-2.733C5.1%203.75%203%205.765%203%208.25c0%207.22%209%2012%209%2012s9-4.78%209-12Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-heart);
    mask: var(--hero-heart);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-home {
    --hero-home: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m2.25%2012%208.954-8.955c.44-.439%201.152-.439%201.591%200L21.75%2012M4.5%209.75v10.125c0%20.621.504%201.125%201.125%201.125H9.75v-4.875c0-.621.504-1.125%201.125-1.125h2.25c.621%200%201.125.504%201.125%201.125V21h4.125c.621%200%201.125-.504%201.125-1.125V9.75M8.25%2021h8.25%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-home);
    mask: var(--hero-home);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-information-circle {
    --hero-information-circle: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m11.25%2011.25.041-.02a.75.75%200%200%201%201.063.852l-.708%202.836a.75.75%200%200%200%201.063.853l.041-.021M21%2012a9%209%200%201%201-18%200%209%209%200%200%201%2018%200Zm-9-3.75h.008v.008H12V8.25Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-information-circle);
    mask: var(--hero-information-circle);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-link {
    --hero-link: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M13.19%208.688a4.5%204.5%200%200%201%201.242%207.244l-4.5%204.5a4.5%204.5%200%200%201-6.364-6.364l1.757-1.757m13.35-.622%201.757-1.757a4.5%204.5%200%200%200-6.364-6.364l-4.5%204.5a4.5%204.5%200%200%200%201.242%207.244%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-link);
    mask: var(--hero-link);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-magnifying-glass {
    --hero-magnifying-glass: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m21%2021-5.197-5.197m0%200A7.5%207.5%200%201%200%205.196%205.196a7.5%207.5%200%200%200%2010.607%2010.607Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-magnifying-glass);
    mask: var(--hero-magnifying-glass);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-map-pin {
    --hero-map-pin: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M15%2010.5a3%203%200%201%201-6%200%203%203%200%200%201%206%200Z%22%2F%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M19.5%2010.5c0%207.142-7.5%2011.25-7.5%2011.25S4.5%2017.642%204.5%2010.5a7.5%207.5%200%201%201%2015%200Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-map-pin);
    mask: var(--hero-map-pin);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-moon {
    --hero-moon: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M21.752%2015.002A9.72%209.72%200%200%201%2018%2015.75c-5.385%200-9.75-4.365-9.75-9.75%200-1.33.266-2.597.748-3.752A9.753%209.753%200%200%200%203%2011.25C3%2016.635%207.365%2021%2012.75%2021a9.753%209.753%200%200%200%209.002-5.998Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-moon);
    mask: var(--hero-moon);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-paper-airplane {
    --hero-paper-airplane: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M6%2012%203.269%203.125A59.769%2059.769%200%200%201%2021.485%2012%2059.768%2059.768%200%200%201%203.27%2020.875L5.999%2012Zm0%200h7.5%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-paper-airplane);
    mask: var(--hero-paper-airplane);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-pencil-square {
    --hero-pencil-square: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m16.862%204.487%201.687-1.688a1.875%201.875%200%201%201%202.652%202.652L10.582%2016.07a4.5%204.5%200%200%201-1.897%201.13L6%2018l.8-2.685a4.5%204.5%200%200%201%201.13-1.897l8.932-8.931Zm0%200L19.5%207.125M18%2014v4.75A2.25%202.25%200%200%201%2015.75%2021H5.25A2.25%202.25%200%200%201%203%2018.75V8.25A2.25%202.25%200%200%201%205.25%206H10%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-pencil-square);
    mask: var(--hero-pencil-square);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-photo {
    --hero-photo: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m2.25%2015.75%205.159-5.159a2.25%202.25%200%200%201%203.182%200l5.159%205.159m-1.5-1.5%201.409-1.409a2.25%202.25%200%200%201%203.182%200l2.909%202.909m-18%203.75h16.5a1.5%201.5%200%200%200%201.5-1.5V6a1.5%201.5%200%200%200-1.5-1.5H3.75A1.5%201.5%200%200%200%202.25%206v12a1.5%201.5%200%200%200%201.5%201.5Zm10.5-11.25h.008v.008h-.008V8.25Zm.375%200a.375.375%200%201%201-.75%200%20.375.375%200%200%201%20.75%200Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-photo);
    mask: var(--hero-photo);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-plus-circle {
    --hero-plus-circle: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M12%209v6m3-3H9m12%200a9%209%200%201%201-18%200%209%209%200%200%201%2018%200Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-plus-circle);
    mask: var(--hero-plus-circle);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-shield-check {
    --hero-shield-check: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M9%2012.75%2011.25%2015%2015%209.75m-3-7.036A11.959%2011.959%200%200%201%203.598%206%2011.99%2011.99%200%200%200%203%209.749c0%205.592%203.824%2010.29%209%2011.623%205.176-1.332%209-6.03%209-11.622%200-1.31-.21-2.571-.598-3.751h-.152c-3.196%200-6.1-1.248-8.25-3.285Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-shield-check);
    mask: var(--hero-shield-check);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-sparkles {
    --hero-sparkles: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M9.813%2015.904%209%2018.75l-.813-2.846a4.5%204.5%200%200%200-3.09-3.09L2.25%2012l2.846-.813a4.5%204.5%200%200%200%203.09-3.09L9%205.25l.813%202.846a4.5%204.5%200%200%200%203.09%203.09L15.75%2012l-2.846.813a4.5%204.5%200%200%200-3.09%203.09ZM18.259%208.715%2018%209.75l-.259-1.035a3.375%203.375%200%200%200-2.455-2.456L14.25%206l1.036-.259a3.375%203.375%200%200%200%202.455-2.456L18%202.25l.259%201.035a3.375%203.375%200%200%200%202.456%202.456L21.75%206l-1.035.259a3.375%203.375%200%200%200-2.456%202.456ZM16.894%2020.567%2016.5%2021.75l-.394-1.183a2.25%202.25%200%200%200-1.423-1.423L13.5%2018.75l1.183-.394a2.25%202.25%200%200%200%201.423-1.423l.394-1.183.394%201.183a2.25%202.25%200%200%200%201.423%201.423l1.183.394-1.183.394a2.25%202.25%200%200%200-1.423%201.423Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-sparkles);
    mask: var(--hero-sparkles);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-sun {
    --hero-sun: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M12%203v2.25m6.364.386-1.591%201.591M21%2012h-2.25m-.386%206.364-1.591-1.591M12%2018.75V21m-4.773-4.227-1.591%201.591M5.25%2012H3m4.227-4.773L5.636%205.636M15.75%2012a3.75%203.75%200%201%201-7.5%200%203.75%203.75%200%200%201%207.5%200Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-sun);
    mask: var(--hero-sun);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-trash {
    --hero-trash: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22m14.74%209-.346%209m-4.788%200L9.26%209m9.968-3.21c.342.052.682.107%201.022.166m-1.022-.165L18.16%2019.673a2.25%202.25%200%200%201-2.244%202.077H8.084a2.25%202.25%200%200%201-2.244-2.077L4.772%205.79m14.456%200a48.108%2048.108%200%200%200-3.478-.397m-12%20.562c.34-.059.68-.114%201.022-.165m0%200a48.11%2048.11%200%200%201%203.478-.397m7.5%200v-.916c0-1.18-.91-2.164-2.09-2.201a51.964%2051.964%200%200%200-3.32%200c-1.18.037-2.09%201.022-2.09%202.201v.916m7.5%200a48.667%2048.667%200%200%200-7.5%200%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-trash);
    mask: var(--hero-trash);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-user {
    --hero-user: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M15.75%206a3.75%203.75%200%201%201-7.5%200%203.75%203.75%200%200%201%207.5%200ZM4.501%2020.118a7.5%207.5%200%200%201%2014.998%200A17.933%2017.933%200%200%201%2012%2021.75c-2.676%200-5.216-.584-7.499-1.632Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-user);
    mask: var(--hero-user);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-user-group {
    --hero-user-group: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M18%2018.72a9.094%209.094%200%200%200%203.741-.479%203%203%200%200%200-4.682-2.72m.94%203.198.001.031c0%20.225-.012.447-.037.666A11.944%2011.944%200%200%201%2012%2021c-2.17%200-4.207-.576-5.963-1.584A6.062%206.062%200%200%201%206%2018.719m12%200a5.971%205.971%200%200%200-.941-3.197m0%200A5.995%205.995%200%200%200%2012%2012.75a5.995%205.995%200%200%200-5.058%202.772m0%200a3%203%200%200%200-4.681%202.72%208.986%208.986%200%200%200%203.74.477m.94-3.197a5.971%205.971%200%200%200-.94%203.197M15%206.75a3%203%200%201%201-6%200%203%203%200%200%201%206%200Zm6%203a2.25%202.25%200%201%201-4.5%200%202.25%202.25%200%200%201%204.5%200Zm-13.5%200a2.25%202.25%200%201%201-4.5%200%202.25%202.25%200%200%201%204.5%200Z%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-user-group);
    mask: var(--hero-user-group);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .hero-x-mark {
    --hero-x-mark: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%20stroke-width%3D%221.5%22%20stroke%3D%22currentColor%22%20aria-hidden%3D%22true%22%20data-slot%3D%22icon%22%3E%20%20%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M6%2018%2018%206M6%206l12%2012%22%2F%3E%3C%2Fsvg%3E');
    -webkit-mask: var(--hero-x-mark);
    mask: var(--hero-x-mark);
    mask-repeat: no-repeat;
    background-color: currentColor;
    vertical-align: middle;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .table {
    display: table;
  }
  .size-3 {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }
  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .size-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .size-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }
  .size-7 {
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
  }
  .size-8 {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
  }
  .max-h-96 {
    max-height: calc(var(--spacing) * 96);
  }
  .w-0 {
    width: calc(var(--spacing) * 0);
  }
  .w-80 {
    width: calc(var(--spacing) * 80);
  }
  .w-full {
    width: 100%;
  }
  .max-w-80 {
    max-width: calc(var(--spacing) * 80);
  }
  .flex-1 {
    flex: 1;
  }
  .flex-none {
    flex: none;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .translate-y-0 {
    --tw-translate-y: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-y-4 {
    --tw-translate-y: calc(var(--spacing) * 4);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .resize {
    resize: both;
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .items-center {
    align-items: center;
  }
  .items-end {
    align-items: flex-end;
  }
  .justify-between {
    justify-content: space-between;
  }
  .gap-1 {
    gap: calc(var(--spacing) * 1);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  .self-start {
    align-self: flex-start;
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-stone-200 {
    border-color: var(--color-stone-200);
  }
  .border-stone-300 {
    border-color: var(--color-stone-300);
  }
  .bg-stone-50 {
    background-color: var(--color-stone-50);
  }
  .object-cover {
    object-fit: cover;
  }
  .p-3 {
    padding: calc(var(--spacing) * 3);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .pt-4 {
    padding-top: calc(var(--spacing) * 4);
  }
  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }
  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
  .leading-8 {
    --tw-leading: calc(var(--spacing) * 8);
    line-height: calc(var(--spacing) * 8);
  }
  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .text-wrap {
    text-wrap: wrap;
  }
  .text-blue-800 {
    color: var(--color-blue-800);
  }
  .text-stone-600 {
    color: var(--color-stone-600);
  }
  .text-stone-800 {
    color: var(--color-stone-800);
  }
  .opacity-0 {
    opacity: 0%;
  }
  .opacity-40 {
    opacity: 40%;
  }
  .opacity-100 {
    opacity: 100%;
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .duration-200 {
    --tw-duration: 200ms;
    transition-duration: 200ms;
  }
  .duration-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .ease-in {
    --tw-ease: var(--ease-in);
    transition-timing-function: var(--ease-in);
  }
  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }
  .group-hover\:opacity-70 {
    &:is(:where(.group):hover *) {
      @media (hover: hover) {
        opacity: 70%;
      }
    }
  }
  .only\:block {
    &:only-child {
      display: block;
    }
  }
  .hover\:cursor-pointer {
    &:hover {
      @media (hover: hover) {
        cursor: pointer;
      }
    }
  }
  .hover\:bg-blue-50 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-blue-50);
      }
    }
  }
  .motion-safe\:animate-spin {
    @media (prefers-reduced-motion: no-preference) {
      animation: var(--animate-spin);
    }
  }
  .sm\:w-96 {
    @media (width >= 40rem) {
      width: calc(var(--spacing) * 96);
    }
  }
  .sm\:max-w-96 {
    @media (width >= 40rem) {
      max-width: calc(var(--spacing) * 96);
    }
  }
  .sm\:translate-y-0 {
    @media (width >= 40rem) {
      --tw-translate-y: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .sm\:scale-95 {
    @media (width >= 40rem) {
      --tw-scale-x: 95%;
      --tw-scale-y: 95%;
      --tw-scale-z: 95%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }
  .sm\:scale-100 {
    @media (width >= 40rem) {
      --tw-scale-x: 100%;
      --tw-scale-y: 100%;
      --tw-scale-z: 100%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }
  .sm\:grid-cols-2 {
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .lg\:grid-cols-3 {
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
}
:root {
  --canvas: #f4efe7;
  --canvas-deep: #e9dfd0;
  --surface: #fffdf9;
  --surface-soft: #f8f3ea;
  --surface-strong: #efe6d8;
  --ink: #1f2d27;
  --ink-soft: #53625a;
  --ink-faint: #788178;
  --line: #ded3c3;
  --line-strong: #cbbba5;
  --primary: #244f3e;
  --primary-hover: #163d2e;
  --primary-contrast: #fffdf8;
  --accent: #c96143;
  --accent-soft: #f8ddd0;
  --positive: #367554;
  --warning: #9c651d;
  --danger: #a64035;
  --danger-soft: #fae1dc;
  --shadow-sm: 0 1px 2px rgb(42 34 23 / 6%);
  --shadow: 0 12px 32px rgb(58 43 24 / 9%);
  --radius-sm: .625rem;
  --radius: 1rem;
  --radius-lg: 1.5rem;
  --display: Iowan Old Style, Baskerville, Palatino Linotype, Book Antiqua, serif;
  --body: Avenir Next, Avenir, Gill Sans, Trebuchet MS, sans-serif;
}
:root[data-theme="dark"] {
  --canvas: #18221d;
  --canvas-deep: #111914;
  --surface: #243129;
  --surface-soft: #1e2a23;
  --surface-strong: #2d3b32;
  --ink: #f4eee4;
  --ink-soft: #c5cdc3;
  --ink-faint: #9fac9f;
  --line: #3b4b40;
  --line-strong: #526254;
  --primary: #9acaa7;
  --primary-hover: #c1e0b8;
  --primary-contrast: #142019;
  --accent: #f09a75;
  --accent-soft: #4f3028;
  --positive: #86c596;
  --warning: #e8be71;
  --danger: #f19b91;
  --danger-soft: #4b2d2b;
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 20%);
  --shadow: 0 14px 38px rgb(0 0 0 / 24%);
}
* {
  box-sizing: border-box;
}
html {
  background: var(--canvas);
  scroll-behavior: smooth;
}
body {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  background: radial-gradient(circle at 0 0, var(--accent), transparent 28rem), linear-gradient(135deg, var(--canvas), var(--canvas-deep));
  @supports (color: color-mix(in lab, red, red)) {
    background: radial-gradient(circle at 0 0, color-mix(in srgb, var(--accent) 9%, transparent), transparent 28rem), linear-gradient(135deg, var(--canvas), var(--canvas-deep));
  }
  color: var(--ink);
  font: 15px/1.55 var(--body);
  letter-spacing: .005em;
}
button, input, textarea, select {
  font: inherit;
}
button, a, input, textarea, select {
  -webkit-tap-highlight-color: transparent;
}
button {
  color: inherit;
}
img {
  display: block;
  max-width: 100%;
  height: auto;
}
a {
  color: var(--primary);
  text-decoration: none;
}
a:hover {
  color: var(--primary-hover);
  text-decoration: none;
}
h1, h2, h3, .auth-brand, .sn-brand {
  font-family: var(--display);
  letter-spacing: -.025em;
}
h1, h2, h3, p {
  overflow-wrap: anywhere;
}
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
}
.sn-skip-link {
  position: fixed;
  z-index: 100;
  top: -5rem;
  left: 1rem;
  padding: .65rem .9rem;
  border-radius: .55rem;
  background: var(--primary);
  color: var(--primary-contrast);
  box-shadow: var(--shadow);
}
.sn-skip-link:focus {
  top: 1rem;
}
:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}
.sn-app-shell {
  min-height: 100vh;
}
.sn-header {
  position: sticky;
  z-index: 40;
  top: 0;
  display: flex;
  align-items: center;
  gap: 1rem;
  height: 4.5rem;
  padding: 0 max(1rem, calc((100vw - 1360px) / 2));
  border-bottom: 1px solid var(--line);
  background: var(--canvas);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--canvas) 88%, transparent);
  }
  backdrop-filter: blur(18px);
}
.sn-brand {
  flex: 0 0 auto;
  color: var(--ink);
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1;
}
.sn-brand span span {
  color: var(--accent);
}
.sn-brand-mark {
  display: inline-grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  margin-right: .3rem;
  border-radius: 50%;
  background: var(--primary);
  color: var(--primary-contrast);
  font: 700 1rem/1 var(--display);
}
.sn-search {
  display: flex;
  align-items: center;
  gap: .55rem;
  width: min(29rem, 36vw);
  padding: .6rem .8rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--ink-faint);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.sn-search:focus-within {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 15%, transparent);
  }
}
.sn-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
}
.sn-search input::placeholder {
  color: var(--ink-faint);
}
.sn-header-actions {
  display: flex;
  align-items: center;
  gap: .25rem;
  margin-left: auto;
}
.sn-header-actions > .sn-icon-button, .sn-icon-button {
  display: inline-grid;
  place-items: center;
  min-width: 2.5rem;
  min-height: 2.5rem;
  padding: .45rem;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ink-soft);
  cursor: pointer;
  transition: color .18s ease, background .18s ease, transform .18s ease;
}
.sn-icon-button:hover {
  background: var(--surface-strong);
  color: var(--primary);
  transform: translateY(-1px);
}
.sn-user-menu {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-left: .25rem;
  color: var(--ink);
  font-size: .86rem;
  font-weight: 700;
}
.sn-user-menu .sn-avatar {
  display: grid;
}
.sn-menu-toggle {
  display: none;
}
.sn-theme-switcher {
  display: inline-flex;
  padding: .18rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-soft);
}
.sn-theme-switcher button {
  display: grid;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ink-faint);
  cursor: pointer;
}
.sn-theme-switcher button[aria-pressed="true"] {
  background: var(--primary);
  color: var(--primary-contrast);
}
.sn-rail {
  position: fixed;
  z-index: 20;
  top: 4.5rem;
  bottom: 0;
  width: 15rem;
  padding: 1.4rem max(1rem, calc((100vw - 1360px) / 2));
  overflow-y: auto;
}
.sn-nav-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-height: 2.75rem;
  margin: .1rem 0;
  padding: .55rem .7rem;
  border-radius: .7rem;
  color: var(--ink-soft);
  font-size: .92rem;
  font-weight: 600;
  transition: color .18s ease, background .18s ease, transform .18s ease;
}
.sn-nav-item svg {
  color: var(--ink-faint);
}
.sn-nav-item:hover, .sn-nav-item.is-active {
  background: var(--surface);
  color: var(--primary);
  box-shadow: var(--shadow-sm);
}
.sn-nav-item:hover {
  transform: translateX(2px);
}
.sn-nav-item.is-active {
  font-weight: 800;
}
.sn-nav-item b {
  display: grid;
  place-items: center;
  min-width: 1.25rem;
  height: 1.25rem;
  margin-left: auto;
  padding: 0 .3rem;
  border-radius: 999px;
  background: var(--accent);
  color: white;
  font-size: .7rem;
}
.sn-nav-section {
  margin: 1.25rem .7rem .35rem;
  color: var(--ink-faint);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.sn-rail-divider {
  height: 1px;
  margin: 1rem .7rem;
  background: var(--line);
}
.sn-main {
  width: min(calc(100% - 18rem), 1120px);
  min-height: calc(100vh - 4.5rem);
  margin-left: max(16.5rem, calc((100vw - 1360px) / 2 + 15rem));
  padding: 2rem 1.25rem 4rem;
}
.sn-mobile-drawer, .sn-bottom-dock {
  display: none;
}
.panel, .rail-box, .sn-surface, .profile-info, .photos-panel, .edit-panel, .wall-section, .library-panel {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.panel, .rail-box, .sn-pad-md, .profile-info, .photos-panel, .edit-panel, .wall-section, .library-panel {
  padding: 1.15rem;
}
.sn-pad-sm {
  padding: .75rem;
}
.sn-pad-lg {
  padding: 1.6rem;
}
.sn-pad-none {
  padding: 0;
}
.sn-page-header, .section-heading, .feed-header, .panel-heading, .sn-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1rem;
}
.sn-page-header {
  padding-bottom: 1.1rem;
  border-bottom: 1px solid var(--line);
}
.sn-page-header h1, .section-heading h2, .feed-header h2, .panel-heading h2, .sn-section-heading h2 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(1.55rem, 2vw, 2.2rem);
  line-height: 1.1;
}
.sn-page-header p, .sn-back, .panel-heading > span, .section-heading > span {
  margin: 0;
  color: var(--ink-faint);
  font-size: .82rem;
}
.sn-back {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-bottom: .35rem;
  font-weight: 700;
}
.sn-page-actions, .feed-controls, .notification-controls, .notification-filters, .report-actions {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}
.primary-button, .secondary-button, .secondary-join, .confirm, .sn-action, .danger-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  min-height: 2.5rem;
  padding: .55rem .9rem;
  border: 1px solid var(--line-strong);
  border-radius: .65rem;
  background: var(--surface-soft);
  color: var(--ink);
  font-size: .84rem;
  font-weight: 800;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.primary-button, .sn-action-primary {
  border-color: var(--primary);
  background: var(--primary);
  color: var(--primary-contrast);
}
.primary-button:hover, .sn-action-primary:hover {
  background: var(--primary-hover);
  color: var(--primary-contrast);
  box-shadow: 0 6px 15px var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    box-shadow: 0 6px 15px color-mix(in srgb, var(--primary) 22%, transparent);
  }
}
.secondary-button:hover, .secondary-join:hover, .sn-action-secondary:hover {
  border-color: var(--primary);
  color: var(--primary);
  background: var(--surface);
}
.sn-action-quiet, .link-button {
  border: 0;
  background: transparent;
  color: var(--primary);
  cursor: pointer;
  font-weight: 750;
}
.sn-action-danger, .danger-button {
  border-color: var(--danger);
  background: var(--danger);
  color: white;
}
.primary-button:hover, .secondary-button:hover, .secondary-join:hover, .confirm:hover, .sn-action:hover, .danger-button:hover {
  transform: translateY(-1px);
}
.field {
  display: grid;
  gap: .35rem;
}
.field label, label {
  color: var(--ink-soft);
  font-size: .82rem;
  font-weight: 750;
}
input, textarea, select {
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: .65rem;
  background: var(--surface);
  color: var(--ink);
}
input, select {
  min-height: 2.6rem;
  padding: .55rem .7rem;
}
textarea {
  min-height: 6rem;
  padding: .7rem;
  resize: vertical;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--primary);
  outline: 0;
  box-shadow: 0 0 0 4px var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 15%, transparent);
  }
}
.announcement {
  margin-bottom: 1.25rem;
  padding: .85rem 1rem;
  border: 1px solid var(--warning);
  @supports (color: color-mix(in lab, red, red)) {
    border: 1px solid color-mix(in srgb, var(--warning) 30%, var(--line));
  }
  border-radius: var(--radius-sm);
  background: var(--warning);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--warning) 11%, var(--surface));
  }
  color: var(--ink-soft);
}
.eyebrow {
  color: var(--accent);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.sn-avatar, .avatar {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
  border: 2px solid var(--surface);
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), var(--primary));
  color: white;
  font-weight: 800;
  box-shadow: 0 1px 3px rgb(0 0 0 / 12%);
}
.sn-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sn-avatar-xs {
  width: 1.45rem;
  height: 1.45rem;
}
.sn-avatar-sm, .avatar-small {
  width: 2.15rem;
  height: 2.15rem;
}
.sn-avatar-md {
  width: 2.65rem;
  height: 2.65rem;
}
.sn-avatar-lg {
  width: 3.5rem;
  height: 3.5rem;
}
.sn-avatar-xl, .avatar-profile {
  width: 7rem;
  height: 7rem;
}
.sn-profile-identity {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  min-width: 0;
}
.sn-profile-identity-copy {
  min-width: 0;
}
.sn-profile-identity-copy > a, .team-member-name {
  color: var(--ink);
  font-weight: 800;
}
.sn-profile-badges {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  margin-left: .3rem;
}
.sn-verified-badge {
  display: grid;
  place-items: center;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: var(--primary);
  color: var(--primary-contrast);
}
.sn-team-badge, .sn-status, .friend-badge {
  display: inline-flex;
  align-items: center;
  padding: .18rem .45rem;
  border-radius: 999px;
  background: var(--surface-strong);
  color: var(--ink-soft);
  font-size: .7rem;
  font-weight: 800;
}
.sn-status-positive {
  background: var(--positive);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--positive) 18%, var(--surface));
  }
  color: var(--positive);
}
.sn-status-warning {
  background: var(--warning);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--warning) 18%, var(--surface));
  }
  color: var(--warning);
}
.sn-status-danger {
  background: var(--danger-soft);
  color: var(--danger);
}
.sn-empty, .empty-state, .empty-photos, .empty-albums, .wall-empty {
  padding: 2.5rem 1.25rem;
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius);
  background: var(--surface-soft);
  color: var(--ink-faint);
  text-align: center;
}
.sn-empty h2 {
  margin: .6rem 0 .25rem;
  color: var(--ink);
}
.sn-empty p {
  max-width: 28rem;
  margin: 0 auto 1rem;
}
.page-grid {
  display: grid;
  grid-template-columns: 14rem minmax(0, 1fr) 15rem;
  gap: 1.25rem;
  align-items: start;
}
.left-rail, .right-rail {
  display: grid;
  gap: 1rem;
}
.feed-column {
  min-width: 0;
}
.profile-card, .composer, .story, .social-post-card, .group-post, .saved-post {
  min-width: 0;
}
.composer {
  margin-bottom: 1rem;
}
.composer-header, .composer-actions, .wall-form-footer {
  display: flex;
  align-items: center;
  gap: .6rem;
  flex-wrap: wrap;
}
.composer-body {
  margin: .85rem 0;
}
.sn-composer-input {
  position: relative;
}
.sn-composer-input textarea {
  min-height: 6rem;
  padding-bottom: 1.5rem;
  border: 0;
  background: transparent;
}
.sn-composer-count {
  position: absolute;
  right: .45rem;
  bottom: .3rem;
  color: var(--ink-faint);
  font-size: .72rem;
}
.story, .social-post-card {
  margin-bottom: 1rem;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.story:hover, .social-post-card:hover {
  border-color: var(--line-strong);
  box-shadow: var(--shadow);
}
.story-head, .story-header {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
}
.story-content {
  min-width: 0;
  flex: 1;
}
.story-content p, .group-post-body p {
  margin: .75rem 0 0;
  white-space: pre-wrap;
}
.story-meta, .story-actions, .social-post-actions {
  display: flex;
  align-items: center;
  gap: .25rem;
  flex-wrap: wrap;
  margin-top: .9rem;
  padding-top: .75rem;
  border-top: 1px solid var(--line);
  color: var(--ink-faint);
  font-size: .8rem;
}
.story-time {
  margin-right: auto;
}
.story-action {
  display: inline-grid;
  place-items: center;
  width: 2.4rem;
  height: 2.4rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ink-soft);
  cursor: pointer;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.story-action:hover, .story-action.is-active {
  background: var(--accent-soft);
  color: var(--accent);
  transform: translateY(-1px);
}
.story-delete:hover {
  background: var(--danger-soft);
  color: var(--danger);
}
.post-reactions, .message-reactions {
  display: flex;
  gap: .25rem;
  flex-wrap: wrap;
}
.reaction-button, .message-reaction {
  min-height: 2rem;
  padding: .25rem .5rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--ink-soft);
  cursor: pointer;
}
.reaction-button:hover, .reaction-button.is-active, .message-reaction:hover, .message-reaction.is-active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--ink);
}
.comment, .photo-comment {
  display: flex;
  gap: .55rem;
  margin-top: .75rem;
}
.comment > div, .photo-comment > div {
  min-width: 0;
}
.comment-form, .message-form, .photo-comment-form {
  display: flex;
  align-items: flex-end;
  gap: .5rem;
  margin-top: .75rem;
}
.comment-form .field, .message-form .field, .photo-comment-form .field {
  flex: 1;
}
.comment-form input, .message-form input, .photo-comment-form input {
  min-height: 2.35rem;
}
.feed-filter-controls, .admin-tabs, .profile-tabs {
  display: flex;
  gap: .3rem;
  overflow-x: auto;
  padding: .28rem;
  border: 1px solid var(--line);
  border-radius: .75rem;
  background: var(--surface-soft);
}
.feed-filter-controls .link-button, .admin-tabs a, .profile-tabs a {
  flex: 0 0 auto;
  padding: .45rem .7rem;
  border-radius: .5rem;
  color: var(--ink-soft);
}
.feed-filter-controls .link-button.is-active, .admin-tabs a.active, .profile-tabs a.selected {
  background: var(--surface);
  color: var(--primary);
  box-shadow: var(--shadow-sm);
}
.feed-photo, .wall-photo, .social-post-card > img, .shared-post img {
  width: 100%;
  max-height: 42rem;
  margin-top: .85rem;
  border-radius: .75rem;
  object-fit: cover;
}
.shared-post {
  margin-top: .85rem;
  padding: .85rem;
  border: 1px solid var(--line);
  border-radius: .75rem;
  background: var(--surface-soft);
}
.shared-post-ribbon {
  display: flex;
  gap: .4rem;
  align-items: center;
  margin-bottom: .5rem;
  color: var(--ink-soft);
  font-size: .78rem;
}
.profile-cover, .community-hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  gap: 1.25rem;
  min-height: 16rem;
  padding: 1.5rem;
  overflow: hidden;
  border-radius: var(--radius-lg) var(--radius-lg) var(--radius) var(--radius);
  background: linear-gradient(130deg, #18382c, #436652 58%, #b98c66);
  color: white;
  box-shadow: var(--shadow);
}
.profile-cover::after, .community-hero::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(90deg, rgb(10 27 20 / 48%), transparent 70%);
  pointer-events: none;
}
.profile-cover > *, .community-hero > * {
  position: relative;
  z-index: 1;
}
.profile-cover-image {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.profile-avatar-wrap {
  flex: 0 0 7rem;
}
.profile-avatar-photo {
  width: 7rem;
  height: 7rem;
  border: 4px solid var(--surface);
  border-radius: 50%;
  object-fit: cover;
}
.profile-title h1, .community-hero h1, .album-header h1, .photo-page-heading h1 {
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.25rem);
}
.profile-title h1 a {
  color: white;
}
.profile-title p, .community-hero p {
  margin: .3rem 0 0;
  color: rgb(255 255 255 / 86%);
}
.profile-grid {
  display: grid;
  grid-template-columns: minmax(14rem, .55fr) minmax(0, 1.45fr);
  gap: 1.25rem;
  margin-top: 1.25rem;
}
.photo-grid, .album-grid, .people-grid, .community-list, .album-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
  gap: .85rem;
}
.photo-card, .album-card, .person-card, .community-card, .event-card, .album-gallery-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease;
}
.photo-card:hover, .album-card:hover, .person-card:hover, .community-card:hover, .event-card:hover, .album-gallery-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}
.photo-card img, .album-card img, .album-gallery-card img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}
.person-card, .community-card, .event-card {
  padding: 1rem;
}
.person-card h3, .community-card h3, .event-card h3 {
  margin: .5rem 0 .25rem;
  color: var(--ink);
  font-size: 1.05rem;
}
.directory-search, .community-create, .event-create {
  margin-bottom: 1rem;
}
.directory-search form, .community-create form, .event-create form, .settings-form, .upload-modal-form, .album-edit-form {
  display: grid;
  gap: .8rem;
}
.collection-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface);
}
.collection-card img {
  width: 100%;
  aspect-ratio: 1.4;
  object-fit: cover;
}
.messages-panel {
  display: grid;
  grid-template-columns: minmax(15rem, .55fr) minmax(0, 1.45fr);
  min-height: 36rem;
  overflow: hidden;
  padding: 0 !important;
}
.conversation-list {
  background: var(--surface-soft);
  border-right: 1px solid var(--line);
}
.conversation-preview {
  display: flex;
  gap: .7rem;
  padding: .85rem;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
}
.conversation-preview:hover {
  background: var(--surface);
}
.conversation-preview.is-active {
  background: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--primary) 10%, var(--surface));
  }
}
.thread {
  display: flex;
  min-width: 0;
  flex-direction: column;
}
.thread-heading {
  padding: 1rem;
  border-bottom: 1px solid var(--line);
}
.thread-heading h1 {
  margin: 0;
  font-size: 1.35rem;
}
.thread-messages {
  flex: 1;
  padding: 1rem;
}
.message-bubble {
  max-width: min(76%, 38rem);
  margin: .6rem 0;
  padding: .7rem .85rem;
  border: 1px solid var(--line);
  border-radius: 1rem 1rem 1rem .25rem;
  background: var(--surface-soft);
}
.message-bubble.mine {
  margin-left: auto;
  border-color: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
  }
  border-radius: 1rem 1rem .25rem;
  background: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--primary) 12%, var(--surface));
  }
}
.message-form {
  padding: .85rem;
  border-top: 1px solid var(--line);
}
.notifications-panel, .moderation-panel, .saved-list {
  overflow: hidden;
  padding: 0 !important;
}
.notification-item {
  display: flex;
  align-items: center;
  gap: .7rem;
  width: 100%;
  padding: .9rem 1rem;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
  text-align: left;
}
.notification-item:hover {
  background: var(--surface-soft);
}
.notification-item.unread {
  border-left: 3px solid var(--accent);
  background: var(--accent);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--accent) 6%, var(--surface));
  }
}
.notification-open {
  display: grid;
  flex: 1;
  gap: .15rem;
  min-width: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}
.notification-open small, .notification-item small {
  color: var(--ink-faint);
}
.settings-page, .moderation-page, .administration-page, .team-page {
  display: grid;
  gap: 1rem;
}
.settings-panel {
  margin-bottom: 0;
}
.report-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  border-bottom: 1px solid var(--line);
}
.admin-summary {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}
.admin-member-row {
  display: grid;
  grid-template-columns: 2rem minmax(10rem, 1fr) minmax(8rem, .65fr) auto;
  gap: .75rem;
  align-items: center;
  padding: .75rem 0;
  border-bottom: 1px solid var(--line);
}
.admin-audit article {
  display: grid;
  grid-template-columns: 11rem minmax(0, 1fr) auto;
  gap: .75rem;
  padding: .85rem 0;
  border-bottom: 1px solid var(--line);
}
.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
}
.team-member-card {
  display: flex;
  gap: .75rem;
  padding: 1rem;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.upload-modal-backdrop {
  position: fixed;
  z-index: 60;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 1rem;
  background: rgb(15 23 18 / 58%);
  backdrop-filter: blur(4px);
}
.upload-modal {
  width: min(36rem, 100%);
  max-height: calc(100vh - 2rem);
  overflow: auto;
  padding: 1.25rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow);
}
.sn-flash-group {
  position: fixed;
  z-index: 80;
  right: 1rem;
  bottom: 1rem;
  display: grid;
  gap: .5rem;
  width: min(25rem, calc(100vw - 2rem));
}
.sn-flash-group > div {
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
}
.mention-picker, .wall-mention-picker, .group-mention-picker, .comment-mention-picker, .photo-tag-picker, .notification-popover {
  z-index: 70;
  border: 1px solid var(--line-strong);
  border-radius: .75rem;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.mention-option {
  display: flex;
  align-items: center;
  width: 100%;
  gap: .5rem;
  padding: .6rem .7rem;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}
.mention-option:hover {
  background: var(--surface-soft);
}
.sn-link-preview {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin-top: .75rem;
  padding: .7rem;
  border: 1px solid var(--line);
  border-radius: .75rem;
  background: var(--surface-soft);
}
.sn-link-preview-icon {
  display: grid;
  place-items: center;
  flex: 0 0 2rem;
  width: 2rem;
  height: 2rem;
  border-radius: .5rem;
  background: var(--surface);
  color: var(--primary);
}
.sn-hashtags {
  display: flex;
  gap: .35rem;
  flex-wrap: wrap;
  margin-top: .7rem;
}
.sn-hashtags a {
  padding: .2rem .5rem;
  border-radius: 999px;
  background: var(--surface-strong);
  color: var(--primary);
  font-size: .78rem;
  font-weight: 700;
}
.sn-auth-shell {
  min-height: 100vh;
}
.auth-page {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: 2rem 1rem;
  background: radial-gradient(circle at 88% 10%, var(--accent), transparent 27rem), linear-gradient(145deg, var(--canvas), var(--canvas-deep));
  @supports (color: color-mix(in lab, red, red)) {
    background: radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--accent) 26%, transparent), transparent 27rem), linear-gradient(145deg, var(--canvas), var(--canvas-deep));
  }
}
.auth-card {
  width: min(52rem, 100%);
  padding: clamp(1.5rem, 5vw, 3.5rem);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--surface) 93%, transparent);
  }
  box-shadow: var(--shadow);
}
.auth-brand {
  color: var(--primary);
  font-size: clamp(2.6rem, 7vw, 4.5rem);
  font-weight: 700;
  line-height: .9;
}
.auth-intro {
  max-width: 28rem;
  margin: .9rem 0 2rem;
  color: var(--ink-soft);
  font-size: 1.05rem;
}
.auth-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.auth-form {
  display: grid;
  gap: .8rem;
  padding: 1.15rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}
.auth-form h1 {
  margin: 0;
  font-size: 1.45rem;
}
.auth-footnote {
  color: var(--ink-faint);
  font-size: .8rem;
}
@media (max-width: 1180px) {
  .sn-rail {
    width: 4.6rem;
    padding: 1rem .7rem;
  }
  .sn-rail .sn-nav-item {
    justify-content: center;
    padding: .6rem;
  }
  .sn-rail .sn-nav-item span, .sn-rail .sn-nav-item b, .sn-nav-section {
    display: none;
  }
  .sn-main {
    width: calc(100% - 6rem);
    margin-left: 5.1rem;
  }
  .page-grid {
    grid-template-columns: minmax(0, 1fr) 15rem;
  }
  .left-rail {
    display: none;
  }
}
@media (max-width: 850px) {
  .page-grid {
    grid-template-columns: 1fr;
  }
  .right-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .profile-grid {
    grid-template-columns: 1fr;
  }
  .messages-panel {
    grid-template-columns: minmax(13rem, .7fr) minmax(0, 1.3fr);
  }
  .sn-theme-switcher {
    display: none;
  }
}
@media (max-width: 640px) {
  body {
    font-size: 16px;
  }
  .sn-header {
    height: 4rem;
    gap: .45rem;
    padding: 0 .75rem;
  }
  .sn-brand {
    font-size: 1.35rem;
  }
  .sn-brand-mark {
    width: 1.55rem;
    height: 1.55rem;
  }
  .sn-brand > span:last-child {
    display: none;
  }
  .sn-search {
    flex: 1;
    width: auto;
    padding: .48rem .65rem;
  }
  .sn-header-actions {
    gap: 0;
  }
  .sn-header-actions > a, .sn-header-actions .sn-notification-bell, .sn-user-menu {
    display: none;
  }
  .sn-menu-toggle {
    display: inline-grid;
  }
  .sn-rail {
    display: none;
  }
  .sn-main {
    width: 100%;
    margin: 0;
    padding: 1.1rem .75rem 5.6rem;
  }
  .sn-bottom-dock {
    position: fixed;
    z-index: 45;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: space-around;
    padding: .35rem .25rem calc(.35rem + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    background: var(--surface);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in srgb, var(--surface) 93%, transparent);
    }
    backdrop-filter: blur(16px);
  }
  .sn-mobile-nav-item {
    display: grid;
    place-items: center;
    gap: .1rem;
    min-width: 3.1rem;
    min-height: 2.9rem;
    color: var(--ink-faint);
    font-size: .65rem;
    font-weight: 750;
  }
  .sn-mobile-nav-item.is-active {
    color: var(--primary);
  }
  .sn-mobile-drawer {
    position: fixed;
    z-index: 55;
    inset: .5rem 2.6rem .5rem .5rem;
    display: block;
    padding: 1rem;
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    background: var(--surface);
    box-shadow: var(--shadow);
  }
  .sn-mobile-drawer[hidden] {
    display: none;
  }
  .sn-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .75rem;
    font-family: var(--display);
    font-size: 1.4rem;
  }
  .sn-page-header, .section-heading, .feed-header, .panel-heading {
    align-items: flex-start;
    flex-direction: column;
  }
  .sn-page-header h1, .section-heading h2, .feed-header h2, .panel-heading h2 {
    font-size: 1.75rem;
  }
  .right-rail {
    grid-template-columns: 1fr;
  }
  .auth-page {
    padding: 1rem;
  }
  .auth-card {
    padding: 1.5rem;
  }
  .auth-columns, .messages-panel {
    grid-template-columns: 1fr;
  }
  .conversation-list {
    max-height: 16rem;
    overflow: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .thread {
    min-height: 28rem;
  }
  .profile-cover, .community-hero {
    align-items: flex-start;
    flex-direction: column;
    min-height: 0;
  }
  .profile-tabs {
    padding: .3rem;
  }
  .photo-grid, .album-grid, .people-grid, .community-list, .album-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .comment-form, .message-form, .photo-comment-form {
    align-items: stretch;
    flex-wrap: wrap;
  }
  .comment-form .field, .message-form .field, .photo-comment-form .field {
    min-width: 100%;
  }
  .admin-member-row {
    grid-template-columns: 2rem minmax(0, 1fr);
  }
  .admin-member-row select, .admin-member-row button {
    grid-column: 2;
  }
  .admin-audit article {
    grid-template-columns: 1fr;
  }
  .report-row, .admin-summary {
    align-items: stretch;
    flex-direction: column;
  }
  .story-time {
    width: 100%;
    margin-right: 0;
  }
  .reaction-button {
    min-height: 2.35rem;
  }
  .profile-avatar-wrap, .profile-avatar-photo {
    width: 5.5rem;
    height: 5.5rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}
:root {
  --canvas: #f6f7f9;
  --canvas-deep: #eef1f5;
  --surface: #ffffff;
  --surface-soft: #f7f9fc;
  --surface-strong: #eaf0f7;
  --ink: #172033;
  --ink-soft: #4b5a70;
  --ink-faint: #738198;
  --line: #dfe5ee;
  --line-strong: #c8d2df;
  --primary: #2563eb;
  --primary-hover: #1d4ed8;
  --primary-contrast: #ffffff;
  --accent: #2563eb;
  --accent-soft: #e7efff;
  --positive: #15803d;
  --warning: #a16207;
  --danger: #dc2626;
  --danger-soft: #fee2e2;
  --shadow-sm: 0 1px 2px rgb(15 23 42 / 5%);
  --shadow: 0 10px 28px rgb(15 23 42 / 8%);
  --radius-sm: .5rem;
  --radius: .75rem;
  --radius-lg: 1rem;
  --display: Avenir Next, Avenir, Helvetica Neue, sans-serif;
  --body: Avenir Next, Avenir, Helvetica Neue, sans-serif;
}
:root[data-theme="dark"] {
  --canvas: #111827;
  --canvas-deep: #0b1220;
  --surface: #182235;
  --surface-soft: #202c40;
  --surface-strong: #2a3850;
  --ink: #f8fafc;
  --ink-soft: #cbd5e1;
  --ink-faint: #94a3b8;
  --line: #334155;
  --line-strong: #475569;
  --primary: #60a5fa;
  --primary-hover: #93c5fd;
  --primary-contrast: #0f172a;
  --accent: #60a5fa;
  --accent-soft: #203d67;
  --danger: #f87171;
  --danger-soft: #4b252d;
}
body {
  background: var(--canvas);
  font-size: 14px;
  line-height: 1.45;
}
h1, h2, h3, .auth-brand, .sn-brand {
  font-family: var(--body);
  letter-spacing: -.02em;
}
.sn-header {
  height: 4rem;
  background: var(--surface);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--surface) 94%, transparent);
  }
}
.sn-brand {
  font-size: 1.2rem;
  letter-spacing: -.04em;
}
.sn-brand-mark {
  display: none;
}
.sn-search {
  max-width: 25rem;
  padding: .48rem .7rem;
  border-radius: .5rem;
}
.sn-rail {
  left: max(1rem, calc((100vw - 1440px) / 2));
  width: 12rem;
  padding: 1rem 0;
}
.sn-nav-item {
  min-height: 2.45rem;
  padding: .45rem .65rem;
  border-radius: .5rem;
  font-size: .86rem;
}
.sn-nav-section {
  margin: 1rem .65rem .25rem;
  font-size: .64rem;
}
.sn-main {
  width: min(calc(100% - 14rem), 76rem);
  margin-left: max(14rem, calc((100vw - 1440px) / 2 + 13rem));
  padding: 1.25rem;
}
.panel, .rail-box, .sn-surface, .profile-info, .photos-panel, .edit-panel, .wall-section, .library-panel {
  border-radius: var(--radius);
}
.panel, .rail-box, .sn-pad-md, .profile-info, .photos-panel, .edit-panel, .wall-section, .library-panel {
  padding: 1rem;
}
.page-grid {
  grid-template-columns: 12rem minmax(0, 1fr) 14rem;
  gap: 1rem;
}
.main-column, .feed-column {
  min-width: 0;
}
.profile-card {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .25rem .1rem .9rem;
  border-bottom: 1px solid var(--line);
}
.profile-card h1 {
  margin: 0;
  font-size: .94rem;
}
.profile-card > div {
  min-width: 0;
}
.profile-card > div > a {
  color: var(--ink-soft);
  font-size: .78rem;
}
.side-nav {
  display: grid;
  gap: .1rem;
  padding: .65rem 0;
}
.side-nav a {
  display: flex;
  align-items: center;
  gap: .4rem;
  min-height: 2rem;
  padding: .3rem .1rem;
  color: var(--ink-soft);
  font-size: .8rem;
  font-weight: 650;
}
.side-nav a:hover, .side-nav a.active {
  color: var(--primary);
}
.side-nav a span {
  width: 1rem;
  color: var(--primary);
  text-align: center;
}
.side-nav b {
  display: inline-grid;
  place-items: center;
  min-width: 1.1rem;
  height: 1.1rem;
  margin-left: auto;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--primary);
  font-size: .65rem;
}
.rail-footer {
  padding-top: .7rem;
  border-top: 1px solid var(--line);
  color: var(--ink-faint);
  font-size: .75rem;
}
.composer-tabs {
  display: flex;
  gap: .9rem;
  padding-bottom: .65rem;
  border-bottom: 1px solid var(--line);
}
.composer-tab {
  color: var(--ink-faint);
  font-size: .78rem;
  font-weight: 700;
}
.composer-tab.selected {
  color: var(--primary);
}
.status-form {
  display: grid;
  gap: .65rem;
}
.composer-body {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  margin: .65rem 0;
}
.sn-composer-input {
  flex: 1;
}
.story, .social-post-card {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
}
.story-content {
  min-width: 0;
  flex: 1;
}
.story-content > p:first-child {
  margin-top: 0;
}
.sn-page-header h1, .section-heading h2, .feed-header h2, .panel-heading h2, .sn-section-heading h2 {
  font-size: 1.35rem;
}
.feed-header h2 {
  font-size: 1.65rem;
}
.primary-button, .secondary-button, .secondary-join, .confirm, .sn-action, .danger-button {
  min-height: 2.25rem;
  padding: .45rem .75rem;
  border-radius: .5rem;
  font-size: .8rem;
}
.story-action {
  width: 2.15rem;
  height: 2.15rem;
}
.story-meta, .story-actions, .social-post-actions {
  margin-top: .7rem;
  padding-top: .6rem;
}
.profile-cover, .community-hero {
  min-height: 12rem;
  padding: 1.15rem;
  border-radius: var(--radius);
  background: linear-gradient(135deg, #1e3a8a, #2563eb);
}
.profile-title h1, .community-hero h1, .album-header h1, .photo-page-heading h1 {
  font-size: 2rem;
}
.auth-brand {
  font-size: 2.3rem;
}
.auth-card {
  max-width: 46rem;
  padding: 2rem;
  border-radius: 1rem;
}
.auth-page {
  background: var(--canvas);
}
@media (max-width: 1180px) {
  .sn-rail {
    left: 0;
  }
}
.sn-header {
  height: 3.25rem;
}
.sn-search {
  width: min(18rem, 32vw);
  max-width: none;
  height: 2.1rem;
  padding: .25rem .55rem;
  border-radius: .45rem;
  font-size: .82rem;
}
.sn-search input {
  min-height: 0;
  height: 1.3rem;
  padding: 0;
  font-size: inherit;
}
.sn-theme-switcher {
  padding: .1rem;
}
.sn-theme-switcher button {
  width: 1.45rem;
  height: 1.45rem;
}
.sn-theme-switcher {
  align-items: center;
  gap: .08rem;
  min-height: 2rem;
  padding: .18rem;
  background: var(--surface-soft);
}
.sn-theme-switcher button {
  display: grid;
  place-items: center;
  width: 1.6rem;
  height: 1.6rem;
  color: var(--ink-soft);
}
.sn-theme-switcher button svg {
  display: block;
  width: 1rem !important;
  height: 1rem !important;
  stroke-width: 2.4;
}
.sn-theme-switcher button[data-theme-choice="light"] svg {
  color: #ca8a04;
}
.sn-theme-switcher button[data-theme-choice="dark"] svg {
  color: #4f46e5;
  fill: color-mix(in srgb, #4f46e5 15%, transparent);
}
:root[data-theme="dark"] .sn-theme-switcher button[data-theme-choice="dark"] svg {
  color: #c4b5fd;
}
.sn-theme-switcher button[aria-pressed="true"] {
  background: var(--primary);
  color: var(--primary-contrast);
}
.sn-theme-switcher button[aria-pressed="true"] svg {
  color: currentColor;
  fill: none;
}
.sn-header-actions > .sn-icon-button, .sn-notification-bell > .sn-icon-button {
  position: relative;
}
.sn-header-actions > .sn-icon-button > b, .sn-notification-bell > .sn-icon-button > b {
  position: absolute;
  top: -.2rem;
  right: -.18rem;
  display: grid;
  place-items: center;
  min-width: 1rem;
  height: 1rem;
  padding: 0 .2rem;
  border: 2px solid var(--surface);
  border-radius: 999px;
  background: var(--danger);
  color: #fff;
  font-size: .6rem;
  font-weight: 800;
  line-height: 1;
}
.sn-notification-bell {
  position: relative;
  flex: 0 0 auto;
}
.sn-notification-bell > summary {
  display: grid;
  list-style: none;
}
.sn-notification-bell > summary::-webkit-details-marker {
  display: none;
}
.sn-notification-bell > summary::marker {
  content: "";
}
.notification-popover {
  position: absolute;
  top: calc(100% + .5rem);
  right: 0;
  width: min(21rem, calc(100vw - 1.5rem));
  max-height: min(32rem, calc(100vh - 5rem));
  overflow: auto;
  padding: 0;
}
.notification-popover-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .75rem .85rem;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: .82rem;
}
.notification-preview {
  display: grid;
  gap: .15rem;
  padding: .7rem .85rem;
  border-bottom: 1px solid var(--line);
  color: var(--ink-soft);
  font-size: .8rem;
}
.notification-preview:hover {
  background: var(--surface-soft);
}
.notification-preview small, .notification-popover-empty {
  color: var(--ink-faint);
  font-size: .72rem;
}
.notification-popover-empty {
  margin: 0;
  padding: 1rem .85rem;
}
.sn-team-badge {
  display: inline-grid;
  place-items: center;
  width: 1.15rem;
  height: 1.15rem;
  padding: 0;
  border-radius: 50%;
  background: transparent;
  color: #2563eb;
}
.sn-team-badge.is-administrator {
  color: #dc2626;
}
.sn-team-badge.is-team, .sn-team-badge.is-moderator {
  color: #2563eb;
}
.sn-team-badge .hero-user {
  width: .85rem;
  height: .85rem;
}
.post-reactions, .reaction-button {
  display: none !important;
}
.sn-header-actions > .sn-icon-button, .sn-icon-button {
  min-width: 2rem;
  min-height: 2rem;
  padding: .3rem;
}
.sn-rail {
  top: 3.25rem;
}
.sn-main {
  min-height: calc(100vh - 3.25rem);
}
@media (max-width: 640px) {
  .sn-header {
    height: 3.25rem;
  }
  .sn-search {
    width: auto;
    height: 2rem;
  }
}
.feed > .story, .feed > .social-post-card {
  display: grid !important;
  grid-template-columns: 2.8rem minmax(0, 1fr);
  align-content: start;
  align-items: start;
  gap: .7rem;
}
.feed > .story > .story-avatar-link, .feed > .social-post-card > .story-avatar-link {
  width: 2.8rem;
  height: 2.8rem;
}
.feed > .story > .story-content, .feed > .social-post-card > .story-content {
  display: block !important;
  min-width: 0;
  align-self: start;
}
.feed > .story .story-content > p, .feed > .social-post-card .story-content > p {
  display: block;
  margin: 0;
  line-height: 1.5;
  white-space: normal;
}
.feed > .story .story-content > * + *, .feed > .social-post-card .story-content > * + * {
  margin-top: .6rem;
}
.feed > .story .story-meta, .feed > .social-post-card .story-meta {
  min-height: 2.35rem;
}
.feed > .story .post-author-line, .feed > .social-post-card .post-author-line {
  display: flex;
  align-items: center;
  gap: .35rem;
  min-height: 1.5rem;
  color: var(--ink);
  font-size: .9rem;
  font-weight: 750;
}
.feed > .story .post-author-line .sn-profile-badges, .feed > .social-post-card .post-author-line .sn-profile-badges {
  margin-left: 0;
}
.feed > .story .post-body, .feed > .social-post-card .post-body {
  margin: .3rem 0 0 !important;
  color: var(--ink);
  line-height: 1.5;
  white-space: normal !important;
}
.post-page .story, .group-post.social-post-card {
  display: grid;
  grid-template-columns: 2.8rem minmax(0, 1fr);
  align-items: start;
  gap: .7rem;
}
.post-page .story-content, .group-post .group-post-body {
  min-width: 0;
}
.post-page .post-author-line, .group-post .post-author-line {
  display: flex;
  align-items: center;
  gap: .35rem;
  min-height: 1.5rem;
  font-size: .9rem;
  font-weight: 750;
}
.post-page .post-author-line .sn-profile-badges, .group-post .post-author-line .sn-profile-badges {
  margin-left: 0;
}
.post-page .post-body, .group-post .post-body {
  margin: .3rem 0 0 !important;
  line-height: 1.5;
  white-space: normal !important;
}
.post-time {
  display: block;
  margin-top: .3rem;
  color: var(--ink-faint);
  font-size: .72rem;
}
.comment, .photo-comment {
  display: grid;
  grid-template-columns: 1.5rem minmax(0, 1fr);
  align-items: start;
  gap: .5rem;
  margin-top: .65rem;
}
.comment > .comment-copy, .photo-comment > .comment-copy {
  min-width: 0;
  padding: .5rem .65rem;
  border-radius: .55rem;
  background: var(--surface-soft);
}
.comment-author-line {
  display: flex;
  align-items: center;
  gap: .3rem;
  min-height: 1.2rem;
  color: var(--ink);
  font-size: .78rem;
  font-weight: 750;
}
.comment-author-line .sn-profile-badges {
  margin-left: 0;
}
.comment-body {
  margin: .12rem 0 0 !important;
  color: var(--ink-soft);
  font-size: .82rem;
  line-height: 1.4;
  white-space: normal !important;
}
.comment-copy .comment-delete, .comment-copy .comment-anchor {
  margin-top: .2rem;
  margin-right: .35rem;
  font-size: .72rem;
}
.wall-section .comment, .group-post .comment {
  display: flex;
  gap: .5rem;
}
.wall-section .comment > .comment-copy, .group-post .comment > .comment-copy {
  flex: 1;
}
.composer {
  padding: .85rem !important;
  border-color: var(--line);
}
.composer-tabs {
  gap: .3rem;
  padding-bottom: .6rem;
}
.composer-tab {
  padding: .35rem .55rem;
  border-radius: .4rem;
  font-size: .8rem;
}
.composer-tab.selected {
  background: var(--accent-soft);
}
.composer-body {
  gap: .55rem;
  margin: .65rem 0;
}
.composer-body > .sn-avatar {
  margin-top: .25rem;
}
.sn-composer-input {
  min-height: 4.8rem;
  padding: .15rem .6rem .1rem;
  border: 1px solid var(--line);
  border-radius: .6rem;
  background: var(--surface-soft);
}
.sn-composer-input:focus-within {
  border-color: var(--primary);
  background: var(--surface);
  box-shadow: 0 0 0 3px var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
  }
}
.sn-composer-input textarea {
  min-height: 3.4rem;
  height: 3.4rem;
  padding: .35rem 4rem 1.35rem 0;
  color: var(--ink);
  font-size: .92rem;
  line-height: 1.4;
}
.sn-composer-input textarea::placeholder {
  color: var(--ink-faint);
}
.sn-composer-emoji {
  position: absolute;
  bottom: .2rem;
  left: .35rem;
  gap: .05rem;
  margin: 0;
}
.sn-composer-emoji button {
  width: 1.55rem;
  height: 1.45rem;
  font-size: .9rem;
}
.sn-composer-count {
  right: .5rem;
  bottom: .35rem;
}
.composer-actions {
  justify-content: flex-end;
  padding-top: .6rem;
  border-top: 1px solid var(--line);
}
.composer-audience select {
  min-height: 2.15rem;
  width: auto;
  padding: .35rem 1.8rem .35rem .55rem;
  font-size: .78rem;
  font-weight: 700;
}
.composer-actions .primary-button {
  min-width: 4.5rem;
}
.directory-search form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: .5rem;
  align-items: end;
}
.directory-search form .field {
  margin: 0;
}
.directory-search-hint {
  grid-column: 1;
  margin: .3rem 0 0;
  color: var(--ink-faint);
  font-size: .72rem;
}
.directory-search-submit {
  grid-column: 2;
  grid-row: 1;
  border: 1px solid var(--line);
  border-radius: .5rem;
  background: var(--surface-soft);
  color: var(--primary);
}
.directory-search-submit:hover {
  border-color: var(--primary);
  background: var(--accent-soft);
}
.directory-search form.phx-change-loading .directory-search-submit {
  opacity: .55;
}
.community-page {
  display: flex;
  max-width: 70rem;
  margin: 0 auto;
  flex-direction: column;
  gap: 1rem;
}
.community-page > .back-link {
  order: 0;
  align-self: flex-start;
  color: var(--ink-soft);
  font-size: .78rem;
  font-weight: 700;
}
.community-page > .community-hero {
  order: 1;
}
.community-page > .group-composer {
  order: 2;
}
.community-page > .group-wall {
  order: 3;
}
.community-page > #group-polls {
  order: 4;
}
.community-page > #group-activity {
  order: 5;
}
.community-page > #group-members {
  order: 6;
}
.community-page > .section-heading {
  margin: 0;
  padding: .2rem 0;
}
.community-page > .section-heading h1 {
  margin: .15rem 0 0;
  color: var(--ink);
  font-family: var(--body);
  font-size: 1.45rem;
  letter-spacing: -.025em;
}
.community-page > .section-heading > span {
  align-self: flex-end;
  color: var(--ink-faint);
  font-size: .78rem;
}
.community-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 0;
  padding: 1.15rem !important;
  border: 1px solid #315fb7;
  border-radius: .85rem;
  background: linear-gradient(130deg, #173a7a, #2563eb);
}
.community-hero > .eyebrow, .community-hero > h1, .community-hero > p, .community-hero > small {
  grid-column: 1;
}
.community-hero h1 {
  margin: .2rem 0 0;
  font-family: var(--body);
  font-size: 1.55rem;
  letter-spacing: -.025em;
}
.community-hero p {
  max-width: 42rem;
  margin: .35rem 0;
  font-size: .87rem;
  line-height: 1.4;
}
.community-hero small {
  color: rgb(255 255 255 / 75%);
  font-size: .72rem;
}
.community-actions {
  grid-column: 2;
  grid-row: 1 / span 4;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .4rem;
  flex-wrap: wrap;
}
.community-actions .link-button {
  color: rgb(255 255 255 / 85%);
  font-size: .73rem;
}
.community-actions .group-delete {
  color: #fecaca;
}
.community-hero .community-create {
  grid-column: 1 / -1;
  margin-top: .8rem;
  padding-top: .8rem;
  border-top: 1px solid rgb(255 255 255 / 22%);
}
.community-page > .community-create {
  max-width: 42rem;
  padding: .9rem !important;
}
.community-page > .community-create .panel-heading {
  margin-bottom: .7rem;
}
.community-page > .community-create .panel-heading h2 {
  margin: 0;
  font-size: 1rem;
}
.community-page > .community-create .panel-heading p {
  margin: .2rem 0 0;
  color: var(--ink-faint);
  font-size: .76rem;
}
.group-composer {
  padding: .75rem !important;
}
.group-composer form {
  display: grid;
  gap: .55rem;
}
.group-composer .primary-button {
  justify-self: end;
  min-width: 4.5rem;
}
.group-wall {
  display: grid;
  gap: .75rem;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.group-wall > .group-post {
  margin: 0;
  padding: .85rem !important;
  border-radius: var(--radius);
  background: var(--surface);
}
.group-post-actions {
  margin-top: .65rem;
  padding-top: .55rem;
  font-size: .74rem;
}
#group-polls, #group-activity, #group-members {
  padding: .85rem !important;
}
#group-polls > h2, #group-activity > h2 {
  margin: 0 0 .65rem;
  font-family: var(--body);
  font-size: .95rem;
  letter-spacing: 0;
}
#group-polls .community-create, #group-activity .community-create {
  max-width: 38rem;
}
.poll-card {
  display: grid;
  gap: .35rem;
  margin-top: .75rem;
  padding: .75rem;
  border: 1px solid var(--line);
  border-radius: .6rem;
  background: var(--surface-soft);
}
.poll-card h3, .poll-card p {
  margin: 0;
}
.poll-card h3 {
  font-size: .85rem;
}
.poll-card p {
  color: var(--ink-faint);
  font-size: .72rem;
}
.poll-card .secondary-button {
  justify-content: flex-start;
  min-height: 2rem;
  font-size: .76rem;
}
.group-member-list, .group-bans {
  display: grid;
  gap: .35rem;
}
.group-member-list article, .group-bans article {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .5rem 0;
  border-bottom: 1px solid var(--line);
}
.group-member-list em {
  margin-left: auto;
  color: var(--ink-faint);
  font-size: .72rem;
  font-style: normal;
}
.group-member-list .link-button, .group-bans .link-button {
  font-size: .72rem;
}
.community-list {
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: .75rem;
}
.community-card {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-height: 7rem;
  padding: .9rem;
  border-radius: .65rem;
}
.community-monogram {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: .6rem;
  background: var(--accent-soft);
  color: var(--primary);
  font-size: 1.1rem;
  font-weight: 800;
}
.community-card small, .community-card em {
  display: block;
  margin-top: .2rem;
  color: var(--ink-faint);
  font-size: .73rem;
  font-style: normal;
}
@media (max-width: 760px) {
  .community-hero {
    grid-template-columns: 1fr;
  }
  .community-actions {
    grid-column: 1;
    grid-row: auto;
    justify-content: flex-start;
    margin-top: .65rem;
  }
  .community-page > .section-heading {
    align-items: flex-start;
  }
  .community-page > .section-heading > span {
    align-self: auto;
  }
  .community-page > #group-members {
    order: 5;
  }
  .community-page > #group-activity {
    order: 6;
  }
}
.messages-page {
  display: grid;
  gap: .8rem;
  max-width: 72rem;
  margin: 0 auto;
}
.messages-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  padding: .2rem 0;
}
.messages-toolbar h1 {
  margin: .12rem 0 0;
  color: var(--ink);
  font-family: var(--body);
  font-size: 1.5rem;
  letter-spacing: -.03em;
}
.message-view-tabs {
  display: flex;
  align-items: center;
  gap: .25rem;
  flex-wrap: wrap;
}
.message-view-tabs .link-button, .message-view-tabs a {
  min-height: 2rem;
  padding: .38rem .55rem;
  border-radius: .48rem;
  color: var(--ink-soft);
  font-size: .76rem;
  font-weight: 700;
}
.message-view-tabs .link-button.is-active {
  background: var(--accent-soft);
  color: var(--primary);
}
.message-view-tabs a {
  color: var(--primary);
}
.message-view-tabs a:hover {
  background: var(--accent-soft);
}
.messages-panel {
  grid-template-columns: minmax(15.5rem, .54fr) minmax(0, 1.46fr);
  min-height: min(42rem, calc(100vh - 9.5rem));
  border-radius: .8rem;
  box-shadow: var(--shadow-sm);
}
.conversation-list {
  padding: .35rem;
  background: var(--surface-soft);
}
.conversation-preview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .1rem .5rem;
  margin: 0;
  padding: .65rem;
  border: 1px solid transparent;
  border-bottom: 0;
  border-radius: .58rem;
}
.conversation-preview + .conversation-preview {
  margin-top: .15rem;
}
.conversation-preview:hover {
  background: var(--surface);
}
.conversation-preview.selected {
  border-color: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in srgb, var(--primary) 20%, var(--line));
  }
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.conversation-preview .profile-identity {
  grid-column: 1;
  min-width: 0;
}
.conversation-preview .profile-identity .profile-name {
  font-size: .8rem;
}
.conversation-open {
  grid-column: 1;
  min-width: 0;
  overflow: hidden;
  color: var(--ink-faint);
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.conversation-preview-copy {
  font-size: .72rem;
}
.conversation-preview em {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  min-width: 1.1rem;
  padding: .08rem .28rem;
  border-radius: 999px;
  background: var(--primary);
  color: white;
  font-size: .66rem;
  font-style: normal;
  font-weight: 800;
  text-align: center;
}
.conversation-list > .empty-state {
  margin: .45rem;
  padding: 1.5rem .75rem;
  font-size: .8rem;
  text-align: left;
}
.thread {
  min-height: 0;
  background: var(--surface);
}
.thread-heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .6rem;
  padding: .75rem .9rem;
}
.thread-heading h1 {
  min-width: 0;
  font-size: .95rem;
}
.thread-heading h1 a {
  color: var(--ink);
}
.thread-heading .conversation-presence {
  grid-column: 2;
  margin-top: -.45rem;
  color: #159669;
  font-size: .68rem;
  font-weight: 700;
}
.thread-heading #conversation-archive-toggle {
  grid-column: 3;
  grid-row: 1 / span 2;
  padding: .3rem;
  color: var(--ink-faint);
  font-size: .71rem;
}
.message-search-form {
  position: relative;
  z-index: 3;
  padding: .45rem .85rem;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}
.message-search-form .field {
  margin: 0;
}
.message-search-form input {
  min-height: 2rem;
  padding: .38rem .65rem;
  font-size: .76rem;
}
.message-search-form label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.message-search-results {
  position: absolute;
  z-index: 6;
  right: .9rem;
  left: calc(30% + .9rem);
  max-height: 14rem;
  overflow: auto;
  padding: .45rem;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.message-search-results p {
  margin: .25rem .35rem .4rem;
  color: var(--ink-faint);
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.message-search-results a {
  display: grid;
  gap: .15rem;
  padding: .45rem;
  border-radius: .35rem;
  color: var(--ink-soft);
  font-size: .76rem;
}
.message-search-results a:hover {
  background: var(--surface-soft);
}
.message-search-results small {
  color: var(--ink-faint);
  font-size: .66rem;
}
.thread-messages {
  display: flex;
  flex-direction: column;
  gap: .18rem;
  padding: .9rem;
  overflow-y: auto;
  background: linear-gradient(180deg, var(--surface-soft), transparent 16rem);
  @supports (color: color-mix(in lab, red, red)) {
    background: linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 42%, transparent), transparent 16rem);
  }
}
.message-bubble {
  width: fit-content;
  max-width: min(74%, 34rem);
  margin: .1rem 0;
  padding: .55rem .7rem;
  border-radius: .72rem .72rem .72rem .18rem;
  box-shadow: none;
  font-size: .84rem;
  line-height: 1.38;
}
.message-bubble.mine {
  border-color: transparent;
  border-radius: .72rem .72rem .18rem .72rem;
  background: var(--primary);
  color: white;
}
.message-bubble .message-copy {
  margin: 0;
}
.message-bubble > small, .message-meta {
  display: block;
  margin-top: .22rem;
  color: var(--ink-faint);
  font-size: .64rem;
}
.message-bubble.mine .message-meta {
  color: rgb(255 255 255 / 72%);
}
.message-actions {
  display: flex;
  align-items: center;
  gap: .2rem;
  margin-top: .35rem;
}
.message-bubble .message-actions {
  opacity: 0;
  transition: opacity .16s ease;
}
.message-bubble:hover .message-actions, .message-bubble:focus-within .message-actions {
  opacity: 1;
}
.message-reactions {
  gap: .15rem;
}
.message-reaction {
  min-height: 1.45rem;
  padding: .08rem .25rem;
  border-color: transparent;
  background: rgb(255 255 255 / 15%);
  color: inherit;
  font-size: .7rem;
}
.message-bubble:not(.mine) .message-reaction {
  background: var(--surface);
}
.message-actions .link-button {
  min-height: 1.45rem;
  padding: .12rem .25rem;
  color: inherit;
  font-size: .64rem;
}
.message-report {
  color: var(--danger) !important;
}
.message-delete {
  color: inherit !important;
}
.message-reply-preview {
  display: block;
  max-width: 20rem;
  margin: -.05rem 0 .4rem;
  padding: .35rem .45rem;
  overflow: hidden;
  border-left: 2px solid currentColor;
  border-radius: .2rem;
  background: rgb(255 255 255 / 11%);
  color: inherit;
  font-size: .7rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.message-bubble:not(.mine) .message-reply-preview {
  background: var(--surface);
}
.message-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: .5rem;
  margin: 0;
  padding: .65rem .85rem;
  background: var(--surface);
}
.message-form .field {
  min-width: 0;
  margin: 0;
}
.message-form input {
  min-height: 2.2rem;
  padding: .45rem .65rem;
  font-size: .82rem;
}
.message-form .primary-button {
  min-height: 2.2rem;
  padding: .45rem .75rem;
}
.typing-indicator, .message-replying {
  margin: 0;
  padding: .35rem .85rem;
  background: var(--surface);
  color: var(--ink-faint);
  font-size: .7rem;
}
.thread-empty {
  display: grid;
  place-content: center;
  min-height: 18rem;
  padding: 2rem;
  color: var(--ink-faint);
  text-align: center;
}
.thread-empty strong {
  color: var(--ink-soft);
  font-size: .95rem;
}
.thread-empty p {
  margin: .35rem 0 0;
  font-size: .78rem;
}
#group-conversation {
  display: flex;
  flex-direction: column;
  min-height: min(42rem, calc(100vh - 9.5rem));
}
.messages-panel#group-conversation .thread-heading {
  grid-template-columns: minmax(0, 1fr) auto;
}
.messages-panel#group-conversation .thread-heading > div {
  min-width: 0;
}
.messages-panel#group-conversation .thread-heading p {
  display: flex;
  gap: .3rem;
  margin: .18rem 0 0;
  overflow: hidden;
  color: var(--ink-faint);
  font-size: .7rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.messages-panel#group-conversation .thread-heading span + span::before {
  content: "·";
  margin-right: .3rem;
}
.messages-panel#group-conversation .thread-messages {
  flex: 1;
}
.messages-panel#group-conversation .message-bubble > strong {
  display: block;
  margin-bottom: .16rem;
  font-size: .69rem;
}
.messages-panel#group-conversation .message-bubble.mine > strong {
  color: rgb(255 255 255 / 78%);
}
@media (max-width: 760px) {
  .messages-toolbar {
    align-items: flex-start;
    flex-direction: column;
    gap: .5rem;
  }
  .messages-panel {
    min-height: auto;
  }
  .conversation-list {
    max-height: 17rem;
  }
  .message-search-results {
    right: .75rem;
    left: .75rem;
  }
  .thread-messages {
    min-height: 21rem;
    max-height: 50vh;
  }
  .message-bubble {
    max-width: 88%;
  }
  .message-bubble .message-actions {
    opacity: 1;
  }
  .message-form {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .message-form .primary-button {
    min-width: 0;
  }
}
.conversation-rail {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 0;
  background: var(--surface-soft);
  border-right: 1px solid var(--line);
}
.conversation-rail-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: .8rem .85rem .7rem;
  border-bottom: 1px solid var(--line);
}
.conversation-rail-heading .eyebrow {
  font-size: .58rem;
}
.conversation-rail-heading h2 {
  margin: .12rem 0 0;
  color: var(--ink);
  font-family: var(--body);
  font-size: .9rem;
  letter-spacing: -.015em;
}
.conversation-new-link {
  display: inline-grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  border: 1px solid var(--line);
  border-radius: .48rem;
  background: var(--surface);
  color: var(--primary);
  transition: transform .16s ease, background .16s ease;
}
.conversation-new-link:hover {
  transform: translateY(-1px);
  background: var(--accent-soft);
}
.conversation-rail .conversation-list {
  min-height: 0;
  padding: .35rem;
  overflow-y: auto;
  border: 0;
  background: transparent;
}
.conversation-rail .conversation-preview {
  position: relative;
}
.conversation-rail .conversation-preview::before {
  position: absolute;
  top: .55rem;
  bottom: .55rem;
  left: -.36rem;
  width: 2px;
  border-radius: 99px;
  background: var(--primary);
  content: "";
  opacity: 0;
  transform: scaleY(.45);
  transition: opacity .16s ease, transform .16s ease;
}
.conversation-rail .conversation-preview.selected::before {
  opacity: 1;
  transform: scaleY(1);
}
.thread-heading #conversation-archive-toggle {
  display: inline-grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: .45rem;
  background: var(--surface-soft);
  color: var(--ink-soft);
}
.thread-heading #conversation-archive-toggle:hover {
  border-color: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in srgb, var(--primary) 34%, var(--line));
  }
  background: var(--accent-soft);
  color: var(--primary);
}
.message-form .primary-button {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
}
@media (max-width: 760px) {
  .conversation-rail {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .conversation-rail .conversation-list {
    max-height: 13.25rem;
  }
  .conversation-rail-heading {
    padding: .65rem .75rem;
  }
}
.profile-image-upload {
  display: grid;
  gap: .32rem;
  padding: .7rem;
  border: 1px dashed var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    border: 1px dashed color-mix(in srgb, var(--primary) 32%, var(--line));
  }
  border-radius: .6rem;
  background: var(--surface-soft);
}
.profile-image-upload p {
  margin: 0;
  color: var(--ink-faint);
  font-size: .72rem;
}
.profile-image-upload p:first-child {
  color: var(--ink-soft);
  font-size: .78rem;
  font-weight: 750;
}
.profile-image-upload input[type="file"] {
  width: 100%;
  min-height: 2.2rem;
  padding: .3rem;
  border: 1px solid var(--line);
  border-radius: .42rem;
  background: var(--surface);
  color: var(--ink-soft);
  font-size: .74rem;
}
.profile-image-upload input[type="file"]::file-selector-button {
  margin-right: .55rem;
  padding: .3rem .55rem;
  border: 0;
  border-radius: .28rem;
  background: var(--accent-soft);
  color: var(--primary);
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}
.profile-cover-upload {
  grid-template-columns: minmax(9rem, .7fr) minmax(0, 1.3fr);
  align-items: stretch;
  gap: .75rem;
  padding: .5rem;
  border-style: solid;
}
.profile-cover-upload-preview {
  position: relative;
  display: grid;
  min-height: 7.5rem;
  overflow: hidden;
  place-items: center;
  border-radius: .42rem;
  background: linear-gradient(135deg, #1e3a8a, #60a5fa);
  color: rgb(255 255 255 / 80%);
}
.profile-cover-upload-preview::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgb(5 20 50 / 35%));
  content: "";
  pointer-events: none;
}
.profile-cover-upload-preview img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.profile-cover-upload-preview > span {
  position: relative;
  z-index: 1;
}
.profile-cover-upload-copy {
  display: grid;
  align-content: center;
  gap: .32rem;
  min-width: 0;
  padding: .15rem .1rem .15rem 0;
}
.profile-cover-upload-copy p:nth-child(2) {
  max-width: 27rem;
}
.profile-cover-upload-copy input[type="file"] {
  margin-top: .15rem;
}
.profile-upload-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  color: var(--primary);
  font-size: .7rem;
  font-weight: 700;
}
.profile-upload-status span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.profile-upload-error {
  color: var(--danger) !important;
  font-weight: 700;
}
@media (max-width: 560px) {
  .profile-cover-upload {
    grid-template-columns: 1fr;
  }
  .profile-cover-upload-preview {
    min-height: 8.5rem;
  }
  .profile-cover-upload-copy {
    padding: .1rem;
  }
}
.profile-page {
  display: grid;
  gap: 1rem;
  max-width: 70rem;
  margin: 0 auto;
}
.profile-cover {
  display: grid;
  grid-template-columns: 5.5rem minmax(0, 1fr) auto;
  align-items: end;
  min-height: 11.5rem;
  padding: 1.15rem;
  border: 1px solid #315fb7;
  border-radius: .85rem;
  background: linear-gradient(130deg, #173a7a, #2563eb 58%, #60a5fa);
}
.profile-cover[data-cover-editable="true"] {
  cursor: ns-resize;
  touch-action: none;
}
.profile-cover.is-repositioning {
  user-select: none;
}
.profile-cover-upload-form {
  position: absolute;
  z-index: 4;
  top: .75rem;
  right: .75rem;
}
.profile-cover-upload-trigger {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: 2rem;
  padding: .4rem .6rem;
  border: 1px solid rgb(255 255 255 / 48%);
  border-radius: .45rem;
  background: rgb(12 27 62 / 66%);
  color: white;
  font-size: .73rem;
  font-weight: 750;
  cursor: pointer;
  backdrop-filter: blur(8px);
}
.profile-cover-upload-trigger:hover {
  background: rgb(12 27 62 / 82%);
}
.profile-cover-upload-trigger input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.profile-cover-reposition-hint {
  position: absolute;
  z-index: 4;
  top: .8rem;
  left: 50%;
  margin: 0;
  padding: .35rem .55rem;
  border-radius: 999px;
  background: rgb(12 27 62 / 70%);
  color: white;
  font-size: .68rem;
  font-weight: 700;
  transform: translateX(-50%);
  pointer-events: none;
}
.profile-cover-image {
  object-position: center 50%;
}
.profile-cover-edit-note {
  margin: 0;
  padding: .6rem .7rem;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: var(--surface-soft);
  color: var(--ink-faint);
  font-size: .75rem;
}
+#profile-cover-image.cover-position-0 {
  object-position: center 0%;
}
#profile-cover-image.cover-position-1 {
  object-position: center 1%;
}
#profile-cover-image.cover-position-2 {
  object-position: center 2%;
}
#profile-cover-image.cover-position-3 {
  object-position: center 3%;
}
#profile-cover-image.cover-position-4 {
  object-position: center 4%;
}
#profile-cover-image.cover-position-5 {
  object-position: center 5%;
}
#profile-cover-image.cover-position-6 {
  object-position: center 6%;
}
#profile-cover-image.cover-position-7 {
  object-position: center 7%;
}
#profile-cover-image.cover-position-8 {
  object-position: center 8%;
}
#profile-cover-image.cover-position-9 {
  object-position: center 9%;
}
#profile-cover-image.cover-position-10 {
  object-position: center 10%;
}
#profile-cover-image.cover-position-11 {
  object-position: center 11%;
}
#profile-cover-image.cover-position-12 {
  object-position: center 12%;
}
#profile-cover-image.cover-position-13 {
  object-position: center 13%;
}
#profile-cover-image.cover-position-14 {
  object-position: center 14%;
}
#profile-cover-image.cover-position-15 {
  object-position: center 15%;
}
#profile-cover-image.cover-position-16 {
  object-position: center 16%;
}
#profile-cover-image.cover-position-17 {
  object-position: center 17%;
}
#profile-cover-image.cover-position-18 {
  object-position: center 18%;
}
#profile-cover-image.cover-position-19 {
  object-position: center 19%;
}
#profile-cover-image.cover-position-20 {
  object-position: center 20%;
}
#profile-cover-image.cover-position-21 {
  object-position: center 21%;
}
#profile-cover-image.cover-position-22 {
  object-position: center 22%;
}
#profile-cover-image.cover-position-23 {
  object-position: center 23%;
}
#profile-cover-image.cover-position-24 {
  object-position: center 24%;
}
#profile-cover-image.cover-position-25 {
  object-position: center 25%;
}
#profile-cover-image.cover-position-26 {
  object-position: center 26%;
}
#profile-cover-image.cover-position-27 {
  object-position: center 27%;
}
#profile-cover-image.cover-position-28 {
  object-position: center 28%;
}
#profile-cover-image.cover-position-29 {
  object-position: center 29%;
}
#profile-cover-image.cover-position-30 {
  object-position: center 30%;
}
#profile-cover-image.cover-position-31 {
  object-position: center 31%;
}
#profile-cover-image.cover-position-32 {
  object-position: center 32%;
}
#profile-cover-image.cover-position-33 {
  object-position: center 33%;
}
#profile-cover-image.cover-position-34 {
  object-position: center 34%;
}
#profile-cover-image.cover-position-35 {
  object-position: center 35%;
}
#profile-cover-image.cover-position-36 {
  object-position: center 36%;
}
#profile-cover-image.cover-position-37 {
  object-position: center 37%;
}
#profile-cover-image.cover-position-38 {
  object-position: center 38%;
}
#profile-cover-image.cover-position-39 {
  object-position: center 39%;
}
#profile-cover-image.cover-position-40 {
  object-position: center 40%;
}
#profile-cover-image.cover-position-41 {
  object-position: center 41%;
}
#profile-cover-image.cover-position-42 {
  object-position: center 42%;
}
#profile-cover-image.cover-position-43 {
  object-position: center 43%;
}
#profile-cover-image.cover-position-44 {
  object-position: center 44%;
}
#profile-cover-image.cover-position-45 {
  object-position: center 45%;
}
#profile-cover-image.cover-position-46 {
  object-position: center 46%;
}
#profile-cover-image.cover-position-47 {
  object-position: center 47%;
}
#profile-cover-image.cover-position-48 {
  object-position: center 48%;
}
#profile-cover-image.cover-position-49 {
  object-position: center 49%;
}
#profile-cover-image.cover-position-50 {
  object-position: center 50%;
}
#profile-cover-image.cover-position-51 {
  object-position: center 51%;
}
#profile-cover-image.cover-position-52 {
  object-position: center 52%;
}
#profile-cover-image.cover-position-53 {
  object-position: center 53%;
}
#profile-cover-image.cover-position-54 {
  object-position: center 54%;
}
#profile-cover-image.cover-position-55 {
  object-position: center 55%;
}
#profile-cover-image.cover-position-56 {
  object-position: center 56%;
}
#profile-cover-image.cover-position-57 {
  object-position: center 57%;
}
#profile-cover-image.cover-position-58 {
  object-position: center 58%;
}
#profile-cover-image.cover-position-59 {
  object-position: center 59%;
}
#profile-cover-image.cover-position-60 {
  object-position: center 60%;
}
#profile-cover-image.cover-position-61 {
  object-position: center 61%;
}
#profile-cover-image.cover-position-62 {
  object-position: center 62%;
}
#profile-cover-image.cover-position-63 {
  object-position: center 63%;
}
#profile-cover-image.cover-position-64 {
  object-position: center 64%;
}
#profile-cover-image.cover-position-65 {
  object-position: center 65%;
}
#profile-cover-image.cover-position-66 {
  object-position: center 66%;
}
#profile-cover-image.cover-position-67 {
  object-position: center 67%;
}
#profile-cover-image.cover-position-68 {
  object-position: center 68%;
}
#profile-cover-image.cover-position-69 {
  object-position: center 69%;
}
#profile-cover-image.cover-position-70 {
  object-position: center 70%;
}
#profile-cover-image.cover-position-71 {
  object-position: center 71%;
}
#profile-cover-image.cover-position-72 {
  object-position: center 72%;
}
#profile-cover-image.cover-position-73 {
  object-position: center 73%;
}
#profile-cover-image.cover-position-74 {
  object-position: center 74%;
}
#profile-cover-image.cover-position-75 {
  object-position: center 75%;
}
#profile-cover-image.cover-position-76 {
  object-position: center 76%;
}
#profile-cover-image.cover-position-77 {
  object-position: center 77%;
}
#profile-cover-image.cover-position-78 {
  object-position: center 78%;
}
#profile-cover-image.cover-position-79 {
  object-position: center 79%;
}
#profile-cover-image.cover-position-80 {
  object-position: center 80%;
}
#profile-cover-image.cover-position-81 {
  object-position: center 81%;
}
#profile-cover-image.cover-position-82 {
  object-position: center 82%;
}
#profile-cover-image.cover-position-83 {
  object-position: center 83%;
}
#profile-cover-image.cover-position-84 {
  object-position: center 84%;
}
#profile-cover-image.cover-position-85 {
  object-position: center 85%;
}
#profile-cover-image.cover-position-86 {
  object-position: center 86%;
}
#profile-cover-image.cover-position-87 {
  object-position: center 87%;
}
#profile-cover-image.cover-position-88 {
  object-position: center 88%;
}
#profile-cover-image.cover-position-89 {
  object-position: center 89%;
}
#profile-cover-image.cover-position-90 {
  object-position: center 90%;
}
#profile-cover-image.cover-position-91 {
  object-position: center 91%;
}
#profile-cover-image.cover-position-92 {
  object-position: center 92%;
}
#profile-cover-image.cover-position-93 {
  object-position: center 93%;
}
#profile-cover-image.cover-position-94 {
  object-position: center 94%;
}
#profile-cover-image.cover-position-95 {
  object-position: center 95%;
}
#profile-cover-image.cover-position-96 {
  object-position: center 96%;
}
#profile-cover-image.cover-position-97 {
  object-position: center 97%;
}
#profile-cover-image.cover-position-98 {
  object-position: center 98%;
}
#profile-cover-image.cover-position-99 {
  object-position: center 99%;
}
#profile-cover-image.cover-position-100 {
  object-position: center 100%;
}
.profile-avatar-wrap, .profile-avatar-photo {
  width: 5.5rem;
  height: 5.5rem;
}
.profile-avatar-photo {
  border-width: 3px;
}
.profile-title {
  min-width: 0;
  padding-bottom: .1rem;
}
.profile-title h1 {
  font-size: 1.65rem;
  line-height: 1.15;
}
.profile-title p {
  max-width: 38rem;
  margin-top: .35rem;
  font-size: .88rem;
  line-height: 1.4;
}
.profile-title .profile-summary {
  display: flex;
  gap: .35rem;
  margin-top: .3rem;
  color: rgb(255 255 255 / 75%);
  font-size: .73rem;
  font-weight: 650;
}
.profile-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .4rem;
  flex-wrap: wrap;
}
.profile-actions .link-button {
  padding: .35rem .45rem;
  color: rgb(255 255 255 / 88%);
  font-size: .75rem;
}
.profile-actions .link-button:hover {
  color: #fff;
}
.profile-more-actions {
  position: relative;
}
.profile-more-actions > summary {
  list-style: none;
}
.profile-more-actions > summary::-webkit-details-marker {
  display: none;
}
.profile-more-actions > div {
  position: absolute;
  z-index: 15;
  top: calc(100% + .35rem);
  right: 0;
  display: grid;
  min-width: 7rem;
  padding: .3rem;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.profile-more-actions .link-button {
  padding: .45rem .5rem;
  color: var(--ink-soft);
  text-align: left;
}
.profile-more-actions .link-button:hover {
  background: var(--surface-soft);
  color: var(--primary);
}
.profile-more-actions .profile-report-action {
  color: var(--danger);
}
.profile-tabs {
  gap: .15rem;
  padding: .25rem;
  border-radius: .65rem;
}
.profile-tabs a {
  padding: .45rem .65rem;
  font-size: .8rem;
  font-weight: 700;
}
.profile-summary a {
  color: inherit;
  text-decoration: none;
}
.profile-summary a:hover {
  color: white;
  text-decoration: underline;
  text-underline-offset: .16rem;
}
.profile-about-panel {
  padding: 1rem !important;
}
.profile-about-panel .panel-heading {
  align-items: center;
  flex-direction: row;
}
.profile-about-panel h2 {
  margin: .1rem 0 0;
  font-family: var(--body);
  font-size: 1.1rem;
  letter-spacing: -.02em;
}
.profile-about-bio {
  max-width: 44rem;
  margin: .9rem 0;
  color: var(--ink-soft);
  line-height: 1.55;
}
.profile-about-empty {
  margin: .9rem 0;
  color: var(--ink-faint);
  font-size: .84rem;
}
.profile-about-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .55rem;
  margin: 1rem 0 0;
}
.profile-about-list > div {
  padding: .7rem;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: var(--surface-soft);
}
.profile-about-list dt {
  display: flex;
  align-items: center;
  gap: .35rem;
  color: var(--ink-faint);
  font-size: .7rem;
  font-weight: 750;
}
.profile-about-list dd {
  margin: .3rem 0 0 1.35rem;
  color: var(--ink);
  font-size: .84rem;
}
.profile-wall-empty {
  display: grid;
  place-items: center;
  gap: .4rem;
  min-height: 11rem;
  padding: 1rem;
  border: 1px dashed var(--line-strong);
  border-radius: .7rem;
  background: var(--surface-soft);
  color: var(--ink-faint);
  text-align: center;
}
.profile-wall-empty strong {
  color: var(--ink-soft);
  font-size: .9rem;
}
.profile-wall-empty span {
  font-size: .76rem;
}
.profile-welcome {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  padding: .8rem !important;
}
.profile-welcome > div {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: var(--primary);
}
.profile-welcome span {
  display: grid;
  gap: .12rem;
  color: var(--ink);
  font-size: .8rem;
}
.profile-welcome small {
  color: var(--ink-faint);
  font-size: .72rem;
}
.library-header-actions {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: var(--ink-faint);
  font-size: .75rem;
}
.photo-launch-button {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
}
.profile-grid {
  grid-template-columns: 13.5rem minmax(0, 1fr);
  gap: 1rem;
  margin-top: 0;
}
.profile-grid > aside {
  position: sticky;
  top: 4.25rem;
  align-self: start;
}
.profile-info {
  padding: .85rem !important;
}
.profile-info h2 {
  margin: 0 0 .65rem;
  font-family: var(--body);
  font-size: .9rem;
  letter-spacing: 0;
}
.profile-info p {
  margin: .55rem 0;
  color: var(--ink-soft);
  font-size: .78rem;
  line-height: 1.4;
}
.profile-info p b {
  color: var(--ink);
  font-size: .72rem;
}
.profile-media-preview {
  padding: .75rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}
.profile-sidebar-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .6rem;
  color: var(--ink);
  font-size: .8rem;
  font-weight: 750;
}
.profile-sidebar-heading a {
  font-size: .72rem;
}
.profile-media-preview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .25rem;
}
.profile-media-preview-grid a {
  overflow: hidden;
  border-radius: .3rem;
  aspect-ratio: 1;
  background: var(--surface-soft);
}
.profile-media-preview-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.profile-media-preview-grid p {
  grid-column: 1 / -1;
  margin: .1rem 0;
  color: var(--ink-faint);
  font-size: .73rem;
}
.profile-main {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 1rem;
}
.profile-main > .edit-panel {
  order: 0;
}
.profile-main > .wall-section {
  order: 1;
}
.profile-main > .photos-panel {
  order: 2;
}
.wall-section {
  display: grid;
  gap: .65rem;
}
.wall-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 1.5rem;
}
.wall-count {
  color: var(--ink-soft);
  font-size: .78rem;
  font-weight: 750;
}
.wall-composer {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  padding: .75rem !important;
}
.wall-form {
  flex: 1;
  min-width: 0;
}
.wall-form .sn-composer-input {
  min-height: 3.8rem;
}
.wall-form .sn-composer-input textarea {
  min-height: 2.6rem;
  height: 2.6rem;
}
.wall-form-footer {
  justify-content: flex-end;
  margin-top: .5rem;
  padding-top: .5rem;
  border-top: 1px solid var(--line);
}
.wall-post {
  display: block !important;
  margin: 0;
  padding: .85rem !important;
}
.wall-post-head {
  display: flex;
  align-items: center;
  gap: .55rem;
}
.wall-post-head > div {
  min-width: 0;
}
.wall-author {
  color: var(--ink);
  font-size: .83rem;
  font-weight: 750;
}
.wall-time {
  display: block;
  margin-top: .1rem;
  color: var(--ink-faint);
  font-size: .7rem;
}
.wall-time a {
  color: inherit;
}
.wall-body {
  margin: .65rem 0 0;
  color: var(--ink);
  line-height: 1.48;
  white-space: normal;
}
.wall-actions {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid var(--line);
  color: var(--ink-faint);
  font-size: .74rem;
}
.wall-actions .link-button {
  padding: .15rem 0;
  font-size: .74rem;
}
.photos-panel {
  padding: .85rem !important;
  background: var(--surface);
}
.library-heading {
  margin-bottom: .65rem;
}
.library-heading h2 {
  font-family: var(--body);
  font-size: .95rem;
  letter-spacing: 0;
}
.photo-grid, .album-grid {
  grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
  gap: .55rem;
}
.photo-card, .album-card {
  border-radius: .5rem;
  box-shadow: none;
}
.photo-card p {
  margin: .4rem .45rem;
  font-size: .72rem;
}
.album-strip {
  margin-top: 1rem;
  padding-top: .85rem;
  border-top: 1px solid var(--line);
}
.library-actions {
  display: flex;
  gap: .45rem;
  margin-top: .75rem;
}
.photo-launch-button, .album-launch-button {
  min-height: 2.15rem;
  padding: .4rem .65rem;
  border: 1px solid var(--line-strong);
  border-radius: .5rem;
  background: var(--surface-soft);
  color: var(--primary);
  font-size: .78rem;
  font-weight: 750;
  cursor: pointer;
}
@media (max-width: 760px) {
  .profile-cover {
    grid-template-columns: 4.25rem minmax(0, 1fr);
    min-height: 0;
  }
  .profile-avatar-wrap, .profile-avatar-photo {
    width: 4.25rem;
    height: 4.25rem;
  }
  .profile-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
  .profile-grid {
    grid-template-columns: 1fr;
  }
  .profile-grid > aside {
    position: static;
  }
  .profile-info {
    display: none;
  }
  .profile-about-list {
    grid-template-columns: 1fr;
  }
  .profile-tabs {
    position: sticky;
    z-index: 12;
    top: 3.25rem;
    overflow-x: auto;
    background: var(--surface);
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in srgb, var(--surface) 94%, transparent);
    }
    backdrop-filter: blur(12px);
    white-space: nowrap;
  }
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
    }
  }
}