/* Category photography belongs only to the session library. */
.app-page #sessionList{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px;position:relative;height:auto!important;overflow:visible;isolation:auto}
.app-page #sessionList .photo-category{min-width:0}
.app-page #sessionList .photo-category[hidden],.app-page #sessionList .ses[hidden]{display:none!important}
.app-page #sessionList .category-photo{aspect-ratio:3/2;background-image:url('category-cinematic-v2.png');background-size:400% 400%;background-repeat:no-repeat;border-radius:4px;margin-bottom:14px;background-color:#243128}
.app-page #sessionList .photo-category h3{font-size:20px;font-weight:500;line-height:1.3;letter-spacing:-.3px;color:#f1eae3;margin:0 0 10px}
.app-page #sessionList .ses{position:relative!important;inset:auto!important;transform:none!important;width:100%!important;min-height:76px!important;height:auto!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;text-align:left!important;gap:12px!important;padding:13px 0!important;margin:0!important;border:0!important;border-bottom:1px solid #bba38e24!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.app-page #sessionList .ses:last-child{border-bottom:0!important}
.app-page #sessionList .ses::before,.app-page #sessionList .ses::after{display:none!important}
.app-page #sessionList .s-body{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;text-align:left!important;gap:5px!important;width:auto!important;min-width:0;flex:1}
.app-page #sessionList .s-title{font-size:15px!important;font-family:inherit!important;line-height:1.35!important;letter-spacing:0!important;font-weight:400!important;text-shadow:none!important;max-width:100%;overflow-wrap:anywhere}
.app-page #sessionList .session-category{display:none!important}
.app-page #sessionList .s-meta{font-size:10px!important;letter-spacing:.2px;line-height:1.4;color:#b9aaa1!important}
.app-page #sessionList .access-tag{position:static!important;font-size:10px;line-height:1.3;color:#bdc8b4!important;letter-spacing:0!important}
.app-page #sessionList .play-ico{font-size:0!important;padding:0!important;width:29px;height:29px;min-height:29px!important;flex:0 0 29px;border:1px solid #c2a18380!important;border-radius:50%;display:flex;align-items:center;justify-content:center;align-self:center!important;position:relative}
.app-page #sessionList .play-ico::after{content:'';border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid #f1eae3;margin-left:2px}
.app-page #sessionList .ses:hover{background:#e0c4a709!important}
.app-page #sessionList .ses.playing .play-ico{background:#c8a176;border-color:#c8a176!important}
.app-page #sessionList .ses.playing .play-ico::after{border-left-color:#201810}
.app-page #sessionList .deep-flag{font-size:8px;margin-left:6px;letter-spacing:.6px}
@media(max-width:1000px){.app-page #sessionList{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}}
@media(max-width:600px){.app-page #sessionList{grid-template-columns:1fr;gap:30px}.app-page #sessionList .s-title{font-size:16px!important}.app-page #sessionList .photo-category h3{font-size:21px}.app-page #sessionList .s-meta{font-size:11px!important}}

/* Cinematic category imagery, inspired by the creator's photographic direction. */
.app-page #sessionList{gap:42px 28px}
.app-page #sessionList .category-photo{position:relative;aspect-ratio:3/2;border-radius:2px;margin-bottom:8px;isolation:isolate;background-color:#191615}
.app-page #sessionList .category-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 24%,rgba(12,10,10,.12) 45%,rgba(12,10,10,.86) 100%);z-index:-1}
.app-page #sessionList .photo-category h3{position:absolute;bottom:19px;left:20px;right:18px;margin:0;color:#fff9f3;font-family:Arial,Helvetica,sans-serif;font-size:24px;font-weight:400;line-height:1.12;letter-spacing:-.5px;text-shadow:0 2px 18px #0008;max-width:15ch}
.app-page #sessionList .ses{border-bottom-color:#d5b7a622!important;padding:14px 2px!important}
.app-page #sessionList .s-title{color:#f5ede7!important}
.app-page #sessionList .s-meta{color:#b8aaa4!important}
.app-page #sessionList .access-tag{color:#d8bca8!important}
.app-page #sessionList .play-ico{border-color:#d4b7a065!important}
.app-page #sessionList .ses:hover{background:#dfb4940a!important}
.app-page #sessionList .ses.playing .play-ico{background:#d7bba5;border-color:#d7bba5!important}
@media(max-width:600px){.app-page #sessionList{gap:36px}.app-page #sessionList .photo-category h3{font-size:27px;bottom:22px;left:22px}}

/* Images dissolve on all four sides; one mask applies to every category. */
.app-page #sessionList{gap:40px 32px}
.app-page #sessionList .category-photo{background:none;overflow:visible;border-radius:0;isolation:isolate;aspect-ratio:3/2;margin-bottom:0}
.app-page #sessionList .category-photo::after{display:none}
.app-page #sessionList .category-image{position:absolute;inset:-8px 0 0;background-image:url('category-cinematic-v2.png');background-size:400% 400%;background-repeat:no-repeat;filter:saturate(.65) brightness(.84);mask-image:linear-gradient(90deg,transparent 2%,#000 24%,#000 76%,transparent 98%),linear-gradient(180deg,transparent 2%,#000 25%,#000 57%,transparent 98%);mask-composite:intersect;-webkit-mask-image:linear-gradient(90deg,transparent 2%,#000 24%,#000 76%,transparent 98%),linear-gradient(180deg,transparent 2%,#000 25%,#000 57%,transparent 98%);-webkit-mask-composite:source-in;z-index:-1}
.app-page #sessionList .photo-category h3{bottom:21px;left:10px;right:10px;font-size:25px;max-width:17ch;line-height:1.15;text-shadow:0 2px 8px #000,0 0 24px #0009}
.app-page #sessionList .ses{border-bottom-color:#d5b7a614!important}
@media(max-width:600px){.app-page #sessionList{gap:32px}.app-page #sessionList .photo-category h3{font-size:27px;left:12px;bottom:24px}}
