/* Films, profiles and diary (Letterboxd-style layout), built on the site's own tokens so it follows light/dark and the brand colour. */
.modal-panel.fs-wide{max-width:680px;}
.lbw{width:100%;max-width:1040px;margin:0 auto;flex:0 0 auto;display:block;min-height:80vh;}
.lbw > * + *{margin-top:var(--sp-16);}
.lbw > .lbnav + *{margin-top:var(--sp-12);}

/* ---------- buttons, text ---------- */
.fs-h{font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ash);margin:0 0 var(--sp-8);display:flex;align-items:center;justify-content:space-between;gap:var(--sp-8);}
.fs-h a{color:var(--signal-text);text-decoration:none;}
.fs-muted{color:var(--fog);font-size:13px;}
.fs-row{display:flex;flex-wrap:wrap;gap:var(--sp-8);align-items:center;}
.fs-btn{appearance:none;cursor:pointer;background:transparent;border:1px solid var(--hairline);color:var(--bone);font-family:var(--font-mono);font-size:12px;padding:var(--sp-8) var(--sp-16);border-radius:var(--r-pill);text-decoration:none;display:inline-flex;align-items:center;gap:var(--sp-6);line-height:1.1;}
.fs-btn:hover{border-color:var(--signal);color:var(--signal-text);}
.fs-btn.primary{background:var(--signal);border-color:var(--signal);color:#fff;}
.fs-btn.primary:hover{opacity:.9;color:#fff;}
.fs-btn.on{border-color:var(--signal);color:var(--signal-text);background:var(--signal-soft);}
.fs-btn.danger{color:#c4402f;}
.fs-btn.xs{padding:3px 10px;font-size:11px;}
.fs-btn[disabled]{opacity:.5;cursor:not-allowed;}
.fs-btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;}
.lb-more{display:flex;margin:var(--sp-12) auto 0;}
.fs-count{font-family:var(--font-mono);font-size:11px;color:var(--ash);}
.fs-x{background:none;border:0;cursor:pointer;color:var(--ash);padding:0;}
.fs-x:hover{color:var(--signal-text);}
.lb-empty{padding:var(--sp-24);text-align:center;color:var(--fog);font-size:14px;}
.lb-empty a{color:var(--signal-text);}
.fs-empty{padding:var(--sp-24);text-align:center;color:var(--fog);}
.fs-attrib{font-size:11px;color:var(--ash);margin-top:var(--sp-12);}

/* ---------- top navigation ---------- */
.lbnav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-8) var(--sp-16);padding:var(--sp-8) 0;border-bottom:1px solid var(--hairline);position:relative;z-index:5;}
.lbnav-links{display:flex;gap:var(--sp-4);flex-wrap:wrap;}
.lbnav-links a{font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--fog);text-decoration:none;padding:6px 10px;border-radius:var(--r-pill);}
.lbnav-links a:hover{color:var(--bone);}
.lbnav-links a[aria-current="page"]{color:var(--bone);background:var(--card);}
.lbnav-right{display:flex;align-items:center;gap:var(--sp-8);flex:1 1 280px;justify-content:flex-end;}
.lbsearch{position:relative;flex:1 1 220px;max-width:360px;}
.lbsearch input{width:100%;}
.lbsearch-dd{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--card);border:1px solid var(--hairline);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.35);padding:4px;z-index:20;}
.lbsearch-item{display:flex;align-items:center;gap:var(--sp-8);padding:6px;border-radius:8px;text-decoration:none;color:var(--bone);font-size:13px;}
.lbsearch-item:hover{background:var(--card-hover);}
.lbsearch-item .fs-poster{width:30px;flex:0 0 auto;border-radius:4px;}
.lbsearch-item small{display:block;color:var(--ash);font-size:11px;}
.lbsearch-item.all{color:var(--signal-text);justify-content:center;font-family:var(--font-mono);font-size:12px;}
.lbbell{position:relative;display:inline-flex;color:var(--fog);padding:6px;}
.lbbell:hover{color:var(--bone);}
.lbbell svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.lbbadge{position:absolute;top:-2px;right:-4px;background:var(--signal);color:#fff;font-size:10px;font-family:var(--font-mono);border-radius:var(--r-pill);padding:1px 5px;line-height:1.3;}
.lbbadge[hidden]{display:none;}

/* ---------- headings, page furniture ---------- */
.lb-h{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ash);margin:0 0 var(--sp-12);padding-bottom:6px;border-bottom:1px solid var(--hairline);display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-8);font-weight:500;}
.lb-h-r a{color:var(--signal-text);text-decoration:none;}
.lb-h-r{font-size:11px;letter-spacing:.04em;color:var(--ash);}
.lb-wide{min-width:0;}
.lb-pagehead{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--sp-4) var(--sp-16);}
.lb-pagehead h2{margin:0;font-size:24px;letter-spacing:-.02em;}
.lb-hero{padding:var(--sp-24);border-radius:var(--r-card);background:var(--card);display:grid;gap:var(--sp-12);}
.lb-hero h2{margin:0;font-size:clamp(22px,4vw,34px);letter-spacing:-.02em;line-height:1.15;}
.lb-hero p{margin:0;color:var(--fog);max-width:620px;}
.lb-hero.small{padding:var(--sp-16) var(--sp-24);}
.lb-hero.small h2{font-size:20px;}
.lb-hero a{color:var(--signal-text);}
.lb-sections{display:grid;gap:var(--sp-24);}
.lb-sections:empty{display:none;}
.lb-slot:empty{display:none;}
.lb-tabs{display:flex;gap:var(--sp-4);flex-wrap:wrap;border-bottom:1px solid var(--hairline);margin-bottom:var(--sp-12);}
.lb-tab{appearance:none;background:none;border:0;border-bottom:2px solid transparent;color:var(--fog);font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;text-transform:uppercase;padding:var(--sp-8) var(--sp-12);cursor:pointer;text-decoration:none;}
.lb-tab small{color:var(--ash);}
.lb-tab:hover{color:var(--bone);}
.lb-tab.active{color:var(--bone);border-bottom-color:var(--signal);}
.lb-filters{display:flex;flex-wrap:wrap;gap:var(--sp-8);align-items:center;margin:var(--sp-8) 0 var(--sp-12);}
.lb-f{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--fog);}
.lb-f > span{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--ash);}
.lb-f-slot{display:none;}
.lb-side-card{background:var(--card);border-radius:var(--r-card);padding:var(--sp-16);min-width:0;}
.lb-side-card + .lb-side-card{margin-top:var(--sp-12);}
.lb-side-card .lb-h{margin-bottom:var(--sp-8);}
.lb-body{display:grid;gap:var(--sp-24);min-width:0;}

