:root {
  --color-bg: #f8f9fb;
  --color-card: #ffffff;
  --color-text: #111318;
  --color-muted: #6e737c;
  --color-faint: #a4a8b0;
  --color-border: #eceef2;
  --color-divider: #e8eaee;
  --color-red: #98289a;
  --color-red-dark: #7f1d82;
  --color-red-soft: #f7e9f8;
  --shadow-card: 0 12px 34px rgb(17 19 24 / 7%);
  --radius-card: 18px;
  --container-x: 16px;
  --header-height: 70px;
  --bottom-nav-height: 112px;
}

* {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  background: var(--color-bg);
  color: var(--color-text);
  font-family:
    "SF Pro Text",
    "SF Pro Display",
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body {
  min-height: 100dvh;
  margin: 0;
  overflow-x: hidden;
  background: radial-gradient(circle at top left, #fff 0, var(--color-bg) 44%);
}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  min-width: 44px;
  min-height: 44px;
  border: 0;
  color: inherit;
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

.site-shell {
  min-height: 100dvh;
  padding-top: env(safe-area-inset-top);
  padding-bottom: calc(var(--bottom-nav-height) + env(safe-area-inset-bottom) + 18px);
}

.app-frame {
  min-width: 0;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  border-bottom: 1px solid var(--color-divider);
  background: rgb(248 249 251 / 92%);
  backdrop-filter: blur(18px);
}

.site-header__inner {
  position: relative;
  display: flex;
  min-height: var(--header-height);
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: min(100%, 1180px);
  margin: 0 auto;
  padding: 0 var(--container-x);
}

.brand {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  color: var(--color-text);
  font-size: 30px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
}

.brand img {
  display: block;
  width: auto;
  height: 38px;
  object-fit: contain;
}

.brand--mahallenden img {
  height: 54px;
  max-width: 250px;
}

.brand__first {
  color: var(--color-red);
}

.brand__domain {
  margin-left: 3px;
  font-size: 19px;
  font-weight: 600;
}

.search-shell,
.desktop-top-nav,
.desktop-login,
.mobile-menu-root,
.mobile-menu-trigger,
.desktop-sidebar {
  display: none;
}

.header-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.mobile-menu-trigger {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  place-items: center;
  border-radius: 50%;
  background: transparent;
  color: var(--color-text);
  padding: 0;
  cursor: pointer;
}

.mobile-menu-toggle {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.mobile-menu-toggle:checked + .mobile-menu-trigger {
  display: none;
}

.mobile-menu-trigger__bars {
  display: grid;
  gap: 4px;
  width: 22px;
}

.mobile-menu-trigger__bars span {
  display: block;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 80;
  pointer-events: none;
  visibility: hidden;
}

.mobile-menu.is-open,
.mobile-menu-toggle:checked ~ .mobile-menu {
  pointer-events: auto;
  visibility: visible;
}

.mobile-menu__backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  min-height: 100%;
  background: rgb(17 19 24 / 42%);
  opacity: 0;
  transition: opacity 180ms ease;
}

.mobile-menu.is-open .mobile-menu__backdrop,
.mobile-menu-toggle:checked ~ .mobile-menu .mobile-menu__backdrop {
  opacity: 1;
}

.mobile-menu__drawer {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  display: grid;
  align-content: start;
  gap: 18px;
  width: min(86vw, 340px);
  height: 100vh;
  height: 100dvh;
  overflow-y: auto;
  border-right: 1px solid var(--color-border);
  background: #fff;
  padding: calc(env(safe-area-inset-top) + 18px) 18px calc(var(--bottom-nav-height) + 26px);
  box-shadow: 18px 0 44px rgb(17 19 24 / 18%);
  transform: translateX(-104%);
  transition: transform 220ms ease;
}

.mobile-menu.is-open .mobile-menu__drawer,
.mobile-menu-toggle:checked ~ .mobile-menu .mobile-menu__drawer {
  transform: translateX(0);
}

.mobile-menu__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.mobile-menu__brand img {
  max-width: 172px;
  height: auto;
  max-height: 48px;
}

.mobile-menu__brand.brand--mahallenden img {
  max-width: 198px;
  max-height: 58px;
}

.mobile-menu__close {
  display: grid;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  place-items: center;
  border-radius: 50%;
  background: var(--color-bg);
  color: var(--color-text);
  padding: 0;
  cursor: pointer;
}

.mobile-menu h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 24px;
  line-height: 1.15;
  font-weight: 850;
}

.mobile-menu__nav {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  width: 100%;
}

.mobile-menu__item {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  border-radius: 12px;
  color: #30343b;
  padding: 0 12px;
  background: #fff;
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}

.mobile-menu__item.is-active {
  background: var(--color-red-soft);
  color: var(--color-red);
}

.mobile-menu__item:focus-visible,
.mobile-menu__item:hover {
  background: #f1f2f5;
}

.icon-button {
  position: relative;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 50%;
  background: transparent;
  color: var(--color-text);
  font-size: 26px;
  line-height: 1;
}

.icon-button--badge::after {
  position: absolute;
  top: 3px;
  right: 2px;
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border-radius: 999px;
  background: var(--color-red);
  color: #fff;
  content: attr(data-count);
  font-size: 11px;
  font-weight: 700;
}

.icon-button--badge.is-empty::after {
  display: none;
}

.search-shell__button {
  display: grid;
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  place-items: center;
  border-radius: 50%;
  background: transparent;
  color: var(--color-muted);
  padding: 0;
}

.notifications-widget {
  position: relative;
}

.notifications-trigger.is-open {
  background: var(--color-red-soft);
  color: var(--color-red);
}

.notifications-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 50;
  width: min(86vw, 330px);
  border: 1px solid var(--color-border);
  border-radius: 16px;
  background: #fff;
  padding: 12px;
  box-shadow: 0 18px 46px rgb(17 19 24 / 16%);
}

.notifications-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.notifications-panel__header strong {
  color: var(--color-text);
  font-size: 14px;
  font-weight: 800;
}

.notifications-panel__header span {
  border-radius: 999px;
  background: var(--color-red-soft);
  color: var(--color-red);
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 800;
}

.notifications-list {
  display: grid;
  gap: 6px;
}

.notification-item {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  border: 0;
  border-radius: 10px;
  padding: 10px;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.notification-item span {
  width: 8px;
  height: 8px;
  margin-top: 5px;
  border-radius: 50%;
}

.notification-item strong {
  overflow: hidden;
  font-size: 13px;
  line-height: 18px;
}

.notification-item small {
  display: -webkit-box;
  overflow: hidden;
  margin-top: 4px;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 650;
  line-height: 16px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.notification-item.is-unread {
  background: var(--color-red-soft);
  color: var(--color-text);
}

.notification-item.is-unread span {
  background: var(--color-red);
}

.notification-item.is-read {
  background: #f6f7f9;
  color: var(--color-muted);
}

.notification-item.is-read span {
  background: #c6cad2;
}

.page-container {
  width: min(100%, 1180px);
  margin: 0 auto;
  padding: 0 var(--container-x);
}

.mobile-ad,
.site-banner {
  margin: 15px 0 24px;
  border-radius: 14px;
}

.mobile-ad {
  min-height: 118px;
  background:
    linear-gradient(90deg, rgb(0 0 0 / 68%), rgb(0 0 0 / 10%)),
    linear-gradient(135deg, #20252c, #75808b);
  box-shadow: 0 12px 30px rgb(17 19 24 / 10%);
}

.site-banner {
  display: block;
  overflow: hidden;
  aspect-ratio: 3 / 1;
  background: #f6f7f9;
  box-shadow: 0 12px 30px rgb(17 19 24 / 10%);
}

.site-banner img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.home-featured-carousel {
  margin-bottom: 24px;
}

.desktop-featured-carousel {
  display: none;
}

.desktop-market-summary {
  display: none;
}

.mobile-market-summary {
  margin-bottom: 22px;
}

.mobile-weather-summary {
  margin-bottom: 14px;
}

.mobile-categories {
  display: grid;
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  gap: 10px;
  margin: 20px calc(var(--container-x) * -1) 0;
  padding: 2px var(--container-x) 26px;
  overflow-x: auto;
  scrollbar-width: none;
}

.mobile-categories::-webkit-scrollbar {
  display: none;
}

.category-bubble {
  display: grid;
  justify-items: center;
  gap: 9px;
  min-width: 62px;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
}

.category-bubble__visual {
  display: grid;
  width: 56px;
  height: 56px;
  place-items: center;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background: var(--color-card);
  box-shadow: 0 5px 16px rgb(17 19 24 / 8%);
  color: #111318;
}

.category-bubble.is-breaking {
  min-width: 74px;
  color: var(--color-red);
}

.category-bubble.is-breaking .category-bubble__visual {
  width: 64px;
  height: 64px;
  border-color: rgb(152 40 154 / 22%);
  border-radius: 18px;
  background: var(--color-red);
  color: #fff;
  box-shadow: 0 10px 24px rgb(152 40 154 / 24%);
}

.category-bubble--bursa .category-bubble__visual,
.category-bubble--ekonomi .category-bubble__visual,
.category-bubble--spor .category-bubble__visual {
  color: #168653;
}

.category-bubble--turkiye .category-bubble__visual {
  color: var(--color-red);
}

.category-bubble--dunya .category-bubble__visual {
  color: #2878e8;
}

.category-bubble--teknoloji .category-bubble__visual {
  color: #7555d9;
}

.content-grid {
  display: grid;
  gap: 18px;
}

.main-column,
.side-column {
  min-width: 0;
}

.desktop-ad,
.site-banner--desktop {
  display: none;
}

.feed-tabs {
  display: flex;
  gap: 10px;
  margin-bottom: 26px;
  overflow-x: auto;
  scrollbar-width: none;
}

.feed-tabs::-webkit-scrollbar {
  display: none;
}

.feed-tabs__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: var(--color-card);
  color: var(--color-muted);
  padding: 0 18px;
  white-space: nowrap;
  box-shadow: 0 4px 14px rgb(17 19 24 / 4%);
  font-size: 12px;
  font-weight: 600;
}

.feed-tabs__item.is-active {
  border-color: #17191f;
  background: #17191f;
  color: #fff;
}

.feed-tabs__title {
  margin: 0;
  min-width: 0;
  min-height: 44px;
  border: 0;
  background: transparent;
  color: var(--color-text);
  padding: 0;
  font-size: 21px;
  font-weight: 800;
  line-height: 44px;
  text-align: left;
  white-space: nowrap;
}

.feed-tabs--split .feed-tabs__item {
  margin-left: auto;
}

.feed-tabs--split .feed-tabs__item--flow {
  position: relative;
  isolation: isolate;
  overflow: visible;
  border-color: var(--color-red);
  background: var(--color-red);
  color: #fff;
  animation: flow-button-pulse 1.9s ease-in-out infinite;
  box-shadow: none;
}

.feed-tabs--split .feed-tabs__item--flow::before {
  position: absolute;
  inset: 4px -18px -10px;
  z-index: -1;
  border-radius: 999px;
  background: radial-gradient(ellipse at center, rgb(152 40 154 / 28%) 0%, rgb(152 40 154 / 14%) 46%, transparent 72%);
  content: "";
  filter: blur(10px);
  opacity: 0.9;
  animation: flow-button-halo 1.9s ease-in-out infinite;
}

.feed-tabs--split .feed-tabs__item--flow::after {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(115deg, transparent 0 36%, rgb(255 255 255 / 26%) 48%, transparent 62% 100%);
  content: "";
  opacity: 0;
  transform: translateX(-70%);
  animation: flow-button-shine 2.6s ease-in-out infinite;
  pointer-events: none;
}

.feed-tabs--split .feed-tabs__item--flow svg {
  position: relative;
  z-index: 1;
  animation: flow-button-star 1.35s ease-in-out infinite;
}

.feed-tabs--split .feed-tabs__item--flow > * {
  position: relative;
  z-index: 1;
}

.feed-tabs--split .feed-tabs__item--flow.is-active {
  background: #fff;
  color: var(--color-red);
  animation: none;
  box-shadow: 0 4px 14px rgb(17 19 24 / 4%);
}

.feed-tabs--split .feed-tabs__item--flow.is-active::before,
.feed-tabs--split .feed-tabs__item--flow.is-active::after,
.feed-tabs--split .feed-tabs__item--flow.is-active svg {
  animation: none;
  opacity: 0;
}

@keyframes flow-button-pulse {
  0%,
  100% {
    transform: translateY(0) scale(1);
  }

  50% {
    transform: translateY(-1px) scale(1.035);
  }
}

@keyframes flow-button-halo {
  0%,
  100% {
    opacity: 0.72;
    transform: scale(0.98);
  }

  50% {
    opacity: 1;
    transform: scale(1.05);
  }
}

@keyframes flow-button-shine {
  0%,
  44% {
    transform: translateX(-75%);
    opacity: 0;
  }

  58% {
    opacity: 0.9;
  }

  76%,
  100% {
    transform: translateX(76%);
    opacity: 0;
  }
}

@keyframes flow-button-star {
  0%,
  100% {
    transform: rotate(0deg) scale(1);
  }

  45% {
    transform: rotate(-9deg) scale(1.14);
  }

  70% {
    transform: rotate(8deg) scale(1.06);
  }
}

.home-news-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 30px;
}

.home-tab-panel {
  animation: home-panel-slide-in 240ms ease both;
}

.home-tab-panel.is-hidden {
  display: none;
}

.home-tab-panel--feed {
  transform-origin: right center;
}

.home-tab-panel--grid {
  transform-origin: left center;
}

.home-tab-panel--sections {
  transform-origin: left center;
}

@keyframes home-panel-slide-in {
  from {
    opacity: 0;
    transform: translateX(18px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.home-news-card {
  position: relative;
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 8px;
}

.home-news-card__media {
  position: relative;
}

.home-news-card img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 0.72;
  border-radius: 12px;
  object-fit: cover;
  background: #eef0f4;
}

.home-news-card span {
  justify-self: start;
  border-radius: 999px;
  background: var(--color-red-soft);
  color: var(--color-red);
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
}

.home-news-card h3 {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--color-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.home-news-card > .bookmark-button-wrap {
  position: absolute;
  right: 4px;
  bottom: 0;
}

.home-sections {
  display: grid;
  gap: 30px;
}

.home-section {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.home-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.home-section__header h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 25px;
  font-weight: 900;
  line-height: 31px;
}

.home-section__header a {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  color: var(--color-red);
  font-size: 13px;
  font-weight: 800;
}

.bursa-block {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.bursa-slider {
  display: grid;
  grid-auto-columns: minmax(170px, 42vw);
  grid-auto-flow: column;
  gap: 12px;
  margin: 0;
  overflow-x: auto;
  padding: 0 0 2px;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.bursa-slider::-webkit-scrollbar {
  display: none;
}

.bursa-slider-card {
  position: relative;
  display: grid;
  min-height: 218px;
  align-content: end;
  overflow: hidden;
  border-radius: 14px;
  background: #d9dde4;
  padding: 12px;
  color: #fff;
  scroll-snap-align: start;
  box-shadow: 0 8px 20px rgb(17 19 24 / 12%);
}

.bursa-slider-card::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgb(0 0 0 / 0%) 30%, rgb(0 0 0 / 76%) 100%);
  content: "";
}

.bursa-slider-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bursa-slider-card span,
.bursa-slider-card h3,
.bursa-slider-card time {
  position: relative;
  z-index: 1;
}

.bursa-slider-card span,
.home-grid-card__media span,
.home-list-card__content strong {
  justify-self: start;
  border-radius: 5px;
  background: var(--color-red);
  color: #fff;
  padding: 4px 7px;
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.bursa-slider-card h3 {
  display: -webkit-box;
  overflow: hidden;
  margin: 9px 0 6px;
  font-size: 16px;
  font-weight: 900;
  line-height: 21px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.bursa-slider-card time,
.home-grid-card time,
.home-list-card time {
  color: currentcolor;
  font-size: 12px;
  font-weight: 600;
  opacity: 0.82;
}

.bursa-slider-dots {
  display: inline-flex;
  justify-self: center;
  gap: 7px;
  min-height: 8px;
}

.bursa-slider-dots span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #c6cad2;
}

.bursa-slider-dots .is-active {
  background: var(--color-red);
}

.home-list-news {
  display: grid;
  gap: 12px;
}

.home-list-card {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) 24px;
  gap: 12px;
  align-items: center;
  min-width: 0;
}

.home-list-card img {
  width: 120px;
  height: 76px;
  border-radius: 10px;
  object-fit: cover;
  background: #eef0f4;
}

.home-list-card__content {
  display: grid;
  align-content: center;
  gap: 5px;
  min-width: 0;
}

.home-list-card__content strong {
  background: var(--color-red-soft);
  color: var(--color-red);
}

.home-list-card h3 {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--color-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.home-list-card svg,
.home-grid-card__meta svg {
  color: #17191f;
}

.bookmark-button-wrap {
  display: inline-grid;
  position: relative;
}

.bookmark-toggle {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--color-text);
  padding: 0 10px;
}

.bookmark-toggle svg {
  fill: transparent;
}

.bookmark-toggle.is-bookmarked {
  color: var(--color-red);
}

.bookmark-toggle.is-bookmarked svg {
  fill: currentColor;
}

.bookmark-toggle:disabled {
  cursor: progress;
  opacity: 0.7;
}

.bookmark-error {
  position: absolute;
  right: 0;
  bottom: calc(100% + 6px);
  z-index: 4;
  width: 190px;
  border-radius: 10px;
  background: #111318;
  color: #fff;
  padding: 8px 10px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}

.home-section-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px 12px;
}

.home-grid-card {
  display: grid;
  min-width: 0;
  overflow: hidden;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 12px rgb(0 0 0 / 6%);
}

.home-grid-card__media {
  position: relative;
  display: block;
  min-height: 112px;
  overflow: hidden;
  background: #eef0f4;
}

.home-grid-card__media::after {
  position: absolute;
  inset: auto 0 0;
  height: 54%;
  background: linear-gradient(180deg, rgb(0 0 0 / 0%), rgb(0 0 0 / 42%));
  content: "";
}

.home-grid-card__media img {
  display: block;
  width: 100%;
  aspect-ratio: 1.42 / 1;
  object-fit: cover;
}

.home-grid-card__media span {
  position: absolute;
  bottom: 8px;
  left: 8px;
  z-index: 1;
}

.home-grid-card h3 {
  display: -webkit-box;
  overflow: hidden;
  min-height: 66px;
  margin: 0;
  padding: 10px 10px 4px;
  color: var(--color-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.home-grid-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 10px 10px;
  color: var(--color-muted);
}

.feed-layout {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 14px;
}

.feed-timeline {
  position: relative;
  display: grid;
  grid-template-columns: 12px 1fr;
  grid-auto-rows: min-content;
  align-content: start;
  gap: 6px 10px;
  padding-top: 28px;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 17px;
}

.feed-timeline::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 4px;
  width: 1px;
  background: #e5e7eb;
  content: "";
}

.feed-timeline__row {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: 12px 1fr;
  gap: 10px;
}

.feed-timeline__dot {
  position: relative;
  z-index: 1;
  width: 9px;
  height: 9px;
  margin-top: 4px;
  box-shadow: 0 0 0 4px var(--color-bg);
  border-radius: 50%;
  background: #c7cbd2;
}

.feed-timeline__dot.is-active {
  background: var(--color-red);
}

.feed-timeline__label {
  min-height: 126px;
}

.feed-stack {
  display: grid;
  gap: 18px;
}

.search-page {
  padding-top: 18px;
}

.search-page__header {
  display: grid;
  gap: 16px;
  margin-bottom: 22px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  background: var(--color-card);
  padding: 18px;
  box-shadow: var(--shadow-card);
}

.search-page__title {
  display: grid;
  gap: 7px;
}

.search-page__title > span {
  display: inline-flex;
  width: fit-content;
  min-height: 28px;
  align-items: center;
  gap: 7px;
  border-radius: 999px;
  background: var(--color-red-soft);
  color: var(--color-red);
  padding: 0 10px;
  font-size: 12px;
  font-weight: 800;
}

.search-page__title h1 {
  margin: 0;
  color: var(--color-text);
  font-size: 24px;
  font-weight: 800;
  line-height: 30px;
}

.search-page__title p {
  margin: 0;
  color: var(--color-muted);
  font-size: 13px;
  line-height: 19px;
}

.search-shell--compact {
  display: flex;
  min-height: 48px;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: #fff;
  color: var(--color-muted);
  padding: 0 12px;
}

.search-shell--compact input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--color-text);
  font-size: 14px;
}

.search-category-matches {
  display: grid;
  gap: 12px;
  margin-bottom: 22px;
}

.search-category-list {
  display: grid;
  gap: 10px;
}

.search-category-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 12px;
  align-items: center;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: #fff;
  padding: 14px;
  box-shadow: 0 8px 22px rgb(17 19 24 / 5%);
}

.search-category-card strong {
  color: var(--color-text);
  font-size: 15px;
  font-weight: 800;
  line-height: 20px;
}

.search-category-card span {
  grid-column: 1;
  color: var(--color-muted);
  font-size: 12px;
  line-height: 17px;
}

.search-category-card svg {
  grid-column: 2;
  grid-row: 1 / span 2;
  color: var(--color-muted);
}

.search-results {
  margin-bottom: 24px;
}

.search-empty {
  display: grid;
  gap: 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  background: #fff;
  padding: 18px;
  box-shadow: var(--shadow-card);
}

.search-empty h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 19px;
  font-weight: 800;
  line-height: 24px;
}

.search-empty p {
  margin: 0;
  color: var(--color-muted);
  font-size: 13px;
  line-height: 19px;
}

