@import url(https://fonts.googleapis.com/css2?family=Oswald&family=Roboto&display=swap);body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}:root{--wide-pc-item-per-row:5;--pc-item-per-row:4;--tablet-item-per-row:3;--mobile-item-per-row:2;--item-margin:16px;--gray-color:#606060;--search-form-border-color:#d3d3d3;--search-btn-color:#999;--on-player-item-list-width:422px;--meta-thumb-width:48px}*{margin:0;padding:0;box-sizing:border-box}body,html{font-family:"Roboto",sans-serif;font-weight:500;font-size:15px}a{color:inherit;text-decoration:none}img{width:100%;display:block}ul{list-style:none}button{outline:none;border:none;background-color:#fff;cursor:pointer}.header{position:fixed;left:0;top:0;z-index:998;width:100%;height:56px;background-color:#fff;padding:0 32px;padding:0 calc(var(--item-margin)*2);justify-content:space-between}.header,.logo{display:flex;align-items:center}.logo>svg{width:28px;margin-right:2px}.logo>span{font-size:20px;font-family:"Oswald",sans-serif;letter-spacing:-.8px}.search-box{width:70%;max-width:600px}.search-form{display:flex;justify-content:center;height:30px}.search-form>input{padding-left:8px;outline:none;width:100%;height:100%;border:1px solid #d3d3d3;border:1px solid var(--search-form-border-color);border-radius:2px 0 0 2px;font-size:16px}.search-form>.search-btn{min-width:64px;border:1px solid #d3d3d3;border:1px solid var(--search-form-border-color);border-left:none;border-radius:0 2px 2px 0;background-color:#fff;font-size:14px}.search-form>.back-btn,.search-form>.search-btn{height:100%;color:#999;color:var(--search-btn-color)}.search-form>.back-btn{display:none;font-size:16px;margin-right:32px;margin-right:calc(var(--item-margin)*2)}.top-bar{display:flex;align-items:center}.top-bar>.avatar-btn{width:30px;height:30px;border-radius:50%;padding-top:6px;font-size:24px;color:#fff;overflow:hidden;background-color:#4169e1}.top-bar>.search-btn{display:none;color:#606060;color:var(--gray-color);font-size:20px;margin-right:32px;margin-right:calc(var(--item-margin)*2)}.content{margin-top:24px;position:relative;top:56px;align-items:flex-start;justify-content:space-between}.content,.item-list{width:100%;display:flex;flex-wrap:wrap}.item-list{padding-left:16px;padding-left:var(--item-margin);padding-right:16px;padding-right:var(--item-margin);justify-content:flex-start}.sentinel{position:absolute;transform:translateY(-300px);bottom:0;z-index:1}.item{width:25%;width:calc(100%/var(--pc-item-per-row))}.item-box{margin-left:8px;margin-left:calc(var(--item-margin)/2);margin-right:8px;margin-right:calc(var(--item-margin)/2);margin-bottom:40px;cursor:pointer}.item-box:hover div:first-child{opacity:.7}.meta{display:flex;flex-direction:column;padding-right:30px}.channel-title,.meta-data{font-size:14px;color:#606060;color:var(--gray-color);line-height:1.4}.meta-data>span:last-child:before{content:" • "}.title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-weight:700;line-height:1.2;margin-top:12px;margin-bottom:4px;margin-bottom:calc(var(--item-margin)/4)}.content.on-player .item{width:100%}.content.on-player>.item-list{width:422px;width:var(--on-player-item-list-width);padding:0}.content.on-player .item-box{margin:0 0 8px;display:flex;align-items:flex-start}.content.on-player .item-box>div:first-child{width:40%}.content.on-player .item-box>.meta{width:60%;margin-left:8px}.content.on-player .item-box>.meta>.title,.content.on-player .video-info .title{margin:0}.player-box{width:calc(100% - 422px);width:calc(100% - var(--on-player-item-list-width))}.player-video-box,.video-info-box{padding:0 24px;padding:0 calc(var(--item-margin) + var(--item-margin)/2)}.player-video{position:relative;height:0;padding-bottom:56.25%}.player-video>iframe{position:absolute;left:0;top:0;width:100%;height:100%;border:none}.video-info{position:relative;padding-right:30px}.video-info:after{content:"";height:1px;width:100%;position:absolute;background-color:#d1d1d1}.video-info>div{display:flex;align-items:center;justify-content:space-between;margin:16px 0;margin:var(--item-margin) 0}.video-info .meta-data{font-size:15px}.video-info .title{font-size:20px;font-weight:600;padding-top:20px}.like-disLike>button{font-size:15px;color:#606060;color:var(--gray-color);font-weight:600;margin-left:26px}.video-meta{padding-top:16px;padding-top:var(--item-margin);display:flex;justify-content:flex-start;position:relative}.video-meta span:last-child{margin-bottom:16px;margin-bottom:var(--item-margin)}.meta-thumb{padding-top:4px;margin-right:16px;text-align:center;font-size:34px;color:#fff;width:48px;width:var(--meta-thumb-width);height:48px;height:var(--meta-thumb-width);border-radius:50%;background-color:#4169e1}.video-meta>.meta{width:calc(100% - 64px);width:calc(100% - var(--meta-thumb-width) - 16px);line-height:1.6;margin-top:12px;text-overflow:ellipsis}.video-meta>.meta>span:first-child{font-weight:600;margin-bottom:24px}.video-meta>.meta>span:last-child{white-space:pre-wrap;overflow-wrap:break-word}@media screen and (min-width:1760px){.item{width:20%;width:calc(100%/var(--wide-pc-item-per-row))}}@media screen and (max-width:1024px){.item{width:33.33333%;width:calc(100%/var(--tablet-item-per-row))}.player-box{width:100%}.content.on-player>.item-list{width:100%;padding-left:16px;padding-left:var(--item-margin);padding-right:16px;padding-right:var(--item-margin);margin-top:20px}.content.on-player .video-meta:after{content:"";height:1px;width:100%;position:absolute;bottom:0;background-color:#d1d1d1}}@media screen and (max-width:768px){.header{box-shadow:0 2px 5px 3px rgba(0,0,0,.1)}.content{margin-top:0}.item{width:50%;width:calc(100%/var(--mobile-item-per-row))}.search-box{display:none;position:absolute;top:0;left:0;z-index:999;height:100%;width:100%;max-width:100%;background-color:#fff;padding:0 8px;padding:0 calc(var(--item-margin)/2);padding-top:13px}.on-search-box.search-box{display:block}.search-form>input{width:60%}.search-form>.back-btn,.top-bar>.search-btn{display:block}.player-video-box{padding:0}.video-info-box{padding:0 16px;padding:0 calc(var(--item-margin))}}@media screen and (max-width:576px){.content.on-player .item-list,.item-list{padding:0}.item{width:100%}.item-box{margin:0}.item-box>.meta{margin-left:8px;margin-bottom:12px}.video-info{padding-right:0}h1.title{font-size:18px}.like-disLike>button{font-weight:500;margin-left:10px}}
/*# sourceMappingURL=main.ef19f937.chunk.css.map */