/* ---------- stars ---------- */
.fs-stars{position:relative;display:inline-block;font-size:14px;line-height:1;letter-spacing:0;color:var(--hairline);white-space:nowrap;vertical-align:middle;}
.fs-stars::before{content:'★★★★★';}
.fs-stars::after{content:'★★★★★';position:absolute;left:0;top:0;width:var(--r,0%);overflow:hidden;color:var(--signal);}
.fs-stars.lg{font-size:30px;}
.fs-stars.input{cursor:pointer;touch-action:pan-y;user-select:none;-webkit-user-select:none;}
.fs-stars.input:focus-visible{outline:2px solid var(--signal);outline-offset:3px;border-radius:4px;}
.fs-stars.sm{font-size:11px;}
[dir="rtl"] .fs-stars::after{left:auto;right:0;}

/* ---------- posters and grids ---------- */
.fs-poster{display:block;position:relative;aspect-ratio:2/3;border-radius:6px;overflow:hidden;background:var(--card-hover);border:1px solid var(--hairline);color:inherit;text-decoration:none;}
.fs-poster:hover{outline:2px solid var(--signal);outline-offset:-2px;}
.fs-poster img{width:100%;height:100%;object-fit:cover;display:block;}
.fs-poster-fb{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--sp-8);font-size:12px;color:var(--fog);}
.fs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:var(--sp-12) var(--sp-8);}
.fs-grid.sm{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));}
.fs-grid.xs{grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:var(--sp-6);}
.fs-cell{min-width:0;}
.fs-pw{position:relative;}
.fs-cell .fs-below{margin-top:var(--sp-4);display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);min-height:14px;}
.fs-cell .fs-below.mine{min-height:0;justify-content:flex-start;}
.fs-heart{color:var(--signal);font-size:11px;}
.fs-cap{font-size:11px;color:var(--fog);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fs-num{position:absolute;top:4px;left:4px;background:rgba(0,0,0,.72);color:#fff;font-family:var(--font-mono);font-size:10px;padding:1px 6px;border-radius:var(--r-pill);}
.fs-seen{position:absolute;right:4px;top:4px;width:18px;height:18px;border-radius:50%;background:var(--signal);color:#fff;display:none;align-items:center;justify-content:center;pointer-events:none;box-shadow:0 1px 4px rgba(0,0,0,.4);}
.fs-seen svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.2;}
.fs-pw.is-watched .fs-seen{display:flex;}
.fs-pw.is-watched .fs-poster{border-color:var(--signal);}
.fs-quick{position:absolute;left:0;right:0;bottom:0;display:none;justify-content:space-around;background:linear-gradient(to top,rgba(0,0,0,.85),rgba(0,0,0,0));padding:14px 2px 4px;border-radius:0 0 6px 6px;}
.fs-quick button{appearance:none;background:none;border:0;cursor:pointer;color:#e8e8e8;padding:3px;display:inline-flex;}
.fs-quick button svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.fs-quick button:hover{color:#fff;}
.fs-quick button.on{color:var(--signal);}
.fs-quick button.on svg{fill:currentColor;}
@media (hover:hover){ .fs-pw:hover .fs-quick, .fs-pw:focus-within .fs-quick{display:flex;} }
.lb-who{display:flex;align-items:center;gap:4px;margin-top:4px;font-size:11px;}

/* ---------- avatars ---------- */
.fs-avatar{width:40px;height:40px;border-radius:50%;flex:0 0 auto;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;font-weight:600;color:#fff;font-size:15px;background:var(--signal);}
.fs-avatar img{width:100%;height:100%;object-fit:cover;display:block;}
.fs-avatar.xs{width:18px;height:18px;font-size:9px;}
.fs-avatar.sm{width:24px;height:24px;font-size:11px;}
.fs-avatar.lg{width:96px;height:96px;font-size:34px;}
.fs-avatar.xl{width:112px;height:112px;font-size:42px;}
.lb-user{display:inline-flex;align-items:center;gap:6px;color:var(--bone);text-decoration:none;font-size:13px;}
.fs-rav{flex:0 0 auto;display:inline-flex;text-decoration:none;}

/* ---------- profile ---------- */
.lb-phead{display:flex;flex-wrap:wrap;gap:var(--sp-16) var(--sp-24);align-items:flex-start;padding-top:var(--sp-8);}
.fs-pinfo{flex:1 1 300px;min-width:0;display:grid;gap:var(--sp-8);}
.lb-pname{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--sp-4) var(--sp-12);}
.lb-pname h1{margin:0;font-size:28px;letter-spacing:-.02em;}
.fs-handle{font-family:var(--font-mono);font-size:12px;color:var(--ash);}
.fs-bio{margin:0;color:var(--bone);font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere;}
.fs-meta{display:flex;flex-wrap:wrap;gap:var(--sp-4) var(--sp-16);color:var(--fog);font-size:12px;}
.fs-meta a{color:var(--signal-text);overflow-wrap:anywhere;}
.fs-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-4);flex:1 1 300px;align-self:center;}
@media (min-width:1000px){ .fs-stats{grid-template-columns:repeat(6,minmax(0,1fr));flex:0 1 460px;} }
.fs-stat{text-decoration:none;color:inherit;text-align:center;min-width:56px;padding:var(--sp-4) var(--sp-8);border-radius:10px;}
a.fs-stat:hover{background:var(--card);}
.fs-stat b{display:block;font-size:20px;letter-spacing:-.02em;}
.fs-stat span{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ash);}
.fs-tabs{display:flex;gap:var(--sp-4);overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--hairline);margin-top:var(--sp-12);}
.fs-tabs::-webkit-scrollbar{display:none;}
.fs-tabs a{font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--fog);text-decoration:none;padding:var(--sp-8) var(--sp-12);border-bottom:2px solid transparent;white-space:nowrap;}
.fs-tabs a:hover{color:var(--bone);}
.fs-tabs a[aria-current="page"]{color:var(--bone);border-bottom-color:var(--signal);}
.lb-two{display:grid;gap:var(--sp-24);}
@media (min-width:860px){ .lb-two{grid-template-columns:minmax(0,1fr) 290px;align-items:start;} }
.lb-main,.lb-side{display:grid;gap:var(--sp-24);min-width:0;}
.lb-side{gap:var(--sp-12);}

/* favorites */
.fs-favs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-8);max-width:560px;}
.fs-fav-empty{aspect-ratio:2/3;border:1px dashed var(--ash);border-radius:6px;background:transparent;color:var(--ash);cursor:pointer;font-size:24px;display:flex;align-items:center;justify-content:center;}
.fs-fav-empty:hover{border-color:var(--signal);color:var(--signal-text);}
.fs-fav-wrap{position:relative;}
.fs-fav-tools{display:flex;justify-content:center;gap:4px;margin-top:4px;}
.fs-fav-tools button{appearance:none;border:1px solid var(--hairline);background:var(--card);color:var(--fog);cursor:pointer;border-radius:6px;font-size:11px;line-height:1;padding:4px 7px;}
.fs-fav-tools button:hover:not(:disabled){color:var(--signal-text);border-color:var(--signal);}
.fs-fav-tools button:disabled{opacity:.35;cursor:default;}

