/* Scene browsing follows the site's cream/charcoal palette and approved mascot family. */
.template-browser.template-explorer{--te-bg:#f7f5ef;--te-ink:#242424;--te-muted:#727175;--te-soft:#eeece6;--te-line:#24242416;width:min(1120px,calc(100vw - 48px));height:min(860px,calc(100dvh - 48px));max-width:none;max-height:none;margin:auto;padding:0!important;border:0!important;border-radius:30px;background:var(--te-bg)!important;color:var(--te-ink)!important;box-shadow:0 30px 120px #0006;overflow:hidden;font:400 15px/1.5 Inter,sans-serif}
html[data-theme=dark] .template-explorer{--te-bg:#17171a;--te-ink:#f7f5ef;--te-muted:#aaa9b1;--te-soft:#242428;--te-line:#f7f5ef20}.template-explorer:not([open]){display:none!important}.template-explorer[open]{display:flex;flex-direction:column;animation:te-arrive .24s cubic-bezier(.2,0,0,1)}.template-explorer::backdrop{background:#0e1011b0;backdrop-filter:blur(5px)}.template-explorer *{box-sizing:border-box}.template-explorer [hidden]{display:none!important}.template-explorer button,.template-explorer input,.template-explorer select{font:inherit;color:inherit}.template-explorer button{border:0;cursor:pointer}.template-explorer button:disabled{opacity:.4;cursor:default}.template-explorer svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}.template-explorer :is(button,input,select):focus-visible{outline:2px solid #9aaef0;outline-offset:3px}.template-explorer button:active{scale:.96}.template-explorer button{transition:background .18s,box-shadow .18s,scale .18s}
.te-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 28px 20px;flex:none;background:transparent;position:relative;border:0}.te-heading{display:flex;align-items:center;gap:16px}.te-heading>img{width:58px;height:58px;object-fit:contain;transition:rotate .35s,scale .35s}.te-heading:hover>img{rotate:-9deg;scale:1.08}.template-explorer .te-heading h2{font:500 36px/1.1 Inter,sans-serif;letter-spacing:-.055em;margin:0 0 6px}.te-heading h2 em{font:italic 400 1.13em/1 'Instrument Serif',serif}.te-heading p{font:400 13px/1.5 Inter,sans-serif;color:var(--te-muted);margin:0}.template-explorer .te-round{display:grid;place-items:center;width:42px;height:42px;padding:0;border-radius:50%;background:var(--te-soft);flex:none}.te-browse{display:flex;flex-direction:column;min-height:0;flex:1}.te-tools{display:flex;align-items:center;gap:12px;margin:0 28px 16px;flex:none}.te-search{display:flex;align-items:center;gap:12px;min-width:0;flex:1;border-radius:18px;min-height:54px;padding:6px 11px 6px 17px;margin:0;background:var(--te-soft);box-shadow:inset 0 0 0 1px var(--te-line)}.te-search:focus-within{box-shadow:inset 0 0 0 2px #9aaef0}.te-search>svg{color:var(--te-muted)}.template-explorer .te-search input{min-width:0;width:100%;padding:8px 0;background:none;border:0;outline:0;box-shadow:none;appearance:none;font-size:15px}.te-search input::placeholder{color:var(--te-muted)}.te-search input::-webkit-search-cancel-button{display:none}.template-explorer .te-clear{width:34px;height:34px;background:transparent}.template-explorer .te-surprise{display:flex;align-items:center;gap:10px;min-height:54px;white-space:nowrap;padding:12px 20px;border-radius:18px;background:linear-gradient(120deg,#edb5d23a,#c7b3e835);box-shadow:inset 0 0 0 1px #c7b3e830;font-size:14px}.te-surprise:hover{box-shadow:inset 0 0 0 1px #c7b3e8}.te-surprise:hover svg{rotate:15deg}.te-surprise svg{transition:rotate .25s}
.te-filter-bar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:0 28px 13px;flex:none}.te-collections,.te-selects{display:flex;align-items:center;gap:7px}.template-explorer .te-collections button{display:flex;align-items:center;gap:7px;min-height:42px;padding:9px 14px;border-radius:30px;background:transparent;font-size:13px;color:var(--te-muted)}.te-collections button[aria-pressed=true]{background:var(--te-ink);color:var(--te-bg)}.te-collections button>span{font-size:10px;opacity:.7}.te-collections svg{width:16px;height:16px}.te-select{display:flex;align-items:center;gap:7px;padding:0 11px;background:var(--te-soft);border-radius:30px;min-width:0;height:42px;position:relative}.te-select>svg{width:17px;height:17px;pointer-events:none}.te-select>svg:last-child{width:13px;height:13px}.template-explorer .te-select select{position:relative;appearance:none;border:0;outline:0;box-shadow:none;background:transparent;cursor:pointer;padding:9px 0;font-size:12px;max-width:135px;min-width:80px;height:42px}.te-select:focus-within{box-shadow:0 0 0 2px #9aaef0}.te-select option{background:var(--te-bg);color:var(--te-ink)}.te-moods{display:flex;gap:8px;overflow:auto;scrollbar-width:none;padding:2px 28px 13px;flex:none}.te-moods::-webkit-scrollbar{display:none}.template-explorer .te-moods button{flex:none;display:flex;align-items:center;gap:5px;min-height:42px;padding:7px 12px 7px 8px;border-radius:28px;background:transparent;box-shadow:inset 0 0 0 1px var(--te-line);font-size:12px;--mood:#c7b3e8}.te-moods button:first-child{padding-inline:16px}.te-moods img{width:31px;height:27px;object-fit:contain;transition:rotate .28s,scale .28s}.te-moods button:hover img{rotate:-12deg;scale:1.15}.te-moods button[aria-pressed=true]{background:color-mix(in srgb,var(--mood) 17%,var(--te-bg));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mood) 75%,transparent)}.te-results-bar{display:flex;justify-content:space-between;align-items:center;min-height:35px;padding:0 28px 10px;font-size:12px;color:var(--te-muted);flex:none}.template-explorer .te-reset{padding:0 4px;background:none;font-size:12px;color:var(--te-ink);min-height:30px;text-decoration:underline;text-underline-offset:4px}
.te-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 28px 25px;scrollbar-width:thin;scrollbar-color:var(--te-line) transparent}.te-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:25px 17px}.te-card{min-width:0;animation:te-card-in .28s ease-out both}.te-cover{position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:21px;background:var(--te-soft);isolation:isolate}.te-poster,.te-hover-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 24%;border-radius:inherit}.te-poster{transition:scale .45s cubic-bezier(.2,0,0,1),filter .3s}.te-hover-video{opacity:0;z-index:1;transition:opacity .25s;pointer-events:none}.te-card[data-playing=true] .te-hover-video{opacity:1}.te-cover::after{content:'';position:absolute;inset:55% 0 0;z-index:2;background:linear-gradient(transparent,#0009);pointer-events:none}.template-explorer .te-preview{position:absolute;inset:0;z-index:3;display:grid;place-items:center;width:100%;height:100%;padding:0;background:transparent;border-radius:inherit}.te-play{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#f7f5efee;color:#242424;opacity:0;scale:.85;transition:opacity .2s,scale .3s}.te-play svg{width:18px;height:18px;fill:currentColor;stroke-width:0;margin-left:2px}.te-card:hover .te-play,.te-card:focus-within .te-play{opacity:1;scale:1}.te-card[data-playing=true] .te-play{opacity:0}.te-card:hover .te-poster{scale:1.025}.te-card-mascot{position:absolute;left:12px;top:12px;z-index:4;display:grid;place-items:center;width:38px;height:38px;background:var(--te-bg);border-radius:13px;pointer-events:none;opacity:0;translate:0 3px;transition:opacity .2s,translate .2s}.te-card-mascot img{width:30px;height:30px;object-fit:contain}.te-card:hover .te-card-mascot,.te-card:focus-within .te-card-mascot{opacity:1;translate:0 0}.template-explorer .te-card-save{position:absolute;right:10px;top:10px;z-index:4;width:35px;height:35px;background:var(--te-bg);color:var(--te-ink);opacity:0;translate:0 3px;transition:opacity .2s,translate .2s,scale .2s}.te-card-save svg{width:17px;height:17px}.te-card:hover .te-card-save,.te-card:focus-within .te-card-save,.te-card-save[aria-pressed=true]{opacity:1;translate:0 0}.te-card-save[aria-pressed=true] svg,.te-save-detail[aria-pressed=true] svg{fill:currentColor}.te-time,.te-card-kind{position:absolute;bottom:12px;z-index:4;font-size:11px;line-height:1.2;color:#fff;pointer-events:none;text-shadow:0 1px 3px #0006}.te-time{right:12px;font-variant-numeric:tabular-nums}.te-card-kind{left:13px;max-width:75%}.te-card-copy{padding:11px 3px 0}.template-explorer .te-card-copy h3{font:500 16px/1.35 Inter,sans-serif;letter-spacing:-.025em;margin:0 0 8px}.te-card-copy h3 button{padding:0;background:transparent;text-align:left}.te-card-copy>div{display:flex;align-items:center;justify-content:space-between;gap:8px}.te-credit{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--te-muted)}.te-credit img{width:24px;height:24px;object-fit:cover;border-radius:50%}.template-explorer .te-add{width:31px;height:31px;background:var(--te-soft)}.te-add svg{width:16px;height:16px}.te-add:hover{background:color-mix(in srgb,var(--mood) 30%,var(--te-soft))}.te-more{display:flex;justify-content:center;padding:26px 0 0}.template-explorer .te-more button,.template-explorer .te-empty button{display:flex;align-items:center;gap:10px;min-height:44px;background:var(--te-soft);padding:10px 22px;border-radius:30px;font-size:13px}.te-foot{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--te-line);padding:12px 28px;font-size:11px;color:var(--te-muted);flex:none}.te-empty{text-align:center;display:flex;align-items:center;flex-direction:column;padding:20px 10px 30px}.te-empty>img{width:90px;height:90px;object-fit:contain}.template-explorer .te-empty h3{font:500 25px/1.3 Inter,sans-serif;letter-spacing:-.03em;margin:10px 0}.te-empty>p{max-width:340px;font-size:14px;color:var(--te-muted);margin:0 0 20px}
.te-detail{display:flex;flex-direction:column;min-height:0;flex:1}.te-detail-nav{display:flex;justify-content:space-between;align-items:center;padding:0 28px 16px;flex:none}.te-detail-nav>div{display:flex;gap:8px}.template-explorer .te-back{display:flex;align-items:center;gap:6px;padding:8px 0;background:none;min-height:42px;font-size:13px}.te-detail-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 28px 28px}.te-detail-layout{display:grid;grid-template-columns:1.05fr 1fr;gap:35px;align-items:center}.te-stage{display:grid;place-items:center;padding:18px;border-radius:24px;min-width:0;background:radial-gradient(ellipse at 90% 5%,color-mix(in srgb,var(--mood) 30%,transparent),transparent 65%),var(--te-soft);position:relative}.te-stage video{width:100%;max-height:565px;height:min(61dvh,565px);aspect-ratio:9/16;object-fit:contain;border-radius:16px;background:#101215;display:block}.te-video-error{position:absolute;bottom:25px;left:25px;right:25px;background:#17171a;color:#f7f5ef;font-size:12px;padding:10px;border-radius:10px}.te-personality{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--te-muted);flex-wrap:wrap}.te-personality img{width:32px;height:32px;object-fit:contain}.te-personality>span{border-left:1px solid var(--te-line);padding-left:10px;margin-left:3px}.template-explorer .te-detail-copy h3{font:500 clamp(28px,3.5vw,42px)/1.1 Inter,sans-serif;letter-spacing:-.045em;margin:15px 0}.te-description{font-size:16px;line-height:1.65;color:var(--te-muted);margin:0 0 23px}.te-performer{display:flex;align-items:center;gap:12px}.te-performer>img{width:48px;height:48px;object-fit:cover;border-radius:50%}.te-performer>div{display:flex;flex-direction:column;gap:3px}.te-performer strong{font-size:14px;font-weight:500}.te-performer span{font-size:12px;color:var(--te-muted)}.te-specs{display:flex;gap:8px;margin:20px 0}.te-specs span{font-size:11px;color:var(--te-muted);border:1px solid var(--te-line);border-radius:20px;padding:5px 10px}.te-detail-actions{display:flex;gap:9px}.template-explorer .te-use,.template-explorer .te-save-detail{display:flex;align-items:center;justify-content:center;gap:8px;min-height:49px;padding:11px 18px;border-radius:30px;font-size:14px;background:var(--te-ink);color:var(--te-bg)}.template-explorer .te-save-detail{background:var(--te-soft);color:var(--te-ink)}.te-availability{font-size:11px;line-height:1.65;color:var(--te-muted);max-width:315px;margin:15px 0 25px}.te-related>p{font-size:12px;color:var(--te-muted);margin:0 0 12px}.te-related>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.template-explorer .te-related button{background:transparent;text-align:left;min-width:0;padding:0}.te-related img{width:100%;height:91px;object-fit:cover;object-position:50% 25%;border-radius:13px;transition:filter .2s}.te-related button:hover img{filter:brightness(1.15)}.te-related span{display:block;font-size:10px;line-height:1.5;margin-top:5px}
@keyframes te-arrive{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}@keyframes te-card-in{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
@media(max-width:1000px){.te-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.te-moods{gap:6px}.te-moods button{padding-inline:9px}.te-detail-layout{gap:24px}}
@media(max-width:760px){.template-browser.template-explorer{width:calc(100vw - 20px);height:calc(100dvh - 24px);border-radius:24px}.te-head{padding:19px 17px 17px;gap:8px}.te-heading{gap:10px}.te-heading>img{width:41px;height:41px}.template-explorer .te-heading h2{font-size:28px}.te-heading p{font-size:11px}.te-tools{margin:0 16px 13px;gap:8px}.te-search{min-height:49px;padding-left:12px;gap:7px}.template-explorer .te-search input{font-size:16px}.template-explorer .te-surprise{min-height:49px;padding:10px 13px;border-radius:16px}.te-surprise>span{display:none}.te-filter-bar{flex-wrap:wrap;padding:0 16px 10px;gap:10px}.te-collections{gap:4px}.te-selects{gap:6px;flex:1;justify-content:flex-end}.template-explorer .te-collections button{font-size:12px;padding:9px 11px;min-height:40px}.te-select{padding-inline:9px;gap:5px;height:40px}.template-explorer .te-select select{font-size:12px;max-width:94px;min-width:58px;height:40px}.te-select>svg{width:15px;height:15px}.te-moods{padding:2px 16px 10px;gap:6px}.template-explorer .te-moods button{font-size:12px;min-height:40px;padding:6px 11px 6px 6px}.te-moods img{width:29px;height:26px}.te-moods button:first-child{padding-inline:13px}.te-results-bar{padding:0 16px 8px;font-size:11px;min-height:30px}.te-scroll{padding:0 16px 22px}.te-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}.te-cover{border-radius:17px}.te-card-mascot{display:none}.template-explorer .te-card-save{opacity:1;translate:none;width:30px;height:30px;top:8px;right:8px;background:var(--te-bg)}.te-play{width:35px;height:35px}.te-card-copy{padding:9px 0 0}.template-explorer .te-card-copy h3{font-size:14px;margin-bottom:7px}.te-card-kind,.te-time{font-size:10px;bottom:10px}.te-card-kind{left:10px;max-width:70%}.te-time{right:10px}.te-credit{font-size:11px;gap:5px}.te-credit img{width:21px;height:21px}.te-foot{padding:11px 16px;font-size:10px}.te-hint{font-size:0}.te-hint::after{content:'Tap a scene to explore';font-size:10px}.te-detail-nav{padding:0 17px 14px}.te-detail-layout{grid-template-columns:1fr;gap:22px}.te-detail-scroll{padding:0 17px 25px}.te-stage{padding:12px;border-radius:21px}.te-stage video{height:min(43dvh,365px);max-height:none;width:auto;max-width:100%}.template-explorer .te-detail-copy h3{font-size:29px;margin:11px 0}.te-description{font-size:15px;margin-bottom:18px}.te-detail-actions{position:sticky;bottom:0;background:var(--te-bg);padding:10px 0}.te-use{flex:1}.te-availability{margin-top:8px}.te-related img{height:110px}.te-related span{font-size:11px}}
@media(max-width:450px){.te-filter-bar{flex-wrap:nowrap;align-items:flex-start}.te-collections{flex-wrap:wrap;gap:2px;max-width:90px}.te-collections button{width:100%;justify-content:center}.te-selects{flex-wrap:wrap}.te-select{width:100%;max-width:190px}.template-explorer .te-select select{max-width:none;flex:1}.te-tools{gap:7px}.te-search>svg{width:17px}.te-heading p{max-width:190px}.te-detail-copy .te-performer>img{width:42px;height:42px}}
@media(hover:none){.te-card-save{opacity:1;translate:0 0}.te-play{opacity:.9;scale:1;width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.template-explorer[open],.te-card{animation:none}.template-explorer *{transition:none!important;scroll-behavior:auto!important}}
/* Override the base form's stacked labels and the page paragraph reset. */
.template-explorer .te-select{flex-direction:row}.template-explorer .te-description{margin:0 0 23px}.template-explorer .te-availability{margin:15px 0 25px}.template-explorer .te-related>p{margin:0 0 12px}.template-explorer .te-empty>p{margin:0 0 20px}.template-explorer .te-round:hover{box-shadow:inset 0 0 0 1px var(--te-line)}
@media(max-width:760px){.template-explorer .te-description{margin-bottom:18px}.template-explorer .te-availability{margin:8px 0 23px}}