/* Visitor-only production design. Admin styles remain separate. */
:root{--bg:var(--c-paper,#17191b);--panel:var(--c-panel,#232321);--line:var(--c-line,#444440);--text:var(--c-ink,#f0e9dd);--muted:var(--c-muted,#b3b0a5);--accent:var(--c-accent,#bea16f);--ink:var(--c-paper,#17191b);--green:var(--c-tone);background:var(--bg);color:var(--text)}
body{background:var(--bg);color:var(--text)}::selection{background:var(--accent);color:var(--bg)}
.header{height:76px;background:var(--bg);border-color:var(--line);backdrop-filter:blur(18px)}
.visitor-fixed-sidebar .header-inner{max-width:none;padding:0 28px;gap:24px}
.header-caption{font-size:9px;letter-spacing:2px;color:var(--muted)}.header-actions>a{font-size:11px;white-space:nowrap}
.brand.brand-logo{position:relative;width:110px;display:block}.brand.brand-logo img{width:110px;height:auto;max-height:62px;mix-blend-mode:normal}
.logo-wordmark{position:absolute;inset:0;background:var(--text);mask:url('/assets/yunque-logo-transparent.png') center/contain no-repeat;clip-path:polygon(69% 55%,100% 55%,100% 84%,63% 84%,63% 75%,69% 75%);pointer-events:none}
.visitor-fixed-sidebar .hero.shell,.visitor-fixed-sidebar .library.shell,.visitor-fixed-sidebar .footer.shell{width:auto;margin-left:246px;margin-right:28px}
.hero.shell{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1.2fr);gap:clamp(24px,3vw,52px);align-items:center;margin-top:22px;padding:24px clamp(20px,3.2vw,60px) 30px;min-height:420px;height:auto;background:none}
.hero .hero-copy{container-type:inline-size;width:100%;max-width:520px;min-width:0;padding:0;display:block}
.hero .eyebrow{font-size:clamp(9px,2.5cqw,12px);letter-spacing:.16em;color:var(--muted);line-height:1.6}.hero .live-dot{display:none}
.hero h1{font-size:clamp(38px,18cqw,84px);font-weight:400;line-height:1.22;letter-spacing:-.025em;margin:22px 0 24px;white-space:nowrap}.hero h1 .italic-word{color:var(--c-tone)}
.hero p{font-size:clamp(12px,3.7cqw,16px);line-height:1.95;margin:0;letter-spacing:.015em;color:var(--muted)}
.library.shell{padding-top:18px}.library-layout{display:block}.work-area{min-width:0}
.library .frozen-sidebar{position:fixed;top:calc(var(--site-header-height,76px) + 24px);bottom:20px;height:calc(100dvh - var(--site-header-height,76px) - 44px);left:26px;width:192px;min-height:0;display:flex;flex-direction:column;padding:0 18px 0 0;background:var(--bg);border-color:var(--line);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;z-index:10}
.frozen-sidebar>*{flex-shrink:0}.frozen-sidebar #library-title{font-size:28px;line-height:1.5;font-weight:400;letter-spacing:.5px;white-space:normal}.frozen-sidebar #library-heading{margin-bottom:28px}.frozen-sidebar .eyebrow{font-size:8px;color:var(--muted);letter-spacing:1.5px}
.frozen-sidebar .filter-controls{width:100%;padding-bottom:28px}.filter-head{font-size:11px;padding-bottom:16px}.quiet-button{color:var(--muted)}
.filter-dropdown{border-color:var(--line);background:var(--panel);border-radius:5px;transition:border-color .4s,box-shadow .4s}
.frozen-sidebar .filter-trigger{min-height:76px;padding:16px 12px}.filter-trigger-title{font-size:12px!important;font-weight:400;letter-spacing:0!important}.filter-trigger-title small{display:none}.filter-selection{color:var(--muted);font-size:11px}.filter-chevron{color:var(--accent);font-size:15px;transition:transform .42s cubic-bezier(.16,1,.3,1)}
.filter-trigger:hover,.is-open>.filter-trigger{background:var(--c-selected)}.filter-trigger.has-selection .filter-selection{color:var(--text);font-weight:400}.filter-panel{background:var(--panel);border-color:var(--line);max-height:230px;animation:none}.filter-options button{font-size:11px;min-height:36px}.filter-options button>span{color:var(--muted)}.filter-options button:hover,.filter-options button.active{color:var(--text);background:var(--c-selected)}.is-open{border-color:var(--c-rim)}
.frozen-sidebar .sidebar-contact{margin-top:auto;width:100%;padding-top:18px;border-color:var(--line)}.sidebar-contact .contact-actions{gap:12px}.sidebar-contact .contact-actions p,.sidebar-contact .contact-actions a,.sidebar-contact .contact-actions button{font-size:11px;color:var(--text)}.sidebar-contact .contact-actions>span{color:var(--muted);font-size:10px}
.brand-filter-bar{top:var(--site-header-height,76px);padding:14px 0 0;background:var(--bg);border-color:var(--line);box-shadow:0 8px 12px -12px var(--c-shadow)}.brand-filter-heading{margin-bottom:8px}.brand-filter-heading h2{font-size:16px;color:var(--text)}.library-toolbar>p,.library-toolbar>p span{color:var(--muted)}.library-toolbar strong{color:var(--text)}
.search,.sort-label select{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:999px}.search input{color:var(--text);width:155px}.search input::placeholder{color:var(--muted)}.search:focus-within{border-color:var(--accent)}
.brand-tabs{gap:8px;padding:6px 5px 12px;isolation:isolate;border-color:var(--line)}.brand-tabs button{border:1px solid transparent;min-height:38px;padding:9px 15px;border-radius:999px;color:var(--muted);font-size:11px;isolation:isolate;transition:transform .42s cubic-bezier(.16,1,.3,1),box-shadow .35s,color .25s;transform:scale(1)}
.brand-tabs button::before{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(ellipse at var(--glass-x,25%) 0%,var(--c-glint),transparent 70%),linear-gradient(125deg,var(--c-glass),var(--c-selected));border:1px solid var(--c-rim);box-shadow:inset 0 1px 0 var(--c-glint);backdrop-filter:blur(16px) saturate(1.45);opacity:0;transition:opacity .32s}.brand-tabs button:hover,.brand-tabs button:focus-visible{transform:scale(1.065);color:var(--text);box-shadow:0 4px 12px var(--c-shadow)}.brand-tabs button:hover::before,.brand-tabs button:focus-visible::before{opacity:1}.brand-tabs button.active{background:var(--c-selected);border-color:var(--c-rim);color:var(--text)}.brand-tabs button>span{color:var(--muted)}
.case-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:28px 18px}.card-image{aspect-ratio:3/4;background:var(--panel);border:1px solid var(--line);border-radius:8px;transition:box-shadow .4s,transform .4s}.card-image img{object-fit:contain}.card-open:hover .card-image{box-shadow:0 8px 24px var(--c-shadow);transform:translateY(-3px)}.card-copy h3{color:var(--text)}.card-open:hover h3{color:var(--accent)}.card-copy p,.card-share,.card-details,.link-pending{color:var(--muted)}.card-copy p i{background:var(--muted)}.card-actions{border-color:var(--line)}.watch-link{color:var(--c-tone)}.card-badge.featured{background:var(--accent);color:var(--bg)}.card-duration{background:#17191bb8;color:#f0e9dd}
.load-more{border-color:var(--line);color:var(--text)}.load-more:hover{background:var(--c-selected)}.load-area>span,.footer,.footer a{color:var(--muted)}.footer{border-color:var(--line)}.empty-state{background:var(--panel);border-color:var(--line)}.button{background:var(--accent);color:var(--bg)}.button:hover{background:var(--c-tone)}
.case-dialog{background:var(--bg);color:var(--text);border:1px solid var(--line)}.dialog-top,.detail-rule,.detail-copy dl,.detail-pagination{border-color:var(--line)}.dialog-top>span,.detail-copy p,.small-label,.detail-copy dt,.detail-pagination span,#watch-note{color:var(--muted)}.detail-media{background:var(--panel)}.detail-copy h2,.detail-copy dd{color:var(--text)}.detail-copy .eyebrow{color:var(--accent)}.detail-rule{background:var(--line)}.demo-disclosure{background:var(--panel);border-color:var(--line)}.detail-pagination button{border-color:var(--line);color:var(--text)}.share-body textarea{background:var(--panel);color:var(--text);border-color:var(--line)}.toast{background:var(--text);color:var(--bg)}
body,.header,.brand-filter-bar,.frozen-sidebar,.filter-dropdown,.case-dialog{transition:background-color .32s,color .32s,border-color .32s}
.lark-art{grid-column:2;grid-row:1/4;position:relative;min-width:0;align-self:center;width:100%;border-radius:28px;background:radial-gradient(ellipse at 54% 50%,#e2eddf66,transparent 65%);isolation:isolate}.lark-art svg{display:block;width:100%;height:auto;overflow:visible}.art-caption{position:absolute;bottom:7%;left:20%;font-family:"SimSun",serif;font-size:11px;color:#799482;letter-spacing:3px}.lark-art button{position:absolute;right:8%;bottom:6%;border:1px solid #c6d6ca88;border-radius:99px;padding:5px 9px;font-size:8px;color:#799482;background:#ffffff40;opacity:.3;transition:opacity .25s}.lark-art:hover button,.lark-art button:focus-visible{opacity:1}.lark-float{transform-box:fill-box;transform-origin:center;animation:lark-drift 7.5s cubic-bezier(.45,0,.55,1) infinite}.far-wing{transform-box:fill-box;transform-origin:90% 90%;animation:wing-breath 7.5s cubic-bezier(.45,0,.55,1) infinite}.main-wing{transform-box:fill-box;transform-origin:80% 90%;animation:wing-breath 7.5s cubic-bezier(.45,0,.55,1) -.5s infinite}.light-path{stroke-dasharray:65 680;animation:light-flight 7s cubic-bezier(.4,0,.25,1) infinite}.sparkles{animation:light-breathe 5s ease-in-out infinite}.echo-rings{animation:light-breathe 7s ease-in-out infinite}.aura{transform-box:fill-box;transform-origin:center;animation:aura-breathe 8s ease-in-out infinite}.lark-art.is-paused *{animation-play-state:paused!important}@keyframes lark-drift{0%,100%{transform:translate(0,4px) rotate(-1deg)}50%{transform:translate(6px,-9px) rotate(1deg)}}@keyframes wing-breath{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-3deg)}}@keyframes light-flight{0%{stroke-dashoffset:730;opacity:0}15%{opacity:.75}85%{opacity:.75}100%{stroke-dashoffset:-50;opacity:0}}@keyframes light-breathe{0%,100%{opacity:.3}50%{opacity:.75}}@keyframes aura-breathe{0%,100%{transform:scale(.97);opacity:.55}50%{transform:scale(1.04);opacity:1}}
.header-actions{display:flex;gap:22px;align-items:center}.theme-control{display:flex;align-items:center;gap:10px}.theme-control>span{font-size:10px;color:var(--c-muted);min-width:40px}.theme-toggle{position:relative;display:flex;justify-content:space-between;align-items:center;width:58px;height:30px;min-width:58px;padding:0 7px;border:1px solid var(--c-line);border-radius:99px;background:var(--c-selected);color:var(--c-ink);box-shadow:inset 0 1px 4px #00000010;isolation:isolate}.theme-toggle:hover{background:var(--c-selected)}.theme-toggle .sun,.theme-toggle .moon{font-size:14px;position:relative;z-index:2;line-height:1}.toggle-thumb{position:absolute;width:24px;height:24px;left:2px;top:2px;background:var(--c-paper);border:1px solid var(--c-rim);border-radius:50%;box-shadow:0 2px 4px #00000020;transition:transform .34s cubic-bezier(.2,.7,.2,1),background .3s}.theme-toggle[aria-checked=true] .toggle-thumb{transform:translateX(28px)}.theme-toggle .moon{opacity:.45}.theme-toggle[aria-checked=true] .moon{opacity:1;color:var(--c-accent)}.theme-toggle[aria-checked=true] .sun{opacity:.4}.theme-toggle:focus-visible{outline:2px solid var(--c-tone);outline-offset:4px}/* Quiet icon control, separated from the illustration and its caption. */
.lark-art #art-pause{right:0;bottom:0;display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid transparent;border-radius:50%;background:transparent;color:var(--c-muted);opacity:.28;transition:opacity .25s ease,background-color .25s ease,border-color .25s ease}
.lark-art:hover #art-pause{opacity:.48}
.lark-art #art-pause:hover,.lark-art #art-pause:focus-visible{opacity:1;background:var(--c-selected);border-color:var(--c-line)}
#art-pause::before{content:'';display:block;width:8px;height:10px;border-left:2px solid currentColor;border-right:2px solid currentColor;box-sizing:border-box}
#art-pause[data-state=paused]::before{width:9px;height:11px;border:0;background:currentColor;clip-path:polygon(10% 0,100% 50%,10% 100%)}
.lark-art #art-pause:disabled{opacity:.18;cursor:default}
@media(hover:none){.lark-art #art-pause{width:40px;height:40px;opacity:.5}}
@media(prefers-reduced-motion:reduce){.lark-art #art-pause{transition:none}}

/* Theme switch: translucent glass shell and a softly lit sliding lens. */
.theme-toggle{overflow:visible;border-color:var(--c-rim);background:linear-gradient(135deg,var(--c-glass),var(--c-selected));backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);box-shadow:inset 0 1px 0 var(--c-glint),inset 0 -1px 2px var(--c-shadow),0 3px 10px var(--c-shadow);transform:scale(1);transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,border-color .3s ease,background-color .3s ease}
.theme-toggle::before{content:'';position:absolute;inset:1px;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse at 25% 0,var(--c-glint),transparent 65%);opacity:.65;transition:opacity .3s ease}
.theme-toggle .toggle-thumb{background:linear-gradient(145deg,var(--c-glint),var(--c-glass) 55%,var(--c-selected));border-color:var(--c-rim);box-shadow:inset 0 1px 1px var(--c-glint),inset 0 -1px 2px var(--c-glass),0 2px 5px var(--c-shadow);backdrop-filter:blur(8px) saturate(1.4);-webkit-backdrop-filter:blur(8px) saturate(1.4)}
.theme-toggle:hover,.theme-toggle:focus-visible{transform:scale(1.055);background:linear-gradient(135deg,var(--c-glass),var(--c-selected));box-shadow:inset 0 1px 0 var(--c-glint),inset 0 -1px 2px var(--c-shadow),0 5px 16px var(--c-shadow)}
.theme-toggle:hover::before{opacity:1}
.theme-toggle:active{transform:scale(.98);transition-duration:.12s}
@media(prefers-reduced-motion:reduce){.theme-toggle,.theme-toggle::before{transition:none}.theme-toggle:hover,.theme-toggle:focus-visible,.theme-toggle:active{transform:none}}
.stage.reduce .theme-toggle:hover,.stage.reduce .theme-toggle:focus-visible,.stage.reduce .theme-toggle:active{transform:none}

.lark-art{grid-column:2;grid-row:1;align-self:center;background:radial-gradient(ellipse at 54% 50%,var(--c-halo),transparent 65%)}.lark-art svg{height:380px}.art-caption{left:22%;bottom:3%;font-size:11px;letter-spacing:2px;color:var(--muted)}
@media(min-width:701px) and (max-width:1100px){.visitor-fixed-sidebar .hero.shell,.visitor-fixed-sidebar .library.shell,.visitor-fixed-sidebar .footer.shell{margin-left:210px;margin-right:20px}.library .frozen-sidebar{left:20px;width:170px}.hero.shell{padding:22px 12px 26px;gap:18px;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);min-height:350px}.hero h1{font-size:clamp(28px,18cqw,60px)}.hero p{font-size:clamp(11px,3.7cqw,14px)}.hero p br{display:none}.lark-art svg{height:310px}.art-caption{left:6%;font-size:9px;letter-spacing:1px}.case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-filter-heading .toolbar-tools{width:100%}.library-toolbar{flex-wrap:wrap!important}.search{flex:1}.search input{width:100%}}
@media(max-width:700px){.header{height:68px}.visitor-fixed-sidebar .header-inner{padding:0 18px;gap:12px}.header-caption{display:none}.header-actions{gap:16px}.header-actions>a{font-size:10px}.visitor-fixed-sidebar .hero.shell,.visitor-fixed-sidebar .library.shell,.visitor-fixed-sidebar .footer.shell{margin-left:18px;margin-right:18px}.hero.shell{grid-template-columns:1fr;min-height:0;gap:0;padding:24px 8px 12px;margin-top:0}.hero h1{font-size:clamp(42px,18cqw,72px);margin:18px 0 20px}.hero p{font-size:clamp(12px,3.7cqw,15px)}.hero p br{display:none}.lark-art{grid-column:1;grid-row:2}.lark-art svg{height:auto}.art-caption{font-size:9px;bottom:3%;left:15%;letter-spacing:1px}.library.shell{padding-top:8px}.library .frozen-sidebar{position:static;width:100%;height:auto;max-height:none;min-height:0;border:0;padding:0;overflow:visible}.frozen-sidebar #library-heading{display:none}.frozen-sidebar .filter-controls{padding-bottom:0}.filter-head{padding-bottom:12px}.filter-dropdown{margin-bottom:8px}.frozen-sidebar .filter-trigger{min-height:58px;padding:12px 14px}.filter-trigger-copy{flex-direction:row;align-items:center;gap:18px}.filter-selection{font-size:11px}.sidebar-contact{display:none}.brand-filter-bar{margin-top:16px;padding-top:10px;margin-bottom:20px}.brand-filter-heading{gap:10px}.brand-filter-heading .toolbar-tools{width:100%}.search{flex:1}.search input{width:100%}.case-grid{gap:24px 12px;grid-template-columns:repeat(2,minmax(0,1fr))}.card-copy h3{font-size:13px}.card-copy p{font-size:9px;flex-wrap:wrap}.card-actions{gap:6px;flex-wrap:wrap}.card-badge{font-size:8px;left:6px;top:7px}.card-ratio{right:6px;top:7px}.card-duration{font-size:6px;right:6px;bottom:8px}.play-circle{left:7px;bottom:8px;width:25px;height:25px}.card-share{bottom:62px}.detail-layout{grid-template-columns:minmax(0,1fr)}.footer{padding-block:24px}}
@media(prefers-reduced-motion:reduce){.lark-art *{animation:none!important}.brand-tabs button:hover,.brand-tabs button:focus-visible,.card-open:hover .card-image{transform:none}}

@media(max-width:700px){.footer.shell{display:flex;flex-wrap:wrap}.footer .sidebar-contact{display:block;flex-basis:100%;margin:0 0 18px;border:0;padding:0}.footer .contact-actions{margin:0;gap:8px}.sidebar-contact .contact-actions p{font-size:12px}}

.detail-copy .demo-disclosure{background:var(--panel);color:var(--muted);border-color:var(--line)}

/* Sorting: a quiet glass popover, with a single eased entrance. */
.sort-label{position:relative;z-index:2;flex-shrink:0;isolation:isolate}
.sort-trigger{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:38px;min-width:100px;padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:linear-gradient(135deg,var(--c-glass),var(--panel));color:var(--text);font-size:11px;box-shadow:inset 0 1px 0 var(--c-glass);transition:border-color .25s,background .25s,box-shadow .25s}
.sort-trigger:hover,.sort-open .sort-trigger{border-color:var(--c-rim);background:var(--c-selected);box-shadow:inset 0 1px 0 var(--c-glint)}
.sort-chevron{width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.7;transition:transform .32s cubic-bezier(.16,1,.3,1)}
.sort-open .sort-chevron{transform:translateY(1px) rotate(225deg)}
.sort-menu{position:absolute;top:calc(100% + 9px);right:0;z-index:30;min-width:156px;padding:6px;display:grid;gap:3px;border:1px solid var(--c-rim);border-radius:15px;background:var(--panel);background:color-mix(in srgb,var(--panel) 88%,transparent);backdrop-filter:blur(22px) saturate(1.35);-webkit-backdrop-filter:blur(22px) saturate(1.35);box-shadow:inset 0 1px 0 var(--c-glass),0 12px 32px var(--c-shadow);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-6px) scale(.97);transform-origin:top right;transition:opacity .16s ease,transform .2s cubic-bezier(.4,0,.2,1),visibility 0s .2s}
.sort-open .sort-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1);transition:opacity .2s ease,transform .32s cubic-bezier(.16,1,.3,1),visibility 0s}
.sort-option{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:39px;width:100%;padding:10px 12px;border-radius:9px;text-align:left;color:var(--muted);font-size:12px;transition:background .18s,color .18s}
.sort-option:hover,.sort-option:focus-visible{background:var(--c-selected);color:var(--text);outline:none}.sort-option:focus-visible{box-shadow:inset 0 0 0 1px var(--c-rim)}
.sort-option[aria-checked=true]{background:var(--c-selected);color:var(--accent)}.sort-option[aria-checked=true]::after{content:'✓';font-size:12px;margin-left:18px}
.opens-up .sort-menu{top:auto;bottom:calc(100% + 9px);transform-origin:bottom right;transform:translateY(6px) scale(.97)}.opens-up.sort-open .sort-menu{transform:translateY(0) scale(1)}
@media(max-width:700px){.sort-trigger{min-height:40px}.sort-option{min-height:44px}}
@media(prefers-reduced-motion:reduce){.sort-menu,.sort-chevron,.sort-trigger,.sort-option{transition:none}.sort-menu{transform:none}}

/* v1.2.1: animate glass surfaces independently; never resample text with scale(). */
.brand-tabs button,.brand-tabs button:hover,.brand-tabs button:focus-visible{transform:none;box-shadow:none;transition:color .2s}
.brand-tabs button::before{pointer-events:none;transform:scale(1);transform-origin:center;transition:opacity .25s ease,transform .42s cubic-bezier(.16,1,.3,1),box-shadow .3s}
.brand-tabs button:hover::before,.brand-tabs button:focus-visible::before{transform:scale(1.065);box-shadow:inset 0 1px 0 var(--c-glint),0 4px 12px var(--c-shadow)}
.theme-toggle,.theme-toggle:hover,.theme-toggle:focus-visible,.theme-toggle:active{transform:none;background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transition:none}
.theme-toggle::before{inset:-1px;z-index:-1;border:1px solid var(--c-rim);background:radial-gradient(ellipse at 25% 0,var(--c-glint),transparent 65%),linear-gradient(135deg,var(--c-glass),var(--c-selected));backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);box-shadow:inset 0 1px 0 var(--c-glint),0 3px 10px var(--c-shadow);opacity:1;transform:scale(1);transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .3s}
.theme-toggle:hover::before,.theme-toggle:focus-visible::before{transform:scale(1.055);box-shadow:inset 0 1px 0 var(--c-glint),0 5px 16px var(--c-shadow)}
.theme-toggle:active::before{transform:scale(.98);transition-duration:.12s}
.sort-menu,.sort-open .sort-menu,.opens-up .sort-menu,.opens-up.sort-open .sort-menu{transform:none;background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;isolation:isolate}
.sort-menu{transition:opacity .16s ease,visibility 0s .16s}.sort-open .sort-menu{transition:opacity .2s ease,visibility 0s}
.sort-menu::before{content:'';position:absolute;inset:-1px;z-index:-1;pointer-events:none;border:1px solid var(--c-rim);border-radius:inherit;background:var(--panel);background:color-mix(in srgb,var(--panel) 88%,transparent);backdrop-filter:blur(22px) saturate(1.35);-webkit-backdrop-filter:blur(22px) saturate(1.35);box-shadow:inset 0 1px 0 var(--c-glass),0 12px 32px var(--c-shadow);transform:scale(.97);transform-origin:top right;transition:transform .32s cubic-bezier(.16,1,.3,1)}
.opens-up .sort-menu::before{transform-origin:bottom right}.sort-open .sort-menu::before{transform:scale(1)}
@media(prefers-reduced-motion:reduce){.brand-tabs button::before,.theme-toggle::before,.sort-menu::before{transform:none!important;transition:none!important}.sort-menu,.sort-open .sort-menu{transition:none}}

@media(min-width:1101px){.card-actions{gap:6px;flex-wrap:wrap}.card-copy p{flex-wrap:wrap}.card-duration{font-size:7px;letter-spacing:.5px}.card-badge{font-size:8px;left:8px}.card-ratio{right:8px}}