/* KIRU Community 150 — Crimson community system. */
body.kiru-community150 {
  --k150-ink: #111022;
  --k150-muted: #706b7f;
  --k150-line: rgba(39, 31, 60, .12);
  --k150-surface: #fff;
  --k150-soft: #f7f3f9;
  --k150-crimson: #ef3158;
  --k150-crimson-deep: #b91845;
  --k150-blush: #ff8eae;
  --k150-violet: #6752be;
  --k150-shadow: 0 22px 70px rgba(58, 30, 68, .09);
}

body.kiru-community150.light #community,
body.kiru-community150:not(.light) #community { color: var(--k150-ink); }

body.kiru-community150:not(.light) {
  --k150-ink: #fbf7ff;
  --k150-muted: #b6aec0;
  --k150-line: rgba(255, 255, 255, .11);
  --k150-surface: #171126;
  --k150-soft: #21162d;
  --k150-shadow: 0 24px 70px rgba(0, 0, 0, .3);
}

#community.k150-community {
  max-width: 1240px;
  margin-inline: auto;
  padding-bottom: 100px;
}

.k150-community-head {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 34px;
  align-items: end;
  overflow: hidden;
  padding: clamp(30px, 5vw, 62px);
  border: 1px solid var(--k150-line);
  border-radius: 34px;
  background:
    radial-gradient(circle at 88% 18%, rgba(255, 95, 133, .3), transparent 27%),
    radial-gradient(circle at 68% 115%, rgba(103, 82, 190, .23), transparent 34%),
    linear-gradient(132deg, #160e24 0%, #351229 58%, #6c1b3b 100%);
  box-shadow: var(--k150-shadow);
  color: #fff;
}

.k150-community-head::after {
  content: "";
  position: absolute;
  right: -120px;
  top: -260px;
  width: 540px;
  height: 540px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 50%;
  box-shadow: 0 0 0 50px rgba(255, 255, 255, .025), 0 0 0 100px rgba(255, 255, 255, .018);
  pointer-events: none;
}

.k150-community-head > * { position: relative; z-index: 1; }
.k150-community-head h1 { max-width: 820px; margin: 9px 0 13px; color: #fff !important; font-size: clamp(45px, 7vw, 88px); line-height: .91; letter-spacing: -.065em; text-shadow: 0 2px 30px rgba(0, 0, 0, .28); }
.k150-community-head > div > p:last-child { max-width: 690px; margin: 0; color: #dfd4e3 !important; font-size: clamp(16px, 2vw, 20px); line-height: 1.55; }
.k150-kicker { margin: 0; color: var(--k150-crimson); font: 900 12px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .16em; text-transform: uppercase; }
.k150-community-head .k150-kicker { color: #ff91aa !important; }

.k150-primary,
.k150-community button,
.k150-dialog button { font: inherit; }

.k150-primary {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 16px;
  background: linear-gradient(135deg, #fa4165, #d92251);
  box-shadow: 0 15px 34px rgba(216, 34, 80, .26);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}

.k150-primary:hover { filter: brightness(1.04); transform: translateY(-1px); }
.k150-primary:disabled { opacity: .55; cursor: wait; transform: none; }

.k150-tabs {
  position: sticky;
  top: 78px;
  z-index: 9;
  display: flex;
  gap: 5px;
  margin: 20px 0 30px;
  padding: 6px;
  overflow-x: auto;
  border: 1px solid var(--k150-line);
  border-radius: 18px;
  background: color-mix(in srgb, var(--k150-surface) 90%, transparent);
  box-shadow: 0 10px 34px rgba(28, 16, 38, .07);
  backdrop-filter: blur(18px);
  scrollbar-width: none;
}

.k150-tabs::-webkit-scrollbar { display: none; }
.k150-tabs button { position: relative; flex: 0 0 auto; min-height: 44px; padding: 0 17px; border: 0; border-radius: 12px; background: transparent; color: var(--k150-muted); font-size: 14px; font-weight: 850; cursor: pointer; }
.k150-tabs button.active { background: var(--k150-ink); color: var(--k150-surface); }
.k150-tabs button span { min-width: 20px; margin-left: 7px; padding: 3px 6px; border-radius: 999px; background: var(--k150-crimson); color: #fff; font-size: 11px; }

.k150-status { margin: -14px 0 24px; padding: 12px 15px; border: 1px solid var(--k150-line); border-radius: 13px; background: var(--k150-soft); color: var(--k150-muted); font-size: 14px; }
.k150-status[data-tone="loading"]::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 9px; border-radius: 50%; background: var(--k150-crimson); animation: k150Pulse .8s ease-in-out infinite alternate; }
@keyframes k150Pulse { to { opacity: .28; transform: scale(.8); } }

.k150-view[hidden] { display: none !important; }
.k150-welcome { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr); gap: 30px; align-items: center; padding: 30px 32px; border: 1px solid var(--k150-line); border-radius: 25px; background: linear-gradient(135deg, color-mix(in srgb, var(--k150-surface) 93%, var(--k150-crimson) 7%), var(--k150-surface)); box-shadow: var(--k150-shadow); }
.k150-welcome h2 { margin: 8px 0 10px; font-size: clamp(31px, 4vw, 48px); line-height: 1; letter-spacing: -.045em; }
.k150-welcome > div > p:last-child { max-width: 650px; margin: 0; color: var(--k150-muted); font-size: 16px; line-height: 1.6; }
.k150-welcome dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; margin: 0; border: 1px solid var(--k150-line); border-radius: 17px; background: var(--k150-line); }
.k150-welcome dl div { display: grid; gap: 7px; padding: 18px; background: var(--k150-surface); }
.k150-welcome dt { color: var(--k150-muted); font-size: 12px; line-height: 1.25; }
.k150-welcome dd { order: -1; margin: 0; color: var(--k150-crimson); font-size: 27px; font-weight: 950; }

.k150-section-head,
.k150-forum-intro { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin: 46px 0 18px; }
.k150-section-head h2,
.k150-forum-intro h2 { margin: 7px 0 0; font-size: clamp(30px, 4.6vw, 50px); line-height: 1; letter-spacing: -.05em; }
.k150-section-head p:last-child,
.k150-forum-intro p:last-child { max-width: 650px; margin: 10px 0 0; color: var(--k150-muted); font-size: 15px; line-height: 1.55; }
.k150-section-head > button:not(.k150-primary),
.k150-forum-intro > button:not(.k150-primary),
.k150-thread-toolbar button { min-height: 42px; padding: 0 15px; border: 1px solid var(--k150-line); border-radius: 13px; background: var(--k150-surface); color: var(--k150-ink); font-weight: 850; cursor: pointer; }

.k150-thread-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.k150-thread-card { display: grid; align-content: start; overflow: hidden; min-width: 0; border: 1px solid var(--k150-line); border-radius: 23px; background: var(--k150-surface); box-shadow: 0 16px 44px rgba(46, 29, 58, .055); }
.k150-thread-context { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 11px; align-items: center; padding: 17px 18px 8px; }
.k150-avatar { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid color-mix(in srgb, var(--k150-crimson) 28%, var(--k150-line)); border-radius: 13px; background: color-mix(in srgb, var(--k150-crimson) 9%, var(--k150-soft)); color: var(--k150-crimson); font-size: 13px; font-weight: 950; }
.k150-avatar.has-image,
.k150-profile-avatar.has-image { overflow: hidden; padding: 0; }
.k150-avatar img,
.k150-profile-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.k150-thread-context div { display: grid; gap: 2px; min-width: 0; }
.k150-thread-context a,
.k150-thread-context b { overflow: hidden; color: var(--k150-ink); font-size: 14px; font-weight: 900; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.k150-thread-context small { overflow: hidden; color: var(--k150-muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.k150-more { min-width: 38px; min-height: 38px; border: 0; border-radius: 12px; background: transparent; color: var(--k150-muted); cursor: pointer; }
.k150-thread-open { display: block; width: 100%; min-height: 190px; padding: 14px 18px 21px; border: 0; background: transparent; color: var(--k150-ink); text-align: left; text-decoration: none; cursor: pointer; }
.k150-thread-open h3 { margin: 16px 0 9px; font-size: clamp(20px, 2.5vw, 27px); line-height: 1.12; letter-spacing: -.035em; }
.k150-thread-open > p { display: -webkit-box; overflow: hidden; margin: 0; color: var(--k150-muted); font-size: 15px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.k150-thread-labels { display: flex; flex-wrap: wrap; gap: 6px; }
.k150-thread-labels i { padding: 6px 8px; border-radius: 999px; background: var(--k150-soft); color: var(--k150-muted); font-size: 10px; font-style: normal; font-weight: 850; }
.k150-thread-labels i:first-child { background: color-mix(in srgb, var(--k150-crimson) 10%, var(--k150-soft)); color: var(--k150-crimson); }
.k150-thread-labels i.spoiler { background: color-mix(in srgb, var(--k150-violet) 12%, var(--k150-soft)); color: var(--k150-violet); }
.k150-thread-open.spoiler-covered { background: repeating-linear-gradient(135deg, transparent 0 10px, color-mix(in srgb, var(--k150-violet) 3%, transparent) 10px 20px); }
.k150-thread-open.spoiler-covered h3 { color: var(--k150-violet); }
.k150-thread-card > footer { display: flex; align-items: center; gap: 6px; padding: 12px 16px; border-top: 1px solid var(--k150-line); background: color-mix(in srgb, var(--k150-soft) 70%, transparent); }
.k150-thread-card > footer button,
.k150-thread-card > footer a { display: inline-flex; min-height: 36px; align-items: center; padding: 0 10px; border: 0; border-radius: 10px; background: transparent; color: var(--k150-muted); font-size: 12px; font-weight: 800; text-decoration: none; cursor: pointer; }
.k150-thread-card > footer button.active { background: color-mix(in srgb, var(--k150-crimson) 10%, var(--k150-surface)); color: var(--k150-crimson); }
.k150-thread-card > footer time { margin-left: auto; color: var(--k150-muted); font-size: 11px; }

.k150-category-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.k150-category-grid > a { display: grid; grid-template-columns: 6px minmax(0, 1fr) auto; gap: 15px; align-items: center; min-height: 100px; padding: 17px 19px; border: 1px solid var(--k150-line); border-radius: 19px; background: var(--k150-surface); color: var(--k150-ink); text-align: left; text-decoration: none; cursor: pointer; }
.k150-category-grid > a:hover,
.k150-category-grid > a:focus-visible { border-color: color-mix(in srgb, var(--k150-crimson) 55%, var(--k150-line)); box-shadow: 0 15px 40px rgba(199, 33, 77, .09); }
.k150-category-grid i { width: 5px; height: 50px; border-radius: 999px; background: var(--k150-crimson); }
.k150-category-grid i[data-accent="violet"] { background: var(--k150-violet); }
.k150-category-grid i[data-accent="blush"] { background: var(--k150-blush); }
.k150-category-grid i[data-accent="ink"] { background: var(--k150-ink); }
.k150-category-grid span { display: grid; gap: 6px; min-width: 0; }
.k150-category-grid b { font-size: 18px; }
.k150-category-grid small { color: var(--k150-muted); font-size: 13px; line-height: 1.4; }
.k150-category-grid em { min-width: 32px; color: var(--k150-muted); font-style: normal; font-weight: 900; text-align: right; }
.k150-thread-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 34px 0 13px; }
.k150-thread-toolbar button.active { border-color: var(--k150-crimson); color: var(--k150-crimson); }
.k150-thread-toolbar span { color: var(--k150-muted); font-size: 13px; }

.k151-starters { display: grid; grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr); gap: 28px; align-items: center; margin-top: 18px; padding: 27px; border: 1px solid color-mix(in srgb, var(--k150-crimson) 22%, var(--k150-line)); border-radius: 25px; background: linear-gradient(135deg, color-mix(in srgb, var(--k150-crimson) 6%, var(--k150-surface)), color-mix(in srgb, var(--k150-violet) 5%, var(--k150-surface))); }
.k151-starters h2 { margin: 7px 0 9px; font-size: clamp(27px, 3vw, 40px); line-height: 1; letter-spacing: -.045em; }
.k151-starters > div:first-child > p:last-child { margin: 0; color: var(--k150-muted); font-size: 14px; line-height: 1.55; }
.k151-starter-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.k151-starter-grid button { display: grid; grid-template-columns: 31px minmax(0, 1fr); gap: 3px 10px; min-height: 86px; align-content: center; padding: 13px 14px; border: 1px solid var(--k150-line); border-radius: 17px; background: color-mix(in srgb, var(--k150-surface) 94%, transparent); color: var(--k150-ink); text-align: left; cursor: pointer; }
.k151-starter-grid button:hover,
.k151-starter-grid button:focus-visible { border-color: var(--k150-crimson); transform: translateY(-1px); }
.k151-starter-grid button > span { grid-row: 1 / 3; align-self: start; color: var(--k150-crimson); font: 900 11px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.k151-starter-grid b { font-size: 14px; }
.k151-starter-grid small { color: var(--k150-muted); font-size: 11px; line-height: 1.35; }

.k150-club-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.k150-club-card { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 18px; padding: 24px; border: 1px solid var(--k150-line); border-radius: 23px; background: var(--k150-surface); box-shadow: 0 16px 44px rgba(46, 29, 58, .055); }
.k150-club-mark { display: grid; width: 74px; height: 74px; place-items: center; border-radius: 22px; background: linear-gradient(135deg, #ef3158, #6f2466); color: #fff; font-size: 21px; font-weight: 950; }
.k150-club-card h3 { margin: 8px 0 9px; font-size: 25px; letter-spacing: -.035em; }
.k150-club-card p:not(.k150-kicker) { margin: 0; color: var(--k150-muted); font-size: 14px; line-height: 1.55; }
.k150-club-card small { display: block; margin-top: 13px; color: var(--k150-muted); }
.k150-club-card > div:last-child { grid-column: 1 / -1; display: flex; gap: 8px; }
.k150-club-card > div:last-child button { min-height: 42px; padding: 0 15px; border: 1px solid var(--k150-line); border-radius: 13px; background: var(--k150-soft); color: var(--k150-ink); font-weight: 850; cursor: pointer; }
.k150-club-card > div:last-child button:last-child { border-color: var(--k150-crimson); background: var(--k150-crimson); color: #fff; }

.k150-notification-list { display: grid; gap: 8px; }
.k150-notification-list > button { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 13px; width: 100%; padding: 16px 18px; border: 1px solid var(--k150-line); border-radius: 17px; background: var(--k150-surface); color: var(--k150-ink); text-align: left; cursor: pointer; }
.k150-notification-list > button.unread { border-color: color-mix(in srgb, var(--k150-crimson) 45%, var(--k150-line)); background: color-mix(in srgb, var(--k150-crimson) 5%, var(--k150-surface)); }
.k150-notification-list > button > span:last-child { display: grid; gap: 5px; }
.k150-notification-list b { font-size: 15px; }
.k150-notification-list small { color: var(--k150-muted); font-size: 13px; line-height: 1.4; }
.k150-notification-list time { color: var(--k150-muted); font-size: 11px; }

.k150-empty { grid-column: 1 / -1; display: grid; justify-items: start; min-height: 240px; align-content: center; padding: 34px; border: 1px dashed color-mix(in srgb, var(--k150-crimson) 40%, var(--k150-line)); border-radius: 23px; background: color-mix(in srgb, var(--k150-crimson) 3%, var(--k150-surface)); }
.k150-empty-mark { display: grid; width: 48px; height: 48px; place-items: center; margin-bottom: 18px; border-radius: 15px; background: color-mix(in srgb, var(--k150-crimson) 12%, var(--k150-soft)); color: var(--k150-crimson); font-size: 20px; }
.k150-empty h2,
.k150-empty h3 { max-width: 660px; margin: 8px 0; font-size: clamp(25px, 4vw, 42px); line-height: 1.05; letter-spacing: -.04em; }
.k150-empty p { max-width: 680px; margin: 0 0 20px; color: var(--k150-muted); font-size: 15px; line-height: 1.6; }
.k150-empty button { min-height: 44px; padding: 0 16px; border: 1px solid var(--k150-line); border-radius: 13px; background: var(--k150-ink); color: var(--k150-surface); font-weight: 850; cursor: pointer; }
.k150-service-empty { min-height: 400px; }
.k150-service-empty small { margin-top: 15px; color: var(--k150-muted); }

.k150-dialog { width: min(960px, calc(100vw - 24px)); max-height: min(900px, calc(100dvh - 24px)); padding: 0; border: 0; background: transparent; }
.k150-dialog::backdrop { background: rgba(12, 7, 20, .76); backdrop-filter: blur(10px); }
.k150-dialog-shell { overflow: hidden; max-height: min(900px, calc(100dvh - 24px)); border: 1px solid rgba(255, 255, 255, .1); border-radius: 28px; background: var(--k150-surface); box-shadow: 0 36px 100px rgba(0, 0, 0, .38); color: var(--k150-ink); }
.k150-dialog-shell > header { display: flex; align-items: start; justify-content: space-between; gap: 20px; padding: 24px 26px; border-bottom: 1px solid var(--k150-line); background: linear-gradient(120deg, color-mix(in srgb, var(--k150-crimson) 8%, var(--k150-surface)), var(--k150-surface)); }
.k150-dialog-shell > header h2 { max-width: 780px; margin: 7px 0 0; font-size: clamp(27px, 4vw, 46px); line-height: 1; letter-spacing: -.045em; }
.k150-dialog-shell > header > button { flex: 0 0 auto; width: 44px; height: 44px; border: 1px solid var(--k150-line); border-radius: 14px; background: var(--k150-surface); color: var(--k150-ink); font-size: 22px; cursor: pointer; }
.k150-dialog-shell > main { overflow-y: auto; max-height: calc(100dvh - 135px); padding: 26px; overscroll-behavior: contain; }

.k150-form { display: grid; gap: 18px; }
.k150-form label { display: grid; gap: 8px; color: var(--k150-ink); font-size: 13px; font-weight: 900; }
.k150-form input,
.k150-form select,
.k150-form textarea { width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid var(--k150-line); border-radius: 14px; outline: 0; background: var(--k150-soft); color: var(--k150-ink); font: 500 16px/1.45 ui-sans-serif, system-ui, sans-serif; }
.k150-form textarea { min-height: 180px; resize: vertical; }
.k150-form input:focus,
.k150-form select:focus,
.k150-form textarea:focus { border-color: var(--k150-crimson); box-shadow: 0 0 0 3px color-mix(in srgb, var(--k150-crimson) 12%, transparent); }
.k150-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.k150-guideline { display: grid; gap: 4px; padding: 15px 17px; border-left: 4px solid var(--k150-crimson); border-radius: 0 14px 14px 0; background: color-mix(in srgb, var(--k150-crimson) 7%, var(--k150-soft)); }
.k150-guideline b { font-size: 14px; }
.k150-guideline span { color: var(--k150-muted); font-size: 13px; line-height: 1.45; }
.k150-form-error { margin: 0; color: #d72249; font-size: 13px; line-height: 1.45; }
.k150-privacy-note { margin: 0; color: var(--k150-muted); font-size: 13px; }
.k151-draft-note { display: grid; gap: 4px; padding: 15px 17px; border: 1px solid color-mix(in srgb, var(--k150-violet) 25%, var(--k150-line)); border-radius: 15px; background: color-mix(in srgb, var(--k150-violet) 7%, var(--k150-soft)); }
.k151-draft-note b { font-size: 14px; }
.k151-draft-note span,
.k151-field-help,
[data-k150-episode-label] small { color: var(--k150-muted); font-size: 11px; font-weight: 600; line-height: 1.4; }
[data-k150-episode-label].required { color: var(--k150-crimson-deep); }
[data-k150-episode-label].required small { color: var(--k150-crimson-deep); }

.k150-community button:focus-visible,
.k150-community a:focus-visible,
.k150-dialog button:focus-visible,
.k150-dialog input:focus-visible,
.k150-dialog select:focus-visible,
.k150-dialog textarea:focus-visible { outline: 3px solid color-mix(in srgb, var(--k150-crimson) 32%, transparent); outline-offset: 3px; }

.k150-thread-detail { display: grid; gap: 17px; }
.k150-opening { padding: 23px; border: 1px solid var(--k150-line); border-radius: 21px; background: var(--k150-soft); }
.k150-opening > p { margin: 22px 0 0; color: var(--k150-ink); font-size: 17px; line-height: 1.72; }
.k150-thread-context [data-k150-follow] { min-height: 38px; padding: 0 12px; border: 1px solid var(--k150-line); border-radius: 12px; background: var(--k150-surface); color: var(--k150-ink); font-size: 12px; font-weight: 850; cursor: pointer; }
.k150-spoiler-cover { display: grid; justify-items: start; margin-top: 22px; padding: 28px; border: 1px solid color-mix(in srgb, var(--k150-violet) 35%, var(--k150-line)); border-radius: 18px; background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--k150-violet) 7%, var(--k150-surface)) 0 12px, var(--k150-surface) 12px 24px); }
.k150-spoiler-cover > span { color: var(--k150-violet); font-size: 26px; }
.k150-spoiler-cover h3 { margin: 11px 0 7px; font-size: 25px; }
.k150-spoiler-cover p { margin: 0 0 17px; color: var(--k150-muted); }
.k150-spoiler-cover button { min-height: 44px; padding: 0 15px; border: 1px solid var(--k150-violet); border-radius: 13px; background: var(--k150-violet); color: #fff; font-weight: 850; cursor: pointer; }
.k150-thread-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.k150-thread-actions button,
.k150-thread-actions a { display: inline-flex; min-height: 40px; align-items: center; padding: 0 13px; border: 1px solid var(--k150-line); border-radius: 12px; background: var(--k150-surface); color: var(--k150-muted); font-size: 12px; font-weight: 850; text-decoration: none; cursor: pointer; }
.k150-thread-actions button.active { border-color: var(--k150-crimson); color: var(--k150-crimson); }
.k150-replies { display: grid; gap: 10px; }
.k150-replies-head { display: flex; align-items: end; justify-content: space-between; gap: 18px; padding: 12px 1px 3px; }
.k150-replies-head h3 { margin: 0; font-size: 24px; }
.k150-replies-head span { color: var(--k150-muted); font-size: 12px; }
.k150-loading { display: flex; align-items: center; gap: 12px; padding: 24px; color: var(--k150-muted); }
.k150-loading span { width: 16px; height: 16px; border: 2px solid var(--k150-line); border-top-color: var(--k150-crimson); border-radius: 50%; animation: k150Spin .7s linear infinite; }
@keyframes k150Spin { to { transform: rotate(360deg); } }
.k150-post { padding: 19px; border: 1px solid var(--k150-line); border-radius: 19px; background: var(--k150-surface); }
.k150-post > header { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 11px; align-items: center; }
.k150-post > header > div { display: grid; gap: 2px; }
.k150-post > header a { color: var(--k150-ink); font-size: 14px; font-weight: 900; text-decoration: none; }
.k150-post > header small { color: var(--k150-muted); font-size: 11px; }
.k150-post > div > p { margin: 18px 0 0; font-size: 16px; line-height: 1.68; }
.k150-post > footer { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 17px; padding-top: 13px; border-top: 1px solid var(--k150-line); }
.k150-post > footer button { min-height: 36px; padding: 0 10px; border: 0; border-radius: 10px; background: transparent; color: var(--k150-muted); font-size: 12px; font-weight: 800; cursor: pointer; }
.k150-post > footer button.active { background: color-mix(in srgb, var(--k150-crimson) 8%, var(--k150-soft)); color: var(--k150-crimson); }
.k150-post-covered button { display: grid; justify-items: start; width: 100%; margin-top: 16px; padding: 20px; border: 1px solid color-mix(in srgb, var(--k150-violet) 35%, var(--k150-line)); border-radius: 15px; background: color-mix(in srgb, var(--k150-violet) 7%, var(--k150-soft)); color: var(--k150-violet); text-align: left; cursor: pointer; }
.k150-post-covered b { font-size: 15px; }
.k150-post-covered span { margin-top: 3px; font-size: 12px; }
.k150-no-replies { margin: 0; padding: 25px; border: 1px dashed var(--k150-line); border-radius: 17px; color: var(--k150-muted); text-align: center; }
.k150-reply-form { display: grid; gap: 12px; padding: 20px; border: 1px solid var(--k150-line); border-radius: 19px; background: var(--k150-soft); }
.k150-reply-form label { display: grid; gap: 7px; font-size: 13px; font-weight: 850; }
.k150-reply-form textarea,
.k150-reply-form select { width: 100%; min-height: 120px; padding: 12px 13px; border: 1px solid var(--k150-line); border-radius: 13px; background: var(--k150-surface); color: var(--k150-ink); font: 500 16px/1.5 ui-sans-serif, system-ui, sans-serif; }
.k150-reply-form select { min-height: 45px; }
.k150-reply-form > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: end; }
.k150-reply-signin { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px; border: 1px solid var(--k150-line); border-radius: 17px; background: var(--k150-soft); }
.k150-reply-signin p { margin: 0; color: var(--k150-muted); }
.k150-locked { margin: 0; padding: 16px; border-radius: 14px; background: var(--k150-soft); color: var(--k150-muted); text-align: center; }

.k150-anime-community { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 18px 0; padding: 22px; border: 1px solid color-mix(in srgb, var(--k150-crimson) 35%, var(--k150-line)); border-radius: 20px; background: linear-gradient(130deg, color-mix(in srgb, var(--k150-crimson) 8%, var(--k150-surface)), var(--k150-surface)); color: var(--k150-ink); }
.k150-anime-community h3 { margin: 7px 0 5px; font-size: 22px; }
.k150-anime-community p:not(.k150-kicker) { margin: 0; color: var(--k150-muted); font-size: 13px; line-height: 1.45; }
.k150-anime-community > div:last-child { display: flex; flex: 0 0 auto; gap: 7px; }
.k150-anime-community > div:last-child button { min-height: 43px; padding: 0 13px; border: 1px solid var(--k150-line); border-radius: 12px; background: var(--k150-surface); color: var(--k150-ink); font-weight: 850; cursor: pointer; }
.k150-anime-community > div:last-child button:first-child { border-color: var(--k150-crimson); background: var(--k150-crimson); color: #fff; }

@media (max-width: 900px) {
  .k150-community-head { grid-template-columns: 1fr; align-items: start; }
  .k150-community-head .k150-primary { justify-self: start; }
  .k150-welcome { grid-template-columns: 1fr; }
  .k151-starters { grid-template-columns: 1fr; }
  .k150-thread-list,
  .k150-category-grid,
  .k150-club-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  #community.k150-community { width: 100%; padding-inline: 14px; }
  .k150-community-head { margin-inline: -2px; padding: 27px 22px; border-radius: 25px; }
  .k150-community-head h1 { font-size: clamp(42px, 14vw, 62px); }
  .k150-community-head > div > p:last-child { font-size: 16px; }
  .k150-community-head .k150-primary { width: 100%; }
  .k150-tabs { top: 65px; margin: 14px -3px 25px; }
  .k150-tabs button { min-height: 46px; padding-inline: 14px; }
  .k150-welcome { padding: 23px 20px; border-radius: 21px; }
  .k150-welcome dl { grid-template-columns: 1fr 1fr 1fr; }
  .k150-welcome dl div { padding: 13px 11px; }
  .k150-welcome dt { font-size: 10px; }
  .k150-welcome dd { font-size: 22px; }
  .k150-section-head,
  .k150-forum-intro { align-items: stretch; flex-direction: column; margin-top: 36px; }
  .k150-section-head > button,
  .k150-forum-intro > button { align-self: start; }
  .k150-thread-open { min-height: 0; }
  .k150-thread-card > footer { flex-wrap: wrap; }
  .k150-category-grid > a { grid-template-columns: 5px minmax(0, 1fr) auto; }
  .k151-starters { padding: 21px 18px; }
  .k151-starter-grid { grid-template-columns: 1fr; }
  .k150-club-card { grid-template-columns: 58px minmax(0, 1fr); padding: 19px; }
  .k150-club-mark { width: 58px; height: 58px; border-radius: 17px; font-size: 17px; }
  .k150-dialog { width: 100vw; max-height: 100dvh; margin: 0; }
  .k150-dialog-shell { max-height: 100dvh; border-radius: 0; }
  .k150-dialog-shell > header { padding: 19px; }
  .k150-dialog-shell > main { max-height: calc(100dvh - 94px); padding: 18px; }
  .k150-form-grid,
  .k150-reply-form > div { grid-template-columns: 1fr; }
  .k150-reply-form .k150-primary { width: 100%; }
  .k150-reply-signin,
  .k150-anime-community { align-items: stretch; flex-direction: column; }
  .k150-anime-community > div:last-child { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .k150-status[data-tone="loading"]::before,
  .k150-loading span { animation: none; }
  .k150-primary:hover { transform: none; }
}

.k150-profile-settings { margin-top: 17px; padding: 10px 14px; border: 1px solid var(--k150-line); border-radius: 12px; background: var(--k150-surface); color: var(--k150-ink); font-weight: 850; cursor: pointer; }
.k150-profile-detail { display: grid; justify-items: start; gap: 12px; }
.k150-profile-avatar { display: grid; place-items: center; width: 82px; height: 82px; border-radius: 24px; background: linear-gradient(135deg, color-mix(in srgb, var(--k150-crimson) 22%, var(--k150-surface)), color-mix(in srgb, var(--k150-violet) 23%, var(--k150-surface))); color: var(--k150-crimson-deep); font-size: 25px; font-weight: 950; }
.k150-profile-handle { margin: -6px 0 0; color: var(--k150-crimson-deep); font-weight: 850; }
.k150-profile-detail > p:not(.k150-profile-handle) { max-width: 560px; margin: 0; color: var(--k150-muted); line-height: 1.6; }
.k150-profile-detail dl { display: flex; gap: 10px; margin: 5px 0; }
.k150-profile-detail dl div { min-width: 125px; padding: 12px; border: 1px solid var(--k150-line); border-radius: 13px; background: var(--k150-soft); }
.k150-profile-detail dt { color: var(--k150-muted); font-size: 10px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.k150-profile-detail dd { margin: 5px 0 0; font-weight: 900; }
.k150-profile-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 8px; }
.k150-profile-actions button { min-height: 42px; padding: 0 14px; border: 1px solid var(--k150-line); border-radius: 12px; background: var(--k150-surface); color: var(--k150-ink); font-weight: 850; cursor: pointer; }
.k150-profile-actions button:first-child { border-color: transparent; background: var(--k150-crimson); color: #fff; }
.k150-check { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 9px; }
.k150-check input { width: 20px !important; height: 20px; margin: 0; }
.k150-review-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.k150-review-card { display: grid; align-content: start; min-width: 0; padding: 20px; border: 1px solid var(--k150-line); border-radius: 21px; background: var(--k150-surface); box-shadow: 0 14px 40px rgba(46, 29, 58, .055); }
.k150-review-card > div:first-child { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.k150-review-card > div:first-child > strong { color: var(--k150-crimson); font-size: 24px; }.k150-review-card > div:first-child small { font-size: 11px; }
.k150-review-card h3 { margin: 15px 0 8px; font-size: 21px; line-height: 1.15; }.k150-review-card > p { color: var(--k150-muted); line-height: 1.55; }
.k150-review-card footer { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 10px; align-items: center; margin-top: auto; padding-top: 15px; border-top: 1px solid var(--k150-line); }.k150-review-card footer b,.k150-review-card footer small { display: block; }.k150-review-card footer small { color: var(--k150-muted); }.k150-review-card footer button { border: 0; background: transparent; color: var(--k150-muted); cursor: pointer; }
.k150-poll { margin: 20px; padding: 20px; border: 1px solid color-mix(in srgb, var(--k150-violet) 28%, var(--k150-line)); border-radius: 20px; background: color-mix(in srgb, var(--k150-violet) 5%, var(--k150-surface)); }.k150-poll h3 { margin: 8px 0 15px; font-size: 24px; }.k150-poll > div { display: grid; gap: 8px; }.k150-poll > div button { position: relative; display: flex; justify-content: space-between; gap: 12px; overflow: hidden; min-height: 47px; padding: 0 14px; border: 1px solid var(--k150-line); border-radius: 12px; background: linear-gradient(90deg,color-mix(in srgb,var(--k150-violet) 14%,var(--k150-surface)) var(--vote),var(--k150-surface) var(--vote)); color: var(--k150-ink); font-weight: 800; cursor: pointer; }.k150-poll > div button.selected { border-color: var(--k150-violet); }.k150-poll > small { display: block; margin-top: 11px; color: var(--k150-muted); }
.k150-club-detail { display: grid; justify-items: start; gap: 14px; }.k150-club-detail > p { max-width: 600px; color: var(--k150-muted); line-height: 1.65; }.k150-club-detail dl { display: flex; gap: 9px; margin: 0; }.k150-club-detail dl div { min-width: 120px; padding: 12px; border: 1px solid var(--k150-line); border-radius: 13px; background: var(--k150-soft); }.k150-club-detail dt { color: var(--k150-muted); font-size: 10px; font-weight: 900; text-transform: uppercase; }.k150-club-detail dd { margin: 5px 0 0; font-weight: 900; }.k150-club-detail > button:not(.k150-primary) { border: 0; background: transparent; color: var(--k150-muted); cursor: pointer; }
@media (max-width: 900px) { .k150-review-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .k150-review-grid { grid-template-columns: 1fr; } .k150-poll { margin: 12px; padding: 16px; } }
.k150-content-menu { display: grid; gap: 8px; }.k150-content-menu button { min-height: 50px; padding: 0 16px; border: 1px solid var(--k150-line); border-radius: 13px; background: var(--k150-surface); color: var(--k150-ink); text-align: left; font-weight: 850; cursor: pointer; }.k150-content-menu button.danger,.k150-confirm-remove .danger { border-color: color-mix(in srgb,var(--k150-crimson) 40%,var(--k150-line)); color: var(--k150-crimson-deep); }.k150-confirm-remove > p { color: var(--k150-muted); line-height: 1.6; }.k150-confirm-remove > div { display: flex; justify-content: end; gap: 9px; }.k150-confirm-remove button { min-height: 46px; padding: 0 16px; border: 1px solid var(--k150-line); border-radius: 13px; background: var(--k150-surface); color: var(--k150-ink); font-weight: 850; cursor: pointer; }
.k150-report-list { display: grid; gap: 10px; }.k150-report-list > article { padding: 18px; border: 1px solid var(--k150-line); border-radius: 18px; background: var(--k150-surface); }.k150-report-list article > div { display: flex; flex-wrap: wrap; gap: 6px; }.k150-report-list article > div span { padding: 5px 8px; border-radius: 999px; background: var(--k150-soft); color: var(--k150-crimson-deep); font-size: 10px; font-weight: 900; text-transform: uppercase; }.k150-report-list h3 { margin: 13px 0 7px; }.k150-report-list p { color: var(--k150-muted); }.k150-report-list button { min-height: 43px; padding: 0 14px; border: 0; border-radius: 12px; background: var(--k150-ink); color: var(--k150-surface); font-weight: 850; cursor: pointer; }