/* histogram */
.fs-hist{display:flex;align-items:flex-end;gap:3px;height:56px;}
.fs-hist .bar{flex:1;background:var(--hairline);border-radius:2px 2px 0 0;min-height:2px;position:relative;}
.fs-hist .bar:hover{background:var(--fog);}
.fs-hist .bar.me{background:var(--signal);}
.fs-hist-axis{display:flex;justify-content:space-between;font-size:10px;color:var(--ash);margin-top:2px;font-family:var(--font-mono);}
.fs-avg{display:flex;align-items:center;gap:var(--sp-8);margin-bottom:var(--sp-8);}
.fs-avg b{font-size:28px;letter-spacing:-.02em;}
.lb-counts{display:flex;flex-wrap:wrap;gap:var(--sp-4) var(--sp-12);margin-top:var(--sp-8);font-size:12px;color:var(--fog);}
.lb-counts b{color:var(--bone);}

/* ---------- film page ---------- */
.lb-backdrop{position:relative;height:clamp(140px,26vw,300px);border-radius:var(--r-card);overflow:hidden;margin-bottom:calc(-1 * clamp(40px,8vw,90px));}
.lb-backdrop img{width:100%;height:100%;object-fit:cover;display:block;opacity:.7;}
.lb-backdrop::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,0) 30%,var(--canvas-flat) 100%);}
.lb-film{display:grid;gap:var(--sp-16) var(--sp-24);position:relative;grid-template-columns:104px minmax(0,1fr);grid-template-areas:"l m" "r r" "t t";}
.lb-col-l{grid-area:l;}.lb-col-m{grid-area:m;}.lb-col-t{grid-area:t;}.lb-col-r{grid-area:r;}
@media (min-width:640px){ .lb-film{grid-template-columns:200px minmax(0,1fr);} }
@media (min-width:960px){ .lb-film{grid-template-columns:210px minmax(0,1fr) 270px;grid-template-areas:"l m r" "l t r";grid-template-rows:auto 1fr;} }
.lb-col-l,.lb-col-m,.lb-col-r,.lb-col-t{min-width:0;}
.lb-col-l .fs-poster{max-width:200px;box-shadow:0 8px 28px rgba(0,0,0,.35);}
.lb-col-l .lb-side-card{margin-top:var(--sp-12);}
.lb-titlehead h1{margin:0;font-size:clamp(24px,3.4vw,34px);letter-spacing:-.02em;line-height:1.1;}
.fs-year{color:var(--fog);font-weight:400;font-size:.6em;text-decoration:none;}
.fs-year:hover{color:var(--signal-text);}
.lb-col-m .fs-meta{margin:var(--sp-6) 0;}
.fs-meta a{color:var(--bone);}
.fs-tag{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--fog);margin:var(--sp-8) 0;}
.fs-over{color:var(--bone);font-size:14px;line-height:1.55;margin:var(--sp-8) 0;}
.fs-over.clamp{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;}
.lb-facts{margin:var(--sp-12) 0;}
.fs-chips{display:flex;flex-wrap:wrap;gap:var(--sp-6);}
.fs-chips.lg .fs-chip{font-size:13px;padding:4px 12px;}
.fs-chip{font-family:var(--font-mono);font-size:11px;padding:2px var(--sp-8);border-radius:var(--r-pill);background:var(--signal-soft);color:var(--signal-text);text-decoration:none;display:inline-block;}
a.fs-chip:hover{outline:1px solid var(--signal);}
.fs-chip small{color:var(--fog);font-size:10px;}
.lb-pane{min-height:60px;}
.lb-castlist{display:flex;flex-wrap:wrap;gap:var(--sp-6);}
.lb-castlist .fs-chip{background:var(--card);color:var(--bone);}
.lb-castlist small{color:var(--ash);}
.lb-crew,.lb-details{display:grid;gap:var(--sp-8);}
.lb-crew-row{display:grid;grid-template-columns:120px minmax(0,1fr);gap:var(--sp-8);align-items:start;font-size:13px;}
.lb-crew-j{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ash);padding-top:4px;}
.lb-crew-n{display:flex;flex-wrap:wrap;gap:var(--sp-6);align-items:center;color:var(--fog);}
.lb-crew-n .fs-chip{background:var(--card);color:var(--bone);}
.lb-prov{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:6px;}
.lb-prov-l{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;color:var(--ash);width:48px;}
.lb-prov-i{display:inline-flex;}
.lb-prov-i img{width:30px;height:30px;border-radius:7px;display:block;}
.lb-video{position:relative;aspect-ratio:16/9;margin:var(--sp-12) 0;background:#000;border-radius:10px;overflow:hidden;}
.lb-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}

/* actions panel */
.lb-actions{padding:var(--sp-12);display:grid;gap:0;}
.fs-act-row{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-bottom:1px solid var(--hairline);padding-bottom:var(--sp-8);}
.fs-act{appearance:none;cursor:pointer;background:none;border:0;color:var(--fog);padding:var(--sp-8) var(--sp-4);display:flex;flex-direction:column;align-items:center;gap:var(--sp-4);font-family:var(--font-mono);font-size:11px;}
.fs-act svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.fs-act.on{color:var(--signal-text);}
.fs-act.on svg{fill:currentColor;fill-opacity:.25;}
.fs-act:hover{color:var(--bone);}
.fs-act.on:hover{color:var(--signal-text);}
.lb-rate{display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--sp-8) 0;border-bottom:1px solid var(--hairline);}
.lb-menu{appearance:none;cursor:pointer;background:none;border:0;border-bottom:1px solid var(--hairline);color:var(--bone);font-size:13px;text-align:center;padding:var(--sp-8);}
.lb-menu:last-of-type{border-bottom:0;}
.lb-menu:hover{background:var(--card-hover);color:var(--signal-text);}
.lb-signin{padding:var(--sp-8);text-align:center;}
.lb-friend{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-8);padding:4px 0;}

/* ---------- reviews ---------- */
.fs-review{display:flex;gap:var(--sp-12);padding:var(--sp-12) 0;border-top:1px solid var(--hairline);}
.lb-h + .fs-review,.seg + div > .fs-review:first-child{border-top:0;}
.fs-rbody{flex:1;min-width:0;}
.fs-rhead{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-4) var(--sp-8);font-size:12px;color:var(--fog);}
.fs-rhead a{color:var(--bone);font-weight:600;text-decoration:none;}
.fs-rhead a.fs-rt{font-size:15px;}
.fs-rtext{margin:var(--sp-6) 0;font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5;}
.fs-rtext.clamp{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;}
.fs-spoiler{filter:blur(6px);cursor:pointer;user-select:none;}
.fs-spoiler-note{font-size:12px;color:var(--signal-text);cursor:pointer;background:none;border:0;padding:0;font-family:inherit;text-decoration:underline;}
.fs-ractions{display:flex;flex-wrap:wrap;gap:var(--sp-12);align-items:center;font-family:var(--font-mono);font-size:11px;color:var(--fog);}
.fs-ractions button{appearance:none;background:none;border:0;color:inherit;cursor:pointer;font:inherit;padding:2px 0;display:inline-flex;align-items:center;gap:4px;}
.fs-ractions button.on{color:var(--signal-text);}
.fs-ractions button:hover{color:var(--signal-text);}
.fs-comments{margin-top:var(--sp-8);padding-left:var(--sp-12);border-left:2px solid var(--hairline);display:grid;gap:var(--sp-8);}
.fs-comments.plain{border-left:0;padding-left:0;}
.fs-comment{font-size:13px;}
.fs-comment b a{color:var(--bone);text-decoration:none;}
.fs-cform{display:flex;gap:var(--sp-8);margin-top:var(--sp-8);}
.fs-cform input{flex:1;min-width:0;}
.fs-posterthumb{width:64px;flex:0 0 auto;}