.search-suggestion-list {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.search-suggestion-list a {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  border-radius: 999px;
  background: var(--color-red-soft);
  color: var(--color-red);
  padding: 0 13px;
  font-size: 12px;
  font-weight: 800;
}

.news-shell {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  background: var(--color-card);
  box-shadow: var(--shadow-card);
}

.news-shell__body {
  display: grid;
  align-content: start;
  gap: 11px;
  min-width: 0;
}

.publisher-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.publisher-logo {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: #07080a;
  color: #fff;
  font-size: 21px;
  font-weight: 800;
}

.publisher-logo::first-letter {
  color: var(--color-red);
}

.category-tag,
.market-lines span,
.popular-lines span {
  display: block;
  border-radius: 999px;
  background: #eef0f4;
}

.publisher-name {
  color: var(--color-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
}

.publisher-handle,
.publisher-time {
  display: none;
}

.verified-mark {
  flex: 0 0 auto;
  color: var(--color-red);
}

.category-tag {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  background: var(--color-red-soft);
  color: var(--color-red);
  padding: 6px 10px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.1;
}

.news-title {
  max-width: 520px;
  margin: 2px 0 0;
  color: var(--color-text);
  font-size: 19px;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0;
}

.news-summary {
  max-width: 520px;
  margin: 0;
  color: var(--color-muted);
  font-size: 14px;
  font-weight: 400;
  line-height: 19px;
}

.news-actions {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 10px;
  color: #333842;
  font-size: 13px;
  font-weight: 500;
}

.news-actions button,
.summary-trigger {
  display: inline-flex;
  gap: 7px;
  min-height: 36px;
  align-items: center;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: #fff;
  padding: 0 14px;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 600;
}

.summary-trigger {
  border-color: var(--color-red);
  background:
    linear-gradient(180deg, rgb(255 255 255 / 78%), rgb(255 255 255 / 0%)),
    linear-gradient(135deg, #fff8ff, #f3d8f5 58%, #fbf0fc);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 88%),
    0 8px 18px rgb(152 40 154 / 14%);
  color: var(--color-red);
}

.summary-trigger,
.summary-trigger svg {
  color: var(--color-red);
  stroke: var(--color-red);
}

.summary-trigger--icon {
  position: absolute;
  right: 9px;
  bottom: 9px;
  z-index: 2;
  width: 38px;
  height: 38px;
  min-width: 38px;
  min-height: 38px;
  justify-content: center;
  border-color: rgb(255 255 255 / 68%);
  background: rgb(255 255 255 / 92%);
  padding: 0;
  box-shadow: 0 10px 24px rgb(17 19 24 / 16%);
  backdrop-filter: blur(12px);
}

.news-action-pill {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: #fff;
  padding: 0 14px;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 600;
}

.news-action-inline {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
}

.news-actions .news-action-button,
.news-actions .news-share-button {
  display: inline-flex;
  min-width: 0;
  min-height: 36px;
  align-items: center;
  gap: 7px;
  border: 0;
  background: transparent;
  padding: 0;
  color: #30343b;
  font-size: 13px;
  font-weight: 600;
}

.news-actions .news-share-button {
  margin-left: 0;
}

.article-actions-bar .bookmark-toggle,
.news-actions .bookmark-toggle {
  border: 1px solid var(--color-border);
  background: #fff;
  padding-inline: 14px;
}

.comment-widget {
  position: relative;
}

.comment-panel {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  z-index: 12;
  width: min(82vw, 320px);
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: #fff;
  padding: 14px;
  box-shadow: 0 18px 42px rgb(17 19 24 / 16%);
  transform: translateX(-50%);
}

.comment-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.comment-panel__header strong {
  color: var(--color-text);
  font-size: 14px;
  font-weight: 800;
}

.comment-panel__header button {
  display: grid;
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  place-items: center;
  border-radius: 50%;
  background: #f0f1f4;
  padding: 0;
}

.comment-form {
  display: grid;
  gap: 8px;
}

.comment-form input,
.comment-form textarea {
  width: 100%;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: #f8f9fb;
  color: var(--color-text);
  padding: 10px 11px;
  outline: 0;
  font-size: 13px;
}

.comment-form textarea {
  resize: vertical;
}

.comment-form button {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 999px;
  background: var(--color-red);
  color: #fff;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 800;
}

.comment-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.comment-item {
  border-top: 1px solid var(--color-divider);
  padding-top: 8px;
}

.comment-item strong {
  display: block;
  color: var(--color-text);
  font-size: 12px;
}

.comment-item p {
  margin: 4px 0 0;
  color: var(--color-muted);
  font-size: 12px;
  line-height: 17px;
}

.card-menu-button {
  position: absolute;
  top: 13px;
  right: 13px;
  display: grid;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  place-items: center;
  border-radius: 50%;
  background: transparent;
  color: #596170;
}

.news-detail {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: end;
  color: #333842;
  font-size: 14px;
  font-weight: 500;
  line-height: 19px;
}

.news-detail__share {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}

.news-shell__media {
  position: relative;
  overflow: hidden;
  min-height: 152px;
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgb(152 40 154 / 15%), transparent 50%),
    linear-gradient(145deg, #dbe3eb, #7f98a9);
}

.news-shell__media .category-tag {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 1;
  background: rgb(255 255 255 / 88%);
  box-shadow: 0 8px 18px rgb(17 19 24 / 14%);
  backdrop-filter: blur(10px);
}

.news-shell__media img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
}

.side-column {
  display: none;
}

.widget {
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: var(--color-card);
  box-shadow: 0 8px 24px rgb(17 19 24 / 5%);
  padding: 18px;
}

.widget + .widget {
  margin-top: 16px;
}

.widget h2,
.widget p {
  margin: 0;
}

.widget h2 {
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.widget p {
  margin-top: 4px;
  color: var(--color-muted);
  font-size: 12px;
}

.widget strong {
  display: block;
  margin-top: 8px;
  font-size: 30px;
  line-height: 1;
}

.widget__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.widget__header span {
  color: var(--color-muted);
  font-size: 10px;
  font-weight: 500;
}

.widget__header a,
.widget__header span {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.widget--weather {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.widget--weather-forecast {
  display: block;
}

.weather-forecast__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.weather-forecast__header h2 {
  margin: 0;
}

.weather-forecast__header p {
  margin: 4px 0 0;
}

.weather-forecast__header > span {
  color: var(--color-text);
  font-size: 24px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.weather-forecast__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.weather-day {
  display: grid;
  min-width: 0;
  min-height: 116px;
  align-content: start;
  justify-items: center;
  gap: 4px;
  padding: 10px 6px;
  border: 1px solid #e5edf5;
  border-radius: 16px;
  background: linear-gradient(180deg, #f4fbff 0%, #ffffff 100%);
  text-align: center;
}

.weather-day__label {
  overflow: hidden;
  max-width: 100%;
  color: var(--color-text);
  font-size: 12px;
  font-weight: 800;
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.weather-day small {
  color: var(--color-muted);
  font-size: 11px;
  font-weight: 700;
  line-height: 14px;
}

.weather-day__mark {
  width: 40px;
  height: 32px;
  margin: 3px 0;
  border-radius: 14px;
  background:
    radial-gradient(circle at 34% 30%, #ffc928 0 31%, transparent 32%),
    radial-gradient(circle at 66% 70%, #d9e8f0 0 38%, transparent 39%),
    radial-gradient(circle at 45% 72%, #eef5f8 0 31%, transparent 32%);
}

.weather-day strong {
  color: var(--color-text);
  font-size: 19px;
  font-weight: 850;
  line-height: 1;
}

.weather-day em {
  display: -webkit-box;
  overflow: hidden;
  color: var(--color-muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 13px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.weather-mark {
  width: 72px;
  height: 58px;
  border-radius: 22px;
  background:
    radial-gradient(circle at 34% 30%, #ffc928 0 28%, transparent 29%),
    radial-gradient(circle at 65% 70%, #d9e8f0 0 35%, transparent 36%),
    radial-gradient(circle at 45% 72%, #eef5f8 0 30%, transparent 31%);
}

.widget--ad {
  min-height: 170px;
  background:
    linear-gradient(135deg, rgb(255 255 255 / 12%), transparent 42%),
    linear-gradient(145deg, #174a39, #0d1d18);
}

.page-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.page-heading h1 {
  margin: 0;
  color: var(--color-text);
  font-size: 30px;
  line-height: 36px;
  letter-spacing: 0;
}

.page-heading p {
  max-width: 560px;
  margin: 6px 0 0;
  color: var(--color-muted);
  font-size: 14px;
  line-height: 20px;
}

.live-pill {
  display: inline-flex;
  min-height: 36px;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  border-radius: 999px;
  background: var(--color-red-soft);
  color: var(--color-red);
  padding: 0 12px;
  font-size: 12px;
  font-weight: 700;
}

.live-pill span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--color-red);
  box-shadow: 0 0 0 5px rgb(152 40 154 / 12%);
}

.new-updates-button,
.load-more-button,
.article-action-button {
  display: inline-flex;
  gap: 8px;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: var(--color-card);
  color: var(--color-text);
  padding: 0 16px;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 4px 14px rgb(17 19 24 / 4%);
}

.new-updates-button {
  margin: 0 0 16px;
  color: var(--color-red);
}

.breaking-timeline {
  position: relative;
  display: grid;
  gap: 0;
  margin-top: 2px;
}

.breaking-row {
  display: grid;
  grid-template-columns: 48px 18px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
}

.breaking-row::before {
  grid-column: 2;
  grid-row: 1;
  width: 2px;
  min-height: 100%;
  margin: 14px auto 0;
  background: var(--color-divider);
  content: "";
}

.breaking-row__time {
  padding-top: 16px;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
}

.breaking-row__dot {
  position: relative;
  z-index: 1;
  grid-column: 2;
  grid-row: 1;
  width: 10px;
  height: 10px;
  margin: 20px auto 0;
  border-radius: 50%;
  background: #c7cbd2;
}

.breaking-row__dot.is-active {
  background: var(--color-red);
  box-shadow: 0 0 0 5px rgb(152 40 154 / 12%);
}

.breaking-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 92px;
  gap: 12px;
  min-width: 0;
  padding: 14px 0 18px;
  border-bottom: 1px solid var(--color-divider);
}

.breaking-card__content {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
}

.breaking-card h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 17px;
  line-height: 23px;
  letter-spacing: 0;
}

.breaking-card p {
  margin: 0;
  color: var(--color-muted);
  font-size: 13px;
  line-height: 19px;
}

.breaking-card img {
  width: 92px;
  height: 72px;
  border-radius: 10px;
  object-fit: cover;
  background: #eef0f4;
}

.breaking-card__detail {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #333842;
  font-size: 13px;
  font-weight: 600;
}

.featured-news {
  display: grid;
  gap: 15px;
  margin-bottom: 18px;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  background: var(--color-card);
  box-shadow: var(--shadow-card);
}

.featured-news img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: #eef0f4;
}

.featured-news div {
  display: grid;
  gap: 10px;
  padding: 0 18px 18px;
}

.featured-news h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 24px;
  line-height: 30px;
  letter-spacing: 0;
}

.featured-news p {
  margin: 0;
  color: var(--color-muted);
  font-size: 14px;
  line-height: 20px;
}

.category-feed__item {
  min-width: 0;
}

.inline-ad {
  min-height: 118px;
  margin: 0 0 18px;
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgb(0 0 0 / 62%), rgb(0 0 0 / 8%)),
    linear-gradient(135deg, #20252c, #75808b);
}

.load-more-button {
  width: 100%;
  margin-top: 20px;
}

.market-list {
  display: grid;
  gap: 10px;
}

.market-list span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 600;
}

.market-list strong {
  margin: 0;
  color: var(--color-text);
  font-size: 14px;
  line-height: 18px;
}

.market-widget {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
  border: 0;
  border-radius: 0;
  background: #fff;
  padding: 12px 0;
  box-shadow: none;
}

.market-widget__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.market-widget__header h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 14px;
  font-weight: 800;
  line-height: 18px;
}

.market-widget__header p {
  margin: 3px 0 0;
  color: var(--color-muted);
  font-size: 10px;
  line-height: 14px;
}

.market-widget__header > span {
  color: var(--color-muted);
  padding-top: 2px;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
}

.market-widget__message {
  margin: 0;
  color: var(--color-muted);
  font-size: 11px;
  line-height: 16px;
}

.market-widget__grid {
  display: grid;
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  gap: 24px;
  margin: 0;
  overflow-x: auto;
  padding: 2px 0 5px;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}

.market-widget__grid::-webkit-scrollbar {
  display: none;
}

.market-card {
  display: grid;
  grid-template-columns: auto minmax(0, max-content);
  gap: 0 9px;
  align-items: center;
  min-width: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  scroll-snap-align: start;
}

.market-card__icon {
  grid-row: 1 / span 2;
  color: #1f9b5f;
}

.market-card--unavailable .market-card__icon,
.market-card--error .market-card__icon,
.market-card--loading .market-card__icon {
  color: #9aa0aa;
}

.market-card__body {
  display: grid;
  gap: 1px;
}

.market-card__topline {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.market-card__topline span {
  overflow: hidden;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 500;
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-transform: uppercase;
}

.market-card__topline em {
  color: var(--color-muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
}

.market-card strong {
  color: #1f9b5f;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
}

.market-card__change {
  display: none;
  width: fit-content;
  min-height: 24px;
  align-items: center;
  gap: 5px;
  border-radius: 999px;
  background: #eef0f4;
  padding: 0 8px;
  color: #6e737c;
  font-size: 11px;
  font-weight: 800;
}

.market-card__change--up {
  background: #e8f7ef;
  color: #168653;
}

.market-card__change--down {
  background: #fdecec;
  color: #c03333;
}

.market-card em {
  color: var(--color-muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
}

.market-card--loading strong,
.market-card--unavailable strong,
.market-card--error strong {
  color: var(--color-faint);
}

.market-card:has(.market-card__change--down) .market-card__icon,
.market-card:has(.market-card__change--down) strong {
  color: #d21f2b;
}

.article-main {
  min-width: 0;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 18px;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 600;
}

.article-main h1 {
  max-width: 760px;
  margin: 14px 0 12px;
  color: var(--color-text);
  font-size: 27px;
  font-weight: 900;
  line-height: 34px;
  letter-spacing: 0;
}

.article-spot {
  max-width: 680px;
  margin: 0 0 16px;
  color: #333842;
  font-size: 18px;
  line-height: 27px;
}

.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 600;
}

.article-publisher {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 18px 0;
}

.article-publisher strong,
.article-publisher p {
  margin: 0;
}

.article-publisher p {
  margin-top: 2px;
  color: var(--color-muted);
  font-size: 12px;
}

.article-cover {
  display: block;
  width: 100%;
  margin-top: 20px;
  aspect-ratio: 16 / 9;
  border-radius: 14px;
  object-fit: cover;
  background: #eef0f4;
}

.article-actions-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 18px 0 22px;
}

.article-body {
  display: grid;
  gap: 16px;
  max-width: 720px;
}

.article-body h2 {
  margin: 12px 0 0;
  color: var(--color-text);
  font-size: 24px;
  line-height: 30px;
  letter-spacing: 0;
}

.article-body p {
  margin: 0;
  color: #242832;
  font-size: 17px;
  line-height: 28px;
}

.emoji-reactions {
  display: grid;
  gap: 10px;
  margin-top: 26px;
}

.emoji-reactions h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0;
}

.emoji-reactions__rail {
  display: grid;
  grid-auto-columns: minmax(48px, 1fr);
  grid-auto-flow: column;
  gap: 4px;
  align-items: start;
  overflow-x: auto;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: #fff;
  padding: 6px 8px;
  scrollbar-width: none;
}

.emoji-reactions__rail::-webkit-scrollbar {
  display: none;
}

.emoji-reaction {
  display: grid;
  min-width: 44px;
  min-height: 54px;
  justify-items: center;
  align-content: center;
  gap: 3px;
  border-radius: 999px;
  background: transparent;
  padding: 0 3px;
}

.emoji-reaction.is-selected {
  background: #f4e8f5;
}

.emoji-reaction__icon {
  font-size: 28px;
  line-height: 1;
}

.emoji-reaction strong {
  color: #8b8f96;
  font-size: 12px;
  font-weight: 700;
  line-height: 14px;
}

.article-media-section,
.related-section {
  margin-top: 28px;
}

.article-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.article-gallery img {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 10px;
  object-fit: cover;
  background: #eef0f4;
}

.video-placeholder {
  display: grid;
  min-height: 210px;
  place-items: center;
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgb(255 255 255 / 10%), transparent 40%),
    linear-gradient(145deg, #15181f, #454d59);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}

.article-ad {
  margin-top: 28px;
}

.article-source {
  margin-top: 22px;
  color: var(--color-muted);
  font-size: 13px;
  font-weight: 600;
}

.article-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 16px;
}

.article-tags a {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  border-radius: 999px;
  background: #eef0f4;
  color: #333842;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 700;
}

.tag-archive-page {
  padding-top: 22px;
}

.tag-archive-header {
  margin-bottom: 18px;
}

.tag-archive-header span {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  border-radius: 999px;
  background: #f4e7f5;
  color: #9c2aa0;
  padding: 0 11px;
  font-size: 12px;
  font-weight: 900;
}

.tag-archive-header h1 {
  margin: 12px 0 8px;
  color: var(--color-text);
  font-size: 31px;
  font-weight: 900;
  line-height: 1.12;
}

.tag-archive-header p {
  margin: 0;
  color: var(--color-muted);
  font-size: 15px;
  line-height: 1.5;
}

.tag-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 22px;
}

.tag-pagination a,
.tag-pagination span {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--color-divider);
  border-radius: 999px;
  background: #fff;
  color: var(--color-text);
  padding: 0 14px;
  font-size: 13px;
  font-weight: 800;
}

.tag-pagination a.is-disabled {
  color: var(--color-muted);
  pointer-events: none;
  opacity: 0.5;
}

.auth-page {
  padding-top: 28px;
  padding-bottom: 28px;
}

.auth-card {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 48px rgb(17 19 24 / 8%);
}

.auth-card__intro {
  display: none;
}

.auth-card__intro::before {
  position: absolute;
  inset: 0;
  background-image: url("/assets/auth-bursa-panel.jpg");
  background-position: center;
  background-size: cover;
  content: "";
}

.auth-card__intro::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgb(255 255 255 / 0%) 0%, rgb(255 255 255 / 14%) 100%);
  content: "";
}

.auth-intro__copy {
  display: grid;
  gap: 18px;
  position: relative;
  z-index: 1;
}

.auth-panel {
  display: grid;
  gap: 24px;
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 28px 20px 34px;
}

.auth-mobile-heading {
  display: grid;
  gap: 10px;
  text-align: center;
}

.auth-back-link {
  justify-self: start;
  color: var(--color-red);
  font-size: 14px;
  font-weight: 800;
}

.auth-mobile-heading h1,
.auth-intro__copy h1 {
  margin: 0;
  color: var(--color-text);
  font-size: 25px;
  font-weight: 900;
  line-height: 1.16;
}

.auth-mobile-heading p,
.auth-intro__copy p {
  margin: 0;
  color: var(--color-muted);
  font-size: 13px;
  line-height: 1.55;
}

.auth-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.auth-tabs a {
  display: grid;
  min-height: 46px;
  place-items: center;
  border-bottom: 2px solid var(--color-divider);
  color: var(--color-muted);
  font-size: 16px;
  font-weight: 900;
}

.auth-tabs a.is-active {
  border-color: var(--color-red);
  color: var(--color-red);
}

.auth-form {
  display: grid;
  gap: 16px;
}

.auth-form__split {
  display: grid;
  gap: 14px;
}

.auth-field {
  display: grid;
  gap: 7px;
}

.auth-field > span:first-child {
  color: var(--color-text);
  font-size: 13px;
  font-weight: 800;
}

.auth-field__control {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 52px;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: #fff;
  padding: 0 14px;
  color: #7d8490;
}

.auth-field__control:focus-within {
  border-color: rgb(152 40 154 / 62%);
  box-shadow: 0 0 0 4px rgb(152 40 154 / 10%);
}

.auth-field__control input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--color-text);
  font-size: 15px;
}

.auth-field__control button {
  display: grid;
  width: 38px;
  height: 38px;
  min-width: 38px;
  min-height: 38px;
  place-items: center;
  border-radius: 50%;
  background: transparent;
  color: #6e737c;
  padding: 0;
}

.auth-field small,
.auth-field-error {
  margin: 0;
  color: #c03333;
  font-size: 12px;
  font-weight: 700;
}

.auth-form__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.auth-form__row > a,
.auth-switch a,
.auth-checkbox a {
  color: var(--color-red);
  font-weight: 900;
}

.auth-checkbox {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--color-muted);
  font-size: 13px;
  font-weight: 700;
}

.auth-checkbox input {
  width: 22px;
  height: 22px;
  accent-color: var(--color-red);
}

.auth-checkbox--terms {
  align-items: flex-start;
  line-height: 1.45;
}

.auth-primary-button {
  min-height: 52px;
  border-radius: 12px;
  background: var(--color-red);
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  box-shadow: 0 12px 26px rgb(152 40 154 / 22%);
}

.auth-primary-button:disabled {
  cursor: progress;
  opacity: 0.72;
}

.auth-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 14px;
  align-items: center;
  color: var(--color-muted);
  font-size: 13px;
}

.auth-divider::before,
.auth-divider::after {
  height: 1px;
  background: var(--color-divider);
  content: "";
}

.auth-social {
  display: grid;
  gap: 12px;
  margin-top: 4px;
}

.social-auth-button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: #fff;
  color: var(--color-text);
  font-size: 15px;
  font-weight: 700;
}

.social-auth-button span {
  color: var(--color-text);
  font-size: 20px;
  font-weight: 900;
}

.auth-switch,
.auth-social__message {
  margin: 6px 0 0;
  color: var(--color-muted);
  font-size: 14px;
  text-align: center;
}

.auth-alert {
  border: 1px solid #f3c6c6;
  border-radius: 12px;
  background: #fff2f2;
  color: #a12626;
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 800;
}

.auth-alert--success {
  border-color: #bae6ca;
  background: #eefaf2;
  color: #168653;
}

.password-rules {
  display: grid;
  gap: 6px;
  margin: -4px 0 0;
  padding: 0;
  list-style: none;
}

.password-rules li {
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 700;
}

.password-rules li::before {
  color: #c6cad2;
  content: "• ";
}

.password-rules li.is-passed {
  color: #168653;
}

.auth-benefits {
  display: grid;
  gap: 24px;
}

.auth-benefit {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}

.auth-benefit span {
  display: grid;
  width: 56px;
  height: 56px;
  place-items: center;
  border-radius: 14px;
  background: #fff;
  color: var(--color-red);
  box-shadow: 0 10px 24px rgb(17 19 24 / 7%);
}

.auth-benefit p {
  margin: 0;
  color: #596170;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.45;
}

.profile-placeholder-page {
  padding-top: 28px;
}

.profile-placeholder-card {
  display: grid;
  gap: 10px;
  border: 1px solid var(--color-border);
  border-radius: 16px;
  background: #fff;
  padding: 24px;
  box-shadow: var(--shadow-card);
}

.profile-placeholder-card span {
  color: var(--color-red);
  font-size: 12px;
  font-weight: 900;
}

.profile-placeholder-card h1,
.profile-placeholder-card p {
  margin: 0;
}

.profile-page {
  display: grid;
  gap: 18px;
  padding-top: 22px;
  padding-bottom: 34px;
}

.profile-page-heading {
  display: grid;
  gap: 5px;
}

.profile-page-heading h1 {
  margin: 0;
  color: var(--color-text);
  font-size: 28px;
  font-weight: 900;
}

.profile-page-heading p {
  margin: 0;
  color: var(--color-muted);
  font-size: 14px;
}

.profile-hero-card {
  display: grid;
  gap: 18px;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--shadow-card);
}

.profile-hero-card__main {
  display: grid;
  justify-items: center;
  gap: 12px;
  min-height: 210px;
  background:
    linear-gradient(180deg, rgb(255 255 255 / 0%) 0%, #fff 100%),
    radial-gradient(circle at 72% 18%, rgb(152 40 154 / 18%), transparent 36%),
    linear-gradient(135deg, #f8dff9 0%, #f7eff9 48%, #fff 100%);
  padding: 32px 20px 18px;
  text-align: center;
}

.profile-avatar {
  display: grid;
  width: 92px;
  height: 92px;
  place-items: center;
  overflow: hidden;
  border: 4px solid #fff;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--color-red), #f0b7f3);
  color: #fff;
  box-shadow: 0 14px 28px rgb(17 19 24 / 12%);
  font-size: 26px;
  font-weight: 900;
}

.profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profile-avatar--large {
  width: 118px;
  height: 118px;
  font-size: 32px;
}

.profile-identity {
  display: grid;
  gap: 5px;
}

.profile-identity h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 22px;
  font-weight: 900;
}

.profile-identity h2 span {
  color: var(--color-red);
  font-size: 13px;
}

.profile-identity p,
.profile-identity strong {
  margin: 0;
  color: var(--color-muted);
  font-size: 13px;
  line-height: 1.5;
}

.profile-identity strong {
  max-width: 420px;
  color: var(--color-text);
  font-weight: 700;
}

.profile-meta-grid {
  display: grid;
  gap: 12px;
  padding: 0 18px 18px;
}

.profile-meta {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 2px 10px;
  align-items: center;
}

.profile-meta svg {
  grid-row: span 2;
  color: var(--color-red);
}

.profile-meta span {
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 700;
}

.profile-meta strong {
  min-width: 0;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.profile-edit-link,
.profile-region-card a,
.profile-save-button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 12px;
  background: #f5eef6;
  color: var(--color-red);
  padding: 0 16px;
  font-size: 13px;
  font-weight: 900;
}

.profile-layout-grid {
  display: grid;
  gap: 14px;
}

.profile-menu-grid {
  display: grid;
  gap: 10px;
}

.profile-menu-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 18px;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: #fff;
  padding: 13px;
  text-align: left;
  box-shadow: var(--shadow-card);
}

.profile-menu-card--button {
  width: 100%;
  color: inherit;
}

.profile-menu-card__icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 12px;
}

.profile-menu-card h3,
.profile-region-card h3,
.profile-interest-card h3 {
  margin: 0;
  color: var(--color-text);
  font-size: 15px;
  font-weight: 900;
}

.profile-menu-card p,
.profile-region-card p,
.profile-interest-card p {
  margin: 3px 0 0;
  color: var(--color-muted);
  font-size: 12px;
  line-height: 1.45;
}

.profile-menu-card > svg {
  color: #b6bdc8;
}

.profile-menu-card__count {
  display: inline-grid;
  min-width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 999px;
  background: var(--color-red-soft);
  color: var(--color-red);
  padding: 0 8px;
  font-size: 12px;
  font-weight: 900;
}

