.sec-sub{max-width: 44ch; font-weight: 600; color: var(--mist);}
.page-head-row{display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 24px 40px;}
.head-stats{display: flex; gap: 10px;}
.head-stats div{min-width: 96px; padding: 14px 16px; border-radius: 18px; border: 1px solid var(--line); background: rgba(34, 18, 42, .6); text-align: center;}
.head-stats strong{display: block; font: 800 1.8rem/1 var(--display); color: var(--cream);}
.head-stats small{font-size: .72rem; font-weight: 700; color: var(--dim);}
.seg{display: inline-flex; padding: 4px; border-radius: 999px; border: 1px solid var(--line-2); background: rgba(12, 6, 16, .6);}
.browse-tiles{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none;}
.browse-tiles a{display: grid; gap: 4px; padding: 22px; border-radius: 22px; border: 1px solid var(--line); background: linear-gradient(160deg, rgba(50, 26, 61, .8), rgba(21, 11, 26, .8)); text-decoration: none; transition: border-color .25s, transform .3s var(--ease);}
.browse-tiles a:hover{border-color: var(--rose); transform: translateY(-3px);}
.browse-tiles .icon{width: 28px; height: 28px; margin-bottom: 10px; color: var(--rose-2);}
.browse-tiles strong{font: 800 1.2rem/1.1 var(--display);}
.browse-tiles span{font-size: .84rem; font-weight: 600; color: var(--dim);}
.char-card{position: relative; display: grid; justify-items: center; gap: 4px; height: 100%; padding: 18px 12px 16px; border-radius: 22px; border: 1px solid var(--line); background: linear-gradient(180deg, rgba(50, 26, 61, .7), rgba(21, 11, 26, .7)); text-align: center; text-decoration: none; transition: border-color .25s, transform .3s var(--ease), box-shadow .3s;}
.char-card:hover{border-color: rgba(255, 79, 139, .7); transform: translateY(-4px); box-shadow: 0 18px 40px -18px rgba(255, 46, 126, .8);}
.char-card strong{font: 800 .98rem/1.15 var(--ui);}
.char-card > span{min-height: 2.4em; font-size: .76rem; font-weight: 600; line-height: 1.25; color: var(--dim);}
.char-new{position: absolute; top: 12px; right: 12px; padding: 3px 8px; border-radius: 999px; background: linear-gradient(135deg, #ffd27a, var(--gold)); color: #2a1400; font: 800 .6rem/1 var(--ui); letter-spacing: .12em; text-transform: uppercase;}
.letter-jump a{display: grid; place-items: center; min-width: 34px; height: 34px; border-radius: 10px; font: 800 .82rem/1 var(--ui); color: var(--mist); text-decoration: none;}
.letter-jump a:hover{background: rgba(255, 79, 139, .2); color: var(--cream);}
.voice-player{display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; max-width: 520px; margin-top: 24px; padding: 10px 18px 10px 10px; border-radius: 999px; border: 1px solid rgba(255, 79, 139, .4); background: rgba(255, 79, 139, .08);}
.series-card, .collection-card{display: grid; gap: 4px; height: 100%; padding: 20px; border-radius: 24px; border: 1px solid var(--line); background: linear-gradient(170deg, rgba(50, 26, 61, .8), rgba(21, 11, 26, .85)); text-decoration: none; transition: border-color .25s, transform .3s var(--ease), box-shadow .3s;}
.series-card:hover, .collection-card:hover{border-color: rgba(255, 79, 139, .7); transform: translateY(-4px); box-shadow: 0 22px 46px -22px rgba(255, 46, 126, .8);}
.series-card small, .collection-card small{margin-top: 6px; font: 800 .7rem/1 var(--ui); letter-spacing: .14em; text-transform: uppercase; color: var(--gold);}
.collection-card{position: relative; overflow: hidden; padding: 0;}
.collection-copy{display: grid; gap: 4px; padding: 16px 20px 20px;}
.collection-copy strong{font: 800 1.3rem/1.1 var(--display);}
.collection-copy span{font-size: .86rem; font-weight: 600; color: var(--mist);}
.collection-card::before{content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; z-index: 1; background: linear-gradient(90deg, var(--rose-2), var(--hot));}
.tone-gold::before{background: linear-gradient(90deg, #ffe08a, var(--gold));}
.coin-pill{display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border-radius: 999px; background: rgba(255, 161, 51, .14); border: 1px solid var(--gold-dim); color: var(--gold); font-weight: 700; font-size: .86rem;}
.coin-pill .icon{width: 18px; height: 18px;}
.subnav{display: flex; gap: 6px; margin: 0 auto 24px; max-width: var(--max); padding: 0 var(--gutter); overflow-x: auto; scrollbar-width: none;}
.subnav a{flex: none; display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--line); font-size: .86rem; font-weight: 700; color: var(--mist); text-decoration: none;}
.subnav a:hover{color: var(--cream); border-color: var(--line-2);}
.subnav a[aria-current="page"]{color: var(--cream); border-color: var(--rose); background: rgba(255, 79, 139, .14);}
.tone-gold{color: #ffd36a;}
.settings-nav a{display: flex; align-items: center; gap: 12px; min-height: 46px; padding: 0 16px; border-radius: 14px; font-weight: 700; color: var(--mist); text-decoration: none;}
.settings-nav a:hover{background: rgba(247, 236, 226, .05); color: var(--cream);}
.settings-nav a[aria-current="true"]{color: var(--cream); background: linear-gradient(90deg, rgba(255, 46, 126, .28), rgba(255, 46, 126, .04));}
@media (max-width: 1180px){
.perk-tiles, .browse-tiles{grid-template-columns: repeat(2, minmax(0, 1fr));}
.masthead .nav-right .nav-link[data-nav="community"]{display: none;}
}
@media (max-width: 960px){
.masthead .me-btn{display: inline-grid;}
}
@media (max-width: 760px){
.head-stats{width: 100%;}
.head-stats div{flex: 1; min-width: 0; padding: 10px;}
.head-stats strong{font-size: 1.4rem;}
.browse-tiles, .perk-tiles{grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px;}
.browse-tiles a, .perk-tiles li{padding: 16px;}
.char-card{padding: 14px 8px 12px;}
.voice-player{grid-template-columns: auto minmax(0, 1fr); border-radius: 22px;}
.settings-nav a{flex: none; border: 1px solid var(--line); border-radius: 999px;}
.bottom-nav a{font-size: .66rem;}
}
.seg button[aria-checked="true"], .seg a[aria-current="page"]{color: #2a0617; background: linear-gradient(135deg, var(--rose-2), var(--rose)); box-shadow: 0 6px 18px -6px rgba(255, 46, 126, .8);}
.seg a{display: inline-flex; align-items: center; min-height: 38px; padding: 0 16px; border-radius: 999px; font: 800 .8rem/1 var(--ui); color: var(--mist); text-decoration: none;}
.page-head-row .seg{margin-bottom: 14px;}
.count-pill{display: inline-flex; align-items: center; margin-left: 8px; padding: 2px 10px; border-radius: 999px; background: rgba(255, 79, 139, .18); font: 800 .72rem/1.6 var(--ui); color: var(--rose-2); vertical-align: middle;}
.watch-list strong, .inbox-list strong{display: block;}
.watch-list small, .inbox-list small, .next-list small{color: var(--mist); font-size: .82rem;}
.inbox-list li{display: grid; grid-template-columns: 10px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px 12px; border-radius: 14px;}
.continuity{display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px;}
.continuity h2{font-size: 1.35rem;}
.continuity-actions{display: flex; flex-wrap: wrap; gap: 10px;}
.zb-footer-social a{display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; color: var(--mist); text-decoration: none;}
.zb-footer-social a:hover{color: var(--cream);}
.collection-art{--glow: rgba(255, 79, 139, .3); display: grid; place-content: center; justify-items: center; gap: 14px; min-height: 168px; padding: 22px 18px 18px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 50% 0%, var(--glow), transparent 72%), var(--night-2);}
.tone-gold .collection-art{--glow: rgba(255, 179, 71, .26);}
.collection-art .collage{margin: 0;}
.series-chips{display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; max-width: 100%;}
.series-chip{max-width: 100%; overflow: hidden; padding: 5px 10px; border-radius: 999px; border: 1px solid var(--line-2); background: rgba(12, 6, 16, .55); font: 700 .72rem/1.2 var(--ui); color: var(--cream); text-overflow: ellipsis; white-space: nowrap;}
.series-chip-more{color: var(--gold);}
.tone-plum::before{background: linear-gradient(90deg, #c49bff, #7a3cff);}
.tone-plum .collection-art{--glow: rgba(180, 140, 255, .3);}
.hub-note{max-width: 62ch; margin-top: 10px; font-size: .9rem; color: var(--dim);}
.chip-links{display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none;}
.chip-links a{display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--line-2); font-weight: 700; font-size: .88rem; color: var(--cream); text-decoration: none;}
.chip-links a:hover{border-color: var(--rose);}
.char-card > .char-initial{display: grid; place-items: center; min-height: 0; font: 800 2.2rem/1 var(--display); color: var(--rose-2); background: radial-gradient(circle at 30% 30%, var(--plum-2), var(--night-2));}
.tier-backstage{color: #ffc6dd; background: rgba(255, 79, 139, .14); border: 1px solid rgba(255, 138, 180, .45);}
.char-card img{object-position: 50% 18%;}
.sh-watch-series.is-watching{border-color: var(--rose); color: var(--cream); background: rgba(255, 79, 139, .18);}
.sh-watch-series[disabled]{opacity: .6; cursor: progress;}
.sh-watch-series-status{align-self: center; font-size: .82rem; font-weight: 700; color: var(--mist);}
.sh-watch-series-status:empty{display: none;}
.field-icon{position: relative; display: block;}
.field-icon .icon{position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--dim); pointer-events: none;}
.field-icon .input{padding-left: 46px;}
.toolbar{display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 12px; border-radius: 22px; border: 1px solid var(--line); background: rgba(21, 11, 26, .72); backdrop-filter: blur(12px);}
.toolbar > .field-icon{flex: 1 1 260px;}
.toolbar .input{min-height: 46px;}
.filter-chips{display: flex; flex-wrap: wrap; gap: 6px;}
.filter-chips button{display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-2); background: transparent; font: 700 .8rem/1 var(--ui); color: var(--mist); cursor: pointer; transition: border-color .2s, color .2s, background .2s;}
.filter-chips button:hover{border-color: var(--gold); color: var(--cream);}
.filter-chips button[aria-pressed="true"]{border-color: var(--rose); color: var(--cream); background: rgba(255, 79, 139, .18);}
.result-count{margin: 16px 2px 12px; font-size: .82rem; font-weight: 700; color: var(--dim);}
@media (max-width: 760px){
.toolbar{padding: 10px; border-radius: 18px;}
.toolbar > .field-icon{flex: 1 1 100%;}
.filter-chips{flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%;}
.filter-chips button{flex: none;}
.continuity-actions .btn{flex: 1 1 100%;}
}
@media (pointer: coarse){
.filter-chips button{min-height: 44px;}
}
@media (pointer: coarse){
.letter-jump a{min-width: 44px; height: 44px;}
.topbar a, .text-link, .page-alt, .search-suggest a{position: relative;}
.topbar a::before, .text-link::before, .page-alt::before, .search-suggest a::before{content: ""; position: absolute; inset: -8px 0;}
}