/* ---------- diary table ---------- */
.fs-diary-month{font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--signal-text);margin:var(--sp-16) 0 var(--sp-4);}
.fs-drow{display:grid;grid-template-columns:30px 40px minmax(0,1fr) 54px 84px 24px 24px 24px 50px;gap:var(--sp-8);align-items:center;padding:var(--sp-6) 0;border-top:1px solid var(--hairline);}
.fs-drow .day{font-family:var(--font-mono);color:var(--fog);font-size:13px;text-align:center;}
.fs-drow .t{min-width:0;}
.fs-drow .t a{color:var(--bone);font-weight:600;text-decoration:none;overflow-wrap:anywhere;}
.fs-drow .y{color:var(--ash);font-size:12px;}
.fs-drow .fl{text-align:center;color:var(--fog);}
.fs-drow .fl a{color:inherit;text-decoration:none;}
.fs-hist .bar{background:var(--placeholder);}
.lb-dhead{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--ash);border-top:0;}
@media (max-width:640px){ .fs-drow{grid-template-columns:26px 36px minmax(0,1fr) 84px 24px;} .fs-drow .y,.fs-drow .fl:nth-of-type(3),.fs-drow .fl:nth-of-type(4){display:none;} .lb-dhead{display:none;} }

/* ---------- lists ---------- */
.fs-list-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-12);padding:var(--sp-12) 0;border-top:1px solid var(--hairline);text-decoration:none;color:inherit;align-items:center;}
.lb-h + .fs-list-card{border-top:0;}
.fs-stack{display:flex;padding-right:18px;}
.fs-stack .fs-poster{width:54px;flex:0 0 auto;margin-right:-18px;box-shadow:2px 0 6px rgba(0,0,0,.3);}
.fs-list-body h3{margin:0 0 2px;font-size:16px;}
.fs-list-card:hover h3{color:var(--signal-text);}
.lb-listtitle{margin:0;font-size:26px;letter-spacing:-.02em;}
.fs-list-body p{margin:4px 0 0;}

/* ---------- people, members ---------- */
.fs-person{display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-8) 0;border-top:1px solid var(--hairline);}
.fs-person.unread{background:var(--signal-soft);}
.fs-person a.n{color:var(--bone);font-weight:600;text-decoration:none;}
.fs-person .grow{flex:1;min-width:0;font-size:14px;}
.fs-person .grow a{color:var(--signal-text);}
.lb-people{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--sp-8);}
.lb-person{display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-8);border-radius:12px;background:var(--card);text-decoration:none;color:inherit;}
.lb-person:hover{outline:1px solid var(--signal);}
.lb-person .grow{min-width:0;}
.lb-person small{display:block;color:var(--ash);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lb-pface{width:52px;height:52px;border-radius:50%;overflow:hidden;background:var(--card-hover);flex:0 0 auto;display:block;}
.lb-pface img{width:100%;height:100%;object-fit:cover;display:block;}
.lb-personhead{display:grid;gap:var(--sp-16);}
@media (min-width:640px){ .lb-personhead{grid-template-columns:200px minmax(0,1fr);} }
.lb-pphoto{aspect-ratio:2/3;border-radius:10px;overflow:hidden;background:var(--card-hover);max-width:220px;}
.lb-pphoto img{width:100%;height:100%;object-fit:cover;display:block;}
.lb-personhead h2{margin:0 0 var(--sp-4);font-size:28px;letter-spacing:-.02em;}
.lb-act{display:flex;gap:var(--sp-12);align-items:center;padding:var(--sp-8) 0;border-top:1px solid var(--hairline);font-size:14px;}
.lb-act a{color:var(--bone);text-decoration:none;}
.lb-act-p{width:44px;flex:0 0 auto;}

/* ---------- stats ---------- */
.lb-statbig{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:var(--sp-8);margin-bottom:var(--sp-12);}
.lb-statbig div{background:var(--card);border-radius:12px;padding:var(--sp-12);text-align:center;}
.lb-statbig b{display:block;font-size:26px;letter-spacing:-.02em;}
.lb-statbig span{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--ash);}
.lb-bars{display:grid;gap:5px;}
.lb-bar{display:grid;grid-template-columns:96px minmax(0,1fr) 34px;gap:var(--sp-8);align-items:center;font-size:12px;}
.lb-bar .l{color:var(--fog);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lb-bar .tr{height:9px;background:var(--hairline);border-radius:5px;overflow:hidden;display:block;}
.lb-bar .tr i{display:block;height:100%;background:var(--signal);border-radius:5px;}
.lb-bar .n{color:var(--ash);font-family:var(--font-mono);font-size:11px;text-align:right;}

/* ---------- import ---------- */
.lb-import{margin-top:var(--sp-12);display:grid;gap:var(--sp-8);}
.lb-progress{height:8px;background:var(--hairline);border-radius:5px;overflow:hidden;}
.lb-progress i{display:block;height:100%;width:0;background:var(--signal);transition:width .2s;}
.lb-unmatched{font-size:13px;color:var(--fog);}
.lb-unmatched summary{cursor:pointer;}

/* ---------- search / picker ---------- */
.fs-search{width:100%;}
.fs-results{display:grid;gap:var(--sp-4);margin-top:var(--sp-8);max-height:50vh;overflow:auto;}
.fs-result{display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-6);border-radius:10px;text-align:left;background:none;border:0;color:var(--bone);cursor:pointer;width:100%;font:inherit;}
.fs-result:hover{background:var(--card-hover);}
.fs-result .fs-poster{width:38px;flex:0 0 auto;}
.fs-result .grow{min-width:0;}
.fs-result small{color:var(--ash);display:block;}