.profile-menu-card.is-purple .profile-menu-card__icon { background: #f7e9fb; color: var(--color-red); }
.profile-menu-card.is-blue .profile-menu-card__icon { background: #eaf3ff; color: #2276e3; }
.profile-menu-card.is-green .profile-menu-card__icon { background: #e9fbf1; color: #15a765; }
.profile-menu-card.is-orange .profile-menu-card__icon { background: #fff0e5; color: #f07923; }
.profile-menu-card.is-pink .profile-menu-card__icon { background: #fdeaf2; color: #e81e70; }
.profile-menu-card.is-red .profile-menu-card__icon { background: #fdecef; color: #db2857; }

.profile-side-panel {
  display: grid;
  gap: 14px;
}

.profile-region-card,
.profile-interest-card,
.profile-edit-card {
  display: grid;
  gap: 12px;
  border: 1px solid var(--color-border);
  border-radius: 16px;
  background: #fff;
  padding: 18px;
  box-shadow: var(--shadow-card);
}

.profile-region-card > svg {
  color: var(--color-red);
}

.profile-interest-card > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.profile-interest-card span {
  color: var(--color-red);
  font-size: 12px;
  font-weight: 900;
}

.profile-interest-card a {
  color: var(--color-red);
  font-size: 12px;
  font-weight: 900;
}

.profile-interest-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.profile-interest-chips span {
  border-radius: 999px;
  background: var(--color-red-soft);
  padding: 7px 10px;
}

.profile-interest-action {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgb(152 40 154 / 34%);
  border-radius: 12px;
}

.interests-page {
  gap: 16px;
}

.interests-heading {
  text-align: center;
}

.interests-heading small {
  color: var(--color-muted);
  font-size: 13px;
  line-height: 1.5;
}

.interests-copy--desktop {
  display: none;
}

.interests-card {
  display: grid;
  gap: 18px;
  border: 1px solid var(--color-border);
  border-radius: 18px;
  background: #fff;
  padding: 16px;
  box-shadow: var(--shadow-card);
}

.interests-card__header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
}

.interests-card__header h2,
.interests-card__header p {
  margin: 0;
}

.interests-card__header h2 {
  color: var(--color-text);
  font-size: 18px;
  font-weight: 900;
}

.interests-card__header p {
  margin-top: 4px;
  color: var(--color-muted);
  font-size: 12px;
}

.interest-category-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.interest-category-card {
  position: relative;
  display: grid;
  min-height: 100px;
  justify-items: center;
  align-content: center;
  gap: 8px;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: #fff;
  color: var(--color-text);
  padding: 12px 8px;
  text-align: center;
  box-shadow: 0 10px 24px rgb(15 23 42 / 4%);
}

.interest-category-card__icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 999px;
  background: #f5f6f8;
  color: #657082;
}

.interest-category-card__check {
  position: absolute;
  top: 8px;
  right: 8px;
  display: none;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 999px;
  background: var(--color-red);
  color: #fff;
}

.interest-category-card strong {
  color: inherit;
  font-size: 12px;
  font-weight: 900;
}

.interest-category-card.is-selected {
  border-color: var(--color-red);
  background: #fbf1fd;
  box-shadow: 0 14px 30px rgb(152 40 154 / 12%);
}

.interest-category-card.is-selected .interest-category-card__icon {
  background: #f1e1f7;
  color: var(--color-red);
}

.interest-category-card.is-selected .interest-category-card__check {
  display: grid;
}

.interests-more-button {
  justify-self: center;
  border: 0;
  background: transparent;
  color: var(--color-red);
  font-size: 13px;
  font-weight: 900;
}

.interest-empty-note {
  border-radius: 12px;
  background: #f7f8fb;
  color: var(--color-muted);
  padding: 12px 14px;
  font-size: 13px;
  text-align: center;
}

.interests-save-bar {
  position: sticky;
  z-index: 12;
  bottom: calc(var(--bottom-nav-height, 92px) + env(safe-area-inset-bottom) + 12px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--color-border);
  border-radius: 16px;
  background: rgb(255 255 255 / 94%);
  padding: 10px;
  box-shadow: 0 18px 50px rgb(15 23 42 / 14%);
  backdrop-filter: blur(16px);
}

.interests-save-bar span {
  color: var(--color-text);
  font-size: 13px;
  font-weight: 800;
}

.interests-save-bar button {
  min-width: 132px;
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  background: var(--color-red);
  color: #fff;
  font-size: 14px;
  font-weight: 900;
}

.interests-save-bar button:disabled {
  opacity: .68;
}

.profile-edit-heading a {
  justify-self: start;
  color: var(--color-red);
  font-size: 14px;
  font-weight: 900;
}

.profile-edit-card {
  gap: 18px;
}

.profile-avatar-editor {
  display: grid;
  justify-items: center;
  gap: 10px;
  border-radius: 16px;
  background: linear-gradient(135deg, #fbf6fc, #f7eff9);
  padding: 24px;
  text-align: center;
}

.profile-avatar-editor label span {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  border-radius: 999px;
  background: var(--color-red);
  color: #fff;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}

.profile-avatar-editor small,
.profile-field small {
  color: var(--color-muted);
  font-size: 12px;
}

.profile-form-grid {
  display: grid;
  gap: 14px;
}

.profile-location-section {
  display: grid;
  gap: 12px;
}

.profile-location-section h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 18px;
}

.profile-field {
  display: grid;
  gap: 7px;
}

.profile-field > span {
  color: var(--color-text);
  font-size: 13px;
  font-weight: 900;
}

.profile-field input,
.profile-field textarea,
.profile-field select {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: #fff;
  color: var(--color-text);
  padding: 0 13px;
  font: inherit;
  font-size: 14px;
  outline: 0;
}

.profile-field textarea {
  min-height: 110px;
  padding-top: 12px;
  resize: vertical;
}

.profile-field input:read-only {
  color: var(--color-muted);
  background: #f8f9fb;
}

.profile-field input:focus,
.profile-field textarea:focus,
.profile-field select:focus {
  border-color: rgb(152 40 154 / 62%);
  box-shadow: 0 0 0 4px rgb(152 40 154 / 10%);
}

.profile-field small.is-error,
.profile-form-alert {
  color: #b42343;
  font-weight: 800;
}

.profile-form-alert {
  border: 1px solid #f3c6c6;
  border-radius: 12px;
  background: #fff2f2;
  padding: 12px 14px;
  font-size: 13px;
}

.profile-form-alert.is-success {
  border-color: #bae6ca;
  background: #eefaf2;
  color: #168653;
}

.profile-save-button {
  min-height: 50px;
  border: 0;
  background: var(--color-red);
  color: #fff;
}

.saved-list {
  display: grid;
  gap: 12px;
}

.saved-news-card {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr) 44px;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: #fff;
  padding: 10px;
  box-shadow: var(--shadow-card);
}

.saved-news-card__media img {
  display: block;
  width: 100%;
  aspect-ratio: 1.35 / 1;
  border-radius: 10px;
  object-fit: cover;
}

.saved-news-card__body {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.saved-news-card__body > span {
  justify-self: start;
  border-radius: 999px;
  background: var(--color-red-soft);
  color: var(--color-red);
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 900;
}

.saved-news-card h2 {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--color-text);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.saved-news-card time {
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 700;
}

.saved-empty {
  display: grid;
  justify-items: center;
  gap: 12px;
  border: 1px solid var(--color-border);
  border-radius: 18px;
  background: #fff;
  padding: 34px 22px;
  text-align: center;
  box-shadow: var(--shadow-card);
}

.saved-empty > span {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border-radius: 18px;
  background: var(--color-red-soft);
  color: var(--color-red);
}

.saved-empty h2,
.saved-empty p {
  margin: 0;
}

.saved-empty h2 {
  color: var(--color-text);
  font-size: 21px;
  font-weight: 900;
}

.saved-empty p {
  max-width: 360px;
  color: var(--color-muted);
  font-size: 14px;
  line-height: 1.5;
}

.saved-empty a,
.saved-more-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--color-red);
  color: #fff;
  padding: 0 18px;
  font-size: 13px;
  font-weight: 900;
}

.history-heading {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

.history-heading a,
.history-heading h1,
.history-heading p {
  grid-column: 1;
}

.history-heading button {
  grid-column: 2;
  grid-row: 2 / span 2;
  min-height: 40px;
  border-radius: 999px;
  background: #fff;
  color: var(--color-red);
  padding: 0 14px;
  font-size: 12px;
  font-weight: 900;
  box-shadow: var(--shadow-card);
}

.history-groups {
  display: grid;
  gap: 22px;
}

.history-group {
  display: grid;
  gap: 10px;
}

.history-group > h2 {
  margin: 0;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
}

.history-remove-button {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 999px;
  background: transparent;
  color: #9aa1ad;
}

.history-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  background: rgb(17 19 24 / 34%);
  padding: 20px;
}

.history-modal {
  position: relative;
  display: grid;
  gap: 12px;
  width: min(100%, 420px);
  border-radius: 18px;
  background: #fff;
  padding: 24px;
  box-shadow: 0 24px 80px rgb(17 19 24 / 24%);
}

.history-modal > button:first-child {
  position: absolute;
  top: 12px;
  right: 12px;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 50%;
  background: #f4f5f7;
}

.history-modal h2,
.history-modal p {
  margin: 0;
}

.history-modal h2 {
  padding-right: 34px;
  color: var(--color-text);
  font-size: 20px;
  font-weight: 900;
  line-height: 1.25;
}

.history-modal p {
  color: var(--color-muted);
  font-size: 14px;
  line-height: 1.45;
}

.history-modal div {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 8px;
}

.history-modal div button {
  min-height: 42px;
  border-radius: 999px;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 900;
}

.history-modal div button:first-child {
  background: #f4f5f7;
  color: var(--color-text);
}

.history-modal div button:last-child {
  background: var(--color-red);
  color: #fff;
}

.public-imprint-page {
  padding-top: 28px;
}

.public-imprint-heading h1 {
  position: relative;
  margin: 14px 0 26px;
  color: var(--color-text);
  font-size: 34px;
  font-weight: 900;
}

.public-imprint-heading h1::after {
  position: absolute;
  bottom: -12px;
  left: 0;
  width: 42px;
  height: 4px;
  border-radius: 999px;
  background: #e31d2b;
  content: "";
}

.public-imprint-card {
  margin-top: 20px;
  border: 1px solid var(--color-divider);
  border-radius: 14px;
  background: #fff;
  padding: 28px;
  box-shadow: 0 18px 50px rgb(17 19 24 / 6%);
}

.public-imprint-card h2 {
  margin: 0 0 16px;
  color: var(--color-text);
  font-size: 22px;
  font-weight: 900;
}

.public-imprint-card p {
  margin: 0 0 10px;
  color: #303640;
  font-size: 15px;
  line-height: 1.65;
}

.public-imprint-about {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 26px;
  align-items: center;
}

.public-imprint-icon {
  display: grid;
  width: 86px;
  height: 86px;
  place-items: center;
  border-radius: 50%;
  background: #fff1f2;
  color: #e31d2b;
  font-size: 42px;
  font-weight: 900;
}

.public-imprint-contact-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.85fr);
  gap: 28px;
  align-items: center;
}

.public-imprint-contact-card img,
.public-imprint-image-placeholder {
  width: 100%;
  aspect-ratio: 1.55;
  border-radius: 12px;
  object-fit: cover;
}

.public-imprint-image-placeholder {
  background: linear-gradient(135deg, #f2f4f7, #d9e1eb);
}

.public-imprint-contact-list {
  display: grid;
  gap: 14px;
}

.public-imprint-contact-list p,
.public-imprint-contact-list a {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin: 0;
  color: var(--color-text);
}

.public-imprint-contact-list strong {
  display: block;
  margin-bottom: 3px;
  font-size: 12px;
  font-weight: 900;
}

.public-imprint-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 24px;
  margin: 0;
}

.public-imprint-list div,
.public-imprint-people article,
.public-imprint-socials a {
  border: 1px solid var(--color-divider);
  border-radius: 10px;
  background: #fbfcfe;
  padding: 14px;
}

.public-imprint-list dt,
.public-imprint-people span {
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 800;
}

.public-imprint-list dd {
  margin: 5px 0 0;
  color: var(--color-text);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.45;
}

.public-imprint-people,
.public-imprint-socials {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.public-imprint-people strong,
.public-imprint-socials strong {
  display: block;
  margin-top: 6px;
  color: var(--color-text);
  font-size: 15px;
  font-weight: 900;
}

.public-imprint-people small,
.public-imprint-socials span {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 700;
}

.site-footer {
  margin-top: 46px;
  background: #07111d;
  color: #fff;
  padding: 34px var(--container-x) calc(24px + env(safe-area-inset-bottom));
}

.site-footer__inner {
  display: grid;
  grid-template-columns: 1.25fr 0.8fr 1fr 1.05fr;
  gap: 34px;
  max-width: 1200px;
  margin: 0 auto;
}

.site-footer h2 {
  margin: 0 0 13px;
  color: #fff;
  font-size: 14px;
  font-weight: 900;
}

.site-footer p,
.site-footer a,
.site-footer span {
  color: #c3ccd8;
  font-size: 13px;
  line-height: 1.55;
}

.site-footer a:hover {
  color: #e31d2b;
}

.site-footer__logo img {
  max-width: 150px;
  max-height: 44px;
  object-fit: contain;
}

.site-footer__socials {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.site-footer__socials a {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 50%;
  background: rgb(255 255 255 / 8%);
}

.site-footer__links,
.site-footer__contact {
  display: grid;
  align-content: start;
  gap: 7px;
}

.site-footer__links .is-disabled {
  opacity: 0.45;
}

.site-footer__contact p,
.site-footer__contact a {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  margin: 0;
}

.site-footer__bottom {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: center;
  max-width: 1200px;
  margin: 28px auto 0;
  border-top: 1px solid rgb(255 255 255 / 10%);
  padding-top: 18px;
  color: #95a1b2;
  font-size: 12px;
}

.site-footer__bottom span:nth-child(2) {
  text-align: center;
}

.site-footer__bottom span:nth-child(3) {
  text-align: right;
}

.site-footer__bottom a {
  color: #d7dde7;
  font-weight: 800;
}

.category-detail-page {
  padding-top: 0;
}

.category-detail-ad {
  margin: 15px 0 18px;
}

.site-shell--category .site-header {
  display: none;
}

.category-detail-header {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: var(--header-height);
  margin: 0 calc(var(--container-x) * -1);
  border-bottom: 1px solid var(--color-divider);
  background: rgb(248 249 251 / 92%);
  padding: 0 var(--container-x);
  backdrop-filter: blur(18px);
}

.category-detail-header h1 {
  margin: 0;
  color: var(--color-text);
  font-size: 19px;
  font-weight: 800;
  line-height: 24px;
  text-align: center;
}

.category-detail-brand {
  justify-self: center;
  min-height: 38px;
  font-size: 30px;
}

.category-detail-brand img {
  width: 175px;
  height: auto;
  max-height: 47px;
}

.category-detail-brand .brand__domain {
  font-size: 19px;
}

.category-detail-header__actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.category-detail-header__icon {
  position: relative;
  display: grid;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  place-items: center;
  border-radius: 50%;
  background: transparent;
  color: var(--color-text);
}

.category-detail-header__icon--badge::after {
  position: absolute;
  top: 5px;
  right: 3px;
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  border-radius: 999px;
  background: var(--color-red);
  color: #fff;
  content: "7";
  font-size: 10px;
  font-weight: 800;
}

.category-seo-heading {
  margin: 0 0 14px;
}

.category-seo-heading h1 {
  margin: 0;
  color: var(--color-text);
  font-size: 24px;
  font-weight: 800;
  line-height: 30px;
  letter-spacing: 0;
}

.category-seo-heading p {
  margin: 5px 0 0;
  color: var(--color-muted);
  font-size: 13px;
  line-height: 19px;
}

.category-filter-rail {
  display: flex;
  gap: 9px;
  margin: 0 calc(var(--container-x) * -1) 16px;
  padding: 4px var(--container-x) 2px;
  overflow-x: auto;
  scrollbar-width: none;
}

.category-filter-rail::-webkit-scrollbar {
  display: none;
}

.category-filter-chip {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #f0f1f4;
  color: var(--color-text);
  padding: 0 14px;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
}

.category-filter-chip.is-active {
  background: #08090b;
  color: #fff;
}

.category-filter-chip--icon {
  width: 36px;
  min-width: 36px;
  padding: 0;
  background: #fff;
  box-shadow: 0 6px 16px rgb(17 19 24 / 6%);
}

.category-hero-carousel {
  position: relative;
  padding-bottom: 22px;
}

.category-hero-card {
  position: relative;
  display: block;
  overflow: hidden;
  min-height: 280px;
  border-radius: 16px;
  background: #d9dde4;
  touch-action: pan-y;
  user-select: none;
}

.category-hero-card img {
  display: block;
  width: 100%;
  height: 280px;
  object-fit: cover;
}

.category-hero-card__shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgb(0 0 0 / 0%) 18%, rgb(0 0 0 / 72%) 100%);
}

.category-hero-card__content {
  position: absolute;
  right: 16px;
  bottom: 38px;
  left: 16px;
  color: #fff;
}

.category-hero-card__content span {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  border-radius: 5px;
  background: var(--color-red);
  padding: 0 8px;
  font-size: 10px;
  font-weight: 800;
}

.category-hero-card__content h2 {
  max-width: 360px;
  margin: 8px 0 6px;
  font-size: 22px;
  font-weight: 800;
  line-height: 27px;
  letter-spacing: 0;
}

.category-hero-dots {
  position: absolute;
  bottom: 0;
  left: 50%;
  display: inline-flex;
  gap: 8px;
  transform: translateX(-50%);
}

.category-hero-dots button {
  width: 8px;
  height: 8px;
  min-width: 8px;
  min-height: 8px;
  border: 0;
  border-radius: 50%;
  background: #c6cad2;
  padding: 0;
}

.category-hero-dots .is-active {
  background: var(--color-red);
}

.category-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 22px 4px 8px;
}

.category-section-title h2 {
  margin: 0;
  color: var(--color-text);
  font-size: 16px;
  font-weight: 800;
  line-height: 22px;
}

.category-section-title a {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: #333842;
  font-size: 12px;
  font-weight: 600;
}

.category-news-list {
  display: grid;
}

.category-news-row {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) 132px;
  gap: 12px;
  min-width: 0;
  border-bottom: 1px solid var(--color-divider);
  padding: 12px 0 14px;
}

.category-news-time {
  position: relative;
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  padding-top: 4px;
  color: var(--color-muted);
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
}

.category-news-time::after {
  position: absolute;
  top: 18px;
  bottom: -18px;
  left: 4px;
  width: 1px;
  background: var(--color-divider);
  content: "";
}

.category-news-dot {
  position: relative;
  z-index: 1;
  width: 9px;
  height: 9px;
  margin-top: 3px;
  border-radius: 50%;
  background: #c6cad2;
}

.category-news-dot.is-active {
  background: var(--color-red);
}

.category-news-row__body {
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
}

.category-news-row__body h3 {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--color-text);
  font-size: 17px;
  font-weight: 700;
  line-height: 22px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.category-news-row__body p {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--color-muted);
  font-size: 12px;
  line-height: 17px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.category-news-tag {
  justify-self: start;
  border-radius: 6px;
  background: var(--color-red-soft);
  color: var(--color-red);
  padding: 4px 7px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

.category-news-row__media img {
  display: block;
  width: 132px;
  height: 84px;
  border-radius: 10px;
  object-fit: cover;
  background: #eef0f4;
}

.summary-overlay {
  position: fixed;
  inset: 0;
  z-index: 100;
  padding: calc(env(safe-area-inset-top) + 20px) 16px calc(env(safe-area-inset-bottom) + 20px);
  background: rgb(17 19 24 / 34%);
}

.summary-sheet {
  position: fixed;
  top: 50%;
  left: 50%;
  width: min(calc(100vw - 48px), 540px);
  margin: 0;
  max-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 40px);
  overflow-y: auto;
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background: #fff;
  padding: 16px 18px 20px;
  box-shadow: 0 22px 58px rgb(17 19 24 / 20%);
  transform: translate(-50%, -50%);
}

.summary-sheet__handle {
  display: none;
}

.summary-sheet__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.summary-sheet__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  color: var(--color-red);
  font-size: 12px;
  font-weight: 700;
}

.summary-sheet h2 {
  margin: 0;
  font-size: 18px;
  line-height: 24px;
}

.summary-sheet__header {
  border-bottom: 1px solid var(--color-divider);
  padding-bottom: 14px;
}

.summary-sheet__header button {
  display: grid;
  width: 38px;
  height: 38px;
  min-width: 38px;
  min-height: 38px;
  place-items: center;
  border-radius: 50%;
  background: #eef0f4;
  padding: 0;
  font-size: 24px;
  line-height: 1;
}

.summary-sheet__header button svg {
  display: block;
  margin: auto;
}

.summary-sheet__content {
  display: grid;
  gap: 14px;
  margin: 20px 0 0;
  color: #242832;
}

.summary-sheet__summary,
.summary-status {
  margin: 0;
  color: #242832;
  font-size: 15px;
  line-height: 23px;
}

.summary-sheet h3 {
  margin: 4px 0 -4px;
  color: var(--color-text);
  font-size: 13px;
  line-height: 18px;
}

.summary-sheet .summary-article-title {
  margin: 0;
  border-bottom: 1px solid var(--color-divider);
  padding-bottom: 12px;
  color: var(--color-text);
  font-size: 20px;
  font-weight: 800;
  line-height: 26px;
}

.summary-sheet ul {
  display: grid;
  gap: 9px;
  margin: 0;
  padding-left: 19px;
  color: #333842;
  font-size: 14px;
  line-height: 21px;
}

.summary-sheet dl {
  display: grid;
  gap: 8px;
  margin: 0;
}

.summary-sheet dl div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--color-divider);
  padding-bottom: 8px;
}

.summary-sheet dt,
.summary-sheet dd {
  margin: 0;
  font-size: 13px;
  line-height: 18px;
}

.summary-sheet dt {
  color: var(--color-muted);
  font-weight: 600;
}

.summary-sheet dd {
  color: var(--color-text);
  font-weight: 700;
  text-align: right;
}

.summary-skeleton {
  display: grid;
  gap: 9px;
}

.summary-skeleton span {
  display: block;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, #eef0f4, #f8f9fb, #eef0f4);
}

.summary-skeleton span:nth-child(2) {
  width: 86%;
}

.summary-skeleton span:nth-child(3) {
  width: 64%;
}

