/* A channel directory within the existing Youshen visual system. */
.main.niche-main {max-width:1416px; padding:28px 60px 72px; margin:0 auto;}
.niche-detail {--niche-muted:#aaaab3; --niche-line:#ffffff16; --niche-accent:#ff6482; font-size:14px; line-height:1.6;}
.niche-detail h1,.niche-detail h2,.niche-detail h3,.niche-detail p,.niche-detail dl,.niche-detail dd {margin:0;}
.niche-detail button,.niche-detail input,.niche-detail select {font:inherit;}
.niche-detail svg {width:18px; height:18px; flex-shrink:0;}
.niche-back {display:inline-flex; gap:9px; align-items:center; min-height:44px; color:var(--niche-muted); font-size:13px;}
.niche-back:hover {color:var(--text);}
.niche-heading {display:flex; align-items:center; justify-content:space-between; gap:40px; padding:28px 0 38px;}
.niche-category-label {color:var(--niche-accent); font-size:13px;}
.niche-heading h1 {font-size:36px; letter-spacing:-.8px; line-height:1.35; margin:9px 0 14px; font-weight:650; overflow-wrap:anywhere;}
.niche-description {color:var(--niche-muted); font-size:14px; max-width:640px;}
.niche-overview {display:flex; flex-shrink:0; gap:36px; text-align:right;}
.niche-overview>div+div {border-left:1px solid var(--niche-line); padding-left:36px;}
.niche-overview dd {font-size:30px; line-height:1.35; font-weight:600; font-variant-numeric:tabular-nums;}
.niche-overview dt {color:var(--niche-muted); font-size:12px; margin-top:6px;}
.niche-toolbar {display:flex; align-items:end; gap:16px; border-top:1px solid var(--niche-line); border-bottom:1px solid var(--niche-line); padding:22px 0; scroll-margin-top:92px;}
.niche-search {display:flex; align-items:center; min-width:0; flex:1; height:46px; border:1px solid var(--line); background:var(--surface); border-radius:8px; padding-left:14px; gap:10px;}
.niche-search>svg {color:var(--niche-muted);}
.niche-search input {width:100%; min-width:0; padding:10px 0; border:0; background:transparent; color:var(--text); outline:none; font-size:14px;}
.niche-search input::placeholder {color:var(--niche-muted);}
.niche-search:focus-within {outline:2px solid var(--niche-accent); outline-offset:2px;}
.niche-search button {background:transparent; border:0; border-left:1px solid var(--niche-line); color:var(--text); padding:0 16px; min-height:44px; flex-shrink:0; font-size:13px; border-radius:0 8px 8px 0;}
.niche-search button:hover {background:#ffffff0b;}
.niche-select {display:flex; flex-direction:column; gap:8px; color:var(--niche-muted); font-size:12px; min-width:164px;}
.niche-select:last-child {min-width:200px;}
.niche-select select {min-height:46px; width:100%; padding:8px 30px 8px 12px; border:1px solid var(--line); border-radius:8px; color:var(--text); background:var(--surface); font-size:13px; cursor:pointer;}
.niche-detail select:focus-visible,.niche-detail button:focus-visible,.niche-detail a:focus-visible {outline:2px solid var(--niche-accent); outline-offset:4px;}
.niche-result-heading {display:flex; align-items:center; justify-content:space-between; gap:16px; padding:30px 0 20px;}
.niche-result-heading h2 {font-size:20px; font-weight:600;}
.niche-result-heading h2 span {color:var(--niche-muted); font-size:14px; font-weight:400; margin-left:9px;}
.niche-result-heading h2:focus {outline:none;}
.niche-result-heading p {color:var(--niche-muted); font-size:12px; display:flex; align-items:center; flex-wrap:wrap;}
.niche-clear {border:0; background:transparent; color:var(--niche-accent); padding:0 0 0 14px; min-height:44px; font-size:12px!important;}
.niche-list-columns,.niche-channel {display:grid; grid-template-columns:minmax(230px,1fr) 112px 150px 160px 132px; align-items:center; gap:26px;}
.niche-list-columns {padding:0 0 14px; color:var(--niche-muted); font-size:12px; border-bottom:1px solid var(--niche-line);}
.niche-channel {padding:24px 0; border-bottom:1px solid var(--niche-line);}
.niche-channel-identity {display:flex; gap:15px; align-items:center; min-width:0;}
.niche-channel-identity>div {min-width:0;}
.niche-avatar {position:relative; width:48px; height:48px; border-radius:50%; overflow:hidden; flex-shrink:0; background:var(--surface); display:grid; place-items:center; color:var(--niche-muted); font-size:20px;}
.niche-avatar img {position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.niche-channel h3 {font-size:17px; line-height:1.4; font-weight:600; overflow-wrap:anywhere;}
.niche-channel h3 a:hover {color:var(--niche-accent);}
.niche-channel-identity p {color:var(--niche-muted); font-size:12px; margin-top:5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:260px;}
.niche-channel-identity small {color:var(--niche-muted); display:block; font-size:12px; margin-top:4px;}
.niche-row-stat strong {display:block; font-size:19px; line-height:1.4; font-weight:550; font-variant-numeric:tabular-nums;}
.niche-row-stat small {color:var(--niche-muted); display:block; font-size:12px; margin-top:7px;}
.niche-mobile-label {display:none;}
.niche-work {position:relative; display:grid; place-items:center; aspect-ratio:16/9; overflow:hidden; background:var(--surface); border-radius:6px; color:var(--niche-muted); font-size:12px;}
.niche-work img {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:opacity .2s;}
.niche-work:hover img {opacity:.8;}
.niche-work small {position:absolute; right:5px; bottom:5px; background:#000c; color:#fff; padding:1px 5px; border-radius:3px; font-size:10px;}
.niche-row-actions {display:flex; align-items:center; justify-content:flex-end; gap:10px;}
.niche-open {display:flex; align-items:center; gap:6px; min-height:44px; color:var(--niche-accent); white-space:nowrap; font-size:13px;}
.niche-open:hover {color:var(--text);}
.niche-open svg {width:16px; height:16px;}
.niche-save {width:44px; height:44px; display:grid; place-items:center; flex-shrink:0; background:transparent; border:1px solid transparent; border-radius:8px; color:var(--niche-muted);}
.niche-save:hover {border-color:var(--line); background:var(--surface); color:var(--text);}
.niche-save.saved {color:var(--niche-accent);}
.niche-pagination {display:flex; justify-content:space-between; align-items:center; gap:20px; padding:25px 0; color:var(--niche-muted); font-size:12px;}
.niche-pagination nav {display:flex; align-items:center; gap:6px;}
.niche-pagination button {display:grid; place-items:center; min-width:44px; height:44px; border:1px solid var(--line); border-radius:7px; background:transparent; color:var(--text);}
.niche-pagination button[aria-current] {background:var(--surface); border-color:var(--niche-accent); color:var(--niche-accent);}
.niche-pagination button:hover:not(:disabled) {background:var(--surface);}
.niche-pagination button:disabled {opacity:.35; cursor:default;}
.niche-empty {padding:65px 20px; text-align:center;}
.niche-empty>svg {width:28px; height:28px; color:var(--niche-muted); margin-bottom:18px;}
.niche-empty h3 {font-size:19px; margin-bottom:9px;}
.niche-empty p {color:var(--niche-muted); margin:12px 0 20px;}
.niche-empty .button {display:inline-flex;}
.niche-data-note {color:var(--niche-muted); font-size:12px; margin-top:20px; max-width:800px;}
.niche-data-note summary {display:flex; align-items:center; width:fit-content; gap:10px; min-height:44px; cursor:pointer; list-style:none;}
.niche-data-note summary::-webkit-details-marker {display:none;}
.niche-data-note summary svg {width:14px; height:14px;}
.niche-data-note[open] summary svg {transform:rotate(180deg);}
.niche-data-note p {margin-top:10px; line-height:1.9;}
@media(max-width:1200px) {
  .main.niche-main {padding-left:32px; padding-right:32px;}
  .niche-list-columns,.niche-channel {grid-template-columns:minmax(180px,1fr) 95px 132px 135px 126px; gap:18px;}
  .niche-overview {gap:24px;}
  .niche-overview>div+div {padding-left:24px;}
}
@media(max-width:900px) {
  .niche-heading {gap:20px; align-items:flex-start;}
  .niche-heading h1 {font-size:30px;}
  .niche-overview dd {font-size:25px;}
  .niche-overview {gap:18px;}
  .niche-overview>div+div {padding-left:18px;}
  .niche-list-columns {display:none;}
  .niche-channel {grid-template-columns:minmax(0,1fr) 112px 145px; gap:18px;}
  .niche-work {grid-column:1; grid-row:2; width:144px;}
  .niche-row-actions {grid-column:2/4; grid-row:2;}
  .niche-mobile-label {display:block; color:var(--niche-muted); font-size:12px; margin-bottom:7px;}
  .niche-select {min-width:145px;}
  .niche-select:last-child {min-width:190px;}
}
@media(max-width:767px) {
  .main.niche-main {padding:16px 20px 48px;}
  .niche-heading {display:block; padding:18px 0 25px;}
  .niche-heading h1 {font-size:28px; letter-spacing:-.5px; margin-top:8px; margin-bottom:11px;}
  .niche-description {font-size:13px;}
  .niche-overview {margin-top:24px!important; text-align:left; gap:28px;}
  .niche-overview>div+div {padding-left:28px;}
  .niche-overview dd {font-size:26px;}
  .niche-toolbar {display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); gap:16px 12px; padding:20px 0; scroll-margin-top:80px;}
  .niche-search {grid-column:1/-1; width:100%;}
  .niche-select,.niche-select:last-child {min-width:0;}
  .niche-select select {padding-left:9px; padding-right:16px; font-size:12px;}
  .niche-search input {font-size:16px;}
  .niche-result-heading {padding:24px 0 4px; align-items:center;}
  .niche-result-heading h2 {font-size:18px;}
  .niche-result-heading>p {justify-content:flex-end;}
  .niche-channel {grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:22px 16px; padding:24px 0;}
  .niche-channel-identity {grid-column:1/-1;}
  .niche-channel-identity p {max-width:240px;}
  .niche-channel h3 {font-size:17px;}
  .niche-row-stat {grid-row:2;}
  .niche-row-stat strong {font-size:20px;}
  .niche-work {grid-column:1; grid-row:3; width:100%; max-width:160px;}
  .niche-row-actions {grid-column:2; grid-row:3; gap:5px;}
  .niche-open {font-size:12px; gap:4px;}
  .niche-pagination {align-items:flex-start; flex-direction:column; gap:16px;}
  .niche-pagination nav {max-width:100%; gap:4px; flex-wrap:wrap;}
  .niche-pagination button {min-width:44px;}
  .niche-data-note {margin-top:5px;}
}
@media(max-width:360px) {
  .main.niche-main {padding-left:16px; padding-right:16px;}
  .niche-heading h1 {font-size:25px;}
  .niche-row-actions {flex-wrap:wrap; gap:0;}
  .niche-channel-identity p {max-width:205px;}
}
@media(prefers-reduced-motion:reduce) {.niche-work img {transition:none;}}