/* ---------- log dialog ---------- */
.fs-log-head{display:flex;gap:var(--sp-12);align-items:center;}
.fs-log-head .fs-poster{width:56px;flex:0 0 auto;}
.fs-form{display:grid;gap:var(--sp-12);}
.fs-form label.chk{display:flex;align-items:center;gap:var(--sp-8);font-size:13px;cursor:pointer;}
.fs-form input[type=checkbox],.lb-f input[type=checkbox]{width:18px;height:18px;accent-color:var(--signal);}
.chk.lb-f{display:inline-flex;align-items:center;gap:6px;cursor:pointer;}
.fs-tagbox{display:flex;flex-wrap:wrap;gap:var(--sp-6);padding:var(--sp-6);border:1px solid var(--hairline);border-radius:12px;background:var(--card);}
.fs-tagbox:focus-within{border-color:var(--signal);}
.fs-tagbox input{flex:1;min-width:100px;background:transparent;border:0;outline:0;color:var(--bone);font:inherit;font-size:14px;padding:var(--sp-6);}
.fs-tagpill{display:inline-flex;align-items:center;gap:4px;padding:2px 4px 2px var(--sp-12);border-radius:var(--r-pill);background:var(--signal-soft);color:var(--signal-text);font-size:13px;}
.fs-tagpill button{appearance:none;border:0;background:transparent;color:inherit;cursor:pointer;font-size:15px;line-height:1;padding:2px 6px;}

/* ---------- profile banner ---------- */
.lb-banner{position:relative;height:clamp(110px,22vw,230px);border-radius:var(--r-card);overflow:hidden;background:var(--card);}
.lb-banner img{width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block;}
.lb-banner::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,0) 55%,rgba(0,0,0,.5) 100%);pointer-events:none;}
.lb-banner-cap{position:absolute;right:10px;bottom:8px;z-index:1;font-family:var(--font-mono);font-size:11px;color:#fff;text-decoration:none;background:rgba(0,0,0,.45);padding:3px 9px;border-radius:var(--r-pill);opacity:.85;}
.lb-banner-cap:hover{opacity:1;text-decoration:underline;}
.lb-banner + .lb-phead{padding-top:0;}
.lb-banner + .lb-phead .fs-avatar.xl{margin-top:-48px;border:4px solid var(--canvas-flat);box-sizing:content-box;position:relative;z-index:1;}
.lb-bpick{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--sp-8);max-height:56vh;overflow:auto;margin:var(--sp-12) 0;padding:2px;}
.lb-bopt{appearance:none;cursor:pointer;background:var(--card);border:2px solid transparent;border-radius:10px;padding:0;overflow:hidden;color:var(--bone);text-align:left;font:inherit;font-size:11px;}
.lb-bopt img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;}
.lb-bopt span{display:block;padding:4px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lb-bopt:hover{border-color:var(--signal);}
.lb-bopt.on{border-color:var(--signal);}

/* ---------- motion ---------- */
@keyframes lbFade{from{opacity:0}to{opacity:1}}
.lb-wide,.lb-side-card,.lb-hero,.lb-pagehead,.lb-backdrop,.lb-personhead,.lb-phead{animation:lbFade .26s ease-out both;}
.fs-btn,.lb-tab,.lbnav-links a,.fs-tabs a,.fs-act,.lb-menu,.fs-chip{transition:color .15s ease,background-color .15s ease,border-color .15s ease,opacity .15s ease;}
.fs-poster{transition:outline-color .15s ease,transform .18s ease;}
.fs-quick{transition:opacity .15s ease;}
.lb-bopt{transition:border-color .15s ease,transform .15s ease;}
.lb-bopt:hover{transform:translateY(-2px);}
.lb-progress i{transition:width .25s ease;}
@media (prefers-reduced-motion: reduce){ .lb-wide,.lb-side-card,.lb-hero,.lb-pagehead,.lb-backdrop,.lb-personhead,.lb-phead{animation:none;} .lb-bopt:hover{transform:none;} }

/* ---------- music ---------- */
.fs-poster.music{aspect-ratio:1/1;}
.fs-quick + *{}
.fs-cap.ttl{color:var(--bone);font-weight:600;font-size:12px;margin-top:4px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.fs-cap.sub{font-size:11px;}
.fs-favs.music .fs-fav-empty,.fs-fav-empty.music{aspect-ratio:1/1;}
.fs-stars.md{font-size:17px;}
.lbdom{display:inline-flex;gap:2px;background:var(--card);border-radius:var(--r-pill);padding:3px;}
.lbdom a{font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--fog);text-decoration:none;padding:5px 12px;border-radius:var(--r-pill);white-space:nowrap;}
.lbdom a[aria-current="true"]{background:var(--signal);color:#fff;}
.lbdom a:not([aria-current="true"]):hover{color:var(--bone);}
.lbdom.prof{margin-top:var(--sp-12);align-self:flex-start;}
.lb-film.music .lb-col-l .fs-poster{max-width:240px;}
.mu-tracks{display:grid;}
.mu-track{display:grid;grid-template-columns:26px 28px minmax(0,1fr) auto 26px auto;gap:var(--sp-8);align-items:center;padding:6px 0;border-top:1px solid var(--hairline);font-size:14px;}
.mu-track:first-child{border-top:0;}
.mu-track .n{color:var(--ash);font-family:var(--font-mono);font-size:12px;text-align:right;}
.mu-track .t{color:var(--bone);text-decoration:none;min-width:0;overflow-wrap:anywhere;}
.mu-track .t:hover{color:var(--signal-text);}
.mu-track .t small{color:var(--ash);}
.mu-track .len{color:var(--ash);font-family:var(--font-mono);font-size:11px;}
.mu-play{appearance:none;width:24px;height:24px;border-radius:50%;border:1px solid var(--hairline);background:transparent;color:var(--fog);font-size:10px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;}
.mu-play:hover,.mu-play.on{border-color:var(--signal);color:var(--signal-text);}
.mu-play.off{border-color:transparent;cursor:default;}
.mu-like{appearance:none;background:none;border:0;color:var(--hairline);cursor:pointer;font-size:15px;padding:0;}
.mu-like:hover{color:var(--signal-text);}
.mu-like.on{color:var(--signal);}
@media (max-width:520px){ .mu-track{grid-template-columns:22px 26px minmax(0,1fr) 24px auto;} .mu-track .len{display:none;} }
.mu-results{display:grid;gap:var(--sp-4);}
.mu-result{display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-6);border-radius:10px;}
.mu-result:hover{background:var(--card);}
.mu-result .fs-poster{width:46px;flex:0 0 auto;}
.mu-result .grow{min-width:0;color:var(--bone);text-decoration:none;}
.mu-result small{display:block;color:var(--ash);}
.mu-result .len{color:var(--ash);font-family:var(--font-mono);font-size:11px;}
.mu-face{display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--fog);}
.lb-menu.link{display:block;text-decoration:none;}