.summary-sheet__footer {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.summary-read-link {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 999px;
  background: #17191f;
  color: #fff;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 700;
}

.summary-sheet__footer p {
  margin: 0;
  color: var(--color-muted);
  font-size: 11px;
  line-height: 16px;
}

.bottom-nav {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 30;
  padding-bottom: env(safe-area-inset-bottom);
  pointer-events: none;
  transition: transform 220ms ease;
  will-change: transform;
}

.bottom-nav.is-hidden {
  transform: translateY(calc(100% + 16px));
}

.bottom-nav__inner {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  min-height: 88px;
  max-width: none;
  margin: 0 auto;
  padding: 8px max(18px, env(safe-area-inset-left)) calc(22px + env(safe-area-inset-bottom));
  border: 1px solid var(--color-border);
  border-bottom: 0;
  border-radius: 30px 30px 0 0;
  background: rgb(255 255 255 / 98%);
  box-shadow: 0 14px 36px rgb(17 19 24 / 10%);
  backdrop-filter: blur(18px);
  overflow: visible;
  pointer-events: auto;
}

.bottom-nav__item {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 50px;
  place-items: center;
  align-content: center;
  gap: 4px;
  border-radius: 14px;
  color: #30343b;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.1;
}

.bottom-nav__item.is-active {
  color: var(--color-red);
}

.bottom-nav__icon {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
}

.bottom-nav__bursa-icon {
  display: block;
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.bottom-nav__mahallenden-icon {
  width: 36px;
  height: 40px;
}

.bottom-nav__item--summary {
  position: relative;
  align-content: end;
  min-height: 50px;
}

.bottom-nav__item--summary::before {
  position: absolute;
  top: -42px;
  left: 50%;
  z-index: 0;
  width: 82px;
  height: 82px;
  border-radius: 50%;
  background: rgb(255 255 255 / 98%);
  content: "";
  transform: translateX(-50%);
}

.bottom-nav__item--summary .bottom-nav__icon {
  position: absolute;
  top: -34px;
  left: 50%;
  z-index: 1;
  display: grid;
  width: 66px;
  height: 66px;
  place-items: center;
  border-radius: 50%;
  background: var(--color-red);
  color: #fff;
  transform: translateX(-50%);
}

.bottom-nav__item--summary .bottom-nav__bursa-icon {
  width: 65px;
  height: 65px;
}

.bottom-nav__item--summary .bottom-nav__mahallenden-icon {
  width: 38px;
  height: 44px;
  object-fit: contain;
}

.bottom-nav__item--summary .bottom-nav__label {
  position: relative;
  z-index: 1;
  color: var(--color-red);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.bottom-nav__item--mahallenden-summary .bottom-nav__label {
  max-width: 96px;
  font-size: 12px;
}

.bottom-nav__item--mahallenden-summary .bottom-nav__icon {
  animation: mahallenden-nav-pulse 2.4s ease-in-out infinite;
  box-shadow:
    0 0 0 0 rgb(152 40 154 / 28%),
    0 12px 24px rgb(152 40 154 / 24%);
}

.bottom-nav__item--mahallenden-summary .bottom-nav__mahallenden-icon {
  animation: mahallenden-nav-float 2.4s ease-in-out infinite;
}

.bottom-nav__item--mahallenden-summary:hover .bottom-nav__icon,
.bottom-nav__item--mahallenden-summary:focus-visible .bottom-nav__icon {
  animation-duration: 1.35s;
}

.bottom-nav__item--mahallenden-summary:active .bottom-nav__icon {
  transform: translateX(-50%) scale(0.94);
}

.bottom-nav__item--bursa-link {
  color: #383844;
}

.bottom-nav__item--bursa-link:hover,
.bottom-nav__item--bursa-link:focus-visible,
.bottom-nav__item--bursa-link.is-active {
  color: #a12aa6;
}

.bottom-nav__item--bursa-link .bottom-nav__icon {
  width: 30px;
  height: 30px;
}

.bottom-nav__item--bursa-link .bottom-nav__bursa-icon {
  width: 30px;
  height: 31px;
}

.bottom-nav__bursa-icon-wrap {
  position: relative;
  display: block;
  width: 30px;
  height: 31px;
}

.bottom-nav__bursa-icon-wrap .bottom-nav__bursa-icon {
  position: absolute;
  inset: 0;
  transition: opacity 160ms ease;
}

.bottom-nav__bursa-icon--active {
  opacity: 0;
}

.bottom-nav__item--bursa-link:hover .bottom-nav__bursa-icon--default,
.bottom-nav__item--bursa-link:focus-visible .bottom-nav__bursa-icon--default,
.bottom-nav__item--bursa-link.is-active .bottom-nav__bursa-icon--default {
  opacity: 0;
}

.bottom-nav__item--bursa-link:hover .bottom-nav__bursa-icon--active,
.bottom-nav__item--bursa-link:focus-visible .bottom-nav__bursa-icon--active,
.bottom-nav__item--bursa-link.is-active .bottom-nav__bursa-icon--active {
  opacity: 1;
}

.bottom-nav__label {
  overflow: hidden;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bottom-nav__credits {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  align-items: center;
  min-height: 22px;
  margin: 2px -4px -12px;
  padding: 5px 12px 0;
  border-top: 1px solid var(--color-divider);
  color: #7d8795;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
}

.bottom-nav__credits a {
  color: inherit;
  text-decoration: none;
}

.bottom-nav__credits a:first-child {
  color: inherit;
  font-weight: 600;
}

.bottom-nav__separator {
  color: #a9b0bb;
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-weight: 400;
}

.bottom-nav__tagline {
  color: #8b94a3;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 12px;
  font-style: italic;
  font-weight: 500;
  letter-spacing: 0;
}

.bottom-nav__credits a:last-child {
  justify-self: end;
}

.bottom-nav__credits a:hover,
.bottom-nav__credits a:focus-visible {
  color: var(--color-red);
}

@keyframes mahallenden-nav-pulse {
  0%,
  100% {
    box-shadow:
      0 0 0 0 rgb(152 40 154 / 24%),
      0 12px 24px rgb(152 40 154 / 24%);
    transform: translateX(-50%) scale(1);
  }

  48% {
    box-shadow:
      0 0 0 10px rgb(152 40 154 / 0%),
      0 16px 30px rgb(152 40 154 / 30%);
    transform: translateX(-50%) scale(1.04);
  }
}

@keyframes mahallenden-nav-float {
  0%,
  100% {
    transform: translateY(0);
  }

  48% {
    transform: translateY(-2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .bottom-nav {
    transition: none;
  }

  .bottom-nav__item--mahallenden-summary .bottom-nav__icon,
  .bottom-nav__item--mahallenden-summary .bottom-nav__mahallenden-icon {
    animation: none;
  }
}

.admin-shell {
  --admin-red: #e31d2b;
  --admin-sidebar: #0d1621;
  --admin-sidebar-soft: #121f2d;
  --admin-bg: #f7f8fa;
  --admin-card: #fff;
  --admin-text: #111318;
  --admin-muted: #6e737c;
  --admin-border: #e7e9ed;
  --admin-shadow: 0 12px 34px rgb(17 19 24 / 6%);
  display: grid;
  min-height: 100dvh;
  background: var(--admin-bg);
  color: var(--admin-text);
}

.admin-body {
  display: grid;
  min-width: 0;
  min-height: 100dvh;
  background: var(--admin-bg);
  color: var(--admin-text);
  overflow-x: hidden;
}

.admin-main {
  min-width: 0;
  max-width: 100vw;
  padding: 28px 18px 56px;
}

.admin-heading,
.admin-header {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.admin-form,
.form-grid {
  display: grid;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  gap: 16px;
}

.admin-form label,
.form-grid label {
  display: grid;
  min-width: 0;
  gap: 7px;
  color: var(--admin-text);
  font-weight: 800;
}

.admin-form input,
.admin-form select,
.admin-form textarea,
.form-grid input,
.form-grid select,
.form-grid textarea {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.admin-form .checkbox-row,
.form-grid .check {
  display: flex;
  align-items: center;
}

.admin-form .checkbox-row input,
.form-grid .check input {
  width: auto;
}

.admin-table-wrap,
.admin-table {
  max-width: 100%;
}

.admin-table-wrap {
  overflow-x: auto;
}

@media (min-width: 1024px) {
  .admin-body {
    grid-template-columns: 280px minmax(0, 1fr);
  }

  .admin-body .admin-sidebar {
    position: sticky;
    top: 0;
    height: 100dvh;
    transform: none;
  }

  .admin-main {
    grid-column: 2;
    max-width: calc(100vw - 280px);
    padding: 32px 32px 56px;
  }
}

.admin-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 90;
  width: 280px;
  background:
    radial-gradient(circle at 70% 12%, rgb(227 29 43 / 16%), transparent 32%),
    linear-gradient(180deg, #0b121c, var(--admin-sidebar));
  color: #dce2ea;
  padding: 26px 18px;
  overflow-y: auto;
  transform: translateX(-100%);
  transition: transform 180ms ease;
  scrollbar-width: none;
}

.admin-sidebar::-webkit-scrollbar {
  display: none;
}

.admin-shell.is-sidebar-open .admin-sidebar {
  transform: translateX(0);
}

.admin-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
  background: rgb(13 22 33 / 48%);
}

.admin-shell.is-sidebar-open .admin-backdrop {
  display: block;
}

.admin-logo {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  color: #fff;
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
}

.admin-logo span {
  color: var(--admin-red);
}

.admin-nav-link-with-badge {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.admin-unread-badge,
.admin-new-badge {
  display: inline-flex;
  min-width: 20px;
  min-height: 20px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  padding: 0 7px;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.admin-new-badge {
  min-height: 18px;
  margin-left: 6px;
  background: #fee2e2;
  color: #b91c1c;
}

.admin-table tr.is-admin-unseen td {
  background: #fff7f7;
}

.admin-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.admin-new-problems__list {
  display: grid;
  gap: 10px;
}

.admin-new-problems__list article,
.admin-mail-status {
  display: grid;
  gap: 6px;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: #fff;
  padding: 12px;
}

.admin-new-problems__list span,
.admin-new-problems__list small,
.admin-mail-status span {
  color: var(--admin-muted);
}

.admin-sidebar__nav {
  display: grid;
  align-content: start;
  gap: 8px;
  margin-top: 38px;
}

.admin-sidebar__nav > p {
  margin: 0 0 10px 10px;
  color: #8b96a5;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
}

.admin-nav-group {
  display: grid;
  gap: 4px;
}

.admin-nav-item {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto auto;
  min-height: 44px;
  align-items: center;
  gap: 10px;
  border-radius: 10px;
  color: #dce2ea;
  padding: 0 12px;
  font-size: 14px;
  font-weight: 700;
}

.admin-nav-item svg {
  color: #aeb7c4;
}

.admin-nav-item.is-active {
  background: linear-gradient(135deg, #ad1f2b, var(--admin-red));
  color: #fff;
}

.admin-nav-item.is-active svg {
  color: #fff;
}

.admin-nav-item--mahallenden:not(.is-active) {
  color: #ff6a2a;
}

.admin-nav-item--mahallenden:not(.is-active) svg {
  color: #ff6a2a;
}

.admin-nav-item--mahallenden.is-active {
  background: linear-gradient(135deg, #ff4b12, #e23610);
}

.admin-nav-item strong {
  display: grid;
  min-width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 999px;
  background: var(--admin-red);
  color: #fff;
  font-size: 11px;
}

.admin-nav-item .is-open {
  transform: rotate(180deg);
}

.admin-subnav {
  display: grid;
  gap: 2px;
  padding: 4px 0 8px 44px;
}

.admin-subnav a {
  min-height: 34px;
  color: #adb7c5;
  font-size: 13px;
  font-weight: 600;
  line-height: 34px;
}

.admin-subnav a.is-active {
  color: #fff;
  font-weight: 800;
}

.admin-main-shell {
  min-width: 0;
}

.admin-topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  min-height: 64px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--admin-border);
  background: rgb(255 255 255 / 90%);
  padding: 0 18px;
  backdrop-filter: blur(18px);
}

.admin-topbar__left,
.admin-topbar__right {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.admin-topbar__left button,
.admin-notification {
  display: grid;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  place-items: center;
  border-radius: 10px;
  background: transparent;
  color: var(--admin-text);
  padding: 0;
}

.admin-topbar__left span {
  font-size: 13px;
  font-weight: 800;
}

.admin-notification {
  position: relative;
}

.admin-notification span {
  position: absolute;
  top: 5px;
  right: 4px;
  display: grid;
  width: 17px;
  height: 17px;
  place-items: center;
  border-radius: 999px;
  background: var(--admin-red);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
}

.admin-user {
  display: none;
  align-items: center;
  gap: 10px;
}

.admin-user img,
.admin-user__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}

.admin-user__avatar {
  display: inline-grid;
  place-items: center;
  background: #f4e6f6;
  color: var(--admin-purple);
  font-size: 13px;
  font-weight: 800;
}

.admin-user > span:not(.admin-user__avatar) {
  display: grid;
  gap: 2px;
}

.admin-user strong {
  font-size: 12px;
  line-height: 15px;
}

.admin-user small {
  color: var(--admin-muted);
  font-size: 11px;
  line-height: 13px;
}

.admin-page {
  padding: 22px var(--container-x) 44px;
}

.admin-page form {
  display: grid;
  gap: 22px;
}

.admin-page-header {
  display: grid;
  gap: 18px;
}

.admin-page-header__title {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.admin-page-header__title > button {
  display: grid;
  width: 38px;
  height: 38px;
  min-width: 38px;
  min-height: 38px;
  place-items: center;
  border-radius: 10px;
  background: transparent;
  color: #4a5360;
  padding: 0;
}

.admin-page-header h1 {
  margin: 0;
  color: var(--admin-text);
  font-size: 26px;
  font-weight: 900;
  line-height: 32px;
}

.admin-page-header p {
  margin: 4px 0 0;
  color: var(--admin-muted);
  font-size: 13px;
  line-height: 18px;
}

.admin-page-header__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.admin-success-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  border: 1px solid #bbf7d0;
  border-radius: 14px;
  background: #f0fdf4;
  color: #166534;
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 800;
}

.admin-success-actions a {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  border-radius: 999px;
  background: #fff;
  color: #15803d;
  padding: 0 12px;
  box-shadow: inset 0 0 0 1px rgb(21 128 61 / 14%);
}

.admin-edit-back {
  display: grid;
  width: 38px;
  height: 38px;
  min-width: 38px;
  min-height: 38px;
  place-items: center;
  border-radius: 10px;
  background: transparent;
  color: #4a5360;
  padding: 0;
}

.admin-button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #fff;
  color: var(--admin-text);
  padding: 0 16px;
  font-size: 13px;
  font-weight: 800;
}

.admin-button--primary {
  border-color: #0f1420;
  background: #0f1420;
  color: #fff;
}

.admin-button--icon {
  width: 44px;
  padding: 0;
}

.admin-split-button {
  position: relative;
  display: inline-flex;
  gap: 1px;
}

.admin-split-button .admin-button:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.admin-split-button .admin-button--icon {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.admin-split-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 8;
  display: none;
  width: 190px;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: #fff;
  padding: 6px;
  box-shadow: var(--admin-shadow);
}

.admin-split-button:hover .admin-split-menu,
.admin-split-button:focus-within .admin-split-menu {
  display: grid;
}

.admin-split-menu button {
  min-height: 36px;
  border-radius: 8px;
  background: transparent;
  padding: 0 10px;
  text-align: left;
  font-size: 12px;
  font-weight: 700;
}

.admin-editor-grid {
  display: grid;
  gap: 18px;
}

.admin-editor-main,
.admin-editor-side {
  display: grid;
  align-content: start;
  gap: 18px;
  min-width: 0;
}

.admin-card {
  display: grid;
  gap: 20px;
  border: 1px solid var(--admin-border);
  border-radius: 14px;
  background: var(--admin-card);
  padding: 18px;
  box-shadow: var(--admin-shadow);
}

.admin-card h2 {
  margin: 0;
  color: var(--admin-text);
  font-size: 16px;
  font-weight: 900;
  line-height: 21px;
}

.admin-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.admin-card-header > span {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
  margin: 18px 0 28px;
}

.admin-stats article {
  display: grid;
  gap: 6px;
  border: 1px solid var(--admin-border);
  border-radius: 14px;
  background: var(--admin-card);
  box-shadow: var(--admin-shadow);
  padding: 16px;
}

.admin-stats span {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.admin-stats strong {
  color: var(--admin-text);
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
}

.admin-ai-news-center-page {
  display: grid;
  gap: 18px;
}

.flash.warning {
  border: 1px solid #f5c542;
  background: #fff8db;
  color: #5f4300;
}

.admin-ai-risk {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border-radius: 8px;
  padding: 2px 8px;
  font-size: 12px;
  font-weight: 800;
}

.admin-ai-risk--low {
  background: #e7f8ed;
  color: #136c37;
}

.admin-ai-risk--medium {
  background: #fff3d6;
  color: #755000;
}

.admin-ai-risk--high {
  background: #ffe4e2;
  color: #9c2018;
}

.admin-openai-alert {
  border: 1px solid #f2a39c;
  border-radius: 10px;
  background: #ffe4e2;
  color: #8b1d17;
  padding: 14px 16px;
  font-weight: 900;
}

.admin-health {
  display: inline-flex;
  align-items: center;
  min-width: 92px;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 950;
}

.admin-health--healthy {
  background: #e3f8eb;
  color: #176c3d;
}

.admin-health--degraded {
  background: #fff4d8;
  color: #8a5a00;
}

.admin-health--failing {
  background: #ffe4e2;
  color: #9c2018;
}

.admin-health--disabled,
.admin-health--unknown {
  background: #edf0f5;
  color: #596273;
}

.admin-table td small {
  display: block;
  margin-top: 3px;
  color: var(--admin-muted);
  font-weight: 700;
  white-space: nowrap;
}

.admin-openai-card {
  display: grid;
  gap: 16px;
  border: 1px solid var(--admin-border);
  border-left: 6px solid #177245;
  border-radius: 14px;
  background: #fff;
  padding: 18px;
  box-shadow: var(--admin-shadow);
}

.admin-openai-card > div {
  display: grid;
  gap: 4px;
}

.admin-openai-card span,
.admin-openai-card dt {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.admin-openai-card strong {
  color: var(--admin-text);
  font-size: 26px;
  line-height: 32px;
}

.admin-openai-card em {
  color: #9c2018;
  font-style: normal;
  font-weight: 950;
}

.admin-openai-card dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}

.admin-openai-card dl div {
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  padding: 10px;
}

.admin-openai-card dd {
  margin: 4px 0 0;
  color: var(--admin-text);
  font-size: 15px;
  font-weight: 900;
}

.admin-openai-card--dikkat {
  border-left-color: #d99a00;
}

.admin-openai-card--yüksek-kullanim,
.admin-openai-card--yuksek-kullanim {
  border-left-color: #d66a00;
}

.admin-openai-card--kritik {
  border-left-color: #b42318;
}

.admin-openai-usage-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.admin-openai-usage-grid article {
  display: grid;
  gap: 6px;
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  padding: 12px;
}

.admin-openai-usage-grid strong {
  color: var(--admin-text);
}

.admin-openai-usage-grid span {
  color: var(--admin-muted);
  font-size: 12px;
}

.admin-ai-robot-page {
  display: grid;
  gap: 18px;
}

.admin-ai-robot-icon {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: #fff;
  color: #0f1420;
  box-shadow: var(--admin-shadow);
}

.admin-ai-robot-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.admin-ai-stat-card {
  gap: 6px;
}

.admin-ai-stat-card strong {
  color: var(--admin-text);
  font-size: 28px;
  font-weight: 950;
  line-height: 32px;
}

.admin-ai-stat-card span {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-ai-overview-stats {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.admin-ai-table-wrap {
  border: 1px solid var(--admin-border);
  border-radius: 12px;
}

.admin-ai-table {
  width: 100%;
  border-collapse: collapse;
}

.admin-ai-table th,
.admin-ai-table td {
  border-bottom: 1px solid var(--admin-border);
  padding: 13px 14px;
  text-align: left;
  vertical-align: middle;
}

.admin-ai-table th {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-ai-table tr:last-child td {
  border-bottom: 0;
}

.admin-ai-source-form {
  margin-bottom: 18px;
}

.admin-ai-source-form__grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(280px, 1.4fr) minmax(190px, .8fr) minmax(120px, .5fr);
  gap: 14px;
}

.admin-ai-source-switches {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.admin-ai-source-switches .check {
  min-height: 36px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #f8fafc;
  padding: 7px 10px;
  font-size: 13px;
}

.admin-ai-source-form__actions {
  display: flex;
  justify-content: flex-end;
}

.admin-ai-source-list {
  display: grid;
  gap: 14px;
}

.admin-ai-source-card {
  grid-template-columns: minmax(280px, 1.4fr) minmax(260px, .9fr) minmax(220px, .85fr) auto;
  align-items: center;
  gap: 16px;
  padding: 16px;
}

.admin-ai-source-card__main {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, .85fr);
  gap: 14px;
  min-width: 0;
}

.admin-ai-source-card__main > div,
.admin-ai-source-health {
  display: grid;
  align-content: start;
  gap: 5px;
  min-width: 0;
}

.admin-ai-source-card__title {
  color: var(--admin-text);
  font-size: 17px;
  font-weight: 900;
  line-height: 22px;
}

.admin-ai-source-card__main span,
.admin-ai-source-health small {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-ai-source-url {
  overflow-wrap: anywhere;
  color: #394150;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.admin-ai-source-url:hover {
  color: var(--admin-red);
}

.admin-ai-source-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.admin-ai-source-metrics span {
  display: grid;
  gap: 2px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #f8fafc;
  padding: 9px;
  color: var(--admin-muted);
  font-size: 11px;
  font-weight: 800;
}

.admin-ai-source-metrics b {
  overflow: hidden;
  color: var(--admin-text);
  font-size: 14px;
  font-weight: 950;
  text-overflow: ellipsis;
}

.admin-ai-source-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.admin-ai-source-flags span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border-radius: 999px;
  background: #edf0f5;
  color: #596273;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 850;
}

.admin-ai-source-flags span.is-on {
  background: #e3f8eb;
  color: #176c3d;
}

.admin-ai-source-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.admin-ai-source-actions form {
  margin: 0;
}

.admin-ai-source-actions .button,
.admin-ai-source-actions button {
  min-height: 36px;
  white-space: nowrap;
}

.admin-ai-discovery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.admin-ai-discovery-grid .admin-card {
  gap: 6px;
  padding: 16px;
}

.admin-ai-discovery-grid span {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-ai-discovery-grid strong {
  color: var(--admin-text);
  font-size: 28px;
  font-weight: 950;
  line-height: 1;
}

.admin-ai-discovery-section {
  margin-bottom: 18px;
}

.admin-ai-discovery-list {
  display: grid;
  gap: 10px;
  max-height: 620px;
  overflow: auto;
  padding-right: 4px;
}

.admin-ai-discovery-item {
  display: grid;
  grid-template-columns: minmax(260px, 1.3fr) minmax(170px, .6fr) minmax(160px, .55fr) minmax(190px, .65fr);
  align-items: center;
  gap: 14px;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: #fbfcfe;
  padding: 12px;
}

.admin-ai-discovery-item__title,
.admin-ai-discovery-item__links {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.admin-ai-discovery-item__title strong {
  color: var(--admin-text);
  font-size: 14px;
  font-weight: 900;
  line-height: 19px;
}

.admin-ai-discovery-item__title span,
.admin-ai-discovery-item__issue {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-ai-discovery-item__status {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.admin-ai-discovery-item__links a,
.admin-ai-discovery-item__links span {
  overflow-wrap: anywhere;
  color: #394150;
  font-size: 12px;
  font-weight: 850;
  text-decoration: none;
}

.admin-ai-discovery-item__links a:hover {
  color: var(--admin-red);
}

.admin-ai-chip {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 26px;
  border-radius: 999px;
  background: #edf0f5;
  color: #596273;
  padding: 4px 9px;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  white-space: nowrap;
}

.admin-ai-chip--ok,
.admin-ai-chip--eligible,
.admin-ai-chip--completed,
.admin-ai-chip--published {
  background: #e3f8eb;
  color: #176c3d;
}

.admin-ai-chip--failed,
.admin-ai-chip--error,
.admin-ai-chip--rejected,
.admin-ai-chip--validation_failed {
  background: #ffe4e2;
  color: #9c2018;
}

.admin-ai-chip--processing,
.admin-ai-chip--pending,
.admin-ai-chip--discovered {
  background: #fff4d8;
  color: #8a5a00;
}

.admin-ai-discovery-columns {
  display: grid;
  gap: 18px;
}

.admin-ai-compact-table {
  min-width: 920px;
}

.admin-ai-url-cell,
.admin-ai-message-cell {
  max-width: 280px;
  overflow-wrap: anywhere;
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 750;
}

@media (max-width: 1280px) {
  .admin-ai-source-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-ai-source-actions {
    justify-content: flex-start;
  }

  .admin-ai-discovery-item {
    grid-template-columns: minmax(0, 1fr) minmax(160px, .45fr);
  }
}

@media (max-width: 860px) {
  .admin-ai-source-form__grid,
  .admin-ai-source-card__main,
  .admin-ai-source-metrics {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-ai-source-actions .button,
  .admin-ai-source-actions button {
    width: 100%;
  }

  .admin-ai-source-actions form,
  .admin-ai-source-actions a {
    flex: 1 1 160px;
  }

  .admin-ai-discovery-grid,
  .admin-ai-discovery-item {
    grid-template-columns: minmax(0, 1fr);
  }
}

.admin-ai-robot-grid {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.admin-ai-robot-categories,
.admin-ai-source-list {
  display: grid;
  gap: 12px;
}

.admin-ai-category-card {
  gap: 14px;
  box-shadow: none;
}

.admin-ai-category-card.is-selected {
  border-color: #0f1420;
}

.admin-ai-category-card p,
.admin-ai-sources-panel__header p,
.admin-ai-source-row small {
  margin: 4px 0 0;
  color: var(--admin-muted);
  font-size: 12px;
  line-height: 16px;
}

.admin-ai-category-card__counts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-ai-category-card__counts span {
  border-radius: 999px;
  background: #f2f4f7;
  color: #394252;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 850;
}

.admin-ai-category-card__actions,
.admin-ai-source-row__actions,
.admin-ai-source-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-ai-sources-panel {
  min-width: 0;
}

.admin-ai-sources-panel__header,
.admin-ai-source-form__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.admin-ai-source-row {
  display: grid;
  grid-template-columns: minmax(180px, 0.8fr) minmax(140px, auto) minmax(260px, 1fr) auto;
  gap: 14px;
  align-items: center;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  padding: 14px;
}

.admin-ai-source-row__main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.admin-ai-source-row__main strong,
.admin-ai-source-row__main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-ai-source-row__meta,
.admin-ai-source-row__summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.admin-ai-source-row__meta span,
.admin-ai-source-row__summary span {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  gap: 5px;
  border-radius: 999px;
  background: #f8fafc;
  color: #394252;
  padding: 0 10px;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.admin-ai-source-row__summary span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  background: rgb(15 20 32 / 42%);
  padding: 22px;
}

.admin-ai-source-form {
  width: min(560px, 100%);
  max-height: calc(100vh - 44px);
  overflow: auto;
}

.admin-ai-discovered-page {
  display: grid;
  gap: 18px;
}

.admin-ai-discovered-filters {
  display: grid;
  grid-template-columns: repeat(5, minmax(140px, 1fr)) auto;
  gap: 12px;
  align-items: end;
}

.admin-ai-discovered-table {
  overflow: hidden;
  padding: 0;
}

.admin-ai-discovered-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(110px, 0.7fr) minmax(90px, 0.6fr) minmax(80px, 0.5fr) minmax(130px, 0.8fr) minmax(120px, 0.7fr) minmax(110px, 0.7fr) minmax(110px, 0.7fr) minmax(180px, 0.9fr);
  gap: 12px;
  align-items: center;
  border-top: 1px solid var(--admin-border);
  padding: 12px 14px;
}

.admin-ai-discovered-row:first-child {
  border-top: 0;
}

.admin-ai-discovered-row--head {
  background: #f8fafc;
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 900;
}

.admin-ai-discovered-row strong,
.admin-ai-discovered-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-ai-discovered-row strong {
  color: var(--admin-text);
  font-size: 13px;
  font-weight: 900;
}

.admin-ai-discovered-row span {
  color: #394252;
  font-size: 12px;
  font-weight: 750;
}

.admin-ai-discovered-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-ai-discovered-actions small {
  flex-basis: 100%;
  color: #b91c1c;
  font-size: 11px;
  font-weight: 800;
}

.admin-ai-compare-page {
  display: grid;
  gap: 18px;
}

.admin-ai-compare-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.admin-ai-compare-panel {
  min-width: 0;
}

.admin-ai-compare-panel h2,
.admin-ai-validation-panel h2 {
  margin: 0 0 12px;
  color: var(--admin-text);
  font-size: 17px;
}

.admin-ai-compare-panel h3 {
  margin: 0 0 10px;
  color: var(--admin-text);
  font-size: 20px;
  line-height: 1.25;
}

.admin-ai-compare-spot {
  border-left: 3px solid var(--admin-red);
  color: #394252;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  margin: 0 0 14px;
  padding-left: 10px;
}

.admin-ai-compare-body {
  color: #1f2937;
  font-size: 14px;
  line-height: 1.65;
  white-space: pre-wrap;
}

.admin-ai-validation-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-ai-validation-grid span,
.admin-ai-validation-list span {
  border-radius: 999px;
  background: #f8fafc;
  color: #394252;
  padding: 8px 10px;
  font-size: 12px;
  font-weight: 850;
}

.admin-ai-validation-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.admin-ai-validation-list strong {
  flex-basis: 100%;
  color: var(--admin-text);
  font-size: 13px;
}

.admin-ai-source-form__toggles {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.admin-ai-source-form__toggles label {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 850;
}

@media (max-width: 1100px) {
  .admin-ai-robot-stats,
  .admin-ai-robot-grid,
  .admin-ai-source-row {
    grid-template-columns: 1fr;
  }

  .admin-ai-source-row__actions {
    justify-content: flex-start;
  }
}

.admin-form-row {
  display: grid;
  gap: 14px;
}

.admin-form-row--tight {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.admin-field label {
  color: var(--admin-text);
  font-size: 12px;
  font-weight: 800;
  line-height: 16px;
}

.admin-field input,
.admin-field select,
.admin-field textarea,
.admin-icon-input input {
  width: 100%;
  min-height: 46px;
  border: 1px solid #dce1e8;
  border-radius: 10px;
  outline: 0;
  background: #fff;
  color: var(--admin-text);
  padding: 0 13px;
  font-size: 13px;
  line-height: 20px;
}

.admin-field textarea {
  min-height: 86px;
  resize: vertical;
  padding-top: 12px;
}

.admin-field .admin-edit-content {
  min-height: 300px;
  line-height: 24px;
}

.admin-field input:focus,
.admin-field select:focus,
.admin-field textarea:focus,
.admin-icon-input input:focus {
  border-color: var(--admin-red);
  box-shadow: 0 0 0 3px rgb(227 29 43 / 10%);
}

.admin-field small {
  color: var(--admin-muted);
  font-size: 11px;
  line-height: 15px;
}

.admin-field-meta {
  display: flex;
  min-height: 16px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.admin-field-meta span {
  color: var(--admin-red);
  font-size: 11px;
  font-weight: 700;
}

.admin-field-meta small {
  margin-left: auto;
  color: var(--admin-muted);
  font-size: 11px;
}

.admin-tag-combobox {
  position: relative;
}

.admin-tag-input {
  display: flex;
  min-height: 46px;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  border: 1px solid #dce1e8;
  border-radius: 10px;
  background: #fff;
  padding: 6px 10px;
}

.admin-tag-input span {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  background: #f2f4f7;
  color: var(--admin-text);
  padding: 0 8px;
  font-size: 12px;
  font-weight: 700;
}

.admin-tag-input button {
  display: grid;
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  place-items: center;
  background: transparent;
  padding: 0;
}

.admin-tag-input input {
  flex: 1;
  min-width: 150px;
  min-height: 30px;
  border: 0;
  outline: 0;
  padding: 0;
}

.admin-tag-suggestions {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 25;
  display: grid;
  width: min(360px, 100%);
  overflow: hidden;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: #fff;
  padding: 6px;
  box-shadow: var(--admin-shadow);
}

.admin-tag-suggestions > span,
.admin-tag-suggestions button {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-radius: 9px;
  background: transparent;
  color: var(--admin-text);
  padding: 0 10px;
  font-size: 12px;
  font-weight: 800;
  text-align: left;
}

.admin-tag-suggestions button:hover {
  background: #f5f7fa;
}

.admin-tag-suggestions small {
  color: var(--admin-muted);
  font-size: 11px;
  font-weight: 700;
}

.admin-upload {
  display: grid;
  min-height: 220px;
  place-items: center;
  gap: 10px;
  overflow: hidden;
  border: 1px dashed #cfd5df;
  border-radius: 12px;
  background: #fbfcfe;
  padding: 22px;
  text-align: center;
  cursor: pointer;
}

.admin-upload.has-preview {
  place-items: stretch;
  text-align: left;
}

.admin-upload img {
  width: 100%;
  aspect-ratio: 1200 / 628;
  border-radius: 10px;
  object-fit: cover;
}

.admin-upload p {
  margin: 0;
  color: var(--admin-muted);
  font-size: 12px;
}

.admin-upload button,
.admin-upload-actions button {
  min-height: 34px;
  border-radius: 8px;
  background: #0f1420;
  color: #fff;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 800;
}

.admin-upload span {
  color: var(--admin-muted);
  font-size: 11px;
  line-height: 16px;
}

.admin-upload-actions {
  display: flex;
  gap: 10px;
}

.admin-upload-actions button:last-child {
  background: #f2f4f7;
  color: var(--admin-text);
}

.admin-editor {
  overflow: hidden;
  border: 1px solid #dce1e8;
  border-radius: 12px;
  background: #fff;
}

.admin-editor__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  align-items: center;
  border-bottom: 1px solid var(--admin-border);
  padding: 8px;
}

.admin-editor__toolbar select {
  width: 128px;
  min-height: 34px;
  border: 0;
  background: transparent;
  color: var(--admin-text);
  font-size: 12px;
  font-weight: 700;
}

.admin-editor__toolbar button {
  display: grid;
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  place-items: center;
  border-radius: 8px;
  background: transparent;
  color: #4a5360;
  padding: 0;
}

.admin-editor__toolbar button:hover {
  background: #f2f4f7;
}

.admin-editor textarea {
  width: 100%;
  min-height: 190px;
  border: 0;
  outline: 0;
  resize: vertical;
  padding: 16px;
  color: var(--admin-text);
  font-size: 14px;
  line-height: 24px;
}

.admin-editor__footer {
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid var(--admin-border);
  padding: 0 12px;
}

.admin-editor__footer span {
  color: var(--admin-red);
  font-size: 11px;
  font-weight: 700;
}

.admin-editor__footer small {
  color: var(--admin-muted);
  font-size: 11px;
  font-weight: 700;
}

.admin-radio-group {
  display: grid;
  gap: 12px;
  border-radius: 12px;
  background: #fbfcfe;
  padding: 12px;
}

.admin-radio-group label {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  cursor: pointer;
}

.admin-radio-group input {
  width: 16px;
  height: 16px;
  accent-color: var(--admin-red);
}

.admin-radio-group span {
  display: grid;
  gap: 3px;
}

.admin-radio-group strong {
  font-size: 12px;
  line-height: 16px;
}

.admin-radio-group small {
  color: var(--admin-muted);
  font-size: 11px;
  line-height: 15px;
}

.admin-switch {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-top: 1px solid var(--admin-border);
  padding-top: 13px;
}

.admin-switch span {
  color: var(--admin-text);
  font-size: 12px;
  font-weight: 800;
}

.admin-switch button {
  position: relative;
  width: 42px;
  height: 24px;
  min-width: 42px;
  min-height: 24px;
  border-radius: 999px;
  background: #d9dee7;
  padding: 0;
}

.admin-switch i {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  transition: transform 160ms ease;
}

.admin-switch button.is-on {
  background: #41c96f;
}

.admin-switch button.is-on i {
  transform: translateX(18px);
}

.admin-icon-input {
  position: relative;
  display: block;
}

.admin-icon-input input {
  padding-right: 38px;
}

.admin-icon-input svg {
  position: absolute;
  top: 50%;
  right: 13px;
  color: var(--admin-muted);
  transform: translateY(-50%);
}

.admin-segmented {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #f2f4f7;
  padding: 3px;
}

.admin-segmented button {
  min-height: 36px;
  border-radius: 8px;
  background: transparent;
  color: var(--admin-muted);
  padding: 0;
  font-size: 12px;
  font-weight: 800;
}

.admin-segmented button.is-active {
  background: #fff;
  color: var(--admin-text);
  box-shadow: 0 4px 12px rgb(17 19 24 / 7%);
}

.admin-ai-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.admin-ai-grid button {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 9px;
  background: #f5f7fa;
  color: var(--admin-text);
  padding: 0 8px;
  font-size: 11px;
  font-weight: 800;
}

.admin-muted-box {
  margin: 0;
  border-radius: 12px;
  background: #f5f7fa;
  color: var(--admin-muted);
  padding: 14px;
  font-size: 12px;
  line-height: 18px;
}

.admin-stepper {
  display: inline-grid;
  width: 150px;
  grid-template-columns: 42px 1fr 42px;
  overflow: hidden;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
}

.admin-stepper button {
  display: grid;
  min-height: 40px;
  place-items: center;
  background: #fff;
  padding: 0;
}

.admin-stepper strong {
  display: grid;
  place-items: center;
  border-right: 1px solid var(--admin-border);
  border-left: 1px solid var(--admin-border);
  font-size: 13px;
}

.admin-toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 120;
  max-width: min(360px, calc(100vw - 36px));
  border-radius: 12px;
  background: #111318;
  color: #fff;
  padding: 13px 15px;
  box-shadow: 0 16px 40px rgb(17 19 24 / 22%);
  font-size: 13px;
  font-weight: 800;
}

.admin-articles-page {
  display: grid;
  gap: 22px;
}

.admin-list-header {
  display: grid;
  gap: 16px;
}

.admin-list-header h1 {
  margin: 0;
  color: var(--admin-text);
  font-size: 26px;
  font-weight: 900;
  line-height: 32px;
}

.admin-list-header p {
  margin: 4px 0 0;
  color: var(--admin-muted);
  font-size: 13px;
  line-height: 18px;
}

.admin-list-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.admin-list-search {
  position: relative;
  flex: 1 1 230px;
  max-width: 360px;
}

.admin-list-search input {
  width: 100%;
  min-height: 44px;
  border: 1px solid #dce1e8;
  border-radius: 10px;
  outline: 0;
  background: #fff;
  color: var(--admin-text);
  padding: 0 46px 0 14px;
  font-size: 13px;
}

.admin-list-search input:focus {
  border-color: var(--admin-red);
  box-shadow: 0 0 0 3px rgb(227 29 43 / 10%);
}

.admin-list-search button {
  position: absolute;
  top: 0;
  right: 0;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  background: transparent;
  color: #526071;
  padding: 0;
}

.admin-filter-wrap,
.admin-row-actions {
  position: relative;
}

.admin-filter-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 20;
  display: grid;
  width: min(320px, calc(100vw - 36px));
  gap: 12px;
  border: 1px solid var(--admin-border);
  border-radius: 14px;
  background: #fff;
  padding: 14px;
  box-shadow: var(--admin-shadow);
}

.admin-filter-panel label {
  display: grid;
  gap: 7px;
  color: var(--admin-text);
  font-size: 12px;
  font-weight: 800;
}

.admin-filter-panel select,
.admin-list-footer select {
  min-height: 40px;
  border: 1px solid #dce1e8;
  border-radius: 9px;
  background: #fff;
  color: var(--admin-text);
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
}

.admin-filter-panel__actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.admin-filter-panel__actions button,
.admin-bulk-bar button {
  min-height: 36px;
  border-radius: 9px;
  background: #f2f4f7;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 800;
}

.admin-filter-panel__actions button:last-child {
  background: #0f1420;
  color: #fff;
}

.admin-status-tabs {
  display: inline-flex;
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: #fff;
  padding: 0 16px;
  box-shadow: var(--admin-shadow);
}

.admin-status-tabs button {
  position: relative;
  display: inline-flex;
  min-height: 58px;
  align-items: center;
  gap: 9px;
  background: transparent;
  color: #667085;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.admin-status-tabs button.is-active {
  color: var(--admin-text);
}

.admin-status-tabs button.is-active::after {
  position: absolute;
  right: 14px;
  bottom: 0;
  left: 14px;
  height: 2px;
  border-radius: 999px;
  background: #0f1420;
  content: "";
}

.admin-status-tabs span {
  display: grid;
  min-width: 24px;
  min-height: 22px;
  place-items: center;
  border-radius: 999px;
  background: #eef1f5;
  color: #526071;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 900;
}

.admin-status-tabs button:nth-child(2) span {
  background: #dcfce7;
  color: #15803d;
}

.admin-bulk-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  border: 1px solid #c7d2fe;
  border-radius: 12px;
  background: #eef2ff;
  padding: 10px 12px;
}

.admin-bulk-bar strong {
  margin-right: auto;
  color: #3730a3;
  font-size: 13px;
}

.admin-list-notice {
  border: 1px solid #bbf7d0;
  border-radius: 12px;
  background: #f0fdf4;
  color: #166534;
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 800;
}

.admin-articles-card {
  overflow: visible;
  border: 1px solid var(--admin-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--admin-shadow);
}

.admin-articles-row {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(250px, 1.7fr) minmax(140px, 0.72fr) minmax(110px, 0.52fr) minmax(120px, 0.55fr) minmax(110px, 0.55fr) minmax(96px, 0.44fr) 74px;
  gap: 18px;
  align-items: center;
  min-height: 102px;
  border-top: 1px solid var(--admin-border);
  padding: 16px 20px;
}

.admin-articles-row:first-child {
  border-top: 0;
}

.admin-articles-row--head {
  min-height: 56px;
  border-top: 0;
  color: #526071;
  font-size: 12px;
  font-weight: 900;
}

.admin-articles-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--admin-red);
}

.admin-news-cell {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  min-width: 0;
}

.admin-news-cell img,
.admin-news-cell__placeholder {
  width: 72px;
  height: 64px;
  border-radius: 8px;
  object-fit: cover;
}

.admin-news-cell__placeholder {
  background: linear-gradient(135deg, #eef1f5, #d8dee8);
}

.admin-news-cell strong {
  display: -webkit-box;
  overflow: hidden;
  color: var(--admin-text);
  font-size: 13px;
  font-weight: 900;
  line-height: 18px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.admin-news-cell p {
  display: -webkit-box;
  overflow: hidden;
  margin: 5px 0 0;
  color: var(--admin-muted);
  font-size: 12px;
  line-height: 17px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.admin-author-cell {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.admin-author-cell span {
  display: grid;
  width: 28px;
  height: 28px;
  min-width: 28px;
  place-items: center;
  border-radius: 50%;
  background: #0f1420;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.admin-author-cell strong {
  overflow: hidden;
  color: #394252;
  font-size: 12px;
  font-weight: 800;
  line-height: 16px;
  text-overflow: ellipsis;
}

.admin-category-pill,
.admin-status-pill {
  display: inline-flex;
  width: fit-content;
  min-height: 25px;
  align-items: center;
  gap: 7px;
  border-radius: 999px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 900;
}

.admin-category-pill {
  border: 1px solid #fecdd3;
  background: #fff1f2;
  color: #e11d48;
}

.admin-category-pill--bursa {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #2563eb;
}

.admin-category-pill--spor {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #16a34a;
}

.admin-category-pill--ekonomi {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #ea580c;
}

.admin-category-pill--yasam {
  border-color: #fde68a;
  background: #fffbeb;
  color: #d97706;
}

.admin-category-pill--teknoloji {
  border-color: #c4b5fd;
  background: #f5f3ff;
  color: #7c3aed;
}

.admin-status-pill {
  background: transparent;
  color: #526071;
  padding: 0;
}

.admin-status-pill i {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #64748b;
}

.admin-status-pill--published {
  color: #16a34a;
}

.admin-status-pill--published i {
  background: #22c55e;
}

.admin-status-pill--scheduled {
  color: #2563eb;
}

.admin-status-pill--scheduled i {
  background: #3b82f6;
}

.admin-date-cell {
  display: grid;
  gap: 2px;
  color: #394252;
  font-size: 12px;
  font-weight: 800;
  line-height: 16px;
}

.admin-date-cell small {
  color: #394252;
  font-size: 12px;
  font-weight: 800;
}

.admin-views-cell {
  color: #526071;
  font-size: 13px;
  font-weight: 800;
}

.admin-row-actions > button {
  display: grid;
  width: 38px;
  height: 38px;
  min-width: 38px;
  min-height: 38px;
  place-items: center;
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  background: #fff;
  color: #394252;
  padding: 0;
}

.admin-row-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 30;
  display: grid;
  width: 210px;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: #fff;
  padding: 6px;
  box-shadow: var(--admin-shadow);
}

.admin-row-menu a,
.admin-row-menu button {
  display: flex;
  min-height: 36px;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
  background: transparent;
  color: var(--admin-text);
  padding: 0 10px;
  font-size: 12px;
  font-weight: 800;
}

.admin-row-menu a:hover,
.admin-row-menu button:hover {
  background: #f5f7fa;
}

.admin-row-menu .is-disabled {
  color: #a8b0bd;
  pointer-events: none;
}

.admin-row-menu button:disabled {
  color: #a8b0bd;
  cursor: default;
}

.admin-row-menu .is-danger {
  color: var(--admin-red);
}

.admin-empty-state {
  display: grid;
  min-height: 190px;
  place-items: center;
  gap: 4px;
  padding: 28px;
  text-align: center;
}

.admin-empty-state strong {
  color: var(--admin-text);
  font-size: 16px;
}

.admin-empty-state p {
  margin: 0;
  color: var(--admin-muted);
  font-size: 13px;
}

.admin-list-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid var(--admin-border);
  border-radius: 14px;
  background: #fff;
  padding: 12px 14px;
  box-shadow: var(--admin-shadow);
}

.admin-list-footer label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.admin-list-footer > span {
  color: #526071;
  font-size: 13px;
  font-weight: 800;
}

.admin-pagination {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.admin-pagination button,
.admin-pagination span {
  display: grid;
  min-width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  background: #fff;
  color: #394252;
  padding: 0 8px;
  font-size: 12px;
  font-weight: 900;
}

.admin-pagination button.is-active {
  border-color: #0f1420;
  background: #0f1420;
  color: #fff;
}

.admin-pagination button:disabled {
  color: #a8b0bd;
  cursor: default;
}

.admin-categories-page {
  display: grid;
  gap: 22px;
}

.admin-tags-page {
  display: grid;
  gap: 22px;
}

.admin-category-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.admin-category-stat {
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid var(--admin-border);
  border-radius: 14px;
  background: #fff;
  padding: 16px;
  box-shadow: var(--admin-shadow);
}

.admin-category-stat > span {
  display: grid;
  width: 42px;
  height: 42px;
  min-width: 42px;
  place-items: center;
  border-radius: 12px;
  background: #fff1f2;
  color: var(--admin-red);
}

.admin-category-stat p {
  margin: 0 0 4px;
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-category-stat strong {
  color: var(--admin-text);
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
}

.admin-category-row {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(220px, 1.2fr) minmax(220px, 1.2fr) minmax(95px, 0.4fr) minmax(90px, 0.4fr) minmax(80px, 0.34fr) 92px;
  gap: 18px;
  align-items: center;
  min-height: 78px;
  border-top: 1px solid var(--admin-border);
  padding: 14px 20px;
}

.admin-category-row:first-child {
  border-top: 0;
}

.admin-category-row--head {
  min-height: 56px;
  color: #526071;
  font-size: 12px;
  font-weight: 900;
}

.admin-category-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--admin-red);
}

.admin-category-name-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.admin-category-name-cell.is-child {
  padding-left: 18px;
}

.admin-category-name-cell > span {
  display: grid;
  width: 34px;
  height: 34px;
  min-width: 34px;
  place-items: center;
  border-radius: 10px;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.admin-category-name-cell strong {
  display: block;
  overflow: hidden;
  color: var(--admin-text);
  font-size: 13px;
  font-weight: 900;
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-category-name-cell small {
  display: block;
  overflow: hidden;
  color: var(--admin-muted);
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-category-description {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--admin-muted);
  font-size: 12px;
  line-height: 17px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.admin-category-count,
.admin-category-order {
  color: #394252;
  font-size: 13px;
  font-weight: 900;
}

.admin-status-toggle {
  display: inline-flex;
  width: fit-content;
  min-width: 70px;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #f2f4f7;
  color: #64748b;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 900;
}

.admin-status-toggle.is-active {
  background: #dcfce7;
  color: #15803d;
}

.admin-category-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.admin-category-actions button {
  display: grid;
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  place-items: center;
  border: 1px solid var(--admin-border);
  border-radius: 9px;
  background: #fff;
  color: #394252;
  padding: 0;
}

.admin-category-actions button:last-child {
  color: var(--admin-red);
}

.admin-tag-row {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(220px, 1.2fr) minmax(150px, 0.8fr) minmax(105px, 0.42fr) minmax(90px, 0.38fr) minmax(135px, 0.6fr) 92px;
  gap: 18px;
  align-items: center;
  min-height: 78px;
  border-top: 1px solid var(--admin-border);
  padding: 14px 20px;
}

.admin-tag-row:first-child {
  border-top: 0;
}

.admin-tag-row--head {
  min-height: 56px;
  color: #526071;
  font-size: 12px;
  font-weight: 900;
}

.admin-tag-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--admin-red);
}

.admin-tag-name-cell {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.admin-tag-name-cell span {
  display: inline-flex;
  width: fit-content;
  min-height: 28px;
  align-items: center;
  border: 1px solid #e9d5ff;
  border-radius: 999px;
  background: #faf5ff;
  color: #9c2aa0;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 900;
}

.admin-tag-name-cell small,
.admin-tag-row time {
  overflow: hidden;
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 17px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-tag-row code {
  overflow: hidden;
  color: #394252;
  font-family: inherit;
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 130;
  display: flex;
  justify-content: flex-end;
  background: rgb(13 22 33 / 42%);
}

.admin-category-drawer {
  display: grid;
  width: min(520px, 100vw);
  max-height: 100dvh;
  grid-template-rows: auto 1fr auto;
  gap: 16px;
  overflow-y: auto;
  background: var(--admin-bg);
  padding: 22px;
  box-shadow: -22px 0 48px rgb(17 19 24 / 18%);
}

.admin-category-drawer > header,
.admin-category-drawer > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.admin-category-drawer h2 {
  margin: 0;
  color: var(--admin-text);
  font-size: 22px;
  font-weight: 900;
}

.admin-category-drawer p {
  margin: 4px 0 0;
  color: var(--admin-muted);
  font-size: 12px;
  line-height: 17px;
}

.admin-category-drawer > header button {
  display: grid;
  width: 38px;
  height: 38px;
  min-width: 38px;
  min-height: 38px;
  place-items: center;
  border-radius: 10px;
  background: #fff;
  color: var(--admin-text);
  padding: 0;
}

.admin-category-drawer > footer {
  justify-content: flex-end;
}

.admin-form-error {
  border: 1px solid #fecdd3;
  border-radius: 12px;
  background: #fff1f2;
  color: #be123c;
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 800;
}

.admin-authors-table {
  display: grid;
}

.admin-authors-table__head,
.admin-authors-table__row {
  display: grid;
  grid-template-columns: minmax(260px, 1.7fr) minmax(140px, 1fr) 120px 110px 150px 110px;
  gap: 18px;
  align-items: center;
  padding: 18px 22px;
}

.admin-authors-table__head {
  border-bottom: 1px solid #e5e7eb;
  color: #6b7280;
  font-size: 13px;
  font-weight: 900;
}

.admin-authors-table__row {
  border-bottom: 1px solid #eef2f7;
}

.admin-authors-table__row:last-child {
  border-bottom: 0;
}

.admin-author-profile {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 12px;
}

.admin-author-profile strong,
.admin-author-profile small {
  display: block;
}

.admin-author-profile strong {
  color: #111827;
  font-weight: 900;
}

.admin-author-profile small {
  margin-top: 3px;
  color: #6b7280;
  font-size: 12px;
}

.admin-author-avatar {
  display: inline-flex;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #111827;
  color: #fff;
  font-weight: 900;
  object-fit: cover;
}

.admin-author-avatar-picker {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
}

.admin-author-avatar-picker button {
  border: 1px solid #dbe3ee;
  border-radius: 10px;
  background: #fff;
  padding: 10px 13px;
  font-weight: 800;
  cursor: pointer;
}

.admin-row-actions {
  display: flex;
  gap: 8px;
}

.admin-row-actions button {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  border: 1px solid #dbe3ee;
  border-radius: 10px;
  background: #fff;
  color: #111827;
  cursor: pointer;
}

.admin-row-actions button:last-child {
  color: #e31d2b;
}

.admin-empty-state {
  padding: 30px 22px;
  color: #6b7280;
  font-weight: 800;
  text-align: center;
}

.admin-version-history {
  display: grid;
  gap: 10px;
}

.admin-version-history button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  padding: 11px 12px;
  color: #111827;
  cursor: pointer;
}

.admin-version-history button strong {
  font-weight: 900;
}

.admin-version-history button span {
  color: #6b7280;
  font-size: 12px;
  font-weight: 800;
}

.admin-version-drawer pre {
  overflow: auto;
  max-height: 52vh;
  white-space: pre-wrap;
  color: #374151;
  font-family: inherit;
  line-height: 1.7;
}

.admin-media-picker__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 12px;
}

.admin-media-picker__grid button {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  padding: 8px;
  cursor: pointer;
  text-align: left;
}

.admin-media-picker__grid img {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  object-fit: cover;
}

.admin-media-picker__grid span {
  display: block;
  overflow: hidden;
  margin-top: 6px;
  color: #6b7280;
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.article-author-card {
  display: flex;
  width: fit-content;
  align-items: center;
  gap: 10px;
  margin: 14px 0 20px;
  color: inherit;
  text-decoration: none;
}

.article-author-card img,
.article-author-card > span {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #111827;
  color: #fff;
  font-weight: 900;
  object-fit: cover;
}

.article-author-card strong,
.article-author-card small {
  display: block;
}

.article-author-card strong {
  color: #111827;
  font-weight: 900;
}

.article-author-card small {
  margin-top: 2px;
  color: #6b7280;
  font-size: 13px;
  font-weight: 700;
}

.public-author-page {
  display: grid;
  gap: 24px;
}

.public-author-hero {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 22px;
  align-items: center;
  border: 1px solid #edf0f5;
  border-radius: 18px;
  background: #fff;
  padding: 26px;
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.06);
}

.public-author-hero img,
.public-author-hero > span {
  display: inline-flex;
  width: 96px;
  height: 96px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #111827;
  color: #fff;
  font-size: 36px;
  font-weight: 900;
  object-fit: cover;
}

.public-author-hero h1 {
  margin: 0;
  color: #111827;
  font-size: 34px;
  font-weight: 900;
}

.public-author-hero p {
  margin: 8px 0 0;
  color: #374151;
  line-height: 1.65;
}

.public-author-socials {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.public-author-socials a {
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  color: #111827;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

.admin-button--danger {
  background: #fff1f2;
  color: var(--admin-red);
}

.admin-media-page {
  display: grid;
  gap: 22px;
}

.admin-media-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.admin-media-bulk {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.admin-media-bulk label {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #fff;
}

.admin-media-bulk input,
.admin-media-card input {
  width: 18px;
  height: 18px;
  accent-color: var(--admin-red);
}

.admin-view-toggle {
  display: inline-flex;
  gap: 6px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #fff;
  padding: 4px;
}

.admin-view-toggle button {
  display: grid;
  width: 38px;
  height: 36px;
  place-items: center;
  border-radius: 8px;
  background: transparent;
  color: #526071;
  padding: 0;
}

.admin-view-toggle button.is-active {
  background: #0f1420;
  color: #fff;
}

.admin-media-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.admin-media-list {
  display: grid;
  gap: 10px;
}

.admin-media-card,
.admin-media-skeleton {
  position: relative;
  overflow: visible;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--admin-shadow);
}

.admin-media-grid .admin-media-card,
.admin-media-skeleton {
  aspect-ratio: 1.55;
}

.admin-media-card > label,
.admin-media-card__menu {
  position: absolute;
  z-index: 3;
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 8px;
  background: rgb(255 255 255 / 92%);
  box-shadow: 0 4px 14px rgb(17 19 24 / 12%);
}

.admin-media-card > label {
  top: 8px;
  left: 8px;
}

.admin-media-card__menu {
  top: 8px;
  right: 8px;
  color: #0f1420;
  padding: 0;
}

.admin-media-card__preview {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 12px;
  background: #eef1f5;
  padding: 0;
}

.admin-media-card__preview img,
.admin-media-preview-image,
.admin-media-picker-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.admin-media-list .admin-media-card {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr);
  min-height: 120px;
}

.admin-media-list .admin-media-card__preview {
  border-radius: 12px 0 0 12px;
}

.admin-media-list-info {
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 18px;
}

.admin-media-list-info strong {
  color: var(--admin-text);
  font-size: 14px;
  font-weight: 900;
}

.admin-media-list-info span,
.admin-media-meta span {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 700;
}

.admin-media-menu {
  top: 42px;
  right: 8px;
}

.admin-media-skeleton {
  background: linear-gradient(90deg, #eef1f5, #f8fafc, #eef1f5);
  background-size: 220% 100%;
  animation: admin-skeleton 1.2s ease-in-out infinite;
}

.admin-media-dropzone {
  display: grid;
  min-height: 260px;
  place-items: center;
  gap: 9px;
  border: 1px dashed #cfd5df;
  border-radius: 14px;
  background: #fbfcfe;
  color: var(--admin-text);
  padding: 28px;
  text-align: center;
}

.admin-media-dropzone span {
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 700;
}

.admin-media-preview-image {
  max-height: 330px;
  border-radius: 14px;
  background: #eef1f5;
}

.admin-media-meta {
  display: grid;
  gap: 6px;
  word-break: break-word;
}

.admin-media-picker-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.admin-media-picker-grid button {
  overflow: hidden;
  aspect-ratio: 1.35;
  border-radius: 10px;
  background: #eef1f5;
  padding: 0;
}

@keyframes admin-skeleton {
  from { background-position: 0 0; }
  to { background-position: -220% 0; }
}

@media (max-width: 1180px) {
  .admin-articles-card {
    overflow-x: auto;
  }

  .admin-articles-row {
    min-width: 1040px;
  }

  .admin-media-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .site-header__inner {
    justify-content: center;
  }

  .mobile-menu-root {
    position: absolute;
    left: var(--container-x);
    display: block;
  }

  .mobile-menu-trigger {
    display: grid;
  }

  .mobile-brand {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .mobile-brand img {
    width: 175px;
    height: auto;
    max-height: 47px;
  }

  .mobile-brand.brand--mahallenden img {
    width: 200px;
    max-height: 56px;
  }

  .header-actions {
    margin-left: auto;
  }

  .admin-list-actions {
    display: grid;
  }

  .admin-list-search {
    max-width: none;
  }

  .admin-filter-wrap .admin-button,
  .admin-list-actions .admin-button {
    width: 100%;
  }

  .admin-filter-panel {
    right: auto;
    left: 0;
  }

  .admin-status-tabs {
    width: 100%;
    padding: 0 8px;
  }

  .admin-status-tabs button {
    padding: 0 10px;
  }

  .admin-articles-card {
    display: grid;
    gap: 12px;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .admin-articles-row--head {
    display: none;
  }

  .admin-articles-row {
    display: grid;
    min-width: 0;
    min-height: 0;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 12px;
    border: 1px solid var(--admin-border);
    border-radius: 14px;
    background: #fff;
    padding: 14px;
    box-shadow: var(--admin-shadow);
  }

  .admin-articles-row > label {
    grid-row: 1;
  }

  .admin-news-cell {
    grid-column: 2 / 3;
  }

  .admin-author-cell,
  .admin-category-pill,
  .admin-status-pill,
  .admin-date-cell,
  .admin-views-cell {
    grid-column: 2 / -1;
  }

  .admin-row-actions {
    grid-column: 3;
    grid-row: 1;
  }

  .admin-row-menu {
    right: 0;
  }

  .admin-list-footer {
    display: grid;
  }

  .admin-pagination {
    overflow-x: auto;
  }

  .admin-category-stats {
    grid-template-columns: 1fr;
  }

  .admin-categories-card {
    display: grid;
    gap: 12px;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .admin-category-row--head {
    display: none;
  }

  .admin-category-row {
    display: grid;
    min-height: 0;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 12px;
    border: 1px solid var(--admin-border);
    border-radius: 14px;
    background: #fff;
    padding: 14px;
    box-shadow: var(--admin-shadow);
  }

  .admin-category-name-cell {
    grid-column: 2 / 3;
  }

  .admin-category-name-cell.is-child {
    padding-left: 0;
  }

  .admin-category-description,
  .admin-category-count,
  .admin-status-toggle,
  .admin-category-order {
    grid-column: 2 / -1;
  }

  .admin-category-actions {
    grid-column: 3;
    grid-row: 1;
  }

  .admin-tags-card {
    display: grid;
    gap: 12px;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .admin-tag-row--head {
    display: none;
  }

  .admin-tag-row {
    display: grid;
    min-height: 0;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 12px;
    border: 1px solid var(--admin-border);
    border-radius: 14px;
    background: #fff;
    padding: 14px;
    box-shadow: var(--admin-shadow);
  }

  .admin-tag-name-cell {
    grid-column: 2 / 3;
  }

  .admin-tag-row code,
  .admin-tag-row .admin-category-count,
  .admin-tag-row .admin-status-toggle,
  .admin-tag-row time {
    grid-column: 2 / -1;
  }

  .admin-tag-row .admin-category-actions {
    grid-column: 3;
    grid-row: 1;
  }

  .admin-category-drawer {
    width: 100vw;
  }

  .admin-media-toolbar {
    display: grid;
  }

  .admin-media-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-media-list .admin-media-card {
    grid-template-columns: 110px minmax(0, 1fr);
  }

  .admin-media-picker-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .admin-user {
    display: inline-flex;
  }

  .admin-form-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .admin-shell {
    grid-template-columns: 280px minmax(0, 1fr);
  }

  .admin-sidebar {
    position: sticky;
    top: 0;
    height: 100dvh;
    transform: none;
  }

  .admin-backdrop {
    display: none !important;
  }

  .admin-page {
    padding: 32px 32px 56px;
  }

  .admin-page-header {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  .admin-page-header__actions {
    justify-content: end;
  }

  .admin-editor-grid {
    grid-template-columns: minmax(0, 1fr) 360px;
    align-items: start;
  }

  .admin-card {
    padding: 22px;
  }
}

@media (min-width: 1280px) {
  .admin-editor-grid {
    grid-template-columns: minmax(0, 1fr) 390px;
  }
}

@media (min-width: 640px) {
  :root {
    --container-x: 24px;
  }

  .news-shell {
    grid-template-columns: minmax(190px, 38%) minmax(0, 1fr);
    align-items: center;
  }

  .news-shell__body,
  .news-actions {
    grid-column: 2;
  }

  .news-detail {
    grid-column: 2;
    justify-self: end;
  }

  .news-shell__media {
    min-height: 132px;
  }
}

@media (min-width: 1024px) {
  :root {
    --container-x: 24px;
    --header-height: 72px;
  }

  .site-shell {
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr);
    padding-bottom: 0;
  }

  .desktop-sidebar {
    position: sticky;
    top: 0;
    display: block;
    height: 100dvh;
    padding: 28px 18px 24px 40px;
    border-right: 1px solid var(--color-divider);
    background: rgb(255 255 255 / 72%);
  }

  .desktop-sidebar__brand {
    min-height: auto;
    font-size: 30px;
  }

  .desktop-sidebar__brand img {
    height: 48px;
    max-width: 180px;
  }

  .desktop-sidebar__brand.brand--mahallenden img {
    height: 58px;
    max-width: 220px;
  }

  .desktop-sidebar__brand .brand__domain {
    font-size: 18px;
  }

  .desktop-sidebar__tagline {
    margin: 6px 0 30px;
    color: var(--color-text);
    font-size: 12px;
    line-height: 16px;
  }

  .sidebar-nav {
    display: grid;
    gap: 7px;
  }

  .sidebar-nav__item {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    min-height: 44px;
    border-radius: 8px;
    color: #333842;
    padding: 0 10px;
    font-size: 13px;
    font-weight: 600;
  }

  .sidebar-nav__item.is-active {
    background: #f1f2f5;
    color: var(--color-red);
  }

  .nav-glyph {
    width: 16px;
    height: 16px;
  }

  .nav-count {
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 50%;
    background: var(--color-red);
    color: #fff;
    font-size: 10px;
  }

  .submit-news {
    width: 100%;
    min-height: 44px;
    margin-top: 20px;
    border-radius: 8px;
    background: #17191f;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
  }

  .site-header__inner {
    width: min(100%, 984px);
    justify-content: normal;
  }

  .site-shell--category .site-header {
    display: block;
  }

  .mobile-brand,
  .mobile-menu-trigger,
  .header-actions .icon-button {
    display: none;
  }

  .search-shell {
    display: flex;
    flex: 1;
    min-height: 42px;
    align-items: center;
    gap: 10px;
    max-width: 480px;
    border: 1px solid var(--color-border);
    border-radius: 9px;
    background: #fff;
    color: var(--color-muted);
    padding: 0 14px;
  }

  .search-shell input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    color: var(--color-text);
    background: transparent;
    font-size: 12px;
  }

  .desktop-top-nav {
    display: flex;
    align-items: center;
    gap: 26px;
    margin-left: auto;
    color: var(--color-text);
    font-size: 12px;
    font-weight: 600;
  }

  .desktop-login {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    background: transparent;
    font-size: 12px;
    font-weight: 700;
  }

  .auth-page {
    width: min(100%, 1080px);
    padding-top: 42px;
    padding-bottom: 54px;
  }

  .auth-card {
    grid-template-columns: minmax(0, 45fr) minmax(0, 55fr);
    min-height: 610px;
    border-radius: 20px;
  }

  .auth-card__intro {
    position: relative;
    display: grid;
    align-content: start;
    gap: 34px;
    min-height: 610px;
    overflow: hidden;
    background: #fbf6fc;
    padding: 62px 50px 270px;
  }

  .auth-intro__copy h1 {
    font-size: 34px;
  }

  .auth-intro__copy p {
    font-size: 16px;
  }

  .auth-benefits {
    position: relative;
    z-index: 1;
    gap: 26px;
  }

  .auth-benefit {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 16px;
  }

  .auth-benefit span {
    width: 52px;
    height: 52px;
    background: rgb(255 255 255 / 82%);
  }

  .auth-benefit p {
    font-size: 15px;
  }

  .auth-panel {
    align-content: center;
    max-width: none;
    padding: 58px 68px;
  }

  .auth-panel > .auth-tabs,
  .auth-panel > .auth-form {
    width: min(100%, 460px);
    margin-right: auto;
    margin-left: auto;
  }

  .auth-mobile-heading {
    display: none;
  }

  .page-container {
    width: min(100%, 984px);
    padding-top: 18px;
  }

  .page-container.auth-page {
    width: min(100%, 1080px);
    padding-top: 42px;
  }

  .profile-page {
    gap: 22px;
    padding-top: 28px;
    padding-bottom: 56px;
  }

  .profile-page-heading h1 {
    font-size: 30px;
  }

  .profile-hero-card__main {
    grid-template-columns: 118px minmax(0, 1fr);
    justify-items: start;
    min-height: 190px;
    align-items: center;
    padding: 46px 42px 24px;
    text-align: left;
  }

  .profile-avatar {
    width: 112px;
    height: 112px;
  }

  .profile-meta-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    align-items: center;
    padding: 0 42px 28px;
  }

  .profile-layout-grid {
    grid-template-columns: minmax(0, 1fr) 210px;
    align-items: start;
    gap: 18px;
  }

  .profile-menu-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
  }

  .profile-menu-card {
    min-height: 130px;
    align-items: start;
    grid-template-columns: minmax(0, 1fr) 18px;
    padding: 18px;
  }

  .profile-menu-card__icon {
    grid-column: 1;
  }

  .profile-menu-card div {
    grid-column: 1 / -1;
  }

  .interests-page {
    max-width: 1040px;
  }

  .interests-heading {
    text-align: left;
  }

  .interests-copy--mobile {
    display: none;
  }

  .interests-copy--desktop {
    display: block;
  }

  .interests-card {
    padding: 24px;
  }

  .interest-category-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
  }

  .interest-category-card {
    min-height: 142px;
    border-radius: 14px;
  }

  .interest-category-card__icon {
    width: 58px;
    height: 58px;
  }

  .interest-category-card strong {
    font-size: 14px;
  }

  .interests-save-bar {
    position: static;
    margin-top: 2px;
    border-radius: 0 0 16px 16px;
    box-shadow: none;
  }

  .profile-menu-card > svg {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  .profile-edit-card {
    max-width: 820px;
    margin: 0 auto;
    padding: 24px;
  }

  .profile-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mobile-categories {
    display: none;
  }

  .mobile-market-summary {
    display: none;
  }

  .mobile-weather-summary {
    display: none;
  }

  .desktop-market-summary {
    display: block;
  }

  .mobile-ad,
  .site-banner--mobile {
    display: none;
  }

  .home-featured-carousel {
    display: none;
  }

  .desktop-featured-carousel {
    display: block;
    margin-bottom: 22px;
  }

  .market-widget--compact {
    padding: 12px 0;
  }

  .market-widget--compact .market-widget__grid {
    grid-auto-columns: max-content;
    gap: 18px;
  }

  .market-widget--compact .market-card {
    padding: 0;
  }

  .market-widget--compact .market-card strong {
    font-size: 15px;
    font-weight: 600;
    line-height: 19px;
  }

  .content-grid {
    grid-template-columns: minmax(0, 1fr) 248px;
    align-items: start;
    gap: 18px;
  }

  .desktop-ad,
  .site-banner--desktop {
    display: block;
    margin-bottom: 16px;
    border-radius: 8px;
  }

  .desktop-ad {
    min-height: 150px;
    background:
      linear-gradient(90deg, rgb(0 0 0 / 68%), rgb(0 0 0 / 10)),
      linear-gradient(135deg, #20252c, #75808b);
    box-shadow: 0 10px 24px rgb(17 19 24 / 10%);
  }

  .feed-tabs {
    min-height: 46px;
    align-items: flex-start;
    border-bottom: 1px solid var(--color-divider);
    margin-bottom: 0;
  }

  .feed-tabs__item {
    min-height: 42px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .feed-tabs__item.is-active {
    border-bottom: 2px solid var(--color-red);
    background: transparent;
    color: var(--color-red);
  }

  .feed-layout {
    display: block;
  }

  .feed-timeline {
    display: none;
  }

  .feed-stack {
    gap: 0;
  }

  .news-shell {
    grid-template-columns: 238px minmax(0, 1fr);
    gap: 18px;
    border: 0;
    border-bottom: 1px solid var(--color-divider);
    border-radius: 0;
    box-shadow: none;
    padding: 24px 0;
    background: transparent;
  }

  .news-detail {
    display: none;
  }

  .news-shell__media {
    grid-column: 1;
    grid-row: 1 / span 2;
    min-height: 126px;
    border-radius: 10px;
  }

  .home-sections {
    gap: 34px;
    padding-top: 18px;
  }

  .bursa-slider {
    grid-auto-columns: minmax(184px, 31%);
    margin: 0;
    padding: 0 0 2px;
  }

  .home-list-card {
    grid-template-columns: 128px minmax(0, 1fr) 24px;
  }

  .home-list-card img {
    width: 128px;
    height: 82px;
  }

  .home-grid-card__media {
    min-height: 132px;
  }

  .side-column {
    position: sticky;
    top: calc(var(--header-height) + 16px);
    display: block;
  }

  .compact-news-list {
    display: grid;
    gap: 13px;
  }

  .compact-news {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
  }

  .compact-news img {
    width: 68px;
    height: 52px;
    border-radius: 9px;
    object-fit: cover;
    background: #eef0f4;
  }

  .compact-news span {
    display: grid;
    gap: 4px;
    min-width: 0;
  }

  .compact-news strong {
    display: -webkit-box;
    overflow: hidden;
    color: var(--color-text);
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .compact-news small {
    color: var(--color-muted);
    font-size: 10px;
    font-weight: 500;
  }

  .ranked-news-list {
    display: grid;
    gap: 12px;
  }

  .ranked-news {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
  }

  .ranked-news strong {
    color: var(--color-red);
    font-size: 13px;
    font-weight: 800;
    line-height: 18px;
  }

  .ranked-news span {
    display: -webkit-box;
    overflow: hidden;
    color: #333842;
    font-size: 12px;
    font-weight: 600;
    line-height: 17px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .bottom-nav {
    display: none;
  }

  .summary-overlay {
    align-items: center;
    padding: 24px;
  }

  .summary-sheet {
    max-height: min(82dvh, 720px);
    border-radius: 18px;
    padding: 18px;
  }
}

@media (min-width: 1440px) {
  .site-shell {
    grid-template-columns: 260px minmax(0, 1fr);
  }

  .content-grid,
  .site-header__inner,
  .page-container {
    width: min(100%, 1028px);
  }

  .content-grid {
    grid-template-columns: minmax(0, 620px) 252px;
    gap: 20px;
  }
}

.admin-imprint-page {
  display: grid;
  gap: 20px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.mahallenden-page {
  --mahallenden-orange: #ff4f0a;
  --mahallenden-navy: #111925;
  --mahallenden-muted: #667085;
  --mahallenden-line: #e8edf4;
  --mahallenden-shadow: 0 14px 34px rgb(17 25 37 / 7%);
  box-sizing: border-box;
  width: 100%;
  max-width: 1420px;
  margin: 0 auto;
  padding: 18px var(--container-x) 32px;
  color: var(--mahallenden-navy);
}

.mahallenden-hero {
  display: grid;
  gap: 18px;
  margin-bottom: 22px;
}

.mahallenden-hero__brand {
  display: flex;
  justify-content: center;
}

.mahallenden-hero__brand img {
  width: min(100%, 310px);
  height: auto;
  object-fit: contain;
}

.mahallenden-hero__controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.mahallenden-user-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.mahallenden-user-links a,
.mahallenden-user-back {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--mahallenden-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 24px rgb(17 25 37 / 5%);
  color: var(--mahallenden-navy);
  padding: 0 13px;
  font-size: 13px;
  font-weight: 850;
}

.mahallenden-select,
.mahallenden-report-button {
  display: inline-flex;
  min-width: 0;
  min-height: 58px;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--mahallenden-line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 24px rgb(17 25 37 / 5%);
  color: var(--mahallenden-navy);
  padding: 0 16px;
}

.mahallenden-select {
  position: relative;
  width: 100%;
  justify-content: start;
  overflow: visible;
}

.mahallenden-select > span:not(.sr-only) {
  color: var(--mahallenden-muted);
  font-size: 12px;
  font-weight: 700;
}

.mahallenden-select strong {
  min-width: 0;
  overflow: hidden;
  color: var(--mahallenden-navy);
  font-size: 16px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mahallenden-select select {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.mahallenden-picker__trigger {
  display: inline-flex;
  min-width: 0;
  flex: 1 1 auto;
  align-items: center;
  background: transparent;
  color: inherit;
  padding: 0;
  text-align: left;
}

.mahallenden-picker__trigger:disabled {
  cursor: not-allowed;
}

.mahallenden-select svg:last-child {
  margin-left: auto;
  flex: 0 0 auto;
}

.mahallenden-picker {
  position: relative;
  min-width: 0;
}

.mahallenden-picker__menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 30;
  display: grid;
  width: min(360px, calc(100vw - 32px));
  max-height: 310px;
  overflow-y: auto;
  border: 1px solid var(--mahallenden-line);
  border-radius: 16px;
  background: #fff;
  padding: 8px;
  box-shadow: 0 20px 46px rgb(17 25 37 / 16%);
}

.mahallenden-select--neighborhood .mahallenden-picker__menu {
  width: min(430px, calc(100vw - 32px));
}

.mahallenden-picker__menu[hidden] {
  display: none;
}

.mahallenden-picker__menu button {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: flex-start;
  border-radius: 12px;
  background: transparent;
  color: var(--mahallenden-navy);
  padding: 0 12px;
  text-align: left;
  font-size: 15px;
  font-weight: 750;
  line-height: 1.2;
}

.mahallenden-picker__menu button:hover,
.mahallenden-picker__menu button:focus-visible,
.mahallenden-picker__menu button.is-selected {
  background: #fff1ea;
  color: var(--mahallenden-orange);
}

.mahallenden-picker__menu button.is-selected::after {
  width: 8px;
  height: 8px;
  margin-left: auto;
  border-radius: 50%;
  background: currentColor;
  content: "";
}

.mahallenden-report-button {
  justify-content: center;
  border-color: transparent;
  background: var(--mahallenden-orange);
  box-shadow: 0 12px 22px rgb(255 79 10 / 20%);
  color: #fff;
  font-size: 16px;
  font-weight: 850;
}

.mahallenden-report-button--icon {
  width: 58px;
  min-width: 58px;
  padding: 0;
}

.mahallenden-report-button:disabled {
  opacity: 0.86;
  cursor: not-allowed;
}

.mahallenden-mobile-summary,
.mahallenden-summary-card,
.mahallenden-insight-card,
.mahallenden-help-card {
  border: 1px solid var(--mahallenden-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--mahallenden-shadow);
}

.mahallenden-mobile-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin-bottom: 26px;
  overflow: hidden;
}

.mahallenden-summary-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: 12px;
  min-width: 0;
  min-height: 90px;
  padding: 10px 14px;
}

.mahallenden-summary-item + .mahallenden-summary-item {
  border-left: 1px solid var(--mahallenden-line);
}

.mahallenden-summary-item > span {
  grid-row: span 2;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 12px;
}

.mahallenden-summary-item strong {
  font-size: 22px;
  line-height: 1;
}

.mahallenden-summary-item small {
  min-width: 0;
  color: var(--mahallenden-muted);
  font-size: 12px;
  font-weight: 650;
}

.mahallenden-summary-item--orange > span {
  background: #fff1ea;
  color: var(--mahallenden-orange);
}

.mahallenden-summary-item--amber > span {
  background: #fff7df;
  color: #e69a00;
}

.mahallenden-summary-item--green > span {
  background: #eaf8ef;
  color: #17a24a;
}

.mahallenden-layout {
  display: grid;
  gap: 18px;
}

.mahallenden-left-rail,
.mahallenden-right-rail {
  display: none;
}

.mahallenden-feed {
  min-width: 0;
}

.mahallenden-feed__heading {
  display: grid;
  gap: 6px;
  margin-bottom: 18px;
}

.mahallenden-feed__heading h1 {
  margin: 0;
  color: var(--mahallenden-navy);
  font-size: 30px;
  line-height: 1.08;
}

.mahallenden-feed__heading p {
  margin: 0;
  color: var(--mahallenden-muted);
  font-size: 14px;
  font-weight: 600;
}

.mahallenden-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-height: 58px;
  margin-bottom: 14px;
  overflow: hidden;
  border: 1px solid var(--mahallenden-line);
  border-radius: 16px;
  background: #fff;
}

.mahallenden-tabs button,
.mahallenden-tabs a {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  background: transparent;
  color: #596173;
  font-size: 14px;
  font-weight: 800;
}

.mahallenden-tabs button.is-active,
.mahallenden-tabs a.is-active {
  color: var(--mahallenden-orange);
}

.mahallenden-tabs button.is-active::after,
.mahallenden-tabs a.is-active::after {
  position: absolute;
  right: 18%;
  bottom: 0;
  left: 18%;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: var(--mahallenden-orange);
  content: "";
}

.mahallenden-mobile-categories {
  display: grid;
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  gap: 10px;
  margin: 0 calc(var(--container-x) * -1) 14px;
  overflow-x: auto;
  padding: 0 var(--container-x) 4px;
  scrollbar-width: none;
}

.mahallenden-mobile-categories::-webkit-scrollbar {
  display: none;
}

.mahallenden-mobile-categories button,
.mahallenden-mobile-categories a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  border: 1px solid var(--mahallenden-line);
  border-radius: 999px;
  background: #fff;
  color: #596173;
  padding: 0 15px;
  font-size: 13px;
  font-weight: 750;
}

.mahallenden-mobile-categories button.is-active,
.mahallenden-mobile-categories a.is-active {
  border-color: rgb(255 79 10 / 32%);
  background: #fff1ea;
  color: var(--mahallenden-orange);
}

.mahallenden-problem-list {
  display: grid;
  gap: 12px;
}

.mahallenden-mobile-screen {
  --mahallenden-navy: #10192b;
  --mahallenden-muted: #667085;
  box-sizing: border-box;
  width: min(100%, 560px);
  margin: 0 auto;
  padding: 18px 18px calc(var(--bottom-nav-height) + 34px);
  color: var(--mahallenden-navy);
}

.mahallenden-mobile-topbar {
  display: grid;
  grid-template-columns: 42px 1fr 42px;
  align-items: center;
  min-height: 48px;
  margin-bottom: 14px;
}

.mahallenden-mobile-topbar > a,
.mahallenden-mobile-topbar > button {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--mahallenden-navy);
}

.mahallenden-mobile-topbar > div {
  display: grid;
  justify-items: center;
  line-height: 1.04;
}

.mahallenden-mobile-topbar span {
  color: var(--mahallenden-navy);
  font-size: 13px;
  font-weight: 850;
}

.mahallenden-mobile-topbar strong {
  color: var(--mahallenden-orange);
  font-size: 24px;
  font-weight: 900;
}

.mahallenden-submit-form {
  display: grid;
  gap: 15px;
}

.mahallenden-submit-form h1 {
  margin: 4px 0 6px;
  font-size: 26px;
  line-height: 1.08;
}

.mahallenden-form-section,
.mahallenden-field {
  display: grid;
  gap: 8px;
}

.mahallenden-form-row-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.mahallenden-form-row-label label,
.mahallenden-field > span {
  color: var(--mahallenden-navy);
  font-size: 14px;
  font-weight: 850;
}

.mahallenden-form-row-label span {
  color: var(--mahallenden-muted);
  font-size: 12px;
  font-weight: 600;
}

.mahallenden-photo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.mahallenden-photo-tile,
.mahallenden-photo-add {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 10px;
}

.mahallenden-photo-tile img {
  object-fit: cover;
}

.mahallenden-photo-tile button {
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 1;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: rgb(16 25 43 / 90%);
  color: #fff;
}

.mahallenden-photo-add {
  display: grid;
  place-items: center;
  gap: 6px;
  border: 1px dashed #b8c0cc;
  background: #fff;
  color: var(--mahallenden-navy);
  font-size: 13px;
  font-weight: 750;
}

.mahallenden-field input,
.mahallenden-field textarea,
.mahallenden-field select {
  width: 100%;
  border: 1px solid #d9e0ea;
  border-radius: 8px;
  background: #fff;
  color: var(--mahallenden-navy);
  font: inherit;
  font-size: 16px;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.mahallenden-field input,
.mahallenden-field select {
  height: 44px;
  padding: 0 13px;
}

.mahallenden-field textarea {
  min-height: 96px;
  resize: vertical;
  padding: 12px 13px 28px;
  line-height: 1.5;
}

.mahallenden-field input:focus,
.mahallenden-field textarea:focus,
.mahallenden-field select:focus {
  border-color: var(--mahallenden-orange);
  box-shadow: 0 0 0 3px rgb(255 89 25 / 14%);
}

.mahallenden-field [aria-invalid="true"] {
  border-color: #d92d20;
}

.mahallenden-field em {
  justify-self: end;
  margin-top: -32px;
  padding-right: 10px;
  color: var(--mahallenden-muted);
  font-size: 12px;
  font-style: normal;
}

.mahallenden-select-field {
  position: relative;
}

.mahallenden-select-field select {
  appearance: none;
  padding-right: 38px;
}

.mahallenden-select-field > svg {
  position: absolute;
  right: 13px;
  bottom: 13px;
  pointer-events: none;
}

.mahallenden-submit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.mahallenden-location-button {
  display: grid;
  grid-template-columns: 42px 1fr 24px;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  border: 1px solid #dfe5ee;
  border-radius: 10px;
  background: #fff;
  color: var(--mahallenden-navy);
  padding: 8px 12px;
  text-align: left;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, color 0.18s ease;
}

.mahallenden-location-button--loading {
  border-color: #ffd0bd;
  background: #fff7f2;
  color: var(--mahallenden-orange);
  box-shadow: 0 8px 18px rgb(255 79 10 / 10%);
}

.mahallenden-location-button--success {
  border-color: #a9e7c0;
  background: #f0fff5;
  color: #168a45;
  box-shadow: 0 8px 18px rgb(34 163 90 / 10%);
}

.mahallenden-location-button--error {
  border-color: #fecaca;
  background: #fff7f7;
  color: #b42318;
}

.mahallenden-location-button > span {
  display: grid;
  gap: 2px;
}

.mahallenden-location-button strong {
  font-size: 15px;
}

.mahallenden-location-button small {
  color: var(--mahallenden-muted);
  font-size: 12px;
}

.mahallenden-submit-cta {
  display: inline-flex;
  width: 100%;
  min-height: 58px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: 1px solid #f04a06;
  border-radius: 12px;
  background: #ff4f0a;
  color: #fff;
  box-shadow: 0 16px 30px rgb(255 79 10 / 32%);
  font-size: 18px;
  font-weight: 900;
  text-shadow: 0 1px 1px rgb(120 36 0 / 18%);
  transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.mahallenden-submit-cta svg {
  color: currentColor;
  stroke-width: 2.4;
}

.mahallenden-submit-cta:hover:not(:disabled) {
  background: #f04405;
  border-color: #db3e04;
  box-shadow: 0 18px 34px rgb(255 79 10 / 38%);
}

.mahallenden-submit-cta:active:not(:disabled) {
  background: #dc3b03;
  border-color: #bf3102;
  box-shadow: 0 10px 22px rgb(255 79 10 / 26%);
  transform: translateY(1px);
}

.mahallenden-submit-cta:disabled {
  border-color: #ffb199;
  background: #ffd7cc;
  color: #9f3412;
  box-shadow: none;
  cursor: progress;
  text-shadow: none;
}

.mahallenden-photo-add:disabled {
  opacity: 0.7;
  cursor: progress;
}

.mahallenden-field-error,
.mahallenden-submit-error {
  margin: 0;
  color: #b42318;
  font-size: 12px;
  font-weight: 700;
}

.mahallenden-submit-error {
  border: 1px solid #fecaca;
  border-radius: 10px;
  background: #fff1f2;
  padding: 10px 12px;
}

.mahallenden-detail-card {
  display: grid;
  gap: 14px;
  min-width: 0;
  overflow: hidden;
}

.mahallenden-detail-hero {
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 226px;
  overflow: hidden;
  border-radius: 14px;
  background: #eef2f7;
}

.mahallenden-detail-card > .mahallenden-detail-hero {
  max-width: 100%;
  justify-self: stretch;
}

.mahallenden-detail-hero img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 226px;
  object-fit: cover;
}

.mahallenden-detail-placeholder {
  display: grid;
  min-height: 226px;
  place-items: center;
  gap: 8px;
  color: var(--mahallenden-muted);
  font-weight: 750;
}

.mahallenden-gallery-count {
  position: absolute;
  right: 12px;
  bottom: 12px;
  border-radius: 999px;
  background: rgb(16 25 43 / 74%);
  color: #fff;
  padding: 5px 9px;
  font-size: 12px;
  font-weight: 800;
}

.mahallenden-detail-title-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 10px;
}

.mahallenden-detail-title-row h1 {
  margin: 0;
  font-size: 22px;
  line-height: 1.15;
}

.mahallenden-detail-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: -6px 0 0;
  color: var(--mahallenden-muted);
  font-size: 14px;
  font-weight: 650;
}

.mahallenden-detail-description {
  margin: 0;
  color: #263249;
  font-size: 16px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.mahallenden-detail .mahallenden-support {
  justify-items: stretch;
}

.mahallenden-detail .mahallenden-support__button {
  width: 100%;
  min-height: 42px;
  border-radius: 7px;
  background: #fff;
}

.mahallenden-detail .mahallenden-support__button.is-supported {
  background: var(--mahallenden-orange);
}

.mahallenden-detail-panel {
  display: grid;
  gap: 12px;
  border: 1px solid #e4e9f1;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 12px 24px rgb(17 19 24 / 5%);
  padding: 13px;
}

.mahallenden-detail-panel h2 {
  margin: 0;
  font-size: 14px;
  line-height: 1.2;
}

.mahallenden-lifecycle {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.mahallenden-lifecycle::before,
.mahallenden-lifecycle::after {
  position: absolute;
  top: 15px;
  right: 11%;
  left: 11%;
  height: 2px;
  border-radius: 999px;
  background: #d8dde6;
  content: "";
}

.mahallenden-lifecycle::after {
  right: var(--lifecycle-right, 89%);
  background: var(--mahallenden-orange);
}

.mahallenden-lifecycle.is-resolved::after {
  background: #22a35a;
}

.mahallenden-lifecycle__step {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 5px;
  text-align: center;
}

.mahallenden-lifecycle__step > span {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 3px solid #cfd5df;
  border-radius: 999px;
  background: #fff;
  color: #98a2b3;
}

.mahallenden-lifecycle__step.is-done > span {
  border-color: #22a35a;
  background: #22a35a;
  color: #fff;
}

.mahallenden-lifecycle__step.is-active > span {
  border-color: var(--mahallenden-orange);
  color: var(--mahallenden-orange);
}

.mahallenden-lifecycle__step.is-done.is-active > span {
  border-color: #22a35a;
  background: #22a35a;
  color: #fff;
}

.mahallenden-lifecycle__step strong {
  font-size: 12px;
  line-height: 1.2;
}

.mahallenden-lifecycle__step small,
.mahallenden-status-note {
  min-height: 14px;
  color: var(--mahallenden-muted);
  font-size: 11px;
  font-weight: 650;
}

.mahallenden-status-note {
  margin: 0;
}

.mahallenden-location-card > div {
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: center;
  gap: 12px;
}

.mahallenden-resolution-card {
  display: grid;
  gap: 12px;
  border: 1px solid #ffe0d3;
  border-radius: 10px;
  background: #fff7f3;
  padding: 14px;
  box-shadow: 0 14px 26px rgb(255 75 18 / 8%);
}

.mahallenden-resolution-card > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 999px;
  background: #e9f8ef;
  color: #22a35a;
}

.mahallenden-resolution-card h2 {
  margin: 0;
  color: var(--mahallenden-navy);
  font-size: 17px;
  line-height: 1.25;
}

.mahallenden-resolution-card p {
  margin: 5px 0 0;
  color: var(--mahallenden-muted);
  font-size: 13px;
  line-height: 1.5;
}

.mahallenden-resolution-card.is-confirmed,
.mahallenden-resolution-card.is-reopened {
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
}

.mahallenden-resolution-card.is-confirmed {
  border-color: #bcebd0;
  background: #f1fbf5;
}

.mahallenden-resolution-card.is-reopened {
  border-color: #ffd3bf;
  background: #fff7f3;
}

.mahallenden-resolution-card.is-reopened > span {
  background: #fff0e8;
  color: var(--mahallenden-orange);
}

.mahallenden-resolution-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
}

.mahallenden-resolution-button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 8px;
  padding: 0 14px;
  font-weight: 850;
  cursor: pointer;
}

.mahallenden-resolution-button:disabled {
  opacity: .68;
  cursor: not-allowed;
}

.mahallenden-resolution-button--yes {
  border: 1px solid #22a35a;
  background: #22a35a;
  color: #fff;
}

.mahallenden-resolution-button--no {
  border: 1px solid var(--mahallenden-orange);
  background: #fff;
  color: var(--mahallenden-orange);
}

.mahallenden-resolution-error {
  color: #b42318 !important;
  font-weight: 750;
}

.mahallenden-location-card p,
.mahallenden-location-card small {
  grid-column: 2;
  margin: 0;
}

.mahallenden-location-pin {
  grid-row: 1 / span 2;
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border-radius: 10px;
  background: #fff3ed;
  color: var(--mahallenden-orange);
}

.mahallenden-directions-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  border: 1px solid #d7dee9;
  border-radius: 7px;
  color: var(--mahallenden-navy);
  font-size: 14px;
  font-weight: 800;
}

.mahallenden-thumb-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.mahallenden-thumb-strip button {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 8px;
  background: #eef2f7;
}

.mahallenden-thumb-strip button.is-active {
  border-color: var(--mahallenden-orange);
}

.mahallenden-thumb-strip img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mahallenden-support-count {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  border: 1px solid #e4e9f1;
  border-radius: 7px;
  background: #fff;
  color: var(--mahallenden-navy);
  padding: 0 13px;
  font-size: 14px;
  font-weight: 850;
}

.mahallenden-detail-empty,
.mahallenden-detail-skeleton {
  display: grid;
  gap: 12px;
  border: 1px solid #e4e9f1;
  border-radius: 14px;
  background: #fff;
  padding: 24px;
  text-align: center;
}

.mahallenden-detail-empty h1,
.mahallenden-detail-empty p {
  margin: 0;
}

.mahallenden-detail-empty a {
  justify-self: center;
  border-radius: 999px;
  background: var(--mahallenden-orange);
  color: #fff;
  padding: 10px 16px;
  font-weight: 800;
}

.mahallenden-detail-skeleton span {
  height: 16px;
  border-radius: 999px;
  background: linear-gradient(90deg, #eef2f7, #f8fafc, #eef2f7);
}

.mahallenden-detail-skeleton span:first-child {
  height: 226px;
  border-radius: 14px;
}

.mahallenden-problem-card {
  display: grid;
  grid-template-columns: minmax(118px, 38%) minmax(0, 1fr);
  gap: 14px;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--mahallenden-line);
  border-radius: 18px;
  background: #fff;
  padding: 12px;
  box-shadow: 0 10px 24px rgb(17 25 37 / 5%);
}

.mahallenden-problem-card__media {
  position: relative;
  height: 142px;
  min-height: 142px;
  align-self: start;
  overflow: hidden;
  border-radius: 12px;
  background: #f2f4f7;
}

.mahallenden-problem-card__media img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mahallenden-problem-card__placeholder {
  display: grid;
  width: 100%;
  height: 100%;
  min-height: 142px;
  place-items: center;
  background:
    linear-gradient(135deg, rgb(255 79 10 / 10%), transparent),
    #f4f6f8;
  color: var(--mahallenden-muted);
}

.mahallenden-problem-card__body {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 8px;
}

.mahallenden-problem-card__headline {
  display: grid;
  gap: 8px;
}

.mahallenden-problem-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mahallenden-problem-card__headline h2 {
  min-width: 0;
  margin: 0;
  color: var(--mahallenden-navy);
  font-size: 18px;
  line-height: 1.18;
}

.mahallenden-status {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  min-height: 32px;
  align-items: center;
  gap: 8px;
  border-radius: 999px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 850;
}

.mahallenden-status span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
}

.mahallenden-status--orange {
  background: #ffe8df;
  color: var(--mahallenden-orange);
}

.mahallenden-status--red {
  background: #ffe7e7;
  color: #d92d20;
}

.mahallenden-status--amber {
  background: #fff1cf;
  color: #d98b00;
}

.mahallenden-status--blue {
  background: #e7f3ff;
  color: #1475bd;
}

.mahallenden-status--green {
  background: #e8f8ee;
  color: #159947;
}

.mahallenden-status--slate {
  background: #eef2f6;
  color: #475467;
}

.mahallenden-owner-badge {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  border-radius: 999px;
  background: #f4f6f8;
  color: #475467;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 850;
}

.mahallenden-owner-badge--green {
  background: #e8f8ee;
  color: #159947;
}

.mahallenden-problem-card__meta,
.mahallenden-problem-card__footer time {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--mahallenden-muted);
  font-size: 13px;
  font-weight: 650;
}

.mahallenden-problem-card__meta span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mahallenden-problem-card__description {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: #222b3a;
  font-size: 14px;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.mahallenden-problem-card__footer {
  display: grid;
  gap: 10px;
  margin-top: 4px;
}

.mahallenden-support {
  display: grid;
  gap: 6px;
  justify-items: start;
}

.mahallenden-support__button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--mahallenden-orange);
  border-radius: 12px;
  background: #fff;
  color: var(--mahallenden-orange);
  padding: 0 13px;
  font-size: 13px;
  font-weight: 850;
}

.mahallenden-support__button.is-supported {
  background: var(--mahallenden-orange);
  color: #fff;
}

.mahallenden-support__button:disabled {
  opacity: 0.72;
  cursor: progress;
}

.mahallenden-support__button strong::before {
  content: "· ";
}

.mahallenden-support__error {
  margin: 0;
  color: #b42318;
  font-size: 12px;
  font-weight: 650;
}

.mahallenden-state {
  display: grid;
  justify-items: center;
  gap: 10px;
  border: 1px solid var(--mahallenden-line);
  border-radius: 18px;
  background: #fff;
  padding: 34px 18px;
  text-align: center;
  box-shadow: var(--mahallenden-shadow);
}

.mahallenden-state strong {
  font-size: 18px;
}

.mahallenden-state p {
  max-width: 420px;
  margin: 0;
  color: var(--mahallenden-muted);
  font-size: 14px;
  line-height: 1.45;
}

.mahallenden-state button:not(.mahallenden-report-button),
.mahallenden-load-more {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--mahallenden-line);
  border-radius: 12px;
  background: #fff;
  color: var(--mahallenden-orange);
  padding: 0 16px;
  font-size: 14px;
  font-weight: 850;
}

.mahallenden-load-more {
  width: 100%;
  margin-top: 12px;
}

.mahallenden-user-page {
  display: grid;
  gap: 18px;
}

.mahallenden-user-hero {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.mahallenden-user-hero h1 {
  margin: 10px 0 6px;
  color: var(--mahallenden-navy);
  font-size: clamp(28px, 5vw, 44px);
  line-height: 1.05;
}

.mahallenden-user-hero p {
  max-width: 560px;
  margin: 0;
  color: var(--mahallenden-muted);
  font-size: 15px;
  line-height: 1.5;
}

.mahallenden-owner-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--mahallenden-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--mahallenden-shadow);
}

.mahallenden-owner-summary .mahallenden-summary-item {
  min-width: 0;
  padding: 14px 12px;
}

.mahallenden-owner-summary .mahallenden-summary-item + .mahallenden-summary-item {
  border-left: 1px solid var(--mahallenden-line);
}

.mahallenden-spin {
  animation: mahallenden-spin 0.9s linear infinite;
}

.mahallenden-problem-card--skeleton {
  grid-template-columns: minmax(118px, 38%) minmax(0, 1fr);
}

.mahallenden-problem-card--skeleton span,
.mahallenden-problem-card--skeleton i {
  display: block;
  border-radius: 12px;
  background: linear-gradient(90deg, #edf0f5, #f8fafc, #edf0f5);
  background-size: 220% 100%;
  animation: mahallenden-skeleton 1.4s ease-in-out infinite;
}

.mahallenden-problem-card--skeleton span {
  min-height: 142px;
}

.mahallenden-problem-card--skeleton div {
  display: grid;
  align-content: start;
  gap: 14px;
}

.mahallenden-problem-card--skeleton i {
  height: 18px;
}

.mahallenden-problem-card--skeleton i:first-child {
  width: 70%;
}

.mahallenden-problem-card--skeleton i:nth-child(2) {
  width: 92%;
}

.mahallenden-problem-card--skeleton i:last-child {
  width: 48%;
  height: 40px;
  margin-top: 22px;
}

@keyframes mahallenden-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes mahallenden-skeleton {
  to {
    background-position: -220% 0;
  }
}

@media (min-width: 760px) {
  .mahallenden-hero__controls {
    grid-template-columns: minmax(150px, 180px) minmax(220px, 1fr) 58px;
    align-items: center;
  }

  .mahallenden-problem-card {
    grid-template-columns: 270px minmax(0, 1fr);
    gap: 20px;
    padding: 14px;
  }

  .mahallenden-problem-card__headline {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  .mahallenden-problem-card__footer {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    margin-top: 12px;
  }

  .mahallenden-support {
    justify-items: end;
  }
}

@media (min-width: 1024px) {
  .mahallenden-page {
    padding-top: 24px;
  }

  .mahallenden-hero {
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    margin-bottom: 22px;
  }

  .mahallenden-hero__brand {
    justify-content: start;
  }

  .mahallenden-hero__brand img {
    width: 250px;
  }

  .mahallenden-hero__controls {
    grid-template-columns: minmax(160px, 190px) minmax(260px, 1fr) 58px;
  }

  .mahallenden-mobile-summary,
  .mahallenden-mobile-categories {
    display: none;
  }

  .mahallenden-layout {
    grid-template-columns: 250px minmax(0, 1fr);
    align-items: start;
  }

  .mahallenden-left-rail {
    position: sticky;
    top: calc(var(--header-height) + 18px);
    display: grid;
    gap: 16px;
  }

  .mahallenden-summary-card {
    display: grid;
    gap: 0;
    padding: 16px;
  }

  .mahallenden-summary-card .mahallenden-summary-item {
    padding: 12px 6px;
  }

  .mahallenden-summary-card .mahallenden-summary-item + .mahallenden-summary-item {
    border-top: 1px solid var(--mahallenden-line);
    border-left: 0;
  }

  .mahallenden-category-nav {
    display: grid;
    gap: 8px;
    border: 1px solid var(--mahallenden-line);
    border-radius: 18px;
    background: #fff;
    padding: 14px;
    box-shadow: var(--mahallenden-shadow);
  }

  .mahallenden-category-nav button,
  .mahallenden-category-nav a {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 48px;
    border-radius: 12px;
    background: transparent;
    color: var(--mahallenden-navy);
    padding: 0 12px;
    text-align: left;
    font-size: 14px;
    font-weight: 760;
  }

  .mahallenden-category-nav button.is-active,
  .mahallenden-category-nav a.is-active {
    background: #fff1ea;
    box-shadow: inset 4px 0 0 var(--mahallenden-orange);
    color: var(--mahallenden-orange);
  }

  .mahallenden-feed__heading h1 {
    font-size: 34px;
  }
}

@media (min-width: 1440px) {
  .mahallenden-page {
    padding-right: 28px;
    padding-left: 28px;
  }

  .mahallenden-layout {
    grid-template-columns: 268px minmax(560px, 1fr) 260px;
    gap: 22px;
  }

  .mahallenden-right-rail {
    position: sticky;
    top: calc(var(--header-height) + 18px);
    display: grid;
    gap: 18px;
  }

  .mahallenden-insight-card,
  .mahallenden-help-card {
    display: grid;
    gap: 12px;
    padding: 18px;
  }

  .mahallenden-insight-card h2,
  .mahallenden-help-card h2 {
    margin: 0;
    font-size: 17px;
    line-height: 1.2;
  }

  .mahallenden-insight-card .mahallenden-summary-item {
    min-height: 70px;
    border: 1px solid var(--mahallenden-line);
    border-radius: 12px;
    padding: 10px;
  }

  .mahallenden-insight-card .mahallenden-summary-item + .mahallenden-summary-item {
    border-left: 1px solid var(--mahallenden-line);
  }

  .mahallenden-help-card strong {
    font-size: 15px;
  }

  .mahallenden-help-card p {
    margin: 0;
    color: var(--mahallenden-muted);
    font-size: 13px;
    line-height: 1.5;
  }

  .mahallenden-help-card span,
  .mahallenden-help-card a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid var(--mahallenden-orange);
    border-radius: 12px;
    color: var(--mahallenden-orange);
    font-weight: 850;
  }
}

@media (max-width: 560px) {
  .mahallenden-page {
    padding-top: 12px;
  }

  .mahallenden-user-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mahallenden-user-links a {
    justify-content: center;
  }

  .mahallenden-user-hero {
    align-items: stretch;
  }

  .mahallenden-user-hero .mahallenden-report-button {
    justify-content: center;
  }

  .mahallenden-owner-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mahallenden-owner-summary .mahallenden-summary-item + .mahallenden-summary-item {
    border-left: 0;
  }

  .mahallenden-hero__brand img {
    width: min(70vw, 270px);
  }

  .mahallenden-hero__controls {
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr) 58px;
    gap: 10px;
  }

  .mahallenden-select {
    min-height: 54px;
    border-radius: 14px;
    padding: 0 12px;
  }

  .mahallenden-select strong {
    font-size: 14px;
  }

  .mahallenden-report-button {
    min-height: 54px;
  }

  .mahallenden-feed__heading h1 {
    font-size: 27px;
  }

  .mahallenden-mobile-summary .mahallenden-summary-item {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 4px;
    text-align: center;
    padding: 14px 8px;
  }

  .mahallenden-mobile-summary .mahallenden-summary-item > span {
    grid-row: auto;
    width: 38px;
    height: 38px;
  }

  .mahallenden-problem-card {
    grid-template-columns: minmax(108px, 38%) minmax(0, 1fr);
    gap: 12px;
    padding: 10px;
  }

  .mahallenden-problem-card__media,
  .mahallenden-problem-card__placeholder {
    height: 126px;
    min-height: 126px;
  }

  .mahallenden-problem-card__headline h2 {
    font-size: 16px;
  }

  .mahallenden-status {
    min-height: 28px;
    padding: 0 10px;
    font-size: 11px;
  }

  .mahallenden-problem-card__description {
    font-size: 13px;
    line-height: 1.45;
    -webkit-line-clamp: 2;
  }

  .mahallenden-support__button {
    width: 100%;
    font-size: 12px;
  }
}

.admin-imprint-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(310px, 0.42fr);
  gap: 18px;
  align-items: start;
}

.admin-imprint-legal-people {
  display: grid;
  gap: 12px;
  margin-bottom: 16px;
  border-bottom: 1px solid var(--admin-border);
  padding-bottom: 16px;
}

.admin-person-fields,
.admin-dynamic-list {
  display: grid;
  gap: 10px;
}

.admin-person-fields {
  border: 1px solid #eef1f5;
  border-radius: 12px;
  background: #fbfcfe;
  padding: 12px;
}

.admin-person-fields > strong,
.admin-dynamic-list > label {
  color: var(--admin-text);
  font-size: 12px;
  font-weight: 900;
}

.admin-person-fields input,
.admin-dynamic-row input,
.admin-social-row input {
  width: 100%;
  min-height: 40px;
  border: 1px solid #dce1e8;
  border-radius: 9px;
  outline: 0;
  background: #fff;
  color: var(--admin-text);
  padding: 0 11px;
  font-size: 13px;
}

.admin-dynamic-row,
.admin-social-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) 38px;
  gap: 8px;
}

.admin-social-row {
  grid-template-columns: minmax(100px, 0.45fr) minmax(0, 1fr) 38px;
  margin-bottom: 8px;
}

.admin-dynamic-row button,
.admin-social-row button {
  display: grid;
  width: 38px;
  height: 40px;
  place-items: center;
  border: 1px solid #fecdd3;
  border-radius: 9px;
  background: #fff1f2;
  color: var(--admin-red);
  padding: 0;
}

.admin-imprint-media-preview {
  width: 100%;
  max-height: 120px;
  border-radius: 10px;
  object-fit: contain;
  background: #f5f7fa;
  padding: 8px;
}

@media (max-width: 760px) {
  .admin-authors-table__head {
    display: none;
  }

  .admin-authors-table__row {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 18px;
  }

  .public-author-hero {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .public-author-hero img,
  .public-author-hero > span {
    margin: 0 auto;
  }

  .public-author-socials {
    justify-content: center;
  }

  .admin-imprint-grid,
  .public-imprint-about,
  .public-imprint-contact-card,
  .site-footer__inner {
    grid-template-columns: 1fr;
  }

  .admin-dynamic-row,
  .admin-social-row,
  .public-imprint-list,
  .public-imprint-people,
  .public-imprint-socials {
    grid-template-columns: 1fr;
  }

  .site-footer {
    padding-bottom: calc(105px + env(safe-area-inset-bottom));
  }

  .site-footer__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 18px;
  }

  .site-footer__brand,
  .site-footer__contact {
    grid-column: 1 / -1;
  }

  .site-footer__brand {
    display: grid;
    gap: 10px;
  }

  .site-footer__brand p {
    margin: 0;
  }

  .site-footer__logo img {
    max-width: 140px;
  }

  .site-footer__socials {
    margin-top: 2px;
  }

  .site-footer__links {
    gap: 8px;
  }

  .site-footer__links h2,
  .site-footer__contact h2 {
    margin-bottom: 6px;
  }

  .site-footer__links a,
  .site-footer__links span {
    font-size: 14px;
    line-height: 1.35;
  }

  .site-footer__contact {
    gap: 9px;
    border-top: 1px solid rgb(255 255 255 / 10%);
    padding-top: 18px;
  }

  .site-footer__contact p,
  .site-footer__contact a {
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
  }

  .site-footer__bottom {
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 22px;
    text-align: center;
  }

  .site-footer__bottom span:nth-child(3) {
    text-align: center;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .site-footer__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.admin-login-page {
  display: grid;
  min-height: 100dvh;
  place-items: center;
  background:
    radial-gradient(circle at 15% 12%, rgb(152 40 154 / 16%), transparent 34%),
    linear-gradient(135deg, #101318 0%, #171923 48%, #24132b 100%);
  padding: 24px;
}

.admin-login-card {
  display: grid;
  width: min(100%, 440px);
  gap: 22px;
  border: 1px solid rgb(255 255 255 / 10%);
  border-radius: 18px;
  background: rgb(255 255 255 / 96%);
  box-shadow: 0 26px 70px rgb(0 0 0 / 32%);
  padding: 28px;
}

.admin-login-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.admin-login-brand img {
  width: 150px;
  height: auto;
  object-fit: contain;
}

.admin-login-brand span {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  border-radius: 999px;
  background: #f7e9f8;
  color: var(--color-red);
  padding: 0 12px;
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
}

.admin-login-copy {
  display: grid;
  gap: 8px;
}

.admin-login-copy h1,
.admin-login-copy p,
.admin-login-alert {
  margin: 0;
}

.admin-login-copy h1 {
  color: #111318;
  font-size: 34px;
  line-height: 1.08;
}

.admin-login-copy p {
  color: #667085;
  font-size: 15px;
  line-height: 1.5;
}

.admin-login-alert {
  border: 1px solid #ffd0d0;
  border-radius: 12px;
  background: #fff5f5;
  color: #b42318;
  padding: 12px;
  font-size: 14px;
  font-weight: 750;
}

.admin-login-form {
  display: grid;
  gap: 15px;
}

.admin-login-field {
  display: grid;
  gap: 8px;
  color: #111318;
  font-size: 13px;
  font-weight: 850;
}

.admin-login-field > div {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  border: 1px solid #dce1e8;
  border-radius: 12px;
  background: #fff;
  color: #667085;
  padding: 0 14px;
}

.admin-login-field input {
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #111318;
  font-size: 15px;
}

.admin-login-field button {
  display: grid;
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  place-items: center;
  border-radius: 999px;
  background: transparent;
  color: #667085;
  padding: 0;
}

.admin-login-field small {
  color: #b42318;
  font-size: 12px;
}

.admin-login-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #475467;
  font-size: 14px;
  font-weight: 700;
}

.admin-login-check input {
  width: 18px;
  height: 18px;
  accent-color: var(--color-red);
}

.admin-login-submit {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: var(--color-red);
  color: #fff;
  padding: 0 18px;
  font-size: 16px;
  font-weight: 900;
  box-shadow: 0 14px 28px rgb(152 40 154 / 24%);
}

.admin-login-submit:disabled {
  opacity: 0.68;
  cursor: progress;
}

.admin-login-home {
  justify-self: center;
  color: #667085;
  font-size: 14px;
  font-weight: 750;
}

.admin-mahallenden-page {
  display: grid;
  gap: 18px;
}

.admin-mahallenden-kicker {
  display: inline-flex;
  width: max-content;
  min-height: 28px;
  align-items: center;
  border-radius: 999px;
  background: #fff1ea;
  color: #ff4f0a;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 900;
}

.admin-mahallenden-tabs,
.admin-mahallenden-filters,
.admin-mahallenden-card {
  border: 1px solid var(--admin-border);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgb(15 23 42 / 5%);
}

.admin-mahallenden-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 10px;
}

.admin-mahallenden-tabs button {
  min-height: 40px;
  border-radius: 999px;
  background: #f5f7fb;
  color: #475467;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 850;
  white-space: nowrap;
}

.admin-mahallenden-tabs button.is-active {
  background: #fff1ea;
  color: #ff4f0a;
  box-shadow: inset 0 0 0 1px #ffb899;
}

.admin-mahallenden-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) repeat(7, minmax(120px, 1fr));
  gap: 10px;
  padding: 12px;
}

.admin-mahallenden-filters select,
.admin-mahallenden-filters input[type="date"] {
  min-width: 0;
  min-height: 42px;
  border: 1px solid #dce1e8;
  border-radius: 10px;
  background: #fff;
  color: var(--admin-text);
  padding: 0 10px;
  font-size: 13px;
  font-weight: 700;
}

.admin-mahallenden-card {
  overflow: hidden;
}

.admin-mahallenden-list {
  display: grid;
}

.admin-mahallenden-row {
  display: grid;
  grid-template-columns: 72px minmax(220px, 1.5fr) minmax(160px, 0.9fr) 118px 128px 118px 88px;
  align-items: center;
  gap: 12px;
  min-height: 92px;
  border-bottom: 1px solid var(--admin-border);
  background: #fff;
  color: var(--admin-text);
  padding: 12px 14px;
  text-align: left;
}

.admin-mahallenden-row:hover {
  background: #fffaf7;
}

.admin-mahallenden-row.is-unread {
  position: relative;
  background: #fff7f2;
}

.admin-mahallenden-row.is-unread:hover {
  background: #fff1e8;
}

.admin-mahallenden-row.is-unread::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: var(--mahallenden-orange);
  content: "";
}

.admin-mahallenden-row > span:not(.admin-mahallenden-thumb):not(.admin-mahallenden-badge),
.admin-mahallenden-row time {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.admin-mahallenden-row strong,
.admin-mahallenden-row small,
.admin-mahallenden-row em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-mahallenden-row strong {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 14px;
}

.admin-mahallenden-new-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: var(--mahallenden-orange);
}

.admin-mahallenden-new-badge {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  border-radius: 999px;
  background: #fff0e8;
  color: var(--mahallenden-orange) !important;
  padding: 0 8px;
  font-size: 11px !important;
  font-style: normal;
  font-weight: 850;
}

.admin-mahallenden-row small,
.admin-mahallenden-row em,
.admin-mahallenden-row time,
.admin-mahallenden-count {
  color: #667085;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.admin-mahallenden-thumb {
  position: relative;
  display: grid;
  width: 72px;
  height: 58px;
  place-items: center;
  overflow: hidden;
  border-radius: 10px;
  background: #f2f4f7;
  color: #98a2b3;
}

.admin-mahallenden-thumb img,
.admin-mahallenden-gallery img {
  object-fit: cover;
}

.admin-mahallenden-badge {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #f2f4f7;
  color: #344054;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 850;
}

.admin-mahallenden-state {
  display: grid;
  min-height: 220px;
  place-items: center;
  align-content: center;
  gap: 8px;
  color: #667085;
  padding: 28px;
  text-align: center;
}

.admin-banner-grid {
  display: grid;
  gap: 18px;
}

.admin-banner-page .admin-card {
  display: grid;
  gap: 14px;
}

.admin-banner-page .admin-card h2 {
  margin: 0;
  font-size: 18px;
}

.admin-banner-helper {
  display: grid;
  gap: 4px;
  margin: 0;
  color: #667085;
  font-size: 13px;
  font-weight: 700;
}

.admin-banner-helper strong {
  color: var(--admin-text);
}

.admin-banner-upload {
  position: relative;
  display: grid;
  aspect-ratio: 3 / 1;
  width: 100%;
  place-items: center;
  overflow: hidden;
  border: 1px dashed #b9c2cf;
  border-radius: 10px;
  background: #f8fafc;
  color: #667085;
  cursor: pointer;
}

.admin-banner-upload img {
  object-fit: contain;
}

.admin-banner-upload > span {
  position: absolute;
  right: 14px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 999px;
  background: #fff;
  color: var(--admin-text);
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 850;
  box-shadow: 0 8px 20px rgb(17 19 24 / 14%);
}

.admin-banner-current {
  display: grid;
  gap: 8px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #f8fafc;
  padding: 14px;
  color: #667085;
  font-weight: 750;
}

@media (min-width: 960px) {
  .admin-banner-grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(280px, .8fr);
    align-items: start;
  }
}

.admin-mahallenden-state strong {
  color: var(--admin-text);
  font-size: 18px;
}

.admin-mahallenden-state p {
  max-width: 420px;
  margin: 0;
}

.admin-mahallenden-drawer {
  width: min(920px, calc(100vw - 34px));
}

.admin-mahallenden-detail {
  display: grid;
  gap: 18px;
}

.admin-mahallenden-gallery {
  display: grid;
  gap: 10px;
}

.admin-mahallenden-gallery > div {
  position: relative;
  display: grid;
  min-height: 300px;
  place-items: center;
  overflow: hidden;
  border-radius: 14px;
  background: #f2f4f7;
  color: #98a2b3;
}

.admin-mahallenden-gallery nav {
  display: flex;
  gap: 8px;
  overflow-x: auto;
}

.admin-mahallenden-gallery nav button {
  position: relative;
  width: 64px;
  height: 52px;
  min-width: 64px;
  min-height: 52px;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 8px;
  background: #eef2f7;
}

.admin-mahallenden-gallery nav button.is-active {
  border-color: #ff4f0a;
}

.admin-mahallenden-detail-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.admin-mahallenden-detail-title h3,
.admin-mahallenden-actions h3,
.admin-mahallenden-history h3 {
  margin: 0;
  color: var(--admin-text);
}

.admin-mahallenden-detail p {
  margin: 0;
  color: #344054;
  line-height: 1.55;
}

.admin-mahallenden-detail dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0 0;
}

.admin-mahallenden-detail dl div,
.admin-mahallenden-actions,
.admin-mahallenden-history {
  display: grid;
  gap: 10px;
  border: 1px solid var(--admin-border);
  border-radius: 14px;
  background: #fff;
  padding: 14px;
}

.admin-mahallenden-detail dt {
  color: #667085;
  font-size: 12px;
  font-weight: 850;
}

.admin-mahallenden-detail dd {
  margin: 4px 0 0;
  color: var(--admin-text);
  font-size: 14px;
  font-weight: 750;
}

.admin-mahallenden-actions > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-mahallenden-actions label {
  display: grid;
  gap: 6px;
  color: #667085;
  font-size: 12px;
  font-weight: 850;
}

.admin-mahallenden-actions select,
.admin-mahallenden-actions textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid #dce1e8;
  border-radius: 10px;
  outline: 0;
  background: #fff;
  color: var(--admin-text);
  padding: 10px;
  font-size: 13px;
  font-weight: 700;
}

.admin-mahallenden-actions textarea {
  min-height: 78px;
  resize: vertical;
}

.admin-mahallenden-history article {
  display: grid;
  gap: 4px;
  border-left: 3px solid #ffb899;
  padding-left: 10px;
}

.admin-mahallenden-history article strong {
  color: var(--admin-text);
  font-size: 13px;
}

.admin-mahallenden-history article small,
.admin-mahallenden-history article p {
  color: #667085;
  font-size: 12px;
}

@media (max-width: 1180px) {
  .admin-mahallenden-filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .admin-mahallenden-filters .admin-list-search {
    grid-column: 1 / -1;
  }

  .admin-mahallenden-row {
    grid-template-columns: 72px minmax(220px, 1fr) repeat(3, minmax(104px, auto));
  }

  .admin-mahallenden-row > span:nth-of-type(3),
  .admin-mahallenden-row time {
    display: none;
  }
}

@media (max-width: 760px) {
  .admin-mahallenden-filters,
  .admin-mahallenden-detail dl {
    grid-template-columns: 1fr;
  }

  .admin-mahallenden-row {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .admin-mahallenden-row > *:not(.admin-mahallenden-thumb):not(:nth-child(2)) {
    display: none;
  }
}

@media (max-width: 560px) {
  .admin-login-page {
    padding: 18px;
  }

  .admin-login-card {
    padding: 22px;
  }

  .admin-login-brand {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-login-copy h1 {
    font-size: 29px;
  }
}

.article-comments-section {
  display: grid;
  gap: 18px;
  margin: 28px 0;
  border: 1px solid #e5eaf2;
  border-radius: 18px;
  background: #fff;
  padding: clamp(18px, 4vw, 28px);
  box-shadow: 0 18px 50px rgba(16, 24, 40, .07);
}

.article-comments-section__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.article-comments-section__header h2 {
  margin: 6px 0 0;
  color: #101828;
  font-size: clamp(24px, 4vw, 34px);
}

.article-comments-section__header strong {
  white-space: nowrap;
  color: #a12aa5;
  font-size: 15px;
}

.article-comments-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #667085;
  font-size: 13px;
  font-weight: 850;
}

.article-comment-form {
  display: grid;
  gap: 14px;
  border: 1px solid #edf0f5;
  border-radius: 16px;
  background: #fbfcfe;
  padding: 16px;
}

.article-comment-form p,
.article-comments-empty {
  margin: 0;
  color: #667085;
  line-height: 1.55;
}

.article-comment-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.article-comment-form label {
  display: grid;
  gap: 7px;
  color: #111827;
  font-weight: 850;
}

.article-comment-form input,
.article-comment-form textarea {
  width: 100%;
  border: 1px solid #d9e0eb;
  border-radius: 12px;
  outline: 0;
  background: #fff;
  color: #101828;
  padding: 13px 14px;
  font: inherit;
  font-weight: 650;
}

.article-comment-form textarea {
  min-height: 128px;
  resize: vertical;
}

.article-comment-form input:focus,
.article-comment-form textarea:focus {
  border-color: #a12aa5;
  box-shadow: 0 0 0 4px rgba(161, 42, 165, .12);
}

.article-comment-honeypot {
  position: absolute;
  left: -10000px;
  width: 1px !important;
  height: 1px;
  opacity: 0;
}

.article-comment-status {
  min-height: 22px;
  font-weight: 800;
}

.article-comment-status--error {
  color: #b42318;
}

.article-comment-status--success {
  color: #138a45;
}

.article-comment-submit,
.article-comments-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  border: 0;
  border-radius: 13px;
  background: linear-gradient(135deg, #a12aa5, #ff4f0a);
  color: #fff;
  padding: 0 20px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 16px 30px rgba(161, 42, 165, .18);
}

.article-comment-submit:disabled,
.article-comments-more:disabled {
  cursor: wait;
  opacity: .68;
  box-shadow: none;
}

.article-approved-comments {
  display: grid;
  gap: 12px;
}

.article-approved-comment {
  display: grid;
  gap: 10px;
  border: 1px solid #edf0f5;
  border-radius: 14px;
  background: #fff;
  padding: 15px;
}

.article-approved-comment > div {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.article-approved-comment strong {
  color: #101828;
  font-size: 16px;
}

.article-approved-comment time {
  color: #667085;
  font-size: 13px;
  font-weight: 750;
}

.article-approved-comment p {
  margin: 0;
  color: #344054;
  line-height: 1.6;
  white-space: pre-wrap;
}

.article-comments-more {
  justify-self: start;
  min-height: 42px;
  background: #fff;
  color: #a12aa5;
  border: 1px solid #e6d7ef;
  box-shadow: none;
}

.admin-comments-page {
  display: grid;
  gap: 18px;
}

.admin-comments-tabs,
.admin-comments-search,
.admin-comments-shell {
  border: 1px solid var(--admin-border);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(16, 24, 40, .05);
}

.admin-comments-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 14px;
}

.admin-comments-tabs button,
.admin-comments-search button,
.admin-comment-actions button {
  border: 0;
  border-radius: 999px;
  background: #f3f5fa;
  color: #4a5568;
  padding: 11px 16px;
  font-weight: 900;
  cursor: pointer;
}

.admin-comments-tabs button.is-active,
.admin-comments-search button,
.admin-comment-actions button:first-child {
  background: #fff3ed;
  color: #ff4f0a;
  box-shadow: inset 0 0 0 1px #ffb899;
}

.admin-comments-search {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
}

.admin-comments-search input {
  border: 0;
  outline: 0;
  color: var(--admin-text);
  font: inherit;
  font-weight: 750;
}

.admin-comments-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  overflow: hidden;
}

.admin-comments-list {
  display: grid;
  align-content: start;
  border-right: 1px solid var(--admin-border);
}

.admin-comment-row {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  gap: 14px;
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--admin-border);
  background: #fff;
  color: inherit;
  padding: 16px;
  text-align: left;
  cursor: pointer;
}

.admin-comment-row.is-unread {
  background: #fff7f2;
  box-shadow: inset 4px 0 0 #ff4f0a;
}

.admin-comment-row__media {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  border-radius: 14px;
  background: #f1edf8;
  color: #a12aa5;
  font-weight: 950;
}

.admin-comment-row__body,
.admin-comment-row__meta,
.admin-comment-detail {
  display: grid;
  gap: 6px;
}

.admin-comment-row__body strong,
.admin-comment-detail__header strong {
  color: var(--admin-text);
  font-weight: 950;
}

.admin-comment-row__body small,
.admin-comment-row__meta,
.admin-comment-detail__header span,
.admin-comment-detail dl {
  color: #667085;
  font-size: 13px;
  font-weight: 750;
}

.admin-comment-row__body em {
  overflow: hidden;
  color: #344054;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-comment-row__meta {
  justify-items: end;
}

.admin-comment-row__meta b {
  border-radius: 999px;
  background: #ff4f0a;
  color: #fff;
  padding: 4px 9px;
  font-size: 12px;
}

.admin-comment-detail {
  align-content: start;
  padding: 18px;
}

.admin-comment-detail__header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.admin-comment-detail__header > div {
  display: grid;
  gap: 4px;
}

.admin-comment-detail__header small {
  align-self: start;
  border-radius: 999px;
  background: #f3f5fa;
  color: #4a5568;
  padding: 7px 10px;
  font-weight: 900;
}

.admin-comment-detail p {
  margin: 10px 0;
  color: #1f2937;
  line-height: 1.65;
  white-space: pre-wrap;
}

.admin-comment-detail dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

.admin-comment-detail dt {
  color: #98a2b3;
  font-size: 12px;
}

.admin-comment-detail dd {
  margin: 3px 0 0;
  color: var(--admin-text);
}

.admin-comment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}

.admin-comment-actions button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.admin-comments-empty,
.admin-comment-detail__empty {
  padding: 28px;
  color: #667085;
  text-align: center;
}

@media (max-width: 860px) {
  .article-comment-form__grid,
  .admin-comments-shell {
    grid-template-columns: 1fr;
  }

  .admin-comments-list {
    border-right: 0;
    border-bottom: 1px solid var(--admin-border);
  }
}

@media (max-width: 560px) {
  .article-comments-section__header,
  .article-approved-comment > div {
    align-items: flex-start;
    flex-direction: column;
  }

  .article-comment-submit {
    width: 100%;
  }

  .admin-comment-row {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .admin-comment-row__meta {
    grid-column: 2;
    justify-items: start;
  }
}

.category-hero-control {
  position: absolute;
  top: 50%;
  z-index: 3;
  display: grid;
  width: 42px;
  height: 42px;
  min-width: 42px;
  min-height: 42px;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 55%);
  border-radius: 50%;
  background: rgb(17 19 24 / 34%);
  color: #fff;
  opacity: 0;
  transform: translateY(-50%);
  transition: opacity 160ms ease, background 160ms ease;
}

.category-hero-carousel:hover .category-hero-control,
.category-hero-control:focus-visible {
  opacity: 1;
}

.category-hero-control:hover {
  background: rgb(152 40 154 / 92%);
}

.category-hero-control--prev {
  left: 14px;
}

.category-hero-control--next {
  right: 14px;
}

.category-hero-card img,
.category-hero-card__content h2 {
  transition: opacity 180ms ease;
}

.category-hero-carousel.is-transitioning .category-hero-card img,
.category-hero-carousel.is-transitioning .category-hero-card__content h2 {
  opacity: .82;
}

@media (max-width: 720px) {
  .category-hero-control {
    display: none;
  }
}

.mahallenden-social-page {
  min-height: 100vh;
  background: #f5f7fb;
  color: #121827;
}

.mahallenden-social-shell {
  width: min(760px, 100%);
  margin: 0 auto;
  padding: 16px 14px 96px;
}

.mahallenden-social-filter {
  position: sticky;
  top: 0;
  z-index: 5;
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 8px;
  padding: 10px 0;
  background: #f5f7fb;
}

.mahallenden-social-filter select,
.mahallenden-social-filter button {
  min-height: 42px;
  border: 1px solid #dfe4ee;
  border-radius: 8px;
  background: #fff;
  color: #252b3a;
  font-weight: 700;
}

.mahallenden-social-filter select[name="category"] {
  grid-column: span 2;
}

.mahallenden-social-filter button,
.mahallenden-floating-report {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: #ff4b17;
}

.mahallenden-floating-report {
  width: 52px;
  height: 52px;
  align-self: center;
  border-radius: 50%;
  background: #ff4b17;
  color: #fff;
  box-shadow: 0 12px 28px rgb(255 75 23 / 24%);
}

.mahallenden-social-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid #e4e8f0;
  background: #fff;
}

.mahallenden-social-tabs a {
  padding: 14px 6px 12px;
  border-bottom: 3px solid transparent;
  color: #687086;
  text-align: center;
  font-weight: 800;
  text-decoration: none;
}

.mahallenden-social-tabs a.is-active {
  border-color: #ff4b17;
  color: #ff4b17;
}

.mahallenden-user-links {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 10px 0 2px;
}

.mahallenden-user-links a {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  border: 1px solid #e2e7f0;
  border-radius: 8px;
  padding: 9px 12px;
  background: #fff;
  color: #495268;
  font-weight: 800;
  text-decoration: none;
}

.mahallenden-social-feed {
  display: grid;
  gap: 16px;
  padding-top: 16px;
}

.mahallenden-social-card {
  overflow: visible;
  border: 1px solid #e2e7f0;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 36px rgb(19 28 45 / 6%);
}

.mahallenden-social-card__header {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 36px;
  gap: 12px;
  align-items: center;
  padding: 16px 16px 8px;
}

.mahallenden-neighborhood-avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;
  background: #eef2f7;
}

