@font-face{font-family:Outfit;src:url('fonts/outfit.woff2') format('woff2');font-weight:100 900;font-display:swap}@font-face{font-family:'JetBrains Mono';src:url('fonts/mono.woff2') format('woff2');font-weight:100 800;font-display:swap}
:root{color-scheme:dark;--bg:#000;--panel:#111;--line:#222;--text:#fff;--muted:#858585;--red:#dc2626;--rail:64px;--header:72px;--mono:'JetBrains Mono',monospace}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--red) transparent}body{font-family:Outfit,Arial,sans-serif;background:var(--bg);color:var(--text);font-size:14px;-webkit-font-smoothing:antialiased;overflow-x:hidden}body.rail-open{--rail:220px}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit;background:none;border:0}a,button,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a,input,select,textarea{outline-offset:5px}button:focus-visible,a:focus-visible{outline:2px solid #ef4444}img{max-width:100%;display:block}button .icon,a .icon{flex-shrink:0}.icon{width:24px;height:24px;vertical-align:middle;flex-shrink:0}button:disabled{opacity:.4;cursor:not-allowed}[hidden]{display:none!important}.site-header{height:var(--header);position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;gap:18px;padding:12px 46px 12px 12px;background:linear-gradient(#000b,#0000);transition:background .2s}.site-header.scrolled{background:#000e;backdrop-filter:blur(20px)}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:40px;border-radius:50%;flex-shrink:0}.icon-button .icon{width:26px;height:26px}.icon-button:hover{background:#ffffff12}.menu-toggle{width:36px}.brand{display:block;flex-shrink:0}.brand img{width:175px;height:auto}.site-header .brand{margin-left:0}.search-box{position:relative;display:flex;align-items:center;margin-left:auto;width:min(500px,49vw)}.search-box>.icon{position:absolute;left:16px;color:#999;width:18px;height:18px}.search-box input{width:100%;height:42px;border:1px solid #ffffff14;border-radius:50px;background:#ffffff0e;padding:0 100px 0 42px;color:#fff;outline:none;font-size:14px}.search-box input::placeholder{color:#929292}.search-box input:focus{border-color:#ffffff4d;background:#1a1a1a}.search-shortcut{position:absolute;right:12px;color:#666;font-size:11px;pointer-events:none}kbd{font:10px Outfit,sans-serif;padding:2px 7px;background:#ffffff08;border:1px solid #ffffff20;border-radius:5px}.search-results{position:absolute;top:calc(100% + 9px);left:0;right:0;background:#111113f7;border:1px solid #ffffff18;border-radius:12px;box-shadow:0 20px 50px #000c;overflow:auto;max-height:480px;padding:8px}.search-results a{display:flex;align-items:center;gap:12px;padding:10px;border-radius:8px}.search-results a:hover{background:#ffffff0e}.search-results img{width:40px;height:58px;object-fit:cover;border-radius:5px}.search-results strong{display:block;font-weight:600;line-height:1.2}.search-results small{display:block;color:#888;margin-top:5px}.search-results p{padding:20px;color:#888}.dropdown{position:absolute;right:70px;top:65px;width:300px;background:#111;border:1px solid #2a2a2a;border-radius:12px;padding:24px;box-shadow:0 15px 40px #000}.dropdown p{color:#888;margin:20px 0}.text-button{color:#aaa;font-size:12px}.navigation{position:fixed;top:0;bottom:0;left:0;width:var(--rail);padding:78px 8px 20px;z-index:40;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--red) transparent;transition:width .22s;background:transparent}.rail-open .navigation{background:#000}.nav-item{display:flex;align-items:center;height:44px;gap:16px;border-radius:40px;white-space:nowrap;margin:0 0 4px;padding:0 14px;color:#999;font-weight:500}.nav-item>.icon{width:22px;height:22px}.nav-item>span{display:none}.rail-open .nav-item>span{display:inline}.nav-item:hover{background:#111;color:#fff}.nav-item.active{background:#202020;color:#fff}.navigation:not(:hover){scrollbar-width:none}.nav-section{display:none;border-top:1px solid #111;margin-top:12px;padding:14px 0 6px}.rail-open .nav-section{display:block}.nav-section h3{font-size:13px;padding:0 14px 12px}.nav-section .nav-item{height:36px;font-size:14px;margin-bottom:2px}.nav-section .icon{width:20px;height:20px}.nav-about{color:#777;font-size:12px;padding:20px 14px}.nav-about p{color:#aaa;margin-bottom:7px}.rail-backdrop{display:none}.main-content{margin-left:var(--rail);transition:margin-left .22s;min-height:100vh}.hero{height:540px;position:relative;overflow:hidden;background:#000}.hero-slide{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .55s}.hero-slide.active{opacity:1;pointer-events:auto}.hero-glow{position:absolute;inset:-50px -50px -50px 30%;background-size:cover;background-position:center;filter:blur(40px) brightness(.3) saturate(.9);transform:scale(1.1)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#000 0%,#000 27%,#000b 50%,transparent 100%),linear-gradient(0deg,#000,transparent 40%,#0002)}.hero-layout{height:100%;position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:70px;padding:78px 100px 36px 0;max-width:1560px;margin:0 auto}.hero-copy{position:relative;min-width:0;max-width:680px}.hero-copy:before{content:attr(data-number);position:absolute;left:-14px;top:-75px;font:900 clamp(160px,20vw,300px)/.8 var(--mono);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1px #ffffff0b;z-index:-1}.hero-rank{font:700 11px var(--mono);letter-spacing:.32em;display:flex;align-items:center;gap:14px;margin-bottom:26px}.hero-rank:before{content:'';width:26px;height:2px;background:#fff}.hero-rank span{letter-spacing:.1em}.hero-rank i{height:1px;background:#ffffff2a;flex:1}.hero-title{height:150px;display:flex;align-items:center}.hero-title img{max-height:150px;max-width:86%;object-fit:contain;object-position:left center;filter:drop-shadow(0 8px 24px #000)}.hero-meta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:13px 0;margin-top:26px;border-top:1px solid #ffffff29;border-bottom:1px solid #ffffff29;font:600 12px var(--mono);letter-spacing:.06em;color:#858585;text-transform:uppercase}.hero-meta strong{display:flex;align-items:center;gap:6px;color:#fff;font-size:13px}.hero-meta .icon{width:15px;height:15px}.hero-meta b{color:#292929}.hero-genres{color:#fff}.hero-description{color:#888;font-weight:500;font-size:14px;line-height:1.7;margin-top:23px;max-width:540px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.hero-actions{display:flex;gap:20px;margin-top:40px}.hero-primary,.hero-secondary{height:56px;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:0 28px;border:3px solid white;font:800 13px var(--mono);letter-spacing:.18em;background:#dc2626;box-shadow:6px 6px 0 #7f1d1d;transition:background .15s}.hero-primary:hover{background:#ef4444}.hero-secondary{border-width:2px;letter-spacing:.15em;font-size:12px;background:#ffffff0e;box-shadow:5px 5px 0 #ffffff40;padding:0 24px}.hero-secondary:hover{background:#ffffff20}.hero-actions .icon{width:18px;height:18px}.hero-posters{width:240px;aspect-ratio:2/3;position:relative;margin:0 0 0 36px}.hero-posters img{width:100%;height:100%;object-fit:cover;border-radius:12px}.hero-posters .front{position:absolute;inset:0;z-index:3;border:1px solid #ffffff12;border-radius:12px;box-shadow:0 30px 60px -20px #000;transition:transform .3s}.hero-posters:hover .front{transform:translateY(-5px)}.ghost{position:absolute;top:8%;width:78%;height:84%;opacity:.65;filter:brightness(.55) saturate(.8);z-index:1}.ghost.prev{left:-34%;transform:rotate(-11deg)}.ghost.next{right:-34%;transform:rotate(11deg)}.hero-pagination{position:absolute;z-index:4;bottom:18px;left:50%;display:flex;gap:7px;opacity:0;transition:opacity .2s}.hero:hover .hero-pagination,.hero:focus-within .hero-pagination{opacity:1}.hero-pagination button{height:4px;width:20px;background:#444;border-radius:4px}.hero-pagination button.active{background:var(--red);width:32px}.home-body{padding:0 40px}.section{scroll-margin-top:100px}.section-title{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:750;letter-spacing:-.7px;margin-bottom:24px;line-height:1.2}.section-title:before{content:'';width:4px;height:22px;background:#fff;border-radius:3px;flex-shrink:0}.section-title>span{color:var(--red);margin-right:-2px}.section-title small{font-size:11px;letter-spacing:0;border:1px solid #ffffff08;background:#151515;border-radius:6px;padding:3px 9px;margin-left:8px;font-weight:750}.latest-section{padding-top:4px;margin-bottom:64px}.release-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:26px 18px}.release-card{min-width:0}.release-thumbnail{aspect-ratio:16/9;background:linear-gradient(#131313 50%,#0a0a0a);position:relative;border-radius:9px;overflow:hidden}.release-thumbnail img{width:100%;height:100%;object-fit:cover;opacity:.65}.release-play{position:absolute;inset:0;display:grid;place-items:center;opacity:0;background:#0004;transition:opacity .2s}.release-play .icon{width:34px;height:34px}.release-card:hover .release-play,.release-card:focus-visible .release-play{opacity:1}.release-thumbnail time{position:absolute;bottom:8px;right:8px;background:#000d;border-radius:5px;padding:4px 7px;font:700 11px var(--mono)}.release-meta{display:flex;gap:7px;align-items:center;color:#666;font-size:11px;font-weight:750;margin:10px 0 3px;white-space:nowrap}.release-meta span{border:1px solid #3a3a3a;border-radius:4px;line-height:1;padding:2px 6px;color:#ccc;font-size:10px}.release-meta span:first-of-type{background:#202020;color:#fff}.release-card h3{font-size:14px;letter-spacing:-.25px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:650}.home-columns{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start}.catalog-section{margin-bottom:64px}.poster-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px 18px}.anime-card{min-width:0}.poster{position:relative;aspect-ratio:2/3;border-radius:10px;overflow:hidden;background:#151515}.poster>a{display:block;height:100%}.poster img{width:100%;height:100%;object-fit:cover;transition:transform .35s}.poster-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0005;opacity:0;transition:opacity .25s}.poster-play .icon{width:34px;height:34px}.poster:hover .poster-play{opacity:1}.poster:hover img{transform:scale(1.05)}.langs{position:absolute;bottom:8px;left:8px;display:flex;align-items:center;gap:7px;background:#000c;border-radius:6px;padding:4px 8px;pointer-events:none;font-size:11px;font-weight:800}.langs span{display:flex;align-items:center;gap:5px}.langs i{font-style:normal;color:#777;font-weight:400}.langs .icon{width:13px;height:13px}.card-title{font-size:14px;font-weight:650;line-height:1.3;margin-top:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;letter-spacing:-.2px}.card-title:hover{color:#ccc}.card-menu{position:absolute;top:7px;right:7px;display:grid;place-items:center;width:29px;height:32px;border-radius:50%;background:#000b;opacity:0;transition:opacity .2s}.card-menu .icon{width:18px;height:18px}.poster:hover .card-menu,.card-menu:focus-visible{opacity:1}.home-aside{display:flex;flex-direction:column;gap:34px}.aside-heading{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #202020;padding-bottom:15px;margin-bottom:5px;gap:15px}.aside-heading h2{font-size:18px;letter-spacing:-.4px;display:flex;align-items:center;gap:9px;white-space:nowrap}.aside-heading h2:before{content:'';width:3px;height:18px;border-radius:3px;background:#ef4444}.popular-tabs{display:flex;gap:18px}.popular-tabs button{font-weight:650;font-size:13px;color:#666;position:relative;line-height:22px}.popular-tabs button.active{color:#fff}.popular-tabs button.active:after{content:'';position:absolute;height:2px;bottom:-11px;left:0;right:0;background:#dc2626;border-radius:2px}.popular-row{height:64px;display:flex;align-items:center;gap:16px;padding:8px 5px}.popular-row:hover{background:#0c0c0c}.popular-row .rank{width:22px;text-align:center;font-size:20px;font-weight:800}.popular-row:nth-child(-n+3) .rank{color:#ef4444}.popular-row>div{min-width:0;flex:1}.popular-row h3{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:650;letter-spacing:-.1px}.popular-row p{font-size:11px;color:#666;margin-top:2px}.popular-row img{width:54px;height:36px;border-radius:6px;object-fit:cover}.upcoming-row{display:flex;gap:12px;padding:15px 6px}.upcoming-row img{width:52px;height:75px;object-fit:cover;border-radius:7px;flex-shrink:0}.upcoming-row h3{font-size:14px;font-weight:650;line-height:1.3;margin-bottom:5px}.upcoming-row p{font-size:12px;line-height:1.5;color:#666;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.site-footer{padding:45px 40px 24px;display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;border-top:1px solid #151515;color:#777;margin-top:45px}.site-footer .brand{display:inline-block}.site-footer p{margin-top:15px;line-height:1.6;font-size:13px}.site-footer h4{color:#ddd;margin-bottom:16px;font-size:13px}.site-footer>div>a:not(.brand){display:block;font-size:13px;margin:9px 0}.copyright{grid-column:1/-1;font-size:11px!important;padding-top:18px;border-top:1px solid #151515}.page-shell{padding:112px 40px 60px;min-height:75vh}.page-title{font-size:36px;letter-spacing:-1px;margin-bottom:8px}.page-subtitle{color:#777;font-size:14px;margin-bottom:28px}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 18px;background:#191919;border:1px solid #303030;border-radius:7px;font-weight:650;font-size:13px;transition:background .2s}.button:hover{background:#292929}.button.primary{background:var(--red);border-color:var(--red)}.button.primary:hover{background:#ef3333}.button .icon{width:17px;height:17px}.button.saved{background:#153322;border-color:#286345}.browse-layout{display:grid;grid-template-columns:240px 1fr;gap:30px;margin-top:30px}.filter-panel{padding:22px 18px;border:1px solid #222;border-radius:12px;background:#0b0b0b;align-self:start;position:sticky;top:94px}.filter-panel h3{display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:1px;margin-bottom:22px}.filter-panel label{display:block;color:#999;font-size:12px;margin:18px 0 8px}.filter-panel select,.filter-panel input,.filter-panel textarea{display:block;width:100%;padding:10px 12px;background:#171717;border:1px solid #2a2a2a;border-radius:6px;color:#eee;min-width:0}.filter-panel .button{margin-top:20px;width:100%}.genre-options{display:flex;flex-wrap:wrap;gap:6px}.genre-chip{font-size:11px;border:1px solid #333;background:#151515;border-radius:5px;padding:5px 9px;color:#999}.genre-chip.active{background:#411414;color:#fff;border-color:var(--red)}.result-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;color:#777;font-size:13px}.browse-results .poster-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.empty-state{grid-column:1/-1;border:1px dashed #292929;border-radius:12px;padding:65px 20px;text-align:center}.empty-state>.icon{width:42px;height:42px;color:#666;margin-bottom:20px}.empty-state h2{font-size:23px;margin-bottom:9px}.empty-state p{color:#777;margin-bottom:25px}.detail-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:35px;max-width:1100px}.detail-cover{width:100%;border-radius:12px}.detail-copy h1{font-size:36px;line-height:1.1;letter-spacing:-1px;margin-bottom:18px;max-width:700px}.detail-tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px;color:#999;font-family:var(--mono);font-size:12px}.detail-tags span{padding:5px 10px;background:#151515;border:1px solid #252525;border-radius:5px}.detail-description{font-size:15px;line-height:1.8;max-width:720px;color:#999;margin:24px 0}.detail-actions{display:flex;gap:10px;flex-wrap:wrap}.detail-metadata{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;border-top:1px solid #222;padding-top:22px;margin-top:28px;color:#aaa}.detail-metadata strong{display:block;color:#eee;font-size:12px;margin-bottom:7px}.episodes-section{margin-top:60px}.episode-buttons{display:grid;grid-template-columns:repeat(auto-fill,minmax(55px,1fr));gap:8px;max-width:1000px}.episode-buttons a{background:#141414;border:1px solid #282828;padding:12px;text-align:center;border-radius:6px}.episode-buttons a:hover,.episode-buttons a.active{background:var(--red);border-color:var(--red)}.watch-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:26px}.video-stage{aspect-ratio:16/9;background:#090909;border:1px solid #171717;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.video-stage video{width:100%;height:100%;background:#000}.video-empty{text-align:center;padding:30px;max-width:500px}.video-empty>.icon{width:48px;height:48px;color:#666;margin-bottom:18px}.video-empty h2{font-size:22px;margin-bottom:10px}.video-empty p{font-size:13px;line-height:1.6;color:#777}.watch-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:15px 0;border-bottom:1px solid #222}.watch-toolbar label{display:flex;gap:8px;align-items:center;font-size:12px;color:#aaa}.watch-sidebar{background:#0d0d0d;border:1px solid #222;border-radius:10px;padding:20px;max-height:550px;overflow:auto}.watch-sidebar h2{font-size:17px;margin-bottom:20px}.watch-sidebar .episode-buttons{grid-template-columns:repeat(4,minmax(0,1fr))}.watch-title{font-size:26px;margin:25px 0 10px;letter-spacing:-.6px}.watch-caption{color:#777}.schedule-toolbar{display:flex;justify-content:space-between;gap:18px;align-items:center;margin:24px 0}.schedule-days{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}.day-button{padding:15px;background:#0c0c0c;border:1px solid #222;border-radius:8px;text-align:left}.day-button span{display:block;color:#777;font-size:11px;text-transform:uppercase;letter-spacing:1px}.day-button strong{display:block;font:700 23px var(--mono);margin-top:8px}.day-button.active{background:#241010;border-color:#a22b2b}.day-button.active span{color:#ef4444}.schedule-list{margin-top:25px}.schedule-row{display:flex;align-items:center;gap:20px;padding:18px 12px;border-bottom:1px solid #191919}.schedule-row time{font:600 13px var(--mono);width:65px;color:#aaa}.schedule-row img{width:45px;height:65px;border-radius:6px;object-fit:cover}.schedule-row h3{font-size:16px;font-weight:600}.schedule-row p{color:#666;margin-top:6px;font-size:12px}.schedule-row .button{margin-left:auto}.pill-tabs{display:flex;gap:6px;flex-wrap:wrap}.pill-tabs button,.pill-tabs a{padding:8px 14px;color:#888;font-size:13px;border-radius:5px}.pill-tabs .active{background:#242424;color:#fff}.library-header{display:flex;align-items:center;gap:20px;padding-bottom:30px;border-bottom:1px solid #222;margin-bottom:25px}.guest-avatar{display:grid;place-items:center;width:80px;height:80px;background:#1b1b1b;border-radius:50%;color:#aaa}.guest-avatar .icon{width:44px;height:44px}.library-header p{color:#777;margin-top:8px}.library-content{margin-top:30px}.library-content.poster-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}.community-hero{max-width:650px;margin-bottom:50px}.community-hero p{font-size:17px;line-height:1.7;color:#888}.community-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.community-card{padding:28px;background:#0d0d0d;border:1px solid #242424;border-radius:12px}.community-card .icon{color:#dc2626;margin-bottom:24px;width:32px;height:32px}.community-card h2{font-size:21px;margin-bottom:10px}.community-card p{color:#777;line-height:1.6;margin-bottom:22px}.signin-dialog{margin:auto;width:min(440px,calc(100% - 30px));padding:44px 36px;background:#111;border:1px solid #333;border-radius:16px;color:#fff;text-align:center;box-shadow:0 30px 100px #000}.signin-dialog::backdrop{background:#000b;backdrop-filter:blur(8px)}.dialog-close{position:absolute;right:10px;top:10px}.dialog-logo{width:180px;margin:0 auto 28px}.signin-dialog h2{font-size:25px;margin-bottom:12px;letter-spacing:-.6px}.signin-dialog p{color:#888;font-size:14px;line-height:1.6;margin-bottom:25px}.signin-dialog .button{width:100%}.signin-dialog small{display:block;color:#666;margin-top:20px;font-size:11px}.toast{position:fixed;z-index:100;bottom:28px;left:50%;transform:translate(-50%,25px);background:#191919;border:1px solid #333;border-radius:8px;padding:12px 22px;color:#eee;font-size:13px;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s;box-shadow:0 5px 30px #000;max-width:90vw;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.mobile-nav{display:none}
@media(min-width:1600px){body{zoom:1.5}.hero-layout{max-width:none}.hero{height:540px}}
@media(min-width:1024px){.rail-open .release-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1200px){.hero-layout{padding-right:65px;gap:55px}.hero-posters{width:210px;margin-left:0}.hero-meta{gap:10px;font-size:10px}.hero-actions{gap:16px}.hero-primary{padding:0 20px}.hero-secondary{padding:0 18px}.home-columns{grid-template-columns:minmax(0,1fr) 280px;gap:24px}.popular-tabs{gap:12px}.poster-grid{gap:22px 14px}.home-body{padding:0 30px}.hero-copy{padding-left:0}.browse-results .poster-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.rail-open .home-columns{grid-template-columns:1fr}.rail-open .home-aside{display:grid;grid-template-columns:1fr 1fr;gap:35px}}
@media(max-width:1023px){.home-columns{grid-template-columns:1fr}.home-aside{display:grid;grid-template-columns:1fr 1fr;gap:30px}.hero-layout{gap:40px;padding-right:55px}.hero-posters{width:180px}.hero-genres{display:none}.hero-title{height:125px}.hero-title img{max-height:125px;max-width:94%}.hero-rank{font-size:10px}.hero-actions{margin-top:30px;gap:14px}.hero-primary,.hero-secondary{height:48px;font-size:10px;padding:0 16px;letter-spacing:.12em}.hero-description{font-size:13px}.release-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.browse-layout{grid-template-columns:200px 1fr;gap:22px}.browse-results .poster-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.watch-layout{grid-template-columns:1fr}.watch-sidebar{max-height:230px}.watch-sidebar .episode-buttons{grid-template-columns:repeat(auto-fill,minmax(50px,1fr))}.site-header{padding-right:20px;gap:14px}.site-header .brand img{width:165px}.search-box{width:min(500px,43vw)}.search-shortcut{display:none}.search-box input{padding-right:16px}}
@media(max-width:767px){:root{--rail:0px;--header:65px}body.rail-open{--rail:0px}.site-header{height:65px;background:#000e;padding:10px 14px;gap:10px}.site-header .brand img{width:150px}.menu-toggle{width:26px}.site-header .icon-button .icon{width:23px;height:23px}.site-header>.icon-button{width:28px}.search-box{width:auto;flex:1;min-width:0}.search-box input{height:36px;font-size:12px;padding-left:32px}.search-box>.icon{width:15px;height:15px;left:11px}.search-results{position:fixed;left:12px;right:12px;top:65px}.notifications-toggle{display:none}.navigation{top:65px;width:240px;transform:translateX(-100%);padding:16px 8px 80px;background:#000;transition:transform .22s}.rail-open .navigation{transform:translateX(0)}.rail-open .rail-backdrop{display:block;position:fixed;inset:65px 0 0;background:#0009;z-index:35;backdrop-filter:blur(3px)}.main-content{margin:0}.hero{height:780px}.hero-layout{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:30px;padding:100px 24px 40px}.hero-posters{width:180px;flex-shrink:0;margin:0 auto}.ghost.prev{left:-27%;transform:rotate(-11deg) scale(.9)}.ghost.next{right:-27%;transform:rotate(11deg) scale(.9)}.hero-copy{width:100%;max-width:600px}.hero-copy:before{font-size:160px;top:0;left:-18px}.hero-rank{margin-bottom:14px;font-size:9px}.hero-title{height:95px}.hero-title img{max-height:95px;max-width:80%}.hero-meta{margin-top:18px;font-size:10px;gap:13px;padding:12px 0}.hero-meta .hero-genres{display:none}.hero-description{margin-top:16px;font-size:13px;line-height:1.7}.hero-actions{margin-top:24px;gap:15px}.hero-primary,.hero-secondary{height:46px;padding:0 17px;font-size:10px}.hero-pagination{opacity:1;bottom:12px;left:auto;right:24px}.hero-glow{left:-30%;top:-20%;bottom:30%;filter:blur(35px) brightness(.4)}.hero-shade{background:linear-gradient(0deg,#000 0%,#000b 45%,transparent 100%)}.home-body{padding:12px 20px 0}.section-title{font-size:22px;gap:9px;margin-bottom:21px}.section-title small{font-size:9px;margin-left:0;padding:4px 6px}.release-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px 13px}.release-card h3{font-size:13px}.release-meta{font-size:9px;gap:5px}.release-meta span{font-size:8px;padding:2px 4px}.release-thumbnail time{font-size:10px;padding:3px 6px;right:6px;bottom:6px}.latest-section{margin-bottom:45px}.poster-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:23px 12px}.card-title{font-size:13px;line-height:1.35;margin-top:8px}.poster{border-radius:9px}.langs{left:5px;bottom:6px;gap:4px;padding:4px 5px;font-size:9px}.langs .icon{width:11px;height:11px}.langs span{gap:3px}.card-menu{opacity:1;width:25px;height:27px;top:5px;right:5px}.catalog-section{margin-bottom:48px}.home-aside,.rail-open .home-aside{display:flex;gap:36px;flex-direction:column}.popular-row{height:73px}.popular-row img{width:70px;height:45px}.popular-row h3{font-size:14px}.popular-row p{font-size:12px}.upcoming-row img{width:62px;height:88px}.upcoming-row h3{font-size:15px}.upcoming-row p{font-size:13px}.site-footer{padding:35px 20px 95px;gap:24px;grid-template-columns:1fr 1fr}.site-footer>div:first-child{grid-column:1/-1}.copyright{line-height:1.8!important}.mobile-nav{position:fixed;z-index:45;bottom:0;left:0;right:0;height:66px;padding:8px 10px max(8px,env(safe-area-inset-bottom));border-top:1px solid #252525;background:#090909f5;backdrop-filter:blur(15px);display:flex;justify-content:space-around}.mobile-nav a{display:flex;flex-direction:column;align-items:center;gap:4px;color:#777;font-size:10px;width:25%}.mobile-nav a.active{color:#fff}.mobile-nav a.active .icon{color:#ef4444}.mobile-nav .icon{width:23px;height:23px}.page-shell{padding:95px 20px 45px}.page-title{font-size:30px}.browse-layout{grid-template-columns:1fr;gap:24px}.filter-panel{position:static;padding:18px}.filter-panel label{margin-top:12px}.filter-panel .genre-options{gap:6px}.browse-results .poster-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.detail-layout{display:block}.detail-cover{width:150px;margin-bottom:25px}.detail-copy h1{font-size:28px}.detail-description{font-size:14px}.detail-metadata{font-size:12px}.watch-title{font-size:23px}.watch-toolbar{flex-wrap:wrap;font-size:12px}.watch-toolbar .button{padding:9px 11px;font-size:11px}.video-empty{padding:15px}.video-empty>.icon{width:30px;height:30px;margin-bottom:10px}.video-empty h2{font-size:17px}.video-empty p{font-size:11px}.schedule-days{gap:5px}.day-button{padding:10px 5px;text-align:center}.day-button strong{font-size:18px}.day-button span{font-size:8px;letter-spacing:0}.schedule-row{gap:10px;padding:15px 0}.schedule-row time{width:40px;font-size:10px}.schedule-row img{width:36px;height:51px}.schedule-row h3{font-size:13px}.schedule-row .button{font-size:10px;padding:7px}.schedule-row .button .icon{display:none}.schedule-toolbar{flex-wrap:wrap}.schedule-toolbar .pill-tabs button{padding:7px 10px;font-size:12px}.community-cards{grid-template-columns:1fr}.library-content.poster-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.toast{bottom:82px}.library-header h1{font-size:26px}.guest-avatar{width:60px;height:60px}.dropdown{right:15px;top:60px}.section{scroll-margin-top:85px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

.home-columns>div{min-width:0}@media(max-width:767px){.home-columns{grid-template-columns:minmax(0,1fr)}.section-title{flex-wrap:wrap}}

/* ===== Auth: avatar + account menu ===== */
.avatar-initials{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#ef4444,#991b1b);color:#fff;font:800 13px/1 Outfit,sans-serif;letter-spacing:.02em;box-shadow:0 0 0 1.5px #dc262655,0 3px 10px #0009}
.account-toggle.has-avatar{width:auto;min-width:40px;padding:0 5px;border-radius:50px}
.account-toggle.has-avatar:hover{background:0}
.account-toggle.has-avatar:hover .avatar-initials{box-shadow:0 0 0 1.5px #ef4444,0 3px 10px #0009}
.account-menu{position:absolute;right:70px;top:65px;width:280px;background:#101010;border:1px solid #2a2a2a;border-radius:14px;box-shadow:0 20px 60px #000d;z-index:60;overflow:hidden;animation:menu-in .16s ease both}
@keyframes menu-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.account-menu-head{display:flex;gap:12px;align-items:center;padding:16px 18px;border-bottom:1px solid #1f1f1f;background:radial-gradient(120px 60px at 0% 0%,#dc262614,transparent)}
.account-menu-head .avatar-initials{width:42px;height:42px;font-size:17px}
.account-menu-head strong{display:block;font-size:15px;letter-spacing:-.2px}
.account-menu-head small{color:#888;font-size:12px;display:block;margin-top:2px}
.account-menu a,.account-menu button{display:flex;width:100%;align-items:center;gap:12px;padding:11px 18px;color:#c9c9c9;font-size:13.5px;text-align:left;font-weight:500}
.account-menu a .icon,.account-menu button .icon{width:18px;height:18px;color:#8a8a8a}
.account-menu a:hover{background:#181818;color:#fff}
.account-menu form{border-top:1px solid #1f1f1f;margin-top:4px}
.account-menu button:hover{color:#f87171;background:#181818}
.library-avatar{width:80px;height:80px;font-size:30px;border-radius:24px;box-shadow:0 0 0 2px #dc262640,0 10px 30px #0008}

/* ===== Sign-in dialog (restyled) ===== */
.signin-dialog{margin:auto;width:min(400px,calc(100% - 30px));padding:42px 32px 26px;background:#0e0e0e;border:1px solid #2c2c2c;border-radius:18px;color:#fff;text-align:center;box-shadow:0 30px 100px #000}
.signin-dialog::backdrop{background:#000c;backdrop-filter:blur(10px)}
.dialog-logo{width:168px;margin:0 auto 24px}
.signin-dialog h2{font-size:23px;margin-bottom:10px;letter-spacing:-.5px}
.signin-dialog p{color:#888;font-size:13.5px;line-height:1.65;margin-bottom:22px}
.dialog-primary{width:100%;height:49px;background:linear-gradient(180deg,#f04343,#dc2626 60%,#c31c1c);border:1px solid #ef444466;border-radius:11px;font-weight:800;font-size:13.5px;color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;margin-bottom:10px;box-shadow:0 10px 26px #dc262638,4px 4px 0 #7f1d1d;transition:transform .12s,filter .15s,box-shadow .12s}
.dialog-primary:hover{filter:brightness(1.08);transform:translate(-1px,-1px);box-shadow:0 12px 30px #dc26264a,5px 5px 0 #7f1d1d}
.dialog-primary:active{transform:translate(2px,2px);box-shadow:0 6px 14px #dc26262b,2px 2px 0 #7f1d1d}
.dialog-primary .icon{width:17px;height:17px}
.dialog-secondary{width:100%;height:46px;background:#161616;border:1px solid #2c2c2c;border-radius:11px;font-weight:650;font-size:13.5px;color:#ddd;display:flex;align-items:center;justify-content:center;transition:.15s}
.dialog-secondary:hover{background:#1f1f1f;border-color:#3a3a3a;color:#fff}
.dialog-guest{display:block;margin-top:17px;font-size:12.5px;color:#787878;transition:color .15s}
.dialog-guest:hover{color:#fff}
.signin-dialog small{display:block;color:#565656;margin-top:13px;font-size:11px}

/* ===== Auth pages (login / signup) ===== */
.auth-shell{min-height:100vh;display:grid;place-items:center;padding:118px 18px 70px;position:relative;overflow:hidden}
.auth-shell:before{content:'';position:fixed;inset:0;background:radial-gradient(720px 340px at 50% -80px,#dc262622,transparent 70%),radial-gradient(560px 420px at 88% 112%,#dc262610,transparent 70%);pointer-events:none}
.auth-watermark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font:900 clamp(110px,23vw,300px)/1 var(--mono);letter-spacing:-.02em;color:transparent;-webkit-text-stroke:1px #ffffff07;pointer-events:none;user-select:none;white-space:nowrap}
.auth-card{position:relative;width:min(472px,100%);background:#0d0d0df5;border:1px solid #282828;border-radius:20px;box-shadow:0 40px 120px #000d,0 0 90px #dc262612;overflow:hidden;animation:auth-in .55s cubic-bezier(.2,.7,.2,1) both}
@keyframes auth-in{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
.auth-hero{position:relative;height:150px;background:#000}
.auth-collage{position:absolute;inset:0;display:flex}
.auth-collage img{flex:1 1 0;min-width:0;height:100%;object-fit:cover;filter:brightness(.5) saturate(.9)}
.auth-collage img:nth-child(even){filter:brightness(.36) saturate(.8)}
.auth-collage img:nth-child(3n){object-position:top}
.auth-hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,#000b,transparent 38%,#0d0d0df5 97%)}
.auth-logo{position:absolute;left:50%;bottom:11px;transform:translateX(-50%);width:160px;filter:drop-shadow(0 10px 26px #000) drop-shadow(0 2px 8px #00000090)}
.auth-slash{position:relative;display:block;height:3px;background:linear-gradient(90deg,transparent,#dc2626 26%,#ef4444 50%,#dc2626 74%,transparent);margin-top:-3px;z-index:2}
.auth-body{padding:24px 30px 26px;position:relative}
.auth-eyebrow{font:800 10px var(--mono);letter-spacing:.42em;color:#ef4444;text-transform:uppercase;margin-bottom:9px}
.auth-title{font-size:29px;font-weight:800;letter-spacing:-1px;line-height:1.1}
.auth-sub{color:#8a8a8a;font-size:13.5px;line-height:1.6;margin:8px 0 20px}
.auth-alert{display:flex;gap:10px;align-items:flex-start;border-radius:10px;padding:12px 14px;font-size:13px;line-height:1.55;margin-bottom:18px;animation:auth-in .3s ease both}
.auth-alert .icon{width:17px;height:17px;flex-shrink:0;margin-top:1px}
.auth-alert.error{background:#2a1010;border:1px solid #7f1d1d;color:#fca5a5}
.auth-alert.success{background:#0f2417;border:1px solid #1d5c38;color:#86efac}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:#131313;border:1px solid #262626;border-radius:11px;padding:4px;gap:4px;margin-bottom:22px}
.auth-tabs a{height:38px;display:flex;align-items:center;justify-content:center;border-radius:8px;font-weight:650;font-size:13px;color:#888;transition:.15s}
.auth-tabs a:hover{color:#ddd}
.auth-tabs a.active{background:#dc2626;color:#fff;box-shadow:0 6px 18px #dc262645}
.auth-field{display:block;margin-bottom:15px}
.auth-label{display:block;font:700 10px var(--mono);letter-spacing:.22em;text-transform:uppercase;color:#8a8a8a;margin-bottom:8px}
.auth-input{position:relative;display:block}
.auth-input-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:#5f5f5f;pointer-events:none;display:flex}
.auth-input-icon .icon{width:18px;height:18px}
.auth-input input{width:100%;height:49px;background:#141414;border:1px solid #2b2b2b;border-radius:11px;color:#fff;font-size:14.5px;padding:0 46px 0 45px;outline:none;transition:border-color .15s,background .15s,box-shadow .15s}
.auth-input input::placeholder{color:#4f4f4f}
.auth-input input:focus{border-color:#dc2626;background:#181212;box-shadow:0 0 0 3.5px #dc262624}
.auth-input input:not(:placeholder-shown):invalid{border-color:#7f1d1d}
.auth-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:34px;height:34px;display:grid;place-items:center;border-radius:8px;color:#777}
.auth-eye:hover{color:#fff;background:#ffffff0d}
.auth-eye .icon{width:19px;height:19px}
.auth-strength{display:flex;align-items:center;gap:5px;margin:-7px 0 15px}
.auth-strength i{height:3px;flex:1;border-radius:3px;background:#232323;transition:background .25s}
.auth-strength.s1 i:nth-child(1){background:#dc2626}
.auth-strength.s2 i:nth-child(-n+2){background:#f59e0b}
.auth-strength.s3 i:nth-child(-n+3){background:#a3e635}
.auth-strength.s4 i{background:#22c55e}
.auth-strength-label{font:700 9px var(--mono);letter-spacing:.16em;color:#5f5f5f;min-width:54px;text-align:right;text-transform:uppercase}
.auth-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 20px}
.auth-check{position:relative;display:flex;align-items:center;gap:9px;font-size:12.5px;color:#999;cursor:pointer;user-select:none}
.auth-check input{position:absolute;opacity:0;pointer-events:none}
.auth-check i{width:17px;height:17px;border:1.5px solid #3a3a3a;border-radius:5px;background:#141414;display:grid;place-items:center;transition:.15s;flex-shrink:0}
.auth-check i:after{content:'';width:8px;height:4.5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) scale(.6);opacity:0;transition:.15s;margin-top:-2px}
.auth-check input:checked+i{background:#dc2626;border-color:#dc2626}
.auth-check input:checked+i:after{opacity:1;transform:rotate(-45deg) scale(1)}
.auth-check input:focus-visible+i{outline:2px solid #ef4444;outline-offset:2px}
.auth-check:hover i{border-color:#555}
.auth-forgot{font-size:12.5px;color:#8a8a8a;transition:color .15s}
.auth-forgot:hover{color:#ef4444}
.auth-submit{position:relative;width:100%;height:52px;border-radius:11px;border:1px solid #ef444455;background:linear-gradient(180deg,#f04343,#dc2626 60%,#c31c1c);color:#fff;font:800 14px Outfit,Arial,sans-serif;letter-spacing:.01em;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 12px 28px #dc26263d,4px 4px 0 #7f1d1d;transition:transform .12s,box-shadow .12s,filter .15s}
.auth-submit:hover{filter:brightness(1.07);transform:translate(-1px,-1px);box-shadow:0 14px 34px #dc262649,5px 5px 0 #7f1d1d}
.auth-submit:active{transform:translate(2px,2px);box-shadow:0 6px 16px #dc26262e,2px 2px 0 #7f1d1d}
.auth-submit .icon{width:18px;height:18px}
.auth-spinner{display:none;width:17px;height:17px;border:2px solid #ffffff55;border-top-color:#fff;border-radius:50%;animation:auth-spin .7s linear infinite}
.auth-submit.loading{pointer-events:none}
.auth-submit.loading .auth-spinner{display:inline-block}
.auth-submit.loading .icon{display:none}
@keyframes auth-spin{to{transform:rotate(1turn)}}
.auth-divider{display:flex;align-items:center;gap:14px;margin:22px 0}
.auth-divider i{height:1px;flex:1;background:#232323}
.auth-divider span{font:700 10px var(--mono);letter-spacing:.34em;color:#555}
.auth-social{display:grid;gap:10px}
.auth-social-btn{height:47px;display:flex;align-items:center;justify-content:center;gap:11px;background:#141414;border:1px solid #2a2a2a;border-radius:11px;color:#ddd;font-weight:650;font-size:13.5px;transition:.15s}
.auth-social-btn:hover{background:#1c1c1c;border-color:#3a3a3a;color:#fff;transform:translateY(-1px)}
.auth-social-badge{width:25px;height:25px;border-radius:7px;display:grid;place-items:center;font:800 10px var(--mono);color:#fff}
.auth-social-badge.al{background:#02a9ff;box-shadow:0 0 14px #02a9ff44}
.auth-social-badge.mn{background:#2e51a2;box-shadow:0 0 14px #2e51a244}
.auth-terms{font-size:11.5px;color:#666;line-height:1.6;margin:14px 0 0}
.auth-switch{margin-top:22px;text-align:center;font-size:13px;color:#888}
.auth-switch b{color:#ccc;font-weight:700}
.auth-switch a{color:#ef4444;font-weight:700}
.auth-switch a:hover{text-decoration:underline}
.auth-guest-link{display:block;text-align:center;margin-top:12px;font-size:12px;color:#666;transition:color .15s}
.auth-guest-link:hover{color:#fff}
.auth-note{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:20px;padding-top:16px;border-top:1px solid #1b1b1b;font:600 9.5px var(--mono);letter-spacing:.13em;color:#4d4d4d;text-transform:uppercase}
.auth-note .icon{width:13px;height:13px;color:#3d3d3d}
@media(max-width:767px){.auth-shell{padding:92px 14px 168px}.auth-body{padding:22px 20px 22px}.auth-title{font-size:25px}.auth-hero{height:128px}.auth-logo{width:142px}.auth-watermark{font-size:150px}.account-menu{right:12px;top:60px;width:calc(100vw - 24px);max-width:300px}}
/* ── Account security panel (profile, backed by SQLite) ───────────────── */
.security-panel{margin-top:20px;padding:26px;background:#0d0d0d;border:1px solid #242424;border-radius:12px}
.security-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}
.security-head>.icon{width:30px;height:30px;color:var(--red);flex-shrink:0;margin-top:2px}
.security-head h2{font-size:17px;letter-spacing:.2px}
.security-head p{color:#777;font-size:13px;margin-top:4px;max-width:520px}
.db-pill{margin-left:auto;font:600 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#f87171;background:rgba(220,38,38,.1);border:1px solid rgba(220,38,38,.25);padding:7px 11px;border-radius:999px;white-space:nowrap;flex-shrink:0}
.security-list{list-style:none;display:grid;gap:2px}
.security-list li{display:flex;align-items:center;gap:14px;padding:11px 10px;border-radius:8px;transition:background .15s}
.security-list li:hover{background:rgba(255,255,255,.04)}
.security-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 8px rgba(34,197,94,.5);flex-shrink:0}
.security-list strong{font-size:13.5px;font-weight:600;display:block}
.security-list small{color:#666;font-size:12px;display:block;margin-top:2px}
.security-ip{margin-left:auto;font:600 11px/1 var(--mono);color:#999;background:#1a1a1a;border:1px solid #262626;padding:6px 9px;border-radius:6px;white-space:nowrap}
.security-empty{color:#666;font-size:13px;padding:4px 2px}
@media(max-width:720px){.security-panel{padding:20px}.db-pill{display:none}.security-ip{font-size:10px;padding:5px 7px}}

/* ═══════════════════════════════════════════════════════════════════════
   KUROKO 「黑子」 PROFILE — dark lacquer + Chinese red & gold
   ═══════════════════════════════════════════════════════════════════════ */
.cn{font-family:'Noto Sans SC','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif}
.prof-shell{padding:14px 18px 110px;position:relative;max-width:1460px;margin:0 auto}
.prof-watermark{position:fixed;top:16vh;right:2vw;font-size:clamp(180px,26vw,420px);font-weight:900;font-family:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;color:#fff;opacity:.016;pointer-events:none;z-index:0;line-height:1;user-select:none}
/* ── Banner ── */
.prof-banner{position:relative;border:1px solid #1e1e1e;border-radius:18px;background:#050505;overflow:hidden;box-shadow:0 30px 80px #0009,0 0 0 1px #dc26261e inset}
.prof-bg{position:absolute;inset:0}
.prof-strips{display:flex;height:100%}
.prof-strips img{flex:1 1 0;min-width:0;height:100%;object-fit:cover;opacity:.9;filter:saturate(1.05) contrast(1.02)}
.prof-strips img:nth-child(odd){filter:saturate(1.1) brightness(.94)}
.prof-shade{position:absolute;inset:0;background:linear-gradient(90deg,#030303 30%,#030303cc 46%,#05050573 68%,#05050533 100%),linear-gradient(0deg,#030303f0 4%,#03030300 46%),radial-gradient(120% 90% at 100% 0%,#dc26261f,#0000 55%)}
.prof-vert{position:absolute;top:22px;right:20px;writing-mode:vertical-rl;font:600 13px/1 'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;letter-spacing:.5em;color:#ffffff8f;text-shadow:0 1px 12px #000;z-index:2}
.prof-vert::before,.prof-vert::after{content:'';position:absolute;right:50%;width:1px;height:26px;background:linear-gradient(#dc262600,#ef4444cc)}
.prof-vert::before{top:-30px}.prof-vert::after{bottom:-30px;transform:rotate(180deg)}
.prof-seal{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:9px;background:linear-gradient(160deg,#ef4444,#b91c1c);color:#fff;font-weight:800;font-size:15px;letter-spacing:3px;text-indent:3px;line-height:1;box-shadow:0 5px 18px #dc26265c,0 0 0 1px #ffffff26 inset,0 0 0 3px #b91c1c33;transform:rotate(-6deg);flex-shrink:0}
.prof-banner-in{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:26px;padding:210px 26px 24px}
.prof-id{display:flex;gap:20px;align-items:flex-start;min-width:0}
.prof-avatar{position:relative;display:grid;place-items:center;width:96px;height:96px;border-radius:50%;flex-shrink:0;background:linear-gradient(150deg,#ef4444,#7f1d1d 60%,#1c0505);font:800 34px/1 var(--mono);color:#fff;box-shadow:0 10px 34px #dc26264d,0 0 0 1px #ffffff1f inset}
.prof-avatar-ring{position:absolute;inset:-5px;border-radius:50%;border:1.5px solid #dc262680;border-top-color:#f59e0b;animation:profspin 9s linear infinite}
@keyframes profspin{to{transform:rotate(360deg)}}
.prof-id-main{min-width:0}
.prof-name-row{display:flex;align-items:center;gap:12px}
.prof-name-row h1{font-size:31px;font-weight:800;letter-spacing:.2px;text-shadow:0 2px 24px #000}
.prof-edit{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;color:#8a8a8a;background:#ffffff10;border:1px solid #ffffff14;transition:.18s}
.prof-edit:hover{color:#fff;background:#dc262633;border-color:#dc262666;transform:translateY(-1px)}
.prof-edit .icon{width:15px;height:15px}
.prof-meta{margin-top:5px;color:#b9b3b3;font-size:13.5px;font-weight:600}
.prof-meta i{color:#ef4444;font-style:normal;margin:0 6px}
.prof-meta b{color:#f59e0bcc;font-weight:700;font-size:11.5px;margin-left:5px;letter-spacing:.18em}
.prof-chips{display:flex;gap:9px;flex-wrap:wrap;margin-top:11px}
.prof-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;background:#0b0b0bd9;border:1px solid #2a2a2a;font:600 12px var(--mono);color:#e8e8e8;backdrop-filter:blur(6px)}
.prof-chip .icon{width:15px;height:15px;color:#ef4444}
.prof-chip b{color:#f59e0b;font-weight:700;font-size:10.5px;letter-spacing:.14em}
.prof-bio{margin-top:12px;max-width:640px;color:#c9c4c4;font-size:13.5px;line-height:1.65}
.prof-side{display:flex;flex-direction:column;align-items:flex-end;gap:14px;flex-shrink:0}
.prof-share{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;background:#fff;color:#0a0a0a;font-weight:700;font-size:13px;transition:.18s;box-shadow:0 8px 26px #0008}
.prof-share:hover{transform:translateY(-2px);box-shadow:0 12px 32px #dc26265e}
.prof-share .icon{width:16px;height:16px}
.prof-share b{color:#b91c1c;font-size:11px;letter-spacing:.14em}
.prof-level-card{display:flex;align-items:center;gap:15px;padding:16px 20px;border-radius:16px;background:#0a0a0ad9;border:1px solid #2c2c2c;backdrop-filter:blur(10px);box-shadow:0 14px 44px #000a,0 0 0 1px #dc26261a inset}
.prof-lv-ring{position:relative;display:grid;place-items:center;width:58px;height:58px}
.prof-lv-ring b{position:absolute;font:800 17px var(--mono);color:#fff}
.prof-lv-num strong{font-size:16.5px;font-weight:800;display:flex;align-items:center;gap:8px}
.prof-lv-num strong b{font-size:11px;color:#f59e0b;letter-spacing:.2em;font-weight:700}
.prof-lv-num span{display:block;margin-top:3px;font:600 12.5px var(--mono);color:#a8a8a8}
.prof-lv-num small{display:block;margin-top:6px;color:#8f8f8f;font-size:12px}
.prof-lv-num small b{color:#fff}
.prof-lv-num small em{font-style:normal;color:#f59e0b99;font-size:11px;margin-left:6px;letter-spacing:.1em}
/* bio editor */
.prof-bio-form{position:relative;z-index:3;margin-top:14px;padding:18px;border-radius:14px;background:#0c0c0c;border:1px solid #dc26264d;box-shadow:0 18px 50px #000a}
.prof-bio-form label{display:block;font:600 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#8d8d8d}
.prof-bio-form input,.prof-bio-form textarea{width:100%;margin:7px 0 14px;padding:11px 13px;border-radius:9px;background:#050505;border:1px solid #262626;color:#fff;font:600 13.5px Outfit,sans-serif;resize:vertical;transition:border-color .15s}
.prof-bio-form input:focus,.prof-bio-form textarea:focus{border-color:#dc2626;outline:none;box-shadow:0 0 0 3px #dc262622}
.prof-bio-actions{display:flex;justify-content:flex-end;gap:10px}
.prof-btn{padding:9px 18px;border-radius:9px;font-weight:700;font-size:12.5px;transition:.16s}
.prof-btn.ghost{color:#aaa;border:1px solid #2c2c2c}
.prof-btn.ghost:hover{color:#fff;border-color:#4a4a4a}
.prof-btn.solid{background:linear-gradient(135deg,#ef4444,#b91c1c);color:#fff;box-shadow:0 6px 20px #dc26264d}
.prof-btn.solid:hover{transform:translateY(-1px);box-shadow:0 9px 26px #dc262666}
/* ── Tabs ── */
.prof-tabs{position:relative;z-index:2;display:inline-flex;flex-wrap:wrap;gap:4px;margin:24px 0 26px;padding:6px;border-radius:999px;background:#0d0d0dcc;border:1px solid #1f1f1f;backdrop-filter:blur(8px)}
.prof-tab-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 17px;border-radius:999px;font-weight:700;font-size:13.5px;color:#969696;transition:.16s}
.prof-tab-btn .icon{width:16px;height:16px}
.prof-tab-btn b{font-size:10.5px;letter-spacing:.16em;color:#5c5c5c;font-weight:700;transition:.16s}
.prof-tab-btn:hover{color:#ddd;background:#ffffff08}
.prof-tab-btn.active{background:linear-gradient(135deg,#ef4444,#991b1b);color:#fff;box-shadow:0 6px 22px #dc262656}
.prof-tab-btn.active b{color:#fecaca}
/* ── Panels ── */
.prof-tab{position:relative;z-index:1;display:grid;gap:18px}
.prof-panel{position:relative;padding:24px 26px;background:#0c0c0cf2;border:1px solid #202020;border-radius:16px;box-shadow:0 16px 50px #0006;overflow:hidden}
.prof-panel::before{content:'';position:absolute;top:0;left:0;width:42px;height:42px;border-top:1.5px solid #dc262666;border-left:1.5px solid #dc262666;border-top-left-radius:16px;pointer-events:none}
.prof-panel::after{content:'';position:absolute;bottom:0;right:0;width:42px;height:42px;border-bottom:1.5px solid #dc262626;border-right:1.5px solid #dc262626;border-bottom-right-radius:16px;pointer-events:none}
.prof-panel h2{display:flex;align-items:center;gap:11px;font-size:16.5px;font-weight:800;letter-spacing:.2px}
.prof-panel h2 b{font-size:11px;letter-spacing:.22em;color:#f59e0b;font-weight:700;margin-left:2px}
.prof-ico{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#dc26261a;border:1px solid #dc26263d;color:#ef4444;flex-shrink:0}
.prof-ico .icon{width:16px;height:16px}
.prof-ico.bolt{background:#f59e0b1a;border-color:#f59e0b3d;color:#f59e0b}
.prof-ico.medal{background:#22d3ee14;border-color:#22d3ee38;color:#22d3ee}
.prof-ico.sparkle{background:#a855f71a;border-color:#a855f738;color:#c084fc}
.prof-ico.star{background:#eab30817;border-color:#eab30833;color:#facc15}
.prof-ico.calendar{background:#22c55e14;border-color:#22c55e33;color:#4ade80}
.prof-ico.flame{background:#dc26261a;border-color:#dc26263d;color:#ef4444}
.prof-desc{margin-top:6px;color:#777;font-size:12.5px}
.prof-desc .cn{color:#8f6a2e;color:#a17f36;font-size:11.5px;margin-left:6px;letter-spacing:.06em}
.prof-foot{margin-top:18px;padding-top:14px;border-top:1px solid #1a1a1a;color:#8b8b8b;font-size:12.5px}
.prof-foot .cn{color:#a17f36;font-size:11.5px;margin-left:6px}
.prof-big{margin-top:14px;font:800 40px/1.1 var(--mono);color:#ef4444;text-shadow:0 0 34px #dc262640}
.prof-big small{font:600 14px Outfit,sans-serif;color:#9a9a9a;margin-left:4px}
.prof-big.gold{color:#f59e0b;text-shadow:0 0 34px #f59e0b40}
.prof-big.jade{color:#34d399;text-shadow:0 0 34px #34d39933}
.prof-sub{margin-top:7px;color:#8d8d8d;font-size:12.8px}
.prof-sub b{color:#e6e6e6}
.prof-sub .cn{color:#a17f36;font-size:11.5px;margin-left:4px}
/* cards3 + grid2 */
.prof-cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.prof-grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
/* streak dots */
.prof-dots{display:flex;justify-content:space-between;margin-top:22px;padding-top:18px;border-top:1px solid #1a1a1a}
.prof-dot{display:grid;justify-items:center;gap:7px;font:600 10.5px var(--mono);color:#6f6f6f}
.prof-dot i{width:30px;height:30px;border-radius:50%;background:#161616;border:1px solid #242424;transition:.2s}
.prof-dot.on i{background:linear-gradient(150deg,#ef4444,#991b1b);border-color:#ef4444;box-shadow:0 0 14px #dc26265c}
.prof-dot.today{color:#f59e0b}
.prof-dot.today i{border-color:#f59e0b;box-shadow:0 0 12px #f59e0b33}
/* tracks */
.prof-track{display:block;position:relative;height:9px;border-radius:999px;background:#1a1a1a;margin-top:9px;overflow:hidden}
.prof-track i{position:absolute;inset:0 auto 0 0;border-radius:999px;background:linear-gradient(90deg,#ef4444,#f59e0b);box-shadow:0 0 12px #dc26265c;animation:profgrow 1s cubic-bezier(.2,.8,.2,1) backwards}
.prof-track.cyan i{background:linear-gradient(90deg,#0891b2,#22d3ee);box-shadow:0 0 12px #22d3ee44}
.prof-track.slim{height:6px;margin-top:0}
@keyframes profgrow{from{width:0!important}}
.prof-track-row{display:flex;justify-content:space-between;margin-top:20px;font:600 11px var(--mono);color:#8a8a8a;letter-spacing:.04em}
.prof-track-row em{font-style:normal;color:#22d3ee}
/* bubbles */
.prof-bubbles{position:relative;height:330px;margin-top:10px}
.pb{position:absolute;display:grid;place-items:center;align-content:center;border-radius:50%;color:#fff;text-align:center;background:radial-gradient(circle at 32% 28%,var(--c2),var(--c1) 68%);box-shadow:0 18px 50px #0009,inset 0 -8px 26px #00000042,inset 0 2px 10px #ffffff2e;animation:proffloat 6s ease-in-out infinite}
.pb b{font:800 19px var(--mono);text-shadow:0 2px 10px #0008}
.pb small{font-size:11.5px;opacity:.92;margin-top:2px;letter-spacing:.14em}
@keyframes proffloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
/* library donut */
.prof-lib{display:flex;align-items:center;gap:26px;margin-top:14px;flex-wrap:wrap}
.prof-donut{width:225px;height:225px;flex-shrink:0}
.prof-donut-num{font:800 26px var(--mono);fill:#fff}
.prof-donut-cn{font-size:11px;fill:#8a8a8a;letter-spacing:3px}
.prof-legend{list-style:none;display:grid;gap:9px;flex:1;min-width:220px}
.prof-legend li{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600}
.prof-legend i{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.prof-legend span{color:#cfcfcf}
.prof-legend em{font-style:normal;color:#a17f36;font-size:11px;margin-left:4px}
.prof-legend small{margin-left:auto;color:#777;font:600 12px var(--mono)}
.prof-legend b{font:700 13.5px var(--mono);width:44px;text-align:right}
/* monthly */
.prof-monthly{width:100%;height:auto;margin-top:12px}
.prof-mp{font:600 11px var(--mono);fill:#a3a3a3}
.prof-mp.peak{font-weight:800;font-size:12.5px;fill:#f59e0b}
.prof-mm{font:600 10.5px var(--mono);fill:#5f5f5f;text-transform:uppercase}
/* ratings */
.prof-avg{position:absolute;top:24px;right:26px;display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;background:#f59e0b12;border:1px solid #f59e0b38;color:#fbbf24;font:800 14px var(--mono)}
.prof-avg b{font-size:11px;color:#a17f36;letter-spacing:.1em}
.prof-ratings{display:flex;gap:10px;align-items:flex-end;margin-top:26px;height:190px}
.pr-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;height:100%}
.pr-col small{font:600 10.5px var(--mono);color:#8d8d8d}
.pr-col i{width:100%;max-width:44px;border-radius:7px 7px 3px 3px;animation:profup .8s cubic-bezier(.2,.8,.2,1) backwards}
.pr-col i.low{background:linear-gradient(180deg,#b91c1c,#7f1d1d)}
.pr-col i.mid{background:linear-gradient(180deg,#ef4444,#b91c1c)}
.pr-col i.gold{background:linear-gradient(180deg,#f59e0b,#b45309)}
.pr-col i.hi{background:linear-gradient(180deg,#facc15,#ca8a04)}
.pr-col i.top{background:linear-gradient(180deg,#4ade80,#16a34a)}
.pr-col em{font:600 11px var(--mono);font-style:normal;color:#6b6b6b}
@keyframes profup{from{height:0!important}}
/* watcher types */
.prof-type-row{display:grid;grid-template-columns:repeat(5,1fr);gap:13px;margin-top:18px}
.prof-type{display:flex;gap:12px;align-items:flex-start;padding:15px;border-radius:13px;background:#0a0a0a;border:1px solid #232323;transition:.18s}
.prof-type:hover{transform:translateY(-3px)}
.prof-type i{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;flex-shrink:0}
.prof-type i .icon{width:17px;height:17px}
.prof-type strong{display:block;font-size:13.5px;font-weight:700}
.prof-type b{display:block;font-size:10px;letter-spacing:.18em;color:#a17f36;margin-top:1px}
.prof-type small{display:block;margin-top:5px;color:#8a8a8a;font-size:11.5px;line-height:1.45}
.prof-type.gold{border-color:#f59e0b3d}.prof-type.gold i{background:#f59e0b1f;color:#fbbf24}
.prof-type.cyan{border-color:#22d3ee33}.prof-type.cyan i{background:#22d3ee17;color:#22d3ee}
.prof-type.jade{border-color:#34d39933}.prof-type.jade i{background:#34d39914;color:#34d399}
.prof-type.orange{border-color:#fb923c33}.prof-type.orange i{background:#fb923c17;color:#fb923c}
.prof-type.red{border-color:#ef444438}.prof-type.red i{background:#ef444417;color:#ef4444}
/* most binged */
.prof-binged-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 26px;margin-top:18px}
.prof-binged-row{display:flex;gap:13px;align-items:center;padding:10px;border-radius:12px;transition:.16s;border:1px solid transparent}
.prof-binged-row:hover{background:#ffffff05;border-color:#262626;transform:translateX(3px)}
.prof-binged-row .rank{font:800 15px var(--mono);color:#6d6d6d;width:18px;text-align:center;flex-shrink:0}
.prof-binged-row img{width:52px;height:52px;border-radius:9px;object-fit:cover;flex-shrink:0;background:#141414;border:1px solid #242424}
.pb-info{min-width:0;flex:1}
.pb-info strong{display:block;font-size:13.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pb-info small{display:block;margin-top:5px;color:#8a8a8a;font-size:11.5px}
.pb-info small b{color:#f59e0b;font-size:10px;margin-left:4px;letter-spacing:.14em}
/* library tab */
.prof-collections{margin-top:16px}
.prof-genre-bars{display:grid;gap:15px;margin-top:18px}
.pg-row{display:grid;grid-template-columns:130px 1fr 48px;align-items:center;gap:14px}
.pg-name{font-size:13px;font-weight:700;color:#d6d6d6}
.pg-name em{font-style:normal;color:#a17f36;font-size:11px;margin-left:5px}
.pg-row b{font:700 13px var(--mono);text-align:right;color:#f59e0b}
/* achievements */
.prof-ach-head{display:flex;gap:22px;align-items:center}
.prof-ach-trophy{display:grid;place-items:center;width:74px;height:74px;border-radius:18px;background:linear-gradient(150deg,#f59e0b2e,#dc26261f);border:1px solid #f59e0b47;color:#fbbf24;flex-shrink:0;box-shadow:0 0 40px #f59e0b1f}
.prof-ach-trophy .icon{width:34px;height:34px}
.prof-ach-sum{flex:1}
.prof-ach-sum .prof-track{margin-top:12px}
.prof-ach-sum .prof-sub{margin-top:12px}
.prof-ach-sum em{font-style:normal;font-weight:700}
.prof-ach-sum .t-bronze{color:#d97706}.prof-ach-sum .t-silver{color:#9ca3af}.prof-ach-sum .t-gold{color:#eab308}.prof-ach-sum .t-platinum{color:#22d3ee}
.prof-ach-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.prof-ach{position:relative;padding:19px;border-radius:14px;background:#0b0b0b;border:1px solid #222;transition:.18s}
.prof-ach:hover{transform:translateY(-3px);border-color:#383838}
.prof-ach header{display:flex;align-items:center;gap:9px;margin-bottom:13px}
.prof-ach-tier{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;font-size:13px;font-weight:800}
.prof-ach-tier-name{font:600 10px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#7c7c7c}
.prof-ach-check,.prof-ach-lock{margin-left:auto;display:grid;place-items:center;width:22px;height:22px;border-radius:50%}
.prof-ach-check{background:#22c55e1f;color:#4ade80}
.prof-ach-check .icon,.prof-ach-lock .icon{width:13px;height:13px}
.prof-ach-lock{background:#ffffff0d;color:#5f5f5f}
.prof-ach h3{font-size:15px;font-weight:800}
.prof-ach h3 b{font-size:10.5px;letter-spacing:.16em;color:#a17f36;margin-left:5px}
.prof-ach p{margin:6px 0 13px;color:#858585;font-size:12.3px;line-height:1.55}
.prof-ach footer{margin-top:11px;font:600 11.5px var(--mono);color:#7d7d7d}
.prof-ach footer .ok{color:#4ade80}
.prof-ach.t-bronze .prof-ach-tier{background:#b4530926;color:#d97706;border:1px solid #b4530947}
.prof-ach.t-silver .prof-ach-tier{background:#9ca3af1f;color:#cbd5e1;border:1px solid #9ca3af3d}
.prof-ach.t-gold .prof-ach-tier{background:#eab3081f;color:#facc15;border:1px solid #eab3083d}
.prof-ach.t-platinum .prof-ach-tier{background:#22d3ee14;color:#22d3ee;border:1px solid #22d3ee38}
.prof-ach.unlocked{border-color:#2c2c2c;box-shadow:0 10px 30px #0005}
.prof-ach.unlocked.t-gold,.prof-ach.unlocked.t-platinum{background:linear-gradient(180deg,#121212,#0b0b0b)}
.prof-ach.locked{opacity:.62;filter:saturate(.6)}
/* activity */
.prof-act-head{display:flex;align-items:center;justify-content:space-between;gap:14px}
.prof-ranges{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:#131313;border:1px solid #232323}
.prof-ranges button{padding:7px 14px;border-radius:999px;font:700 11.5px var(--mono);color:#8a8a8a;transition:.15s}
.prof-ranges button:hover{color:#fff}
.prof-ranges button.active{background:#fff;color:#0a0a0a}
.prof-act-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:18px 0 22px}
.pac{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:13px;background:#0a0a0a;border:1px solid #232323}
.pac .icon{width:20px;height:20px;flex-shrink:0}
.pac.tv .icon{color:#ef4444}.pac.cal .icon{color:#4ade80}.pac.flame .icon{color:#fb923c}.pac.trophy .icon{color:#fbbf24}
.pac small{display:block;color:#7c7c7c;font-size:11px;font-weight:600}
.pac b{display:block;margin-top:3px;font:800 19px var(--mono);color:#fff}
.pac.flame b{color:#fb923c}.pac.cal b{color:#4ade80}.pac.trophy b{color:#fbbf24}
.prof-heat-wrap{display:flex;gap:12px}
.prof-heat-days{display:grid;grid-template-rows:repeat(7,14px);gap:3px;margin-top:26px;font:600 9.5px var(--mono);color:#6b6b6b}
.prof-heat-days i{height:14px;line-height:14px;text-align:right;font-style:normal;padding-right:2px}
.prof-heat-days i:nth-child(2){grid-row:3}.prof-heat-days i:nth-child(3){grid-row:5}
.prof-heat-scroll{flex:1;min-width:0;overflow-x:auto;padding-bottom:6px}
.prof-heat-months{position:relative;height:20px;font:600 10.5px var(--mono);color:#7a7a7a}
.prof-heat-months i{position:absolute;top:2px;font-style:normal}
.prof-heatmap{display:grid;grid-auto-flow:column;grid-template-rows:repeat(7,14px);grid-auto-columns:14px;gap:3px}
.prof-heatmap i{width:14px;height:14px;border-radius:4px;background:#151515;transition:transform .12s}
.prof-heatmap i:hover{transform:scale(1.28);outline:1.5px solid #ffffff5c;z-index:2}
.prof-heat-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:18px;padding-top:16px;border-top:1px solid #1a1a1a}
.prof-heat-foot p{color:#858585;font-size:12.3px;max-width:720px}
.prof-heat-foot b{color:#e8e8e8}
.prof-heat-foot .cn{color:#a17f36;font-size:11.5px;margin-left:5px}
.prof-heat-legend{display:inline-flex;align-items:center;gap:5px;font:600 11px var(--mono);color:#7a7a7a;white-space:nowrap}
.prof-heat-legend i{width:12px;height:12px;border-radius:3.5px;display:inline-block}
/* time of day + week */
.prof-pill{padding:8px 15px;border-radius:999px;background:#f59e0b10;border:1px solid #f59e0b40;color:#fbbf24;font-weight:700;font-size:12px;white-space:nowrap}
.prof-pill b{color:#a17f36;font-size:10.5px;letter-spacing:.14em;margin-left:4px}
.prof-hours{display:flex;gap:4px;align-items:flex-end;height:190px;margin-top:22px}
.ph-col{flex:1;display:flex;align-items:flex-end;height:100%}
.ph-col i{width:100%;border-radius:5px 5px 2px 2px;animation:profup .7s cubic-bezier(.2,.8,.2,1) backwards}
.ph-col.day i{background:linear-gradient(180deg,#f59e0b,#b45309)}
.ph-col.night i{background:linear-gradient(180deg,#7f1d1d,#450a0a)}
.ph-col.peak i{background:linear-gradient(180deg,#fbbf24,#ef4444);box-shadow:0 0 18px #f59e0b66}
.prof-hours-x{display:flex;justify-content:space-between;margin-top:10px;font:600 10.5px var(--mono);color:#6b6b6b}
.prof-week{display:flex;gap:10px;align-items:flex-end;height:210px;margin-top:22px}
.pw-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:7px;height:100%}
.pw-col small{font:600 11px var(--mono);color:#9a9a9a}
.pw-col i{width:100%;border-radius:9px;background:linear-gradient(180deg,#1d2b33,#131c21);animation:profup .8s cubic-bezier(.2,.8,.2,1) backwards}
.pw-col.busy small{color:#fff;font-weight:800}
.pw-col.busy i{background:linear-gradient(180deg,#ef4444,#991b1b);box-shadow:0 0 24px #dc26265c}
.pw-col em{font:600 11.5px var(--mono);font-style:normal;color:#8a8a8a}
.pw-col.busy em{color:#f59e0b;font-weight:700}
/* responsive */
@media(max-width:1180px){.prof-type-row{grid-template-columns:repeat(3,1fr)}.prof-cards3{grid-template-columns:1fr}.prof-binged-grid{grid-template-columns:1fr 1fr}}
@media(max-width:860px){.prof-grid2{grid-template-columns:1fr}.prof-banner-in{flex-direction:column;align-items:stretch;padding:190px 18px 20px}.prof-side{flex-direction:row;justify-content:space-between;align-items:center}.prof-id{flex-direction:column}.prof-binged-grid{grid-template-columns:1fr}.prof-ach-grid{grid-template-columns:1fr 1fr}.prof-act-chips{grid-template-columns:1fr 1fr}.prof-vert,.prof-seal{display:none}.prof-watermark{display:none}}
@media(max-width:600px){.prof-shell{padding:10px 10px 90px}.prof-type-row{grid-template-columns:1fr 1fr}.prof-ach-grid{grid-template-columns:1fr}.prof-act-chips{grid-template-columns:1fr 1fr}.prof-name-row h1{font-size:25px}.prof-side{flex-direction:column;align-items:stretch}.prof-share{justify-content:center}.prof-heat-foot{flex-direction:column;align-items:flex-start}}

/* ═══ Profile — honest empty states (真实空态) ═══ */
.prof-empty{position:relative;border:1px dashed #2e2e2e;border-radius:14px;padding:34px 26px 30px;text-align:center;overflow:hidden;background:linear-gradient(180deg,#0b0b0b,#0e0b0b)}
.prof-empty-glyph{position:absolute;top:-26px;right:6px;font-size:120px;font-weight:900;color:#dc2626;opacity:.05;line-height:1;pointer-events:none;user-select:none}
.prof-empty h3{font-size:17px;letter-spacing:-.3px;margin-bottom:8px;position:relative}
.prof-empty h3 b{display:block;margin:2px 0 0;font-size:12px}
.prof-empty p{color:#8a8a8a;font-size:13px;line-height:1.65;max-width:420px;margin:0 auto 18px;position:relative}
.prof-empty-cta{position:relative;display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 18px;border-radius:8px;background:#dc2626;color:#fff;font-weight:700;font-size:12.5px;letter-spacing:.02em;transition:background .15s;box-shadow:0 6px 20px #dc26263d}
.prof-empty-cta:hover{background:#ef3333}
.prof-empty-cta .icon{width:15px;height:15px}
/* ═══ Library share bars (real lists) ═══ */
.plib{display:flex;flex-direction:column;gap:13px;margin-top:16px}
.plib-row{display:grid;grid-template-columns:14px 150px 1fr 44px;align-items:center;gap:13px}
.plib-dot{width:9px;height:9px;border-radius:50%;background:var(--c,#ef4444);box-shadow:0 0 9px var(--c,#ef4444);justify-self:center}
.plib-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plib-name em{font-style:normal;color:#8f6a2e;font-size:11px;margin-left:5px}
.plib-row .prof-track{margin-top:0}
.plib-row .prof-track i{background:var(--c,#ef4444);box-shadow:0 0 10px #0006}
.plib-n{font:750 14px var(--mono);text-align:right;color:#ddd}
/* ═══ Details-page rating widget (真实评分) ═══ */
.rate-widget{margin-top:22px;padding:18px 20px;border:1px solid #262626;border-radius:13px;background:linear-gradient(135deg,#101010,#120c0c)}
.rate-head{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:13px}
.rate-head strong{font-size:14.5px;letter-spacing:-.2px}
.rate-agg{font:600 12px var(--mono);color:#9c8460}
.rate-stars{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.rate-star{display:grid;place-items:center;width:33px;height:33px;border-radius:8px;color:#4a4a4a;transition:transform .12s,color .12s,background .12s}
.rate-star .icon{width:19px;height:19px}
.rate-star:hover{color:#f59e0b;background:#f59e0b14;transform:translateY(-2px) scale(1.08)}
.rate-star.on{color:#f59e0b;filter:drop-shadow(0 0 7px #f59e0b66)}
.rate-star:disabled{opacity:.55;cursor:wait}
.rate-yours{margin-left:11px;font-size:12px;color:#a17f36;letter-spacing:.06em}
.rate-signin{margin:2px 0 0;color:#8a8a8a;font-size:13px}
.rate-signin a{color:#ef4444;font-weight:650;border-bottom:1px solid #ef44444d}
@media(max-width:600px){.rate-star{width:29px;height:29px}.plib-row{grid-template-columns:12px 108px 1fr 40px;gap:9px}}
/* ═══════════════ Medal system 成就勋章 — hand-forged, all real counters ═══════════════ */
.oblique{font-style:italic;font-weight:500;letter-spacing:.03em;color:#9a9a9a}
.medal-h2{display:flex;align-items:baseline;gap:10px;font-size:18px;font-weight:800;letter-spacing:-.2px}
.medal-h2 em{font-size:12.5px;font-weight:500}
.medal-h2::after{content:'';flex:0 0 34px;height:3px;margin-left:4px;border-radius:2px;background:linear-gradient(90deg,#dc2626,#dc262600);transform:translateY(-3px)}
.medal-xp-chip{display:inline-block;margin-left:8px;padding:3px 8px;border-radius:5px;font:700 10px/1 var(--mono);letter-spacing:.08em;color:#fbbf24;background:#f59e0b14;border:1px solid #f59e0b33;white-space:nowrap}
/* hero */
.medal-hero{position:relative;display:grid;grid-template-columns:1.5fr .9fr;gap:26px;padding:26px 28px;background:linear-gradient(160deg,#101010,#0a0a0a 62%,#0d0808);border:1px solid #232323;border-radius:16px;overflow:hidden;margin-bottom:15px}
.medal-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(520px 190px at 88% -12%,#dc262617,transparent 62%);pointer-events:none}
.medal-hero-head{display:flex;align-items:flex-start;gap:14px}
.medal-hero-ico{display:grid;place-items:center;width:56px;height:56px;border-radius:15px;background:linear-gradient(150deg,#f59e0b2b,#dc26261f);border:1px solid #f59e0b45;color:#fbbf24;box-shadow:0 0 34px #f59e0b1c;flex-shrink:0}
.medal-hero-ico .icon{width:27px;height:27px}
.medal-hero h2{font-size:20px;font-weight:800;letter-spacing:.5px}
.medal-hero h2 em{margin-left:8px;font-size:13px}
.medal-hero-note{color:#8a8a8a;font-size:12.3px;margin-top:5px}
.medal-hero-note em{color:#7c7c7c;font-size:11.5px;margin-left:4px}
.medal-hero-seal{position:absolute;top:18px;right:24px;display:grid;place-items:center;width:40px;height:40px;border:2px solid #dc2626;border-radius:9px;color:#dc2626;font-size:19px;font-weight:900;transform:rotate(6deg);opacity:.5}
.medal-hero-big{margin-top:18px;font-weight:800;line-height:1}
.medal-hero-big b{font-size:44px;background:linear-gradient(120deg,#fbbf24,#ef4444);-webkit-background-clip:text;background-clip:text;color:transparent}
.medal-hero-big small{margin-left:9px;font-size:14px;color:#9a9a9a;font-weight:650}
.medal-hero-big em{margin-left:10px;font-size:12px}
.medal-hero .prof-track{margin-top:13px}
.medal-hero-xp{margin-top:13px;color:#a9a9a9;font-size:13px}
.medal-hero-xp b{color:#fbbf24;font-family:var(--mono);font-size:14px}
.medal-hero-xp i{font-style:normal;color:#3a3a3a;margin:0 7px}
.medal-hero-xp em{margin-left:7px;font-size:11.5px;color:#777}
/* medal discs */
.medal-disc{position:relative;display:grid;place-items:center;width:50px;height:50px;border-radius:50%;flex-shrink:0;font-weight:900}
.medal-disc i{font-style:normal;font-size:17px}
.medal-disc .icon{position:absolute;right:-4px;bottom:-3px;width:19px;height:19px;color:#0a0a0a;background:#4ade80;border-radius:50%;padding:2px;box-shadow:0 0 0 2.5px #0a0a0a}
.medal-disc.bronze{background:radial-gradient(circle at 32% 28%,#f3c08b,#c274314f 68%),#1c1310;color:#e8a668;border:1.5px solid #b06a33;box-shadow:inset 0 0 12px #00000088,0 0 14px #b4530930}
.medal-disc.silver{background:radial-gradient(circle at 32% 28%,#f4f6f9,#9ca3af4d 68%),#16181b;color:#dbe3ec;border:1.5px solid #8b93a1;box-shadow:inset 0 0 12px #00000080,0 0 14px #9ca3af2b}
.medal-disc.gold{background:radial-gradient(circle at 32% 28%,#ffe9a8,#d19d2a52 68%),#1b1508;color:#fbd046;border:1.5px solid #c29425;box-shadow:inset 0 0 12px #00000085,0 0 16px #eab30838}
.medal-disc.platinum{background:radial-gradient(circle at 32% 28%,#d9fbff,#3fb9c955 68%),#0a1618;color:#7fe3f2;border:1.5px solid #2aa8bd;box-shadow:inset 0 0 12px #00000085,0 0 16px #22d3ee33}
.medal-disc.ghost,.medal-disc.locked-dim{background:#101010;color:#3d3d3d;border:1.5px dashed #333;box-shadow:none}
.medal-disc.ghost{transform:scale(.92)}
/* hero recent side */
.medal-hero-side{border-left:1px solid #222;padding-left:26px;display:flex;flex-direction:column;justify-content:center}
.medal-hero-side h3{font-size:13px;font-weight:750;color:#c9c9c9;letter-spacing:.5px}
.medal-hero-side h3 em{margin-left:6px;font-size:11px;color:#8a8a8a}
.medal-recent-row{display:flex;gap:14px;margin-top:13px}
.medal-recent-note{margin-top:13px;font-size:12px;color:#8f8f8f}
.medal-recent-note b{color:#e6e6e6}
.medal-recent-note em{color:#777;font-size:11px;margin-left:4px}
/* filter legend */
.medal-filters{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:15px}
.medal-filters button{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:8px;background:#0d0d0d;border:1px solid #242424;color:#b9b9b9;font-size:12.5px;font-weight:650;transition:.15s}
.medal-filters button em{color:#8a8a8a;font-size:11px}
.medal-filters button b{font:750 11.5px var(--mono);color:#e6e6e6;background:#1c1c1c;border:1px solid #2b2b2b;border-radius:5px;padding:2px 7px}
.medal-filters button i{width:8px;height:8px;border-radius:50%;background:#555;box-shadow:0 0 7px #555}
.medal-filters button[data-mfilter=earned] i{background:#4ade80;box-shadow:0 0 7px #4ade8088}
.medal-filters button[data-mfilter=progress] i{background:#f59e0b;box-shadow:0 0 7px #f59e0b88}
.medal-filters button[data-mfilter=locked] i{background:#565656;box-shadow:0 0 7px #56565688}
.medal-filters button:hover{border-color:#3a3a3a;color:#fff}
.medal-filters button.off{opacity:.42}
.medal-filters button.off i{background:#333!important;box-shadow:none!important}
/* up next */
.medal-upnext{margin-bottom:16px}
.medal-upnext-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:14px}
.medal-next{display:flex;align-items:center;gap:15px;padding:17px 18px;background:#0b0b0b;border:1px solid #232323;border-radius:13px;transition:.18s}
.medal-next:hover{transform:translateY(-2px);border-color:#3a3a3a}
.medal-next-info{flex:1;min-width:0}
.medal-next-info h3{font-size:14.5px;font-weight:800}
.medal-next-info h3 em{margin-left:6px;font-size:11.5px}
.medal-next-info p{margin:5px 0 9px;color:#8d8d8d;font-size:12px;line-height:1.5}
.medal-next-info p b{color:#f59e0b;font-weight:750}
.medal-next-side{text-align:right;flex-shrink:0}
.medal-next-side b{display:block;font:800 21px var(--mono);color:#ef4444}
.medal-next.t-gold .medal-next-side b,.medal-next.t-gold .medal-next-side ~ *{color:#fbd046}
.medal-next .medal-xp-chip{margin:8px 0 0}
/* earned row */
.medal-earned{margin-bottom:16px}
.medal-earned-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:12px;margin-top:14px}
.medal-earned-item{position:relative;padding:17px 12px 13px;text-align:center;background:linear-gradient(180deg,#101010,#0b0b0b);border:1px solid #262626;border-radius:13px;transition:.18s}
.medal-earned-item:hover{transform:translateY(-3px);border-color:#3c3c3c}
.medal-earned-item .medal-disc{margin:0 auto}
.medal-earned-item h3{margin-top:11px;font-size:13.5px;font-weight:800}
.medal-earned-item em{display:block;margin-top:2px;font-size:10.5px}
.medal-earned-item time{display:block;margin-top:7px;font:600 10px var(--mono);color:#6f6f6f;letter-spacing:.05em}
/* full grid */
.medal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.medal{position:relative;display:flex;gap:15px;padding:18px;border-radius:14px;background:#0b0b0b;border:1px solid #222;transition:.18s}
.medal:hover{transform:translateY(-3px);border-color:#383838}
.medal-body{flex:1;min-width:0}
.medal-body h3{font-size:15px;font-weight:800;letter-spacing:.3px}
.medal-body h3 em{display:block;margin-top:3px;font-size:11px;letter-spacing:.05em}
.medal-body p{margin:7px 0 12px;color:#858585;font-size:12.2px;line-height:1.55}
.medal-body footer{margin-top:11px;display:flex;align-items:center;gap:8px;font:600 11.5px var(--mono);color:#7d7d7d}
.medal-body footer .ok{color:#4ade80;font-size:12px}
.medal-body footer time{color:#6a6a6a}
.medal-body footer .medal-xp-chip{margin-left:auto}
.medal.unlocked{border-color:#2d2d2d;background:linear-gradient(180deg,#111,#0b0b0b);box-shadow:0 10px 30px #0004}
.medal.locked .medal-disc{background:#101010;color:#3d3d3d;border:1.5px dashed #333;box-shadow:none}
.medal.locked h3{color:#a5a5a5}
.medal.locked{opacity:.78}
.medal[data-state=progress]{border-color:#3a2c14}
.medal[data-state=progress].locked{opacity:1}
.medal.off{display:none}
/* ═══════════════ Library tabs 收藏库 ═══════════════ */
.lib-section{padding:22px 24px 24px;background:#0a0a0a;border:1px solid #222;border-radius:16px;margin-bottom:15px}
.lib-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap}
.lib-note{color:#7d7d7d;font-size:12px}
.lib-note em{color:#666;font-size:11px;margin-left:3px}
.libtabs{display:flex;gap:4px;flex-wrap:wrap;margin:17px 0 20px;border-bottom:1px solid #1f1f1f;padding-bottom:0}
.libtabs button{position:relative;display:inline-flex;align-items:center;gap:7px;padding:11px 15px 13px;color:#8b8b8b;font-size:13px;font-weight:650;transition:.15s;border-radius:8px 8px 0 0}
.libtabs button span{font-size:14px;font-weight:800;letter-spacing:.5px}
.libtabs button em{font-size:11px}
.libtabs button b{font:750 11px var(--mono);color:#9a9a9a;background:#191919;border:1px solid #262626;border-radius:5px;padding:2px 7px;transition:.15s}
.libtabs button::after{content:'';position:absolute;left:12px;right:12px;bottom:-1px;height:2.5px;border-radius:2px;background:transparent;transition:.15s}
.libtabs button:hover{color:#d9d9d9;background:#111}
.libtabs button.active{color:#fff;background:#101010}
.libtabs button.active b{color:#0a0a0a;background:#ef4444;border-color:#ef4444}
.libtabs button.active::after{background:linear-gradient(90deg,#ef4444,#f59e0b)}
.libgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:20px 14px;min-height:120px}
.lib-card{display:block;transition:.18s}
.lib-card:hover{transform:translateY(-4px)}
.lib-poster{position:relative;display:block;border-radius:10px;overflow:hidden;background:#141414;aspect-ratio:2/3;box-shadow:0 8px 22px #0007}
.lib-poster img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.lib-card:hover .lib-poster img{transform:scale(1.05)}
.lib-score{position:absolute;top:8px;left:8px;display:inline-flex;align-items:center;gap:3px;padding:3px 7px;border-radius:6px;font:800 11px/1 var(--mono);color:#fbd046;background:#000c;border:1px solid #f59e0b44;backdrop-filter:blur(3px)}
.lib-card strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:9px;font-size:12.8px;font-weight:650;line-height:1.35}
.lib-progress{display:block;height:4px;margin-top:8px;border-radius:99px;background:#1c1c1c;overflow:hidden}
.lib-progress i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#ef4444,#f59e0b)}
.lib-ep{display:block;margin-top:5px;font:600 10px var(--mono);color:#8a8a8a;letter-spacing:.04em}
.lib-chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}
.lib-chips i{font-style:normal;font-size:10px;font-weight:700;padding:2.5px 7px;border-radius:5px;letter-spacing:.06em}
.lib-chips i.watchlist{color:#93c5fd;background:#3b82f61c;border:1px solid #3b82f63d}
.lib-chips i.history{color:#fcd34d;background:#f59e0b1c;border:1px solid #f59e0b3d}
.lib-chips i.completed{color:#86efac;background:#22c55e1c;border:1px solid #22c55e3d}
.lib-chips i.liked{color:#f9a8d4;background:#ec48991c;border:1px solid #ec48993d}
.lib-empty{grid-column:1/-1;margin:6px 0}
@media(max-width:1180px){.medal-grid{grid-template-columns:1fr 1fr}.medal-upnext-grid{grid-template-columns:1fr}}
@media(max-width:900px){.medal-hero{grid-template-columns:1fr}.medal-hero-side{border-left:0;padding-left:0;border-top:1px solid #222;padding-top:18px}}
@media(max-width:700px){.medal-grid{grid-template-columns:1fr}.medal-next{flex-wrap:wrap}.medal-next-side{display:flex;align-items:center;gap:10px;text-align:left}.medal-next-side b{font-size:17px}.medal-earned-row{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.libgrid{grid-template-columns:repeat(auto-fill,minmax(126px,1fr))}.medal-hero-big b{font-size:36px}}

/* ═══════════════════════════════════════════════════════════════════
   Settings design system — sidebar + banner heroes + wired controls
   ═══════════════════════════════════════════════════════════════════ */
.set-shell{display:grid;grid-template-columns:292px minmax(0,1fr);gap:26px;align-items:start;position:relative;z-index:1}

/* ── Sidebar ── */
.set-side{position:sticky;top:calc(var(--header) + 20px);display:flex;flex-direction:column;gap:13px}
.set-user{position:relative;border:1px solid #232323;border-radius:16px;overflow:hidden;background:#0b0b0b;box-shadow:0 14px 40px #0008}
.set-user-bg{display:flex;height:76px;gap:2px}
.set-user-bg img{flex:1;min-width:0;height:100%;object-fit:cover;filter:saturate(.8) brightness(.75)}
.set-user-bg-plain{background:radial-gradient(120% 160% at 15% 0%,#3d1113 0%,#1a0b0b 55%,#0b0b0b 100%)}
.set-user-card{display:flex;align-items:center;gap:12px;padding:10px 14px 13px;background:linear-gradient(180deg,#0b0b0b00,#0b0b0bf2 45%);margin-top:-38px;position:relative}
.set-user-avatar{width:44px;height:44px;font-size:17px;flex-shrink:0}
.set-user-id{min-width:0}
.set-user-id strong{display:block;font-size:14.5px;font-weight:800;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.set-user-id small{display:block;font:600 10.5px var(--mono);color:#9a9a9a;letter-spacing:.04em;margin-top:2px}
.set-search{display:flex;align-items:center;gap:9px;padding:10px 13px;background:#0e0e0e;border:1px solid #232323;border-radius:11px;color:#777}
.set-search .icon{width:17px;height:17px;flex-shrink:0}
.set-search input{flex:1;min-width:0;background:none;border:0;color:#eee;font-size:13px}
.set-search input::placeholder{color:#666}
.set-search input:focus{outline:none}
.set-search:focus-within{border-color:#dc262666;box-shadow:0 0 0 3px #dc26261a}
.set-search-count{font:750 10px var(--mono);color:#f59e0b;background:#f59e0b14;border:1px solid #f59e0b33;border-radius:6px;padding:3px 7px;white-space:nowrap}
.set-nav{display:flex;flex-direction:column;gap:3px}
.set-nav button{display:flex;align-items:center;gap:11px;width:100%;text-align:left;padding:9px 11px;border-radius:11px;color:#a5a5a5;transition:.15s;border:1px solid transparent}
.set-nav button:hover{background:#111;color:#ddd}
.set-nav button.active{background:linear-gradient(90deg,#dc26261f,#dc262608 70%,transparent);color:#fff;border-color:#3a1517}
.set-nav button.active .set-nav-ico{color:var(--red);background:#dc26261f;border-color:#dc26264d}
.set-nav-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#151515;border:1px solid #262626;flex-shrink:0;transition:.15s}
.set-nav-ico .icon{width:17px;height:17px}
.set-nav-txt{flex:1;min-width:0}
.set-nav-txt strong{display:block;font-size:13px;font-weight:750;letter-spacing:.01em}
.set-nav-txt small{display:block;font-size:10.5px;color:#747474;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.set-nav-glyph{font-size:12px;color:#5c5c5c;flex-shrink:0}
.set-nav button.active .set-nav-glyph{color:#a17f36}
.set-nav button.dim{opacity:.32}
.set-side-note{font-size:11px;line-height:1.55;color:#5f5f5f;padding:2px 4px 0}

/* ── Main + heroes ── */
.set-main{min-width:0}
.set-top h1{font-size:26px;font-weight:850;letter-spacing:-.4px}
.set-top p{color:#8b8b8b;font-size:13px;margin-top:4px}
.set-top{margin-bottom:16px}
.set-section{display:flex;flex-direction:column;gap:16px}
.set-hero{position:relative;border:1px solid #242424;border-radius:18px;overflow:hidden;min-height:118px;display:flex;align-items:flex-end;box-shadow:0 18px 50px #0007}
.set-hero-in{position:relative;z-index:2;display:flex;align-items:center;gap:16px;width:100%;padding:20px 24px;background:linear-gradient(90deg,#000000d9 0%,#000000a6 55%,#00000040 100%)}
.set-hero h2{font-size:21px;font-weight:850;letter-spacing:-.3px}
.set-hero p{color:#a8a8a8;font-size:12.5px;margin-top:3px}
.set-hero-cn{font-size:44px;line-height:1;color:#ffffff17;margin-right:2px;font-weight:900;user-select:none}
.set-hero-art{position:absolute;inset:0;display:flex;z-index:1}
.set-hero-art img{flex:1;min-width:0;height:100%;object-fit:cover;filter:saturate(.85) brightness(.6)}
.hero-account{background:radial-gradient(130% 200% at 85% -30%,#4a1215 0%,#200b0d 45%,#0d0d0d 100%)}
.hero-playback{background:linear-gradient(100deg,#5b1113 0%,#7f1616 34%,#2b0d10 78%,#111 100%)}
.hero-subs{background:linear-gradient(100deg,#7a3c0e 0%,#a35a1a 30%,#4a1a4f 74%,#160b1c 100%)}
.hero-video{background:linear-gradient(100deg,#0e3a44 0%,#124d52 32%,#123044 68%,#0c0f16 100%)}
.hero-appearance{background:linear-gradient(100deg,#5f4208 0%,#8a6410 32%,#3d2a0c 70%,#12100b 100%)}
.hero-privacy{background:linear-gradient(100deg,#2c1450 0%,#45207a 34%,#1c1030 72%,#0d0c14 100%)}
.hero-playback .set-hero-cn,.hero-subs .set-hero-cn,.hero-video .set-hero-cn,.hero-appearance .set-hero-cn,.hero-privacy .set-hero-cn{color:#ffffff22}
.hero-account .set-hero-art img{filter:saturate(.8) brightness(.55)}

/* ── Rows ── */
.set-body{display:flex;flex-direction:column;background:#0c0c0c;border:1px solid #212121;border-radius:16px;padding:6px 22px;box-shadow:0 14px 44px #0006}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:26px;padding:19px 0;border-bottom:1px solid #1a1a1a}
.set-row:last-child{border-bottom:0}
.set-row-txt{max-width:560px}
.set-row-txt strong{font-size:14px;font-weight:750;letter-spacing:.01em}
.set-row-txt p{color:#8a8a8a;font-size:12px;line-height:1.55;margin-top:4px}
.set-row-col{flex-direction:column;align-items:stretch;gap:14px}
.set-row.hit{animation:sethit 1.6s ease}
@keyframes sethit{0%,60%{background:#dc262612;box-shadow:inset 3px 0 0 var(--red)}100%{background:transparent}}
.set-new,.set-beta{display:inline-block;vertical-align:2px;margin-left:7px;font:800 9px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#f59e0b;border:1px solid #f59e0b55;border-radius:5px;padding:3px 6px}
.set-beta{color:#22d3ee;border-color:#22d3ee55}
.set-chip{display:inline-block;vertical-align:2px;margin-left:7px;font:800 9px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#a78bfa;border:1px solid #a78bfa55;border-radius:5px;padding:3px 6px}

/* locked fields */
.set-locked{display:inline-flex;align-items:center;gap:8px;color:#9c9c9c;font-size:13px;font-weight:600;background:#101010;border:1px dashed #2c2c2c;border-radius:9px;padding:9px 14px;white-space:nowrap}
.set-locked .icon{width:15px;height:15px;color:#6d6d6d}

/* form fields */
.set-row-field input,.set-row-field textarea,.set-row-field select{width:min(340px,52%);background:#101010;border:1px solid #2a2a2a;border-radius:10px;color:#f0f0f0;padding:10px 13px;font-size:13px;transition:.15s}
.set-row-field textarea{resize:vertical;min-height:74px}
.set-row-field select{width:min(340px,52%);appearance:none;background-image:linear-gradient(45deg,transparent 50%,#888 50%),linear-gradient(135deg,#888 50%,transparent 50%);background-position:calc(100% - 19px) 50%,calc(100% - 14px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.set-row-field input:focus,.set-row-field textarea:focus,.set-row-field select:focus{outline:none;border-color:#dc262680;box-shadow:0 0 0 3px #dc262617}

/* ── Toggle switch ── */
.set-switch{position:relative;width:46px;height:26px;border-radius:99px;background:#1d1d1d;border:1px solid #2f2f2f;transition:.18s;flex-shrink:0}
.set-switch i{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#5b5b5b;transition:.18s}
.set-switch.on{background:var(--red);border-color:var(--red)}
.set-switch.on i{left:22px;background:#fff;box-shadow:0 2px 8px #0008}
.set-switch:focus-visible{outline:2px solid #ef4444;outline-offset:3px}

/* ── Segmented ── */
.set-seg{display:inline-flex;background:#101010;border:1px solid #262626;border-radius:10px;padding:3px;gap:2px;flex-shrink:0}
.set-seg button{padding:7px 13px;border-radius:7px;color:#8d8d8d;font-size:12px;font-weight:700;letter-spacing:.01em;transition:.14s;white-space:nowrap}
.set-seg button:hover{color:#ddd}
.set-seg button.on{background:#262626;color:#fff;box-shadow:inset 0 1px 0 #ffffff14,0 2px 8px #0006}
.set-seg.disabled{opacity:.38;pointer-events:none}

/* ── Slider ── */
.set-slider{display:flex;align-items:center;gap:12px;width:min(340px,52%)}
.set-slider input[type=range]{flex:1;appearance:none;-webkit-appearance:none;height:5px;border-radius:99px;background:linear-gradient(90deg,var(--red) var(--fill,50%),#232323 var(--fill,50%));cursor:pointer}
.set-slider input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:17px;height:17px;border-radius:50%;background:#fff;border:3px solid var(--red);box-shadow:0 2px 8px #0009;transition:transform .12s}
.set-slider input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}
.set-slider input[type=range]::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:#fff;border:3px solid var(--red);box-shadow:0 2px 8px #0009}
.set-slider output{font:800 12px var(--mono);color:#e8e8e8;min-width:52px;text-align:right;background:#131313;border:1px solid #262626;border-radius:7px;padding:5px 8px}

/* ── Swatches ── */
.set-swatches{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.set-swatches button{width:26px;height:26px;border-radius:50%;background:var(--sw);border:2px solid #333;transition:.14s;position:relative}
.set-swatches button:hover{transform:scale(1.12)}
.set-swatches button.on{border-color:#fff;box-shadow:0 0 0 3px #ffffff26,0 3px 10px #0008}
.set-swatches button.on::after{content:'';position:absolute;inset:0;margin:auto;width:8px;height:8px;border-radius:50%;background:#0009;mix-blend-mode:overlay}
.set-hex{font:750 11px var(--mono);color:#a9a9a9;background:#121212;border:1px solid #262626;border-radius:7px;padding:6px 9px;letter-spacing:.04em}

/* ── Preset / upscaler cards ── */
.set-cards{display:grid;gap:9px}
.set-cards.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.set-cards.six{grid-template-columns:repeat(6,minmax(0,1fr))}
.set-cards button{display:flex;flex-direction:column;align-items:center;gap:7px;padding:13px 8px 11px;background:#101010;border:1px solid #262626;border-radius:12px;color:#9b9b9b;transition:.15s;text-align:center}
.set-cards button:hover{border-color:#3a3a3a;color:#ddd;transform:translateY(-2px)}
.set-cards button.on{border-color:var(--red);background:linear-gradient(180deg,#dc262617,#101010);color:#fff;box-shadow:0 6px 20px #dc262622}
.set-cards button.on::before{content:'✓';order:-1;font-size:10px;color:var(--red);font-weight:900}
.set-cards .aa{font-style:normal;font-size:19px;font-weight:800;line-height:1;color:inherit}
.set-cards button strong{font-size:12.5px;font-weight:800;color:#eee}
.set-cards button span{font-size:10px;line-height:1.4;color:#818181}
.set-cards button.on strong{color:#fff}

/* ── Keyboard shortcuts ── */
.set-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.set-keys h4{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.09em;color:#f59e0b;margin-bottom:9px}
.set-keys ul{list-style:none;display:flex;flex-direction:column;gap:7px}
.set-keys li{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:#a5a5a5;background:#101010;border:1px solid #202020;border-radius:8px;padding:7px 10px}
.set-keys li span:last-child{display:inline-flex;gap:4px;flex-shrink:0}

/* ── Subtitle preview ── */
.sub-stage{padding:18px 0 14px;border-bottom:1px solid #1a1a1a}
.sub-screen{position:relative;height:150px;border-radius:13px;overflow:hidden;border:1px solid #262626;background:radial-gradient(130% 170% at 20% 0%,#20304a 0%,#141b2e 40%,#0a0c14 100%);display:flex;align-items:flex-end;justify-content:center;padding:0 18px 26px}
.sub-screen::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,#000000a8 100%)}
.sub-line{position:relative;z-index:1;text-align:center;line-height:1.35;letter-spacing:.01em;max-width:92%}
.sub-stage-foot{display:flex;align-items:center;justify-content:space-between;margin-top:11px;color:#6f6f6f;font-size:11.5px}
.sub-stage-foot .text-button{display:inline-flex;align-items:center;gap:6px}
.sub-stage-foot .text-button .icon{width:13px;height:13px}
.set-sub-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;width:100%}
.set-sub-cell{display:flex;flex-direction:column;gap:10px;background:#101010;border:1px solid #202020;border-radius:12px;padding:14px 15px}
.set-sub-cell>span{font-size:12px;font-weight:800;color:#ddd}
.set-sub-cell em{font-style:normal;font-size:10.5px;color:#6f6f6f}
.set-sub-cell .set-slider{width:100%}
.set-sub-cell .set-swatches{justify-content:flex-start}
.set-sub-cell .set-seg{align-self:flex-start}

/* ── Avatar picker ── */
.set-avatar-picker{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.set-avatar-picker .aa{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#101010;border:1px solid #2a2a2a;font-size:15px;font-weight:800;color:#ddd;transition:.15s}
.set-avatar-picker .aa:hover{border-color:#3d3d3d;transform:translateY(-2px)}
.set-avatar-picker .aa.on{border-color:var(--red);color:#fff;background:linear-gradient(180deg,#dc262622,#101010);box-shadow:0 4px 16px #dc26262e}

/* ── Buttons ── */
.set-actions{display:flex;justify-content:flex-end;gap:10px;padding:18px 0 14px}
.set-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:750;letter-spacing:.01em;transition:.15s;border:1px solid #2c2c2c;color:#cfcfcf}
.set-btn .icon{width:15px;height:15px}
.set-btn:hover{border-color:#3d3d3d;color:#fff;transform:translateY(-1px)}
.set-btn.solid{background:linear-gradient(180deg,#e03535,#b91c1c);border-color:#e03535;color:#fff;box-shadow:0 6px 20px #dc26263d}
.set-btn.solid:hover{background:linear-gradient(180deg,#ef4444,#c52222)}
.set-btn.danger{color:#f87171;border-color:#7f1d1d}
.set-btn.danger:hover{background:#7f1d1d26;border-color:#b91c1c;color:#fca5a5}
.set-btn.loading{opacity:.6;pointer-events:none}
#set-row-strength.disabled .set-row-txt{opacity:.5}

/* ═══════════════ Library page (status tabs) ═══════════════ */
.lib-page{margin-top:24px}
.lib-page .libtabs{margin-top:6px}
.lib-card{position:relative;display:flex;flex-direction:column;background:#0c0c0c;border:1px solid #212121;border-radius:14px;padding:10px;transition:.18s;box-shadow:0 10px 30px #0005}
.lib-card:hover{transform:translateY(-4px);border-color:#333;box-shadow:0 16px 40px #0008}
.lib-poster{position:relative;display:block;border-radius:9px;overflow:hidden;aspect-ratio:2/3;background:#141414}
.lib-poster img{width:100%;height:100%;object-fit:cover;transition:transform .25s}
.lib-card:hover .lib-poster img{transform:scale(1.05)}
.lib-title{display:block;margin-top:9px;font-size:12.5px;font-weight:750;letter-spacing:.01em;color:#eee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lib-title:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.lib-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:9px}
.lib-st{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;letter-spacing:.03em;color:var(--st,#999)}
.lib-st::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--st,#999);box-shadow:0 0 8px var(--st,#999)}
.lib-status{font:700 10px var(--mono);color:#8f8f8f;background:#131313;border:1px solid #262626;border-radius:6px;padding:4px 8px;letter-spacing:.05em;transition:.14s}
.lib-status:hover{color:#fff;border-color:#3d3d3d;background:#1a1a1a}

/* status popover */
#lib-status-menu{position:fixed;z-index:90;width:216px;background:#121212;border:1px solid #2c2c2c;border-radius:13px;padding:8px;box-shadow:0 24px 60px #000c;animation:statmenu .14s ease}
@keyframes statmenu{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
#lib-status-menu h4{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:#6f6f6f;padding:4px 8px 8px}
#lib-status-menu button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:8px 9px;border-radius:8px;color:#c9c9c9;font-size:12.5px;font-weight:650;transition:.12s}
#lib-status-menu button:hover{background:#1d1d1d;color:#fff}
#lib-status-menu button i{width:9px;height:9px;border-radius:50%;background:var(--st,#888);flex-shrink:0}
#lib-status-menu button.on{background:#dc26261f;color:#fff}
#lib-status-menu button.on::after{content:'✓';margin-left:auto;font-size:11px;color:var(--red)}
#lib-status-menu button.danger{color:#f87171;margin-top:5px;border-top:1px solid #222;padding-top:10px;border-radius:0 0 8px 8px}
#lib-status-menu button.danger:hover{background:#7f1d1d26;color:#fca5a5}

/* ═══════════════ Global appearance settings effects ═══════════════ */
body.no-watermark .prof-watermark{display:none}
body.no-motion .pb,body.no-motion .prof-lv-ring svg,body.no-motion .prof-binged-row,body.no-motion .anime-card{animation:none!important;transition:none!important}
body.no-motion *{scroll-behavior:auto!important}
body.blur-mature .anime-card.mature .poster img{filter:blur(14px) saturate(.7);transform:scale(1.08)}
body.blur-mature .anime-card.mature .poster{position:relative}
body.blur-mature .anime-card.mature .poster::after{content:'ECCHI';position:absolute;inset:0;margin:auto;width:max-content;height:max-content;font:800 10px var(--mono);letter-spacing:.14em;color:#ffffffb0;background:#000a;border:1px solid #ffffff2e;border-radius:6px;padding:5px 9px;z-index:2}
body.blur-mature .anime-card.mature:hover .poster img{filter:none;transform:none}
body.blur-mature .anime-card.mature:hover .poster::after{display:none}

/* ═══════════════ Responsive ═══════════════ */
@media(max-width:1180px){
  .set-shell{grid-template-columns:250px minmax(0,1fr);gap:18px}
  .set-cards.six{grid-template-columns:repeat(3,1fr)}
  .set-keys{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .set-shell{grid-template-columns:1fr}
  .set-side{position:static}
  .set-nav{flex-direction:row;overflow-x:auto;padding-bottom:4px}
  .set-nav button{width:auto;flex-shrink:0}
  .set-nav-txt small{display:none}
  .set-side-note{display:none}
  .set-row{flex-direction:column;align-items:stretch;gap:12px}
  .set-row-txt{max-width:none}
  .set-row-field input,.set-row-field textarea,.set-row-field select,.set-slider{width:100%}
  .set-swatches{justify-content:flex-start}
  .set-avatar-picker{justify-content:flex-start}
  .set-cards.four{grid-template-columns:repeat(4,1fr)}
  .set-sub-grid{grid-template-columns:1fr}
  .set-locked{align-self:flex-start}
}
@media(max-width:600px){
  .set-cards.six{grid-template-columns:repeat(2,1fr)}
  .set-cards.four{grid-template-columns:repeat(2,1fr)}
  .set-keys{grid-template-columns:1fr}
  .set-hero-cn{font-size:34px}
  .set-hero h2{font-size:18px}
}

.set-btn.quiet{color:#bdbdbd;border-color:#2c2c2c;background:#101010}
.set-btn.quiet:hover{border-color:#4a4a4a;color:#fff;background:#161616}

/* ═══ Account identity — glowing avatar, stacked fields (per reference) ═══ */
.acc-body{display:block;padding:28px 30px 10px}
.acc-id{display:flex;flex-direction:column;align-items:flex-start;gap:15px;padding-bottom:26px;border-bottom:1px solid #1a1a1a;margin-bottom:2px}
.acc-avatar{position:relative;width:120px;height:120px;display:grid;place-items:center;margin-left:2px}
.acc-avatar-glow{position:absolute;inset:-8px;border-radius:50%;background:radial-gradient(circle,#dc26265c 0%,#dc262618 46%,transparent 72%);filter:blur(13px);animation:accGlow 4.5s ease-in-out infinite;pointer-events:none}
.acc-avatar-face{position:relative;width:96px;height:96px;border-radius:26px;font-size:36px;box-shadow:0 0 0 2px #dc262666,0 12px 36px #000c,0 0 42px #dc26263d}
.acc-customize{padding:8px 16px;font-size:12px;border-radius:9px}
.acc-picker{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .32s cubic-bezier(.4,0,.2,1),opacity .25s ease;width:100%}
.acc-picker.open{grid-template-rows:1fr;opacity:1}
.acc-picker-in{min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:11px}
.acc-picker-title{font:800 10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#8d8d8d}
.acc-picker .set-avatar-picker{justify-content:flex-start;padding-top:2px}
.acc-field{display:flex;flex-direction:column;gap:8px;padding:21px 0}
.acc-field + .acc-field{border-top:1px solid #161616}
.acc-field label{font:800 10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#8d8d8d}
.acc-field input,.acc-field textarea{width:100%;background:#101010;border:1px solid #2a2a2a;border-radius:11px;color:#f0f0f0;padding:12px 15px;font-size:13.5px;font-family:inherit;transition:.15s}
.acc-field textarea{resize:vertical;min-height:80px;line-height:1.6}
.acc-field input:focus,.acc-field textarea:focus{outline:none;border-color:#dc262680;box-shadow:0 0 0 3px #dc262617}
.acc-locked{display:flex;align-items:center;gap:10px;background:#0e0e0e;border:1px solid #262626;border-radius:11px;color:#9c9c9c;padding:12px 15px;font-size:13.5px;font-weight:600;letter-spacing:.01em}
.acc-locked .icon{width:15px;height:15px;color:#6d6d6d;flex-shrink:0}
.acc-locked span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acc-note{font-size:11px;color:#616161;letter-spacing:.01em}
.acc-id.hit,.acc-field.hit{animation:sethit 1.6s ease}
@keyframes accGlow{0%,100%{opacity:.7;transform:scale(.96)}50%{opacity:1;transform:scale(1.05)}}
body.no-motion .acc-avatar-glow{animation:none!important}
.set-top-btn{position:fixed;right:26px;bottom:26px;z-index:60;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#101010ee;border:1px solid #2c2c2c;color:#cfcfcf;box-shadow:0 10px 30px #000a;backdrop-filter:blur(6px);transition:.18s;opacity:0;transform:translateY(10px);pointer-events:none}
.set-top-btn.show{opacity:1;transform:none;pointer-events:auto}
.set-top-btn:hover{border-color:#dc262680;color:#fff;transform:translateY(-2px)}
.set-top-btn .icon{width:18px;height:18px;transform:rotate(-90deg)}
@media(max-width:600px){
  .acc-body{padding:20px 16px 6px}
  .acc-avatar{width:104px;height:104px}
  .acc-avatar-face{width:84px;height:84px;border-radius:22px;font-size:31px}
  .set-top-btn{right:14px;bottom:14px;width:40px;height:40px}
}

/* ═══ Customize profile modal — Avatar / Banner / Frame (Discord-style) ═══ */
.pcz-overlay{position:fixed;inset:0;z-index:90;background:#000a;backdrop-filter:blur(7px);display:grid;place-items:center;padding:22px;opacity:0;transition:opacity .2s ease}
.pcz-overlay.on{opacity:1}
.pcz{width:min(880px,100%);max-height:min(760px,94vh);display:flex;flex-direction:column;background:#101010;border:1px solid #2a2a2a;border-radius:20px;box-shadow:0 40px 120px #000e,0 0 0 1px #ffffff08;overflow:hidden;transform:translateY(14px) scale(.97);transition:transform .22s cubic-bezier(.34,1.4,.64,1)}
.pcz-overlay.on .pcz{transform:none}
.pcz-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:20px 24px 16px;border-bottom:1px solid #1e1e1e;background:linear-gradient(180deg,#151212,#101010)}
.pcz-head h2{font-size:19px;font-weight:850;letter-spacing:-.2px}
.pcz-head p{color:#8b8b8b;font-size:12.5px;margin-top:3px}
.pcz-x{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid #2a2a2a;background:#161616;color:#9a9a9a;transition:.15s;flex-shrink:0}
.pcz-x:hover{color:#fff;border-color:#dc262666;background:#1c1414}
.pcz-x .icon{width:16px;height:16px}
.pcz-body{display:grid;grid-template-columns:250px 1fr;gap:0;min-height:0;flex:1}
.pcz-side{padding:20px;border-right:1px solid #1e1e1e;display:flex;flex-direction:column;gap:14px;background:#0d0d0d}
.pcz-card{border-radius:14px;border:1px solid #262626;background:#0a0a0a;overflow:hidden;box-shadow:0 14px 34px #0008}
.pcz-card-banner{height:92px;background:#151515;background-size:cover;background-position:center;transition:background .2s}
.pcz-card-me{display:flex;flex-direction:column;align-items:center;gap:2px;padding:0 14px 14px;margin-top:-26px;text-align:center}
.pcz-card-ava{padding:3px;border-radius:50%;background:#0a0a0a;display:block;position:relative}
.pcz-avatar{width:64px;height:64px;font-size:23px;position:relative}
.pcz-card-me strong{font-size:14px;font-weight:800;margin-top:4px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcz-card-me small{font:600 10.5px var(--mono);color:#8a8a8a;letter-spacing:.04em}
.pcz-side-note{font-size:10.5px;line-height:1.6;color:#5e5e5e}
.pcz-side-note code{font-family:var(--mono);color:#a17f36;font-size:10px}
.pcz-panel{display:flex;flex-direction:column;min-width:0;min-height:0}
.pcz-tabs{display:flex;gap:4px;padding:12px 16px 0;border-bottom:1px solid #1e1e1e}
.pcz-tabs button{display:inline-flex;align-items:center;gap:7px;padding:10px 16px 12px;font-size:13px;font-weight:750;color:#8d8d8d;border-bottom:2px solid transparent;transition:.15s;letter-spacing:.01em}
.pcz-tabs button:hover{color:#ddd}
.pcz-tabs button.on{color:#fff;border-color:var(--red)}
.pcz-tabs button b{font:750 10px var(--mono);color:#a17f36;background:#a17f3614;border:1px solid #a17f3633;border-radius:99px;padding:2px 7px;letter-spacing:.03em}
.pcz-tabs button.on b{color:#ef4444;border-color:#dc26264d;background:#dc26261a}
.pcz-content{flex:1;min-height:0;overflow-y:auto;padding:16px 18px 18px;display:flex;flex-direction:column;gap:18px;scrollbar-width:thin;scrollbar-color:#333 transparent}
.pcz-content::-webkit-scrollbar{width:8px}
.pcz-content::-webkit-scrollbar-thumb{background:#2c2c2c;border-radius:99px}
.pcz-group h4{display:flex;align-items:baseline;gap:8px;font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#a5a5a5;margin-bottom:10px}
.pcz-group h4 small{font:600 10px var(--mono);color:#666;letter-spacing:.06em}
.pcz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:9px}
.pcz-grid.wide{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.pcz-item{position:relative;aspect-ratio:1;border-radius:50%;overflow:visible;background:#0a0a0a;border:2px solid #262626;transition:.14s;display:grid;place-items:center}
.pcz-item img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;background:#0a0a0a}
.pcz-item:hover{transform:translateY(-2px);border-color:#4a4a4a}
.pcz-item.on{border-color:var(--red);box-shadow:0 0 0 3px #dc26263d,0 4px 14px #dc26262e}
.pcz-item.on::after{content:'';position:absolute;inset:-7px;border-radius:50%;border:2px solid #dc262659;pointer-events:none}
.pcz-item .pcz-tick{display:none}
.pcz-item.glyph{font-size:20px;font-weight:800;color:#eee}
.pcz-item.glyph.cn{font-weight:900}
.pcz-frame .pcz-item{background:radial-gradient(circle,#1c1c1c 58%,#111 100%)}
.pcz-frame .pcz-item img{width:126%;height:126%;border-radius:0;background:none;object-fit:contain}
.pcz-frame .pcz-item .fr-ava{position:absolute;width:56%;height:56%;border-radius:50%;background:linear-gradient(135deg,#3d1113,#1a0b0b);z-index:-0}
.pcz-none span{font-size:10px;font-weight:800;color:#8d8d8d;letter-spacing:.05em;text-transform:uppercase}
.pcz-banner-item{display:flex;flex-direction:column;gap:7px;padding:8px;border-radius:13px;border:2px solid transparent;transition:.14s;background:#0a0a0a}
.pcz-banner-item:hover{border-color:#3a3a3a;transform:translateY(-2px)}
.pcz-banner-item.on{border-color:var(--red);box-shadow:0 0 0 3px #dc26263d}
.pcz-banner-item .swatch{height:56px;border-radius:9px;background-size:cover;background-position:center}
.pcz-banner-item span{font-size:11px;font-weight:700;color:#a5a5a5;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcz-banner-item.on span{color:#fff}
.pcz-empty{padding:34px 10px;text-align:center;color:#6b6b6b;font-size:12.5px;border:1px dashed #2a2a2a;border-radius:14px}
.pcz-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 24px;border-top:1px solid #1e1e1e;background:#0d0d0d}
.pcz-foot-right{display:flex;gap:10px}
.pcz-loading{display:grid;place-items:center;padding:60px 0;color:#666;font-size:12.5px;letter-spacing:.04em}

/* icon avatars (catalog images replace initials) */
.avatar-initials.is-icon,.prof-avatar.is-icon{background-size:cover;background-position:center;color:transparent;text-shadow:none}
.avatar-frame{position:absolute;inset:-15%;width:130%;height:130%;pointer-events:none;filter:drop-shadow(0 3px 8px #0009);z-index:2}
.avatar-initials,.prof-avatar{position:relative}

/* banner presets — shared by modal swatches + profile banner */
.bnr-crimson{background:radial-gradient(130% 190% at 18% -10%,#a31616 0%,#5c0d0d 42%,#120606 100%)}
.bnr-ember{background:radial-gradient(130% 190% at 82% -10%,#f59e0b 0%,#7c2d12 48%,#140803 100%)}
.bnr-sakura{background:radial-gradient(130% 190% at 20% -20%,#f783ac 0%,#9d2b57 46%,#1a0710 100%)}
.bnr-raito{background:radial-gradient(130% 190% at 78% -12%,#22d3ee 0%,#155e75 46%,#051014 100%)}
.bnr-violet{background:radial-gradient(130% 190% at 22% -8%,#a78bfa 0%,#5b21b6 48%,#0e0716 100%)}
.bnr-gilded{background:radial-gradient(130% 190% at 80% -8%,#fbbf24 0%,#92610e 44%,#151003 100%)}
.bnr-jade{background:radial-gradient(130% 190% at 18% -12%,#34d399 0%,#065f46 48%,#03130d 100%)}
.bnr-ink{background:radial-gradient(90% 150% at 50% 0%,#262626 0%,#101010 60%,#050505 100%)}
.bnr-ocean{background:radial-gradient(130% 190% at 80% -14%,#60a5fa 0%,#1e3a8a 48%,#050a17 100%)}
.bnr-sunset{background:linear-gradient(160deg,#dc2626 0%,#f59e0b 38%,#ec4899 78%,#4c0519 100%)}
.bnr-noir{background:linear-gradient(150deg,#3f3f3f 0%,#1c1c1c 52%,#0a0a0a 100%)}
.bnr-tide{background:conic-gradient(from 210deg at 50% -30%,#0ea5e9,#6366f1,#0ea5e9);filter:saturate(.85)}

/* profile banner takes a chosen preset or a library cover */
.prof-banner.has-preset .prof-strips{display:none}
.prof-banner.has-preset .prof-bg{background-size:cover;background-position:center}
.prof-banner.has-image .prof-strips{display:none}
.prof-banner.has-image .prof-bg{background-size:cover;background-position:center 28%}
.prof-banner.has-image .prof-bg::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#000000b8,#0000004d 45%,#000000cc)}
.prof-banner .prof-bg{position:relative}

@media(max-width:760px){
  .pcz{max-height:96vh;border-radius:16px}
  .pcz-body{grid-template-columns:1fr}
  .pcz-side{border-right:0;border-bottom:1px solid #1e1e1e;flex-direction:column;gap:8px;padding:14px 16px}
  .pcz-card{display:flex;flex-direction:row;align-items:center;width:100%}
  .pcz-card-banner{width:110px;height:58px;flex-shrink:0;border-radius:10px}
  .pcz-card-me{flex-direction:row;align-items:center;gap:9px;margin:0;padding:6px 12px 6px 0;flex:1;min-width:0}
  .pcz-card-ava{margin:0;padding:2px}
  .pcz-avatar{width:42px;height:42px;font-size:15px}
  .pcz-card-me strong{margin:0;font-size:13px}
  .pcz-side-note{display:none}
  .pcz-foot{flex-wrap:wrap;gap:9px;padding:12px 16px}
  .pcz-tabs button{padding:9px 11px 10px;font-size:12px}
}