/* ---------- music player (persistent bar, queue / now playing panel) ---------- */
body.hp-on .feed{padding-bottom:96px;}
body.hp-on .to-top{bottom:calc(var(--sp-16) + 56px + 76px + env(safe-area-inset-bottom,0px));}
body.hp-on .quick-tip-fab{bottom:calc(var(--sp-16) + 76px + env(safe-area-inset-bottom,0px));}
body.hp-on .toast{bottom:calc(var(--sp-32) + 76px + env(safe-area-inset-bottom,0px));}
.hp{position:fixed;left:0;right:0;bottom:var(--hp-bottom,0px);z-index:8;height:76px;padding:0 var(--sp-16) env(safe-area-inset-bottom,0px);display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,560px) minmax(0,1fr);align-items:center;gap:var(--sp-16);background:var(--card);border-top:1px solid var(--hairline);box-shadow:0 -10px 30px -14px rgba(0,0,0,.35);animation:hpIn .28s cubic-bezier(.2,.8,.2,1);}
.hp[hidden]{display:none;}
@keyframes hpIn{from{transform:translateY(100%);}to{transform:none;}}
.hp button{appearance:none;font:inherit;}
.hp-l{display:flex;align-items:center;gap:var(--sp-12);min-width:0;}
.hp-art{position:relative;flex:0 0 auto;width:54px;height:54px;border-radius:8px;overflow:hidden;border:0;padding:0;background:var(--canvas-raised);cursor:pointer;}
.hp-art img{width:100%;height:100%;object-fit:cover;display:block;}
.hp-art-up{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);color:#fff;opacity:0;transition:opacity .15s;}
.hp-art-up svg{width:22px;height:22px;}
.hp-art:hover .hp-art-up,.hp-art:focus-visible .hp-art-up{opacity:1;}
.hp-meta{display:grid;min-width:0;}
.hp-title,.hp-artist{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;}
.hp-title{color:var(--bone);font-weight:600;font-size:14px;}
.hp-artist{color:var(--fog);font-size:12px;}
a.hp-title:hover,a.hp-artist:hover{text-decoration:underline;}
.hp-heart{background:none;border:0;color:var(--ash);cursor:pointer;font-size:18px;padding:4px;line-height:1;flex:0 0 auto;}
.hp-heart:hover{color:var(--signal-text);}
.hp-heart.on{color:var(--signal);}
.hp-c{display:grid;gap:4px;justify-items:center;min-width:0;}
.hp-ctl{display:flex;align-items:center;gap:var(--sp-8);}
.hp-b{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:0;background:none;color:var(--fog);border-radius:50%;cursor:pointer;padding:0;transition:color .15s,transform .15s;position:relative;}
.hp-b svg{width:18px;height:18px;}
.hp-b.sm{width:26px;height:26px;}.hp-b.sm svg{width:14px;height:14px;}
.hp-b:hover:not(:disabled){color:var(--bone);}
.hp-b:disabled{opacity:.35;cursor:default;}
.hp-b.on{color:var(--signal-text);}
.hp-b.on::after{content:"";position:absolute;bottom:1px;left:50%;width:4px;height:4px;border-radius:50%;background:var(--signal);transform:translateX(-50%);}
.hp-b[data-mode="one"]::before{content:"1";position:absolute;top:4px;right:6px;font:700 8px var(--font-mono);color:var(--signal-text);}
.hp-play{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;border:0;background:var(--bone);color:var(--card);cursor:pointer;padding:0;transition:transform .12s;}
.hp-play svg{width:18px;height:18px;}
.hp-play:hover{transform:scale(1.07);}
.hp-play:active{transform:scale(.96);}
.hp-time{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--sp-8);width:100%;}
.hp-t{font:11px var(--font-mono);color:var(--ash);min-width:32px;text-align:center;}
.hp-range{-webkit-appearance:none;appearance:none;width:100%;height:14px;background:transparent;margin:0;cursor:pointer;--p:0%;}
.hp-range::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(to right,var(--bone) var(--p),var(--hairline) var(--p));}
.hp-range::-moz-range-track{height:4px;border-radius:4px;background:var(--hairline);}
.hp-range::-moz-range-progress{height:4px;border-radius:4px;background:var(--bone);}
.hp-range::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;margin-top:-4px;border-radius:50%;background:var(--bone);border:0;opacity:0;transition:opacity .12s;}
.hp-range::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--bone);border:0;opacity:0;}
.hp-range:hover::-webkit-slider-runnable-track,.hp-range:focus-visible::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--signal) var(--p),var(--hairline) var(--p));}
.hp-range:hover::-moz-range-progress{background:var(--signal);}
.hp-range:hover::-webkit-slider-thumb,.hp-range:focus-visible::-webkit-slider-thumb{opacity:1;}
.hp-range:hover::-moz-range-thumb{opacity:1;}
.hp-range:focus-visible{outline:2px solid var(--signal);outline-offset:2px;border-radius:4px;}
.hp-r{display:flex;align-items:center;justify-content:flex-end;gap:var(--sp-4);min-width:0;}
.hp-vol{width:92px;flex:0 0 auto;}
.hp-tag{font:10px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ash);border:1px solid var(--hairline);border-radius:var(--r-pill);padding:2px 8px;margin-right:var(--sp-8);white-space:nowrap;}
@media (max-width:900px){
  .hp{grid-template-columns:minmax(0,1fr) auto;gap:var(--sp-8);height:68px;}
  .hp-tag,.hp-vol,.hp-r .hp-close,.hp-heart,.hp-r [aria-label="Mute"]{display:none;}
  .hp-c{display:contents;}
  .hp-ctl .hp-b:first-child,.hp-ctl .hp-b:last-child{display:none;}
  .hp-time{position:absolute;left:0;right:0;top:-6px;grid-template-columns:1fr;}
  .hp-time .hp-t{display:none;}
  .hp-ctl{grid-column:2;grid-row:1;margin-right:40px;}
  .hp-r{position:absolute;right:var(--sp-8);top:0;height:100%;}
  body.hp-on .feed{padding-bottom:84px;}
  body.hp-on .to-top{bottom:calc(132px + 68px + env(safe-area-inset-bottom,0px));}
  body.hp-on .quick-tip-fab{bottom:calc(76px + 68px + env(safe-area-inset-bottom,0px));}
}
@media (max-width:520px){ .hp-ctl .hp-b:nth-child(2){display:none;} }
.hp-panel{position:fixed;top:0;right:0;bottom:calc(var(--hp-bottom,0px) + 76px);z-index:8;width:min(380px,100vw);display:flex;flex-direction:column;background:var(--canvas-flat);border-left:1px solid var(--hairline);box-shadow:-14px 0 40px -20px rgba(0,0,0,.5);transform:translateX(102%);transition:transform .22s cubic-bezier(.2,.8,.2,1);}
.hp-panel[hidden]{display:none;}
.hp-panel.open{transform:none;}
@media (max-width:900px){ .hp-panel{bottom:calc(var(--hp-bottom,0px) + 68px);width:100vw;border-left:0;} }
.hp-ph{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-12) var(--sp-12) var(--sp-8) var(--sp-16);border-bottom:1px solid var(--hairline);}
.hp-ptabs{display:flex;gap:var(--sp-16);}
.hp-ptab{background:none;border:0;padding:6px 0;font-weight:600;font-size:14px;color:var(--fog);cursor:pointer;border-bottom:2px solid transparent;}
.hp-ptab.on{color:var(--bone);border-bottom-color:var(--signal);}
.hp-pb{flex:1;overflow-y:auto;padding:var(--sp-16);display:grid;gap:var(--sp-12);align-content:start;overscroll-behavior:contain;}
.hp-big img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px;display:block;box-shadow:0 18px 40px -18px rgba(0,0,0,.6);background:var(--card);}
.hp-np{display:grid;gap:2px;}
.hp-np-t{font-size:22px;font-weight:700;color:var(--bone);text-decoration:none;line-height:1.2;overflow-wrap:anywhere;}
.hp-np-a{font-size:15px;color:var(--fog);text-decoration:none;}
a.hp-np-t:hover,a.hp-np-a:hover{text-decoration:underline;}
.hp-np-al{font-size:12px;color:var(--ash);}
.hp-ctl.big{justify-content:center;gap:var(--sp-12);}
.hp-ctl.big .hp-play{width:52px;height:52px;}
.hp-ctl.big .hp-play svg{width:24px;height:24px;}
.hp-rate{display:flex;align-items:center;gap:var(--sp-12);flex-wrap:wrap;}
.hp-links{display:flex;flex-wrap:wrap;gap:var(--sp-8);}
.hp-qh{font:600 12px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ash);display:flex;justify-content:space-between;align-items:center;margin-top:var(--sp-8);}
.hp-clear{background:none;border:0;color:var(--fog);cursor:pointer;font:inherit;text-transform:uppercase;}
.hp-clear:hover{color:var(--bone);}
.hp-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;gap:var(--sp-12);align-items:center;padding:6px;border-radius:10px;}
.hp-row:hover{background:var(--card);}
.hp-row img{width:44px;height:44px;border-radius:6px;object-fit:cover;background:var(--card);}
.hp-row-m{text-align:left;background:none;border:0;color:var(--bone);cursor:pointer;display:grid;min-width:0;padding:0;font:inherit;}
.hp-row-m b{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hp-row-m small{color:var(--ash);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hp-row.now .hp-row-m b{color:var(--signal-text);}
.hp-row-len{font:11px var(--font-mono);color:var(--ash);}
/* play / shuffle / queue buttons on pages */
.hp-hero{display:flex;flex-wrap:wrap;gap:var(--sp-8);align-items:center;margin:var(--sp-16) 0 var(--sp-8);}
.hp-big-play{appearance:none;display:inline-flex;align-items:center;gap:var(--sp-8);height:46px;padding:0 var(--sp-24) 0 var(--sp-16);border-radius:var(--r-pill);border:0;background:var(--signal);color:#fff;font-weight:700;font-size:15px;cursor:pointer;transition:transform .12s,filter .15s;}
:root[data-theme="dark"] .hp-big-play{color:#141414;}
.hp-big-play i{display:inline-flex;}
.hp-big-play svg{width:22px;height:22px;}
.hp-big-play:hover:not(:disabled){transform:scale(1.03);filter:brightness(1.06);}
.hp-big-play:disabled{opacity:.6;cursor:progress;}
.fs-btn.hp-shuf{display:inline-flex;align-items:center;gap:var(--sp-6);height:46px;}
.fs-btn.hp-shuf svg{width:16px;height:16px;}
.fs-play{position:absolute;right:8px;bottom:40px;width:40px;height:40px;border-radius:50%;border:0;background:var(--signal);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;opacity:0;transform:translateY(8px);transition:opacity .16s,transform .16s,filter .15s;box-shadow:0 8px 18px -6px rgba(0,0,0,.6);z-index:2;}
:root[data-theme="dark"] .fs-play{color:#141414;}
.fs-play svg{width:18px;height:18px;}
.fs-pw:hover .fs-play,.fs-play:focus-visible,.fs-play.playing{opacity:1;transform:none;}
.fs-play:hover{filter:brightness(1.08);transform:scale(1.06);}
.fs-play.busy{opacity:1;transform:none;animation:hpPulse .8s ease-in-out infinite;}
@keyframes hpPulse{50%{opacity:.45;}}
@media (hover:none){ .fs-play{opacity:.95;transform:none;width:34px;height:34px;bottom:8px;} }
/* rows */
.mu-play svg{width:11px;height:11px;}
.mu-play.playing{background:var(--signal);border-color:var(--signal);color:#fff;}
:root[data-theme="dark"] .mu-play.playing{color:#141414;}
.mu-play.busy{opacity:.5;animation:hpPulse .8s ease-in-out infinite;}
.mu-track.cur .t,.mu-track.cur .n{color:var(--signal-text);}
.mu-track.cur{background:var(--signal-soft);border-radius:8px;}
.mu-pop .mu-track{grid-template-columns:26px 28px minmax(0,1fr) auto;}
.mu-pop .t span:first-child{color:var(--bone);}

/* music banner: blurred cover fills the strip, sharp cover on the right */
.lb-banner.mb{background:#111;}
.lb-banner.mb .mb-bg{position:absolute;inset:-12%;width:124%;height:124%;object-fit:cover;filter:blur(28px) saturate(1.25) brightness(.75);transform:scale(1.05);}
.lb-banner.mb .mb-cover{position:absolute;top:50%;right:clamp(12px,4vw,56px);width:auto;height:82%;aspect-ratio:1/1;transform:translateY(-50%);border-radius:8px;box-shadow:0 14px 34px -10px rgba(0,0,0,.7);object-fit:cover;}
.lb-banner.mb .mb-cap{right:auto;left:10px;}
.lb-bpick.sq{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));}
.lb-bpick.sq .lb-bopt img{aspect-ratio:1/1;}
.lb-bpick.sq .lb-bopt small{display:block;color:var(--ash);}

/* ---------- quick rate (vertical reel) ---------- */
.fs-stars.xl{font-size:clamp(36px,9vw,52px);}
.rt-bar{display:flex;align-items:center;gap:var(--sp-12);flex-wrap:wrap;margin:var(--sp-8) 0;}
.rt-count{font-family:var(--font-mono);font-size:12px;color:var(--fog);}
.rt-chips{margin-bottom:var(--sp-8);}
.rt-chips .fs-chip.on{background:var(--signal);color:#fff;border-color:var(--signal);}
:root[data-theme="dark"] .rt-chips .fs-chip.on{color:#141414;}
.rt-reel{height:calc(100dvh - 300px);min-height:460px;max-height:820px;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior:contain;scroll-behavior:smooth;border-radius:var(--r-card);scrollbar-width:thin;outline:none;}
.rt-slide{scroll-snap-align:start;scroll-snap-stop:always;height:100%;min-height:460px;display:flex;flex-direction:column;gap:var(--sp-12);padding:0 0 var(--sp-8);box-sizing:border-box;}
.rt-banner{position:relative;flex:1 1 auto;min-height:200px;border-radius:var(--r-card);overflow:hidden;background:var(--card);}
.rt-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%;}
.rt-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,0) 45%,rgba(0,0,0,.78) 100%);pointer-events:none;}
.rt-title{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:var(--sp-16);display:grid;gap:2px;}
.rt-title a{color:#fff;text-decoration:none;font-size:clamp(22px,5vw,34px);font-weight:700;line-height:1.15;text-shadow:0 2px 12px rgba(0,0,0,.6);}
.rt-title a:hover{text-decoration:underline;}
.rt-meta{color:rgba(255,255,255,.85);font-family:var(--font-mono);font-size:12px;}
.rt-under{display:grid;gap:var(--sp-8);justify-items:center;text-align:center;}
.rt-rate{display:flex;justify-content:center;padding:2px 0;}
.rt-acts{display:flex;gap:var(--sp-8);flex-wrap:wrap;justify-content:center;}
.rt-acts .fs-btn.on{border-color:var(--signal);color:var(--signal-text);}
.rt-over{margin:0;max-width:640px;color:var(--fog);font-size:13px;line-height:1.5;}
.rt-slide.done .rt-banner{outline:3px solid var(--signal);outline-offset:-3px;}
.rt-slide.skipped{opacity:.35;}
.rt-slide{transition:opacity .25s ease;}
@media (max-width:600px){ .rt-reel{height:calc(100dvh - 250px);min-height:420px;} .rt-over{display:none;} }

/* music quick rate */
.rt-banner.mu{background:#111;}
.rt-banner.mu .mb-bg{position:absolute;inset:-12%;width:124%;height:124%;object-fit:cover;filter:blur(30px) saturate(1.3) brightness(.7);}
.rt-banner.mu .mb-cover{position:absolute;left:50%;top:44%;height:68%;max-height:520px;aspect-ratio:1/1;width:auto;transform:translate(-50%,-50%);border-radius:10px;box-shadow:0 22px 50px -14px rgba(0,0,0,.8);object-fit:cover;z-index:0;}
.rt-eq{position:absolute;top:12px;right:14px;z-index:2;display:none;gap:3px;align-items:flex-end;height:18px;}
.rt-slide.playing .rt-eq{display:flex;}
.rt-eq i{display:block;width:4px;background:#fff;border-radius:2px;animation:rtEq 0.9s ease-in-out infinite;}
.rt-eq i:nth-child(1){height:60%;animation-delay:-.2s;}.rt-eq i:nth-child(2){height:100%;animation-delay:-.5s;}.rt-eq i:nth-child(3){height:45%;animation-delay:-.1s;}.rt-eq i:nth-child(4){height:80%;animation-delay:-.7s;}
@keyframes rtEq{50%{transform:scaleY(.35);transform-origin:bottom;}}
.rt-slide.busy .rt-under{opacity:.6;}
.rt-note{padding:var(--sp-24);text-align:center;}
@media (prefers-reduced-motion: reduce){ .rt-eq i{animation:none;} }

/* music banner, refined: taller strip, soft vignette, sharp cover framed on the right, caption top-left (clear of the avatar) */
.lb-banner.mb{height:clamp(150px,34vw,270px);border-radius:var(--r-card);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);}
.lb-banner.mb .mb-bg{inset:-20%;width:140%;height:140%;filter:blur(34px) saturate(1.3) brightness(.68);transform:none;}
.lb-banner.mb::after{background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.1) 55%,rgba(0,0,0,.35) 100%),linear-gradient(to bottom,rgba(0,0,0,0) 60%,rgba(0,0,0,.45) 100%);}
.lb-banner.mb .mb-cover{height:76%;right:clamp(14px,5vw,64px);border-radius:6px;box-shadow:0 18px 40px -12px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.14);z-index:1;}
.lb-banner.mb .mb-cap{top:12px;bottom:auto;left:14px;right:auto;z-index:2;max-width:calc(100% - 150px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:rgba(0,0,0,.38);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:11px;padding:4px 10px;}
@media (max-width:520px){ .lb-banner.mb .mb-cap{font-size:10px;max-width:calc(100% - 118px);} .lb-banner.mb .mb-cover{height:70%;right:12px;} }

/* banner pickers: rows keep their natural height (they were collapsing into thin strips inside the scrolling grid) */
.lb-bpick{grid-auto-rows:max-content;align-content:start;gap:10px;padding:2px 2px 10px;scroll-padding:8px;}
.lb-bopt{min-height:min-content;border-radius:12px;background:var(--card);box-shadow:0 1px 0 rgba(0,0,0,.04);}
.lb-bopt span{padding:6px 8px 8px;line-height:1.25;}
.lb-bopt span small{display:block;font-size:10px;margin-top:1px;}
.lb-bpick.sq{grid-template-columns:repeat(auto-fill,minmax(104px,1fr));}
.lb-bpick.sq .lb-bopt img{border-radius:0;}
.lb-bopt.on{box-shadow:0 0 0 2px var(--signal);}
@media (max-width:520px){ .lb-bpick{grid-template-columns:repeat(2,minmax(0,1fr));max-height:58vh;} .lb-bpick.sq{grid-template-columns:repeat(3,minmax(0,1fr));} }

/* full songs: YouTube's embedded player must stay visible while it plays, so it sits in a small card above the player bar */
.hp-video{position:fixed;right:12px;bottom:calc(var(--hp-bottom,0px) + 88px);z-index:9;width:240px;height:135px;border-radius:var(--r-md,12px);overflow:hidden;background:#000;border:1px solid var(--hairline);box-shadow:0 14px 34px -12px rgba(0,0,0,.6);}
.hp-video iframe{display:block;width:100%;height:100%;border:0;}
body.hp-panel-on .hp-video{right:calc(min(380px,100vw) + 12px);}
@media (max-width:900px){ .hp-video{width:200px;height:113px;bottom:calc(var(--hp-bottom,0px) + 80px);} body.hp-panel-on .hp-video{right:12px;bottom:calc(var(--hp-bottom,0px) + 80px);z-index:10;} }
button.hp-tag{cursor:pointer;background:transparent;}
button.hp-tag:hover{color:var(--ink,#fff);border-color:var(--ash);}
.hp-tag.full{color:var(--orange,#DE5D33);border-color:currentColor;}
.auth-resend{margin-top:var(--sp-8,8px);font:inherit;font-size:13px;color:var(--orange,#DE5D33);background:none;border:1px solid currentColor;border-radius:var(--r-pill,999px);padding:4px 12px;cursor:pointer;}
.auth-resend:disabled{opacity:.55;cursor:default;}
.welcome-card{text-align:center;padding:var(--sp-8,8px) 0;}
.welcome-mark{display:flex;justify-content:center;margin-bottom:var(--sp-12,12px);}
.welcome-mark svg{height:64px;width:auto;}
.welcome-card h2{margin:0 0 var(--sp-8,8px);}
.welcome-card p{margin:0 0 var(--sp-16,16px);color:var(--ash);}
.fs-live{position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);font:600 13px var(--font-mono);letter-spacing:0;color:var(--canvas-flat,#111);background:var(--signal,#DE5D33);border-radius:var(--r-pill,999px);padding:2px 9px;pointer-events:none;white-space:nowrap;z-index:5;}
.fs-stars.input::after{pointer-events:none;}
.app-steps{margin:var(--sp-12,12px) 0;padding-left:20px;line-height:1.6;}
.app-steps li{margin-bottom:6px;}
@media (display-mode: standalone){ [data-app-link]{display:none !important;} }