.mahallenden-social-card__header h2,
.mahallenden-social-card__header p,
.mahallenden-social-card__text {
  margin: 0;
}

.mahallenden-social-card__header h2 a {
  color: #121827;
  font-size: 18px;
  text-decoration: none;
}

.mahallenden-social-card__header p {
  color: #6c7388;
  font-weight: 600;
}

.mahallenden-card-menu {
  position: relative;
}

.mahallenden-card-menu summary {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  cursor: pointer;
  list-style: none;
}

.mahallenden-card-menu summary::-webkit-details-marker {
  display: none;
}

.mahallenden-card-menu > div {
  position: absolute;
  right: 0;
  z-index: 10;
  display: grid;
  min-width: 210px;
  gap: 6px;
  padding: 10px;
  border: 1px solid #e2e7f0;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 40px rgb(17 24 39 / 14%);
}

.mahallenden-card-menu a,
.mahallenden-card-menu button,
.mahallenden-card-menu select {
  width: 100%;
  color: #30384c;
  font-weight: 700;
  text-align: left;
}

.mahallenden-social-card__text {
  padding: 0 16px 12px;
  color: #30384c;
  font-size: 18px;
  line-height: 1.45;
}

.mahallenden-social-card__photo {
  position: relative;
  display: block;
  margin: 0 16px;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  border-radius: 8px;
  background: #dde3ee;
}

.mahallenden-social-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mahallenden-social-card__photo > span {
  display: grid;
  height: 100%;
  place-items: center;
  color: #7a8498;
}

.mahallenden-status-pill {
  position: absolute;
  left: 12px;
  bottom: 12px;
  padding: 8px 14px;
  border-radius: 999px;
  background: #fff7df;
  color: #d88900;
  font-style: normal;
  font-weight: 800;
}

.mahallenden-status-pill--green {
  background: #e6f8ee;
  color: #159447;
}

.mahallenden-social-card__actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 14px 16px 6px;
}

.mahallenden-social-card__actions form {
  margin: 0;
}

.mahallenden-action {
  display: inline-flex;
  width: 100%;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  background: transparent;
  color: #4f5870;
  font-weight: 800;
  text-decoration: none;
}

.mahallenden-action--support,
.mahallenden-action.is-active {
  color: #ff4b17;
}

.mahallenden-support-line,
.mahallenden-comment-preview {
  padding: 0 16px 14px;
  color: #5b6378;
  font-weight: 700;
}

.mahallenden-comment-preview {
  display: grid;
  gap: 8px;
}

.mahallenden-comment-preview p {
  margin: 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #f2f4f8;
  font-weight: 500;
}

.mahallenden-comment-preview a {
  color: #526078;
  font-weight: 800;
  text-decoration: none;
}

.mahallenden-inline-comments {
  display: grid;
  gap: 10px;
  margin: 0 14px 14px;
  padding-top: 8px;
  border-top: 1px solid #eef1f6;
}

.mahallenden-inline-comments[hidden] {
  display: none;
}

.mahallenden-inline-comments__empty {
  margin: 0;
  color: #6f778b;
  font-size: 13px;
  font-weight: 700;
}

.mahallenden-inline-comment-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.mahallenden-inline-comment-form textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid #dfe4ee;
  border-radius: 8px;
  padding: 10px 12px;
  color: #262d3d;
  font: inherit;
  resize: vertical;
}

.mahallenden-inline-comment-form button,
.mahallenden-inline-login {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 0;
  border-radius: 8px;
  padding: 0 12px;
  background: #ff4b17;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.mahallenden-comment-form {
  display: grid;
  gap: 10px;
}

.mahallenden-comment-form textarea {
  width: 100%;
  border: 1px solid #dfe4ee;
  border-radius: 8px;
  padding: 12px;
  resize: vertical;
}

.mahallenden-comment-form button {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  border-radius: 8px;
  padding: 10px 14px;
  background: #ff4b17;
  color: #fff;
  font-weight: 800;
}

.mahallenden-comment-list {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.mahallenden-comment-item {
  border-radius: 8px;
  background: #f4f6fa;
  padding: 12px;
}

.mahallenden-comment-item span {
  margin-left: 8px;
  color: #d88900;
  font-size: 12px;
  font-weight: 800;
}

.mahallenden-comment-item p {
  margin: 6px 0 0;
}

@media (max-width: 640px) {
  .mahallenden-social-shell {
    padding-inline: 10px;
  }

  .mahallenden-social-filter {
    grid-template-columns: 1fr 52px;
  }

  .mahallenden-social-filter select,
  .mahallenden-social-filter select[name="category"],
  .mahallenden-social-filter button {
    grid-column: 1;
  }

  .mahallenden-floating-report {
    grid-column: 2;
    grid-row: 1 / span 3;
  }

  .mahallenden-social-tabs a {
    font-size: 13px;
  }
}

.mahallenden-social-shell {
  width: min(720px, 100%);
  padding: 14px 18px 96px;
}

.mahallenden-social-filter {
  position: static;
  display: grid;
  gap: 10px;
  padding: 12px 0;
}

.mahallenden-location-row,
.mahallenden-topic-row {
  display: grid;
  gap: 10px;
}

.mahallenden-location-row {
  grid-template-columns: 1fr 1fr;
}

.mahallenden-topic-row {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.mahallenden-location-row label {
  display: grid;
  gap: 4px;
}

.mahallenden-location-row label span {
  color: #6f778b;
  font-size: 12px;
  font-weight: 800;
}

.mahallenden-social-filter select,
.mahallenden-social-filter button,
.mahallenden-report-cta {
  min-height: 44px;
  border: 1px solid #dce2ee;
  border-radius: 8px;
  padding: 0 14px;
  background: #fff;
  color: #262d3d;
  font-size: 15px;
  font-weight: 800;
  line-height: 1;
}

.mahallenden-social-filter button,
.mahallenden-report-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  white-space: nowrap;
}

.mahallenden-social-filter button {
  color: #ff4b17;
}

.mahallenden-report-cta {
  border-color: #ff4b17;
  background: #ff4b17;
  color: #fff;
  text-decoration: none;
}

.mahallenden-floating-report {
  display: none;
}

.mahallenden-floating-camera {
  position: fixed;
  right: max(18px, calc((100vw - 720px) / 2 + 18px));
  bottom: 88px;
  z-index: 20;
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border-radius: 50%;
  background: #ff4b17;
  color: #fff;
  box-shadow: 0 14px 30px rgb(255 75 23 / 28%);
}

.mahallenden-social-tabs {
  border-radius: 0;
}

.mahallenden-social-tabs a {
  padding: 13px 4px 11px;
  font-size: 15px;
  line-height: 1.12;
}

.mahallenden-user-links {
  gap: 8px;
  padding: 12px 0 0;
}

.mahallenden-user-links a {
  min-height: 42px;
  padding: 8px 12px;
  font-size: 14px;
}

.mahallenden-social-card {
  border-radius: 8px;
  box-shadow: 0 10px 26px rgb(19 28 45 / 5%);
}

.mahallenden-social-card__header {
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 10px;
  padding: 14px 14px 6px;
}

.mahallenden-neighborhood-avatar {
  width: 44px;
  height: 44px;
}

.mahallenden-social-card__header h2 a {
  font-size: 16px;
  line-height: 1.2;
}

.mahallenden-social-card__header p {
  font-size: 13px;
  line-height: 1.25;
}

.mahallenden-social-card__text {
  padding: 0 14px 10px;
  font-size: 15px;
  line-height: 1.45;
}

.mahallenden-social-card__photo {
  margin: 0 14px;
  aspect-ratio: 16 / 9.5;
}

.mahallenden-status-pill {
  left: 10px;
  bottom: 10px;
  padding: 7px 12px;
  font-size: 13px;
}

.mahallenden-social-card__actions {
  gap: 4px;
  padding: 10px 10px 4px;
}

.mahallenden-action {
  min-height: 36px;
  gap: 6px;
  font-size: 13px;
}

.mahallenden-action svg {
  width: 21px;
  height: 21px;
}

.mahallenden-support-line,
.mahallenden-comment-preview {
  padding: 0 14px 12px;
  font-size: 13px;
}

.mahallenden-comment-preview p {
  padding: 8px 10px;
  font-size: 13px;
}

@media (max-width: 640px) {
  .mahallenden-social-shell {
    padding: 12px 16px 96px;
  }

  .mahallenden-topic-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .mahallenden-topic-row .mahallenden-report-cta {
    grid-column: span 2;
  }

  .mahallenden-social-filter select,
  .mahallenden-social-filter button,
  .mahallenden-report-cta {
    min-height: 42px;
    font-size: 14px;
  }

  .mahallenden-social-tabs {
    grid-template-columns: repeat(3, 1fr);
  }

  .mahallenden-social-tabs a {
    font-size: 13px;
  }

  .mahallenden-user-links a {
    font-size: 13px;
  }
}

.mahallenden-social-page .mahallenden-social-filter {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  width: 100%;
  max-width: 100%;
}

.mahallenden-social-page .mahallenden-location-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  width: 100%;
}

.mahallenden-social-page .mahallenden-topic-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
  gap: 10px;
  width: 100%;
  align-items: end;
}

.mahallenden-social-page .mahallenden-social-filter select,
.mahallenden-social-page .mahallenden-social-filter select[name="category"],
.mahallenden-social-page .mahallenden-social-filter button,
.mahallenden-social-page .mahallenden-report-cta {
  grid-column: auto;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.mahallenden-social-page .mahallenden-report-cta {
  overflow: hidden;
  text-overflow: ellipsis;
}

.mahallenden-social-page .mahallenden-social-filter button {
  padding-inline: 10px;
}

.mahallenden-social-page .mahallenden-social-tabs {
  margin-top: 10px;
}

.mahallenden-topic-chips {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 0 12px;
  scrollbar-width: none;
}

.mahallenden-topic-chips::-webkit-scrollbar {
  display: none;
}

.mahallenden-topic-chips a {
  flex: 0 0 auto;
  border: 1px solid #dfe5ef;
  border-radius: 999px;
  padding: 9px 13px;
  background: #fff;
  color: #556077;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 6px 16px rgb(18 24 39 / 4%);
}

.mahallenden-topic-chips a.is-active {
  border-color: #ff4b17;
  background: #fff1ec;
  color: #ff4b17;
}

.mahallenden-social-page .mahallenden-social-tabs a {
  min-width: 0;
  overflow-wrap: anywhere;
}

.mahallenden-social-page .mahallenden-user-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.mahallenden-social-page .mahallenden-user-links a {
  justify-content: center;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}

.mahallenden-comment-delete {
  display: inline;
  margin-left: 8px;
}

.mahallenden-comment-delete button {
  border: 0;
  padding: 0;
  background: transparent;
  color: #ff4b17;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

@media (max-width: 760px) {
  .mahallenden-social-page .mahallenden-topic-row {
    grid-template-columns: minmax(0, 1fr) minmax(142px, auto);
  }
}

@media (max-width: 560px) {
  .mahallenden-social-page .mahallenden-social-shell {
    padding-inline: 12px;
  }

  .mahallenden-social-page .mahallenden-location-row {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .mahallenden-social-page .mahallenden-topic-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .mahallenden-social-page .mahallenden-topic-row .mahallenden-report-cta {
    min-height: 40px;
  }

  .mahallenden-social-page .mahallenden-user-links {
    display: flex;
  }

  .mahallenden-social-page .mahallenden-social-filter select,
  .mahallenden-social-page .mahallenden-social-filter button,
  .mahallenden-social-page .mahallenden-report-cta {
    min-height: 40px;
    padding-inline: 10px;
    font-size: 13px;
  }

  .mahallenden-social-page .mahallenden-location-row label span {
    font-size: 11px;
  }
}